@salla.sa/twilight-components 2.14.391 → 2.14.393

package/dist/components/salla-rating-stars2.js

@@ -1,165 +1,4 @@
 /*!
  * Crafted with ❤ by Salla
  */
-import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
-import { R as Rate } from './star2.js';
-import { H as Helper } from './Helper.js';
-
-const sallaRatingStarsCss = "";
-
-const SallaRatingStars = /*@__PURE__*/ proxyCustomElement(class SallaRatingStars extends HTMLElement {
-    constructor() {
-        super();
-        this.__registerHost();
-        this.translationsLoaded = false;
-        this.labels = [];
-        this.reviewLabel = '';
-        this.selectedStar = 0;
-        /**
-       * Sets input name.
-       */
-        this.name = 'rating';
-        /**
-        * Sets the height and width of the component. Defaults to medium.
-        */
-        this.size = 'medium';
-        /**
-       * Number of reviews to display.
-       */
-        this.reviews = 0;
-        /**
-        * Allows the rating to be editable.
-        */
-        this.editable = false;
-    }
-    async componentWillLoad() {
-        await new Promise(resolve => {
-            salla.lang.onLoaded(() => {
-                this.labels = [
-                    salla.lang.get('pages.rating.poor'),
-                    salla.lang.get('pages.rating.average'),
-                    salla.lang.get('pages.rating.good'),
-                    salla.lang.get('pages.rating.very_good'),
-                    salla.lang.get('pages.rating.excellent')
-                ];
-                if (this.value && this.withLabel) {
-                    this.reviewLabel = this.labels[this.value - 1];
-                }
-                if (this.reviewsElement) {
-                    this.reviewsElement.innerText = `(${salla.helpers.number(salla.lang.choice('pages.rating.reviews', this.reviews))})`;
-                }
-                this.translationsLoaded = true;
-                resolve();
-            });
-        });
-    }
-    initiateRating() {
-        this.host.addEventListener('click', this.handleRating.bind(this));
-    }
-    handleRating() {
-        if (!this.starsElem)
-            return;
-        let activeStars = this.starsElem.querySelectorAll('.s-rating-stars-hovered');
-        let selected = activeStars[activeStars.length - 1];
-        if (!selected)
-            return;
-        let selectedIndex = parseInt(selected.getAttribute('data-star'));
-        this.starsElem.querySelector('.rating_hidden_input').value = selectedIndex.toString();
-        this.starsElem.querySelectorAll('.s-rating-stars-btn-star')
-            .forEach((star, index) => Helper.toggleElementClassIf(star, 's-rating-stars-selected', 's-rating-stars-unselected', () => index < selectedIndex));
-        this.starsElem.querySelectorAll('[aria-pressed]').forEach(star => star.removeAttribute('aria-pressed'));
-        selected.setAttribute('aria-pressed', 'true');
-        this.selectedStar = selectedIndex;
-        this.withLabel && (this.reviewLabel = this.labels[selectedIndex - 1]);
-    }
-    triggerRatingProgrammatically(index) {
-        if (!this.starsElem)
-            return;
-        const stars = this.starsElem.querySelectorAll('.s-rating-stars-btn-star');
-        if (stars && index >= 0 && index <= stars.length) {
-            // Simulate the hovering effect
-            stars.forEach((s, i) => {
-                s.classList.toggle('s-rating-stars-hovered', i <= index);
-            });
-            // Trigger the same logic as clicking
-            this.handleRating();
-        }
-    }
-    highlightSelectedStars() {
-        let hoveredClass = 's-rating-stars-hovered', stars = this.starsElem?.querySelectorAll('.s-rating-stars-btn-star');
-        stars?.forEach((star, index) => {
-            star.addEventListener('mouseover', () => {
-                for (let i = 0; i <= index; i++) {
-                    stars[i].classList.add(hoveredClass);
-                }
-                this.withLabel && (this.reviewLabel = this.labels[index]);
-            });
-            star.addEventListener('mouseout', () => {
-                star.classList.remove(hoveredClass);
-                this.withLabel && (this.reviewLabel = this.selectedStar ? this.labels[this.selectedStar - 1] : '');
-            });
-        });
-        this.starsElem?.addEventListener('mouseout', () => stars.forEach(star => star.classList.remove(hoveredClass)));
-    }
-    createStars(n) {
-        let stars = [];
-        for (let i = 0; i < 5; i++) {
-            stars.push(h("span", { class: {
-                    's-rating-stars-btn-star': true,
-                    ['s-rating-stars-' + this.size]: true,
-                    's-rating-stars-selected': i < n
-                }, innerHTML: Rate }));
-        }
-        if (this.reviews > 0) {
-            stars.push(h("span", { class: "s-rating-stars-reviews", ref: el => this.reviewsElement = el }, "(", salla.helpers.number(salla.lang.choice('pages.rating.reviews', this.reviews)), ")"));
-        }
-        return stars;
-    }
-    render() {
-        return this.translationsLoaded ? (this.host.closest('.swiper-slide')?.classList.contains('swiper-slide-duplicate')
-            ? ''
-            : (h(Host, null, (this.value || this.value == 0) && !this.editable ?
-                h("div", { class: "s-rating-stars-wrapper" }, this.createStars(this.value), this.withLabel && this.reviewLabel ? h("span", { class: "s-rating-stars-label" }, this.reviewLabel) : '')
-                :
-                    h("div", { class: "s-rating-stars-wrapper" }, h("div", { class: "s-rating-stars-element", ref: (el) => this.starsElem = el }, h("input", { type: "hidden", class: "rating_hidden_input", name: this.name, value: "" }), [1, 2, 3, 4, 5].map(star => h("button", { class: `s-rating-stars-btn-star s-rating-stars-` + this.size, "data-star": star }, h("span", { innerHTML: Rate })))), this.withLabel && this.reviewLabel ? h("span", { class: "s-rating-stars-label" }, this.reviewLabel) : '')))) : (h(Host, null));
-    }
-    componentDidLoad() {
-        this.initiateRating();
-        this.highlightSelectedStars();
-        if (this.value && this.editable) {
-            const stars = this.starsElem?.querySelectorAll('.s-rating-stars-btn-star');
-            if (stars && this.value >= 0 && this.value <= stars.length) {
-                this.triggerRatingProgrammatically(this.value - 1);
-            }
-        }
-    }
-    get host() { return this; }
-    static get style() { return sallaRatingStarsCss; }
-}, [0, "salla-rating-stars", {
-        "name": [1],
-        "size": [1],
-        "value": [2],
-        "reviews": [2],
-        "withLabel": [4, "with-label"],
-        "editable": [4],
-        "translationsLoaded": [32],
-        "labels": [32],
-        "reviewLabel": [32],
-        "selectedStar": [32]
-    }]);
-function defineCustomElement() {
-    if (typeof customElements === "undefined") {
-        return;
-    }
-    const components = ["salla-rating-stars"];
-    components.forEach(tagName => { switch (tagName) {
-        case "salla-rating-stars":
-            if (!customElements.get(tagName)) {
-                customElements.define(tagName, SallaRatingStars);
-            }
-            break;
-    } });
-}
-defineCustomElement();
-
-export { SallaRatingStars as S, defineCustomElement as d };
+import{transformTag as s,proxyCustomElement as t,HTMLElement as i,h as a,Host as e}from"@stencil/core/internal/client";import{R as r}from"./star2.js";import{H as n}from"./Helper.js";const h=t(class extends i{constructor(s){super(),!1!==s&&this.__registerHost(),this.translationsLoaded=!1,this.labels=[],this.reviewLabel="",this.selectedStar=0,this.name="rating",this.size="medium",this.reviews=0,this.editable=!1}async componentWillLoad(){await new Promise((s=>{salla.lang.onLoaded((()=>{this.labels=[salla.lang.get("pages.rating.poor"),salla.lang.get("pages.rating.average"),salla.lang.get("pages.rating.good"),salla.lang.get("pages.rating.very_good"),salla.lang.get("pages.rating.excellent")],this.value&&this.withLabel&&(this.reviewLabel=this.labels[this.value-1]),this.reviewsElement&&(this.reviewsElement.innerText=`(${salla.helpers.number(salla.lang.choice("pages.rating.reviews",this.reviews))})`),this.translationsLoaded=!0,s()}))}))}initiateRating(){this.host.addEventListener("click",this.handleRating.bind(this))}handleRating(){if(!this.starsElem)return;let s=this.starsElem.querySelectorAll(".s-rating-stars-hovered"),t=s[s.length-1];if(!t)return;let i=parseInt(t.getAttribute("data-star"));this.starsElem.querySelector(".rating_hidden_input").value=i.toString(),this.starsElem.querySelectorAll(".s-rating-stars-btn-star").forEach(((s,t)=>n.toggleElementClassIf(s,"s-rating-stars-selected","s-rating-stars-unselected",(()=>t<i)))),this.starsElem.querySelectorAll("[aria-pressed]").forEach((s=>s.removeAttribute("aria-pressed"))),t.setAttribute("aria-pressed","true"),this.selectedStar=i,this.withLabel&&(this.reviewLabel=this.labels[i-1])}triggerRatingProgrammatically(s){if(!this.starsElem)return;const t=this.starsElem.querySelectorAll(".s-rating-stars-btn-star");t&&s>=0&&s<=t.length&&(t.forEach(((t,i)=>{t.classList.toggle("s-rating-stars-hovered",i<=s)})),this.handleRating())}highlightSelectedStars(){let s="s-rating-stars-hovered",t=this.starsElem?.querySelectorAll(".s-rating-stars-btn-star");t?.forEach(((i,a)=>{i.addEventListener("mouseover",(()=>{for(let i=0;i<=a;i++)t[i].classList.add(s);this.withLabel&&(this.reviewLabel=this.labels[a])})),i.addEventListener("mouseout",(()=>{i.classList.remove(s),this.withLabel&&(this.reviewLabel=this.selectedStar?this.labels[this.selectedStar-1]:"")}))})),this.starsElem?.addEventListener("mouseout",(()=>t.forEach((t=>t.classList.remove(s)))))}createStars(s){let t=[];for(let i=0;i<5;i++)t.push(a("span",{class:{"s-rating-stars-btn-star":!0,["s-rating-stars-"+this.size]:!0,"s-rating-stars-selected":i<s},innerHTML:r}));return this.reviews>0&&t.push(a("span",{class:"s-rating-stars-reviews",ref:s=>this.reviewsElement=s},"(",salla.helpers.number(salla.lang.choice("pages.rating.reviews",this.reviews)),")")),t}render(){return this.translationsLoaded?this.host.closest(".swiper-slide")?.classList.contains("swiper-slide-duplicate")?"":a(e,null,a("div",{class:"s-rating-stars-wrapper"},!this.value&&0!=this.value||this.editable?a("div",{class:"s-rating-stars-element",ref:s=>this.starsElem=s},a("input",{type:"hidden",class:"rating_hidden_input",name:this.name,value:""}),[1,2,3,4,5].map((s=>a("button",{class:"s-rating-stars-btn-star s-rating-stars-"+this.size,"data-star":s},a("span",{innerHTML:r}))))):this.createStars(this.value),this.withLabel&&this.reviewLabel?a("span",{class:"s-rating-stars-label"},this.reviewLabel):"")):a(e,null)}componentDidLoad(){if(this.initiateRating(),this.highlightSelectedStars(),this.value&&this.editable){const s=this.starsElem?.querySelectorAll(".s-rating-stars-btn-star");s&&this.value>=0&&this.value<=s.length&&this.triggerRatingProgrammatically(this.value-1)}}get host(){return this}static get style(){return""}},[0,"salla-rating-stars",{name:[1],size:[1],value:[2],reviews:[2],withLabel:[4,"with-label"],editable:[4],translationsLoaded:[32],labels:[32],reviewLabel:[32],selectedStar:[32]}]);function l(){"undefined"!=typeof customElements&&["salla-rating-stars"].forEach((t=>{"salla-rating-stars"===t&&(customElements.get(s(t))||customElements.define(s(t),h))}))}l();export{h as S,l as d}

package/dist/components/salla-review-card.js

@@ -1,9 +1,4 @@
 /*!
  * Crafted with ❤ by Salla
  */
-import { S as SallaReviewCard$1, d as defineCustomElement$1 } from './salla-review-card2.js';
-
-const SallaReviewCard = SallaReviewCard$1;
-const defineCustomElement = defineCustomElement$1;
-
-export { SallaReviewCard, defineCustomElement };
+import{S as a,d as r}from"./salla-review-card2.js";const s=a,o=r;export{s as SallaReviewCard,o as defineCustomElement}

package/dist/components/salla-review-card2.js

@@ -1,201 +1,4 @@
 /*!
  * Crafted with ❤ by Salla
  */
-import { proxyCustomElement, HTMLElement, h } from '@stencil/core/internal/client';
-import { I as IconVerified } from './check.js';
-
-var IconStar2 = ` <svg width="18" height="17" view-box="0 0 18 17" fill="none" xmlns="http://www.w3.org/2000/svg">
-      <path d="M9.00045 13.6951L3.71036 16.6563L4.89186 10.71L0.440918 6.59397L6.4612 5.88017L9.00045 0.375122L11.5396 5.88017L17.5599 6.59397L13.109 10.71L14.2905 16.6563L9.00045 13.6951Z" fill="currentcolor" />
-</svg>`;
-
-var IconStar2Muted = ` <svg width="18" height="17" view-box="0 0 18 17" fill="none" xmlns="http://www.w3.org/2000/svg">
-      <path d="M9.00045 13.6951L3.71036 16.6563L4.89186 10.71L0.440918 6.59397L6.4612 5.88017L9.00045 0.375122L11.5396 5.88017L17.5599 6.59397L13.109 10.71L14.2905 16.6563L9.00045 13.6951Z" fill="#DDDDDD" />
-</svg>`;
-
-var IconFire2 = `  <svg width="12" height="17" view-box="0 0 12 17" fill="none" xmlns="http://www.w3.org/2000/svg">
-      <path d="M6 16.2501C9.10658 16.2501 11.625 13.7317 11.625 10.6251C11.625 9.976 11.4523 9.35252 11.25 8.77232C9.99998 10.0075 9.05002 10.6251 8.4 10.6251C11.3966 5.37512 9.75 3.12512 5.25 0.125122C5.625 3.87475 3.15302 5.58043 2.14634 6.52757C1.0559 7.5535 0.375 9.00977 0.375 10.6251C0.375 13.7317 2.89339 16.2501 6 16.2501ZM6.53205 2.92636C8.96333 4.98908 8.97495 6.59185 7.09725 9.88157C6.5265 10.8815 7.2486 12.1251 8.4 12.1251C8.9163 12.1251 9.43807 11.9745 9.98917 11.6789C9.52342 13.4466 7.91393 14.7501 6 14.7501C3.72182 14.7501 1.875 12.9033 1.875 10.6251C1.875 9.47072 2.34959 8.39582 3.17419 7.62002C3.2687 7.53115 3.74812 7.1062 3.76858 7.08782C4.08646 6.8017 4.34835 6.54985 4.60718 6.2727C5.52998 5.28461 6.19283 4.18735 6.53205 2.92636Z" fill="currentcolor" />
-    </svg>`;
-
-const sallaReviewCardCss = ":host{display:block}";
-
-const SallaReviewCard = /*@__PURE__*/ proxyCustomElement(class SallaReviewCard extends HTMLElement {
-    constructor() {
-        super();
-        this.__registerHost();
-        this.currentSlide = 0;
-        this.showPurchaseCount = false;
-        this.startPoint = { x: 0, y: 0 };
-        this.isSwiping = false;
-        this.isRTL = "rtl";
-        this.handlePointerDown = (e) => {
-            // Only handle primary pointer (first touch/mouse)
-            if (!e.isPrimary)
-                return;
-            this.sliderElement?.setPointerCapture(e.pointerId);
-            this.startSwipe(e.clientX, e.clientY);
-            e.preventDefault();
-        };
-        this.handlePointerMove = (e) => {
-            if (!this.isSwiping || !e.isPrimary)
-                return;
-            e.preventDefault();
-        };
-        this.handlePointerUp = (e) => {
-            if (!this.isSwiping || !e.isPrimary)
-                return;
-            this.sliderElement?.releasePointerCapture(e.pointerId);
-            this.endSwipe(e.clientX, e.clientY);
-        };
-        this.handlePointerCancel = (e) => {
-            if (!this.isSwiping || !e.isPrimary)
-                return;
-            this.sliderElement?.releasePointerCapture(e.pointerId);
-            this.isSwiping = false;
-        };
-        this.goToSlide = (index) => {
-            this.currentSlide = Math.max(0, Math.min(index, this.images.length - 1));
-        };
-    }
-    async componentDidLoad() {
-        await salla.onReady();
-        this.showPurchaseCount = !!salla.config.get('store.settings.product.total_sold_enabled', false);
-        this.isRTL = salla.config.get('theme.is_rtl', true);
-        this.purchasedCount = salla.lang.getWithDefault('blocks.home.reviews.purchased_count', this.isRTL ? ` تم شراءه ${this.review.product?.sold_quantity} مرة`
-            : `Purchased ${this.review.product.sold_quantity} times`, { count: this.review.product?.sold_quantity });
-        this.initializeSlider();
-    }
-    disconnectedCallback() {
-        this.removeEventListeners();
-    }
-    get images() {
-        const { review } = this;
-        return review?.images?.length > 1
-            ? review.images.map((image, idx) => ({ url: image, alt: '', id: idx }))
-            : review?.product?.images || [];
-    }
-    get hasMultipleImages() {
-        return this.images.length > 1;
-    }
-    get slideTransform() {
-        const direction = this.isRTL ? 1 : -1;
-        return `translateX(${this.currentSlide * 100 * direction}%)`;
-    }
-    initializeSlider() {
-        if (!this.hasMultipleImages)
-            return;
-        this.sliderElement = this.el.querySelector(".s-review-card-slider-container");
-        if (!this.sliderElement)
-            return;
-        // Enable pointer events and set touch-action
-        this.sliderElement.style.touchAction = 'pan-y pinch-zoom';
-        this.addEventListeners();
-    }
-    addEventListeners() {
-        if (!this.sliderElement)
-            return;
-        this.sliderElement.addEventListener("pointerdown", this.handlePointerDown, { passive: false });
-        this.sliderElement.addEventListener("pointermove", this.handlePointerMove, { passive: false });
-        this.sliderElement.addEventListener("pointerup", this.handlePointerUp, { passive: true });
-        this.sliderElement.addEventListener("pointercancel", this.handlePointerCancel, { passive: true });
-    }
-    removeEventListeners() {
-        if (!this.sliderElement)
-            return;
-        this.sliderElement.removeEventListener("pointerdown", this.handlePointerDown);
-        this.sliderElement.removeEventListener("pointermove", this.handlePointerMove);
-        this.sliderElement.removeEventListener("pointerup", this.handlePointerUp);
-        this.sliderElement.removeEventListener("pointercancel", this.handlePointerCancel);
-    }
-    startSwipe(x, y) {
-        this.startPoint = { x, y };
-        this.isSwiping = true;
-    }
-    componentDidRender() {
-        this.removeEventListeners();
-        this.addEventListeners();
-    }
-    endSwipe(x, y) {
-        this.isSwiping = false;
-        const dx = x - this.startPoint.x;
-        const dy = y - this.startPoint.y;
-        this.processSwipe(dx, dy);
-    }
-    processSwipe(dx, dy) {
-        const MIN_SWIPE_DISTANCE = 10;
-        if (Math.abs(dx) < MIN_SWIPE_DISTANCE || Math.abs(dy) > Math.abs(dx))
-            return;
-        const isLeftSwipe = dx < 0;
-        const shouldGoNext = this.isRTL ? !isLeftSwipe : isLeftSwipe;
-        if (shouldGoNext) {
-            this.goToNextSlide();
-        }
-        else {
-            this.goToPrevSlide();
-        }
-    }
-    goToNextSlide() {
-        if (this.currentSlide < this.images.length - 1) {
-            this.currentSlide++;
-        }
-    }
-    goToPrevSlide() {
-        if (this.currentSlide > 0) {
-            this.currentSlide--;
-        }
-    }
-    renderStars() {
-        return Array(5)
-            .fill(null)
-            .map((_, index) => h("span", { key: index, innerHTML: this.review.stars >= index + 1 ? IconStar2 : IconStar2Muted }));
-    }
-    renderDots() {
-        return this.images.map(({ url }, index) => (h("button", { key: url || index, type: "button", class: `s-review-card-slider-dot ${this.currentSlide === index ? "active" : ""}`, onClick: () => this.goToSlide(index), "aria-label": `Go to slide ${index + 1}`, onPointerDown: () => this.goToSlide(index) })));
-    }
-    renderSlider() {
-        if (!this.hasMultipleImages)
-            return null;
-        return (h("div", { class: "s-review-card-slider-container" }, h("div", { class: "s-review-card-slides", style: { transform: this.slideTransform } }, this.images.map((image) => (h("div", { key: image?.id, class: "s-review-card-slider-slide" }, h("img", { src: image.url, alt: image.alt || "Product image", width: 275, height: 275, loading: "lazy", draggable: false }))))), h("div", { class: "s-review-card-slider-dots" }, this.renderDots())));
-    }
-    renderSingleImage() {
-        const image = this.review?.product?.image;
-        if (!image || this.hasMultipleImages)
-            return null;
-        return (h("img", { src: image.url, alt: image.alt || "Product image", class: "s-review-card-image", width: 275, height: 275, loading: "lazy", decoding: "async", draggable: false }));
-    }
-    renderHeader() {
-        return (h("div", { class: "s-review-card-header" }, h("div", { class: "s-review-card-reviewer-name" }, h("p", null, this.review?.name), this.review?.has_order && h("span", { class: "s-review-card-verified-icon", innerHTML: IconVerified })), h("div", { class: "s-review-card-stars" }, this.renderStars())));
-    }
-    renderProductInfo() {
-        const product = this.review?.product;
-        if (!product)
-            return null;
-        return (h("a", { href: this.review?.product?.url, class: "s-review-card-product-container" }, h("img", { alt: product.image?.alt || "Product", src: product.image?.url, class: "s-review-card-product-image", width: 60, height: 60, loading: "lazy", decoding: "async", draggable: false }), h("div", { class: "s-review-card-product-details" }, h("p", { class: "s-review-card-product-details-name" }, product.name), this.showPurchaseCount ? h("p", { class: "s-review-card-product-details-purchase-count" }, h("span", { innerHTML: IconFire2 }), this.purchasedCount) : null)));
-    }
-    render() {
-        return h("div", { key: '2c239df97aea1d28e160ede3e06bd283874bbaea', class: "s-review-card-container" }, this.renderSlider(), this.renderSingleImage(), renderDivider(), h("div", { key: '227c1fad17d6d2bf26316cabf69b854bb23cca52', class: "s-review-card-content" }, this.renderHeader(), h("p", { key: '74b06a8c24767d8e8cd7101915055d3861c5d0fd', class: "s-review-card-review-content", innerHTML: this.review?.content }), renderDivider(), this.renderProductInfo()));
-    }
-    get el() { return this; }
-    static get style() { return sallaReviewCardCss; }
-}, [0, "salla-review-card", {
-        "review": [16],
-        "currentSlide": [32],
-        "purchasedCount": [32],
-        "showPurchaseCount": [32]
-    }]);
-const renderDivider = (className) => (h("div", { class: `s-review-card-divider ${""}` }));
-function defineCustomElement() {
-    if (typeof customElements === "undefined") {
-        return;
-    }
-    const components = ["salla-review-card"];
-    components.forEach(tagName => { switch (tagName) {
-        case "salla-review-card":
-            if (!customElements.get(tagName)) {
-                customElements.define(tagName, SallaReviewCard);
-            }
-            break;
-    } });
-}
-defineCustomElement();
-
-export { SallaReviewCard as S, defineCustomElement as d };
+import{transformTag as s,proxyCustomElement as t,HTMLElement as i,h as e}from"@stencil/core/internal/client";import{I as r}from"./check.js";const a=t(class extends i{constructor(s){super(),!1!==s&&this.__registerHost(),this.currentSlide=0,this.showPurchaseCount=!1,this.startPoint={x:0,y:0},this.isSwiping=!1,this.isRTL="rtl",this.handlePointerDown=s=>{s.isPrimary&&(this.sliderElement?.setPointerCapture(s.pointerId),this.startSwipe(s.clientX,s.clientY),s.preventDefault())},this.handlePointerMove=s=>{this.isSwiping&&s.isPrimary&&s.preventDefault()},this.handlePointerUp=s=>{this.isSwiping&&s.isPrimary&&(this.sliderElement?.releasePointerCapture(s.pointerId),this.endSwipe(s.clientX,s.clientY))},this.handlePointerCancel=s=>{this.isSwiping&&s.isPrimary&&(this.sliderElement?.releasePointerCapture(s.pointerId),this.isSwiping=!1)},this.goToSlide=s=>{this.currentSlide=Math.max(0,Math.min(s,this.images.length-1))}}async componentDidLoad(){await salla.onReady(),this.showPurchaseCount=!!salla.config.get("store.settings.product.total_sold_enabled",!1),this.isRTL=salla.config.get("theme.is_rtl",!0),this.purchasedCount=salla.lang.getWithDefault("blocks.home.reviews.purchased_count",this.isRTL?` تم شراءه ${this.review.product?.sold_quantity} مرة`:`Purchased ${this.review.product.sold_quantity} times`,{count:this.review.product?.sold_quantity}),this.initializeSlider()}disconnectedCallback(){this.removeEventListeners()}get images(){const{review:s}=this;return s?.images?.length>1?s.images.map(((s,t)=>({url:s,alt:"",id:t}))):s?.product?.images||[]}get hasMultipleImages(){return this.images.length>1}get slideTransform(){return`translateX(${100*this.currentSlide*(this.isRTL?1:-1)}%)`}initializeSlider(){this.hasMultipleImages&&(this.sliderElement=this.el.querySelector(".s-review-card-slider-container"),this.sliderElement&&(this.sliderElement.style.touchAction="pan-y pinch-zoom",this.addEventListeners()))}addEventListeners(){this.sliderElement&&(this.sliderElement.addEventListener("pointerdown",this.handlePointerDown,{passive:!1}),this.sliderElement.addEventListener("pointermove",this.handlePointerMove,{passive:!1}),this.sliderElement.addEventListener("pointerup",this.handlePointerUp,{passive:!0}),this.sliderElement.addEventListener("pointercancel",this.handlePointerCancel,{passive:!0}))}removeEventListeners(){this.sliderElement&&(this.sliderElement.removeEventListener("pointerdown",this.handlePointerDown),this.sliderElement.removeEventListener("pointermove",this.handlePointerMove),this.sliderElement.removeEventListener("pointerup",this.handlePointerUp),this.sliderElement.removeEventListener("pointercancel",this.handlePointerCancel))}startSwipe(s,t){this.startPoint={x:s,y:t},this.isSwiping=!0}componentDidRender(){this.removeEventListeners(),this.addEventListeners()}endSwipe(s,t){this.isSwiping=!1,this.processSwipe(s-this.startPoint.x,t-this.startPoint.y)}processSwipe(s,t){if(Math.abs(s)<10||Math.abs(t)>Math.abs(s))return;const i=s<0;(this.isRTL?!i:i)?this.goToNextSlide():this.goToPrevSlide()}goToNextSlide(){this.currentSlide<this.images.length-1&&this.currentSlide++}goToPrevSlide(){this.currentSlide>0&&this.currentSlide--}renderStars(){return Array(5).fill(null).map(((s,t)=>e("span",{key:t,innerHTML:this.review.stars>=t+1?' <svg width="18" height="17" view-box="0 0 18 17" fill="none" xmlns="http://www.w3.org/2000/svg">\n      <path d="M9.00045 13.6951L3.71036 16.6563L4.89186 10.71L0.440918 6.59397L6.4612 5.88017L9.00045 0.375122L11.5396 5.88017L17.5599 6.59397L13.109 10.71L14.2905 16.6563L9.00045 13.6951Z" fill="currentcolor" />\n</svg>':' <svg width="18" height="17" view-box="0 0 18 17" fill="none" xmlns="http://www.w3.org/2000/svg">\n      <path d="M9.00045 13.6951L3.71036 16.6563L4.89186 10.71L0.440918 6.59397L6.4612 5.88017L9.00045 0.375122L11.5396 5.88017L17.5599 6.59397L13.109 10.71L14.2905 16.6563L9.00045 13.6951Z" fill="#DDDDDD" />\n</svg>'})))}renderDots(){return this.images.map((({url:s},t)=>e("button",{key:s||t,type:"button",class:"s-review-card-slider-dot "+(this.currentSlide===t?"active":""),onClick:()=>this.goToSlide(t),"aria-label":`Go to slide ${t+1}`,onPointerDown:()=>this.goToSlide(t)})))}renderSlider(){return this.hasMultipleImages?e("div",{class:"s-review-card-slider-container"},e("div",{class:"s-review-card-slides",style:{transform:this.slideTransform}},this.images.map((s=>e("div",{key:s?.id,class:"s-review-card-slider-slide"},e("img",{src:s.url,alt:s.alt||"Product image",width:275,height:275,loading:"lazy",draggable:!1}))))),e("div",{class:"s-review-card-slider-dots"},this.renderDots())):null}renderSingleImage(){const s=this.review?.product?.image;return!s||this.hasMultipleImages?null:e("img",{src:s.url,alt:s.alt||"Product image",class:"s-review-card-image",width:275,height:275,loading:"lazy",decoding:"async",draggable:!1})}renderHeader(){return e("div",{class:"s-review-card-header"},e("div",{class:"s-review-card-reviewer-name"},e("p",null,this.review?.name),this.review?.has_order&&e("span",{class:"s-review-card-verified-icon",innerHTML:r})),e("div",{class:"s-review-card-stars"},this.renderStars()))}renderProductInfo(){const s=this.review?.product;return s?e("a",{href:this.review?.product?.url,class:"s-review-card-product-container"},e("img",{alt:s.image?.alt||"Product",src:s.image?.url,class:"s-review-card-product-image",width:60,height:60,loading:"lazy",decoding:"async",draggable:!1}),e("div",{class:"s-review-card-product-details"},e("p",{class:"s-review-card-product-details-name"},s.name),this.showPurchaseCount?e("p",{class:"s-review-card-product-details-purchase-count"},e("span",{innerHTML:'  <svg width="12" height="17" view-box="0 0 12 17" fill="none" xmlns="http://www.w3.org/2000/svg">\n      <path d="M6 16.2501C9.10658 16.2501 11.625 13.7317 11.625 10.6251C11.625 9.976 11.4523 9.35252 11.25 8.77232C9.99998 10.0075 9.05002 10.6251 8.4 10.6251C11.3966 5.37512 9.75 3.12512 5.25 0.125122C5.625 3.87475 3.15302 5.58043 2.14634 6.52757C1.0559 7.5535 0.375 9.00977 0.375 10.6251C0.375 13.7317 2.89339 16.2501 6 16.2501ZM6.53205 2.92636C8.96333 4.98908 8.97495 6.59185 7.09725 9.88157C6.5265 10.8815 7.2486 12.1251 8.4 12.1251C8.9163 12.1251 9.43807 11.9745 9.98917 11.6789C9.52342 13.4466 7.91393 14.7501 6 14.7501C3.72182 14.7501 1.875 12.9033 1.875 10.6251C1.875 9.47072 2.34959 8.39582 3.17419 7.62002C3.2687 7.53115 3.74812 7.1062 3.76858 7.08782C4.08646 6.8017 4.34835 6.54985 4.60718 6.2727C5.52998 5.28461 6.19283 4.18735 6.53205 2.92636Z" fill="currentcolor" />\n    </svg>'}),this.purchasedCount):null)):null}render(){return e("div",{key:"2c239df97aea1d28e160ede3e06bd283874bbaea",class:"s-review-card-container"},this.renderSlider(),this.renderSingleImage(),h(),e("div",{key:"227c1fad17d6d2bf26316cabf69b854bb23cca52",class:"s-review-card-content"},this.renderHeader(),e("p",{key:"74b06a8c24767d8e8cd7101915055d3861c5d0fd",class:"s-review-card-review-content",innerHTML:this.review?.content}),h(),this.renderProductInfo()))}get el(){return this}static get style(){return":host{display:block}"}},[0,"salla-review-card",{review:[16],currentSlide:[32],purchasedCount:[32],showPurchaseCount:[32]}]),h=()=>e("div",{class:"s-review-card-divider "});function n(){"undefined"!=typeof customElements&&["salla-review-card"].forEach((t=>{"salla-review-card"===t&&(customElements.get(s(t))||customElements.define(s(t),a))}))}n();export{a as S,n as d}