@vielzeug/refine 1.7.0 → 1.8.0

package/dist/command-palette.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"command-palette.cjs","names":[],"sources":["../src/overlay/command-palette/command-palette.ts"],"sourcesContent":["import { createKeymap } from '@vielzeug/keymap';\nimport { define, html, ref, prop, getHost, onCleanup, onEvent, onMounted, useEmit } from '@vielzeug/ore';\nimport { computed, signal, watch } from '@vielzeug/ripple';\n\nimport type { CommandPaletteItem, OreCommandPaletteEvents, OreCommandPaletteProps } from './command-palette.types';\n\nimport { warn } from '../../_dev';\nimport { announce, lifecycleSignal, createListControl } from '../../headless';\nimport { reducedMotionMixin } from '../../styles';\nimport { useDialogControl } from '../shared/use-dialog';\nimport { buildRows, filterItems, normalizeItem, parseSlottedItems, splitShortcutKeys } from './command-palette-items';\nimport '../../content/icon/icon';\nimport componentStyles from './command-palette.css?inline';\n\nexport type { OreCommandPaletteEvents, OreCommandPaletteProps } from './command-palette.types';\n\n/**\n * A pure data node describing one command. Never rendered directly — `ore-command-palette`\n * reads its attributes/text content and renders the visible row itself.\n *\n * @element ore-command-palette-item\n *\n * @attr {string} value - Value emitted by the `select` event and matched against the search query\n * @attr {string} label - Explicit label text; falls back to the element's text content\n * @attr {string} group - Group heading the item is clustered under\n * @attr {string} shortcut - Display-only keyboard hint rendered at the end of the row, one `<kbd>` per `+`-separated key (e.g. `\"⌘+S\"` renders two keycaps; a literal `+` key isn't representable — spell it out, e.g. `\"Ctrl+Plus\"`)\n * @attr {boolean} disabled - Excludes the item from keyboard navigation and selection\n *\n * @slot icon - Optional leading icon content\n *\n * @example\n * ```html\n * <ore-command-palette-item value=\"new-file\" group=\"File\" shortcut=\"⌘+N\">New File</ore-command-palette-item>\n * ```\n */\nexport const COMMAND_PALETTE_ITEM_TAG = 'ore-command-palette-item' as const;\ndefine(COMMAND_PALETTE_ITEM_TAG, {\n  setup() {\n    return html``;\n  },\n});\n\n/**\n * A searchable, keyboard-driven list of commands presented in a centered modal —\n * the \"⌘K\" pattern popularized by editors and productivity apps. Built on the\n * native `<dialog>` element (focus trap, top-layer stacking, `Escape`-to-close)\n * and `@vielzeug/keymap` for the global shortcut that opens it.\n *\n * @element ore-command-palette\n * @element ore-command-palette-item - Slotted command definition (place in default slot)\n *\n * @attr {boolean} open - Controls the open state of the palette\n * @attr {string} label - Accessible label for the dialog (screen-reader-only heading)\n * @attr {string} placeholder - Placeholder text for the search input\n * @attr {string} shortcut - Global keyboard shortcut (keymap syntax) that toggles the palette. Default `\"mod+k\"`; set to `\"\"` to disable\n * @attr {boolean} no-filter - Disable built-in client-side filtering (for server-driven search)\n * @attr {boolean} loading - Shows a loading row below the search input\n * @attr {string} empty-text - Message shown when no item matches the query\n * @attr {boolean} keep-open-on-select - Keep the palette open after an item is selected\n *\n * @fires open - Fired when the palette opens. detail: `{ reason }`\n * @fires close - Fired when the palette closes. detail: `{ reason }`\n * @fires search - Fired on every keystroke in the search input. detail: `{ query }`\n * @fires select - Fired when a command is chosen (click or `Enter`). detail: `{ value, label, item }`\n *\n * @slot - `<ore-command-palette-item>` elements (alternative/supplement to the `items` prop)\n *\n * @cssprop --command-palette-bg - Panel background color\n * @cssprop --command-palette-border-color - Panel border color\n * @cssprop --command-palette-radius - Panel border radius\n * @cssprop --command-palette-shadow - Panel drop shadow\n * @cssprop --command-palette-max-width - Maximum panel width\n * @cssprop --command-palette-backdrop - Backdrop overlay color\n * @cssprop --command-palette-option-hover-bg - Item background on hover\n * @cssprop --command-palette-option-focus-bg - Item background when keyboard-focused\n *\n * @part dialog - Dialog root container\n * @part panel - Panel container\n * @part input - Search input\n * @part listbox - Listbox of matching commands\n *\n * @example\n * ```html\n * <ore-command-palette label=\"Command palette\" placeholder=\"Type a command…\">\n *   <ore-command-palette-item value=\"new-file\" group=\"File\" shortcut=\"⌘+N\">New File</ore-command-palette-item>\n *   <ore-command-palette-item value=\"open-file\" group=\"File\" shortcut=\"⌘+O\">Open File…</ore-command-palette-item>\n *   <ore-command-palette-item value=\"toggle-theme\" group=\"View\">Toggle Theme</ore-command-palette-item>\n * </ore-command-palette>\n * ```\n */\nexport const COMMAND_PALETTE_TAG = 'ore-command-palette' as const;\ndefine<OreCommandPaletteProps>(COMMAND_PALETTE_TAG, {\n  props: {\n    'empty-text': prop.string('No results found.'),\n    items: prop.data<OreCommandPaletteProps['items']>(),\n    'keep-open-on-select': prop.bool(false),\n    label: prop.string('Command palette'),\n    loading: prop.bool(false),\n    'no-filter': prop.bool(false),\n    open: prop.bool(false),\n    placeholder: prop.string('Type a command or search…'),\n    shortcut: prop.string('mod+k'),\n  },\n  setup(props) {\n    const el = getHost();\n    const emit = useEmit<OreCommandPaletteEvents>();\n    const abortSignal = lifecycleSignal(onCleanup);\n\n    const dialogRef = ref<HTMLDialogElement>();\n    const searchInputRef = ref<HTMLInputElement>();\n    const listboxId = 'cmdk-listbox';\n\n    let listboxEl: HTMLElement | null = null;\n\n    const query = signal('');\n\n    // ── Items: slotted <ore-command-palette-item> elements, merged with the `items` prop ──\n    // Items are pure data nodes (see `ore-command-palette-item`'s own doc comment) — they're\n    // never projected through a `<slot>`, just read directly off the host's light DOM. That\n    // sidesteps `useSlots()`/`slotchange` entirely: a plain MutationObserver on the host\n    // already covers everything `slotchange` would (an item added or removed) *and* the case\n    // it can't — an already-assigned item's own text/attributes changing. For items written\n    // as static, inline HTML, the browser's parser can insert the last item before appending\n    // its text-node child; without watching `characterData`, that would permanently cache an\n    // empty label, since nothing else re-triggers once the element itself stops changing.\n    const slottedItems = signal<CommandPaletteItem[]>([]);\n\n    const reparseSlottedItems = (): void => {\n      slottedItems.value = parseSlottedItems([...el.children]);\n    };\n\n    reparseSlottedItems();\n\n    const lightDomObserver = new MutationObserver(reparseSlottedItems);\n\n    lightDomObserver.observe(el, { characterData: true, childList: true, subtree: true });\n    onCleanup(() => lightDomObserver.disconnect());\n\n    const allItems = computed<CommandPaletteItem[]>(() => {\n      const explicit = props.items.value;\n\n      return Array.isArray(explicit) ? explicit.map(normalizeItem) : slottedItems.value;\n    });\n\n    const filteredItems = computed(() => filterItems(allItems.value, query.value, Boolean(props['no-filter'].value)));\n    const rows = computed(() => buildRows(filteredItems.value));\n\n    // ── Keyboard navigation over the filtered list (Up/Down/Home/End) ──\n    const scrollFocusedIntoView = (): void => {\n      listboxEl?.querySelector<HTMLElement>('[data-focused]')?.scrollIntoView({ block: 'nearest' });\n    };\n\n    const list = createListControl<CommandPaletteItem>({\n      getItems: () => filteredItems.value,\n      isItemDisabled: (item) => item.disabled,\n      onNavigate: scrollFocusedIntoView,\n      signal: abortSignal,\n    });\n    const { focusedIndex } = list;\n\n    // ── Dialog chrome: native <dialog>, focus trap, Escape, backdrop click ──\n    const resetSearch = (): void => {\n      query.value = '';\n      list.reset();\n    };\n\n    const { closeWithAnimation, overlay, requestClose, setupNativeListeners } = useDialogControl({\n      dialogRef,\n      getPanelEl: () => dialogRef.value?.querySelector<HTMLElement>('.panel'),\n      host: el,\n      initialFocus: computed(() => '.search-input'),\n      isPersistent: () => false,\n      onCleanup,\n      onEvent,\n      onNativeClose: (reason) => {\n        emit('close', { reason });\n        resetSearch();\n      },\n      onOpen: (reason) => {\n        emit('open', { reason });\n        list.navigate('first');\n      },\n      openProp: props.open,\n      performClose: () => closeWithAnimation(),\n      returnFocus: computed(() => true),\n    });\n\n    // ── Global keyboard shortcut (opens/closes the palette from anywhere) ──\n    const globalKeymap = createKeymap();\n\n    globalKeymap.mount(window);\n    onCleanup(() => globalKeymap.dispose());\n\n    let unbindShortcut: (() => void) | null = null;\n\n    watch(\n      props.shortcut,\n      (shortcutStr) => {\n        unbindShortcut?.();\n        unbindShortcut = null;\n\n        const trimmed = (shortcutStr ?? '').trim();\n\n        if (!trimmed) return;\n\n        try {\n          unbindShortcut = globalKeymap.bind(trimmed, () => {\n            overlay.toggle('keyboard', 'trigger');\n          });\n        } catch (error) {\n          warn(`invalid \"shortcut\" value \"${trimmed}\" — ${error instanceof Error ? error.message : String(error)}`);\n        }\n      },\n      { immediate: true },\n    );\n\n    onMounted(() => {\n      setupNativeListeners();\n    });\n\n    // ── Selection ────────────────────────────────────────────────────────────\n    function selectItem(item: CommandPaletteItem): void {\n      if (item.disabled) return;\n\n      emit('select', { item, label: item.label, value: item.value });\n\n      if (props['keep-open-on-select'].value) {\n        searchInputRef.value?.focus();\n      } else {\n        requestClose('trigger');\n      }\n    }\n\n    function handleInput(e: Event): void {\n      const value = (e.target as HTMLInputElement).value;\n\n      query.value = value;\n      list.navigate('first');\n      emit('search', { query: value });\n\n      const count = filteredItems.value.length;\n\n      announce(count === 0 ? props['empty-text'].value! : `${count} result${count === 1 ? '' : 's'} found`);\n    }\n\n    function handleKeydown(e: KeyboardEvent): void {\n      if (list.handleKeydown(e)) return;\n\n      if (e.key === 'Enter') {\n        // `list.navigate('first')` (called on open and on every keystroke) already keeps\n        // the focused row off a disabled item, so this fallback is only ever reached when\n        // nothing has been focused yet — but it mirrors `selectItem`'s own disabled guard\n        // rather than blindly grabbing index 0, in case that navigate-on-open wiring ever\n        // changes.\n        const active = list.getActiveItem() ?? filteredItems.value.find((item) => !item.disabled);\n\n        if (active) {\n          e.preventDefault();\n          selectItem(active);\n        }\n      }\n    }\n\n    return html`\n      <dialog ref=\"${dialogRef}\" class=\"dialog\" part=\"dialog\" aria-label=\"${props.label}\" aria-modal=\"true\">\n        <div class=\"panel\" part=\"panel\">\n          <div class=\"search\" part=\"search\">\n            <span class=\"search-icon\" aria-hidden=\"true\"><ore-icon name=\"search\" size=\"18\"></ore-icon></span>\n            <input\n              ref=\"${searchInputRef}\"\n              class=\"search-input\"\n              part=\"input\"\n              type=\"text\"\n              role=\"combobox\"\n              autocomplete=\"off\"\n              spellcheck=\"false\"\n              aria-expanded=\"true\"\n              aria-autocomplete=\"list\"\n              aria-controls=\"${listboxId}\"\n              aria-activedescendant=\"${() => (focusedIndex.value >= 0 ? `${listboxId}-opt-${focusedIndex.value}` : '')}\"\n              placeholder=\"${props.placeholder}\"\n              value=\"${query}\"\n              @input=\"${handleInput}\"\n              @keydown=\"${handleKeydown}\" />\n            <span class=\"search-loader\" ?hidden=\"${() => !props.loading.value}\" aria-hidden=\"true\"></span>\n          </div>\n          <div\n            class=\"listbox\"\n            part=\"listbox\"\n            role=\"listbox\"\n            id=\"${listboxId}\"\n            aria-label=\"Commands\"\n            ref=\"${(listEl: HTMLElement) => {\n              listboxEl = listEl;\n            }}\">\n            <div class=\"empty\" role=\"presentation\" ?hidden=\"${() => props.loading.value || rows.value.length > 0}\">\n              ${() => props['empty-text'].value}\n            </div>\n            ${() =>\n              rows.value.map((row) =>\n                row.type === 'group'\n                  ? html`<div class=\"group-heading\" role=\"presentation\">${row.group}</div>`\n                  : html`<div\n                      class=\"item\"\n                      part=\"item\"\n                      role=\"option\"\n                      id=\"${`${listboxId}-opt-${row.idx}`}\"\n                      aria-selected=\"${() => String(focusedIndex.value === row.idx)}\"\n                      aria-disabled=\"${() => String(row.item.disabled)}\"\n                      ?data-focused=\"${() => focusedIndex.value === row.idx}\"\n                      ?data-disabled=\"${() => row.item.disabled}\"\n                      @click=\"${(e: MouseEvent) => {\n                        e.stopPropagation();\n                        selectItem(row.item);\n                      }}\"\n                      @pointerenter=\"${() => {\n                        list.set(row.idx);\n                      }}\">\n                      ${\n                        row.item.icon\n                          ? html`<span class=\"item-icon\" aria-hidden=\"true\"\n                              ><ore-icon name=\"${row.item.icon}\" size=\"16\"></ore-icon\n                            ></span>`\n                          : ''\n                      }\n                      <span class=\"item-label\">${row.item.label}</span>\n                      ${\n                        row.item.shortcut\n                          ? html`<span class=\"item-shortcut\"\n                              >${splitShortcutKeys(row.item.shortcut).map((key) => html`<kbd>${key}</kbd>`)}</span\n                            >`\n                          : ''\n                      }\n                    </div>`,\n              )}\n          </div>\n          <div class=\"footer\" part=\"footer\">\n            <span class=\"footer-hint\"><kbd>↑</kbd><kbd>↓</kbd> Navigate</span>\n            <span class=\"footer-hint\"><kbd>Enter</kbd> Select</span>\n            <span class=\"footer-hint\"><kbd>Esc</kbd> Close</span>\n          </div>\n        </div>\n      </dialog>\n    `;\n  },\n  styles: [reducedMotionMixin, componentStyles],\n});\n"],"mappings":"mjBAmCA,IAAa,EAA2B,wCACjC,EAA0B,CAC/B,OAAQ,CACN,MAAO,GAAA,IAAI,EACb,CACF,CAAC,EAkDD,IAAa,EAAsB,mCACJ,EAAqB,CAClD,MAAO,CACL,aAAc,EAAA,KAAK,OAAO,mBAAmB,EAC7C,MAAO,EAAA,KAAK,KAAsC,EAClD,sBAAuB,EAAA,KAAK,KAAK,EAAK,EACtC,MAAO,EAAA,KAAK,OAAO,iBAAiB,EACpC,QAAS,EAAA,KAAK,KAAK,EAAK,EACxB,YAAa,EAAA,KAAK,KAAK,EAAK,EAC5B,KAAM,EAAA,KAAK,KAAK,EAAK,EACrB,YAAa,EAAA,KAAK,OAAO,2BAA2B,EACpD,SAAU,EAAA,KAAK,OAAO,OAAO,CAC/B,EACA,MAAM,EAAO,CACX,IAAM,GAAA,EAAA,EAAA,QAAA,CAAa,EACb,GAAA,EAAA,EAAA,QAAA,CAAwC,EACxC,EAAc,EAAA,gBAAgB,EAAA,SAAS,EAEvC,GAAA,EAAA,EAAA,IAAA,CAAmC,EACnC,GAAA,EAAA,EAAA,IAAA,CAAuC,EACvC,EAAY,eAEd,EAAgC,KAE9B,GAAA,EAAA,EAAA,OAAA,CAAe,EAAE,EAWjB,GAAA,EAAA,EAAA,OAAA,CAA4C,CAAC,CAAC,EAE9C,MAAkC,CACtC,EAAa,MAAQ,EAAA,kBAAkB,CAAC,GAAG,EAAG,QAAQ,CAAC,CACzD,EAEA,EAAoB,EAEpB,IAAM,EAAmB,IAAI,iBAAiB,CAAmB,EAEjE,EAAiB,QAAQ,EAAI,CAAE,cAAe,GAAM,UAAW,GAAM,QAAS,EAAK,CAAC,GACpF,EAAA,EAAA,UAAA,KAAgB,EAAiB,WAAW,CAAC,EAE7C,IAAM,GAAA,EAAA,EAAA,SAAA,KAAgD,CACpD,IAAM,EAAW,EAAM,MAAM,MAE7B,OAAO,MAAM,QAAQ,CAAQ,EAAI,EAAS,IAAI,EAAA,aAAa,EAAI,EAAa,KAC9E,CAAC,EAEK,GAAA,EAAA,EAAA,SAAA,KAA+B,EAAA,YAAY,EAAS,MAAO,EAAM,MAAO,EAAQ,EAAM,YAAY,CAAC,KAAM,CAAC,EAC1G,GAAA,EAAA,EAAA,SAAA,KAAsB,EAAA,UAAU,EAAc,KAAK,CAAC,EAOpD,EAAO,EAAA,kBAAsC,CACjD,aAAgB,EAAc,MAC9B,eAAiB,GAAS,EAAK,SAC/B,eAPwC,CACxC,GAAW,cAA2B,gBAAgB,CAAC,EAAE,eAAe,CAAE,MAAO,SAAU,CAAC,CAC9F,EAME,OAAQ,CACV,CAAC,EACK,CAAE,gBAAiB,EAGnB,MAA0B,CAC9B,EAAM,MAAQ,GACd,EAAK,MAAM,CACb,EAEM,CAAE,qBAAoB,UAAS,eAAc,wBAAyB,EAAA,iBAAiB,CAC3F,YACA,eAAkB,EAAU,OAAO,cAA2B,QAAQ,EACtE,KAAM,EACN,cAAA,EAAA,EAAA,SAAA,KAA6B,eAAe,EAC5C,iBAAoB,GACpB,UAAA,EAAA,UACA,QAAA,EAAA,QACA,cAAgB,GAAW,CACzB,EAAK,QAAS,CAAE,QAAO,CAAC,EACxB,EAAY,CACd,EACA,OAAS,GAAW,CAClB,EAAK,OAAQ,CAAE,QAAO,CAAC,EACvB,EAAK,SAAS,OAAO,CACvB,EACA,SAAU,EAAM,KAChB,iBAAoB,EAAmB,EACvC,aAAA,EAAA,EAAA,SAAA,KAA4B,EAAI,CAClC,CAAC,EAGK,EAAe,EAAA,aAAa,EAElC,EAAa,MAAM,MAAM,GACzB,EAAA,EAAA,UAAA,KAAgB,EAAa,QAAQ,CAAC,EAEtC,IAAI,EAAsC,MAE1C,EAAA,EAAA,MAAA,CACE,EAAM,SACL,GAAgB,CACf,IAAiB,EACjB,EAAiB,KAEjB,IAAM,GAAW,GAAe,GAAA,CAAI,KAAK,EAEpC,KAEL,GAAI,CACF,EAAiB,EAAa,KAAK,MAAe,CAChD,EAAQ,OAAO,WAAY,SAAS,CACtC,CAAC,CACH,OAAS,EAAO,CACd,EAAA,KAAK,6BAA6B,EAAQ,MAAM,aAAiB,MAAQ,EAAM,QAAU,OAAO,CAAK,GAAG,CAC1G,CACF,EACA,CAAE,UAAW,EAAK,CACpB,GAEA,EAAA,EAAA,UAAA,KAAgB,CACd,EAAqB,CACvB,CAAC,EAGD,SAAS,EAAW,EAAgC,CAC9C,EAAK,WAET,EAAK,SAAU,CAAE,OAAM,MAAO,EAAK,MAAO,MAAO,EAAK,KAAM,CAAC,EAEzD,EAAM,sBAAsB,CAAC,MAC/B,EAAe,OAAO,MAAM,EAE5B,EAAa,SAAS,EAE1B,CAEA,SAAS,EAAY,EAAgB,CACnC,IAAM,EAAS,EAAE,OAA4B,MAE7C,EAAM,MAAQ,EACd,EAAK,SAAS,OAAO,EACrB,EAAK,SAAU,CAAE,MAAO,CAAM,CAAC,EAE/B,IAAM,EAAQ,EAAc,MAAM,OAElC,EAAA,SAAS,IAAU,EAAI,EAAM,aAAa,CAAC,MAAS,GAAG,EAAM,SAAS,IAAU,EAAI,GAAK,IAAI,OAAO,CACtG,CAEA,SAAS,EAAc,EAAwB,CACzC,MAAK,cAAc,CAAC,GAEpB,EAAE,MAAQ,QAAS,CAMrB,IAAM,EAAS,EAAK,cAAc,GAAK,EAAc,MAAM,KAAM,GAAS,CAAC,EAAK,QAAQ,EAEpF,IACF,EAAE,eAAe,EACjB,EAAW,CAAM,EAErB,CACF,CAEA,MAAO,GAAA,IAAI;qBACM,EAAU,6CAA6C,EAAM,MAAM;;;;;qBAKnE,EAAe;;;;;;;;;+BASL,EAAU;2CACK,EAAa,OAAS,EAAI,GAAG,EAAU,OAAO,EAAa,QAAU,GAAI;6BAC1F,EAAM,YAAY;uBACxB,EAAM;wBACL,EAAY;0BACV,EAAc;uDACiB,CAAC,EAAM,QAAQ,MAAM;;;;;;kBAM5D,EAAU;;mBAER,GAAwB,CAC9B,EAAY,CACd,EAAE;kEACsD,EAAM,QAAQ,OAAS,EAAK,MAAM,OAAS,EAAE;oBAC3F,EAAM,aAAa,CAAC,MAAM;;kBAGlC,EAAK,MAAM,IAAK,GACd,EAAI,OAAS,QACT,EAAA,IAAI,kDAAkD,EAAI,MAAM,QAChE,EAAA,IAAI;;;;4BAII,GAAG,EAAU,OAAO,EAAI,MAAM;2CACb,OAAO,EAAa,QAAU,EAAI,GAAG,EAAE;2CACvC,OAAO,EAAI,KAAK,QAAQ,EAAE;2CAC1B,EAAa,QAAU,EAAI,IAAI;4CAC9B,EAAI,KAAK,SAAS;gCAC/B,GAAkB,CAC3B,EAAE,gBAAgB,EAClB,EAAW,EAAI,IAAI,CACrB,EAAE;2CACqB,CACrB,EAAK,IAAI,EAAI,GAAG,CAClB,EAAE;wBAEA,EAAI,KAAK,KACL,EAAA,IAAI;iDACiB,EAAI,KAAK,KAAK;sCAEnC,GACL;iDAC0B,EAAI,KAAK,MAAM;wBAExC,EAAI,KAAK,SACL,EAAA,IAAI;iCACC,EAAA,kBAAkB,EAAI,KAAK,QAAQ,CAAC,CAAC,IAAK,GAAQ,EAAA,IAAI,QAAQ,EAAI,OAAO,EAAE;+BAEhF,GACL;2BAET,EAAE;;;;;;;;;KAUd,EACA,OAAQ,CAAC,EAAA,mBAAoB,EAAA,OAAe,CAC9C,CAAC"}
+{"version":3,"file":"command-palette.cjs","names":[],"sources":["../src/overlay/command-palette/command-palette.ts"],"sourcesContent":["import { createKeymap } from '@vielzeug/keymap';\nimport { define, html, ref, prop, getHost, onCleanup, onEvent, onMounted, useEmit } from '@vielzeug/ore';\nimport { computed, signal, watch } from '@vielzeug/ripple';\n\nimport type { CommandPaletteItem, OreCommandPaletteEvents, OreCommandPaletteProps } from './command-palette.types';\n\nimport { warn } from '../../_dev';\nimport { announce, lifecycleSignal, createListControl } from '../../headless';\nimport { reducedMotionMixin } from '../../styles';\nimport { useDialogControl } from '../shared/use-dialog';\nimport { buildRows, filterItems, normalizeItem, parseSlottedItems, splitShortcutKeys } from './command-palette-items';\nimport '../../content/icon/icon';\nimport componentStyles from './command-palette.css?inline';\n\nexport type { OreCommandPaletteEvents, OreCommandPaletteProps } from './command-palette.types';\n\n/**\n * A pure data node describing one command. Never rendered directly — `ore-command-palette`\n * reads its attributes/text content and renders the visible row itself.\n *\n * @element ore-command-palette-item\n *\n * @attr {string} value - Value emitted by the `select` event and matched against the search query\n * @attr {string} label - Explicit label text; falls back to the element's text content\n * @attr {string} group - Group heading the item is clustered under\n * @attr {string} shortcut - Display-only keyboard hint rendered at the end of the row, one `<kbd>` per `+`-separated key (e.g. `\"⌘+S\"` renders two keycaps; a literal `+` key isn't representable — spell it out, e.g. `\"Ctrl+Plus\"`)\n * @attr {boolean} disabled - Excludes the item from keyboard navigation and selection\n *\n * @slot icon - Optional leading icon content\n *\n * @example\n * ```html\n * <ore-command-palette-item value=\"new-file\" group=\"File\" shortcut=\"⌘+N\">New File</ore-command-palette-item>\n * ```\n */\nexport const COMMAND_PALETTE_ITEM_TAG = 'ore-command-palette-item' as const;\ndefine(COMMAND_PALETTE_ITEM_TAG, {\n  setup() {\n    return html``;\n  },\n});\n\n/**\n * A searchable, keyboard-driven list of commands presented in a centered modal —\n * the \"⌘K\" pattern popularized by editors and productivity apps. Built on the\n * native `<dialog>` element (focus trap, top-layer stacking, `Escape`-to-close)\n * and `@vielzeug/keymap` for the global shortcut that opens it.\n *\n * @element ore-command-palette\n * @element ore-command-palette-item - Slotted command definition (place in default slot)\n *\n * @attr {boolean} open - Controls the open state of the palette\n * @attr {string} label - Accessible label for the dialog (screen-reader-only heading)\n * @attr {string} placeholder - Placeholder text for the search input\n * @attr {string} shortcut - Global keyboard shortcut (keymap syntax) that toggles the palette. Default `\"mod+k\"`; set to `\"\"` to disable\n * @attr {boolean} no-filter - Disable built-in client-side filtering (for server-driven search)\n * @attr {boolean} loading - Shows a loading row below the search input\n * @attr {string} empty-text - Message shown when no item matches the query\n * @attr {boolean} keep-open-on-select - Keep the palette open after an item is selected\n *\n * @fires open - Fired when the palette opens. detail: `{ reason }`\n * @fires close - Fired when the palette closes. detail: `{ reason }`\n * @fires search - Fired on every keystroke in the search input. detail: `{ query }`\n * @fires select - Fired when a command is chosen (click or `Enter`). detail: `{ value, label, item }`\n *\n * @slot - `<ore-command-palette-item>` elements (alternative/supplement to the `items` prop)\n *\n * @cssprop --command-palette-bg - Panel background color\n * @cssprop --command-palette-border-color - Panel border color\n * @cssprop --command-palette-radius - Panel border radius\n * @cssprop --command-palette-shadow - Panel drop shadow\n * @cssprop --command-palette-max-width - Maximum panel width\n * @cssprop --command-palette-backdrop - Backdrop overlay color\n * @cssprop --command-palette-option-hover-bg - Item background on hover\n * @cssprop --command-palette-option-focus-bg - Item background when keyboard-focused\n *\n * @part dialog - Dialog root container\n * @part panel - Panel container\n * @part input - Search input\n * @part listbox - Listbox of matching commands\n *\n * @example\n * ```html\n * <ore-command-palette label=\"Command palette\" placeholder=\"Type a command…\">\n *   <ore-command-palette-item value=\"new-file\" group=\"File\" shortcut=\"⌘+N\">New File</ore-command-palette-item>\n *   <ore-command-palette-item value=\"open-file\" group=\"File\" shortcut=\"⌘+O\">Open File…</ore-command-palette-item>\n *   <ore-command-palette-item value=\"toggle-theme\" group=\"View\">Toggle Theme</ore-command-palette-item>\n * </ore-command-palette>\n * ```\n */\nexport const COMMAND_PALETTE_TAG = 'ore-command-palette' as const;\ndefine<OreCommandPaletteProps>(COMMAND_PALETTE_TAG, {\n  props: {\n    'empty-text': prop.string('No results found.'),\n    items: prop.data<OreCommandPaletteProps['items']>(),\n    'keep-open-on-select': prop.bool(false),\n    label: prop.string('Command palette'),\n    loading: prop.bool(false),\n    'no-filter': prop.bool(false),\n    open: prop.bool(false),\n    placeholder: prop.string('Type a command or search…'),\n    shortcut: prop.string('mod+k'),\n  },\n  setup(props) {\n    const el = getHost();\n    const emit = useEmit<OreCommandPaletteEvents>();\n    const abortSignal = lifecycleSignal(onCleanup);\n\n    const dialogRef = ref<HTMLDialogElement>();\n    const searchInputRef = ref<HTMLInputElement>();\n    const listboxId = 'cmdk-listbox';\n\n    let listboxEl: HTMLElement | null = null;\n\n    const query = signal('');\n\n    // ── Items: slotted <ore-command-palette-item> elements, merged with the `items` prop ──\n    // Items are pure data nodes (see `ore-command-palette-item`'s own doc comment) — they're\n    // never projected through a `<slot>`, just read directly off the host's light DOM. That\n    // sidesteps `useSlots()`/`slotchange` entirely: a plain MutationObserver on the host\n    // already covers everything `slotchange` would (an item added or removed) *and* the case\n    // it can't — an already-assigned item's own text/attributes changing. For items written\n    // as static, inline HTML, the browser's parser can insert the last item before appending\n    // its text-node child; without watching `characterData`, that would permanently cache an\n    // empty label, since nothing else re-triggers once the element itself stops changing.\n    const slottedItems = signal<CommandPaletteItem[]>([]);\n\n    const reparseSlottedItems = (): void => {\n      slottedItems.value = parseSlottedItems([...el.children]);\n    };\n\n    reparseSlottedItems();\n\n    const lightDomObserver = new MutationObserver(reparseSlottedItems);\n\n    lightDomObserver.observe(el, { characterData: true, childList: true, subtree: true });\n    onCleanup(() => lightDomObserver.disconnect());\n\n    const allItems = computed<CommandPaletteItem[]>(() => {\n      const explicit = props.items.value;\n\n      return Array.isArray(explicit) ? explicit.map(normalizeItem) : slottedItems.value;\n    });\n\n    const filteredItems = computed(() => filterItems(allItems.value, query.value, Boolean(props['no-filter'].value)));\n    const rows = computed(() => buildRows(filteredItems.value));\n\n    // ── Keyboard navigation over the filtered list (Up/Down/Home/End) ──\n    const scrollFocusedIntoView = (): void => {\n      listboxEl?.querySelector<HTMLElement>('[data-focused]')?.scrollIntoView({ block: 'nearest' });\n    };\n\n    const list = createListControl<CommandPaletteItem>({\n      getItems: () => filteredItems.value,\n      isItemDisabled: (item) => item.disabled,\n      onNavigate: scrollFocusedIntoView,\n      signal: abortSignal,\n    });\n    const { focusedIndex } = list;\n\n    // ── Dialog chrome: native <dialog>, focus trap, Escape, backdrop click ──\n    const resetSearch = (): void => {\n      query.value = '';\n      list.reset();\n    };\n\n    const { closeWithAnimation, overlay, requestClose, setupNativeListeners } = useDialogControl({\n      dialogRef,\n      getPanelEl: () => dialogRef.value?.querySelector<HTMLElement>('.panel'),\n      host: el,\n      initialFocus: computed(() => '.search-input'),\n      isPersistent: () => false,\n      onCleanup,\n      onEvent,\n      onNativeClose: (reason) => {\n        emit('close', { reason });\n        resetSearch();\n      },\n      onOpen: (reason) => {\n        emit('open', { reason });\n        list.navigate('first');\n      },\n      openProp: props.open,\n      performClose: () => closeWithAnimation(),\n      returnFocus: computed(() => true),\n    });\n\n    // ── Global keyboard shortcut (opens/closes the palette from anywhere) ──\n    const globalKeymap = createKeymap();\n\n    globalKeymap.mount(window);\n    onCleanup(() => globalKeymap.dispose());\n\n    let unbindShortcut: (() => void) | null = null;\n\n    watch(\n      props.shortcut,\n      (shortcutStr) => {\n        unbindShortcut?.();\n        unbindShortcut = null;\n\n        const trimmed = (shortcutStr ?? '').trim();\n\n        if (!trimmed) return;\n\n        try {\n          unbindShortcut = globalKeymap.bind(trimmed, () => {\n            overlay.toggle('keyboard', 'trigger');\n          });\n        } catch (error) {\n          warn(`invalid \"shortcut\" value \"${trimmed}\" — ${error instanceof Error ? error.message : String(error)}`);\n        }\n      },\n      { immediate: true },\n    );\n\n    onMounted(() => {\n      setupNativeListeners();\n    });\n\n    // ── Selection ────────────────────────────────────────────────────────────\n    function selectItem(item: CommandPaletteItem): void {\n      if (item.disabled) return;\n\n      emit('select', { item, label: item.label, value: item.value });\n\n      if (props['keep-open-on-select'].value) {\n        searchInputRef.value?.focus();\n      } else {\n        requestClose('trigger');\n      }\n    }\n\n    function handleInput(e: Event): void {\n      const value = (e.target as HTMLInputElement).value;\n\n      query.value = value;\n      list.navigate('first');\n      emit('search', { query: value });\n\n      const count = filteredItems.value.length;\n\n      announce(count === 0 ? props['empty-text'].value! : `${count} result${count === 1 ? '' : 's'} found`);\n    }\n\n    function handleKeydown(e: KeyboardEvent): void {\n      if (list.handleKeydown(e)) return;\n\n      if (e.key === 'Enter') {\n        // `list.navigate('first')` (called on open and on every keystroke) already keeps\n        // the focused row off a disabled item, so this fallback is only ever reached when\n        // nothing has been focused yet — but it mirrors `selectItem`'s own disabled guard\n        // rather than blindly grabbing index 0, in case that navigate-on-open wiring ever\n        // changes.\n        const active = list.getActiveItem() ?? filteredItems.value.find((item) => !item.disabled);\n\n        if (active) {\n          e.preventDefault();\n          selectItem(active);\n        }\n      }\n    }\n\n    return html`\n      <dialog ref=\"${dialogRef}\" class=\"dialog\" part=\"dialog\" aria-label=\"${props.label}\" aria-modal=\"true\">\n        <div class=\"panel\" part=\"panel\">\n          <div class=\"search\" part=\"search\">\n            <span class=\"search-icon\" aria-hidden=\"true\"><ore-icon name=\"search\" size=\"18\"></ore-icon></span>\n            <input\n              ref=\"${searchInputRef}\"\n              class=\"search-input\"\n              part=\"input\"\n              type=\"text\"\n              role=\"combobox\"\n              autocomplete=\"off\"\n              spellcheck=\"false\"\n              aria-expanded=\"true\"\n              aria-autocomplete=\"list\"\n              aria-controls=\"${listboxId}\"\n              aria-activedescendant=\"${() => (focusedIndex.value >= 0 ? `${listboxId}-opt-${focusedIndex.value}` : '')}\"\n              placeholder=\"${props.placeholder}\"\n              value=\"${query}\"\n              @input=\"${handleInput}\"\n              @keydown=\"${handleKeydown}\" />\n            <span class=\"search-loader\" ?hidden=\"${() => !props.loading.value}\" aria-hidden=\"true\"></span>\n          </div>\n          <div\n            class=\"listbox\"\n            part=\"listbox\"\n            role=\"listbox\"\n            id=\"${listboxId}\"\n            aria-label=\"Commands\"\n            ref=\"${(listEl: HTMLElement) => {\n              listboxEl = listEl;\n            }}\">\n            <div class=\"empty\" role=\"presentation\" ?hidden=\"${() => props.loading.value || rows.value.length > 0}\">\n              ${() => props['empty-text'].value}\n            </div>\n            ${() =>\n              rows.value.map((row) =>\n                row.type === 'group'\n                  ? html`<div class=\"group-heading\" role=\"presentation\">${row.group}</div>`\n                  : html`<div\n                      class=\"item\"\n                      part=\"item\"\n                      role=\"option\"\n                      id=\"${`${listboxId}-opt-${row.idx}`}\"\n                      aria-selected=\"${() => String(focusedIndex.value === row.idx)}\"\n                      aria-disabled=\"${() => String(row.item.disabled)}\"\n                      ?data-focused=\"${() => focusedIndex.value === row.idx}\"\n                      ?data-disabled=\"${() => row.item.disabled}\"\n                      @click=\"${(e: MouseEvent) => {\n                        e.stopPropagation();\n                        selectItem(row.item);\n                      }}\"\n                      @pointerenter=\"${() => {\n                        list.set(row.idx);\n                      }}\">\n                      ${\n                        row.item.icon\n                          ? html`<span class=\"item-icon\" aria-hidden=\"true\"\n                              ><ore-icon name=\"${row.item.icon}\" size=\"16\"></ore-icon\n                            ></span>`\n                          : ''\n                      }\n                      <span class=\"item-label\">${row.item.label}</span>\n                      ${\n                        row.item.shortcut\n                          ? html`<span class=\"item-shortcut\"\n                              >${splitShortcutKeys(row.item.shortcut).map((key) => html`<kbd>${key}</kbd>`)}</span\n                            >`\n                          : ''\n                      }\n                    </div>`,\n              )}\n          </div>\n          <div class=\"footer\" part=\"footer\">\n            <span class=\"footer-hint\"><kbd>↑</kbd><kbd>↓</kbd> Navigate</span>\n            <span class=\"footer-hint\"><kbd>Enter</kbd> Select</span>\n            <span class=\"footer-hint\"><kbd>Esc</kbd> Close</span>\n          </div>\n        </div>\n      </dialog>\n    `;\n  },\n  styles: [reducedMotionMixin, componentStyles],\n});\n"],"mappings":"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"}

package/dist/command-palette.js

@@ -3,75 +3,74 @@ import { warn as t } from "./_dev.js";
 import { lifecycleSignal as n } from "./headless/ore.js";
 import { createListControl as r } from "./headless/nav.js";
 import { announce as i } from "./headless/announcer.js";
-import { createKeymap as a } from "./keymap/dist/keymap.js";
-import "./keymap/dist/index.js";
-import { useDialogControl as o } from "./overlay/shared/use-dialog.js";
-import { buildRows as s, filterItems as c, normalizeItem as l, parseSlottedItems as u, splitShortcutKeys as d } from "./overlay/command-palette/command-palette-items.js";
-import f from "./overlay/command-palette/command-palette.css.js";
-import { define as p, getHost as m, html as h, onCleanup as g, onEvent as _, onMounted as v, prop as y, ref as b, useEmit as x } from "@vielzeug/ore";
-import { computed as S, signal as C, watch as w } from "@vielzeug/ripple";
+import { useDialogControl as a } from "./overlay/shared/use-dialog.js";
+import { buildRows as o, filterItems as s, normalizeItem as c, parseSlottedItems as l, splitShortcutKeys as u } from "./overlay/command-palette/command-palette-items.js";
+import d from "./overlay/command-palette/command-palette.css.js";
+import { define as f, getHost as p, html as m, onCleanup as h, onEvent as g, onMounted as _, prop as v, ref as y, useEmit as b } from "@vielzeug/ore";
+import { computed as x, signal as S, watch as C } from "@vielzeug/ripple";
+import { createKeymap as w } from "@vielzeug/keymap";
 //#region src/overlay/command-palette/command-palette.ts
 var T = "ore-command-palette-item";
-p(T, { setup() {
-	return h``;
+f(T, { setup() {
+	return m``;
 } });
 var E = "ore-command-palette";
-p(E, {
+f(E, {
 	props: {
-		"empty-text": y.string("No results found."),
-		items: y.data(),
-		"keep-open-on-select": y.bool(!1),
-		label: y.string("Command palette"),
-		loading: y.bool(!1),
-		"no-filter": y.bool(!1),
-		open: y.bool(!1),
-		placeholder: y.string("Type a command or search…"),
-		shortcut: y.string("mod+k")
+		"empty-text": v.string("No results found."),
+		items: v.data(),
+		"keep-open-on-select": v.bool(!1),
+		label: v.string("Command palette"),
+		loading: v.bool(!1),
+		"no-filter": v.bool(!1),
+		open: v.bool(!1),
+		placeholder: v.string("Type a command or search…"),
+		shortcut: v.string("mod+k")
 	},
 	setup(e) {
-		let f = m(), p = x(), y = n(g), T = b(), E = b(), D = "cmdk-listbox", O = null, k = C(""), A = C([]), j = () => {
-			A.value = u([...f.children]);
+		let d = p(), f = b(), v = n(h), T = y(), E = y(), D = "cmdk-listbox", O = null, k = S(""), A = S([]), j = () => {
+			A.value = l([...d.children]);
 		};
 		j();
 		let M = new MutationObserver(j);
-		M.observe(f, {
+		M.observe(d, {
 			characterData: !0,
 			childList: !0,
 			subtree: !0
-		}), g(() => M.disconnect());
-		let N = S(() => {
+		}), h(() => M.disconnect());
+		let N = x(() => {
 			let t = e.items.value;
-			return Array.isArray(t) ? t.map(l) : A.value;
-		}), P = S(() => c(N.value, k.value, !!e["no-filter"].value)), F = S(() => s(P.value)), I = r({
+			return Array.isArray(t) ? t.map(c) : A.value;
+		}), P = x(() => s(N.value, k.value, !!e["no-filter"].value)), F = x(() => o(P.value)), I = r({
 			getItems: () => P.value,
 			isItemDisabled: (e) => e.disabled,
 			onNavigate: () => {
 				O?.querySelector("[data-focused]")?.scrollIntoView({ block: "nearest" });
 			},
-			signal: y
+			signal: v
 		}), { focusedIndex: L } = I, R = () => {
 			k.value = "", I.reset();
-		}, { closeWithAnimation: z, overlay: B, requestClose: V, setupNativeListeners: H } = o({
+		}, { closeWithAnimation: z, overlay: B, requestClose: V, setupNativeListeners: H } = a({
 			dialogRef: T,
 			getPanelEl: () => T.value?.querySelector(".panel"),
-			host: f,
-			initialFocus: S(() => ".search-input"),
+			host: d,
+			initialFocus: x(() => ".search-input"),
 			isPersistent: () => !1,
-			onCleanup: g,
-			onEvent: _,
+			onCleanup: h,
+			onEvent: g,
 			onNativeClose: (e) => {
-				p("close", { reason: e }), R();
+				f("close", { reason: e }), R();
 			},
 			onOpen: (e) => {
-				p("open", { reason: e }), I.navigate("first");
+				f("open", { reason: e }), I.navigate("first");
 			},
 			openProp: e.open,
 			performClose: () => z(),
-			returnFocus: S(() => !0)
-		}), U = a();
-		U.mount(window), g(() => U.dispose());
+			returnFocus: x(() => !0)
+		}), U = w();
+		U.mount(window), h(() => U.dispose());
 		let W = null;
-		w(e.shortcut, (e) => {
+		C(e.shortcut, (e) => {
 			W?.(), W = null;
 			let n = (e ?? "").trim();
 			if (n) try {
@@ -81,11 +80,11 @@ p(E, {
 			} catch (e) {
 				t(`invalid "shortcut" value "${n}" — ${e instanceof Error ? e.message : String(e)}`);
 			}
-		}, { immediate: !0 }), v(() => {
+		}, { immediate: !0 }), _(() => {
 			H();
 		});
 		function G(t) {
-			t.disabled || (p("select", {
+			t.disabled || (f("select", {
 				item: t,
 				label: t.label,
 				value: t.value
@@ -93,7 +92,7 @@ p(E, {
 		}
 		function K(t) {
 			let n = t.target.value;
-			k.value = n, I.navigate("first"), p("search", { query: n });
+			k.value = n, I.navigate("first"), f("search", { query: n });
 			let r = P.value.length;
 			i(r === 0 ? e["empty-text"].value : `${r} result${r === 1 ? "" : "s"} found`);
 		}
@@ -103,7 +102,7 @@ p(E, {
 				t && (e.preventDefault(), G(t));
 			}
 		}
-		return h`
+		return m`
       <dialog ref="${T}" class="dialog" part="dialog" aria-label="${e.label}" aria-modal="true">
         <div class="panel" part="panel">
           <div class="search" part="search">
@@ -138,7 +137,7 @@ p(E, {
             <div class="empty" role="presentation" ?hidden="${() => e.loading.value || F.value.length > 0}">
               ${() => e["empty-text"].value}
             </div>
-            ${() => F.value.map((e) => e.type === "group" ? h`<div class="group-heading" role="presentation">${e.group}</div>` : h`<div
+            ${() => F.value.map((e) => e.type === "group" ? m`<div class="group-heading" role="presentation">${e.group}</div>` : m`<div
                       class="item"
                       part="item"
                       role="option"
@@ -153,12 +152,12 @@ p(E, {
                       @pointerenter="${() => {
 			I.set(e.idx);
 		}}">
-                      ${e.item.icon ? h`<span class="item-icon" aria-hidden="true"
+                      ${e.item.icon ? m`<span class="item-icon" aria-hidden="true"
                               ><ore-icon name="${e.item.icon}" size="16"></ore-icon
                             ></span>` : ""}
                       <span class="item-label">${e.item.label}</span>
-                      ${e.item.shortcut ? h`<span class="item-shortcut"
-                              >${d(e.item.shortcut).map((e) => h`<kbd>${e}</kbd>`)}</span
+                      ${e.item.shortcut ? m`<span class="item-shortcut"
+                              >${u(e.item.shortcut).map((e) => m`<kbd>${e}</kbd>`)}</span
                             >` : ""}
                     </div>`)}
           </div>
@@ -171,7 +170,7 @@ p(E, {
       </dialog>
     `;
 	},
-	styles: [e, f]
+	styles: [e, d]
 });
 //#endregion
 export { T as COMMAND_PALETTE_ITEM_TAG, E as COMMAND_PALETTE_TAG };

package/dist/command-palette.js.map

@@ -1 +1 @@
-{"version":3,"file":"command-palette.js","names":[],"sources":["../src/overlay/command-palette/command-palette.ts"],"sourcesContent":["import { createKeymap } from '@vielzeug/keymap';\nimport { define, html, ref, prop, getHost, onCleanup, onEvent, onMounted, useEmit } from '@vielzeug/ore';\nimport { computed, signal, watch } from '@vielzeug/ripple';\n\nimport type { CommandPaletteItem, OreCommandPaletteEvents, OreCommandPaletteProps } from './command-palette.types';\n\nimport { warn } from '../../_dev';\nimport { announce, lifecycleSignal, createListControl } from '../../headless';\nimport { reducedMotionMixin } from '../../styles';\nimport { useDialogControl } from '../shared/use-dialog';\nimport { buildRows, filterItems, normalizeItem, parseSlottedItems, splitShortcutKeys } from './command-palette-items';\nimport '../../content/icon/icon';\nimport componentStyles from './command-palette.css?inline';\n\nexport type { OreCommandPaletteEvents, OreCommandPaletteProps } from './command-palette.types';\n\n/**\n * A pure data node describing one command. Never rendered directly — `ore-command-palette`\n * reads its attributes/text content and renders the visible row itself.\n *\n * @element ore-command-palette-item\n *\n * @attr {string} value - Value emitted by the `select` event and matched against the search query\n * @attr {string} label - Explicit label text; falls back to the element's text content\n * @attr {string} group - Group heading the item is clustered under\n * @attr {string} shortcut - Display-only keyboard hint rendered at the end of the row, one `<kbd>` per `+`-separated key (e.g. `\"⌘+S\"` renders two keycaps; a literal `+` key isn't representable — spell it out, e.g. `\"Ctrl+Plus\"`)\n * @attr {boolean} disabled - Excludes the item from keyboard navigation and selection\n *\n * @slot icon - Optional leading icon content\n *\n * @example\n * ```html\n * <ore-command-palette-item value=\"new-file\" group=\"File\" shortcut=\"⌘+N\">New File</ore-command-palette-item>\n * ```\n */\nexport const COMMAND_PALETTE_ITEM_TAG = 'ore-command-palette-item' as const;\ndefine(COMMAND_PALETTE_ITEM_TAG, {\n  setup() {\n    return html``;\n  },\n});\n\n/**\n * A searchable, keyboard-driven list of commands presented in a centered modal —\n * the \"⌘K\" pattern popularized by editors and productivity apps. Built on the\n * native `<dialog>` element (focus trap, top-layer stacking, `Escape`-to-close)\n * and `@vielzeug/keymap` for the global shortcut that opens it.\n *\n * @element ore-command-palette\n * @element ore-command-palette-item - Slotted command definition (place in default slot)\n *\n * @attr {boolean} open - Controls the open state of the palette\n * @attr {string} label - Accessible label for the dialog (screen-reader-only heading)\n * @attr {string} placeholder - Placeholder text for the search input\n * @attr {string} shortcut - Global keyboard shortcut (keymap syntax) that toggles the palette. Default `\"mod+k\"`; set to `\"\"` to disable\n * @attr {boolean} no-filter - Disable built-in client-side filtering (for server-driven search)\n * @attr {boolean} loading - Shows a loading row below the search input\n * @attr {string} empty-text - Message shown when no item matches the query\n * @attr {boolean} keep-open-on-select - Keep the palette open after an item is selected\n *\n * @fires open - Fired when the palette opens. detail: `{ reason }`\n * @fires close - Fired when the palette closes. detail: `{ reason }`\n * @fires search - Fired on every keystroke in the search input. detail: `{ query }`\n * @fires select - Fired when a command is chosen (click or `Enter`). detail: `{ value, label, item }`\n *\n * @slot - `<ore-command-palette-item>` elements (alternative/supplement to the `items` prop)\n *\n * @cssprop --command-palette-bg - Panel background color\n * @cssprop --command-palette-border-color - Panel border color\n * @cssprop --command-palette-radius - Panel border radius\n * @cssprop --command-palette-shadow - Panel drop shadow\n * @cssprop --command-palette-max-width - Maximum panel width\n * @cssprop --command-palette-backdrop - Backdrop overlay color\n * @cssprop --command-palette-option-hover-bg - Item background on hover\n * @cssprop --command-palette-option-focus-bg - Item background when keyboard-focused\n *\n * @part dialog - Dialog root container\n * @part panel - Panel container\n * @part input - Search input\n * @part listbox - Listbox of matching commands\n *\n * @example\n * ```html\n * <ore-command-palette label=\"Command palette\" placeholder=\"Type a command…\">\n *   <ore-command-palette-item value=\"new-file\" group=\"File\" shortcut=\"⌘+N\">New File</ore-command-palette-item>\n *   <ore-command-palette-item value=\"open-file\" group=\"File\" shortcut=\"⌘+O\">Open File…</ore-command-palette-item>\n *   <ore-command-palette-item value=\"toggle-theme\" group=\"View\">Toggle Theme</ore-command-palette-item>\n * </ore-command-palette>\n * ```\n */\nexport const COMMAND_PALETTE_TAG = 'ore-command-palette' as const;\ndefine<OreCommandPaletteProps>(COMMAND_PALETTE_TAG, {\n  props: {\n    'empty-text': prop.string('No results found.'),\n    items: prop.data<OreCommandPaletteProps['items']>(),\n    'keep-open-on-select': prop.bool(false),\n    label: prop.string('Command palette'),\n    loading: prop.bool(false),\n    'no-filter': prop.bool(false),\n    open: prop.bool(false),\n    placeholder: prop.string('Type a command or search…'),\n    shortcut: prop.string('mod+k'),\n  },\n  setup(props) {\n    const el = getHost();\n    const emit = useEmit<OreCommandPaletteEvents>();\n    const abortSignal = lifecycleSignal(onCleanup);\n\n    const dialogRef = ref<HTMLDialogElement>();\n    const searchInputRef = ref<HTMLInputElement>();\n    const listboxId = 'cmdk-listbox';\n\n    let listboxEl: HTMLElement | null = null;\n\n    const query = signal('');\n\n    // ── Items: slotted <ore-command-palette-item> elements, merged with the `items` prop ──\n    // Items are pure data nodes (see `ore-command-palette-item`'s own doc comment) — they're\n    // never projected through a `<slot>`, just read directly off the host's light DOM. That\n    // sidesteps `useSlots()`/`slotchange` entirely: a plain MutationObserver on the host\n    // already covers everything `slotchange` would (an item added or removed) *and* the case\n    // it can't — an already-assigned item's own text/attributes changing. For items written\n    // as static, inline HTML, the browser's parser can insert the last item before appending\n    // its text-node child; without watching `characterData`, that would permanently cache an\n    // empty label, since nothing else re-triggers once the element itself stops changing.\n    const slottedItems = signal<CommandPaletteItem[]>([]);\n\n    const reparseSlottedItems = (): void => {\n      slottedItems.value = parseSlottedItems([...el.children]);\n    };\n\n    reparseSlottedItems();\n\n    const lightDomObserver = new MutationObserver(reparseSlottedItems);\n\n    lightDomObserver.observe(el, { characterData: true, childList: true, subtree: true });\n    onCleanup(() => lightDomObserver.disconnect());\n\n    const allItems = computed<CommandPaletteItem[]>(() => {\n      const explicit = props.items.value;\n\n      return Array.isArray(explicit) ? explicit.map(normalizeItem) : slottedItems.value;\n    });\n\n    const filteredItems = computed(() => filterItems(allItems.value, query.value, Boolean(props['no-filter'].value)));\n    const rows = computed(() => buildRows(filteredItems.value));\n\n    // ── Keyboard navigation over the filtered list (Up/Down/Home/End) ──\n    const scrollFocusedIntoView = (): void => {\n      listboxEl?.querySelector<HTMLElement>('[data-focused]')?.scrollIntoView({ block: 'nearest' });\n    };\n\n    const list = createListControl<CommandPaletteItem>({\n      getItems: () => filteredItems.value,\n      isItemDisabled: (item) => item.disabled,\n      onNavigate: scrollFocusedIntoView,\n      signal: abortSignal,\n    });\n    const { focusedIndex } = list;\n\n    // ── Dialog chrome: native <dialog>, focus trap, Escape, backdrop click ──\n    const resetSearch = (): void => {\n      query.value = '';\n      list.reset();\n    };\n\n    const { closeWithAnimation, overlay, requestClose, setupNativeListeners } = useDialogControl({\n      dialogRef,\n      getPanelEl: () => dialogRef.value?.querySelector<HTMLElement>('.panel'),\n      host: el,\n      initialFocus: computed(() => '.search-input'),\n      isPersistent: () => false,\n      onCleanup,\n      onEvent,\n      onNativeClose: (reason) => {\n        emit('close', { reason });\n        resetSearch();\n      },\n      onOpen: (reason) => {\n        emit('open', { reason });\n        list.navigate('first');\n      },\n      openProp: props.open,\n      performClose: () => closeWithAnimation(),\n      returnFocus: computed(() => true),\n    });\n\n    // ── Global keyboard shortcut (opens/closes the palette from anywhere) ──\n    const globalKeymap = createKeymap();\n\n    globalKeymap.mount(window);\n    onCleanup(() => globalKeymap.dispose());\n\n    let unbindShortcut: (() => void) | null = null;\n\n    watch(\n      props.shortcut,\n      (shortcutStr) => {\n        unbindShortcut?.();\n        unbindShortcut = null;\n\n        const trimmed = (shortcutStr ?? '').trim();\n\n        if (!trimmed) return;\n\n        try {\n          unbindShortcut = globalKeymap.bind(trimmed, () => {\n            overlay.toggle('keyboard', 'trigger');\n          });\n        } catch (error) {\n          warn(`invalid \"shortcut\" value \"${trimmed}\" — ${error instanceof Error ? error.message : String(error)}`);\n        }\n      },\n      { immediate: true },\n    );\n\n    onMounted(() => {\n      setupNativeListeners();\n    });\n\n    // ── Selection ────────────────────────────────────────────────────────────\n    function selectItem(item: CommandPaletteItem): void {\n      if (item.disabled) return;\n\n      emit('select', { item, label: item.label, value: item.value });\n\n      if (props['keep-open-on-select'].value) {\n        searchInputRef.value?.focus();\n      } else {\n        requestClose('trigger');\n      }\n    }\n\n    function handleInput(e: Event): void {\n      const value = (e.target as HTMLInputElement).value;\n\n      query.value = value;\n      list.navigate('first');\n      emit('search', { query: value });\n\n      const count = filteredItems.value.length;\n\n      announce(count === 0 ? props['empty-text'].value! : `${count} result${count === 1 ? '' : 's'} found`);\n    }\n\n    function handleKeydown(e: KeyboardEvent): void {\n      if (list.handleKeydown(e)) return;\n\n      if (e.key === 'Enter') {\n        // `list.navigate('first')` (called on open and on every keystroke) already keeps\n        // the focused row off a disabled item, so this fallback is only ever reached when\n        // nothing has been focused yet — but it mirrors `selectItem`'s own disabled guard\n        // rather than blindly grabbing index 0, in case that navigate-on-open wiring ever\n        // changes.\n        const active = list.getActiveItem() ?? filteredItems.value.find((item) => !item.disabled);\n\n        if (active) {\n          e.preventDefault();\n          selectItem(active);\n        }\n      }\n    }\n\n    return html`\n      <dialog ref=\"${dialogRef}\" class=\"dialog\" part=\"dialog\" aria-label=\"${props.label}\" aria-modal=\"true\">\n        <div class=\"panel\" part=\"panel\">\n          <div class=\"search\" part=\"search\">\n            <span class=\"search-icon\" aria-hidden=\"true\"><ore-icon name=\"search\" size=\"18\"></ore-icon></span>\n            <input\n              ref=\"${searchInputRef}\"\n              class=\"search-input\"\n              part=\"input\"\n              type=\"text\"\n              role=\"combobox\"\n              autocomplete=\"off\"\n              spellcheck=\"false\"\n              aria-expanded=\"true\"\n              aria-autocomplete=\"list\"\n              aria-controls=\"${listboxId}\"\n              aria-activedescendant=\"${() => (focusedIndex.value >= 0 ? `${listboxId}-opt-${focusedIndex.value}` : '')}\"\n              placeholder=\"${props.placeholder}\"\n              value=\"${query}\"\n              @input=\"${handleInput}\"\n              @keydown=\"${handleKeydown}\" />\n            <span class=\"search-loader\" ?hidden=\"${() => !props.loading.value}\" aria-hidden=\"true\"></span>\n          </div>\n          <div\n            class=\"listbox\"\n            part=\"listbox\"\n            role=\"listbox\"\n            id=\"${listboxId}\"\n            aria-label=\"Commands\"\n            ref=\"${(listEl: HTMLElement) => {\n              listboxEl = listEl;\n            }}\">\n            <div class=\"empty\" role=\"presentation\" ?hidden=\"${() => props.loading.value || rows.value.length > 0}\">\n              ${() => props['empty-text'].value}\n            </div>\n            ${() =>\n              rows.value.map((row) =>\n                row.type === 'group'\n                  ? html`<div class=\"group-heading\" role=\"presentation\">${row.group}</div>`\n                  : html`<div\n                      class=\"item\"\n                      part=\"item\"\n                      role=\"option\"\n                      id=\"${`${listboxId}-opt-${row.idx}`}\"\n                      aria-selected=\"${() => String(focusedIndex.value === row.idx)}\"\n                      aria-disabled=\"${() => String(row.item.disabled)}\"\n                      ?data-focused=\"${() => focusedIndex.value === row.idx}\"\n                      ?data-disabled=\"${() => row.item.disabled}\"\n                      @click=\"${(e: MouseEvent) => {\n                        e.stopPropagation();\n                        selectItem(row.item);\n                      }}\"\n                      @pointerenter=\"${() => {\n                        list.set(row.idx);\n                      }}\">\n                      ${\n                        row.item.icon\n                          ? html`<span class=\"item-icon\" aria-hidden=\"true\"\n                              ><ore-icon name=\"${row.item.icon}\" size=\"16\"></ore-icon\n                            ></span>`\n                          : ''\n                      }\n                      <span class=\"item-label\">${row.item.label}</span>\n                      ${\n                        row.item.shortcut\n                          ? html`<span class=\"item-shortcut\"\n                              >${splitShortcutKeys(row.item.shortcut).map((key) => html`<kbd>${key}</kbd>`)}</span\n                            >`\n                          : ''\n                      }\n                    </div>`,\n              )}\n          </div>\n          <div class=\"footer\" part=\"footer\">\n            <span class=\"footer-hint\"><kbd>↑</kbd><kbd>↓</kbd> Navigate</span>\n            <span class=\"footer-hint\"><kbd>Enter</kbd> Select</span>\n            <span class=\"footer-hint\"><kbd>Esc</kbd> Close</span>\n          </div>\n        </div>\n      </dialog>\n    `;\n  },\n  styles: [reducedMotionMixin, componentStyles],\n});\n"],"mappings":"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"}
+{"version":3,"file":"command-palette.js","names":[],"sources":["../src/overlay/command-palette/command-palette.ts"],"sourcesContent":["import { createKeymap } from '@vielzeug/keymap';\nimport { define, html, ref, prop, getHost, onCleanup, onEvent, onMounted, useEmit } from '@vielzeug/ore';\nimport { computed, signal, watch } from '@vielzeug/ripple';\n\nimport type { CommandPaletteItem, OreCommandPaletteEvents, OreCommandPaletteProps } from './command-palette.types';\n\nimport { warn } from '../../_dev';\nimport { announce, lifecycleSignal, createListControl } from '../../headless';\nimport { reducedMotionMixin } from '../../styles';\nimport { useDialogControl } from '../shared/use-dialog';\nimport { buildRows, filterItems, normalizeItem, parseSlottedItems, splitShortcutKeys } from './command-palette-items';\nimport '../../content/icon/icon';\nimport componentStyles from './command-palette.css?inline';\n\nexport type { OreCommandPaletteEvents, OreCommandPaletteProps } from './command-palette.types';\n\n/**\n * A pure data node describing one command. Never rendered directly — `ore-command-palette`\n * reads its attributes/text content and renders the visible row itself.\n *\n * @element ore-command-palette-item\n *\n * @attr {string} value - Value emitted by the `select` event and matched against the search query\n * @attr {string} label - Explicit label text; falls back to the element's text content\n * @attr {string} group - Group heading the item is clustered under\n * @attr {string} shortcut - Display-only keyboard hint rendered at the end of the row, one `<kbd>` per `+`-separated key (e.g. `\"⌘+S\"` renders two keycaps; a literal `+` key isn't representable — spell it out, e.g. `\"Ctrl+Plus\"`)\n * @attr {boolean} disabled - Excludes the item from keyboard navigation and selection\n *\n * @slot icon - Optional leading icon content\n *\n * @example\n * ```html\n * <ore-command-palette-item value=\"new-file\" group=\"File\" shortcut=\"⌘+N\">New File</ore-command-palette-item>\n * ```\n */\nexport const COMMAND_PALETTE_ITEM_TAG = 'ore-command-palette-item' as const;\ndefine(COMMAND_PALETTE_ITEM_TAG, {\n  setup() {\n    return html``;\n  },\n});\n\n/**\n * A searchable, keyboard-driven list of commands presented in a centered modal —\n * the \"⌘K\" pattern popularized by editors and productivity apps. Built on the\n * native `<dialog>` element (focus trap, top-layer stacking, `Escape`-to-close)\n * and `@vielzeug/keymap` for the global shortcut that opens it.\n *\n * @element ore-command-palette\n * @element ore-command-palette-item - Slotted command definition (place in default slot)\n *\n * @attr {boolean} open - Controls the open state of the palette\n * @attr {string} label - Accessible label for the dialog (screen-reader-only heading)\n * @attr {string} placeholder - Placeholder text for the search input\n * @attr {string} shortcut - Global keyboard shortcut (keymap syntax) that toggles the palette. Default `\"mod+k\"`; set to `\"\"` to disable\n * @attr {boolean} no-filter - Disable built-in client-side filtering (for server-driven search)\n * @attr {boolean} loading - Shows a loading row below the search input\n * @attr {string} empty-text - Message shown when no item matches the query\n * @attr {boolean} keep-open-on-select - Keep the palette open after an item is selected\n *\n * @fires open - Fired when the palette opens. detail: `{ reason }`\n * @fires close - Fired when the palette closes. detail: `{ reason }`\n * @fires search - Fired on every keystroke in the search input. detail: `{ query }`\n * @fires select - Fired when a command is chosen (click or `Enter`). detail: `{ value, label, item }`\n *\n * @slot - `<ore-command-palette-item>` elements (alternative/supplement to the `items` prop)\n *\n * @cssprop --command-palette-bg - Panel background color\n * @cssprop --command-palette-border-color - Panel border color\n * @cssprop --command-palette-radius - Panel border radius\n * @cssprop --command-palette-shadow - Panel drop shadow\n * @cssprop --command-palette-max-width - Maximum panel width\n * @cssprop --command-palette-backdrop - Backdrop overlay color\n * @cssprop --command-palette-option-hover-bg - Item background on hover\n * @cssprop --command-palette-option-focus-bg - Item background when keyboard-focused\n *\n * @part dialog - Dialog root container\n * @part panel - Panel container\n * @part input - Search input\n * @part listbox - Listbox of matching commands\n *\n * @example\n * ```html\n * <ore-command-palette label=\"Command palette\" placeholder=\"Type a command…\">\n *   <ore-command-palette-item value=\"new-file\" group=\"File\" shortcut=\"⌘+N\">New File</ore-command-palette-item>\n *   <ore-command-palette-item value=\"open-file\" group=\"File\" shortcut=\"⌘+O\">Open File…</ore-command-palette-item>\n *   <ore-command-palette-item value=\"toggle-theme\" group=\"View\">Toggle Theme</ore-command-palette-item>\n * </ore-command-palette>\n * ```\n */\nexport const COMMAND_PALETTE_TAG = 'ore-command-palette' as const;\ndefine<OreCommandPaletteProps>(COMMAND_PALETTE_TAG, {\n  props: {\n    'empty-text': prop.string('No results found.'),\n    items: prop.data<OreCommandPaletteProps['items']>(),\n    'keep-open-on-select': prop.bool(false),\n    label: prop.string('Command palette'),\n    loading: prop.bool(false),\n    'no-filter': prop.bool(false),\n    open: prop.bool(false),\n    placeholder: prop.string('Type a command or search…'),\n    shortcut: prop.string('mod+k'),\n  },\n  setup(props) {\n    const el = getHost();\n    const emit = useEmit<OreCommandPaletteEvents>();\n    const abortSignal = lifecycleSignal(onCleanup);\n\n    const dialogRef = ref<HTMLDialogElement>();\n    const searchInputRef = ref<HTMLInputElement>();\n    const listboxId = 'cmdk-listbox';\n\n    let listboxEl: HTMLElement | null = null;\n\n    const query = signal('');\n\n    // ── Items: slotted <ore-command-palette-item> elements, merged with the `items` prop ──\n    // Items are pure data nodes (see `ore-command-palette-item`'s own doc comment) — they're\n    // never projected through a `<slot>`, just read directly off the host's light DOM. That\n    // sidesteps `useSlots()`/`slotchange` entirely: a plain MutationObserver on the host\n    // already covers everything `slotchange` would (an item added or removed) *and* the case\n    // it can't — an already-assigned item's own text/attributes changing. For items written\n    // as static, inline HTML, the browser's parser can insert the last item before appending\n    // its text-node child; without watching `characterData`, that would permanently cache an\n    // empty label, since nothing else re-triggers once the element itself stops changing.\n    const slottedItems = signal<CommandPaletteItem[]>([]);\n\n    const reparseSlottedItems = (): void => {\n      slottedItems.value = parseSlottedItems([...el.children]);\n    };\n\n    reparseSlottedItems();\n\n    const lightDomObserver = new MutationObserver(reparseSlottedItems);\n\n    lightDomObserver.observe(el, { characterData: true, childList: true, subtree: true });\n    onCleanup(() => lightDomObserver.disconnect());\n\n    const allItems = computed<CommandPaletteItem[]>(() => {\n      const explicit = props.items.value;\n\n      return Array.isArray(explicit) ? explicit.map(normalizeItem) : slottedItems.value;\n    });\n\n    const filteredItems = computed(() => filterItems(allItems.value, query.value, Boolean(props['no-filter'].value)));\n    const rows = computed(() => buildRows(filteredItems.value));\n\n    // ── Keyboard navigation over the filtered list (Up/Down/Home/End) ──\n    const scrollFocusedIntoView = (): void => {\n      listboxEl?.querySelector<HTMLElement>('[data-focused]')?.scrollIntoView({ block: 'nearest' });\n    };\n\n    const list = createListControl<CommandPaletteItem>({\n      getItems: () => filteredItems.value,\n      isItemDisabled: (item) => item.disabled,\n      onNavigate: scrollFocusedIntoView,\n      signal: abortSignal,\n    });\n    const { focusedIndex } = list;\n\n    // ── Dialog chrome: native <dialog>, focus trap, Escape, backdrop click ──\n    const resetSearch = (): void => {\n      query.value = '';\n      list.reset();\n    };\n\n    const { closeWithAnimation, overlay, requestClose, setupNativeListeners } = useDialogControl({\n      dialogRef,\n      getPanelEl: () => dialogRef.value?.querySelector<HTMLElement>('.panel'),\n      host: el,\n      initialFocus: computed(() => '.search-input'),\n      isPersistent: () => false,\n      onCleanup,\n      onEvent,\n      onNativeClose: (reason) => {\n        emit('close', { reason });\n        resetSearch();\n      },\n      onOpen: (reason) => {\n        emit('open', { reason });\n        list.navigate('first');\n      },\n      openProp: props.open,\n      performClose: () => closeWithAnimation(),\n      returnFocus: computed(() => true),\n    });\n\n    // ── Global keyboard shortcut (opens/closes the palette from anywhere) ──\n    const globalKeymap = createKeymap();\n\n    globalKeymap.mount(window);\n    onCleanup(() => globalKeymap.dispose());\n\n    let unbindShortcut: (() => void) | null = null;\n\n    watch(\n      props.shortcut,\n      (shortcutStr) => {\n        unbindShortcut?.();\n        unbindShortcut = null;\n\n        const trimmed = (shortcutStr ?? '').trim();\n\n        if (!trimmed) return;\n\n        try {\n          unbindShortcut = globalKeymap.bind(trimmed, () => {\n            overlay.toggle('keyboard', 'trigger');\n          });\n        } catch (error) {\n          warn(`invalid \"shortcut\" value \"${trimmed}\" — ${error instanceof Error ? error.message : String(error)}`);\n        }\n      },\n      { immediate: true },\n    );\n\n    onMounted(() => {\n      setupNativeListeners();\n    });\n\n    // ── Selection ────────────────────────────────────────────────────────────\n    function selectItem(item: CommandPaletteItem): void {\n      if (item.disabled) return;\n\n      emit('select', { item, label: item.label, value: item.value });\n\n      if (props['keep-open-on-select'].value) {\n        searchInputRef.value?.focus();\n      } else {\n        requestClose('trigger');\n      }\n    }\n\n    function handleInput(e: Event): void {\n      const value = (e.target as HTMLInputElement).value;\n\n      query.value = value;\n      list.navigate('first');\n      emit('search', { query: value });\n\n      const count = filteredItems.value.length;\n\n      announce(count === 0 ? props['empty-text'].value! : `${count} result${count === 1 ? '' : 's'} found`);\n    }\n\n    function handleKeydown(e: KeyboardEvent): void {\n      if (list.handleKeydown(e)) return;\n\n      if (e.key === 'Enter') {\n        // `list.navigate('first')` (called on open and on every keystroke) already keeps\n        // the focused row off a disabled item, so this fallback is only ever reached when\n        // nothing has been focused yet — but it mirrors `selectItem`'s own disabled guard\n        // rather than blindly grabbing index 0, in case that navigate-on-open wiring ever\n        // changes.\n        const active = list.getActiveItem() ?? filteredItems.value.find((item) => !item.disabled);\n\n        if (active) {\n          e.preventDefault();\n          selectItem(active);\n        }\n      }\n    }\n\n    return html`\n      <dialog ref=\"${dialogRef}\" class=\"dialog\" part=\"dialog\" aria-label=\"${props.label}\" aria-modal=\"true\">\n        <div class=\"panel\" part=\"panel\">\n          <div class=\"search\" part=\"search\">\n            <span class=\"search-icon\" aria-hidden=\"true\"><ore-icon name=\"search\" size=\"18\"></ore-icon></span>\n            <input\n              ref=\"${searchInputRef}\"\n              class=\"search-input\"\n              part=\"input\"\n              type=\"text\"\n              role=\"combobox\"\n              autocomplete=\"off\"\n              spellcheck=\"false\"\n              aria-expanded=\"true\"\n              aria-autocomplete=\"list\"\n              aria-controls=\"${listboxId}\"\n              aria-activedescendant=\"${() => (focusedIndex.value >= 0 ? `${listboxId}-opt-${focusedIndex.value}` : '')}\"\n              placeholder=\"${props.placeholder}\"\n              value=\"${query}\"\n              @input=\"${handleInput}\"\n              @keydown=\"${handleKeydown}\" />\n            <span class=\"search-loader\" ?hidden=\"${() => !props.loading.value}\" aria-hidden=\"true\"></span>\n          </div>\n          <div\n            class=\"listbox\"\n            part=\"listbox\"\n            role=\"listbox\"\n            id=\"${listboxId}\"\n            aria-label=\"Commands\"\n            ref=\"${(listEl: HTMLElement) => {\n              listboxEl = listEl;\n            }}\">\n            <div class=\"empty\" role=\"presentation\" ?hidden=\"${() => props.loading.value || rows.value.length > 0}\">\n              ${() => props['empty-text'].value}\n            </div>\n            ${() =>\n              rows.value.map((row) =>\n                row.type === 'group'\n                  ? html`<div class=\"group-heading\" role=\"presentation\">${row.group}</div>`\n                  : html`<div\n                      class=\"item\"\n                      part=\"item\"\n                      role=\"option\"\n                      id=\"${`${listboxId}-opt-${row.idx}`}\"\n                      aria-selected=\"${() => String(focusedIndex.value === row.idx)}\"\n                      aria-disabled=\"${() => String(row.item.disabled)}\"\n                      ?data-focused=\"${() => focusedIndex.value === row.idx}\"\n                      ?data-disabled=\"${() => row.item.disabled}\"\n                      @click=\"${(e: MouseEvent) => {\n                        e.stopPropagation();\n                        selectItem(row.item);\n                      }}\"\n                      @pointerenter=\"${() => {\n                        list.set(row.idx);\n                      }}\">\n                      ${\n                        row.item.icon\n                          ? html`<span class=\"item-icon\" aria-hidden=\"true\"\n                              ><ore-icon name=\"${row.item.icon}\" size=\"16\"></ore-icon\n                            ></span>`\n                          : ''\n                      }\n                      <span class=\"item-label\">${row.item.label}</span>\n                      ${\n                        row.item.shortcut\n                          ? html`<span class=\"item-shortcut\"\n                              >${splitShortcutKeys(row.item.shortcut).map((key) => html`<kbd>${key}</kbd>`)}</span\n                            >`\n                          : ''\n                      }\n                    </div>`,\n              )}\n          </div>\n          <div class=\"footer\" part=\"footer\">\n            <span class=\"footer-hint\"><kbd>↑</kbd><kbd>↓</kbd> Navigate</span>\n            <span class=\"footer-hint\"><kbd>Enter</kbd> Select</span>\n            <span class=\"footer-hint\"><kbd>Esc</kbd> Close</span>\n          </div>\n        </div>\n      </dialog>\n    `;\n  },\n  styles: [reducedMotionMixin, componentStyles],\n});\n"],"mappings":"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"}

package/dist/content/code-window/code-window.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"code-window.d.ts","sourceRoot":"","sources":["../../../src/content/code-window/code-window.ts"],"names":[],"mappings":"AAMA,gCAAgC;AAChC,MAAM,MAAM,iBAAiB,GAAG,MAAM,GAAG,MAAM,CAAC;AAEhD,6CAA6C;AAC7C,MAAM,MAAM,kBAAkB,GAAG;IAC/B,4EAA4E;IAC5E,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,uEAAuE;IACvE,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,+EAA+E;IAC/E,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;;OAGG;IACH,OAAO,CAAC,EAAE,iBAAiB,CAAC;CAC7B,CAAC;AAEF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA0CG;AACH,eAAO,MAAM,eAAe,EAAG,iBAA0B,CAAC"}
+{"version":3,"file":"code-window.d.ts","sourceRoot":"","sources":["../../../src/content/code-window/code-window.ts"],"names":[],"mappings":"AAKA,gCAAgC;AAChC,MAAM,MAAM,iBAAiB,GAAG,MAAM,GAAG,MAAM,CAAC;AAEhD,6CAA6C;AAC7C,MAAM,MAAM,kBAAkB,GAAG;IAC/B,4EAA4E;IAC5E,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,uEAAuE;IACvE,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,+EAA+E;IAC/E,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;;OAGG;IACH,OAAO,CAAC,EAAE,iBAAiB,CAAC;CAC7B,CAAC;AAEF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA0CG;AACH,eAAO,MAAM,eAAe,EAAG,iBAA0B,CAAC"}

package/dist/content/icon/icon.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"icon.d.ts","sourceRoot":"","sources":["../../../src/content/icon/icon.ts"],"names":[],"mappings":"AAQA,MAAM,MAAM,QAAQ,GAAG,KAAK,CAAC,CAAC,MAAM,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,GAAG,MAAM,GAAG,SAAS,CAAC,CAAC,CAAC,CAAC;AA2CpF;;;GAGG;AACH,wBAAgB,aAAa,CAAC,KAAK,EAAE,MAAM,CAAC,MAAM,EAAE,QAAQ,CAAC,GAAG,IAAI,CAInE;AA2CD,gCAAgC;AAChC,MAAM,MAAM,YAAY,GAAG;IACzB,mEAAmE;IACnE,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAC9B,gEAAgE;IAChE,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,yDAAyD;IACzD,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,+DAA+D;IAC/D,IAAI,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACvB,kEAAkE;IAClE,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,uBAAuB;IACvB,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB,CAAC;AAEF;;;;;;;;;;;;;;;;;;;;;GAqBG;AACH,eAAO,MAAM,QAAQ,EAAG,UAAmB,CAAC"}
+{"version":3,"file":"icon.d.ts","sourceRoot":"","sources":["../../../src/content/icon/icon.ts"],"names":[],"mappings":"AAOA,MAAM,MAAM,QAAQ,GAAG,KAAK,CAAC,CAAC,MAAM,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,GAAG,MAAM,GAAG,SAAS,CAAC,CAAC,CAAC,CAAC;AA2CpF;;;GAGG;AACH,wBAAgB,aAAa,CAAC,KAAK,EAAE,MAAM,CAAC,MAAM,EAAE,QAAQ,CAAC,GAAG,IAAI,CAInE;AA2CD,gCAAgC;AAChC,MAAM,MAAM,YAAY,GAAG;IACzB,mEAAmE;IACnE,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAC9B,gEAAgE;IAChE,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,yDAAyD;IACzD,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,+DAA+D;IAC/D,IAAI,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACvB,kEAAkE;IAClE,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,uBAAuB;IACvB,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB,CAAC;AAEF;;;;;;;;;;;;;;;;;;;;;GAqBG;AACH,eAAO,MAAM,QAAQ,EAAG,UAAmB,CAAC"}