@salla.sa/twilight-components 2.14.429 → 2.14.431

package/dist/collection/components/salla-bullet-delivery/salla-bullet-delivery.js

@@ -2,7 +2,7 @@
  * Crafted with ❤ by Salla
  */
 import { h, Host, } from "@stencil/core";
-import { bulletDeliveryAPI, isSaudiArabia, clearApiCache } from "./api-service";
+import { bulletDeliveryAPI, clearApiCache, isSaudiArabia } from "./api-service";
 import { buildAddressLocationPayloadFromSelection, filterBranches, findNearestBranch, formatWorkingHoursDisplay, getBranchFirstSlot, getGeolocationErrorMessage, getIntentBranchId, getIntentCityId, getIntentCountryCode, getIntentCountryId, getIntentDistrictId, getIntentLatitude, getIntentLongitude, getIntentRegionId, getIntentSubtitle, hasSessionAddressIntent, requireRegionAndDistrictForSA, } from "./helpers";
 const BRANCH_SEARCH_DEBOUNCE_MS = 1000;
 const GEOLOCATION_TIMEOUT = 10000;
@@ -59,6 +59,7 @@ export class SallaBulletDelivery {
             this.open();
         };
         this.closeHandler = null;
+        this.bulletDeliveryMobileSelectHandler = null;
         /** True after saved addresses have been loaded (lazy: only when address tab is shown). */
         this.savedAddressesLoaded = false;
         // Core state
@@ -277,7 +278,7 @@ export class SallaBulletDelivery {
     }
     /** Whether to show delivery + pickup tabs. From store.shipping.support_pickup */
     get supportsPickup() {
-        return Boolean(Salla.config.get("store.shipping.support_pickup"));
+        return Boolean(Salla.config.get("store.shipping.support_pickup")) || Boolean(Salla.config.get("store.support_pickup"));
     }
     /** The modal opening strategy: 'first_visit' | 'on_cart_click' | 'after_add_to_cart' */
     get openingType() {
@@ -287,6 +288,9 @@ export class SallaBulletDelivery {
     get isRequired() {
         return !!Salla.config.get("store.settings.bullet_delivery.settings.is_required");
     }
+    get isMobileApp() {
+        return Salla.config.isMobileApp();
+    }
     /**
      * Opens the bullet delivery modal
      */
@@ -1272,6 +1276,175 @@ export class SallaBulletDelivery {
             form_data: { ...this.newAddressForm },
         };
     }
+    /**
+     * Build a minimal `BulletDeliveryAllocationConfirmedAddressData` from a mobile
+     * payload (no full SavedAddress object available). Only used for the
+     * `salla::bullet-delivery.allocation.confirmed` event so existing listeners
+     * keep working with the same shape they get on desktop.
+     */
+    buildAllocationConfirmedAddressFromIntent(payload) {
+        if (payload.type !== "address")
+            return null;
+        const details = payload.address_details;
+        const countryId = Number(payload.country_id) || 0;
+        return {
+            country: details?.country
+                ? {
+                    id: details.country.id,
+                    name: details.country.name,
+                    code: details.country.code ?? payload.country_code ?? "",
+                }
+                : undefined,
+            region: details?.region
+                ? {
+                    id: Number(details.region.id),
+                    name: details.region.name,
+                    country_id: countryId,
+                    code: details.region.code ?? undefined,
+                }
+                : undefined,
+            city: details?.city
+                ? {
+                    id: Number(details.city.id),
+                    name: details.city.name,
+                    country_id: countryId,
+                }
+                : undefined,
+            district: details?.district
+                ? {
+                    id: Number(details.district.id),
+                    name: details.district.name,
+                    city_id: Number(details.city?.id) || 0,
+                }
+                : undefined,
+            short_address: details?.short_address,
+        };
+    }
+    /** Synthesise a minimal `Branch` from a mobile branch intent. */
+    buildBranchFromIntent(payload) {
+        if (payload.type !== "branch" || !payload.branch_details)
+            return null;
+        const b = payload.branch_details;
+        const branch = {
+            id: b.id,
+            name: b.name,
+        };
+        if (b.city) {
+            branch.city = { id: 0, name: b.city };
+        }
+        if (b.latitude != null && b.longitude != null) {
+            branch.location = { lat: String(b.latitude), lng: String(b.longitude) };
+        }
+        return branch;
+    }
+    /** Reconstruct the equivalent `ScopeAllocationPayload` from a mobile result. */
+    buildAllocationRequestFromIntent(payload) {
+        if (payload.type === "branch") {
+            return {
+                type: "branch",
+                branch_id: payload.branch_id != null ? String(payload.branch_id) : "",
+            };
+        }
+        if (payload.address_id != null) {
+            return {
+                type: "address",
+                address_id: String(payload.address_id),
+            };
+        }
+        const details = payload.address_details;
+        const request = {
+            type: "address",
+            country_id: payload.country_id != null ? String(payload.country_id) : "",
+            city_id: details?.city?.id != null ? String(details.city.id) : "",
+        };
+        if (details?.region?.id != null) {
+            request.region_id = String(details.region.id);
+        }
+        if (details?.district?.id != null) {
+            request.district_id = String(details.district.id);
+        }
+        return request;
+    }
+    /**
+     * Apply a selection performed inside the mobile app's native sheet.
+     *
+     * Mirrors the post-allocation side-effects of `handleConfirm()` so the
+     * webview ends up in the exact same state as if the user had confirmed via
+     * our component on desktop:
+     *   1. Sets `s-scope-allocation-*` headers for subsequent API calls.
+     *   2. Persists allocation in `Salla.storage.scope` (single source of truth).
+     *   3. Marks the modal as shown for this session and stores the intent so
+     *      delivery-promise / scope-switch UIs reflect the selection.
+     *   4. Clears the API cache so cached data from the previous scope is gone.
+     *   5. Dispatches `salla::bullet-delivery.allocation.confirmed`,
+     *      `bulletDeliveryConfirmed`, and the header-context update event so
+     *      every listener (header pill, cart view, etc.) syncs.
+     *   6. Reloads the page so prices, availability, and cart reflect the
+     *      newly-selected scope (matches desktop behaviour).
+     */
+    applyMobileBulletDeliverySelection(payload) {
+        if (!payload || (payload.type !== "address" && payload.type !== "branch")) {
+            console.warn("SallaBulletDelivery: ignoring invalid mobile select payload", payload);
+            return;
+        }
+        const headers = payload.allocation_headers ?? {};
+        const allocationType = headers["s-scope-allocation-type"] ?? payload.type;
+        const allocationId = headers["s-scope-allocation-id"];
+        if (allocationType) {
+            Salla.api.setHeader("s-scope-allocation-type", allocationType);
+        }
+        if (allocationId) {
+            Salla.api.setHeader("s-scope-allocation-id", String(allocationId));
+        }
+        const existingScope = Salla.config.get("store.scope", Salla.storage.get("scope")) || {};
+        Salla.storage.set("scope", {
+            ...existingScope,
+            allocation_type: allocationType,
+            allocation_id: allocationId ? String(allocationId) : undefined,
+        });
+        this.markShownThisSession();
+        // Normalise headers in the persisted intent: keep only the mobile-provided
+        // values so storefront reads see the same shape as the desktop confirm flow.
+        const normalisedIntent = {
+            ...payload,
+            allocation_headers: {
+                "s-scope-allocation-type": allocationType,
+                "s-scope-allocation-id": allocationId
+                    ? String(allocationId)
+                    : undefined,
+            },
+        };
+        this.setStoredIntent(normalisedIntent);
+        clearApiCache();
+        const branch = this.buildBranchFromIntent(normalisedIntent);
+        const allocationConfirmedPayload = {
+            ...normalisedIntent,
+            address: this.buildAllocationConfirmedAddressFromIntent(normalisedIntent),
+            branch,
+            allocation_request: this.buildAllocationRequestFromIntent(normalisedIntent),
+            allocation_response: null,
+        };
+        Salla.event.dispatch("salla::bullet-delivery.allocation.confirmed", allocationConfirmedPayload);
+        this.bulletDeliveryConfirmed.emit({
+            ...normalisedIntent,
+            branch: branch ?? undefined,
+        });
+        this.emitHeaderContextUpdate(normalisedIntent, undefined, branch ?? undefined);
+        // Reload so products / cart / header reflect the new scope, matching the
+        // desktop confirm flow. Small delay lets the dispatched events propagate
+        // to any in-page listeners before the navigation tears the document down.
+        setTimeout(() => window.location.reload(), 100);
+    }
+    extractMobileSelectPayload(raw) {
+        if (!raw || typeof raw !== "object")
+            return null;
+        // Some mobile bridges deliver the original `{ event, payload }` envelope
+        // while a normal Salla.event dispatch passes the data directly.
+        if ("payload" in raw && raw.payload) {
+            return raw.payload;
+        }
+        return raw;
+    }
     async handleConfirm() {
         if (this.isConfirmDisabled() || this.confirming)
             return;
@@ -1870,13 +2043,36 @@ export class SallaBulletDelivery {
         }
     }
     render() {
-        return (h(Host, { key: '0daead232faa6590712faef140ab694b3324960e', class: "s-bullet-delivery" }, h("salla-modal", { key: '4f318a88c10b524d5f6b71a46cb93535d4b25a82', ref: (modal) => {
+        if (this.isMobileApp)
+            return null;
+        return (h(Host, { class: "s-bullet-delivery" }, h("salla-modal", { ref: (modal) => {
                 this.modal = modal;
-            }, isClosable: !this.isRequired && !this.shouldForceNonClosable(), class: "s-bullet-delivery-modal", width: "sm" }, h("div", { key: '66f3d844ce325e47bfb52f941c038339f3f0cf6c', class: "s-bullet-delivery-inner" }, this.viewMode === "main" && this.renderMainView(), this.viewMode === "add-address" && this.renderAddAddressForm()))));
+            }, isClosable: !this.isRequired && !this.shouldForceNonClosable(), class: "s-bullet-delivery-modal", width: "sm" }, h("div", { class: "s-bullet-delivery-inner" }, this.viewMode === "main" && this.renderMainView(), this.viewMode === "add-address" && this.renderAddAddressForm()))));
     }
     componentDidLoad() {
         // Mark component as ready
         this.componentReady = true;
+        if (this.isMobileApp) {
+            // Ask the mobile app to render its native delivery sheet (replacement for our modal).
+            Salla.event.dispatch('salla::bullet-delivery.open-sheet');
+            // When the user confirms inside the mobile sheet, mobile dispatches
+            // `salla::bullet-delivery.select` with a payload equivalent to what
+            // `handleConfirm()` produces on desktop. Apply the same side-effects.
+            this.bulletDeliveryMobileSelectHandler = (raw) => {
+                const payload = this.extractMobileSelectPayload(raw);
+                if (!payload) {
+                    console.warn("SallaBulletDelivery: received empty mobile select payload", raw);
+                    return;
+                }
+                this.applyMobileBulletDeliverySelection(payload);
+            };
+            Salla.event.on("salla::bullet-delivery.select", this.bulletDeliveryMobileSelectHandler);
+            // Skip desktop-only initialisation: the auto-open strategy switch and the
+            // cart:items.start hook mount are both no-ops or actively harmful in the
+            // mobile webview (no modal exists, and we'd inject a non-functional HTML
+            // pill into the native cart UI).
+            return;
+        }
         // Handle pending open request (if event was emitted before component was ready)
         if (this.pendingOpen) {
             this.pendingOpen = false;
@@ -1959,6 +2155,10 @@ export class SallaBulletDelivery {
             Salla.event.off("salla-login::closed", this.loginClosedHandler);
             this.loginClosedHandler = null;
         }
+        if (this.bulletDeliveryMobileSelectHandler) {
+            Salla.event.off("salla::bullet-delivery.select", this.bulletDeliveryMobileSelectHandler);
+            this.bulletDeliveryMobileSelectHandler = null;
+        }
     }
     static get is() { return "salla-bullet-delivery"; }
     static get originalStyleUrls() {

package/dist/collection/components/salla-cart-coupons/salla-cart-coupons.js

@@ -236,7 +236,7 @@ export class SallaCartCoupons {
             : `${salla.lang.get('pages.cart.expires_after')} ${coupon.remaining_days} ${salla.lang.get('pages.cart.day')}`)), coupon.minimum_amount && parseFloat(coupon.minimum_amount.amount) > 0 && (h("div", { class: "s-cart-coupons-minimum" }, salla.lang.get('pages.cart.minimum'), " ", h("span", { innerHTML: salla.money(coupon.minimum_amount.amount, coupon.minimum_amount.currency) })))), h("div", { class: "s-cart-coupons-action" }, isEligible ? salla.lang.get('pages.cart.save_coupon') : salla.lang.get('pages.cart.coupon_not_compatible'))))));
     }
     render() {
-        return (h(Host, { key: '06e285be96e1b3cb5f30768bbde2799ba3877301' }, h("div", { key: '5eafc2657a6ac40069b6770cad0254ce818ca2a0', class: "s-cart-coupons-wrapper" }, h("div", { key: 'baffec795f630d009a64ba4fa5b8b8e95c997964', class: "s-cart-coupons-input-section" }, h("label", { key: '45abf5b292725af1543d32257a965404f8d30f36', htmlFor: "coupon-input", class: "s-cart-coupons-coupon-label" }, salla.lang.get('pages.cart.have_coupon')), h("div", { key: '144676d26effbf19c34008cdb14f20fa7c227e70', class: "s-cart-coupons-coupon-input-container" }, h("input", { key: 'b398928219e33171f32412bb2d41b0d9700c3369', type: "text", id: "coupon-input", name: "coupon", class: `form-input ${this.couponError ? 's-coupon-input-error' : ''}`, placeholder: salla.lang.get('pages.cart.coupon_placeholder'), value: this.couponInputValue, disabled: !!this.currentCoupon || this.isApplying, ref: el => this.couponInputRef = el, "aria-label": salla.lang.get('pages.cart.apply_coupon') }), h("salla-button", { key: 'f6ea624d4ac233c1ecd26a3c8d11ba84bc07b940', ref: el => this.couponButtonRef = el, class: `s-cart-coupons-coupon-button ${this.currentCoupon ? 's-cart-coupons-coupon-button-remove' : 's-cart-coupons-coupon-button-apply'}`, color: this.currentCoupon ? 'danger' : 'primary', loading: this.isApplying, "loader-position": "center", onClick: () => this.handleCouponButtonClick() }, this.currentCoupon ? (h("i", { class: "sicon-cancel" })) : (h("span", null, salla.lang.get('pages.cart.save_coupon'))))), this.couponError && (h("span", { key: '31a5f1b35fe53207706831284a2b8ea7b7384b4a', class: "s-cart-coupons-coupon-error" }, this.couponError))), this.availableCoupons && this.availableCoupons.length > 0 && (h("salla-slider", { key: 'e0201b153738446fcda9d28d4ad1bab7d69c950e', type: "carousel", showControls: false, class: "s-cart-coupons-slider" }, h("div", { key: 'd60bfa116bef42a2a25806703e05d18d0084d466', slot: "items" }, this.availableCoupons.map(coupon => this.renderCouponCard(coupon))))))));
+        return (h(Host, { key: 'f3f3d943ab2c1a6488a1da02d2cc031dbc88b482' }, h("div", { key: 'abf88828017041b19a6c54ba2f99e6c246bd8d04', class: "s-cart-coupons-wrapper" }, h("div", { key: 'c2946579a7cca935722997229f50ede603acb8b2', class: "s-cart-coupons-input-section" }, h("label", { key: '50042d827c86daf853babd4e41ba3a920aceda9d', htmlFor: "coupon-input", class: "s-cart-coupons-coupon-label" }, salla.lang.get('pages.cart.have_coupon')), h("div", { key: '4b01047727bd3a83f6cfbac37221e7732076248f', class: "s-cart-coupons-coupon-input-container" }, h("input", { key: '555108f68b7a60c618d9a904905ef321cd274c7a', type: "text", id: "coupon-input", name: "coupon", class: `form-input ${this.couponError ? 's-coupon-input-error' : ''}`, placeholder: salla.lang.get('pages.cart.coupon_placeholder'), value: this.couponInputValue, disabled: !!this.currentCoupon || this.isApplying, ref: el => this.couponInputRef = el, "aria-label": salla.lang.get('pages.cart.apply_coupon') }), h("salla-button", { key: '0416bbaf029f7d8951ca6a419cdc676ae50ee792', ref: el => this.couponButtonRef = el, class: `s-cart-coupons-coupon-button ${this.currentCoupon ? 's-cart-coupons-coupon-button-remove' : 's-cart-coupons-coupon-button-apply'}`, color: this.currentCoupon ? 'danger' : 'primary', loading: this.isApplying, "loader-position": "center", onClick: () => this.handleCouponButtonClick() }, this.currentCoupon ? (h("i", { class: "sicon-cancel" })) : (h("span", null, salla.lang.get('pages.cart.save_coupon'))))), this.couponError && (h("span", { key: 'f7c77e8676cb07b4820b571dbd8ee25dca79a1b1', class: "s-cart-coupons-coupon-error" }, this.couponError))), this.availableCoupons && this.availableCoupons.length > 0 && (h("salla-slider", { key: 'daee9c6705de734d5f81ff86d92ad6952b5a7332', type: "carousel", showControls: false, class: "s-cart-coupons-slider" }, h("div", { key: '5d5ef30a6ff7f7c2b406cc5cec6622c2f028d17e', slot: "items" }, this.availableCoupons.map(coupon => this.renderCouponCard(coupon))))))));
     }
     static get is() { return "salla-cart-coupons"; }
     static get originalStyleUrls() {

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

@@ -102,7 +102,7 @@ export class SallaCartSummary {
         return cartUrl;
     }
     render() {
-        return (h(Host, { key: '14e724a96abab2d16444b94e4e13964fb970c39a' }, h("a", { key: '91095f9e7e119a9a512a0f3b7c9ac5130f8224c6', class: "s-cart-summary-wrapper", href: this.getCartLink() }, h("div", { key: '6aeeea8c529abd02c012a36c9d4bda66f7e1f64d', id: "s-cart-icon" }, h("slot", { key: 'a9de44b9c24c779905ce2a72055378632b80bb70', name: "icon" }, h("i", { key: 'c82466e218ba8602b7f7cccee1874c52a94a3e3e', class: "s-cart-summary-icon", innerHTML: CartIcon }))), h("span", { key: '37c8068bd685f1d64dcc646369134a3302f2164c', class: "s-cart-summary-count" }, salla.helpers.number(this.cartSummaryCount)), h("p", { key: '7880ea8fe28b197d0874d2fbe2dc44f52ea4b364', class: "s-cart-summary-content" }, this.showCartLabel && h("span", { key: '1a6e2a3a26b7d23a82ede015fd660e98c03f8e86', class: "s-cart-summary-label" }, this.cartLabel), h("b", { key: 'ddce63b92173cc9adff16bc2805e7b154d3e5d90', class: "s-cart-summary-total", innerHTML: salla.money(this.cartSummaryTotal) })))));
+        return (h(Host, { key: '918f027fd28cd25d653b8419f97223daaf22d428' }, h("a", { key: 'b74a2724ada356a01b915044d56dfb0f9953338e', class: "s-cart-summary-wrapper", href: this.getCartLink() }, h("div", { key: 'b9332fe1b66b895c1e9950efaa548f04eb053d46', id: "s-cart-icon" }, h("slot", { key: '2b5c1cf8dea4ca23a54beeb83cfad44538ca3ab7', name: "icon" }, h("i", { key: 'f3145ed4a994762441d925280a3234d78c378bef', class: "s-cart-summary-icon", innerHTML: CartIcon }))), h("span", { key: '26a78adf9b279019504e995216ea5373b6866876', class: "s-cart-summary-count" }, salla.helpers.number(this.cartSummaryCount)), h("p", { key: '60ad091221ed5cd3e2ac0d27ebc53ec9917ccd64', class: "s-cart-summary-content" }, this.showCartLabel && h("span", { key: '66819086b9ed7f6f21be2cd5e8baf0bc88021e40', class: "s-cart-summary-label" }, this.cartLabel), h("b", { key: 'a07c85971e50add3cdd5b51942e642d4daf19d82', class: "s-cart-summary-total", innerHTML: salla.money(this.cartSummaryTotal) })))));
     }
     static get is() { return "salla-cart-summary"; }
     static get originalStyleUrls() {

package/dist/collection/components/salla-color-picker/salla-color-picker.js

@@ -198,7 +198,7 @@ export class SallaColorPicker {
         });
     }
     render() {
-        return (h(Host, { key: 'f1c244ae30b02bed79b8d4de1adf667d697e1f82', class: "s-color-picker-main" }, h("slot", { key: '9fd1e6d787b6768364d6784d8728c815dc597fc4', name: "widget" }, h("div", { key: '3717b7e1d2ff9e07172570c67397c7b9fc223195', class: "s-color-picker-widget" }, h("div", { key: 'df43c0be157d3546b5b53e8290412df2c55a2bbf', class: "s-color-picker-widget-canvas", ref: dv => (this.canvas = dv) }), h("span", { key: '879d020f9b3d0a6e3c4899948611fa76a2fa2324', innerHTML: ArrowDown }))), h("input", { key: 'b4b13cc56691dca5756c4828d6ba96b670ddff2f', class: "s-hidden", name: this.name, required: this.required, value: this.color, ref: color => (this.colorInput = color) })));
+        return (h(Host, { key: '2f142fd64afd5571574a7e1c40de3be16ede62e6', class: "s-color-picker-main" }, h("slot", { key: '92acdf14b2f42ac52d0a632ba6840a5dcebfa4d4', name: "widget" }, h("div", { key: '7ba074040299a91802109d0e1d2e78604e39d3a8', class: "s-color-picker-widget" }, h("div", { key: 'a6272207f79fd28e33b66e415a3e05b969ace983', class: "s-color-picker-widget-canvas", ref: dv => (this.canvas = dv) }), h("span", { key: 'e6fed242bb84fae6221cdec525658b68f7514ce7', innerHTML: ArrowDown }))), h("input", { key: '9eb1673f44e663f939124da45fec79c401736203', class: "s-hidden", name: this.name, required: this.required, value: this.color, ref: color => (this.colorInput = color) })));
     }
     componentDidLoad() {
         if (this.canvas)

package/dist/collection/components/salla-comment-form/salla-comment-form.js

@@ -38,7 +38,7 @@ export class SallaCommentForm {
             .finally(() => this.submitBtn.stop());
     }
     render() {
-        return (h(Host, { key: 'a9caa6cb393989ab534471f5fabed599ec0a8a66' }, !!this.canComment ? h("form", { ref: frm => this.commentForm = frm }, h("div", { class: "s-comment-form-wrapper" }, this.showAvatar ?
+        return (h(Host, { key: '0ec765c8dd7cf28d23c4305c234cec5efd3daae1' }, !!this.canComment ? h("form", { ref: frm => this.commentForm = frm }, h("div", { class: "s-comment-form-wrapper" }, this.showAvatar ?
             h("img", { class: "s-comment-form-avatar", src: salla.config.get('user.avatar'), alt: "user avatar" }) : '', h("div", { class: "s-comment-form-content" }, h("textarea", { cols: 30, rows: 5, minlength: "4", maxlength: "500", ref: field => this.commentField = field, placeholder: this.placeholder, class: "s-comment-form-input", required: true }), h("br", null), h("div", { class: "s-comment-form-action" }, h("salla-button", { ref: btn => this.submitBtn = btn, "loader-position": 'center', onClick: () => this.submit() }, this.submitText))))) : ''));
     }
     static get is() { return "salla-comment-form"; }

package/dist/collection/components/salla-comments/salla-comment-item.js

@@ -121,15 +121,15 @@ export class SallaCommentItem {
     }
     render() {
         let isAdmin = this.comment.type == 'admin';
-        return (h(Host, { key: 'f17a6ca5a30774c5e1717a2dd38ea60c7f6d115f', class: isAdmin ? 's-comments-item-admin' : 's-comments-item' }, h("div", { key: '5aaee8d0d106b7ab13d7ee6d5faeca62d1a63e5a', class: { "s-comments-item-wrapper": !isAdmin, "s-comments-item-admin-wrapper": isAdmin }, id: `s-comments-item-${this.comment.id}` }, h("div", { key: '5a4a64b66ca042659fc1cea7ccdd5817d880591d', class: "s-comments-item-inner s-comments-flex-1" }, isAdmin && h("span", { key: '2a26096e1d38747c230353c8c88de8eea5f3cec8', class: "s-comments-item-reply-icon", innerHTML: Reply }), h("div", { key: '6862b2147ddf33832f91d297bc5d8903cef65f3e', class: "s-comments-item-avatar" }, h("img", { key: '13e3856709d1a714e324ad164fe6cc8ac4602a69', "data-src": this.comment?.avatar, alt: this.comment?.name, src: this.comment?.avatar, class: "s-comments-item-avatar-img lazy" })), h("div", { key: '376665b2687ace024833109874642a144083a15e', class: "s-comments-flex-1" }, h("div", { key: 'b18b0cddaca195565a14685e48896c3f832f1c75', class: "s-comments-item-user-wrapper" }, h("div", { key: '87e199f5c0c3cae12072d082042274a6e00fcdf2', class: "s-comments-item-user-info" }, h("h3", { key: '730741d83523f9798e795655206958ba8bd06de7', class: this.comment.is_pinned ? "s-comments-item-user-info-name" : "s-comments-item-user-info-name-with-margin" }, this.comment?.name), this.comment.is_pinned ?
+        return (h(Host, { key: '3f9d4b98cff2dd49259d3386b4996b905f92d7db', class: isAdmin ? 's-comments-item-admin' : 's-comments-item' }, h("div", { key: '1348f11b2e553be483f60c5c558d3e800f050700', class: { "s-comments-item-wrapper": !isAdmin, "s-comments-item-admin-wrapper": isAdmin }, id: `s-comments-item-${this.comment.id}` }, h("div", { key: '0587afd7ae1fc27b12fc4fd2c9ef4bf9e919d04a', class: "s-comments-item-inner s-comments-flex-1" }, isAdmin && h("span", { key: '40009b2b3b9af60481d0e40d5fb919076ab43b10', class: "s-comments-item-reply-icon", innerHTML: Reply }), h("div", { key: '8f0563811445046ecf5ce3abe6ee6d7d1ec4a235', class: "s-comments-item-avatar" }, h("img", { key: '5f82bb9d3a5c4c340f37b8e48af3edce42c133f8', "data-src": this.comment?.avatar, alt: this.comment?.name, src: this.comment?.avatar, class: "s-comments-item-avatar-img lazy" })), h("div", { key: '34581ee9fddaa2f79ee933efb65c2e354010f37a', class: "s-comments-flex-1" }, h("div", { key: 'e03fc074d5ac8ddf183e3b081001e73dd62a7116', class: "s-comments-item-user-wrapper" }, h("div", { key: '6ea5e07eb9fa35d7673019628e6fde4605b74e0c', class: "s-comments-item-user-info" }, h("h3", { key: '18d7cf8c8b8125138a544bd10027ae7503f2f3a6', class: this.comment.is_pinned ? "s-comments-item-user-info-name" : "s-comments-item-user-info-name-with-margin" }, this.comment?.name), this.comment.is_pinned ?
             h("div", { class: "s-comments-item-pinned-icon-with-margin" }, this.PinnedIcon())
             : null, (this.comment.has_order || !!this.comment.rating) && !this.comment.is_pending && !this.hideBought ?
             h("div", { class: "s-comments-flex" }, this.comment.has_order ?
                 [h("span", { class: "s-comments-item-has-order-check-icon", innerHTML: CheckIcon }), h("span", { class: "s-comments-item-has-order-check-text" }, this.has_bought_trans, " ", this.comment.rating ? ', ' : '')] : null, !!this.comment.rating ?
                 h("span", { class: "s-comments-item-rated-widget" }, this.rated_trans) : null)
-            : null), h("p", { key: '0ed20c109de0bdbe61344327a633b72e3881b6ce', class: "s-comments-item-timestamp s-ltr" }, this.getDate(this.comment.created_at?.date), h("span", { key: '922b11bc062c1ce6e53e997a2a5708f545e92c2a', class: "s-comments-item-time" }, " - ", this.getTime(this.comment.created_at?.date))), !!this.comment.rating || !!this.comment.stars ?
+            : null), h("p", { key: '694c2079d3379966994af7040fe4542481a53e66', class: "s-comments-item-timestamp s-ltr" }, this.getDate(this.comment.created_at?.date), h("span", { key: '734ca2eb6bf846c661007a1b9c41f22c47923b27', class: "s-comments-item-time" }, " - ", this.getTime(this.comment.created_at?.date))), !!this.comment.rating || !!this.comment.stars ?
             h("salla-rating-stars", { size: "mini", class: "s-comments-item-stars", value: this.comment.rating || this.comment.stars })
-            : null), h("div", { key: '288ed655c6c223ec54f84da46088b57734524839', class: "s-comments-item-content" }, h("p", { key: '6ac007441490d1b1479811d6bcdc6841b181fa95', innerHTML: this.comment.content }), this.allowAttachImages && h("div", { key: '2046daf302f3813482bc2736e5b942cc13a704c8', class: "s-comments-item-images" }, this.comment.images.map((image, index) => (h("img", { key: index, src: image, alt: "", onClick: () => this.modal.open() }))), h("salla-modal", { key: '61326b451d2275514510b599e97a94e8a38a18f5', ref: modal => this.modal = modal, width: "sm" }, h("salla-slider", { key: '4496ed68e88120e30ccbb3daf9d11dccd56dcce5', id: `s-comments-item-${this.comment.id}-images`, class: "s-comments-item-images-slider", type: "thumbs", "auto-height": true, showControls: this.comment.images.length > 1 ? true : false, "show-thumbs-controls": "false" }, h("div", { key: 'ea919a2d8717378d56b9c541e635a932f8b8a1ff', slot: 'items' }, this.comment.images.map((image, index) => (h("img", { key: index, src: image, alt: "" })))), h("div", { key: 'af0aa4798aa0a1ab126799120f5bce6b2cbee777', slot: "thumbs" }, this.comment.images.map((image, index) => (h("div", { class: "s-comments-item-images-slider-thumb" }, h("img", { key: index, src: image, alt: "" })))))))), this.allowLikes && !isAdmin && !!this.comment.id && salla.url.is_page('product.single') ? h("salla-button", { ref: el => this.likeBtn = el, class: `s-comments-item-like-btn ${this.likedComments.includes(this.comment.id) ? 'liked' : ''}`, loaderPosition: 'center', fill: 'outline', size: 'small', onClick: () => this.toggleLike() }, h("span", null, this.helpfulLabel, " ", this.likesCount > 0 ? `(${this.likesCount})` : ''), h("span", { innerHTML: ThumbsUp })) : '', this.comment.is_pending ?
+            : null), h("div", { key: '45e32a0759536f8c9e8bc8b823d50c931bdd1e23', class: "s-comments-item-content" }, h("p", { key: '9edf2cdfd489f77214d7a1ecae8a99943dfd4ece', innerHTML: this.comment.content }), this.allowAttachImages && h("div", { key: 'bbba6c62c4d13289137c634f5413880dfa572ab4', class: "s-comments-item-images" }, this.comment.images.map((image, index) => (h("img", { key: index, src: image, alt: "", onClick: () => this.modal.open() }))), h("salla-modal", { key: 'cd5c48b8cf3e1c9457a2fb60a42859cbd91aa996', ref: modal => this.modal = modal, width: "sm" }, h("salla-slider", { key: '304bc9417e6d7fd0e310127dce4e56a1c6ce00ea', id: `s-comments-item-${this.comment.id}-images`, class: "s-comments-item-images-slider", type: "thumbs", "auto-height": true, showControls: this.comment.images.length > 1 ? true : false, "show-thumbs-controls": "false" }, h("div", { key: '50401766737293c42fa7ba3b351b6db736fd92eb', slot: 'items' }, this.comment.images.map((image, index) => (h("img", { key: index, src: image, alt: "" })))), h("div", { key: '6b9a50da0b67497dfae21b52044850329d8712b5', slot: "thumbs" }, this.comment.images.map((image, index) => (h("div", { class: "s-comments-item-images-slider-thumb" }, h("img", { key: index, src: image, alt: "" })))))))), this.allowLikes && !isAdmin && !!this.comment.id && salla.url.is_page('product.single') ? h("salla-button", { ref: el => this.likeBtn = el, class: `s-comments-item-like-btn ${this.likedComments.includes(this.comment.id) ? 'liked' : ''}`, loaderPosition: 'center', fill: 'outline', size: 'small', onClick: () => this.toggleLike() }, h("span", null, this.helpfulLabel, " ", this.likesCount > 0 ? `(${this.likesCount})` : ''), h("span", { innerHTML: ThumbsUp })) : '', this.comment.is_pending ?
             h("span", { class: "s-comments-item-pending-text" }, this.waiting_approval_trans) : null))), !!this.getReplies().length && !isAdmin ?
             this.getReplies().map((reply) => {
                 return h("div", null, h("salla-comment-item", { comment: reply }));

package/dist/collection/components/salla-conditional-fields/salla-conditional-fields.js

@@ -129,7 +129,7 @@ export class SallaConditionalFields {
         });
     }
     render() {
-        return (h(Host, { key: 'e43af073570c2862ec8365297aa40f3ff4319d18' }, h("slot", { key: '0c3577eb4f4c287eb99fe1df054785cbbfbf8dbc' })));
+        return (h(Host, { key: '9e3ff9d4f7209583d5ef3d4f447a7a676e6857e0' }, h("slot", { key: '889bc28c2985d82e3bcd6e4231b135a58dca26d6' })));
     }
     static get is() { return "salla-conditional-fields"; }
     static get elementRef() { return "host"; }

package/dist/collection/components/salla-count-down/salla-count-down.js

@@ -228,7 +228,7 @@ export class SallaCountDown {
         return this.renderCountDown();
     }
     render() {
-        return (h(Host, { key: '9e2372c96dde6479f39d197c29b8edbc7be1b2e4', class: `s-count-down-wrapper ${this.preOrder && this.isValidDate(this.date) ? 's-count-down-pre-order' : ''} ${this.horizontal ? 's-count-down-horizontal' : ''} ${this.withButton ? 's-count-down-with-button' : ''} ${this.offerEnded ? 's-count-down-ended' : ''}` }, this.renderPrefixText(), this.renderContent(), this.offerEnded && this.renderOfferEnded(), this.renderButton()));
+        return (h(Host, { key: '5061e1fab03966fc62e46d4529c4ee07ed01df35', class: `s-count-down-wrapper ${this.preOrder && this.isValidDate(this.date) ? 's-count-down-pre-order' : ''} ${this.horizontal ? 's-count-down-horizontal' : ''} ${this.withButton ? 's-count-down-with-button' : ''} ${this.offerEnded ? 's-count-down-ended' : ''}` }, this.renderPrefixText(), this.renderContent(), this.offerEnded && this.renderOfferEnded(), this.renderButton()));
     }
     static get is() { return "salla-count-down"; }
     static get originalStyleUrls() {

package/dist/collection/components/salla-datetime-picker/salla-datetime-picker.js

@@ -204,7 +204,7 @@ export class SallaDatetimePicker {
         }
     }
     render() {
-        return h("div", { key: '1ab467a6f2e4459d0bdfbd72149fb468fcad4ccb', class: "s-datetime-picker" }, h("input", { key: '7d5a567c0d9f0c4a945a95c342c0f9e3a79a00c3', type: "datetime", name: this.name, value: this.value, required: this.required, disabled: this.disabled, placeholder: this.placeholder, class: "s-datetime-picker-input", ref: (el) => this.dateInput = el }));
+        return h("div", { key: '184743feaf2af9f31cd3b5a864a86f1a561c12fd', class: "s-datetime-picker" }, h("input", { key: '1736e88363b379f872490641168f49090e976e03', type: "datetime", name: this.name, value: this.value, required: this.required, disabled: this.disabled, placeholder: this.placeholder, class: "s-datetime-picker-input", ref: (el) => this.dateInput = el }));
     }
     async componentDidLoad() {
         // Load flatpickr before initializing

package/dist/collection/components/salla-file-upload/salla-file-upload.js

@@ -307,11 +307,11 @@ export class SallaFileUpload {
         }
     }
     render() {
-        return (h(Host, { key: '416c7205e55d1d7aad1528839aee2eb59c49b0b1', class: {
+        return (h(Host, { key: '978e89fe8713e6b3db913ed8fb3c5d09f6caf705', class: {
                 "s-file-upload": true,
                 "s-file-upload-profile-image": this.profileImage,
                 "s-file-upload-multiple": this.allowMultiple,
-            } }, h("input", { key: 'c769a40fe1debf22173492e2039dd9416645cdb7', type: "file", name: this.name, value: this.value, ref: ele => this.fileUploader = ele, required: this.required, class: "s-file-upload-wrapper s-file-upload-input", accept: this.accept }), this.allowMultiple && this.showMaxCountHint ? h("div", { class: "s-file-upload-hint s-hidden" }, this.max_count_hint(this.maxFilesCount)) : '', h("input", { key: '745f7690cfdf1dd4bd7d1c6282d2d716488ac653', class: "s-hidden", name: 'hidden-' + this.name, required: this.required, value: this.value, ref: input => this.hiddenInput = input })));
+            } }, h("input", { key: 'acf6197d43b79a80e7a69219afda29271a86d4eb', type: "file", name: this.name, value: this.value, ref: ele => this.fileUploader = ele, required: this.required, class: "s-file-upload-wrapper s-file-upload-input", accept: this.accept }), this.allowMultiple && this.showMaxCountHint ? h("div", { class: "s-file-upload-hint s-hidden" }, this.max_count_hint(this.maxFilesCount)) : '', h("input", { key: 'b8624b0fcaba14f14640acce0a28c12feb78701b', class: "s-hidden", name: 'hidden-' + this.name, required: this.required, value: this.value, ref: input => this.hiddenInput = input })));
     }
     async componentDidLoad() {
         await Salla.onReady();

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

@@ -187,7 +187,7 @@ export class SallaFilters {
         this.applyFilters();
     }
     render() {
-        return h(Host, { key: '61351c8402dc63b0b122c2e83d0fc6fe989febf3' }, this.filters?.map(option => h("salla-filters-widget", { option: option, filtersData: this.filtersData, onChanged: ({ detail: { event, option, value } }) => {
+        return h(Host, { key: 'f3c454fc20472dca6fe646c9121028a2c045808f' }, this.filters?.map(option => h("salla-filters-widget", { option: option, filtersData: this.filtersData, onChanged: ({ detail: { event, option, value } }) => {
                 this.handleOptionChange(event, option, value);
             } })), this.filters?.length ? h("div", { class: "s-filters-footer" }, h("salla-button", { color: 'gray', fill: 'outline', onClick: () => this.resetFilters() }, this.reset)) : '');
     }

package/dist/collection/components/salla-filters-widget/salla-filters-widget.js

@@ -163,12 +163,12 @@ export class SallaFiltersWidget {
         return h("span", { class: "s-filters-option-name" }, label);
     }
     render() {
-        return (h(Host, { key: '8a76246f5c11a950c79565c54579f23429d6aac7', class: "s-filters-widget-container" }, h("h3", { key: '77e5d39e32759bba2f4709843d799ca59f75aba0', class: "s-filters-widget-title", onClick: () => this.toggleWidget() }, h("span", { key: '9384511282a144b0f15e35c21b7fcc44db1b2acd' }, this.option.label), h("span", { key: 'd6582ecb12ed8dfa8077878617b44067b6647453', class: `s-filters-widget-plusminus ${this.isOpen ? 's-filters-widget-plusminus-active' : ''}` })), h("div", { key: '2bc04d2d6e7cc0adf38e66522e06eef5db3ed5b3', class: "s-filters-widget-content", ref: (el) => this.widgetContent = el }, Array.isArray(this.option.values) && this.option.values.length > 5 && (h("div", { key: '49177c27ab9dec258cf73f20464359a73db90556', class: "s-filters-widget-search-wrapper", style: { padding: '8px 0', marginBottom: '8px' } }, h("input", { key: 'e2870973d51a1ef9ab843c4c90242fe973b3c398', type: "text", class: "s-filters-widget-search-input", placeholder: salla.lang.get('blocks.header.search_placeholder') || 'بحث...', value: this.searchQuery, onInput: (e) => this.searchQuery = e.target.value }))), h("div", { key: 'fceb876a7c16ecd45da92d8cffe8afc8a8b66964', class: "s-filters-widget-values", ref: (el) => this.widgetValues = el }, h("slot", { key: '72c7212d72c11f592a076a6ee9a4e985857332b1' }), this.option.type !== FilterOptionTypes.RANGE
+        return (h(Host, { key: 'e93cfb9f1f6daeb8a2121ccb36a3cf135a55e902', class: "s-filters-widget-container" }, h("h3", { key: 'd5ef45d78e0119e2ac997ded417e310c0a797c34', class: "s-filters-widget-title", onClick: () => this.toggleWidget() }, h("span", { key: 'fe4df56fad0d290395d78588456fb7d00a20ed43' }, this.option.label), h("span", { key: 'c961f86b5e06437dfdd145e164da5fe326500032', class: `s-filters-widget-plusminus ${this.isOpen ? 's-filters-widget-plusminus-active' : ''}` })), h("div", { key: '7cf1ed1b562bf16acc481f682965567d8bc1813c', class: "s-filters-widget-content", ref: (el) => this.widgetContent = el }, Array.isArray(this.option.values) && this.option.values.length > 5 && (h("div", { key: '275427371f48fdfc8ef8b80b9d3e11fa247f7d7a', class: "s-filters-widget-search-wrapper", style: { padding: '8px 0', marginBottom: '8px' } }, h("input", { key: '473c082ed9f7415beba445d36a121027eaadbbe1', type: "text", class: "s-filters-widget-search-input", placeholder: salla.lang.get('blocks.header.search_placeholder') || 'بحث...', value: this.searchQuery, onInput: (e) => this.searchQuery = e.target.value }))), h("div", { key: 'e45654731cdd801345acc5b3311d9ddab3020035', class: "s-filters-widget-values", ref: (el) => this.widgetValues = el }, h("slot", { key: '5ae673157a4b579a000901b04db8e375a52565e7' }), this.option.type !== FilterOptionTypes.RANGE
             ? this.renderFilterOption(this.option)
             : h("salla-price-range", { onChanged: (event) => {
                     this.changed.emit(event.detail);
                 }, ref: price => this.priceRange = price, filtersData: this.filtersData, option: this.option })), this.withLoadMore && (!this.searchQuery || this.filteredCount > this.initialItemCount) &&
-            h("a", { key: '81704b05fb989d0c88388a2e277832cb94dd73aa', class: "s-filters-widget-more", onClick: () => this.showMore() }, !this.isShowMore ? this.showMoreLabel : this.showLessLabel))));
+            h("a", { key: '8ec08429d8fb31b338e6f9f9cf455b5ba2155cb8', class: "s-filters-widget-more", onClick: () => this.showMore() }, !this.isShowMore ? this.showMoreLabel : this.showLessLabel))));
     }
     static get is() { return "salla-filters-widget"; }
     static get originalStyleUrls() {

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

@@ -542,7 +542,7 @@ export class SallaGifting {
     }
     render() {
         return [
-            h("div", { key: '9eab09a8d191d1f268aa6c70b1cca83ed8e6bbbc' }, h("salla-list-tile", { key: 'c56c0c1430286a492fb7afaba27af031057d9112', class: this.generateClass() }, h("div", { key: 'e072712d90b16f10a5fb94cdf2590f702f519052', slot: "title" }, this.vertical ? h("span", { innerHTML: GiftSharing }) : '', h("h3", { key: '11ce3fb3d72e3533ca5d3ab6b24c848f854ca074' }, !!this.widgetTitle ? this.widgetTitle : this.sectionTitle)), h("div", { key: 'dbaaf141723d74ab0bc8953cd16b5693d155de88', slot: "subtitle" }, h("div", { key: '9496550746b51da10964afd16f0b14d1098e5963' }, !!this.widgetSubtitle ? this.widgetSubtitle : this.sectionSubtitle)), h("div", { key: 'a74eea478aedecd9f6db0e3f28ace121771d1e5b', slot: "action" }, h("salla-button", { key: '53db44ebad2924d8a785a658421c58d108f98c13', color: "primary", fill: "outline", width: "wide", class: "s-gifting-widget-action", onClick: () => this.handleGiftButtonClick() }, h("slot", { key: 'a1ad93eb3612332f0464735b20aa879268a6da66', name: "widget-btn-content" }, h("div", { key: '7f7cff081a3d8d5d53e29a7c65d2a9cf9ac897a5', class: "s-gifting-widget-action-content" }, h("span", { key: 'dd3beac6683c84511ec4ba048791fa019e1ea4af', innerHTML: GiftSharing }), " \u00A0", h("span", { key: '4a1d029a931e051928565cec9ad821d041420a37' }, this.sectionBtnText)))))), h("salla-modal", { key: 'cddcacea4ba99a97286718a8fd2f9739393b73cf', id: this.hostId, isLoading: true, class: "s-gifting-modal", width: "sm", ref: modal => this.modal = modal }, h("div", { key: '252f2f5fe2848ca26fe9b6050bc47c96400d93ea', slot: "loading" }, h("div", { key: 'e8b933882138ed9c06a5ee31fc7a80f0f22857cb', class: "s-gifting-skeleton" }, h("div", { key: '587f61dc4e26b9cd7a634d37e638d59a4b32428d', class: "s-gifting-modal-header" }, h("salla-skeleton", { key: '6986dd5bb120de2e0a56e6a11566be8517a7de31', type: 'circle', height: '5rem', width: '5rem' }), h("h2", { key: 'fa0dfd4b1faa9ce7c0e6a048a37fcc0edd209ef5', class: "s-gifting-modal-title" }, h("div", { key: '13d13831a3d3cf55e785fdc4153fd7f3ad4c818e', class: "s-gifting-modal-badge-wrapper" }, h("salla-skeleton", { key: '48a8933d1bef7c5a8e6c16f9ddd1ff2e95f1ac1f', height: '15px', width: '150px' })))), h("div", { key: '44686a2a7638c528fcd58855269b89af4d495a8d', class: "s-gifting-skeleton-content" }, h("salla-skeleton", { key: '45564ae54508c7f60332bcfc0b379bb4f35db9d4', height: '10px', width: '150px' }), h("salla-skeleton", { key: 'ce4c13cb00ed12ee044932b2be4c11bb55067828', height: '230px' }), h("salla-skeleton", { key: '6682e113a5a1a5fdaf526b3003dc3d45698a4d61', height: '10px', width: '150px' }), h("salla-skeleton", { key: 'cbaa18a09272ed058af2e4e8baa954fafd28508b', height: '30px' }), h("salla-skeleton", { key: '830b4ae7d3b1772b143dbf651baeecd211f880b7', height: '40px' })))), h("slot", { key: 'e7375a013b2dff74646ce289896dc340b0f5da9a', name: "header" }), !!this.hasError ?
+            h("div", { key: 'ea8b7581fc816b2984ec7a8c9f0d5bfb30710577' }, h("salla-list-tile", { key: '44e4b948c467ecbec4934f894af3e88a01567338', class: this.generateClass() }, h("div", { key: 'c36ccc48ff4209d2aad05123981c8efad4de8642', slot: "title" }, this.vertical ? h("span", { innerHTML: GiftSharing }) : '', h("h3", { key: 'd5cfd335582f2af620ef50ae92b431b3fdf84b71' }, !!this.widgetTitle ? this.widgetTitle : this.sectionTitle)), h("div", { key: '9623168820eefb63c833dd14c68c1dc20afe1cd1', slot: "subtitle" }, h("div", { key: 'e2fda7dc68054c0f382f61d74a578589b565a544' }, !!this.widgetSubtitle ? this.widgetSubtitle : this.sectionSubtitle)), h("div", { key: 'e888e024772c0ef848e4a4113b218bb4e05d78db', slot: "action" }, h("salla-button", { key: 'd443bfd1f5925299a4e0510fae8fc175d390b55a', color: "primary", fill: "outline", width: "wide", class: "s-gifting-widget-action", onClick: () => this.handleGiftButtonClick() }, h("slot", { key: '8df23b83891ee2abf644cde76675ca6bb796db79', name: "widget-btn-content" }, h("div", { key: '6b5153a1f1b9d5e127093c3fcc96e2a0fa4954f4', class: "s-gifting-widget-action-content" }, h("span", { key: '41a7f2e88c8046d7211abf5d7fc9d3f533c02292', innerHTML: GiftSharing }), " \u00A0", h("span", { key: '45ea8eac19ca9cccf37cd34d8f84211e6172cd45' }, this.sectionBtnText)))))), h("salla-modal", { key: '5bd076c54c4d072886671653e536c649763785b1', id: this.hostId, isLoading: true, class: "s-gifting-modal", width: "sm", ref: modal => this.modal = modal }, h("div", { key: '378d12f388bd0627355af5b4e57929c00ae28044', slot: "loading" }, h("div", { key: '1b738d4b461a9ebe3a5184f4de727bb1b4b45890', class: "s-gifting-skeleton" }, h("div", { key: '660c901f477536e68d2a3bacd028438c9726b968', class: "s-gifting-modal-header" }, h("salla-skeleton", { key: '46f8e45a0a38c10784fc5f3505092e65ed2bba3a', type: 'circle', height: '5rem', width: '5rem' }), h("h2", { key: '09b3356d736e5eb46bb51df2e2fa539dc9d8c99f', class: "s-gifting-modal-title" }, h("div", { key: 'cc8cb7dece64c65d5891e32e49588316e9009f6c', class: "s-gifting-modal-badge-wrapper" }, h("salla-skeleton", { key: '41b30274a655babdd0c9e26e74dc3f0bdd4a2aea', height: '15px', width: '150px' })))), h("div", { key: 'b241162827a085279f646452a151d6483a37cc8e', class: "s-gifting-skeleton-content" }, h("salla-skeleton", { key: '5ac15a8e94b50ea03cd033375b08f9e4406a7e17', height: '10px', width: '150px' }), h("salla-skeleton", { key: '697e157e475df0cb71b79e3752019f522ed847a3', height: '230px' }), h("salla-skeleton", { key: '8a5e586c059b765f6425d7060a18e8d799be3c4f', height: '10px', width: '150px' }), h("salla-skeleton", { key: 'e1ee17daef6904b8302b0f4437e99b221bd6b236', height: '30px' }), h("salla-skeleton", { key: '9dfbca00f18a37348eb83021ef4fec073685fe7d', height: '40px' })))), h("slot", { key: 'da2c687a186ed115acee04cc683eff3a6a73168f', name: "header" }), !!this.hasError ?
                 h("salla-placeholder", { alignment: "center" }, h("span", { slot: "title" }, this.errorMessage || salla.lang.get('common.errors.empty_results')), h("span", { slot: "description" }, " "))
                 :
                     [
@@ -562,7 +562,7 @@ export class SallaGifting {
                             h("div", { class: this.step2ItemClass(this.errors?.['receiver.city_id'] ? 's-form-group s-form-has-error' : 's-form-group') }, h("label", { class: "s-form-label" }, this.receiverCityFieldLabel), h("select", { name: "city", "aria-label": salla.lang.get('blocks.buy_as_gift.select_city'), class: "s-form-control", onChange: (event) => this.handleReceiverCity(event), disabled: this.loadingCities || (this.isKSA && !this.selectedRegionId) }, h("option", { value: "", selected: true }, this.loadingCities ? salla.lang.get('common.elements.loading') : this.selectCity), this.gift?.cities?.map((city) => (h("option", { value: city.id }, city.name)))), this.errors && this.errors['receiver.city_id'] ?
                                 h("span", { class: "s-gifting-error" }, this.errors['receiver.city_id']) : ''), this.isPhysical() &&
                             h("div", { class: this.step2ItemClass('s-gifting-info') }, h("span", { innerHTML: Alert }), h("span", null, this.selectCityInfo)), !this.isPhysical() && h("div", { class: this.step2ItemClass() }, h("label", { class: "s-gifting-schedule s-gifting-clickable", htmlFor: `schedule-${this.hostId}` }, h("input", { type: "checkbox", name: 'schedule', id: `schedule-${this.hostId}`, onChange: () => this.toggleCalendar(), class: "s-checkbox" }), h("span", { class: "s-form-label" }, " ", this.sendLater, " "))), h("div", { class: this.getCalendarClasses(), ref: (el) => this.calendarFormGroup = el }, h("label", { class: "s-form-label" }, this.selectSendDateAndTime), h("salla-datetime-picker", { value: this.deliveryDate, placeholder: this.selectSendDateAndTime, "enable-time": true, "date-format": "Y-m-d h:i K", onPicked: (event) => this.handleDateTimePicker(event) }), h("span", { class: "s-gifting-calendar-hint" }, this.canNotEditOrderAfterSelectDate)), h("div", { class: this.step2ItemClass('s-gifting-step-two-footer') }, h("a", { href: "#!", innerHTML: LeftArrow, onClick: (e) => this.goToStep1(e) }), h("salla-button", { onClick: () => this.submitForm(), color: "primary", width: 'wide' }, h("span", null, this.sendGift)))))
-                    ], h("slot", { key: '123248e38585fd933c0221a9a3edc5601a4e0860', name: "footer" })))
+                    ], h("slot", { key: '20793a5a50c708c93be79df033e43a36e615d075', name: "footer" })))
         ];
     }
     static get is() { return "salla-gifting"; }

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

@@ -11,7 +11,7 @@ export class SallaHook {
         this.host.before(element);
     }
     render() {
-        return h(Host, { key: 'db4241e10923c84d9d15a816e6a080475be6a17d' });
+        return h(Host, { key: '618467f6911198a5cbf4270694544575e585af27' });
     }
     async componentDidLoad() {
         // Register this component for hooks system, already on it logic to run componentDidLoad trigger

package/dist/collection/components/salla-list-tile/salla-list-tile.js

@@ -26,7 +26,7 @@ export class SallaListTile {
         };
     }
     render() {
-        return (h(Host, { key: '0ac9ef86306a47377537bed3808b85212f9a291b' }, h("a", { key: '6913bab0f3df27f14c626b0dd97bd5a226b59408', class: this.generateClass(), href: this.href || "#", target: this.target, "aria-label": "List Tile Link" }, h("div", { key: 'b3eaea89b404802c9329be50f3172d29510af001', class: "s-list-tile-item-icon" }, h("slot", { key: 'd0e4b9b46ebe037eb7b937317eb1796dfe522105', name: 'icon' })), h("div", { key: 'd04c5a302dfc33f8107505d7037a22f892297b51', class: "s-list-tile-item-content" }, h("div", { key: '4d5610aaf77eff322ddd296f62840d6927625f0d', class: "s-list-tile-item-title" }, h("slot", { key: 'b9890a0fde7261a3cb60b7daeb3810dd72a3ef41', name: 'title' })), h("div", { key: '60ab7f2e78b8c0da2e1d8dd38aa50692906c7e3f', class: "s-list-tile-item-subtitle" }, h("slot", { key: 'a3a92374c4147c8795a7de8e6e9563fb27001293', name: "subtitle" }))), h("div", { key: '81732affeff85090c3084200d8d64c3231c9a123', class: "s-list-tile-item-action" }, h("slot", { key: '78d44f5dbadf156805d8b7ea3e484b7b250a1aa2', name: 'action' })))));
+        return (h(Host, { key: 'e1528afcea1eda05a5ce206e95791e7611d24dd0' }, h("a", { key: '749a73c76d68ad36f1a6609ada69778662d56566', class: this.generateClass(), href: this.href || "#", target: this.target, "aria-label": "List Tile Link" }, h("div", { key: '7bfd448f86790b2afe0b7a5b8a5460c3b2be66ee', class: "s-list-tile-item-icon" }, h("slot", { key: '383e28a8832483e8ecc61e4f48a3ff1fe5db1038', name: 'icon' })), h("div", { key: 'c42bf126a9ff4014a4e2d85ff12b41d1a88a0e03', class: "s-list-tile-item-content" }, h("div", { key: '18a4a9ebd39e3a710f70dc33554d24e3c2850e53', class: "s-list-tile-item-title" }, h("slot", { key: '7211d627511bf2448cf161f40cc82b1822dd1e7a', name: 'title' })), h("div", { key: '044a7d76e05841f484387c7ed299107f33c9bc21', class: "s-list-tile-item-subtitle" }, h("slot", { key: 'df131034f1c5434722543e25552caed142794d55', name: "subtitle" }))), h("div", { key: '37abe0abab720da11cd55660578ec256c062e763', class: "s-list-tile-item-action" }, h("slot", { key: 'fcac02da17981ef4c6fa3cea50c551e3010352d9', name: 'action' })))));
     }
     static get is() { return "salla-list-tile"; }
     static get originalStyleUrls() {

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

@@ -22,7 +22,7 @@ export class SallaLoading {
         this.bgColor = "#e5e7eb";
     }
     render() {
-        return (h(Host, { key: 'dcab48026f2c056fa38cb3f636ff93689c05b42d', class: "s-loading-container" }, h("svg", { key: '69eb9c41f5c1187517d3221acf8a6c116e542e3b', "aria-hidden": "true", style: { width: `${this.size}px`, height: `${this.size}px`, fill: this.color, color: this.bgColor }, class: "s-loading", viewBox: "0 0 100 101", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: '319cb6008b73e8dafc363da589459c64c14ab8a3', d: "M100 50.5908C100 78.2051 77.6142 100.591 50 100.591C22.3858 100.591 0 78.2051 0 50.5908C0 22.9766 22.3858 0.59082 50 0.59082C77.6142 0.59082 100 22.9766 100 50.5908ZM9.08144 50.5908C9.08144 73.1895 27.4013 91.5094 50 91.5094C72.5987 91.5094 90.9186 73.1895 90.9186 50.5908C90.9186 27.9921 72.5987 9.67226 50 9.67226C27.4013 9.67226 9.08144 27.9921 9.08144 50.5908Z", fill: "currentColor" }), h("path", { key: '489b5ace91f8463a95f51d9cf4a856b2dad5ab17', d: "M93.9676 39.0409C96.393 38.4038 97.8624 35.9116 97.0079 33.5539C95.2932 28.8227 92.871 24.3692 89.8167 20.348C85.8452 15.1192 80.8826 10.7238 75.2124 7.41289C69.5422 4.10194 63.2754 1.94025 56.7698 1.05124C51.7666 0.367541 46.6976 0.446843 41.7345 1.27873C39.2613 1.69328 37.813 4.19778 38.4501 6.62326C39.0873 9.04874 41.5694 10.4717 44.0505 10.1071C47.8511 9.54855 51.7191 9.52689 55.5402 10.0491C60.8642 10.7766 65.9928 12.5457 70.6331 15.2552C75.2735 17.9648 79.3347 21.5619 82.5849 25.841C84.9175 28.9121 86.7997 32.2913 88.1811 35.8758C89.083 38.2158 91.5421 39.6781 93.9676 39.0409Z", fill: "currentFill" }))));
+        return (h(Host, { key: '64a270526fd172b66a0671749bf36acee7cc8de1', class: "s-loading-container" }, h("svg", { key: '380bae806d8aa39e3ac07fba3daf181cfe040f70', "aria-hidden": "true", style: { width: `${this.size}px`, height: `${this.size}px`, fill: this.color, color: this.bgColor }, class: "s-loading", viewBox: "0 0 100 101", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: 'c531098ed793fcd2ec90f10bfb470bcc4543b346', d: "M100 50.5908C100 78.2051 77.6142 100.591 50 100.591C22.3858 100.591 0 78.2051 0 50.5908C0 22.9766 22.3858 0.59082 50 0.59082C77.6142 0.59082 100 22.9766 100 50.5908ZM9.08144 50.5908C9.08144 73.1895 27.4013 91.5094 50 91.5094C72.5987 91.5094 90.9186 73.1895 90.9186 50.5908C90.9186 27.9921 72.5987 9.67226 50 9.67226C27.4013 9.67226 9.08144 27.9921 9.08144 50.5908Z", fill: "currentColor" }), h("path", { key: 'cc6b89a57e8168937ee13b5ccdc25aa024e05223', d: "M93.9676 39.0409C96.393 38.4038 97.8624 35.9116 97.0079 33.5539C95.2932 28.8227 92.871 24.3692 89.8167 20.348C85.8452 15.1192 80.8826 10.7238 75.2124 7.41289C69.5422 4.10194 63.2754 1.94025 56.7698 1.05124C51.7666 0.367541 46.6976 0.446843 41.7345 1.27873C39.2613 1.69328 37.813 4.19778 38.4501 6.62326C39.0873 9.04874 41.5694 10.4717 44.0505 10.1071C47.8511 9.54855 51.7191 9.52689 55.5402 10.0491C60.8642 10.7766 65.9928 12.5457 70.6331 15.2552C75.2735 17.9648 79.3347 21.5619 82.5849 25.841C84.9175 28.9121 86.7997 32.2913 88.1811 35.8758C89.083 38.2158 91.5421 39.6781 93.9676 39.0409Z", fill: "currentFill" }))));
     }
     static get is() { return "salla-loading"; }
     static get originalStyleUrls() {

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

@@ -211,7 +211,7 @@ export class SallaLocalizationModal {
             this.showTrigger
                 ? h("button", { type: "button", onClick: () => this.open(), class: "s-localization-modal-trigger-btn" }, h("span", null, this.getLanguageName()), h("span", { class: "s-localization-modal-trigger-separator" }, "|"), " ", h("span", { innerHTML: this.getCurrencySymbol() }))
                 : '',
-            h("salla-modal", { key: '8011ed27b369f621fd5892e80490a9702042c636', isLoading: true, class: "s-hidden", ref: modal => this.modal = modal, width: "xs" }, h("div", { key: '17c5aaf641a668e4c8f7f625a4bb16bbea692b03', slot: 'loading' }, h("div", { key: 'b3eac7d8561777d746749154fb144d07596f619e', class: "s-localization-modal-skeleton" }, h("salla-skeleton", { key: '881169d3ec98c4d425f1d4e6a07561f6cade2858', width: '25%', height: '15px' }), h("div", { key: '7ccb921af00f96eca06ad59eb4c0051c02ed694d', class: "s-localization-modal-skeleton-content" }, [...Array(4)].map(() => h("div", { class: "s-localization-modal-skeleton-item" }, h("div", { class: "s-localization-modal-skeleton-item-flex" }, h("salla-skeleton", { type: 'circle', height: '16px', width: '16px' }), h("salla-skeleton", { height: '10px', width: '100px' })), h("salla-skeleton", { height: '15px', width: '20px' })))), h("salla-skeleton", { key: 'ecbaea165f7dda315386c4ab8cdca46e1525a76a', width: '25%', height: '15px' }), h("div", { key: '5dcd81dd3e2017214e2139bbdc2602a970bdd5af', class: "s-localization-modal-skeleton-content" }, [...Array(4)].map(() => h("div", { class: "s-localization-modal-skeleton-item" }, h("div", { class: "s-localization-modal-skeleton-item-flex" }, h("salla-skeleton", { type: 'circle', height: '16px', width: '16px' }), h("salla-skeleton", { height: '10px', width: '100px' })), h("salla-skeleton", { height: '15px', width: '20px' })))), h("salla-skeleton", { key: '3d549108228ad0541e96dec40f072ba6f105fbd6', height: '40px', width: '100%' }))), !!this.hasError ?
+            h("salla-modal", { key: '8b26a4e0224a049aee503c06ec288eb2dcbd00db', isLoading: true, class: "s-hidden", ref: modal => this.modal = modal, width: "xs" }, h("div", { key: 'b28c8375f6491ad8fab684dab4d203a9d23fd417', slot: 'loading' }, h("div", { key: '26967b5d8accc26b75aa0a361506341b00cc1ef7', class: "s-localization-modal-skeleton" }, h("salla-skeleton", { key: 'a97f5ceee4c1173030ec29781ee6571c50e02865', width: '25%', height: '15px' }), h("div", { key: '51edca3871e46c692b89651281e94b1716f3cade', class: "s-localization-modal-skeleton-content" }, [...Array(4)].map(() => h("div", { class: "s-localization-modal-skeleton-item" }, h("div", { class: "s-localization-modal-skeleton-item-flex" }, h("salla-skeleton", { type: 'circle', height: '16px', width: '16px' }), h("salla-skeleton", { height: '10px', width: '100px' })), h("salla-skeleton", { height: '15px', width: '20px' })))), h("salla-skeleton", { key: '5e8e3fb5c956be5a681025c7cfce59648dcc75e7', width: '25%', height: '15px' }), h("div", { key: 'd16e6d8bed9300337f84bad366e2731799363fb2', class: "s-localization-modal-skeleton-content" }, [...Array(4)].map(() => h("div", { class: "s-localization-modal-skeleton-item" }, h("div", { class: "s-localization-modal-skeleton-item-flex" }, h("salla-skeleton", { type: 'circle', height: '16px', width: '16px' }), h("salla-skeleton", { height: '10px', width: '100px' })), h("salla-skeleton", { height: '15px', width: '20px' })))), h("salla-skeleton", { key: '952633850a514afbf702d8e6afe30470ff201673', height: '40px', width: '100%' }))), !!this.hasError ?
                 h("salla-placeholder", { alignment: "center" }, h("span", { slot: "description" }, this.errorMessage)) :
                 h("div", { class: "s-localization-modal-inner" }, this.languages.length > 1 ?
                     h("div", { class: "s-localization-modal-section" }, h("label", { class: "s-localization-modal-title" }, Salla.lang.get('common.titles.language')), h("div", { class: "s-localization-modal-section-inner" }, this.languages.length < 6 ?

package/dist/collection/components/salla-loyalty/salla-loyalty-prize-item.js

@@ -7,7 +7,7 @@ export class SallaLoyaltyPrizeItem {
         this.prizeItemSelected.emit(this.item);
     }
     render() {
-        return (h(Host, { key: '8d159caa306052a9d8cd67b37e01fc2b0a0cec20' }, h("div", { key: '8b75d8d82e51169ef974e0cafee27c2694577be5', onClick: this.onPrizeItemClick.bind(this) }, h("img", { key: 'a7c160952e10abf1845c807ed690a929b9be6933', class: "s-loyalty-prize-item-image", src: this.item.image, alt: this.item.name }), h("div", { key: '343e73d9952312e2989f8cc4150ad0894ae62dad', class: "s-loyalty-prize-item-title" }, this.item.name), h("div", { key: '4d2d46f2a21d82fd3426cd7278e2e3a38c9e4093', class: "s-loyalty-prize-item-subtitle" }, this.item.description), h("div", { key: '99852f67e857017dc2bb2b1a7173e94a37c0e776', class: "s-loyalty-prize-item-points" }, this.item.cost_points, " ", salla.lang.get('pages.loyalty_program.point')))));
+        return (h(Host, { key: '91162ebf1e2f76c4b90df9518d57a136e71fa573' }, h("div", { key: '80416871b0f60857b3279525bdaa87327b75890a', onClick: this.onPrizeItemClick.bind(this) }, h("img", { key: 'd7afdc106a822c0f7640136bec591bfa48fe1802', class: "s-loyalty-prize-item-image", src: this.item.image, alt: this.item.name }), h("div", { key: '727f131b7fa00b75aab57f2bb5ea4616f0d3929a', class: "s-loyalty-prize-item-title" }, this.item.name), h("div", { key: '6e2b9263b7d2c1b7a9e372ede63a6b10a23b0d1d', class: "s-loyalty-prize-item-subtitle" }, this.item.description), h("div", { key: '97b7710e76e3d73afe68abe6e8094483960884da', class: "s-loyalty-prize-item-points" }, this.item.cost_points, " ", salla.lang.get('pages.loyalty_program.point')))));
     }
     static get is() { return "salla-loyalty-prize-item"; }
     static get originalStyleUrls() {

package/dist/collection/components/salla-loyalty-program/salla-loyalty-hero.js

@@ -4,13 +4,13 @@
 import { Host, h } from "@stencil/core";
 export class SallaLoyaltyHero {
     render() {
-        return (h(Host, { key: '574e4baec7792ba00a7671cc9054f7645ec58368' }, h("section", { key: 'ee765ae29fe9d655eb1034e0f1621d762d7023e4', class: "s-loyalty-program-hero-container" }, h("div", { key: '4846d52e25447e4eff6e0ab4d788a51ede38ae60', class: "s-loyalty-program-hero-background", style: {
+        return (h(Host, { key: '3393f0d9f023c524b73eda48086f8fc25ec471ca' }, h("section", { key: 'f3d8332554c22a87b1f55a517009195c22ace65a', class: "s-loyalty-program-hero-container" }, h("div", { key: '5b746fb87ad0cc66bb08d46a70117258bc80e548', class: "s-loyalty-program-hero-background", style: {
                 backgroundImage: `url(${this.image})`,
-            } }, this.image ? h("div", { class: "s-loyalty-program-hero-overlay" }) : '', h("div", { key: 'b1a7edcc79c55c4e472e2733e961b2969de3dee9', class: {
+            } }, this.image ? h("div", { class: "s-loyalty-program-hero-overlay" }) : '', h("div", { key: 'd265b684f565221d1e32375e215a224f9e37a29b', class: {
                 's-loyalty-program-hero-content': true,
                 's-loyalty-program-hero-white': !!this.image,
                 's-loyalty-program-hero-gray': !this.image,
-            } }, h("div", { key: 'b9ce57574292320f5cee464fb9d6c4ab2bb5df9b' }, h("h1", { key: '1f989c4c4cd516199cd962b10b15195c88b72e2c', class: "s-loyalty-program-hero-title" }, this.name || h("span", { key: 'df3a3b07a14a2a02e244b11f37e424e9dbed436e', style: { color: 'transparent', backgroundColor: '#666', borderRadius: '12px' } }, "name")), h("p", { key: '7a0b24bda40ca8a6bfc326474593a26a2a1eeb62', class: "s-loyalty-program-hero-description" }, this.description || h("span", { key: 'f6d155a42c76bd4befd0a9628306bdb2a6f1c38c', style: { color: 'transparent', backgroundColor: '#666', borderRadius: '12px' } }, "description"))), h("slot", { key: 'e437cdec345487a8ea8df05b39c1b7c8bee1d5fd', name: "action" }))), h("div", { key: '3e7e2edd1e7b8e06ea0ce6ae8de479ad3595e880', class: "s-loyalty-program-hero-footer" }, h("div", { key: '8b53882fcf2d8779fc8fdd8f895e782444eaab96', class: "s-loyalty-program-hero-slot-container" }, h("slot", { key: '4e32a1377a54ce20fc890276646774e42f011a1b', name: "crosspoint" }))))));
+            } }, h("div", { key: '747b6d5d110ed4f07308f50d5fdbdb0e49ab22bf' }, h("h1", { key: 'e2aea10327e863bab41a4c5c5ccb10d3869408a7', class: "s-loyalty-program-hero-title" }, this.name || h("span", { key: '509d9916ec042f27634061f2c6942662b71b87cb', style: { color: 'transparent', backgroundColor: '#666', borderRadius: '12px' } }, "name")), h("p", { key: '7161ffe3f223758f9b5c4b904ae7e36a940b7757', class: "s-loyalty-program-hero-description" }, this.description || h("span", { key: '60ca3aa104de52b3efa303c7d517fbe9370eb724', style: { color: 'transparent', backgroundColor: '#666', borderRadius: '12px' } }, "description"))), h("slot", { key: '24795c8373dfb546e7bb9bd841646a24455c72af', name: "action" }))), h("div", { key: '2400cfc7f43acc5d94e647feb370d162074a5e68', class: "s-loyalty-program-hero-footer" }, h("div", { key: '00b01de76c0278a2900cd6ae7dfb7dfe9f16b5a1', class: "s-loyalty-program-hero-slot-container" }, h("slot", { key: '969566f21e651ff1f4833ef6e671700ecffe9072', name: "crosspoint" }))))));
     }
     static get is() { return "salla-loyalty-hero"; }
     static get originalStyleUrls() {