@salla.sa/twilight-components 2.14.272 → 2.14.273

package/dist/collection/components/salla-multiple-bundle-product/components/salla-multiple-bundle-product-slider.js

@@ -0,0 +1,174 @@
+/*!
+ * Crafted with ❤ by Salla
+ */
+import { Host, h } from "@stencil/core";
+export class SallaMultipleBundleProductSlider {
+    constructor() {
+        this.selectedProducts = {};
+        this.handleProductClick = (product, productIndex) => {
+            // Find the checkbox input for this product
+            const checkboxId = this.generateEventName(this.section.id, productIndex);
+            const checkbox = document.getElementById(checkboxId);
+            if (!checkbox)
+                return;
+            if (checkbox) {
+                // Toggle the checkbox state
+                checkbox.checked = !checkbox.checked;
+                // Dispatch a change event to trigger form validation/submission
+                const changeEvent = new window.Event('change', { bubbles: true });
+                checkbox.dispatchEvent(changeEvent);
+            }
+            this.productSelected.emit({
+                product,
+                sectionId: this.section.id,
+            });
+        };
+        this.handleOptionsClick = (product) => {
+            this.productOptionsSelected.emit({
+                product,
+                sectionId: this.section.id,
+            });
+        };
+    }
+    generateEventName(sectionId, productIndex) {
+        return `bundle[${sectionId}][${productIndex}][id]`;
+    }
+    render() {
+        return (h(Host, { key: '8c1d316ceeb7a0833d689695f00569a0da1d642e' }, h("salla-slider", { key: 'ca86cee09dc4f8c48edf14bfb4a26b86982fd84d', type: "carousel", controlsOuter: false, showControls: false, id: "accordion-multiple-bundle-product", pagination: true, class: "s-multiple-bundle-product-wrapper-slider", sliderConfig: {
+                spaceBetween: 0,
+            } }, h("div", { key: 'b59ac0393f6e826658dcca7eef8c2c21019664d4', slot: "items" }, this?.section?.products?.map((product, productIndex) => {
+            const isChecked = this.selectedProducts[this.section.id]?.has(product.id) || false;
+            return (h("div", { class: `swiper-slide s-multiple-bundle-product-slide-one-third ${product.quantity == 0
+                    ? 's-multiple-bundle-product-slide-one-third-disabled'
+                    : ''}`, key: product.id }, h("div", { class: "s-multiple-bundle-product-card" }, h("div", { class: "s-multiple-bundle-product-image-wrapper", onClick: () => this.handleProductClick(product, productIndex) }, 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 }), 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" })), h("div", { class: "s-multiple-bundle-product-content-wrapper" }, h("div", { class: "s-multiple-bundle-product-content" }, h("div", { class: "s-multiple-bundle-product-details" }, h("div", { class: "s-multiple-bundle-product-title-wrapper" }, h("h2", { class: "s-multiple-bundle-product-title" }, product.name)), h("div", { class: "s-multiple-bundle-product-price-wrapper" }, h("span", { class: "s-multiple-bundle-product-price" }, h("span", { innerHTML: salla.money(product.price) })), product.sale_price > 0 && (h("span", { class: "s-multiple-bundle-product-price-discount" }, h("span", { innerHTML: salla.money(product.sale_price) }))))), product.quantity_in_group > 0 && product.quantity !== 0 && (h("span", { class: "s-multiple-bundle-product-badge" }, salla.lang.get('pages.products.pieces'), h("span", null, product.quantity_in_group))), product.quantity === 0 && (h("span", { class: "s-multiple-bundle-product-badge" }, salla.lang.get('pages.products.quantity_in_group_finished')))), product.options?.length > 0 && (h("button", { class: "s-multiple-bundle-product-button", onClick: () => this.handleOptionsClick(product), type: "button" }, salla.lang.get('pages.products.choose_from_options'), h("i", { class: "sicon-keyboard_arrow_left s-multiple-bundle-product-button-icon" })))))));
+        })))));
+    }
+    static get is() { return "salla-multiple-bundle-product-slider"; }
+    static get originalStyleUrls() {
+        return {
+            "$": ["salla-multiple-bundle-product-slider.scss"]
+        };
+    }
+    static get styleUrls() {
+        return {
+            "$": ["salla-multiple-bundle-product-slider.css"]
+        };
+    }
+    static get properties() {
+        return {
+            "section": {
+                "type": "unknown",
+                "attribute": "section",
+                "mutable": false,
+                "complexType": {
+                    "original": "BundleSection",
+                    "resolved": "BundleSection",
+                    "references": {
+                        "BundleSection": {
+                            "location": "import",
+                            "path": "../interfaces",
+                            "id": "src/components/salla-multiple-bundle-product/interfaces.ts::BundleSection"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false
+            },
+            "sectionIndex": {
+                "type": "number",
+                "attribute": "section-index",
+                "mutable": false,
+                "complexType": {
+                    "original": "number",
+                    "resolved": "number",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false
+            },
+            "selectedProducts": {
+                "type": "unknown",
+                "attribute": "selected-products",
+                "mutable": false,
+                "complexType": {
+                    "original": "{ [sectionId: string]: Set<string | number> }",
+                    "resolved": "{ [sectionId: string]: Set<string | number>; }",
+                    "references": {
+                        "Set": {
+                            "location": "global",
+                            "id": "global::Set"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "defaultValue": "{}"
+            }
+        };
+    }
+    static get events() {
+        return [{
+                "method": "productSelected",
+                "name": "productSelected",
+                "bubbles": true,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "complexType": {
+                    "original": "{ product: BundleProduct; sectionId: string | number }",
+                    "resolved": "{ product: BundleProduct; sectionId: string | number; }",
+                    "references": {
+                        "BundleProduct": {
+                            "location": "import",
+                            "path": "../interfaces",
+                            "id": "src/components/salla-multiple-bundle-product/interfaces.ts::BundleProduct"
+                        }
+                    }
+                }
+            }, {
+                "method": "productOptionsSelected",
+                "name": "productOptionsSelected",
+                "bubbles": true,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "complexType": {
+                    "original": "{\n    product: BundleProduct;\n    sectionId: string | number;\n  }",
+                    "resolved": "{ product: BundleProduct; sectionId: string | number; }",
+                    "references": {
+                        "BundleProduct": {
+                            "location": "import",
+                            "path": "../interfaces",
+                            "id": "src/components/salla-multiple-bundle-product/interfaces.ts::BundleProduct"
+                        }
+                    }
+                }
+            }];
+    }
+    static get elementRef() { return "host"; }
+}

package/dist/collection/components/salla-multiple-bundle-product/interfaces.js

@@ -0,0 +1 @@
+export {};

package/dist/collection/components/salla-multiple-bundle-product/salla-multiple-bundle-product.css

@@ -0,0 +1,3 @@
+:host {
+  display: block;
+}

package/dist/collection/components/salla-multiple-bundle-product/salla-multiple-bundle-product.js

@@ -0,0 +1,132 @@
+/*!
+ * Crafted with ❤ by Salla
+ */
+import { Host, h } from "@stencil/core";
+/**
+ * Example usage with new nested structure:
+ *
+ * <salla-multiple-bundle-product bundleSections='{
+ *   "id": "encoded_product_id",
+ *   "name": "Complete Office Setup Bundle",
+ *   "bundle": {
+ *     "discount_percentage": 15,
+ *     "sections": [
+ *       {
+ *         "id": "encoded_section_1",
+ *         "name": "Office Equipment",
+ *         "obligatory_products": 1,
+ *         "products": [
+ *           {
+ *             "id": "encoded_sub_product_1",
+ *             "name": "Office Desk",
+ *             "image": "https://cdn.salla.sa/products/desk.jpg",
+ *             "images": ["https://cdn.salla.sa/products/desk-1.jpg"],
+ *             "price": { "amount": 500, "currency": "SAR" },
+ *             "sale_price": 450,
+ *             "quantity": 50,
+ *             "options": [...]
+ *           }
+ *         ]
+ *       }
+ *     ]
+ *   }
+ * }'></salla-multiple-bundle-product>
+ */
+export class SallaMultipleBundleProduct {
+    constructor() {
+        this.parsedSections = [];
+    }
+    parseProducts(newValue) {
+        let sections = [];
+        if (typeof newValue === 'string') {
+            try {
+                const parsed = JSON.parse(newValue);
+                sections = this.extractSections(parsed);
+            }
+            catch (e) {
+                console.error('Invalid JSON passed to bundleSections prop:', newValue);
+                sections = [];
+            }
+        }
+        else if (newValue) {
+            sections = this.extractSections(newValue);
+        }
+        this.parsedSections = sections;
+    }
+    extractSections(data) {
+        // Handle new nested structure: data.bundle.sections
+        if (data.bundle && data.bundle.sections && Array.isArray(data.bundle.sections)) {
+            return data.bundle.sections;
+        }
+        // Handle old flat structure: data is directly an array of sections
+        if (Array.isArray(data)) {
+            return data;
+        }
+        // Handle case where data.sections exists at root level
+        if (data.sections && Array.isArray(data.sections)) {
+            return data.sections;
+        }
+        console.warn('No valid sections found in data:', data);
+        return [];
+    }
+    isCartPage() {
+        return salla.url.is_page('cart');
+    }
+    renderCartPage() {
+        return h("salla-multiple-bundle-product-cart", { sections: this.parsedSections });
+    }
+    renderDetailsPage() {
+        return h("salla-multiple-bundle-product-details", { sections: this.parsedSections });
+    }
+    componentWillLoad() {
+        this.parseProducts(this.bundleSections);
+    }
+    render() {
+        return (h(Host, { key: '6f9e20c6db0c7d79f84ba197f015f43c1b0a79fc', class: "s-multiple-bundle-product-wrapper" }, this.isCartPage() ? this.renderCartPage() : this.renderDetailsPage()));
+    }
+    static get is() { return "salla-multiple-bundle-product"; }
+    static get originalStyleUrls() {
+        return {
+            "$": ["salla-multiple-bundle-product.scss"]
+        };
+    }
+    static get styleUrls() {
+        return {
+            "$": ["salla-multiple-bundle-product.css"]
+        };
+    }
+    static get properties() {
+        return {
+            "bundleSections": {
+                "type": "string",
+                "attribute": "bundle-sections",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false
+            }
+        };
+    }
+    static get states() {
+        return {
+            "parsedSections": {}
+        };
+    }
+    static get watchers() {
+        return [{
+                "propName": "bundleSections",
+                "methodName": "parseProducts"
+            }];
+    }
+}

package/dist/collection/components/salla-notifications/salla-notification-item.js

@@ -4,7 +4,7 @@
 import { h } from "@stencil/core";
 export class SallaNotificationItem {
     render() {
-        return h("a", { key: '15701825f2d0bb5b4bc21cf20114eae79af6b9aa', href: this.notification.url, class: { "s-notifications-item": true, "s-notifications-item-shadow": true, "s-notifications-item-read": !this.notification.is_new } }, h("span", { key: 'f87fba9d640a5c6cab81abe2d7537c2c89ee8857', class: "s-notifications-item-icon" }, h("i", { key: '52590f17aacb20f87768a0dcc699e15303ca0e81', class: { 's-notifications-item-icon sicon-bell-ring': true, 's-notifications-item-icon-new': this.notification.is_new } })), h("div", { key: '489bdb71b1caaa202604facffe47ce6a6825355b', class: "s-notifications-item-content" }, h("div", { key: '53a0e1e2f2f1be650567c0b1b9cc779779bc2cdc', class: "s-notifications-item-content-leading" }, h("h4", { key: 'b7f6fd64ad3212d0810a4eb7ab0a33d4294498c7' }, this.notification.title), h("p", { key: '3774bc0d5c619d73f97466283d28ed5204e9abe4' }, this.notification.sub_title)), h("span", { key: '25c70649e341c3e7c659dec48e986945088b4dfa', class: "s-notifications-item-content-trailing" }, h("i", { key: 'eaca7d3e4b8254b5eb8ea7e864c5afac8529f019', class: "sicon-time s-notifications-item-content-trailing-icon" }), h("span", { key: 'de695990f5d2b6e5a131373d863f1d2e1e002613' }, this.notification.date))));
+        return h("a", { key: '17a1e41f0b06f3b2f2f89dc521e6785f1aa74f61', href: this.notification.url, class: { "s-notifications-item": true, "s-notifications-item-shadow": true, "s-notifications-item-read": !this.notification.is_new } }, h("span", { key: '56fee4c18930369fba2790339d24581e8ea87ba8', class: "s-notifications-item-icon" }, h("i", { key: 'e95df8bdab11a7cab57d5c42895cdee902331d46', class: { 's-notifications-item-icon sicon-bell-ring': true, 's-notifications-item-icon-new': this.notification.is_new } })), h("div", { key: 'eaae0f57fddb3559c705acd04691b3446da0fb3c', class: "s-notifications-item-content" }, h("div", { key: '81ea45dd948c4afe6886b6aad935449dfc82a1a3', class: "s-notifications-item-content-leading" }, h("h4", { key: '6fb3da2e43bc676aa69dea061863ea5af1bf5eb4' }, this.notification.title), h("p", { key: '3b7f3273949e70a623fd95b5539accfb0b7e4cae' }, this.notification.sub_title)), h("span", { key: 'f629e3c8429d9636f23432dcbf918dab52e71941', class: "s-notifications-item-content-trailing" }, h("i", { key: 'f2822b50bd09e84c7b06c25403b2189fd7717520', class: "sicon-time s-notifications-item-content-trailing-icon" }), h("span", { key: 'df8fbc5dde967ccf0993dba938d8005d053afcef' }, this.notification.date))));
     }
     static get is() { return "salla-notification-item"; }
     static get originalStyleUrls() {

package/dist/collection/components/salla-offer-modal/salla-offer-modal.js

@@ -165,7 +165,7 @@ export class SallaOfferModal {
     //       '</div>';
     //   }
     render() {
-        return h("salla-modal", { key: '149806ab834f3595edaba08fa4ac7534559c86a0', "has-skeleton": true, "sub-title": this.offer_message, ref: modal => this.modal = modal, isLoading: true, class: `s-offer-modal-type-${this.offer_type ? this.offer_type : ''}` }, h("div", { key: '0b04b126cab3b3f2c96a18da4e99fde448ae3a7b', slot: 'loading' }, h("div", { key: '2bc798a2e279e732752a61870d2bbdb239156af1', class: "s-offer-modal-skeleton" }, h("div", { key: 'f25d33fa444b1b200b8ad1d1671485bc402ac32f', class: "s-offer-modal-skeleton-header" }, h("salla-skeleton", { key: '3e9099101da88a0b0e7c1961dd191d9df92f6508', type: 'circle', height: '80px', width: '80px' }), h("salla-skeleton", { key: '913b23a9a46ca5c69a42672a09a922662c1587a8', height: '15px', width: '50%' }), h("salla-skeleton", { key: '8e8e1392609be37bb8a85e5d79f5f6a5511c5af8', height: '10px', width: '30%' })), h("div", { key: '994cd22730b3b8feefd9e8f6597875aa7954e6f7', class: "s-offer-modal-skeleton-items" }, [...Array(3)].map(() => h("div", { class: "s-offer-modal-skeleton-item" }, h("salla-skeleton", { height: '9rem' }), h("div", { class: "s-offer-modal-skeleton-item-title" }, h("salla-skeleton", { height: '15px', width: '100%' })), h("div", { class: "s-offer-modal-skeleton-item-subtitle" }, h("salla-skeleton", { height: '9px', width: '50%' }), h("div", { innerHTML: Cart2 }))))), h("div", { key: '361299e616622895d48377f3d138d115d05a9fbc', class: "s-offer-modal-skeleton-footer" }, h("salla-skeleton", { key: '28cc38415de9bed705b5d2ca683031c50de47d94', height: '15px', width: '50%' }), h("salla-skeleton", { key: 'ef1935d0e8fccfbce3b9cf3a652c7c521539cf13', height: '15px', width: '30%' })))), !this.hasError && this.offer !== null
+        return h("salla-modal", { key: '6dce27c3f20b031aa33b7e15980c55af84d1c9f6', "has-skeleton": true, "sub-title": this.offer_message, ref: modal => this.modal = modal, isLoading: true, class: `s-offer-modal-type-${this.offer_type ? this.offer_type : ''}` }, h("div", { key: '1f63aa0fd3a95ba54e8ed5168f1439f4cafce036', slot: 'loading' }, h("div", { key: '748de710f2ad5c6c60a9e324d1e1b44672dee28f', class: "s-offer-modal-skeleton" }, h("div", { key: '96d6d1d8edc3e511c87eaa44539617d529e8a3e0', class: "s-offer-modal-skeleton-header" }, h("salla-skeleton", { key: '1abe6ddf5096af877c9ce59dfbcdecb08a263e4b', type: 'circle', height: '80px', width: '80px' }), h("salla-skeleton", { key: '7010a9056b168f4df7168a55dbfde1da2726c913', height: '15px', width: '50%' }), h("salla-skeleton", { key: '4168b53b7a4358240f8f6d4d3b9f9a999992ddcb', height: '10px', width: '30%' })), h("div", { key: 'd019372cebf6d3e4d80842fa48e3ce1433457f06', class: "s-offer-modal-skeleton-items" }, [...Array(3)].map(() => h("div", { class: "s-offer-modal-skeleton-item" }, h("salla-skeleton", { height: '9rem' }), h("div", { class: "s-offer-modal-skeleton-item-title" }, h("salla-skeleton", { height: '15px', width: '100%' })), h("div", { class: "s-offer-modal-skeleton-item-subtitle" }, h("salla-skeleton", { height: '9px', width: '50%' }), h("div", { innerHTML: Cart2 }))))), h("div", { key: '4cbc9f99a98ccc9ea27f41e50fa037ea44d85048', class: "s-offer-modal-skeleton-footer" }, h("salla-skeleton", { key: '467546d4ded93cd95a7be78e6dd39935a20867c8', height: '15px', width: '50%' }), h("salla-skeleton", { key: '399a4a4ebedcc54def70ff428f3c5f24fd98a775', height: '15px', width: '30%' })))), !this.hasError && this.offer !== null
             ? [h("span", { slot: 'icon', class: "s-offer-modal-header-icon", innerHTML: SpecialDiscountIcon }), this.getOfferContent(), h("div", { class: "s-offer-modal-footer", slot: "footer" }, this.offer.formatted_date ?
                     h("p", { class: "s-offer-modal-expiry" }, salla.lang.get('pages.products.offer_expires_in'), " ", this.offer.formatted_date)
                     : '', h("label", { class: "s-offer-modal-remember-label" }, h("input", { type: "checkbox", onChange: e => this.rememberMe(e), class: "s-offer-modal-remember-input" }), "\u00A0 ", salla.lang.get('common.elements.remember_my_choice'))),

package/dist/collection/components/salla-order-details/salla-order-details.js

@@ -36,7 +36,7 @@ export class SallaOrderDetails {
         ];
     }
     render() {
-        return h(Host, { key: 'd76fce6a442aca11f3544a9f101ea4245a9317db', class: "s-order-details-wrapper" }, this.renderOrderDetailsContent());
+        return h(Host, { key: 'bd23d62d5941991f87ab76c8df4a596019a8fff2', class: "s-order-details-wrapper" }, this.renderOrderDetailsContent());
     }
     static get is() { return "salla-order-details"; }
     static get originalStyleUrls() {

package/dist/collection/components/salla-order-summary/salla-order-summary.js

@@ -62,7 +62,7 @@ export class SallaOrderSummary {
         this.copyCodeButtonTimeout && clearTimeout(this.copyCodeButtonTimeout);
     }
     render() {
-        return (h("ul", { key: '14eed8e219bcde5b32d5fddb95bb8727e980c56c', class: "s-order-summary-wrapper" }, this.noItemFound ? h("salla-placeholder", { alignment: "center" }, h("span", { slot: "title" })) :
+        return (h("ul", { key: 'af9f879519eebc501c9cb1bb5151d8b2d265affd', class: "s-order-summary-wrapper" }, this.noItemFound ? h("salla-placeholder", { alignment: "center" }, h("span", { slot: "title" })) :
             this.order_items.map((item) => (this.isDigitalCard(item) ? (h("li", { key: item.product.id, class: "s-order-summary-item" }, h("h2", { class: "s-order-summary-item-title" }, this.codes_text, " (", item.name, ")"), item.codes.map((code) => (h("div", { key: code.code, class: "s-order-summary-code-item-wrapper" }, h("p", null, h("span", { innerHTML: iconCreditCard }), h("span", null, code.code)), h("salla-button", { class: `s-order-summary-item-copy-button ${this.codeCopied === code.code ? 'copied' : ''}`, onClick: () => this.copyToClipboardHandler(code.code), shape: "link" }, h("span", { innerHTML: this.codeCopied === code.code ? iconCheck : iconCopy }), h("span", null, this.copy_text))))))) :
                 this.isDigitalProduct(item) ? (h("li", { key: item.product.id, class: "s-order-summary-item" }, h("h2", { class: "s-order-summary-item-title" }, this.files_text, " (", item.name, ")"), h("ul", null, item.files.map((file) => (h("li", { class: "s-order-summary-digital-item-wrapper" }, h("div", null, h("span", { innerHTML: iconFileArchive }), h("span", null, file.name)), h("a", { href: file.url, target: "_blank", class: "s-order-summary-item-download" }, h("span", { innerHTML: iconDownload }), h("span", null, this.download_text)))))))) : null))));
     }

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

@@ -36,12 +36,12 @@ export class SallaPayments {
     render() {
         const madeInKSA = !this.exclude.includes('made-in-ksa') && salla.config.get('store.settings.made_in_ksa');
         const sbcId = this.exclude.includes('sbc') ? null : salla.config.get('store.settings.certificate.id');
-        return (h(Host, { key: 'a1a26ba03aa60491071f0e63bac40de3ad91bce6', class: "s-payments-list-wrap" }, h("ul", { key: 'd31ca162e83aade956f45d8f517029942a748646', class: "s-payments-list" }, madeInKSA && h("li", { key: '552e3e57345d01ab33bfd20094cbcf8f702c6efa', class: "s-payments-list-item" }, h("img", { key: '04eb9c9a1950edc9ea3c2e218fbe6c5c21d65f6a', class: "lazy", width: "100%", height: "100%", decoding: "async", loading: "lazy", "data-src": salla.url.cdn(`images/made-in-ksa.svg`, 58, 58), alt: "made in KSA certified" })), this.payments.map((payment) => (payment == "cod" ?
+        return (h(Host, { key: 'c5f26f541f25203b250277fb3803d74fcb2fb4cc', class: "s-payments-list-wrap" }, h("ul", { key: '263ac59414cd989c6995aeac452c74b96e5bee97', class: "s-payments-list" }, madeInKSA && h("li", { key: 'cd5ecf3b89363107300b056ec1d38e9638eb7b74', class: "s-payments-list-item" }, h("img", { key: '5618f8af5984801ca0b7eed121cd45a6ddfce602', class: "lazy", width: "100%", height: "100%", decoding: "async", loading: "lazy", "data-src": salla.url.cdn(`images/made-in-ksa.svg`, 58, 58), alt: "made in KSA certified" })), this.payments.map((payment) => (payment == "cod" ?
             h("div", { id: "cod-slot", innerHTML: this.codSlot
                     .replace(/\{image\}/g, salla.url.cdn(`images/payment/cod_mini.png`, 58, 58)) }) :
             h("div", { id: "payment-slot", innerHTML: this.paymentSlot
                     .replace(/\{image\}/g, salla.url.cdn(`images/payment/${payment}_mini.png`, 58, 58))
-                    .replace(/\{payment\}/g, payment) }))), sbcId && h("div", { key: '5f69b3c936edf8039006d6ecd73e3c44b74b9167', id: "sbc-slot", innerHTML: this.sbcSlot
+                    .replace(/\{payment\}/g, payment) }))), sbcId && h("div", { key: '5c3738352aed8813bf5fb0993ff77f315abfd601', id: "sbc-slot", innerHTML: this.sbcSlot
                 .replace(/\{image\}/g, salla.url.cdn(`images/sbc.png`, 58, 58))
                 .replace(/\{link\}/g, `https://eauthenticate.saudibusiness.gov.sa/certificate-details/${sbcId}`) }))));
     }

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

@@ -35,7 +35,7 @@ export class SallaPlaceholder {
         };
     }
     render() {
-        return (h(Host, { key: 'fe8c3b4958319a69bedc23c4edd7e5e9db820301', class: this.alignmentClass() }, h("div", { key: '727c7f934c9dbc5fb5cdfba7f563855162fa3a23', class: `s-placeholder-icon s-placeholder-icon-${this.iconSize}`, innerHTML: this.icon }), h("div", { key: '6c61798f5af682c078f4536fd88af14c241bc009', class: "s-placeholder-title" }, h("slot", { key: '6bd403b5402ff34b69615ad94fce85516b0fe79d', name: 'title' }, h("span", { key: 'beef08e2f61e1328f15afa9b895302c235022f91' }, salla.lang.get('common.elements.no_options')))), h("div", { key: '50fea21d9fcc09a3478beb31e9e876ed7726b704', class: "s-placeholder-description" }, h("slot", { key: 'de0f6916c65c2a2c97ea3ee3fa16d6fdbeebe90a', name: 'description' }, h("span", { key: '3f6621dc6d2f19b1c5e8f55f9f2cc4b0b622bbcc' }, salla.lang.get('common.errors.empty_results'))))));
+        return (h(Host, { key: '9bf5c9b70ee7dddc65bdb550f98681aa6eb4a2b1', class: this.alignmentClass() }, h("div", { key: '05bf79dd66fb30d76ffe05ea50b66d1bab976bb0', class: `s-placeholder-icon s-placeholder-icon-${this.iconSize}`, innerHTML: this.icon }), h("div", { key: '1373cfaad7e993e6cc888047346348083ee8bf7e', class: "s-placeholder-title" }, h("slot", { key: '5a6d70c7fee74334cf46143511bf2465e32025be', name: 'title' }, h("span", { key: '5b531362a3dea0a8a59960a28925c03bdfc64f82' }, salla.lang.get('common.elements.no_options')))), h("div", { key: 'd9d0c28b47f7c2972817630a9011e17116fa66c8', class: "s-placeholder-description" }, h("slot", { key: '0b67052476e584464107d56b4c8f263cfebaac87', name: 'description' }, h("span", { key: '61b16c16799ce96a53eca32936c8d49b2e81ff03' }, salla.lang.get('common.errors.empty_results'))))));
     }
     static get is() { return "salla-placeholder"; }
     static get originalStyleUrls() {

package/dist/collection/components/salla-price-range/salla-price-range.js

@@ -146,9 +146,9 @@ export class SallaPriceRange {
         this.maxPrice = value === undefined ? '' : value;
     }
     render() {
-        return (h(Host, { key: 'dc09f4be81c3652da570b522894917f6b70faf61' }, this.filterValues.map((filterValue, index) => {
+        return (h(Host, { key: 'c32d64ad892c080988c8d5414b63f7fd684981f7' }, this.filterValues.map((filterValue, index) => {
             return h("label", { class: "s-filters-label", htmlFor: `${this.option.key}-${index}`, key: index }, h("input", { id: `${this.option.key}-${index}`, name: "price", type: "radio", checked: this.isChecked(filterValue), class: "s-filters-radio", onChange: e => this.handleMinMaxPrice(e, filterValue) }), h("span", { innerHTML: this.getPriceLabel(filterValue) }));
-        }), h("div", { key: '97f20e2bcff15d906dc5566a7f147339e4423138', class: "flex justify-center items-center" }, h("div", { key: '4c631a9f5c77890bcffd365db6dab471ba989246', class: "relative max-w-xl w-full" }, h("div", { key: '3e4c53b29c4e6fa90eba1a23f646d8391b1ce462', class: "s-price-range-inputs" }, h("div", { key: '6bb515095db500d78c5cc22f2bd25635d157793d', class: "s-price-range-relative" }, h("div", { key: '59617a36c7095a0766155521afb20d517fc5321a', class: "s-price-range-currency" }, " ", salla.config.currency().symbol), h("input", { key: 'bc1ae88ba28bcc11a7373cad13cdd2104646023b', type: "number", maxlength: "5", ref: el => this.minInput = el, onBlur: (e) => this.handleMinPrice(e), value: this.minPrice, placeholder: this.fromLabel, class: "s-price-range-number-input" })), h("div", { key: '49e12143570efe2f019e9a3240f9d1c184482f9c', class: "s-price-range-gray-text" }, " -"), h("div", { key: '1e61ef602dbb0f1622bbd7279f15b5ef71d0f2db', class: "s-price-range-relative" }, h("div", { key: '5aac7489a79f52156f382e0e4e181b6d0a8e5fb3', class: "s-price-range-currency" }, " ", salla.config.currency().symbol), h("input", { key: '104a3ce0be1d461715fdc6a29d0df33a8a378ad3', type: "number", maxlength: "5", ref: el => this.maxInput = el, onBlur: (e) => this.handleMaxPrice(e), value: this.maxPrice, placeholder: this.toLabel, class: "s-price-range-number-input", "aria-describedby": "price-currency" })), h("salla-button", { key: '2e722552816b6ceabf030d596fac580e1fa8d41a', color: 'gray', shape: 'icon', size: 'small', fill: 'outline', onClick: (event) => this.changedEventHandler(event) }, h("span", { key: '6f41a0dfa95c9910ab5d17e98ba815444fab8cca', innerHTML: this.isRTL ? arrowLeft : arrowRight })))))));
+        }), h("div", { key: '51b5c95a03ca70ecb8bc4567f259337771da5026', class: "flex justify-center items-center" }, h("div", { key: 'aa792280bc5ef8b1c42f5f31d60b458d2dfb47d6', class: "relative max-w-xl w-full" }, h("div", { key: '6bae77784c201192d3fddd78da7873391287891b', class: "s-price-range-inputs" }, h("div", { key: '17e47ec28470770d43389f9b8f17288e69d0b1f9', class: "s-price-range-relative" }, h("div", { key: 'f421eaa1d2ff4be5946434015c51fb3c95817940', class: "s-price-range-currency" }, " ", salla.config.currency().symbol), h("input", { key: '881be4083dea6163c7a5c51b9578537998abc1d3', type: "number", maxlength: "5", ref: el => this.minInput = el, onBlur: (e) => this.handleMinPrice(e), value: this.minPrice, placeholder: this.fromLabel, class: "s-price-range-number-input" })), h("div", { key: '48aec93a2a83015bde0eacbefa55bc040ea82fd1', class: "s-price-range-gray-text" }, " -"), h("div", { key: 'eb5dd50b1d622782a8c40e0f8247d1b2aa073cfd', class: "s-price-range-relative" }, h("div", { key: 'bf5792c163b95e5367c0f24a3af08376e7e75514', class: "s-price-range-currency" }, " ", salla.config.currency().symbol), h("input", { key: 'c6275c9838c65f428108ca15edafa0d48c057f94', type: "number", maxlength: "5", ref: el => this.maxInput = el, onBlur: (e) => this.handleMaxPrice(e), value: this.maxPrice, placeholder: this.toLabel, class: "s-price-range-number-input", "aria-describedby": "price-currency" })), h("salla-button", { key: 'b39c7a769cdda80a24b39dfc18c1526dcb8e40b7', color: 'gray', shape: 'icon', size: 'small', fill: 'outline', onClick: (event) => this.changedEventHandler(event) }, h("span", { key: 'd209fd63b06d195fa186c18ac00c8c456aef940d', innerHTML: this.isRTL ? arrowLeft : arrowRight })))))));
     }
     componentDidLoad() {
         this.isReady = true;

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

@@ -131,7 +131,7 @@ export class SallaProductAvailability {
         field.nextElementSibling['innerText'] = '* ' + errorMsg;
     }
     render() {
-        return (h(Host, { key: '0dc32b09e3916993a31ce6e27d9cefd81dd56289', class: "s-product-availability-wrap" }, this.isSubscribed || this.isVisitorSubscribed
+        return (h(Host, { key: '631de4fa7186561daed53943f2ece491a8dbe934', class: "s-product-availability-wrap" }, this.isSubscribed || this.isVisitorSubscribed
             ? h("div", { class: "s-product-availability-subscribed" }, h("span", { innerHTML: BellRingIcon, class: "s-product-availability-subs-icon" }), salla.lang.get('pages.products.notify_availability_success'))
             :
                 h("salla-button", { width: "wide", onClick: () => this.isUser ? this.submit() : this.openModel() }, salla.lang.get('pages.products.notify_availability')), this.isUser || this.isSubscribed || this.isVisitorSubscribed ? '' : this.renderModal()));

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

@@ -91,14 +91,14 @@ export class SallaProductCard {
             's-product-card-out-of-stock': this.productData?.is_out_of_stock,
         };
         const hrefProp = this.productData?.url ? { href: this.productData.url, title: `Learn more about ${this.productData?.name}` } : {};
-        return (h(Host, { key: '80743147fd154496018ff530e3c84b2f66cf2985', id: `product-${this.productData?.id}`, class: classes }, h("div", { key: 'ecf4f7838db5d38bc355d8730c3eb10dd04aedc4', class: !this.fullImage ? 's-product-card-image' : 's-product-card-image-full' }, h("a", { key: 'db0198934b449152c88d23f8adc71ec212761e2a', ...hrefProp }, h("img", { key: 'f80856aacb8861e68ef0dfbe43aeb22d422920f9', class: `s-product-card-image-${salla.url.is_placeholder(this.productData?.image?.url)
+        return (h(Host, { key: 'e46cba8a24104176d7a95c02ead575a6fa360783', id: `product-${this.productData?.id}`, class: classes }, h("div", { key: '6370f6a5ca0a63ab4f4d97492ef1f8911ef82bda', class: !this.fullImage ? 's-product-card-image' : 's-product-card-image-full' }, h("a", { key: '37f2f82fa1c500e9cdb4a0aabe570429b9b9daaa', ...hrefProp }, h("img", { key: '4ce43329b5a44b4d5ef174469c510ef28d547440', class: `s-product-card-image-${salla.url.is_placeholder(this.productData?.image?.url)
                 ? 'contain'
                 : this.fitImageHeight
                     ? this.fitImageHeight
-                    : 'cover'} lazy`, src: this.placeholder, alt: this.productData?.image?.alt || this.productData?.name, "data-src": this.productData?.image?.url || this.productData?.thumbnail }), !this.fullImage && !this.minimal ? this.getProductBadge() : ''), this.fullImage && h("a", { key: '7ce28a0b764367d51c8b351793509490cfd1e658', ...hrefProp, class: "s-product-card-overlay" }), !this.horizontal && !this.fullImage ?
-            h("salla-button", { shape: "icon", fill: "none", color: "light", "aria-label": "Add or remove to wishlist", ref: el => this.wishlistBtn = el, class: "s-product-card-wishlist-btn animated", onClick: () => salla.wishlist.toggle(this.productData.id) }, h("span", { innerHTML: Heart })) : ''), h("div", { key: 'b4f68d13d035d7de2fab28e6f2c0d026d46d8901', class: "s-product-card-content" }, this.isSpecial && this.productData?.quantity ?
+                    : 'cover'} lazy`, src: this.placeholder, alt: this.productData?.image?.alt || this.productData?.name, "data-src": this.productData?.image?.url || this.productData?.thumbnail }), !this.fullImage && !this.minimal ? this.getProductBadge() : ''), this.fullImage && h("a", { key: '87a4e4caafb0edba3c634ff5760ae0556a510d3c', ...hrefProp, class: "s-product-card-overlay" }), !this.horizontal && !this.fullImage ?
+            h("salla-button", { shape: "icon", fill: "none", color: "light", "aria-label": "Add or remove to wishlist", ref: el => this.wishlistBtn = el, class: "s-product-card-wishlist-btn animated", onClick: () => salla.wishlist.toggle(this.productData.id) }, h("span", { innerHTML: Heart })) : ''), h("div", { key: '7cb392ea3fe61d41d5ba5a36650725545ddd3cf8', class: "s-product-card-content" }, this.isSpecial && this.productData?.quantity ?
             h("div", { class: "s-product-card-content-pie", ref: pie => this.pie = pie }, h("span", null, h("b", null, salla.helpers.number(this.productData?.quantity)), this.remained), h("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "-2 -1 36 34", class: "s-product-card-content-pie-svg" }, h("circle", { cx: "16", cy: "16", r: "15.9155", class: "s-product-card-content-pie-svg-base" }), h("circle", { cx: "16", cy: "16", r: "15.9155", class: "s-product-card-content-pie-svg-bar" })))
-            : '', h("div", { key: '2259cecd4157e62a382d95cb6facde5b73eca1af', class: { 's-product-card-content-main': true, 's-product-card-content-extra-padding': this.isSpecial } }, h("h3", { key: '5b5ec545eb44fefdde1d4e2632b4e55baa86260c', class: "s-product-card-content-title" }, h("a", { key: '9afa68bf465f9c18e304ee462037df0999426696', ...hrefProp }, this.productData?.name)), this.productData?.subtitle && !this.minimal ?
+            : '', h("div", { key: '28322ef080ae243b55ed4c982f59226159b81d6b', class: { 's-product-card-content-main': true, 's-product-card-content-extra-padding': this.isSpecial } }, h("h3", { key: 'dc378461ca91f1af0c29b35271e8f6b76321f133', class: "s-product-card-content-title" }, h("a", { key: '1bf4c4cf4d04ebb4990053d9721581b276083f30', ...hrefProp }, this.productData?.name)), this.productData?.subtitle && !this.minimal ?
             h("p", { class: "s-product-card-content-subtitle" }, this.productData?.subtitle)
             : ''), this.productData?.donation && !this.minimal && !this.fullImage ?
             [h("salla-progress-bar", { donation: this.productData?.donation }), h("div", { class: "s-product-card-donation-input" }, this.productData?.donation?.can_donate ?
@@ -107,7 +107,7 @@ export class SallaProductCard {
                                 this.addBtn.donatingAmount = e.target.value;
                             }, id: "donation-amount", name: "donating_amount", class: "s-form-control", placeholder: this.donationAmount })]
                     : '')]
-            : '', h("div", { key: '7dc9364b456583bbb0a063038eadb971d68d33a1', class: { 's-product-card-content-sub': true, 's-product-card-content-extra-padding': this.isSpecial } }, this.getProductPrice(), this.productData?.rating?.stars && !this.minimal ?
+            : '', h("div", { key: '86474ac2519b7589053b39dc36ae316ad64c8e29', class: { 's-product-card-content-sub': true, 's-product-card-content-extra-padding': this.isSpecial } }, this.getProductPrice(), this.productData?.rating?.stars && !this.minimal ?
             h("div", { class: "s-product-card-rating" }, h("span", { innerHTML: Star }), h("span", null, this.productData.rating.stars))
             : ''), this.isSpecial && this.productData.discount_ends
             ? h("salla-count-down", { date: this.formatDate(this.productData.discount_ends), "end-of-day": true, boxed: true, labeled: true })