@shoper/phoenix_design_system 1.5.2 → 1.5.4

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

@@ -0,0 +1,36 @@
+import { __decorate, __metadata } from '../../../../../../../../external/tslib/tslib.es6.js';
+import { property } from 'lit/decorators';
+import { PhoenixLightLitElement } from '../../../../../core/phoenix_light_lit_element/phoenix_light_lit_element.js';
+import { phoenixCustomElement } from '../../../../../core/decorators/phoenix_custom_element.js';
+import { BtnController } from '../../../../../controllers/btn_controller/btn_controller.js';
+import { SEARCH_CUSTOM_EVENT_NAMES, SEARCH_NATIVE_EVENT_NAMES, SEARCH_COMPONENT_NAMES } from '../../search_constants.js';
+
+let HSearchHistoryRemove = class HSearchHistoryRemove extends PhoenixLightLitElement {
+    constructor() {
+        super();
+        this._dispatchRemoveHistoryItemEvent = () => {
+            this.dispatchEvent(new CustomEvent(SEARCH_CUSTOM_EVENT_NAMES.removeHistoryItem, {
+                bubbles: true,
+                detail: {
+                    id: this.historyItemId
+                }
+            }));
+        };
+        this._btnController = new BtnController(this, this._dispatchRemoveHistoryItemEvent);
+    }
+    connectedCallback() {
+        super.connectedCallback();
+        this.addEventListener(SEARCH_NATIVE_EVENT_NAMES.click, this._dispatchRemoveHistoryItemEvent);
+    }
+};
+__decorate([
+    property({ type: String, attribute: 'item-id' }),
+    __metadata("design:type", String)
+], HSearchHistoryRemove.prototype, "historyItemId", void 0);
+HSearchHistoryRemove = __decorate([
+    phoenixCustomElement(SEARCH_COMPONENT_NAMES.historyRemoveButton),
+    __metadata("design:paramtypes", [])
+], HSearchHistoryRemove);
+
+export { HSearchHistoryRemove };
+//# sourceMappingURL=search_history_remove.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA,uCAAuC,qDAAyD;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;"}

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

@@ -0,0 +1,8 @@
+import { PhoenixLightLitElement } from "../../../../../core/phoenix_light_lit_element/phoenix_light_lit_element";
+export declare class HSearchHistorySelect extends PhoenixLightLitElement {
+    private _btnController;
+    historyItemLabel: string;
+    constructor();
+    connectedCallback(): void;
+    private _dispatchHistorySelectEvent;
+}

package/build/esm/packages/phoenix/src/components/form/search/{history/search_history_select_btn.js → subcomponents/history/search_history_select.js}

@@ -1,18 +1,18 @@
-import { __decorate, __metadata } from '../../../../../../../external/tslib/tslib.es6.js';
+import { __decorate, __metadata } from '../../../../../../../../external/tslib/tslib.es6.js';
 import { property } from 'lit/decorators';
-import { PhoenixLightLitElement } from '../../../../core/phoenix_light_lit_element/phoenix_light_lit_element.js';
-import { phoenixCustomElement } from '../../../../core/decorators/phoenix_custom_element.js';
-import { BtnController } from '../../../../controllers/btn_controller/btn_controller.js';
-import { SEARCH_CUSTOM_EVENT_NAMES, SEARCH_NATIVE_EVENT_NAMES, SEARCH_COMPONENT_NAMES } from '../search_constants.js';
+import { PhoenixLightLitElement } from '../../../../../core/phoenix_light_lit_element/phoenix_light_lit_element.js';
+import { phoenixCustomElement } from '../../../../../core/decorators/phoenix_custom_element.js';
+import { BtnController } from '../../../../../controllers/btn_controller/btn_controller.js';
+import { SEARCH_CUSTOM_EVENT_NAMES, SEARCH_NATIVE_EVENT_NAMES, SEARCH_COMPONENT_NAMES } from '../../search_constants.js';
 
-let HSearchHistorySelectBtn = class HSearchHistorySelectBtn extends PhoenixLightLitElement {
+let HSearchHistorySelect = class HSearchHistorySelect extends PhoenixLightLitElement {
     constructor() {
         super();
         this._dispatchHistorySelectEvent = () => {
             this.dispatchEvent(new CustomEvent(SEARCH_CUSTOM_EVENT_NAMES.searchPhraseSubmitted, {
                 bubbles: true,
                 detail: {
-                    searchPhrase: this.historyLabel
+                    searchPhrase: this.historyItemLabel
                 }
             }));
         };
@@ -26,11 +26,11 @@ let HSearchHistorySelectBtn = class HSearchHistorySelectBtn extends PhoenixLight
 __decorate([
     property({ type: String, attribute: 'item-label' }),
     __metadata("design:type", String)
-], HSearchHistorySelectBtn.prototype, "historyLabel", void 0);
-HSearchHistorySelectBtn = __decorate([
+], HSearchHistorySelect.prototype, "historyItemLabel", void 0);
+HSearchHistorySelect = __decorate([
     phoenixCustomElement(SEARCH_COMPONENT_NAMES.historySelectButton),
     __metadata("design:paramtypes", [])
-], HSearchHistorySelectBtn);
+], HSearchHistorySelect);
 
-export { HSearchHistorySelectBtn };
-//# sourceMappingURL=search_history_select_btn.js.map
+export { HSearchHistorySelect };
+//# sourceMappingURL=search_history_select.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA,uCAAuC,qDAAyD;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;"}

package/build/esm/packages/phoenix/src/components/form/search/{search_input.d.ts → subcomponents/input/search_input.d.ts}

@@ -1,9 +1,11 @@
-import { PhoenixLightLitElement } from "../../../core/phoenix_light_lit_element/phoenix_light_lit_element";
+import { PhoenixLightLitElement } from "../../../../../core/phoenix_light_lit_element/phoenix_light_lit_element";
 export declare class HSearchInput extends PhoenixLightLitElement {
     private _searchContextConsumer;
     private _searchContext$;
     private _searchContextObserver;
     private _input;
     connectedCallback(): void;
-    private _searchContextSetup;
+    private _setupSearchContext;
+    private _setupListeners;
+    private _dispatchCustomEvent;
 }

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

@@ -0,0 +1,65 @@
+import { __decorate } from '../../../../../../../../external/tslib/tslib.es6.js';
+import { PhoenixLightLitElement } from '../../../../../core/phoenix_light_lit_element/phoenix_light_lit_element.js';
+import { phoenixCustomElement } from '../../../../../core/decorators/phoenix_custom_element.js';
+import { Observer } from '../../../../../core/classes/observer/observer.js';
+import { ContextConsumerController } from '../../../../../core/context/context_consumer_controller.js';
+import { SEARCH_CONTEXT_NAMES, SEARCH_CUSTOM_EVENT_NAMES, SEARCH_COMPONENT_NAMES } from '../../search_constants.js';
+
+let HSearchInput = class HSearchInput extends PhoenixLightLitElement {
+    connectedCallback() {
+        super.connectedCallback();
+        this._input = this.querySelector('input[type="search"]');
+        if (!this._input) {
+            throw new Error('Search input not found');
+        }
+        this._setupSearchContext();
+        this._setupListeners();
+    }
+    async _setupSearchContext() {
+        try {
+            this._searchContextConsumer = new ContextConsumerController(this);
+            this._searchContext$ = await this._searchContextConsumer.consumeAsync(SEARCH_CONTEXT_NAMES.searchContext);
+            this._searchContextObserver = new Observer((searchData) => {
+                if (searchData.searchPhrase === '') {
+                    this._input.value = '';
+                }
+            });
+            this._searchContext$.subscribe(this._searchContextObserver);
+        }
+        catch (_a) {
+            console.error('Search context is not provided');
+        }
+    }
+    _setupListeners() {
+        this._input.addEventListener('focusin', (ev) => {
+            this._dispatchCustomEvent(SEARCH_CUSTOM_EVENT_NAMES.focusinInput, ev.target.value);
+        });
+        this._input.addEventListener('keyup', (ev) => {
+            if (ev.key !== 'Enter') {
+                this._dispatchCustomEvent(SEARCH_CUSTOM_EVENT_NAMES.keyupInput, ev.target.value);
+                return;
+            }
+            this._dispatchCustomEvent(SEARCH_CUSTOM_EVENT_NAMES.submit, ev.target.value);
+        });
+        this._input.addEventListener('search', (ev) => {
+            if (this._input.value !== '') {
+                return;
+            }
+            this._dispatchCustomEvent(SEARCH_CUSTOM_EVENT_NAMES.searchInput, ev.target.value);
+        });
+    }
+    _dispatchCustomEvent(eventName, searchPhrase) {
+        this.dispatchEvent(new CustomEvent(eventName, {
+            bubbles: true,
+            detail: {
+                searchPhrase
+            }
+        }));
+    }
+};
+HSearchInput = __decorate([
+    phoenixCustomElement(SEARCH_COMPONENT_NAMES.searchInput)
+], HSearchInput);
+
+export { HSearchInput };
+//# sourceMappingURL=search_input.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA,2BAA2B,qDAAyD;AACpF;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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/message/search_message.d.ts

@@ -0,0 +1,14 @@
+import { TemplateResult } from 'lit';
+import { PhoenixLightLitElement } from "../../../../../core/phoenix_light_lit_element/phoenix_light_lit_element";
+import type { TSearchHistoryItem, TSearchResults } from "../../search_types";
+export declare class HSearchMessage extends PhoenixLightLitElement {
+    searchPhrase: string;
+    results: TSearchResults;
+    history: TSearchHistoryItem[];
+    translations: Record<string, string>;
+    private _createEmptyResults;
+    private _isNoResultsForSearchPhrase;
+    private _hasHistoryAndEmptyPhrase;
+    private _hasNoHistoryAndEmptyPhrase;
+    protected render(): TemplateResult;
+}

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

@@ -0,0 +1,60 @@
+import { __decorate, __metadata } from '../../../../../../../../external/tslib/tslib.es6.js';
+import { html } from 'lit';
+import { property } from 'lit/decorators';
+import { PhoenixLightLitElement } from '../../../../../core/phoenix_light_lit_element/phoenix_light_lit_element.js';
+import { phoenixCustomElement } from '../../../../../core/decorators/phoenix_custom_element.js';
+import { SEARCH_COMPONENT_NAMES } from '../../search_constants.js';
+import { when } from 'lit/directives/when';
+import isEqual_1 from '../../../../../../../../external/lodash/isEqual.js';
+
+let HSearchMessage = class HSearchMessage extends PhoenixLightLitElement {
+    constructor() {
+        super(...arguments);
+        this.searchPhrase = '';
+        this.history = [];
+        this.translations = {};
+    }
+    _createEmptyResults() {
+        return {
+            suggestions: [],
+            products: [],
+            producers: [],
+            categories: []
+        };
+    }
+    _isNoResultsForSearchPhrase() {
+        return this.searchPhrase && isEqual_1(this.results, this._createEmptyResults());
+    }
+    _hasHistoryAndEmptyPhrase() {
+        return this.searchPhrase === '' && this.history.length > 0;
+    }
+    _hasNoHistoryAndEmptyPhrase() {
+        return this.searchPhrase === '' && this.history.length === 0;
+    }
+    render() {
+        return html ` ${when(this._isNoResultsForSearchPhrase(), () => html `<div>${this.translations.searchInStore}</div>`, () => html `${when(this._hasHistoryAndEmptyPhrase(), () => html `<div>${this.translations.enterSearchPraseOrChooseFromHistory}</div>`)}
+                ${when(this._hasNoHistoryAndEmptyPhrase(), () => html `<div>${this.translations.enterSearchPrase}</div>`)} `)}`;
+    }
+};
+__decorate([
+    property({ type: String, attribute: 'search-phrase' }),
+    __metadata("design:type", Object)
+], HSearchMessage.prototype, "searchPhrase", void 0);
+__decorate([
+    property({ type: Object, attribute: 'result-data' }),
+    __metadata("design:type", Object)
+], HSearchMessage.prototype, "results", void 0);
+__decorate([
+    property({ type: Array }),
+    __metadata("design:type", Array)
+], HSearchMessage.prototype, "history", void 0);
+__decorate([
+    property({ type: Object }),
+    __metadata("design:type", Object)
+], HSearchMessage.prototype, "translations", void 0);
+HSearchMessage = __decorate([
+    phoenixCustomElement(SEARCH_COMPONENT_NAMES.searchMessage)
+], HSearchMessage);
+
+export { HSearchMessage };
+//# sourceMappingURL=search_message.js.map

package/build/esm/packages/phoenix/src/components/form/search/subcomponents/message/search_message.js.map

@@ -0,0 +1 @@
+{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA,uCAAuC,qDAAyD;AAChG;AACA;AACA;AACA;AACA;AACA;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;"}

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

@@ -0,0 +1,8 @@
+import { TemplateResult } from 'lit';
+import { PhoenixLightLitElement } from "../../../../../core/phoenix_light_lit_element/phoenix_light_lit_element";
+import { TProducer } from "../../search_types";
+export declare class HSearchProducerContent extends PhoenixLightLitElement {
+    producers: TProducer[];
+    translations: Record<string, string>;
+    protected render(): TemplateResult;
+}

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

@@ -0,0 +1,50 @@
+import { __decorate, __metadata } from '../../../../../../../../external/tslib/tslib.es6.js';
+import { html } from 'lit';
+import { property } from 'lit/decorators';
+import { PhoenixLightLitElement } from '../../../../../core/phoenix_light_lit_element/phoenix_light_lit_element.js';
+import { phoenixCustomElement } from '../../../../../core/decorators/phoenix_custom_element.js';
+import { when as n } from '../../../../../../../../external/lit/external/lit-html/directives/when.js';
+import { SEARCH_COMPONENT_NAMES } from '../../search_constants.js';
+import { repeat as c } from '../../../../../../../../external/lit/external/lit-html/directives/repeat.js';
+
+let HSearchProducerContent = class HSearchProducerContent extends PhoenixLightLitElement {
+    constructor() {
+        super(...arguments);
+        this.translations = {};
+    }
+    render() {
+        var _a;
+        return html `${n((_a = this.producers) === null || _a === void 0 ? void 0 : _a.length, () => html `<div class="search__section">
+                <h3 class="search__section-head search__section-head_sticky search__section-head_line">${this.translations.producers}</h3>
+                <ul class="search__list">
+                    ${c(this.producers, (producer) => html `<li class="search__list-item">
+                            <a href="${producer.url}" class="search__result-link">
+                                <div class="search__result-icon none">${producer.img}</div>
+                                <div class="search__result-content">
+                                    <div class="search__result-note"></div>
+                                    <div class="search__result-title">
+                                        <h5 class="search__result-title-item search__result_bold">
+                                            <span class="search__result_match">${producer.name}</span>
+                                        </h5>
+                                    </div>
+                                    <div class="search__result-note"></div></div
+                            ></a>
+                        </li>`)}
+                </ul>
+            </div>`)}`;
+    }
+};
+__decorate([
+    property({ type: Object, reflect: true }),
+    __metadata("design:type", Array)
+], HSearchProducerContent.prototype, "producers", void 0);
+__decorate([
+    property({ type: Object }),
+    __metadata("design:type", Object)
+], HSearchProducerContent.prototype, "translations", void 0);
+HSearchProducerContent = __decorate([
+    phoenixCustomElement(SEARCH_COMPONENT_NAMES.searchProducerContent)
+], HSearchProducerContent);
+
+export { HSearchProducerContent };
+//# sourceMappingURL=search_producer_content.js.map

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

@@ -1 +1 @@
-{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA,uCAAuC,kDAAsD;AAC7F;AACA;AACA;AACA;AACA;AACA,0BAA0B,wEAAgF;AAC1G,4BAA4B,0EAAkF;AAC9G;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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;"}

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

@@ -0,0 +1,9 @@
+import { TemplateResult } from 'lit';
+import { PhoenixLightLitElement } from "../../../../../core/phoenix_light_lit_element/phoenix_light_lit_element";
+import { TProduct } from "../../search_types";
+export declare class HSearchProductContent extends PhoenixLightLitElement {
+    products: TProduct[];
+    translations: Record<string, string>;
+    handleGoToProductsFor(ev: Event): void;
+    protected render(): TemplateResult;
+}

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

@@ -0,0 +1,67 @@
+import { __decorate, __metadata } from '../../../../../../../../external/tslib/tslib.es6.js';
+import { html } from 'lit';
+import { property } from 'lit/decorators';
+import { PhoenixLightLitElement } from '../../../../../core/phoenix_light_lit_element/phoenix_light_lit_element.js';
+import { phoenixCustomElement } from '../../../../../core/decorators/phoenix_custom_element.js';
+import { when as n } from '../../../../../../../../external/lit/external/lit-html/directives/when.js';
+import { SEARCH_CUSTOM_EVENT_NAMES, SEARCH_COMPONENT_NAMES } from '../../search_constants.js';
+import { repeat as c } from '../../../../../../../../external/lit/external/lit-html/directives/repeat.js';
+
+let HSearchProductContent = class HSearchProductContent extends PhoenixLightLitElement {
+    constructor() {
+        super(...arguments);
+        this.translations = {};
+    }
+    handleGoToProductsFor(ev) {
+        this.dispatchEvent(new CustomEvent(SEARCH_CUSTOM_EVENT_NAMES.searchPhraseSubmitted, {
+            bubbles: true,
+            detail: {
+                searchPhrase: ev.target.textContent
+            }
+        }));
+    }
+    render() {
+        var _a;
+        return n((_a = this.products) === null || _a === void 0 ? void 0 : _a.length, () => html `<div class="search__section">
+                <h3 class="search__section-head search__section-head_sticky search__section-head_line">${this.translations.products}</h3>
+
+                <ul>
+                    ${c(this.products, (product) => html `<li class="search__list-item">
+                            <a href="${product.url}" class="search__result-link"
+                                ><div class="search__result-icon">
+                                    <img src="${product.img}" alt="product image" />
+                                </div>
+                                <div class="search__result-content">
+                                    <div class="search__result-title">
+                                        <h5 class="search__result-title-item">${product.name}</h5>
+                                    </div>
+                                    <div class="search__result-note">
+                                        <span class="search__result-note-item search__result-item_active">${product.price}</span>
+                                    </div>
+                                </div></a
+                            >
+                        </li>`)}
+                </ul>
+
+                <div class="search__section-footer">
+                    <button @click="${this.handleGoToProductsFor}" class="search__section-btn-load-more" type="button">
+                        ${this.translations.goToProductsGor} teraz
+                    </button>
+                </div>
+            </div>`);
+    }
+};
+__decorate([
+    property({ type: Object, reflect: true }),
+    __metadata("design:type", Array)
+], HSearchProductContent.prototype, "products", void 0);
+__decorate([
+    property({ type: Object }),
+    __metadata("design:type", Object)
+], HSearchProductContent.prototype, "translations", void 0);
+HSearchProductContent = __decorate([
+    phoenixCustomElement(SEARCH_COMPONENT_NAMES.searchProductContent)
+], HSearchProductContent);
+
+export { HSearchProductContent };
+//# sourceMappingURL=search_product_content.js.map

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

@@ -1 +1 @@
-{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA,uCAAuC,kDAAsD;AAC7F;AACA;AACA;AACA;AACA;AACA,0BAA0B,wEAAgF;AAC1G,4BAA4B,0EAAkF;AAC9G;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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;"}

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

@@ -0,0 +1,9 @@
+import { TemplateResult } from 'lit';
+import { PhoenixLightLitElement } from "../../../../../core/phoenix_light_lit_element/phoenix_light_lit_element";
+import type { TSearchResults } from "../../search_types";
+export declare class HSearchResults extends PhoenixLightLitElement {
+    results: TSearchResults;
+    translations: Record<string, string>;
+    private _areSearchResultsEmpty;
+    protected render(): TemplateResult;
+}

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

@@ -0,0 +1,61 @@
+import { __decorate, __metadata } from '../../../../../../../../external/tslib/tslib.es6.js';
+import { html } from 'lit';
+import { property } from 'lit/decorators';
+import { PhoenixLightLitElement } from '../../../../../core/phoenix_light_lit_element/phoenix_light_lit_element.js';
+import { phoenixCustomElement } from '../../../../../core/decorators/phoenix_custom_element.js';
+import { EMPTY_SEARCH_RESULTS, SEARCH_CLASS_NAMES, SEARCH_PORTAL_DESTINATIONS, SEARCH_COMPONENT_NAMES } from '../../search_constants.js';
+import { when } from 'lit/directives/when';
+
+let HSearchResults = class HSearchResults extends PhoenixLightLitElement {
+    constructor() {
+        super(...arguments);
+        this.translations = {};
+    }
+    _areSearchResultsEmpty() {
+        return this.results !== EMPTY_SEARCH_RESULTS;
+    }
+    render() {
+        return when(this._areSearchResultsEmpty(), () => html `<div class="${SEARCH_CLASS_NAMES.resultsListContainer}">
+                <h-portal to="${SEARCH_PORTAL_DESTINATIONS.resultsContent}">
+                    <div>
+                        <h-search-suggestion-content
+                            .suggestions="${this.results.suggestions}"
+                            .categories="${this.results.categories}"
+                            .translations="${this.translations}"
+                        >
+                        </h-search-suggestion-content>
+
+                        <h-search-product-content
+                            .products="${this.results.products}"
+                            .translations="${this.translations}"
+                        ></h-search-product-content>
+
+                        <h-search-producer-content
+                            .producers="${this.results.producers}"
+                            .translations="${this.translations}"
+                        ></h-search-producer-content>
+                    </div>
+                </h-portal>
+
+                <h-portal-target
+                    name="${SEARCH_PORTAL_DESTINATIONS.resultsContent}"
+                    class="${SEARCH_CLASS_NAMES.resultsPortalContainer}"
+                    style="position: absolute; right: 0; bottom: 0"
+                ></h-portal-target>
+            </div> `);
+    }
+};
+__decorate([
+    property({ type: Object, attribute: 'result-data' }),
+    __metadata("design:type", Object)
+], HSearchResults.prototype, "results", void 0);
+__decorate([
+    property({ type: Object }),
+    __metadata("design:type", Object)
+], HSearchResults.prototype, "translations", void 0);
+HSearchResults = __decorate([
+    phoenixCustomElement(SEARCH_COMPONENT_NAMES.searchResults)
+], HSearchResults);
+
+export { HSearchResults };
+//# sourceMappingURL=search_results.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA,uCAAuC,qDAAyD;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;"}

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

@@ -0,0 +1,12 @@
+import { TemplateResult } from 'lit';
+import { PhoenixLightLitElement } from "../../../../../core/phoenix_light_lit_element/phoenix_light_lit_element";
+import { TCategory } from "../../search_types";
+export declare class HSearchSuggestionContent extends PhoenixLightLitElement {
+    suggestions: string[];
+    categories: TCategory[];
+    translations: Record<string, string>;
+    handleSuggestion(ev: Event): void;
+    getSuggestionListHtml: () => TemplateResult;
+    private _shouldShowSuggestionContent;
+    protected render(): TemplateResult;
+}

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

@@ -1,51 +1,52 @@
-import { __decorate, __metadata } from '../../../../../../../external/tslib/tslib.es6.js';
-import { html, nothing } from 'lit';
+import { __decorate, __metadata } from '../../../../../../../../external/tslib/tslib.es6.js';
+import { html } from 'lit';
 import { property } from 'lit/decorators';
-import { PhoenixLightLitElement } from '../../../../core/phoenix_light_lit_element/phoenix_light_lit_element.js';
-import { phoenixCustomElement } from '../../../../core/decorators/phoenix_custom_element.js';
-import { SEARCH_CUSTOM_EVENT_NAMES, SEARCH_COMPONENT_NAMES } from '../search_constants.js';
-import { when as n } from '../../../../../../../external/lit/external/lit-html/directives/when.js';
-import { repeat as c } from '../../../../../../../external/lit/external/lit-html/directives/repeat.js';
+import { PhoenixLightLitElement } from '../../../../../core/phoenix_light_lit_element/phoenix_light_lit_element.js';
+import { phoenixCustomElement } from '../../../../../core/decorators/phoenix_custom_element.js';
+import { when as n } from '../../../../../../../../external/lit/external/lit-html/directives/when.js';
+import { SEARCH_CUSTOM_EVENT_NAMES, SEARCH_COMPONENT_NAMES } from '../../search_constants.js';
+import { repeat as c } from '../../../../../../../../external/lit/external/lit-html/directives/repeat.js';
 
 let HSearchSuggestionContent = class HSearchSuggestionContent extends PhoenixLightLitElement {
     constructor() {
         super(...arguments);
         this.suggestions = [];
+        this.translations = {};
         this.getSuggestionListHtml = () => {
-            return html `<div class="search__section  none">
-            <h3 class="search__section-head search__section-head_sticky search__section-head_line">Sugestie</h3>
+            return html `<div class="search__section none">
+            <h3 class="search__section-head search__section-head_sticky search__section-head_line">${this.translations.suggestions}</h3>
             <ul class="search__list">
-                ${n(this.suggestions, () => html `${c(this.suggestions, (suggestion) => html `<li @click=${this.handleSuggestion} class="search__list-item">
+                ${n(this.suggestions, () => html `${c(this.suggestions, (suggestion) => html `<li @click=${this.handleSuggestion} class="search__list-item" data-suggested-value="${suggestion}">
                                     <span>${suggestion}</span>
                                     <span role="button" aria-label="copy suggestion" class="search__icon_main-color icon icon-arrow-skew"
                                         >LOOK</span
                                     >
-                                </li>`)}`, () => nothing)}
+                                </li>`)}`)}
                 ${n(this.categories, () => html `${c(this.categories, (category) => html `<li class="search__list-item search__result_bold">
                                     <a class="search__result-link" href="${category.url}"
                                         ><span class="search__result_bold"><span class="search__result_match">${category.name}</span></span>
-                                        <span class="search__result-category-title">kategoria</span></a
+                                        <span class="search__result-category-title">${this.translations.category}</span></a
                                     >
-                                </li>`)}`, () => nothing)}
+                                </li>`)}`)}
             </ul>
         </div>`;
         };
-        this.shouldShowSuggestionContent = () => (this.suggestions && this.suggestions.length !== 0) || (this.categories && this.categories.length !== 0);
+        this._shouldShowSuggestionContent = () => { var _a, _b; return ((_a = this.suggestions) === null || _a === void 0 ? void 0 : _a.length) || ((_b = this.categories) === null || _b === void 0 ? void 0 : _b.length); };
     }
     handleSuggestion(ev) {
         const element = ev.target;
         const listElement = element.closest('li');
-        if (listElement) {
-            this.dispatchEvent(new CustomEvent(SEARCH_CUSTOM_EVENT_NAMES.searchPhraseUpdated, {
-                bubbles: true,
-                detail: {
-                    searchPhrase: listElement.dataset.suggestedValue
-                }
-            }));
-        }
+        if (!listElement || !listElement.dataset.suggestedValue)
+            return;
+        this.dispatchEvent(new CustomEvent(SEARCH_CUSTOM_EVENT_NAMES.searchPhraseUpdated, {
+            bubbles: true,
+            detail: {
+                searchPhrase: listElement.dataset.suggestedValue
+            }
+        }));
     }
     render() {
-        return n(this.shouldShowSuggestionContent(), this.getSuggestionListHtml, () => nothing);
+        return n(this._shouldShowSuggestionContent(), this.getSuggestionListHtml);
     }
 };
 __decorate([
@@ -56,6 +57,10 @@ __decorate([
     property({ type: Object, reflect: true }),
     __metadata("design:type", Array)
 ], HSearchSuggestionContent.prototype, "categories", void 0);
+__decorate([
+    property({ type: Object }),
+    __metadata("design:type", Object)
+], HSearchSuggestionContent.prototype, "translations", void 0);
 HSearchSuggestionContent = __decorate([
     phoenixCustomElement(SEARCH_COMPONENT_NAMES.searchSuggestionContent)
 ], HSearchSuggestionContent);

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

@@ -1 +1 @@
-{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA,uCAAuC,kDAAsD;AAC7F;AACA;AACA;AACA;AACA;AACA,0BAA0B,wEAAgF;AAC1G,4BAA4B,0EAAkF;AAC9G;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;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;"}

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

@@ -7,6 +7,7 @@ import { property } from '@lit/reactive-element/decorators.js';
 import { SELECT_RELATED_COMPONENTS_NAMES, SELECT_INPUT_PLACEHOLDER_SLOT_NAME, SELECT_CLOSE_BTN_EVENT_NAMES, SELECT_CLOSE_BUTTON_CONTENT_SLOT_NAME } from './components/select_components_constatns.js';
 import { Observer } from '../../../core/classes/observer/observer.js';
 import { HIcon } from '../../icon/icon.js';
+import { HOption } from './components/option/select_option.js';
 import { SELECT_TYPES, SELECT_SLOT_NAMES, SELECT_CSS_CLASSES, SELECT_CONTEXTS, SELECT_EVENT_NAMES, MIN_NUMBER_OF_OPTIONS_TO_SHOW_SEARCH, SELECT_RESIZE_DEBOUNCE_TIME } from './select_constants.js';
 import { observe } from '../../../directives/observable_directive.js';
 import { HSelectToggler } from './components/toggler/select_toggler.js';
@@ -96,7 +97,11 @@ let HSelect = class HSelect extends PhoenixLightLitElement {
         this._handleResize = debounce_1(() => {
             this._closeSelect();
         }, SELECT_RESIZE_DEBOUNCE_TIME);
-        const $options = Array.from(this.querySelectorAll(SELECT_RELATED_COMPONENTS_NAMES.option));
+        const $options = this.hasSlot('content')
+            ? this.getSlot('content')
+                .map((litElement) => litElement.values[0])
+                .filter((element) => element instanceof HOption)
+            : Array.from(this.querySelectorAll(SELECT_RELATED_COMPONENTS_NAMES.option));
         $options.forEach(($option) => $option.setAttribute('slot', SELECT_SLOT_NAMES.content));
         this.$placeholder = (_a = this.querySelector(`[slot="${SELECT_INPUT_PLACEHOLDER_SLOT_NAME}"]`)) !== null && _a !== void 0 ? _a : 'Select';
         if (this.multiple)
@@ -177,6 +182,7 @@ let HSelect = class HSelect extends PhoenixLightLitElement {
         if (options.length)
             this._selectController.selectedOptions$.notify(options.filter((option) => option.selected));
         this._setupEvents();
+        this.assignSlots();
     }
     attributeChangedCallback(name, _old, value) {
         super.attributeChangedCallback(name, _old, value);