@salla.sa/twilight-components 2.14.291 → 2.14.292

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

@@ -3,7 +3,7 @@
  */
 'use strict';
 
-var index = require('./index-CD__TuQ1.js');
+var index = require('./index-CCofAgHa.js');
 var anime_es = require('./anime.es-BqW8JHZi.js');
 var specialDiscount = require('./special-discount-OVG_9Kf9.js');
 var check = require('./check-CLRvuniI.js');
@@ -3543,13 +3543,13 @@ const SallaFileUpload = class {
             return;
         try {
             const [FilePondModule, FilePondPluginFileValidateSize, FilePondPluginImageExifOrientation, FilePondPluginImagePreview, FilePondPluginImageEdit, FilePondPluginFileValidateType, FilePondPluginFilePoster] = await Promise.all([
-                Promise.resolve().then(function () { return require('./filepond-l0In8JzI.js'); }).then(function (n) { return n.filepond; }),
-                Promise.resolve().then(function () { return require('./filepond-plugin-file-validate-size-asc4GviL.js'); }).then(function (n) { return n.filepondPluginFileValidateSize; }),
-                Promise.resolve().then(function () { return require('./filepond-plugin-image-exif-orientation-D2TaYNJz.js'); }).then(function (n) { return n.filepondPluginImageExifOrientation; }),
-                Promise.resolve().then(function () { return require('./filepond-plugin-image-preview-ZhHJTUGt.js'); }).then(function (n) { return n.filepondPluginImagePreview; }),
-                Promise.resolve().then(function () { return require('./filepond-plugin-image-edit-8yC2fM_b.js'); }).then(function (n) { return n.filepondPluginImageEdit; }),
-                Promise.resolve().then(function () { return require('./filepond-plugin-file-validate-type-MAcIW_lX.js'); }).then(function (n) { return n.filepondPluginFileValidateType; }),
-                Promise.resolve().then(function () { return require('./filepond-plugin-file-poster--TMslLdw.js'); }).then(function (n) { return n.filepondPluginFilePoster; })
+                Promise.resolve().then(function () { return require('./filepond-B9sLUCBe.js'); }).then(function (n) { return n.filepond; }),
+                Promise.resolve().then(function () { return require('./filepond-plugin-file-validate-size-DF8uFSha.js'); }).then(function (n) { return n.filepondPluginFileValidateSize; }),
+                Promise.resolve().then(function () { return require('./filepond-plugin-image-exif-orientation-DxXsE_ZP.js'); }).then(function (n) { return n.filepondPluginImageExifOrientation; }),
+                Promise.resolve().then(function () { return require('./filepond-plugin-image-preview-2v59y8Fv.js'); }).then(function (n) { return n.filepondPluginImagePreview; }),
+                Promise.resolve().then(function () { return require('./filepond-plugin-image-edit-C-0ziNsz.js'); }).then(function (n) { return n.filepondPluginImageEdit; }),
+                Promise.resolve().then(function () { return require('./filepond-plugin-file-validate-type-Dva6K_7l.js'); }).then(function (n) { return n.filepondPluginFileValidateType; }),
+                Promise.resolve().then(function () { return require('./filepond-plugin-file-poster-DkzerIBW.js'); }).then(function (n) { return n.filepondPluginFilePoster; })
             ]);
             this.FilePond = FilePondModule;
             // Register plugins
@@ -6434,7 +6434,7 @@ const SallaMultipleBundleProductDetails = class {
                 this.selectedProducts[sectionId].delete(productId);
                 // Clear form data and modal options for this product in this specific section
                 this.clearProductFormData(productId, sectionId);
-                this.clearProductModalOptions(productId);
+                this.clearProductModalOptions(productId, sectionId);
             }
             else {
                 // Product is being selected
@@ -6513,10 +6513,25 @@ const SallaMultipleBundleProductDetails = class {
         }
     }
     // Clear modal options state for a specific product
-    clearProductModalOptions(productId) {
+    clearProductModalOptions(productId, sectionId) {
+        let sectionIndex = null;
+        let productIndex = null;
+        if (sectionId != null) {
+            sectionIndex = this.sections.findIndex(section => section.id == sectionId);
+            if (sectionIndex > -1) {
+                const section = this.sections[sectionIndex];
+                if (section) {
+                    const foundIndex = section.products?.findIndex(product => product.id == productId);
+                    productIndex = typeof foundIndex === 'number' && foundIndex > -1 ? foundIndex : null;
+                }
+            }
+        }
         // Emit event to notify modal to reset its state for this product
         salla.event.dispatch('multiple-bundle-product-modal::clear-options', {
             productId,
+            sectionId,
+            sectionIndex,
+            productIndex,
         });
     }
     renderAccordionHeader(section, selectedCount) {
@@ -6553,10 +6568,10 @@ const SallaMultipleBundleProductDetails = class {
         }
     }
     render() {
-        return (index.h(index.Host, { key: '01b95de8e1add5136b0fbaa0ceff430acff73f63', class: "s-multiple-bundle-product-wrapper" }, index.h("div", { key: '7736f0ab829921931872dc817815344fff90efe6', class: "s-multiple-bundle-product-wrapper-sections" }, this.sections.map((section, index$1) => {
+        return (index.h(index.Host, { key: '118e5c2badcec4329da881ba87ce6c6771175c14', class: "s-multiple-bundle-product-wrapper" }, index.h("div", { key: '6c2033af8d144c39cfa4f6b67ffd91d38fcd7bdf', 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 === 1 ? true : false }, 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: '1cf3eb8fdce83b3ebbdfa13f422490b20e370e8e' })));
+            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: 'a5d0c1fb53d38015eebbcb3a203aefb6b9b540af' })));
     }
     get host() { return index.getElement(this); }
 };
@@ -6574,6 +6589,7 @@ const SallaMultipleBundleProductOptionsModal = class {
         this.sectionIndex = 0;
         this.productIndex = 0;
         this.selectedOptions = {};
+        this.optionsResetTokens = {};
         this.isLoading = false;
         this.hasUnsavedChanges = false;
         this.validationErrors = [];
@@ -6630,17 +6646,21 @@ const SallaMultipleBundleProductOptionsModal = class {
         this.selectedOptions = { ...this.selectedOptions };
     }
     componentDidLoad() {
-        salla.event.on('multiple-bundle-product-modal::open', (data) => {
+        this.modalOpenListener = (data) => {
             this.product = data.product;
             this.sectionId = data.sectionId || null;
             this.sectionIndex = data.sectionIndex || 0;
             this.productIndex = data.productIndex || 0;
             this.open();
-        });
+        };
+        salla.event.on('multiple-bundle-product-modal::open', this.modalOpenListener);
         // Listen for clear-options event when a product is deselected
-        salla.event.on('multiple-bundle-product-modal::clear-options', (data) => {
-            this.clearProductOptions(data.productId);
-        });
+        this.clearOptionsListener = (data) => {
+            if (!data || !data.productId)
+                return;
+            this.clearProductOptions(data.productId, data.sectionId, data.productIndex);
+        };
+        salla.event.on('multiple-bundle-product-modal::clear-options', this.clearOptionsListener);
         // Create and store the option change listener for proper cleanup
         this.optionChangeListener = (e) => {
             const { productId, option, detail } = e.detail;
@@ -6665,60 +6685,16 @@ const SallaMultipleBundleProductOptionsModal = class {
                 // Extract section info from the checkbox name: bundle[sectionId][productIndex][id]
                 const nameMatch = target.name.match(/^bundle\[([^\]]+)\]\[([^\]]+)\]\[id\]$/);
                 if (nameMatch && !target.checked) {
-                    // Product was deselected, clear its cached options
                     const [, sectionId, productIndex] = nameMatch;
                     const productId = target.value;
-                    // Prevent the immediate event to ensure cleanup happens first
-                    e.preventDefault();
-                    e.stopPropagation();
-                    // Ensure the checkbox is actually unchecked
-                    target.checked = false;
-                    // Generate the same cache key used by the modal
-                    const cacheKey = this.generateCacheKey(sectionId, parseInt(productIndex), productId);
-                    // Clear the cached options for this product
-                    const updatedSelectedOptions = { ...this.selectedOptions };
-                    delete updatedSelectedOptions[cacheKey];
-                    this.selectedOptions = updatedSelectedOptions;
-                    // Force re-render of the modal if it's currently open for this product
-                    if (this.product && this.product.id == productId) {
-                        this.selectedOptions = { ...this.selectedOptions };
-                    }
                     const form = this.host.closest('form');
-                    if (form) {
-                        const productInputPattern = `bundle[${sectionId}][${productIndex}]`;
-                        // Get all form inputs and filter manually
-                        const allInputs = Array.from(form.querySelectorAll('input'));
-                        const matchingInputs = allInputs.filter(input => input.name && input.name.startsWith(productInputPattern));
-                        // Process matching inputs for removal
-                        matchingInputs.forEach(el => {
-                            // Don't remove the visible checkbox that was just unchecked
-                            if (el !== target && (el.type === 'hidden' || el.hasAttribute('data-product-id'))) {
-                                el.remove();
-                            }
-                        });
-                        // Method 2: Find inputs by data-product-id BUT only within the same section/productIndex
-                        const dataProductInputs = allInputs.filter(input => {
-                            // Must have data-product-id matching the productId
-                            if (input.getAttribute('data-product-id') !== String(productId)) {
-                                return false;
-                            }
-                            // Must also be within the same section/productIndex pattern
-                            return input.name && input.name.startsWith(productInputPattern);
-                        });
-                        // Process inputs with matching section/productIndex and productId for removal
-                        dataProductInputs.forEach(el => {
-                            if (el !== target) {
-                                el.remove();
-                            }
-                        });
-                        // Method 3: Removed broader search to prevent removing inputs from other products
-                        // The cleanup is now more precise and only removes inputs for the specific product
-                        // Trigger form change event after cleanup is complete
-                        setTimeout(() => {
-                            const changeEvent = new window.Event('change', { bubbles: true });
-                            form.dispatchEvent(changeEvent);
-                        }, 50); // Small delay to ensure cleanup is complete
-                    }
+                    this.cleanupProductDeselection({
+                        sectionId,
+                        productIndex: parseInt(productIndex, 10),
+                        productId,
+                        form,
+                        uncheckedInput: target,
+                    });
                 }
             }
         };
@@ -6730,6 +6706,37 @@ const SallaMultipleBundleProductOptionsModal = class {
         if (this.checkboxChangeListener) {
             document.removeEventListener('change', this.checkboxChangeListener);
         }
+        if (this.optionChangeListener) {
+            salla.event.off('product-options::change', this.optionChangeListener);
+        }
+        if (this.modalOpenListener) {
+            salla.event.off('multiple-bundle-product-modal::open', this.modalOpenListener);
+        }
+        if (this.clearOptionsListener) {
+            salla.event.off('multiple-bundle-product-modal::clear-options', this.clearOptionsListener);
+        }
+    }
+    cleanupProductDeselection(params) {
+        const { sectionId, productIndex, productId, form, uncheckedInput } = params;
+        this.clearProductOptions(productId, sectionId, productIndex);
+        if (form) {
+            const productInputPattern = `bundle[${sectionId}][${productIndex}]`;
+            Array.from(form.querySelectorAll(`input[name^="${productInputPattern}"]`)).forEach(input => {
+                if (input === uncheckedInput) {
+                    return;
+                }
+                const shouldRemoveHidden = input.type === 'hidden';
+                const shouldRemoveByDataset = input.getAttribute('data-product-id') === String(productId) &&
+                    input.name?.startsWith(productInputPattern);
+                if (shouldRemoveHidden || shouldRemoveByDataset) {
+                    input.remove();
+                }
+            });
+            requestAnimationFrame(() => {
+                const changeEvent = new window.Event('change', { bubbles: true });
+                form.dispatchEvent(changeEvent);
+            });
+        }
     }
     generateFormInputName(sectionId, productIndex, optionParentId) {
         return `bundle[${sectionId}][${productIndex}][options][${optionParentId}]`;
@@ -6756,17 +6763,37 @@ const SallaMultipleBundleProductOptionsModal = class {
         }
     }
     // Clear options state for a specific product
-    clearProductOptions(productId) {
-        // Generate cache key for this specific product in current section context
-        const cacheKey = this.generateCacheKey(this.sectionId, this.productIndex, productId);
-        // Remove the product from selectedOptions using the cache key
+    clearProductOptions(productId, sectionId, productIndex) {
         const updatedSelectedOptions = { ...this.selectedOptions };
-        delete updatedSelectedOptions[cacheKey];
+        if (sectionId != null && productIndex != null && !Number.isNaN(productIndex)) {
+            const cacheKey = this.generateCacheKey(sectionId, productIndex, productId);
+            delete updatedSelectedOptions[cacheKey];
+            this.bumpOptionsResetToken(cacheKey);
+        }
+        else {
+            const productSuffix = `-${String(productId)}`;
+            const affectedKeys = [];
+            Object.keys(updatedSelectedOptions).forEach(key => {
+                if (key.endsWith(productSuffix)) {
+                    delete updatedSelectedOptions[key];
+                    affectedKeys.push(key);
+                }
+            });
+            affectedKeys.forEach(key => this.bumpOptionsResetToken(key));
+        }
         this.selectedOptions = updatedSelectedOptions;
         // Reset validation errors and unsaved changes
         this.validationErrors = [];
         this.hasUnsavedChanges = false;
     }
+    bumpOptionsResetToken(cacheKey) {
+        if (!cacheKey)
+            return;
+        this.optionsResetTokens = {
+            ...this.optionsResetTokens,
+            [cacheKey]: (this.optionsResetTokens[cacheKey] || 0) + 1,
+        };
+    }
     async handleOptionChange(productId, option, detail) {
         const cacheKey = this.generateCacheKey(this.sectionId, this.productIndex, productId);
         // Get the current state from the component to ensure we have the latest selections
@@ -6961,6 +6988,8 @@ const SallaMultipleBundleProductOptionsModal = class {
             this.optionsSaved.emit({
                 productId: Number(productId),
                 selectedOptions,
+                sectionId: this.sectionId,
+                productIndex: this.productIndex,
             });
             // Emit product selected event to check the card
             if (this.sectionId) {
@@ -7007,7 +7036,9 @@ const SallaMultipleBundleProductOptionsModal = class {
     render() {
         const productId = this.product?.id;
         const optionsWithSelectedState = this.getOptionsWithSelectedState();
-        return (index.h(index.Host, { key: 'f48867c1730d142b1e55ddb4442c7e7d789a35bb' }, index.h("salla-modal", { key: '62196cd41c3979ca5e71327d9aad450a819a45ec', 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: 'feee0e09d5f1dbb19f02b8c109f43e7dc5d1dad8', slot: "loading" }, index.h("salla-skeleton", { key: '149debcb4852d4096613721a202f4079439abf0a', height: "100%", width: "100%" })), this.product?.images && this.product?.images.length > 0 && (index.h("salla-slider", { key: '591045fe1d3c9e30bb53a927d3e4d62b54623503', 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: {
+        const cacheKey = this.generateCacheKey(this.sectionId, this.productIndex, productId);
+        const resetToken = this.optionsResetTokens[cacheKey] || 0;
+        return (index.h(index.Host, { key: 'ce4cec97975d0aef32b50a13237a2d64701d8e9f' }, index.h("salla-modal", { key: 'cda08db7768f0b987a9569ca1170b059a58a417e', 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: 'd093204f6d85e7a874e0a69a826869e179aeafa4', slot: "loading" }, index.h("salla-skeleton", { key: '140608027bb0237b62eeb24d1eb5e47c5279c7e3', height: "100%", width: "100%" })), this.product?.images && this.product?.images.length > 0 && (index.h("salla-slider", { key: '807f2428e8219d9ab6e46163a5d03ad0b2e1b9a3', 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)),
@@ -7016,13 +7047,13 @@ const SallaMultipleBundleProductOptionsModal = class {
                 watchSlidesProgress: true,
                 direction: 'vertical',
                 spaceBetween: 10,
-            } }, index.h("div", { key: '1c4163f6d60a89b12d681e3df2db87a523ab092b', slot: "items" }, this.product?.images &&
+            } }, index.h("div", { key: 'f287bea52aa1e3c68debd0b68d011025ea3f9157', 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: '911fe5aad35ab3e733871bb185e7a89bb74b6da3', slot: "thumbs" }, this.product?.images &&
+                } }))))), this.product?.images && this.product?.images.length > 1 && (index.h("div", { key: '5d8064ef63c91a660a3b3267afb29e498ac76f4c', 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: `${this.sectionId}-${this.sectionIndex}-${productId}-persistent`, "product-id": productId }), index.h("div", { key: 'd107ebd058a3f349a5f2f05f4e2b685942d485d6', slot: "footer" }, index.h("div", { key: '01c7d37a91bb95eb830fcc3290a7cfde9ef7324b', class: "s-multiple-bundle-product-options-modal-footer" }, index.h("salla-button", { key: '402b9d19c176ebaec8bd7396b9bafe74b81fa456', onClick: e => this.onSave(e), loading: this.isLoading, disabled: this.isLoading }, 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: '2f6c7f133ccabd75bbb9e8649c056619ce754296', slot: "footer" }, index.h("div", { key: '1c04908511a480af63fc4e358393514c74967508', class: "s-multiple-bundle-product-options-modal-footer" }, index.h("salla-button", { key: '49fbad4b1e71004dc8fd6df5d0f1a61b1ef25b8d', onClick: e => this.onSave(e), loading: this.isLoading, disabled: this.isLoading }, this.isLoading
             ? salla.lang.get('common.elements.saving')
             : salla.lang.get('common.elements.save')))))));
     }
@@ -7041,6 +7072,7 @@ const SallaMultipleBundleProductSlider = class {
         this.productSelected = index.createEvent(this, "productSelected");
         this.productOptionsSelected = index.createEvent(this, "productOptionsSelected");
         this.selectedProducts = {};
+        this.savedOptionsByInstance = {};
         this.handleProductClick = (product, productIndex) => {
             // Find the checkbox input for this product
             const checkboxId = this.generateEventName(this.section.id, productIndex);
@@ -7053,6 +7085,10 @@ const SallaMultipleBundleProductSlider = class {
                 // Dispatch a change event to trigger form validation/submission
                 const changeEvent = new window.Event('change', { bubbles: true });
                 checkbox.dispatchEvent(changeEvent);
+                if (!checkbox.checked) {
+                    this.clearSavedOptionsState(this.section.id, productIndex);
+                    this.dispatchClearOptionsEvent(product, productIndex);
+                }
             }
             this.productSelected.emit({
                 product,
@@ -7066,17 +7102,66 @@ const SallaMultipleBundleProductSlider = class {
             });
         };
     }
+    getProductInstanceKey(sectionId, productIndex) {
+        return `${sectionId}::${productIndex}`;
+    }
+    dispatchClearOptionsEvent(product, productIndex) {
+        salla.event.dispatch('multiple-bundle-product-modal::clear-options', {
+            productId: product.id,
+            sectionId: this.section.id,
+            sectionIndex: this.sectionIndex,
+            productIndex,
+        });
+    }
+    handleOptionsSaved(event) {
+        const detail = event.detail;
+        if (!detail)
+            return;
+        const { sectionId, productIndex, selectedOptions } = detail;
+        if (sectionId == null || sectionId !== this.section?.id)
+            return;
+        if (productIndex == null || Number.isNaN(productIndex))
+            return;
+        const key = this.getProductInstanceKey(sectionId, productIndex);
+        const hasOptions = !!selectedOptions?.length;
+        if (hasOptions) {
+            this.savedOptionsByInstance = {
+                ...this.savedOptionsByInstance,
+                [key]: true,
+            };
+        }
+        else if (this.savedOptionsByInstance[key]) {
+            const updatedState = { ...this.savedOptionsByInstance };
+            delete updatedState[key];
+            this.savedOptionsByInstance = updatedState;
+        }
+    }
+    clearSavedOptionsState(sectionId, productIndex) {
+        const key = this.getProductInstanceKey(sectionId, productIndex);
+        if (!this.savedOptionsByInstance[key])
+            return;
+        const updatedState = { ...this.savedOptionsByInstance };
+        delete updatedState[key];
+        this.savedOptionsByInstance = updatedState;
+    }
     generateEventName(sectionId, productIndex) {
         return `bundle[${sectionId}][${productIndex}][id]`;
     }
     render() {
-        return (index.h(index.Host, { key: 'ec6fb04196690c5299da565d852ec77bbee6b1e3' }, index.h("salla-slider", { key: 'a7e79c2f27a53135e55e2708b5aa60d05f9ad21b', type: "carousel", controlsOuter: false, showControls: false, id: "accordion-multiple-bundle-product", pagination: true, class: "s-multiple-bundle-product-wrapper-slider", sliderConfig: {
+        return (index.h(index.Host, { key: '234e93258c3d7ca5d7dc08efb68743d042646706' }, index.h("salla-slider", { key: '451184823378e4ad0c9034d3af1b87373bcb7d20', type: "carousel", controlsOuter: false, showControls: false, id: "accordion-multiple-bundle-product", pagination: true, class: "s-multiple-bundle-product-wrapper-slider", sliderConfig: {
                 spaceBetween: 0,
-            } }, index.h("div", { key: 'c07aa5a0ee4fe106764b47dfa6d9f6509fb659cf', slot: "items" }, this?.section?.products?.map((product, productIndex) => {
+            } }, index.h("div", { key: '28c1acfd37a77059d4c177b787dca9deea47d123', slot: "items" }, this?.section?.products?.map((product, productIndex) => {
             const isChecked = this.selectedProducts[this.section.id]?.has(product.id) || false;
-            return (index.h("div", { class: `swiper-slide s-multiple-bundle-product-slide-one-third ${product.quantity == 0
+            const hasSavedOptions = this.savedOptionsByInstance[this.getProductInstanceKey(this.section.id, productIndex)];
+            const optionsButtonLabel = hasSavedOptions
+                ? salla.lang.getWithDefault('pages.products.edit_selected_options', 'تعديل الخيارات')
+                : salla.lang.get('pages.products.choose_from_options');
+            let optionsArrowIcon = salla.config.get('theme.is_rtl', true)
+                ? ArrowLeftIcon
+                : ArrowRightIcon;
+            return (index.h("div", { class: `s-multiple-bundle-product-slide-one-third ${product.quantity == 0
                     ? 's-multiple-bundle-product-slide-one-third-disabled'
-                    : ''}`, key: product.id }, index.h("div", { class: "s-multiple-bundle-product-card" }, index.h("div", { class: "s-multiple-bundle-product-image-wrapper", onClick: () => this.handleProductClick(product, productIndex) }, index.h("input", { id: this.generateEventName(this.section.id, productIndex), type: "checkbox", class: "s-multiple-bundle-product-checkbox", checked: isChecked, name: this.generateEventName(this.section.id, productIndex), value: product.id }), index.h("img", { src: product.image.url || salla.url.cdn('images/s-empty.png'), loading: "lazy", alt: product.image.alt || product.name, class: "s-multiple-bundle-product-image" })), index.h("div", { class: "s-multiple-bundle-product-content-wrapper" }, index.h("div", { class: "s-multiple-bundle-product-content" }, index.h("div", { class: "s-multiple-bundle-product-details" }, index.h("div", { class: "s-multiple-bundle-product-title-wrapper" }, index.h("h2", { class: "s-multiple-bundle-product-title" }, product.name)), index.h("div", { class: "s-multiple-bundle-product-price-wrapper" }, index.h("span", { class: "s-multiple-bundle-product-price" }, index.h("span", { innerHTML: salla.money(product.price) })), product.sale_price > 0 && (index.h("span", { class: "s-multiple-bundle-product-price-discount" }, index.h("span", { innerHTML: salla.money(product.sale_price) }))))), product.quantity_in_group > 0 && product.quantity !== 0 && (index.h("span", { class: "s-multiple-bundle-product-badge" }, salla.lang.get('pages.products.pieces'), index.h("span", null, product.quantity_in_group))), product.quantity === 0 && (index.h("span", { class: "s-multiple-bundle-product-badge" }, salla.lang.get('pages.products.quantity_in_group_finished')))), product.options?.length > 0 && (index.h("button", { class: "s-multiple-bundle-product-button", onClick: () => this.handleOptionsClick(product), type: "button" }, salla.lang.get('pages.products.choose_from_options'), index.h("i", { class: "sicon-keyboard_arrow_left s-multiple-bundle-product-button-icon" })))))));
+                    : ''}`, key: product.id }, index.h("div", { class: "s-multiple-bundle-product-card" }, index.h("div", { class: "s-multiple-bundle-product-image-wrapper", onClick: () => this.handleProductClick(product, productIndex) }, index.h("input", { id: this.generateEventName(this.section.id, productIndex), type: "checkbox", class: "s-multiple-bundle-product-checkbox", checked: isChecked, name: this.generateEventName(this.section.id, productIndex), value: product.id }), index.h("img", { src: product.image.url || salla.url.cdn('images/s-empty.png'), loading: "lazy", alt: product.image.alt || product.name, class: "s-multiple-bundle-product-image" })), index.h("div", { class: "s-multiple-bundle-product-content-wrapper" }, index.h("div", { class: "s-multiple-bundle-product-content" }, index.h("div", { class: "s-multiple-bundle-product-details" }, index.h("div", { class: "s-multiple-bundle-product-title-wrapper" }, index.h("h2", { class: "s-multiple-bundle-product-title" }, product.name)), index.h("div", { class: "s-multiple-bundle-product-price-wrapper" }, index.h("span", { class: "s-multiple-bundle-product-price" }, index.h("span", { innerHTML: salla.money(product.price) })), product.sale_price > 0 && (index.h("span", { class: "s-multiple-bundle-product-price-discount" }, index.h("span", { innerHTML: salla.money(product.sale_price) }))))), product.quantity_in_group > 0 && product.quantity !== 0 && (index.h("span", { class: "s-multiple-bundle-product-badge" }, salla.lang.get('pages.products.pieces'), index.h("span", null, product.quantity_in_group))), product.quantity === 0 && (index.h("span", { class: "s-multiple-bundle-product-badge" }, salla.lang.get('pages.products.quantity_in_group_finished')))), product.options?.length > 0 && (index.h("button", { class: "s-multiple-bundle-product-button", onClick: () => this.handleOptionsClick(product), type: "button" }, optionsButtonLabel, index.h("span", { class: "s-multiple-bundle-product-button-icon", innerHTML: optionsArrowIcon })))))));
         })))));
     }
     get host() { return index.getElement(this); }
@@ -12439,7 +12524,7 @@ const SallaTelInput = class {
         if (this.TelInput)
             return;
         try {
-            const telInputModule = await Promise.resolve().then(function () { return require('./index-BCqSMje8.js'); }).then(function (n) { return n.index; });
+            const telInputModule = await Promise.resolve().then(function () { return require('./index-B7O1YF_p.js'); }).then(function (n) { return n.index; });
             this.TelInput = telInputModule.default;
         }
         catch (error) {

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

@@ -3,7 +3,7 @@
  */
 'use strict';
 
-var index = require('./index-CD__TuQ1.js');
+var index = require('./index-CCofAgHa.js');
 var anime_es = require('./anime.es-BqW8JHZi.js');
 
 const sallaAdvertisementCss = ":host{display:block}";

package/dist/cjs/salla-app-install-alert.cjs.entry.js

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

package/dist/cjs/salla-apps-icons.cjs.entry.js

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

package/dist/cjs/salla-cart-item-offers.cjs.entry.js

@@ -3,7 +3,7 @@
  */
 'use strict';
 
-var index = require('./index-CD__TuQ1.js');
+var index = require('./index-CCofAgHa.js');
 var specialDiscount = require('./special-discount-OVG_9Kf9.js');
 var gift = require('./gift-BPDUPIY_.js');
 

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

@@ -3,7 +3,7 @@
  */
 'use strict';
 
-var index = require('./index-CD__TuQ1.js');
+var index = require('./index-CCofAgHa.js');
 
 var DiscountType;
 (function (DiscountType) {

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

@@ -3,7 +3,7 @@
  */
 'use strict';
 
-var index = require('./index-CD__TuQ1.js');
+var index = require('./index-CCofAgHa.js');
 var whatsapp2 = require('./whatsapp2-D7Sbg8Ey.js');
 var mail = require('./mail-CO8cFZH7.js');
 

package/dist/cjs/salla-filters-widget.cjs.entry.js

@@ -3,7 +3,7 @@
  */
 'use strict';
 
-var index = require('./index-CD__TuQ1.js');
+var index = require('./index-CCofAgHa.js');
 var Helper = require('./Helper-C9UmWIYn.js');
 var interfaces = require('./interfaces-DZDQwN6-.js');
 require('./anime.es-BqW8JHZi.js');

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

@@ -3,7 +3,7 @@
  */
 'use strict';
 
-var index = require('./index-CD__TuQ1.js');
+var index = require('./index-CCofAgHa.js');
 var interfaces = require('./interfaces-DZDQwN6-.js');
 var Helper = require('./Helper-C9UmWIYn.js');
 require('./anime.es-BqW8JHZi.js');

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

@@ -3,7 +3,7 @@
  */
 'use strict';
 
-var index = require('./index-CD__TuQ1.js');
+var index = require('./index-CCofAgHa.js');
 
 const sallaInstallmentCss = "salla-installment:empty{display:none}#tabbyPromoWrapper{background:white;border-radius:0.375rem;transition:box-shadow 0.5s cubic-bezier(0.4, 0, 0.2, 1);margin-bottom:20px;border:unset !important;font-weight:500}.salla-y #tabbyPromoWrapper{border:1px solid var(--color-grey-dark);border-radius:12px}#tabbyPromoWrapper:hover{box-shadow:0 0 rgba(0, 0, 0, 0), 0 0 rgba(0, 0, 0, 0), 5px 10px 30px rgba(43, 45, 52, 0.0509803922)}#tabbyPromoWrapper #tabbyPromo *{font-family:var(--font-main)}#tabbyPromoWrapper #tabbyPromo>div>div{max-width:none;box-shadow:none;border:none}#tabbyPromoWrapper #tabbyPromo .tabby-promo-snippet{max-width:100%;min-height:100px;padding:18px 20px;border:none !important}#tabbyPromoWrapper #tabbyPromo .tabby-promo-snippet__text,#tabbyPromoWrapper #tabbyPromo .tabby-promo-snippet__link{font-size:var(--font-sm);color:var(--color-text) !important}#tabbyPromoWrapper #tabbyPromo .tabby-promo-snippet__link{font-weight:bold}.tabby-promo-wrapper #tabby-promo{font-family:var(--font-main) !important}.tabby-promo-wrapper #tabby-promo .tabby-promo__feature-title{font-size:var(--font-md)}.tabby-promo-wrapper #tabby-promo .tabby-promo__feature-desc{font-size:var(--font-sm);line-height:20px}.tamara-product-widget{margin-bottom:20px}.tamara-product-widget,.spotii-wrapper{min-height:100px;position:relative;color:var(--main-text-color);font-size:var(--font-sm);line-height:1.25;padding:20px 20px 20px 115px !important;background:white;border-radius:0.375rem;transition:box-shadow 0.5s cubic-bezier(0.4, 0, 0.2, 1);border:unset !important;font-family:inherit !important;font-weight:500}.salla-y .tamara-product-widget,.salla-y .spotii-wrapper{border-radius:12px;border:1px solid var(--color-grey-dark)}.tamara-product-widget:hover,.spotii-wrapper:hover{box-shadow:0 0 rgba(0, 0, 0, 0), 0 0 rgba(0, 0, 0, 0), 5px 10px 30px rgba(43, 45, 52, 0.0509803922)}.tamara-product-widget .spotii-logo,.spotii-wrapper .spotii-logo{float:left;margin:0 0 0 -75px}.ltr .tamara-product-widget,.ltr .spotii-wrapper{text-align:left;padding:18px 100px 18px 20px !important}.ltr .tamara-product-widget .spotii-logo,.ltr .spotii-wrapper .spotii-logo{float:right;margin:0 -75px 0 0}.ltr .tamara-product-widget .spotii-product-widget,.ltr .spotii-wrapper .spotii-product-widget{text-align:left !important}.spotii-wrapper{margin-bottom:20px}.spotii-wrapper .spotii-promo{font-size:var(--font-md)}.spotii-wrapper .spotii-product-widget{font-size:var(--font-sm) !important;margin-top:10px}.tamara-product-widget .tamara-logo{position:absolute;left:20px !important;top:35px !important;margin:0 !important;height:24px !important}.ltr .tamara-product-widget .tamara-logo{right:20px !important;left:auto !important}.tamara-product-widget span{font-family:var(--font-main);font-size:var(--font-sm);color:var(--color-text)}.tamara-product-widget span:last-child{display:block;position:relative;margin-top:8px}.tamara-popup__wrap{overflow:auto !important}.s-installment-mispay-wrapper,.s-installment-madfu-wrapper,.s-installment-emkan-wrapper,.s-installment-rajehi-wrapper{font-size:14px;text-align:right;padding:20px;gap:42px;line-height:22px;color:rgb(0, 0, 0);min-width:100%;box-sizing:border-box;position:relative;background-color:white;border-radius:10px;margin:15px 0;display:flex;transition:box-shadow 0.5s cubic-bezier(0.4, 0, 0.2, 1)}.s-installment-mispay-wrapper:hover,.s-installment-madfu-wrapper:hover,.s-installment-emkan-wrapper:hover,.s-installment-rajehi-wrapper:hover{box-shadow:0 0 rgba(0, 0, 0, 0), 0 0 rgba(0, 0, 0, 0), 5px 10px 30px rgba(43, 45, 52, 0.0509803922)}.s-installment-mispay-content,.s-installment-madfu-content,.s-installment-emkan-content,.s-installment-rajehi-content{display:flex;flex-direction:row-reverse;width:100%;justify-content:space-between;align-items:center;gap:1rem}.s-installment-mispay-content-text,.s-installment-madfu-content-text,.s-installment-emkan-content-text,.s-installment-rajehi-content-text{color:var(--main-text-color);font-size:14px;font-weight:500;margin:0 16px 0 0;width:80%;left:14px;text-align:left}.s-installment-mispay-content img,.s-installment-madfu-content img,.s-installment-emkan-content img,.s-installment-rajehi-content img{height:28px;width:70px;display:inline-block;max-height:100%;vertical-align:middle;fill:none;stroke:unset;width:auto}.rtl .s-installment-mispay-content-text,.rtl .s-installment-madfu-content-text,.rtl .s-installment-emkan-content-text,.rtl .s-installment-rajehi-content-text{right:14px;text-align:right;margin:0 0 0 16px}.rtl .s-installment-mispay-content img,.rtl .s-installment-madfu-content img,.rtl .s-installment-emkan-content img,.rtl .s-installment-rajehi-content img{left:14px !important}.ltr .s-installment-mispay-content img,.ltr .s-installment-madfu-content img,.ltr .s-installment-emkan-content img,.ltr .s-installment-rajehi-content img{right:14px !important}.s-installment-rajehi-content img{width:70px !important;height:40px !important}.s-installment-emkan-content img{height:35px !important}";
 

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

@@ -3,7 +3,7 @@
  */
 'use strict';
 
-var index = require('./index-CD__TuQ1.js');
+var index = require('./index-CCofAgHa.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-CD__TuQ1.js');
+var index = require('./index-CCofAgHa.js');
 var gift = require('./gift-BPDUPIY_.js');
 
 const sallaLoyaltyProgramCss = "";

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

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

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

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

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

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

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

@@ -3,7 +3,7 @@
  */
 'use strict';
 
-var index = require('./index-CD__TuQ1.js');
+var index = require('./index-CCofAgHa.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-CD__TuQ1.js');
+var index = require('./index-CCofAgHa.js');
 
 const sallaOrderDetailsMultipleBundleProductCss = "";
 

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

@@ -3,7 +3,7 @@
  */
 'use strict';
 
-var index = require('./index-CD__TuQ1.js');
+var index = require('./index-CCofAgHa.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-CD__TuQ1.js');
+var index = require('./index-CCofAgHa.js');
 
 const sallaOrderDetailsCss = "";
 

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

@@ -3,7 +3,7 @@
  */
 'use strict';
 
-var index = require('./index-CD__TuQ1.js');
+var index = require('./index-CCofAgHa.js');
 var check = require('./check-CLRvuniI.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-CD__TuQ1.js');
+var index = require('./index-CCofAgHa.js');
 
 const sallaOrderTotalsCardCss = ":host{display:block}";
 

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

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