@salla.sa/twilight-components 2.14.386 → 2.14.388

package/dist/components/salla-cart-coupons.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "../types/components";
+
+interface SallaCartCoupons extends Components.SallaCartCoupons, HTMLElement {}
+export const SallaCartCoupons: {
+    prototype: SallaCartCoupons;
+    new (): SallaCartCoupons;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;

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

@@ -0,0 +1,287 @@
+/*!
+ * Crafted with ❤ by Salla
+ */
+import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
+import { d as defineCustomElement$3 } from './salla-button2.js';
+import { d as defineCustomElement$2 } from './salla-slider2.js';
+
+const sallaCartCouponsCss = "";
+
+const SallaCartCoupons$1 = /*@__PURE__*/ proxyCustomElement(class SallaCartCoupons extends HTMLElement {
+    constructor() {
+        super();
+        this.__registerHost();
+        this.availableCoupons = [];
+        this.cartTotal = 0;
+        this.currentCoupon = '';
+        this.couponInputValue = '';
+        this.couponError = '';
+        this.isApplying = false;
+        this.isHandlingInternalError = false;
+        // Store cart event listener references for cleanup
+        this.cartUpdatedHandler = (cartData) => {
+            this.cartTotal = cartData.sub_total ?? cartData.total ?? 0;
+            // Update current coupon state
+            const couponCode = cartData.coupon || '';
+            // Only overwrite the user's typed value when the cart-level coupon itself changes
+            if (couponCode !== this.currentCoupon) {
+                this.currentCoupon = couponCode;
+                this.couponInputValue = couponCode;
+            }
+            // Clear error when cart updates
+            this.couponError = '';
+        };
+        this.couponAddedHandler = () => {
+            // Coupon was successfully added - state is managed by cartUpdatedHandler
+        };
+        this.couponAdditionFailedHandler = (error) => {
+            // Only handle external coupon failures when no internal operation is handling errors
+            if (!this.isApplying && !this.isHandlingInternalError) {
+                this.showCouponError(error?.message || salla.lang.get('pages.cart.coupon_application_error'));
+            }
+            // Internal operations handle their own errors to prevent double display
+        };
+        this.couponDeletedHandler = () => {
+            // Coupon was removed - state is managed by cartUpdatedHandler
+        };
+        // Arrow functions to maintain context for event listeners
+        this.onKeyUp = (event) => {
+            if (event.key === 'Enter') {
+                this.couponButtonRef?.click();
+            }
+            this.couponError = '';
+        };
+        this.onInput = (event) => {
+            this.couponInputValue = event.target.value;
+        };
+    }
+    async componentWillLoad() {
+        await Salla.onReady();
+        await Salla.lang.onLoaded();
+        //then set your logic here to avoid any race condition
+        this.loadCouponsData(); // Load async without blocking render - shows empty until loaded
+        this.loadCartTotal();
+        this.setupCartEventListeners();
+        // Note: No store feature gate needed - coupon availability controlled by backend API response
+    }
+    componentDidLoad() {
+        this.setupCouponInputEvents();
+    }
+    setupCartEventListeners() {
+        // Listen for cart updates to refresh cart total
+        salla.event.on('cart::updated', this.cartUpdatedHandler);
+        // Listen for coupon events
+        salla.event.on('cart::coupon.added', this.couponAddedHandler);
+        salla.event.on('cart::coupon.addition.failed', this.couponAdditionFailedHandler);
+        salla.event.on('cart::coupon.deleted', this.couponDeletedHandler);
+    }
+    disconnectedCallback() {
+        // Clean up DOM event listeners
+        this.couponInputRef?.removeEventListener('keyup', this.onKeyUp);
+        this.couponInputRef?.removeEventListener('input', this.onInput);
+        // Clean up cart event listeners using reliable global event system
+        salla.event.off('cart::updated', this.cartUpdatedHandler);
+        salla.event.off('cart::coupon.added', this.couponAddedHandler);
+        salla.event.off('cart::coupon.addition.failed', this.couponAdditionFailedHandler);
+        salla.event.off('cart::coupon.deleted', this.couponDeletedHandler);
+    }
+    /**
+     * Business Decision: No visual selected state needed
+     * UX Flow: Click coupon → populate input → auto-apply (streamlined experience)
+     */
+    async selectCoupon(couponCode) {
+        const selectedCoupon = this.availableCoupons.find(coupon => coupon.code === couponCode);
+        if (selectedCoupon) {
+            if (!this.isEligible(selectedCoupon)) {
+                throw new Error(`Coupon not eligible: minimum cart amount not met`);
+            }
+            try {
+                // Actually apply the coupon to the cart first
+                await this.applyCoupon(couponCode);
+                // Only dispatch event after successful API call
+                this.host.dispatchEvent(new CustomEvent('salla::cart-coupons.coupon.selected', {
+                    detail: selectedCoupon,
+                    bubbles: true
+                }));
+            }
+            catch (error) {
+                // Rethrow to let caller handle the error
+                throw error;
+            }
+        }
+        return selectedCoupon;
+    }
+    async loadCouponsData() {
+        try {
+            // Load coupons from API
+            const response = await salla.api.request('coupons');
+            const raw = response?.data;
+            const coupons = Array.isArray(raw) ? raw : (Array.isArray(raw?.data) ? raw.data : []);
+            this.availableCoupons = coupons;
+        }
+        catch (error) {
+            console.warn('Failed to load coupons:', error);
+            // No coupons available on error
+            this.availableCoupons = [];
+        }
+    }
+    loadCartTotal() {
+        // Get cart total and current coupon from Salla storage
+        const cart = salla.storage.get('cart');
+        // Check summary first (more accurate), then cart level, fallback to 0
+        this.cartTotal = cart?.summary?.sub_total ?? cart?.sub_total ?? 0;
+        this.currentCoupon = cart?.coupon || '';
+        this.couponInputValue = cart?.coupon || '';
+    }
+    setupCouponInputEvents() {
+        if (!this.couponInputRef || !this.couponButtonRef) {
+            return;
+        }
+        this.couponInputRef.addEventListener('keyup', this.onKeyUp);
+        this.couponInputRef.addEventListener('input', this.onInput);
+    }
+    async handleCouponButtonClick() {
+        if (this.isApplying) {
+            return;
+        }
+        const hasCoupon = !!this.currentCoupon;
+        if (!hasCoupon && !this.couponInputValue.trim()) {
+            this.showCouponError(salla.lang.get('pages.cart.enter_coupon_code'));
+            return;
+        }
+        this.isApplying = true;
+        this.isHandlingInternalError = true;
+        try {
+            if (hasCoupon) {
+                // Remove existing coupon
+                await salla.cart.deleteCoupon();
+            }
+            else {
+                // Apply new coupon
+                await salla.cart.addCoupon(this.couponInputValue.trim());
+            }
+        }
+        catch (error) {
+            this.showCouponError(error.response?.data?.error?.message || salla.lang.get('pages.cart.coupon_application_error'));
+        }
+        finally {
+            this.isApplying = false;
+            // Keep internal error flag active briefly to prevent race condition with SDK event
+            setTimeout(() => {
+                this.isHandlingInternalError = false;
+            }, 100);
+        }
+    }
+    showCouponError(message) {
+        this.couponError = message;
+    }
+    handleCouponClick(coupon) {
+        this.applyCoupon(coupon.code, false).catch(() => {
+            // Error already displayed by applyCoupon
+        });
+    }
+    async applyCoupon(couponCode, shouldThrow = true) {
+        if (this.isApplying) {
+            if (shouldThrow) {
+                throw new Error('Coupon application already in progress');
+            }
+            else {
+                return; // Silent return for card clicks when operation is already in progress
+            }
+        }
+        // Update the input field with the coupon code
+        this.couponInputValue = couponCode;
+        // Clear any existing errors
+        this.couponError = '';
+        this.isApplying = true;
+        this.isHandlingInternalError = true;
+        try {
+            // Apply the coupon directly without checking for existing coupon
+            await salla.cart.addCoupon(couponCode.trim());
+        }
+        catch (error) {
+            this.showCouponError(error.response?.data?.error?.message || salla.lang.get('pages.cart.coupon_application_error'));
+            // Re-throw error only if requested (for selectCoupon API)
+            if (shouldThrow) {
+                throw error;
+            }
+        }
+        finally {
+            this.isApplying = false;
+            // Keep internal error flag active briefly to prevent race condition with SDK event
+            setTimeout(() => {
+                this.isHandlingInternalError = false;
+            }, 100);
+        }
+    }
+    formatMainAmount(coupon) {
+        if (coupon.type === 'percentage') {
+            // For percentage coupons, amount should be a string or number
+            const percentageValue = typeof coupon.amount === 'object' ? coupon.amount.amount : coupon.amount;
+            return `${salla.helpers.number(percentageValue)}%`;
+        }
+        else {
+            // For fixed coupons, amount is an object with amount and currency
+            const amountData = typeof coupon.amount === 'object' ? coupon.amount : {
+                amount: coupon.amount,
+                currency: coupon.minimum_amount?.currency || salla.config.get('store.currency.code', 'SAR')
+            };
+            return (h("span", { innerHTML: salla.money(amountData.amount, amountData.currency) }));
+        }
+    }
+    isEligible(coupon) {
+        if (coupon.minimum_amount && this.cartTotal < parseFloat(coupon.minimum_amount.amount)) {
+            return false; // Coupon is not eligible due to minimum amount requirement
+        }
+        return true;
+    }
+    renderCouponCard(coupon) {
+        const isEligible = this.isEligible(coupon);
+        // Note: Card notches (ticket-style pseudo-elements) match card background, not page background - this is intentional design
+        return (h("div", { class: "s-cart-coupons-slide-one-fourth swiper-slide" }, h("div", { class: `s-cart-coupons-card ${!isEligible || this.isApplying ? 's-cart-coupons-disabled' : ''}`, onClick: () => isEligible && !this.isApplying && this.handleCouponClick(coupon) }, h("div", { class: "s-cart-coupons-top-section" }, h("div", { class: "s-cart-coupons-discount-values" }, h("div", { class: "s-cart-coupons-main-amount" }, this.formatMainAmount(coupon)), coupon.free_shipping ? (h("div", { class: "s-cart-coupons-secondary-info" }, "+ ", salla.lang.get('pages.cart.free_shipping'))) : coupon.maximum_amount && (h("div", { class: "s-cart-coupons-secondary-info" }, salla.lang.get('pages.cart.up_to'), " ", h("span", { innerHTML: salla.money(coupon.maximum_amount.amount, coupon.maximum_amount.currency) })))), h("div", { class: "s-cart-coupons-code" }, coupon.code)), h("div", { class: "s-cart-coupons-divider" }), h("div", { class: "s-cart-coupons-bottom-section" }, h("div", { class: "s-cart-coupons-terms" }, coupon.remaining_days !== undefined && coupon.remaining_days !== null && (h("div", { class: `s-cart-coupons-expiry ${coupon.remaining_days <= 3 ? 's-cart-coupons-expiry-warning' : ''}` }, coupon.remaining_days === 0
+            ? salla.lang.get('pages.cart.expires_today')
+            : `${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: '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))))))));
+    }
+    get host() { return this; }
+    static get style() { return sallaCartCouponsCss; }
+}, [0, "salla-cart-coupons", {
+        "availableCoupons": [32],
+        "cartTotal": [32],
+        "currentCoupon": [32],
+        "couponInputValue": [32],
+        "couponError": [32],
+        "isApplying": [32],
+        "selectCoupon": [64]
+    }]);
+function defineCustomElement$1() {
+    if (typeof customElements === "undefined") {
+        return;
+    }
+    const components = ["salla-cart-coupons", "salla-button", "salla-slider"];
+    components.forEach(tagName => { switch (tagName) {
+        case "salla-cart-coupons":
+            if (!customElements.get(tagName)) {
+                customElements.define(tagName, SallaCartCoupons$1);
+            }
+            break;
+        case "salla-button":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$3();
+            }
+            break;
+        case "salla-slider":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$2();
+            }
+            break;
+    } });
+}
+defineCustomElement$1();
+
+const SallaCartCoupons = SallaCartCoupons$1;
+const defineCustomElement = defineCustomElement$1;
+
+export { SallaCartCoupons, defineCustomElement };

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

@@ -107,7 +107,7 @@ const SallaCartSummary$1 = /*@__PURE__*/ proxyCustomElement(class SallaCartSumma
         return cartUrl;
     }
     render() {
-        return (h(Host, { key: '4ceefb3809e2e7c1d00bb47b3d9ed58fa0e48c7b' }, h("a", { key: '3e4f3ab42958fb12647e53cf0a7a95e780d5727f', class: "s-cart-summary-wrapper", href: this.getCartLink() }, h("div", { key: '496573ce91987c25b0cd5e16d5bb95be610f5db6', id: "s-cart-icon" }, h("slot", { key: '53c290cc7e7e5b9d911e1ba430038e0b7ef21dc5', name: "icon" }, h("i", { key: 'b9281b127f798e1738e9c59f4e0413e2852271a8', class: "s-cart-summary-icon", innerHTML: PendingOrdersIcon }))), h("span", { key: 'aa7b03b0f1ca2155034b15420e8c5fac7e440ae1', class: "s-cart-summary-count" }, salla.helpers.number(this.cartSummaryCount)), h("p", { key: '4e8111bba613de3aaefc9a22fbbd6a57e5b9ca6f', class: "s-cart-summary-content" }, this.showCartLabel && h("span", { key: '86a8b09624647bcd715aefaf0afae43b0b8f991e', class: "s-cart-summary-label" }, this.cartLabel), h("b", { key: '426d8bf03af7a8f96793bda0ebe593b1b1eebf63', 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: PendingOrdersIcon }))), 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) })))));
     }
     get host() { return this; }
     static get style() { return sallaCartSummaryCss; }

package/dist/components/salla-color-picker2.js

@@ -208,7 +208,7 @@ const SallaColorPicker = /*@__PURE__*/ proxyCustomElement(class SallaColorPicker
         });
     }
     render() {
-        return (h(Host, { key: '1da3853e7ba946b680f99ec07040035086cdf383', class: "s-color-picker-main" }, h("slot", { key: '16812a7f96d476deab7b0fe4b59f29595cc9f302', name: "widget" }, h("div", { key: 'a2820835ad0ed81022871d76fada51885f2cd144', class: "s-color-picker-widget" }, h("div", { key: 'e65430e20d893fc372449c933a619cceec98b7db', class: "s-color-picker-widget-canvas", ref: dv => (this.canvas = dv) }), h("span", { key: 'f5cfd889738260dcdb1de6da426c673b4685cffe', innerHTML: ArrowDown }))), h("input", { key: '073754e72beaae864bce94a4de29eee7d0c189ba', 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/components/salla-comment-form2.js

@@ -32,7 +32,7 @@ const SallaCommentForm = /*@__PURE__*/ proxyCustomElement(class SallaCommentForm
             .finally(() => this.submitBtn.stop);
     }
     render() {
-        return (h(Host, { key: '1c2cdcb7dea3afa14a9fbe7700b05241c6e36770' }, !!this.canComment ? h("form", { ref: frm => this.commentForm = frm }, h("div", { class: "s-comment-form-wrapper" }, this.showAvatar ?
+        return (h(Host, { key: '24b73030ff1828a6f21c1c36a00be2c8651f6edf' }, !!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 style() { return sallaCommentFormCss; }

package/dist/components/salla-comment-item2.js

@@ -143,15 +143,15 @@ const SallaCommentItem = /*@__PURE__*/ proxyCustomElement(class SallaCommentItem
     }
     render() {
         let isAdmin = this.comment.type == 'admin';
-        return (h(Host, { key: '93d39f2ef35c0cfdcd6333e58e6a836845b4fe12', class: isAdmin ? 's-comments-item-admin' : 's-comments-item' }, h("div", { key: 'c160b10f946149c293cb0daeaf96aa7b06ba095e', class: { "s-comments-item-wrapper": !isAdmin, "s-comments-item-admin-wrapper": isAdmin }, id: `s-comments-item-${this.comment.id}` }, h("div", { key: '60728bde4f0293cf419b589759b6621c5f0a519a', class: "s-comments-item-inner s-comments-flex-1" }, isAdmin && h("span", { key: 'aac6a394aa6460756c4c54d0a0c671078d1dddd6', class: "s-comments-item-reply-icon", innerHTML: Reply }), h("div", { key: 'cdca36fac4f23720084477ee889325942d25341e', class: "s-comments-item-avatar" }, h("img", { key: '07e8e17f7470d87607c8aaa8f15e283b129ca070', "data-src": this.comment?.avatar, alt: this.comment?.name, src: this.comment?.avatar, class: "s-comments-item-avatar-img lazy" })), h("div", { key: '6ef14e9b64d8300a24d886c081cc66ec621fd2a6', class: "s-comments-flex-1" }, h("div", { key: '4f72cfb690978fae30d8ef7c957e6adf53a2872d', class: "s-comments-item-user-wrapper" }, h("div", { key: '413840281c0050521a8ae4fd60e502ed821f4260', class: "s-comments-item-user-info" }, h("h3", { key: '814c32cefc6b62585022ab3e1cdb59965553f1d2', 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: IconVerified }), 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: '7c6745073e250e100c8a613e4fd94d751042fb7f', class: "s-comments-item-timestamp s-ltr" }, this.getDate(this.comment.created_at?.date), h("span", { key: '011cfc88b9702e14f6ea9d8ded0fa6f8678adb18', 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: '044599867529f9526306ac258981a15e4c43e369', class: "s-comments-item-content" }, h("p", { key: 'd3d082f84a154205bb6eedb0d14c2bb9a83387ee', innerHTML: this.comment.content }), this.allowAttachImages && h("div", { key: 'c475b4911834163084ede77e2c1f289ea9efddca', 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: '384d4555813e8e9c4bf7c6ad626def802f8f6f5a', ref: modal => this.modal = modal, width: "sm" }, h("salla-slider", { key: 'a2be6511ff82555b87196183c6f463f4582c18c4', 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: 'c6029d94bdddf9958758fbd8c3dbca3e40ad1c01', slot: 'items' }, this.comment.images.map((image, index) => (h("img", { key: index, src: image, alt: "" })))), h("div", { key: 'b5febbea6d46ce3b920f5bc15866eebb54f440e4', 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 && 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 && 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/components/salla-comments.js

@@ -50,6 +50,7 @@ const SallaComments$1 = /*@__PURE__*/ proxyCustomElement(class SallaComments ext
          * Determines if the comments are testimonials
          */
         this.testimonials = false;
+        this.customerId = null;
         // Translations
         this.noComments = salla.lang.get('blocks.comments.no_comments');
         this.comment_title = salla.lang.get('blocks.comments.title');
@@ -115,6 +116,32 @@ const SallaComments$1 = /*@__PURE__*/ proxyCustomElement(class SallaComments ext
         })();
         Salla.infiniteScroll.errorWrapped = true;
     }
+    // Preserve sort and private_comments params in next page URL for infinite scroll
+    patchNextPageUrl() {
+        if (!this.nextPage)
+            return;
+        try {
+            const url = new URL(this.nextPage, window.location.origin);
+            if (this.sort && !url.searchParams.get('sort')) {
+                url.searchParams.set('sort', this.sort);
+            }
+            if (this.customerId && !url.searchParams.get('private_comments')) {
+                url.searchParams.set('private_comments', this.customerId);
+            }
+            this.nextPage = url.toString();
+        }
+        catch (_e) {
+            // fallback for relative next links
+            const hasQuery = this.nextPage.includes('?');
+            if (this.sort && !/[?&]sort=/.test(this.nextPage)) {
+                this.nextPage = this.nextPage + (hasQuery ? '&' : '?') + `sort=${this.sort}`;
+            }
+            if (this.customerId && !/[?&]private_comments=/.test(this.nextPage)) {
+                const sep = this.nextPage.includes('?') ? '&' : '?';
+                this.nextPage = this.nextPage + sep + `private_comments=${this.customerId}`;
+            }
+        }
+    }
     // Initiate infinite scroll
     initiateInfiniteScroll() {
         if (!this.wrapper) {
@@ -134,6 +161,7 @@ const SallaComments$1 = /*@__PURE__*/ proxyCustomElement(class SallaComments ext
         this.infiniteScroll?.on('load', response => {
             this.pagination = response.pagination;
             this.nextPage = typeof response.pagination.links === 'object' && !!response.pagination.links.next ? response.pagination.links.next : null;
+            this.patchNextPageUrl();
             for (const card of this.handleResponse(response)) {
                 this.wrapper.append(card);
             }
@@ -221,8 +249,11 @@ const SallaComments$1 = /*@__PURE__*/ proxyCustomElement(class SallaComments ext
                 resp = await salla.api.request('reviews', { params }, 'get');
             }
             else {
-                // Ensure sort is passed for regular comments as well
-                resp = await salla.api.comment.getComments(this.type, this.itemId, 1, 5, this.sort);
+                const showPrivateComments = searchParams.get('private_comments');
+                this.customerId = (showPrivateComments && Salla.config.get('user.type') === 'user' && Salla.config.get('user.id'))
+                    ? Salla.config.get('user.id')
+                    : null;
+                resp = await salla.api.comment.getComments(this.type, this.itemId, 1, 5, this.sort, this.customerId);
             }
             if (!resp.data || !resp.data.length) {
                 this.showPlaceholder = false;
@@ -236,24 +267,7 @@ const SallaComments$1 = /*@__PURE__*/ proxyCustomElement(class SallaComments ext
             this.pagination = resp.pagination;
             this.total = resp.pagination.total;
             this.nextPage = typeof resp.pagination.links === 'object' && !!resp.pagination.links.next ? resp.pagination.links.next : null;
-            // Preserve sort param in next page URL for infinite scroll
-            if (this.nextPage && this.sort) {
-                try {
-                    const url = new URL(this.nextPage, window.location.origin);
-                    if (!url.searchParams.get('sort')) {
-                        url.searchParams.set('sort', this.sort);
-                        this.nextPage = url.toString();
-                    }
-                }
-                catch (_e) {
-                    // fallback for relative next links
-                    const hasQuery = this.nextPage.includes('?');
-                    const hasSort = /[?&]sort=/.test(this.nextPage);
-                    if (!hasSort) {
-                        this.nextPage = this.nextPage + (hasQuery ? '&' : '?') + `sort=${this.sort}`;
-                    }
-                }
-            }
+            this.patchNextPageUrl();
             setTimeout(() => {
                 for (const card of this.handleResponse(resp)) {
                     this.wrapper.append(card);

package/dist/components/salla-conditional-fields2.js

@@ -118,7 +118,7 @@ const SallaConditionalFields = /*@__PURE__*/ proxyCustomElement(class SallaCondi
         });
     }
     render() {
-        return (h(Host, { key: 'f10107a1f25a518a71fe009caf40baabff9dbdc7' }, h("slot", { key: '7fef4fea8387956cc13583759dc3920c4881f389' })));
+        return (h(Host, { key: '92e48eb8f628ef8a2cde7e0480bbfe8fbb36f139' }, h("slot", { key: '439b9056ff00196e8e8b89ee8251afd4db7e2b64' })));
     }
     get host() { return this; }
 }, [4, "salla-conditional-fields", undefined, [[0, "change", "changeHandler"], [0, "input", "changeHandler"]]]);

package/dist/components/salla-count-down2.js

@@ -158,7 +158,7 @@ const SallaCountDown = /*@__PURE__*/ proxyCustomElement(class SallaCountDown ext
         return this.renderCountDown();
     }
     render() {
-        return (h(Host, { key: 'de0e93d1c6bcf24dc3b07705786fb9c204bfa625', 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.renderPrefixText(), this.renderContent(), this.offerEnded && this.renderOfferEnded(), this.renderButton()));
+        return (h(Host, { key: '0cfdbb009d256be108123cabf3cb4311866bdc17', 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.renderPrefixText(), this.renderContent(), this.offerEnded && this.renderOfferEnded(), this.renderButton()));
     }
     static get style() { return sallaCountDownCss; }
 }, [0, "salla-count-down", {

package/dist/components/salla-datetime-picker2.js

@@ -211,7 +211,7 @@ const SallaDatetimePicker = /*@__PURE__*/ proxyCustomElement(class SallaDatetime
         }
     }
     render() {
-        return h("div", { key: 'a10e37bc3c3d5e13006fefd3569f2fb7660543bd', class: "s-datetime-picker" }, h("input", { key: '1e838ac042a0ca43e7d6a871eee2d6f2840434a0', 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/components/salla-file-upload2.js

@@ -316,11 +316,11 @@ const SallaFileUpload = /*@__PURE__*/ proxyCustomElement(class SallaFileUpload e
         }
     }
     render() {
-        return (h(Host, { key: 'b33365d20c42081e38ebf7c8b63bc0580807bc4e', 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: '6e4458218bbeae75c21db781c85a376b29d5b11b', 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: 'f06888dc84c34236d11c7b2ad7250bb41d8b9bfe', 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 })));
     }
     componentDidLoad() {
         let files = this.getFiles();

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

@@ -190,12 +190,12 @@ const SallaFiltersWidget = /*@__PURE__*/ proxyCustomElement(class SallaFiltersWi
         return h("span", { class: "s-filters-option-name" }, label);
     }
     render() {
-        return (h(Host, { key: 'aaa423868d5ecd62a1d3dbb05a5143f7983e15ab', class: "s-filters-widget-container" }, h("h3", { key: '444a72e027f870fcd3f2fb01d8a52d642b1d6fab', class: "s-filters-widget-title", onClick: () => this.toggleWidget() }, h("span", { key: '1813e58218aefebecdd0b2d8af9ce89ce5c17b9f' }, this.option.label), h("span", { key: '11926f6d1343095b29c93f010b99cfc07152918a', class: `s-filters-widget-plusminus ${this.isOpen ? 's-filters-widget-plusminus-active' : ''}` })), h("div", { key: '24f151541c5da697d157f6f110fb640b316ad533', class: "s-filters-widget-content", ref: (el) => this.widgetContent = el }, Array.isArray(this.option.values) && this.option.values.length > 5 && (h("div", { key: '12b4adb00888f657f9d67f84b377634190e0cedd', class: "s-filters-widget-search-wrapper", style: { padding: '8px 0', marginBottom: '8px' } }, h("input", { key: 'b14ff87ad64e594c3120be3b5e5d102c8d74cd98', 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: '9a9f76a9ca1a9ae7e474dcf771e0a58936dee7d7', class: "s-filters-widget-values", ref: (el) => this.widgetValues = el }, h("slot", { key: '020b614afb9c6ca5aadfccafe748e73e8f2fa77a' }), 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: '4d03eccbc3b357444e27d61c647b09d435ceb1be', 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))));
     }
     get host() { return this; }
     static get style() { return sallaFiltersWidgetCss; }

package/dist/components/salla-filters.js

@@ -196,7 +196,7 @@ const SallaFilters$1 = /*@__PURE__*/ proxyCustomElement(class SallaFilters exten
         this.applyFilters();
     }
     render() {
-        return h(Host, { key: '3b38160573591da8249606b8c12b72b58d03551d' }, 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/components/salla-gifting.js

@@ -497,7 +497,7 @@ const SallaGifting$1 = /*@__PURE__*/ proxyCustomElement(class SallaGifting exten
     }
     render() {
         return [
-            h("div", { key: 'ba5575020df2e6e1d72eadc5c15ffa2629a7e0f0' }, h("salla-list-tile", { key: '2be6a003eb1881b35001d184fe4e7d8b3a48bcc2', class: this.generateClass() }, h("div", { key: 'c1c9762462177aac3571c72608921fb3a71e0c1e', slot: "title" }, this.vertical ? h("span", { innerHTML: GiftSharing }) : '', h("h3", { key: '6d25fe0684792b2b18c48b23c3a78fe1f428d371' }, !!this.widgetTitle ? this.widgetTitle : this.sectionTitle)), h("div", { key: '8943aeec88dd610d159b3ee09e7cf784bfb85057', slot: "subtitle" }, h("div", { key: '7e93b7590c04431344d940965f851e6c21565921' }, !!this.widgetSubtitle ? this.widgetSubtitle : this.sectionSubtitle)), h("div", { key: '0b4c0390853b20e1cc1dcd63215d639f6da28d5b', slot: "action" }, h("salla-button", { key: '8597cbcfecfe87c4057a0712e78cf5c3ccea9b89', color: "primary", fill: "outline", width: "wide", class: "s-gifting-widget-action", onClick: () => this.handleGiftButtonClick() }, h("slot", { key: '48ee9b4c7fd63ae5d49acf137fb429292ade8fd7', name: "widget-btn-content" }, h("div", { key: '05681d9d1f8f99b0c8ac722fc4c49a0b7c9dfb7d', class: "s-gifting-widget-action-content" }, h("span", { key: '4c22063c0d47096166363bbf458ec2b57615bc6c', innerHTML: GiftSharing }), " \u00A0", h("span", { key: '2688bf6e45d28f6696e8581d745626ac749b30c6' }, this.sectionBtnText)))))), h("salla-modal", { key: '338ce16bd3c615b5a97d8bf09d1bd1fa6388194e', id: this.hostId, isLoading: true, class: "s-gifting-modal", width: "sm", ref: modal => this.modal = modal }, h("div", { key: '33662376e8979c321fce3d2c01060881439bb652', slot: "loading" }, h("div", { key: 'ae3173d44990f7c2f41206f9ecd63dc1b30c2a1e', class: "s-gifting-skeleton" }, h("div", { key: 'dcab87f7a921763c0a52d122c2eb5b87aca41792', class: "s-gifting-modal-header" }, h("salla-skeleton", { key: 'c41d6ced2a82554aeb7e36986111832bef6f1f0f', type: 'circle', height: '5rem', width: '5rem' }), h("h2", { key: 'cbf4e6c3eccc896f4b2675f5877df055d5b884be', class: "s-gifting-modal-title" }, h("div", { key: '544134f67bdac37775af422cac9688c7975b0c4b', class: "s-gifting-modal-badge-wrapper" }, h("salla-skeleton", { key: '62d175f4b42d24ded6f87f3af700af35febe108f', height: '15px', width: '150px' })))), h("div", { key: '7dc39034234bfb0e57cbbc2c395a639cd383a77b', class: "s-gifting-skeleton-content" }, h("salla-skeleton", { key: '5d73d76103a98cd477f4604c3408b6071434c2f5', height: '10px', width: '150px' }), h("salla-skeleton", { key: '477ee6bf604e799336e7c45f119cfcdbc23cb0ed', height: '230px' }), h("salla-skeleton", { key: 'b8c51be1f614081b900465e1445d726be5bb3d48', height: '10px', width: '150px' }), h("salla-skeleton", { key: '6dae16f42decbd267fa03b7a71103a32fe30e2b1', height: '30px' }), h("salla-skeleton", { key: '1b077b2a03c438446a0a9c115e2b61377fcbd542', height: '40px' })))), h("slot", { key: 'fb0253f4ca6c6e4cafd0c8496e94d0e6da37d748', name: "header" }), !!this.hasError ?
+            h("div", { key: '5959120e43b44cd294d9466003422efb26090897' }, h("salla-list-tile", { key: '6ba52f5157d734e4c8443a9b4a59703d69eb8e84', class: this.generateClass() }, h("div", { key: '26130f1b0e64f7dcc488f2865a19c04c4da28afe', slot: "title" }, this.vertical ? h("span", { innerHTML: GiftSharing }) : '', h("h3", { key: 'b26949ce590efdeb7d364bbb65f04cc2e58eb396' }, !!this.widgetTitle ? this.widgetTitle : this.sectionTitle)), h("div", { key: 'bfa36868bc7681aa8fb218dcaa032a414609413c', slot: "subtitle" }, h("div", { key: 'b070fb428965fd7f2f58573970d5d0604564f682' }, !!this.widgetSubtitle ? this.widgetSubtitle : this.sectionSubtitle)), h("div", { key: '343729605e7b97a7a35e63ca26b46ef2b48d5d8e', slot: "action" }, h("salla-button", { key: 'f8d6e1d5f60ea02a271b504fd3daa36215e9a8f3', color: "primary", fill: "outline", width: "wide", class: "s-gifting-widget-action", onClick: () => this.handleGiftButtonClick() }, h("slot", { key: 'c9cc5ec40b0e09aa99e15f464701deb5c9a3f486', name: "widget-btn-content" }, h("div", { key: '5b431294450b2c45bc5b3503e022d03872cd4252', class: "s-gifting-widget-action-content" }, h("span", { key: '4397140781cf6e311de760e384e1b0f3f429eeeb', innerHTML: GiftSharing }), " \u00A0", h("span", { key: 'e993b5010cca3eb5c09ab6abc592d29c149292bb' }, this.sectionBtnText)))))), h("salla-modal", { key: '13a1010f08acd0c9ef7bdd4eafd3488ae083b0a4', id: this.hostId, isLoading: true, class: "s-gifting-modal", width: "sm", ref: modal => this.modal = modal }, h("div", { key: '0eea1fa6d0ea8240d198e8e7fdd68dc7327fa817', slot: "loading" }, h("div", { key: '9e98de0165db06a39e51984419cb93dcb4bd40ad', class: "s-gifting-skeleton" }, h("div", { key: 'd302e19b737bc272ccece10bfca0eb019b6ca2cf', class: "s-gifting-modal-header" }, h("salla-skeleton", { key: '787d98c862475e7a263d4d501842d0b769e9be4a', type: 'circle', height: '5rem', width: '5rem' }), h("h2", { key: '86b67bbbe29fe5b1bad587432652f36480269c86', class: "s-gifting-modal-title" }, h("div", { key: 'af9eb2262a435ce110e355b75f5c0ebdd2a3acdc', class: "s-gifting-modal-badge-wrapper" }, h("salla-skeleton", { key: '9311ddd1eb3afdc7c02530451eafc27bbba8b776', height: '15px', width: '150px' })))), h("div", { key: '5c87083930311249c7ea735697c3c7d20be4b2e7', class: "s-gifting-skeleton-content" }, h("salla-skeleton", { key: 'f42adea83216bc972863bd56c5ba0b5f02df6eb1', height: '10px', width: '150px' }), h("salla-skeleton", { key: '7781766e62dedadff68943e69bc97b54fe6eb22b', height: '230px' }), h("salla-skeleton", { key: 'a61810158f2edf8b0f7ed0f44c4985ca1f4b01e7', height: '10px', width: '150px' }), h("salla-skeleton", { key: '2f2763deca90fcfe66a462befbfb7072decf63c1', height: '30px' }), h("salla-skeleton", { key: '2f34b53353830532c900e70660a81d9124bbc1e8', height: '40px' })))), h("slot", { key: 'd6f51bf3ee6a11019d25150e26c45fa80a534c43', 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" }, " "))
                 :
                     [
@@ -513,7 +513,7 @@ const SallaGifting$1 = /*@__PURE__*/ proxyCustomElement(class SallaGifting exten
                             h("div", null, h("div", { class: this.errors && this.errors['receiver.country'] ? "s-form-group s-form-has-error anime-item opacity-0" : "s-form-group anime-item opacity-0" }, h("label", { class: "s-form-label" }, this.receiverCountryFieldLabel), h("select", { name: "country", class: "s-form-control", onChange: (event) => this.handleCountryChange(event), required: true }, h("option", { value: "" }, this.selectCountry), this.gift?.countries?.map((country) => (h("option", { value: country.id }, country.name)))), this.errors && this.errors['receiver.country'] ?
                                 h("span", { class: "s-gifting-error" }, this.errors['receiver.country']) : ''), h("div", { class: this.errors && this.errors['receiver.city_id'] ? "s-form-group s-form-has-error anime-item opacity-0" : "s-form-group anime-item opacity-0" }, 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 }, 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']) : ''), h("div", { class: "s-gifting-info anime-item opacity-0" }, h("span", { innerHTML: Alert }), h("span", null, this.selectCityInfo))), !this.physicalProducts && h("div", { class: "anime-item opacity-0" }, 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: "s-gifting-step-two-footer anime-item opacity-0" }, h("a", { href: "#!", innerHTML: IconArrowLeft, onClick: (e) => this.goToStep1(e) }), h("salla-button", { onClick: () => this.submitForm(), color: "primary", width: 'wide' }, h("span", null, this.sendGift)))))
-                    ], h("slot", { key: '8b69297ac7f9a527c12325a64a267825ea5ee48b', name: "footer" })))
+                    ], h("slot", { key: 'a08d6d434a1d144bd7aa5d3b13754980083a3f4d', name: "footer" })))
         ];
     }
     static get style() { return sallaGiftingCss; }

package/dist/components/salla-hook.js

@@ -17,7 +17,7 @@ const SallaHook$1 = /*@__PURE__*/ proxyCustomElement(class SallaHook extends HTM
         this.host.before(element);
     }
     render() {
-        return h(Host, { key: 'a887790b6c3fa466e88b0b1c90fda502f3aca812' });
+        return h(Host, { key: '618467f6911198a5cbf4270694544575e585af27' });
     }
     async componentDidLoad() {
         // Register this component for hooks system, already on it logic to run componentDidLoad trigger

package/dist/components/salla-list-tile2.js

@@ -25,7 +25,7 @@ const SallaListTile = /*@__PURE__*/ proxyCustomElement(class SallaListTile exten
         };
     }
     render() {
-        return (h(Host, { key: 'c66af50f4293094425640dd48246a973a240687b' }, h("a", { key: '5f2969fa28b312b2df0aa8f4ea93476f3d46f415', class: this.generateClass(), href: this.href || "#", target: this.target, "aria-label": "List Tile Link" }, h("div", { key: '4b92b66742957d2cb1d0961f78912ee28fd156d2', class: "s-list-tile-item-icon" }, h("slot", { key: '8593c413f0f7ed60d5f5b2e80a1e10880b6fd063', name: 'icon' })), h("div", { key: '469efd30ddfd208c1b73b6fc4485ae7fae11f914', class: "s-list-tile-item-content" }, h("div", { key: 'e5bebc43345b3921597d73020948ed5f913974e8', class: "s-list-tile-item-title" }, h("slot", { key: '306e82cccd99c6a8341c23fc5f8f35c5a656a088', name: 'title' })), h("div", { key: 'b148fbbc417ff3e174833a91c8b852525f6cacc1', class: "s-list-tile-item-subtitle" }, h("slot", { key: '44ef5d6b3aae8a7b511244be00c12700605c596a', name: "subtitle" }))), h("div", { key: '8cfd1fa5145a3b2adf7eb1da27f1cf96d7d96780', class: "s-list-tile-item-action" }, h("slot", { key: '47db71ae396cfc1cbdeb9fd7fd643afefd1af5db', 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 style() { return sallaListTileCss; }
 }, [4, "salla-list-tile", {