@salla.sa/twilight-components 2.14.392 → 2.14.393

package/dist/components/salla-reviews-page.js

@@ -1,729 +1,4 @@
 /*!
  * Crafted with ❤ by Salla
  */
-import { proxyCustomElement, HTMLElement, h } from '@stencil/core/internal/client';
-import { S as ShoppingBag } from './shopping-bag.js';
-import { H as Helper } from './Helper.js';
-import { g as getDefaultExportFromCjs } from './_commonjsHelpers.js';
-import { c as require_root, b as requireIsObject, r as requireIsSymbol } from './isObject.js';
-import { d as defineCustomElement$3 } from './salla-button2.js';
-import { d as defineCustomElement$2 } from './salla-review-card2.js';
-
-var now_1;
-var hasRequiredNow;
-
-function requireNow () {
-	if (hasRequiredNow) return now_1;
-	hasRequiredNow = 1;
-	var root = require_root();
-
-	/**
-	 * Gets the timestamp of the number of milliseconds that have elapsed since
-	 * the Unix epoch (1 January 1970 00:00:00 UTC).
-	 *
-	 * @static
-	 * @memberOf _
-	 * @since 2.4.0
-	 * @category Date
-	 * @returns {number} Returns the timestamp.
-	 * @example
-	 *
-	 * _.defer(function(stamp) {
-	 *   console.log(_.now() - stamp);
-	 * }, _.now());
-	 * // => Logs the number of milliseconds it took for the deferred invocation.
-	 */
-	var now = function() {
-	  return root.Date.now();
-	};
-
-	now_1 = now;
-	return now_1;
-}
-
-/** Used to match a single whitespace character. */
-
-var _trimmedEndIndex;
-var hasRequired_trimmedEndIndex;
-
-function require_trimmedEndIndex () {
-	if (hasRequired_trimmedEndIndex) return _trimmedEndIndex;
-	hasRequired_trimmedEndIndex = 1;
-	var reWhitespace = /\s/;
-
-	/**
-	 * Used by `_.trim` and `_.trimEnd` to get the index of the last non-whitespace
-	 * character of `string`.
-	 *
-	 * @private
-	 * @param {string} string The string to inspect.
-	 * @returns {number} Returns the index of the last non-whitespace character.
-	 */
-	function trimmedEndIndex(string) {
-	  var index = string.length;
-
-	  while (index-- && reWhitespace.test(string.charAt(index))) {}
-	  return index;
-	}
-
-	_trimmedEndIndex = trimmedEndIndex;
-	return _trimmedEndIndex;
-}
-
-var _baseTrim;
-var hasRequired_baseTrim;
-
-function require_baseTrim () {
-	if (hasRequired_baseTrim) return _baseTrim;
-	hasRequired_baseTrim = 1;
-	var trimmedEndIndex = require_trimmedEndIndex();
-
-	/** Used to match leading whitespace. */
-	var reTrimStart = /^\s+/;
-
-	/**
-	 * The base implementation of `_.trim`.
-	 *
-	 * @private
-	 * @param {string} string The string to trim.
-	 * @returns {string} Returns the trimmed string.
-	 */
-	function baseTrim(string) {
-	  return string
-	    ? string.slice(0, trimmedEndIndex(string) + 1).replace(reTrimStart, '')
-	    : string;
-	}
-
-	_baseTrim = baseTrim;
-	return _baseTrim;
-}
-
-var toNumber_1;
-var hasRequiredToNumber;
-
-function requireToNumber () {
-	if (hasRequiredToNumber) return toNumber_1;
-	hasRequiredToNumber = 1;
-	var baseTrim = require_baseTrim(),
-	    isObject = requireIsObject(),
-	    isSymbol = requireIsSymbol();
-
-	/** Used as references for various `Number` constants. */
-	var NAN = 0 / 0;
-
-	/** Used to detect bad signed hexadecimal string values. */
-	var reIsBadHex = /^[-+]0x[0-9a-f]+$/i;
-
-	/** Used to detect binary string values. */
-	var reIsBinary = /^0b[01]+$/i;
-
-	/** Used to detect octal string values. */
-	var reIsOctal = /^0o[0-7]+$/i;
-
-	/** Built-in method references without a dependency on `root`. */
-	var freeParseInt = parseInt;
-
-	/**
-	 * Converts `value` to a number.
-	 *
-	 * @static
-	 * @memberOf _
-	 * @since 4.0.0
-	 * @category Lang
-	 * @param {*} value The value to process.
-	 * @returns {number} Returns the number.
-	 * @example
-	 *
-	 * _.toNumber(3.2);
-	 * // => 3.2
-	 *
-	 * _.toNumber(Number.MIN_VALUE);
-	 * // => 5e-324
-	 *
-	 * _.toNumber(Infinity);
-	 * // => Infinity
-	 *
-	 * _.toNumber('3.2');
-	 * // => 3.2
-	 */
-	function toNumber(value) {
-	  if (typeof value == 'number') {
-	    return value;
-	  }
-	  if (isSymbol(value)) {
-	    return NAN;
-	  }
-	  if (isObject(value)) {
-	    var other = typeof value.valueOf == 'function' ? value.valueOf() : value;
-	    value = isObject(other) ? (other + '') : other;
-	  }
-	  if (typeof value != 'string') {
-	    return value === 0 ? value : +value;
-	  }
-	  value = baseTrim(value);
-	  var isBinary = reIsBinary.test(value);
-	  return (isBinary || reIsOctal.test(value))
-	    ? freeParseInt(value.slice(2), isBinary ? 2 : 8)
-	    : (reIsBadHex.test(value) ? NAN : +value);
-	}
-
-	toNumber_1 = toNumber;
-	return toNumber_1;
-}
-
-var debounce_1;
-var hasRequiredDebounce;
-
-function requireDebounce () {
-	if (hasRequiredDebounce) return debounce_1;
-	hasRequiredDebounce = 1;
-	var isObject = requireIsObject(),
-	    now = requireNow(),
-	    toNumber = requireToNumber();
-
-	/** Error message constants. */
-	var FUNC_ERROR_TEXT = 'Expected a function';
-
-	/* Built-in method references for those with the same name as other `lodash` methods. */
-	var nativeMax = Math.max,
-	    nativeMin = Math.min;
-
-	/**
-	 * Creates a debounced function that delays invoking `func` until after `wait`
-	 * milliseconds have elapsed since the last time the debounced function was
-	 * invoked. The debounced function comes with a `cancel` method to cancel
-	 * delayed `func` invocations and a `flush` method to immediately invoke them.
-	 * Provide `options` to indicate whether `func` should be invoked on the
-	 * leading and/or trailing edge of the `wait` timeout. The `func` is invoked
-	 * with the last arguments provided to the debounced function. Subsequent
-	 * calls to the debounced function return the result of the last `func`
-	 * invocation.
-	 *
-	 * **Note:** If `leading` and `trailing` options are `true`, `func` is
-	 * invoked on the trailing edge of the timeout only if the debounced function
-	 * is invoked more than once during the `wait` timeout.
-	 *
-	 * If `wait` is `0` and `leading` is `false`, `func` invocation is deferred
-	 * until to the next tick, similar to `setTimeout` with a timeout of `0`.
-	 *
-	 * See [David Corbacho's article](https://css-tricks.com/debouncing-throttling-explained-examples/)
-	 * for details over the differences between `_.debounce` and `_.throttle`.
-	 *
-	 * @static
-	 * @memberOf _
-	 * @since 0.1.0
-	 * @category Function
-	 * @param {Function} func The function to debounce.
-	 * @param {number} [wait=0] The number of milliseconds to delay.
-	 * @param {Object} [options={}] The options object.
-	 * @param {boolean} [options.leading=false]
-	 *  Specify invoking on the leading edge of the timeout.
-	 * @param {number} [options.maxWait]
-	 *  The maximum time `func` is allowed to be delayed before it's invoked.
-	 * @param {boolean} [options.trailing=true]
-	 *  Specify invoking on the trailing edge of the timeout.
-	 * @returns {Function} Returns the new debounced function.
-	 * @example
-	 *
-	 * // Avoid costly calculations while the window size is in flux.
-	 * jQuery(window).on('resize', _.debounce(calculateLayout, 150));
-	 *
-	 * // Invoke `sendMail` when clicked, debouncing subsequent calls.
-	 * jQuery(element).on('click', _.debounce(sendMail, 300, {
-	 *   'leading': true,
-	 *   'trailing': false
-	 * }));
-	 *
-	 * // Ensure `batchLog` is invoked once after 1 second of debounced calls.
-	 * var debounced = _.debounce(batchLog, 250, { 'maxWait': 1000 });
-	 * var source = new EventSource('/stream');
-	 * jQuery(source).on('message', debounced);
-	 *
-	 * // Cancel the trailing debounced invocation.
-	 * jQuery(window).on('popstate', debounced.cancel);
-	 */
-	function debounce(func, wait, options) {
-	  var lastArgs,
-	      lastThis,
-	      maxWait,
-	      result,
-	      timerId,
-	      lastCallTime,
-	      lastInvokeTime = 0,
-	      leading = false,
-	      maxing = false,
-	      trailing = true;
-
-	  if (typeof func != 'function') {
-	    throw new TypeError(FUNC_ERROR_TEXT);
-	  }
-	  wait = toNumber(wait) || 0;
-	  if (isObject(options)) {
-	    leading = !!options.leading;
-	    maxing = 'maxWait' in options;
-	    maxWait = maxing ? nativeMax(toNumber(options.maxWait) || 0, wait) : maxWait;
-	    trailing = 'trailing' in options ? !!options.trailing : trailing;
-	  }
-
-	  function invokeFunc(time) {
-	    var args = lastArgs,
-	        thisArg = lastThis;
-
-	    lastArgs = lastThis = undefined;
-	    lastInvokeTime = time;
-	    result = func.apply(thisArg, args);
-	    return result;
-	  }
-
-	  function leadingEdge(time) {
-	    // Reset any `maxWait` timer.
-	    lastInvokeTime = time;
-	    // Start the timer for the trailing edge.
-	    timerId = setTimeout(timerExpired, wait);
-	    // Invoke the leading edge.
-	    return leading ? invokeFunc(time) : result;
-	  }
-
-	  function remainingWait(time) {
-	    var timeSinceLastCall = time - lastCallTime,
-	        timeSinceLastInvoke = time - lastInvokeTime,
-	        timeWaiting = wait - timeSinceLastCall;
-
-	    return maxing
-	      ? nativeMin(timeWaiting, maxWait - timeSinceLastInvoke)
-	      : timeWaiting;
-	  }
-
-	  function shouldInvoke(time) {
-	    var timeSinceLastCall = time - lastCallTime,
-	        timeSinceLastInvoke = time - lastInvokeTime;
-
-	    // Either this is the first call, activity has stopped and we're at the
-	    // trailing edge, the system time has gone backwards and we're treating
-	    // it as the trailing edge, or we've hit the `maxWait` limit.
-	    return (lastCallTime === undefined || (timeSinceLastCall >= wait) ||
-	      (timeSinceLastCall < 0) || (maxing && timeSinceLastInvoke >= maxWait));
-	  }
-
-	  function timerExpired() {
-	    var time = now();
-	    if (shouldInvoke(time)) {
-	      return trailingEdge(time);
-	    }
-	    // Restart the timer.
-	    timerId = setTimeout(timerExpired, remainingWait(time));
-	  }
-
-	  function trailingEdge(time) {
-	    timerId = undefined;
-
-	    // Only invoke if we have `lastArgs` which means `func` has been
-	    // debounced at least once.
-	    if (trailing && lastArgs) {
-	      return invokeFunc(time);
-	    }
-	    lastArgs = lastThis = undefined;
-	    return result;
-	  }
-
-	  function cancel() {
-	    if (timerId !== undefined) {
-	      clearTimeout(timerId);
-	    }
-	    lastInvokeTime = 0;
-	    lastArgs = lastCallTime = lastThis = timerId = undefined;
-	  }
-
-	  function flush() {
-	    return timerId === undefined ? result : trailingEdge(now());
-	  }
-
-	  function debounced() {
-	    var time = now(),
-	        isInvoking = shouldInvoke(time);
-
-	    lastArgs = arguments;
-	    lastThis = this;
-	    lastCallTime = time;
-
-	    if (isInvoking) {
-	      if (timerId === undefined) {
-	        return leadingEdge(lastCallTime);
-	      }
-	      if (maxing) {
-	        // Handle invocations in a tight loop.
-	        clearTimeout(timerId);
-	        timerId = setTimeout(timerExpired, wait);
-	        return invokeFunc(lastCallTime);
-	      }
-	    }
-	    if (timerId === undefined) {
-	      timerId = setTimeout(timerExpired, wait);
-	    }
-	    return result;
-	  }
-	  debounced.cancel = cancel;
-	  debounced.flush = flush;
-	  return debounced;
-	}
-
-	debounce_1 = debounce;
-	return debounce_1;
-}
-
-var throttle_1;
-var hasRequiredThrottle;
-
-function requireThrottle () {
-	if (hasRequiredThrottle) return throttle_1;
-	hasRequiredThrottle = 1;
-	var debounce = requireDebounce(),
-	    isObject = requireIsObject();
-
-	/** Error message constants. */
-	var FUNC_ERROR_TEXT = 'Expected a function';
-
-	/**
-	 * Creates a throttled function that only invokes `func` at most once per
-	 * every `wait` milliseconds. The throttled function comes with a `cancel`
-	 * method to cancel delayed `func` invocations and a `flush` method to
-	 * immediately invoke them. Provide `options` to indicate whether `func`
-	 * should be invoked on the leading and/or trailing edge of the `wait`
-	 * timeout. The `func` is invoked with the last arguments provided to the
-	 * throttled function. Subsequent calls to the throttled function return the
-	 * result of the last `func` invocation.
-	 *
-	 * **Note:** If `leading` and `trailing` options are `true`, `func` is
-	 * invoked on the trailing edge of the timeout only if the throttled function
-	 * is invoked more than once during the `wait` timeout.
-	 *
-	 * If `wait` is `0` and `leading` is `false`, `func` invocation is deferred
-	 * until to the next tick, similar to `setTimeout` with a timeout of `0`.
-	 *
-	 * See [David Corbacho's article](https://css-tricks.com/debouncing-throttling-explained-examples/)
-	 * for details over the differences between `_.throttle` and `_.debounce`.
-	 *
-	 * @static
-	 * @memberOf _
-	 * @since 0.1.0
-	 * @category Function
-	 * @param {Function} func The function to throttle.
-	 * @param {number} [wait=0] The number of milliseconds to throttle invocations to.
-	 * @param {Object} [options={}] The options object.
-	 * @param {boolean} [options.leading=true]
-	 *  Specify invoking on the leading edge of the timeout.
-	 * @param {boolean} [options.trailing=true]
-	 *  Specify invoking on the trailing edge of the timeout.
-	 * @returns {Function} Returns the new throttled function.
-	 * @example
-	 *
-	 * // Avoid excessively updating the position while scrolling.
-	 * jQuery(window).on('scroll', _.throttle(updatePosition, 100));
-	 *
-	 * // Invoke `renewToken` when the click event is fired, but not more than once every 5 minutes.
-	 * var throttled = _.throttle(renewToken, 300000, { 'trailing': false });
-	 * jQuery(element).on('click', throttled);
-	 *
-	 * // Cancel the trailing throttled invocation.
-	 * jQuery(window).on('popstate', throttled.cancel);
-	 */
-	function throttle(func, wait, options) {
-	  var leading = true,
-	      trailing = true;
-
-	  if (typeof func != 'function') {
-	    throw new TypeError(FUNC_ERROR_TEXT);
-	  }
-	  if (isObject(options)) {
-	    leading = 'leading' in options ? !!options.leading : leading;
-	    trailing = 'trailing' in options ? !!options.trailing : trailing;
-	  }
-	  return debounce(func, wait, {
-	    'leading': leading,
-	    'maxWait': wait,
-	    'trailing': trailing
-	  });
-	}
-
-	throttle_1 = throttle;
-	return throttle_1;
-}
-
-var throttleExports = requireThrottle();
-var throttle = /*@__PURE__*/getDefaultExportFromCjs(throttleExports);
-
-class MasonryLayout {
-    constructor(grid) {
-        this.grid = grid;
-        this.create = () => {
-            this.mutationObserver.observe(this.grid, {
-                childList: true,
-            });
-            for (const item of Array.from(this.grid.children)) {
-                this.resizeObserver.observe(item);
-            }
-        };
-        this.onContainerMutation = (mutations) => {
-            const removedNodes = mutations.flatMap((mutation) => Array.from(mutation.removedNodes));
-            const addedNodes = mutations.flatMap((mutation) => Array.from(mutation.addedNodes));
-            for (const node of removedNodes) {
-                if (node instanceof Element) {
-                    this.resizeObserver.unobserve(node);
-                }
-            }
-            for (const node of addedNodes) {
-                if (node instanceof Element) {
-                    this.resizeObserver.observe(node);
-                }
-            }
-            if (removedNodes.length > 0 && addedNodes.length === 0) {
-                this.update();
-            }
-        };
-        this.onChildrenResize = (entries) => {
-            const entriesToUpdate = entries.filter((entry) => entry.target.parentElement !== null);
-            if (entriesToUpdate.length > 0) {
-                this.update();
-            }
-        };
-        this.update = throttle(() => {
-            const computedStyle = window.getComputedStyle(this.grid);
-            if (computedStyle.getPropertyValue("display").includes("grid") === false) {
-                this.clean();
-                return;
-            }
-            const columns = parseGridTemplateColumns(this.grid);
-            if (columns.length <= 1) {
-                this.clean();
-                return;
-            }
-            const rowGap = Number.parseFloat(computedStyle.getPropertyValue("row-gap").trim()) || 0;
-            const items = Array.from(this.grid.children);
-            for (let columnIndex = 0; columnIndex < columns.length; columnIndex++) {
-                const firstItemInColumn = items[columnIndex];
-                firstItemInColumn?.style.removeProperty("margin-top");
-            }
-            for (let index = 0; index < items.length; index++) {
-                const prevItem = items[index - columns.length];
-                const nextItem = items[index];
-                if (prevItem !== undefined && nextItem !== undefined) {
-                    const prevBottom = prevItem.getBoundingClientRect().bottom;
-                    nextItem.style.removeProperty("margin-top");
-                    const nextTop = nextItem.getBoundingClientRect().top;
-                    if (nextTop - rowGap !== prevBottom) {
-                        const margin = Math.round((prevBottom - (nextTop - rowGap) + Number.EPSILON) * 100) / 100;
-                        nextItem.style.setProperty("margin-top", `${margin}px`);
-                    }
-                }
-            }
-        }, 32);
-        this.destroy = () => {
-            this.resizeObserver.disconnect();
-            this.mutationObserver.disconnect();
-            this.clean();
-        };
-        this.clean = () => {
-            for (const item of Array.from(this.grid.children)) {
-                item.style.removeProperty("margin-top");
-            }
-        };
-        this.mutationObserver = new MutationObserver(this.onContainerMutation);
-        this.resizeObserver = new ResizeObserver(this.onChildrenResize);
-        if (CSS.supports("grid-template-rows", "masonry") === false) {
-            this.create();
-        }
-    }
-    [Symbol.dispose]() {
-        this.destroy();
-    }
-}
-function parseGridTemplateColumns(grid) {
-    const computedStyle = window.getComputedStyle(grid);
-    const gridTemplateColumns = computedStyle.getPropertyValue("grid-template-columns");
-    return gridTemplateColumns
-        .trim()
-        .split(/\s+(?=(?:[^()]*\([^()]*\))*[^()]*$)/);
-}
-
-const sallaReviewsPageCss = ":host{display:block}";
-
-const SallaReviewsPage$1 = /*@__PURE__*/ proxyCustomElement(class SallaReviewsPage extends HTMLElement {
-    constructor() {
-        super();
-        this.__registerHost();
-        this.reviews = [];
-        this.isLoading = false;
-        this.pagination = null;
-        this.sort = "latest";
-    }
-    getUrlParams() {
-        const params = new URLSearchParams(window.location.search);
-        return {
-            sort: params.get('sort') || null,
-            page: Number.parseInt(params.get('page')) || 1
-        };
-    }
-    updateUrlParams(params) {
-        const url = new URL(window.location.href);
-        for (const [key, value] of Object.entries(params)) {
-            if (value) {
-                url.searchParams.set(key, value.toString());
-            }
-            else {
-                url.searchParams.delete(key);
-            }
-        }
-        window.history.replaceState({}, '', url.toString());
-    }
-    fetchReviews(sort, page) {
-        const urlParams = this.getUrlParams();
-        return salla.api.request('reviews', {
-            params: {
-                type: 'products',
-                format: 'lite',
-                per_page: 8,
-                page: page || urlParams.page || 1,
-                sort: sort || urlParams.sort || null
-            }
-        });
-    }
-    async initializeMasonry() {
-        const grid = this.el.querySelector('.s-reviews-page-grid');
-        if (!grid)
-            return;
-        try {
-            new MasonryLayout(grid);
-            salla.logger.info('Masonry initialized successfully');
-        }
-        catch (error) {
-            salla.logger.error('Masonry initialization failed:', error);
-        }
-    }
-    animateReviewCards() {
-        const items = this.wrapper.querySelectorAll('salla-review-card:not(.animated)');
-        Helper.animateItems(items);
-    }
-    initiateInfiniteScroll() {
-        if (!this.wrapper) {
-            salla.logger.error('Wrapper is undefined. Cannot initiate infinite scroll.');
-            return;
-        }
-        this.infiniteScroll = salla.infiniteScroll.initiate(this.wrapper, this.wrapper, {
-            path: () => this.pagination?.links?.next || null,
-            history: false,
-            scrollThreshold: false,
-        }, true);
-        this.infiniteScroll?.on('request', () => {
-            this.isLoading = true;
-        });
-        this.infiniteScroll?.on('load', response => {
-            this.pagination = response.pagination;
-            this.reviews = [...this.reviews, ...response.data];
-            this.isLoading = false;
-            // Update URL with the current page
-            this.updateUrlParams({ page: response.pagination.current_page });
-        });
-        this.infiniteScroll?.on('error', (e) => {
-            salla.logger.error('Error loading more reviews:', e);
-            this.isLoading = false;
-        });
-    }
-    componentDidRender() {
-        setTimeout(() => {
-            requestAnimationFrame(this.animateReviewCards.bind(this));
-        }, 176);
-    }
-    async componentWillLoad() {
-        try {
-            await salla.onReady();
-            // Initialize language variables
-            this.langTitlesReviews = salla.lang.get("common.titles.reviews");
-            this.langSorting = salla.lang.get('pages.categories.sorting');
-            this.placeholderText = salla.lang.choice("pages.rating.reviews", 0);
-            this.langLoadMore = salla.lang.get('common.elements.load_more');
-            this.langSortByTopRating = salla.lang.get('pages.testimonials.sort_by_rating_desc');
-            this.langSortByMostRecent = salla.lang.get('pages.testimonials.sort_by_date_desc');
-            this.langSortByLeastRated = salla.lang.get('pages.testimonials.sort_by_rating_asc');
-            this.langSortByLeastRecent = salla.lang.get('pages.testimonials.sort_by_date_asc');
-            const urlParams = this.getUrlParams();
-            const response = await this.fetchReviews(urlParams.sort);
-            this.sort = urlParams.sort;
-            this.reviews = response.data;
-            this.pagination = response.pagination;
-            this.langRatingReviews = salla.lang.choice("pages.rating.reviews", this.pagination?.total);
-        }
-        catch (error) {
-            salla.logger.error('Error loading reviews:', error);
-        }
-    }
-    async handleSorting(e) {
-        const value = e.target.value;
-        this.sort = value;
-        this.updateUrlParams({ sort: value, page: 1 }); // Reset to page 1 when changing sort
-        const response = await this.fetchReviews(value, 1);
-        this.reviews = response.data;
-        this.pagination = response.pagination;
-    }
-    async componentDidLoad() {
-        await this.initializeMasonry();
-        this.initiateInfiniteScroll();
-        this.sort = this.getUrlParams().sort || "latest";
-        this.updateUrlParams({ sort: this.sort, page: 1 });
-    }
-    disconnectedCallback() {
-        if (this.infiniteScroll) {
-            this.infiniteScroll.destroy();
-        }
-    }
-    renderSortingOptions() {
-        const options = [
-            { value: 'latest', label: this.langSortByMostRecent },
-            { value: 'oldest', label: this.langSortByLeastRecent },
-            { value: 'top_rating', label: this.langSortByTopRating },
-            { value: 'bottom_rating', label: this.langSortByLeastRated },
-        ];
-        return options.map(option => (h("option", { key: option.value, value: option.value, selected: option.value === this.sort }, option.label)));
-    }
-    render() {
-        return (h("host", { key: '9e93c876f4cf9d49748bc219cd81c871ddfcb9ba' }, h("div", { key: '322e9487de2da90e78ef96eaf126c5ab9839255f', class: "s-reviews-page-header-wrapper" }, h("h2", { key: '7f2cc0885d83123bd1a2c0e7d795a7e61987b4a7', class: "s-reviews-page-title" }, this.langTitlesReviews, h("span", { key: 'e61048238b21b6645f4799ae1dcd5f9e6d660088', class: "s-reviews-page-count" }, "(", this.langRatingReviews, ")")), h("div", { key: 'ce8a0de87512c023f623604c0b486ea4f37ac8ab', class: "s-reviews-page-filter-wrapper" }, h("label", { key: '35bcbffd914e811ebf73253d93e7b972f3b56cbc', class: "s-reviews-page-filter-label", htmlFor: "testimonials-filter" }, this.langSorting), h("select", { key: 'e57ea01b2aba04e82c63e51edf952e5c6ee460e6', onChange: (e) => this.handleSorting(e), disabled: !this.reviews.length, class: "s-reviews-page-filter" }, this.renderSortingOptions()))), this.reviews.length ? h("main", { class: "s-reviews-page-grid", ref: el => {
-                this.wrapper = el;
-            } }, this.reviews.map(review => (h("salla-review-card", { key: review.id, review: review }))))
-            : h("div", { class: "s-products-list-placeholder" }, h("span", { innerHTML: ShoppingBag }), h("p", null, this.placeholderText)), this.pagination?.links?.next && this.reviews.length ? (h("div", { class: "s-reviews-page-load-more-container" }, h("salla-button", { class: "s-reviews-page-load-more-btn", loading: this.isLoading, onClick: () => this.infiniteScroll?.loadNextPage(), onKeyUp: () => this.infiniteScroll?.loadNextPage() }, this.langLoadMore))) : null));
-    }
-    get el() { return this; }
-    static get style() { return sallaReviewsPageCss; }
-}, [0, "salla-reviews-page", {
-        "reviews": [32],
-        "isLoading": [32],
-        "pagination": [32],
-        "sort": [32]
-    }]);
-function defineCustomElement$1() {
-    if (typeof customElements === "undefined") {
-        return;
-    }
-    const components = ["salla-reviews-page", "salla-button", "salla-review-card"];
-    components.forEach(tagName => { switch (tagName) {
-        case "salla-reviews-page":
-            if (!customElements.get(tagName)) {
-                customElements.define(tagName, SallaReviewsPage$1);
-            }
-            break;
-        case "salla-button":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$3();
-            }
-            break;
-        case "salla-review-card":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$2();
-            }
-            break;
-    } });
-}
-defineCustomElement$1();
-
-const SallaReviewsPage = SallaReviewsPage$1;
-const defineCustomElement = defineCustomElement$1;
-
-export { SallaReviewsPage, defineCustomElement };
+import{transformTag as t,proxyCustomElement as s,HTMLElement as e,h as i}from"@stencil/core/internal/client";import{S as a}from"./shopping-bag.js";import{H as r}from"./Helper.js";import{g as n}from"./_commonjsHelpers.js";import{c as o,b as l,r as c}from"./isObject.js";import{d as h}from"./salla-button2.js";import{d as u}from"./salla-review-card2.js";var f,d,p,m,v,g,w,b,y,_,k,E;function T(){if(_)return y;_=1;var t=l(),s=function(){if(d)return f;d=1;var t=o();return f=function(){return t.Date.now()}}(),e=function(){if(b)return w;b=1;var t=function(){if(g)return v;g=1;var t=function(){if(m)return p;m=1;var t=/\s/;return p=function(s){for(var e=s.length;e--&&t.test(s.charAt(e)););return e}}(),s=/^\s+/;return v=function(e){return e?e.slice(0,t(e)+1).replace(s,""):e}}(),s=l(),e=c(),i=/^[-+]0x[0-9a-f]+$/i,a=/^0b[01]+$/i,r=/^0o[0-7]+$/i,n=parseInt;return w=function(o){if("number"==typeof o)return o;if(e(o))return NaN;if(s(o)){var l="function"==typeof o.valueOf?o.valueOf():o;o=s(l)?l+"":l}if("string"!=typeof o)return 0===o?o:+o;o=t(o);var c=a.test(o);return c||r.test(o)?n(o.slice(2),c?2:8):i.test(o)?NaN:+o}}(),i=Math.max,a=Math.min;return y=function(r,n,o){var l,c,h,u,f,d,p=0,m=!1,v=!1,g=!0;if("function"!=typeof r)throw new TypeError("Expected a function");function w(t){var s=l,e=c;return l=c=void 0,p=t,u=r.apply(e,s)}function b(t){var s=t-d;return void 0===d||s>=n||s<0||v&&t-p>=h}function y(){var t=s();if(b(t))return _(t);f=setTimeout(y,function(t){var s=n-(t-d);return v?a(s,h-(t-p)):s}(t))}function _(t){return f=void 0,g&&l?w(t):(l=c=void 0,u)}function k(){var t=s(),e=b(t);if(l=arguments,c=this,d=t,e){if(void 0===f)return function(t){return p=t,f=setTimeout(y,n),m?w(t):u}(d);if(v)return clearTimeout(f),f=setTimeout(y,n),w(d)}return void 0===f&&(f=setTimeout(y,n)),u}return n=e(n)||0,t(o)&&(m=!!o.leading,h=(v="maxWait"in o)?i(e(o.maxWait)||0,n):h,g="trailing"in o?!!o.trailing:g),k.cancel=function(){void 0!==f&&clearTimeout(f),p=0,l=d=c=f=void 0},k.flush=function(){return void 0===f?u:_(s())},k},y}var j=n(function(){if(E)return k;E=1;var t=T(),s=l();return k=function(e,i,a){var r=!0,n=!0;if("function"!=typeof e)throw new TypeError("Expected a function");return s(a)&&(r="leading"in a?!!a.leading:r,n="trailing"in a?!!a.trailing:n),t(e,i,{leading:r,maxWait:i,trailing:n})}}());class x{constructor(t){this.grid=t,this.create=()=>{this.mutationObserver.observe(this.grid,{childList:!0});for(const t of Array.from(this.grid.children))this.resizeObserver.observe(t)},this.onContainerMutation=t=>{const s=t.flatMap((t=>Array.from(t.removedNodes))),e=t.flatMap((t=>Array.from(t.addedNodes)));for(const t of s)t instanceof Element&&this.resizeObserver.unobserve(t);for(const t of e)t instanceof Element&&this.resizeObserver.observe(t);s.length>0&&0===e.length&&this.update()},this.onChildrenResize=t=>{t.filter((t=>null!==t.target.parentElement)).length>0&&this.update()},this.update=j((()=>{const t=window.getComputedStyle(this.grid);if(!1===t.getPropertyValue("display").includes("grid"))return void this.clean();const s=function(t){return window.getComputedStyle(t).getPropertyValue("grid-template-columns").trim().split(/\s+(?=(?:[^()]*\([^()]*\))*[^()]*$)/)}(this.grid);if(s.length<=1)return void this.clean();const e=Number.parseFloat(t.getPropertyValue("row-gap").trim())||0,i=Array.from(this.grid.children);for(let t=0;t<s.length;t++){const s=i[t];s?.style.removeProperty("margin-top")}for(let t=0;t<i.length;t++){const a=i[t-s.length],r=i[t];if(void 0!==a&&void 0!==r){const t=a.getBoundingClientRect().bottom;r.style.removeProperty("margin-top");const s=r.getBoundingClientRect().top;s-e!==t&&r.style.setProperty("margin-top",Math.round(100*(t-(s-e)+Number.EPSILON))/100+"px")}}}),32),this.destroy=()=>{this.resizeObserver.disconnect(),this.mutationObserver.disconnect(),this.clean()},this.clean=()=>{for(const t of Array.from(this.grid.children))t.style.removeProperty("margin-top")},this.mutationObserver=new MutationObserver(this.onContainerMutation),this.resizeObserver=new ResizeObserver(this.onChildrenResize),!1===CSS.supports("grid-template-rows","masonry")&&this.create()}[Symbol.dispose](){this.destroy()}}const M=s(class extends e{constructor(t){super(),!1!==t&&this.__registerHost(),this.reviews=[],this.isLoading=!1,this.pagination=null,this.sort="latest"}getUrlParams(){const t=new URLSearchParams(window.location.search);return{sort:t.get("sort")||null,page:Number.parseInt(t.get("page"))||1}}updateUrlParams(t){const s=new URL(window.location.href);for(const[e,i]of Object.entries(t))i?s.searchParams.set(e,""+i):s.searchParams.delete(e);window.history.replaceState({},"",""+s)}fetchReviews(t,s){const e=this.getUrlParams();return salla.api.request("reviews",{params:{type:"products",format:"lite",per_page:8,page:s||e.page||1,sort:t||e.sort||null}})}async initializeMasonry(){const t=this.el.querySelector(".s-reviews-page-grid");if(t)try{new x(t),salla.logger.info("Masonry initialized successfully")}catch(t){salla.logger.error("Masonry initialization failed:",t)}}animateReviewCards(){const t=this.wrapper.querySelectorAll("salla-review-card:not(.animated)");r.animateItems(t)}initiateInfiniteScroll(){this.wrapper?(this.infiniteScroll=salla.infiniteScroll.initiate(this.wrapper,this.wrapper,{path:()=>this.pagination?.links?.next||null,history:!1,scrollThreshold:!1},!0),this.infiniteScroll?.on("request",(()=>{this.isLoading=!0})),this.infiniteScroll?.on("load",(t=>{this.pagination=t.pagination,this.reviews=[...this.reviews,...t.data],this.isLoading=!1,this.updateUrlParams({page:t.pagination.current_page})})),this.infiniteScroll?.on("error",(t=>{salla.logger.error("Error loading more reviews:",t),this.isLoading=!1}))):salla.logger.error("Wrapper is undefined. Cannot initiate infinite scroll.")}componentDidRender(){setTimeout((()=>{requestAnimationFrame(this.animateReviewCards.bind(this))}),176)}async componentWillLoad(){try{await salla.onReady(),this.langTitlesReviews=salla.lang.get("common.titles.reviews"),this.langSorting=salla.lang.get("pages.categories.sorting"),this.placeholderText=salla.lang.choice("pages.rating.reviews",0),this.langLoadMore=salla.lang.get("common.elements.load_more"),this.langSortByTopRating=salla.lang.get("pages.testimonials.sort_by_rating_desc"),this.langSortByMostRecent=salla.lang.get("pages.testimonials.sort_by_date_desc"),this.langSortByLeastRated=salla.lang.get("pages.testimonials.sort_by_rating_asc"),this.langSortByLeastRecent=salla.lang.get("pages.testimonials.sort_by_date_asc");const t=this.getUrlParams(),s=await this.fetchReviews(t.sort);this.sort=t.sort,this.reviews=s.data,this.pagination=s.pagination,this.langRatingReviews=salla.lang.choice("pages.rating.reviews",this.pagination?.total)}catch(t){salla.logger.error("Error loading reviews:",t)}}async handleSorting(t){const s=t.target.value;this.sort=s,this.updateUrlParams({sort:s,page:1});const e=await this.fetchReviews(s,1);this.reviews=e.data,this.pagination=e.pagination}async componentDidLoad(){await this.initializeMasonry(),this.initiateInfiniteScroll(),this.sort=this.getUrlParams().sort||"latest",this.updateUrlParams({sort:this.sort,page:1})}disconnectedCallback(){this.infiniteScroll&&this.infiniteScroll.destroy()}renderSortingOptions(){return[{value:"latest",label:this.langSortByMostRecent},{value:"oldest",label:this.langSortByLeastRecent},{value:"top_rating",label:this.langSortByTopRating},{value:"bottom_rating",label:this.langSortByLeastRated}].map((t=>i("option",{key:t.value,value:t.value,selected:t.value===this.sort},t.label)))}render(){return i("host",{key:"9e93c876f4cf9d49748bc219cd81c871ddfcb9ba"},i("div",{key:"322e9487de2da90e78ef96eaf126c5ab9839255f",class:"s-reviews-page-header-wrapper"},i("h2",{key:"7f2cc0885d83123bd1a2c0e7d795a7e61987b4a7",class:"s-reviews-page-title"},this.langTitlesReviews,i("span",{key:"e61048238b21b6645f4799ae1dcd5f9e6d660088",class:"s-reviews-page-count"},"(",this.langRatingReviews,")")),i("div",{key:"ce8a0de87512c023f623604c0b486ea4f37ac8ab",class:"s-reviews-page-filter-wrapper"},i("label",{key:"35bcbffd914e811ebf73253d93e7b972f3b56cbc",class:"s-reviews-page-filter-label",htmlFor:"testimonials-filter"},this.langSorting),i("select",{key:"e57ea01b2aba04e82c63e51edf952e5c6ee460e6",onChange:t=>this.handleSorting(t),disabled:!this.reviews.length,class:"s-reviews-page-filter"},this.renderSortingOptions()))),this.reviews.length?i("main",{class:"s-reviews-page-grid",ref:t=>{this.wrapper=t}},this.reviews.map((t=>i("salla-review-card",{key:t.id,review:t})))):i("div",{class:"s-products-list-placeholder"},i("span",{innerHTML:a}),i("p",null,this.placeholderText)),this.pagination?.links?.next&&this.reviews.length?i("div",{class:"s-reviews-page-load-more-container"},i("salla-button",{class:"s-reviews-page-load-more-btn",loading:this.isLoading,onClick:()=>this.infiniteScroll?.loadNextPage(),onKeyUp:()=>this.infiniteScroll?.loadNextPage()},this.langLoadMore)):null)}get el(){return this}static get style(){return":host{display:block}"}},[0,"salla-reviews-page",{reviews:[32],isLoading:[32],pagination:[32],sort:[32]}]);function S(){"undefined"!=typeof customElements&&["salla-reviews-page","salla-button","salla-review-card"].forEach((s=>{switch(s){case"salla-reviews-page":customElements.get(t(s))||customElements.define(t(s),M);break;case"salla-button":customElements.get(t(s))||h();break;case"salla-review-card":customElements.get(t(s))||u()}}))}S();const L=M,N=S;export{L as SallaReviewsPage,N as defineCustomElement}