@salla.sa/twilight-components 2.14.471 → 2.14.472

package/dist/collection/components/salla-product-card-embed/salla-product-card-embed.js

@@ -79,7 +79,7 @@ export class SallaProductCardEmbed {
             's-product-card-embed-card-align-right': this.align === 'right',
             's-product-card-embed-card-align-center': this.align === 'center',
         };
-        return (h(Host, { key: 'a742a11dc2926fb941f44d1b3fd5cc3b4a207822' }, this.hasError && h("span", { key: 'c554a3b1971fa0b646611d24b7000bed921114d8', class: "s-product-card-embed-fallback" }), h("div", { key: 'cb0551a374e4ed68496bfa436adf6424febbd681', class: cardClasses, ref: (el) => {
+        return (h(Host, { key: '61c3e673a103e5d13217bac208611bf4978d20a4' }, this.hasError && h("span", { key: '8f013953f9eed502307823825e573281f481fd19', class: "s-product-card-embed-fallback" }), h("div", { key: '150d4080de0dbf21a2abaa00eca4c8ffae604546', class: cardClasses, ref: (el) => {
                 this.cardContainer = el;
             } })));
     }

package/dist/collection/components/salla-product-options/salla-product-options.js

@@ -39,6 +39,11 @@ export class SallaProductOptions {
          * The id of the product to which the options are going to be fetched for.
          */
         this.productId = salla.config.get('page.id');
+        /**
+         * Strip the wrapper's padding (keeps the background, rounded corners, margin).
+         * Used by callers that need the options to sit flush inside their own surface.
+         */
+        this.noPadding = false;
         this.handleDonationOptions = (event, detail, type, _option) => {
             // Donating-amount input only: onInput updates price and dispatches native change for form price watcher.
             if (detail === 'custom' && type === 'input') {
@@ -518,7 +523,7 @@ export class SallaProductOptions {
         if (this.optionsData?.length === 0) {
             return;
         }
-        return (h(Host, { class: "s-product-options-wrapper" }, h("salla-conditional-fields", null, this.optionsData.map((option) => h("div", { key: option.id, class: `s-product-options-option-container${option.visibility_condition || this.hideDigitalCardsOptions(option) ? ' hidden' : ''}`, "data-option-id": option.id, ...this.getOptionShownWhen(option) }, option.name === 'splitter' ?
+        return (h(Host, { class: { 's-product-options-wrapper': true, 's-product-options-no-padding': this.noPadding } }, h("salla-conditional-fields", null, this.optionsData.map((option) => h("div", { key: option.id, class: `s-product-options-option-container${option.visibility_condition || this.hideDigitalCardsOptions(option) ? ' hidden' : ''}`, "data-option-id": option.id, ...this.getOptionShownWhen(option) }, option.name === 'splitter' ?
             this.splitterOption()
             : h("div", { class: { "s-product-options-option": true, "s-product-options-option-booking": option.type === DisplayType.BOOKING && salla.url.is_page("cart") }, "data-option-type": option.type, "data-option-required": `${option.required}` }, h("label", { htmlFor: this.generateInputId(option.id), class: `s-product-options-option-label ${this.hideLabel(option) ? 's-product-options-option-label-hidden' : ''}` }, h("b", null, option.name, option.required && h("span", null, " * "), " "), h("small", null, option.placeholder)), h("div", { class: `s-product-options-option-content ${this.hideLabel(option) || (option.type === DisplayType.BOOKING && salla.url.is_page("cart")) ? 's-product-options-option-content-full-width' : ''}` }, this.getDisplayForType(option))))))));
     }
@@ -573,7 +578,9 @@ export class SallaProductOptions {
     }
     fillSelectedOptions() {
         this.selectedOptions = this.optionsData.reduce((acc, opt) => {
-            const selectedDetails = opt.details.filter(detail => detail.is_selected);
+            // `details` is optional on the Option interface — input-type options
+            // (text/number/date/file) carry no choice list, so guard before filtering.
+            const selectedDetails = (opt.details ?? []).filter(detail => detail.is_selected);
             const mappedDetails = selectedDetails.map(detail => ({
                 ...detail,
                 option_id: opt.id
@@ -581,6 +588,25 @@ export class SallaProductOptions {
             return acc.concat(mappedDetails);
         }, []);
     }
+    /**
+     * Seed `selectedOptions` from API defaults (`is_selected: true`).
+     * componentWillLoad does this only on the cart page; non-cart callers
+     * (e.g. order-options modal) call this after mount to avoid the first
+     * multi-select toggle wiping the pre-selected defaults.
+     * */
+    async seedSelectedOptions() {
+        this.fillSelectedOptions();
+        // A required multi-select renders every checkbox `required`; handleRequiredMultipleOptions
+        // clears that once one is checked, but it only fires on user `change`. After seeding a
+        // pre-selected default we run it for the initial DOM so a defaulted-but-untouched required
+        // multi-select doesn't fail validation and block checkout. Defer to rAF so the seeded
+        // `checked` state is painted before we count it (matches the change-handler pattern above).
+        requestAnimationFrame(() => {
+            this.optionsData
+                ?.filter(o => o.type === DisplayType.MULTIPLE_OPTIONS && o.required)
+                .forEach(o => this.handleRequiredMultipleOptions(o));
+        });
+    }
     async componentDidLoad() {
         if (!this.optionsData?.length) {
             return;
@@ -1019,6 +1045,26 @@ export class SallaProductOptions {
                 "getter": false,
                 "setter": false,
                 "reflect": false
+            },
+            "noPadding": {
+                "type": "boolean",
+                "attribute": "no-padding",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Strip the wrapper's padding (keeps the background, rounded corners, margin).\nUsed by callers that need the options to sit flush inside their own surface."
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "defaultValue": "false"
             }
         };
     }
@@ -1222,6 +1268,23 @@ export class SallaProductOptions {
                     "tags": []
                 }
             },
+            "seedSelectedOptions": {
+                "complexType": {
+                    "signature": "() => Promise<void>",
+                    "parameters": [],
+                    "references": {
+                        "Promise": {
+                            "location": "global",
+                            "id": "global::Promise"
+                        }
+                    },
+                    "return": "Promise<void>"
+                },
+                "docs": {
+                    "text": "Seed `selectedOptions` from API defaults (`is_selected: true`).\ncomponentWillLoad does this only on the cart page; non-cart callers\n(e.g. order-options modal) call this after mount to avoid the first\nmulti-select toggle wiping the pre-selected defaults.",
+                    "tags": []
+                }
+            },
             "enterCartMode": {
                 "complexType": {
                     "signature": "() => Promise<void>",

package/dist/collection/components/salla-product-size-guide/salla-product-size-guide.js

@@ -45,11 +45,11 @@ export class SallaProductSizeGuide {
         return h("salla-placeholder", { alignment: "center", iconSize: "xl" }, h("div", { slot: "title" }, this.placeholder_title), h("div", { slot: "description" }, this.placeholder_description));
     }
     render() {
-        return (h("salla-modal", { key: 'de368aff05a19d87eb4e99f4e1d7eee36155f435', class: "s-product-size-guide-wrapper", id: 'salla-product-size-guide-modal', isLoading: true, "has-skeleton": true, width: "md", ref: modal => this.modal = modal }, h("span", { key: 'c4ab31b3e6ef2751761ca2db27554f7f5bf057fc', slot: 'icon', class: "s-product-size-guide-header-icon", innerHTML: PencilRuler }), h("div", { key: '17cfceb5ccb0546928f87f956267e9d0c11017ac', slot: "loading" }, h("div", { key: '4f4e20a62396d7825315203ffd22a72030e821b1', class: "s-product-size-guide-skeleton" }, h("salla-skeleton", { key: 'd9132b26634ae1997dad9f1229b248c2cd76fff0', height: '15px', width: '25%' }), h("div", { key: '1b6a236851eef6e7caf7b7a0e84e591824b4e4ef', class: "s-product-size-guide-skeleton-header" }, h("salla-skeleton", { key: 'bae06741881b57b4eb853f1256a22f9393d9cea4', height: '40px' }), h("salla-skeleton", { key: 'fdeb75a853f89df154b69dbd48fc8e233561af59', height: '40px' }), h("salla-skeleton", { key: 'd0be70bc141f04fd24adc86c56eec3a5e896f2d4', height: '40px' }), h("salla-skeleton", { key: 'c5146addbf2d5b9bda05170a9743cad0e08d8674', height: '40px' })), h("div", { key: '04dbbffe2de708c984c5d0966aa2b86c0051bd14', class: "s-product-size-guide-skeleton-content" }, h("salla-skeleton", { key: '320fb33a2e5d9ee1f4b87c18b3f3dd13de180d4f', height: '15px', width: '25%' }), h("salla-skeleton", { key: 'f06aeac8e2f8ea86ec9b1c5c6f2b31172f23209f', height: '10px', width: '75%' }), h("salla-skeleton", { key: '1accf852a34edcac77a77151ebf67ba8e05cc729', height: '10px', width: '50%' }), h("salla-skeleton", { key: '42d4c3364779a6ee130339e37affe2e0c590e6a7', height: '10px', width: '75%' }), h("salla-skeleton", { key: '13064a231460414b4a0abd19dda41b01ac1ee04f', height: '10px', width: '100%' }), h("salla-skeleton", { key: 'd5a50f96ca3bab125503f836cd883cfb98ca135d', height: '10px', width: '25%' }), h("salla-skeleton", { key: '11cd2ed36d9754c32173f14cd7d5ea99fc2b5577', height: '10px', width: '60%' }), h("salla-skeleton", { key: 'a5b3a192d0e38dc13a025b8b8e0aba767f35611b', height: '10px', width: '45%' }), h("salla-skeleton", { key: 'dddcb26038e180fb5b686b29d286316d4314909f', height: '10px', width: '30%' })))), h("slot", { key: '43a08b9b6e64955b726b832f0849617ac31d4c25', name: "header" }), !this.hasError && !!this.guides ?
+        return (h("salla-modal", { key: '750cca54e5286fc1b77942cc4a9784970b8569ec', class: "s-product-size-guide-wrapper", id: 'salla-product-size-guide-modal', isLoading: true, "has-skeleton": true, width: "md", ref: modal => this.modal = modal }, h("span", { key: '0aecc3b447a0ef8f92183c1c785c2a8bbf139c17', slot: 'icon', class: "s-product-size-guide-header-icon", innerHTML: PencilRuler }), h("div", { key: '1720d30460d99d578365cae9d6a0e92790f834a2', slot: "loading" }, h("div", { key: '0bf85ba5de7db72b7e4f4d94e592dc951c1d3801', class: "s-product-size-guide-skeleton" }, h("salla-skeleton", { key: '3635e6c238400762f5c70266bb8359cf3c1c0527', height: '15px', width: '25%' }), h("div", { key: '0adfa776efbf9e7d988d08a3dce69900d6d3d737', class: "s-product-size-guide-skeleton-header" }, h("salla-skeleton", { key: '53799c8bd0f495ec723d0cf4be0ab0e978351c23', height: '40px' }), h("salla-skeleton", { key: 'a825da569d6453a5e3b6cac9cf5848f941af22ae', height: '40px' }), h("salla-skeleton", { key: 'd2091d09ca662aef1f2d6b3cddb4bf86ccc77c0f', height: '40px' }), h("salla-skeleton", { key: '5974a5b7227d03979ea5a65f2f1481f59ca6e0fe', height: '40px' })), h("div", { key: '6e12dc1b703488433f5e8047efe16d70ebaec8c3', class: "s-product-size-guide-skeleton-content" }, h("salla-skeleton", { key: '9d54f957ba7e4c78fff9ed693179d5f7faa55a25', height: '15px', width: '25%' }), h("salla-skeleton", { key: '946eedae2371d7df9d1b9cf8cf1b0f7800554eed', height: '10px', width: '75%' }), h("salla-skeleton", { key: '35d38d23f73bb4bbd4dc5372b70cd34f09cec2ea', height: '10px', width: '50%' }), h("salla-skeleton", { key: '8f13518e172127af747f50773f7a7f0d64d2c0ba', height: '10px', width: '75%' }), h("salla-skeleton", { key: '759708410b562babb733f401cdf8ee310761b110', height: '10px', width: '100%' }), h("salla-skeleton", { key: 'ad8d12dcefe5fbbd8dfa4060a028a3387186ffa1', height: '10px', width: '25%' }), h("salla-skeleton", { key: '63c5864943ec23a3a42761c90ca019acd7118f8c', height: '10px', width: '60%' }), h("salla-skeleton", { key: '490d6078c8d382740eb92c825a08e2aad203c4af', height: '10px', width: '45%' }), h("salla-skeleton", { key: '10b0d73e6a34990a2d23554faec6bce24dcc234e', height: '10px', width: '30%' })))), h("slot", { key: '3d0a3e42eba7cc521e8df1fbb2e7323962bff5a8', name: "header" }), !this.hasError && !!this.guides ?
             [
                 h("salla-tabs", null, this.guides.map((guide) => h("salla-tab-header", { slot: "header", name: guide.name }, h("span", null, guide.name))), this.guides.map((guide) => h("salla-tab-content", { slot: "content", name: guide.name }, h("div", { innerHTML: guide.description }))))
             ]
-            : this.showPlaceholder(), h("slot", { key: '5ae0956ca1f9313b5ef3d01dbdcab32f2e975e05', name: "footer" })));
+            : this.showPlaceholder(), h("slot", { key: 'd1fc7cdbbd52a1c3c2b08f45a647e7ea1586cc9d', name: "footer" })));
     }
     static get is() { return "salla-product-size-guide"; }
     static get originalStyleUrls() {

package/dist/collection/components/salla-quantity-input/salla-quantity-input.js

@@ -91,7 +91,7 @@ export class SallaQuantityInput {
         if (!inputAttributes['aria-label'] && !inputAttributes['aria-labelledby']) {
             inputAttributes['aria-label'] = salla.lang.getWithDefault('common.elements.quantity', 'Quantity');
         }
-        return (h(Host, { key: '4829904a6c2ed7710214caf1b2888e2a58b38eed', class: "s-quantity-input" }, h("div", { key: '8dd2592d3aed1dda990a9c818b78514540612a60', class: "s-quantity-input-container" }, h("button", { key: 'ea93501ee59066cbfb11ea8bf239073b33fa9eff', onClick: () => this.increase(), class: "s-quantity-input-increase-button s-quantity-input-button", type: "button", "aria-label": salla.lang.getWithDefault('common.elements.increase_quantity', 'Increase quantity') }, !this.hasIncrementSlot ? h("span", { innerHTML: Add }) : '', h("slot", { key: '61c70812d9cdb7c8c66b70d5c3a1f0522fccb542', name: "increment-button" })), h("input", { key: '02793b5365470afd59481ff987fe8d3da658bd48', class: "s-quantity-input-input", ...inputAttributes, ref: (el) => this.textInput = el, onInput: (event) => this.setValue(event.target.value), inputMode: "numeric", pattern: "[0-9]*", min: "1", readOnly: this.disableInput, value: this.quantity }), h("button", { key: '920f9020926a7d4cf77b2b971e35eb1586132c72', class: "s-quantity-input-decrease-button s-quantity-input-button", onClick: () => this.decrease(), type: "button", "aria-label": salla.lang.getWithDefault('common.elements.decrease_quantity', 'Decrease quantity') }, !this.hasDecrementSlot ? h("span", { innerHTML: Minus }) : '', h("slot", { key: '105487e60b1b5e7d0cf092f3b17fd085f61a8f1d', name: "decrement-button" })))));
+        return (h(Host, { key: 'ada66e864b927a5a1ec496c528b0f35121cb0e3e', class: "s-quantity-input" }, h("div", { key: '55601a364982154960a0513b507bfd7e349eea3f', class: "s-quantity-input-container" }, h("button", { key: 'e4f652ee5aa01e9be701f375c1d6c67821624b1d', onClick: () => this.increase(), class: "s-quantity-input-increase-button s-quantity-input-button", type: "button", "aria-label": salla.lang.getWithDefault('common.elements.increase_quantity', 'Increase quantity') }, !this.hasIncrementSlot ? h("span", { innerHTML: Add }) : '', h("slot", { key: '811f80ce4faa3ae783070ee18df09024dc157016', name: "increment-button" })), h("input", { key: '6f5db2fb1f02a7f3a80d9ac769608c0956942df1', class: "s-quantity-input-input", ...inputAttributes, ref: (el) => this.textInput = el, onInput: (event) => this.setValue(event.target.value), inputMode: "numeric", pattern: "[0-9]*", min: "1", readOnly: this.disableInput, value: this.quantity }), h("button", { key: '835ad4fc21b7926de520972fb0c550009b143c26', class: "s-quantity-input-decrease-button s-quantity-input-button", onClick: () => this.decrease(), type: "button", "aria-label": salla.lang.getWithDefault('common.elements.decrease_quantity', 'Decrease quantity') }, !this.hasDecrementSlot ? h("span", { innerHTML: Minus }) : '', h("slot", { key: 'c03fec4e1736df09bd555a04ded8941a50244eb2', name: "decrement-button" })))));
     }
     static get is() { return "salla-quantity-input"; }
     static get originalStyleUrls() {

package/dist/collection/components/salla-quick-buy/salla-quick-buy.js

@@ -3,6 +3,7 @@
  */
 import { Host, h } from "@stencil/core";
 import "@salla.sa/applepay/src/index";
+import { resolveApplePayOrderOptions, appendOrderOptionsToPayload, reportProductOptionsValiditySync, } from "../salla-order-options-modal/apple-pay-order-options";
 export class SallaQuickBuy {
     constructor() {
         /**
@@ -25,32 +26,82 @@ export class SallaQuickBuy {
          * @default {}
          */
         this.options = {};
+        /** Modal selections, merged into the quick-purchase payload. */
+        this.collectedOrderOptions = [];
+        /** Flips true after the first onStartedSession so the second dispatch begins. */
+        this.optionsResolved = false;
+        /** PDP price + selected order-option prices (from the modal). */
+        this.applePayAmount = 0;
+        /** Session from the initial gesture; begun later when there are no order options. */
+        this.pendingApplePaySession = null;
         this.quickBuy = salla.lang.get('pages.products.buy_now');
+        /** Apple Pay onStartedSession: first call defers begin() to run the OO check; second (resolved) begins. */
+        this.handleApplePaySessionStarted = (session) => {
+            // Order options disabled → let Apple Pay begin normally, as if the feature didn't exist.
+            if (!salla.config.get('store.settings.order_options.mandatory', false))
+                return false;
+            if (this.optionsResolved)
+                return false;
+            this.optionsResolved = true;
+            this.pendingApplePaySession = session;
+            resolveApplePayOrderOptions({
+                productId: this.productId,
+                amount: Number(this.amount),
+                quantity: this.getSelectedQuantity(),
+                beginPendingSession: () => {
+                    this.pendingApplePaySession?.begin();
+                    this.pendingApplePaySession = null;
+                },
+                discardPendingSession: () => { this.pendingApplePaySession = null; },
+                onSubmit: (selections, total) => {
+                    this.collectedOrderOptions = selections;
+                    this.applePayAmount = total;
+                    this.settlePayment();
+                },
+            });
+            return true;
+        };
         salla.lang.onLoaded(() => {
             this.quickBuy = salla.lang.get('pages.products.buy_now');
         });
     }
-    async quickBuyHandler() {
-        // user guest and guest-checkout not enabled
+    quickBuyHandler() {
         if (salla.config.isGuest() && !this.isGuestCheckout()) {
             this.requireLogin.emit({ productId: this.productId });
-            // todo (low) :: find a way to re-fire the method after success
-            let afterLoginEvent = "salla-quick-buy::user.logged-in";
-            salla.event.on(afterLoginEvent, () => this.settlePayment());
-            salla.api.auth.setAfterLoginEvent(afterLoginEvent);
-            return salla.auth.event.dispatch('login::open', { withoutReload: true });
+            salla.api.auth.requireLoginThen('salla-quick-buy::user.logged-in', () => this.quickBuyHandler());
+            return;
         }
-        await this.settlePayment();
+        // Sync validate — AP needs the gesture preserved for new ApplePaySession().
+        if (!this.validatePdpOptionsSync())
+            return;
+        this.optionsResolved = false;
+        this.collectedOrderOptions = [];
+        this.applePayAmount = 0;
+        this.settlePayment();
     }
-    async settlePayment() {
-        let optionsElement = document.querySelector(`salla-product-options[product-id="${this.productId}"]`);
-        //make sure all the required options are selected
-        if (optionsElement && !await optionsElement.reportValidity()) {
-            this.validationFailed.emit({ productId: this.productId });
-            return salla.error(salla.lang.get('common.messages.required_fields'));
+    /** Sync PDP-option validity (preserves the AP gesture); emits + notifies on failure. */
+    validatePdpOptionsSync() {
+        if (reportProductOptionsValiditySync(this.productId))
+            return true;
+        this.validationFailed.emit({ productId: this.productId });
+        salla.error(salla.lang.get('common.messages.required_fields'));
+        return false;
+    }
+    /** Read the live PDP quantity from the form so order-options match the real cart line. */
+    getSelectedQuantity() {
+        try {
+            const data = this.host.getElementSallaData?.();
+            const qty = Number(data instanceof FormData ? data.get('quantity') : data?.quantity);
+            return Number.isFinite(qty) && qty > 0 ? qty : 1;
+        }
+        catch {
+            return 1;
         }
+    }
+    async settlePayment() {
         //use this way to get quantity too
         let data = this.host.getElementSallaData();
+        appendOrderOptionsToPayload(data, this.collectedOrderOptions);
         // if the store doesn't have Apple Pay , just create a cart and then redirect to check out page
         if (!this.isApplePayActive) {
             // return salla.product.buyNow(this.productId, data);
@@ -68,13 +119,16 @@ export class SallaQuickBuy {
         }
         // noinspection TypeScriptValidateJSTypes
         salla.event.dispatch('payments::apple-pay.start-transaction', {
-            amount: this.amount, // 1000
+            // Prefer the modal's collected total (PDP price + selected OO additional_prices).
+            // Falls back to PDP live amount when no OO modal ran.
+            amount: this.applePayAmount > 0 ? this.applePayAmount : this.amount,
             currency: this.currency || 'SAR', // SAR
             requiredShippingContactFields: this.getRequiredShippingContactFields(),
             shippingMethods: this.isRequireShipping ? [] : undefined,
             supportedNetworks: salla.config.get('store.settings.buy_now.networks'),
             supportedCountries: salla.config.get('store.settings.buy_now.countries'),
             countryCode: salla.config.get('store.store_country') || 'SA',
+            onStartedSession: this.handleApplePaySessionStarted,
             validateMerchant: {
                 url: this.validateHost ? `${this.validateHost}/checkout/applepay/validate` : salla.url.get('checkout/applepay/validate'),
                 onSuccess: (response) => {
@@ -205,7 +259,7 @@ export class SallaQuickBuy {
         });
     }
     render() {
-        return h(Host, { key: '078fa17510403612cf8204899fee395f057b88bd' }, this.quickBuyButton());
+        return h(Host, { key: 'fb1bdf862d9b9cea58df14862f7ec9c4be388585' }, this.quickBuyButton());
     }
     quickBuyButton() {
         return h("apple-pay-button", { locale: salla?.config?.get?.('user.language_code') || 'ar', onClick: () => this.quickBuyHandler(), "data-quick-purchase": "applepay", class: "s-quick-buy-apple-pay", "data-is-applepay": "1", buttonstyle: "black", type: this.type });

package/dist/collection/components/salla-review-card/salla-review-card.js

@@ -158,7 +158,7 @@ export class SallaReviewCard {
         return (h("a", { href: this.review?.product?.url, class: "s-review-card-product-container" }, h("img", { alt: product.image?.alt || "Product", src: product.image?.url, class: "s-review-card-product-image", width: 60, height: 60, loading: "lazy", decoding: "async", draggable: false }), h("div", { class: "s-review-card-product-details" }, h("p", { class: "s-review-card-product-details-name" }, product.name), this.showPurchaseCount ? h("p", { class: "s-review-card-product-details-purchase-count" }, h("span", { innerHTML: IconFire2 }), this.purchasedCount) : null)));
     }
     render() {
-        return h("div", { key: '7e833e08405a9153759b958e9c6979fd83c5aec1', class: "s-review-card-container" }, this.renderSlider(), this.renderSingleImage(), renderDivider(), h("div", { key: '85e33a2160a62e2fb3e376f6e20d223d53ced8fe', class: "s-review-card-content" }, this.renderHeader(), h("p", { key: '8b21485de56e57dceb9facb044bd6bad1ad866f3', class: "s-review-card-review-content", innerHTML: this.review?.content }), renderDivider(), this.renderProductInfo()));
+        return h("div", { key: '0772f783fe893c4d03a6d698909a09ecedb69fa6', class: "s-review-card-container" }, this.renderSlider(), this.renderSingleImage(), renderDivider(), h("div", { key: '5780bb57a79c04cef6cede906ce086f6811dad3c', class: "s-review-card-content" }, this.renderHeader(), h("p", { key: '7889fe4dfaf52d2e54adb667f21fc2fced195dd6', class: "s-review-card-review-content", innerHTML: this.review?.content }), renderDivider(), this.renderProductInfo()));
     }
     static get is() { return "salla-review-card"; }
     static get originalStyleUrls() {

package/dist/collection/components/salla-reviews/salla-reviews.js

@@ -85,7 +85,7 @@ export class SallaReviews {
         });
     }
     render() {
-        return (h("div", { key: 'ab076b54664048719052cff15877bc5325c36393', class: "s-reviews-container" }, h("div", { key: 'da56343050cd2e9fe7ac7cf08b348b1d6c6af5c2', class: "s-reviews-header-wrapper" }, h("h1", { key: '64e0fb721d9c6e4763de4e116d43f3d4206452dc', class: "s-reviews-header" }, this.testimonialText), !!this.displayAllLink ? (h("a", { href: this.displayAllURL, class: "s-reviews-display-all" }, this.displayAllLinkText, h("span", { class: "s-reviews-display-all-icon", innerHTML: IconArrowLeft }))) : null), h("salla-slider", { key: 'c1ccfde9f4a4a617a0a6f12f841469f953114c4a', centered: true, "slides-per-view": 1, type: "testimonials", class: "s-reviews-testimonials-slider", "controls-outer": true, "auto-play": true, id: `testimonials-${this.source}-slider` }, h("div", { key: 'c3c7ca7d611b20618d336e16e57b20e479bbbbee', slot: "items" }, this.reviews.map((item, index) => (h("div", { key: index, class: "s-reviews-swiper-slide" }, h("div", { class: "s-reviews-testimonial" }, h("div", { class: "s-reviews-testimonial__inner" }, h("div", { class: "s-reviews-testimonial__avatar" }, h("img", { src: 'images/s-empty.png', "data-src": item.avatar, alt: item.name ? item.name : 'testimonial-' + index, class: "lazy" })), h("div", { class: "s-reviews-testimonial__text" }, h("p", { innerHTML: item.content }), h("div", { class: "s-reviews-testimonial__name_wrapper" }, h("div", { class: "s-reviews-testimonial__info" }, item.name && h("h2", null, `${item.name}`)), h("div", { class: "s-reviews-testimonial__rating" }, h("salla-rating-stars", { size: "small", value: item.stars })))), h("span", { class: "s-reviews-testimonial__icon", innerHTML: IconQuoteOpen }))))))))));
+        return (h("div", { key: '24e50ca2634208ad3ffcb9ca503aa7e18331b3a1', class: "s-reviews-container" }, h("div", { key: 'a1632306fc1a92051d030707aab075c825537e01', class: "s-reviews-header-wrapper" }, h("h1", { key: 'e2a4df75011da111e89c1b732e7741ddf452b9d5', class: "s-reviews-header" }, this.testimonialText), !!this.displayAllLink ? (h("a", { href: this.displayAllURL, class: "s-reviews-display-all" }, this.displayAllLinkText, h("span", { class: "s-reviews-display-all-icon", innerHTML: IconArrowLeft }))) : null), h("salla-slider", { key: '89009e55e3a5121c241295efd510405b623f45c3', centered: true, "slides-per-view": 1, type: "testimonials", class: "s-reviews-testimonials-slider", "controls-outer": true, "auto-play": true, id: `testimonials-${this.source}-slider` }, h("div", { key: '8b6b8df42043c8ecdb05dbbc30ecacde297f0dda', slot: "items" }, this.reviews.map((item, index) => (h("div", { key: index, class: "s-reviews-swiper-slide" }, h("div", { class: "s-reviews-testimonial" }, h("div", { class: "s-reviews-testimonial__inner" }, h("div", { class: "s-reviews-testimonial__avatar" }, h("img", { src: 'images/s-empty.png', "data-src": item.avatar, alt: item.name ? item.name : 'testimonial-' + index, class: "lazy" })), h("div", { class: "s-reviews-testimonial__text" }, h("p", { innerHTML: item.content }), h("div", { class: "s-reviews-testimonial__name_wrapper" }, h("div", { class: "s-reviews-testimonial__info" }, item.name && h("h2", null, `${item.name}`)), h("div", { class: "s-reviews-testimonial__rating" }, h("salla-rating-stars", { size: "small", value: item.stars })))), h("span", { class: "s-reviews-testimonial__icon", innerHTML: IconQuoteOpen }))))))))));
     }
     static get is() { return "salla-reviews"; }
     static get originalStyleUrls() {

package/dist/collection/components/salla-reviews-page/salla-reviews-page.js

@@ -142,7 +142,7 @@ export class SallaReviewsPage {
         return options.map(option => (h("option", { key: option.value, value: option.value, selected: option.value === this.sort }, option.label)));
     }
     render() {
-        return (h("host", { key: '1ca6e12aafb0b83953a887286003dce5f47c9374' }, h("div", { key: '9a353471f58a1fe67800f9d0ac38b3f94095b107', class: "s-reviews-page-header-wrapper" }, h("h2", { key: '0fc9c963af765108e42f341ac7d70c8758e4677a', class: "s-reviews-page-title" }, this.langTitlesReviews, h("span", { key: '13f2b001680a39440d3e5557bcfee46a92592ea4', class: "s-reviews-page-count" }, "(", this.langRatingReviews, ")")), h("div", { key: 'fcb5e88a598d342d4cdeff4cfba0a85ea94b911e', class: "s-reviews-page-filter-wrapper" }, h("label", { key: 'e2c23398b1024647c1cfdc283392b94e3ce0e44c', class: "s-reviews-page-filter-label", htmlFor: "testimonials-filter" }, this.langSorting), h("select", { key: '67f5f7748db13b7c6bdf3bbbb104d9f4b001df69', onChange: (e) => this.handleSorting(e), disabled: !this.reviews.length, class: "s-reviews-page-filter" }, this.renderSortingOptions()))), this.reviews.length ? h("main", { class: "s-reviews-page-grid", ref: el => {
+        return (h("host", { key: 'b82b491ae189f825367881b7b4f03ad64e471aae' }, h("div", { key: 'd124f10806cfabd1c1f85044786541011edff3ff', class: "s-reviews-page-header-wrapper" }, h("h2", { key: '30c58bb14bea27da968e874a0c1454a35e8db207', class: "s-reviews-page-title" }, this.langTitlesReviews, h("span", { key: '8850771469ae20d1b07efcb45be58738de377e6d', class: "s-reviews-page-count" }, "(", this.langRatingReviews, ")")), h("div", { key: '5a0060c5bdbfe4d37003b04d4c6368460be8cd38', class: "s-reviews-page-filter-wrapper" }, h("label", { key: '637d1aeec005ae662c6019c423ef3f1c3a6ff264', class: "s-reviews-page-filter-label", htmlFor: "testimonials-filter" }, this.langSorting), h("select", { key: '5b68b9441d4647f12583c71da61958c30c0dcda6', onChange: (e) => this.handleSorting(e), disabled: !this.reviews.length, class: "s-reviews-page-filter" }, this.renderSortingOptions()))), this.reviews.length ? h("main", { class: "s-reviews-page-grid", ref: el => {
                 this.wrapper = el;
             } }, this.reviews.map(review => (h("salla-review-card", { key: review.id, review: review }))))
             : h("div", { class: "s-products-list-placeholder" }, h("span", { innerHTML: ShoppingBag }), h("p", null, this.placeholderText)), this.pagination?.links?.next && this.reviews.length ? (h("div", { class: "s-reviews-page-load-more-container" }, h("salla-button", { class: "s-reviews-page-load-more-btn", loading: this.isLoading, onClick: () => this.infiniteScroll?.loadNextPage(), onKeyUp: () => this.infiniteScroll?.loadNextPage() }, this.langLoadMore))) : null));

package/dist/collection/components/salla-scopes/salla-scopes.js

@@ -146,7 +146,7 @@ export class SallaScopees {
         return salla.onReady();
     }
     render() {
-        return (h(Host, { key: 'bbf0b48e47cf334cc844cedc59ef5d430ce9cebe' }, h("salla-modal", { key: '20f8f0edb267c2a1e7cc23e930d06060916d5c64', ref: modal => this.modal = modal, isClosable: !!(this.isOpenedBefore || (this.selection == 'optional')), class: "s-scopes-modal", isLoading: this.loading, "has-skeleton": true }, this.loading ?
+        return (h(Host, { key: 'a7571c852749d4449b42e2c12d5597f6aded1f7f' }, h("salla-modal", { key: '48846fbac890e05c0deabe74138ad929a14796fb', ref: modal => this.modal = modal, isClosable: !!(this.isOpenedBefore || (this.selection == 'optional')), class: "s-scopes-modal", isLoading: this.loading, "has-skeleton": true }, this.loading ?
             h("div", { slot: "loading" }, h("div", { class: "s-scopes-skeleton" }, h("salla-list-tile", { class: "s-scopes-header" }, h("div", { slot: "icon", class: "s-scopes-header-icon" }, h("salla-skeleton", { type: "circle" })), h("div", { slot: "title", class: "s-scopes-header-title mb-5" }, h("salla-skeleton", { height: '15px', width: '50%' })), h("div", { slot: "subtitle", class: "s-scopes-header-subtitle" }, h("salla-skeleton", { height: '10px' }), h("salla-skeleton", { height: '10px', width: '75%' }))), h("div", { class: "s-scopes-skeleton-search" }, h("salla-skeleton", { height: '10px', width: '50%' }), h("salla-skeleton", { height: '30px', width: '100%' })), h("div", { class: "s-scopes-skeleton-scopes" }, h("salla-skeleton", { height: '10px', width: '30%' }), h("salla-skeleton", { height: '10px', width: '25%' }), h("salla-skeleton", { height: '10px', width: '30%' }), h("salla-skeleton", { height: '10px', width: '25%' }), h("salla-skeleton", { height: '10px', width: '30%' }), h("salla-skeleton", { height: '10px', width: '25%' }), h("salla-skeleton", { height: '10px', width: '30%' }), h("salla-skeleton", { height: '10px', width: '25%' })), h("div", { class: "s-scopes-skeleton-btn" }, h("salla-skeleton", { height: '40px', width: '100%' }))))
             :
                 [h("salla-list-tile", { class: this.originalScopesList?.length ? "s-scopes-header block" : "s-hidden" }, h("div", { slot: "icon", class: "s-scopes-header-icon", innerHTML: StoreAlt }), h("div", { slot: "title", class: "s-scopes-header-title" }, salla.lang.get('blocks.scope.you_are_browse_store_from')), h("div", { slot: "subtitle", class: "s-scopes-header-subtitle" }, !!this.selected_scope ? this.selected_scope.name : "")), h("div", { class: "s-scopes-wrap" }, !!this.originalScopesList?.length && h("h4", { class: "s-scopes-title" }, this.getFormTitle()), this.originalScopesList?.length > this.searchDisplayLimit ?

package/dist/collection/components/salla-search/salla-search.js

@@ -127,10 +127,10 @@ export class SallaSearch {
         this.inputValue.length < 3 ? this.container.classList.remove('s-search-no-results') : '';
     }
     render() {
-        const searchContent = (h("div", { key: '25c930505262a83f8a8385aa0ca665ecad2cacd1', class: { 's-search-container': true, 's-search-inline': this.inline }, ref: container => (this.container = container) }, h("div", { key: '09d705b9da70c128584891672ba84d660f3c6d6a', class: "s-search-input-wrapper" }, h("span", { key: '5749d0cf3ad58bf845ef116e4ee377c577a770e8', class: "s-search-icon-wrap" }, h("span", { key: 'b1acaab31a15f447fb3de27e34a0a0833620456e', class: "s-search-icon", innerHTML: this.loading ? '<i class="s-search-spinner-loader"/>' : Search })), h("input", { key: '14bbab4ab1e8be11f25e229fb8ea0e9c982f2df7', type: "search", enterkeyhint: "search", autocomplete: "off", class: "s-search-input", placeholder: salla.lang.get('blocks.header.search_placeholder'), onInput: (e) => this.limitWordsAndSearch(e), onKeyDown: e => this.handleKeyDown(e), ref: input => (this.searchInput = input), style: {
+        const searchContent = (h("div", { key: 'd7668846b013b4e8c9617193cd7457a585733960', class: { 's-search-container': true, 's-search-inline': this.inline }, ref: container => (this.container = container) }, h("div", { key: '7850ee638ab8dbe416be4fa7bd5601d821802776', class: "s-search-input-wrapper" }, h("span", { key: '09bfde1658f27487458076cb91954e530f91c8be', class: "s-search-icon-wrap" }, h("span", { key: '547eb4e1efba4bc1e46ce9a28816f4d39b26f638', class: "s-search-icon", innerHTML: this.loading ? '<i class="s-search-spinner-loader"/>' : Search })), h("input", { key: '2be7d24d980cbb37ee50c389ab03e8fa67eb3973', type: "search", enterkeyhint: "search", autocomplete: "off", class: "s-search-input", placeholder: salla.lang.get('blocks.header.search_placeholder'), onInput: (e) => this.limitWordsAndSearch(e), onKeyDown: e => this.handleKeyDown(e), ref: input => (this.searchInput = input), style: {
                 height: this.height + 'px',
                 borderRadius: this.oval ? this.height / 2 + 'px' : '',
-            } }), this.showAction ? (h("salla-button", { loading: this.loading, class: { 's-search-action': true, 's-search-action-oval': this.oval }, onClick: () => this.handleActionClick() }, !this.loading && h("span", { innerHTML: Search }))) : null), h("div", { key: '9f3fe2a8b952ad3db8775eb3645cf837ad50acb2', class: "s-search-results" }, this.results?.data.map(product => (h("a", { href: product.url + '?from=search-bar', class: {
+            } }), this.showAction ? (h("salla-button", { loading: this.loading, class: { 's-search-action': true, 's-search-action-oval': this.oval }, onClick: () => this.handleActionClick() }, !this.loading && h("span", { innerHTML: Search }))) : null), h("div", { key: 'fb09f6adaf9c4d9b798a6c10e45c446c306f0d37', class: "s-search-results" }, this.results?.data.map(product => (h("a", { href: product.url + '?from=search-bar', class: {
                 's-search-product': true,
                 's-search-product-not-available': !product.is_available,
             }, innerHTML: this.productSlot
@@ -139,9 +139,9 @@ export class SallaSearch {
                 .replace(/\{regular_price\}/g, product.is_on_sale && product.regular_price
                 ? salla.money(product.regular_price)
                 : '')
-                .replace(/\{image\}/g, product.image.url) }))), h("p", { key: '641e4165e6538523792f33694118c618818b91c9', ref: el => (this.noResults = el), class: "s-search-no-results-placeholder" }, salla.lang.get('common.elements.no_options')))));
-        const modalContent = (h("salla-modal", { key: '043edf7878b91643b3590bb9789a44df0a558af9', position: "top", class: "s-search-modal", ref: modal => (this.modal = modal) }, searchContent));
-        const placeholderContent = (h("div", { key: 'f5a08dc2ced47954b5a3bb87d4bc66a59e5f2660', class: "s-search-placeholder-wrapper s-search-inline" }, h("div", { key: '94c66a1a7016718348a50e8b5bf07659f4dd97c7', class: "s-search-input-wrapper" }, h("span", { key: '9f7bd3e92af9abaf6a852437883d6485885273e8', class: "s-search-icon-wrap" }, h("span", { key: 'd907342a757eb19ef404c4dfccc273bc1341bac8', class: "s-search-icon", innerHTML: Search })), h("button", { key: 'dcc3fb071542009d706de08a23138ab46683aa6a', type: "button", class: "s-search-input s-search-placeholder-trigger", onClick: () => this.open(), style: {
+                .replace(/\{image\}/g, product.image.url) }))), h("p", { key: '7f81403f86aeddca49b39ca84750a7f148416e51', ref: el => (this.noResults = el), class: "s-search-no-results-placeholder" }, salla.lang.get('common.elements.no_options')))));
+        const modalContent = (h("salla-modal", { key: '75909547a855ed368527746c0d342309b6b1b656', position: "top", class: "s-search-modal", ref: modal => (this.modal = modal) }, searchContent));
+        const placeholderContent = (h("div", { key: '480110779039e31eb43a5cfb321ca3a53d36d986', class: "s-search-placeholder-wrapper s-search-inline" }, h("div", { key: 'ef5e5f05279cb5324f9981e6a73a926f36a28317', class: "s-search-input-wrapper" }, h("span", { key: 'def894edb583c66b66abde7b54602da821fe10ee', class: "s-search-icon-wrap" }, h("span", { key: '6d38ace3c0cc4bc98d9a87b0b558187ba82f57e3', class: "s-search-icon", innerHTML: Search })), h("button", { key: 'ff4ebaeb0eb6315121cd5927784783f34ee174fc', type: "button", class: "s-search-input s-search-placeholder-trigger", onClick: () => this.open(), style: {
                 height: this.height + 'px',
                 borderRadius: this.oval ? this.height / 2 + 'px' : '',
             } }, salla.lang.get('blocks.header.search_placeholder'))), modalContent));

package/dist/collection/components/salla-searchable-dropdown/salla-searchable-dropdown.js

@@ -188,18 +188,18 @@ export class SallaSearchableDropdown {
     render() {
         const hasSelection = this.selectedItem != null;
         const listboxId = `${this.inputId}-listbox`;
-        return (h(Host, { key: '59eb3c601584887ecf2ff866ed861d8d5dfb7759', class: "s-searchable-dropdown" }, h("div", { key: '687e37ddded75ed6e212cd6f4ad1ef9ff28494f3', class: { 's-searchable-dropdown': true, 's-searchable-dropdown--open': this.isOpen } }, this.label && (h("label", { key: 'f71e75c71f035d23ae97607060b9ff0f0a6996de', class: "s-searchable-dropdown-label", htmlFor: this.inputId }, this.label, this.required && h("span", { key: '732c16038a1530eca7776434b600bb804a479ed0', class: "s-searchable-dropdown-required" }, " *"))), h("div", { key: '7d6eabf2cbf50001c454805e3c9dc7d757178e6e', class: {
+        return (h(Host, { key: '24b5c22d6c4b76cea1020efc23724d3618e038dc', class: "s-searchable-dropdown" }, h("div", { key: '863b4ea92751b38a5c863837ad486351875b7f32', class: { 's-searchable-dropdown': true, 's-searchable-dropdown--open': this.isOpen } }, this.label && (h("label", { key: 'cca0af579573ac276143d53fd4dbda8abc16f061', class: "s-searchable-dropdown-label", htmlFor: this.inputId }, this.label, this.required && h("span", { key: '41bf3da5a18a58a64bab571a32075d50dc982d48', class: "s-searchable-dropdown-required" }, " *"))), h("div", { key: '1c8930202368f7f74645b072731817ddd4aadb9f', class: {
                 's-searchable-dropdown-trigger': true,
                 's-searchable-dropdown-trigger--disabled': this.disabled || this.loading,
                 's-searchable-dropdown-trigger--open': this.isOpen,
-            }, role: "combobox", "aria-expanded": this.isOpen ? 'true' : 'false', "aria-haspopup": "listbox", "aria-controls": listboxId, "aria-disabled": this.disabled || this.loading ? 'true' : 'false', tabIndex: this.disabled || this.loading ? -1 : 0, onClick: this.handleTriggerClick, onKeyDown: this.handleTriggerKeyDown }, hasSelection ? (h("span", { class: "s-searchable-dropdown-trigger-text" }, this.getDisplayName(this.selectedItem))) : (h("span", { class: "s-searchable-dropdown-trigger-placeholder" }, this.placeholder)), h("i", { key: 'd6ddb602b2ce32102fa3301a7e76c74316ac5167', class: {
+            }, role: "combobox", "aria-expanded": this.isOpen ? 'true' : 'false', "aria-haspopup": "listbox", "aria-controls": listboxId, "aria-disabled": this.disabled || this.loading ? 'true' : 'false', tabIndex: this.disabled || this.loading ? -1 : 0, onClick: this.handleTriggerClick, onKeyDown: this.handleTriggerKeyDown }, hasSelection ? (h("span", { class: "s-searchable-dropdown-trigger-text" }, this.getDisplayName(this.selectedItem))) : (h("span", { class: "s-searchable-dropdown-trigger-placeholder" }, this.placeholder)), h("i", { key: '7081f2a853840e48bb8b64337e792be25d93323f', class: {
                 'sicon-keyboard_arrow_down': true,
                 's-searchable-dropdown-trigger-icon': true,
                 's-searchable-dropdown-trigger-icon--open': this.isOpen,
-            }, "aria-hidden": "true" })), this.isOpen && (h("div", { key: '329bb23e73f73957c02a6970796e210533ac74b0', class: {
+            }, "aria-hidden": "true" })), this.isOpen && (h("div", { key: 'b168e6ec86ee8f3e8af70a07c67a83b99aeae61b', class: {
                 's-searchable-dropdown-panel': true,
                 's-searchable-dropdown-panel--up': this.dropUp,
-            }, ref: (el) => (this.panelRef = el) }, this.searchable && (h("div", { key: '7f143cb798a0d75bcae0f5f4bc1d634b59fad401', class: "s-searchable-dropdown-search-wrap" }, h("i", { key: 'da0a9ab12d17cd0c82af1864ee9e1ef440295c6f', class: "sicon-search s-searchable-dropdown-search-icon", "aria-hidden": "true" }), h("input", { key: '6d222423a8b60fa947cc3251bdb94db770aac134', ref: (el) => (this.searchInputRef = el), id: this.inputId, type: "text", class: "s-searchable-dropdown-search-input", placeholder: this.placeholder, value: this.clientSearch ? this.clientSearchQuery : this.searchQuery, onInput: this.handleSearchInputChange, onKeyDown: this.handleSearchKeyDown, autocomplete: "off", "aria-autocomplete": "list", "aria-expanded": this.isOpen ? 'true' : 'false', "aria-controls": listboxId }))), h("div", { key: '63d8344ca677c266617dae393a3866a13d6d5613', id: listboxId, class: "s-searchable-dropdown-list s-scrollbar", role: "listbox" }, this.renderListContent()))))));
+            }, ref: (el) => (this.panelRef = el) }, this.searchable && (h("div", { key: 'c2a79324f2617c921dfe6267ae0edadd367dcca3', class: "s-searchable-dropdown-search-wrap" }, h("i", { key: '93e92d814bd24f4388a62b0ee4a72b26ebf960bf', class: "sicon-search s-searchable-dropdown-search-icon", "aria-hidden": "true" }), h("input", { key: '490a9f11a39a5410523a031ce4cb2fa13aab0f0e', ref: (el) => (this.searchInputRef = el), id: this.inputId, type: "text", class: "s-searchable-dropdown-search-input", placeholder: this.placeholder, value: this.clientSearch ? this.clientSearchQuery : this.searchQuery, onInput: this.handleSearchInputChange, onKeyDown: this.handleSearchKeyDown, autocomplete: "off", "aria-autocomplete": "list", "aria-expanded": this.isOpen ? 'true' : 'false', "aria-controls": listboxId }))), h("div", { key: 'e9ea0043307f73b4da635e152185c328158abd88', id: listboxId, class: "s-searchable-dropdown-list s-scrollbar", role: "listbox" }, this.renderListContent()))))));
     }
     renderListContent() {
         if (this.searching || this.loading) {

package/dist/collection/components/salla-skeleton/salla-skeleton.js

@@ -22,7 +22,7 @@ export class SallaSkeleton {
             's-skeleton-item': true,
             's-skeleton-item-circular': this.type == 'circle',
         };
-        return (h(Host, { key: '5568fdecb56f5513ffbe8f9b82da106a525af6a8', class: "s-skeleton-wrapper", style: { width: this.width, height: this.height } }, h("div", { key: '0a69bf54dff8093adea503ec6dbcb3f07aba9e13', class: classes }, "\u00A0")));
+        return (h(Host, { key: '9f9448d939ba69f60eca8dc6ea2ff98a047d6770', class: "s-skeleton-wrapper", style: { width: this.width, height: this.height } }, h("div", { key: '3b43bb472316b5541a90081a5f3cb6ef91558212', class: classes }, "\u00A0")));
     }
     static get is() { return "salla-skeleton"; }
     static get originalStyleUrls() {

package/dist/collection/components/salla-social/salla-social.js

@@ -31,7 +31,7 @@ export class SallaSocial {
     }
     render() {
         const linksArray = this.getLinksArray();
-        return (h(Host, { key: 'dfd63f034c588f6f6f08200d531187bd51e0b3b4' }, h("ul", { key: 'e4ec12ccb3c63a1dfdd64c5d3186734bed37db77', class: "s-social-list" }, linksArray.map((link) => (h("li", { class: "s-social-link" }, h("div", { id: "social-slot", innerHTML: this.socialSlot
+        return (h(Host, { key: '27639596a37f52686c1ac4b1a825fa143747216c' }, h("ul", { key: '9f6a6c96fe124fda09d2b879e3825ef73ec29c2c', class: "s-social-list" }, linksArray.map((link) => (h("li", { class: "s-social-link" }, h("div", { id: "social-slot", innerHTML: this.socialSlot
                 .replace(/\{icon\}/g, this.iconsList[link.type])
                 .replace(/\{type\}/g, link.type)
                 .replace(/\{link\}/g, link.value.toString()) })))))));

package/dist/collection/components/salla-social-share/salla-social-share.js

@@ -345,7 +345,7 @@ export class SallaSocialShare {
         })));
     }
     render() {
-        return (h("div", { key: '56f669cd8567efe9f1a73e302d2d85be23dd901b', class: "s-social-share-wrapper" }, h("slot", { key: '2c1848fa62c1ec3b8301d0544cd8098ea647e2e7', name: "widget" }, h("salla-button", { key: '0a7ccac871963382f1c2fc594877b5445e5f8830', "aria-label": "Share", onClick: () => this.toggle(), class: "s-social-share-btn", shape: "icon", fill: "outline", color: "light" }, h("span", { key: '658cd0182e40140a73614ae477b43ff2e388e155', innerHTML: this.opened ? Cancel : ShareAlt }))), this.mode === 'modal' ? this.renderModal() : this.renderPopupList()));
+        return (h("div", { key: '3efc177a91c23e62773bb6548494df7a774676c6', class: "s-social-share-wrapper" }, h("slot", { key: 'b02b4ddb6b04289ef2a8e73db50ea95a5256cf62', name: "widget" }, h("salla-button", { key: '397c35a10d593bdc6cda6a655b4a1eec93c77c63', "aria-label": "Share", onClick: () => this.toggle(), class: "s-social-share-btn", shape: "icon", fill: "outline", color: "light" }, h("span", { key: '959e6d599cc3bd5c1a77943153317fe5a1ece5f2', innerHTML: this.opened ? Cancel : ShareAlt }))), this.mode === 'modal' ? this.renderModal() : this.renderPopupList()));
     }
     static get is() { return "salla-social-share"; }
     static get originalStyleUrls() {

package/dist/collection/components/salla-tabs/salla-tab-content.js

@@ -30,7 +30,7 @@ export class SallaTabContent {
             's-tabs-content': true,
             's-tabs-content-selected': this.isSelected
         };
-        return (h("div", { key: 'f2deb9c1508aafe3aff5352094cccc97bdcd42ef', class: classes }, h("slot", { key: '460588864047444acdb06e757a7124d28935c24b' })));
+        return (h("div", { key: 'ef2a7a6b75062126dbac4fc53105ca6dc5ab4728', class: classes }, h("slot", { key: '89a592a2842153c6f55b33b3316d89a05cc3a0a3' })));
     }
     static get is() { return "salla-tab-content"; }
     static get originalStyleUrls() {

package/dist/collection/components/salla-tabs/salla-tab-header.js

@@ -52,7 +52,7 @@ export class SallaTabHeader {
             's-tabs-active': this.isSelected,
         };
         return [
-            h("div", { key: '153247ab5a7c73819ccc506a45e60b9c084c391c', class: classes, onClick: this.onClick.bind(this) }, h("slot", { key: '417a3ae0c0aec8a965b5d3be9a4f917f290d2109' })),
+            h("div", { key: 'b4dcb10997ec9ed5ff1bbbdac8bca1a3ad444c58', class: classes, onClick: this.onClick.bind(this) }, h("slot", { key: 'a559305d89f33a69ea46037f07bb4ac0c4ba9ea0' })),
         ];
     }
     static get is() { return "salla-tab-header"; }

package/dist/collection/components/salla-tabs/salla-tabs.js

@@ -50,7 +50,7 @@ export class SallaTabs {
     }
     render() {
         return [
-            h("div", { key: 'ae50836f68ee92459720fa9bf00d73848d849627', class: "s-tabs" }, h("div", { key: '55e8186e80381902269f9bad5738d9a555f71d37', class: "s-tabs-header" }, h("slot", { key: '46ce3e1ea75f92165b3d5ee7c16f19f8693f6d31', name: "header" })), h("div", { key: '3669e643abb37ed2edca73fc0577822a3f7fbb90', class: "s-tabs-content-wrapper" }, h("slot", { key: '2cf8b79f44630e21103991325ceff2cd3a4019ba', name: "content" })))
+            h("div", { key: 'd737bf1fc954f100895a60c1792af417b5f9cfeb', class: "s-tabs" }, h("div", { key: '6c0eb84f5729076d71704ab0163705c890925c1d', class: "s-tabs-header" }, h("slot", { key: 'cee0bf016128d3fb81c0fe495dfe0f1efaa38eb9', name: "header" })), h("div", { key: 'f9c85830bbddfa7ca1ac4c99cdc6428636c25020', class: "s-tabs-content-wrapper" }, h("slot", { key: 'd4c9c98cc5510619c0b13acc95518cd4bd647372', name: "content" })))
         ];
     }
     static get is() { return "salla-tabs"; }

package/dist/collection/components/salla-tel-input/salla-tel-input.js

@@ -123,7 +123,7 @@ export class SallaTelInput {
         }
     }
     render() {
-        return (h(Host, { key: '278424c0918dc3c4b6aac8da5817376d784995ac', class: "s-tel-input" }, h("input", { key: '00ff8ed40ff9aabe9bea6cfd43c41f5b2cfc5529', type: "tel", disabled: this.disabled, name: this.name, value: this.phone, onChange: (event) => this.handleCountryInput(event), ref: el => this.phoneInput = el, enterkeyhint: "next", autocomplete: "tel", class: "s-tel-input-control tel-input s-ltr" }), h("span", { key: '68e791d4d1b6490a84a3ef31c75f41be90ac5bb6', class: "s-tel-input-error-msg", ref: el => this.errorMsg = el }), h("input", { key: '415e6521c2ef756ebabbeb4610c06158e255320d', type: "hidden", name: "country_code", value: this.countryCode, ref: el => this.countryCodeInput = el, class: "country_code" })));
+        return (h(Host, { key: 'f45a6cc44acfbeaa538ec6403e0c66375a2c8e48', class: "s-tel-input" }, h("input", { key: '509e0409a6200cad6f492b40fd92eded1c0a3ed7', type: "tel", disabled: this.disabled, name: this.name, value: this.phone, onChange: (event) => this.handleCountryInput(event), ref: el => this.phoneInput = el, enterkeyhint: "next", autocomplete: "tel", class: "s-tel-input-control tel-input s-ltr" }), h("span", { key: '6b4a4980d3314f7cea6af7d4124d4a364d53ea3d', class: "s-tel-input-error-msg", ref: el => this.errorMsg = el }), h("input", { key: 'b4f091d19ac13a198d324605c1d2fadc234e89e4', type: "hidden", name: "country_code", value: this.countryCode, ref: el => this.countryCodeInput = el, class: "country_code" })));
     }
     componentDidLoad() {
         this.initTelInput();

package/dist/collection/components/salla-tooltip/salla-tooltip.js

@@ -27,7 +27,7 @@ export class SallaTooltip {
     }
     render() {
         const validTheme = ['default', 'dark'].includes(this.theme) ? this.theme : 'default';
-        return (h("div", { key: 'e5e8f78265e0abb1d4130fd084573c6cff1ecb2c', class: "s-tooltip-container" }, h("div", { key: '4dc98906dfd28c6e2d97b51329c07046eb15179c', class: `s-tooltip-item s-tooltip-item--${validTheme}`, style: { display: this.show ? 'block' : 'none' } }, this.text ? h("span", null, this.text) : h("slot", null))));
+        return (h("div", { key: '8d1ca64f3e7debdf91b568db90a6f9232d52bb67', class: "s-tooltip-container" }, h("div", { key: 'e9a5c89186a60da8e7b60dbcec798a6cbc5abfe2', class: `s-tooltip-item s-tooltip-item--${validTheme}`, style: { display: this.show ? 'block' : 'none' } }, this.text ? h("span", null, this.text) : h("slot", null))));
     }
     static get is() { return "salla-tooltip"; }
     static get originalStyleUrls() {

package/dist/collection/components/salla-user-settings/salla-user-settings.js

@@ -56,7 +56,7 @@ export class SallaUserSettings {
         await salla.profile.delete().finally(() => this.confirmationModal.close());
     }
     render() {
-        return (h(Host, { key: 'b37f8e7cd7fe59dfd4f4e1efe455e74d33d4b91e', class: "s-user-settings-wrapper" }, this.canHideName && h("div", { key: '7cf5f1ed489159ef1c754fc8368b390d35cc273d', class: "s-user-settings-section" }, h("salla-list-tile", { key: '961843ff5de245febf4b5d9d4a96d47b44aeaff3' }, h("div", { key: 'bdfa266ee2694e410ff2bc8d6ec31b5210e7bf08', slot: "icon", class: "s-user-settings-section-icon" }, h("span", { key: '8ff08646cb3b3ba8d157f07cb4d54a6f515409a7', innerHTML: UserCancel })), h("div", { key: '8030d07722d9ad730676dafd1323b93a361f91da', slot: "title", class: "s-user-settings-section-title" }, this.capitalizeText(this.hideMyName)), h("div", { key: 'f4c524dfe45418f0dd7395e998b1c16aa951a5f9', slot: "subtitle", class: "s-user-settings-section-subtitle" }, this.capitalizeText(this.hideMyNameDesc)), h("div", { key: '74569032acb01ff1037104dcaf46f13c18c16803', slot: 'action', class: "s-user-settings-section-action" }, h("label", { key: '6002a8368a587dbd8d3fd3fc1231e52ee44ebbbe', class: "s-toggle" }, h("input", { key: '2e9a622f9a670ef0f314c6183c57c851334a7df5', class: "s-toggle-input", checked: this.isHiddenName, onChange: (e) => this.toggleSetting('is_hidden_name', e), type: "checkbox" }), h("div", { key: 'ca57daef65f550d53c1f947b41d3fb488bd38a95', class: "s-toggle-switcher" }))))), h("div", { key: 'b81a0200e08c0eca176060362792a45d9d7ad41e', class: "s-user-settings-section" }, h("salla-list-tile", { key: 'ebcdac4056d21cbbd218b246cdd6c5bfa7bc2ac3' }, h("div", { key: 'df3a675745a0945498f3f45e11016f9f9c71ce6d', slot: "icon", class: "s-user-settings-section-icon" }, h("span", { key: 'b5accc798ca95bd803f9c721f96fe62ca27e8ecf', innerHTML: Bullhorn })), h("div", { key: 'fe82c42f7586ba892f14ed7b1d2f85e19c508e8c', slot: "title", class: "s-user-settings-section-title" }, this.capitalizeText(this.promotionalMsgs)), h("div", { key: 'ec35e1a363a0802ab14a92b4bc8b858b9bf79c72', slot: "subtitle", class: "s-user-settings-section-subtitle" }, this.capitalizeText(this.promotionalMsgsDesc)), h("div", { key: 'cc0d65144cfffc7fc795f3b1dde9ae6d75e827ec', slot: 'action', class: "s-user-settings-section-action" }, h("label", { key: '945d030759a2ab27b9e9379d96f879d299b0a444', class: "s-toggle" }, h("input", { key: '6dd35723f4e049263193d50d1488a300e26a166e', class: "s-toggle-input", checked: this.isNotifiable, onChange: (e) => this.toggleSetting('is_notifiable', e), type: "checkbox" }), h("div", { key: '1f529a32b220a0a5ba673fe41573786450e4f1b8', class: "s-toggle-switcher" }))))), h("div", { key: '9973aa99cd3944ced8e87da05a3711b9cde5faa4', class: "s-user-settings-section s-user-settings-section-deactivate-user" }, h("salla-list-tile", { key: '97ea806a1c5bc6e7f08ab04cdf555173d7e2c268' }, h("div", { key: 'fa98419cd6e11598c6e230ad462501f3dd66b975', slot: "icon", class: "s-user-settings-section-icon" }, h("span", { key: '9bb7192d2bcdd942974a2a6e405878998e090f3c', innerHTML: UserOff })), h("div", { key: '9e79bfd50311f2ec272bc6d90224d2f81c736d8e', slot: "title", class: "s-user-settings-section-title" }, this.capitalizeText(this.deactivateAccount)), h("div", { key: '805696292b1354bf57b0f0252eabd031dc4ac5db', slot: "subtitle", class: "s-user-settings-section-subtitle" }, this.capitalizeText(this.deactivateDesc)), h("div", { key: '4984f94d2eef4870036d1bea837cbe16e9978d84', slot: 'action', class: "s-user-settings-section-action" }, h("salla-button", { key: '7be1eaf49fdb3df86b953a14879695c0c2eae838', fill: "outline", color: "danger", shape: "btn", size: "medium", width: "normal", onClick: () => this.openDeactivateModal() }, this.capitalizeText(this.deactivateAccount))))), h("salla-modal", { key: '55608c2fbfd01c328f923316aa203ebd6539ef86', width: "sm", subTitle: this.capitalizeText(this.sorryForLeavingText), ref: modal => this.confirmationModal = modal }, h("span", { key: '247bb5555b3aa936ab4815f16ec332f6d922ab49', slot: 'icon', class: "s-user-settings-confirmation-icon", innerHTML: UserOff }), h("div", { key: 'd8499d470dd0cce984687c9f6842970467b832a9', class: "s-user-settings-confirmation" }, h("div", { key: 'c4d98f4dc7591c53a0f4ab71fc1c7e0d446cebfc', class: "s-user-settings-confirmation-warning" }, this.capitalizeText(this.warningText)), h("div", { key: 'abebad572dab06b497451fff00a405e4c9db5652', class: "s-user-settings-confirmation-actions" }, h("salla-button", { key: 'bfde878cc657d975154f6e8b73220786b3898dbf', width: "wide", onClick: () => this.confirmationModal.close() }, this.capitalizeText(this.keepAccount)), h("salla-button", { key: 'b3334a9b6fda2aa6de6f66f610efbba8ae95910f', fill: 'outline', loading: this.buttonLoading, width: "wide", onClick: () => this.deleteAccount() }, this.capitalizeText(this.deactivateAccount)))))));
+        return (h(Host, { key: '75182aab84957e3bdc3f5a47e375018a2ff314b0', class: "s-user-settings-wrapper" }, this.canHideName && h("div", { key: 'e93c12ca10adca2a3168d34901d353c2e6eda7f5', class: "s-user-settings-section" }, h("salla-list-tile", { key: '5b2f854e1f51f13b05af37fe68fa272fbeb3710e' }, h("div", { key: '5f567be1027fa9fc2e6548cb7ee48c7c63200ccf', slot: "icon", class: "s-user-settings-section-icon" }, h("span", { key: '95de506d0602d42220cccd177f59e5ff6e19c24b', innerHTML: UserCancel })), h("div", { key: 'bdf6e363e3da465add976ab41e334a3fd65fc627', slot: "title", class: "s-user-settings-section-title" }, this.capitalizeText(this.hideMyName)), h("div", { key: 'b16c23c79a8d020430944f97d99a2403f808059a', slot: "subtitle", class: "s-user-settings-section-subtitle" }, this.capitalizeText(this.hideMyNameDesc)), h("div", { key: 'e85db2fc26fddc13de274cfc9d5d8959d3813875', slot: 'action', class: "s-user-settings-section-action" }, h("label", { key: '0f92f016964de209357ee8f5d33ec55ea1ab631c', class: "s-toggle" }, h("input", { key: 'af69334d492767ddc19163712a60d29c4c43a96a', class: "s-toggle-input", checked: this.isHiddenName, onChange: (e) => this.toggleSetting('is_hidden_name', e), type: "checkbox" }), h("div", { key: '717aea4ae7824ce678788b5f3da1a44887c963e7', class: "s-toggle-switcher" }))))), h("div", { key: '7da94547cf6232426bcf263228b4103420fd6982', class: "s-user-settings-section" }, h("salla-list-tile", { key: '054cdd4098be9212714b0d25fddb73245c08ca23' }, h("div", { key: '3f723259a362eb01c35b687a775a555a2e18bf11', slot: "icon", class: "s-user-settings-section-icon" }, h("span", { key: '49ac90f0cbd762d7cd00cff16a4a47edb6d9cf4b', innerHTML: Bullhorn })), h("div", { key: '22cbeabe93f0744896b9256f581c06481ada6c79', slot: "title", class: "s-user-settings-section-title" }, this.capitalizeText(this.promotionalMsgs)), h("div", { key: '03c2308043dbed614661a403ae9061f1b9243aac', slot: "subtitle", class: "s-user-settings-section-subtitle" }, this.capitalizeText(this.promotionalMsgsDesc)), h("div", { key: 'f7f929822e2fc6d9940ea1781d79133c2f8cddae', slot: 'action', class: "s-user-settings-section-action" }, h("label", { key: '000dc08a23a5058d068250791db192c5d66bb30f', class: "s-toggle" }, h("input", { key: '876e1ff0e464dc50354df202b582946797a7bb5b', class: "s-toggle-input", checked: this.isNotifiable, onChange: (e) => this.toggleSetting('is_notifiable', e), type: "checkbox" }), h("div", { key: '69c91292e02230dc9312b83262dd05ee90db03ab', class: "s-toggle-switcher" }))))), h("div", { key: '6cc989da59fbff61d601a84a73c3d0d1f791b1d0', class: "s-user-settings-section s-user-settings-section-deactivate-user" }, h("salla-list-tile", { key: '3b9d325b1c2a50c9335df3408b0525c7a2f0cd69' }, h("div", { key: '67297f7fe70a11390607528f10dbe1974e527f4b', slot: "icon", class: "s-user-settings-section-icon" }, h("span", { key: '21d9b48ca06309156906bee1a5280107b7ff187a', innerHTML: UserOff })), h("div", { key: 'a47e50acadecf6f444119c5201e06332870ac301', slot: "title", class: "s-user-settings-section-title" }, this.capitalizeText(this.deactivateAccount)), h("div", { key: '472d0d4ba8a52f8410cd859e6101037166d4daca', slot: "subtitle", class: "s-user-settings-section-subtitle" }, this.capitalizeText(this.deactivateDesc)), h("div", { key: '843116bd516f196793a24601c84ec47bb876fe85', slot: 'action', class: "s-user-settings-section-action" }, h("salla-button", { key: 'fd412acdb5f5093cb98d73a45348a58ac848596a', fill: "outline", color: "danger", shape: "btn", size: "medium", width: "normal", onClick: () => this.openDeactivateModal() }, this.capitalizeText(this.deactivateAccount))))), h("salla-modal", { key: '80e9ea0e4e0ae7bcee04cbe2b1d51732f700369b', width: "sm", subTitle: this.capitalizeText(this.sorryForLeavingText), ref: modal => this.confirmationModal = modal }, h("span", { key: '3379bb4aba323a5aa20ecd3e279c93c799457d06', slot: 'icon', class: "s-user-settings-confirmation-icon", innerHTML: UserOff }), h("div", { key: 'def53bc74aedb1b6d739dc7be248c4afaf61e37a', class: "s-user-settings-confirmation" }, h("div", { key: '3f84b9e976c9ee8081dc3f7360a7940623d524e3', class: "s-user-settings-confirmation-warning" }, this.capitalizeText(this.warningText)), h("div", { key: '47f325528be69b14a08a22560570b27b82cdd867', class: "s-user-settings-confirmation-actions" }, h("salla-button", { key: '1c467025b0f76b7cff53eae5e98577d6378618f5', width: "wide", onClick: () => this.confirmationModal.close() }, this.capitalizeText(this.keepAccount)), h("salla-button", { key: '5c590fedc148bef454bf772cf30503e7d7c1f091', fill: 'outline', loading: this.buttonLoading, width: "wide", onClick: () => this.deleteAccount() }, this.capitalizeText(this.deactivateAccount)))))));
     }
     static get is() { return "salla-user-settings"; }
     static get originalStyleUrls() {

package/dist/collection/components/salla-wishlist-actions/salla-wishlist-actions.js

@@ -325,7 +325,7 @@ export class SallaWishlistActions {
         }
     }
     render() {
-        return (h(Host, { key: 'b81e89ba2b50777838fb24668a85b755febd9d18' }, h("div", { key: 'f412c4aae0044968b113c145bd116afce1a16e02', class: "s-wishlist-actions" }, h("div", { key: '4da9f5ba7b01b6c6abd2870c7cfb36ab2b3ed096', class: "s-wishlist-actions-bar flex items-center justify-end gap-3 mb-3" }, h("div", { key: '6411eaa75b26c327158eec88e77c04127a005bb6', class: "s-wishlist-actions-dropdown relative" }, h("salla-button", { key: '7bd0b43064b1cc48684151997b32c5e2585a1ae2', color: "primary", fill: "outline", type: "button", disabled: !this.hasProducts, "aria-haspopup": "true", "aria-expanded": this.menuOpen ? 'true' : 'false', onClick: () => this.toggleMenu() }, h("div", { key: '32131529c458e64d5dba13abae5271bce834d8e1', class: "flex flex-row justify-center items-center gap-2" }, h("svg", { key: 'd8a684cee58b071b347be32bf549c0396353085c', version: "1.1", xmlns: "http://www.w3.org/2000/svg", width: "16", height: "16", viewBox: "0 0 32 32", style: { width: '16px', height: '16px' } }, h("path", { key: 'fdc7f657dd009b4b3233ef1bcd0403e07837d4c6', d: "M26.667 21.333c-1.699 0-3.196 0.812-4.173 2.052l-11.912-5.211c0.044-0.276 0.085-0.553 0.085-0.841 0-0.472-0.081-0.923-0.197-1.359l12.361-6.952c0.971 1.009 2.328 1.644 3.836 1.644 2.941 0 5.333-2.392 5.333-5.333s-2.392-5.333-5.333-5.333-5.333 2.392-5.333 5.333c0 0.472 0.081 0.923 0.197 1.359l-12.361 6.952c-0.971-1.009-2.328-1.644-3.836-1.644-2.941 0-5.333 2.392-5.333 5.333s2.392 5.333 5.333 5.333c1.699 0 3.196-0.812 4.173-2.052l11.912 5.211c-0.044 0.276-0.085 0.553-0.085 0.841 0 2.941 2.392 5.333 5.333 5.333s5.333-2.392 5.333-5.333-2.392-5.333-5.333-5.333zM26.667 2.667c1.471 0 2.667 1.196 2.667 2.667s-1.196 2.667-2.667 2.667-2.667-1.196-2.667-2.667 1.196-2.667 2.667-2.667zM5.333 20c-1.471 0-2.667-1.196-2.667-2.667s1.196-2.667 2.667-2.667 2.667 1.196 2.667 2.667-1.196 2.667-2.667 2.667zM26.667 29.333c-1.471 0-2.667-1.196-2.667-2.667s1.196-2.667 2.667-2.667 2.667 1.196 2.667 2.667-1.196 2.667-2.667 2.667z" })), this.shareLabel, h("svg", { key: '600757f2c20634e1081ffba89b2bf8e77cb1faf2', version: "1.1", xmlns: "http://www.w3.org/2000/svg", width: "16", height: "16", viewBox: "0 0 32 32", style: { width: '16px', height: '16px' } }, h("path", { key: '1a42e36d54129c5ac781ac73960d011f3fc4861b', d: "M26.212 10.996c-0.556-0.484-1.396-0.428-1.881 0.127l-8.331 9.519-8.331-9.52c-0.485-0.555-1.327-0.611-1.881-0.125s-0.609 1.328-0.124 1.881l9.333 10.667c0.253 0.291 0.617 0.456 1.003 0.456s0.749-0.165 1.003-0.456l9.333-10.667c0.485-0.553 0.429-1.396-0.124-1.881z" })))), this.menuOpen && (h("ul", { key: '9c105a9d91a5ff7e5804d02eadca02fef1a98b4c', class: "s-wishlist-actions-menu absolute z-20 mt-1 bg-white rounded-lg shadow overflow-hidden" }, h("li", { key: '18ea949dd666a37206e0998cd41438500b2bdafc' }, h("button", { key: 'fec3f1544ee9efcd7fb228e895830469880abc89', type: "button", class: "s-wishlist-actions-menu-item", onClick: () => this.shareAll() }, this.shareAllLabel)), h("li", { key: '92b907a2dc5fab606b8a484f24d0655ef648e9f9' }, h("button", { key: '53f84c381937c0fa57f64a1b6e290b4b5ed6d281', type: "button", class: "s-wishlist-actions-menu-item", onClick: () => this.shareSpecific() }, this.shareSpecificLabel))))), h("salla-social-share", { key: '696c7448d6593a85811c8a3a7c18068728871d47', class: "s-wishlist-actions-social", ref: el => (this.socialShare = el), url: this.shareUrl, mode: "modal", modalTitle: this.shareModalTitle }, h("span", { key: 'f3e51bcb70b2bf529712ee7fa4a167e5a59ad64c', slot: "widget", class: "s-wishlist-actions-social-anchor", "aria-hidden": "true" }))), this.specificMode && (h("div", { key: '1895c4ccc6bf6ff6ad1d754c70b03016d52d4bbe', class: "s-wishlist-actions-panel flex items-center justify-between gap-4 flex-wrap p-4 mt-3 mb-3 bg-white rounded-lg" }, h("label", { key: '6c988b12e481febb3fe2ee6ddbb7e93424de641e', class: "s-wishlist-actions-panel-select-all flex items-center gap-2 cursor-pointer" }, h("input", { key: 'e33a34358e5b974065f8299a9b48ac3dd7b2cc40', type: "checkbox", class: "s-products-list-select-checkbox s-wishlist-actions-select-all", checked: this.isAllSelected, ref: el => (this.selectAllCheckbox = el), "aria-label": this.selectAllLabel, onChange: () => this.toggleSelectAll() }), h("span", { key: '8a2ae1c1010059a5138eeb8dd1ff15c2e618a617', class: "s-wishlist-actions-panel-title text-sm font-bold text-gray-700" }, this.shareSpecificLabel, " (", this.selectedCount, ")")), h("div", { key: '692bd55edf4909c88479f704f4590ba8f400ccb6', class: "s-wishlist-actions-panel-buttons flex items-center gap-2" }, h("salla-button", { key: 'c6b33fc8f1acb8dc46d7ba4ba3696b25f60ca433', class: "s-wishlist-actions-cancel", color: "light", fill: "outline", type: "button", onClick: () => this.cancelSpecific() }, this.cancelLabel), h("salla-button", { key: 'eec053d0c882b0958f498a0c4f0373102ec40a8e', class: "s-wishlist-actions-share", color: "primary", fill: "outline", type: "button", disabled: !this.selectedCount, loading: this.isSharing, onClick: () => this.shareSelected() }, this.shareLabel)))))));
+        return (h(Host, { key: 'd7d04101999f18d75948b08da81f6d7b1afc9aae' }, h("div", { key: '84a0fd14c0c047a5068580d19201768a556b8e3a', class: "s-wishlist-actions" }, h("div", { key: '9fd499560685e927ceae24bc66f1913c702f4a11', class: "s-wishlist-actions-bar flex items-center justify-end gap-3 mb-3" }, h("div", { key: '0aa5e1a225053647cc9657e2b18753091b29eab8', class: "s-wishlist-actions-dropdown relative" }, h("salla-button", { key: 'df1043ab21b4dbef0306b6b98205b113a1a03c5d', color: "primary", fill: "outline", type: "button", disabled: !this.hasProducts, "aria-haspopup": "true", "aria-expanded": this.menuOpen ? 'true' : 'false', onClick: () => this.toggleMenu() }, h("div", { key: 'd3e6aa76f57515690d6407540e689c496eed3a3f', class: "flex flex-row justify-center items-center gap-2" }, h("svg", { key: 'd01a523d8f4b2a346a997aa4cc39fca1842251ab', version: "1.1", xmlns: "http://www.w3.org/2000/svg", width: "16", height: "16", viewBox: "0 0 32 32", style: { width: '16px', height: '16px' } }, h("path", { key: '2252e3439eefd2f440c34e7826a9a2056896a5c3', d: "M26.667 21.333c-1.699 0-3.196 0.812-4.173 2.052l-11.912-5.211c0.044-0.276 0.085-0.553 0.085-0.841 0-0.472-0.081-0.923-0.197-1.359l12.361-6.952c0.971 1.009 2.328 1.644 3.836 1.644 2.941 0 5.333-2.392 5.333-5.333s-2.392-5.333-5.333-5.333-5.333 2.392-5.333 5.333c0 0.472 0.081 0.923 0.197 1.359l-12.361 6.952c-0.971-1.009-2.328-1.644-3.836-1.644-2.941 0-5.333 2.392-5.333 5.333s2.392 5.333 5.333 5.333c1.699 0 3.196-0.812 4.173-2.052l11.912 5.211c-0.044 0.276-0.085 0.553-0.085 0.841 0 2.941 2.392 5.333 5.333 5.333s5.333-2.392 5.333-5.333-2.392-5.333-5.333-5.333zM26.667 2.667c1.471 0 2.667 1.196 2.667 2.667s-1.196 2.667-2.667 2.667-2.667-1.196-2.667-2.667 1.196-2.667 2.667-2.667zM5.333 20c-1.471 0-2.667-1.196-2.667-2.667s1.196-2.667 2.667-2.667 2.667 1.196 2.667 2.667-1.196 2.667-2.667 2.667zM26.667 29.333c-1.471 0-2.667-1.196-2.667-2.667s1.196-2.667 2.667-2.667 2.667 1.196 2.667 2.667-1.196 2.667-2.667 2.667z" })), this.shareLabel, h("svg", { key: '571c18e4ab4fd96316daf93731d4c86fd3518bc6', version: "1.1", xmlns: "http://www.w3.org/2000/svg", width: "16", height: "16", viewBox: "0 0 32 32", style: { width: '16px', height: '16px' } }, h("path", { key: '2052db577a9f138f76842680cc6932403b92c0e1', d: "M26.212 10.996c-0.556-0.484-1.396-0.428-1.881 0.127l-8.331 9.519-8.331-9.52c-0.485-0.555-1.327-0.611-1.881-0.125s-0.609 1.328-0.124 1.881l9.333 10.667c0.253 0.291 0.617 0.456 1.003 0.456s0.749-0.165 1.003-0.456l9.333-10.667c0.485-0.553 0.429-1.396-0.124-1.881z" })))), this.menuOpen && (h("ul", { key: 'a21af19b80cebae0f3d09e0d3b64e0c06f37f638', class: "s-wishlist-actions-menu absolute z-20 mt-1 bg-white rounded-lg shadow overflow-hidden" }, h("li", { key: '133e87849b1f2e77acdc9ad082c7bc18f7264378' }, h("button", { key: '28579c772443b7b9305a9dec28185b42b198953a', type: "button", class: "s-wishlist-actions-menu-item", onClick: () => this.shareAll() }, this.shareAllLabel)), h("li", { key: '20ad2ceee62640f46c558c224e4ecf36b669a187' }, h("button", { key: '1e8058d5a5d32174978e3f8ca495861a2f9d22af', type: "button", class: "s-wishlist-actions-menu-item", onClick: () => this.shareSpecific() }, this.shareSpecificLabel))))), h("salla-social-share", { key: 'b958b31a701ca9e6fac473a8242dba43074bfb8c', class: "s-wishlist-actions-social", ref: el => (this.socialShare = el), url: this.shareUrl, mode: "modal", modalTitle: this.shareModalTitle }, h("span", { key: '60fe765f36ff8f024e2180a084abbba401e0e6c5', slot: "widget", class: "s-wishlist-actions-social-anchor", "aria-hidden": "true" }))), this.specificMode && (h("div", { key: '5cbdef791a909ea3e2098c178ced94cac03febf0', class: "s-wishlist-actions-panel flex items-center justify-between gap-4 flex-wrap p-4 mt-3 mb-3 bg-white rounded-lg" }, h("label", { key: '319e0aa56906ad210d846d4690002556d275554b', class: "s-wishlist-actions-panel-select-all flex items-center gap-2 cursor-pointer" }, h("input", { key: '1515b3f79945e6cbb1c33fce69c433fae2774867', type: "checkbox", class: "s-products-list-select-checkbox s-wishlist-actions-select-all", checked: this.isAllSelected, ref: el => (this.selectAllCheckbox = el), "aria-label": this.selectAllLabel, onChange: () => this.toggleSelectAll() }), h("span", { key: 'ee2102a09d6c998eb214bb96ee71e1ee647699e5', class: "s-wishlist-actions-panel-title text-sm font-bold text-gray-700" }, this.shareSpecificLabel, " (", this.selectedCount, ")")), h("div", { key: '32912748a5a451122f7e3a3a98c1b8d393c00447', class: "s-wishlist-actions-panel-buttons flex items-center gap-2" }, h("salla-button", { key: '6150853b2efd8562d76e05a97e0d6523a696e397', class: "s-wishlist-actions-cancel", color: "light", fill: "outline", type: "button", onClick: () => this.cancelSpecific() }, this.cancelLabel), h("salla-button", { key: '394a3f626c84b1aff0533026946e3288d70dc0ee', class: "s-wishlist-actions-share", color: "primary", fill: "outline", type: "button", disabled: !this.selectedCount, loading: this.isSharing, onClick: () => this.shareSelected() }, this.shareLabel)))))));
     }
     static get is() { return "salla-wishlist-actions"; }
     static get originalStyleUrls() {