@ixfx/components 0.7.3 → 0.7.5
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/bundle/index.d.ts +1355 -526
- package/bundle/index.d.ts.map +1 -1
- package/bundle/index.js +3277 -384
- package/bundle/index.js.map +1 -1
- package/dist/ac-text.d.ts +1 -1
- package/dist/ac-text.js +1 -1
- package/dist/{ac-token-TCLAZeVg.d.ts → ac-token--_vCHXWw.d.ts} +2 -2
- package/dist/{ac-token-TCLAZeVg.d.ts.map → ac-token--_vCHXWw.d.ts.map} +1 -1
- package/dist/ac-token.d.ts +1 -1
- package/dist/ac-token.js +2 -2
- package/dist/button.d.ts +1 -1
- package/dist/button.d.ts.map +1 -1
- package/dist/colour-picker.d.ts +1 -1
- package/dist/crumbs.d.ts +6 -2
- package/dist/crumbs.d.ts.map +1 -1
- package/dist/crumbs.js +13 -3
- package/dist/crumbs.js.map +1 -1
- package/dist/{data-grid-Db4QpnII.d.ts → data-grid-CtJ35v8L.d.ts} +59 -2
- package/dist/data-grid-CtJ35v8L.d.ts.map +1 -0
- package/dist/data-grid.d.ts +1 -1
- package/dist/data-grid.js +268 -14
- package/dist/data-grid.js.map +1 -1
- package/dist/detail-list-BS5dRDda.d.ts +175 -0
- package/dist/detail-list-BS5dRDda.d.ts.map +1 -0
- package/dist/detail-list.d.ts +3 -0
- package/dist/detail-list.js +1031 -0
- package/dist/detail-list.js.map +1 -0
- package/dist/grid-list-D-GbghSH.d.ts +321 -0
- package/dist/grid-list-D-GbghSH.d.ts.map +1 -0
- package/dist/grid-list.d.ts +3 -0
- package/dist/grid-list.js +994 -0
- package/dist/grid-list.js.map +1 -0
- package/dist/{grouped-item-lister-BWlC9S4e.d.ts → grouped-item-lister-fdZHVxFM.d.ts} +3 -3
- package/dist/{grouped-item-lister-BWlC9S4e.d.ts.map → grouped-item-lister-fdZHVxFM.d.ts.map} +1 -1
- package/dist/grouped-item-lister.d.ts +1 -1
- package/dist/{icon-DR_3rSyZ.d.ts → icon-CDGprSdE.d.ts} +2 -2
- package/dist/icon-CDGprSdE.d.ts.map +1 -0
- package/dist/icons.d.ts +2 -2
- package/dist/incr-search-DpbSJtgj.js +962 -0
- package/dist/incr-search-DpbSJtgj.js.map +1 -0
- package/dist/incr-search.d.ts +2 -2
- package/dist/incr-search.js +2 -3
- package/dist/{index-C59-JEPl.d.ts → index-9AhaHIT2.d.ts} +3 -3
- package/dist/{index-C59-JEPl.d.ts.map → index-9AhaHIT2.d.ts.map} +1 -1
- package/dist/index-CBS4z1v-.d.ts +365 -0
- package/dist/index-CBS4z1v-.d.ts.map +1 -0
- package/dist/{index-DsjpDksO.d.ts → index-CS9yM8L-.d.ts} +2 -2
- package/dist/{index-DsjpDksO.d.ts.map → index-CS9yM8L-.d.ts.map} +1 -1
- package/dist/{index-BUB5SICW.d.ts → index-CoqtMSd9.d.ts} +2 -2
- package/dist/{index-BUB5SICW.d.ts.map → index-CoqtMSd9.d.ts.map} +1 -1
- package/dist/{index-CJ5fshD3.d.ts → index-UvnoZUAo.d.ts} +2 -2
- package/dist/{index-CJ5fshD3.d.ts.map → index-UvnoZUAo.d.ts.map} +1 -1
- package/dist/{index-BOUaDIW-.d.ts → index-tq6f8007.d.ts} +2 -2
- package/dist/{index-BOUaDIW-.d.ts.map → index-tq6f8007.d.ts.map} +1 -1
- package/dist/index.d.ts +188 -243
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +376 -1004
- package/dist/index.js.map +1 -1
- package/dist/interaction-Cr13azbM.js +3 -0
- package/dist/{labelled-input-base-Dp_9KP0G.d.ts → labelled-input-base-DiTme1JO.d.ts} +2 -2
- package/dist/{labelled-input-base-Dp_9KP0G.d.ts.map → labelled-input-base-DiTme1JO.d.ts.map} +1 -1
- package/dist/labelled-radial-input.d.ts +2 -2
- package/dist/labelled-radial-input.d.ts.map +1 -1
- package/dist/labelled-range-input.d.ts +1 -1
- package/dist/labelled-slider-input.d.ts +1 -1
- package/dist/list-item-animation-DuiwgN3l.js +112 -0
- package/dist/list-item-animation-DuiwgN3l.js.map +1 -0
- package/dist/list-selection-controller-DTFI40li.js +264 -0
- package/dist/list-selection-controller-DTFI40li.js.map +1 -0
- package/dist/{list-selection-types-DSuRNWpx.d.ts → list-selection-types-B5ioL-dG.d.ts} +6 -1
- package/dist/list-selection-types-B5ioL-dG.d.ts.map +1 -0
- package/dist/{menu-DMzjkVnK.js → menu-Bg90Qr0B.js} +3 -3
- package/dist/{menu-DMzjkVnK.js.map → menu-Bg90Qr0B.js.map} +1 -1
- package/dist/{menu-item-D2S4i8u1.js → menu-item-Bx-Fs7jq.js} +3 -3
- package/dist/{menu-item-D2S4i8u1.js.map → menu-item-Bx-Fs7jq.js.map} +1 -1
- package/dist/{menu-item-ZmkXNjek.d.ts → menu-item-CZi9vy5O.d.ts} +2 -2
- package/dist/{menu-item-ZmkXNjek.d.ts.map → menu-item-CZi9vy5O.d.ts.map} +1 -1
- package/dist/menu.d.ts +2 -2
- package/dist/menu.js +2 -2
- package/dist/miller.d.ts +82 -4
- package/dist/miller.d.ts.map +1 -1
- package/dist/miller.js +329 -70
- package/dist/miller.js.map +1 -1
- package/dist/narrowed-text.js +3 -4
- package/dist/narrowed-text.js.map +1 -1
- package/dist/panel.d.ts +1 -1
- package/dist/plots.js +1 -1
- package/dist/select-horiz.js +2 -2
- package/dist/{split-layout-C5SYbDrq.d.ts → split-layout-JK3xWVX2.d.ts} +2 -2
- package/dist/{split-layout-C5SYbDrq.d.ts.map → split-layout-JK3xWVX2.d.ts.map} +1 -1
- package/dist/split-layout.d.ts +1 -1
- package/dist/{tab-list-DbMIL520.d.ts → tab-list-CGyPt07Z.d.ts} +2 -2
- package/dist/{tab-list-DbMIL520.d.ts.map → tab-list-CGyPt07Z.d.ts.map} +1 -1
- package/dist/tabs.d.ts +1 -1
- package/dist/{tickled-controller-Ds1DMyG7.d.ts → tickled-controller-Bn3YdQsM.d.ts} +12 -1
- package/dist/{tickled-controller-Ds1DMyG7.d.ts.map → tickled-controller-Bn3YdQsM.d.ts.map} +1 -1
- package/dist/{tickled-controller-h9GmJ_bU.js → tickled-controller-C66DgJHl.js} +16 -1
- package/dist/tickled-controller-C66DgJHl.js.map +1 -0
- package/dist/{titlebar-B23MrIbI.d.ts → titlebar-Bj5pfdw_.d.ts} +2 -2
- package/dist/{titlebar-B23MrIbI.d.ts.map → titlebar-Bj5pfdw_.d.ts.map} +1 -1
- package/dist/titlebar.d.ts +1 -1
- package/dist/{tree-Ch4W8qXQ.js → tree-DAii2A1g.js} +190 -29
- package/dist/tree-DAii2A1g.js.map +1 -0
- package/dist/{tree-component-BvV4muxx.d.ts → tree-component-F6qZ0Gdv.d.ts} +9 -1
- package/dist/{tree-component-BvV4muxx.d.ts.map → tree-component-F6qZ0Gdv.d.ts.map} +1 -1
- package/dist/tree.d.ts +28 -4
- package/dist/tree.d.ts.map +1 -1
- package/dist/tree.js +1 -1
- package/dist/vertical-list-DwtCPy1b.d.ts +143 -0
- package/dist/vertical-list-DwtCPy1b.d.ts.map +1 -0
- package/dist/vertical-list.d.ts +3 -121
- package/dist/vertical-list.js +642 -1
- package/dist/vertical-list.js.map +1 -0
- package/dist/{xy-axis-DWizs0bt.js → xy-axis-VrX8dmvS.js} +2 -2
- package/dist/{xy-axis-DWizs0bt.js.map → xy-axis-VrX8dmvS.js.map} +1 -1
- package/docs-user/README.md +1 -0
- package/docs-user/data-grid.md +70 -2
- package/docs-user/detail-list.md +39 -1
- package/docs-user/grid-list.md +298 -0
- package/docs-user/incr-search.md +12 -2
- package/docs-user/index.json +7 -2
- package/docs-user/llms.txt +1 -0
- package/docs-user/tree.md +35 -1
- package/docs-user/vertical-list.md +58 -2
- package/llms.txt +1 -0
- package/package.json +17 -2
- package/dist/data-grid-Db4QpnII.d.ts.map +0 -1
- package/dist/element-search-Y8SRfPGM.js +0 -185
- package/dist/element-search-Y8SRfPGM.js.map +0 -1
- package/dist/icon-DR_3rSyZ.d.ts.map +0 -1
- package/dist/incr-search-vCzuao-2.js +0 -137
- package/dist/incr-search-vCzuao-2.js.map +0 -1
- package/dist/index-Cu5i8zZY.d.ts +0 -160
- package/dist/index-Cu5i8zZY.d.ts.map +0 -1
- package/dist/interaction-D5XdKzbR.js +0 -2
- package/dist/list-selection-types-DSuRNWpx.d.ts.map +0 -1
- package/dist/tickled-controller-h9GmJ_bU.js.map +0 -1
- package/dist/tree-Ch4W8qXQ.js.map +0 -1
- package/dist/vertical-list-B4w_ksJk.js +0 -814
- package/dist/vertical-list-B4w_ksJk.js.map +0 -1
- package/dist/vertical-list.d.ts.map +0 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"narrowed-text.js","names":["#onNarrowedTextInit","#onItemClick","#handleSlotChange","#onContainerClick","#onInput","#onKeyDown","#onFocus","#onBlur","#onFocusTriggerClick","#renderItem","customElement"],"sources":["../src/narrowed-text/narrowed-text.ts"],"sourcesContent":["import type { CommandRegistry } from '@clinth/ui-commands';\nimport type { PropertyValues } from 'lit';\nimport type { IncrSearch, IncrSearchState } from '../incr-search/index.js';\nimport type {\n NarrowedTextChangeDetail,\n NarrowedTextItem,\n Orientation,\n SelectionMode,\n} from './types.js';\nimport { createCommandRegistry } from '@clinth/ui-commands';\nimport { css, html, LitElement, nothing } from 'lit';\nimport { property, query, state } from 'lit/decorators.js';\nimport {\n applyHighlights,\n buildHighlightTargets,\n clearHighlights,\n createIncrSearch,\n} from '../incr-search/index.js';\nimport { TickledController, tickledItemStyles, tickledStyles } from '../interaction/index.js';\nimport { themeFallbacks } from '../styles/fallbacks.js';\nimport { safeCustomElement as customElement } from '../util/custom-elements.js';\n\nconst HIGHLIGHT_KEY = `narrowed-text-highlight`;\n\n@customElement(`ixfx-narrowed-text`)\nexport class NarrowedTextElement extends LitElement {\n @property({ type: String, attribute: `selection-mode` }) selectionMode: SelectionMode = `single`;\n @property({ type: Boolean, attribute: `required-selection` }) requiredSelection = false;\n @property({ type: String, attribute: `orientation` }) orientation: Orientation = `horizontal`;\n @property({ type: Boolean, attribute: `nowrap` }) nowrap = false;\n @property({ type: String, attribute: `separator` }) separator = ` `;\n @property({ type: String, attribute: `width` }) width: string | undefined;\n @property({ type: String, attribute: `height` }) height: string | undefined;\n @property({ type: Boolean, attribute: `preserve-filter` }) preserveFilter = false;\n @property({ type: String }) value = ``;\n\n @property({ attribute: false })\n registry: CommandRegistry<unknown> | undefined = undefined;\n\n @state() private _query = ``;\n @state() private _computedItems: NarrowedTextItem[] = [];\n @state() private _filteredItems: NarrowedTextItem[] = [];\n @state() private _isFocused = false;\n @query(`slot`) private _slot!: HTMLSlotElement;\n\n private _selectedValues: Set<string> = new Set();\n private _ownedRegistry: CommandRegistry<unknown> | undefined;\n private _search: IncrSearch<NarrowedTextItem> = createIncrSearch<NarrowedTextItem>({\n selector: item => item.label ?? item.value,\n });\n\n private _searchState: IncrSearchState<NarrowedTextItem> | undefined;\n private _unsubSearch: (() => void) | undefined;\n\n // TickledController manages hover and keyboard focus\n private tickled = new TickledController<number>(this, {\n getItems: () => {\n return this._filteredItems.map((_, i) => ({\n id: i,\n enabled: true,\n }));\n },\n onTickle: (id) => {\n if (id === undefined || !this.shadowRoot)\n return;\n const itemsContainer = this.shadowRoot.querySelector(`.items`);\n if (!itemsContainer)\n return;\n const itemEls = itemsContainer.querySelectorAll(`.item`);\n const itemEl = itemEls[id];\n if (itemEl) {\n itemEl.scrollIntoView({ block: `nearest`, inline: `nearest` });\n }\n },\n });\n\n get selected(): string | string[] {\n if (this.selectionMode === `single`) {\n return this._selectedValues.values().next().value ?? ``;\n } else {\n return [...this._selectedValues];\n }\n }\n\n set selected(value: string | string[]) {\n if (this.selectionMode === `single`) {\n this._selectedValues.clear();\n if (value) {\n this._selectedValues.add(value as string);\n }\n } else {\n this._selectedValues.clear();\n if (Array.isArray(value)) {\n value.forEach(v => this._selectedValues.add(v));\n }\n }\n\n this._updateFilteredItems();\n }\n\n selectAll(): void {\n const items = this._filteredItems;\n if (items.length === 0)\n return;\n if (this.selectionMode === `single`) {\n this._selectedValues.clear();\n this._selectedValues.add(items[0].value);\n } else {\n this._selectedValues.clear();\n for (const item of items) {\n this._selectedValues.add(item.value);\n }\n }\n this._updateValueFromSelected();\n this._updateFilteredItems();\n this.dispatchEvent(new CustomEvent<NarrowedTextChangeDetail>(`change`, {\n detail: {\n item: undefined,\n query: this._query,\n selected: this._computedItems.filter(i => this._selectedValues.has(i.value)),\n },\n bubbles: true,\n composed: true,\n }));\n }\n\n deselectAll(): void {\n if (this.requiredSelection && this._selectedValues.size <= 1)\n return;\n if (this._selectedValues.size === 0)\n return;\n this._selectedValues.clear();\n this._updateValueFromSelected();\n this._updateFilteredItems();\n this.dispatchEvent(new CustomEvent<NarrowedTextChangeDetail>(`change`, {\n detail: {\n item: undefined,\n query: this._query,\n selected: [],\n },\n bubbles: true,\n composed: true,\n }));\n }\n\n override connectedCallback(): void {\n super.connectedCallback();\n this._unsubSearch = this._search.onChange((state) => {\n const results = state.results.map(r => r.item);\n for (const item of this._computedItems) {\n if (this._selectedValues.has(item.value) && !results.includes(item)) {\n results.push(item);\n }\n }\n this._filteredItems = results;\n this._searchState = state;\n this.requestUpdate();\n });\n this.addEventListener(`narrowed-text-init`, () => this.#onNarrowedTextInit());\n\n const registry = this._ownedRegistry = createCommandRegistry();\n registry.register({\n id: `select-all`,\n label: `Select All`,\n description: `Select every currently-filtered item (or first in single mode)`,\n execute: () => this.selectAll(),\n });\n registry.register({\n id: `deselect-all`,\n label: `Deselect All`,\n description: `Clear all selection`,\n execute: () => this.deselectAll(),\n });\n this.registry = registry;\n }\n\n override disconnectedCallback(): void {\n super.disconnectedCallback();\n this._unsubSearch?.();\n this._search.dispose();\n clearHighlights({ key: HIGHLIGHT_KEY });\n this.removeEventListener(`narrowed-text-init`, () => this.#onNarrowedTextInit());\n if (this._ownedRegistry) {\n this._ownedRegistry.unregister(`select-all`);\n this._ownedRegistry.unregister(`deselect-all`);\n this._ownedRegistry = undefined;\n this.registry = undefined;\n }\n }\n\n protected override firstUpdated(): void {\n this._updateComputedItems();\n }\n\n protected override updated(changedProperties: PropertyValues): void {\n if (changedProperties.has(`value`)) {\n this._updateSelectedFromValue();\n }\n this._applyHighlights();\n }\n\n #handleSlotChange = (): void => {\n this._updateComputedItems();\n };\n\n private _updateComputedItems(): void {\n const slottedElements = this.querySelectorAll(`[data-value]`);\n const items: NarrowedTextItem[] = [];\n\n slottedElements.forEach((el) => {\n const value = el.getAttribute(`data-value`) ?? ``;\n const label = el.getAttribute(`data-label`) ?? el.textContent?.trim() ?? value;\n const description = el.getAttribute(`data-description`) ?? undefined;\n const iconName = el.getAttribute(`data-icon-name`) ?? undefined;\n\n items.push({ value, label, description, iconName });\n });\n\n this._computedItems = items;\n void this._search.setItems(items);\n }\n\n private _updateSelectedFromValue(): void {\n if (this.selectionMode === `single`) {\n this._selectedValues.clear();\n if (this.value) {\n this._selectedValues.add(this.value);\n }\n } else {\n const values = this.value.split(`,`).filter(v => v.trim());\n this._selectedValues.clear();\n values.forEach(v => this._selectedValues.add(v.trim()));\n }\n\n this._updateFilteredItems();\n }\n\n private _updateFilteredItems(): void {\n void this._search.setQuery(this._query);\n }\n\n private _applyHighlights(): void {\n if (!this._query.trim() || !this._searchState || !this.shadowRoot) {\n clearHighlights({ key: HIGHLIGHT_KEY });\n return;\n }\n\n const targets = buildHighlightTargets(\n this.shadowRoot,\n `.item-label`,\n this._searchState.positionsByItem,\n (el) => {\n const v = el.getAttribute(`data-item-value`);\n return this._computedItems.find(i => i.value === v);\n },\n (el) => {\n const v = el.getAttribute(`data-item-value`);\n const i = this._computedItems.find(x => x.value === v);\n return i?.label ?? i?.value ?? ``;\n },\n );\n applyHighlights(targets, { key: HIGHLIGHT_KEY });\n }\n\n #onInput = (e: Event): void => {\n const input = e.target as HTMLInputElement;\n this._query = input.value;\n // Reset tickled to first item when query changes\n if (this._query.trim() && this._filteredItems.length > 0) {\n this.tickled.setTickled(0);\n } else {\n this.tickled.clearTickled();\n }\n this._updateFilteredItems();\n };\n\n #onKeyDown = (e: KeyboardEvent): void => {\n if (this._filteredItems.length === 0) {\n return;\n }\n\n switch (e.key) {\n case `Tab`: {\n if (e.shiftKey) {\n e.preventDefault();\n this.dispatchEvent(new CustomEvent(`narrowed-text-shift-tab`, {\n bubbles: true,\n composed: true,\n }));\n }\n return;\n }\n case `ArrowRight`: {\n if (this.orientation !== `horizontal`) {\n return;\n }\n const currentTickled = this.tickled.tickledId;\n const lastIndex = this._filteredItems.length - 1;\n if (currentTickled !== undefined && currentTickled >= lastIndex) {\n return;\n }\n e.preventDefault();\n this.tickled.handleKeyboardNavigation(`next`);\n break;\n }\n case `ArrowLeft`: {\n if (this.orientation !== `horizontal`) {\n return;\n }\n const currentTickled = this.tickled.tickledId;\n if (currentTickled !== undefined && currentTickled <= 0) {\n return;\n }\n e.preventDefault();\n this.tickled.handleKeyboardNavigation(`previous`);\n break;\n }\n case `ArrowDown`: {\n if (this.orientation !== `vertical`) {\n return;\n }\n const currentTickled = this.tickled.tickledId;\n const lastIndex = this._filteredItems.length - 1;\n if (currentTickled !== undefined && currentTickled >= lastIndex) {\n return;\n }\n e.preventDefault();\n this.tickled.handleKeyboardNavigation(`next`);\n break;\n }\n case `ArrowUp`: {\n if (this.orientation !== `vertical`) {\n return;\n }\n const currentTickled = this.tickled.tickledId;\n if (currentTickled !== undefined && currentTickled <= 0) {\n return;\n }\n e.preventDefault();\n this.tickled.handleKeyboardNavigation(`previous`);\n break;\n }\n case `Enter`: {\n e.preventDefault();\n const tickledItem = this._filteredItems[this.tickled.tickledId ?? -1];\n if (tickledItem) {\n this._selectItem(tickledItem, false);\n // Enter always clears filter regardless of preserveFilter\n this._query = ``;\n this._updateFilteredItems();\n }\n break;\n }\n case ` `: {\n e.preventDefault();\n if (this.tickled.tickledId !== undefined && this._filteredItems[this.tickled.tickledId]) {\n this._selectItem(this._filteredItems[this.tickled.tickledId], false);\n }\n break;\n }\n case `Escape`: {\n e.preventDefault();\n this._query = ``;\n this.tickled.clearTickled();\n this._updateFilteredItems();\n break;\n }\n }\n };\n\n #onFocus = (): void => {\n this._isFocused = true;\n if (this._query.trim() && this._filteredItems.length > 0) {\n this.tickled.setTickled(0);\n }\n };\n\n #onNarrowedTextInit = (): void => {\n const input = this.shadowRoot?.querySelector(`.search-input`) as HTMLInputElement | null;\n if (input) {\n requestAnimationFrame(() => {\n input.focus();\n });\n }\n };\n\n focus(): void {\n // Override focus to focus internal input\n const input = this.shadowRoot?.querySelector(`.search-input`) as HTMLInputElement | null;\n if (input) {\n input.focus();\n } else {\n super.focus();\n }\n }\n\n blur(): void {\n const input = this.shadowRoot?.querySelector(`.search-input`) as HTMLInputElement | null;\n if (input) {\n input.blur();\n } else {\n super.blur();\n }\n };\n\n setContents(contents: NarrowedTextItem[]): void {\n while (this.firstChild) {\n this.firstChild.remove();\n }\n\n for (const item of contents) {\n const span = document.createElement(`span`);\n span.setAttribute(`data-value`, item.value);\n if (item.label !== undefined)\n span.setAttribute(`data-label`, item.label);\n if (item.description !== undefined)\n span.setAttribute(`data-description`, item.description);\n if (item.iconName !== undefined)\n span.setAttribute(`data-icon-name`, item.iconName);\n this.appendChild(span);\n }\n\n this._selectedValues.clear();\n const selectedValues = contents.filter(i => i.selected).map(i => i.value);\n for (const v of selectedValues) {\n this._selectedValues.add(v);\n }\n\n if (selectedValues.length > 0) {\n this.requestUpdate();\n }\n }\n\n deleteItem(value: string): boolean {\n const el = this.querySelector(`[data-value=\"${CSS.escape(value)}\"]`);\n if (!el)\n return false;\n el.remove();\n this._selectedValues.delete(value);\n return true;\n }\n\n #onBlur = (): void => {\n this._isFocused = false;\n this.tickled.clearTickled();\n this.dispatchEvent(new CustomEvent(`narrowed-text-blur`, { bubbles: true, composed: true }));\n };\n\n #onFocusTriggerClick = (): void => {\n const input = this.shadowRoot?.querySelector(`.search-input`) as HTMLInputElement | null;\n input?.focus();\n };\n\n #onContainerClick = (e: MouseEvent): void => {\n const target = e.target as HTMLElement;\n if (target.classList.contains(`item`) || target.closest(`.item`)) {\n return;\n }\n const input = this.shadowRoot?.querySelector(`.search-input`) as HTMLInputElement | null;\n input?.focus();\n };\n\n #onItemClick(item: NarrowedTextItem): void {\n this._selectItem(item);\n const clickedIndex = this._filteredItems.findIndex(i => i.value === item.value);\n if (clickedIndex >= 0) {\n this.tickled.handlePointerEnter(clickedIndex);\n }\n const input = this.shadowRoot?.querySelector(`.search-input`) as HTMLInputElement | null;\n input?.focus();\n }\n\n private _selectItem(item: NarrowedTextItem, clearFilter = true): void {\n if (this.selectionMode === `single`) {\n if (this._selectedValues.has(item.value) && !this.requiredSelection) {\n this._selectedValues.clear();\n } else {\n this._selectedValues.clear();\n this._selectedValues.add(item.value);\n }\n } else {\n if (this._selectedValues.has(item.value)) {\n if (!this.requiredSelection || this._selectedValues.size > 1) {\n this._selectedValues.delete(item.value);\n }\n } else {\n this._selectedValues.add(item.value);\n }\n }\n\n this._updateValueFromSelected();\n this._updateFilteredItems();\n\n const selectedItems = this._computedItems.filter(i => this._selectedValues.has(i.value));\n\n this.dispatchEvent(new CustomEvent<NarrowedTextChangeDetail>(`change`, {\n detail: { item, query: this._query, selected: selectedItems },\n bubbles: true,\n composed: true,\n }));\n\n if (clearFilter && !this.preserveFilter && this._query) {\n this._query = ``;\n this._updateFilteredItems();\n }\n }\n\n private _updateValueFromSelected(): void {\n if (this.selectionMode === `single`) {\n this.value = [...this._selectedValues][0] ?? ``;\n } else {\n this.value = [...this._selectedValues].join(`,`);\n }\n }\n\n #renderItem(item: NarrowedTextItem, index: number) {\n const isTickled = this.tickled.isTickled(index);\n const isSelected = this._selectedValues.has(item.value);\n const label = item.label ?? item.value;\n\n return html`\n <div\n class=\"item ${isTickled ? `tickled` : ``} ${isSelected ? `selected` : ``}\"\n part=\"item\"\n role=\"option\"\n aria-selected=${isSelected}\n @click=${() => this.#onItemClick(item)}\n @pointerenter=${() => this.tickled.handlePointerEnter(index)}\n >\n ${item.iconName ? html`<ixfx-icon class=\"item-icon\" name=${item.iconName}></ixfx-icon>` : nothing}\n <span class=\"item-label\" part=\"label\" data-item-value=${item.value}>${label}</span>\n </div>\n `;\n }\n\n protected override render() {\n const isScrollable = this.width !== undefined || this.height !== undefined;\n\n return html`\n <slot @slotchange=${this.#handleSlotChange} style=\"display: none;\"></slot>\n <div\n class=\"container ${this.orientation} ${isScrollable ? `scrollable` : ``} ${this._isFocused ? `focused` : ``}\"\n part=\"container\"\n style=${this._getContainerStyle()}\n data-input-mode=${this.tickled.inputMode}\n @click=${this.#onContainerClick}\n >\n <input\n type=\"text\"\n class=\"search-input\"\n .value=${this._query}\n autocomplete=\"off\"\n spellcheck=\"false\"\n aria-label=\"Search items\"\n @input=${this.#onInput}\n @keydown=${this.#onKeyDown}\n @focus=${this.#onFocus}\n @blur=${this.#onBlur}\n >\n <div class=\"focus-trigger\" @click=${this.#onFocusTriggerClick}></div>\n <div \n class=\"items\" \n part=\"items\" \n role=\"listbox\"\n @pointerleave=${(e: PointerEvent) => this.tickled.handlePointerLeave(e)}\n >\n ${this._filteredItems.map((item, i) => this.#renderItem(item, i))}\n </div>\n </div>\n `;\n }\n\n private _getContainerStyle(): string {\n const styles: string[] = [];\n if (this.width) {\n styles.push(`width: ${this.width}`);\n }\n if (this.height) {\n styles.push(`height: ${this.height}`);\n }\n return styles.join(`; `);\n }\n\n static override styles = [themeFallbacks, tickledStyles, tickledItemStyles, css`\n :host {\n display: inline-block;\n position: relative;\n font-family: var(--font-family, system-ui, sans-serif);\n font-size: var(--text-m, 12px);\n color: var(--surface-2-text);\n --item-padding: var(--space-xs, 3px) var(--space-m, 8px);\n --item-border-radius: var(--radius-s, 3px);\n --item-icon-spacing: var(--space-xs, 3px);\n }\n\n .container {\n display: flex;\n position: relative;\n min-width: min-content;\n min-height: min-content;\n }\n\n .container.horizontal {\n flex-direction: row;\n align-items: stretch;\n }\n\n .container.vertical {\n flex-direction: column;\n }\n\n .container.scrollable {\n scrollbar-width: none;\n overflow-x: auto;\n overflow-y: hidden;\n .vertical {\n overflow-x: hidden;\n overflow-y: auto;\n }\n }\n\n .container.focused {\n outline: 2px solid var(--accent);\n outline-offset: 2px;\n }\n\n .search-input {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n opacity: 0;\n cursor: text;\n z-index: 1;\n pointer-events: none;\n }\n\n .search-input:focus {\n outline: none;\n }\n\n .focus-trigger {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n z-index: 0;\n cursor: text;\n }\n\n .items {\n display: flex;\n flex-wrap: wrap;\n gap: var(--item-spacing, var(--space-xs, 3px));\n align-items: center;\n width: 100%;\n height: 100%;\n min-height: var(--item-height, 28px);\n position: relative;\n z-index: 2;\n pointer-events: auto;\n }\n\n .container.horizontal .items {\n flex-direction: row;\n }\n\n .container.vertical .items {\n flex-direction: column;\n align-items: stretch;\n }\n\n :host([nowrap]) .items {\n flex-wrap: nowrap;\n }\n\n .item-icon {\n flex-shrink: 0;\n width: 1em;\n height: 1em;\n }\n\n .item-label {\n flex: 1;\n overflow: hidden;\n text-overflow: ellipsis;\n color: var(--item-label-color, var(--item-text, inherit));\n font-style: var(--item-label-font-style, var(--item-label-font-style-default, normal));\n text-decoration: var(--item-label-text-decoration, var(--item-label-text-decoration-default, none));\n text-underline-offset: var(--item-label-text-underline-offset, auto);\n }\n\n .item.selected .item-label {\n --item-label-color: var(--item-text-selected);\n --item-label-font-style: var(--item-label-font-style-selected, italic);\n }\n\n .item.tickled .item-label {\n --item-label-text-decoration: var(--item-label-text-decoration-tickled, underline dotted);\n --item-label-text-underline-offset: var(--item-label-text-underline-offset-tickled, 3px);\n }\n\n .item.active .item-label {\n --item-label-color: var(--item-text-selected);\n }\n\n .item.selected.tickled .item-label {\n --item-label-color: var(--item-text-selected);\n --item-label-font-style: var(--item-label-font-style-selected, italic);\n --item-label-text-decoration: var(--item-label-text-decoration-tickled, underline dotted);\n --item-label-text-underline-offset: var(--item-label-text-underline-offset-tickled, 3px);\n }\n\n ::highlight(narrowed-text-highlight) {\n background: var(--highlight-background, var(--accent));\n color: var(--highlight-color, var(--accent-text, #fff));\n border-radius: 2px;\n padding: 0 1px;\n }\n `];\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'ixfx-narrowed-text': NarrowedTextElement;\n }\n}\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"narrowed-text.js","names":["#onNarrowedTextInit","#onItemClick","#handleSlotChange","#onContainerClick","#onInput","#onKeyDown","#onFocus","#onBlur","#onFocusTriggerClick","#renderItem","customElement"],"sources":["../src/narrowed-text/narrowed-text.ts"],"sourcesContent":["import type { CommandRegistry } from '@clinth/ui-commands';\nimport type { PropertyValues } from 'lit';\nimport type { IncrSearch, IncrSearchState } from '../incr-search/index.js';\nimport type {\n NarrowedTextChangeDetail,\n NarrowedTextItem,\n Orientation,\n SelectionMode,\n} from './types.js';\nimport { createCommandRegistry } from '@clinth/ui-commands';\nimport { css, html, LitElement, nothing } from 'lit';\nimport { property, query, state } from 'lit/decorators.js';\nimport {\n applyHighlights,\n buildHighlightTargets,\n clearHighlights,\n createIncrSearch,\n} from '../incr-search/index.js';\nimport { TickledController, tickledItemStyles, tickledStyles } from '../interaction/index.js';\nimport { themeFallbacks } from '../styles/fallbacks.js';\nimport { safeCustomElement as customElement } from '../util/custom-elements.js';\n\nconst HIGHLIGHT_KEY = `narrowed-text-highlight`;\n\n@customElement(`ixfx-narrowed-text`)\nexport class NarrowedTextElement extends LitElement {\n @property({ type: String, attribute: `selection-mode` }) selectionMode: SelectionMode = `single`;\n @property({ type: Boolean, attribute: `required-selection` }) requiredSelection = false;\n @property({ type: String, attribute: `orientation` }) orientation: Orientation = `horizontal`;\n @property({ type: Boolean, attribute: `nowrap` }) nowrap = false;\n @property({ type: String, attribute: `separator` }) separator = ` `;\n @property({ type: String, attribute: `width` }) width: string | undefined;\n @property({ type: String, attribute: `height` }) height: string | undefined;\n @property({ type: Boolean, attribute: `preserve-filter` }) preserveFilter = false;\n @property({ type: String }) value = ``;\n\n @property({ attribute: false })\n registry: CommandRegistry<unknown> | undefined = undefined;\n\n @state() private _query = ``;\n @state() private _computedItems: NarrowedTextItem[] = [];\n @state() private _filteredItems: NarrowedTextItem[] = [];\n @state() private _isFocused = false;\n @query(`slot`) private _slot!: HTMLSlotElement;\n\n private _selectedValues: Set<string> = new Set();\n private _ownedRegistry: CommandRegistry<unknown> | undefined;\n private _search: IncrSearch<NarrowedTextItem> = createIncrSearch<NarrowedTextItem>({\n selector: item => item.label ?? item.value,\n });\n\n private _searchState: IncrSearchState<NarrowedTextItem> | undefined;\n private _unsubSearch: (() => void) | undefined;\n\n // TickledController manages hover and keyboard focus\n private tickled = new TickledController<number>(this, {\n getItems: () => {\n return this._filteredItems.map((_, i) => ({\n id: i,\n enabled: true,\n }));\n },\n onTickle: (id) => {\n if (id === undefined || !this.shadowRoot)\n return;\n const itemsContainer = this.shadowRoot.querySelector(`.items`);\n if (!itemsContainer)\n return;\n const itemEls = itemsContainer.querySelectorAll(`.item`);\n const itemEl = itemEls[id];\n if (itemEl) {\n itemEl.scrollIntoView({ block: `nearest`, inline: `nearest` });\n }\n },\n });\n\n get selected(): string | string[] {\n if (this.selectionMode === `single`) {\n return this._selectedValues.values().next().value ?? ``;\n } else {\n return [...this._selectedValues];\n }\n }\n\n set selected(value: string | string[]) {\n if (this.selectionMode === `single`) {\n this._selectedValues.clear();\n if (value) {\n this._selectedValues.add(value as string);\n }\n } else {\n this._selectedValues.clear();\n if (Array.isArray(value)) {\n value.forEach(v => this._selectedValues.add(v));\n }\n }\n\n this._updateFilteredItems();\n }\n\n selectAll(): void {\n const items = this._filteredItems;\n if (items.length === 0)\n return;\n if (this.selectionMode === `single`) {\n this._selectedValues.clear();\n this._selectedValues.add(items[0].value);\n } else {\n this._selectedValues.clear();\n for (const item of items) {\n this._selectedValues.add(item.value);\n }\n }\n this._updateValueFromSelected();\n this._updateFilteredItems();\n this.dispatchEvent(new CustomEvent<NarrowedTextChangeDetail>(`change`, {\n detail: {\n item: undefined,\n query: this._query,\n selected: this._computedItems.filter(i => this._selectedValues.has(i.value)),\n },\n bubbles: true,\n composed: true,\n }));\n }\n\n deselectAll(): void {\n if (this.requiredSelection && this._selectedValues.size <= 1)\n return;\n if (this._selectedValues.size === 0)\n return;\n this._selectedValues.clear();\n this._updateValueFromSelected();\n this._updateFilteredItems();\n this.dispatchEvent(new CustomEvent<NarrowedTextChangeDetail>(`change`, {\n detail: {\n item: undefined,\n query: this._query,\n selected: [],\n },\n bubbles: true,\n composed: true,\n }));\n }\n\n override connectedCallback(): void {\n super.connectedCallback();\n this._unsubSearch = this._search.onChange((state) => {\n const results = state.results.map(r => r.item);\n for (const item of this._computedItems) {\n if (this._selectedValues.has(item.value) && !results.includes(item)) {\n results.push(item);\n }\n }\n this._filteredItems = results;\n this._searchState = state;\n this.requestUpdate();\n });\n this.addEventListener(`narrowed-text-init`, () => this.#onNarrowedTextInit());\n\n const registry = this._ownedRegistry = createCommandRegistry();\n registry.register({\n id: `select-all`,\n label: `Select All`,\n description: `Select every currently-filtered item (or first in single mode)`,\n execute: () => this.selectAll(),\n });\n registry.register({\n id: `deselect-all`,\n label: `Deselect All`,\n description: `Clear all selection`,\n execute: () => this.deselectAll(),\n });\n this.registry = registry;\n }\n\n override disconnectedCallback(): void {\n super.disconnectedCallback();\n this._unsubSearch?.();\n this._search.dispose();\n clearHighlights({ key: HIGHLIGHT_KEY });\n this.removeEventListener(`narrowed-text-init`, () => this.#onNarrowedTextInit());\n if (this._ownedRegistry) {\n this._ownedRegistry.unregister(`select-all`);\n this._ownedRegistry.unregister(`deselect-all`);\n this._ownedRegistry = undefined;\n this.registry = undefined;\n }\n }\n\n protected override firstUpdated(): void {\n this._updateComputedItems();\n }\n\n protected override updated(changedProperties: PropertyValues): void {\n if (changedProperties.has(`value`)) {\n this._updateSelectedFromValue();\n }\n this._applyHighlights();\n }\n\n #handleSlotChange = (): void => {\n this._updateComputedItems();\n };\n\n private _updateComputedItems(): void {\n const slottedElements = this.querySelectorAll(`[data-value]`);\n const items: NarrowedTextItem[] = [];\n\n slottedElements.forEach((el) => {\n const value = el.getAttribute(`data-value`) ?? ``;\n const label = el.getAttribute(`data-label`) ?? el.textContent?.trim() ?? value;\n const description = el.getAttribute(`data-description`) ?? undefined;\n const iconName = el.getAttribute(`data-icon-name`) ?? undefined;\n\n items.push({ value, label, description, iconName });\n });\n\n this._computedItems = items;\n void this._search.setItems(items);\n }\n\n private _updateSelectedFromValue(): void {\n if (this.selectionMode === `single`) {\n this._selectedValues.clear();\n if (this.value) {\n this._selectedValues.add(this.value);\n }\n } else {\n const values = this.value.split(`,`).filter(v => v.trim());\n this._selectedValues.clear();\n values.forEach(v => this._selectedValues.add(v.trim()));\n }\n\n this._updateFilteredItems();\n }\n\n private _updateFilteredItems(): void {\n void this._search.setQuery(this._query);\n }\n\n private _applyHighlights(): void {\n if (!this._query.trim() || !this._searchState || !this.shadowRoot) {\n clearHighlights({ key: HIGHLIGHT_KEY });\n return;\n }\n\n const targets = buildHighlightTargets(\n this.shadowRoot,\n `.item-label`,\n this._searchState.positionsByItem,\n (el) => {\n const v = el.getAttribute(`data-item-value`);\n return this._computedItems.find(i => i.value === v);\n },\n (el) => {\n const v = el.getAttribute(`data-item-value`);\n const i = this._computedItems.find(x => x.value === v);\n return i?.label ?? i?.value ?? ``;\n },\n );\n applyHighlights(targets, { key: HIGHLIGHT_KEY });\n }\n\n #onInput = (e: Event): void => {\n const input = e.target as HTMLInputElement;\n this._query = input.value;\n // Reset tickled to first item when query changes\n if (this._query.trim() && this._filteredItems.length > 0) {\n this.tickled.setTickled(0);\n } else {\n this.tickled.clearTickled();\n }\n this._updateFilteredItems();\n };\n\n #onKeyDown = (e: KeyboardEvent): void => {\n if (this._filteredItems.length === 0) {\n return;\n }\n\n switch (e.key) {\n case `Tab`: {\n if (e.shiftKey) {\n e.preventDefault();\n this.dispatchEvent(new CustomEvent(`narrowed-text-shift-tab`, {\n bubbles: true,\n composed: true,\n }));\n }\n return;\n }\n case `ArrowRight`: {\n if (this.orientation !== `horizontal`) {\n return;\n }\n const currentTickled = this.tickled.tickledId;\n const lastIndex = this._filteredItems.length - 1;\n if (currentTickled !== undefined && currentTickled >= lastIndex) {\n return;\n }\n e.preventDefault();\n this.tickled.handleKeyboardNavigation(`next`);\n break;\n }\n case `ArrowLeft`: {\n if (this.orientation !== `horizontal`) {\n return;\n }\n const currentTickled = this.tickled.tickledId;\n if (currentTickled !== undefined && currentTickled <= 0) {\n return;\n }\n e.preventDefault();\n this.tickled.handleKeyboardNavigation(`previous`);\n break;\n }\n case `ArrowDown`: {\n if (this.orientation !== `vertical`) {\n return;\n }\n const currentTickled = this.tickled.tickledId;\n const lastIndex = this._filteredItems.length - 1;\n if (currentTickled !== undefined && currentTickled >= lastIndex) {\n return;\n }\n e.preventDefault();\n this.tickled.handleKeyboardNavigation(`next`);\n break;\n }\n case `ArrowUp`: {\n if (this.orientation !== `vertical`) {\n return;\n }\n const currentTickled = this.tickled.tickledId;\n if (currentTickled !== undefined && currentTickled <= 0) {\n return;\n }\n e.preventDefault();\n this.tickled.handleKeyboardNavigation(`previous`);\n break;\n }\n case `Enter`: {\n e.preventDefault();\n const tickledItem = this._filteredItems[this.tickled.tickledId ?? -1];\n if (tickledItem) {\n this._selectItem(tickledItem, false);\n // Enter always clears filter regardless of preserveFilter\n this._query = ``;\n this._updateFilteredItems();\n }\n break;\n }\n case ` `: {\n e.preventDefault();\n if (this.tickled.tickledId !== undefined && this._filteredItems[this.tickled.tickledId]) {\n this._selectItem(this._filteredItems[this.tickled.tickledId], false);\n }\n break;\n }\n case `Escape`: {\n e.preventDefault();\n this._query = ``;\n this.tickled.clearTickled();\n this._updateFilteredItems();\n break;\n }\n }\n };\n\n #onFocus = (): void => {\n this._isFocused = true;\n if (this._query.trim() && this._filteredItems.length > 0) {\n this.tickled.setTickled(0);\n }\n };\n\n #onNarrowedTextInit = (): void => {\n const input = this.shadowRoot?.querySelector(`.search-input`) as HTMLInputElement | null;\n if (input) {\n requestAnimationFrame(() => {\n input.focus();\n });\n }\n };\n\n focus(): void {\n // Override focus to focus internal input\n const input = this.shadowRoot?.querySelector(`.search-input`) as HTMLInputElement | null;\n if (input) {\n input.focus();\n } else {\n super.focus();\n }\n }\n\n blur(): void {\n const input = this.shadowRoot?.querySelector(`.search-input`) as HTMLInputElement | null;\n if (input) {\n input.blur();\n } else {\n super.blur();\n }\n };\n\n setContents(contents: NarrowedTextItem[]): void {\n while (this.firstChild) {\n this.firstChild.remove();\n }\n\n for (const item of contents) {\n const span = document.createElement(`span`);\n span.setAttribute(`data-value`, item.value);\n if (item.label !== undefined)\n span.setAttribute(`data-label`, item.label);\n if (item.description !== undefined)\n span.setAttribute(`data-description`, item.description);\n if (item.iconName !== undefined)\n span.setAttribute(`data-icon-name`, item.iconName);\n this.appendChild(span);\n }\n\n this._selectedValues.clear();\n const selectedValues = contents.filter(i => i.selected).map(i => i.value);\n for (const v of selectedValues) {\n this._selectedValues.add(v);\n }\n\n if (selectedValues.length > 0) {\n this.requestUpdate();\n }\n }\n\n deleteItem(value: string): boolean {\n const el = this.querySelector(`[data-value=\"${CSS.escape(value)}\"]`);\n if (!el)\n return false;\n el.remove();\n this._selectedValues.delete(value);\n return true;\n }\n\n #onBlur = (): void => {\n this._isFocused = false;\n this.tickled.clearTickled();\n this.dispatchEvent(new CustomEvent(`narrowed-text-blur`, { bubbles: true, composed: true }));\n };\n\n #onFocusTriggerClick = (): void => {\n const input = this.shadowRoot?.querySelector(`.search-input`) as HTMLInputElement | null;\n input?.focus();\n };\n\n #onContainerClick = (e: MouseEvent): void => {\n const target = e.target as HTMLElement;\n if (target.classList.contains(`item`) || target.closest(`.item`)) {\n return;\n }\n const input = this.shadowRoot?.querySelector(`.search-input`) as HTMLInputElement | null;\n input?.focus();\n };\n\n #onItemClick(item: NarrowedTextItem): void {\n this._selectItem(item);\n const clickedIndex = this._filteredItems.findIndex(i => i.value === item.value);\n if (clickedIndex >= 0) {\n this.tickled.handlePointerEnter(clickedIndex);\n }\n const input = this.shadowRoot?.querySelector(`.search-input`) as HTMLInputElement | null;\n input?.focus();\n }\n\n private _selectItem(item: NarrowedTextItem, clearFilter = true): void {\n if (this.selectionMode === `single`) {\n if (this._selectedValues.has(item.value) && !this.requiredSelection) {\n this._selectedValues.clear();\n } else {\n this._selectedValues.clear();\n this._selectedValues.add(item.value);\n }\n } else {\n if (this._selectedValues.has(item.value)) {\n if (!this.requiredSelection || this._selectedValues.size > 1) {\n this._selectedValues.delete(item.value);\n }\n } else {\n this._selectedValues.add(item.value);\n }\n }\n\n this._updateValueFromSelected();\n this._updateFilteredItems();\n\n const selectedItems = this._computedItems.filter(i => this._selectedValues.has(i.value));\n\n this.dispatchEvent(new CustomEvent<NarrowedTextChangeDetail>(`change`, {\n detail: { item, query: this._query, selected: selectedItems },\n bubbles: true,\n composed: true,\n }));\n\n if (clearFilter && !this.preserveFilter && this._query) {\n this._query = ``;\n this._updateFilteredItems();\n }\n }\n\n private _updateValueFromSelected(): void {\n if (this.selectionMode === `single`) {\n this.value = [...this._selectedValues][0] ?? ``;\n } else {\n this.value = [...this._selectedValues].join(`,`);\n }\n }\n\n #renderItem(item: NarrowedTextItem, index: number) {\n const isTickled = this.tickled.isTickled(index);\n const isSelected = this._selectedValues.has(item.value);\n const label = item.label ?? item.value;\n\n return html`\n <div\n class=\"item ${isTickled ? `tickled` : ``} ${isSelected ? `selected` : ``}\"\n part=\"item\"\n role=\"option\"\n aria-selected=${isSelected}\n @click=${() => this.#onItemClick(item)}\n @pointerenter=${() => this.tickled.handlePointerEnter(index)}\n >\n ${item.iconName ? html`<ixfx-icon class=\"item-icon\" name=${item.iconName}></ixfx-icon>` : nothing}\n <span class=\"item-label\" part=\"label\" data-item-value=${item.value}>${label}</span>\n </div>\n `;\n }\n\n protected override render() {\n const isScrollable = this.width !== undefined || this.height !== undefined;\n\n return html`\n <slot @slotchange=${this.#handleSlotChange} style=\"display: none;\"></slot>\n <div\n class=\"container ${this.orientation} ${isScrollable ? `scrollable` : ``} ${this._isFocused ? `focused` : ``}\"\n part=\"container\"\n style=${this._getContainerStyle()}\n data-input-mode=${this.tickled.inputMode}\n @click=${this.#onContainerClick}\n >\n <input\n type=\"text\"\n class=\"search-input\"\n .value=${this._query}\n autocomplete=\"off\"\n spellcheck=\"false\"\n aria-label=\"Search items\"\n @input=${this.#onInput}\n @keydown=${this.#onKeyDown}\n @focus=${this.#onFocus}\n @blur=${this.#onBlur}\n >\n <div class=\"focus-trigger\" @click=${this.#onFocusTriggerClick}></div>\n <div \n class=\"items\" \n part=\"items\" \n role=\"listbox\"\n @pointerleave=${(e: PointerEvent) => this.tickled.handlePointerLeave(e)}\n >\n ${this._filteredItems.map((item, i) => this.#renderItem(item, i))}\n </div>\n </div>\n `;\n }\n\n private _getContainerStyle(): string {\n const styles: string[] = [];\n if (this.width) {\n styles.push(`width: ${this.width}`);\n }\n if (this.height) {\n styles.push(`height: ${this.height}`);\n }\n return styles.join(`; `);\n }\n\n static override styles = [themeFallbacks, tickledStyles, tickledItemStyles, css`\n :host {\n display: inline-block;\n position: relative;\n font-family: var(--font-family, system-ui, sans-serif);\n font-size: var(--text-m, 12px);\n color: var(--surface-2-text);\n --item-padding: var(--space-xs, 3px) var(--space-m, 8px);\n --item-border-radius: var(--radius-s, 3px);\n --item-icon-spacing: var(--space-xs, 3px);\n }\n\n .container {\n display: flex;\n position: relative;\n min-width: min-content;\n min-height: min-content;\n }\n\n .container.horizontal {\n flex-direction: row;\n align-items: stretch;\n }\n\n .container.vertical {\n flex-direction: column;\n }\n\n .container.scrollable {\n scrollbar-width: none;\n overflow-x: auto;\n overflow-y: hidden;\n .vertical {\n overflow-x: hidden;\n overflow-y: auto;\n }\n }\n\n .container.focused {\n outline: 2px solid var(--accent);\n outline-offset: 2px;\n }\n\n .search-input {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n opacity: 0;\n cursor: text;\n z-index: 1;\n pointer-events: none;\n }\n\n .search-input:focus {\n outline: none;\n }\n\n .focus-trigger {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n z-index: 0;\n cursor: text;\n }\n\n .items {\n display: flex;\n flex-wrap: wrap;\n gap: var(--item-spacing, var(--space-xs, 3px));\n align-items: center;\n width: 100%;\n height: 100%;\n min-height: var(--item-height, 28px);\n position: relative;\n z-index: 2;\n pointer-events: auto;\n }\n\n .container.horizontal .items {\n flex-direction: row;\n }\n\n .container.vertical .items {\n flex-direction: column;\n align-items: stretch;\n }\n\n :host([nowrap]) .items {\n flex-wrap: nowrap;\n }\n\n .item-icon {\n flex-shrink: 0;\n width: 1em;\n height: 1em;\n }\n\n .item-label {\n flex: 1;\n overflow: hidden;\n text-overflow: ellipsis;\n color: var(--item-label-color, var(--item-text, inherit));\n font-style: var(--item-label-font-style, var(--item-label-font-style-default, normal));\n text-decoration: var(--item-label-text-decoration, var(--item-label-text-decoration-default, none));\n text-underline-offset: var(--item-label-text-underline-offset, auto);\n }\n\n .item.selected .item-label {\n --item-label-color: var(--item-text-selected);\n --item-label-font-style: var(--item-label-font-style-selected, italic);\n }\n\n .item.tickled .item-label {\n --item-label-text-decoration: var(--item-label-text-decoration-tickled, underline dotted);\n --item-label-text-underline-offset: var(--item-label-text-underline-offset-tickled, 3px);\n }\n\n .item.active .item-label {\n --item-label-color: var(--item-text-selected);\n }\n\n .item.selected.tickled .item-label {\n --item-label-color: var(--item-text-selected);\n --item-label-font-style: var(--item-label-font-style-selected, italic);\n --item-label-text-decoration: var(--item-label-text-decoration-tickled, underline dotted);\n --item-label-text-underline-offset: var(--item-label-text-underline-offset-tickled, 3px);\n }\n\n ::highlight(narrowed-text-highlight) {\n background: var(--highlight-background, var(--accent));\n color: var(--highlight-color, var(--accent-text, #fff));\n border-radius: 2px;\n padding: 0 1px;\n }\n `];\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'ixfx-narrowed-text': NarrowedTextElement;\n }\n}\n"],"mappings":"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"}
|
package/dist/panel.d.ts
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { a as TitlebarToggleDetail, c as TitlebarVariant, i as TitlebarOrientation, o as TitlebarToggleEvent, s as TitlebarToggleInteraction, t as TitlebarCloseEvent } from "./titlebar-
|
|
1
|
+
import { a as TitlebarToggleDetail, c as TitlebarVariant, i as TitlebarOrientation, o as TitlebarToggleEvent, s as TitlebarToggleInteraction, t as TitlebarCloseEvent } from "./titlebar-Bj5pfdw_.js";
|
|
2
2
|
import { LitElement } from "lit";
|
|
3
3
|
//#region src/panel/panel.d.ts
|
|
4
4
|
/** Backwards-compatible aliases: canonical types now live in `../titlebar/titlebar.js`. */
|
package/dist/plots.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { c as computeColour, i as PlotMultiAxis, l as parseColourScaleAttr, n as PlotSingleAxis, o as PlotDataSeries, r as PlotHistogram, s as applyAgeModification, t as PlotXyAxis, u as readBaseColour } from "./xy-axis-
|
|
1
|
+
import { c as computeColour, i as PlotMultiAxis, l as parseColourScaleAttr, n as PlotSingleAxis, o as PlotDataSeries, r as PlotHistogram, s as applyAgeModification, t as PlotXyAxis, u as readBaseColour } from "./xy-axis-VrX8dmvS.js";
|
|
2
2
|
export { PlotDataSeries, PlotHistogram, PlotMultiAxis, PlotSingleAxis, PlotXyAxis, applyAgeModification, computeColour, parseColourScaleAttr, readBaseColour };
|
package/dist/select-horiz.js
CHANGED
|
@@ -1,8 +1,8 @@
|
|
|
1
|
-
import { t as TickledController } from "./tickled-controller-
|
|
1
|
+
import { t as TickledController } from "./tickled-controller-C66DgJHl.js";
|
|
2
2
|
import { n as tickledStyles, t as tickledItemStyles } from "./tickled-styles-BrAHEj1q.js";
|
|
3
3
|
import { t as themeFallbacks } from "./fallbacks-DNI9xt0F.js";
|
|
4
4
|
import { n as safeCustomElement, t as __decorate } from "./decorate-VRK8rslU.js";
|
|
5
|
-
import "./interaction-
|
|
5
|
+
import "./interaction-Cr13azbM.js";
|
|
6
6
|
import { t as scrollFadeStyles } from "./scroll-fade-CAs1EabA.js";
|
|
7
7
|
import { t as WheelNudgeMixin } from "./wheel-nudge-D5rmht3v.js";
|
|
8
8
|
import { LitElement, css, html } from "lit";
|
|
@@ -156,7 +156,7 @@ declare class SplitLayoutElement extends LitElement {
|
|
|
156
156
|
private _onPointerUp;
|
|
157
157
|
private _emitResize;
|
|
158
158
|
private _emitChange;
|
|
159
|
-
protected render(): import("lit").TemplateResult<1
|
|
159
|
+
protected render(): typeof nothing | import("lit").TemplateResult<1>;
|
|
160
160
|
private _getTrackSizes;
|
|
161
161
|
private _resolveTracks;
|
|
162
162
|
private _renderGutter;
|
|
@@ -176,4 +176,4 @@ declare global {
|
|
|
176
176
|
}
|
|
177
177
|
//#endregion
|
|
178
178
|
export { SplitExpandEvent as _, LayoutNode as a, SplitResizeEvent as b, PanelNode as c, SplitChangeEvent as d, SplitCloseDetail as f, SplitExpandDetail as g, SplitCollapseEvent as h, GroupNode as i, SnapshotNode as l, SplitCollapseDetail as m, SplitPanelElement as n, LayoutSnapshot as o, SplitCloseEvent as p, Axis as r, PanelInfo as s, SplitLayoutElement as t, SplitChangeDetail as u, SplitLayoutElementEventMap as v, WhenSmall as x, SplitResizeDetail as y };
|
|
179
|
-
//# sourceMappingURL=split-layout-
|
|
179
|
+
//# sourceMappingURL=split-layout-JK3xWVX2.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"split-layout-
|
|
1
|
+
{"version":3,"file":"split-layout-JK3xWVX2.d.ts","names":[],"sources":["../src/split-layout/types.ts","../src/split-layout/split-panel.ts","../src/split-layout/split-layout.ts"],"mappings":";;KAAY;KAEA;UAEK;EACf;EACA;EACA,IAAI;EACJ;EACA;EACA;EACA;EACA,WAAW;EACX;EACA;;UAGe;EACf;EACA;EACA,IAAI;EACJ,MAAM;EACN,UAAU;EACV;EACA;;KAGU,aAAa,YAAY;UAEpB;EACf;EACA;EACA;EACA;EACA,WAAW;;UAGI;EACf;EACA,MAAM;;UAGS;EACf;EACA,IAAI;EACJ;EACA;EACA;EACA;EACA;EACA;EACA,WAAW;;UAGI;EACf,OAAO;EACP;;KAGU,mBAAmB,YAAY;UAE1B;EACf;EACA;;KAGU,qBAAqB,YAAY;UAE5B;EACf;EACA;;KAGU,mBAAmB,YAAY;UAE1B;EACf;EACA;;KAGU,kBAAkB,YAAY;UAEzB;EACf,QAAQ;;KAGE,mBAAmB,YAAY;UAE1B;EACf,qBAAqB;EACrB,uBAAuB;EACvB,qBAAqB;EACrB,oBAAoB;EACpB,qBAAqB;;;;cCvFV,0BAA0B;EAErC;EAGA;EAGA;EAGA;EAGA;EAGA;EAGA;EAGA;EAGA;EAES,wBAAM;SAIC,sBAAM;;QAiBhB;YACI;IACR,oBAAoB;;;;;cC9CX,2BAA2B;EAEtC,WAAW;EAGX;EAGA;EAGA;UAGQ;UAGA;UAGA;UAEA;UACA;UACA;UACA;EASC;EAKA;EAKA;UAID;UAcA;MAaJ,UAAU;EAuBd,aAAa;EAMb,UAAU,GAAG;EAUb,SAAS,oBAAoB;EAY7B,SAAS,oBAAoB,wBAAwB;EA4BrD,SAAS,iBAAiB;EAI1B,OAAO,iBAAiB;EAIxB,OAAO,iBAAiB;EAOxB,WAAW,iBAAiB;;;;;;EAmC5B,kBAAkB;;;;;;;;;EAelB,gBAAgB,qBAAqB,mBAAmB,iBAAiB;UAwBjE;UAiDA;UAQA;UAOA;UAwBA;UAQA;UAKA;UAMA;UAiFA;UAWA;UAuBA;UAeA;UAsBA;UAIA;UAMA;UAcA;YAYW,iBAAM,wBAAA;UA2BjB;UAQA;UAgCA;SAsBQ,sBAAM;;QA0GhB;YACI;IACR,qBAAqB;;YAGb;IACR,qBAAqB,YAAY;IACjC,uBAAuB,YAAY;IACnC,qBAAqB,YAAY;IACjC,oBAAoB,YAAY;IAChC,qBAAqB,YAAY"}
|
package/dist/split-layout.d.ts
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { t as SplitLayoutElement } from "./split-layout-
|
|
1
|
+
import { t as SplitLayoutElement } from "./split-layout-JK3xWVX2.js";
|
|
2
2
|
export { SplitLayoutElement };
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import "./icon-
|
|
1
|
+
import "./icon-CDGprSdE.js";
|
|
2
2
|
import { LitElement, PropertyValues } from "lit";
|
|
3
3
|
import { CommandRegistry } from "@clinth/ui-commands";
|
|
4
4
|
//#region src/tabs/tab-list-item.d.ts
|
|
@@ -86,4 +86,4 @@ declare global {
|
|
|
86
86
|
}
|
|
87
87
|
//#endregion
|
|
88
88
|
export { TabListReorderDetail as a, TabListElement as i, TabListChangeEvent as n, TabListReorderEvent as o, TabListDragMode as r, TabListItemElement as s, TabListChangeDetail as t };
|
|
89
|
-
//# sourceMappingURL=tab-list-
|
|
89
|
+
//# sourceMappingURL=tab-list-CGyPt07Z.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"tab-list-
|
|
1
|
+
{"version":3,"file":"tab-list-CGyPt07Z.d.ts","names":[],"sources":["../src/tabs/tab-list-item.ts","../src/tabs/tab-list.ts"],"mappings":";;;;;;;;;;;cAiBa,2BAA2B;EAEtC;EAGA;EAGA;EAGA;EAGA;EAGA,UAAU;UAEO;UACA;UACT;UACA;UACA;EAEC;EAgBA;EAcA,QAAQ,SAAS;UAQlB;UAUA;UAWA;UAIA;;;;;UAQA;UAiBA;EAKC;EAKA,wBAAM;UA8BP;SAWQ,sBAAM;;QAmKhB;YACI;IACR,sBAAsB;;;;;;;;;;KC3Ud;WACD;WACA;WACA;;KAGC,qBAAqB,YAAY;KAEjC;WACD;WACA;WACA;;KAGC,sBAAsB,YAAY;KAElC;cAMC,uBAAuB;;EAElC;EAGA;EAGA;EAGA;EAGA;EAGA,UAAU;EA4BD,wBAAM;EAsDN;EAUA,QAAQ,mBAAmB;EAoGpC,sBAAkB;EAwBlB,cAAc,IAAI;SAwaX,sBAAM;;QAyKP;YACI;IACR,iBAAiB"}
|
package/dist/tabs.d.ts
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { a as TabListReorderDetail, i as TabListElement, n as TabListChangeEvent, o as TabListReorderEvent, r as TabListDragMode, t as TabListChangeDetail } from "./tab-list-
|
|
1
|
+
import { a as TabListReorderDetail, i as TabListElement, n as TabListChangeEvent, o as TabListReorderEvent, r as TabListDragMode, t as TabListChangeDetail } from "./tab-list-CGyPt07Z.js";
|
|
2
2
|
export { TabListChangeDetail, TabListChangeEvent, TabListDragMode, TabListElement, TabListReorderDetail, TabListReorderEvent };
|
|
@@ -141,6 +141,17 @@ declare class TickledController<T = number> implements ReactiveController {
|
|
|
141
141
|
* Get the currently tickled item id
|
|
142
142
|
*/
|
|
143
143
|
get tickledId(): T | undefined;
|
|
144
|
+
/**
|
|
145
|
+
* The item currently under the cursor, or `undefined`. Alias of `tickledId`
|
|
146
|
+
* for parity with other controllers.
|
|
147
|
+
*/
|
|
148
|
+
get current(): T | undefined;
|
|
149
|
+
/**
|
|
150
|
+
* Move the cursor programmatically (e.g. to reveal a match or re-seat it
|
|
151
|
+
* after the item set changed). Does not change the input mode. Alias of
|
|
152
|
+
* `setTickled`.
|
|
153
|
+
*/
|
|
154
|
+
focus(id: T | undefined): void;
|
|
144
155
|
/**
|
|
145
156
|
* Check if a specific item is tickled
|
|
146
157
|
*/
|
|
@@ -194,4 +205,4 @@ declare class TickledController<T = number> implements ReactiveController {
|
|
|
194
205
|
}
|
|
195
206
|
//#endregion
|
|
196
207
|
export { TickledItem as i, TickledController as n, TickledControllerConfig as r, InputMode as t };
|
|
197
|
-
//# sourceMappingURL=tickled-controller-
|
|
208
|
+
//# sourceMappingURL=tickled-controller-Bn3YdQsM.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"tickled-controller-
|
|
1
|
+
{"version":3,"file":"tickled-controller-Bn3YdQsM.d.ts","names":[],"sources":["../src/interaction/tickled-controller.ts"],"mappings":";;;;;KAKY,YAAY;;;;WAIb,IAAI;;;;WAKJ;;;;;KAMC;;;;KAKA,wBAAwB;;;;EAIlC,gBAAgB,cAAc,YAAY;;;;;;EAO1C,YAAY,IAAI;;;;;;;;;;;;;;;;;;;;;;;EAwBhB;;;;EAKA,mBAAmB;;;;;;EAOnB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;cA0DW,kBAAkB,uBAAuB;UAC5C;UACA;UACA;UACA;iBAEO;iBACA;iBACA;iBACA;0BAES;EAIZ,YAAA,MAAM,wBAAwB,QAAQ,wBAAwB;EAO1E;EAOA;;;;MAUI,aAAa;;;;MAOb,aAAa;;;;;MAQb,WAAW;;;;;;EASf,MAAM,IAAI;;;;EAOV,UAAU,IAAI;;;;;;iBASC;;;;;aAiBJ;;;;;;EASX,mBAAmB,IAAI;;;;;;EAiCvB,mBAAmB,IAAI;;;;;;;EAYvB,yBAAyB,oDAAoD;;;;;EAkE7E,WAAW,IAAI;;;;;;EAmBf;;;;;EAmBA,aAAa,MAAM"}
|
|
@@ -100,6 +100,21 @@ var TickledController = class TickledController {
|
|
|
100
100
|
return this._tickledId;
|
|
101
101
|
}
|
|
102
102
|
/**
|
|
103
|
+
* The item currently under the cursor, or `undefined`. Alias of `tickledId`
|
|
104
|
+
* for parity with other controllers.
|
|
105
|
+
*/
|
|
106
|
+
get current() {
|
|
107
|
+
return this._tickledId;
|
|
108
|
+
}
|
|
109
|
+
/**
|
|
110
|
+
* Move the cursor programmatically (e.g. to reveal a match or re-seat it
|
|
111
|
+
* after the item set changed). Does not change the input mode. Alias of
|
|
112
|
+
* `setTickled`.
|
|
113
|
+
*/
|
|
114
|
+
focus(id) {
|
|
115
|
+
this.setTickled(id);
|
|
116
|
+
}
|
|
117
|
+
/**
|
|
103
118
|
* Check if a specific item is tickled
|
|
104
119
|
*/
|
|
105
120
|
isTickled(id) {
|
|
@@ -228,4 +243,4 @@ var TickledController = class TickledController {
|
|
|
228
243
|
//#endregion
|
|
229
244
|
export { TickledController as t };
|
|
230
245
|
|
|
231
|
-
//# sourceMappingURL=tickled-controller-
|
|
246
|
+
//# sourceMappingURL=tickled-controller-C66DgJHl.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"tickled-controller-C66DgJHl.js","names":[],"sources":["../src/interaction/tickled-controller.ts"],"sourcesContent":["import type { ReactiveController, ReactiveControllerHost } from 'lit';\n\n/**\n * Represents an item that can be tickled (highlighted via hover or keyboard navigation)\n */\nexport type TickledItem<T = unknown> = {\n /**\n * Unique identifier for the item (e.g., index, id, path)\n */\n readonly id: T;\n\n /**\n * Whether the item is currently enabled/interactive\n */\n readonly enabled?: boolean;\n};\n\n/**\n * Input mode determines which mechanism controls the tickled state\n */\nexport type InputMode = `keyboard` | `mouse`;\n\n/**\n * Configuration for TickledController\n */\nexport type TickledControllerConfig<T> = {\n /**\n * Function to retrieve all items that can be tickled\n */\n getItems: () => ReadonlyArray<TickledItem<T>>;\n\n /**\n * Optional callback when an item becomes tickled\n * Use this for side effects like opening submenus\n * @param id - The id of the newly tickled item, or undefined if nothing is tickled\n */\n onTickle?: (id: T | undefined) => void;\n\n /**\n * Optional callback fired after any state change (tickled id or input mode)\n * Use this to sync DOM attributes for slotted content that can't use reactive rendering\n *\n * For components that render items directly, this is usually not needed as\n * Lit's reactive rendering will handle updates automatically via requestUpdate()\n *\n * @example\n * ```ts\n * onStateChange: () => {\n * // Sync data-tickled attributes for slotted items\n * const items = this.getItems();\n * items.forEach((item, i) => {\n * if (this.tickled.isTickled(i)) {\n * item.setAttribute('data-tickled', '');\n * } else {\n * item.removeAttribute('data-tickled');\n * }\n * });\n * }\n * ```\n */\n onStateChange?: () => void;\n\n /**\n * Optional initial input mode (defaults to 'mouse')\n */\n initialInputMode?: InputMode;\n\n /**\n * Whether keyboard navigation wraps from last to first and vice versa.\n * - 'stop' (default): navigation stops at the boundary\n * - 'wrap': navigation wraps around\n */\n itemWrap?: `stop` | `wrap`;\n};\n\n/**\n * ReactiveController that manages \"tickled\" state for interactive lists.\n *\n * A \"tickled\" item is one that is under active attention via hover (mouse mode)\n * or keyboard focus (keyboard mode). Only one item can be tickled at a time.\n *\n * The input mode determines which mechanism controls tickled state:\n * - Mouse mode: hover controls tickled, keyboard navigation ignored\n * - Keyboard mode: keyboard navigation controls tickled, hover ignored\n *\n * Last interaction wins - any mouse hover switches to mouse mode, any keyboard\n * navigation switches to keyboard mode.\n *\n * ## Global Mouse Tracking\n *\n * This controller uses a single, ref-counted global `pointermove` listener (shared\n * across all instances) to track actual mouse movement. This prevents `pointerenter`\n * events caused by content scrolling from incorrectly switching to mouse mode when\n * the user is actually using keyboard navigation. The listener is attached when the\n * first host connects and removed once the last host disconnects.\n *\n * @example\n * ```ts\n * class MyList extends LitElement {\n * private tickled = new TickledController(this, {\n * getItems: () => this.items.map((item, i) => ({ id: i, enabled: !item.disabled })),\n * onTickle: (id) => {\n * // Optional: perform side effect when item is tickled\n * console.log('Tickled item:', id);\n * }\n * });\n *\n * render() {\n * return html`\n * <ul @pointerleave=${(e) => this.tickled.handlePointerLeave(e)}>\n * ${this.items.map((item, i) => html`\n * <li\n * class=\"item ${this.tickled.isTickled(i) ? 'tickled' : ''}\"\n * @pointerenter=${() => this.tickled.handlePointerEnter(i)}\n * >${item.label}</li>\n * `)}\n * </ul>\n * `;\n * }\n *\n * private handleKeyDown(e: KeyboardEvent) {\n * if (e.key === 'ArrowDown') {\n * this.tickled.handleKeyboardNavigation('next');\n * } else if (e.key === 'ArrowUp') {\n * this.tickled.handleKeyboardNavigation('previous');\n * }\n * }\n * }\n * ```\n */\nexport class TickledController<T = number> implements ReactiveController {\n private host: ReactiveControllerHost;\n private config: TickledControllerConfig<T>;\n private _tickledId: T | undefined = undefined;\n private _inputMode: InputMode;\n\n private static _lastMouseClientX: number = Number.NaN;\n private static _lastMouseClientY: number = Number.NaN;\n private static _mouseMovedSinceKeyboard: boolean = true;\n private static _listenerRefCount: number = 0;\n\n private static readonly _onGlobalPointerMove = (e: PointerEvent): void => {\n TickledController.handleGlobalPointerMove(e.clientX, e.clientY);\n };\n\n constructor(host: ReactiveControllerHost, config: TickledControllerConfig<T>) {\n this.host = host;\n this.config = config;\n this._inputMode = config.initialInputMode ?? `mouse`;\n host.addController(this);\n }\n\n hostConnected(): void {\n if (TickledController._listenerRefCount === 0) {\n document.addEventListener(`pointermove`, TickledController._onGlobalPointerMove, { passive: true });\n }\n TickledController._listenerRefCount++;\n }\n\n hostDisconnected(): void {\n TickledController._listenerRefCount--;\n if (TickledController._listenerRefCount === 0) {\n document.removeEventListener(`pointermove`, TickledController._onGlobalPointerMove);\n }\n }\n\n /**\n * Get the current input mode\n */\n get inputMode(): InputMode {\n return this._inputMode;\n }\n\n /**\n * Get the currently tickled item id\n */\n get tickledId(): T | undefined {\n return this._tickledId;\n }\n\n /**\n * The item currently under the cursor, or `undefined`. Alias of `tickledId`\n * for parity with other controllers.\n */\n get current(): T | undefined {\n return this._tickledId;\n }\n\n /**\n * Move the cursor programmatically (e.g. to reveal a match or re-seat it\n * after the item set changed). Does not change the input mode. Alias of\n * `setTickled`.\n */\n focus(id: T | undefined): void {\n this.setTickled(id);\n }\n\n /**\n * Check if a specific item is tickled\n */\n isTickled(id: T): boolean {\n return this._tickledId === id;\n }\n\n /**\n * Handle global pointer move event.\n * Called automatically by the global listener.\n * Tracks mouse movement to distinguish real hover from content scrolling.\n */\n private static handleGlobalPointerMove(clientX: number, clientY: number): void {\n if (!Number.isNaN(TickledController._lastMouseClientX)) {\n if (\n clientX !== TickledController._lastMouseClientX\n || clientY !== TickledController._lastMouseClientY\n ) {\n TickledController._mouseMovedSinceKeyboard = true;\n }\n }\n TickledController._lastMouseClientX = clientX;\n TickledController._lastMouseClientY = clientY;\n }\n\n /**\n * Check if actual mouse movement has occurred since last keyboard interaction.\n * Used to distinguish real hover/leave from content-scrolling-induced events.\n */\n static get hasMouseMovedSinceKeyboard(): boolean {\n return TickledController._mouseMovedSinceKeyboard;\n }\n\n /**\n * Handle pointer enter event on an item (mouse hover).\n * Only processes if actual mouse movement is detected (not content scrolling).\n * Switches to mouse mode and tickles the item.\n */\n handlePointerEnter(id: T): void {\n if (!TickledController._mouseMovedSinceKeyboard) {\n return;\n }\n\n const items = this.config.getItems();\n const item = items.find(item => item.id === id);\n if (item && item.enabled === false) {\n return;\n }\n\n const modeChanged = this._inputMode !== `mouse`;\n this._inputMode = `mouse`;\n\n const previousId = this._tickledId;\n this._tickledId = id;\n\n this.host.requestUpdate();\n\n if (previousId !== id && this.config.onTickle) {\n this.config.onTickle(id);\n }\n\n if ((previousId !== id || modeChanged) && this.config.onStateChange) {\n this.config.onStateChange();\n }\n }\n\n /**\n * Handle pointer leave event on an item.\n * Only clears tickled state if actual mouse movement is detected.\n * @param _e The pointer event (not used, but kept for API compatibility)\n */\n handlePointerLeave(_e: PointerEvent): void {\n if (TickledController._mouseMovedSinceKeyboard) {\n this.clearTickled();\n }\n }\n\n /**\n * Handle keyboard navigation.\n * Switches to keyboard mode and moves tickled state.\n *\n * @param direction - 'next', 'previous', 'first', 'last', or specific id\n */\n handleKeyboardNavigation(direction: `next` | `previous` | `first` | `last` | T): void {\n const modeChanged = this._inputMode !== `keyboard`;\n this._inputMode = `keyboard`;\n\n const items = this.config.getItems();\n const enabledItems = items.filter(item => item.enabled !== false);\n\n if (enabledItems.length === 0) {\n return;\n }\n\n let newId: T | undefined;\n\n if (direction === `first`) {\n newId = enabledItems[0].id;\n } else if (direction === `last`) {\n newId = enabledItems.at(-1)?.id;\n } else if (direction === `next` || direction === `previous`) {\n const currentIndex = enabledItems.findIndex(item => item.id === this._tickledId);\n const wrap = this.config.itemWrap === `wrap`;\n\n if (currentIndex === -1) {\n newId = direction === `next` ? enabledItems[0].id : enabledItems.at(-1)?.id;\n } else {\n const delta = direction === `next` ? 1 : -1;\n let newIndex = currentIndex + delta;\n\n if (newIndex >= 0 && newIndex < enabledItems.length) {\n newId = enabledItems[newIndex].id;\n } else if (wrap) {\n // Wrap around\n if (newIndex < 0) {\n newIndex = enabledItems.length - 1;\n } else {\n newIndex = 0;\n }\n newId = enabledItems[newIndex].id;\n }\n // If newIndex is out of bounds and wrap is disabled, keep current tickled item\n }\n } else {\n const item = enabledItems.find(item => item.id === direction);\n if (item) {\n newId = item.id;\n }\n }\n\n if (newId !== undefined) {\n const previousId = this._tickledId;\n this._tickledId = newId;\n this.host.requestUpdate();\n\n if (previousId !== newId && this.config.onTickle) {\n this.config.onTickle(newId);\n }\n\n if ((previousId !== newId || modeChanged) && this.config.onStateChange) {\n this.config.onStateChange();\n }\n }\n }\n\n /**\n * Manually set the tickled item (useful for programmatic control).\n * Does NOT change input mode.\n */\n setTickled(id: T | undefined): void {\n const previousId = this._tickledId;\n this._tickledId = id;\n this.host.requestUpdate();\n\n if (previousId !== id && this.config.onTickle) {\n this.config.onTickle(id);\n }\n\n if (previousId !== id && this.config.onStateChange) {\n this.config.onStateChange();\n }\n }\n\n /**\n * Clear the tickled state (e.g., on pointer leave).\n * Note: For pointer leave events, prefer using handlePointerLeave() which\n * checks for actual mouse movement.\n */\n clearTickled(): void {\n if (this._tickledId !== undefined) {\n this._tickledId = undefined;\n this.host.requestUpdate();\n\n if (this.config.onTickle) {\n this.config.onTickle(undefined);\n }\n\n if (this.config.onStateChange) {\n this.config.onStateChange();\n }\n }\n }\n\n /**\n * Manually set the input mode.\n * When switching to keyboard mode, resets the mouse movement tracking.\n */\n setInputMode(mode: InputMode): void {\n if (this._inputMode !== mode) {\n this._inputMode = mode;\n this.host.requestUpdate();\n\n if (mode === `keyboard`) {\n TickledController._mouseMovedSinceKeyboard = false;\n }\n\n if (this.config.onStateChange) {\n this.config.onStateChange();\n }\n }\n }\n}\n"],"mappings":"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"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import "./icon-
|
|
1
|
+
import "./icon-CDGprSdE.js";
|
|
2
2
|
import { LitElement } from "lit";
|
|
3
3
|
//#region src/titlebar/titlebar.d.ts
|
|
4
4
|
type TitlebarOrientation = `horizontal` | `vertical`;
|
|
@@ -47,4 +47,4 @@ interface TitlebarElement {
|
|
|
47
47
|
}
|
|
48
48
|
//#endregion
|
|
49
49
|
export { TitlebarToggleDetail as a, TitlebarVariant as c, TitlebarOrientation as i, TitlebarElement as n, TitlebarToggleEvent as o, TitlebarElementEventMap as r, TitlebarToggleInteraction as s, TitlebarCloseEvent as t };
|
|
50
|
-
//# sourceMappingURL=titlebar-
|
|
50
|
+
//# sourceMappingURL=titlebar-Bj5pfdw_.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"titlebar-
|
|
1
|
+
{"version":3,"file":"titlebar-Bj5pfdw_.d.ts","names":[],"sources":["../src/titlebar/titlebar.ts"],"mappings":";;;KAOY;KACA;KACA;UAEK;WACN;;KAGC,sBAAsB,YAAY;KAClC,qBAAqB;UAEhB;EACf,QAAQ;EACR,OAAO;;;;;;;;;;cAYI,wBAAwB;EACP;EACwB;EACiB,aAAa;EACjB,SAAS;EAC7C;;EAEe;EACA;EACiB,mBAAmB;UAExE;UAaA;UASA;YAIW,wBAAM;SAoDT,sBAAM;;QAmNhB;YACI;IACR,iBAAiB;;;UAIJ;EACf,oBAAoB,gBAAgB,yBAClC,MAAM,GACN,WAAW,MAAM,iBAAiB,OAAO,wBAAwB,aACjE,oBAAoB,sCAEpB,cACA,UAAU,oCACV,oBAAoB"}
|
package/dist/titlebar.d.ts
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { a as TitlebarToggleDetail, c as TitlebarVariant, i as TitlebarOrientation, n as TitlebarElement, o as TitlebarToggleEvent, r as TitlebarElementEventMap, s as TitlebarToggleInteraction, t as TitlebarCloseEvent } from "./titlebar-
|
|
1
|
+
import { a as TitlebarToggleDetail, c as TitlebarVariant, i as TitlebarOrientation, n as TitlebarElement, o as TitlebarToggleEvent, r as TitlebarElementEventMap, s as TitlebarToggleInteraction, t as TitlebarCloseEvent } from "./titlebar-Bj5pfdw_.js";
|
|
2
2
|
export { TitlebarCloseEvent, TitlebarElement, TitlebarElementEventMap, TitlebarOrientation, TitlebarToggleDetail, TitlebarToggleEvent, TitlebarToggleInteraction, TitlebarVariant };
|