@m3e/web 2.5.10 → 2.5.12
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/dist/all.js +371 -125
- package/dist/all.js.map +1 -1
- package/dist/all.min.js +56 -56
- package/dist/all.min.js.map +1 -1
- package/dist/autocomplete.js +23 -5
- package/dist/autocomplete.js.map +1 -1
- package/dist/autocomplete.min.js +1 -1
- package/dist/autocomplete.min.js.map +1 -1
- package/dist/breadcrumb.js +1 -1
- package/dist/breadcrumb.js.map +1 -1
- package/dist/breadcrumb.min.js +1 -1
- package/dist/breadcrumb.min.js.map +1 -1
- package/dist/button.js +13 -7
- package/dist/button.js.map +1 -1
- package/dist/button.min.js +1 -1
- package/dist/button.min.js.map +1 -1
- package/dist/checkbox.js +5 -0
- package/dist/checkbox.js.map +1 -1
- package/dist/checkbox.min.js +1 -1
- package/dist/checkbox.min.js.map +1 -1
- package/dist/chips.js +2 -2
- package/dist/chips.js.map +1 -1
- package/dist/chips.min.js +1 -1
- package/dist/chips.min.js.map +1 -1
- package/dist/core.js +27 -23
- package/dist/core.js.map +1 -1
- package/dist/core.min.js +1 -1
- package/dist/core.min.js.map +1 -1
- package/dist/css-custom-data.json +5263 -5233
- package/dist/custom-elements.json +51230 -50306
- package/dist/fab.js +9 -9
- package/dist/fab.js.map +1 -1
- package/dist/fab.min.js +1 -1
- package/dist/fab.min.js.map +1 -1
- package/dist/form-field.js +4 -5
- package/dist/form-field.js.map +1 -1
- package/dist/form-field.min.js +2 -2
- package/dist/form-field.min.js.map +1 -1
- package/dist/html-custom-data.json +1693 -1666
- package/dist/icon-button.js +48 -42
- package/dist/icon-button.js.map +1 -1
- package/dist/icon-button.min.js +1 -1
- package/dist/icon-button.min.js.map +1 -1
- package/dist/menu.js +2 -2
- package/dist/menu.js.map +1 -1
- package/dist/menu.min.js +1 -1
- package/dist/menu.min.js.map +1 -1
- package/dist/option.js +13 -3
- package/dist/option.js.map +1 -1
- package/dist/option.min.js +1 -1
- package/dist/option.min.js.map +1 -1
- package/dist/paginator.js +1 -1
- package/dist/paginator.js.map +1 -1
- package/dist/paginator.min.js +2 -2
- package/dist/paginator.min.js.map +1 -1
- package/dist/radio-group.js +6 -1
- package/dist/radio-group.js.map +1 -1
- package/dist/radio-group.min.js +1 -1
- package/dist/radio-group.min.js.map +1 -1
- package/dist/select.js +18 -2
- package/dist/select.js.map +1 -1
- package/dist/select.min.js +1 -1
- package/dist/select.min.js.map +1 -1
- package/dist/split-button.js +1 -1
- package/dist/split-button.js.map +1 -1
- package/dist/split-button.min.js +1 -1
- package/dist/split-button.min.js.map +1 -1
- package/dist/src/autocomplete/AutocompleteElement.d.ts.map +1 -1
- package/dist/src/button/ButtonElement.d.ts +1 -0
- package/dist/src/button/ButtonElement.d.ts.map +1 -1
- package/dist/src/checkbox/CheckboxElement.d.ts.map +1 -1
- package/dist/src/core/shared/mixins/LinkButton.d.ts.map +1 -1
- package/dist/src/core/shared/tokens/DesignToken.d.ts +3 -0
- package/dist/src/core/shared/tokens/DesignToken.d.ts.map +1 -1
- package/dist/src/core/shared/tokens/MeasurementToken.d.ts +13 -7
- package/dist/src/core/shared/tokens/MeasurementToken.d.ts.map +1 -1
- package/dist/src/fab/styles/FabSizeToken.d.ts.map +1 -1
- package/dist/src/form-field/FormFieldElement.d.ts.map +1 -1
- package/dist/src/icon-button/IconButtonElement.d.ts +1 -0
- package/dist/src/icon-button/IconButtonElement.d.ts.map +1 -1
- package/dist/src/icon-button/styles/IconButtonSizeToken.d.ts.map +1 -1
- package/dist/src/menu/MenuElement.d.ts.map +1 -1
- package/dist/src/menu/MenuItemElementBase.d.ts.map +1 -1
- package/dist/src/option/OptionElement.d.ts.map +1 -1
- package/dist/src/option/OptionPanelElement.d.ts.map +1 -1
- package/dist/src/paginator/PaginatorElement.d.ts.map +1 -1
- package/dist/src/radio-group/RadioElement.d.ts.map +1 -1
- package/dist/src/select/SelectElement.d.ts.map +1 -1
- package/dist/src/split-button/SplitButtonElement.d.ts.map +1 -1
- package/dist/src/switch/SwitchElement.d.ts.map +1 -1
- package/dist/src/switch/styles/SwitchToken.d.ts.map +1 -1
- package/dist/src/theme/ThemeElement.d.ts +6 -0
- package/dist/src/theme/ThemeElement.d.ts.map +1 -1
- package/dist/src/theme/ThemeIconElement.d.ts +60 -0
- package/dist/src/theme/ThemeIconElement.d.ts.map +1 -0
- package/dist/src/theme/ThemeVariant.d.ts +3 -0
- package/dist/src/theme/ThemeVariant.d.ts.map +1 -0
- package/dist/src/theme/index.d.ts +2 -0
- package/dist/src/theme/index.d.ts.map +1 -1
- package/dist/switch.js +16 -11
- package/dist/switch.js.map +1 -1
- package/dist/switch.min.js +1 -1
- package/dist/switch.min.js.map +1 -1
- package/dist/theme.js +184 -11
- package/dist/theme.js.map +1 -1
- package/dist/theme.min.js +31 -31
- package/dist/theme.min.js.map +1 -1
- package/package.json +1 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"autocomplete.min.js","sources":["../../src/autocomplete/AutocompleteElement.ts"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-unsafe-declaration-merging */\r\nimport { css, CSSResultGroup, html, LitElement, PropertyValues } from \"lit\";\r\nimport { property } from \"lit/decorators.js\";\r\n\r\nimport {\r\n HtmlFor,\r\n prefersReducedMotion,\r\n scrollIntoViewIfNeeded,\r\n forcedColorsActive,\r\n setCustomState,\r\n deleteCustomState,\r\n addCustomState,\r\n customElement,\r\n MutationController,\r\n} from \"@m3e/web/core\";\r\n\r\nimport { ListKeyManager, M3eLiveAnnouncer } from \"@m3e/web/core/a11y\";\r\nimport { M3eOptGroupElement, M3eOptionElement, M3eOptionPanelElement } from \"@m3e/web/option\";\r\nimport type { M3eFormFieldElement } from \"@m3e/web/form-field\";\r\n\r\nimport { AutocompleteFilterMode } from \"./AutocompleteFilterMode\";\r\nimport { AutocompleteQueryEventDetail } from \"./AutocompleteQueryEventDetail\";\r\n\r\n/**\r\n * Enhances a text input with suggested options.\r\n *\r\n * @description\r\n * The `m3e-autocomplete` component augments a text input field with a dynamically positioned menu of filterable suggestions,\r\n * following Material Design 3 principles. It provides real-time filtering, keyboard navigation, automatic option activation,\r\n * and text highlighting to guide user selection. The component manages focus, selection state, and menu visibility while\r\n * integrating seamlessly with form field containers and supporting both required and optional selection modes.\r\n *\r\n * @example\r\n * The following example illustrates use of the `m3e-autocomplete` paired with a `m3e-form-field`.\r\n * ```html\r\n * <m3e-form-field>\r\n * <label slot=\"label\" for=\"fruit\">Choose your favorite fruit</label>\r\n * <input id=\"fruit\" />\r\n * </m3e-form-field>\r\n * <m3e-autocomplete for=\"fruit\">\r\n * <m3e-option>Apples</m3e-option>\r\n * <m3e-option>Oranges</m3e-option>\r\n * <m3e-option>Bananas</m3e-option>\r\n * <m3e-option>Grapes</m3e-option>\r\n * </m3e-autocomplete>\r\n * ```\r\n *\r\n * @tag m3e-autocomplete\r\n *\r\n * @attr auto-activate - Whether the first option should be automatically activated.\r\n * @attr case-sensitive - Whether filtering is case sensitive.\r\n * @attr filter - Mode in which to filter options.\r\n * @attr hide-selection-indicator - Whether to hide the selection indicator.\r\n * @attr hide-loading - Whether to hide the menu when loading options.\r\n * @attr hide-no-data - Whether to hide the menu when there are no options to show.\r\n * @attr loading - Whether options are being loaded.\r\n * @attr loading-label - The text announced and presented when loading options.\r\n * @attr no-data-label - The text announced and presented when no options are available for the current term.\r\n * @attr panel-class - Class or list of classes to be applied to the autocomplete's overlay panel.\r\n * @attr required - Whether the user is required to make a selection when interacting with the autocomplete.\r\n * @attr results-label - The text announced when available options change for the current term.\r\n *\r\n * @slot - Renders the options of the autocomplete.\r\n * @slot loading - Renders content when loading options.\r\n * @slot no-data - Renders content when there are no options to show.\r\n *\r\n * @fires toggle - Dispatched when the options menu opens or closes.\r\n * @fires query - Dispatched when the input is focused or when the user modifies its value.\r\n * @fires change - Dispatched when the committed value changes due to selecting an option or clearing the input.\r\n */\r\n@customElement(\"m3e-autocomplete\")\r\nexport class M3eAutocompleteElement extends HtmlFor(LitElement) {\r\n /** The styles of the element. */\r\n static override styles: CSSResultGroup = css`\r\n :host {\r\n display: contents;\r\n }\r\n .options {\r\n display: none;\r\n }\r\n `;\r\n\r\n /** @private */ private static __nextId = 0;\r\n\r\n /** @private */ readonly #id = `m3e-autocomplete-${M3eAutocompleteElement.__nextId}`;\r\n /** @private */ readonly #menuId = `${this.#id}-menu`;\r\n /** @private */ private _options = new Array<M3eOptionElement>();\r\n /** @private */ #clone?: HTMLElement;\r\n /** @private */ #ignoreFocusVisible = false;\r\n /** @private */ #menu?: M3eOptionPanelElement;\r\n /** @private */ #ignoreHideMenuOnBlur = false;\r\n /** @private */ #inputChanged = false;\r\n /** @private */ #hasFocus = false;\r\n /** @private */ #mutationAbortController?: AbortController;\r\n\r\n /** @private */ readonly #clickHandler = () => this.#handleClick();\r\n /** @private */ readonly #formFieldPointerDownHandler = () => this.#handleFormFieldPointerDown();\r\n /** @private */ readonly #focusHandler = () => this.#handleFocus();\r\n /** @private */ readonly #blurHandler = () => this.#handleBlur();\r\n /** @private */ readonly #keyDownHandler = (e: KeyboardEvent) => this.#handleKeyDown(e);\r\n /** @private */ readonly #inputHandler = (e: Event) => this.#handleInput(e);\r\n /** @private */ readonly #changeHandler = () => this.#handleChange();\r\n /** @private */ readonly #menuToggleHandler = (e: ToggleEvent) => this.#handleMenuToggle(e);\r\n /** @private */ readonly #menuPointerDownHandler = (e: PointerEvent) => this.#handleMenuPointerDown(e);\r\n /** @private */ readonly #menuPointerUpHandler = (e: PointerEvent) => this.#handleMenuPointerUp(e);\r\n /** @private */ #menuPressedOption?: M3eOptionElement;\r\n\r\n /** @private */ private readonly _listKeyManager = new ListKeyManager<M3eOptionElement>()\r\n .withWrap()\r\n .withHomeAndEnd()\r\n .withPageUpAndDown()\r\n .withVerticalOrientation()\r\n .withSkipPredicate((item) => item.disabled || item.hidden === true)\r\n .onActiveItemChange(() => {\r\n if (this._listKeyManager.activeItem) {\r\n this.#activateOption(this._listKeyManager.activeItem);\r\n }\r\n });\r\n\r\n constructor() {\r\n super();\r\n\r\n new MutationController(this, {\r\n config: {\r\n childList: true,\r\n subtree: true,\r\n },\r\n callback: () => this.#handleMutation(),\r\n });\r\n }\r\n\r\n /**\r\n * Whether to hide the selection indicator.\r\n * @default false\r\n */\r\n @property({ attribute: \"hide-selection-indicator\", type: Boolean }) hideSelectionIndicator = false;\r\n\r\n /**\r\n * Whether the user is required to make a selection when interacting with the autocomplete.\r\n * @default false\r\n */\r\n @property({ type: Boolean, reflect: true }) required = false;\r\n\r\n /**\r\n * Whether the first option should be automatically activated.\r\n * @default false\r\n */\r\n @property({ attribute: \"auto-activate\", type: Boolean }) autoActivate = false;\r\n\r\n /**\r\n * Whether filtering is case sensitive.\r\n * @default false\r\n */\r\n @property({ attribute: \"case-sensitive\", type: Boolean }) caseSensitive = false;\r\n\r\n /**\r\n * Mode in which to filter options.\r\n * @default \"contains\"\r\n */\r\n @property({\r\n converter: {\r\n fromAttribute(value: string | null): AutocompleteFilterMode {\r\n if (value === null) return \"contains\";\r\n if (value === \"starts-with\" || value === \"ends-with\" || value === \"contains\" || value === \"none\") {\r\n return value;\r\n }\r\n return \"contains\";\r\n },\r\n },\r\n })\r\n filter: AutocompleteFilterMode | ((option: M3eOptionElement, term: string) => boolean) = \"contains\";\r\n\r\n /**\r\n * Whether options are being loaded.\r\n * @default false\r\n */\r\n @property({ type: Boolean }) loading = false;\r\n\r\n /**\r\n * Whether to hide the menu when there are no options to show.\r\n * @default false\r\n */\r\n @property({ attribute: \"hide-no-data\", type: Boolean }) hideNoData = false;\r\n\r\n /**\r\n * Whether to hide the menu when loading options.\r\n * @default false\r\n */\r\n @property({ attribute: \"hide-loading\", type: Boolean }) hideLoading = false;\r\n\r\n /**\r\n * The text announced and presented when loading options.\r\n * @default \"Loading...\"\r\n */\r\n @property({ attribute: \"loading-label\" }) loadingLabel = \"Loading...\";\r\n\r\n /**\r\n * The text announced and presented when no options are available for the current term.\r\n * @default \"No options\"\r\n */\r\n @property({ attribute: \"no-data-label\" }) noDataLabel = \"No options\";\r\n\r\n /**\r\n * The text announced when available options change for the current term.\r\n * @default (count) => `${count} options`\r\n */\r\n @property({ attribute: \"results-label\" }) resultsLabel: string | ((count: number) => string) = (count) =>\r\n `${count} options`;\r\n\r\n /**\r\n * Class or list of classes to be applied to the autocomplete's overlay panel.\r\n * @default \"\"\r\n */\r\n @property({ attribute: \"panel-class\" }) panelClass = \"\";\r\n\r\n /** The options that can be selected. */\r\n get options(): readonly M3eOptionElement[] {\r\n return this._options ?? [];\r\n }\r\n\r\n /** The selected option. */\r\n get selected(): M3eOptionElement | null {\r\n return this.options.find((x) => x.selected) ?? null;\r\n }\r\n\r\n /** The selected (enabled) value. */\r\n get value(): string | null {\r\n const selected = this.selected;\r\n return selected && !selected.disabled ? selected.value : null;\r\n }\r\n\r\n /** @private */\r\n get #options(): readonly M3eOptionElement[] {\r\n return this._listKeyManager?.items ?? [];\r\n }\r\n\r\n /** @private */\r\n get #input(): HTMLInputElement | null {\r\n return this.control ? <HTMLInputElement>this.control : null;\r\n }\r\n\r\n /** @private */\r\n get #hasNoDataSlot(): boolean {\r\n return (this.#clone?.querySelector(\"[slot='no-data']\") ?? null) !== null;\r\n }\r\n\r\n /** @private */\r\n get #hasLoadingSlot(): boolean {\r\n return (this.#clone?.querySelector(\"[slot='loading']\") ?? null) !== null;\r\n }\r\n\r\n /** @private */\r\n get #shouldShowMenu(): boolean {\r\n return (\r\n this.#options.some((x) => x.hidden === false) ||\r\n (this.loading && !this.hideLoading && this.loadingLabel.length > 0) ||\r\n (!this.loading && !this.hideNoData && this.noDataLabel.length > 0)\r\n );\r\n }\r\n\r\n /** @private */\r\n get #formField(): M3eFormFieldElement | null {\r\n return this.control?.closest(\"m3e-form-field\") ?? null;\r\n }\r\n\r\n /** @inheritdoc */\r\n override attach(control: HTMLElement): void {\r\n if (!(control instanceof HTMLInputElement)) return;\r\n\r\n super.attach(control);\r\n\r\n control.autocomplete = \"off\";\r\n control.role = \"combobox\";\r\n control.ariaAutoComplete = \"list\";\r\n control.ariaExpanded = \"false\";\r\n\r\n control.addEventListener(\"click\", this.#clickHandler);\r\n control.addEventListener(\"focus\", this.#focusHandler);\r\n control.addEventListener(\"blur\", this.#blurHandler);\r\n control.addEventListener(\"keydown\", this.#keyDownHandler);\r\n control.addEventListener(\"input\", this.#inputHandler);\r\n control.addEventListener(\"change\", this.#changeHandler);\r\n\r\n this.#formField?.addEventListener(\"pointerdown\", this.#formFieldPointerDownHandler);\r\n }\r\n\r\n /** @inheritdoc */\r\n override detach(): void {\r\n if (this.control) {\r\n this.#formField?.removeEventListener(\"pointerdown\", this.#formFieldPointerDownHandler);\r\n\r\n this.control.role = null;\r\n this.control.ariaAutoComplete = null;\r\n this.control.ariaExpanded = null;\r\n\r\n this.control.removeEventListener(\"click\", this.#clickHandler);\r\n this.control.removeEventListener(\"focus\", this.#focusHandler);\r\n this.control.removeEventListener(\"blur\", this.#blurHandler);\r\n this.control.removeEventListener(\"keydown\", this.#keyDownHandler);\r\n this.control.removeEventListener(\"input\", this.#inputHandler);\r\n this.control.removeEventListener(\"change\", this.#changeHandler);\r\n }\r\n super.detach();\r\n }\r\n\r\n /**\r\n * Clears the value of the element.\r\n * @param [restoreFocus=false] Whether to restore input focus.\r\n */\r\n clear(restoreFocus = false): void {\r\n if (!this.#input) return;\r\n\r\n this.#input.value = \"\";\r\n if (this.#clearOptions()) {\r\n this.dispatchEvent(new Event(\"change\", { bubbles: true }));\r\n }\r\n this.#filterOptions();\r\n\r\n if (restoreFocus) {\r\n this.#input.focus();\r\n } else {\r\n this.#hideMenu();\r\n }\r\n }\r\n\r\n /** @inheritdoc */\r\n override connectedCallback(): void {\r\n super.connectedCallback();\r\n this.#handleMutation();\r\n }\r\n\r\n /** @inheritdoc */\r\n protected override update(changedProperties: PropertyValues<this>): void {\r\n super.update(changedProperties);\r\n\r\n if (changedProperties.has(\"hideNoData\") && this.hideNoData && this.#menu) {\r\n setCustomState(this.#menu, \"--no-data\", false);\r\n }\r\n\r\n if (changedProperties.has(\"loading\")) {\r\n if (this.loading) {\r\n if (this.#hasFocus) {\r\n if (this.loadingLabel) {\r\n M3eLiveAnnouncer.announce(this.loadingLabel, \"polite\");\r\n }\r\n if (!this.#menu && this.#shouldShowMenu) {\r\n this.#showMenu();\r\n }\r\n }\r\n } else if (this.#menu && !this.#shouldShowMenu) {\r\n this.#hideMenu();\r\n } else if (this.#menu) {\r\n deleteCustomState(this.#menu, \"--loading\");\r\n } else if (this.#hasFocus) {\r\n this.#showMenu();\r\n }\r\n }\r\n }\r\n\r\n /** @inheritdoc */\r\n protected override render(): unknown {\r\n return html`<div class=\"options\" aria-hidden=\"true\">\r\n <slot></slot>\r\n </div>`;\r\n }\r\n\r\n /** @private */\r\n async #handleMutation(): Promise<void> {\r\n if (this.#mutationAbortController) {\r\n this.#mutationAbortController.abort();\r\n }\r\n const mutationAbortController = new AbortController();\r\n this.#mutationAbortController = mutationAbortController;\r\n\r\n const options = [...this.querySelectorAll(\"m3e-option\")];\r\n\r\n for (const option of options) {\r\n if (mutationAbortController.signal.aborted) {\r\n break;\r\n }\r\n if (option.isUpdatePending) {\r\n await option.updateComplete;\r\n }\r\n }\r\n\r\n if (mutationAbortController.signal.aborted) {\r\n return;\r\n }\r\n\r\n this._options = options;\r\n\r\n this.#clone = <HTMLElement>this.cloneNode(true);\r\n\r\n const { added } = this._listKeyManager.setItems([...this.#clone.querySelectorAll(\"m3e-option\")]);\r\n added.forEach((x) => {\r\n x.id = x.id || `${this.#id}-option-${this._listKeyManager.items.indexOf(x)}`;\r\n setCustomState(x, \"--hide-selection-indicator\", this.hideSelectionIndicator);\r\n });\r\n\r\n if (this.#menu) {\r\n const count = this.#filterOptions();\r\n this.#projectClone();\r\n if (!this.#shouldShowMenu) {\r\n this.#hideMenu();\r\n } else {\r\n this.#updateMenuState(this.#menu, count);\r\n }\r\n }\r\n }\r\n\r\n /** @private */\r\n #handleClick(): void {\r\n this.#ignoreFocusVisible = true;\r\n this.#showMenu();\r\n }\r\n\r\n /** @private */\r\n #handleFormFieldPointerDown(): void {\r\n this.#ignoreHideMenuOnBlur = true;\r\n }\r\n\r\n /** @private */\r\n #handleFocus(): void {\r\n this.#hasFocus = true;\r\n this.#ignoreFocusVisible = true;\r\n\r\n if (this.options.length == 0 && !(<HTMLInputElement>this.control).readOnly) {\r\n this.dispatchEvent(\r\n new CustomEvent<AutocompleteQueryEventDetail>(\"query\", {\r\n detail: { term: this.#input?.value ?? \"\" },\r\n bubbles: true,\r\n composed: true,\r\n }),\r\n );\r\n }\r\n\r\n this.#showMenu();\r\n }\r\n\r\n /** @private */\r\n #handleBlur(): void {\r\n this.#hasFocus = false;\r\n if (!this.#ignoreHideMenuOnBlur) {\r\n this.#hideMenu();\r\n }\r\n this.#ignoreHideMenuOnBlur = false;\r\n }\r\n\r\n /** @private */\r\n #handleInput(e: Event): void {\r\n if (!this.#input || e.defaultPrevented) return;\r\n\r\n this.dispatchEvent(\r\n new CustomEvent<AutocompleteQueryEventDetail>(\"query\", {\r\n detail: { term: this.#input.value },\r\n bubbles: true,\r\n composed: true,\r\n }),\r\n );\r\n\r\n if (this.#input.value === \"\" && this.#clearOptions()) {\r\n this.dispatchEvent(new Event(\"change\", { bubbles: true }));\r\n }\r\n\r\n this.#inputChanged = true;\r\n try {\r\n if (!this.#menu) {\r\n this.#showMenu();\r\n } else {\r\n this.#filterOptions();\r\n if (!this.#shouldShowMenu) {\r\n this.#hideMenu();\r\n }\r\n }\r\n } finally {\r\n this.#inputChanged = false;\r\n this.#formField?.notifyControlStateChange(true);\r\n }\r\n }\r\n\r\n /** @private */\r\n #handleChange(): void {\r\n if (this.#input) {\r\n const selected = this.selected;\r\n if (this.required) {\r\n this.#input.value = selected?.label ?? \"\";\r\n } else if (selected && selected.label !== this.#input.value && this.#clearOptions()) {\r\n this.dispatchEvent(new Event(\"change\", { bubbles: true }));\r\n }\r\n }\r\n }\r\n\r\n /** @private */\r\n #handleKeyDown(e: KeyboardEvent): void {\r\n if (e.defaultPrevented) return;\r\n\r\n this.#ignoreFocusVisible = false;\r\n\r\n switch (e.key) {\r\n case \"Backspace\":\r\n case \"Delete\":\r\n if (this.#input && !this.#input.value) {\r\n this.#hideMenu();\r\n }\r\n break;\r\n\r\n case \"Enter\":\r\n if (this.#menu && this._listKeyManager.activeItem) {\r\n e.preventDefault();\r\n this.#selectOption(this._listKeyManager.activeItem);\r\n if (!prefersReducedMotion()) {\r\n setTimeout(() => this.#hideMenu(), 150);\r\n } else {\r\n this.#hideMenu();\r\n }\r\n } else if (this.#menu) {\r\n setTimeout(() => {\r\n if (this.#input && !this.#input.value) {\r\n this.#hideMenu();\r\n }\r\n });\r\n }\r\n break;\r\n\r\n case \"Escape\":\r\n case \"Tab\":\r\n this.#hideMenu();\r\n break;\r\n\r\n case \"Up\":\r\n case \"ArrowUp\":\r\n if (e.altKey) {\r\n this.#hideMenu();\r\n } else {\r\n this._listKeyManager.onKeyDown(e);\r\n }\r\n break;\r\n\r\n case \"Down\":\r\n case \"ArrowDown\":\r\n if (!this.#menu) {\r\n this.#showMenu();\r\n e.preventDefault();\r\n } else {\r\n this._listKeyManager.onKeyDown(e);\r\n }\r\n break;\r\n\r\n default:\r\n this._listKeyManager.onKeyDown(e);\r\n break;\r\n }\r\n }\r\n\r\n /** @private */\r\n #handleMenuPointerDown(e: PointerEvent): void {\r\n this.#menuPressedOption = undefined;\r\n\r\n if (e.button === 2) return;\r\n // Prevent click to avoid stealing focus.\r\n e.preventDefault();\r\n e.stopImmediatePropagation();\r\n\r\n const option = <M3eOptionElement | undefined>(\r\n e.composedPath().find((x) => x instanceof HTMLElement && x.tagName === \"M3E-OPTION\")\r\n );\r\n\r\n if (option && !option.disabled) {\r\n this.#menuPressedOption = option;\r\n }\r\n }\r\n\r\n /** @private */\r\n #handleMenuPointerUp(e: PointerEvent): void {\r\n const pressedOption = this.#menuPressedOption;\r\n this.#menuPressedOption = undefined;\r\n\r\n if (e.button === 2) return;\r\n\r\n if (!pressedOption) return;\r\n\r\n const option = <M3eOptionElement | undefined>(\r\n e.composedPath().find((x) => x instanceof HTMLElement && x.tagName === \"M3E-OPTION\")\r\n );\r\n\r\n if (option === pressedOption) {\r\n this._listKeyManager.setActiveItem(option);\r\n this.#selectOption(option);\r\n }\r\n\r\n if (!prefersReducedMotion()) {\r\n setTimeout(() => this.#hideMenu(), 150);\r\n } else {\r\n this.#hideMenu();\r\n }\r\n }\r\n\r\n /** @private */\r\n #handleMenuToggle(e: ToggleEvent): void {\r\n if (!this.#menu) return;\r\n\r\n if (e.newState !== \"closed\") {\r\n const option = this.#options.find((x) => x.selected && !x.disabled);\r\n if (option) {\r\n this._listKeyManager.setActiveItem(option);\r\n scrollIntoViewIfNeeded(option, this.#menu);\r\n } else {\r\n this.#autoActivate();\r\n }\r\n\r\n this.dispatchEvent(\r\n new ToggleEvent(\"toggle\", {\r\n oldState: e.oldState,\r\n newState: e.newState,\r\n }),\r\n );\r\n } else {\r\n if (prefersReducedMotion()) {\r\n this.#destroyMenu(e);\r\n } else {\r\n // NOTE: use transitionend is preferred but doesn't fire when used here.\r\n // This is a workaround until that is fixed.\r\n setTimeout(() => this.#destroyMenu(e), 100);\r\n }\r\n }\r\n }\r\n\r\n /** @private*/\r\n #destroyMenu(e: ToggleEvent): void {\r\n if (!this.#menu) return;\r\n\r\n this.#clone?.replaceChildren(...this.#menu.childNodes);\r\n\r\n this.#menu.remove();\r\n this.#menu.removeEventListener(\"toggle\", this.#menuToggleHandler);\r\n this.#menu.removeEventListener(\"pointerdown\", this.#menuPointerDownHandler);\r\n this.#menu.removeEventListener(\"pointerup\", this.#menuPointerUpHandler);\r\n this.#menu = undefined;\r\n\r\n if (this.#input) {\r\n this.#input.ariaExpanded = \"false\";\r\n this.#input.removeAttribute(\"aria-controls\");\r\n this.#input.removeAttribute(\"aria-owns\");\r\n this.#input.removeAttribute(\"aria-activedescendant\");\r\n }\r\n this.requestUpdate();\r\n\r\n this.#formField?.notifyControlStateChange();\r\n\r\n this.dispatchEvent(\r\n new ToggleEvent(\"toggle\", {\r\n oldState: e.oldState,\r\n newState: e.newState,\r\n }),\r\n );\r\n\r\n if (this.#input?.slot === \"input\" && this.#input.parentElement?.tagName === \"M3E-INPUT-CHIP-SET\") {\r\n this.#clearOptions();\r\n }\r\n }\r\n\r\n /** @private */\r\n #showMenu(): void {\r\n if (this.#menu || !this.#input || this.#input.readOnly || this.#input.disabled) return;\r\n\r\n const count = this.#filterOptions();\r\n\r\n if (!this.#shouldShowMenu) return;\r\n\r\n this.#menu = document.createElement(\"m3e-option-panel\");\r\n this.#menu.id = this.#menuId;\r\n\r\n if (this.panelClass) {\r\n for (const klass of this.panelClass\r\n .split(/\\s+/)\r\n .map((d) => d.trim())\r\n .filter(Boolean)) {\r\n this.#menu.classList.add(klass);\r\n }\r\n }\r\n\r\n this.#menu.style.overflowX = \"hidden\";\r\n this.#menu.scrollStrategy = \"reposition\";\r\n this.#menu.fitAnchorWidth = true;\r\n this.#menu.addEventListener(\"toggle\", this.#menuToggleHandler);\r\n this.#menu.addEventListener(\"pointerdown\", this.#menuPointerDownHandler);\r\n this.#menu.addEventListener(\"pointerup\", this.#menuPointerUpHandler);\r\n\r\n this.#projectClone();\r\n\r\n this.#updateMenuState(this.#menu, count);\r\n\r\n (this.#formField ?? this.#input).insertAdjacentElement(\"afterend\", this.#menu);\r\n\r\n this.#input.setAttribute(\"aria-controls\", this.#menuId);\r\n this.#input.setAttribute(\"aria-owns\", this.#menuId);\r\n\r\n this.#formField?.notifyControlStateChange();\r\n\r\n if (this._listKeyManager.activeItem && this.autoActivate) {\r\n this.#activateOption(this._listKeyManager.activeItem, true);\r\n }\r\n\r\n const input = this.#input;\r\n setTimeout(() => this.#menu?.show(input, this.#formField?.menuAnchor));\r\n }\r\n\r\n /** @private */\r\n #projectClone(): void {\r\n if (!this.#clone || !this.#menu) return;\r\n const children = [...this.#clone.childNodes];\r\n if (!this.#hasNoDataSlot && this.noDataLabel) {\r\n const noDataSpan = document.createElement(\"span\");\r\n noDataSpan.slot = \"no-data\";\r\n noDataSpan.textContent = this.noDataLabel;\r\n children.push(noDataSpan);\r\n }\r\n if (!this.#hasLoadingSlot && this.loadingLabel) {\r\n const loadingSpan = document.createElement(\"span\");\r\n loadingSpan.slot = \"loading\";\r\n loadingSpan.textContent = this.loadingLabel;\r\n children.push(loadingSpan);\r\n }\r\n this.#menu.replaceChildren(...children);\r\n }\r\n\r\n /** @private */\r\n #updateMenuState(menu: M3eOptionPanelElement, count: number): void {\r\n setCustomState(menu, \"--loading\", this.loading);\r\n setCustomState(menu, \"--no-data\", count == 0);\r\n }\r\n\r\n /** @private */\r\n #hideMenu(): void {\r\n this.#menu?.hide();\r\n }\r\n\r\n /** @private */\r\n #activateOption(option: M3eOptionElement, forceFocusVisible = false): void {\r\n if (!this.#input) return;\r\n\r\n this.#input.setAttribute(\"aria-activedescendant\", option.id);\r\n\r\n if (this.#menu) {\r\n scrollIntoViewIfNeeded(option, this.#menu, { block: \"nearest\", behavior: \"instant\" });\r\n\r\n const focusVisible =\r\n forceFocusVisible ||\r\n (!this.#ignoreFocusVisible && (this.#input.matches(\":focus-visible\") || forcedColorsActive()));\r\n\r\n this.#options.forEach((x) => {\r\n const active = x === option && focusVisible;\r\n if (active) {\r\n x.focusRing?.show();\r\n x.stateLayer?.show(\"focused\");\r\n } else {\r\n x.focusRing?.hide();\r\n x.stateLayer?.hide(\"focused\");\r\n }\r\n });\r\n }\r\n }\r\n\r\n /** @private */\r\n async #updateSelectionState(clone: M3eOptionElement): Promise<void> {\r\n const option = this._options[this._listKeyManager.items.indexOf(clone)];\r\n if (option) {\r\n option.selected = clone.selected;\r\n if (option.isUpdatePending) {\r\n await option.updateComplete;\r\n }\r\n }\r\n }\r\n\r\n /** @private */\r\n async #selectOption(option: M3eOptionElement): Promise<void> {\r\n if (option.selected) return;\r\n\r\n option.selected = true;\r\n await this.#updateSelectionState(option);\r\n if (option.isUpdatePending) {\r\n await option.updateComplete;\r\n }\r\n\r\n this.requestUpdate();\r\n if (this.isUpdatePending) {\r\n await this.updateComplete;\r\n }\r\n\r\n if (this.#input) {\r\n this.#input.value = option.label;\r\n }\r\n\r\n this.dispatchEvent(new Event(\"change\", { bubbles: true }));\r\n\r\n this.#formField?.notifyControlStateChange(true);\r\n }\r\n\r\n /** @private */\r\n #filterOption(clone: M3eOptionElement, option: M3eOptionElement, term: string, exactTerm: string): boolean {\r\n const value = this.caseSensitive ? option.value : option.value.toLowerCase();\r\n switch (this.filter) {\r\n case \"starts-with\":\r\n clone.term = exactTerm;\r\n clone.highlightMode = this.filter;\r\n return value.startsWith(term);\r\n case \"ends-with\":\r\n clone.term = exactTerm;\r\n clone.highlightMode = this.filter;\r\n return value.endsWith(term);\r\n case \"contains\":\r\n clone.term = exactTerm;\r\n clone.highlightMode = this.filter;\r\n return value.includes(term);\r\n case \"none\":\r\n clone.disableHighlight = true;\r\n return true;\r\n default:\r\n clone.disableHighlight = true;\r\n return this.filter(option, exactTerm);\r\n }\r\n }\r\n\r\n /** @private */\r\n #filterOptions(): number {\r\n if (!this.#input) return 0;\r\n\r\n const oldCount = this.#options.filter((x) => x.hidden === false).length;\r\n const shouldAnnounce = !this.loading && this.#inputChanged;\r\n this.#inputChanged = false;\r\n\r\n const exactTerm = this.#input.value;\r\n const term = this.caseSensitive ? exactTerm : exactTerm.toLocaleLowerCase();\r\n\r\n let newCount = 0;\r\n let first = false;\r\n let last: M3eOptionElement | undefined;\r\n\r\n for (let i = 0; i < this.#options.length; i++) {\r\n const clone = this.#options[i];\r\n const option = this._options[i];\r\n clone.hidden = !this.#filterOption(clone, option, term, exactTerm);\r\n\r\n if (clone.hidden === true) {\r\n this.#deactivateOption(clone);\r\n deleteCustomState(clone, \"--first\");\r\n deleteCustomState(clone, \"--last\");\r\n } else {\r\n newCount++;\r\n if (!first && !(clone.parentElement instanceof M3eOptGroupElement)) {\r\n addCustomState(clone, \"--first\");\r\n first = true;\r\n addCustomState(clone, \"--last\");\r\n last = clone;\r\n } else {\r\n deleteCustomState(clone, \"--first\");\r\n if (last) {\r\n deleteCustomState(last, \"--last\");\r\n }\r\n addCustomState(clone, \"--last\");\r\n last = clone;\r\n }\r\n }\r\n }\r\n\r\n if (this.#menu) {\r\n this.#updateMenuState(this.#menu, newCount);\r\n }\r\n\r\n const groups = this.#menu?.querySelectorAll(\"m3e-optgroup\") ?? this.#clone?.querySelectorAll(\"m3e-optgroup\") ?? [];\r\n for (const group of groups) {\r\n group.hidden = [...group.querySelectorAll(\"m3e-option\")].every((x) => x.hidden === true);\r\n }\r\n\r\n if (shouldAnnounce) {\r\n this.#announceResults(oldCount, newCount);\r\n }\r\n\r\n this.#autoActivate();\r\n return newCount;\r\n }\r\n\r\n /** @private */\r\n #clearOptions(): boolean {\r\n const selected = this._listKeyManager.items.filter((x) => x.selected);\r\n if (selected.length > 0) {\r\n selected.forEach((x) => {\r\n x.selected = false;\r\n this.#updateSelectionState(x);\r\n });\r\n return true;\r\n }\r\n return false;\r\n }\r\n\r\n /** @private */\r\n #announceResults(oldCount: number, newCount: number): void {\r\n if (!this.#hasFocus) return;\r\n if (newCount == 0) {\r\n if (oldCount > 0 && this.noDataLabel) {\r\n M3eLiveAnnouncer.announce(this.noDataLabel, \"polite\");\r\n }\r\n } else if (oldCount != newCount) {\r\n const message = this.resultsLabel instanceof Function ? this.resultsLabel(newCount) : this.resultsLabel;\r\n if (message) {\r\n M3eLiveAnnouncer.announce(message, \"polite\");\r\n }\r\n }\r\n }\r\n\r\n /** @private */\r\n #autoActivate(): void {\r\n if (this.autoActivate && (!this._listKeyManager.activeItem || !this._listKeyManager.activeItem.selected)) {\r\n const option = this.#options.find((x) => !x.disabled && x.hidden === false);\r\n if (option) {\r\n this._listKeyManager.setActiveItem(option);\r\n if (this.#menu) {\r\n scrollIntoViewIfNeeded(option, this.#menu, { block: \"nearest\", behavior: \"instant\" });\r\n }\r\n }\r\n }\r\n }\r\n\r\n /** @private */\r\n #deactivateOption(option: M3eOptionElement): void {\r\n option.focusRing?.hide();\r\n option.stateLayer?.hide(\"focused\");\r\n if (option === this._listKeyManager.activeItem) {\r\n this._listKeyManager.updateActiveItem(null);\r\n this.#input?.removeAttribute(\"aria-activedescendant\");\r\n }\r\n }\r\n}\r\n\r\ninterface M3eAutocompleteElementEventMap extends HTMLElementEventMap {\r\n toggle: ToggleEvent;\r\n query: CustomEvent<AutocompleteQueryEventDetail>;\r\n}\r\n\r\nexport interface M3eAutocompleteElement {\r\n addEventListener<K extends keyof M3eAutocompleteElementEventMap>(\r\n type: K,\r\n listener: (this: M3eAutocompleteElement, ev: M3eAutocompleteElementEventMap[K]) => void,\r\n options?: boolean | AddEventListenerOptions,\r\n ): void;\r\n\r\n addEventListener(\r\n type: string,\r\n listener: EventListenerOrEventListenerObject,\r\n options?: boolean | AddEventListenerOptions,\r\n ): void;\r\n\r\n removeEventListener<K extends keyof M3eAutocompleteElementEventMap>(\r\n type: K,\r\n listener: (this: M3eAutocompleteElement, ev: M3eAutocompleteElementEventMap[K]) => void,\r\n options?: boolean | EventListenerOptions,\r\n ): void;\r\n\r\n removeEventListener(\r\n type: string,\r\n listener: EventListenerOrEventListenerObject,\r\n options?: boolean | EventListenerOptions,\r\n ): void;\r\n}\r\n\r\ndeclare global {\r\n interface HTMLElementTagNameMap {\r\n \"m3e-autocomplete\": M3eAutocompleteElement;\r\n }\r\n}\r\n"],"names":["M3eAutocompleteElement","HtmlFor","LitElement","constructor","super","_M3eAutocompleteElement_id","set","this","M3eAutocompleteElement_1","__nextId","_M3eAutocompleteElement_menuId","__classPrivateFieldGet","_options","Array","_M3eAutocompleteElement_clone","_M3eAutocompleteElement_ignoreFocusVisible","_M3eAutocompleteElement_menu","_M3eAutocompleteElement_ignoreHideMenuOnBlur","_M3eAutocompleteElement_inputChanged","_M3eAutocompleteElement_hasFocus","_M3eAutocompleteElement_mutationAbortController","_M3eAutocompleteElement_clickHandler","_M3eAutocompleteElement_instances","_M3eAutocompleteElement_handleClick","call","_M3eAutocompleteElement_formFieldPointerDownHandler","_M3eAutocompleteElement_handleFormFieldPointerDown","_M3eAutocompleteElement_focusHandler","_M3eAutocompleteElement_handleFocus","_M3eAutocompleteElement_blurHandler","_M3eAutocompleteElement_handleBlur","_M3eAutocompleteElement_keyDownHandler","e","_M3eAutocompleteElement_inputHandler","_M3eAutocompleteElement_changeHandler","_M3eAutocompleteElement_handleChange","_M3eAutocompleteElement_menuToggleHandler","_M3eAutocompleteElement_menuPointerDownHandler","_M3eAutocompleteElement_menuPointerUpHandler","_M3eAutocompleteElement_menuPressedOption","_listKeyManager","ListKeyManager","withWrap","withHomeAndEnd","withPageUpAndDown","withVerticalOrientation","withSkipPredicate","item","disabled","hidden","onActiveItemChange","activeItem","_M3eAutocompleteElement_activateOption","hideSelectionIndicator","required","autoActivate","caseSensitive","filter","loading","hideNoData","hideLoading","loadingLabel","noDataLabel","resultsLabel","count","panelClass","MutationController","config","childList","subtree","callback","_M3eAutocompleteElement_handleMutation","options","selected","find","x","value","attach","control","HTMLInputElement","autocomplete","role","ariaAutoComplete","ariaExpanded","addEventListener","_M3eAutocompleteElement_formField_get","detach","removeEventListener","clear","restoreFocus","_M3eAutocompleteElement_input_get","_M3eAutocompleteElement_clearOptions","dispatchEvent","Event","bubbles","_M3eAutocompleteElement_filterOptions","focus","_M3eAutocompleteElement_hideMenu","connectedCallback","update","changedProperties","has","setCustomState","M3eLiveAnnouncer","announce","_M3eAutocompleteElement_shouldShowMenu_get","_M3eAutocompleteElement_showMenu","deleteCustomState","render","html","items","querySelector","_M3eAutocompleteElement_options_get","some","length","closest","async","abort","mutationAbortController","AbortController","__classPrivateFieldSet","querySelectorAll","option","signal","aborted","isUpdatePending","updateComplete","cloneNode","added","setItems","forEach","id","indexOf","_M3eAutocompleteElement_projectClone","_M3eAutocompleteElement_updateMenuState","readOnly","CustomEvent","detail","term","composed","defaultPrevented","notifyControlStateChange","label","key","preventDefault","_M3eAutocompleteElement_selectOption","prefersReducedMotion","setTimeout","altKey","onKeyDown","undefined","button","stopImmediatePropagation","composedPath","HTMLElement","tagName","pressedOption","setActiveItem","newState","scrollIntoViewIfNeeded","_M3eAutocompleteElement_autoActivate","ToggleEvent","oldState","_M3eAutocompleteElement_destroyMenu","replaceChildren","childNodes","remove","removeAttribute","requestUpdate","slot","parentElement","document","createElement","klass","split","map","d","trim","Boolean","classList","add","style","overflowX","scrollStrategy","fitAnchorWidth","insertAdjacentElement","setAttribute","input","show","menuAnchor","children","_M3eAutocompleteElement_hasNoDataSlot_get","noDataSpan","textContent","push","_M3eAutocompleteElement_hasLoadingSlot_get","loadingSpan","menu","hide","forceFocusVisible","block","behavior","focusVisible","matches","forcedColorsActive","focusRing","stateLayer","clone","_M3eAutocompleteElement_updateSelectionState","_M3eAutocompleteElement_filterOption","exactTerm","toLowerCase","highlightMode","startsWith","endsWith","includes","disableHighlight","oldCount","shouldAnnounce","toLocaleLowerCase","last","newCount","first","i","_M3eAutocompleteElement_deactivateOption","M3eOptGroupElement","addCustomState","groups","group","every","_M3eAutocompleteElement_announceResults","message","Function","updateActiveItem","styles","css","__decorate","property","attribute","type","prototype","reflect","converter","fromAttribute","customElement"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"autocomplete.min.js","sources":["../../src/autocomplete/AutocompleteElement.ts"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-unsafe-declaration-merging */\r\nimport { css, CSSResultGroup, html, LitElement, PropertyValues } from \"lit\";\r\nimport { property } from \"lit/decorators.js\";\r\n\r\nimport {\r\n HtmlFor,\r\n prefersReducedMotion,\r\n scrollIntoViewIfNeeded,\r\n forcedColorsActive,\r\n setCustomState,\r\n deleteCustomState,\r\n addCustomState,\r\n customElement,\r\n MutationController,\r\n} from \"@m3e/web/core\";\r\n\r\nimport { ListKeyManager, M3eLiveAnnouncer } from \"@m3e/web/core/a11y\";\r\nimport { M3eOptGroupElement, M3eOptionElement, M3eOptionPanelElement } from \"@m3e/web/option\";\r\nimport type { M3eFormFieldElement } from \"@m3e/web/form-field\";\r\n\r\nimport { AutocompleteFilterMode } from \"./AutocompleteFilterMode\";\r\nimport { AutocompleteQueryEventDetail } from \"./AutocompleteQueryEventDetail\";\r\n\r\n/**\r\n * Enhances a text input with suggested options.\r\n *\r\n * @description\r\n * The `m3e-autocomplete` component augments a text input field with a dynamically positioned menu of filterable suggestions,\r\n * following Material Design 3 principles. It provides real-time filtering, keyboard navigation, automatic option activation,\r\n * and text highlighting to guide user selection. The component manages focus, selection state, and menu visibility while\r\n * integrating seamlessly with form field containers and supporting both required and optional selection modes.\r\n *\r\n * @example\r\n * The following example illustrates use of the `m3e-autocomplete` paired with a `m3e-form-field`.\r\n * ```html\r\n * <m3e-form-field>\r\n * <label slot=\"label\" for=\"fruit\">Choose your favorite fruit</label>\r\n * <input id=\"fruit\" />\r\n * </m3e-form-field>\r\n * <m3e-autocomplete for=\"fruit\">\r\n * <m3e-option>Apples</m3e-option>\r\n * <m3e-option>Oranges</m3e-option>\r\n * <m3e-option>Bananas</m3e-option>\r\n * <m3e-option>Grapes</m3e-option>\r\n * </m3e-autocomplete>\r\n * ```\r\n *\r\n * @tag m3e-autocomplete\r\n *\r\n * @attr auto-activate - Whether the first option should be automatically activated.\r\n * @attr case-sensitive - Whether filtering is case sensitive.\r\n * @attr filter - Mode in which to filter options.\r\n * @attr hide-selection-indicator - Whether to hide the selection indicator.\r\n * @attr hide-loading - Whether to hide the menu when loading options.\r\n * @attr hide-no-data - Whether to hide the menu when there are no options to show.\r\n * @attr loading - Whether options are being loaded.\r\n * @attr loading-label - The text announced and presented when loading options.\r\n * @attr no-data-label - The text announced and presented when no options are available for the current term.\r\n * @attr panel-class - Class or list of classes to be applied to the autocomplete's overlay panel.\r\n * @attr required - Whether the user is required to make a selection when interacting with the autocomplete.\r\n * @attr results-label - The text announced when available options change for the current term.\r\n *\r\n * @slot - Renders the options of the autocomplete.\r\n * @slot loading - Renders content when loading options.\r\n * @slot no-data - Renders content when there are no options to show.\r\n *\r\n * @fires toggle - Dispatched when the options menu opens or closes.\r\n * @fires query - Dispatched when the input is focused or when the user modifies its value.\r\n * @fires change - Dispatched when the committed value changes due to selecting an option or clearing the input.\r\n */\r\n@customElement(\"m3e-autocomplete\")\r\nexport class M3eAutocompleteElement extends HtmlFor(LitElement) {\r\n /** The styles of the element. */\r\n static override styles: CSSResultGroup = css`\r\n :host {\r\n display: contents;\r\n }\r\n .options {\r\n display: none;\r\n }\r\n `;\r\n\r\n /** @private */ private static __nextId = 0;\r\n\r\n /** @private */ readonly #id = `m3e-autocomplete-${M3eAutocompleteElement.__nextId}`;\r\n /** @private */ readonly #menuId = `${this.#id}-menu`;\r\n /** @private */ private _options = new Array<M3eOptionElement>();\r\n /** @private */ #clone?: HTMLElement;\r\n /** @private */ #ignoreFocusVisible = false;\r\n /** @private */ #menu?: M3eOptionPanelElement;\r\n /** @private */ #ignoreHideMenuOnBlur = false;\r\n /** @private */ #inputChanged = false;\r\n /** @private */ #hasFocus = false;\r\n /** @private */ #mutationAbortController?: AbortController;\r\n\r\n /** @private */ readonly #clickHandler = () => this.#handleClick();\r\n /** @private */ readonly #formFieldPointerDownHandler = () => this.#handleFormFieldPointerDown();\r\n /** @private */ readonly #focusHandler = () => this.#handleFocus();\r\n /** @private */ readonly #blurHandler = () => this.#handleBlur();\r\n /** @private */ readonly #keyDownHandler = (e: KeyboardEvent) => this.#handleKeyDown(e);\r\n /** @private */ readonly #inputHandler = (e: Event) => this.#handleInput(e);\r\n /** @private */ readonly #changeHandler = () => this.#handleChange();\r\n /** @private */ readonly #menuToggleHandler = (e: ToggleEvent) => this.#handleMenuToggle(e);\r\n /** @private */ readonly #menuPointerDownHandler = (e: PointerEvent) => this.#handleMenuPointerDown(e);\r\n /** @private */ readonly #menuPointerUpHandler = (e: PointerEvent) => this.#handleMenuPointerUp(e);\r\n /** @private */ #menuPressedOption?: M3eOptionElement;\r\n\r\n /** @private */ private readonly _listKeyManager = new ListKeyManager<M3eOptionElement>()\r\n .withWrap()\r\n .withHomeAndEnd()\r\n .withPageUpAndDown()\r\n .withVerticalOrientation()\r\n .withSkipPredicate((item) => item.disabled || item.hidden === true)\r\n .onActiveItemChange(() => {\r\n if (this._listKeyManager.activeItem) {\r\n this.#activateOption(this._listKeyManager.activeItem);\r\n }\r\n });\r\n\r\n constructor() {\r\n super();\r\n\r\n new MutationController(this, {\r\n config: {\r\n childList: true,\r\n subtree: true,\r\n },\r\n callback: () => this.#handleMutation(),\r\n });\r\n }\r\n\r\n /**\r\n * Whether to hide the selection indicator.\r\n * @default false\r\n */\r\n @property({ attribute: \"hide-selection-indicator\", type: Boolean }) hideSelectionIndicator = false;\r\n\r\n /**\r\n * Whether the user is required to make a selection when interacting with the autocomplete.\r\n * @default false\r\n */\r\n @property({ type: Boolean, reflect: true }) required = false;\r\n\r\n /**\r\n * Whether the first option should be automatically activated.\r\n * @default false\r\n */\r\n @property({ attribute: \"auto-activate\", type: Boolean }) autoActivate = false;\r\n\r\n /**\r\n * Whether filtering is case sensitive.\r\n * @default false\r\n */\r\n @property({ attribute: \"case-sensitive\", type: Boolean }) caseSensitive = false;\r\n\r\n /**\r\n * Mode in which to filter options.\r\n * @default \"contains\"\r\n */\r\n @property({\r\n converter: {\r\n fromAttribute(value: string | null): AutocompleteFilterMode {\r\n if (value === null) return \"contains\";\r\n if (value === \"starts-with\" || value === \"ends-with\" || value === \"contains\" || value === \"none\") {\r\n return value;\r\n }\r\n return \"contains\";\r\n },\r\n },\r\n })\r\n filter: AutocompleteFilterMode | ((option: M3eOptionElement, term: string) => boolean) = \"contains\";\r\n\r\n /**\r\n * Whether options are being loaded.\r\n * @default false\r\n */\r\n @property({ type: Boolean }) loading = false;\r\n\r\n /**\r\n * Whether to hide the menu when there are no options to show.\r\n * @default false\r\n */\r\n @property({ attribute: \"hide-no-data\", type: Boolean }) hideNoData = false;\r\n\r\n /**\r\n * Whether to hide the menu when loading options.\r\n * @default false\r\n */\r\n @property({ attribute: \"hide-loading\", type: Boolean }) hideLoading = false;\r\n\r\n /**\r\n * The text announced and presented when loading options.\r\n * @default \"Loading...\"\r\n */\r\n @property({ attribute: \"loading-label\" }) loadingLabel = \"Loading...\";\r\n\r\n /**\r\n * The text announced and presented when no options are available for the current term.\r\n * @default \"No options\"\r\n */\r\n @property({ attribute: \"no-data-label\" }) noDataLabel = \"No options\";\r\n\r\n /**\r\n * The text announced when available options change for the current term.\r\n * @default (count) => `${count} options`\r\n */\r\n @property({ attribute: \"results-label\" }) resultsLabel: string | ((count: number) => string) = (count) =>\r\n `${count} options`;\r\n\r\n /**\r\n * Class or list of classes to be applied to the autocomplete's overlay panel.\r\n * @default \"\"\r\n */\r\n @property({ attribute: \"panel-class\" }) panelClass = \"\";\r\n\r\n /** The options that can be selected. */\r\n get options(): readonly M3eOptionElement[] {\r\n return this._options ?? [];\r\n }\r\n\r\n /** The selected option. */\r\n get selected(): M3eOptionElement | null {\r\n return this.options.find((x) => x.selected) ?? null;\r\n }\r\n\r\n /** The selected (enabled) value. */\r\n get value(): string | null {\r\n const selected = this.selected;\r\n return selected && !selected.disabled ? selected.value : null;\r\n }\r\n\r\n /** @private */\r\n get #options(): readonly M3eOptionElement[] {\r\n return this._listKeyManager?.items ?? [];\r\n }\r\n\r\n /** @private */\r\n get #input(): HTMLInputElement | null {\r\n return this.control ? <HTMLInputElement>this.control : null;\r\n }\r\n\r\n /** @private */\r\n get #hasNoDataSlot(): boolean {\r\n return (this.#clone?.querySelector(\"[slot='no-data']\") ?? null) !== null;\r\n }\r\n\r\n /** @private */\r\n get #hasLoadingSlot(): boolean {\r\n return (this.#clone?.querySelector(\"[slot='loading']\") ?? null) !== null;\r\n }\r\n\r\n /** @private */\r\n get #shouldShowMenu(): boolean {\r\n return (\r\n this.#options.some((x) => x.hidden === false) ||\r\n (this.loading && !this.hideLoading && this.loadingLabel.length > 0) ||\r\n (!this.loading && !this.hideNoData && this.noDataLabel.length > 0)\r\n );\r\n }\r\n\r\n /** @private */\r\n get #formField(): M3eFormFieldElement | null {\r\n return this.control?.closest(\"m3e-form-field\") ?? null;\r\n }\r\n\r\n /** @inheritdoc */\r\n override attach(control: HTMLElement): void {\r\n if (!(control instanceof HTMLInputElement)) return;\r\n\r\n super.attach(control);\r\n\r\n control.autocomplete = \"off\";\r\n control.role = \"combobox\";\r\n control.ariaAutoComplete = \"list\";\r\n control.ariaExpanded = \"false\";\r\n\r\n control.addEventListener(\"click\", this.#clickHandler);\r\n control.addEventListener(\"focus\", this.#focusHandler);\r\n control.addEventListener(\"blur\", this.#blurHandler);\r\n control.addEventListener(\"keydown\", this.#keyDownHandler);\r\n control.addEventListener(\"input\", this.#inputHandler);\r\n control.addEventListener(\"change\", this.#changeHandler);\r\n\r\n this.#formField?.addEventListener(\"pointerdown\", this.#formFieldPointerDownHandler);\r\n }\r\n\r\n /** @inheritdoc */\r\n override detach(): void {\r\n if (this.control) {\r\n this.#formField?.removeEventListener(\"pointerdown\", this.#formFieldPointerDownHandler);\r\n\r\n this.control.role = null;\r\n this.control.ariaAutoComplete = null;\r\n this.control.ariaExpanded = null;\r\n\r\n this.control.removeEventListener(\"click\", this.#clickHandler);\r\n this.control.removeEventListener(\"focus\", this.#focusHandler);\r\n this.control.removeEventListener(\"blur\", this.#blurHandler);\r\n this.control.removeEventListener(\"keydown\", this.#keyDownHandler);\r\n this.control.removeEventListener(\"input\", this.#inputHandler);\r\n this.control.removeEventListener(\"change\", this.#changeHandler);\r\n }\r\n super.detach();\r\n }\r\n\r\n /**\r\n * Clears the value of the element.\r\n * @param [restoreFocus=false] Whether to restore input focus.\r\n */\r\n clear(restoreFocus = false): void {\r\n if (!this.#input) return;\r\n\r\n this.#input.value = \"\";\r\n if (this.#clearOptions()) {\r\n this.dispatchEvent(new Event(\"change\", { bubbles: true }));\r\n }\r\n this.#filterOptions();\r\n\r\n if (restoreFocus) {\r\n this.#input.focus();\r\n } else {\r\n this.#hideMenu();\r\n }\r\n }\r\n\r\n /** @inheritdoc */\r\n override connectedCallback(): void {\r\n super.connectedCallback();\r\n this.#handleMutation();\r\n }\r\n\r\n /** @inheritdoc */\r\n protected override update(changedProperties: PropertyValues<this>): void {\r\n super.update(changedProperties);\r\n\r\n if (changedProperties.has(\"hideNoData\") && this.hideNoData && this.#menu) {\r\n setCustomState(this.#menu, \"--no-data\", false);\r\n }\r\n\r\n if (changedProperties.has(\"loading\")) {\r\n if (this.loading) {\r\n if (this.#hasFocus) {\r\n if (this.loadingLabel) {\r\n M3eLiveAnnouncer.announce(this.loadingLabel, \"polite\");\r\n }\r\n if (!this.#menu && this.#shouldShowMenu) {\r\n this.#showMenu();\r\n }\r\n }\r\n } else if (this.#menu && !this.#shouldShowMenu) {\r\n this.#hideMenu();\r\n } else if (this.#menu) {\r\n deleteCustomState(this.#menu, \"--loading\");\r\n } else if (this.#hasFocus) {\r\n this.#showMenu();\r\n }\r\n }\r\n }\r\n\r\n /** @inheritdoc */\r\n protected override render(): unknown {\r\n return html`<div class=\"options\" aria-hidden=\"true\" @state-change=\"${this.#handleOptionStateChange}\">\r\n <slot></slot>\r\n </div>`;\r\n }\r\n\r\n /** @private */\r\n #handleOptionStateChange(e: Event): void {\r\n if (!(e.target instanceof M3eOptionElement)) return;\r\n e.stopImmediatePropagation();\r\n\r\n const index = this.options.indexOf(e.target);\r\n if (index == -1) return;\r\n\r\n const clone = this.#options[index];\r\n if (!clone) return;\r\n\r\n clone.disabled = e.target.disabled;\r\n clone.selected = e.target.selected;\r\n }\r\n\r\n /** @private */\r\n async #handleMutation(): Promise<void> {\r\n if (this.#mutationAbortController) {\r\n this.#mutationAbortController.abort();\r\n }\r\n const mutationAbortController = new AbortController();\r\n this.#mutationAbortController = mutationAbortController;\r\n\r\n const options = [...this.querySelectorAll(\"m3e-option\")];\r\n\r\n for (const option of options) {\r\n if (mutationAbortController.signal.aborted) {\r\n break;\r\n }\r\n if (option.isUpdatePending) {\r\n await option.updateComplete;\r\n }\r\n }\r\n\r\n if (mutationAbortController.signal.aborted) {\r\n return;\r\n }\r\n\r\n this._options = options;\r\n\r\n this.#clone = <HTMLElement>this.cloneNode(true);\r\n\r\n const { added } = this._listKeyManager.setItems([...this.#clone.querySelectorAll(\"m3e-option\")]);\r\n added.forEach((x) => {\r\n x.id = x.id || `${this.#id}-option-${this._listKeyManager.items.indexOf(x)}`;\r\n setCustomState(x, \"--hide-selection-indicator\", this.hideSelectionIndicator);\r\n });\r\n\r\n if (this.#menu) {\r\n const count = this.#filterOptions();\r\n this.#projectClone();\r\n if (!this.#shouldShowMenu) {\r\n this.#hideMenu();\r\n } else {\r\n this.#updateMenuState(this.#menu, count);\r\n }\r\n }\r\n }\r\n\r\n /** @private */\r\n #handleClick(): void {\r\n this.#ignoreFocusVisible = true;\r\n this.#showMenu();\r\n }\r\n\r\n /** @private */\r\n #handleFormFieldPointerDown(): void {\r\n this.#ignoreHideMenuOnBlur = true;\r\n }\r\n\r\n /** @private */\r\n #handleFocus(): void {\r\n this.#hasFocus = true;\r\n this.#ignoreFocusVisible = true;\r\n\r\n if (this.options.length == 0 && !(<HTMLInputElement>this.control).readOnly) {\r\n this.dispatchEvent(\r\n new CustomEvent<AutocompleteQueryEventDetail>(\"query\", {\r\n detail: { term: this.#input?.value ?? \"\" },\r\n bubbles: true,\r\n composed: true,\r\n }),\r\n );\r\n }\r\n\r\n this.#showMenu();\r\n }\r\n\r\n /** @private */\r\n #handleBlur(): void {\r\n this.#hasFocus = false;\r\n if (!this.#ignoreHideMenuOnBlur) {\r\n this.#hideMenu();\r\n }\r\n this.#ignoreHideMenuOnBlur = false;\r\n }\r\n\r\n /** @private */\r\n #handleInput(e: Event): void {\r\n if (!this.#input || e.defaultPrevented) return;\r\n\r\n this.dispatchEvent(\r\n new CustomEvent<AutocompleteQueryEventDetail>(\"query\", {\r\n detail: { term: this.#input.value },\r\n bubbles: true,\r\n composed: true,\r\n }),\r\n );\r\n\r\n if (this.#input.value === \"\" && this.#clearOptions()) {\r\n this.dispatchEvent(new Event(\"change\", { bubbles: true }));\r\n }\r\n\r\n this.#inputChanged = true;\r\n try {\r\n if (!this.#menu) {\r\n this.#showMenu();\r\n } else {\r\n this.#filterOptions();\r\n if (!this.#shouldShowMenu) {\r\n this.#hideMenu();\r\n }\r\n }\r\n } finally {\r\n this.#inputChanged = false;\r\n this.#formField?.notifyControlStateChange(true);\r\n }\r\n }\r\n\r\n /** @private */\r\n #handleChange(): void {\r\n if (this.#input) {\r\n const selected = this.selected;\r\n if (this.required) {\r\n this.#input.value = selected?.label ?? \"\";\r\n } else if (selected && selected.label !== this.#input.value && this.#clearOptions()) {\r\n this.dispatchEvent(new Event(\"change\", { bubbles: true }));\r\n }\r\n }\r\n }\r\n\r\n /** @private */\r\n #handleKeyDown(e: KeyboardEvent): void {\r\n if (e.defaultPrevented) return;\r\n\r\n this.#ignoreFocusVisible = false;\r\n\r\n switch (e.key) {\r\n case \"Backspace\":\r\n case \"Delete\":\r\n if (this.#input && !this.#input.value) {\r\n this.#hideMenu();\r\n }\r\n break;\r\n\r\n case \"Enter\":\r\n if (this.#menu && this._listKeyManager.activeItem) {\r\n e.preventDefault();\r\n this.#selectOption(this._listKeyManager.activeItem);\r\n if (!prefersReducedMotion()) {\r\n setTimeout(() => this.#hideMenu(), 150);\r\n } else {\r\n this.#hideMenu();\r\n }\r\n } else if (this.#menu) {\r\n setTimeout(() => {\r\n if (this.#input && !this.#input.value) {\r\n this.#hideMenu();\r\n }\r\n });\r\n }\r\n break;\r\n\r\n case \"Escape\":\r\n case \"Tab\":\r\n this.#hideMenu();\r\n break;\r\n\r\n case \"Up\":\r\n case \"ArrowUp\":\r\n if (e.altKey) {\r\n this.#hideMenu();\r\n } else {\r\n this._listKeyManager.onKeyDown(e);\r\n }\r\n break;\r\n\r\n case \"Down\":\r\n case \"ArrowDown\":\r\n if (!this.#menu) {\r\n this.#showMenu();\r\n e.preventDefault();\r\n } else {\r\n this._listKeyManager.onKeyDown(e);\r\n }\r\n break;\r\n\r\n default:\r\n this._listKeyManager.onKeyDown(e);\r\n break;\r\n }\r\n }\r\n\r\n /** @private */\r\n #handleMenuPointerDown(e: PointerEvent): void {\r\n this.#menuPressedOption = undefined;\r\n\r\n if (e.button === 2) return;\r\n // Prevent click to avoid stealing focus.\r\n e.preventDefault();\r\n e.stopImmediatePropagation();\r\n\r\n const option = <M3eOptionElement | undefined>(\r\n e.composedPath().find((x) => x instanceof HTMLElement && x.tagName === \"M3E-OPTION\")\r\n );\r\n\r\n if (option && !option.disabled) {\r\n this.#menuPressedOption = option;\r\n }\r\n }\r\n\r\n /** @private */\r\n #handleMenuPointerUp(e: PointerEvent): void {\r\n const pressedOption = this.#menuPressedOption;\r\n this.#menuPressedOption = undefined;\r\n\r\n if (e.button === 2) return;\r\n\r\n if (!pressedOption) return;\r\n\r\n const option = <M3eOptionElement | undefined>(\r\n e.composedPath().find((x) => x instanceof HTMLElement && x.tagName === \"M3E-OPTION\")\r\n );\r\n\r\n if (option === pressedOption) {\r\n this._listKeyManager.setActiveItem(option);\r\n this.#selectOption(option);\r\n }\r\n\r\n if (!prefersReducedMotion()) {\r\n setTimeout(() => this.#hideMenu(), 150);\r\n } else {\r\n this.#hideMenu();\r\n }\r\n }\r\n\r\n /** @private */\r\n #handleMenuToggle(e: ToggleEvent): void {\r\n if (!this.#menu) return;\r\n\r\n if (e.newState !== \"closed\") {\r\n const option = this.#options.find((x) => x.selected && !x.disabled);\r\n if (option) {\r\n this._listKeyManager.setActiveItem(option);\r\n scrollIntoViewIfNeeded(option, this.#menu);\r\n } else {\r\n this.#autoActivate();\r\n }\r\n\r\n this.dispatchEvent(\r\n new ToggleEvent(\"toggle\", {\r\n oldState: e.oldState,\r\n newState: e.newState,\r\n }),\r\n );\r\n } else {\r\n if (prefersReducedMotion()) {\r\n this.#destroyMenu(e);\r\n } else {\r\n // NOTE: use transitionend is preferred but doesn't fire when used here.\r\n // This is a workaround until that is fixed.\r\n setTimeout(() => this.#destroyMenu(e), 100);\r\n }\r\n }\r\n }\r\n\r\n /** @private*/\r\n #destroyMenu(e: ToggleEvent): void {\r\n if (!this.#menu) return;\r\n\r\n this.#clone?.replaceChildren(...this.#menu.childNodes);\r\n\r\n this.#menu.remove();\r\n this.#menu.removeEventListener(\"toggle\", this.#menuToggleHandler);\r\n this.#menu.removeEventListener(\"pointerdown\", this.#menuPointerDownHandler);\r\n this.#menu.removeEventListener(\"pointerup\", this.#menuPointerUpHandler);\r\n this.#menu = undefined;\r\n\r\n if (this.#input) {\r\n this.#input.ariaExpanded = \"false\";\r\n this.#input.removeAttribute(\"aria-controls\");\r\n this.#input.removeAttribute(\"aria-owns\");\r\n this.#input.removeAttribute(\"aria-activedescendant\");\r\n }\r\n this.requestUpdate();\r\n\r\n this.#formField?.notifyControlStateChange();\r\n\r\n this.dispatchEvent(\r\n new ToggleEvent(\"toggle\", {\r\n oldState: e.oldState,\r\n newState: e.newState,\r\n }),\r\n );\r\n\r\n if (this.#input?.slot === \"input\" && this.#input.parentElement?.tagName === \"M3E-INPUT-CHIP-SET\") {\r\n this.#clearOptions();\r\n }\r\n }\r\n\r\n /** @private */\r\n #showMenu(): void {\r\n if (this.#menu || !this.#input || this.#input.readOnly || this.#input.disabled) return;\r\n\r\n const count = this.#filterOptions();\r\n\r\n if (!this.#shouldShowMenu) return;\r\n\r\n this.#menu = document.createElement(\"m3e-option-panel\");\r\n this.#menu.id = this.#menuId;\r\n\r\n if (this.panelClass) {\r\n for (const klass of this.panelClass\r\n .split(/\\s+/)\r\n .map((d) => d.trim())\r\n .filter(Boolean)) {\r\n this.#menu.classList.add(klass);\r\n }\r\n }\r\n\r\n this.#menu.style.overflowX = \"hidden\";\r\n this.#menu.scrollStrategy = \"reposition\";\r\n this.#menu.fitAnchorWidth = true;\r\n this.#menu.addEventListener(\"toggle\", this.#menuToggleHandler);\r\n this.#menu.addEventListener(\"pointerdown\", this.#menuPointerDownHandler);\r\n this.#menu.addEventListener(\"pointerup\", this.#menuPointerUpHandler);\r\n\r\n this.#projectClone();\r\n\r\n this.#updateMenuState(this.#menu, count);\r\n\r\n (this.#formField ?? this.#input).insertAdjacentElement(\"afterend\", this.#menu);\r\n\r\n this.#input.setAttribute(\"aria-controls\", this.#menuId);\r\n this.#input.setAttribute(\"aria-owns\", this.#menuId);\r\n\r\n this.#formField?.notifyControlStateChange();\r\n\r\n if (this._listKeyManager.activeItem && this.autoActivate) {\r\n this.#activateOption(this._listKeyManager.activeItem, true);\r\n }\r\n\r\n const input = this.#input;\r\n setTimeout(() => this.#menu?.show(input, this.#formField?.menuAnchor));\r\n }\r\n\r\n /** @private */\r\n #projectClone(): void {\r\n if (!this.#clone || !this.#menu) return;\r\n const children = [...this.#clone.childNodes];\r\n if (!this.#hasNoDataSlot && this.noDataLabel) {\r\n const noDataSpan = document.createElement(\"span\");\r\n noDataSpan.slot = \"no-data\";\r\n noDataSpan.translate = false;\r\n\r\n const text = document.createElement(\"span\");\r\n text.translate = true;\r\n text.textContent = this.noDataLabel;\r\n noDataSpan.append(text);\r\n\r\n children.push(noDataSpan);\r\n }\r\n if (!this.#hasLoadingSlot && this.loadingLabel) {\r\n const loadingSpan = document.createElement(\"span\");\r\n loadingSpan.slot = \"loading\";\r\n loadingSpan.translate = false;\r\n\r\n const text = document.createElement(\"span\");\r\n text.translate = true;\r\n text.textContent = this.loadingLabel;\r\n loadingSpan.append(text);\r\n\r\n children.push(loadingSpan);\r\n }\r\n this.#menu.replaceChildren(...children);\r\n }\r\n\r\n /** @private */\r\n #updateMenuState(menu: M3eOptionPanelElement, count: number): void {\r\n setCustomState(menu, \"--loading\", this.loading);\r\n setCustomState(menu, \"--no-data\", count == 0);\r\n }\r\n\r\n /** @private */\r\n #hideMenu(): void {\r\n this.#menu?.hide();\r\n }\r\n\r\n /** @private */\r\n #activateOption(option: M3eOptionElement, forceFocusVisible = false): void {\r\n if (!this.#input) return;\r\n\r\n this.#input.setAttribute(\"aria-activedescendant\", option.id);\r\n\r\n if (this.#menu) {\r\n scrollIntoViewIfNeeded(option, this.#menu, { block: \"nearest\", behavior: \"instant\" });\r\n\r\n const focusVisible =\r\n forceFocusVisible ||\r\n (!this.#ignoreFocusVisible && (this.#input.matches(\":focus-visible\") || forcedColorsActive()));\r\n\r\n this.#options.forEach((x) => {\r\n const active = x === option && focusVisible;\r\n if (active) {\r\n x.focusRing?.show();\r\n x.stateLayer?.show(\"focused\");\r\n } else {\r\n x.focusRing?.hide();\r\n x.stateLayer?.hide(\"focused\");\r\n }\r\n });\r\n }\r\n }\r\n\r\n /** @private */\r\n async #updateSelectionState(clone: M3eOptionElement): Promise<void> {\r\n const option = this._options[this._listKeyManager.items.indexOf(clone)];\r\n if (option) {\r\n option.selected = clone.selected;\r\n if (option.isUpdatePending) {\r\n await option.updateComplete;\r\n }\r\n }\r\n }\r\n\r\n /** @private */\r\n async #selectOption(option: M3eOptionElement): Promise<void> {\r\n if (option.selected) return;\r\n\r\n option.selected = true;\r\n await this.#updateSelectionState(option);\r\n if (option.isUpdatePending) {\r\n await option.updateComplete;\r\n }\r\n\r\n this.requestUpdate();\r\n if (this.isUpdatePending) {\r\n await this.updateComplete;\r\n }\r\n\r\n if (this.#input) {\r\n this.#input.value = option.label;\r\n }\r\n\r\n this.dispatchEvent(new Event(\"change\", { bubbles: true }));\r\n\r\n this.#formField?.notifyControlStateChange(true);\r\n }\r\n\r\n /** @private */\r\n #filterOption(clone: M3eOptionElement, option: M3eOptionElement, term: string, exactTerm: string): boolean {\r\n const value = this.caseSensitive ? option.value : option.value.toLowerCase();\r\n switch (this.filter) {\r\n case \"starts-with\":\r\n clone.term = exactTerm;\r\n clone.highlightMode = this.filter;\r\n return value.startsWith(term);\r\n case \"ends-with\":\r\n clone.term = exactTerm;\r\n clone.highlightMode = this.filter;\r\n return value.endsWith(term);\r\n case \"contains\":\r\n clone.term = exactTerm;\r\n clone.highlightMode = this.filter;\r\n return value.includes(term);\r\n case \"none\":\r\n clone.disableHighlight = true;\r\n return true;\r\n default:\r\n clone.disableHighlight = true;\r\n return this.filter(option, exactTerm);\r\n }\r\n }\r\n\r\n /** @private */\r\n #filterOptions(): number {\r\n if (!this.#input) return 0;\r\n\r\n const oldCount = this.#options.filter((x) => x.hidden === false).length;\r\n const shouldAnnounce = !this.loading && this.#inputChanged;\r\n this.#inputChanged = false;\r\n\r\n const exactTerm = this.#input.value;\r\n const term = this.caseSensitive ? exactTerm : exactTerm.toLocaleLowerCase();\r\n\r\n let newCount = 0;\r\n let first = false;\r\n let last: M3eOptionElement | undefined;\r\n\r\n for (let i = 0; i < this.#options.length; i++) {\r\n const clone = this.#options[i];\r\n const option = this._options[i];\r\n clone.hidden = !this.#filterOption(clone, option, term, exactTerm);\r\n\r\n if (clone.hidden === true) {\r\n this.#deactivateOption(clone);\r\n deleteCustomState(clone, \"--first\");\r\n deleteCustomState(clone, \"--last\");\r\n } else {\r\n newCount++;\r\n if (!first && !(clone.parentElement instanceof M3eOptGroupElement)) {\r\n addCustomState(clone, \"--first\");\r\n first = true;\r\n addCustomState(clone, \"--last\");\r\n last = clone;\r\n } else {\r\n deleteCustomState(clone, \"--first\");\r\n if (last) {\r\n deleteCustomState(last, \"--last\");\r\n }\r\n addCustomState(clone, \"--last\");\r\n last = clone;\r\n }\r\n }\r\n }\r\n\r\n if (this.#menu) {\r\n this.#updateMenuState(this.#menu, newCount);\r\n }\r\n\r\n const groups = this.#menu?.querySelectorAll(\"m3e-optgroup\") ?? this.#clone?.querySelectorAll(\"m3e-optgroup\") ?? [];\r\n for (const group of groups) {\r\n group.hidden = [...group.querySelectorAll(\"m3e-option\")].every((x) => x.hidden === true);\r\n }\r\n\r\n if (shouldAnnounce) {\r\n this.#announceResults(oldCount, newCount);\r\n }\r\n\r\n this.#autoActivate();\r\n return newCount;\r\n }\r\n\r\n /** @private */\r\n #clearOptions(): boolean {\r\n const selected = this._listKeyManager.items.filter((x) => x.selected);\r\n if (selected.length > 0) {\r\n selected.forEach((x) => {\r\n x.selected = false;\r\n this.#updateSelectionState(x);\r\n });\r\n return true;\r\n }\r\n return false;\r\n }\r\n\r\n /** @private */\r\n #announceResults(oldCount: number, newCount: number): void {\r\n if (!this.#hasFocus) return;\r\n if (newCount == 0) {\r\n if (oldCount > 0 && this.noDataLabel) {\r\n M3eLiveAnnouncer.announce(this.noDataLabel, \"polite\");\r\n }\r\n } else if (oldCount != newCount) {\r\n const message = this.resultsLabel instanceof Function ? this.resultsLabel(newCount) : this.resultsLabel;\r\n if (message) {\r\n M3eLiveAnnouncer.announce(message, \"polite\");\r\n }\r\n }\r\n }\r\n\r\n /** @private */\r\n #autoActivate(): void {\r\n if (this.autoActivate && (!this._listKeyManager.activeItem || !this._listKeyManager.activeItem.selected)) {\r\n const option = this.#options.find((x) => !x.disabled && x.hidden === false);\r\n if (option) {\r\n this._listKeyManager.setActiveItem(option);\r\n if (this.#menu) {\r\n scrollIntoViewIfNeeded(option, this.#menu, { block: \"nearest\", behavior: \"instant\" });\r\n }\r\n }\r\n }\r\n }\r\n\r\n /** @private */\r\n #deactivateOption(option: M3eOptionElement): void {\r\n option.focusRing?.hide();\r\n option.stateLayer?.hide(\"focused\");\r\n if (option === this._listKeyManager.activeItem) {\r\n this._listKeyManager.updateActiveItem(null);\r\n this.#input?.removeAttribute(\"aria-activedescendant\");\r\n }\r\n }\r\n}\r\n\r\ninterface M3eAutocompleteElementEventMap extends HTMLElementEventMap {\r\n toggle: ToggleEvent;\r\n query: CustomEvent<AutocompleteQueryEventDetail>;\r\n}\r\n\r\nexport interface M3eAutocompleteElement {\r\n addEventListener<K extends keyof M3eAutocompleteElementEventMap>(\r\n type: K,\r\n listener: (this: M3eAutocompleteElement, ev: M3eAutocompleteElementEventMap[K]) => void,\r\n options?: boolean | AddEventListenerOptions,\r\n ): void;\r\n\r\n addEventListener(\r\n type: string,\r\n listener: EventListenerOrEventListenerObject,\r\n options?: boolean | AddEventListenerOptions,\r\n ): void;\r\n\r\n removeEventListener<K extends keyof M3eAutocompleteElementEventMap>(\r\n type: K,\r\n listener: (this: M3eAutocompleteElement, ev: M3eAutocompleteElementEventMap[K]) => void,\r\n options?: boolean | EventListenerOptions,\r\n ): void;\r\n\r\n removeEventListener(\r\n type: string,\r\n listener: EventListenerOrEventListenerObject,\r\n options?: boolean | EventListenerOptions,\r\n ): void;\r\n}\r\n\r\ndeclare global {\r\n interface HTMLElementTagNameMap {\r\n \"m3e-autocomplete\": M3eAutocompleteElement;\r\n }\r\n}\r\n"],"names":["M3eAutocompleteElement","HtmlFor","LitElement","constructor","super","_M3eAutocompleteElement_id","set","this","M3eAutocompleteElement_1","__nextId","_M3eAutocompleteElement_menuId","__classPrivateFieldGet","_options","Array","_M3eAutocompleteElement_clone","_M3eAutocompleteElement_ignoreFocusVisible","_M3eAutocompleteElement_menu","_M3eAutocompleteElement_ignoreHideMenuOnBlur","_M3eAutocompleteElement_inputChanged","_M3eAutocompleteElement_hasFocus","_M3eAutocompleteElement_mutationAbortController","_M3eAutocompleteElement_clickHandler","_M3eAutocompleteElement_instances","_M3eAutocompleteElement_handleClick","call","_M3eAutocompleteElement_formFieldPointerDownHandler","_M3eAutocompleteElement_handleFormFieldPointerDown","_M3eAutocompleteElement_focusHandler","_M3eAutocompleteElement_handleFocus","_M3eAutocompleteElement_blurHandler","_M3eAutocompleteElement_handleBlur","_M3eAutocompleteElement_keyDownHandler","e","_M3eAutocompleteElement_inputHandler","_M3eAutocompleteElement_changeHandler","_M3eAutocompleteElement_handleChange","_M3eAutocompleteElement_menuToggleHandler","_M3eAutocompleteElement_menuPointerDownHandler","_M3eAutocompleteElement_menuPointerUpHandler","_M3eAutocompleteElement_menuPressedOption","_listKeyManager","ListKeyManager","withWrap","withHomeAndEnd","withPageUpAndDown","withVerticalOrientation","withSkipPredicate","item","disabled","hidden","onActiveItemChange","activeItem","_M3eAutocompleteElement_activateOption","hideSelectionIndicator","required","autoActivate","caseSensitive","filter","loading","hideNoData","hideLoading","loadingLabel","noDataLabel","resultsLabel","count","panelClass","MutationController","config","childList","subtree","callback","_M3eAutocompleteElement_handleMutation","options","selected","find","x","value","attach","control","HTMLInputElement","autocomplete","role","ariaAutoComplete","ariaExpanded","addEventListener","_M3eAutocompleteElement_formField_get","detach","removeEventListener","clear","restoreFocus","_M3eAutocompleteElement_input_get","_M3eAutocompleteElement_clearOptions","dispatchEvent","Event","bubbles","_M3eAutocompleteElement_filterOptions","focus","_M3eAutocompleteElement_hideMenu","connectedCallback","update","changedProperties","has","setCustomState","M3eLiveAnnouncer","announce","_M3eAutocompleteElement_shouldShowMenu_get","_M3eAutocompleteElement_showMenu","deleteCustomState","render","html","_M3eAutocompleteElement_handleOptionStateChange","items","querySelector","_M3eAutocompleteElement_options_get","some","length","closest","target","M3eOptionElement","stopImmediatePropagation","index","indexOf","clone","async","abort","mutationAbortController","AbortController","__classPrivateFieldSet","querySelectorAll","option","signal","aborted","isUpdatePending","updateComplete","cloneNode","added","setItems","forEach","id","_M3eAutocompleteElement_projectClone","_M3eAutocompleteElement_updateMenuState","readOnly","CustomEvent","detail","term","composed","defaultPrevented","notifyControlStateChange","label","key","preventDefault","_M3eAutocompleteElement_selectOption","prefersReducedMotion","setTimeout","altKey","onKeyDown","undefined","button","composedPath","HTMLElement","tagName","pressedOption","setActiveItem","newState","scrollIntoViewIfNeeded","_M3eAutocompleteElement_autoActivate","ToggleEvent","oldState","_M3eAutocompleteElement_destroyMenu","replaceChildren","childNodes","remove","removeAttribute","requestUpdate","slot","parentElement","document","createElement","klass","split","map","d","trim","Boolean","classList","add","style","overflowX","scrollStrategy","fitAnchorWidth","insertAdjacentElement","setAttribute","input","show","menuAnchor","children","_M3eAutocompleteElement_hasNoDataSlot_get","noDataSpan","translate","text","textContent","append","push","_M3eAutocompleteElement_hasLoadingSlot_get","loadingSpan","menu","hide","forceFocusVisible","block","behavior","focusVisible","matches","forcedColorsActive","focusRing","stateLayer","_M3eAutocompleteElement_updateSelectionState","_M3eAutocompleteElement_filterOption","exactTerm","toLowerCase","highlightMode","startsWith","endsWith","includes","disableHighlight","oldCount","shouldAnnounce","toLocaleLowerCase","last","newCount","first","i","_M3eAutocompleteElement_deactivateOption","M3eOptGroupElement","addCustomState","groups","group","every","_M3eAutocompleteElement_announceResults","message","Function","updateActiveItem","styles","css","__decorate","property","attribute","type","prototype","reflect","converter","fromAttribute","customElement"],"mappings":"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"}
|
package/dist/breadcrumb.js
CHANGED
|
@@ -160,7 +160,7 @@ _M3eBreadcrumbItemButtonElement_handleClick = function _M3eBreadcrumbItemButtonE
|
|
|
160
160
|
}
|
|
161
161
|
};
|
|
162
162
|
/** The styles of the element. */
|
|
163
|
-
M3eBreadcrumbItemButtonElement.styles = css`:host { display: block; outline: none; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); } .base { display: flex; align-items: center; justify-content: center; position: relative; border-radius: var(--m3e-breadcrumb-item-shape, ${DesignToken.shape.corner.full}); height: calc(var(--m3e-breadcrumb-item-container-height, 2.5rem) + ${DesignToken.density.calc(-
|
|
163
|
+
M3eBreadcrumbItemButtonElement.styles = css`:host { display: block; outline: none; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); } .base { display: flex; align-items: center; justify-content: center; position: relative; border-radius: var(--m3e-breadcrumb-item-shape, ${DesignToken.shape.corner.full}); height: calc(var(--m3e-breadcrumb-item-container-height, 2.5rem) + ${DesignToken.density.calc(-3)}); column-gap: var(--m3e-breadcrumb-item-icon-label-space, 0.5rem); } .icon { font-size: var(--m3e-breadcrumb-item-icon-size, 1.25rem); --m3e-icon-size: var(--m3e-breadcrumb-item-icon-size, 1.25rem); } ::slotted([slot="icon"]) { font-size: inherit !important; flex: none; } ::slotted(svg[slot="icon"]) { width: 1em; height: 1em; } :host(:is(:state(--icon-only), :--icon-only)) .overflow { flex: none; } :host(:not(:is(:state(--icon-only), :--icon-only))), :host(:not(:is(:state(--icon-only), :--icon-only))) .base { min-width: 0; } :host(:is(:state(--icon-only), :--icon-only):not([current]):not(:disabled)) .base { color: var(--m3e-breadcrumb-item-icon-color, ${DesignToken.color.onSurfaceVariant}); } :host(:is(:state(--icon-only), :--icon-only)) .base { width: calc(var(--m3e-breadcrumb-item-container-height, 2.5rem) + ${DesignToken.density.calc(-3)}); padding-inline: var(--m3e-breadcrumb-item-icon-padding-inline, 0px); --m3e-state-layer-hover-color: var( --m3e-breadcrumb-item-icon-hover-state-layer-color, ${DesignToken.color.onSurface} ); --m3e-state-layer-focus-color: var( --m3e-breadcrumb-item-icon-focus-state-layer-color, ${DesignToken.color.onSurface} ); --m3e-ripple-color: var(--m3e-breadcrumb-item-icon-pressed-state-layer-color, ${DesignToken.color.onSurface}); } :host(:not(:is(:state(--icon-only), :--icon-only)):not([current]):not(:disabled)) .base { color: var(--m3e-breadcrumb-item-label-color, ${DesignToken.color.primary}); } :host(:not(:is(:state(--icon-only), :--icon-only))) .base { font-size: var(--m3e-breadcrumb-item-label-font-size, ${DesignToken.typescale.standard.label.large.fontSize}); font-weight: var( --m3e-breadcrumb-item-label-font-weight, ${DesignToken.typescale.standard.label.large.fontWeight} ); line-height: var( --m3e-breadcrumb-item-label-line-height, ${DesignToken.typescale.standard.label.large.lineHeight} ); letter-spacing: var(--m3e-breadcrumb-item-label-tracking, ${DesignToken.typescale.standard.label.large.tracking}); } :host(:not(:is(:state(--icon-only), :--icon-only))) .base { padding-inline: var(--m3e-breadcrumb-item-label-padding-inline, 0.75rem); --m3e-state-layer-hover-color: var( --m3e-breadcrumb-item-label-hover-state-layer-color, ${DesignToken.color.primary} ); --m3e-state-layer-focus-color: var( --m3e-breadcrumb-item-label-focus-state-layer-color, ${DesignToken.color.primary} ); --m3e-ripple-color: var(--m3e-breadcrumb-item-label-pressed-state-layer-color, ${DesignToken.color.primary}); } :host([current]) .base { color: var(--m3e-breadcrumb-item-last-color, ${DesignToken.color.onSurface}); } :host(:not(:disabled):not([current])) { cursor: pointer; user-select: none; } :host(:disabled:not([current])) .base { color: color-mix( in srgb, var(--m3e-breadcrumb-item-disabled-color, ${DesignToken.color.onSurface}) var(--m3e-breadcrumb-item-disabled-opacity, 38%), transparent ); } .touch { position: absolute; height: 3rem; width: max(3rem, 100%); margin: auto; } a { all: unset; display: block; position: absolute; top: 0px; left: 0px; right: 0px; bottom: 0px; z-index: 1; } @media (forced-colors: active) { :host(:is(:state(--icon-only), :--icon-only):not([current]):not(:disabled)) .base, :host(:not(:is(:state(--icon-only), :--icon-only)):not([current]):not(:disabled)) .base { color: LinkText; outline: 1px solid LinkText; } :host(:disabled) .base { color: GrayText; } }`;
|
|
164
164
|
__decorate([query(".focus-ring")], M3eBreadcrumbItemButtonElement.prototype, "_focusRing", void 0);
|
|
165
165
|
__decorate([query(".state-layer")], M3eBreadcrumbItemButtonElement.prototype, "_stateLayer", void 0);
|
|
166
166
|
__decorate([query(".ripple")], M3eBreadcrumbItemButtonElement.prototype, "_ripple", void 0);
|
package/dist/breadcrumb.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"breadcrumb.js","sources":["../../src/breadcrumb/BreadcrumbElement.ts","../../src/breadcrumb/isIconOnly.ts","../../src/breadcrumb/BreadcrumbItemButtonElement.ts","../../src/breadcrumb/BreadcrumbItemElement.ts"],"sourcesContent":["import { css, CSSResultGroup, html, LitElement } from \"lit\";\r\nimport { property } from \"lit/decorators.js\";\r\n\r\nimport { customElement, Role } from \"@m3e/web/core\";\r\n\r\nimport type { M3eBreadcrumbItemElement } from \"./BreadcrumbItemElement\";\r\n\r\n/**\r\n * Displays a hierarchical navigation path and identifies the user's\r\n * current location within an application.\r\n *\r\n * @description\r\n * The `m3e-breadcrumb` component arranges `m3e-breadcrumb-item` children into\r\n * a trail of navigation steps. It tracks the last item as the current page and\r\n * supports a custom separator slot for alternate divider content.\r\n *\r\n * @example\r\n * The following example illustrates a simple breadcrumb with three items.\r\n * ```html\r\n * <m3e-breadcrumb>\r\n * <m3e-breadcrumb-item href=\"/dashboard\">Dashboard</m3e-breadcrumb-item>\r\n * <m3e-breadcrumb-item href=\"/dashboard/reports\">Reports</m3e-breadcrumb-item>\r\n * <m3e-breadcrumb-item href=\"/dashboard/reports/annual\">Annual</m3e-breadcrumb-item>\r\n * </m3e-breadcrumb>\r\n * ```\r\n *\r\n * @tag m3e-breadcrumb\r\n *\r\n * @slot - Renders breadcrumb items.\r\n * @slot separator - Renders a custom separator between breadcrumb items.\r\n *\r\n * @attr wrap - Whether breadcrumb items should wrap onto a new line.\r\n */\r\n@customElement(\"m3e-breadcrumb\")\r\nexport class M3eBreadcrumbElement extends Role(LitElement, \"navigation\") {\r\n /** The styles of the element. */\r\n static override styles: CSSResultGroup = css`\r\n :host {\r\n display: block;\r\n }\r\n .base {\r\n display: flex;\r\n align-items: center;\r\n }\r\n :host([wrap]) .base {\r\n flex-wrap: wrap;\r\n }\r\n slot[name=\"separator\"] {\r\n display: none;\r\n }\r\n `;\r\n\r\n /** @private */ #customSeparator: Element[] = [];\r\n\r\n /**\r\n * Whether items wrap to a new line.\r\n * @default false\r\n */\r\n @property({ type: Boolean, reflect: true }) wrap = false;\r\n\r\n /** @inheritdoc */\r\n protected override render(): unknown {\r\n return html`<div class=\"base\" role=\"list\">\r\n <slot @slotchange=\"${this.#handleSlotChange}\"></slot>\r\n <slot name=\"separator\" @slotchange=\"${this.#handleSeparatorSlotChange}\"></slot>\r\n </div>`;\r\n }\r\n\r\n /** @private */\r\n #handleSlotChange(): void {\r\n const items = this.querySelectorAll(\"m3e-breadcrumb-item\");\r\n for (let i = 0; i < items.length; i++) {\r\n const item = items[i];\r\n if (i < items.length - 1) {\r\n item.removeAttribute(\"current\");\r\n } else if (!item.hasAttribute(\"current\")) {\r\n item.setAttribute(\"current\", \"page\");\r\n }\r\n this.#setSeparator(item);\r\n }\r\n }\r\n\r\n /** @private */\r\n #handleSeparatorSlotChange(e: Event): void {\r\n this.#customSeparator = (e.target as HTMLSlotElement).assignedElements({ flatten: true });\r\n this.querySelectorAll(\"m3e-breadcrumb-item\").forEach((x) => this.#setSeparator(x));\r\n }\r\n\r\n /** @private */\r\n #setSeparator(item: M3eBreadcrumbItemElement): void {\r\n item._setSeparator(\r\n this.#customSeparator.map((x) => {\r\n const clone = <Element>x.cloneNode(true);\r\n clone.part = \"separator\";\r\n return clone;\r\n }),\r\n );\r\n }\r\n}\r\n\r\ndeclare global {\r\n interface HTMLElementTagNameMap {\r\n \"m3e-breadcrumb\": M3eBreadcrumbElement;\r\n }\r\n}\r\n","/** @internal */\r\nexport function isIconOnly(slot: HTMLSlotElement): boolean {\r\n const elements = slot.assignedElements({ flatten: true });\r\n if (elements.length === 1) {\r\n const rect = elements[0].getBoundingClientRect();\r\n return rect.width <= 28 && rect.height <= 28;\r\n }\r\n return false;\r\n}\r\n","import { css, CSSResultGroup, html, LitElement, nothing, PropertyValues } from \"lit\";\r\nimport { property, query } from \"lit/decorators.js\";\r\nimport { ifDefined } from \"lit/directives/if-defined.js\";\r\n\r\nimport {\r\n AttachInternals,\r\n customElement,\r\n DesignToken,\r\n Disabled,\r\n Focusable,\r\n KeyboardClick,\r\n LinkButton,\r\n M3eFocusRingElement,\r\n M3eRippleElement,\r\n M3eStateLayerElement,\r\n renderPseudoLink,\r\n Role,\r\n setCustomState,\r\n} from \"@m3e/web/core\";\r\n\r\nimport { BreadcrumbItemCurrent } from \"./BreadcrumbItemCurrent\";\r\nimport { isIconOnly } from \"./isIconOnly\";\r\n\r\n/**\r\n * @internal\r\n * An internal interactive element used to present the content of a breadcrumb item.\r\n */\r\n@customElement(\"m3e-breadcrumb-item-button\")\r\nexport class M3eBreadcrumbItemButtonElement extends KeyboardClick(\r\n LinkButton(Focusable(Disabled(AttachInternals(Role(LitElement, \"button\"), true)))),\r\n) {\r\n /** The styles of the element. */\r\n static override styles: CSSResultGroup = css`\r\n :host {\r\n display: block;\r\n outline: none;\r\n -webkit-tap-highlight-color: rgba(0, 0, 0, 0);\r\n }\r\n .base {\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n position: relative;\r\n border-radius: var(--m3e-breadcrumb-item-shape, ${DesignToken.shape.corner.full});\r\n height: calc(var(--m3e-breadcrumb-item-container-height, 2.5rem) + ${DesignToken.density.calc(-1)});\r\n column-gap: var(--m3e-breadcrumb-item-icon-label-space, 0.5rem);\r\n }\r\n .icon {\r\n font-size: var(--m3e-breadcrumb-item--icon-size, 1.25rem);\r\n --m3e-icon-size: var(--m3e-breadcrumb-item--icon-size, 1.25rem);\r\n }\r\n ::slotted([slot=\"icon\"]) {\r\n font-size: inherit !important;\r\n flex: none;\r\n }\r\n ::slotted(svg[slot=\"icon\"]) {\r\n width: 1em;\r\n height: 1em;\r\n }\r\n :host(:is(:state(--icon-only), :--icon-only)) .overflow {\r\n flex: none;\r\n }\r\n :host(:not(:is(:state(--icon-only), :--icon-only))),\r\n :host(:not(:is(:state(--icon-only), :--icon-only))) .base {\r\n min-width: 0;\r\n }\r\n :host(:is(:state(--icon-only), :--icon-only):not([current]):not(:disabled)) .base {\r\n color: var(--m3e-breadcrumb-item-icon-color, ${DesignToken.color.onSurfaceVariant});\r\n }\r\n :host(:is(:state(--icon-only), :--icon-only)) .base {\r\n width: calc(var(--m3e-breadcrumb-item-container-height, 2.5rem) + ${DesignToken.density.calc(-1)});\r\n padding-inline: var(--m3e-breadcrumb-item-icon-padding-inline, 0px);\r\n --m3e-state-layer-hover-color: var(\r\n --m3e-breadcrumb-item-icon-hover-state-layer-color,\r\n ${DesignToken.color.onSurface}\r\n );\r\n --m3e-state-layer-focus-color: var(\r\n --m3e-breadcrumb-item-icon-focus-state-layer-color,\r\n ${DesignToken.color.onSurface}\r\n );\r\n --m3e-ripple-color: var(--m3e-breadcrumb-item-icon-pressed-state-layer-color, ${DesignToken.color.onSurface});\r\n }\r\n :host(:not(:is(:state(--icon-only), :--icon-only)):not([current]):not(:disabled)) .base {\r\n color: var(--m3e-breadcrumb-item-label-color, ${DesignToken.color.primary});\r\n }\r\n :host(:not(:is(:state(--icon-only), :--icon-only))) .base {\r\n font-size: var(--m3e-breadcrumb-item-label-font-size, ${DesignToken.typescale.standard.label.large.fontSize});\r\n font-weight: var(\r\n --m3e-breadcrumb-item-label-font-weight,\r\n ${DesignToken.typescale.standard.label.large.fontWeight}\r\n );\r\n line-height: var(\r\n --m3e-breadcrumb-item-label-line-height,\r\n ${DesignToken.typescale.standard.label.large.lineHeight}\r\n );\r\n letter-spacing: var(--m3e-breadcrumb-item-label-tracking, ${DesignToken.typescale.standard.label.large.tracking});\r\n }\r\n :host(:not(:is(:state(--icon-only), :--icon-only))) .base {\r\n padding-inline: var(--m3e-breadcrumb-item-label-padding-inline, 0.75rem);\r\n --m3e-state-layer-hover-color: var(\r\n --m3e-breadcrumb-item-label-hover-state-layer-color,\r\n ${DesignToken.color.primary}\r\n );\r\n --m3e-state-layer-focus-color: var(\r\n --m3e-breadcrumb-item-label-focus-state-layer-color,\r\n ${DesignToken.color.primary}\r\n );\r\n --m3e-ripple-color: var(--m3e-breadcrumb-item-label-pressed-state-layer-color, ${DesignToken.color.primary});\r\n }\r\n :host([current]) .base {\r\n color: var(--m3e-breadcrumb-item-last-color, ${DesignToken.color.onSurface});\r\n }\r\n :host(:not(:disabled):not([current])) {\r\n cursor: pointer;\r\n user-select: none;\r\n }\r\n :host(:disabled:not([current])) .base {\r\n color: color-mix(\r\n in srgb,\r\n var(--m3e-breadcrumb-item-disabled-color, ${DesignToken.color.onSurface})\r\n var(--m3e-breadcrumb-item-disabled-opacity, 38%),\r\n transparent\r\n );\r\n }\r\n .touch {\r\n position: absolute;\r\n height: 3rem;\r\n width: max(3rem, 100%);\r\n margin: auto;\r\n }\r\n a {\r\n all: unset;\r\n display: block;\r\n position: absolute;\r\n top: 0px;\r\n left: 0px;\r\n right: 0px;\r\n bottom: 0px;\r\n z-index: 1;\r\n }\r\n @media (forced-colors: active) {\r\n :host(:is(:state(--icon-only), :--icon-only):not([current]):not(:disabled)) .base,\r\n :host(:not(:is(:state(--icon-only), :--icon-only)):not([current]):not(:disabled)) .base {\r\n color: LinkText;\r\n outline: 1px solid LinkText;\r\n }\r\n :host(:disabled) .base {\r\n color: GrayText;\r\n }\r\n }\r\n `;\r\n\r\n /** @private */ @query(\".focus-ring\") private readonly _focusRing?: M3eFocusRingElement;\r\n /** @private */ @query(\".state-layer\") private readonly _stateLayer?: M3eStateLayerElement;\r\n /** @private */ @query(\".ripple\") private readonly _ripple?: M3eRippleElement;\r\n\r\n /** @private */ #clickHandler = (e: Event) => this.#handleClick(e);\r\n\r\n /**\r\n * Indicates the current item in the breadcrumb path.\r\n * @default undefined\r\n */\r\n @property({ reflect: true }) current?: BreadcrumbItemCurrent;\r\n\r\n /** @inheritdoc */\r\n override connectedCallback(): void {\r\n this.addEventListener(\"click\", this.#clickHandler);\r\n super.connectedCallback();\r\n }\r\n\r\n /** @inheritdoc */\r\n override disconnectedCallback(): void {\r\n super.disconnectedCallback();\r\n this.removeEventListener(\"click\", this.#clickHandler);\r\n }\r\n\r\n /** @inheritdoc */\r\n protected override firstUpdated(_changedProperties: PropertyValues<this>): void {\r\n super.firstUpdated(_changedProperties);\r\n [this._focusRing, this._stateLayer, this._ripple].forEach((x) => x?.attach(this));\r\n }\r\n\r\n /** @inheritdoc */\r\n protected override update(changedProperties: PropertyValues<this>): void {\r\n super.update(changedProperties);\r\n\r\n if (changedProperties.has(\"disabled\") || changedProperties.has(\"current\")) {\r\n this.ariaDisabled = this.disabled && !this.current ? \"true\" : null;\r\n }\r\n\r\n if (changedProperties.has(\"current\")) {\r\n if (this.current) {\r\n this.role = null;\r\n } else if (this.hasAttribute(\"href\")) {\r\n this.role = \"link\";\r\n } else {\r\n this.role = \"button\";\r\n }\r\n }\r\n }\r\n\r\n /** @inheritdoc */\r\n protected override render(): unknown {\r\n return html`<div class=\"base\" aria-current=\"${ifDefined(this.current)}\">\r\n ${this.current\r\n ? nothing\r\n : html`<m3e-state-layer class=\"state-layer\" ?disabled=\"${this.disabled}\"> </m3e-state-layer>\r\n <m3e-focus-ring class=\"focus-ring\" ?disabled=\"${this.disabled}\"></m3e-focus-ring>\r\n <m3e-ripple class=\"ripple\" ?disabled=\"${this.disabled}\"></m3e-ripple>\r\n ${this[renderPseudoLink]()}`}\r\n <slot class=\"icon\" name=\"icon\" aria-hidden=\"true\"></slot>\r\n <m3e-text-overflow class=\"overflow\">\r\n <slot @slotchange=\"${this.#handleSlotChange}\"></slot>\r\n </m3e-text-overflow>\r\n ${this.current ? nothing : html`<div class=\"touch\" aria-hidden=\"true\"></div>`}\r\n </div>`;\r\n }\r\n\r\n /** @private */\r\n #handleSlotChange(e: Event): void {\r\n setCustomState(this, \"--icon-only\", isIconOnly(e.target as HTMLSlotElement));\r\n }\r\n\r\n /** @private */\r\n #handleClick(e: Event): void {\r\n // If current and link, disable default link click handler behavior.\r\n if (this.current && this.href) {\r\n e.preventDefault();\r\n }\r\n }\r\n}\r\n\r\ndeclare global {\r\n interface HTMLElementTagNameMap {\r\n \"m3e-breadcrumb-item-button\": M3eBreadcrumbItemButtonElement;\r\n }\r\n}\r\n","import { css, CSSResultGroup, html, LitElement, nothing, PropertyValues } from \"lit\";\r\nimport { property, query } from \"lit/decorators.js\";\r\nimport { ifDefined } from \"lit/directives/if-defined.js\";\r\n\r\nimport { AttachInternals, customElement, LinkButton, Role, setCustomState } from \"@m3e/web/core\";\r\n\r\nimport { M3eBreadcrumbItemButtonElement } from \"./BreadcrumbItemButtonElement\";\r\nimport { BreadcrumbItemCurrent } from \"./BreadcrumbItemCurrent\";\r\nimport { isIconOnly } from \"./isIconOnly\";\r\n\r\nimport \"./BreadcrumbItemButtonElement\";\r\n\r\n/**\r\n * An item in a breadcrumb.\r\n *\r\n * @description\r\n * The `m3e-breadcrumb-item` element represents a single item in a breadcrumb\r\n * navigation trail. It renders an internal button and supports navigation\r\n * attributes for link behavior.\r\n *\r\n * @tag m3e-breadcrumb-item\r\n *\r\n * @slot - Renders the content of the breadcrumb item.\r\n * @slot icon - Renders an icon before the item's label.\r\n *\r\n * @attr item-label - The accessible label used by the internal breadcrumb button.\r\n * @attr disabled - Whether the breadcrumb item is disabled.\r\n * @attr current - Marks the breadcrumb item as the current location in the trail.\r\n * @attr href - The URL to which the internal breadcrumb link button points.\r\n * @attr target - The target of the internal breadcrumb link button.\r\n * @attr download - A value indicating whether the internal link target will be downloaded, optionally specifying a file name.\r\n * @attr rel - The relationship between the internal link target and the document.\r\n *\r\n * @fires click - Dispatched when the element is clicked.\r\n *\r\n * @cssprop --m3e-breadcrumb-item-shape - Shape of the internal breadcrumb item button.\r\n * @cssprop --m3e-breadcrumb-item-container-height - Height of the internal breadcrumb item button container.\r\n * @cssprop --m3e-breadcrumb-item-icon-color - Color of breadcrumb item icon-only content.\r\n * @cssprop --m3e-breadcrumb-item-icon-padding-inline - Horizontal padding for icon-only breadcrumb items.\r\n * @cssprop --m3e-breadcrumb-item-icon-hover-state-layer-color - Hover state layer color for icon-only breadcrumb items.\r\n * @cssprop --m3e-breadcrumb-item-icon-focus-state-layer-color - Focus state layer color for icon-only breadcrumb items.\r\n * @cssprop --m3e-breadcrumb-item-icon-pressed-state-layer-color - Pressed state layer color for icon-only breadcrumb items.\r\n * @cssprop --m3e-breadcrumb-item-label-color - Color of breadcrumb item label content.\r\n * @cssprop --m3e-breadcrumb-item-label-font-size - Font size of breadcrumb item label content.\r\n * @cssprop --m3e-breadcrumb-item-label-font-weight - Font weight of breadcrumb item label content.\r\n * @cssprop --m3e-breadcrumb-item-label-line-height - Line height of breadcrumb item label content.\r\n * @cssprop --m3e-breadcrumb-item-label-tracking - Letter spacing of breadcrumb item label content.\r\n * @cssprop --m3e-breadcrumb-item-label-padding-inline - Horizontal padding for label breadcrumb items.\r\n * @cssprop --m3e-breadcrumb-item-label-hover-state-layer-color - Hover state layer color for label breadcrumb items.\r\n * @cssprop --m3e-breadcrumb-item-label-focus-state-layer-color - Focus state layer color for label breadcrumb items.\r\n * @cssprop --m3e-breadcrumb-item-label-pressed-state-layer-color - Pressed state layer color for label breadcrumb items.\r\n * @cssprop --m3e-breadcrumb-item-last-color - Color used for the current breadcrumb item.\r\n * @cssprop --m3e-breadcrumb-item-icon-label-space - Space between icon and label.\r\n * @cssprop --m3e-breadcrumb-item-icon-size - Size of the icon.\r\n * @cssprop --m3e-breadcrumb-item-disabled-color - Disabled color used by the breadcrumb item button.\r\n * @cssprop --m3e-breadcrumb-item-disabled-opacity - Disabled opacity used by the breadcrumb item button.\r\n */\r\n@customElement(\"m3e-breadcrumb-item\")\r\nexport class M3eBreadcrumbItemElement extends LinkButton(AttachInternals(Role(LitElement, \"listitem\")), true) {\r\n /** The styles of the element. */\r\n static override styles: CSSResultGroup = css`\r\n :host {\r\n display: block;\r\n }\r\n .base {\r\n display: flex;\r\n align-items: center;\r\n height: 100%;\r\n }\r\n :host(:not(:is(:state(--icon-only), :--icon-only))[current]),\r\n :host(:not(:is(:state(--icon-only), :--icon-only))[current]) .base {\r\n min-width: 0;\r\n }\r\n .button {\r\n flex: 1 1 auto;\r\n }\r\n .separator {\r\n flex: none;\r\n display: flex;\r\n justify-content: center;\r\n align-items: center;\r\n min-width: 0.5rem;\r\n --m3e-icon-size: var(--m3e-breadcrumb-separator-icon-size, 1.5rem);\r\n }\r\n .separator-icon {\r\n width: 1em;\r\n height: 1em;\r\n font-size: var(--m3e-icon-size);\r\n vertical-align: middle;\r\n }\r\n `;\r\n\r\n /** @private */ @query(\".button\") private readonly _button!: M3eBreadcrumbItemButtonElement;\r\n /** @private */ #defaultSeparator?: Element;\r\n\r\n /**\r\n * The accessible label given to the item's internal button.\r\n * @default \"\"\r\n */\r\n @property({ attribute: \"item-label\" }) itemLabel = \"\";\r\n\r\n /**\r\n * Whether the element is disabled.\r\n * @default false\r\n */\r\n @property({ type: Boolean, reflect: true }) disabled = false;\r\n\r\n /**\r\n * Indicates the current item in the breadcrumb path.\r\n * @default undefined\r\n */\r\n @property({ reflect: true }) current?: BreadcrumbItemCurrent;\r\n\r\n /** @inheritdoc */\r\n override focus(options?: FocusOptions): void {\r\n this._button?.focus(options);\r\n }\r\n\r\n /** @inheritdoc */\r\n override blur(): void {\r\n this._button?.blur();\r\n }\r\n\r\n /** @inheritdoc */\r\n override click(): void {\r\n this._button?.click();\r\n }\r\n\r\n /** @inheritdoc */\r\n protected override updated(_changedProperties: PropertyValues<this>): void {\r\n super.updated(_changedProperties);\r\n if (_changedProperties.has(\"current\")) {\r\n this.#updateIconFilled();\r\n }\r\n }\r\n\r\n /** @inheritdoc */\r\n protected override render(): unknown {\r\n return html`<div class=\"base\">\r\n <m3e-breadcrumb-item-button\r\n class=\"button\"\r\n aria-label=\"${ifDefined(this.itemLabel || undefined)}\"\r\n ?disabled=\"${this.disabled}\"\r\n current=\"${ifDefined(this.current)}\"\r\n href=\"${ifDefined(this.href || undefined)}\"\r\n target=\"${ifDefined(this.target || undefined)}\"\r\n download=\"${ifDefined(this.download || undefined)}\"\r\n rel=\"${ifDefined(this.rel || undefined)}\"\r\n >\r\n <slot name=\"icon\" slot=\"icon\" @slotchange=\"${this.#handleIconSlotChange}\"></slot>\r\n <slot @slotchange=\"${this.#handleSlotChange}\"></slot>\r\n </m3e-breadcrumb-item-button>\r\n ${this.#renderSeparator()}\r\n </div>`;\r\n }\r\n\r\n /** @private */\r\n #renderSeparator(): unknown {\r\n return this.current\r\n ? nothing\r\n : html`<div class=\"separator\" aria-hidden=\"true\">\r\n <svg class=\"separator-icon\" viewBox=\"0 -960 960 960\" fill=\"currentColor\">\r\n <path d=\"M504-480 320-664l56-56 240 240-240 240-56-56 184-184Z\" />\r\n </svg>\r\n </div>`;\r\n }\r\n\r\n /** @private */\r\n #handleIconSlotChange(): void {\r\n this.#updateIconFilled();\r\n }\r\n\r\n /** @private */\r\n #handleSlotChange(e: Event): void {\r\n setCustomState(this, \"--icon-only\", isIconOnly(e.target as HTMLSlotElement));\r\n this.#updateIconFilled();\r\n }\r\n\r\n /** @private */\r\n #updateIconFilled(): void {\r\n this.querySelectorAll(\"m3e-icon\").forEach((x) => (x.filled = this.current !== undefined && this.current !== null));\r\n }\r\n\r\n /** @internal */\r\n _setSeparator(nodes: Array<Node>) {\r\n const separator = this.shadowRoot?.querySelector(\".separator\");\r\n if (!separator) return;\r\n\r\n if (nodes.length > 0) {\r\n if (!this.#defaultSeparator && separator.firstElementChild) {\r\n this.#defaultSeparator = separator.firstElementChild;\r\n }\r\n separator.replaceChildren(...nodes);\r\n } else if (this.#defaultSeparator) {\r\n separator.replaceChildren(this.#defaultSeparator);\r\n this.#defaultSeparator = undefined;\r\n }\r\n }\r\n}\r\n\r\ndeclare global {\r\n interface HTMLElementTagNameMap {\r\n \"m3e-breadcrumb-item\": M3eBreadcrumbItemElement;\r\n }\r\n}\r\n"],"names":["M3eBreadcrumbElement","Role","LitElement","constructor","_M3eBreadcrumbElement_customSeparator","set","wrap","render","html","__classPrivateFieldGet","_M3eBreadcrumbElement_instances","_M3eBreadcrumbElement_handleSlotChange","_M3eBreadcrumbElement_handleSeparatorSlotChange","items","querySelectorAll","i","length","item","removeAttribute","hasAttribute","setAttribute","_M3eBreadcrumbElement_setSeparator","call","e","__classPrivateFieldSet","target","assignedElements","flatten","forEach","x","_setSeparator","map","clone","cloneNode","part","styles","css","__decorate","property","type","Boolean","reflect","prototype","customElement","isIconOnly","slot","elements","rect","getBoundingClientRect","width","height","M3eBreadcrumbItemButtonElement","KeyboardClick","LinkButton","Focusable","Disabled","AttachInternals","_M3eBreadcrumbItemButtonElement_clickHandler","connectedCallback","addEventListener","disconnectedCallback","removeEventListener","firstUpdated","_changedProperties","_focusRing","_stateLayer","_ripple","attach","update","changedProperties","has","ariaDisabled","disabled","current","role","ifDefined","nothing","renderPseudoLink","_M3eBreadcrumbItemButtonElement_instances","_M3eBreadcrumbItemButtonElement_handleSlotChange","setCustomState","href","preventDefault","DesignToken","shape","corner","full","density","calc","color","onSurfaceVariant","onSurface","primary","typescale","standard","label","large","fontSize","fontWeight","lineHeight","tracking","query","M3eBreadcrumbItemElement","_M3eBreadcrumbItemElement_defaultSeparator","itemLabel","focus","options","_button","blur","click","updated","_M3eBreadcrumbItemElement_instances","_M3eBreadcrumbItemElement_updateIconFilled","undefined","download","rel","_M3eBreadcrumbItemElement_handleIconSlotChange","_M3eBreadcrumbItemElement_handleSlotChange","_M3eBreadcrumbItemElement_renderSeparator","nodes","separator","shadowRoot","querySelector","firstElementChild","replaceChildren","filled","attribute"],"mappings":";;;;;;;;;;;;AAOA;;;;;;;;;;;;;;;;;;;;;;;;;AAyBG;AAEI,IAAMA,oBAAoB,GAA1B,MAAMA,oBAAqB,SAAQC,IAAI,CAACC,UAAU,EAAE,YAAY,CAAC,CAAA;AAAjEC,EAAAA,WAAAA,GAAA;;;AAkBL;AAAgBC,IAAAA,qCAAA,CAAAC,GAAA,CAAA,IAAA,EAA8B,EAAE,CAAA;AAEhD;;;AAGG;IACyC,IAAA,CAAAC,IAAI,GAAG,KAAK;AAwC1D,EAAA;AAtCE;AACmBC,EAAAA,MAAMA,GAAA;IACvB,OAAOC,IAAI,oDACYC,sBAAA,CAAA,IAAI,EAAAC,+BAAA,EAAA,GAAA,EAAAC,sCAAA,CAAkB,CAAA,6CAAA,EACLF,sBAAA,CAAA,IAAI,EAAAC,+BAAA,EAAA,GAAA,EAAAE,+CAAA,CAA2B,CAAA,eAAA,CAChE;AACT,EAAA;;;;;AAIE,EAAA,MAAMC,KAAK,GAAG,IAAI,CAACC,gBAAgB,CAAC,qBAAqB,CAAC;AAC1D,EAAA,KAAK,IAAIC,CAAC,GAAG,CAAC,EAAEA,CAAC,GAAGF,KAAK,CAACG,MAAM,EAAED,CAAC,EAAE,EAAE;AACrC,IAAA,MAAME,IAAI,GAAGJ,KAAK,CAACE,CAAC,CAAC;AACrB,IAAA,IAAIA,CAAC,GAAGF,KAAK,CAACG,MAAM,GAAG,CAAC,EAAE;AACxBC,MAAAA,IAAI,CAACC,eAAe,CAAC,SAAS,CAAC;IACjC,CAAC,MAAM,IAAI,CAACD,IAAI,CAACE,YAAY,CAAC,SAAS,CAAC,EAAE;AACxCF,MAAAA,IAAI,CAACG,YAAY,CAAC,SAAS,EAAE,MAAM,CAAC;AACtC,IAAA;AACAX,IAAAA,sBAAA,CAAA,IAAI,EAAAC,+BAAA,EAAA,GAAA,EAAAW,kCAAA,CAAc,CAAAC,IAAA,CAAlB,IAAI,EAAeL,IAAI,CAAC;AAC1B,EAAA;AACF,CAAC;2GAG0BM,CAAQ,EAAA;EACjCC,sBAAA,CAAA,IAAI,EAAApB,qCAAA,EAAqBmB,CAAC,CAACE,MAA0B,CAACC,gBAAgB,CAAC;AAAEC,IAAAA,OAAO,EAAE;GAAM,CAAC,MAAA;EACzF,IAAI,CAACb,gBAAgB,CAAC,qBAAqB,CAAC,CAACc,OAAO,CAAEC,CAAC,IAAKpB,sBAAA,CAAA,IAAI,EAAAC,+BAAA,EAAA,GAAA,EAAAW,kCAAA,CAAc,CAAAC,IAAA,CAAlB,IAAI,EAAeO,CAAC,CAAC,CAAC;AACpF,CAAC;iFAGaZ,IAA8B,EAAA;AAC1CA,EAAAA,IAAI,CAACa,aAAa,CAChBrB,sBAAA,CAAA,IAAI,EAAAL,qCAAA,EAAA,GAAA,CAAiB,CAAC2B,GAAG,CAAEF,CAAC,IAAI;AAC9B,IAAA,MAAMG,KAAK,GAAYH,CAAC,CAACI,SAAS,CAAC,IAAI,CAAC;IACxCD,KAAK,CAACE,IAAI,GAAG,WAAW;AACxB,IAAA,OAAOF,KAAK;AACd,EAAA,CAAC,CAAC,CACH;AACH,CAAC;AA9DD;AACgBhC,oBAAA,CAAAmC,MAAM,GAAmBC,GAAG,CAAA,0JAAA,CAAtB;AAsBsBC,UAAA,CAAA,CAA3CC,QAAQ,CAAC;AAAEC,EAAAA,IAAI,EAAEC,OAAO;AAAEC,EAAAA,OAAO,EAAE;AAAI,CAAE,CAAC,CAAc,EAAAzC,oBAAA,CAAA0C,SAAA,EAAA,MAAA,EAAA,MAAA,CAAA;AAxB9C1C,oBAAoB,GAAAqC,UAAA,CAAA,CADhCM,aAAa,CAAC,gBAAgB,CAAC,CACnB,EAAA3C,oBAAoB,CAgEhC;;AClGD;AACM,SAAU4C,UAAUA,CAACC,IAAqB,EAAA;AAC9C,EAAA,MAAMC,QAAQ,GAAGD,IAAI,CAACnB,gBAAgB,CAAC;AAAEC,IAAAA,OAAO,EAAE;AAAI,GAAE,CAAC;AACzD,EAAA,IAAImB,QAAQ,CAAC9B,MAAM,KAAK,CAAC,EAAE;IACzB,MAAM+B,IAAI,GAAGD,QAAQ,CAAC,CAAC,CAAC,CAACE,qBAAqB,EAAE;IAChD,OAAOD,IAAI,CAACE,KAAK,IAAI,EAAE,IAAIF,IAAI,CAACG,MAAM,IAAI,EAAE;AAC9C,EAAA;AACA,EAAA,OAAO,KAAK;AACd;;;ACeA;;;AAGG;AAEI,IAAMC,8BAA8B,GAApC,MAAMA,8BAA+B,SAAQC,aAAa,CAC/DC,UAAU,CAACC,SAAS,CAACC,QAAQ,CAACC,eAAe,CAACvD,IAAI,CAACC,UAAU,EAAE,QAAQ,CAAC,EAAE,IAAI,CAAC,CAAC,CAAC,CAAC,CACnF,CAAA;AAFMC,EAAAA,WAAAA,GAAA;;;AAgIL;IAAgBsD,4CAAA,CAAApD,GAAA,CAAA,IAAA,EAAiBkB,CAAQ,IAAKd,sBAAA,CAAA,IAAI,8FAAa,CAAAa,IAAA,CAAjB,IAAI,EAAcC,CAAC,CAAC,CAAA;AA0EpE,EAAA;AAlEE;AACSmC,EAAAA,iBAAiBA,GAAA;AACxB,IAAA,IAAI,CAACC,gBAAgB,CAAC,OAAO,EAAElD,sBAAA,CAAA,IAAI,EAAAgD,4CAAA,EAAA,GAAA,CAAc,CAAC;IAClD,KAAK,CAACC,iBAAiB,EAAE;AAC3B,EAAA;AAEA;AACSE,EAAAA,oBAAoBA,GAAA;IAC3B,KAAK,CAACA,oBAAoB,EAAE;AAC5B,IAAA,IAAI,CAACC,mBAAmB,CAAC,OAAO,EAAEpD,sBAAA,CAAA,IAAI,EAAAgD,4CAAA,EAAA,GAAA,CAAc,CAAC;AACvD,EAAA;AAEA;EACmBK,YAAYA,CAACC,kBAAwC,EAAA;AACtE,IAAA,KAAK,CAACD,YAAY,CAACC,kBAAkB,CAAC;IACtC,CAAC,IAAI,CAACC,UAAU,EAAE,IAAI,CAACC,WAAW,EAAE,IAAI,CAACC,OAAO,CAAC,CAACtC,OAAO,CAAEC,CAAC,IAAKA,CAAC,EAAEsC,MAAM,CAAC,IAAI,CAAC,CAAC;AACnF,EAAA;AAEA;EACmBC,MAAMA,CAACC,iBAAuC,EAAA;AAC/D,IAAA,KAAK,CAACD,MAAM,CAACC,iBAAiB,CAAC;AAE/B,IAAA,IAAIA,iBAAiB,CAACC,GAAG,CAAC,UAAU,CAAC,IAAID,iBAAiB,CAACC,GAAG,CAAC,SAAS,CAAC,EAAE;AACzE,MAAA,IAAI,CAACC,YAAY,GAAG,IAAI,CAACC,QAAQ,IAAI,CAAC,IAAI,CAACC,OAAO,GAAG,MAAM,GAAG,IAAI;AACpE,IAAA;AAEA,IAAA,IAAIJ,iBAAiB,CAACC,GAAG,CAAC,SAAS,CAAC,EAAE;MACpC,IAAI,IAAI,CAACG,OAAO,EAAE;QAChB,IAAI,CAACC,IAAI,GAAG,IAAI;MAClB,CAAC,MAAM,IAAI,IAAI,CAACvD,YAAY,CAAC,MAAM,CAAC,EAAE;QACpC,IAAI,CAACuD,IAAI,GAAG,MAAM;AACpB,MAAA,CAAC,MAAM;QACL,IAAI,CAACA,IAAI,GAAG,QAAQ;AACtB,MAAA;AACF,IAAA;AACF,EAAA;AAEA;AACmBnE,EAAAA,MAAMA,GAAA;IACvB,OAAOC,IAAI,CAAA,gCAAA,EAAmCmE,SAAS,CAAC,IAAI,CAACF,OAAO,CAAC,CAAA,EAAA,EACjE,IAAI,CAACA,OAAO,GACVG,OAAO,GACPpE,IAAI,CAAA,gDAAA,EAAmD,IAAI,CAACgE,QAAQ,CAAA,kEAAA,EAClB,IAAI,CAACA,QAAQ,CAAA,yDAAA,EACrB,IAAI,CAACA,QAAQ,kBACnD,IAAI,CAACK,gBAAgB,CAAC,EAAE,CAAA,CAAE,CAAA,gHAAA,EAGXpE,sBAAA,CAAA,IAAI,EAAAqE,yCAAA,EAAA,GAAA,EAAAC,gDAAA,CAAkB,CAAA,6BAAA,EAE3C,IAAI,CAACN,OAAO,GAAGG,OAAO,GAAGpE,IAAI,CAAA,4CAAA,CAA8C,CAAA,MAAA,CACxE;AACT,EAAA;;;;6GAGkBe,CAAQ,EAAA;EACxByD,cAAc,CAAC,IAAI,EAAE,aAAa,EAAEpC,UAAU,CAACrB,CAAC,CAACE,MAAyB,CAAC,CAAC;AAC9E,CAAC;mGAGYF,CAAQ,EAAA;AACnB;AACA,EAAA,IAAI,IAAI,CAACkD,OAAO,IAAI,IAAI,CAACQ,IAAI,EAAE;IAC7B1D,CAAC,CAAC2D,cAAc,EAAE;AACpB,EAAA;AACF,CAAC;AAtMD;AACgB/B,8BAAA,CAAAhB,MAAM,GAAmBC,GAAG,oOAWU+C,WAAW,CAACC,KAAK,CAACC,MAAM,CAACC,IAAI,CAAA,sEAAA,EACVH,WAAW,CAACI,OAAO,CAACC,IAAI,CAAC,EAAE,CAAC,0pBAuBlDL,WAAW,CAACM,KAAK,CAACC,gBAAgB,CAAA,6HAAA,EAGbP,WAAW,CAACI,OAAO,CAACC,IAAI,CAAC,EAAE,CAAC,CAAA,gKAAA,EAI5FL,WAAW,CAACM,KAAK,CAACE,SAAS,CAAA,4FAAA,EAI3BR,WAAW,CAACM,KAAK,CAACE,SAAS,CAAA,kFAAA,EAEiDR,WAAW,CAACM,KAAK,CAACE,SAAS,CAAA,6IAAA,EAG3DR,WAAW,CAACM,KAAK,CAACG,OAAO,CAAA,uHAAA,EAGjBT,WAAW,CAACU,SAAS,CAACC,QAAQ,CAACC,KAAK,CAACC,KAAK,CAACC,QAAQ,CAAA,8DAAA,EAGvGd,WAAW,CAACU,SAAS,CAACC,QAAQ,CAACC,KAAK,CAACC,KAAK,CAACE,UAAU,CAAA,+DAAA,EAIrDf,WAAW,CAACU,SAAS,CAACC,QAAQ,CAACC,KAAK,CAACC,KAAK,CAACG,UAAU,CAAA,8DAAA,EAEGhB,WAAW,CAACU,SAAS,CAACC,QAAQ,CAACC,KAAK,CAACC,KAAK,CAACI,QAAQ,CAAA,oOAAA,EAM3GjB,WAAW,CAACM,KAAK,CAACG,OAAO,CAAA,6FAAA,EAIzBT,WAAW,CAACM,KAAK,CAACG,OAAO,CAAA,mFAAA,EAEoDT,WAAW,CAACM,KAAK,CAACG,OAAO,CAAA,2EAAA,EAG3DT,WAAW,CAACM,KAAK,CAACE,SAAS,CAAA,gMAAA,EAS5BR,WAAW,CAACM,KAAK,CAACE,SAAS,CAAA,mjBAAA,CAvFvD;AAwHiCtD,UAAA,CAAA,CAAtCgE,KAAK,CAAC,aAAa,CAAC,CAAmD,EAAAlD,8BAAA,CAAAT,SAAA,EAAA,YAAA,EAAA,MAAA,CAAA;AAChCL,UAAA,CAAA,CAAvCgE,KAAK,CAAC,cAAc,CAAC,CAAqD,EAAAlD,8BAAA,CAAAT,SAAA,EAAA,aAAA,EAAA,MAAA,CAAA;AACxCL,UAAA,CAAA,CAAlCgE,KAAK,CAAC,SAAS,CAAC,CAA6C,EAAAlD,8BAAA,CAAAT,SAAA,EAAA,SAAA,EAAA,MAAA,CAAA;AAQjDL,UAAA,CAAA,CAA5BC,QAAQ,CAAC;AAAEG,EAAAA,OAAO,EAAE;CAAM,CAAC,CAAiC,EAAAU,8BAAA,CAAAT,SAAA,EAAA,SAAA,EAAA,MAAA,CAAA;AAtIlDS,8BAA8B,GAAAd,UAAA,CAAA,CAD1CM,aAAa,CAAC,4BAA4B,CAAC,CAC/B,EAAAQ,8BAA8B,CA0M1C;;;AC1ND;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA4CG;AAEI,IAAMmD,wBAAwB,GAA9B,MAAMA,wBAAyB,SAAQjD,UAAU,CAACG,eAAe,CAACvD,IAAI,CAACC,UAAU,EAAE,UAAU,CAAC,CAAC,EAAE,IAAI,CAAC,CAAA;AAAtGC,EAAAA,WAAAA,GAAA;;;AAmCL;AAAgBoG,IAAAA,0CAAA,CAAAlG,GAAA,CAAA,IAAA,EAAA,MAAA,CAAA;AAEhB;;;AAGG;IACoC,IAAA,CAAAmG,SAAS,GAAG,EAAE;AAErD;;;AAGG;IACyC,IAAA,CAAAhC,QAAQ,GAAG,KAAK;AA6F9D,EAAA;AArFE;EACSiC,KAAKA,CAACC,OAAsB,EAAA;AACnC,IAAA,IAAI,CAACC,OAAO,EAAEF,KAAK,CAACC,OAAO,CAAC;AAC9B,EAAA;AAEA;AACSE,EAAAA,IAAIA,GAAA;AACX,IAAA,IAAI,CAACD,OAAO,EAAEC,IAAI,EAAE;AACtB,EAAA;AAEA;AACSC,EAAAA,KAAKA,GAAA;AACZ,IAAA,IAAI,CAACF,OAAO,EAAEE,KAAK,EAAE;AACvB,EAAA;AAEA;EACmBC,OAAOA,CAAC/C,kBAAwC,EAAA;AACjE,IAAA,KAAK,CAAC+C,OAAO,CAAC/C,kBAAkB,CAAC;AACjC,IAAA,IAAIA,kBAAkB,CAACO,GAAG,CAAC,SAAS,CAAC,EAAE;AACrC7D,MAAAA,sBAAA,CAAA,IAAI,EAAAsG,mCAAA,EAAA,GAAA,EAAAC,0CAAA,CAAkB,CAAA1F,IAAA,CAAtB,IAAI,CAAoB;AAC1B,IAAA;AACF,EAAA;AAEA;AACmBf,EAAAA,MAAMA,GAAA;IACvB,OAAOC,IAAI,4EAGOmE,SAAS,CAAC,IAAI,CAAC6B,SAAS,IAAIS,SAAS,CAAC,gBACvC,IAAI,CAACzC,QAAQ,CAAA,WAAA,EACfG,SAAS,CAAC,IAAI,CAACF,OAAO,CAAC,CAAA,QAAA,EAC1BE,SAAS,CAAC,IAAI,CAACM,IAAI,IAAIgC,SAAS,CAAC,CAAA,UAAA,EAC/BtC,SAAS,CAAC,IAAI,CAAClD,MAAM,IAAIwF,SAAS,CAAC,CAAA,YAAA,EACjCtC,SAAS,CAAC,IAAI,CAACuC,QAAQ,IAAID,SAAS,CAAC,CAAA,OAAA,EAC1CtC,SAAS,CAAC,IAAI,CAACwC,GAAG,IAAIF,SAAS,CAAC,CAAA,6CAAA,EAEMxG,sBAAA,CAAA,IAAI,EAAAsG,mCAAA,EAAA,GAAA,EAAAK,8CAAA,CAAsB,CAAA,4BAAA,EAClD3G,sBAAA,CAAA,IAAI,EAAAsG,mCAAA,EAAA,GAAA,EAAAM,0CAAA,CAAkB,CAAA,sCAAA,EAE3C5G,sBAAA,CAAA,IAAI,EAAAsG,mCAAA,EAAA,GAAA,EAAAO,yCAAA,CAAiB,CAAAhG,IAAA,CAArB,IAAI,CAAmB,CAAA,MAAA,CACpB;AACT,EAAA;AA6BA;EACAQ,aAAaA,CAACyF,KAAkB,EAAA;IAC9B,MAAMC,SAAS,GAAG,IAAI,CAACC,UAAU,EAAEC,aAAa,CAAC,YAAY,CAAC;IAC9D,IAAI,CAACF,SAAS,EAAE;AAEhB,IAAA,IAAID,KAAK,CAACvG,MAAM,GAAG,CAAC,EAAE;AACpB,MAAA,IAAI,CAACP,uBAAA,IAAI,EAAA8F,0CAAA,EAAA,GAAA,CAAkB,IAAIiB,SAAS,CAACG,iBAAiB,EAAE;QAC1DnG,sBAAA,CAAA,IAAI,EAAA+E,0CAAA,EAAqBiB,SAAS,CAACG,iBAAiB,MAAA;AACtD,MAAA;AACAH,MAAAA,SAAS,CAACI,eAAe,CAAC,GAAGL,KAAK,CAAC;IACrC,CAAC,MAAM,IAAI9G,sBAAA,CAAA,IAAI,EAAA8F,0CAAA,EAAA,GAAA,CAAkB,EAAE;MACjCiB,SAAS,CAACI,eAAe,CAACnH,uBAAA,IAAI,EAAA8F,0CAAA,EAAA,GAAA,CAAkB,CAAC;MACjD/E,sBAAA,CAAA,IAAI,EAAA+E,0CAAA,EAAqBU,SAAS,EAAA,GAAA,CAAA;AACpC,IAAA;AACF,EAAA;;;;;AAvCE,EAAA,OAAO,IAAI,CAACxC,OAAO,GACfG,OAAO,GACPpE,IAAI,CAAA,gMAAA,CAIG;AACb,CAAC;;AAICC,EAAAA,sBAAA,CAAA,IAAI,EAAAsG,mCAAA,EAAA,GAAA,EAAAC,0CAAA,CAAkB,CAAA1F,IAAA,CAAtB,IAAI,CAAoB;AAC1B,CAAC;iGAGiBC,CAAQ,EAAA;EACxByD,cAAc,CAAC,IAAI,EAAE,aAAa,EAAEpC,UAAU,CAACrB,CAAC,CAACE,MAAyB,CAAC,CAAC;AAC5EhB,EAAAA,sBAAA,CAAA,IAAI,EAAAsG,mCAAA,EAAA,GAAA,EAAAC,0CAAA,CAAkB,CAAA1F,IAAA,CAAtB,IAAI,CAAoB;AAC1B,CAAC;;EAIC,IAAI,CAACR,gBAAgB,CAAC,UAAU,CAAC,CAACc,OAAO,CAAEC,CAAC,IAAMA,CAAC,CAACgG,MAAM,GAAG,IAAI,CAACpD,OAAO,KAAKwC,SAAS,IAAI,IAAI,CAACxC,OAAO,KAAK,IAAK,CAAC;AACpH,CAAC;AA1HD;AACgB6B,wBAAA,CAAAnE,MAAM,GAAmBC,GAAG,CAAA,yhBAAA,CAAtB;AAgC6BC,UAAA,CAAA,CAAlCgE,KAAK,CAAC,SAAS,CAAC,CAA2D,EAAAC,wBAAA,CAAA5D,SAAA,EAAA,SAAA,EAAA,MAAA,CAAA;AAOrDL,UAAA,CAAA,CAAtCC,QAAQ,CAAC;AAAEwF,EAAAA,SAAS,EAAE;CAAc,CAAC,CAAgB,EAAAxB,wBAAA,CAAA5D,SAAA,EAAA,WAAA,EAAA,MAAA,CAAA;AAMVL,UAAA,CAAA,CAA3CC,QAAQ,CAAC;AAAEC,EAAAA,IAAI,EAAEC,OAAO;AAAEC,EAAAA,OAAO,EAAE;AAAI,CAAE,CAAC,CAAkB,EAAA6D,wBAAA,CAAA5D,SAAA,EAAA,UAAA,EAAA,MAAA,CAAA;AAMhCL,UAAA,CAAA,CAA5BC,QAAQ,CAAC;AAAEG,EAAAA,OAAO,EAAE;CAAM,CAAC,CAAiC,EAAA6D,wBAAA,CAAA5D,SAAA,EAAA,SAAA,EAAA,MAAA,CAAA;AArDlD4D,wBAAwB,GAAAjE,UAAA,CAAA,CADpCM,aAAa,CAAC,qBAAqB,CAAC,CACxB,EAAA2D,wBAAwB,CA4IpC;;;;"}
|
|
1
|
+
{"version":3,"file":"breadcrumb.js","sources":["../../src/breadcrumb/BreadcrumbElement.ts","../../src/breadcrumb/isIconOnly.ts","../../src/breadcrumb/BreadcrumbItemButtonElement.ts","../../src/breadcrumb/BreadcrumbItemElement.ts"],"sourcesContent":["import { css, CSSResultGroup, html, LitElement } from \"lit\";\r\nimport { property } from \"lit/decorators.js\";\r\n\r\nimport { customElement, Role } from \"@m3e/web/core\";\r\n\r\nimport type { M3eBreadcrumbItemElement } from \"./BreadcrumbItemElement\";\r\n\r\n/**\r\n * Displays a hierarchical navigation path and identifies the user's\r\n * current location within an application.\r\n *\r\n * @description\r\n * The `m3e-breadcrumb` component arranges `m3e-breadcrumb-item` children into\r\n * a trail of navigation steps. It tracks the last item as the current page and\r\n * supports a custom separator slot for alternate divider content.\r\n *\r\n * @example\r\n * The following example illustrates a simple breadcrumb with three items.\r\n * ```html\r\n * <m3e-breadcrumb>\r\n * <m3e-breadcrumb-item href=\"/dashboard\">Dashboard</m3e-breadcrumb-item>\r\n * <m3e-breadcrumb-item href=\"/dashboard/reports\">Reports</m3e-breadcrumb-item>\r\n * <m3e-breadcrumb-item href=\"/dashboard/reports/annual\">Annual</m3e-breadcrumb-item>\r\n * </m3e-breadcrumb>\r\n * ```\r\n *\r\n * @tag m3e-breadcrumb\r\n *\r\n * @slot - Renders breadcrumb items.\r\n * @slot separator - Renders a custom separator between breadcrumb items.\r\n *\r\n * @attr wrap - Whether breadcrumb items should wrap onto a new line.\r\n */\r\n@customElement(\"m3e-breadcrumb\")\r\nexport class M3eBreadcrumbElement extends Role(LitElement, \"navigation\") {\r\n /** The styles of the element. */\r\n static override styles: CSSResultGroup = css`\r\n :host {\r\n display: block;\r\n }\r\n .base {\r\n display: flex;\r\n align-items: center;\r\n }\r\n :host([wrap]) .base {\r\n flex-wrap: wrap;\r\n }\r\n slot[name=\"separator\"] {\r\n display: none;\r\n }\r\n `;\r\n\r\n /** @private */ #customSeparator: Element[] = [];\r\n\r\n /**\r\n * Whether items wrap to a new line.\r\n * @default false\r\n */\r\n @property({ type: Boolean, reflect: true }) wrap = false;\r\n\r\n /** @inheritdoc */\r\n protected override render(): unknown {\r\n return html`<div class=\"base\" role=\"list\">\r\n <slot @slotchange=\"${this.#handleSlotChange}\"></slot>\r\n <slot name=\"separator\" @slotchange=\"${this.#handleSeparatorSlotChange}\"></slot>\r\n </div>`;\r\n }\r\n\r\n /** @private */\r\n #handleSlotChange(): void {\r\n const items = this.querySelectorAll(\"m3e-breadcrumb-item\");\r\n for (let i = 0; i < items.length; i++) {\r\n const item = items[i];\r\n if (i < items.length - 1) {\r\n item.removeAttribute(\"current\");\r\n } else if (!item.hasAttribute(\"current\")) {\r\n item.setAttribute(\"current\", \"page\");\r\n }\r\n this.#setSeparator(item);\r\n }\r\n }\r\n\r\n /** @private */\r\n #handleSeparatorSlotChange(e: Event): void {\r\n this.#customSeparator = (e.target as HTMLSlotElement).assignedElements({ flatten: true });\r\n this.querySelectorAll(\"m3e-breadcrumb-item\").forEach((x) => this.#setSeparator(x));\r\n }\r\n\r\n /** @private */\r\n #setSeparator(item: M3eBreadcrumbItemElement): void {\r\n item._setSeparator(\r\n this.#customSeparator.map((x) => {\r\n const clone = <Element>x.cloneNode(true);\r\n clone.part = \"separator\";\r\n return clone;\r\n }),\r\n );\r\n }\r\n}\r\n\r\ndeclare global {\r\n interface HTMLElementTagNameMap {\r\n \"m3e-breadcrumb\": M3eBreadcrumbElement;\r\n }\r\n}\r\n","/** @internal */\r\nexport function isIconOnly(slot: HTMLSlotElement): boolean {\r\n const elements = slot.assignedElements({ flatten: true });\r\n if (elements.length === 1) {\r\n const rect = elements[0].getBoundingClientRect();\r\n return rect.width <= 28 && rect.height <= 28;\r\n }\r\n return false;\r\n}\r\n","import { css, CSSResultGroup, html, LitElement, nothing, PropertyValues } from \"lit\";\r\nimport { property, query } from \"lit/decorators.js\";\r\nimport { ifDefined } from \"lit/directives/if-defined.js\";\r\n\r\nimport {\r\n AttachInternals,\r\n customElement,\r\n DesignToken,\r\n Disabled,\r\n Focusable,\r\n KeyboardClick,\r\n LinkButton,\r\n M3eFocusRingElement,\r\n M3eRippleElement,\r\n M3eStateLayerElement,\r\n renderPseudoLink,\r\n Role,\r\n setCustomState,\r\n} from \"@m3e/web/core\";\r\n\r\nimport { BreadcrumbItemCurrent } from \"./BreadcrumbItemCurrent\";\r\nimport { isIconOnly } from \"./isIconOnly\";\r\n\r\n/**\r\n * @internal\r\n * An internal interactive element used to present the content of a breadcrumb item.\r\n */\r\n@customElement(\"m3e-breadcrumb-item-button\")\r\nexport class M3eBreadcrumbItemButtonElement extends KeyboardClick(\r\n LinkButton(Focusable(Disabled(AttachInternals(Role(LitElement, \"button\"), true)))),\r\n) {\r\n /** The styles of the element. */\r\n static override styles: CSSResultGroup = css`\r\n :host {\r\n display: block;\r\n outline: none;\r\n -webkit-tap-highlight-color: rgba(0, 0, 0, 0);\r\n }\r\n .base {\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n position: relative;\r\n border-radius: var(--m3e-breadcrumb-item-shape, ${DesignToken.shape.corner.full});\r\n height: calc(var(--m3e-breadcrumb-item-container-height, 2.5rem) + ${DesignToken.density.calc(-3)});\r\n column-gap: var(--m3e-breadcrumb-item-icon-label-space, 0.5rem);\r\n }\r\n .icon {\r\n font-size: var(--m3e-breadcrumb-item-icon-size, 1.25rem);\r\n --m3e-icon-size: var(--m3e-breadcrumb-item-icon-size, 1.25rem);\r\n }\r\n ::slotted([slot=\"icon\"]) {\r\n font-size: inherit !important;\r\n flex: none;\r\n }\r\n ::slotted(svg[slot=\"icon\"]) {\r\n width: 1em;\r\n height: 1em;\r\n }\r\n :host(:is(:state(--icon-only), :--icon-only)) .overflow {\r\n flex: none;\r\n }\r\n :host(:not(:is(:state(--icon-only), :--icon-only))),\r\n :host(:not(:is(:state(--icon-only), :--icon-only))) .base {\r\n min-width: 0;\r\n }\r\n :host(:is(:state(--icon-only), :--icon-only):not([current]):not(:disabled)) .base {\r\n color: var(--m3e-breadcrumb-item-icon-color, ${DesignToken.color.onSurfaceVariant});\r\n }\r\n :host(:is(:state(--icon-only), :--icon-only)) .base {\r\n width: calc(var(--m3e-breadcrumb-item-container-height, 2.5rem) + ${DesignToken.density.calc(-3)});\r\n padding-inline: var(--m3e-breadcrumb-item-icon-padding-inline, 0px);\r\n --m3e-state-layer-hover-color: var(\r\n --m3e-breadcrumb-item-icon-hover-state-layer-color,\r\n ${DesignToken.color.onSurface}\r\n );\r\n --m3e-state-layer-focus-color: var(\r\n --m3e-breadcrumb-item-icon-focus-state-layer-color,\r\n ${DesignToken.color.onSurface}\r\n );\r\n --m3e-ripple-color: var(--m3e-breadcrumb-item-icon-pressed-state-layer-color, ${DesignToken.color.onSurface});\r\n }\r\n :host(:not(:is(:state(--icon-only), :--icon-only)):not([current]):not(:disabled)) .base {\r\n color: var(--m3e-breadcrumb-item-label-color, ${DesignToken.color.primary});\r\n }\r\n :host(:not(:is(:state(--icon-only), :--icon-only))) .base {\r\n font-size: var(--m3e-breadcrumb-item-label-font-size, ${DesignToken.typescale.standard.label.large.fontSize});\r\n font-weight: var(\r\n --m3e-breadcrumb-item-label-font-weight,\r\n ${DesignToken.typescale.standard.label.large.fontWeight}\r\n );\r\n line-height: var(\r\n --m3e-breadcrumb-item-label-line-height,\r\n ${DesignToken.typescale.standard.label.large.lineHeight}\r\n );\r\n letter-spacing: var(--m3e-breadcrumb-item-label-tracking, ${DesignToken.typescale.standard.label.large.tracking});\r\n }\r\n :host(:not(:is(:state(--icon-only), :--icon-only))) .base {\r\n padding-inline: var(--m3e-breadcrumb-item-label-padding-inline, 0.75rem);\r\n --m3e-state-layer-hover-color: var(\r\n --m3e-breadcrumb-item-label-hover-state-layer-color,\r\n ${DesignToken.color.primary}\r\n );\r\n --m3e-state-layer-focus-color: var(\r\n --m3e-breadcrumb-item-label-focus-state-layer-color,\r\n ${DesignToken.color.primary}\r\n );\r\n --m3e-ripple-color: var(--m3e-breadcrumb-item-label-pressed-state-layer-color, ${DesignToken.color.primary});\r\n }\r\n :host([current]) .base {\r\n color: var(--m3e-breadcrumb-item-last-color, ${DesignToken.color.onSurface});\r\n }\r\n :host(:not(:disabled):not([current])) {\r\n cursor: pointer;\r\n user-select: none;\r\n }\r\n :host(:disabled:not([current])) .base {\r\n color: color-mix(\r\n in srgb,\r\n var(--m3e-breadcrumb-item-disabled-color, ${DesignToken.color.onSurface})\r\n var(--m3e-breadcrumb-item-disabled-opacity, 38%),\r\n transparent\r\n );\r\n }\r\n .touch {\r\n position: absolute;\r\n height: 3rem;\r\n width: max(3rem, 100%);\r\n margin: auto;\r\n }\r\n a {\r\n all: unset;\r\n display: block;\r\n position: absolute;\r\n top: 0px;\r\n left: 0px;\r\n right: 0px;\r\n bottom: 0px;\r\n z-index: 1;\r\n }\r\n @media (forced-colors: active) {\r\n :host(:is(:state(--icon-only), :--icon-only):not([current]):not(:disabled)) .base,\r\n :host(:not(:is(:state(--icon-only), :--icon-only)):not([current]):not(:disabled)) .base {\r\n color: LinkText;\r\n outline: 1px solid LinkText;\r\n }\r\n :host(:disabled) .base {\r\n color: GrayText;\r\n }\r\n }\r\n `;\r\n\r\n /** @private */ @query(\".focus-ring\") private readonly _focusRing?: M3eFocusRingElement;\r\n /** @private */ @query(\".state-layer\") private readonly _stateLayer?: M3eStateLayerElement;\r\n /** @private */ @query(\".ripple\") private readonly _ripple?: M3eRippleElement;\r\n\r\n /** @private */ #clickHandler = (e: Event) => this.#handleClick(e);\r\n\r\n /**\r\n * Indicates the current item in the breadcrumb path.\r\n * @default undefined\r\n */\r\n @property({ reflect: true }) current?: BreadcrumbItemCurrent;\r\n\r\n /** @inheritdoc */\r\n override connectedCallback(): void {\r\n this.addEventListener(\"click\", this.#clickHandler);\r\n super.connectedCallback();\r\n }\r\n\r\n /** @inheritdoc */\r\n override disconnectedCallback(): void {\r\n super.disconnectedCallback();\r\n this.removeEventListener(\"click\", this.#clickHandler);\r\n }\r\n\r\n /** @inheritdoc */\r\n protected override firstUpdated(_changedProperties: PropertyValues<this>): void {\r\n super.firstUpdated(_changedProperties);\r\n [this._focusRing, this._stateLayer, this._ripple].forEach((x) => x?.attach(this));\r\n }\r\n\r\n /** @inheritdoc */\r\n protected override update(changedProperties: PropertyValues<this>): void {\r\n super.update(changedProperties);\r\n\r\n if (changedProperties.has(\"disabled\") || changedProperties.has(\"current\")) {\r\n this.ariaDisabled = this.disabled && !this.current ? \"true\" : null;\r\n }\r\n\r\n if (changedProperties.has(\"current\")) {\r\n if (this.current) {\r\n this.role = null;\r\n } else if (this.hasAttribute(\"href\")) {\r\n this.role = \"link\";\r\n } else {\r\n this.role = \"button\";\r\n }\r\n }\r\n }\r\n\r\n /** @inheritdoc */\r\n protected override render(): unknown {\r\n return html`<div class=\"base\" aria-current=\"${ifDefined(this.current)}\">\r\n ${this.current\r\n ? nothing\r\n : html`<m3e-state-layer class=\"state-layer\" ?disabled=\"${this.disabled}\"> </m3e-state-layer>\r\n <m3e-focus-ring class=\"focus-ring\" ?disabled=\"${this.disabled}\"></m3e-focus-ring>\r\n <m3e-ripple class=\"ripple\" ?disabled=\"${this.disabled}\"></m3e-ripple>\r\n ${this[renderPseudoLink]()}`}\r\n <slot class=\"icon\" name=\"icon\" aria-hidden=\"true\"></slot>\r\n <m3e-text-overflow class=\"overflow\">\r\n <slot @slotchange=\"${this.#handleSlotChange}\"></slot>\r\n </m3e-text-overflow>\r\n ${this.current ? nothing : html`<div class=\"touch\" aria-hidden=\"true\"></div>`}\r\n </div>`;\r\n }\r\n\r\n /** @private */\r\n #handleSlotChange(e: Event): void {\r\n setCustomState(this, \"--icon-only\", isIconOnly(e.target as HTMLSlotElement));\r\n }\r\n\r\n /** @private */\r\n #handleClick(e: Event): void {\r\n // If current and link, disable default link click handler behavior.\r\n if (this.current && this.href) {\r\n e.preventDefault();\r\n }\r\n }\r\n}\r\n\r\ndeclare global {\r\n interface HTMLElementTagNameMap {\r\n \"m3e-breadcrumb-item-button\": M3eBreadcrumbItemButtonElement;\r\n }\r\n}\r\n","import { css, CSSResultGroup, html, LitElement, nothing, PropertyValues } from \"lit\";\r\nimport { property, query } from \"lit/decorators.js\";\r\nimport { ifDefined } from \"lit/directives/if-defined.js\";\r\n\r\nimport { AttachInternals, customElement, LinkButton, Role, setCustomState } from \"@m3e/web/core\";\r\n\r\nimport { M3eBreadcrumbItemButtonElement } from \"./BreadcrumbItemButtonElement\";\r\nimport { BreadcrumbItemCurrent } from \"./BreadcrumbItemCurrent\";\r\nimport { isIconOnly } from \"./isIconOnly\";\r\n\r\nimport \"./BreadcrumbItemButtonElement\";\r\n\r\n/**\r\n * An item in a breadcrumb.\r\n *\r\n * @description\r\n * The `m3e-breadcrumb-item` element represents a single item in a breadcrumb\r\n * navigation trail. It renders an internal button and supports navigation\r\n * attributes for link behavior.\r\n *\r\n * @tag m3e-breadcrumb-item\r\n *\r\n * @slot - Renders the content of the breadcrumb item.\r\n * @slot icon - Renders an icon before the item's label.\r\n *\r\n * @attr item-label - The accessible label used by the internal breadcrumb button.\r\n * @attr disabled - Whether the breadcrumb item is disabled.\r\n * @attr current - Marks the breadcrumb item as the current location in the trail.\r\n * @attr href - The URL to which the internal breadcrumb link button points.\r\n * @attr target - The target of the internal breadcrumb link button.\r\n * @attr download - A value indicating whether the internal link target will be downloaded, optionally specifying a file name.\r\n * @attr rel - The relationship between the internal link target and the document.\r\n *\r\n * @fires click - Dispatched when the element is clicked.\r\n *\r\n * @cssprop --m3e-breadcrumb-item-shape - Shape of the internal breadcrumb item button.\r\n * @cssprop --m3e-breadcrumb-item-container-height - Height of the internal breadcrumb item button container.\r\n * @cssprop --m3e-breadcrumb-item-icon-color - Color of breadcrumb item icon-only content.\r\n * @cssprop --m3e-breadcrumb-item-icon-padding-inline - Horizontal padding for icon-only breadcrumb items.\r\n * @cssprop --m3e-breadcrumb-item-icon-hover-state-layer-color - Hover state layer color for icon-only breadcrumb items.\r\n * @cssprop --m3e-breadcrumb-item-icon-focus-state-layer-color - Focus state layer color for icon-only breadcrumb items.\r\n * @cssprop --m3e-breadcrumb-item-icon-pressed-state-layer-color - Pressed state layer color for icon-only breadcrumb items.\r\n * @cssprop --m3e-breadcrumb-item-label-color - Color of breadcrumb item label content.\r\n * @cssprop --m3e-breadcrumb-item-label-font-size - Font size of breadcrumb item label content.\r\n * @cssprop --m3e-breadcrumb-item-label-font-weight - Font weight of breadcrumb item label content.\r\n * @cssprop --m3e-breadcrumb-item-label-line-height - Line height of breadcrumb item label content.\r\n * @cssprop --m3e-breadcrumb-item-label-tracking - Letter spacing of breadcrumb item label content.\r\n * @cssprop --m3e-breadcrumb-item-label-padding-inline - Horizontal padding for label breadcrumb items.\r\n * @cssprop --m3e-breadcrumb-item-label-hover-state-layer-color - Hover state layer color for label breadcrumb items.\r\n * @cssprop --m3e-breadcrumb-item-label-focus-state-layer-color - Focus state layer color for label breadcrumb items.\r\n * @cssprop --m3e-breadcrumb-item-label-pressed-state-layer-color - Pressed state layer color for label breadcrumb items.\r\n * @cssprop --m3e-breadcrumb-item-last-color - Color used for the current breadcrumb item.\r\n * @cssprop --m3e-breadcrumb-item-icon-label-space - Space between icon and label.\r\n * @cssprop --m3e-breadcrumb-item-icon-size - Size of the icon.\r\n * @cssprop --m3e-breadcrumb-item-disabled-color - Disabled color used by the breadcrumb item button.\r\n * @cssprop --m3e-breadcrumb-item-disabled-opacity - Disabled opacity used by the breadcrumb item button.\r\n */\r\n@customElement(\"m3e-breadcrumb-item\")\r\nexport class M3eBreadcrumbItemElement extends LinkButton(AttachInternals(Role(LitElement, \"listitem\")), true) {\r\n /** The styles of the element. */\r\n static override styles: CSSResultGroup = css`\r\n :host {\r\n display: block;\r\n }\r\n .base {\r\n display: flex;\r\n align-items: center;\r\n height: 100%;\r\n }\r\n :host(:not(:is(:state(--icon-only), :--icon-only))[current]),\r\n :host(:not(:is(:state(--icon-only), :--icon-only))[current]) .base {\r\n min-width: 0;\r\n }\r\n .button {\r\n flex: 1 1 auto;\r\n }\r\n .separator {\r\n flex: none;\r\n display: flex;\r\n justify-content: center;\r\n align-items: center;\r\n min-width: 0.5rem;\r\n --m3e-icon-size: var(--m3e-breadcrumb-separator-icon-size, 1.5rem);\r\n }\r\n .separator-icon {\r\n width: 1em;\r\n height: 1em;\r\n font-size: var(--m3e-icon-size);\r\n vertical-align: middle;\r\n }\r\n `;\r\n\r\n /** @private */ @query(\".button\") private readonly _button!: M3eBreadcrumbItemButtonElement;\r\n /** @private */ #defaultSeparator?: Element;\r\n\r\n /**\r\n * The accessible label given to the item's internal button.\r\n * @default \"\"\r\n */\r\n @property({ attribute: \"item-label\" }) itemLabel = \"\";\r\n\r\n /**\r\n * Whether the element is disabled.\r\n * @default false\r\n */\r\n @property({ type: Boolean, reflect: true }) disabled = false;\r\n\r\n /**\r\n * Indicates the current item in the breadcrumb path.\r\n * @default undefined\r\n */\r\n @property({ reflect: true }) current?: BreadcrumbItemCurrent;\r\n\r\n /** @inheritdoc */\r\n override focus(options?: FocusOptions): void {\r\n this._button?.focus(options);\r\n }\r\n\r\n /** @inheritdoc */\r\n override blur(): void {\r\n this._button?.blur();\r\n }\r\n\r\n /** @inheritdoc */\r\n override click(): void {\r\n this._button?.click();\r\n }\r\n\r\n /** @inheritdoc */\r\n protected override updated(_changedProperties: PropertyValues<this>): void {\r\n super.updated(_changedProperties);\r\n if (_changedProperties.has(\"current\")) {\r\n this.#updateIconFilled();\r\n }\r\n }\r\n\r\n /** @inheritdoc */\r\n protected override render(): unknown {\r\n return html`<div class=\"base\">\r\n <m3e-breadcrumb-item-button\r\n class=\"button\"\r\n aria-label=\"${ifDefined(this.itemLabel || undefined)}\"\r\n ?disabled=\"${this.disabled}\"\r\n current=\"${ifDefined(this.current)}\"\r\n href=\"${ifDefined(this.href || undefined)}\"\r\n target=\"${ifDefined(this.target || undefined)}\"\r\n download=\"${ifDefined(this.download || undefined)}\"\r\n rel=\"${ifDefined(this.rel || undefined)}\"\r\n >\r\n <slot name=\"icon\" slot=\"icon\" @slotchange=\"${this.#handleIconSlotChange}\"></slot>\r\n <slot @slotchange=\"${this.#handleSlotChange}\"></slot>\r\n </m3e-breadcrumb-item-button>\r\n ${this.#renderSeparator()}\r\n </div>`;\r\n }\r\n\r\n /** @private */\r\n #renderSeparator(): unknown {\r\n return this.current\r\n ? nothing\r\n : html`<div class=\"separator\" aria-hidden=\"true\">\r\n <svg class=\"separator-icon\" viewBox=\"0 -960 960 960\" fill=\"currentColor\">\r\n <path d=\"M504-480 320-664l56-56 240 240-240 240-56-56 184-184Z\" />\r\n </svg>\r\n </div>`;\r\n }\r\n\r\n /** @private */\r\n #handleIconSlotChange(): void {\r\n this.#updateIconFilled();\r\n }\r\n\r\n /** @private */\r\n #handleSlotChange(e: Event): void {\r\n setCustomState(this, \"--icon-only\", isIconOnly(e.target as HTMLSlotElement));\r\n this.#updateIconFilled();\r\n }\r\n\r\n /** @private */\r\n #updateIconFilled(): void {\r\n this.querySelectorAll(\"m3e-icon\").forEach((x) => (x.filled = this.current !== undefined && this.current !== null));\r\n }\r\n\r\n /** @internal */\r\n _setSeparator(nodes: Array<Node>) {\r\n const separator = this.shadowRoot?.querySelector(\".separator\");\r\n if (!separator) return;\r\n\r\n if (nodes.length > 0) {\r\n if (!this.#defaultSeparator && separator.firstElementChild) {\r\n this.#defaultSeparator = separator.firstElementChild;\r\n }\r\n separator.replaceChildren(...nodes);\r\n } else if (this.#defaultSeparator) {\r\n separator.replaceChildren(this.#defaultSeparator);\r\n this.#defaultSeparator = undefined;\r\n }\r\n }\r\n}\r\n\r\ndeclare global {\r\n interface HTMLElementTagNameMap {\r\n \"m3e-breadcrumb-item\": M3eBreadcrumbItemElement;\r\n }\r\n}\r\n"],"names":["M3eBreadcrumbElement","Role","LitElement","constructor","_M3eBreadcrumbElement_customSeparator","set","wrap","render","html","__classPrivateFieldGet","_M3eBreadcrumbElement_instances","_M3eBreadcrumbElement_handleSlotChange","_M3eBreadcrumbElement_handleSeparatorSlotChange","items","querySelectorAll","i","length","item","removeAttribute","hasAttribute","setAttribute","_M3eBreadcrumbElement_setSeparator","call","e","__classPrivateFieldSet","target","assignedElements","flatten","forEach","x","_setSeparator","map","clone","cloneNode","part","styles","css","__decorate","property","type","Boolean","reflect","prototype","customElement","isIconOnly","slot","elements","rect","getBoundingClientRect","width","height","M3eBreadcrumbItemButtonElement","KeyboardClick","LinkButton","Focusable","Disabled","AttachInternals","_M3eBreadcrumbItemButtonElement_clickHandler","connectedCallback","addEventListener","disconnectedCallback","removeEventListener","firstUpdated","_changedProperties","_focusRing","_stateLayer","_ripple","attach","update","changedProperties","has","ariaDisabled","disabled","current","role","ifDefined","nothing","renderPseudoLink","_M3eBreadcrumbItemButtonElement_instances","_M3eBreadcrumbItemButtonElement_handleSlotChange","setCustomState","href","preventDefault","DesignToken","shape","corner","full","density","calc","color","onSurfaceVariant","onSurface","primary","typescale","standard","label","large","fontSize","fontWeight","lineHeight","tracking","query","M3eBreadcrumbItemElement","_M3eBreadcrumbItemElement_defaultSeparator","itemLabel","focus","options","_button","blur","click","updated","_M3eBreadcrumbItemElement_instances","_M3eBreadcrumbItemElement_updateIconFilled","undefined","download","rel","_M3eBreadcrumbItemElement_handleIconSlotChange","_M3eBreadcrumbItemElement_handleSlotChange","_M3eBreadcrumbItemElement_renderSeparator","nodes","separator","shadowRoot","querySelector","firstElementChild","replaceChildren","filled","attribute"],"mappings":"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"}
|
package/dist/breadcrumb.min.js
CHANGED
|
@@ -3,5 +3,5 @@
|
|
|
3
3
|
* Copyright (c) 2025–2026 matraic
|
|
4
4
|
* See LICENSE file in the project root for full license text.
|
|
5
5
|
*/
|
|
6
|
-
import{__classPrivateFieldGet as e,__classPrivateFieldSet as t,__decorate as r}from"tslib";import{LitElement as i,html as o,css as a,nothing as s}from"lit";import{property as l,query as n}from"lit/decorators.js";import{Role as c,customElement as d,KeyboardClick as m,LinkButton as h,Focusable as u,Disabled as b,AttachInternals as p,renderPseudoLink as f,setCustomState as y,DesignToken as v}from"@m3e/web/core";import{ifDefined as g}from"lit/directives/if-defined.js";var $,w,x,k,S;let z=class extends(c(i,"navigation")){constructor(){super(...arguments),$.add(this),w.set(this,[]),this.wrap=!1}render(){return o`<div class="base" role="list"><slot @slotchange="${e(this,$,"m",x)}"></slot><slot name="separator" @slotchange="${e(this,$,"m",k)}"></slot></div>`}};function _(e){const t=e.assignedElements({flatten:!0});if(1===t.length){const e=t[0].getBoundingClientRect();return e.width<=28&&e.height<=28}return!1}var C,E,L,A;w=new WeakMap,$=new WeakSet,x=function(){const t=this.querySelectorAll("m3e-breadcrumb-item");for(let r=0;r<t.length;r++){const i=t[r];r<t.length-1?i.removeAttribute("current"):i.hasAttribute("current")||i.setAttribute("current","page"),e(this,$,"m",S).call(this,i)}},k=function(r){t(this,w,r.target.assignedElements({flatten:!0}),"f"),this.querySelectorAll("m3e-breadcrumb-item").forEach(t=>e(this,$,"m",S).call(this,t))},S=function(t){t._setSeparator(e(this,w,"f").map(e=>{const t=e.cloneNode(!0);return t.part="separator",t}))},z.styles=a`:host { display: block; } .base { display: flex; align-items: center; } :host([wrap]) .base { flex-wrap: wrap; } slot[name="separator"] { display: none; }`,r([l({type:Boolean,reflect:!0})],z.prototype,"wrap",void 0),z=r([d("m3e-breadcrumb")],z);let W=class extends(m(h(u(b(p(c(i,"button"),!0)))))){constructor(){super(...arguments),C.add(this),E.set(this,t=>e(this,C,"m",A).call(this,t))}connectedCallback(){this.addEventListener("click",e(this,E,"f")),super.connectedCallback()}disconnectedCallback(){super.disconnectedCallback(),this.removeEventListener("click",e(this,E,"f"))}firstUpdated(e){super.firstUpdated(e),[this._focusRing,this._stateLayer,this._ripple].forEach(e=>e?.attach(this))}update(e){super.update(e),(e.has("disabled")||e.has("current"))&&(this.ariaDisabled=this.disabled&&!this.current?"true":null),e.has("current")&&(this.current?this.role=null:this.hasAttribute("href")?this.role="link":this.role="button")}render(){return o`<div class="base" aria-current="${g(this.current)}">${this.current?s:o`<m3e-state-layer class="state-layer" ?disabled="${this.disabled}"></m3e-state-layer><m3e-focus-ring class="focus-ring" ?disabled="${this.disabled}"></m3e-focus-ring><m3e-ripple class="ripple" ?disabled="${this.disabled}"></m3e-ripple>${this[f]()}`}<slot class="icon" name="icon" aria-hidden="true"></slot><m3e-text-overflow class="overflow"><slot @slotchange="${e(this,C,"m",L)}"></slot></m3e-text-overflow>${this.current?s:o`<div class="touch" aria-hidden="true"></div>`}</div>`}};var j,q,B,M,R,T;E=new WeakMap,C=new WeakSet,L=function(e){y(this,"--icon-only",_(e.target))},A=function(e){this.current&&this.href&&e.preventDefault()},W.styles=a`:host { display: block; outline: none; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); } .base { display: flex; align-items: center; justify-content: center; position: relative; border-radius: var(--m3e-breadcrumb-item-shape, ${v.shape.corner.full}); height: calc(var(--m3e-breadcrumb-item-container-height, 2.5rem) + ${v.density.calc(-
|
|
6
|
+
import{__classPrivateFieldGet as e,__classPrivateFieldSet as t,__decorate as r}from"tslib";import{LitElement as i,html as o,css as a,nothing as s}from"lit";import{property as l,query as n}from"lit/decorators.js";import{Role as c,customElement as d,KeyboardClick as m,LinkButton as h,Focusable as u,Disabled as b,AttachInternals as p,renderPseudoLink as f,setCustomState as y,DesignToken as v}from"@m3e/web/core";import{ifDefined as g}from"lit/directives/if-defined.js";var $,w,x,k,S;let z=class extends(c(i,"navigation")){constructor(){super(...arguments),$.add(this),w.set(this,[]),this.wrap=!1}render(){return o`<div class="base" role="list"><slot @slotchange="${e(this,$,"m",x)}"></slot><slot name="separator" @slotchange="${e(this,$,"m",k)}"></slot></div>`}};function _(e){const t=e.assignedElements({flatten:!0});if(1===t.length){const e=t[0].getBoundingClientRect();return e.width<=28&&e.height<=28}return!1}var C,E,L,A;w=new WeakMap,$=new WeakSet,x=function(){const t=this.querySelectorAll("m3e-breadcrumb-item");for(let r=0;r<t.length;r++){const i=t[r];r<t.length-1?i.removeAttribute("current"):i.hasAttribute("current")||i.setAttribute("current","page"),e(this,$,"m",S).call(this,i)}},k=function(r){t(this,w,r.target.assignedElements({flatten:!0}),"f"),this.querySelectorAll("m3e-breadcrumb-item").forEach(t=>e(this,$,"m",S).call(this,t))},S=function(t){t._setSeparator(e(this,w,"f").map(e=>{const t=e.cloneNode(!0);return t.part="separator",t}))},z.styles=a`:host { display: block; } .base { display: flex; align-items: center; } :host([wrap]) .base { flex-wrap: wrap; } slot[name="separator"] { display: none; }`,r([l({type:Boolean,reflect:!0})],z.prototype,"wrap",void 0),z=r([d("m3e-breadcrumb")],z);let W=class extends(m(h(u(b(p(c(i,"button"),!0)))))){constructor(){super(...arguments),C.add(this),E.set(this,t=>e(this,C,"m",A).call(this,t))}connectedCallback(){this.addEventListener("click",e(this,E,"f")),super.connectedCallback()}disconnectedCallback(){super.disconnectedCallback(),this.removeEventListener("click",e(this,E,"f"))}firstUpdated(e){super.firstUpdated(e),[this._focusRing,this._stateLayer,this._ripple].forEach(e=>e?.attach(this))}update(e){super.update(e),(e.has("disabled")||e.has("current"))&&(this.ariaDisabled=this.disabled&&!this.current?"true":null),e.has("current")&&(this.current?this.role=null:this.hasAttribute("href")?this.role="link":this.role="button")}render(){return o`<div class="base" aria-current="${g(this.current)}">${this.current?s:o`<m3e-state-layer class="state-layer" ?disabled="${this.disabled}"></m3e-state-layer><m3e-focus-ring class="focus-ring" ?disabled="${this.disabled}"></m3e-focus-ring><m3e-ripple class="ripple" ?disabled="${this.disabled}"></m3e-ripple>${this[f]()}`}<slot class="icon" name="icon" aria-hidden="true"></slot><m3e-text-overflow class="overflow"><slot @slotchange="${e(this,C,"m",L)}"></slot></m3e-text-overflow>${this.current?s:o`<div class="touch" aria-hidden="true"></div>`}</div>`}};var j,q,B,M,R,T;E=new WeakMap,C=new WeakSet,L=function(e){y(this,"--icon-only",_(e.target))},A=function(e){this.current&&this.href&&e.preventDefault()},W.styles=a`:host { display: block; outline: none; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); } .base { display: flex; align-items: center; justify-content: center; position: relative; border-radius: var(--m3e-breadcrumb-item-shape, ${v.shape.corner.full}); height: calc(var(--m3e-breadcrumb-item-container-height, 2.5rem) + ${v.density.calc(-3)}); column-gap: var(--m3e-breadcrumb-item-icon-label-space, 0.5rem); } .icon { font-size: var(--m3e-breadcrumb-item-icon-size, 1.25rem); --m3e-icon-size: var(--m3e-breadcrumb-item-icon-size, 1.25rem); } ::slotted([slot="icon"]) { font-size: inherit !important; flex: none; } ::slotted(svg[slot="icon"]) { width: 1em; height: 1em; } :host(:is(:state(--icon-only), :--icon-only)) .overflow { flex: none; } :host(:not(:is(:state(--icon-only), :--icon-only))), :host(:not(:is(:state(--icon-only), :--icon-only))) .base { min-width: 0; } :host(:is(:state(--icon-only), :--icon-only):not([current]):not(:disabled)) .base { color: var(--m3e-breadcrumb-item-icon-color, ${v.color.onSurfaceVariant}); } :host(:is(:state(--icon-only), :--icon-only)) .base { width: calc(var(--m3e-breadcrumb-item-container-height, 2.5rem) + ${v.density.calc(-3)}); padding-inline: var(--m3e-breadcrumb-item-icon-padding-inline, 0px); --m3e-state-layer-hover-color: var( --m3e-breadcrumb-item-icon-hover-state-layer-color, ${v.color.onSurface} ); --m3e-state-layer-focus-color: var( --m3e-breadcrumb-item-icon-focus-state-layer-color, ${v.color.onSurface} ); --m3e-ripple-color: var(--m3e-breadcrumb-item-icon-pressed-state-layer-color, ${v.color.onSurface}); } :host(:not(:is(:state(--icon-only), :--icon-only)):not([current]):not(:disabled)) .base { color: var(--m3e-breadcrumb-item-label-color, ${v.color.primary}); } :host(:not(:is(:state(--icon-only), :--icon-only))) .base { font-size: var(--m3e-breadcrumb-item-label-font-size, ${v.typescale.standard.label.large.fontSize}); font-weight: var( --m3e-breadcrumb-item-label-font-weight, ${v.typescale.standard.label.large.fontWeight} ); line-height: var( --m3e-breadcrumb-item-label-line-height, ${v.typescale.standard.label.large.lineHeight} ); letter-spacing: var(--m3e-breadcrumb-item-label-tracking, ${v.typescale.standard.label.large.tracking}); } :host(:not(:is(:state(--icon-only), :--icon-only))) .base { padding-inline: var(--m3e-breadcrumb-item-label-padding-inline, 0.75rem); --m3e-state-layer-hover-color: var( --m3e-breadcrumb-item-label-hover-state-layer-color, ${v.color.primary} ); --m3e-state-layer-focus-color: var( --m3e-breadcrumb-item-label-focus-state-layer-color, ${v.color.primary} ); --m3e-ripple-color: var(--m3e-breadcrumb-item-label-pressed-state-layer-color, ${v.color.primary}); } :host([current]) .base { color: var(--m3e-breadcrumb-item-last-color, ${v.color.onSurface}); } :host(:not(:disabled):not([current])) { cursor: pointer; user-select: none; } :host(:disabled:not([current])) .base { color: color-mix( in srgb, var(--m3e-breadcrumb-item-disabled-color, ${v.color.onSurface}) var(--m3e-breadcrumb-item-disabled-opacity, 38%), transparent ); } .touch { position: absolute; height: 3rem; width: max(3rem, 100%); margin: auto; } a { all: unset; display: block; position: absolute; top: 0px; left: 0px; right: 0px; bottom: 0px; z-index: 1; } @media (forced-colors: active) { :host(:is(:state(--icon-only), :--icon-only):not([current]):not(:disabled)) .base, :host(:not(:is(:state(--icon-only), :--icon-only)):not([current]):not(:disabled)) .base { color: LinkText; outline: 1px solid LinkText; } :host(:disabled) .base { color: GrayText; } }`,r([n(".focus-ring")],W.prototype,"_focusRing",void 0),r([n(".state-layer")],W.prototype,"_stateLayer",void 0),r([n(".ripple")],W.prototype,"_ripple",void 0),r([l({reflect:!0})],W.prototype,"current",void 0),W=r([d("m3e-breadcrumb-item-button")],W);let D=class extends(h(p(c(i,"listitem")),!0)){constructor(){super(...arguments),j.add(this),q.set(this,void 0),this.itemLabel="",this.disabled=!1}focus(e){this._button?.focus(e)}blur(){this._button?.blur()}click(){this._button?.click()}updated(t){super.updated(t),t.has("current")&&e(this,j,"m",T).call(this)}render(){return o`<div class="base"><m3e-breadcrumb-item-button class="button" aria-label="${g(this.itemLabel||void 0)}" ?disabled="${this.disabled}" current="${g(this.current)}" href="${g(this.href||void 0)}" target="${g(this.target||void 0)}" download="${g(this.download||void 0)}" rel="${g(this.rel||void 0)}"><slot name="icon" slot="icon" @slotchange="${e(this,j,"m",M)}"></slot><slot @slotchange="${e(this,j,"m",R)}"></slot></m3e-breadcrumb-item-button>${e(this,j,"m",B).call(this)}</div>`}_setSeparator(r){const i=this.shadowRoot?.querySelector(".separator");i&&(r.length>0?(!e(this,q,"f")&&i.firstElementChild&&t(this,q,i.firstElementChild,"f"),i.replaceChildren(...r)):e(this,q,"f")&&(i.replaceChildren(e(this,q,"f")),t(this,q,void 0,"f")))}};q=new WeakMap,j=new WeakSet,B=function(){return this.current?s:o`<div class="separator" aria-hidden="true"><svg class="separator-icon" viewBox="0 -960 960 960" fill="currentColor"><path d="M504-480 320-664l56-56 240 240-240 240-56-56 184-184Z"/></svg></div>`},M=function(){e(this,j,"m",T).call(this)},R=function(t){y(this,"--icon-only",_(t.target)),e(this,j,"m",T).call(this)},T=function(){this.querySelectorAll("m3e-icon").forEach(e=>e.filled=void 0!==this.current&&null!==this.current)},D.styles=a`:host { display: block; } .base { display: flex; align-items: center; height: 100%; } :host(:not(:is(:state(--icon-only), :--icon-only))[current]), :host(:not(:is(:state(--icon-only), :--icon-only))[current]) .base { min-width: 0; } .button { flex: 1 1 auto; } .separator { flex: none; display: flex; justify-content: center; align-items: center; min-width: 0.5rem; --m3e-icon-size: var(--m3e-breadcrumb-separator-icon-size, 1.5rem); } .separator-icon { width: 1em; height: 1em; font-size: var(--m3e-icon-size); vertical-align: middle; }`,r([n(".button")],D.prototype,"_button",void 0),r([l({attribute:"item-label"})],D.prototype,"itemLabel",void 0),r([l({type:Boolean,reflect:!0})],D.prototype,"disabled",void 0),r([l({reflect:!0})],D.prototype,"current",void 0),D=r([d("m3e-breadcrumb-item")],D);export{z as M3eBreadcrumbElement,D as M3eBreadcrumbItemElement};
|
|
7
7
|
//# sourceMappingURL=breadcrumb.min.js.map
|