@salla.sa/twilight-components 2.14.380 → 2.14.381

package/dist/cjs/salla-list-tile.cjs.entry.js

@@ -3,7 +3,7 @@
  */
 'use strict';
 
-var index = require('./index-CHRvLWS8.js');
+var index = require('./index-Bxxuur88.js');
 
 const sallaListTileCss = "";
 

package/dist/cjs/salla-localization-modal.cjs.entry.js

@@ -3,27 +3,94 @@
  */
 'use strict';
 
-var index = require('./index-CHRvLWS8.js');
+var index = require('./index-Bxxuur88.js');
 
 const SallaLocalizationModal = class {
     constructor(hostRef) {
         index.registerInstance(this, hostRef);
-        this.translationLoaded = false;
+        this.languageNames = {
+            "ar": "العربية",
+            "en": "English",
+            "sq": "shqip",
+            "hy": "հայերէն",
+            "bg": "български",
+            "zh": "汉语",
+            "hr": "hrvatski",
+            "cs": "čeština",
+            "da": "dansk",
+            "nl": "dutch",
+            "et": "eesti keel",
+            "fi": "suomen kieli",
+            "fr": "Français",
+            "de": "Deutsch",
+            "el": "Ελληνικά",
+            "hi": "हिन्दी",
+            "hu": "magyar",
+            //we know it's `id` as ISO 639-1 but we are using `ind` as ISO 639-2 on our system as key to avoid conflicts with `id` attribute
+            "ind": "bahasa Indonesia",
+            "ga": "Gaeilge",
+            "it": "Italiano",
+            "ja": "日本語",
+            "ko": "한국어",
+            "lv": "latviešu",
+            "mt": "Maltese",
+            "fa": "فارسی",
+            "pl": "Polish",
+            "pt": "português",
+            "ro": "română",
+            "ru": "русский",
+            "sl": "slovenščina",
+            "es": "Español",
+            "sv": "svenska",
+            "tl": "Tagalog (Filipino)",
+            "tr": "Türkçe",
+            "uk": "украї́нська",
+            "ur": "اُردُو",
+            "ms": "Bahasa Malaysia",
+        };
+        this.currenciesList = {
+            SAR: { en: "Saudi Riyal", ar: "ريال سعودي", symbol: "ر.س" },
+            USD: { en: "US Dollar", ar: "دولار أمريكي", symbol: "$" },
+            EUR: { en: "Euro", ar: "يورو", symbol: "€" },
+            AED: { en: "UAE Dirham", ar: "درهم اماراتي", symbol: "د.إ" },
+            KWD: { en: "Kuwaiti Dinar", ar: "دينار كويتي", symbol: "د.ك" },
+            BHD: { en: "Bahraini Dinar", ar: "دينار بحريني", symbol: "د.ب" },
+            QAR: { en: "Qatari Riyal", ar: "ريال قطري", symbol: "ر.ق" },
+            OMR: { en: "Omani Rial", ar: "ريال عماني", symbol: "ر.ع" },
+            AUD: { en: "Australian Dollar", ar: "دولار استرالي", symbol: "$" },
+            CAD: { en: "Canadian Dollar", ar: "دولار كندي", symbol: "$" },
+            CNY: { en: "Renminbi", ar: "رنمينبي", symbol: "¥" },
+            EGP: { en: "Egyptian Pound", ar: "جنيه مصري", symbol: "ج.م" },
+            GBP: { en: "Pound Sterling", ar: "جنيه استرليني", symbol: "£" },
+            IDR: { en: "Indonesian Rupiah", ar: "روبية إندونيسية", symbol: "Rp" },
+            INR: { en: "Indian Rupee", ar: "روبية هندية", symbol: "₹" },
+            JPY: { en: "Japanese Yen", ar: "ين ياباني", symbol: "¥" },
+            MYR: { en: "Malaysian Ringgit", ar: "رينغيت ماليزي", symbol: "RM" },
+            PKR: { en: "Pakistani Rupee", ar: "روبية باكستانية", symbol: "Rs." },
+            SEK: { en: "Swedish Krona", ar: "كرونة سويدية", symbol: "kr" },
+            SGD: { en: "Singapore Dollar", ar: "دولار سنغافوري", symbol: "$" },
+            TRY: { en: "Turkish Lira", ar: "ليرة تركية", symbol: "₺" },
+            IQD: { en: "Iraqi Dinar", ar: "دينار عراقي", symbol: "د.ع" },
+            LBP: { en: "Lebanese Pound", ar: "ليرة لبنانية", symbol: "ل.ل" },
+            MRO: { en: "Mauritanian Ouguiya", ar: "أوقية موريتانية", symbol: "UM" },
+            SDG: { en: "Sudanese Pound", ar: "جنيه سوداني", symbol: "SDG" },
+            SYP: { en: "Syrian Pound", ar: "ليرة سورية", symbol: "ل.س" },
+            TND: { en: "Tunisian Dinar", ar: "دينار تونسي", symbol: "د.ت" },
+            JOD: { en: "Jordanian Dinar", ar: "دينار أردني", symbol: "JOD" },
+            DZD: { en: "Algerian Dinar", ar: "دينار جزائري", symbol: "دج" },
+            MAD: { en: "Moroccan Dirham", ar: "درهم مغربي", symbol: "د.م." },
+            LYD: { en: "Libyan Dinar", ar: "دينار ليبي", symbol: "LD" },
+            YER: { en: "Yemeni Riyal", ar: "ريال يمني", symbol: "ر.ي" }
+        };
+        //here we will used the currency code instead of the symbol when current language is not arabic
+        this.arabicCurrencies = ["SAR", "AED", "KWD", "BHD", "QAR", "OMR", "EGP", "IQD", "LBP", "SYP", "TND", "DZD", "MAD", "YER"];
         this.languages = [];
         this.currencies = [];
         this.hasError = false;
         /**
-         * Current language (existing or newly selected)
+         * To show the trigger button or not
          */
-        this.language = salla.config.get('user.language_code');
-        /**
-         * Current currency (existing or newly selected)
-         */
-        this.currency = salla.config.get('user.currency_code');
-        salla.event.on('localization::open', () => this.open());
-        salla.lang.onLoaded(() => {
-            this.translationLoaded = true;
-        });
+        this.showTrigger = false;
         /**
          * letting developer to insert his own slot like:
          * <salla-localization>
@@ -34,14 +101,25 @@ const SallaLocalizationModal = class {
          * we made a workaround to pass language & currency attributes, then replace names in rendering
          */
         this.languageSlot = this.host.querySelector('[slot="language"]')?.innerHTML || '<label class="s-localization-modal-label" for="lang-{code}"><span>{name}</span></label>';
-        this.currencySlot = this.host.querySelector('[slot="currency"]')?.innerHTML || '<label class="s-localization-modal-label" for="currency-{code}"><span>{name}</span><small class="s-localization-modal-currency">{code}</small></label>';
+        this.currencySlot = this.host.querySelector('[slot="currency"]')?.innerHTML || '<label class="s-localization-modal-label" for="currency-{code}"><span>{name}</span><small class="s-localization-modal-currency">{symbol}</small></label>';
+    }
+    async componentWillLoad() {
+        await Salla.onReady();
+        await Salla.lang.onLoaded();
+        Salla.event.on('localization::open', () => this.open());
+        if (!this.language) {
+            this.language = Salla.config.get('user.language_code');
+        }
+        if (!this.currency) {
+            this.currency = Salla.config.get('user.currency_code');
+        }
     }
     /**
      * open the component
      */
     async open() {
         this.modal.open();
-        return await salla.api.withoutNotifier(() => this.getLanguages())
+        return await Salla.api.withoutNotifier(() => this.getLanguages())
             .then(() => this.getCurrencies())
             .then(() => {
             if (this.languages.length < 2 && this.currencies.length < 2) {
@@ -61,13 +139,30 @@ const SallaLocalizationModal = class {
     async close() {
         return this.modal.close();
     }
+    getCurrency(currencyCode) {
+        return this.currenciesList[currencyCode || this.currency] || { en: "Saudi Riyal", ar: "ريال سعودي", symbol: "ر.س" };
+    }
+    getLanguageName() {
+        return this.languageNames[this.language] || this.language || '';
+    }
+    getCurrencySymbol(currencyCode) {
+        currencyCode = currencyCode || this.currency;
+        if (currencyCode === 'SAR') {
+            return '<i class="sicon-sar"></i>';
+        }
+        if (this.language === 'ar' || !this.arabicCurrencies.includes(currencyCode)) {
+            return this.getCurrency(currencyCode).symbol;
+        }
+        return currencyCode;
+    }
+    getCurrencyName(currencyCode) {
+        return this.language === 'ar' ? this.getCurrency(currencyCode).ar : this.getCurrency(currencyCode).en;
+    }
     async getLanguages() {
-        this.language = this.language || salla.config.get('user.language_code');
-        return this.languages.length > 1 ? null : await salla.config.languages().then(data => this.languages = data);
+        return this.languages.length > 1 ? null : await Salla.config.languages().then(data => this.languages = data);
     }
     async getCurrencies() {
-        this.currency = this.currency || salla.config.get('user.currency_code');
-        return this.currencies.length > 1 ? null : await salla.config.currencies().then(data => this.currencies = Object.values(data || {}));
+        return this.currencies.length > 1 ? null : await Salla.config.currencies().then(data => this.currencies = Object.values(data || {}));
     }
     onChangeCurrency(event) {
         this.currency = event.target.value;
@@ -83,50 +178,56 @@ const SallaLocalizationModal = class {
         this.btn.load()
             .then(() => {
             if (!this.currency) {
-                salla.log('There is no currency!');
+                Salla.log('There is no currency!');
                 return;
             }
-            if (this.currency === salla.config.get('user.currency_code', 'SAR')) {
+            if (this.currency === Salla.config.get('user.currency_code', 'SAR')) {
                 return;
             }
             url = window.location.href;
-            return salla.currency.api.change(this.currency);
+            return Salla.currency.api.change(this.currency);
         })
             .then(() => {
-            if (this.language !== salla.config.get('user.language_code', 'ar')) {
-                url = salla.helpers.addParamToUrl('lang', this.language);
+            if (this.language !== Salla.config.get('user.language_code', 'ar')) {
+                url = Salla.helpers.addParamToUrl('lang', this.language);
             }
         })
             .then(() => {
-            salla.cookie.set('s-lang', this.language);
-            salla.cookie.set('s-curr', this.currency);
+            Salla.cookie.set('s-lang', this.language);
+            Salla.cookie.set('s-curr', this.currency);
         })
             .then(() => this.btn.stop())
             .then(() => this.close())
             .then(() => {
             if (url) {
-                window.location.href = url.replace(`/${salla.config.get('user.language_code')}/`, `/${this.language}/`);
+                window.location.href = url.replace(`/${Salla.config.get('user.language_code')}/`, `/${this.language}/`);
             }
         });
     }
     render() {
-        return (index.h("salla-modal", { key: 'd3a45aa4cc807e1ba549514b59ada59a2397bff0', isLoading: true, class: "s-hidden", ref: modal => this.modal = modal, width: "xs" }, index.h("div", { key: '1794f7c9e31a1a1b622363fa21905a73a8bbdb68', slot: 'loading' }, index.h("div", { key: 'd55e1b7fb36f84616dde3f19955c7e5013838080', class: "s-localization-modal-skeleton" }, index.h("salla-skeleton", { key: '7a25a0f055f401a8a63030df1ab930957668c1df', width: '25%', height: '15px' }), index.h("div", { key: '8e9c1aba813a5efa58dc4132a504d1612343cce6', class: "s-localization-modal-skeleton-content" }, [...Array(4)].map(() => index.h("div", { class: "s-localization-modal-skeleton-item" }, index.h("div", { class: "s-localization-modal-skeleton-item-flex" }, index.h("salla-skeleton", { type: 'circle', height: '16px', width: '16px' }), index.h("salla-skeleton", { height: '10px', width: '100px' })), index.h("salla-skeleton", { height: '15px', width: '20px' })))), index.h("salla-skeleton", { key: 'b3ef9e80a8dec053e9c0e6d10d1145d4057c98ad', width: '25%', height: '15px' }), index.h("div", { key: '1d062e516cc37994e34c0aa77634bc7a2311c4ff', class: "s-localization-modal-skeleton-content" }, [...Array(4)].map(() => index.h("div", { class: "s-localization-modal-skeleton-item" }, index.h("div", { class: "s-localization-modal-skeleton-item-flex" }, index.h("salla-skeleton", { type: 'circle', height: '16px', width: '16px' }), index.h("salla-skeleton", { height: '10px', width: '100px' })), index.h("salla-skeleton", { height: '15px', width: '20px' })))), index.h("salla-skeleton", { key: '9f7a16b0f3881882fc257ed7e1290380dea38a4c', height: '40px', width: '100%' }))), !!this.hasError ?
-            index.h("salla-placeholder", { alignment: "center" }, index.h("span", { slot: "description" }, this.errorMessage)) :
-            index.h("div", { class: "s-localization-modal-inner" }, this.languages.length > 1 ?
-                index.h("div", { class: "s-localization-modal-section" }, index.h("label", { class: "s-localization-modal-title" }, salla.lang.get('common.titles.language')), index.h("div", { class: "s-localization-modal-section-inner" }, this.languages.length < 6 ?
-                    this.languages.map(lang => index.h("div", { class: "s-localization-modal-item" }, index.h("input", { class: "s-localization-modal-input", type: "radio", checked: this.language == lang.iso_code, onChange: () => this.language = lang.iso_code, name: "language", id: 'lang-' + lang.code.toLowerCase(), value: lang.code }), index.h("div", { class: "s-localization-modal-label-slot", id: "language-slot", innerHTML: this.languageSlot
-                            .replace(/\{name\}/g, lang.name)
-                            .replace(/\{code\}/g, lang.code)
-                            .replace(/\{country_code\}/g, lang.country_code) }))) :
-                    index.h("select", { class: "s-localization-modal-select", name: "language", onChange: e => this.onChangeLanguage(e) }, this.languages.map(lang => index.h("option", { value: lang.code, selected: this.language == lang.code }, lang.name)))))
-                : '', this.currencies.length > 1 ?
-                index.h("div", { class: "s-localization-modal-section" }, index.h("label", { class: "s-localization-modal-title" }, salla.lang.get('common.titles.currency')), index.h("div", { class: "s-localization-modal-section-inner" }, this.currencies.length < 6 ?
-                    this.currencies.map(currency => index.h("div", { class: "s-localization-modal-item" }, index.h("input", { class: "s-localization-modal-input", type: "radio", name: "currency", checked: this.currency == currency.code, onChange: () => this.currency = currency.code, id: 'currency-' + currency.code, value: currency.code }), index.h("div", { class: "s-localization-modal-label-slot", id: "currency-slot", innerHTML: this.currencySlot
-                            .replace(/\{name\}/g, currency.name)
-                            .replace(/\{code\}/g, currency.code)
-                            .replace(/\{country_code\}/g, currency.country_code) }))) :
-                    index.h("select", { class: "s-localization-modal-select", name: "currency", onChange: e => this.onChangeCurrency(e) }, this.currencies.map(currency => index.h("option", { value: currency.code, selected: this.currency == currency.code }, currency.name)))))
-                : '', index.h("salla-button", { width: "wide", ref: btn => this.btn = btn, onClick: () => this.submit() }, salla.lang.get('common.elements.ok')))));
+        return [
+            this.showTrigger
+                ? index.h("button", { type: "button", onClick: () => this.open(), class: "s-localization-modal-trigger-btn" }, index.h("span", null, this.getLanguageName()), index.h("span", { class: "s-localization-modal-trigger-separator" }, "|"), " ", index.h("span", { innerHTML: this.getCurrencySymbol() }))
+                : '',
+            index.h("salla-modal", { key: 'ae9553ab14e30b7e9b6466d1e959e469e544ca5b', isLoading: true, class: "s-hidden", ref: modal => this.modal = modal, width: "xs" }, index.h("div", { key: '84bf38810a3d1c99ee084951ef596cc33a18e4f7', slot: 'loading' }, index.h("div", { key: '5e808b2a7774bc1f1e1fe25cb880c45a3b97f1aa', class: "s-localization-modal-skeleton" }, index.h("salla-skeleton", { key: 'c0000d5f4f5fb663f059822fe1a4f24a78a9dd65', width: '25%', height: '15px' }), index.h("div", { key: '45164d658a0ee5e8825422af35605bfd83e383ff', class: "s-localization-modal-skeleton-content" }, [...Array(4)].map(() => index.h("div", { class: "s-localization-modal-skeleton-item" }, index.h("div", { class: "s-localization-modal-skeleton-item-flex" }, index.h("salla-skeleton", { type: 'circle', height: '16px', width: '16px' }), index.h("salla-skeleton", { height: '10px', width: '100px' })), index.h("salla-skeleton", { height: '15px', width: '20px' })))), index.h("salla-skeleton", { key: '1e63980f25677892f731e6ad30eda08b8a3852e0', width: '25%', height: '15px' }), index.h("div", { key: 'b1263061b94885e99d540f90054244fb41fd0a68', class: "s-localization-modal-skeleton-content" }, [...Array(4)].map(() => index.h("div", { class: "s-localization-modal-skeleton-item" }, index.h("div", { class: "s-localization-modal-skeleton-item-flex" }, index.h("salla-skeleton", { type: 'circle', height: '16px', width: '16px' }), index.h("salla-skeleton", { height: '10px', width: '100px' })), index.h("salla-skeleton", { height: '15px', width: '20px' })))), index.h("salla-skeleton", { key: '6dfbe5d71475640cd41dfe3d01e9277f2b2b80c5', height: '40px', width: '100%' }))), !!this.hasError ?
+                index.h("salla-placeholder", { alignment: "center" }, index.h("span", { slot: "description" }, this.errorMessage)) :
+                index.h("div", { class: "s-localization-modal-inner" }, this.languages.length > 1 ?
+                    index.h("div", { class: "s-localization-modal-section" }, index.h("label", { class: "s-localization-modal-title" }, Salla.lang.get('common.titles.language')), index.h("div", { class: "s-localization-modal-section-inner" }, this.languages.length < 6 ?
+                        this.languages.map(lang => index.h("div", { class: "s-localization-modal-item" }, index.h("input", { class: "s-localization-modal-input", type: "radio", checked: this.language == lang.iso_code, onChange: () => this.language = lang.iso_code, name: "language", id: 'lang-' + lang.code.toLowerCase(), value: lang.code }), index.h("div", { class: "s-localization-modal-label-slot", id: "language-slot", innerHTML: this.languageSlot
+                                .replace(/\{name\}/g, lang.name)
+                                .replace(/\{code\}/g, lang.code)
+                                .replace(/\{country_code\}/g, lang.country_code) }))) :
+                        index.h("select", { class: "s-localization-modal-select", name: "language", onChange: e => this.onChangeLanguage(e) }, this.languages.map(lang => index.h("option", { value: lang.code, selected: this.language == lang.code }, lang.name)))))
+                    : '', this.currencies.length > 1 ?
+                    index.h("div", { class: "s-localization-modal-section" }, index.h("label", { class: "s-localization-modal-title" }, Salla.lang.get('common.titles.currency')), index.h("div", { class: "s-localization-modal-section-inner" }, this.currencies.length < 6 ?
+                        this.currencies.map(currency => index.h("div", { class: "s-localization-modal-item" }, index.h("input", { class: "s-localization-modal-input", type: "radio", name: "currency", checked: this.currency == currency.code, onChange: () => this.currency = currency.code, id: 'currency-' + currency.code, value: currency.code }), index.h("div", { class: "s-localization-modal-label-slot", id: "currency-slot", innerHTML: this.currencySlot
+                                .replace(/\{name\}/g, this.getCurrencyName(currency.code))
+                                .replace(/\{code\}/g, currency.code)
+                                .replace(/\{symbol\}/g, this.getCurrencySymbol(currency.code))
+                                .replace(/\{country_code\}/g, currency.country_code) }))) :
+                        index.h("select", { class: "s-localization-modal-select", name: "currency", onChange: e => this.onChangeCurrency(e) }, this.currencies.map(currency => index.h("option", { value: currency.code, selected: this.currency == currency.code }, currency.name)))))
+                    : '', index.h("salla-button", { width: "wide", ref: btn => this.btn = btn, onClick: () => this.submit() }, Salla.lang.get('common.elements.ok'))))
+        ];
     }
     /**
      * to reduce dom levels we will move slot data into the parent dom

package/dist/cjs/salla-login-modal.cjs.entry.js

@@ -3,7 +3,7 @@
  */
 'use strict';
 
-var index = require('./index-CHRvLWS8.js');
+var index = require('./index-Bxxuur88.js');
 
 const sallaLoginModalCss = "iframe{-moz-transition:height 0.3s;-ms-transition:height 0.3s;-o-transition:height 0.3s;-webkit-transition:height 0.3s;transition:height 0.3s;width:100%}";
 

package/dist/cjs/salla-loyalty-prize-item.cjs.entry.js

@@ -3,7 +3,7 @@
  */
 'use strict';
 
-var index = require('./index-CHRvLWS8.js');
+var index = require('./index-Bxxuur88.js');
 
 const sallaLoyaltyPrizeItemCss = "salla-loyalty-prize-item:hover{box-shadow:0 5px 15px 1px rgba(0, 0, 0, 0.04) !important}";
 

package/dist/cjs/salla-loyalty-program.cjs.entry.js

@@ -3,7 +3,7 @@
  */
 'use strict';
 
-var index = require('./index-CHRvLWS8.js');
+var index = require('./index-Bxxuur88.js');
 var gift = require('./gift-CJ-3Yw_x.js');
 
 const sallaLoyaltyProgramCss = "";

package/dist/cjs/salla-loyalty.cjs.entry.js

@@ -3,7 +3,7 @@
  */
 'use strict';
 
-var index = require('./index-CHRvLWS8.js');
+var index = require('./index-Bxxuur88.js');
 var star2 = require('./star2-R146a27p.js');
 var cancel = require('./cancel-De6vslRA.js');
 

package/dist/cjs/salla-maintenance-alert.cjs.entry.js

@@ -3,7 +3,7 @@
  */
 'use strict';
 
-var index = require('./index-CHRvLWS8.js');
+var index = require('./index-Bxxuur88.js');
 var cancel = require('./cancel-De6vslRA.js');
 
 const sallaMaintenanceAlertCss = ".s-maintenance-alert-wrapper{display:flex;min-height:40px;width:100%;flex-direction:row;align-items:center;justify-content:center;--tw-bg-opacity:1;background-color:rgba(26, 38, 61, var(--tw-bg-opacity));padding:0.25rem 0.5rem;--tw-text-opacity:1;color:rgba(255, 255, 255, var(--tw-text-opacity))}.s-maintenance-alert-wrapper a{transition:0.35s cubic-bezier(0.2, 1, 0.3, 1)}.s-maintenance-alert-wrapper *{color:inherit}@media (min-width: 640px){.s-maintenance-alert-wrapper{padding-left:2rem;padding-right:2rem}}.s-maintenance-alert-content{margin-top:1rem;margin-bottom:1rem;display:flex;width:100%;align-items:center;justify-content:space-between}@media (min-width: 640px){.s-maintenance-alert-content{padding-left:2rem;padding-right:2rem}}.s-maintenance-alert-container{display:flex;align-items:center}.s-maintenance-alert-icon{margin-right:1.25rem;display:none}@media (min-width: 640px){.s-maintenance-alert-icon{display:block}}.s-maintenance-alert-text h2{margin-bottom:0.5rem;font-size:0.875rem;font-weight:700;line-height:1.4}@media (min-width: 640px){.s-maintenance-alert-text h2{font-size:1.5rem;line-height:2rem}}.s-maintenance-alert-text p{margin:0px;text-align:right;font-size:10px;line-height:1.2}@media (min-width: 640px){.s-maintenance-alert-text p{text-align:center;font-size:0.75rem;line-height:1}}.s-maintenance-alert-btn{position:relative;margin-left:4px;margin-right:4px;display:inline-block;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;user-select:none;white-space:nowrap;border-radius:0.125rem;border-width:1px;--tw-border-opacity:1;border-color:rgba(93, 213, 196, var(--tw-border-opacity));--tw-bg-opacity:1;background-color:rgba(93, 213, 196, var(--tw-bg-opacity));padding:0.5rem;text-align:center;vertical-align:middle;font-size:0.875rem;font-weight:400;line-height:1.4;--tw-text-opacity:1;color:rgba(255, 255, 255, var(--tw-text-opacity))}.s-maintenance-alert-btn:hover{--tw-bg-opacity:1;background-color:rgba(53, 203, 181, var(--tw-bg-opacity))}.s-maintenance-alert-btn *{pointer-events:none}[dir=rtl] .s-maintenance-alert-btn{margin-left:1.25rem;margin-right:0}@media (min-width: 640px){.s-maintenance-alert-btn{padding:0.5rem 1rem}}";

package/dist/cjs/salla-menu.cjs.entry.js

@@ -3,7 +3,7 @@
  */
 'use strict';
 
-var index = require('./index-CHRvLWS8.js');
+var index = require('./index-Bxxuur88.js');
 
 const sallaMenuCss = ":host{display:block}";
 

package/dist/cjs/salla-metadata.cjs.entry.js

@@ -3,7 +3,7 @@
  */
 'use strict';
 
-var index = require('./index-CHRvLWS8.js');
+var index = require('./index-Bxxuur88.js');
 
 const sallaMetadataCss = "";
 

package/dist/cjs/salla-multiple-bundle-product-cart_2.cjs.entry.js

@@ -3,13 +3,14 @@
  */
 'use strict';
 
-var index = require('./index-CHRvLWS8.js');
+var index = require('./index-Bxxuur88.js');
 
 const sallaMultipleBundleProductCartCss = "";
 
 const SallaMultipleBundleProductCart = class {
     constructor(hostRef) {
         index.registerInstance(this, hostRef);
+        /** The list of sections belonging to a bundle product. */
         this.sections = [];
         this.itemNumber = '';
     }
@@ -35,7 +36,7 @@ const SallaMultipleBundleProductCart = class {
         return (index.h("div", { slot: "html", class: "s-multiple-bundle-product-cart-header-wrapper" }, index.h("div", { class: `s-multiple-bundle-product-cart-header ${hasOptions ? '' : 's-multiple-bundle-product-cart-header-no-options'}` }, index.h("div", { class: "s-multiple-bundle-product-cart-header-content" }, index.h("a", { href: product?.url, class: "s-multiple-bundle-product-cart-header-image-wrapper" }, index.h("img", { src: product?.image?.url, alt: product?.image?.alt || product?.name, class: "s-multiple-bundle-product-cart-header-image" })), index.h("div", { class: "s-multiple-bundle-product-cart-header-content-details" }, index.h("h2", { class: "s-multiple-bundle-product-cart-header-content-details-title" }, index.h("a", { href: product?.url, class: "s-multiple-bundle-product-cart-header-content-details-title-link" }, product?.name)), index.h("div", { class: "s-multiple-bundle-product-cart-header-content-details-price" }, index.h("span", { class: "s-multiple-bundle-product-cart-header-content-details-price-regular" }, index.h("span", { innerHTML: product?.price ? salla.money(product?.price) : '' })), product?.sale_price > 0 && (index.h("span", { class: "s-multiple-bundle-product-cart-header-content-details-price-sale" }, index.h("span", { innerHTML: salla.money(product?.sale_price) })))), product?.quantity_in_group > 0 && product?.quantity !== 0 && (index.h("p", { class: "s-multiple-bundle-product-cart-header-content-details-quantity" }, index.h("span", null, salla.lang.get('pages.products.number_of_pieces')), index.h("span", null, product?.quantity_in_group))))), !hasOptions && (index.h("div", { class: "s-multiple-bundle-product-cart-header-remove-button" }, this.renderRemoveButton(sectionId, product, false))))));
     }
     render() {
-        return (index.h(index.Host, { key: '7f3424f8320337bad8af0fbb6aa5c72045e97b9c', class: "s-multiple-bundle-product-wrapper" }, index.h("div", { key: '6b4150c73d5296043f216f3f48f9289e2ce10aa7', class: "s-multiple-bundle-product-wrapper-sections" }, this.sections.map((section, sectionIndex) => {
+        return (index.h(index.Host, { key: '92c0fba176ee0d769f866a0ed50a1b27d43e9717', class: "s-multiple-bundle-product-wrapper" }, index.h("div", { key: '3184473ec9399f29fa225287d6adeea109b097ec', class: "s-multiple-bundle-product-wrapper-sections" }, this.sections.map((section, sectionIndex) => {
             return section.products.map(product => {
                 const bundleContext = {
                     sectionId: section.id,
@@ -55,6 +56,7 @@ const sallaMultipleBundleProductDetailsCss = "";
 const SallaMultipleBundleProductDetails = class {
     constructor(hostRef) {
         index.registerInstance(this, hostRef);
+        /** The list of sections belonging to a bundle product. */
         this.sections = [];
         // store selected product IDs per section (can be string or number)
         this.selectedProducts = {};
@@ -207,10 +209,10 @@ const SallaMultipleBundleProductDetails = class {
         }
     }
     render() {
-        return (index.h(index.Host, { key: 'c6e5ac7da584c20126ed35cfd971085a95a89cbe', class: "s-multiple-bundle-product-wrapper" }, index.h("div", { key: 'f4047046f55c4aa5b8bab84983d16a7326fae8b0', class: "s-multiple-bundle-product-wrapper-sections" }, this.sections.map((section, index$1) => {
+        return (index.h(index.Host, { key: '9d632fa75f2dd987a03a8d8c417e520503b4b71d', class: "s-multiple-bundle-product-wrapper" }, index.h("div", { key: '05517aff0eae9141a8f1f7fa0d72044fbbd46af9', class: "s-multiple-bundle-product-wrapper-sections" }, this.sections.map((section, index$1) => {
             const selectedCount = this.selectedProducts[section.id]?.size || 0;
             return (index.h("salla-accordion", { key: section.id, collapsed: index$1 === 0 ? false : true }, index.h("salla-accordion-head", null, this.renderAccordionHeader(section, selectedCount)), index.h("salla-accordion-body", null, index.h("salla-multiple-bundle-product-slider", { section: section, sectionIndex: index$1, selectedProducts: this.selectedProducts, onProductSelected: this.handleBundleSliderProductSelected, onProductOptionsSelected: this.handleBundleSliderProductOptionsSelected }))));
-        })), index.h("salla-multiple-bundle-product-options-modal", { key: '8dc76d11e8876456b11b987c512cdaaca37eb562' })));
+        })), index.h("salla-multiple-bundle-product-options-modal", { key: 'ac01f882d3e8268b41032857816ba9481918f484' })));
     }
     get host() { return index.getElement(this); }
 };

package/dist/cjs/salla-multiple-bundle-product-options-modal_2.cjs.entry.js

@@ -3,7 +3,7 @@
  */
 'use strict';
 
-var index = require('./index-CHRvLWS8.js');
+var index = require('./index-Bxxuur88.js');
 var keyboard_arrow_right = require('./keyboard_arrow_right-BayM_Il2.js');
 
 const sallaMultipleBundleProductOptionsModalCss = ":host{display:block}";
@@ -41,6 +41,7 @@ const SallaMultipleBundleProductOptionsModal = class {
         this.validationErrors = [];
         this.hasUnsavedChanges = false;
     }
+    /** Opens the modal manually. */
     async open() {
         if (!this.modal) {
             requestAnimationFrame(() => this.open());
@@ -65,11 +66,13 @@ const SallaMultipleBundleProductOptionsModal = class {
             this.isLoading = false;
         }, 300);
     }
+    /** Closes the modal manually. */
     async close() {
         if (this.modal) {
             this.modal.close();
         }
     }
+    /** Refreshes the internal options tracking state manually. */
     async refreshOptionsState() {
         // Force re-render by updating the component state
         this.selectedOptions = { ...this.selectedOptions };
@@ -464,7 +467,7 @@ const SallaMultipleBundleProductOptionsModal = class {
         const cacheKey = this.generateCacheKey(this.sectionId, this.productIndex, productId);
         const resetToken = this.optionsResetTokens[cacheKey] || 0;
         const isDisabled = this.isLoading || optionsWithSelectedState.some(opt => opt.details.some(d => d.is_selected && d.is_out === true));
-        return (index.h(index.Host, { key: 'd5a4e884d29cd964b27042ca0d0c664cbf6bc511' }, index.h("salla-modal", { key: '674c32ce9a987aac09d192c10692947c16464072', isLoading: this.isLoading, ref: el => (this.modal = el), width: "md", centered: false, id: `s-multiple-bundle-product-options-modal-options-${productId}`, class: "s-multiple-bundle-product-options-modal-wrapper" }, index.h("div", { key: 'ab3a01faa218da40362c75f25d051938db784e35', slot: "loading" }, index.h("salla-skeleton", { key: '25c625ef2090e6cdb556e494b29670091ef1fa9e', height: "100%", width: "100%" })), this.product?.images && this.product?.images.length > 0 && (index.h("salla-slider", { key: '1d1962bba5311141a83dadd51536b7fb7bac2b70', id: `details-slider-${this.product?.id}`, type: "thumbs", loop: false, "auto-height": true, "listen-to-thumbnails-option": true, showThumbsControls: false, controlsOuter: false, showControls: false, class: "s-multiple-bundle-product-options-modal-slider", verticalThumbs: true, thumbsConfig: {
+        return (index.h(index.Host, { key: '357005ce9302183eeeec3238ebde74b99c5f7d88' }, index.h("salla-modal", { key: '95e4f37061229e8359a269b031942d507a43ea25', isLoading: this.isLoading, ref: el => (this.modal = el), width: "md", centered: false, id: `s-multiple-bundle-product-options-modal-options-${productId}`, class: "s-multiple-bundle-product-options-modal-wrapper" }, index.h("div", { key: 'b1525824f938c5af85a9ca043d2acf86e8773e6a', slot: "loading" }, index.h("salla-skeleton", { key: '7e71698646e7ec119afbed2fca9dab79c4fe2991', height: "100%", width: "100%" })), this.product?.images && this.product?.images.length > 0 && (index.h("salla-slider", { key: 'cd9042d00b0a237afd8dfe7ad4ed7032e298eb39', id: `details-slider-${this.product?.id}`, type: "thumbs", loop: false, "auto-height": true, "listen-to-thumbnails-option": true, showThumbsControls: false, controlsOuter: false, showControls: false, class: "s-multiple-bundle-product-options-modal-slider", verticalThumbs: true, thumbsConfig: {
                 centeredSlides: true,
                 centeredSlidesBounds: true,
                 slidesPerView: Math.min(5, Math.max(1, this.product?.images.length)),
@@ -472,13 +475,13 @@ const SallaMultipleBundleProductOptionsModal = class {
                 watchSlidesProgress: true,
                 direction: 'vertical',
                 spaceBetween: 10,
-            } }, index.h("div", { key: 'e6ca00bd18b6c0a911c00dad57e0ac4fd5f0a769', slot: "items" }, this.product?.images &&
+            } }, index.h("div", { key: '81773392ee6167f0daf780637e15bef9b7b2f2c7', slot: "items" }, this.product?.images &&
             this.product?.images.map((image, index$1) => (index.h("div", { key: index$1, class: "swiper-slide" }, index.h("img", { src: image.url, alt: image.alt || `${this.product?.name} - Image ${index$1 + 1}`, loading: "lazy", onError: e => {
                     e.target.style.display = 'none';
-                } }))))), this.product?.images && this.product?.images.length > 1 && (index.h("div", { key: '08481d15b20bb0b522a619e0d223019ff9ee76ac', slot: "thumbs" }, this.product?.images &&
+                } }))))), this.product?.images && this.product?.images.length > 1 && (index.h("div", { key: '2942ab32e0e28e6213b2a1d177e36c84136beaef', slot: "thumbs" }, this.product?.images &&
             this.product?.images.map((image, index$1) => (index.h("div", { key: index$1, "data-caption": `${this.product?.name} - Image ${index$1 + 1}` }, index.h("img", { src: image.url, loading: "eager", class: "s-multiple-bundle-product-options-modal-slider-thumb", title: `${this.product?.name} - ${index$1 + 1}`, alt: image.alt || `${this.product?.name} - ${index$1 + 1}`, onError: e => {
                     e.target.style.display = 'none';
-                } })))))))), index.h("salla-product-options", { options: JSON.stringify(optionsWithSelectedState), key: `${cacheKey}-reset-${resetToken}`, "product-id": productId, "unique-key": `${cacheKey}-reset-${resetToken}` }), index.h("div", { key: '8aa9b8173e758821960f37093555227024b3190f', slot: "footer" }, index.h("div", { key: '7324d3b90689871d779ae0a95a8a4ce4e5c18fe7', class: "s-multiple-bundle-product-options-modal-footer" }, index.h("salla-button", { key: '2205ab886613aaa5426f117efb56b7e1ae103049', onClick: e => this.onSave(e), loading: this.isLoading, disabled: isDisabled }, this.isLoading
+                } })))))))), index.h("salla-product-options", { options: JSON.stringify(optionsWithSelectedState), key: `${cacheKey}-reset-${resetToken}`, "product-id": productId, "unique-key": `${cacheKey}-reset-${resetToken}` }), index.h("div", { key: 'e3658d39d7462e1ba8c2099625d9a659541f6b2a', slot: "footer" }, index.h("div", { key: '8e03e9230c55b9ac6143e37629946e66daf47835', class: "s-multiple-bundle-product-options-modal-footer" }, index.h("salla-button", { key: 'feca5790f828f7b29de3cba4e3a54d772a7a94c5', onClick: e => this.onSave(e), loading: this.isLoading, disabled: isDisabled }, this.isLoading
             ? salla.lang.get('common.elements.saving')
             : salla.lang.get('common.elements.save')))))));
     }
@@ -496,6 +499,7 @@ const SallaMultipleBundleProductSlider = class {
         index.registerInstance(this, hostRef);
         this.productSelected = index.createEvent(this, "productSelected");
         this.productOptionsSelected = index.createEvent(this, "productOptionsSelected");
+        /** A dictionary tracking which product IDs are currently selected per section. */
         this.selectedProducts = {};
         this.savedOptionsByInstance = {};
         this.handleProductClick = (product, productIndex) => {
@@ -576,7 +580,7 @@ const SallaMultipleBundleProductSlider = class {
         return `bundle[${sectionId}][${productIndex}][id]`;
     }
     render() {
-        return (index.h(index.Host, { key: '07af0a15e38a4c00450bf132a7f91c647dc7ba04' }, index.h("salla-slider", { key: '6a34d8659c90d6ed485149f96ad7c706122f4949', type: "carousel", controlsOuter: false, showControls: false, id: `accordion-multiple-bundle-product-${this.section.id}`, pagination: true, class: "s-multiple-bundle-product-wrapper-slider", sliderConfig: { spaceBetween: 0 } }, index.h("div", { key: '2aef73459325f4be492791d045b67520d210ddf7', slot: "items" }, this?.section?.products?.map((product, productIndex) => {
+        return (index.h(index.Host, { key: '336a3bcf504a178ee207b40b3b7fac5d26e00f91' }, index.h("salla-slider", { key: '004d1c3f644bfd015efe2ffc21a78e912c5d0647', type: "carousel", controlsOuter: false, showControls: false, id: `accordion-multiple-bundle-product-${this.section.id}`, pagination: true, class: "s-multiple-bundle-product-wrapper-slider", sliderConfig: { spaceBetween: 0 } }, index.h("div", { key: 'fda4544764b9bf2eb95d408179c1abc252f50243', slot: "items" }, this?.section?.products?.map((product, productIndex) => {
             const isChecked = this.selectedProducts[this.section.id]?.has(product.id) || false;
             const hasSavedOptions = this.savedOptionsByInstance[this.getProductInstanceKey(this.section.id, productIndex)];
             const optionsButtonLabel = hasSavedOptions

package/dist/cjs/salla-multiple-bundle-product.cjs.entry.js

@@ -3,7 +3,7 @@
  */
 'use strict';
 
-var index = require('./index-CHRvLWS8.js');
+var index = require('./index-Bxxuur88.js');
 
 const sallaMultipleBundleProductCss = ":host{display:block}";
 
@@ -58,7 +58,7 @@ const SallaMultipleBundleProduct = class {
         this.parseProducts(this.bundleSections);
     }
     render() {
-        return (index.h(index.Host, { key: '05c5e7d3b7d18f23e66f3d95a04f16ab266e99a1', class: "s-multiple-bundle-product-wrapper" }, this.isCartPage() ? this.renderCartPage() : this.renderDetailsPage()));
+        return (index.h(index.Host, { key: '2a4510d1ccd3dc840d25a288cb0788a7dd23672c', class: "s-multiple-bundle-product-wrapper" }, this.isCartPage() ? this.renderCartPage() : this.renderDetailsPage()));
     }
     static get watchers() { return {
         "bundleSections": ["parseProducts"]

package/dist/cjs/salla-notification-item.cjs.entry.js

@@ -3,7 +3,7 @@
  */
 'use strict';
 
-var index = require('./index-CHRvLWS8.js');
+var index = require('./index-Bxxuur88.js');
 
 const sallaNotificationsCss = "";
 

package/dist/cjs/salla-notifications.cjs.entry.js

@@ -3,7 +3,7 @@
  */
 'use strict';
 
-var index = require('./index-CHRvLWS8.js');
+var index = require('./index-Bxxuur88.js');
 var Helper = require('./Helper-CU4Xuiki.js');
 require('./anime.es-BqW8JHZi.js');
 

package/dist/cjs/salla-offer-modal.cjs.entry.js

@@ -3,7 +3,7 @@
  */
 'use strict';
 
-var index = require('./index-CHRvLWS8.js');
+var index = require('./index-Bxxuur88.js');
 var specialDiscount = require('./special-discount-DC2oXurL.js');
 
 var Tag = `<svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32">

package/dist/cjs/salla-offer.cjs.entry.js

@@ -3,7 +3,7 @@
  */
 'use strict';
 
-var index = require('./index-CHRvLWS8.js');
+var index = require('./index-Bxxuur88.js');
 
 var PageType;
 (function (PageType) {

package/dist/cjs/salla-order-details-multiple-bundle-product.cjs.entry.js

@@ -3,7 +3,7 @@
  */
 'use strict';
 
-var index = require('./index-CHRvLWS8.js');
+var index = require('./index-Bxxuur88.js');
 
 const sallaOrderDetailsMultipleBundleProductCss = "";
 

package/dist/cjs/salla-order-details-options.cjs.entry.js

@@ -3,7 +3,7 @@
  */
 'use strict';
 
-var index = require('./index-CHRvLWS8.js');
+var index = require('./index-Bxxuur88.js');
 
 var copyIcon = `<!-- Generated by IcoMoon.io -->
 <svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32">

package/dist/cjs/salla-order-details.cjs.entry.js

@@ -3,7 +3,7 @@
  */
 'use strict';
 
-var index = require('./index-CHRvLWS8.js');
+var index = require('./index-Bxxuur88.js');
 
 const sallaOrderDetailsCss = "";
 
@@ -39,7 +39,7 @@ const SallaOrderDetails = class {
         ];
     }
     render() {
-        return index.h(index.Host, { key: '7cfbdb28ff84c96aadda4992eb99ae54cd211937', class: "s-order-details-wrapper" }, this.renderOrderDetailsContent());
+        return index.h(index.Host, { key: 'a32d03172c884c8431e592b35b3f6560e3055555', class: "s-order-details-wrapper" }, this.renderOrderDetailsContent());
     }
     static get watchers() { return {
         "orderDetails": ["parseOrderDetailsData"]

package/dist/cjs/salla-order-summary.cjs.entry.js

@@ -3,7 +3,7 @@
  */
 'use strict';
 
-var index = require('./index-CHRvLWS8.js');
+var index = require('./index-Bxxuur88.js');
 var check = require('./check-x3w3-gpj.js');
 
 var iconFileArchive = `<!-- Generated by IcoMoon.io -->

package/dist/cjs/salla-order-totals-card.cjs.entry.js

@@ -3,7 +3,7 @@
  */
 'use strict';
 
-var index = require('./index-CHRvLWS8.js');
+var index = require('./index-Bxxuur88.js');
 
 const sallaOrderTotalsCardCss = ":host{display:block}";
 

package/dist/cjs/salla-orders.cjs.entry.js

@@ -3,7 +3,7 @@
  */
 'use strict';
 
-var index = require('./index-CHRvLWS8.js');
+var index = require('./index-Bxxuur88.js');
 var Helper = require('./Helper-CU4Xuiki.js');
 require('./anime.es-BqW8JHZi.js');