@shoper/phoenix_design_system 1.15.11 → 1.15.13-0

package/build/cjs/packages/phoenix/src/components/slider/slider.js

@@ -8,6 +8,7 @@ var utilities = require('@dreamcommerce/utilities');
 var phoenix_light_lit_element = require('../../core/phoenix_light_lit_element/phoenix_light_lit_element.js');
 var phoenix_custom_element = require('../../core/decorators/phoenix_custom_element.js');
 var splide_esm = require('../../../../../external/@splidejs/splide/dist/js/splide.esm.js');
+var slider_constants = require('./slider_constants.js');
 
 exports.HSlider = class HSlider extends phoenix_light_lit_element.PhoenixLightLitElement {
     constructor() {
@@ -21,6 +22,20 @@ exports.HSlider = class HSlider extends phoenix_light_lit_element.PhoenixLightLi
             focus: 'center'
         };
         this._slider = null;
+        this._$focusableElements = [];
+        this._showFocusableNodes = (slideComponent) => {
+            this._handleFocusableNodes(slideComponent, slider_constants.SLIDER_HANDLE_FOCUSABLE_NODES_OPTIONS.show);
+        };
+        this._hideFocusableNodes = (slideComponent) => {
+            this._handleFocusableNodes(slideComponent, slider_constants.SLIDER_HANDLE_FOCUSABLE_NODES_OPTIONS.hide);
+        };
+        this._handleFocusableNodes = ({ slide }, action) => {
+            const $focusableSlideChildren = this._$focusableElements.filter(($focusableElement) => slide.contains($focusableElement));
+            if ($focusableSlideChildren.length === 0)
+                return;
+            const newTabindex = action === slider_constants.SLIDER_HANDLE_FOCUSABLE_NODES_OPTIONS.show ? '0' : '-1';
+            $focusableSlideChildren.forEach(($element) => $element.setAttribute('tabindex', newTabindex));
+        };
     }
     get sliderSettings() {
         return this._settings;
@@ -40,10 +55,34 @@ exports.HSlider = class HSlider extends phoenix_light_lit_element.PhoenixLightLi
         if (this._settings.mountOnConnectedCallback) {
             this._slider.mount();
         }
+        this._slider.on('visible', this._showFocusableNodes);
+        this._slider.on('hidden', this._hideFocusableNodes);
+        const mutationObserver = new MutationObserver((mutationList) => {
+            for (const mutation of mutationList) {
+                if (mutation.type !== "childList")
+                    return;
+                const $target = mutation.target;
+                const isFocusable = utilities.UiDomUtils.isFocusable($target);
+                const hasBeenEncountered = this._$focusableElements.some(($focusableElement) => $focusableElement === $target);
+                if (!isFocusable || hasBeenEncountered)
+                    return;
+                this._$focusableElements.push($target);
+                if ($target.closest('[aria-hidden="true"]')) {
+                    $target.setAttribute('tabindex', '-1');
+                }
+            }
+        });
+        mutationObserver.observe(this, { attributes: true, childList: true, subtree: true });
     }
     getSlider() {
         return this._slider;
     }
+    disconnectedCallback() {
+        var _a, _b;
+        super.disconnectedCallback();
+        (_a = this._slider) === null || _a === void 0 ? void 0 : _a.off('visible');
+        (_b = this._slider) === null || _b === void 0 ? void 0 : _b.off('hidden');
+    }
 };
 tslib_es6.__decorate([
     decorators.property({ reflect: true }),

package/build/cjs/packages/phoenix/src/components/slider/slider.js.map

@@ -1 +1 @@
-{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA,wBAAwB,4CAAgD;AACxE;AACA;AACA;AACA;AACA,yBAAyB,gEAAoE;AAC7F;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
+{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA,wBAAwB,4CAAgD;AACxE;AACA;AACA;AACA;AACA,yBAAyB,gEAAoE;AAC7F;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}

package/build/cjs/packages/phoenix/src/components/slider/slider_constants.js

@@ -0,0 +1,11 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+const SLIDER_HANDLE_FOCUSABLE_NODES_OPTIONS = {
+    show: 'show',
+    hide: 'hide'
+};
+
+exports.SLIDER_HANDLE_FOCUSABLE_NODES_OPTIONS = SLIDER_HANDLE_FOCUSABLE_NODES_OPTIONS;
+//# sourceMappingURL=slider_constants.js.map

package/build/cjs/packages/phoenix/src/components/slider/slider_constants.js.map

@@ -0,0 +1 @@
+{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}

package/build/cjs/packages/phoenix/src/controllers/list_box_controller/list_box_keyboard_controller.js

@@ -5,37 +5,64 @@ Object.defineProperty(exports, '__esModule', { value: true });
 var tslib_es6 = require('../../../../../external/tslib/tslib.es6.js');
 require('lit');
 var utilities = require('@dreamcommerce/utilities');
-var keystrokes_controller = require('../keystrokes_controller/keystrokes_controller.js');
 var list_box_controller_constants = require('./list_box_controller_constants.js');
 
-var _ListBoxKeyboardController_host, _ListBoxKeyboardController__$list, _ListBoxKeyboardController_currentOptionIndex, _ListBoxKeyboardController__$options, _ListBoxKeyboardController_listItemSelector, _ListBoxKeyboardController_keys;
+var _ListBoxKeyboardController_host, _ListBoxKeyboardController__$list, _ListBoxKeyboardController__$options, _ListBoxKeyboardController_listItemSelector, _ListBoxKeyboardController_keys;
 class ListBoxKeyboardController {
     constructor({ host, $list, listItemSelector = '[role="option"]', orientation = list_box_controller_constants.LIST_BOX_KEYBOARD_NAVIGATION_DIRECTIONS.vertical }) {
         _ListBoxKeyboardController_host.set(this, void 0);
         _ListBoxKeyboardController__$list.set(this, void 0);
-        _ListBoxKeyboardController_currentOptionIndex.set(this, void 0);
         _ListBoxKeyboardController__$options.set(this, void 0);
         _ListBoxKeyboardController_listItemSelector.set(this, void 0);
         _ListBoxKeyboardController_keys.set(this, void 0);
+        this._handleKeyboardNavigation = (ev) => {
+            if (tslib_es6.__classPrivateFieldGet(this, _ListBoxKeyboardController_keys, "f").find((key) => key === ev.key)) {
+                this._handleArrowNavigation(ev);
+                return;
+            }
+            this._handleWriteableCharacter(ev);
+        };
         this._handleArrowNavigation = (event) => {
             event.preventDefault();
             const { key } = event;
-            const prevOptionIndex = tslib_es6.__classPrivateFieldGet(this, _ListBoxKeyboardController_currentOptionIndex, "f");
+            const $availableOptions = tslib_es6.__classPrivateFieldGet(this, _ListBoxKeyboardController__$options, "f").filter(($option) => {
+                return !$option.getAttribute('inactive') && !$option.getAttribute('disabled') && !$option.hidden;
+            });
+            const prevOptionIndex = this._findCurrentIndex();
             let newOptionIndex = key === 'ArrowDown' || key === 'ArrowRight' ? this._getNextOptionIndex() : this._getPrevOptionIndex();
             if (newOptionIndex === undefined) {
-                const selectedOptionIndex = tslib_es6.__classPrivateFieldGet(this, _ListBoxKeyboardController__$options, "f").findIndex(($option) => $option.selected);
-                newOptionIndex = selectedOptionIndex !== -1 ? selectedOptionIndex : 0;
+                newOptionIndex = this._findCurrentIndex();
             }
-            if (newOptionIndex === tslib_es6.__classPrivateFieldGet(this, _ListBoxKeyboardController_currentOptionIndex, "f"))
+            if (newOptionIndex === this.currentOptionIndex)
                 return;
             if (prevOptionIndex !== undefined) {
                 const $prevOption = tslib_es6.__classPrivateFieldGet(this, _ListBoxKeyboardController__$options, "f")[prevOptionIndex];
-                utilities.UiDomUtils.makeUnnavigable($prevOption);
+                $prevOption && utilities.UiDomUtils.makeUnnavigable($prevOption);
             }
-            tslib_es6.__classPrivateFieldSet(this, _ListBoxKeyboardController_currentOptionIndex, newOptionIndex, "f");
-            const $focusedOption = tslib_es6.__classPrivateFieldGet(this, _ListBoxKeyboardController__$options, "f")[newOptionIndex];
-            utilities.UiDomUtils.makeNavigable($focusedOption);
-            $focusedOption.focus();
+            this.currentOptionIndex = newOptionIndex;
+            const $focusedOption = $availableOptions[newOptionIndex];
+            if ($focusedOption) {
+                utilities.UiDomUtils.makeNavigable($focusedOption);
+                $focusedOption.focus();
+            }
+        };
+        this._findCurrentIndex = () => {
+            const $availableOptions = tslib_es6.__classPrivateFieldGet(this, _ListBoxKeyboardController__$options, "f").filter(($option) => {
+                return !$option.getAttribute('inactive') && !$option.getAttribute('disabled') && !$option.hidden;
+            });
+            const selectedOptionIndex = $availableOptions.findIndex(($option) => $option.selected);
+            return selectedOptionIndex !== -1 ? selectedOptionIndex : 0;
+        };
+        this._handleWriteableCharacter = (ev) => {
+            var _a;
+            const $searchInput = (_a = tslib_es6.__classPrivateFieldGet(this, _ListBoxKeyboardController_host, "f").$search.value) === null || _a === void 0 ? void 0 : _a.querySelector('[role="search"]');
+            if (!$searchInput)
+                return;
+            $searchInput === null || $searchInput === void 0 ? void 0 : $searchInput.focus();
+        };
+        this.calculateSelectedOptionIndex = () => {
+            const selectedOptionIndex = tslib_es6.__classPrivateFieldGet(this, _ListBoxKeyboardController__$options, "f").findIndex(($option) => $option.selected);
+            this.currentOptionIndex = selectedOptionIndex !== -1 ? selectedOptionIndex : 0;
         };
         tslib_es6.__classPrivateFieldSet(this, _ListBoxKeyboardController_host, host, "f");
         tslib_es6.__classPrivateFieldSet(this, _ListBoxKeyboardController__$list, $list, "f");
@@ -45,40 +72,59 @@ class ListBoxKeyboardController {
         tslib_es6.__classPrivateFieldGet(this, _ListBoxKeyboardController_host, "f").addController(this);
     }
     hostConnected() {
-        new keystrokes_controller.KeystrokesController({
-            host: tslib_es6.__classPrivateFieldGet(this, _ListBoxKeyboardController_host, "f"),
-            keys: tslib_es6.__classPrivateFieldGet(this, _ListBoxKeyboardController_keys, "f"),
-            callback: this._handleArrowNavigation,
-            target: tslib_es6.__classPrivateFieldGet(this, _ListBoxKeyboardController__$list, "f")
-        });
+        tslib_es6.__classPrivateFieldGet(this, _ListBoxKeyboardController__$list, "f").addEventListener('keydown', this._handleKeyboardNavigation);
         utilities.UiDomUtils.makeNavigable(tslib_es6.__classPrivateFieldGet(this, _ListBoxKeyboardController__$list, "f"));
         tslib_es6.__classPrivateFieldGet(this, _ListBoxKeyboardController__$list, "f").addEventListener('focusin', (event) => {
             if (event.target !== tslib_es6.__classPrivateFieldGet(this, _ListBoxKeyboardController__$list, "f"))
                 return;
-            if (tslib_es6.__classPrivateFieldGet(this, _ListBoxKeyboardController_currentOptionIndex, "f") === undefined)
+            if (this.currentOptionIndex === undefined)
                 return;
-            const $prevOption = tslib_es6.__classPrivateFieldGet(this, _ListBoxKeyboardController__$options, "f")[tslib_es6.__classPrivateFieldGet(this, _ListBoxKeyboardController_currentOptionIndex, "f")];
+            const $prevOption = tslib_es6.__classPrivateFieldGet(this, _ListBoxKeyboardController__$options, "f")[this.currentOptionIndex];
             utilities.UiDomUtils.makeUnnavigable($prevOption);
-            tslib_es6.__classPrivateFieldSet(this, _ListBoxKeyboardController_currentOptionIndex, undefined, "f");
+            this.currentOptionIndex = undefined;
         });
         tslib_es6.__classPrivateFieldGet(this, _ListBoxKeyboardController__$options, "f").forEach(($option) => utilities.UiDomUtils.makeUnnavigable($option));
     }
     _getPrevOptionIndex() {
-        if (tslib_es6.__classPrivateFieldGet(this, _ListBoxKeyboardController_currentOptionIndex, "f") === undefined)
+        if (this.currentOptionIndex === undefined)
             return undefined;
-        if (tslib_es6.__classPrivateFieldGet(this, _ListBoxKeyboardController_currentOptionIndex, "f") <= 0)
-            return tslib_es6.__classPrivateFieldGet(this, _ListBoxKeyboardController_currentOptionIndex, "f");
-        return tslib_es6.__classPrivateFieldGet(this, _ListBoxKeyboardController_currentOptionIndex, "f") - 1;
+        if (this.currentOptionIndex <= 0)
+            return this.currentOptionIndex;
+        if (this.currentOptionIndex <= 0)
+            return this.currentOptionIndex;
+        const $availableOptions = tslib_es6.__classPrivateFieldGet(this, _ListBoxKeyboardController__$options, "f").filter(($option) => {
+            return !$option.getAttribute('inactive') && !$option.getAttribute('disabled') && !$option.hidden;
+        });
+        if (!!$availableOptions[this.currentOptionIndex - 1])
+            return this.currentOptionIndex - 1;
+        // bo ktoś wpisał coś w searcha i index obecnie wybranej opcji jest inny
+        const newIndexOfCurrentlySelectedOption = $availableOptions.findIndex(($option) => $option.selected);
+        if (newIndexOfCurrentlySelectedOption)
+            return newIndexOfCurrentlySelectedOption - 1;
+        return this.currentOptionIndex - 1;
     }
     _getNextOptionIndex() {
-        if (tslib_es6.__classPrivateFieldGet(this, _ListBoxKeyboardController_currentOptionIndex, "f") === undefined)
+        if (this.currentOptionIndex === undefined)
             return undefined;
-        if (tslib_es6.__classPrivateFieldGet(this, _ListBoxKeyboardController_currentOptionIndex, "f") >= tslib_es6.__classPrivateFieldGet(this, _ListBoxKeyboardController__$options, "f").length - 1)
-            return tslib_es6.__classPrivateFieldGet(this, _ListBoxKeyboardController_currentOptionIndex, "f");
-        return tslib_es6.__classPrivateFieldGet(this, _ListBoxKeyboardController_currentOptionIndex, "f") + 1;
+        const $availableOptions = tslib_es6.__classPrivateFieldGet(this, _ListBoxKeyboardController__$options, "f").filter(($option) => {
+            return !$option.getAttribute('inactive') && !$option.getAttribute('disabled') && !$option.hidden;
+        });
+        if (this.currentOptionIndex === $availableOptions.length - 1)
+            return this.currentOptionIndex;
+        if (this.currentOptionIndex > $availableOptions.length - 1) {
+            // bo ktoś wpisał coś w searcha i index obecnie wybranej opcji jest inny
+            const newIndexOfCurrentlySelectedOption = $availableOptions.findIndex(($option) => $option.selected);
+            if (newIndexOfCurrentlySelectedOption)
+                return newIndexOfCurrentlySelectedOption + 1;
+            return 0;
+        }
+        return this.currentOptionIndex + 1;
+    }
+    hostDisconnected() {
+        tslib_es6.__classPrivateFieldGet(this, _ListBoxKeyboardController__$list, "f").removeEventListener('keydown', this._handleKeyboardNavigation);
     }
 }
-_ListBoxKeyboardController_host = new WeakMap(), _ListBoxKeyboardController__$list = new WeakMap(), _ListBoxKeyboardController_currentOptionIndex = new WeakMap(), _ListBoxKeyboardController__$options = new WeakMap(), _ListBoxKeyboardController_listItemSelector = new WeakMap(), _ListBoxKeyboardController_keys = new WeakMap();
+_ListBoxKeyboardController_host = new WeakMap(), _ListBoxKeyboardController__$list = new WeakMap(), _ListBoxKeyboardController__$options = new WeakMap(), _ListBoxKeyboardController_listItemSelector = new WeakMap(), _ListBoxKeyboardController_keys = new WeakMap();
 
 exports.ListBoxKeyboardController = ListBoxKeyboardController;
 //# sourceMappingURL=list_box_keyboard_controller.js.map

package/build/cjs/packages/phoenix/src/controllers/list_box_controller/list_box_keyboard_controller.js.map

@@ -1 +1 @@
-{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA,wBAAwB,4CAAgD;AACxE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
+{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA,wBAAwB,4CAAgD;AACxE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}

package/build/esm/packages/phoenix/src/components/dropdown/dropdown.d.ts

@@ -17,6 +17,7 @@ export declare class HDropdown extends PhoenixLightLitElement implements IDropdo
     mobilePosition: TMobileElementPosition;
     id: string;
     preventFocusTrap: boolean;
+    noAutoFocus: boolean;
     $dropdownToggler: HDropdownToggler | null;
     $dropdownContent: HDropdownContent | null;
     $nestedDropdownContentElements?: HDropdownContent[];

package/build/esm/packages/phoenix/src/components/dropdown/dropdown.js

@@ -28,6 +28,7 @@ let HDropdown = HDropdown_1 = class HDropdown extends PhoenixLightLitElement {
         this.portalTarget = DEFAULT_DROPDOWN_PORTAL_NAME;
         this.id = v4();
         this.preventFocusTrap = false;
+        this.noAutoFocus = false;
         this._backdropController = new BackdropController();
         this._handleClickOutside = async (target) => {
             var _a, _b;
@@ -44,7 +45,8 @@ let HDropdown = HDropdown_1 = class HDropdown extends PhoenixLightLitElement {
                 return;
             }
             await this.show();
-            this._focusOnFirstContentElement();
+            if (!this.noAutoFocus)
+                this._focusOnFirstContentElement();
         };
         this.show = async () => {
             if (this.opened)
@@ -172,7 +174,8 @@ let HDropdown = HDropdown_1 = class HDropdown extends PhoenixLightLitElement {
             const isHoveredWithinDropdown = this._isHoveredWithinDropdown(ev.target);
             if (isHoveredWithinDropdown && !this.opened) {
                 await this.show();
-                this._focusOnFirstContentElement();
+                if (!this.noAutoFocus)
+                    this._focusOnFirstContentElement();
                 return;
             }
             if (!isHoveredWithinDropdown && this.opened)
@@ -462,6 +465,10 @@ __decorate([
     property({ type: Boolean, attribute: 'prevent-focus-trap' }),
     __metadata("design:type", Object)
 ], HDropdown.prototype, "preventFocusTrap", void 0);
+__decorate([
+    property({ type: Boolean, attribute: 'no-autofocus' }),
+    __metadata("design:type", Object)
+], HDropdown.prototype, "noAutoFocus", void 0);
 HDropdown = HDropdown_1 = __decorate([
     phoenixCustomElement('h-dropdown'),
     __metadata("design:paramtypes", [])

package/build/esm/packages/phoenix/src/components/dropdown/dropdown.js.map

@@ -1 +1 @@
-{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA,uCAAuC,4CAAgD;AACvF;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,eAAe,qDAAyD;AACxE;AACA;AACA;AACA,uBAAuB,4CAAgD;AACvE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
+{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA,uCAAuC,4CAAgD;AACvF;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,eAAe,qDAAyD;AACxE;AACA;AACA;AACA,uBAAuB,4CAAgD;AACvE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}

package/build/esm/packages/phoenix/src/components/dropdown/dropdown_toggler.d.ts

@@ -1,6 +1,9 @@
 import { PhoenixLightLitElement } from "../../core/phoenix_light_lit_element/phoenix_light_lit_element";
 export declare class HDropdownToggler extends PhoenixLightLitElement {
     name: string;
+    ariaHasPopup: string;
+    ariaControls: string;
+    role: string;
     private _btnController;
     private _toggleElementAriaController;
     private _$dropdown;

package/build/esm/packages/phoenix/src/components/dropdown/dropdown_toggler.js

@@ -3,7 +3,6 @@ import { property } from 'lit/decorators';
 import '@dreamcommerce/utilities';
 import { PhoenixLightLitElement } from '../../core/phoenix_light_lit_element/phoenix_light_lit_element.js';
 import { phoenixCustomElement } from '../../core/decorators/phoenix_custom_element.js';
-import { BtnController } from '../../controllers/btn_controller/btn_controller.js';
 import { BREAKPOINTS } from '../../global_constants.js';
 import { DROPDOWN_CONTAINER_NAME, DROPDOWN_EVENTS, DROPDOWN_CSS_CLASSES, DROPDOWN_TOGGLE_ON_HOVER_ATTRIBUTE_NAME } from './dropdown_constants.js';
 import { ToggleElementAriaController } from '../../controllers/toggle_element_aria_controller/toggle_element_aria_controller.js';
@@ -12,6 +11,9 @@ let HDropdownToggler = class HDropdownToggler extends PhoenixLightLitElement {
     constructor() {
         super();
         this.name = '';
+        this.ariaHasPopup = 'menu';
+        this.ariaControls = '';
+        this.role = 'button';
         this._setupTogglerAria = () => {
             this._$dropdown = this.closest(DROPDOWN_CONTAINER_NAME);
             if (this._$dropdown.isOpened)
@@ -19,11 +21,14 @@ let HDropdownToggler = class HDropdownToggler extends PhoenixLightLitElement {
                     host: this,
                     initialAriaExpandedValue: this._$dropdown.isOpened()
                 });
-            this.setAttribute('aria-haspopup', 'true');
-            if (this._$dropdown.id)
-                this.setAttribute('aria-controls', this._$dropdown.id);
+            this.setAttribute('role', this.role);
+            this.setAttribute('aria-haspopup', this.ariaHasPopup);
+            if (this.ariaControls || this._$dropdown.id)
+                this.setAttribute('aria-controls', this.ariaControls || this._$dropdown.id);
         };
         this._dispatchToggleDropdownEventWithKeyboard = (ev) => {
+            if (ev.key !== 'Enter' && ev.key !== ' ')
+                return;
             ev.stopImmediatePropagation();
             this._dispatchToggleDropdownEvent(ev);
         };
@@ -42,7 +47,8 @@ let HDropdownToggler = class HDropdownToggler extends PhoenixLightLitElement {
     connectedCallback() {
         var _a;
         super.connectedCallback();
-        this._btnController = new BtnController(this, this._dispatchToggleDropdownEventWithKeyboard);
+        this.setAttribute('tabindex', '0');
+        this.addEventListener('keydown', this._dispatchToggleDropdownEventWithKeyboard);
         this._setupTogglerAria();
         const hasToggleOnHover = (_a = this._$dropdown) === null || _a === void 0 ? void 0 : _a.hasAttribute(DROPDOWN_TOGGLE_ON_HOVER_ATTRIBUTE_NAME);
         if (hasToggleOnHover) {
@@ -56,6 +62,18 @@ __decorate([
     property({ type: String, reflect: true }),
     __metadata("design:type", Object)
 ], HDropdownToggler.prototype, "name", void 0);
+__decorate([
+    property({ type: String, attribute: 'aria-haspopup' }),
+    __metadata("design:type", Object)
+], HDropdownToggler.prototype, "ariaHasPopup", void 0);
+__decorate([
+    property({ type: String, attribute: 'aria-controls' }),
+    __metadata("design:type", Object)
+], HDropdownToggler.prototype, "ariaControls", void 0);
+__decorate([
+    property({ type: String }),
+    __metadata("design:type", Object)
+], HDropdownToggler.prototype, "role", void 0);
 HDropdownToggler = __decorate([
     phoenixCustomElement('h-dropdown-toggler'),
     __metadata("design:paramtypes", [])

package/build/esm/packages/phoenix/src/components/dropdown/dropdown_toggler.js.map

@@ -1 +1 @@
-{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA,uCAAuC,4CAAgD;AACvF;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
+{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA,uCAAuC,4CAAgD;AACvF;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}

package/build/esm/packages/phoenix/src/components/form/radio/radio_control.d.ts

@@ -9,6 +9,7 @@ export declare class HRadioControl extends PhoenixLightLitElement {
     readonly: boolean;
     checked: boolean;
     value: string;
+    ariaDescribedby: string;
     constructor();
     connectedCallback(): void;
     protected render(): TemplateResult;

package/build/esm/packages/phoenix/src/components/form/radio/radio_control.js

@@ -37,6 +37,7 @@ let HRadioControl = class HRadioControl extends PhoenixLightLitElement {
                 ?readonly="${this.readonly}"
                 ?hidden="${this.hidden}"
                 .checked="${this.checked}"
+                aria-describedby="${ifDefined(this.ariaDescribedby)}"
                 @change="${this._handleChangeEvent}"
             />
 
@@ -76,6 +77,10 @@ __decorate([
     property({ type: String }),
     __metadata("design:type", String)
 ], HRadioControl.prototype, "value", void 0);
+__decorate([
+    property({ type: String, attribute: 'aria-describedby' }),
+    __metadata("design:type", String)
+], HRadioControl.prototype, "ariaDescribedby", void 0);
 HRadioControl = __decorate([
     phoenixCustomElement('h-radio-control'),
     __metadata("design:paramtypes", [])

package/build/esm/packages/phoenix/src/components/form/radio/radio_control.js.map

@@ -1 +1 @@
-{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA,uCAAuC,+CAAmD;AAC1F;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
+{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA,uCAAuC,+CAAmD;AAC1F;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}

package/build/esm/packages/phoenix/src/components/form/select/components/search/select_search.d.ts

@@ -2,7 +2,11 @@ import { PhoenixLightLitElement } from "../../../../../core/phoenix_light_lit_el
 import { TemplateResult } from 'lit';
 export declare class HSelectSearch extends PhoenixLightLitElement {
     value: string;
+    private _$selectOptions;
     connectedCallback(): void;
+    private _handleSearchKeydown;
+    private _handleDispatchEventOnOptionsList;
+    private _handleFocusOptionOnArrowNavigation;
     private _handleInputChange;
     protected render(): TemplateResult;
 }

package/build/esm/packages/phoenix/src/components/form/select/components/search/select_search.js

@@ -1,9 +1,11 @@
 import { __decorate, __metadata } from '../../../../../../../../external/tslib/tslib.es6.js';
 import { html } from 'lit';
 import { property } from 'lit/decorators';
+import '@dreamcommerce/utilities';
 import { PhoenixLightLitElement } from '../../../../../core/phoenix_light_lit_element/phoenix_light_lit_element.js';
 import { phoenixCustomElement } from '../../../../../core/decorators/phoenix_custom_element.js';
 import { SELECT_SEARCH_EVENT_NAMES, SELECT_RELATED_COMPONENTS_NAMES } from '../select_components_constatns.js';
+import { DROPDOWN_CONTENT_NAME } from '../../../../dropdown/dropdown_constants.js';
 import debounce_1 from '../../../../../../../../external/lodash/debounce.js';
 import { SELECT_SEARCH_CSS_CLASSES } from './select_search_constants.js';
 
@@ -11,6 +13,32 @@ let HSelectSearch = class HSelectSearch extends PhoenixLightLitElement {
     constructor() {
         super(...arguments);
         this.value = '';
+        this._$selectOptions = null;
+        this._handleSearchKeydown = (ev) => {
+            if (ev.key !== 'ArrowDown' && ev.key !== 'ArrowUp')
+                return;
+            this._handleFocusOptionOnArrowNavigation();
+            this._handleDispatchEventOnOptionsList(ev);
+        };
+        this._handleDispatchEventOnOptionsList = (ev) => {
+            var _a;
+            const arrowNavigationEvent = new KeyboardEvent('keydown', {
+                key: ev.key
+            });
+            (_a = this._$selectOptions) === null || _a === void 0 ? void 0 : _a.dispatchEvent(arrowNavigationEvent);
+        };
+        this._handleFocusOptionOnArrowNavigation = () => {
+            const $options = this._$selectOptions ? [...this._$selectOptions.querySelectorAll('h-option')] : [];
+            const $availableOptions = $options.filter(($option) => {
+                return !$option.getAttribute('inactive') && !$option.getAttribute('disabled') && !$option.hidden;
+            });
+            const $firstOption = $availableOptions.find(($option) => {
+                return !$option.getAttribute('inactive') && !$option.getAttribute('disabled') && !$option.getAttribute('hidden');
+            });
+            const $selectedOption = $availableOptions.find(($option) => $option.getAttribute('aria-selected'));
+            const $optionToFocus = $selectedOption || $firstOption;
+            $optionToFocus === null || $optionToFocus === void 0 ? void 0 : $optionToFocus.focus();
+        };
         this._handleInputChange = debounce_1(({ target }) => {
             this.value = target.value;
             this.emitCustomEvent(SELECT_SEARCH_EVENT_NAMES.search, {
@@ -21,6 +49,9 @@ let HSelectSearch = class HSelectSearch extends PhoenixLightLitElement {
     connectedCallback() {
         super.connectedCallback();
         this.classList.add(SELECT_SEARCH_CSS_CLASSES.selectSearch);
+        const $selectOptionsContainer = this.closest(DROPDOWN_CONTENT_NAME);
+        this._$selectOptions = $selectOptionsContainer === null || $selectOptionsContainer === void 0 ? void 0 : $selectOptionsContainer.querySelector('h-options');
+        this.addEventListener('keydown', this._handleSearchKeydown);
     }
     render() {
         return html `

package/build/esm/packages/phoenix/src/components/form/select/components/search/select_search.js.map

@@ -1 +1 @@
-{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA,uCAAuC,qDAAyD;AAChG;AACA;AACA;AACA;AACA;AACA,uBAAuB,qDAAyD;AAChF;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
+{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA,uCAAuC,qDAAyD;AAChG;AACA;AACA;AACA;AACA;AACA;AACA;AACA,uBAAuB,qDAAyD;AAChF;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}

package/build/esm/packages/phoenix/src/components/form/select/components/select_options.js

@@ -1,5 +1,5 @@
 import { __decorate, __metadata } from '../../../../../../../external/tslib/tslib.es6.js';
-import { UiDomUtils } from '@dreamcommerce/utilities';
+import '@dreamcommerce/utilities';
 import { PhoenixLightLitElement } from '../../../../core/phoenix_light_lit_element/phoenix_light_lit_element.js';
 import { phoenixCustomElement } from '../../../../core/decorators/phoenix_custom_element.js';
 import { SELECT_OPTIONS_EVENT_NAMES, SELECT_OPTION_EVENT_NAMES, SELECT_RELATED_COMPONENTS_NAMES } from './select_components_constatns.js';
@@ -22,7 +22,6 @@ let HOptions = class HOptions extends PhoenixLightLitElement {
             });
         };
         this.setAttribute('role', 'listbox');
-        UiDomUtils.makeNavigable(this);
         this.addEventListener(SELECT_OPTION_EVENT_NAMES.clicked, this._dispatchClickedEvent);
         this.addEventListener(SELECT_OPTION_EVENT_NAMES.updated, this._dispatchUpdatedEvent);
     }

package/build/esm/packages/phoenix/src/components/form/select/components/select_options.js.map

@@ -1 +1 @@
-{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA,uCAAuC,kDAAsD;AAC7F;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
+{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA,uCAAuC,kDAAsD;AAC7F;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}

package/build/esm/packages/phoenix/src/components/form/select/controllers/select_toggler_keyboard_controller/select_toggler_keyboard_controller.d.ts

@@ -0,0 +1,15 @@
+import { TSelectTogglerKeyboardControllerConstructorOptions } from './select_toggler_keyboard_controller_types';
+export declare class SelectTogglerKeyboardController {
+    #private;
+    constructor({ host, $toggler, $list, listItemSelector, }: TSelectTogglerKeyboardControllerConstructorOptions);
+    hostConnected(): void;
+    private _handleKeyboardNavigation;
+    private _openSelect;
+    private _openSelectAndGoToFirstElement;
+    private _openSelectAndGoToLastElement;
+    private _openSelectAndGoToMatchedElement;
+    private _getAvailableOptions;
+    private _findSelectedIndex;
+    private _navigate;
+    hostDisconnected(): void;
+}