@shoper/phoenix_design_system 1.11.5 → 1.11.7-0

package/build/cjs/packages/phoenix/src/components/form/search/search.js

@@ -38,11 +38,13 @@ exports.HSearch = class HSearch extends phoenix_light_lit_element.PhoenixLightLi
                 case 'ArrowDown':
                     ev.preventDefault();
                     this._activeItemId = this._activeItemId === searchItemsCount - 1 ? 0 : this._activeItemId + 1;
+                    this._dispatchActiveItemChangeEvent();
                     this._scroll(search_constants.SCROLL_DIRECTIONS.down);
                     break;
                 case 'ArrowUp':
                     ev.preventDefault();
                     this._activeItemId = this._activeItemId === 0 || this._activeItemId === -1 ? searchItemsCount - 1 : this._activeItemId - 1;
+                    this._dispatchActiveItemChangeEvent();
                     this._scroll(search_constants.SCROLL_DIRECTIONS.up);
                     break;
                 case 'Enter':
@@ -67,6 +69,14 @@ exports.HSearch = class HSearch extends phoenix_light_lit_element.PhoenixLightLi
                     break;
             }
         };
+        this._dispatchActiveItemChangeEvent = () => {
+            const ev = new CustomEvent(search_constants.SEARCH_CUSTOM_EVENT_NAMES.activeItemChange, {
+                detail: {
+                    activeItemId: this._activeItemId
+                }
+            });
+            this.dispatchEvent(ev);
+        };
         this._getSearchItemsCount = () => {
             if (this._shouldShowHistory)
                 return this._historyLimitedContent.length;
@@ -208,16 +218,42 @@ exports.HSearch = class HSearch extends phoenix_light_lit_element.PhoenixLightLi
         }
     }
     _displayHistorySuggestions() {
-        this._shouldShowHistory = true;
-        this._shouldShowResults = false;
+        this._handleToggleHistoryAndResults({
+            shouldShowHistory: true,
+            shouldShowResults: false
+        });
     }
     _hideHistorySuggestionsAndResults() {
-        this._shouldShowHistory = false;
-        this._shouldShowResults = false;
+        this._handleToggleHistoryAndResults({
+            shouldShowHistory: false,
+            shouldShowResults: false
+        });
     }
     _displayResults() {
-        this._shouldShowHistory = false;
-        this._shouldShowResults = true;
+        this._handleToggleHistoryAndResults({
+            shouldShowHistory: false,
+            shouldShowResults: true
+        });
+    }
+    _handleToggleHistoryAndResults({ shouldShowHistory, shouldShowResults }) {
+        this._shouldShowHistory = shouldShowHistory;
+        this._shouldShowResults = shouldShowResults;
+        this._toggleSearchInputAria(shouldShowHistory, shouldShowResults);
+    }
+    _toggleSearchInputAria(shouldShowHistory, shouldShowResults) {
+        var _a;
+        const $input = (_a = this._searchInput) === null || _a === void 0 ? void 0 : _a.input;
+        if (!$input)
+            return;
+        if (!shouldShowHistory && !shouldShowResults) {
+            $input.removeAttribute('aria-label');
+            return;
+        }
+        $input.setAttribute('aria-expanded', 'true');
+        if (shouldShowHistory)
+            $input.setAttribute('aria-label', this.settings.historyAriaLabelGuide);
+        if (shouldShowResults)
+            $input.setAttribute('aria-label', this.settings.suggesterAriaLabelGuide);
     }
     _scroll(direction) {
         const searchContainer = this.querySelector(`.${search_constants.SEARCH_CLASS_NAMES.container}`);
@@ -300,6 +336,7 @@ exports.HSearch = class HSearch extends phoenix_light_lit_element.PhoenixLightLi
                                 .translations="${this._translations}"
                                 active-item-id="${this._activeItemId}"
                                 module-instance-id="${this.moduleInstanceId}"
+                                .historyAriaLabel="${this.settings.historyAriaLabel}"
                             ></h-search-history>`)}
                     ${when.when(this._shouldShowResults, () => lit.html `<h-search-results
                                 .results="${this._searchResults}"

package/build/cjs/packages/phoenix/src/components/form/search/search.js.map

@@ -1 +1 @@
-{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA,wBAAwB,+CAAmD;AAC3E;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,mBAAmB,qEAA6E;AAChG;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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,+CAAmD;AAC3E;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,mBAAmB,qEAA6E;AAChG;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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/form/search/search_constants.js

@@ -30,7 +30,8 @@ const SEARCH_CUSTOM_EVENT_NAMES = {
     search: 'search',
     updateSearchPhrase: 'updateSearchPhrase',
     focusin: 'searchFocusIn',
-    keydown: 'searchKeyDown'
+    keydown: 'searchKeyDown',
+    activeItemChange: 'activeItemChange'
 };
 const baseSearchCssClass = 'search';
 const SEARCH_CLASS_NAMES = {

package/build/cjs/packages/phoenix/src/components/form/search/search_constants.js.map

@@ -1 +1 @@
-{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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/form/search/subcomponents/history/search_history.js

@@ -21,6 +21,11 @@ exports.HSearchHistory = class HSearchHistory extends phoenix_light_lit_element.
         this.buttonRef = ref_js.createRef();
         this.history = [];
         this.translations = {};
+        this._handleActiveItemChange = (ev) => {
+            const { activeItemId } = ev.detail;
+            const $activeItem = this.querySelector(`[data-search-item-id="${activeItemId}"]`);
+            $activeItem === null || $activeItem === void 0 ? void 0 : $activeItem.focus();
+        };
     }
     async connectedCallback() {
         super.connectedCallback();
@@ -39,6 +44,11 @@ exports.HSearchHistory = class HSearchHistory extends phoenix_light_lit_element.
         catch (_a) {
             console.error('Search context is not provided');
         }
+        document.addEventListener(search_constants.SEARCH_CUSTOM_EVENT_NAMES.activeItemChange, this._handleActiveItemChange);
+    }
+    disconnectedCallback() {
+        super.disconnectedCallback();
+        document.removeEventListener(search_constants.SEARCH_CUSTOM_EVENT_NAMES.activeItemChange, this._handleActiveItemChange);
     }
     render() {
         var _a;
@@ -54,6 +64,7 @@ exports.HSearchHistory = class HSearchHistory extends phoenix_light_lit_element.
                                 data-suggested-value="${historyElement.label}"
                                 data-search-item-id="${index}"
                                 module-instance-id="${this.moduleInstanceId}"
+                                ${this.historyAriaLabel ? `aria-label="${this.historyAriaLabel} ${historyElement.label}"` : ''}
                             >
                                 <h-icon icon-name="icon-clock"></h-icon>
 
@@ -92,6 +103,10 @@ tslib_es6.__decorate([
     decorators.property({ type: String, attribute: 'module-instance-id' }),
     tslib_es6.__metadata("design:type", String)
 ], exports.HSearchHistory.prototype, "moduleInstanceId", void 0);
+tslib_es6.__decorate([
+    decorators.property({ type: String }),
+    tslib_es6.__metadata("design:type", String)
+], exports.HSearchHistory.prototype, "historyAriaLabel", void 0);
 exports.HSearchHistory = tslib_es6.__decorate([
     phoenix_custom_element.phoenixCustomElement(search_constants.SEARCH_COMPONENT_NAMES.searchHistory)
 ], exports.HSearchHistory);

package/build/cjs/packages/phoenix/src/components/form/search/subcomponents/history/search_history.js.map

@@ -1 +1 @@
-{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA,wBAAwB,qDAAyD;AACjF;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,mBAAmB,2EAAmF;AACtG;AACA,qBAAqB,6EAAqF;AAC1G;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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,qDAAyD;AACjF;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,mBAAmB,2EAAmF;AACtG;AACA,qBAAqB,6EAAqF;AAC1G;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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/form/search/subcomponents/input/search_input.js

@@ -15,8 +15,8 @@ exports.HSearchInput = class HSearchInput extends phoenix_light_lit_element.Phoe
     }
     connectedCallback() {
         super.connectedCallback();
-        this._input = this.querySelector('input[type="search"]');
-        if (!this._input) {
+        this.input = this.querySelector('input[type="search"]');
+        if (!this.input) {
             throw new Error('Search input not found');
         }
         this._setupInitialValue();
@@ -28,7 +28,7 @@ exports.HSearchInput = class HSearchInput extends phoenix_light_lit_element.Phoe
         if (!searchPhraseRegArray)
             return;
         const searchQuery = searchPhraseRegArray[1].replace(/\+/g, ' ');
-        this._input.value = decodeURIComponent(this._deserializeInputPhrase(searchQuery));
+        this.input.value = decodeURIComponent(this._deserializeInputPhrase(searchQuery));
     }
     _deserializeInputPhrase(value) {
         if (value.indexOf('%2f') !== -1) {
@@ -46,14 +46,14 @@ exports.HSearchInput = class HSearchInput extends phoenix_light_lit_element.Phoe
         return value;
     }
     _setupListeners() {
-        this._input.addEventListener('focusin', (ev) => {
+        this.input.addEventListener('focusin', (ev) => {
             this.emitCustomEvent(search_constants.SEARCH_CUSTOM_EVENT_NAMES.focusin, {
                 detail: {
                     searchPhrase: ev.target.value
                 }
             });
         });
-        this._input.addEventListener('keydown', (ev) => {
+        this.input.addEventListener('keydown', (ev) => {
             if (ev.key === 'ArrowUp' || ev.key === 'ArrowDown' || ev.key === 'Escape')
                 return;
             if (ev.key !== 'Enter') {
@@ -74,8 +74,8 @@ exports.HSearchInput = class HSearchInput extends phoenix_light_lit_element.Phoe
                 }
             });
         });
-        this._input.addEventListener('search', (ev) => {
-            if (this._input.value !== '') {
+        this.input.addEventListener('search', (ev) => {
+            if (this.input.value !== '') {
                 return;
             }
             this.emitCustomEvent(search_constants.SEARCH_CUSTOM_EVENT_NAMES.search, {
@@ -88,13 +88,13 @@ exports.HSearchInput = class HSearchInput extends phoenix_light_lit_element.Phoe
             if (!ev.detail || ev.detail.moduleInstanceId !== this.moduleInstanceId)
                 return;
             this._isSearchPhraseCleared = true;
-            this._input.value = '';
-            this._input.focus();
+            this.input.value = '';
+            this.input.focus();
         });
         document.addEventListener(search_constants.SEARCH_CUSTOM_EVENT_NAMES.updateSearchPhrase, (ev) => {
             if (!ev.detail || ev.detail.moduleInstanceId !== this.moduleInstanceId)
                 return;
-            this._input.value = ev.detail.searchPhrase;
+            this.input.value = ev.detail.searchPhrase;
             this.emitCustomEvent(search_constants.SEARCH_CUSTOM_EVENT_NAMES.keydown, {
                 detail: {
                     searchPhrase: ev.detail.searchPhrase

package/build/cjs/packages/phoenix/src/components/form/search/subcomponents/results/search_producer_content.js

@@ -36,6 +36,7 @@ exports.HSearchProducerContent = class HSearchProducerContent extends phoenix_li
                 ? search_constants.SEARCH_CLASS_NAMES.itemActive
                 : ''}"
                         data-search-item-id="${this.initialItemIds.producers + index}"
+                        ${this.producerAriaLabel ? `aria-label="${this.producerAriaLabel} ${producer.name}"` : ''}
                     >
                         <a
                             href="${producer.url}"
@@ -71,6 +72,10 @@ tslib_es6.__decorate([
     decorators.property({ type: String, attribute: 'search-phrase' }),
     tslib_es6.__metadata("design:type", String)
 ], exports.HSearchProducerContent.prototype, "searchPhrase", void 0);
+tslib_es6.__decorate([
+    decorators.property({ type: String }),
+    tslib_es6.__metadata("design:type", String)
+], exports.HSearchProducerContent.prototype, "producerAriaLabel", void 0);
 exports.HSearchProducerContent = tslib_es6.__decorate([
     phoenix_custom_element.phoenixCustomElement(search_constants.SEARCH_COMPONENT_NAMES.searchProducerContent)
 ], exports.HSearchProducerContent);

package/build/cjs/packages/phoenix/src/components/form/search/subcomponents/results/search_producer_content.js.map

@@ -1 +1 @@
-{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA,wBAAwB,qDAAyD;AACjF;AACA;AACA;AACA;AACA,mBAAmB,2EAAmF;AACtG;AACA,qBAAqB,6EAAqF;AAC1G;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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,qDAAyD;AACjF;AACA;AACA;AACA;AACA,mBAAmB,2EAAmF;AACtG;AACA,qBAAqB,6EAAqF;AAC1G;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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/form/search/subcomponents/results/search_product_content.js

@@ -49,6 +49,7 @@ exports.HSearchProductContent = class HSearchProductContent extends phoenix_ligh
                 ? search_constants.SEARCH_CLASS_NAMES.itemActive
                 : ''}"
                         data-search-item-id="${this.initialItemIds.products + index}"
+                        ${this.productAriaLabel ? `aria-label="${this.productAriaLabel} ${product.name}"` : ''}
                     >
                         <a
                             href="${product.url}"
@@ -108,6 +109,10 @@ tslib_es6.__decorate([
     decorators.property({ type: Object }),
     tslib_es6.__metadata("design:type", Object)
 ], exports.HSearchProductContent.prototype, "translations", void 0);
+tslib_es6.__decorate([
+    decorators.property({ type: String }),
+    tslib_es6.__metadata("design:type", String)
+], exports.HSearchProductContent.prototype, "productAriaLabel", void 0);
 exports.HSearchProductContent = tslib_es6.__decorate([
     phoenix_custom_element.phoenixCustomElement(search_constants.SEARCH_COMPONENT_NAMES.searchProductContent)
 ], exports.HSearchProductContent);

package/build/cjs/packages/phoenix/src/components/form/search/subcomponents/results/search_product_content.js.map

@@ -1 +1 @@
-{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA,wBAAwB,qDAAyD;AACjF;AACA;AACA;AACA;AACA,mBAAmB,2EAAmF;AACtG;AACA,qBAAqB,6EAAqF;AAC1G;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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,qDAAyD;AACjF;AACA;AACA;AACA;AACA,mBAAmB,2EAAmF;AACtG;AACA,qBAAqB,6EAAqF;AAC1G;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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/form/search/subcomponents/results/search_results.js

@@ -17,6 +17,11 @@ exports.HSearchResults = class HSearchResults extends phoenix_light_lit_element.
         this.searchPhrase = '';
         this.translations = {};
         this._productPage = 1;
+        this._handleActiveItemChange = (ev) => {
+            const { activeItemId } = ev.detail;
+            const $activeItem = this.querySelector(`[data-search-item-id="${activeItemId}"]`);
+            $activeItem === null || $activeItem === void 0 ? void 0 : $activeItem.focus();
+        };
         this._getInitialItemsIds = () => {
             const suggestionInCategoryInitialItemId = this.results.suggestions.length;
             const categoryInitialItemId = this._isProductInTheCategory() ? suggestionInCategoryInitialItemId + 1 : suggestionInCategoryInitialItemId;
@@ -30,6 +35,14 @@ exports.HSearchResults = class HSearchResults extends phoenix_light_lit_element.
             };
         };
     }
+    connectedCallback() {
+        super.connectedCallback();
+        document.addEventListener(search_constants.SEARCH_CUSTOM_EVENT_NAMES.activeItemChange, this._handleActiveItemChange);
+    }
+    disconnectedCallback() {
+        super.disconnectedCallback();
+        document.removeEventListener(search_constants.SEARCH_CUSTOM_EVENT_NAMES.activeItemChange, this._handleActiveItemChange);
+    }
     _isProductInTheCategory() {
         return this.results.products.length && this.results.suggestions.length;
     }
@@ -72,6 +85,7 @@ exports.HSearchResults = class HSearchResults extends phoenix_light_lit_element.
                         locale="${this.locale}"
                         view="${this.view}"
                         module-instance-id="${this.moduleInstanceId}"
+                        .suggestionAriaLabel=${this.settings.suggestionAriaLabel}
                     >
                     </h-search-suggestion-content>`)}
                 ${when.when((_c = this.results.products) === null || _c === void 0 ? void 0 : _c.length, () => lit.html `
@@ -82,6 +96,7 @@ exports.HSearchResults = class HSearchResults extends phoenix_light_lit_element.
                                 active-item-id="${this.activeItemId}"
                                 .initialItemIds="${this._getInitialItemsIds()}"
                                 .translations="${this.translations}"
+                                .productAriaLabel=${this.settings.productAriaLabel}
                             ></h-search-product-content>
 
                             ${when.when(this.settings.isLoadingMoreSearchResultsEnabled, () => when.when(this._areMoreProductsAvailable(), () => lit.html `<button
@@ -104,6 +119,7 @@ exports.HSearchResults = class HSearchResults extends phoenix_light_lit_element.
                             .initialItemIds="${this._getInitialItemsIds()}"
                             .translations="${this.translations}"
                             search-phrase="${this.searchPhrase}"
+                            .producerAriaLabel=${this.settings.producerAriaLabel}
                         ></h-search-producer-content>`)}
             `;
         });

package/build/cjs/packages/phoenix/src/components/form/search/subcomponents/results/search_results.js.map

@@ -1 +1 @@
-{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA,wBAAwB,qDAAyD;AACjF;AACA;AACA;AACA;AACA,mBAAmB,2EAAmF;AACtG;AACA,sBAAsB,oDAAwD;AAC9E;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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,qDAAyD;AACjF;AACA;AACA;AACA;AACA,mBAAmB,2EAAmF;AACtG;AACA,sBAAsB,oDAAwD;AAC9E;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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/form/search/subcomponents/results/search_suggestion_content.js

@@ -112,6 +112,7 @@ exports.HSearchSuggestionContent = class HSearchSuggestionContent extends phoeni
             : ''}"
                                 data-suggested-value="${suggestion.suggestionName}"
                                 data-search-item-id="${index}"
+                                ${this.suggestionAriaLabel ? `aria-label="${this.suggestionAriaLabel} ${suggestion.suggestionName}"` : ''}
                             >
                                 ${when.when(suggestion.type === search_constants.SUGGESTIONS_TYPE.suggestion, () => lit.html ` <span> ${this._getMatchedPhrase(suggestion.suggestionName)} </span>
                                         <h-icon
@@ -157,6 +158,10 @@ tslib_es6.__decorate([
     decorators.property({ type: String, attribute: 'module-instance-id' }),
     tslib_es6.__metadata("design:type", String)
 ], exports.HSearchSuggestionContent.prototype, "moduleInstanceId", void 0);
+tslib_es6.__decorate([
+    decorators.property({ type: String }),
+    tslib_es6.__metadata("design:type", String)
+], exports.HSearchSuggestionContent.prototype, "suggestionAriaLabel", void 0);
 tslib_es6.__decorate([
     decorators.state(),
     tslib_es6.__metadata("design:type", String)

package/build/cjs/packages/phoenix/src/components/form/search/subcomponents/results/search_suggestion_content.js.map

@@ -1 +1 @@
-{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA,wBAAwB,qDAAyD;AACjF;AACA;AACA;AACA;AACA;AACA;AACA,mBAAmB,2EAAmF;AACtG;AACA,qBAAqB,6EAAqF;AAC1G;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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,qDAAyD;AACjF;AACA;AACA;AACA;AACA;AACA;AACA,mBAAmB,2EAAmF;AACtG;AACA,qBAAqB,6EAAqF;AAC1G;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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/modal/modal.js

@@ -27,6 +27,7 @@ exports.HModal = HModal_1 = class HModal extends phoenix_light_lit_element.Phoen
         this._firstFocusableElement = undefined;
         this._focusableElements = null;
         this._lastFocusableElement = undefined;
+        this._focusedToggler = null;
         this._contentRef = ref_js.createRef();
         this._focusSentinelStart = ref_js.createRef();
         this._focusSentinelEnd = ref_js.createRef();
@@ -151,7 +152,18 @@ exports.HModal = HModal_1 = class HModal extends phoenix_light_lit_element.Phoen
             this._propsChangeStrategies[modal_constants.MODAL_OPENED_PROP][String(this[modal_constants.MODAL_OPENED_PROP])]();
         }
     }
+    _setFocusToFirstFocusableElementInModalOrCloseBtn() {
+        requestAnimationFrame(() => {
+            if (this._contentRef.value) {
+                const focusableElements = utilities.UiDomUtils.getFocusableElements(this._contentRef.value);
+                if (focusableElements.length > 0) {
+                    focusableElements.length > 1 ? focusableElements[1].focus() : focusableElements[0].focus();
+                }
+            }
+        });
+    }
     async open() {
+        this._focusedToggler = document.activeElement;
         return new Promise((resolve) => {
             var _a;
             this[modal_constants.MODAL_OPENED_PROP] = true;
@@ -165,6 +177,7 @@ exports.HModal = HModal_1 = class HModal extends phoenix_light_lit_element.Phoen
                 setTimeout(() => {
                     var _a;
                     (_a = this._contentRef.value) === null || _a === void 0 ? void 0 : _a.classList.remove(`modal_show-${this.transition}-start`, `modal_show-${this.transition}-end`);
+                    this._setFocusToFirstFocusableElementInModalOrCloseBtn();
                     resolve();
                 }, transitionDuration);
             });
@@ -176,6 +189,10 @@ exports.HModal = HModal_1 = class HModal extends phoenix_light_lit_element.Phoen
     }
     _dispatchModalClosedEvent() {
         this.emitCustomEvent(modal_constants.MODAL_EVENTS.closed);
+        requestAnimationFrame(() => {
+            var _a;
+            (_a = this._focusedToggler) === null || _a === void 0 ? void 0 : _a.focus();
+        });
         this._backdropController.hide();
     }
     render() {

package/build/cjs/packages/phoenix/src/components/modal/modal.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;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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/search/search.d.ts

@@ -34,7 +34,10 @@ export declare class HSearch extends PhoenixLightLitElement {
     private _displayHistorySuggestions;
     private _hideHistorySuggestionsAndResults;
     private _displayResults;
+    private _handleToggleHistoryAndResults;
+    private _toggleSearchInputAria;
     private _bindKeys;
+    private _dispatchActiveItemChangeEvent;
     private _getSearchItemsCount;
     private _scroll;
     private _handleChooseSearchItem;

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

@@ -10,7 +10,7 @@ import { BehaviorSubject } from '../../../core/classes/behavior_subject/behavior
 import { ContextProviderController } from '../../../core/context/context_provider_controller.js';
 import { BREAKPOINTS } from '../../../global_constants.js';
 import { when as n } from '../../../../../../external/lit/external/lit-html/directives/when.js';
-import { DEFAULT_VIEW, SEARCH_CLASS_NAMES, SCROLL_DIRECTIONS, SEARCH_CONFIGURATION, SEARCH_COMPONENT_NAMES, SEARCH_CONTEXT_NAMES, SEARCH_CUSTOM_EVENT_NAMES } from './search_constants.js';
+import { DEFAULT_VIEW, SEARCH_CLASS_NAMES, SCROLL_DIRECTIONS, SEARCH_CUSTOM_EVENT_NAMES, SEARCH_CONFIGURATION, SEARCH_COMPONENT_NAMES, SEARCH_CONTEXT_NAMES } from './search_constants.js';
 
 let HSearch = class HSearch extends PhoenixLightLitElement {
     constructor() {
@@ -34,11 +34,13 @@ let HSearch = class HSearch extends PhoenixLightLitElement {
                 case 'ArrowDown':
                     ev.preventDefault();
                     this._activeItemId = this._activeItemId === searchItemsCount - 1 ? 0 : this._activeItemId + 1;
+                    this._dispatchActiveItemChangeEvent();
                     this._scroll(SCROLL_DIRECTIONS.down);
                     break;
                 case 'ArrowUp':
                     ev.preventDefault();
                     this._activeItemId = this._activeItemId === 0 || this._activeItemId === -1 ? searchItemsCount - 1 : this._activeItemId - 1;
+                    this._dispatchActiveItemChangeEvent();
                     this._scroll(SCROLL_DIRECTIONS.up);
                     break;
                 case 'Enter':
@@ -63,6 +65,14 @@ let HSearch = class HSearch extends PhoenixLightLitElement {
                     break;
             }
         };
+        this._dispatchActiveItemChangeEvent = () => {
+            const ev = new CustomEvent(SEARCH_CUSTOM_EVENT_NAMES.activeItemChange, {
+                detail: {
+                    activeItemId: this._activeItemId
+                }
+            });
+            this.dispatchEvent(ev);
+        };
         this._getSearchItemsCount = () => {
             if (this._shouldShowHistory)
                 return this._historyLimitedContent.length;
@@ -204,16 +214,42 @@ let HSearch = class HSearch extends PhoenixLightLitElement {
         }
     }
     _displayHistorySuggestions() {
-        this._shouldShowHistory = true;
-        this._shouldShowResults = false;
+        this._handleToggleHistoryAndResults({
+            shouldShowHistory: true,
+            shouldShowResults: false
+        });
     }
     _hideHistorySuggestionsAndResults() {
-        this._shouldShowHistory = false;
-        this._shouldShowResults = false;
+        this._handleToggleHistoryAndResults({
+            shouldShowHistory: false,
+            shouldShowResults: false
+        });
     }
     _displayResults() {
-        this._shouldShowHistory = false;
-        this._shouldShowResults = true;
+        this._handleToggleHistoryAndResults({
+            shouldShowHistory: false,
+            shouldShowResults: true
+        });
+    }
+    _handleToggleHistoryAndResults({ shouldShowHistory, shouldShowResults }) {
+        this._shouldShowHistory = shouldShowHistory;
+        this._shouldShowResults = shouldShowResults;
+        this._toggleSearchInputAria(shouldShowHistory, shouldShowResults);
+    }
+    _toggleSearchInputAria(shouldShowHistory, shouldShowResults) {
+        var _a;
+        const $input = (_a = this._searchInput) === null || _a === void 0 ? void 0 : _a.input;
+        if (!$input)
+            return;
+        if (!shouldShowHistory && !shouldShowResults) {
+            $input.removeAttribute('aria-label');
+            return;
+        }
+        $input.setAttribute('aria-expanded', 'true');
+        if (shouldShowHistory)
+            $input.setAttribute('aria-label', this.settings.historyAriaLabelGuide);
+        if (shouldShowResults)
+            $input.setAttribute('aria-label', this.settings.suggesterAriaLabelGuide);
     }
     _scroll(direction) {
         const searchContainer = this.querySelector(`.${SEARCH_CLASS_NAMES.container}`);
@@ -296,6 +332,7 @@ let HSearch = class HSearch extends PhoenixLightLitElement {
                                 .translations="${this._translations}"
                                 active-item-id="${this._activeItemId}"
                                 module-instance-id="${this.moduleInstanceId}"
+                                .historyAriaLabel="${this.settings.historyAriaLabel}"
                             ></h-search-history>`)}
                     ${n(this._shouldShowResults, () => html `<h-search-results
                                 .results="${this._searchResults}"

package/build/esm/packages/phoenix/src/components/form/search/search.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,0BAA0B,qEAA6E;AACvG;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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,0BAA0B,qEAA6E;AACvG;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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/search/search_constants.d.ts

@@ -28,6 +28,7 @@ export declare const SEARCH_CUSTOM_EVENT_NAMES: {
     readonly updateSearchPhrase: "updateSearchPhrase";
     readonly focusin: "searchFocusIn";
     readonly keydown: "searchKeyDown";
+    readonly activeItemChange: "activeItemChange";
 };
 export declare const SEARCH_CLASS_NAMES: {
     readonly searchBar: "search__bar";

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

@@ -26,7 +26,8 @@ const SEARCH_CUSTOM_EVENT_NAMES = {
     search: 'search',
     updateSearchPhrase: 'updateSearchPhrase',
     focusin: 'searchFocusIn',
-    keydown: 'searchKeyDown'
+    keydown: 'searchKeyDown',
+    activeItemChange: 'activeItemChange'
 };
 const baseSearchCssClass = 'search';
 const SEARCH_CLASS_NAMES = {

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

@@ -1 +1 @@
-{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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/search/search_types.d.ts

@@ -68,6 +68,12 @@ export declare type TSearchSettings = {
     showProductRate: boolean;
     showProductAvailability: boolean;
     showProductPrice: boolean;
+    historyAriaLabelGuide: string;
+    suggesterAriaLabelGuide: string;
+    historyAriaLabel: string;
+    suggestionAriaLabel: string;
+    productAriaLabel: string;
+    producerAriaLabel: string;
 };
 export declare type TScrollDirection = TEnumLiteralsOf<typeof SCROLL_DIRECTIONS>;
 export declare type TSuggestionType = TEnumLiteralsOf<typeof SUGGESTIONS_TYPE>;
@@ -77,3 +83,10 @@ export declare type TSuggestion = {
     categoryName?: string;
     url?: string;
 };
+export declare type THandleToggleHistoryAndResults = {
+    shouldShowHistory: boolean;
+    shouldShowResults: boolean;
+};
+export declare type TActiveItemChangeEventDetail = {
+    activeItemId: number;
+};

package/build/esm/packages/phoenix/src/components/form/search/subcomponents/history/search_history.d.ts

@@ -12,6 +12,9 @@ export declare class HSearchHistory extends PhoenixLightLitElement {
     activeItemId: number;
     translations: Record<string, string>;
     moduleInstanceId: string;
+    historyAriaLabel?: string;
     connectedCallback(): Promise<void>;
+    private _handleActiveItemChange;
+    disconnectedCallback(): void;
     protected render(): TemplateResult;
 }

package/build/esm/packages/phoenix/src/components/form/search/subcomponents/history/search_history.js

@@ -8,7 +8,7 @@ import { Observer } from '../../../../../core/classes/observer/observer.js';
 import { ContextConsumerController } from '../../../../../core/context/context_consumer_controller.js';
 import { createRef, ref } from 'lit-html/directives/ref.js';
 import { when as n } from '../../../../../../../../external/lit/external/lit-html/directives/when.js';
-import { SEARCH_CONTEXT_NAMES, SEARCH_CLASS_NAMES, SEARCH_COMPONENT_NAMES } from '../../search_constants.js';
+import { SEARCH_CONTEXT_NAMES, SEARCH_CUSTOM_EVENT_NAMES, SEARCH_CLASS_NAMES, SEARCH_COMPONENT_NAMES } from '../../search_constants.js';
 import { repeat as c } from '../../../../../../../../external/lit/external/lit-html/directives/repeat.js';
 
 let HSearchHistory = class HSearchHistory extends PhoenixLightLitElement {
@@ -17,6 +17,11 @@ let HSearchHistory = class HSearchHistory extends PhoenixLightLitElement {
         this.buttonRef = createRef();
         this.history = [];
         this.translations = {};
+        this._handleActiveItemChange = (ev) => {
+            const { activeItemId } = ev.detail;
+            const $activeItem = this.querySelector(`[data-search-item-id="${activeItemId}"]`);
+            $activeItem === null || $activeItem === void 0 ? void 0 : $activeItem.focus();
+        };
     }
     async connectedCallback() {
         super.connectedCallback();
@@ -35,6 +40,11 @@ let HSearchHistory = class HSearchHistory extends PhoenixLightLitElement {
         catch (_a) {
             console.error('Search context is not provided');
         }
+        document.addEventListener(SEARCH_CUSTOM_EVENT_NAMES.activeItemChange, this._handleActiveItemChange);
+    }
+    disconnectedCallback() {
+        super.disconnectedCallback();
+        document.removeEventListener(SEARCH_CUSTOM_EVENT_NAMES.activeItemChange, this._handleActiveItemChange);
     }
     render() {
         var _a;
@@ -50,6 +60,7 @@ let HSearchHistory = class HSearchHistory extends PhoenixLightLitElement {
                                 data-suggested-value="${historyElement.label}"
                                 data-search-item-id="${index}"
                                 module-instance-id="${this.moduleInstanceId}"
+                                ${this.historyAriaLabel ? `aria-label="${this.historyAriaLabel} ${historyElement.label}"` : ''}
                             >
                                 <h-icon icon-name="icon-clock"></h-icon>
 
@@ -88,6 +99,10 @@ __decorate([
     property({ type: String, attribute: 'module-instance-id' }),
     __metadata("design:type", String)
 ], HSearchHistory.prototype, "moduleInstanceId", void 0);
+__decorate([
+    property({ type: String }),
+    __metadata("design:type", String)
+], HSearchHistory.prototype, "historyAriaLabel", void 0);
 HSearchHistory = __decorate([
     phoenixCustomElement(SEARCH_COMPONENT_NAMES.searchHistory)
 ], HSearchHistory);

package/build/esm/packages/phoenix/src/components/form/search/subcomponents/history/search_history.js.map

@@ -1 +1 @@
-{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA,uCAAuC,qDAAyD;AAChG;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,0BAA0B,2EAAmF;AAC7G;AACA,4BAA4B,6EAAqF;AACjH;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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;AACA,0BAA0B,2EAAmF;AAC7G;AACA,4BAA4B,6EAAqF;AACjH;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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/search/subcomponents/input/search_input.d.ts

@@ -1,6 +1,6 @@
 import { PhoenixLightLitElement } from "../../../../../core/phoenix_light_lit_element/phoenix_light_lit_element";
 export declare class HSearchInput extends PhoenixLightLitElement {
-    private _input;
+    input: HTMLInputElement | null;
     moduleInstanceId: string;
     private _isSearchPhraseCleared;
     connectedCallback(): void;

package/build/esm/packages/phoenix/src/components/form/search/subcomponents/input/search_input.js

@@ -11,8 +11,8 @@ let HSearchInput = class HSearchInput extends PhoenixLightLitElement {
     }
     connectedCallback() {
         super.connectedCallback();
-        this._input = this.querySelector('input[type="search"]');
-        if (!this._input) {
+        this.input = this.querySelector('input[type="search"]');
+        if (!this.input) {
             throw new Error('Search input not found');
         }
         this._setupInitialValue();
@@ -24,7 +24,7 @@ let HSearchInput = class HSearchInput extends PhoenixLightLitElement {
         if (!searchPhraseRegArray)
             return;
         const searchQuery = searchPhraseRegArray[1].replace(/\+/g, ' ');
-        this._input.value = decodeURIComponent(this._deserializeInputPhrase(searchQuery));
+        this.input.value = decodeURIComponent(this._deserializeInputPhrase(searchQuery));
     }
     _deserializeInputPhrase(value) {
         if (value.indexOf('%2f') !== -1) {
@@ -42,14 +42,14 @@ let HSearchInput = class HSearchInput extends PhoenixLightLitElement {
         return value;
     }
     _setupListeners() {
-        this._input.addEventListener('focusin', (ev) => {
+        this.input.addEventListener('focusin', (ev) => {
             this.emitCustomEvent(SEARCH_CUSTOM_EVENT_NAMES.focusin, {
                 detail: {
                     searchPhrase: ev.target.value
                 }
             });
         });
-        this._input.addEventListener('keydown', (ev) => {
+        this.input.addEventListener('keydown', (ev) => {
             if (ev.key === 'ArrowUp' || ev.key === 'ArrowDown' || ev.key === 'Escape')
                 return;
             if (ev.key !== 'Enter') {
@@ -70,8 +70,8 @@ let HSearchInput = class HSearchInput extends PhoenixLightLitElement {
                 }
             });
         });
-        this._input.addEventListener('search', (ev) => {
-            if (this._input.value !== '') {
+        this.input.addEventListener('search', (ev) => {
+            if (this.input.value !== '') {
                 return;
             }
             this.emitCustomEvent(SEARCH_CUSTOM_EVENT_NAMES.search, {
@@ -84,13 +84,13 @@ let HSearchInput = class HSearchInput extends PhoenixLightLitElement {
             if (!ev.detail || ev.detail.moduleInstanceId !== this.moduleInstanceId)
                 return;
             this._isSearchPhraseCleared = true;
-            this._input.value = '';
-            this._input.focus();
+            this.input.value = '';
+            this.input.focus();
         });
         document.addEventListener(SEARCH_CUSTOM_EVENT_NAMES.updateSearchPhrase, (ev) => {
             if (!ev.detail || ev.detail.moduleInstanceId !== this.moduleInstanceId)
                 return;
-            this._input.value = ev.detail.searchPhrase;
+            this.input.value = ev.detail.searchPhrase;
             this.emitCustomEvent(SEARCH_CUSTOM_EVENT_NAMES.keydown, {
                 detail: {
                     searchPhrase: ev.detail.searchPhrase

package/build/esm/packages/phoenix/src/components/form/search/subcomponents/results/search_producer_content.d.ts

@@ -7,6 +7,7 @@ export declare class HSearchProducerContent extends PhoenixLightLitElement {
     initialItemIds: Record<string, number>;
     translations: Record<string, string>;
     searchPhrase: string;
+    producerAriaLabel?: string;
     private _getMatchedPhrase;
     protected render(): TemplateResult;
 }

package/build/esm/packages/phoenix/src/components/form/search/subcomponents/results/search_producer_content.js

@@ -32,6 +32,7 @@ let HSearchProducerContent = class HSearchProducerContent extends PhoenixLightLi
                 ? SEARCH_CLASS_NAMES.itemActive
                 : ''}"
                         data-search-item-id="${this.initialItemIds.producers + index}"
+                        ${this.producerAriaLabel ? `aria-label="${this.producerAriaLabel} ${producer.name}"` : ''}
                     >
                         <a
                             href="${producer.url}"
@@ -67,6 +68,10 @@ __decorate([
     property({ type: String, attribute: 'search-phrase' }),
     __metadata("design:type", String)
 ], HSearchProducerContent.prototype, "searchPhrase", void 0);
+__decorate([
+    property({ type: String }),
+    __metadata("design:type", String)
+], HSearchProducerContent.prototype, "producerAriaLabel", void 0);
 HSearchProducerContent = __decorate([
     phoenixCustomElement(SEARCH_COMPONENT_NAMES.searchProducerContent)
 ], HSearchProducerContent);

package/build/esm/packages/phoenix/src/components/form/search/subcomponents/results/search_producer_content.js.map

@@ -1 +1 @@
-{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA,uCAAuC,qDAAyD;AAChG;AACA;AACA;AACA;AACA,0BAA0B,2EAAmF;AAC7G;AACA,4BAA4B,6EAAqF;AACjH;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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,0BAA0B,2EAAmF;AAC7G;AACA,4BAA4B,6EAAqF;AACjH;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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/search/subcomponents/results/search_product_content.d.ts

@@ -7,6 +7,7 @@ export declare class HSearchProductContent extends PhoenixLightLitElement {
     activeItemId: number;
     initialItemIds: Record<string, number>;
     translations: Record<string, string>;
+    productAriaLabel?: string;
     getProductRateHtml: (productRate: number) => TemplateResult;
     private _getShortenProductName;
     private _getPercentPromotion;

package/build/esm/packages/phoenix/src/components/form/search/subcomponents/results/search_product_content.js

@@ -45,6 +45,7 @@ let HSearchProductContent = class HSearchProductContent extends PhoenixLightLitE
                 ? SEARCH_CLASS_NAMES.itemActive
                 : ''}"
                         data-search-item-id="${this.initialItemIds.products + index}"
+                        ${this.productAriaLabel ? `aria-label="${this.productAriaLabel} ${product.name}"` : ''}
                     >
                         <a
                             href="${product.url}"
@@ -104,6 +105,10 @@ __decorate([
     property({ type: Object }),
     __metadata("design:type", Object)
 ], HSearchProductContent.prototype, "translations", void 0);
+__decorate([
+    property({ type: String }),
+    __metadata("design:type", String)
+], HSearchProductContent.prototype, "productAriaLabel", void 0);
 HSearchProductContent = __decorate([
     phoenixCustomElement(SEARCH_COMPONENT_NAMES.searchProductContent)
 ], HSearchProductContent);

package/build/esm/packages/phoenix/src/components/form/search/subcomponents/results/search_product_content.js.map

@@ -1 +1 @@
-{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA,uCAAuC,qDAAyD;AAChG;AACA;AACA;AACA;AACA,0BAA0B,2EAAmF;AAC7G;AACA,4BAA4B,6EAAqF;AACjH;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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,0BAA0B,2EAAmF;AAC7G;AACA,4BAA4B,6EAAqF;AACjH;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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/search/subcomponents/results/search_results.d.ts

@@ -11,6 +11,9 @@ export declare class HSearchResults extends PhoenixLightLitElement {
     translations: Record<string, string>;
     moduleInstanceId: string;
     private _productPage;
+    connectedCallback(): void;
+    private _handleActiveItemChange;
+    disconnectedCallback(): void;
     private _getInitialItemsIds;
     private _isProductInTheCategory;
     private _areSearchResultsNotEmpty;

package/build/esm/packages/phoenix/src/components/form/search/subcomponents/results/search_results.js

@@ -13,6 +13,11 @@ let HSearchResults = class HSearchResults extends PhoenixLightLitElement {
         this.searchPhrase = '';
         this.translations = {};
         this._productPage = 1;
+        this._handleActiveItemChange = (ev) => {
+            const { activeItemId } = ev.detail;
+            const $activeItem = this.querySelector(`[data-search-item-id="${activeItemId}"]`);
+            $activeItem === null || $activeItem === void 0 ? void 0 : $activeItem.focus();
+        };
         this._getInitialItemsIds = () => {
             const suggestionInCategoryInitialItemId = this.results.suggestions.length;
             const categoryInitialItemId = this._isProductInTheCategory() ? suggestionInCategoryInitialItemId + 1 : suggestionInCategoryInitialItemId;
@@ -26,6 +31,14 @@ let HSearchResults = class HSearchResults extends PhoenixLightLitElement {
             };
         };
     }
+    connectedCallback() {
+        super.connectedCallback();
+        document.addEventListener(SEARCH_CUSTOM_EVENT_NAMES.activeItemChange, this._handleActiveItemChange);
+    }
+    disconnectedCallback() {
+        super.disconnectedCallback();
+        document.removeEventListener(SEARCH_CUSTOM_EVENT_NAMES.activeItemChange, this._handleActiveItemChange);
+    }
     _isProductInTheCategory() {
         return this.results.products.length && this.results.suggestions.length;
     }
@@ -68,6 +81,7 @@ let HSearchResults = class HSearchResults extends PhoenixLightLitElement {
                         locale="${this.locale}"
                         view="${this.view}"
                         module-instance-id="${this.moduleInstanceId}"
+                        .suggestionAriaLabel=${this.settings.suggestionAriaLabel}
                     >
                     </h-search-suggestion-content>`)}
                 ${n((_c = this.results.products) === null || _c === void 0 ? void 0 : _c.length, () => html `
@@ -78,6 +92,7 @@ let HSearchResults = class HSearchResults extends PhoenixLightLitElement {
                                 active-item-id="${this.activeItemId}"
                                 .initialItemIds="${this._getInitialItemsIds()}"
                                 .translations="${this.translations}"
+                                .productAriaLabel=${this.settings.productAriaLabel}
                             ></h-search-product-content>
 
                             ${n(this.settings.isLoadingMoreSearchResultsEnabled, () => n(this._areMoreProductsAvailable(), () => html `<button
@@ -100,6 +115,7 @@ let HSearchResults = class HSearchResults extends PhoenixLightLitElement {
                             .initialItemIds="${this._getInitialItemsIds()}"
                             .translations="${this.translations}"
                             search-phrase="${this.searchPhrase}"
+                            .producerAriaLabel=${this.settings.producerAriaLabel}
                         ></h-search-producer-content>`)}
             `;
         });

package/build/esm/packages/phoenix/src/components/form/search/subcomponents/results/search_results.js.map

@@ -1 +1 @@
-{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA,uCAAuC,qDAAyD;AAChG;AACA;AACA;AACA;AACA,0BAA0B,2EAAmF;AAC7G;AACA,sBAAsB,oDAAwD;AAC9E;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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,0BAA0B,2EAAmF;AAC7G;AACA,sBAAsB,oDAAwD;AAC9E;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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/search/subcomponents/results/search_suggestion_content.d.ts

@@ -10,6 +10,7 @@ export declare class HSearchSuggestionContent extends PhoenixLightLitElement {
     view: string;
     locale: string;
     moduleInstanceId: string;
+    suggestionAriaLabel?: string;
     private _searchPhrase;
     private _suggestionsData;
     connectedCallback(): Promise<void>;

package/build/esm/packages/phoenix/src/components/form/search/subcomponents/results/search_suggestion_content.js

@@ -108,6 +108,7 @@ let HSearchSuggestionContent = class HSearchSuggestionContent extends PhoenixLig
             : ''}"
                                 data-suggested-value="${suggestion.suggestionName}"
                                 data-search-item-id="${index}"
+                                ${this.suggestionAriaLabel ? `aria-label="${this.suggestionAriaLabel} ${suggestion.suggestionName}"` : ''}
                             >
                                 ${n(suggestion.type === SUGGESTIONS_TYPE.suggestion, () => html ` <span> ${this._getMatchedPhrase(suggestion.suggestionName)} </span>
                                         <h-icon
@@ -153,6 +154,10 @@ __decorate([
     property({ type: String, attribute: 'module-instance-id' }),
     __metadata("design:type", String)
 ], HSearchSuggestionContent.prototype, "moduleInstanceId", void 0);
+__decorate([
+    property({ type: String }),
+    __metadata("design:type", String)
+], HSearchSuggestionContent.prototype, "suggestionAriaLabel", void 0);
 __decorate([
     state(),
     __metadata("design:type", String)

package/build/esm/packages/phoenix/src/components/form/search/subcomponents/results/search_suggestion_content.js.map

@@ -1 +1 @@
-{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA,uCAAuC,qDAAyD;AAChG;AACA;AACA;AACA;AACA;AACA;AACA,0BAA0B,2EAAmF;AAC7G;AACA,4BAA4B,6EAAqF;AACjH;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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,0BAA0B,2EAAmF;AAC7G;AACA,4BAA4B,6EAAqF;AACjH;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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/modal/modal.d.ts

@@ -9,6 +9,7 @@ export declare class HModal extends PhoenixLightLitElement {
     _firstFocusableElement: HTMLElement | undefined;
     _focusableElements: HTMLElement[] | null;
     _lastFocusableElement: HTMLElement | undefined;
+    private _focusedToggler;
     private _contentRef;
     private _focusSentinelStart;
     private _focusSentinelEnd;
@@ -22,6 +23,7 @@ export declare class HModal extends PhoenixLightLitElement {
     disconnectedCallback(): void;
     firstUpdated(props: PropertyValues): void;
     updated(changedProps: Map<string, any>): void;
+    private _setFocusToFirstFocusableElementInModalOrCloseBtn;
     private _keepFocusWithinModal;
     private _handleCloseFromCloseComponent;
     private _bindCloseOnEsc;

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

@@ -23,6 +23,7 @@ let HModal = HModal_1 = class HModal extends PhoenixLightLitElement {
         this._firstFocusableElement = undefined;
         this._focusableElements = null;
         this._lastFocusableElement = undefined;
+        this._focusedToggler = null;
         this._contentRef = createRef();
         this._focusSentinelStart = createRef();
         this._focusSentinelEnd = createRef();
@@ -147,7 +148,18 @@ let HModal = HModal_1 = class HModal extends PhoenixLightLitElement {
             this._propsChangeStrategies[MODAL_OPENED_PROP][String(this[MODAL_OPENED_PROP])]();
         }
     }
+    _setFocusToFirstFocusableElementInModalOrCloseBtn() {
+        requestAnimationFrame(() => {
+            if (this._contentRef.value) {
+                const focusableElements = UiDomUtils.getFocusableElements(this._contentRef.value);
+                if (focusableElements.length > 0) {
+                    focusableElements.length > 1 ? focusableElements[1].focus() : focusableElements[0].focus();
+                }
+            }
+        });
+    }
     async open() {
+        this._focusedToggler = document.activeElement;
         return new Promise((resolve) => {
             var _a;
             this[MODAL_OPENED_PROP] = true;
@@ -161,6 +173,7 @@ let HModal = HModal_1 = class HModal extends PhoenixLightLitElement {
                 setTimeout(() => {
                     var _a;
                     (_a = this._contentRef.value) === null || _a === void 0 ? void 0 : _a.classList.remove(`modal_show-${this.transition}-start`, `modal_show-${this.transition}-end`);
+                    this._setFocusToFirstFocusableElementInModalOrCloseBtn();
                     resolve();
                 }, transitionDuration);
             });
@@ -172,6 +185,10 @@ let HModal = HModal_1 = class HModal extends PhoenixLightLitElement {
     }
     _dispatchModalClosedEvent() {
         this.emitCustomEvent(MODAL_EVENTS.closed);
+        requestAnimationFrame(() => {
+            var _a;
+            (_a = this._focusedToggler) === null || _a === void 0 ? void 0 : _a.focus();
+        });
         this._backdropController.hide();
     }
     render() {

package/build/esm/packages/phoenix/src/components/modal/modal.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;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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/package.json

@@ -2,7 +2,7 @@
   "name": "@shoper/phoenix_design_system",
   "packageManager": "yarn@3.2.0",
   "sideEffects": false,
-  "version": "1.11.5",
+  "version": "1.11.7-0",
   "description": "phoenix design system",
   "author": "zefirek",
   "license": "MIT",