Tidy up the Layers panel with a new bottom bar

This commit is contained in:
Keavon Chambers
2025-05-21 04:14:01 -07:00
parent 66a297df2c
commit 899ed5ad85
23 changed files with 286 additions and 92 deletions
@@ -21,12 +21,13 @@
export let interactive = true;
export let disabled = false;
export let tooltip: string | undefined = undefined;
export let minWidth = 0;
export let maxWidth = 0;
let activeEntry = makeActiveEntry();
let activeEntrySkipWatcher = false;
let initialSelectedIndex: number | undefined = undefined;
let open = false;
let minWidth = 0;
$: watchSelectedIndex(selectedIndex);
$: watchActiveEntry(activeEntry);
@@ -76,11 +77,15 @@
}
</script>
<LayoutRow class="dropdown-input" bind:this={self} data-dropdown-input>
<LayoutRow
class="dropdown-input"
styles={{ ...(minWidth > 0 ? { "min-width": `${minWidth}px` } : {}), ...(maxWidth > 0 ? { "max-width": `${maxWidth}px` } : {}) }}
bind:this={self}
data-dropdown-input
>
<LayoutRow
class="dropdown-box"
classes={{ disabled, open }}
styles={{ "min-width": `${minWidth}px` }}
{tooltip}
on:click={() => !disabled && (open = true)}
on:blur={unFocusDropdownBox}