@api-client/ui 0.5.52 → 0.5.53

package/build/src/md/menu/internal/SubMenu.styles.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SubMenu.styles.d.ts","sourceRoot":"","sources":["../../../../../src/md/menu/internal/SubMenu.styles.ts"],"names":[],"mappings":";AAEA,wBAKC"}
+{"version":3,"file":"SubMenu.styles.d.ts","sourceRoot":"","sources":["../../../../../src/md/menu/internal/SubMenu.styles.ts"],"names":[],"mappings":";AAEA,wBA0BC"}

package/build/src/md/menu/internal/SubMenu.styles.js

@@ -2,7 +2,28 @@ import { css } from 'lit';
 export default css `
   :host {
     position-area: span-bottom right;
-    position-try-fallbacks: flip-block flip-inline;
+    position-try:
+      --submenu-fallback-left,
+      --submenu-fallback-top-right,
+      --submenu-fallback-top-left,
+      --submenu-fallback-bottom-left,
+      flip-block flip-inline;
+  }
+
+  @position-try --submenu-fallback-left {
+    position-area: span-bottom left;
+  }
+
+  @position-try --submenu-fallback-top-right {
+    position-area: span-top right;
+  }
+
+  @position-try --submenu-fallback-top-left {
+    position-area: span-top left;
+  }
+
+  @position-try --submenu-fallback-bottom-left {
+    position-area: span-bottom left;
   }
 `;
 //# sourceMappingURL=SubMenu.styles.js.map

package/build/src/md/menu/internal/SubMenu.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"SubMenu.styles.js","sourceRoot":"","sources":["../../../../../src/md/menu/internal/SubMenu.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAA;AAEzB,eAAe,GAAG,CAAA;;;;;CAKjB,CAAA","sourcesContent":["import { css } from 'lit'\n\nexport default css`\n  :host {\n    position-area: span-bottom right;\n    position-try-fallbacks: flip-block flip-inline;\n  }\n`\n"]}
+{"version":3,"file":"SubMenu.styles.js","sourceRoot":"","sources":["../../../../../src/md/menu/internal/SubMenu.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAA;AAEzB,eAAe,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;CA0BjB,CAAA","sourcesContent":["import { css } from 'lit'\n\nexport default css`\n  :host {\n    position-area: span-bottom right;\n    position-try:\n      --submenu-fallback-left,\n      --submenu-fallback-top-right,\n      --submenu-fallback-top-left,\n      --submenu-fallback-bottom-left,\n      flip-block flip-inline;\n  }\n\n  @position-try --submenu-fallback-left {\n    position-area: span-bottom left;\n  }\n\n  @position-try --submenu-fallback-top-right {\n    position-area: span-top right;\n  }\n\n  @position-try --submenu-fallback-top-left {\n    position-area: span-top left;\n  }\n\n  @position-try --submenu-fallback-bottom-left {\n    position-area: span-bottom left;\n  }\n`\n"]}

package/build/src/md/select/internals/Select.d.ts

@@ -1,4 +1,5 @@
-import { LitElement, PropertyValues, TemplateResult } from 'lit';
+import { PropertyValues, TemplateResult } from 'lit';
+import { UiElement } from '../../UiElement.js';
 import type UiOption from './Option.js';
 import type { UiMenuElement } from '../../menu/ui-menu.js';
 import '../../text-field/ui-outlined-text-field.js';
@@ -17,7 +18,7 @@ export interface UiSelectChangeEvent {
  * @fires open - Dispatched when the dropdown opens
  * @fires close - Dispatched when the dropdown closes
  */
-export default class UiSelect extends LitElement {
+export default class UiSelect extends UiElement {
     #private;
     static readonly formAssociated = true;
     /**
@@ -134,7 +135,6 @@ export default class UiSelect extends LitElement {
      */
     accessor open: boolean;
     accessor selectedOption: UiOption | null;
-    accessor ariaActiveDescendant: string | undefined;
     accessor menu: UiMenuElement;
     /**
      * Returns the currently selected option element. This provides access to the
@@ -244,15 +244,49 @@ export default class UiSelect extends LitElement {
     protected setCurrentOption(): void;
     protected handleKeydown(e: KeyboardEvent): void;
     protected handleBlur(e: FocusEvent): void;
-    protected handleClick(e: Event): void;
+    handleClick(e: Event): void;
     protected handleOpenChange(): Promise<void>;
+    /**
+     * Focus the next menu item in the dropdown, skipping disabled options
+     */
+    focusNextMenuItem(): void;
+    /**
+     * Focus the previous menu item in the dropdown, skipping disabled options
+     */
+    focusPreviousMenuItem(): void;
+    /**
+     * Focus the first menu item in the dropdown, skipping disabled options
+     */
+    focusFirstMenuItem(): void;
+    /**
+     * Focus the last menu item in the dropdown, skipping disabled options
+     */
+    focusLastMenuItem(): void;
+    /**
+     * Gets the first selectable (non-disabled) option
+     */
+    getFirstSelectableOption(): UiOption | null;
+    /**
+     * Gets the last selectable (non-disabled) option
+     */
+    getLastSelectableOption(): UiOption | null;
+    /**
+     * Gets the next selectable option after the current one, wrapping around if needed
+     */
+    protected getNextSelectableOption(currentOption: UiOption): UiOption | null;
+    /**
+     * Gets the previous selectable option before the current one, wrapping around if needed
+     */
+    protected getPreviousSelectableOption(currentOption: UiOption): UiOption | null;
+    /**
+     * Checks if an option is selectable (not disabled and not hidden)
+     */
+    protected isOptionSelectable(option: UiOption): boolean;
     handleSelect(e: CustomEvent<{
         item: UiOption;
     }>): void;
-    handleHighlightChange(e: CustomEvent<{
-        item: UiOption | null;
-    }>): void;
     handleMenuClose(): void;
+    handleMenuToggle(e: ToggleEvent): void;
     protected renderInput(): TemplateResult;
     protected renderMenu(): TemplateResult;
     protected handleSlotChange(): Promise<void>;

package/build/src/md/select/internals/Select.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Select.d.ts","sourceRoot":"","sources":["../../../../../src/md/select/internals/Select.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"Select.d.ts","sourceRoot":"","sources":["../../../../../src/md/select/internals/Select.ts"],"names":[],"mappings":"AAAA,OAAO,EAAQ,cAAc,EAAE,cAAc,EAAE,MAAM,KAAK,CAAA;AAK1D,OAAO,EAAE,SAAS,EAAE,MAAM,oBAAoB,CAAA;AAC9C,OAAO,KAAK,QAAQ,MAAM,aAAa,CAAA;AACvC,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,uBAAuB,CAAA;AAG1D,OAAO,4CAA4C,CAAA;AACnD,OAAO,uBAAuB,CAAA;AAC9B,OAAO,wBAAwB,CAAA;AAC/B,OAAO,mCAAmC,CAAA;AAE1C,MAAM,WAAW,mBAAmB;IAClC,KAAK,EAAE,MAAM,GAAG,SAAS,CAAA;IACzB,IAAI,EAAE,QAAQ,GAAG,IAAI,CAAA;CACtB;AAED;;;;;;;GAOG;AACH,MAAM,CAAC,OAAO,OAAO,QAAS,SAAQ,SAAS;;IAC7C,MAAM,CAAC,QAAQ,CAAC,cAAc,QAAO;IASrC;;;;;;;;;;;;OAYG;IACH,IAAI,KAAK,IAAI,MAAM,GAAG,SAAS,CAE9B;IAED,IACI,KAAK,CAAC,QAAQ,EAAE,MAAM,GAAG,SAAS,EAKrC;IAED;;;;;;;;;;;OAWG;IACyB,QAAQ,CAAC,IAAI,EAAE,MAAM,GAAG,SAAS,CAAA;IAE7D;;;;;;;;;;;OAWG;IACyB,QAAQ,CAAC,KAAK,EAAE,MAAM,GAAG,SAAS,CAAA;IAE9D;;;;;;;;;;;OAWG;IAC0B,QAAQ,CAAC,QAAQ,UAAQ;IAEtD;;;;;;;;;;;OAWG;IAC0B,QAAQ,CAAC,OAAO,EAAE,OAAO,GAAG,SAAS,CAAA;IAElE;;;;;;;;;;;OAWG;IACyB,QAAQ,CAAC,WAAW,EAAE,MAAM,GAAG,SAAS,CAAA;IAEpE;;OAEG;IACyB,QAAQ,CAAC,cAAc,EAAE,MAAM,GAAG,SAAS,CAAA;IAEvE;;;;;;;;;;;;OAYG;IACyC,QAAQ,CAAC,QAAQ,UAAQ;IAErE;;;;;;;;;;;;;OAaG;IACyC,QAAQ,CAAC,IAAI,UAAQ;IAExD,QAAQ,CAAC,cAAc,EAAE,QAAQ,GAAG,IAAI,CAAO;IAExC,QAAQ,CAAC,IAAI,EAAG,aAAa,CAAA;IAE7C;;;;;;;;;;;;;OAaG;IACH,IAAI,YAAY,IAAI,QAAQ,GAAG,IAAI,CAElC;IAED;;;;;;;;;;OAUG;IACH,IAAI,WAAW,IAAI,MAAM,CAGxB;IAED;;;;;OAKG;IACH,IAAI,IAAI,IAAI,eAAe,GAAG,IAAI,CAEjC;IAED;;;;;OAKG;IACH,IAAI,QAAQ,IAAI,aAAa,CAE5B;IAED;;;;;OAKG;IACH,IAAI,iBAAiB,IAAI,MAAM,CAE9B;IAED;;;;;OAKG;IACH,IAAI,YAAY,IAAI,OAAO,CAE1B;IAED;;;;;;;;;;;;OAYG;IACH,aAAa,IAAI,OAAO;;IAWf,iBAAiB,IAAI,IAAI;IAalC;;;;;;;;;OASG;IACH,iBAAiB,IAAI,IAAI;IAIzB;;;;;OAKG;IACH,wBAAwB,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI,GAAG,IAAI;IAIpD;;;;;;;;;;;;OAYG;IACH,QAAQ,IAAI,IAAI;cAYG,UAAU,CAAC,iBAAiB,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,IAAI;cAsBzD,YAAY,CAAC,EAAE,EAAE,cAAc,GAAG,IAAI;IAYzD,SAAS,CAAC,gBAAgB,IAAI,IAAI;IAelC,SAAS,CAAC,aAAa,CAAC,CAAC,EAAE,aAAa,GAAG,IAAI;IAoE/C,SAAS,CAAC,UAAU,CAAC,CAAC,EAAE,UAAU,GAAG,IAAI;IAehC,WAAW,CAAC,CAAC,EAAE,KAAK,GAAG,IAAI;cAYpB,gBAAgB,IAAI,OAAO,CAAC,IAAI,CAAC;IA2BjD;;OAEG;IACH,iBAAiB,IAAI,IAAI;IAQzB;;OAEG;IACH,qBAAqB,IAAI,IAAI;IAQ7B;;OAEG;IACH,kBAAkB,IAAI,IAAI;IAO1B;;OAEG;IACH,iBAAiB,IAAI,IAAI;IAOzB;;OAEG;IACH,wBAAwB,IAAI,QAAQ,GAAG,IAAI;IAU3C;;OAEG;IACH,uBAAuB,IAAI,QAAQ,GAAG,IAAI;IAU1C;;OAEG;IACH,SAAS,CAAC,uBAAuB,CAAC,aAAa,EAAE,QAAQ,GAAG,QAAQ,GAAG,IAAI;IAoB3E;;OAEG;IACH,SAAS,CAAC,2BAA2B,CAAC,aAAa,EAAE,QAAQ,GAAG,QAAQ,GAAG,IAAI;IAoB/E;;OAEG;IACH,SAAS,CAAC,kBAAkB,CAAC,MAAM,EAAE,QAAQ,GAAG,OAAO;IAavD,YAAY,CAAC,CAAC,EAAE,WAAW,CAAC;QAAE,IAAI,EAAE,QAAQ,CAAA;KAAE,CAAC,GAAG,IAAI;IAsBtD,eAAe,IAAI,IAAI;IAKvB,gBAAgB,CAAC,CAAC,EAAE,WAAW,GAAG,IAAI;IAMtC,SAAS,CAAC,WAAW,IAAI,cAAc;IAyBvC,SAAS,CAAC,UAAU,IAAI,cAAc;cAmBtB,gBAAgB,IAAI,OAAO,CAAC,IAAI,CAAC;IASjD,SAAS,CAAC,eAAe,IAAI,cAAc;IAIlC,MAAM,IAAI,cAAc;CASlC"}

package/build/src/md/select/internals/Select.js

@@ -1,16 +1,17 @@
 import { __esDecorate, __runInitializers } from "tslib";
-import { html, LitElement } from 'lit';
+import { html } from 'lit';
 import { property, query, state } from 'lit/decorators.js';
 import { classMap } from 'lit/directives/class-map.js';
 import { styleMap } from 'lit/directives/style-map.js';
 import { setDisabled } from '../../../lib/disabled.js';
+import { UiElement } from '../../UiElement.js';
 import { nanoid } from 'nanoid';
 import '../../text-field/ui-outlined-text-field.js';
 import '../../menu/ui-menu.js';
 import '../../icons/ui-icon.js';
 import '../../focus-ring/ui-focus-ring.js';
 let UiSelect = (() => {
-    let _classSuper = LitElement;
+    let _classSuper = UiElement;
     let _instanceExtraInitializers = [];
     let _set_value_decorators;
     let _name_decorators;
@@ -40,9 +41,6 @@ let UiSelect = (() => {
     let _selectedOption_decorators;
     let _selectedOption_initializers = [];
     let _selectedOption_extraInitializers = [];
-    let _ariaActiveDescendant_decorators;
-    let _ariaActiveDescendant_initializers = [];
-    let _ariaActiveDescendant_extraInitializers = [];
     let _menu_decorators;
     let _menu_initializers = [];
     let _menu_extraInitializers = [];
@@ -59,7 +57,6 @@ let UiSelect = (() => {
             _disabled_decorators = [property({ type: Boolean, reflect: true })];
             _open_decorators = [property({ type: Boolean, reflect: true })];
             _selectedOption_decorators = [state()];
-            _ariaActiveDescendant_decorators = [state()];
             _menu_decorators = [query('.menu')];
             __esDecorate(this, null, _set_value_decorators, { kind: "setter", name: "value", static: false, private: false, access: { has: obj => "value" in obj, set: (obj, value) => { obj.value = value; } }, metadata: _metadata }, null, _instanceExtraInitializers);
             __esDecorate(this, null, _name_decorators, { kind: "accessor", name: "name", static: false, private: false, access: { has: obj => "name" in obj, get: obj => obj.name, set: (obj, value) => { obj.name = value; } }, metadata: _metadata }, _name_initializers, _name_extraInitializers);
@@ -71,7 +68,6 @@ let UiSelect = (() => {
             __esDecorate(this, null, _disabled_decorators, { kind: "accessor", name: "disabled", static: false, private: false, access: { has: obj => "disabled" in obj, get: obj => obj.disabled, set: (obj, value) => { obj.disabled = value; } }, metadata: _metadata }, _disabled_initializers, _disabled_extraInitializers);
             __esDecorate(this, null, _open_decorators, { kind: "accessor", name: "open", static: false, private: false, access: { has: obj => "open" in obj, get: obj => obj.open, set: (obj, value) => { obj.open = value; } }, metadata: _metadata }, _open_initializers, _open_extraInitializers);
             __esDecorate(this, null, _selectedOption_decorators, { kind: "accessor", name: "selectedOption", static: false, private: false, access: { has: obj => "selectedOption" in obj, get: obj => obj.selectedOption, set: (obj, value) => { obj.selectedOption = value; } }, metadata: _metadata }, _selectedOption_initializers, _selectedOption_extraInitializers);
-            __esDecorate(this, null, _ariaActiveDescendant_decorators, { kind: "accessor", name: "ariaActiveDescendant", static: false, private: false, access: { has: obj => "ariaActiveDescendant" in obj, get: obj => obj.ariaActiveDescendant, set: (obj, value) => { obj.ariaActiveDescendant = value; } }, metadata: _metadata }, _ariaActiveDescendant_initializers, _ariaActiveDescendant_extraInitializers);
             __esDecorate(this, null, _menu_decorators, { kind: "accessor", name: "menu", static: false, private: false, access: { has: obj => "menu" in obj, get: obj => obj.menu, set: (obj, value) => { obj.menu = value; } }, metadata: _metadata }, _menu_initializers, _menu_extraInitializers);
             if (_metadata) Object.defineProperty(this, Symbol.metadata, { enumerable: true, configurable: true, writable: true, value: _metadata });
         }
@@ -250,10 +246,7 @@ let UiSelect = (() => {
         #selectedOption_accessor_storage = (__runInitializers(this, _open_extraInitializers), __runInitializers(this, _selectedOption_initializers, null));
         get selectedOption() { return this.#selectedOption_accessor_storage; }
         set selectedOption(value) { this.#selectedOption_accessor_storage = value; }
-        #ariaActiveDescendant_accessor_storage = (__runInitializers(this, _selectedOption_extraInitializers), __runInitializers(this, _ariaActiveDescendant_initializers, void 0));
-        get ariaActiveDescendant() { return this.#ariaActiveDescendant_accessor_storage; }
-        set ariaActiveDescendant(value) { this.#ariaActiveDescendant_accessor_storage = value; }
-        #menu_accessor_storage = (__runInitializers(this, _ariaActiveDescendant_extraInitializers), __runInitializers(this, _menu_initializers, void 0));
+        #menu_accessor_storage = (__runInitializers(this, _selectedOption_extraInitializers), __runInitializers(this, _menu_initializers, void 0));
         get menu() { return this.#menu_accessor_storage; }
         set menu(value) { this.#menu_accessor_storage = value; }
         /**
@@ -477,27 +470,29 @@ let UiSelect = (() => {
                     }
                     case 'ArrowDown':
                         e.preventDefault();
-                        this.menu.highlightNext();
+                        this.focusNextMenuItem();
                         return;
                     case 'ArrowUp':
                         e.preventDefault();
-                        this.menu.highlightPrevious();
+                        this.focusPreviousMenuItem();
                         return;
                     case 'Home':
                         e.preventDefault();
-                        this.menu.highlightFirst();
+                        this.focusFirstMenuItem();
                         return;
                     case 'End':
                         e.preventDefault();
-                        this.menu.highlightLast();
+                        this.focusLastMenuItem();
                         return;
                     case 'Enter':
-                    case ' ':
-                        if (this.menu.highlightListItem) {
+                    case ' ': {
+                        const currentItem = this.querySelector(':focus');
+                        if (currentItem && this.isOptionSelectable(currentItem)) {
                             e.preventDefault();
-                            this.menu.notifySelect(this.menu.highlightListItem);
+                            this.menu.notifySelect(currentItem);
                         }
                         return;
+                    }
                 }
             }
             else {
@@ -555,24 +550,147 @@ let UiSelect = (() => {
             this.setAttribute('aria-expanded', String(this.open));
             if (this.open) {
                 menu.showPopover();
-                // menu.focus()
-                if (this.selectedOption) {
-                    this.menu.highlightItem(this.selectedOption);
+                // Focus on the selected option or first selectable option when menu opens
+                if (this.selectedOption && this.isOptionSelectable(this.selectedOption)) {
+                    this.selectedOption.focus();
                 }
                 else {
-                    this.menu.highlightFirst();
+                    const firstSelectableOption = this.getFirstSelectableOption();
+                    if (firstSelectableOption) {
+                        firstSelectableOption.focus();
+                    }
                 }
                 this.dispatchEvent(new CustomEvent('open', { bubbles: false, composed: true }));
-                this.focus();
             }
             else {
                 menu.hidePopover();
                 this.dispatchEvent(new CustomEvent('close', { bubbles: false, composed: true }));
+                // Return focus to the select element when menu closes
+                this.focus();
+            }
+        }
+        /**
+         * Focus the next menu item in the dropdown, skipping disabled options
+         */
+        focusNextMenuItem() {
+            const currentItem = this.querySelector(':focus');
+            const nextItem = currentItem ? this.getNextSelectableOption(currentItem) : this.getFirstSelectableOption();
+            if (nextItem) {
+                nextItem.focus();
+            }
+        }
+        /**
+         * Focus the previous menu item in the dropdown, skipping disabled options
+         */
+        focusPreviousMenuItem() {
+            const currentItem = this.querySelector(':focus');
+            const previousItem = currentItem ? this.getPreviousSelectableOption(currentItem) : this.getLastSelectableOption();
+            if (previousItem) {
+                previousItem.focus();
+            }
+        }
+        /**
+         * Focus the first menu item in the dropdown, skipping disabled options
+         */
+        focusFirstMenuItem() {
+            const firstItem = this.getFirstSelectableOption();
+            if (firstItem) {
+                firstItem.focus();
+            }
+        }
+        /**
+         * Focus the last menu item in the dropdown, skipping disabled options
+         */
+        focusLastMenuItem() {
+            const lastItem = this.getLastSelectableOption();
+            if (lastItem) {
+                lastItem.focus();
             }
         }
+        /**
+         * Gets the first selectable (non-disabled) option
+         */
+        getFirstSelectableOption() {
+            const options = this.querySelectorAll('ui-option');
+            for (const option of options) {
+                if (this.isOptionSelectable(option)) {
+                    return option;
+                }
+            }
+            return null;
+        }
+        /**
+         * Gets the last selectable (non-disabled) option
+         */
+        getLastSelectableOption() {
+            const options = Array.from(this.querySelectorAll('ui-option')).reverse();
+            for (const option of options) {
+                if (this.isOptionSelectable(option)) {
+                    return option;
+                }
+            }
+            return null;
+        }
+        /**
+         * Gets the next selectable option after the current one, wrapping around if needed
+         */
+        getNextSelectableOption(currentOption) {
+            const options = Array.from(this.querySelectorAll('ui-option'));
+            const currentIndex = options.indexOf(currentOption);
+            if (currentIndex === -1) {
+                return this.getFirstSelectableOption();
+            }
+            // Start from the next option and wrap around
+            for (let i = 1; i < options.length; i++) {
+                const nextIndex = (currentIndex + i) % options.length;
+                const option = options[nextIndex];
+                if (this.isOptionSelectable(option)) {
+                    return option;
+                }
+            }
+            return currentOption; // Return current if no other selectable option found
+        }
+        /**
+         * Gets the previous selectable option before the current one, wrapping around if needed
+         */
+        getPreviousSelectableOption(currentOption) {
+            const options = Array.from(this.querySelectorAll('ui-option'));
+            const currentIndex = options.indexOf(currentOption);
+            if (currentIndex === -1) {
+                return this.getLastSelectableOption();
+            }
+            // Start from the previous option and wrap around
+            for (let i = 1; i < options.length; i++) {
+                const prevIndex = (currentIndex - i + options.length) % options.length;
+                const option = options[prevIndex];
+                if (this.isOptionSelectable(option)) {
+                    return option;
+                }
+            }
+            return currentOption; // Return current if no other selectable option found
+        }
+        /**
+         * Checks if an option is selectable (not disabled and not hidden)
+         */
+        isOptionSelectable(option) {
+            if (option.disabled) {
+                return false;
+            }
+            if (option.hasAttribute('disabled')) {
+                return false;
+            }
+            if (option.hidden && option.hasAttribute('hidden')) {
+                return false;
+            }
+            return true;
+        }
         handleSelect(e) {
             e.stopPropagation();
             const item = e.detail.item;
+            if (this.selectedOption && this.selectedOption !== item) {
+                this.selectedOption.selected = false;
+            }
+            item.selected = true;
             this.selectedOption = item;
             this.#value = item.value;
             this.#internals.setFormValue(this.value ?? null);
@@ -584,14 +702,16 @@ let UiSelect = (() => {
                 composed: true,
             });
             this.dispatchEvent(changeEvent);
-            this.focus();
-        }
-        handleHighlightChange(e) {
-            this.ariaActiveDescendant = e.detail.item?.id;
+            // Focus will be returned to select element by handleOpenChange when open=false
         }
         handleMenuClose() {
             this.open = false;
-            this.focus();
+            // Focus will be returned to select element by handleOpenChange when open=false
+        }
+        handleMenuToggle(e) {
+            if (e.newState === 'closed') {
+                this.open = false;
+            }
         }
         renderInput() {
             const styles = {
@@ -630,7 +750,7 @@ let UiSelect = (() => {
       selector="ui-option"
       @select="${this.handleSelect}"
       @close="${this.handleMenuClose}"
-      @highlightchange="${this.handleHighlightChange}"
+      @toggle="${this.handleMenuToggle}"
     >
       <slot @slotchange="${this.handleSlotChange}"></slot>
     </ui-menu>`;
@@ -653,9 +773,7 @@ let UiSelect = (() => {
                 'disabled': this.disabled,
             });
             return html `${this.renderFocusRing()}
-      <div class="${classes}" aria-activedescendant=${this.ariaActiveDescendant || ''}>
-        ${this.renderInput()} ${this.renderMenu()}
-      </div> `;
+      <div class="${classes}">${this.renderInput()} ${this.renderMenu()}</div> `;
         }
     };
 })();

package/build/src/md/select/internals/Select.js.map

@@ -1 +1 @@
-{"version":3,"file":"Select.js","sourceRoot":"","sources":["../../../../../src/md/select/internals/Select.ts"],"names":[],"mappings":"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","sourcesContent":["import { html, LitElement, PropertyValues, TemplateResult } from 'lit'\nimport { property, query, state } from 'lit/decorators.js'\nimport { classMap } from 'lit/directives/class-map.js'\nimport { styleMap } from 'lit/directives/style-map.js'\nimport { setDisabled } from '../../../lib/disabled.js'\nimport type UiOption from './Option.js'\nimport type { UiMenuElement } from '../../menu/ui-menu.js'\nimport { nanoid } from 'nanoid'\n\nimport '../../text-field/ui-outlined-text-field.js'\nimport '../../menu/ui-menu.js'\nimport '../../icons/ui-icon.js'\nimport '../../focus-ring/ui-focus-ring.js'\n\nexport interface UiSelectChangeEvent {\n  value: string | undefined\n  item: UiOption | null\n}\n\n/**\n * Material Design 3 Select component that behaves like an outlined text field with dropdown.\n *\n * @fires change - Dispatched when the selection changes. The event is non-bubbling and non-cancelable.\n *                 The `event.detail` object contains the `value` and `item` properties.\n * @fires open - Dispatched when the dropdown opens\n * @fires close - Dispatched when the dropdown closes\n */\nexport default class UiSelect extends LitElement {\n  static readonly formAssociated = true\n  #internals = this.attachInternals()\n\n  /**\n   * The value has a private member so that we can set the value without triggering\n   * the side effects.\n   */\n  #value: string | undefined\n\n  /**\n   * The currently selected value. Corresponds to the `value` attribute of the selected `ui-option`.\n   * When set programmatically, it will update the selected option if a matching option exists.\n   *\n   * @attribute\n   * @example\n   * ```html\n   * <ui-select value=\"apple\">\n   *   <ui-option value=\"apple\">Apple</ui-option>\n   *   <ui-option value=\"banana\">Banana</ui-option>\n   * </ui-select>\n   * ```\n   */\n  get value(): string | undefined {\n    return this.#value\n  }\n\n  @property({ type: String })\n  set value(newValue: string | undefined) {\n    const oldValue = this.#value\n    if (newValue === oldValue) return\n    this.#value = newValue\n    this.requestUpdate()\n  }\n\n  /**\n   * The name attribute for form submission. This value will be used as the key\n   * when the form is submitted.\n   *\n   * @attribute\n   * @example\n   * ```html\n   * <ui-select name=\"country\" value=\"us\">\n   *   <ui-option value=\"us\">United States</ui-option>\n   * </ui-select>\n   * ```\n   */\n  @property({ type: String }) accessor name: string | undefined\n\n  /**\n   * The label text displayed in the select field. Provides accessible labeling\n   * and is shown as the floating label in the outlined text field.\n   *\n   * @attribute\n   * @example\n   * ```html\n   * <ui-select label=\"Select a country\">\n   *   <ui-option value=\"us\">United States</ui-option>\n   * </ui-select>\n   * ```\n   */\n  @property({ type: String }) accessor label: string | undefined\n\n  /**\n   * Whether the select is required for form validation. When true, the select\n   * must have a value selected for the form to be valid.\n   *\n   * @attribute\n   * @example\n   * ```html\n   * <ui-select required label=\"Required field\">\n   *   <ui-option value=\"option1\">Option 1</ui-option>\n   * </ui-select>\n   * ```\n   */\n  @property({ type: Boolean }) accessor required = false\n\n  /**\n   * Whether the select is in an invalid state. This is typically set automatically\n   * during validation, but can be set manually to indicate validation errors.\n   *\n   * @attribute\n   * @example\n   * ```html\n   * <ui-select invalid invalidText=\"Please select a valid option\">\n   *   <ui-option value=\"option1\">Option 1</ui-option>\n   * </ui-select>\n   * ```\n   */\n  @property({ type: Boolean }) accessor invalid: boolean | undefined\n\n  /**\n   * The error message to display when the select is invalid. This text is shown\n   * below the select field when `invalid` is true.\n   *\n   * @attribute\n   * @example\n   * ```html\n   * <ui-select invalid invalidText=\"This field is required\">\n   *   <ui-option value=\"option1\">Option 1</ui-option>\n   * </ui-select>\n   * ```\n   */\n  @property({ type: String }) accessor invalidText: string | undefined\n\n  /**\n   * @attribute\n   */\n  @property({ type: String }) accessor supportingText: string | undefined\n\n  /**\n   * Whether the select is disabled. When disabled, the select cannot be interacted\n   * with and will not receive focus or respond to user input.\n   *\n   * @default false\n   * @attribute\n   * @example\n   * ```html\n   * <ui-select disabled label=\"Disabled select\">\n   *   <ui-option value=\"option1\">Option 1</ui-option>\n   * </ui-select>\n   * ```\n   */\n  @property({ type: Boolean, reflect: true }) accessor disabled = false\n\n  /**\n   * Whether the dropdown menu is currently open. This property reflects the\n   * current state of the dropdown and can be set programmatically to open/close it.\n   *\n   * @default false\n   * @example\n   * ```javascript\n   * // Open the dropdown programmatically\n   * selectElement.open = true;\n   *\n   * // Close the dropdown\n   * selectElement.open = false;\n   * ```\n   */\n  @property({ type: Boolean, reflect: true }) accessor open = false\n\n  @state() accessor selectedOption: UiOption | null = null\n  @state() accessor ariaActiveDescendant: string | undefined\n  @query('.menu') accessor menu!: UiMenuElement\n\n  /**\n   * Returns the currently selected option element. This provides access to the\n   * full `ui-option` element, not just its value.\n   *\n   * @readonly\n   * @example\n   * ```javascript\n   * const select = document.querySelector('ui-select');\n   * const selectedItem = select.selectedItem;\n   * if (selectedItem) {\n   *   console.log('Selected option:', selectedItem.textContent);\n   * }\n   * ```\n   */\n  get selectedItem(): UiOption | null {\n    return this.selectedOption\n  }\n\n  /**\n   * Returns the text content that should be displayed in the select field.\n   * This is the rendered value of the currently selected option.\n   *\n   * @readonly\n   * @example\n   * ```javascript\n   * const select = document.querySelector('ui-select');\n   * console.log('Display text:', select.renderValue);\n   * ```\n   */\n  get renderValue(): string {\n    const item = this.selectedOption\n    return item ? item.renderValue : ''\n  }\n\n  /**\n   * Returns the form element that contains this select, if any.\n   * Part of the form-associated custom element API.\n   *\n   * @readonly\n   */\n  get form(): HTMLFormElement | null {\n    return this.#internals.form\n  }\n\n  /**\n   * Returns the validity state of the select element.\n   * Part of the form-associated custom element API.\n   *\n   * @readonly\n   */\n  get validity(): ValidityState {\n    return this.#internals.validity\n  }\n\n  /**\n   * Returns the validation message for the select element.\n   * Part of the form-associated custom element API.\n   *\n   * @readonly\n   */\n  get validationMessage(): string {\n    return this.#internals.validationMessage\n  }\n\n  /**\n   * Returns whether the select element will be validated when the form is submitted.\n   * Part of the form-associated custom element API.\n   *\n   * @readonly\n   */\n  get willValidate(): boolean {\n    return this.#internals.willValidate\n  }\n\n  /**\n   * Checks the validity of the select element and returns true if valid.\n   * Part of the form-associated custom element API.\n   *\n   * @returns {boolean} True if the element is valid, false otherwise\n   * @example\n   * ```javascript\n   * const select = document.querySelector('ui-select');\n   * if (!select.checkValidity()) {\n   *   console.log('Select is invalid:', select.validationMessage);\n   * }\n   * ```\n   */\n  checkValidity(): boolean {\n    return this.#internals.checkValidity()\n  }\n\n  constructor() {\n    super()\n    this.addEventListener('click', this.handleClick.bind(this))\n    this.addEventListener('blur', this.handleBlur.bind(this))\n    this.addEventListener('keydown', this.handleKeydown.bind(this))\n  }\n\n  override connectedCallback(): void {\n    super.connectedCallback()\n    this.setAttribute('role', 'combobox')\n    this.setAttribute('aria-haspopup', 'listbox')\n    this.setAttribute('aria-controls', 'menu')\n    if (!this.disabled) {\n      this.setAttribute('tabindex', '0')\n    }\n    if (!this.id) {\n      this.id = `select-${nanoid(6)}`\n    }\n  }\n\n  /**\n   * Resets the select to its initial state. Called automatically when the parent\n   * form is reset. Part of the form-associated custom element API.\n   *\n   * @example\n   * ```javascript\n   * const select = document.querySelector('ui-select');\n   * select.formResetCallback(); // Clears the selection\n   * ```\n   */\n  formResetCallback(): void {\n    this.value = undefined\n  }\n\n  /**\n   * Restores the select's state from saved form data. Called automatically when\n   * the browser restores form state. Part of the form-associated custom element API.\n   *\n   * @param {string | null} state - The saved state to restore\n   */\n  formStateRestoreCallback(state: string | null): void {\n    this.value = state ?? undefined\n  }\n\n  /**\n   * Validates the select element and updates its validity state. This is called\n   * automatically during property changes, but can be called manually to trigger validation.\n   *\n   * @example\n   * ```javascript\n   * const select = document.querySelector('ui-select');\n   * select.validate();\n   * if (select.invalid) {\n   *   console.log('Validation failed:', select.invalidText);\n   * }\n   * ```\n   */\n  validate(): void {\n    let message = ''\n    if (this.required && !this.value) {\n      message = 'Please select an item.'\n      this.#internals.setValidity({ valueMissing: true }, message)\n    } else {\n      this.#internals.setValidity({})\n    }\n    this.invalid = !this.#internals.validity.valid\n    this.invalidText = message\n  }\n\n  protected override willUpdate(changedProperties: PropertyValues<this>): void {\n    super.willUpdate(changedProperties)\n    if (changedProperties.has('disabled')) {\n      setDisabled(this, this.disabled)\n    }\n    if (changedProperties.has('open')) {\n      this.handleOpenChange()\n    }\n    if (changedProperties.has('value')) {\n      this.setCurrentOption()\n      this.#internals.setFormValue(this.value ?? null)\n      this.validate()\n    }\n    if (changedProperties.has('label')) {\n      if (this.label) {\n        this.setAttribute('aria-label', this.label)\n      } else {\n        this.removeAttribute('aria-label')\n      }\n    }\n  }\n\n  protected override firstUpdated(cp: PropertyValues): void {\n    super.firstUpdated(cp)\n    this.updateComplete.then(() => {\n      this.setCurrentOption()\n      this.#internals.setFormValue(this.value ?? null)\n      // We need to update here as event with `value` and `selectedOption`\n      // already set, the `renderValue` might have incorrect value\n      // due to the DOM update.\n      this.requestUpdate()\n    })\n  }\n\n  protected setCurrentOption(): void {\n    const options = this.querySelectorAll<UiOption>('ui-option')\n    if (this.value) {\n      this.selectedOption = Array.from(options).find((option) => option.value === this.value) || null\n    } else {\n      const selected = Array.from(options).find((option) => option.selected)\n      if (selected) {\n        this.selectedOption = selected\n        this.#value = selected.value\n      } else {\n        this.selectedOption = null\n      }\n    }\n  }\n\n  protected handleKeydown(e: KeyboardEvent): void {\n    if (this.disabled || e.defaultPrevented) return\n    if (this.open) {\n      switch (e.key) {\n        case 'Tab': {\n          // If menu is open and Tab is pressed, close it and allow normal tab navigation\n          if (this.open) {\n            this.open = false\n          }\n          break\n        }\n        case 'Escape': {\n          if (this.open) {\n            e.preventDefault()\n            this.open = false\n            this.focus() // Return focus to the select element\n          }\n          break\n        }\n        case 'ArrowDown':\n          e.preventDefault()\n          this.menu.highlightNext()\n          return\n        case 'ArrowUp':\n          e.preventDefault()\n          this.menu.highlightPrevious()\n          return\n        case 'Home':\n          e.preventDefault()\n          this.menu.highlightFirst()\n          return\n        case 'End':\n          e.preventDefault()\n          this.menu.highlightLast()\n          return\n        case 'Enter':\n        case ' ':\n          if (this.menu.highlightListItem) {\n            e.preventDefault()\n            this.menu.notifySelect(this.menu.highlightListItem as UiOption)\n          }\n          return\n      }\n    } else {\n      switch (e.key) {\n        case 'Enter':\n        case ' ': {\n          if (!this.open) {\n            e.preventDefault()\n            this.open = true\n          }\n          break\n        }\n        case 'ArrowDown':\n        case 'ArrowUp': {\n          if (!this.open) {\n            e.preventDefault()\n            this.open = true\n          }\n          // If menu is open, let the menu handle arrow keys\n          break\n        }\n      }\n    }\n  }\n\n  protected handleBlur(e: FocusEvent): void {\n    if (this.disabled) return\n\n    // Check if focus is moving to the menu or one of its children\n    const relatedTarget = e.relatedTarget as HTMLElement\n\n    if (relatedTarget && this.contains(relatedTarget)) {\n      // Focus is moving to the menu, keep it open\n      return\n    }\n\n    // Close the menu when focus leaves the component\n    this.open = false\n  }\n\n  protected handleClick(e: Event): void {\n    if (this.disabled || e.defaultPrevented) return\n    e.preventDefault()\n    e.stopPropagation()\n    if (this.open && e.target === this) {\n      // If the select is already open and clicked again, close it\n      this.open = false\n      return\n    }\n    this.open = true\n  }\n\n  protected async handleOpenChange(): Promise<void> {\n    const menu = this.menu\n    if (!menu) {\n      // The status can be set before the menu is rendered\n      return\n    }\n    this.setAttribute('aria-expanded', String(this.open))\n    if (this.open) {\n      menu.showPopover()\n      // menu.focus()\n      if (this.selectedOption) {\n        this.menu.highlightItem(this.selectedOption)\n      } else {\n        this.menu.highlightFirst()\n      }\n      this.dispatchEvent(new CustomEvent('open', { bubbles: false, composed: true }))\n      this.focus()\n    } else {\n      menu.hidePopover()\n      this.dispatchEvent(new CustomEvent('close', { bubbles: false, composed: true }))\n    }\n  }\n\n  handleSelect(e: CustomEvent<{ item: UiOption }>): void {\n    e.stopPropagation()\n    const item = e.detail.item\n    this.selectedOption = item\n    this.#value = item.value\n    this.#internals.setFormValue(this.value ?? null)\n    this.open = false\n\n    // Dispatch change event\n    const changeEvent = new CustomEvent<UiSelectChangeEvent>('change', {\n      detail: { value: this.value, item: item },\n      bubbles: false,\n      composed: true,\n    })\n    this.dispatchEvent(changeEvent)\n    this.focus()\n  }\n\n  handleHighlightChange(e: CustomEvent<{ item: UiOption | null }>): void {\n    this.ariaActiveDescendant = e.detail.item?.id\n  }\n\n  handleMenuClose(): void {\n    this.open = false\n    this.focus()\n  }\n\n  protected renderInput(): TemplateResult {\n    const styles = {\n      'anchor-name': `--${this.id}`,\n    }\n    return html`<ui-outlined-text-field\n      .name=${this.name}\n      .label=${this.label}\n      .value=${this.renderValue}\n      .disabled=${this.disabled}\n      .required=${this.required}\n      readonly\n      tabindex=\"-1\"\n      .inert=${true}\n      aria-hidden=\"true\"\n      .invalid=${this.invalid}\n      .invalidText=${this.invalidText || ''}\n      .supportingText=${this.supportingText || ''}\n      class=\"input\"\n      style=${styleMap(styles)}\n      part=\"input\"\n    >\n      <ui-icon part=\"icon\" slot=\"suffix\">arrow_drop_down</ui-icon>\n    </ui-outlined-text-field>`\n  }\n\n  protected renderMenu(): TemplateResult {\n    const styles = {\n      'position-anchor': `--${this.id}`,\n    }\n    return html`<ui-menu\n      id=\"menu\"\n      class=\"menu\"\n      part=\"menu\"\n      style=${styleMap(styles)}\n      popover=\"auto\"\n      selector=\"ui-option\"\n      @select=\"${this.handleSelect}\"\n      @close=\"${this.handleMenuClose}\"\n      @highlightchange=\"${this.handleHighlightChange}\"\n    >\n      <slot @slotchange=\"${this.handleSlotChange}\"></slot>\n    </ui-menu>`\n  }\n\n  protected async handleSlotChange(): Promise<void> {\n    // When options change, re-evaluate the current selection\n    // only if we don't have an explicit value set\n    if (!this.value) {\n      this.setCurrentOption()\n      this.requestUpdate()\n    }\n  }\n\n  protected renderFocusRing(): TemplateResult {\n    return html`<ui-focus-ring part=\"focus-ring\" class=\"focus-ring\" .control=\"${this as HTMLElement}\"></ui-focus-ring>`\n  }\n\n  override render(): TemplateResult {\n    const classes = classMap({\n      'ui-select': true,\n      'open': this.open,\n      'disabled': this.disabled,\n    })\n    return html`${this.renderFocusRing()}\n      <div class=\"${classes}\" aria-activedescendant=${this.ariaActiveDescendant || ''}>\n        ${this.renderInput()} ${this.renderMenu()}\n      </div> `\n  }\n}\n"]}
+{"version":3,"file":"Select.js","sourceRoot":"","sources":["../../../../../src/md/select/internals/Select.ts"],"names":[],"mappings":"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","sourcesContent":["import { html, PropertyValues, TemplateResult } from 'lit'\nimport { property, query, state } from 'lit/decorators.js'\nimport { classMap } from 'lit/directives/class-map.js'\nimport { styleMap } from 'lit/directives/style-map.js'\nimport { setDisabled } from '../../../lib/disabled.js'\nimport { UiElement } from '../../UiElement.js'\nimport type UiOption from './Option.js'\nimport type { UiMenuElement } from '../../menu/ui-menu.js'\nimport { nanoid } from 'nanoid'\n\nimport '../../text-field/ui-outlined-text-field.js'\nimport '../../menu/ui-menu.js'\nimport '../../icons/ui-icon.js'\nimport '../../focus-ring/ui-focus-ring.js'\n\nexport interface UiSelectChangeEvent {\n  value: string | undefined\n  item: UiOption | null\n}\n\n/**\n * Material Design 3 Select component that behaves like an outlined text field with dropdown.\n *\n * @fires change - Dispatched when the selection changes. The event is non-bubbling and non-cancelable.\n *                 The `event.detail` object contains the `value` and `item` properties.\n * @fires open - Dispatched when the dropdown opens\n * @fires close - Dispatched when the dropdown closes\n */\nexport default class UiSelect extends UiElement {\n  static readonly formAssociated = true\n  #internals = this.attachInternals()\n\n  /**\n   * The value has a private member so that we can set the value without triggering\n   * the side effects.\n   */\n  #value: string | undefined\n\n  /**\n   * The currently selected value. Corresponds to the `value` attribute of the selected `ui-option`.\n   * When set programmatically, it will update the selected option if a matching option exists.\n   *\n   * @attribute\n   * @example\n   * ```html\n   * <ui-select value=\"apple\">\n   *   <ui-option value=\"apple\">Apple</ui-option>\n   *   <ui-option value=\"banana\">Banana</ui-option>\n   * </ui-select>\n   * ```\n   */\n  get value(): string | undefined {\n    return this.#value\n  }\n\n  @property({ type: String })\n  set value(newValue: string | undefined) {\n    const oldValue = this.#value\n    if (newValue === oldValue) return\n    this.#value = newValue\n    this.requestUpdate()\n  }\n\n  /**\n   * The name attribute for form submission. This value will be used as the key\n   * when the form is submitted.\n   *\n   * @attribute\n   * @example\n   * ```html\n   * <ui-select name=\"country\" value=\"us\">\n   *   <ui-option value=\"us\">United States</ui-option>\n   * </ui-select>\n   * ```\n   */\n  @property({ type: String }) accessor name: string | undefined\n\n  /**\n   * The label text displayed in the select field. Provides accessible labeling\n   * and is shown as the floating label in the outlined text field.\n   *\n   * @attribute\n   * @example\n   * ```html\n   * <ui-select label=\"Select a country\">\n   *   <ui-option value=\"us\">United States</ui-option>\n   * </ui-select>\n   * ```\n   */\n  @property({ type: String }) accessor label: string | undefined\n\n  /**\n   * Whether the select is required for form validation. When true, the select\n   * must have a value selected for the form to be valid.\n   *\n   * @attribute\n   * @example\n   * ```html\n   * <ui-select required label=\"Required field\">\n   *   <ui-option value=\"option1\">Option 1</ui-option>\n   * </ui-select>\n   * ```\n   */\n  @property({ type: Boolean }) accessor required = false\n\n  /**\n   * Whether the select is in an invalid state. This is typically set automatically\n   * during validation, but can be set manually to indicate validation errors.\n   *\n   * @attribute\n   * @example\n   * ```html\n   * <ui-select invalid invalidText=\"Please select a valid option\">\n   *   <ui-option value=\"option1\">Option 1</ui-option>\n   * </ui-select>\n   * ```\n   */\n  @property({ type: Boolean }) accessor invalid: boolean | undefined\n\n  /**\n   * The error message to display when the select is invalid. This text is shown\n   * below the select field when `invalid` is true.\n   *\n   * @attribute\n   * @example\n   * ```html\n   * <ui-select invalid invalidText=\"This field is required\">\n   *   <ui-option value=\"option1\">Option 1</ui-option>\n   * </ui-select>\n   * ```\n   */\n  @property({ type: String }) accessor invalidText: string | undefined\n\n  /**\n   * @attribute\n   */\n  @property({ type: String }) accessor supportingText: string | undefined\n\n  /**\n   * Whether the select is disabled. When disabled, the select cannot be interacted\n   * with and will not receive focus or respond to user input.\n   *\n   * @default false\n   * @attribute\n   * @example\n   * ```html\n   * <ui-select disabled label=\"Disabled select\">\n   *   <ui-option value=\"option1\">Option 1</ui-option>\n   * </ui-select>\n   * ```\n   */\n  @property({ type: Boolean, reflect: true }) accessor disabled = false\n\n  /**\n   * Whether the dropdown menu is currently open. This property reflects the\n   * current state of the dropdown and can be set programmatically to open/close it.\n   *\n   * @default false\n   * @example\n   * ```javascript\n   * // Open the dropdown programmatically\n   * selectElement.open = true;\n   *\n   * // Close the dropdown\n   * selectElement.open = false;\n   * ```\n   */\n  @property({ type: Boolean, reflect: true }) accessor open = false\n\n  @state() accessor selectedOption: UiOption | null = null\n\n  @query('.menu') accessor menu!: UiMenuElement\n\n  /**\n   * Returns the currently selected option element. This provides access to the\n   * full `ui-option` element, not just its value.\n   *\n   * @readonly\n   * @example\n   * ```javascript\n   * const select = document.querySelector('ui-select');\n   * const selectedItem = select.selectedItem;\n   * if (selectedItem) {\n   *   console.log('Selected option:', selectedItem.textContent);\n   * }\n   * ```\n   */\n  get selectedItem(): UiOption | null {\n    return this.selectedOption\n  }\n\n  /**\n   * Returns the text content that should be displayed in the select field.\n   * This is the rendered value of the currently selected option.\n   *\n   * @readonly\n   * @example\n   * ```javascript\n   * const select = document.querySelector('ui-select');\n   * console.log('Display text:', select.renderValue);\n   * ```\n   */\n  get renderValue(): string {\n    const item = this.selectedOption\n    return item ? item.renderValue : ''\n  }\n\n  /**\n   * Returns the form element that contains this select, if any.\n   * Part of the form-associated custom element API.\n   *\n   * @readonly\n   */\n  get form(): HTMLFormElement | null {\n    return this.#internals.form\n  }\n\n  /**\n   * Returns the validity state of the select element.\n   * Part of the form-associated custom element API.\n   *\n   * @readonly\n   */\n  get validity(): ValidityState {\n    return this.#internals.validity\n  }\n\n  /**\n   * Returns the validation message for the select element.\n   * Part of the form-associated custom element API.\n   *\n   * @readonly\n   */\n  get validationMessage(): string {\n    return this.#internals.validationMessage\n  }\n\n  /**\n   * Returns whether the select element will be validated when the form is submitted.\n   * Part of the form-associated custom element API.\n   *\n   * @readonly\n   */\n  get willValidate(): boolean {\n    return this.#internals.willValidate\n  }\n\n  /**\n   * Checks the validity of the select element and returns true if valid.\n   * Part of the form-associated custom element API.\n   *\n   * @returns {boolean} True if the element is valid, false otherwise\n   * @example\n   * ```javascript\n   * const select = document.querySelector('ui-select');\n   * if (!select.checkValidity()) {\n   *   console.log('Select is invalid:', select.validationMessage);\n   * }\n   * ```\n   */\n  checkValidity(): boolean {\n    return this.#internals.checkValidity()\n  }\n\n  constructor() {\n    super()\n    this.addEventListener('click', this.handleClick.bind(this))\n    this.addEventListener('blur', this.handleBlur.bind(this))\n    this.addEventListener('keydown', this.handleKeydown.bind(this))\n  }\n\n  override connectedCallback(): void {\n    super.connectedCallback()\n    this.setAttribute('role', 'combobox')\n    this.setAttribute('aria-haspopup', 'listbox')\n    this.setAttribute('aria-controls', 'menu')\n    if (!this.disabled) {\n      this.setAttribute('tabindex', '0')\n    }\n    if (!this.id) {\n      this.id = `select-${nanoid(6)}`\n    }\n  }\n\n  /**\n   * Resets the select to its initial state. Called automatically when the parent\n   * form is reset. Part of the form-associated custom element API.\n   *\n   * @example\n   * ```javascript\n   * const select = document.querySelector('ui-select');\n   * select.formResetCallback(); // Clears the selection\n   * ```\n   */\n  formResetCallback(): void {\n    this.value = undefined\n  }\n\n  /**\n   * Restores the select's state from saved form data. Called automatically when\n   * the browser restores form state. Part of the form-associated custom element API.\n   *\n   * @param {string | null} state - The saved state to restore\n   */\n  formStateRestoreCallback(state: string | null): void {\n    this.value = state ?? undefined\n  }\n\n  /**\n   * Validates the select element and updates its validity state. This is called\n   * automatically during property changes, but can be called manually to trigger validation.\n   *\n   * @example\n   * ```javascript\n   * const select = document.querySelector('ui-select');\n   * select.validate();\n   * if (select.invalid) {\n   *   console.log('Validation failed:', select.invalidText);\n   * }\n   * ```\n   */\n  validate(): void {\n    let message = ''\n    if (this.required && !this.value) {\n      message = 'Please select an item.'\n      this.#internals.setValidity({ valueMissing: true }, message)\n    } else {\n      this.#internals.setValidity({})\n    }\n    this.invalid = !this.#internals.validity.valid\n    this.invalidText = message\n  }\n\n  protected override willUpdate(changedProperties: PropertyValues<this>): void {\n    super.willUpdate(changedProperties)\n    if (changedProperties.has('disabled')) {\n      setDisabled(this, this.disabled)\n    }\n    if (changedProperties.has('open')) {\n      this.handleOpenChange()\n    }\n    if (changedProperties.has('value')) {\n      this.setCurrentOption()\n      this.#internals.setFormValue(this.value ?? null)\n      this.validate()\n    }\n    if (changedProperties.has('label')) {\n      if (this.label) {\n        this.setAttribute('aria-label', this.label)\n      } else {\n        this.removeAttribute('aria-label')\n      }\n    }\n  }\n\n  protected override firstUpdated(cp: PropertyValues): void {\n    super.firstUpdated(cp)\n    this.updateComplete.then(() => {\n      this.setCurrentOption()\n      this.#internals.setFormValue(this.value ?? null)\n      // We need to update here as event with `value` and `selectedOption`\n      // already set, the `renderValue` might have incorrect value\n      // due to the DOM update.\n      this.requestUpdate()\n    })\n  }\n\n  protected setCurrentOption(): void {\n    const options = this.querySelectorAll<UiOption>('ui-option')\n    if (this.value) {\n      this.selectedOption = Array.from(options).find((option) => option.value === this.value) || null\n    } else {\n      const selected = Array.from(options).find((option) => option.selected)\n      if (selected) {\n        this.selectedOption = selected\n        this.#value = selected.value\n      } else {\n        this.selectedOption = null\n      }\n    }\n  }\n\n  protected handleKeydown(e: KeyboardEvent): void {\n    if (this.disabled || e.defaultPrevented) return\n    if (this.open) {\n      switch (e.key) {\n        case 'Tab': {\n          // If menu is open and Tab is pressed, close it and allow normal tab navigation\n          if (this.open) {\n            this.open = false\n          }\n          break\n        }\n        case 'Escape': {\n          if (this.open) {\n            e.preventDefault()\n            this.open = false\n            this.focus() // Return focus to the select element\n          }\n          break\n        }\n        case 'ArrowDown':\n          e.preventDefault()\n          this.focusNextMenuItem()\n          return\n        case 'ArrowUp':\n          e.preventDefault()\n          this.focusPreviousMenuItem()\n          return\n        case 'Home':\n          e.preventDefault()\n          this.focusFirstMenuItem()\n          return\n        case 'End':\n          e.preventDefault()\n          this.focusLastMenuItem()\n          return\n        case 'Enter':\n        case ' ': {\n          const currentItem = this.querySelector<UiOption>(':focus')\n          if (currentItem && this.isOptionSelectable(currentItem)) {\n            e.preventDefault()\n            this.menu.notifySelect(currentItem)\n          }\n          return\n        }\n      }\n    } else {\n      switch (e.key) {\n        case 'Enter':\n        case ' ': {\n          if (!this.open) {\n            e.preventDefault()\n            this.open = true\n          }\n          break\n        }\n        case 'ArrowDown':\n        case 'ArrowUp': {\n          if (!this.open) {\n            e.preventDefault()\n            this.open = true\n          }\n          // If menu is open, let the menu handle arrow keys\n          break\n        }\n      }\n    }\n  }\n\n  protected handleBlur(e: FocusEvent): void {\n    if (this.disabled) return\n\n    // Check if focus is moving to the menu or one of its children\n    const relatedTarget = e.relatedTarget as HTMLElement\n\n    if (relatedTarget && this.contains(relatedTarget)) {\n      // Focus is moving to the menu, keep it open\n      return\n    }\n\n    // Close the menu when focus leaves the component\n    this.open = false\n  }\n\n  override handleClick(e: Event): void {\n    if (this.disabled || e.defaultPrevented) return\n    e.preventDefault()\n    e.stopPropagation()\n    if (this.open && e.target === this) {\n      // If the select is already open and clicked again, close it\n      this.open = false\n      return\n    }\n    this.open = true\n  }\n\n  protected async handleOpenChange(): Promise<void> {\n    const menu = this.menu\n    if (!menu) {\n      // The status can be set before the menu is rendered\n      return\n    }\n    this.setAttribute('aria-expanded', String(this.open))\n    if (this.open) {\n      menu.showPopover()\n      // Focus on the selected option or first selectable option when menu opens\n      if (this.selectedOption && this.isOptionSelectable(this.selectedOption)) {\n        this.selectedOption.focus()\n      } else {\n        const firstSelectableOption = this.getFirstSelectableOption()\n        if (firstSelectableOption) {\n          firstSelectableOption.focus()\n        }\n      }\n      this.dispatchEvent(new CustomEvent('open', { bubbles: false, composed: true }))\n    } else {\n      menu.hidePopover()\n      this.dispatchEvent(new CustomEvent('close', { bubbles: false, composed: true }))\n      // Return focus to the select element when menu closes\n      this.focus()\n    }\n  }\n\n  /**\n   * Focus the next menu item in the dropdown, skipping disabled options\n   */\n  focusNextMenuItem(): void {\n    const currentItem = this.querySelector<UiOption>(':focus')\n    const nextItem = currentItem ? this.getNextSelectableOption(currentItem) : this.getFirstSelectableOption()\n    if (nextItem) {\n      nextItem.focus()\n    }\n  }\n\n  /**\n   * Focus the previous menu item in the dropdown, skipping disabled options\n   */\n  focusPreviousMenuItem(): void {\n    const currentItem = this.querySelector<UiOption>(':focus')\n    const previousItem = currentItem ? this.getPreviousSelectableOption(currentItem) : this.getLastSelectableOption()\n    if (previousItem) {\n      previousItem.focus()\n    }\n  }\n\n  /**\n   * Focus the first menu item in the dropdown, skipping disabled options\n   */\n  focusFirstMenuItem(): void {\n    const firstItem = this.getFirstSelectableOption()\n    if (firstItem) {\n      firstItem.focus()\n    }\n  }\n\n  /**\n   * Focus the last menu item in the dropdown, skipping disabled options\n   */\n  focusLastMenuItem(): void {\n    const lastItem = this.getLastSelectableOption()\n    if (lastItem) {\n      lastItem.focus()\n    }\n  }\n\n  /**\n   * Gets the first selectable (non-disabled) option\n   */\n  getFirstSelectableOption(): UiOption | null {\n    const options = this.querySelectorAll<UiOption>('ui-option')\n    for (const option of options) {\n      if (this.isOptionSelectable(option)) {\n        return option\n      }\n    }\n    return null\n  }\n\n  /**\n   * Gets the last selectable (non-disabled) option\n   */\n  getLastSelectableOption(): UiOption | null {\n    const options = Array.from(this.querySelectorAll<UiOption>('ui-option')).reverse()\n    for (const option of options) {\n      if (this.isOptionSelectable(option)) {\n        return option\n      }\n    }\n    return null\n  }\n\n  /**\n   * Gets the next selectable option after the current one, wrapping around if needed\n   */\n  protected getNextSelectableOption(currentOption: UiOption): UiOption | null {\n    const options = Array.from(this.querySelectorAll<UiOption>('ui-option'))\n    const currentIndex = options.indexOf(currentOption)\n\n    if (currentIndex === -1) {\n      return this.getFirstSelectableOption()\n    }\n\n    // Start from the next option and wrap around\n    for (let i = 1; i < options.length; i++) {\n      const nextIndex = (currentIndex + i) % options.length\n      const option = options[nextIndex]\n      if (this.isOptionSelectable(option)) {\n        return option\n      }\n    }\n\n    return currentOption // Return current if no other selectable option found\n  }\n\n  /**\n   * Gets the previous selectable option before the current one, wrapping around if needed\n   */\n  protected getPreviousSelectableOption(currentOption: UiOption): UiOption | null {\n    const options = Array.from(this.querySelectorAll<UiOption>('ui-option'))\n    const currentIndex = options.indexOf(currentOption)\n\n    if (currentIndex === -1) {\n      return this.getLastSelectableOption()\n    }\n\n    // Start from the previous option and wrap around\n    for (let i = 1; i < options.length; i++) {\n      const prevIndex = (currentIndex - i + options.length) % options.length\n      const option = options[prevIndex]\n      if (this.isOptionSelectable(option)) {\n        return option\n      }\n    }\n\n    return currentOption // Return current if no other selectable option found\n  }\n\n  /**\n   * Checks if an option is selectable (not disabled and not hidden)\n   */\n  protected isOptionSelectable(option: UiOption): boolean {\n    if (option.disabled) {\n      return false\n    }\n    if (option.hasAttribute('disabled')) {\n      return false\n    }\n    if (option.hidden && option.hasAttribute('hidden')) {\n      return false\n    }\n    return true\n  }\n\n  handleSelect(e: CustomEvent<{ item: UiOption }>): void {\n    e.stopPropagation()\n    const item = e.detail.item\n    if (this.selectedOption && this.selectedOption !== item) {\n      this.selectedOption.selected = false\n    }\n    item.selected = true\n    this.selectedOption = item\n    this.#value = item.value\n    this.#internals.setFormValue(this.value ?? null)\n    this.open = false\n\n    // Dispatch change event\n    const changeEvent = new CustomEvent<UiSelectChangeEvent>('change', {\n      detail: { value: this.value, item: item },\n      bubbles: false,\n      composed: true,\n    })\n    this.dispatchEvent(changeEvent)\n    // Focus will be returned to select element by handleOpenChange when open=false\n  }\n\n  handleMenuClose(): void {\n    this.open = false\n    // Focus will be returned to select element by handleOpenChange when open=false\n  }\n\n  handleMenuToggle(e: ToggleEvent): void {\n    if (e.newState === 'closed') {\n      this.open = false\n    }\n  }\n\n  protected renderInput(): TemplateResult {\n    const styles = {\n      'anchor-name': `--${this.id}`,\n    }\n    return html`<ui-outlined-text-field\n      .name=${this.name}\n      .label=${this.label}\n      .value=${this.renderValue}\n      .disabled=${this.disabled}\n      .required=${this.required}\n      readonly\n      tabindex=\"-1\"\n      .inert=${true}\n      aria-hidden=\"true\"\n      .invalid=${this.invalid}\n      .invalidText=${this.invalidText || ''}\n      .supportingText=${this.supportingText || ''}\n      class=\"input\"\n      style=${styleMap(styles)}\n      part=\"input\"\n    >\n      <ui-icon part=\"icon\" slot=\"suffix\">arrow_drop_down</ui-icon>\n    </ui-outlined-text-field>`\n  }\n\n  protected renderMenu(): TemplateResult {\n    const styles = {\n      'position-anchor': `--${this.id}`,\n    }\n    return html`<ui-menu\n      id=\"menu\"\n      class=\"menu\"\n      part=\"menu\"\n      style=${styleMap(styles)}\n      popover=\"auto\"\n      selector=\"ui-option\"\n      @select=\"${this.handleSelect}\"\n      @close=\"${this.handleMenuClose}\"\n      @toggle=\"${this.handleMenuToggle}\"\n    >\n      <slot @slotchange=\"${this.handleSlotChange}\"></slot>\n    </ui-menu>`\n  }\n\n  protected async handleSlotChange(): Promise<void> {\n    // When options change, re-evaluate the current selection\n    // only if we don't have an explicit value set\n    if (!this.value) {\n      this.setCurrentOption()\n      this.requestUpdate()\n    }\n  }\n\n  protected renderFocusRing(): TemplateResult {\n    return html`<ui-focus-ring part=\"focus-ring\" class=\"focus-ring\" .control=\"${this as HTMLElement}\"></ui-focus-ring>`\n  }\n\n  override render(): TemplateResult {\n    const classes = classMap({\n      'ui-select': true,\n      'open': this.open,\n      'disabled': this.disabled,\n    })\n    return html`${this.renderFocusRing()}\n      <div class=\"${classes}\">${this.renderInput()} ${this.renderMenu()}</div> `\n  }\n}\n"]}