npm - @shoper/phoenix_design_system - Versions diffs - 1.17.10-0 → 1.17.10-10 - Mend

@shoper/phoenix_design_system 1.17.10-0 → 1.17.10-10

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (15) hide show

package/build/cjs/packages/phoenix/src/components/form/search/controllers/search_popup_controller.js ADDED Viewed

@@ -0,0 +1,61 @@
+'use strict';
+Object.defineProperty(exports, '__esModule', { value: true });
+require('lit');
+var global_constants = require('../../../../global_constants.js');
+var sheet_constants = require('../../../sheet/sheet_constants.js');
+class SearchPopupController {
+    constructor(host) {
+        this.shouldRenderAsPopup = false;
+        this.isPopupOpened = false;
+        this._removeMobileOpened = () => {
+            const $storefrontSearch = document.querySelector(`h-storefront-search[module-instance-id="${this._host.moduleInstanceId}"]`);
+            const $searchSheet = $storefrontSearch === null || $storefrontSearch === void 0 ? void 0 : $storefrontSearch.querySelector('h-sheet');
+            $searchSheet === null || $searchSheet === void 0 ? void 0 : $searchSheet.open();
+        };
+        this._showPopup = () => {
+            this._updateIsPopupOpenedValue(true);
+        };
+        this._hidePopup = () => {
+            this._updateIsPopupOpenedValue(false);
+            this._host.shouldShowHistory = false;
+        };
+        this._updateShouldRenderAsPopup = () => {
+            if (window.innerWidth < global_constants.BREAKPOINTS.sm) {
+                this._updateShouldRenderAsPopupValue(false);
+            }
+            else {
+                this._updateShouldRenderAsPopupValue(true);
+            }
+        };
+        (this._host = host).addController(this);
+        if (window.innerWidth >= global_constants.BREAKPOINTS.sm) {
+            this.shouldRenderAsPopup = true;
+        }
+    }
+    hostConnected() {
+        this._host.addEventListener('removeMobileOpened', this._removeMobileOpened);
+        document.addEventListener(sheet_constants.SHEET_EVENTS.opened, this._showPopup);
+        document.addEventListener(sheet_constants.SHEET_EVENTS.closed, this._hidePopup);
+        window.addEventListener('resize', this._updateShouldRenderAsPopup);
+    }
+    hostDisconnected() {
+        this._host.removeEventListener('removeMobileOpened', this._removeMobileOpened);
+        document.removeEventListener(sheet_constants.SHEET_EVENTS.opened, this._showPopup);
+        document.removeEventListener(sheet_constants.SHEET_EVENTS.closed, this._hidePopup);
+        window.removeEventListener('resize', this._updateShouldRenderAsPopup);
+    }
+    _updateShouldRenderAsPopupValue(newValue) {
+        this.shouldRenderAsPopup = newValue;
+        this._host.requestUpdate();
+    }
+    _updateIsPopupOpenedValue(newValue) {
+        this.isPopupOpened = newValue;
+        this._host.requestUpdate();
+    }
+}
+exports.SearchPopupController = SearchPopupController;
+//# sourceMappingURL=search_popup_controller.js.map

package/build/cjs/packages/phoenix/src/components/form/search/controllers/search_popup_controller.js.map ADDED Viewed

	@@ -0,0 +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;"}

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

@@ -18,11 +18,14 @@ var global_constants = require('../../../global_constants.js');
 var v4 = require('../../../../../../external/uuid/dist/esm-browser/v4.js');
 var when = require('../../../../../../external/lit-html/directives/when.js');
 var search_constants = require('./search_constants.js');
+var search_popup_controller = require('./controllers/search_popup_controller.js');
 exports.HSearch = class HSearch extends phoenix_light_lit_element.PhoenixLightLitElement {
     constructor() {
         super(...arguments);
         this.view = search_constants.DEFAULT_VIEW;
+        this._shouldRenderAsPopup = false;
+        this._isOpenedAsPopup = false;
         this._id = v4['default']();
         this._openSearchButtonAriaLabelId = `${this._id}-open-search-button-aria-label`;
         this._searchContentContainerId = v4['default']();
@@ -30,7 +33,7 @@ exports.HSearch = class HSearch extends phoenix_light_lit_element.PhoenixLightLi
         this._searchHistoryRef = ref_js.createRef();
         this._searchMessageRef = ref_js.createRef();
         this._openSearchButtonLabelRef = ref_js.createRef();
-        this._shouldShowHistory = false;
+        this.shouldShowHistory = false;
         this._shouldShowResults = false;
         this._shouldShowMessage = false;
         this._searchHistory = [];
@@ -75,7 +78,7 @@ exports.HSearch = class HSearch extends phoenix_light_lit_element.PhoenixLightLi
                     break;
                 case 'Escape':
                     ev.preventDefault();
-                    if (this._shouldShowHistory || this._shouldShowHistory || this._shouldShowResults) {
+                    if (this.shouldShowHistory || this.shouldShowHistory || this._shouldShowResults) {
                         this._inputField.focus();
                         this._shouldShowMessage = false;
                         this._hideHistorySuggestionsAndResults();
@@ -181,7 +184,7 @@ exports.HSearch = class HSearch extends phoenix_light_lit_element.PhoenixLightLi
         this._handleBackwardListFocus = (ev) => {
             var _a, _b;
             const isFocusedOnSearchInput = document.activeElement === this._inputField;
-            const hasPopup = this._shouldShowHistory || this._shouldShowHistory || this._shouldShowResults;
+            const hasPopup = this.shouldShowHistory || this.shouldShowHistory || this._shouldShowResults;
             if (isFocusedOnSearchInput || !hasPopup)
                 return;
             ev.preventDefault();
@@ -268,9 +271,15 @@ exports.HSearch = class HSearch extends phoenix_light_lit_element.PhoenixLightLi
         this._switchTypeOfSearchView = () => {
             if (!this._isSuggesterLayerVisible())
                 return;
-            window.innerWidth > global_constants.BREAKPOINTS.sm
-                ? this.classList.remove(search_constants.SEARCH_CLASS_NAMES.mobileOpened)
-                : this.classList.add(search_constants.SEARCH_CLASS_NAMES.mobileOpened);
+            if (window.innerWidth > global_constants.BREAKPOINTS.sm) {
+                const hasBeenOpened = this.classList.contains(search_constants.SEARCH_CLASS_NAMES.mobileOpened);
+                this.classList.remove(search_constants.SEARCH_CLASS_NAMES.mobileOpened);
+                if (hasBeenOpened)
+                    this.dispatchEvent(new CustomEvent('removeMobileOpened'));
+            }
+            else if (!this._shouldRenderAsPopup || this._isOpenedAsPopup) {
+                this.classList.add(search_constants.SEARCH_CLASS_NAMES.mobileOpened);
+            }
         };
         this._preventSubmitOnSearchClear = (ev) => {
             const $searchClear = this.querySelector(search_constants.SEARCH_COMPONENT_NAMES.clearButton);
@@ -293,55 +302,11 @@ exports.HSearch = class HSearch extends phoenix_light_lit_element.PhoenixLightLi
                 (_a = this._openSearchButtonLabelRef.value) === null || _a === void 0 ? void 0 : _a.setAttribute('aria-labelledby', this._openSearchButtonAriaLabelId);
             }
         };
-        this._renderSearch = () => {
-            return lit.html `
-            ${when.when(this._isSuggesterLayerVisible(), () => lit.html `
-                    <div
-                        class="${search_constants.SEARCH_CLASS_NAMES.container}"
-                        id="${this._searchContentContainerId}"
-                        role="${this._containerRole}"
-                    >
-                        ${when.when(this._shouldShowMessage, () => lit.html `<h-search-message
-                                ${ref_js.ref(this._searchMessageRef)}
-                                .history="${this._historyLimitedContent}"
-                                .results="${this._searchResults}"
-                                .translations="${this._translations}"
-                                search-phrase="${this._searchPhrase}"
-                                module-instance-id="${this.moduleInstanceId}"
-                            ></h-search-message>`)}
-                        ${when.when(this._shouldShowHistory, () => lit.html `<h-search-history
-                                    ${ref_js.ref(this._searchHistoryRef)}
-                                    .history="${this._historyLimitedContent}"
-                                    .translations="${this._translations}"
-                                    active-item-id="${this._activeItemId}"
-                                    search-id="${this._id}"
-                                    module-instance-id="${this.moduleInstanceId}"
-                                ></h-search-history>`)}
-                        ${when.when(this._shouldShowResults, () => lit.html `<h-search-results
-                                    ${ref_js.ref(this._searchResultsRef)}
-                                    .results="${this._searchResults}"
-                                    search-phrase="${this._searchPhrase}"
-                                    .settings="${this.settings}"
-                                    locale="${this.locale}"
-                                    view="${this.view}"
-                                    .translations="${this._translations}"
-                                    active-item-id="${this._activeItemId}"
-                                    search-id="${this._id}"
-                                    module-instance-id="${this.moduleInstanceId}"
-                                ></h-search-results>`)}
-                    </div>
-                `, () => lit.html `
-                <div
-                    class="${search_constants.SEARCH_CLASS_NAMES.container}"
-                    id="${this._searchContentContainerId}"
-                    role="${this._containerRole}"
-                    hidden
-                ></div>`)}
-        `;
-        };
     }
     async connectedCallback() {
         super.connectedCallback();
+        if (this.popup)
+            this._searchPopupController = new search_popup_controller.SearchPopupController(this);
         this._setupContext();
         try {
             this._searchContextConsumer = new context_consumer_controller.ContextConsumerController(this);
@@ -376,6 +341,11 @@ exports.HSearch = class HSearch extends phoenix_light_lit_element.PhoenixLightLi
         this._setupListeners();
         this._setupAriaAttributes();
     }
+    updated(_changedProperties) {
+        super.updated(_changedProperties);
+        this._shouldRenderAsPopup = this._searchPopupController.shouldRenderAsPopup;
+        this._isOpenedAsPopup = this._searchPopupController.isPopupOpened;
+    }
     disconnectedCallback() {
         var _a;
         super.disconnectedCallback();
@@ -423,8 +393,10 @@ exports.HSearch = class HSearch extends phoenix_light_lit_element.PhoenixLightLi
             searchBar === null || searchBar === void 0 ? void 0 : searchBar.classList.add(search_constants.SEARCH_CLASS_NAMES.outline);
             const shouldShowMessage = ((_b = ev.detail) === null || _b === void 0 ? void 0 : _b.searchPhrase) !== '';
             this._updateSearchView(((_c = ev.detail) === null || _c === void 0 ? void 0 : _c.searchPhrase) || '', shouldShowMessage, false);
-            document.addEventListener('keydown', this._bindKeys);
-            document.addEventListener('keyup', this._handleSearchTabNavigation);
+            if (!this._shouldRenderAsPopup) {
+                document.addEventListener('keydown', this._bindKeys);
+                document.addEventListener('keyup', this._handleSearchTabNavigation);
+            }
             document.addEventListener('keydown', this._preventScrollingOnSearchContentBrowsing);
             document.addEventListener('focusin', this._resetSearchOnFocusOutside);
         });
@@ -502,7 +474,7 @@ exports.HSearch = class HSearch extends phoenix_light_lit_element.PhoenixLightLi
         });
     }
     _handleToggleHistoryAndResults({ shouldShowHistory, shouldShowResults }) {
-        this._shouldShowHistory = shouldShowHistory;
+        this.shouldShowHistory = shouldShowHistory;
         this._shouldShowResults = shouldShowResults;
         this._toggleSearchInputAttributes(shouldShowHistory, shouldShowResults);
         this._toggleSearchContainerAttributes(shouldShowHistory, shouldShowResults);
@@ -554,14 +526,15 @@ exports.HSearch = class HSearch extends phoenix_light_lit_element.PhoenixLightLi
         this._setActiveItemId(`${this._id}-1`);
         const searchBar = this.querySelector(`.${search_constants.SEARCH_CLASS_NAMES.searchBar}`);
         searchBar === null || searchBar === void 0 ? void 0 : searchBar.classList.remove(search_constants.SEARCH_CLASS_NAMES.outline);
-        this._hideHistorySuggestionsAndResults();
+        if (!this._shouldRenderAsPopup)
+            this._hideHistorySuggestionsAndResults();
         this._removeSearchKeyboardNavigation();
     }
     _submitSearchPhrase(searchPhrase) {
         this._dispatchEventWithSearchPhrase(search_constants.SEARCH_CUSTOM_EVENT_NAMES.searchPhraseSubmitted, searchPhrase);
     }
     _isSuggesterLayerVisible() {
-        return this.settings.isSearchSuggestLayerEnabled && (this._shouldShowHistory || this._shouldShowResults || this._shouldShowMessage);
+        return this.settings.isSearchSuggestLayerEnabled && (this.shouldShowHistory || this._shouldShowResults || this._shouldShowMessage);
     }
     _handleOpenSearch() {
         this.classList.add(search_constants.SEARCH_CLASS_NAMES.mobileOpened);
@@ -579,39 +552,71 @@ exports.HSearch = class HSearch extends phoenix_light_lit_element.PhoenixLightLi
         this._handleOpenSearch();
     }
     render() {
+        super.render();
         return lit.html `
-            ${when.when(this.shouldRenderAsPopup, () => lit.html `<div`, () => lit.html `<h-sheet name="search-sheet"`)}
-                class="${search_constants.SEARCH_CLASS_NAMES.icon} labeled-icon"
-                tabindex="0"
-                @click=${this._handleOpenSearch}
-                @keyup=${this._handleOpenSearchWithKeyboard}
-            >
-                ${when.when(this._translations.openSearchButtonAriaLabel, () => lit.html `
-                        <span id="${this._openSearchButtonAriaLabelId}" class="sr-only">
-                            ${this._translations.openSearchButtonAriaLabel}
-                        </span>
-                    `)}
-                <h-icon icon-name="icon-search" size=${icon_constants.ICONS_SIZES.l}></h-icon>
-                <div ${ref_js.ref(this._openSearchButtonLabelRef)} class="labeled-icon__signature">
-                    ${this._translations.search}
-                </div>
-            ${when.when(this.shouldRenderAsPopup, () => lit.html `</div>`, () => lit.html `</h-sheet>`)}
+            ${when.when(this._shouldRenderAsPopup, () => lit.nothing, () => lit.html `
+                    <div
+                        class="${search_constants.SEARCH_CLASS_NAMES.icon} labeled-icon"
+                        tabindex="0"
+                        @click=${this._handleOpenSearch}
+                        @keyup=${this._handleOpenSearchWithKeyboard}
+                    >
+                        ${when.when(this._translations.openSearchButtonAriaLabel, () => lit.html `
+                                <span id="${this._openSearchButtonAriaLabelId}" class="sr-only">
+                                    ${this._translations.openSearchButtonAriaLabel}
+                                </span>
+                            `)}
+                        <h-icon icon-name="icon-search" size=${icon_constants.ICONS_SIZES.l}></h-icon>
+                        <div ${ref_js.ref(this._openSearchButtonLabelRef)} class="labeled-icon__signature">
+                            ${this._translations.search}
+                        </div>
+                    </div>
+                `)}
-            ${when.when(this.shouldRenderAsPopup, () => lit.html `<h-sheet id="search-sheet" hidden>
-                    <h-sheet-header>
-                        <h-sheet-close class="btn btn_icon">
-                            <span class="sr-only">To translate - Close window</span>
-                            <h-icon
-                                icon-name="icon-x"
-                                clickable=${true}
-                                size=${icon_constants.ICONS_SIZES.l}
-                                css-classes="${search_constants.SEARCH_CLASS_NAMES.historyRemoveIcon}"
-                                aria-hidden="true"
-                            ></h-icon>
-                        </h-sheet-close>
-                    </h-sheet-header>
-                    <h-sheet-body>${this._renderSearch}</h-sheet-body>
-                </h-sheet>`, this._renderSearch)}`;
+            ${when.when(this._isSuggesterLayerVisible(), () => lit.html `
+                    <div
+                        class="${search_constants.SEARCH_CLASS_NAMES.container}"
+                        id="${this._searchContentContainerId}"
+                        role="${this._containerRole}"
+                    >
+                        ${when.when(this._shouldShowMessage, () => lit.html `<h-search-message
+                                ${ref_js.ref(this._searchMessageRef)}
+                                .history="${this._historyLimitedContent}"
+                                .results="${this._searchResults}"
+                                .translations="${this._translations}"
+                                search-phrase="${this._searchPhrase}"
+                                module-instance-id="${this.moduleInstanceId}"
+                            ></h-search-message>`)}
+                        ${when.when(this.shouldShowHistory, () => lit.html `<h-search-history
+                                    ${ref_js.ref(this._searchHistoryRef)}
+                                    .history="${this._historyLimitedContent}"
+                                    .translations="${this._translations}"
+                                    active-item-id="${this._activeItemId}"
+                                    search-id="${this._id}"
+                                    module-instance-id="${this.moduleInstanceId}"
+                                ></h-search-history>`)}
+                        ${when.when(this._shouldShowResults, () => lit.html `<h-search-results
+                                    ${ref_js.ref(this._searchResultsRef)}
+                                    .results="${this._searchResults}"
+                                    search-phrase="${this._searchPhrase}"
+                                    .settings="${this.settings}"
+                                    locale="${this.locale}"
+                                    view="${this.view}"
+                                    .translations="${this._translations}"
+                                    active-item-id="${this._activeItemId}"
+                                    search-id="${this._id}"
+                                    module-instance-id="${this.moduleInstanceId}"
+                                ></h-search-results>`)}
+                    </div>
+                `, () => lit.html `
+                <div
+                    class="${search_constants.SEARCH_CLASS_NAMES.container}"
+                    id="${this._searchContentContainerId}"
+                    role="${this._containerRole}"
+                    hidden
+                ></div>`)}
+        `;
     }
 };
 tslib_es6.__decorate([
@@ -628,16 +633,24 @@ tslib_es6.__decorate([
 ], exports.HSearch.prototype, "locale", void 0);
 tslib_es6.__decorate([
     decorators.property({ type: Boolean, attribute: 'popup' }),
-    tslib_es6.__metadata("design:type", String)
-], exports.HSearch.prototype, "shouldRenderAsPopup", void 0);
+    tslib_es6.__metadata("design:type", Boolean)
+], exports.HSearch.prototype, "popup", void 0);
 tslib_es6.__decorate([
     decorators.property({ type: String, attribute: 'module-instance-id' }),
     tslib_es6.__metadata("design:type", String)
 ], exports.HSearch.prototype, "moduleInstanceId", void 0);
+tslib_es6.__decorate([
+    decorators.state(),
+    tslib_es6.__metadata("design:type", Object)
+], exports.HSearch.prototype, "_shouldRenderAsPopup", void 0);
+tslib_es6.__decorate([
+    decorators.state(),
+    tslib_es6.__metadata("design:type", Object)
+], exports.HSearch.prototype, "_isOpenedAsPopup", void 0);
 tslib_es6.__decorate([
     decorators.state(),
     tslib_es6.__metadata("design:type", Boolean)
-], exports.HSearch.prototype, "_shouldShowHistory", void 0);
+], exports.HSearch.prototype, "shouldShowHistory", void 0);
 tslib_es6.__decorate([
     decorators.state(),
     tslib_es6.__metadata("design:type", Boolean)

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

	@@ -1 +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;AACA;AACA,iBAAiB,wDAA4D;AAC7E,mBAAmB,wDAA4D;AAC/E;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
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;AACA;AACA,iBAAiB,wDAA4D;AAC7E,mBAAmB,wDAA4D;AAC/E;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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/sheet/sheet.js CHANGED Viewed

@@ -178,6 +178,8 @@ exports.HSheet = HSheet_1 = class HSheet extends phoenix_light_lit_element.Phoen
         });
     }
     async open() {
+        if (this.opened)
+            return;
         this._focusedToggler = document.activeElement;
         return new Promise((resolve) => {
             var _a;

package/build/cjs/packages/phoenix/src/components/sheet/sheet.js.map CHANGED Viewed

	@@ -1 +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;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
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;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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/controllers/search_popup_controller.d.ts ADDED Viewed

@@ -0,0 +1,16 @@
+import { ReactiveController, ReactiveControllerHost } from 'lit';
+import { HSearch } from '../search';
+export declare class SearchPopupController implements ReactiveController {
+    private _host;
+    shouldRenderAsPopup: boolean;
+    isPopupOpened: boolean;
+    constructor(host: ReactiveControllerHost & HSearch);
+    hostConnected(): void;
+    hostDisconnected(): void;
+    private _removeMobileOpened;
+    private _showPopup;
+    private _hidePopup;
+    private _updateShouldRenderAsPopup;
+    private _updateShouldRenderAsPopupValue;
+    private _updateIsPopupOpenedValue;
+}

package/build/esm/packages/phoenix/src/components/form/search/controllers/search_popup_controller.js ADDED Viewed

@@ -0,0 +1,57 @@
+import 'lit';
+import { BREAKPOINTS } from '../../../../global_constants.js';
+import { SHEET_EVENTS } from '../../../sheet/sheet_constants.js';
+class SearchPopupController {
+    constructor(host) {
+        this.shouldRenderAsPopup = false;
+        this.isPopupOpened = false;
+        this._removeMobileOpened = () => {
+            const $storefrontSearch = document.querySelector(`h-storefront-search[module-instance-id="${this._host.moduleInstanceId}"]`);
+            const $searchSheet = $storefrontSearch === null || $storefrontSearch === void 0 ? void 0 : $storefrontSearch.querySelector('h-sheet');
+            $searchSheet === null || $searchSheet === void 0 ? void 0 : $searchSheet.open();
+        };
+        this._showPopup = () => {
+            this._updateIsPopupOpenedValue(true);
+        };
+        this._hidePopup = () => {
+            this._updateIsPopupOpenedValue(false);
+            this._host.shouldShowHistory = false;
+        };
+        this._updateShouldRenderAsPopup = () => {
+            if (window.innerWidth < BREAKPOINTS.sm) {
+                this._updateShouldRenderAsPopupValue(false);
+            }
+            else {
+                this._updateShouldRenderAsPopupValue(true);
+            }
+        };
+        (this._host = host).addController(this);
+        if (window.innerWidth >= BREAKPOINTS.sm) {
+            this.shouldRenderAsPopup = true;
+        }
+    }
+    hostConnected() {
+        this._host.addEventListener('removeMobileOpened', this._removeMobileOpened);
+        document.addEventListener(SHEET_EVENTS.opened, this._showPopup);
+        document.addEventListener(SHEET_EVENTS.closed, this._hidePopup);
+        window.addEventListener('resize', this._updateShouldRenderAsPopup);
+    }
+    hostDisconnected() {
+        this._host.removeEventListener('removeMobileOpened', this._removeMobileOpened);
+        document.removeEventListener(SHEET_EVENTS.opened, this._showPopup);
+        document.removeEventListener(SHEET_EVENTS.closed, this._hidePopup);
+        window.removeEventListener('resize', this._updateShouldRenderAsPopup);
+    }
+    _updateShouldRenderAsPopupValue(newValue) {
+        this.shouldRenderAsPopup = newValue;
+        this._host.requestUpdate();
+    }
+    _updateIsPopupOpenedValue(newValue) {
+        this.isPopupOpened = newValue;
+        this._host.requestUpdate();
+    }
+}
+export { SearchPopupController };
+//# sourceMappingURL=search_popup_controller.js.map

package/build/esm/packages/phoenix/src/components/form/search/controllers/search_popup_controller.js.map ADDED Viewed

	@@ -0,0 +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;"}

package/build/esm/packages/phoenix/src/components/form/search/search.d.ts CHANGED Viewed

@@ -1,12 +1,14 @@
-import { TemplateResult } from 'lit';
+import { PropertyValues, TemplateResult } from 'lit';
 import { PhoenixLightLitElement } from "../../../core/phoenix_light_lit_element/phoenix_light_lit_element";
 import type { TSearchSettings } from "./search_types";
 export declare class HSearch extends PhoenixLightLitElement {
     settings: TSearchSettings;
     view: string;
     locale: string;
-    shouldRenderAsPopup: string;
+    popup: boolean;
     moduleInstanceId: string;
+    private _shouldRenderAsPopup;
+    private _isOpenedAsPopup;
     private _historyContextProvider;
     private _searchContextConsumer;
     private _searchContext$;
@@ -21,7 +23,8 @@ export declare class HSearch extends PhoenixLightLitElement {
     private _searchHistoryRef;
     private _searchMessageRef;
     private _openSearchButtonLabelRef;
-    private _shouldShowHistory;
+    private _searchPopupController;
+    shouldShowHistory: boolean;
     private _shouldShowResults;
     private _shouldShowMessage;
     private _searchResults;
@@ -33,6 +36,7 @@ export declare class HSearch extends PhoenixLightLitElement {
     private _translations;
     private _containerRole;
     connectedCallback(): Promise<void>;
+    updated(_changedProperties: PropertyValues): void;
     disconnectedCallback(): void;
     private _setupContext;
     private _setupInitialSearchPhrase;
@@ -77,6 +81,5 @@ export declare class HSearch extends PhoenixLightLitElement {
     private _setupAriaAttributes;
     private _handleOpenSearch;
     private _handleOpenSearchWithKeyboard;
-    private _renderSearch;
     protected render(): TemplateResult;
 }

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

@@ -1,5 +1,5 @@
 import { __decorate, __metadata } from '../../../../../../external/tslib/tslib.es6.js';
-import { html } from 'lit';
+import { html, nothing } from 'lit';
 import { property, state } from 'lit/decorators';
 import { UiDomUtils } from '@dreamcommerce/utilities';
 import { PhoenixLightLitElement } from '../../../core/phoenix_light_lit_element/phoenix_light_lit_element.js';
@@ -14,11 +14,14 @@ import { BREAKPOINTS } from '../../../global_constants.js';
 import v4 from '../../../../../../external/uuid/dist/esm-browser/v4.js';
 import { when as n } from '../../../../../../external/lit-html/directives/when.js';
 import { DEFAULT_VIEW, SEARCH_CLASS_NAMES, SEARCH_COMPONENT_NAMES, SEARCH_CONFIGURATION, SEARCH_CONTEXT_NAMES, SEARCH_CUSTOM_EVENT_NAMES } from './search_constants.js';
+import { SearchPopupController } from './controllers/search_popup_controller.js';
 let HSearch = class HSearch extends PhoenixLightLitElement {
     constructor() {
         super(...arguments);
         this.view = DEFAULT_VIEW;
+        this._shouldRenderAsPopup = false;
+        this._isOpenedAsPopup = false;
         this._id = v4();
         this._openSearchButtonAriaLabelId = `${this._id}-open-search-button-aria-label`;
         this._searchContentContainerId = v4();
@@ -26,7 +29,7 @@ let HSearch = class HSearch extends PhoenixLightLitElement {
         this._searchHistoryRef = createRef();
         this._searchMessageRef = createRef();
         this._openSearchButtonLabelRef = createRef();
-        this._shouldShowHistory = false;
+        this.shouldShowHistory = false;
         this._shouldShowResults = false;
         this._shouldShowMessage = false;
         this._searchHistory = [];
@@ -71,7 +74,7 @@ let HSearch = class HSearch extends PhoenixLightLitElement {
                     break;
                 case 'Escape':
                     ev.preventDefault();
-                    if (this._shouldShowHistory || this._shouldShowHistory || this._shouldShowResults) {
+                    if (this.shouldShowHistory || this.shouldShowHistory || this._shouldShowResults) {
                         this._inputField.focus();
                         this._shouldShowMessage = false;
                         this._hideHistorySuggestionsAndResults();
@@ -177,7 +180,7 @@ let HSearch = class HSearch extends PhoenixLightLitElement {
         this._handleBackwardListFocus = (ev) => {
             var _a, _b;
             const isFocusedOnSearchInput = document.activeElement === this._inputField;
-            const hasPopup = this._shouldShowHistory || this._shouldShowHistory || this._shouldShowResults;
+            const hasPopup = this.shouldShowHistory || this.shouldShowHistory || this._shouldShowResults;
             if (isFocusedOnSearchInput || !hasPopup)
                 return;
             ev.preventDefault();
@@ -264,9 +267,15 @@ let HSearch = class HSearch extends PhoenixLightLitElement {
         this._switchTypeOfSearchView = () => {
             if (!this._isSuggesterLayerVisible())
                 return;
-            window.innerWidth > BREAKPOINTS.sm
-                ? this.classList.remove(SEARCH_CLASS_NAMES.mobileOpened)
-                : this.classList.add(SEARCH_CLASS_NAMES.mobileOpened);
+            if (window.innerWidth > BREAKPOINTS.sm) {
+                const hasBeenOpened = this.classList.contains(SEARCH_CLASS_NAMES.mobileOpened);
+                this.classList.remove(SEARCH_CLASS_NAMES.mobileOpened);
+                if (hasBeenOpened)
+                    this.dispatchEvent(new CustomEvent('removeMobileOpened'));
+            }
+            else if (!this._shouldRenderAsPopup || this._isOpenedAsPopup) {
+                this.classList.add(SEARCH_CLASS_NAMES.mobileOpened);
+            }
         };
         this._preventSubmitOnSearchClear = (ev) => {
             const $searchClear = this.querySelector(SEARCH_COMPONENT_NAMES.clearButton);
@@ -289,55 +298,11 @@ let HSearch = class HSearch extends PhoenixLightLitElement {
                 (_a = this._openSearchButtonLabelRef.value) === null || _a === void 0 ? void 0 : _a.setAttribute('aria-labelledby', this._openSearchButtonAriaLabelId);
             }
         };
-        this._renderSearch = () => {
-            return html `
-            ${n(this._isSuggesterLayerVisible(), () => html `
-                    <div
-                        class="${SEARCH_CLASS_NAMES.container}"
-                        id="${this._searchContentContainerId}"
-                        role="${this._containerRole}"
-                    >
-                        ${n(this._shouldShowMessage, () => html `<h-search-message
-                                ${ref(this._searchMessageRef)}
-                                .history="${this._historyLimitedContent}"
-                                .results="${this._searchResults}"
-                                .translations="${this._translations}"
-                                search-phrase="${this._searchPhrase}"
-                                module-instance-id="${this.moduleInstanceId}"
-                            ></h-search-message>`)}
-                        ${n(this._shouldShowHistory, () => html `<h-search-history
-                                    ${ref(this._searchHistoryRef)}
-                                    .history="${this._historyLimitedContent}"
-                                    .translations="${this._translations}"
-                                    active-item-id="${this._activeItemId}"
-                                    search-id="${this._id}"
-                                    module-instance-id="${this.moduleInstanceId}"
-                                ></h-search-history>`)}
-                        ${n(this._shouldShowResults, () => html `<h-search-results
-                                    ${ref(this._searchResultsRef)}
-                                    .results="${this._searchResults}"
-                                    search-phrase="${this._searchPhrase}"
-                                    .settings="${this.settings}"
-                                    locale="${this.locale}"
-                                    view="${this.view}"
-                                    .translations="${this._translations}"
-                                    active-item-id="${this._activeItemId}"
-                                    search-id="${this._id}"
-                                    module-instance-id="${this.moduleInstanceId}"
-                                ></h-search-results>`)}
-                    </div>
-                `, () => html `
-                <div
-                    class="${SEARCH_CLASS_NAMES.container}"
-                    id="${this._searchContentContainerId}"
-                    role="${this._containerRole}"
-                    hidden
-                ></div>`)}
-        `;
-        };
     }
     async connectedCallback() {
         super.connectedCallback();
+        if (this.popup)
+            this._searchPopupController = new SearchPopupController(this);
         this._setupContext();
         try {
             this._searchContextConsumer = new ContextConsumerController(this);
@@ -372,6 +337,11 @@ let HSearch = class HSearch extends PhoenixLightLitElement {
         this._setupListeners();
         this._setupAriaAttributes();
     }
+    updated(_changedProperties) {
+        super.updated(_changedProperties);
+        this._shouldRenderAsPopup = this._searchPopupController.shouldRenderAsPopup;
+        this._isOpenedAsPopup = this._searchPopupController.isPopupOpened;
+    }
     disconnectedCallback() {
         var _a;
         super.disconnectedCallback();
@@ -419,8 +389,10 @@ let HSearch = class HSearch extends PhoenixLightLitElement {
             searchBar === null || searchBar === void 0 ? void 0 : searchBar.classList.add(SEARCH_CLASS_NAMES.outline);
             const shouldShowMessage = ((_b = ev.detail) === null || _b === void 0 ? void 0 : _b.searchPhrase) !== '';
             this._updateSearchView(((_c = ev.detail) === null || _c === void 0 ? void 0 : _c.searchPhrase) || '', shouldShowMessage, false);
-            document.addEventListener('keydown', this._bindKeys);
-            document.addEventListener('keyup', this._handleSearchTabNavigation);
+            if (!this._shouldRenderAsPopup) {
+                document.addEventListener('keydown', this._bindKeys);
+                document.addEventListener('keyup', this._handleSearchTabNavigation);
+            }
             document.addEventListener('keydown', this._preventScrollingOnSearchContentBrowsing);
             document.addEventListener('focusin', this._resetSearchOnFocusOutside);
         });
@@ -498,7 +470,7 @@ let HSearch = class HSearch extends PhoenixLightLitElement {
         });
     }
     _handleToggleHistoryAndResults({ shouldShowHistory, shouldShowResults }) {
-        this._shouldShowHistory = shouldShowHistory;
+        this.shouldShowHistory = shouldShowHistory;
         this._shouldShowResults = shouldShowResults;
         this._toggleSearchInputAttributes(shouldShowHistory, shouldShowResults);
         this._toggleSearchContainerAttributes(shouldShowHistory, shouldShowResults);
@@ -550,14 +522,15 @@ let HSearch = class HSearch extends PhoenixLightLitElement {
         this._setActiveItemId(`${this._id}-1`);
         const searchBar = this.querySelector(`.${SEARCH_CLASS_NAMES.searchBar}`);
         searchBar === null || searchBar === void 0 ? void 0 : searchBar.classList.remove(SEARCH_CLASS_NAMES.outline);
-        this._hideHistorySuggestionsAndResults();
+        if (!this._shouldRenderAsPopup)
+            this._hideHistorySuggestionsAndResults();
         this._removeSearchKeyboardNavigation();
     }
     _submitSearchPhrase(searchPhrase) {
         this._dispatchEventWithSearchPhrase(SEARCH_CUSTOM_EVENT_NAMES.searchPhraseSubmitted, searchPhrase);
     }
     _isSuggesterLayerVisible() {
-        return this.settings.isSearchSuggestLayerEnabled && (this._shouldShowHistory || this._shouldShowResults || this._shouldShowMessage);
+        return this.settings.isSearchSuggestLayerEnabled && (this.shouldShowHistory || this._shouldShowResults || this._shouldShowMessage);
     }
     _handleOpenSearch() {
         this.classList.add(SEARCH_CLASS_NAMES.mobileOpened);
@@ -575,39 +548,71 @@ let HSearch = class HSearch extends PhoenixLightLitElement {
         this._handleOpenSearch();
     }
     render() {
+        super.render();
         return html `
-            ${n(this.shouldRenderAsPopup, () => html `<div`, () => html `<h-sheet name="search-sheet"`)}
-                class="${SEARCH_CLASS_NAMES.icon} labeled-icon"
-                tabindex="0"
-                @click=${this._handleOpenSearch}
-                @keyup=${this._handleOpenSearchWithKeyboard}
-            >
-                ${n(this._translations.openSearchButtonAriaLabel, () => html `
-                        <span id="${this._openSearchButtonAriaLabelId}" class="sr-only">
-                            ${this._translations.openSearchButtonAriaLabel}
-                        </span>
-                    `)}
-                <h-icon icon-name="icon-search" size=${ICONS_SIZES.l}></h-icon>
-                <div ${ref(this._openSearchButtonLabelRef)} class="labeled-icon__signature">
-                    ${this._translations.search}
-                </div>
-            ${n(this.shouldRenderAsPopup, () => html `</div>`, () => html `</h-sheet>`)}
+            ${n(this._shouldRenderAsPopup, () => nothing, () => html `
+                    <div
+                        class="${SEARCH_CLASS_NAMES.icon} labeled-icon"
+                        tabindex="0"
+                        @click=${this._handleOpenSearch}
+                        @keyup=${this._handleOpenSearchWithKeyboard}
+                    >
+                        ${n(this._translations.openSearchButtonAriaLabel, () => html `
+                                <span id="${this._openSearchButtonAriaLabelId}" class="sr-only">
+                                    ${this._translations.openSearchButtonAriaLabel}
+                                </span>
+                            `)}
+                        <h-icon icon-name="icon-search" size=${ICONS_SIZES.l}></h-icon>
+                        <div ${ref(this._openSearchButtonLabelRef)} class="labeled-icon__signature">
+                            ${this._translations.search}
+                        </div>
+                    </div>
+                `)}
-            ${n(this.shouldRenderAsPopup, () => html `<h-sheet id="search-sheet" hidden>
-                    <h-sheet-header>
-                        <h-sheet-close class="btn btn_icon">
-                            <span class="sr-only">To translate - Close window</span>
-                            <h-icon
-                                icon-name="icon-x"
-                                clickable=${true}
-                                size=${ICONS_SIZES.l}
-                                css-classes="${SEARCH_CLASS_NAMES.historyRemoveIcon}"
-                                aria-hidden="true"
-                            ></h-icon>
-                        </h-sheet-close>
-                    </h-sheet-header>
-                    <h-sheet-body>${this._renderSearch}</h-sheet-body>
-                </h-sheet>`, this._renderSearch)}`;
+            ${n(this._isSuggesterLayerVisible(), () => html `
+                    <div
+                        class="${SEARCH_CLASS_NAMES.container}"
+                        id="${this._searchContentContainerId}"
+                        role="${this._containerRole}"
+                    >
+                        ${n(this._shouldShowMessage, () => html `<h-search-message
+                                ${ref(this._searchMessageRef)}
+                                .history="${this._historyLimitedContent}"
+                                .results="${this._searchResults}"
+                                .translations="${this._translations}"
+                                search-phrase="${this._searchPhrase}"
+                                module-instance-id="${this.moduleInstanceId}"
+                            ></h-search-message>`)}
+                        ${n(this.shouldShowHistory, () => html `<h-search-history
+                                    ${ref(this._searchHistoryRef)}
+                                    .history="${this._historyLimitedContent}"
+                                    .translations="${this._translations}"
+                                    active-item-id="${this._activeItemId}"
+                                    search-id="${this._id}"
+                                    module-instance-id="${this.moduleInstanceId}"
+                                ></h-search-history>`)}
+                        ${n(this._shouldShowResults, () => html `<h-search-results
+                                    ${ref(this._searchResultsRef)}
+                                    .results="${this._searchResults}"
+                                    search-phrase="${this._searchPhrase}"
+                                    .settings="${this.settings}"
+                                    locale="${this.locale}"
+                                    view="${this.view}"
+                                    .translations="${this._translations}"
+                                    active-item-id="${this._activeItemId}"
+                                    search-id="${this._id}"
+                                    module-instance-id="${this.moduleInstanceId}"
+                                ></h-search-results>`)}
+                    </div>
+                `, () => html `
+                <div
+                    class="${SEARCH_CLASS_NAMES.container}"
+                    id="${this._searchContentContainerId}"
+                    role="${this._containerRole}"
+                    hidden
+                ></div>`)}
+        `;
     }
 };
 __decorate([
@@ -624,16 +629,24 @@ __decorate([
 ], HSearch.prototype, "locale", void 0);
 __decorate([
     property({ type: Boolean, attribute: 'popup' }),
-    __metadata("design:type", String)
-], HSearch.prototype, "shouldRenderAsPopup", void 0);
+    __metadata("design:type", Boolean)
+], HSearch.prototype, "popup", void 0);
 __decorate([
     property({ type: String, attribute: 'module-instance-id' }),
     __metadata("design:type", String)
 ], HSearch.prototype, "moduleInstanceId", void 0);
+__decorate([
+    state(),
+    __metadata("design:type", Object)
+], HSearch.prototype, "_shouldRenderAsPopup", void 0);
+__decorate([
+    state(),
+    __metadata("design:type", Object)
+], HSearch.prototype, "_isOpenedAsPopup", void 0);
 __decorate([
     state(),
     __metadata("design:type", Boolean)
-], HSearch.prototype, "_shouldShowHistory", void 0);
+], HSearch.prototype, "shouldShowHistory", void 0);
 __decorate([
     state(),
     __metadata("design:type", Boolean)

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

	@@ -1 +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,eAAe,wDAA4D;AAC3E,0BAA0B,wDAA4D;AACtF;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
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,eAAe,wDAA4D;AAC3E,0BAA0B,wDAA4D;AACtF;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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/sheet/sheet.js CHANGED Viewed

@@ -174,6 +174,8 @@ let HSheet = HSheet_1 = class HSheet extends PhoenixLightLitElement {
         });
     }
     async open() {
+        if (this.opened)
+            return;
         this._focusedToggler = document.activeElement;
         return new Promise((resolve) => {
             var _a;

package/build/esm/packages/phoenix/src/components/sheet/sheet.js.map CHANGED Viewed

	@@ -1 +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;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
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;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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 CHANGED Viewed

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