@salla.sa/twilight-components 2.12.52 → 2.12.53

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (38) hide show
  1. package/dist/cjs/salla-products-list.cjs.entry.js +3 -0
  2. package/dist/cjs/salla-products-list.cjs.entry.js.map +1 -1
  3. package/dist/cjs/salla-products-slider.cjs.entry.js +3 -0
  4. package/dist/cjs/salla-products-slider.cjs.entry.js.map +1 -1
  5. package/dist/collection/components/salla-products-list/salla-products-list.js +3 -0
  6. package/dist/collection/components/salla-products-list/salla-products-list.js.map +1 -1
  7. package/dist/collection/components/salla-products-slider/salla-products-slider.js +3 -0
  8. package/dist/collection/components/salla-products-slider/salla-products-slider.js.map +1 -1
  9. package/dist/components/salla-products-list.js +3 -0
  10. package/dist/components/salla-products-list.js.map +1 -1
  11. package/dist/components/salla-products-slider.js +3 -0
  12. package/dist/components/salla-products-slider.js.map +1 -1
  13. package/dist/esm/salla-products-list.entry.js +3 -0
  14. package/dist/esm/salla-products-list.entry.js.map +1 -1
  15. package/dist/esm/salla-products-slider.entry.js +3 -0
  16. package/dist/esm/salla-products-slider.entry.js.map +1 -1
  17. package/dist/esm-es5/salla-products-list.entry.js +1 -1
  18. package/dist/esm-es5/salla-products-list.entry.js.map +1 -1
  19. package/dist/esm-es5/salla-products-slider.entry.js +1 -1
  20. package/dist/esm-es5/salla-products-slider.entry.js.map +1 -1
  21. package/dist/twilight/{p-5224c881.system.entry.js → p-2e5aae67.system.entry.js} +2 -2
  22. package/dist/twilight/p-2e5aae67.system.entry.js.map +1 -0
  23. package/dist/twilight/p-7afe6b27.system.js +1 -1
  24. package/dist/twilight/p-a8bf5cd5.entry.js +5 -0
  25. package/dist/twilight/p-a8bf5cd5.entry.js.map +1 -0
  26. package/dist/twilight/p-ae07183b.entry.js +5 -0
  27. package/dist/twilight/p-ae07183b.entry.js.map +1 -0
  28. package/dist/twilight/p-b8e71338.system.entry.js +5 -0
  29. package/dist/twilight/p-b8e71338.system.entry.js.map +1 -0
  30. package/dist/twilight/twilight.esm.js +1 -1
  31. package/package.json +2 -2
  32. package/dist/twilight/p-5224c881.system.entry.js.map +0 -1
  33. package/dist/twilight/p-7fda7b65.entry.js +0 -5
  34. package/dist/twilight/p-7fda7b65.entry.js.map +0 -1
  35. package/dist/twilight/p-dfe73459.entry.js +0 -5
  36. package/dist/twilight/p-dfe73459.entry.js.map +0 -1
  37. package/dist/twilight/p-e5148740.system.entry.js +0 -5
  38. package/dist/twilight/p-e5148740.system.entry.js.map +0 -1
@@ -1 +0,0 @@
1
- {"version":3,"names":["sallaProductsListCss","SallaProductsList","exports","class_1","prototype","connectedCallback","_this","this","salla","event","on","filters","setFilters","JSON","stringify","parsedFilters","window","scrollTo","top","behavior","reload","infiniteScroll","destroy","buildNextPageUrl","wrapper","innerHTML","init","isFilterable","config","get","filtersResults","isSourceWithoutValue","includes","getSource","animateItems","anime","targets","opacity","duration","translateY","delay","_el","i","createStatusDom","status","document","createElement","className","concat","lang","btnLoader","querySelector","onLoaded","placeholderText","initBaseNextPageUrl","source","nextPage","url","api","limit","sortBy","key","value","this_1","encodeURIComponent","Array","isArray","forEach","item","_j","_k","Object","entries","length","_l","k","v","_i","_g","_h","getSourceValue","join","e","logger","warn","sourceValueIsValid","loading","isLoading","style","display","getItemHTML","product","customComponentTag","hasCustomComponent","productCardComponent","productCard","applyLandingPageStyles","applyHorizontalCardStyles","toggleAttribute","classList","add","horizontalCards","setAttribute","Helper","getProductsSource","getProductsSourceValue","sourceValue","initiateInfiniteScroll","hasInfiniteScroll","host","insertAdjacentElement","initiate","path","history","scrollThreshold","_a","_b","response","data","pageIndex","showPlaceholder","appendItems","handleResponse","_c","remove","onReady","loadNextPage","componentWillLoad","onSallaReadyPromise","customElements","searchParams","URLSearchParams","location","search","parse","decodeURIComponent","message","isReady","setTimeout","map","append","fetchProducts","then","res","card","canRender","render","h","class","ShoppingBag","Host","ref","componentDidLoad","title","cursor","current","getPageTitleForSource","word","catId_1","category_id","_d","find","filter","values","cat","choice","_e","replace","emit","productsFetched","next","option","loadOnScroll","_f"],"sources":["src/components/salla-products-list/salla-products-list.scss?tag=salla-products-list","src/components/salla-products-list/salla-products-list.tsx"],"sourcesContent":["\n","import { Component, Host, h, Prop, State, Element, Method, Event, EventEmitter } from '@stencil/core';\nimport anime from 'animejs';\nimport ShoppingBag from '../../assets/svg/shopping-bag.svg';\nimport Helper from '../../Helpers/Helper';\n@Component({\n tag: 'salla-products-list',\n styleUrl: 'salla-products-list.scss'\n})\nexport class SallaProductsList {\n connectedCallback() {\n salla.event.on('salla-filters::changed', filters => this.setFilters(filters))\n }\n\n /**\n * Set parsed filters data from URI\n * @param filters\n */\n @Method()\n async setFilters(filters) {\n if (!!filters && JSON.stringify(this.parsedFilters) === JSON.stringify(filters)) {\n return;\n }\n window.scrollTo({ top: 0, behavior: 'smooth' });\n this.parsedFilters = filters;\n return this.reload();\n }\n\n /**\n * Reload the list of products (entire content of the component).\n */\n @Method()\n async reload() {\n salla.infiniteScroll.destroy(this.infiniteScroll);\n this.buildNextPageUrl();\n // TODO: this is problematic in testing, for the time being it's been resolved like this\n this.wrapper.innerHTML = '';\n this.init();\n }\n\n\n private status: HTMLDivElement;\n private btnLoader: HTMLAnchorElement;\n @Element() host: HTMLElement;\n private wrapper: any;\n private infiniteScroll: any;\n /**\n * The source of the products list\n * @type {string}\n * */\n @Prop({\n reflect: true,\n mutable: true\n }) source: 'categories' | 'latest' | 'related' | 'brands' | 'json' | 'search' | 'tags' | 'selected' | 'offers' | 'landing-page' | 'sales';\n\n /**\n * The source value, cloud be different values as following:\n * - array of ids when `source` in ['categories', 'brands', 'tags', 'selected']\n * - keyword when `source` = 'search'\n * - products payload when `source` = 'json'\n * - product_id when `source` = 'related'\n *\n * @type {string}\n * */\n @Prop({ mutable: true }) sourceValue: any;\n\n /**\n * Limit for number of products in the list.\n */\n @Prop({ mutable: true }) limit: number;\n\n /**\n * Sorting the list of products\n */\n @Prop({ mutable: true }) sortBy?: string | 'ourSuggest' | 'bestSell' | 'topRated' | 'priceFromTopToLow' | 'priceFromLowToTop';\n\n /**\n * should listen to filters events `salla-filters::changed` and re-render\n */\n @Prop({ reflect: true, mutable: true }) filtersResults: boolean;\n\n /**\n * Horizontal cards\n */\n @Prop({ reflect: true }) horizontalCards: boolean\n\n /**\n * Custom Card Component for the Salla Products List.\n *\n * This component allows you to customize the appearance of individual product cards within a Salla Products List.\n *\n * @example\n * <salla-products-list product-card-component=\"my-custom-card-style1\" ...\n * <salla-products-list product-card-component=\"my-custom-card-style2\" ...\n */\n @Prop() productCardComponent: string = 'custom-salla-product-card';\n\n // State\n @State() page: number = 1;\n @State() nextPage: string;\n @State() hasInfiniteScroll: boolean;\n @State() hasCustomComponent: boolean;\n @State() sourceValueIsValid: boolean;\n @State() placeholderText: string;\n @State() isReady: boolean;\n @State() showPlaceholder: boolean;\n @State() parsedFilters: any;\n\n /**\n * Custom event fired when the the products fetched.\n */\n @Event() productsFetched: EventEmitter;\n\n private isFilterable() {\n return salla.config.get('store.settings.product.filters') && this.filtersResults;\n }\n\n private isSourceWithoutValue() {\n return ['offers', 'latest', 'sales'].includes(this.getSource());\n }\n\n private animateItems() {\n anime({\n targets: 'salla-products-list salla-product-card',\n opacity: [0, 1],\n duration: 1200,\n translateY: [20, 0],\n delay: function (_el, i) {\n return i * 100;\n },\n })\n }\n\n private createStatusDom() {\n this.status = document.createElement('div');\n this.status.className = 's-infinite-scroll-wrapper';\n this.status.innerHTML = `<div class=\"s-infinite-scroll-status\">\n <p class=\"s-infinite-scroll-last infinite-scroll-last s-hidden\" >${salla.lang.get('common.elements.end_of_content')}</p>\n <p class=\"s-infinite-scroll-error infinite-scroll-error s-hidden\">${salla.lang.get('common.elements.failed_to_load_more')}</p>\n </div>\n <a href=\"#\" class=\"s-infinite-scroll-btn s-button-btn\">\n <span class=\"s-button-loader s-button-loader-center s-infinite-scroll-btn-loader\" style=\"display: none\"></span>\n </a>`;\n this.btnLoader = this.status.querySelector('.s-button-loader');\n salla.lang.onLoaded(() => {\n this.status.querySelector('.s-infinite-scroll-last').innerHTML = salla.lang.get('common.elements.end_of_content');\n this.status.querySelector('.s-infinite-scroll-error').innerHTML = salla.lang.get('common.elements.failed_to_load_more');\n this.placeholderText = salla.lang.get('pages.categories.no_products');\n });\n }\n\n private initBaseNextPageUrl(source: string) {\n\n this.nextPage = salla.url.api(`products?source=${source}`);\n\n if (this.limit) {\n this.nextPage += `&per_page=${this.limit > 32 ? 32 : this.limit}`;\n }\n if (this.sortBy) {\n this.nextPage += `&sort=${this.sortBy}`;\n }\n // if (!this.isFilterable()) {\n // return this.nextPage;\n // }\n this.nextPage += '&filterable=1';\n for (const [key, value] of Object.entries(this.parsedFilters || {})) {\n if ([\"string\", \"number\"].includes(typeof value)) {\n // @ts-ignore\n this.nextPage += `&filters[${encodeURIComponent(key)}]=${encodeURIComponent(value)}`;\n } else if (Array.isArray(value)) {\n value.forEach(item => this.nextPage += `&filters[${encodeURIComponent(key)}][]=${encodeURIComponent(item)}`);\n } else if (typeof value === 'object') {\n for (const [k, v] of Object.entries(value)) {\n this.nextPage += `&filters[${encodeURIComponent(key)}][${encodeURIComponent(k)}]=${encodeURIComponent(v)}`;\n }\n }\n }\n }\n\n private buildNextPageUrl() {\n let source = this.getSource();\n if (source === 'json') {\n return;\n }\n this.initBaseNextPageUrl(source);\n if (this.isSourceWithoutValue()) {\n return;\n }\n\n if (['search', 'related', 'landing-page'].includes(source)) {\n this.nextPage += `&source_value=${this.getSourceValue()}`;\n return;\n }\n\n try {\n this.nextPage += `&source_value[]=${this.getSourceValue().join('&source_value[]=')}`;\n } catch (e) {\n salla.logger.warn(`source-value prop should be array of ids ex source-value=\"[1,2,3]\" for the source [${source}]`);\n this.sourceValueIsValid = false;\n }\n }\n\n\n private loading(isLoading = true) {\n this.btnLoader.style.display = isLoading ? 'inherit' : 'none';\n }\n\n private getItemHTML(product) {\n const customComponentTag = this.hasCustomComponent ? this.productCardComponent : 'salla-product-card';\n const productCard = document.createElement(customComponentTag) as HTMLSallaProductCardElement;\n productCard.product = product;\n\n this.applyLandingPageStyles(productCard);\n this.applyHorizontalCardStyles(productCard);\n\n return productCard;\n }\n\n private applyLandingPageStyles(productCard) {\n if (this.getSource() === 'landing-page' && !this.hasCustomComponent) {\n productCard.toggleAttribute('hide-add-btn', true);\n productCard.classList.add('s-product-card-fit-height');\n }\n }\n\n private applyHorizontalCardStyles(productCard) {\n if (!this.horizontalCards) {\n return;\n }\n productCard.setAttribute('horizontal', true);\n if (!this.hasCustomComponent) {\n productCard.setAttribute('shadow-on-hover', true);\n }\n\n }\n\n private getSource() {\n return Helper.getProductsSource(this.source);\n }\n\n private getSourceValue() {\n return Helper.getProductsSourceValue(this.source, this.sourceValue);\n }\n\n private initiateInfiniteScroll() {\n if (!this.hasInfiniteScroll) {\n return;\n }\n\n this.host.insertAdjacentElement('beforeend', this.status);\n this.infiniteScroll = salla.infiniteScroll.initiate(this.wrapper, this.wrapper, {\n path: () => this.nextPage,\n history: false,\n nextPage: this.nextPage,\n scrollThreshold: 100,\n }, /* infinite via api*/true);\n this.infiniteScroll?.on('request', () => this.loading())\n this.infiniteScroll?.on('load', response => {\n if (!response.data?.length && this.infiniteScroll.pageIndex == 2) {\n this.showPlaceholder = true;\n salla.infiniteScroll.destroy(this.infiniteScroll);\n this.loading(false);\n return;\n } else {\n this.showPlaceholder = false;\n\n }\n this.infiniteScroll.appendItems(this.handleResponse(response))\n if (this.infiniteScroll.pageIndex == 2) {\n this.animateItems();\n }\n })\n this.infiniteScroll?.on('error', () => {\n this.status.querySelector('.s-infinite-scroll-error').classList.remove('s-hidden')\n this.loading(false);\n });\n salla.onReady(() => salla.infiniteScroll.loadNextPage(this.infiniteScroll))\n }\n\n componentWillLoad() {\n return Helper.onSallaReadyPromise( () => {\n this.hasCustomComponent = !!customElements.get(this.productCardComponent);\n this.sourceValueIsValid = !!(this.getSourceValue() || this.isSourceWithoutValue());\n this.hasInfiniteScroll = !['json', 'selected', 'related', 'landing-page'].includes(this.getSource()) && !this.limit;\n try {\n let searchParams = new URLSearchParams(window.location.search);\n this.sortBy = this.sortBy || searchParams.get('sort') || searchParams.get('by');\n let filters = searchParams.get('filters')\n this.parsedFilters = filters ? JSON.parse(decodeURIComponent(filters)) : {};\n } catch (e) {\n salla.logger.warn('failed to get filters from url', e.message);\n }\n this.buildNextPageUrl();\n this.createStatusDom();\n\n this.isReady = true;\n\n if (!this.sourceValueIsValid) {\n salla.logger.warn(`source-value prop is required for source [${this.getSource()}]`);\n return;\n }\n if (this.hasInfiniteScroll) {\n return;\n }\n\n // Handle json source\n if (this.getSource() === 'json') {\n if (!this.getSourceValue().length) {\n this.showPlaceholder = true;\n return;\n }\n setTimeout(() => {\n this.getSourceValue().map(product => this.wrapper.append(this.getItemHTML(product)));\n });\n return;\n }\n\n // Handle selected source\n if (this.getSource() === 'selected' && !this.getSourceValue().length) {\n this.showPlaceholder = true;\n return;\n }\n\n return Helper.fetchProducts(this.getSource(), this.getSourceValue(), this.limit).then(res => {\n if (!res.data.length) {\n this.showPlaceholder = true;\n this.loading(false);\n return;\n }\n setTimeout(() => {\n this.handleResponse(res).forEach(card => this.wrapper.append(card));\n }, 100);\n });\n });\n }\n\n\n\n private canRender() {\n return this.sourceValueIsValid && this.isReady;\n }\n\n render() {\n if (!this.canRender()) {\n return '';\n }\n\n if (this.showPlaceholder) {\n return <div class=\"s-products-list-placeholder\">\n <span innerHTML={ShoppingBag} />\n <p>{this.placeholderText}</p>\n </div>;\n }\n return (\n <Host class=\"s-products-list\">\n <div class={{\n \"s-products-list-wrapper\": true,\n 's-products-list-horizontal-cards': this.horizontalCards && !this.filtersResults,\n 's-products-list-vertical-cards': !this.horizontalCards && !this.filtersResults,\n 's-products-list-filters-results': this.filtersResults,\n }}\n ref={wrapper => this.wrapper = wrapper} />\n </Host>\n );\n }\n\n componentDidLoad() {\n this.hasInfiniteScroll && this.init();\n }\n\n private init() {\n this.initiateInfiniteScroll();\n this.loading();\n }\n\n private handleResponse(response): Array<HTMLElement> {\n let source=this.getSource();\n let title = '';\n //help the developer to know the current page title\n if (response.cursor?.current === 1) {\n title = Helper.getPageTitleForSource(source);\n try {\n if (this.getSource() === 'search') {\n title = salla.lang.get('common.elements.search_about', {'word': this.getSourceValue()});\n } else if (!title) {\n let catId = this.parsedFilters.category_id || this.getSourceValue()[0];\n // get the first filter that its key is category_id, then get the value when filter.value.*.key==catId\n title = response.filters.find(filter => filter.key == 'category_id') ?. values ?. find(cat => cat.key == catId) ?. value || '';\n }\n title += (title ? ' - ' : '') + salla.lang.choice('blocks.header.products_count', response.data ?. length);\n if (response.data.length === 15) {\n title = title.replace(response.data.length, salla.lang.get('common.elements.more_than') + ' ' + response.data.length)\n }\n response.title = title;\n } catch (e) {}\n }\n\n salla.event.emit('salla-products-list::products.fetched', response);\n this.productsFetched.emit(response);\n //💡 when source is related, cursor will not be existed\n if (response.filters && this.isFilterable()) {\n this.filtersResults = true;\n salla.event.emit('filters::fetched', { filters: response.filters });\n } else if (this.isFilterable()) {\n salla.event.emit('filters::hidden');\n }\n this.nextPage = response.cursor ? response.cursor.next : this.nextPage;\n this.loading(false);\n if (this.hasInfiniteScroll && !this.nextPage) {\n this.infiniteScroll.option({ scrollThreshold: false, loadOnScroll: false });\n this.status.querySelector('.s-infinite-scroll-last').classList.remove('s-hidden');\n }\n return response.data?.map(product => this.getItemHTML(product)) || [];\n }\n}\n"],"mappings":"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"}
@@ -1,5 +0,0 @@
1
- /*!
2
- * Crafted with ❤ by Salla
3
- */
4
- import{r as t,c as s,h as i,H as e,g as r}from"./p-dd9b5ccb.js";import{a as l}from"./p-5a803ecc.js";import{H as n}from"./p-b9de0451.js";const o=`\x3c!-- Generated by IcoMoon.io --\x3e\n<svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32">\n<title>shopping-bag</title>\n<path d="M28 10.667h-4v-2.667c0-4.412-3.588-8-8-8s-8 3.588-8 8v2.667h-4c-0.736 0-1.333 0.596-1.333 1.333v13.333c0 3.676 2.991 6.667 6.667 6.667h13.333c3.676 0 6.667-2.991 6.667-6.667v-13.333c0-0.737-0.597-1.333-1.333-1.333zM10.667 8c0-2.941 2.392-5.333 5.333-5.333s5.333 2.392 5.333 5.333v2.667h-10.667zM26.667 25.333c0 2.205-1.795 4-4 4h-13.333c-2.205 0-4-1.795-4-4v-12h2.667v2.667c0 0.737 0.597 1.333 1.333 1.333s1.333-0.596 1.333-1.333v-2.667h10.667v2.667c0 0.737 0.597 1.333 1.333 1.333s1.333-0.596 1.333-1.333v-2.667h2.667z"></path>\n</svg>\n`;const h="";const a=class{constructor(i){t(this,i);this.productsFetched=s(this,"productsFetched",7);this.source=undefined;this.sourceValue=undefined;this.limit=undefined;this.sortBy=undefined;this.filtersResults=undefined;this.horizontalCards=undefined;this.productCardComponent="custom-salla-product-card";this.page=1;this.nextPage=undefined;this.hasInfiniteScroll=undefined;this.hasCustomComponent=undefined;this.sourceValueIsValid=undefined;this.placeholderText=undefined;this.isReady=undefined;this.showPlaceholder=undefined;this.parsedFilters=undefined}connectedCallback(){salla.event.on("salla-filters::changed",(t=>this.setFilters(t)))}async setFilters(t){if(!!t&&JSON.stringify(this.parsedFilters)===JSON.stringify(t)){return}window.scrollTo({top:0,behavior:"smooth"});this.parsedFilters=t;return this.reload()}async reload(){salla.infiniteScroll.destroy(this.infiniteScroll);this.buildNextPageUrl();this.wrapper.innerHTML="";this.init()}isFilterable(){return salla.config.get("store.settings.product.filters")&&this.filtersResults}isSourceWithoutValue(){return["offers","latest","sales"].includes(this.getSource())}animateItems(){l({targets:"salla-products-list salla-product-card",opacity:[0,1],duration:1200,translateY:[20,0],delay:function(t,s){return s*100}})}createStatusDom(){this.status=document.createElement("div");this.status.className="s-infinite-scroll-wrapper";this.status.innerHTML=`<div class="s-infinite-scroll-status">\n <p class="s-infinite-scroll-last infinite-scroll-last s-hidden" >${salla.lang.get("common.elements.end_of_content")}</p>\n <p class="s-infinite-scroll-error infinite-scroll-error s-hidden">${salla.lang.get("common.elements.failed_to_load_more")}</p>\n </div>\n <a href="#" class="s-infinite-scroll-btn s-button-btn">\n <span class="s-button-loader s-button-loader-center s-infinite-scroll-btn-loader" style="display: none"></span>\n </a>`;this.btnLoader=this.status.querySelector(".s-button-loader");salla.lang.onLoaded((()=>{this.status.querySelector(".s-infinite-scroll-last").innerHTML=salla.lang.get("common.elements.end_of_content");this.status.querySelector(".s-infinite-scroll-error").innerHTML=salla.lang.get("common.elements.failed_to_load_more");this.placeholderText=salla.lang.get("pages.categories.no_products")}))}initBaseNextPageUrl(t){this.nextPage=salla.url.api(`products?source=${t}`);if(this.limit){this.nextPage+=`&per_page=${this.limit>32?32:this.limit}`}if(this.sortBy){this.nextPage+=`&sort=${this.sortBy}`}this.nextPage+="&filterable=1";for(const[t,s]of Object.entries(this.parsedFilters||{})){if(["string","number"].includes(typeof s)){this.nextPage+=`&filters[${encodeURIComponent(t)}]=${encodeURIComponent(s)}`}else if(Array.isArray(s)){s.forEach((s=>this.nextPage+=`&filters[${encodeURIComponent(t)}][]=${encodeURIComponent(s)}`))}else if(typeof s==="object"){for(const[i,e]of Object.entries(s)){this.nextPage+=`&filters[${encodeURIComponent(t)}][${encodeURIComponent(i)}]=${encodeURIComponent(e)}`}}}}buildNextPageUrl(){let t=this.getSource();if(t==="json"){return}this.initBaseNextPageUrl(t);if(this.isSourceWithoutValue()){return}if(["search","related","landing-page"].includes(t)){this.nextPage+=`&source_value=${this.getSourceValue()}`;return}try{this.nextPage+=`&source_value[]=${this.getSourceValue().join("&source_value[]=")}`}catch(s){salla.logger.warn(`source-value prop should be array of ids ex source-value="[1,2,3]" for the source [${t}]`);this.sourceValueIsValid=false}}loading(t=true){this.btnLoader.style.display=t?"inherit":"none"}getItemHTML(t){const s=this.hasCustomComponent?this.productCardComponent:"salla-product-card";const i=document.createElement(s);i.product=t;this.applyLandingPageStyles(i);this.applyHorizontalCardStyles(i);return i}applyLandingPageStyles(t){if(this.getSource()==="landing-page"&&!this.hasCustomComponent){t.toggleAttribute("hide-add-btn",true);t.classList.add("s-product-card-fit-height")}}applyHorizontalCardStyles(t){if(!this.horizontalCards){return}t.setAttribute("horizontal",true);if(!this.hasCustomComponent){t.setAttribute("shadow-on-hover",true)}}getSource(){return n.getProductsSource(this.source)}getSourceValue(){return n.getProductsSourceValue(this.source,this.sourceValue)}initiateInfiniteScroll(){var t,s,i;if(!this.hasInfiniteScroll){return}this.host.insertAdjacentElement("beforeend",this.status);this.infiniteScroll=salla.infiniteScroll.initiate(this.wrapper,this.wrapper,{path:()=>this.nextPage,history:false,nextPage:this.nextPage,scrollThreshold:100},true);(t=this.infiniteScroll)===null||t===void 0?void 0:t.on("request",(()=>this.loading()));(s=this.infiniteScroll)===null||s===void 0?void 0:s.on("load",(t=>{var s;if(!((s=t.data)===null||s===void 0?void 0:s.length)&&this.infiniteScroll.pageIndex==2){this.showPlaceholder=true;salla.infiniteScroll.destroy(this.infiniteScroll);this.loading(false);return}else{this.showPlaceholder=false}this.infiniteScroll.appendItems(this.handleResponse(t));if(this.infiniteScroll.pageIndex==2){this.animateItems()}}));(i=this.infiniteScroll)===null||i===void 0?void 0:i.on("error",(()=>{this.status.querySelector(".s-infinite-scroll-error").classList.remove("s-hidden");this.loading(false)}));salla.onReady((()=>salla.infiniteScroll.loadNextPage(this.infiniteScroll)))}componentWillLoad(){return n.onSallaReadyPromise((()=>{this.hasCustomComponent=!!customElements.get(this.productCardComponent);this.sourceValueIsValid=!!(this.getSourceValue()||this.isSourceWithoutValue());this.hasInfiniteScroll=!["json","selected","related","landing-page"].includes(this.getSource())&&!this.limit;try{let t=new URLSearchParams(window.location.search);this.sortBy=this.sortBy||t.get("sort")||t.get("by");let s=t.get("filters");this.parsedFilters=s?JSON.parse(decodeURIComponent(s)):{}}catch(t){salla.logger.warn("failed to get filters from url",t.message)}this.buildNextPageUrl();this.createStatusDom();this.isReady=true;if(!this.sourceValueIsValid){salla.logger.warn(`source-value prop is required for source [${this.getSource()}]`);return}if(this.hasInfiniteScroll){return}if(this.getSource()==="json"){if(!this.getSourceValue().length){this.showPlaceholder=true;return}setTimeout((()=>{this.getSourceValue().map((t=>this.wrapper.append(this.getItemHTML(t))))}));return}if(this.getSource()==="selected"&&!this.getSourceValue().length){this.showPlaceholder=true;return}return n.fetchProducts(this.getSource(),this.getSourceValue(),this.limit).then((t=>{if(!t.data.length){this.showPlaceholder=true;this.loading(false);return}setTimeout((()=>{this.handleResponse(t).forEach((t=>this.wrapper.append(t)))}),100)}))}))}canRender(){return this.sourceValueIsValid&&this.isReady}render(){if(!this.canRender()){return""}if(this.showPlaceholder){return i("div",{class:"s-products-list-placeholder"},i("span",{innerHTML:o}),i("p",null,this.placeholderText))}return i(e,{class:"s-products-list"},i("div",{class:{"s-products-list-wrapper":true,"s-products-list-horizontal-cards":this.horizontalCards&&!this.filtersResults,"s-products-list-vertical-cards":!this.horizontalCards&&!this.filtersResults,"s-products-list-filters-results":this.filtersResults},ref:t=>this.wrapper=t}))}componentDidLoad(){this.hasInfiniteScroll&&this.init()}init(){this.initiateInfiniteScroll();this.loading()}handleResponse(t){var s,i,e,r,l,o;let h=this.getSource();let a="";if(((s=t.cursor)===null||s===void 0?void 0:s.current)===1){a=n.getPageTitleForSource(h);try{if(this.getSource()==="search"){a=salla.lang.get("common.elements.search_about",{word:this.getSourceValue()})}else if(!a){let s=this.parsedFilters.category_id||this.getSourceValue()[0];a=((r=(e=(i=t.filters.find((t=>t.key=="category_id")))===null||i===void 0?void 0:i.values)===null||e===void 0?void 0:e.find((t=>t.key==s)))===null||r===void 0?void 0:r.value)||""}a+=(a?" - ":"")+salla.lang.choice("blocks.header.products_count",(l=t.data)===null||l===void 0?void 0:l.length);if(t.data.length===15){a=a.replace(t.data.length,salla.lang.get("common.elements.more_than")+" "+t.data.length)}t.title=a}catch(t){}}salla.event.emit("salla-products-list::products.fetched",t);this.productsFetched.emit(t);if(t.filters&&this.isFilterable()){this.filtersResults=true;salla.event.emit("filters::fetched",{filters:t.filters})}else if(this.isFilterable()){salla.event.emit("filters::hidden")}this.nextPage=t.cursor?t.cursor.next:this.nextPage;this.loading(false);if(this.hasInfiniteScroll&&!this.nextPage){this.infiniteScroll.option({scrollThreshold:false,loadOnScroll:false});this.status.querySelector(".s-infinite-scroll-last").classList.remove("s-hidden")}return((o=t.data)===null||o===void 0?void 0:o.map((t=>this.getItemHTML(t))))||[]}get host(){return r(this)}};a.style=h;export{a as salla_products_list};
5
- //# sourceMappingURL=p-7fda7b65.entry.js.map
@@ -1 +0,0 @@
1
- {"version":3,"names":["sallaProductsListCss","SallaProductsList","connectedCallback","salla","event","on","filters","this","setFilters","JSON","stringify","parsedFilters","window","scrollTo","top","behavior","reload","infiniteScroll","destroy","buildNextPageUrl","wrapper","innerHTML","init","isFilterable","config","get","filtersResults","isSourceWithoutValue","includes","getSource","animateItems","anime","targets","opacity","duration","translateY","delay","_el","i","createStatusDom","status","document","createElement","className","lang","btnLoader","querySelector","onLoaded","placeholderText","initBaseNextPageUrl","source","nextPage","url","api","limit","sortBy","key","value","Object","entries","encodeURIComponent","Array","isArray","forEach","item","k","v","getSourceValue","join","e","logger","warn","sourceValueIsValid","loading","isLoading","style","display","getItemHTML","product","customComponentTag","hasCustomComponent","productCardComponent","productCard","applyLandingPageStyles","applyHorizontalCardStyles","toggleAttribute","classList","add","horizontalCards","setAttribute","Helper","getProductsSource","getProductsSourceValue","sourceValue","initiateInfiniteScroll","hasInfiniteScroll","host","insertAdjacentElement","initiate","path","history","scrollThreshold","_a","_b","response","data","length","pageIndex","showPlaceholder","appendItems","handleResponse","_c","remove","onReady","loadNextPage","componentWillLoad","onSallaReadyPromise","customElements","searchParams","URLSearchParams","location","search","parse","decodeURIComponent","message","isReady","setTimeout","map","append","fetchProducts","then","res","card","canRender","render","h","class","ShoppingBag","Host","ref","componentDidLoad","title","cursor","current","getPageTitleForSource","word","catId","category_id","_d","find","filter","values","cat","choice","_e","replace","emit","productsFetched","next","option","loadOnScroll","_f"],"sources":["src/components/salla-products-list/salla-products-list.scss?tag=salla-products-list","src/components/salla-products-list/salla-products-list.tsx"],"sourcesContent":["\n","import { Component, Host, h, Prop, State, Element, Method, Event, EventEmitter } from '@stencil/core';\nimport anime from 'animejs';\nimport ShoppingBag from '../../assets/svg/shopping-bag.svg';\nimport Helper from '../../Helpers/Helper';\n@Component({\n tag: 'salla-products-list',\n styleUrl: 'salla-products-list.scss'\n})\nexport class SallaProductsList {\n connectedCallback() {\n salla.event.on('salla-filters::changed', filters => this.setFilters(filters))\n }\n\n /**\n * Set parsed filters data from URI\n * @param filters\n */\n @Method()\n async setFilters(filters) {\n if (!!filters && JSON.stringify(this.parsedFilters) === JSON.stringify(filters)) {\n return;\n }\n window.scrollTo({ top: 0, behavior: 'smooth' });\n this.parsedFilters = filters;\n return this.reload();\n }\n\n /**\n * Reload the list of products (entire content of the component).\n */\n @Method()\n async reload() {\n salla.infiniteScroll.destroy(this.infiniteScroll);\n this.buildNextPageUrl();\n // TODO: this is problematic in testing, for the time being it's been resolved like this\n this.wrapper.innerHTML = '';\n this.init();\n }\n\n\n private status: HTMLDivElement;\n private btnLoader: HTMLAnchorElement;\n @Element() host: HTMLElement;\n private wrapper: any;\n private infiniteScroll: any;\n /**\n * The source of the products list\n * @type {string}\n * */\n @Prop({\n reflect: true,\n mutable: true\n }) source: 'categories' | 'latest' | 'related' | 'brands' | 'json' | 'search' | 'tags' | 'selected' | 'offers' | 'landing-page' | 'sales';\n\n /**\n * The source value, cloud be different values as following:\n * - array of ids when `source` in ['categories', 'brands', 'tags', 'selected']\n * - keyword when `source` = 'search'\n * - products payload when `source` = 'json'\n * - product_id when `source` = 'related'\n *\n * @type {string}\n * */\n @Prop({ mutable: true }) sourceValue: any;\n\n /**\n * Limit for number of products in the list.\n */\n @Prop({ mutable: true }) limit: number;\n\n /**\n * Sorting the list of products\n */\n @Prop({ mutable: true }) sortBy?: string | 'ourSuggest' | 'bestSell' | 'topRated' | 'priceFromTopToLow' | 'priceFromLowToTop';\n\n /**\n * should listen to filters events `salla-filters::changed` and re-render\n */\n @Prop({ reflect: true, mutable: true }) filtersResults: boolean;\n\n /**\n * Horizontal cards\n */\n @Prop({ reflect: true }) horizontalCards: boolean\n\n /**\n * Custom Card Component for the Salla Products List.\n *\n * This component allows you to customize the appearance of individual product cards within a Salla Products List.\n *\n * @example\n * <salla-products-list product-card-component=\"my-custom-card-style1\" ...\n * <salla-products-list product-card-component=\"my-custom-card-style2\" ...\n */\n @Prop() productCardComponent: string = 'custom-salla-product-card';\n\n // State\n @State() page: number = 1;\n @State() nextPage: string;\n @State() hasInfiniteScroll: boolean;\n @State() hasCustomComponent: boolean;\n @State() sourceValueIsValid: boolean;\n @State() placeholderText: string;\n @State() isReady: boolean;\n @State() showPlaceholder: boolean;\n @State() parsedFilters: any;\n\n /**\n * Custom event fired when the the products fetched.\n */\n @Event() productsFetched: EventEmitter;\n\n private isFilterable() {\n return salla.config.get('store.settings.product.filters') && this.filtersResults;\n }\n\n private isSourceWithoutValue() {\n return ['offers', 'latest', 'sales'].includes(this.getSource());\n }\n\n private animateItems() {\n anime({\n targets: 'salla-products-list salla-product-card',\n opacity: [0, 1],\n duration: 1200,\n translateY: [20, 0],\n delay: function (_el, i) {\n return i * 100;\n },\n })\n }\n\n private createStatusDom() {\n this.status = document.createElement('div');\n this.status.className = 's-infinite-scroll-wrapper';\n this.status.innerHTML = `<div class=\"s-infinite-scroll-status\">\n <p class=\"s-infinite-scroll-last infinite-scroll-last s-hidden\" >${salla.lang.get('common.elements.end_of_content')}</p>\n <p class=\"s-infinite-scroll-error infinite-scroll-error s-hidden\">${salla.lang.get('common.elements.failed_to_load_more')}</p>\n </div>\n <a href=\"#\" class=\"s-infinite-scroll-btn s-button-btn\">\n <span class=\"s-button-loader s-button-loader-center s-infinite-scroll-btn-loader\" style=\"display: none\"></span>\n </a>`;\n this.btnLoader = this.status.querySelector('.s-button-loader');\n salla.lang.onLoaded(() => {\n this.status.querySelector('.s-infinite-scroll-last').innerHTML = salla.lang.get('common.elements.end_of_content');\n this.status.querySelector('.s-infinite-scroll-error').innerHTML = salla.lang.get('common.elements.failed_to_load_more');\n this.placeholderText = salla.lang.get('pages.categories.no_products');\n });\n }\n\n private initBaseNextPageUrl(source: string) {\n\n this.nextPage = salla.url.api(`products?source=${source}`);\n\n if (this.limit) {\n this.nextPage += `&per_page=${this.limit > 32 ? 32 : this.limit}`;\n }\n if (this.sortBy) {\n this.nextPage += `&sort=${this.sortBy}`;\n }\n // if (!this.isFilterable()) {\n // return this.nextPage;\n // }\n this.nextPage += '&filterable=1';\n for (const [key, value] of Object.entries(this.parsedFilters || {})) {\n if ([\"string\", \"number\"].includes(typeof value)) {\n // @ts-ignore\n this.nextPage += `&filters[${encodeURIComponent(key)}]=${encodeURIComponent(value)}`;\n } else if (Array.isArray(value)) {\n value.forEach(item => this.nextPage += `&filters[${encodeURIComponent(key)}][]=${encodeURIComponent(item)}`);\n } else if (typeof value === 'object') {\n for (const [k, v] of Object.entries(value)) {\n this.nextPage += `&filters[${encodeURIComponent(key)}][${encodeURIComponent(k)}]=${encodeURIComponent(v)}`;\n }\n }\n }\n }\n\n private buildNextPageUrl() {\n let source = this.getSource();\n if (source === 'json') {\n return;\n }\n this.initBaseNextPageUrl(source);\n if (this.isSourceWithoutValue()) {\n return;\n }\n\n if (['search', 'related', 'landing-page'].includes(source)) {\n this.nextPage += `&source_value=${this.getSourceValue()}`;\n return;\n }\n\n try {\n this.nextPage += `&source_value[]=${this.getSourceValue().join('&source_value[]=')}`;\n } catch (e) {\n salla.logger.warn(`source-value prop should be array of ids ex source-value=\"[1,2,3]\" for the source [${source}]`);\n this.sourceValueIsValid = false;\n }\n }\n\n\n private loading(isLoading = true) {\n this.btnLoader.style.display = isLoading ? 'inherit' : 'none';\n }\n\n private getItemHTML(product) {\n const customComponentTag = this.hasCustomComponent ? this.productCardComponent : 'salla-product-card';\n const productCard = document.createElement(customComponentTag) as HTMLSallaProductCardElement;\n productCard.product = product;\n\n this.applyLandingPageStyles(productCard);\n this.applyHorizontalCardStyles(productCard);\n\n return productCard;\n }\n\n private applyLandingPageStyles(productCard) {\n if (this.getSource() === 'landing-page' && !this.hasCustomComponent) {\n productCard.toggleAttribute('hide-add-btn', true);\n productCard.classList.add('s-product-card-fit-height');\n }\n }\n\n private applyHorizontalCardStyles(productCard) {\n if (!this.horizontalCards) {\n return;\n }\n productCard.setAttribute('horizontal', true);\n if (!this.hasCustomComponent) {\n productCard.setAttribute('shadow-on-hover', true);\n }\n\n }\n\n private getSource() {\n return Helper.getProductsSource(this.source);\n }\n\n private getSourceValue() {\n return Helper.getProductsSourceValue(this.source, this.sourceValue);\n }\n\n private initiateInfiniteScroll() {\n if (!this.hasInfiniteScroll) {\n return;\n }\n\n this.host.insertAdjacentElement('beforeend', this.status);\n this.infiniteScroll = salla.infiniteScroll.initiate(this.wrapper, this.wrapper, {\n path: () => this.nextPage,\n history: false,\n nextPage: this.nextPage,\n scrollThreshold: 100,\n }, /* infinite via api*/true);\n this.infiniteScroll?.on('request', () => this.loading())\n this.infiniteScroll?.on('load', response => {\n if (!response.data?.length && this.infiniteScroll.pageIndex == 2) {\n this.showPlaceholder = true;\n salla.infiniteScroll.destroy(this.infiniteScroll);\n this.loading(false);\n return;\n } else {\n this.showPlaceholder = false;\n\n }\n this.infiniteScroll.appendItems(this.handleResponse(response))\n if (this.infiniteScroll.pageIndex == 2) {\n this.animateItems();\n }\n })\n this.infiniteScroll?.on('error', () => {\n this.status.querySelector('.s-infinite-scroll-error').classList.remove('s-hidden')\n this.loading(false);\n });\n salla.onReady(() => salla.infiniteScroll.loadNextPage(this.infiniteScroll))\n }\n\n componentWillLoad() {\n return Helper.onSallaReadyPromise( () => {\n this.hasCustomComponent = !!customElements.get(this.productCardComponent);\n this.sourceValueIsValid = !!(this.getSourceValue() || this.isSourceWithoutValue());\n this.hasInfiniteScroll = !['json', 'selected', 'related', 'landing-page'].includes(this.getSource()) && !this.limit;\n try {\n let searchParams = new URLSearchParams(window.location.search);\n this.sortBy = this.sortBy || searchParams.get('sort') || searchParams.get('by');\n let filters = searchParams.get('filters')\n this.parsedFilters = filters ? JSON.parse(decodeURIComponent(filters)) : {};\n } catch (e) {\n salla.logger.warn('failed to get filters from url', e.message);\n }\n this.buildNextPageUrl();\n this.createStatusDom();\n\n this.isReady = true;\n\n if (!this.sourceValueIsValid) {\n salla.logger.warn(`source-value prop is required for source [${this.getSource()}]`);\n return;\n }\n if (this.hasInfiniteScroll) {\n return;\n }\n\n // Handle json source\n if (this.getSource() === 'json') {\n if (!this.getSourceValue().length) {\n this.showPlaceholder = true;\n return;\n }\n setTimeout(() => {\n this.getSourceValue().map(product => this.wrapper.append(this.getItemHTML(product)));\n });\n return;\n }\n\n // Handle selected source\n if (this.getSource() === 'selected' && !this.getSourceValue().length) {\n this.showPlaceholder = true;\n return;\n }\n\n return Helper.fetchProducts(this.getSource(), this.getSourceValue(), this.limit).then(res => {\n if (!res.data.length) {\n this.showPlaceholder = true;\n this.loading(false);\n return;\n }\n setTimeout(() => {\n this.handleResponse(res).forEach(card => this.wrapper.append(card));\n }, 100);\n });\n });\n }\n\n\n\n private canRender() {\n return this.sourceValueIsValid && this.isReady;\n }\n\n render() {\n if (!this.canRender()) {\n return '';\n }\n\n if (this.showPlaceholder) {\n return <div class=\"s-products-list-placeholder\">\n <span innerHTML={ShoppingBag} />\n <p>{this.placeholderText}</p>\n </div>;\n }\n return (\n <Host class=\"s-products-list\">\n <div class={{\n \"s-products-list-wrapper\": true,\n 's-products-list-horizontal-cards': this.horizontalCards && !this.filtersResults,\n 's-products-list-vertical-cards': !this.horizontalCards && !this.filtersResults,\n 's-products-list-filters-results': this.filtersResults,\n }}\n ref={wrapper => this.wrapper = wrapper} />\n </Host>\n );\n }\n\n componentDidLoad() {\n this.hasInfiniteScroll && this.init();\n }\n\n private init() {\n this.initiateInfiniteScroll();\n this.loading();\n }\n\n private handleResponse(response): Array<HTMLElement> {\n let source=this.getSource();\n let title = '';\n //help the developer to know the current page title\n if (response.cursor?.current === 1) {\n title = Helper.getPageTitleForSource(source);\n try {\n if (this.getSource() === 'search') {\n title = salla.lang.get('common.elements.search_about', {'word': this.getSourceValue()});\n } else if (!title) {\n let catId = this.parsedFilters.category_id || this.getSourceValue()[0];\n // get the first filter that its key is category_id, then get the value when filter.value.*.key==catId\n title = response.filters.find(filter => filter.key == 'category_id') ?. values ?. find(cat => cat.key == catId) ?. value || '';\n }\n title += (title ? ' - ' : '') + salla.lang.choice('blocks.header.products_count', response.data ?. length);\n if (response.data.length === 15) {\n title = title.replace(response.data.length, salla.lang.get('common.elements.more_than') + ' ' + response.data.length)\n }\n response.title = title;\n } catch (e) {}\n }\n\n salla.event.emit('salla-products-list::products.fetched', response);\n this.productsFetched.emit(response);\n //💡 when source is related, cursor will not be existed\n if (response.filters && this.isFilterable()) {\n this.filtersResults = true;\n salla.event.emit('filters::fetched', { filters: response.filters });\n } else if (this.isFilterable()) {\n salla.event.emit('filters::hidden');\n }\n this.nextPage = response.cursor ? response.cursor.next : this.nextPage;\n this.loading(false);\n if (this.hasInfiniteScroll && !this.nextPage) {\n this.infiniteScroll.option({ scrollThreshold: false, loadOnScroll: false });\n this.status.querySelector('.s-infinite-scroll-last').classList.remove('s-hidden');\n }\n return response.data?.map(product => this.getItemHTML(product)) || [];\n }\n}\n"],"mappings":"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"}
@@ -1,5 +0,0 @@
1
- /*!
2
- * Crafted with ❤ by Salla
3
- */
4
- import{r as s,h as t,H as i,g as e}from"./p-dd9b5ccb.js";import{H as r}from"./p-b9de0451.js";const d="";const u=class{constructor(t){s(this,t);this.blockTitle=undefined;this.subTitle=undefined;this.sliderId=undefined;this.displayAllUrl=undefined;this.autoplay=undefined;this.source=undefined;this.sourceValue=undefined;this.limit=undefined;this.sliderConfig=undefined;this.productCardComponent="custom-salla-product-card";this.productsData=undefined;this.isReady=undefined;this.sourceValueIsValid=undefined;this.hasCustomComponent=undefined;this.apiUrl="";this.parsedSourceValue=undefined}isSourceWithoutValue(){return["offers","latest","sales"].includes(this.getSource())}getItemHTML(s){if(this.hasCustomComponent&&this.productCardComponent.toLowerCase()=="custom-salla-product-card"){return t("div",{class:"s-products-slider-card"},t("custom-salla-product-card",{product:s,source:this.getSource(),"source-value":this.getSourceValue()}))}if(this.hasCustomComponent){const i=document.createElement(this.productCardComponent);i.setAttribute("product",JSON.stringify(s));i.setAttribute("source",this.getSource());i.setAttribute("source-value",this.getSourceValue());return t("div",{class:"s-products-slider-card",innerHTML:i.outerHTML})}return t("div",{class:"s-products-slider-card"},t("salla-product-card",{"show-quantity":this.getSource()=="landing-page","hide-add-btn":this.getSource()=="landing-page","shadow-on-hover":true,product:s}))}canRender(){return this.sourceValueIsValid&&this.isReady}componentWillLoad(){return r.onSallaReadyPromise((()=>{this.sourceValueIsValid=!!(this.getSourceValue()||this.isSourceWithoutValue());if(!this.sourceValueIsValid){salla.logger.warn(`source-value prop is required for source [${this.getSource()}]`);return}this.hasCustomComponent=!!customElements.get(this.productCardComponent);if(this.source==="json"){this.productsData=this.getSourceValue();this.isReady=true;return}if(this.getSource()=="related"&&!salla.config.get("store.settings.product.related_products_enabled")){return this.isReady=false}return r.fetchProducts(this.getSource(),this.getSourceValue(),this.limit).then((s=>{this.productsData=s.data;this.isReady=true;salla.event.emit("salla-products-slider::products.fetched",s.data)}))}))}getSource(){return r.getProductsSource(this.source)}getSourceValue(){return r.getProductsSourceValue(this.source,this.sourceValue)}render(){var s;if(!this.canRender()){return}return t(i,{class:"s-products-slider-wrapper"},t("salla-slider",{class:"s-products-slider-slider",id:this.sliderId||`s-products-slider-${Math.random().toString(36).substr(2,9)}`,"auto-play":this.autoplay,type:"carousel","block-title":this.blockTitle,"block-subTitle":this.subTitle,"display-all-url":this.displayAllUrl,sliderConfig:this.sliderConfig?this.sliderConfig:null},t("div",{slot:"items"},(s=this.productsData)===null||s===void 0?void 0:s.map((s=>this.getItemHTML(s))))))}get host(){return e(this)}};u.style=d;export{u as salla_products_slider};
5
- //# sourceMappingURL=p-dfe73459.entry.js.map
@@ -1 +0,0 @@
1
- {"version":3,"names":["sallaProductsSliderCss","SallaProductsSlider","isSourceWithoutValue","includes","this","getSource","getItemHTML","product","hasCustomComponent","productCardComponent","toLowerCase","h","class","source","getSourceValue","customElem","document","createElement","setAttribute","JSON","stringify","innerHTML","outerHTML","canRender","sourceValueIsValid","isReady","componentWillLoad","Helper","onSallaReadyPromise","salla","logger","warn","customElements","get","productsData","config","fetchProducts","limit","then","res","data","event","emit","getProductsSource","getProductsSourceValue","sourceValue","render","Host","id","sliderId","Math","random","toString","substr","autoplay","type","blockTitle","subTitle","displayAllUrl","sliderConfig","slot","_a","map"],"sources":["src/components/salla-products-slider/salla-products-slider.scss?tag=salla-products-slider","src/components/salla-products-slider/salla-products-slider.tsx"],"sourcesContent":[".s-products-slider{\n &-wrapper{\n\n }\n &-slider{\n\n }\n &-card{\n\n }\n}","import { Component, Host, h, Prop, Element, State } from '@stencil/core';\nimport Helper from '../../Helpers/Helper';\n@Component({\n tag: 'salla-products-slider',\n styleUrl: 'salla-products-slider.scss'\n})\n\n//todo:: extends this component from salla-products-list or the opposite\nexport class SallaProductsSlider {\n private isSourceWithoutValue() {\n return ['offers', 'latest', 'sales'].includes(this.getSource());\n }\n\n @Element() host: HTMLElement;\n //todo:: support limit, default =10, make sure that maximum is 32,\n\n /**\n * Title of the block - works only if slider is true\n * @type {string}\n * @default ''\n * */\n @Prop() blockTitle: string;\n\n /**\n * Sub title of the block - works only if slider is true\n * @type {string}\n * @default ''\n * */\n @Prop() subTitle: string;\n\n /**\n * Slider Id, if not provided will be generated automatically\n * @type {string}\n * @default ''\n * */\n @Prop() sliderId: string;\n\n /**\n * Display 'ALL' URL\n * @type {string}\n * @default ''\n * */\n @Prop() displayAllUrl: string;\n\n /**\n * autoplay option for products slider\n */\n @Prop({ mutable: true }) autoplay: boolean\n\n /**\n * Source of the products, if api will get the products from the API, if json will get the products from the products prop\n * @type {string}\n * @default ''\n * */\n @Prop({\n reflect: true,\n mutable: true\n }) source: 'categories' | 'latest' | 'related' | 'brands' | 'json' | 'tags' | 'selected' | 'offers' | 'landing-page';\n\n /**\n * The source value, cloud be different values as following:\n * - array of ids when `source` in ['categories', 'brands', 'tags', 'selected']\n * - products payload when `source` = 'json'\n * - product_id when `source` = 'related'\n *\n * @type {string}\n * */\n @Prop() sourceValue: string;\n\n /**\n * Limit for number of products in the list.\n */\n @Prop({ mutable: true }) limit: number;\n\n /**\n * Slider Configs refer to https://swiperjs.com/swiper-api#parameters and pass the entire config object\n * @example\n * let slider = document.querySelector('salla-slider');\n * slider.sliderConfig = {\n * slidesPerView: 1,\n * spaceBetween : 30,\n * lazy: true,\n * }\n *\n */\n @Prop({ reflect: true }) sliderConfig: any;\n\n /**\n * Custom Card Component for the Salla Products Slider.\n *\n * This component allows you to customize the appearance of individual product cards within a Salla Products Slider.\n *\n * @example\n * <salla-products-slider product-card-component=\"my-custom-card-style1\" ...\n * <salla-products-slider product-card-component=\"my-custom-card-style2\" ...\n */\n @Prop() productCardComponent: string = 'custom-salla-product-card';\n\n\n @State() productsData: any;\n @State() isReady: boolean;\n @State() sourceValueIsValid: boolean;\n @State() hasCustomComponent: boolean;\n @State() apiUrl: string = '';\n @State() parsedSourceValue: any;\n\n private getItemHTML(product) {\n if (this.hasCustomComponent && this.productCardComponent.toLowerCase()=='custom-salla-product-card') {\n return <div class=\"s-products-slider-card\">\n <custom-salla-product-card product={product} source={this.getSource()} source-value={this.getSourceValue()} />\n </div>\n }\n\n if(this.hasCustomComponent){\n const customElem = document.createElement(this.productCardComponent);\n customElem.setAttribute('product', JSON.stringify(product));\n customElem.setAttribute('source', this.getSource());\n customElem.setAttribute('source-value', this.getSourceValue());\n \n return <div class=\"s-products-slider-card\" innerHTML={customElem.outerHTML}/>;\n }\n\n return <div class=\"s-products-slider-card\">\n <salla-product-card\n show-quantity={this.getSource() == 'landing-page'}\n hide-add-btn={this.getSource() == 'landing-page'}\n shadow-on-hover={true}\n product={product} />\n </div>;\n }\n\n\n private canRender() {\n return this.sourceValueIsValid && this.isReady;\n }\n componentWillLoad() {\n return Helper.onSallaReadyPromise(() => {\n this.sourceValueIsValid = !!(this.getSourceValue() || this.isSourceWithoutValue());\n if (!this.sourceValueIsValid) {\n salla.logger.warn(`source-value prop is required for source [${\n this.getSource()\n }]`);\n return;\n }\n this.hasCustomComponent = !!customElements.get(this.productCardComponent);\n\n if (this.source === 'json') {\n this.productsData = this.getSourceValue();\n this.isReady = true\n return;\n }\n\n if ((this.getSource() == 'related' && !salla.config.get('store.settings.product.related_products_enabled'))) {\n return this.isReady = false;\n }\n \n return Helper.fetchProducts(this.getSource(), this.getSourceValue(), this.limit).then(res => {\n this.productsData = res.data\n this.isReady = true\n salla.event.emit('salla-products-slider::products.fetched', res.data);\n });\n });\n }\n\n private getSource() {\n return Helper.getProductsSource(this.source);\n }\n\n private getSourceValue() {\n return Helper.getProductsSourceValue(this.source, this.sourceValue);\n }\n\n render() {\n \n if (!this.canRender()) {\n return;\n }\n return (\n <Host class=\"s-products-slider-wrapper\">\n <salla-slider\n class=\"s-products-slider-slider\"\n id={this.sliderId || `s-products-slider-${Math.random().toString(36).substr(2, 9)}`}\n auto-play={this.autoplay}\n type=\"carousel\"\n block-title={this.blockTitle}\n block-subTitle={this.subTitle}\n display-all-url={this.displayAllUrl}\n sliderConfig={this.sliderConfig ? this.sliderConfig : null}\n >\n <div slot=\"items\">\n {this.productsData?.map(product => this.getItemHTML(product))}\n </div>\n </salla-slider>\n </Host>\n );\n }\n\n}\n"],"mappings":";;;6FAAA,MAAMA,EAAyB,G,MCQlBC,EAAmB,M,oRAwFS,4B,mIAOb,G,iCA9FlB,oBAAAC,GACN,MAAO,CAAC,SAAU,SAAU,SAASC,SAASC,KAAKC,Y,CAgG7C,WAAAC,CAAYC,GAClB,GAAIH,KAAKI,oBAAsBJ,KAAKK,qBAAqBC,eAAe,4BAA6B,CACnG,OAAOC,EAAA,OAAKC,MAAM,0BACfD,EAAA,6BAA2BJ,QAASA,EAASM,OAAQT,KAAKC,YAAW,eAAgBD,KAAKU,mB,CAI/F,GAAGV,KAAKI,mBAAmB,CACzB,MAAMO,EAAaC,SAASC,cAAcb,KAAKK,sBAC/CM,EAAWG,aAAa,UAAWC,KAAKC,UAAUb,IAClDQ,EAAWG,aAAa,SAAUd,KAAKC,aACvCU,EAAWG,aAAa,eAAgBd,KAAKU,kBAE7C,OAAOH,EAAA,OAAKC,MAAM,yBAAyBS,UAAWN,EAAWO,W,CAGnE,OAAOX,EAAA,OAAKC,MAAM,0BAChBD,EAAA,sCACiBP,KAAKC,aAAe,eAAc,eACnCD,KAAKC,aAAe,eAAc,kBAC/B,KACjBE,QAASA,I,CAKP,SAAAgB,GACN,OAAOnB,KAAKoB,oBAAsBpB,KAAKqB,O,CAEzC,iBAAAC,GACI,OAAOC,EAAOC,qBAAoB,KAC9BxB,KAAKoB,sBAAwBpB,KAAKU,kBAAoBV,KAAKF,wBAC3D,IAAKE,KAAKoB,mBAAoB,CAC1BK,MAAMC,OAAOC,KAAK,6CACd3B,KAAKC,gBAET,M,CAEJD,KAAKI,qBAAuBwB,eAAeC,IAAI7B,KAAKK,sBAEpD,GAAIL,KAAKS,SAAW,OAAQ,CACxBT,KAAK8B,aAAe9B,KAAKU,iBACzBV,KAAKqB,QAAU,KACf,M,CAGJ,GAAKrB,KAAKC,aAAe,YAAcwB,MAAMM,OAAOF,IAAI,mDAAqD,CAC3G,OAAO7B,KAAKqB,QAAU,K,CAGxB,OAAOE,EAAOS,cAAchC,KAAKC,YAAaD,KAAKU,iBAAkBV,KAAKiC,OAAOC,MAAKC,IAClFnC,KAAK8B,aAAeK,EAAIC,KACxBpC,KAAKqB,QAAU,KACfI,MAAMY,MAAMC,KAAK,0CAA2CH,EAAIC,KAAK,GACvE,G,CAIF,SAAAnC,GACN,OAAOsB,EAAOgB,kBAAkBvC,KAAKS,O,CAG/B,cAAAC,GACN,OAAOa,EAAOiB,uBAAuBxC,KAAKS,OAAQT,KAAKyC,Y,CAGzD,MAAAC,G,MAEE,IAAK1C,KAAKmB,YAAa,CACrB,M,CAEF,OACEZ,EAACoC,EAAI,CAACnC,MAAM,6BACVD,EAAA,gBACEC,MAAM,2BACNoC,GAAI5C,KAAK6C,UAAY,qBAAqBC,KAAKC,SAASC,SAAS,IAAIC,OAAO,EAAG,KAAI,YACxEjD,KAAKkD,SAChBC,KAAK,WAAU,cACFnD,KAAKoD,WAAU,iBACZpD,KAAKqD,SAAQ,kBACZrD,KAAKsD,cACtBC,aAAcvD,KAAKuD,aAAevD,KAAKuD,aAAe,MAEtDhD,EAAA,OAAKiD,KAAK,UACPC,EAAAzD,KAAK8B,gBAAY,MAAA2B,SAAA,SAAAA,EAAEC,KAAIvD,GAAWH,KAAKE,YAAYC,O"}
@@ -1,5 +0,0 @@
1
- /*!
2
- * Crafted with ❤ by Salla
3
- */
4
- System.register(["./p-548cb28d.system.js","./p-7fbfc1e6.system.js"],(function(e){"use strict";var t,r,s,u,o;return{setters:[function(e){t=e.r;r=e.h;s=e.H;u=e.g},function(e){o=e.H}],execute:function(){var i="";var n=e("salla_products_slider",function(){function e(e){t(this,e);this.blockTitle=undefined;this.subTitle=undefined;this.sliderId=undefined;this.displayAllUrl=undefined;this.autoplay=undefined;this.source=undefined;this.sourceValue=undefined;this.limit=undefined;this.sliderConfig=undefined;this.productCardComponent="custom-salla-product-card";this.productsData=undefined;this.isReady=undefined;this.sourceValueIsValid=undefined;this.hasCustomComponent=undefined;this.apiUrl="";this.parsedSourceValue=undefined}e.prototype.isSourceWithoutValue=function(){return["offers","latest","sales"].includes(this.getSource())};e.prototype.getItemHTML=function(e){if(this.hasCustomComponent&&this.productCardComponent.toLowerCase()=="custom-salla-product-card"){return r("div",{class:"s-products-slider-card"},r("custom-salla-product-card",{product:e,source:this.getSource(),"source-value":this.getSourceValue()}))}if(this.hasCustomComponent){var t=document.createElement(this.productCardComponent);t.setAttribute("product",JSON.stringify(e));t.setAttribute("source",this.getSource());t.setAttribute("source-value",this.getSourceValue());return r("div",{class:"s-products-slider-card",innerHTML:t.outerHTML})}return r("div",{class:"s-products-slider-card"},r("salla-product-card",{"show-quantity":this.getSource()=="landing-page","hide-add-btn":this.getSource()=="landing-page","shadow-on-hover":true,product:e}))};e.prototype.canRender=function(){return this.sourceValueIsValid&&this.isReady};e.prototype.componentWillLoad=function(){var e=this;return o.onSallaReadyPromise((function(){e.sourceValueIsValid=!!(e.getSourceValue()||e.isSourceWithoutValue());if(!e.sourceValueIsValid){salla.logger.warn("source-value prop is required for source [".concat(e.getSource(),"]"));return}e.hasCustomComponent=!!customElements.get(e.productCardComponent);if(e.source==="json"){e.productsData=e.getSourceValue();e.isReady=true;return}if(e.getSource()=="related"&&!salla.config.get("store.settings.product.related_products_enabled")){return e.isReady=false}return o.fetchProducts(e.getSource(),e.getSourceValue(),e.limit).then((function(t){e.productsData=t.data;e.isReady=true;salla.event.emit("salla-products-slider::products.fetched",t.data)}))}))};e.prototype.getSource=function(){return o.getProductsSource(this.source)};e.prototype.getSourceValue=function(){return o.getProductsSourceValue(this.source,this.sourceValue)};e.prototype.render=function(){var e=this;var t;if(!this.canRender()){return}return r(s,{class:"s-products-slider-wrapper"},r("salla-slider",{class:"s-products-slider-slider",id:this.sliderId||"s-products-slider-".concat(Math.random().toString(36).substr(2,9)),"auto-play":this.autoplay,type:"carousel","block-title":this.blockTitle,"block-subTitle":this.subTitle,"display-all-url":this.displayAllUrl,sliderConfig:this.sliderConfig?this.sliderConfig:null},r("div",{slot:"items"},(t=this.productsData)===null||t===void 0?void 0:t.map((function(t){return e.getItemHTML(t)})))))};Object.defineProperty(e.prototype,"host",{get:function(){return u(this)},enumerable:false,configurable:true});return e}());n.style=i}}}));
5
- //# sourceMappingURL=p-e5148740.system.entry.js.map
@@ -1 +0,0 @@
1
- {"version":3,"names":["sallaProductsSliderCss","SallaProductsSlider","exports","class_1","prototype","isSourceWithoutValue","includes","this","getSource","getItemHTML","product","hasCustomComponent","productCardComponent","toLowerCase","h","class","source","getSourceValue","customElem","document","createElement","setAttribute","JSON","stringify","innerHTML","outerHTML","canRender","sourceValueIsValid","isReady","componentWillLoad","_this","Helper","onSallaReadyPromise","salla","logger","warn","concat","customElements","get","productsData","config","fetchProducts","limit","then","res","data","event","emit","getProductsSource","getProductsSourceValue","sourceValue","render","Host","id","sliderId","Math","random","toString","substr","autoplay","type","blockTitle","subTitle","displayAllUrl","sliderConfig","slot","_a","map"],"sources":["src/components/salla-products-slider/salla-products-slider.scss?tag=salla-products-slider","src/components/salla-products-slider/salla-products-slider.tsx"],"sourcesContent":[".s-products-slider{\n &-wrapper{\n\n }\n &-slider{\n\n }\n &-card{\n\n }\n}","import { Component, Host, h, Prop, Element, State } from '@stencil/core';\nimport Helper from '../../Helpers/Helper';\n@Component({\n tag: 'salla-products-slider',\n styleUrl: 'salla-products-slider.scss'\n})\n\n//todo:: extends this component from salla-products-list or the opposite\nexport class SallaProductsSlider {\n private isSourceWithoutValue() {\n return ['offers', 'latest', 'sales'].includes(this.getSource());\n }\n\n @Element() host: HTMLElement;\n //todo:: support limit, default =10, make sure that maximum is 32,\n\n /**\n * Title of the block - works only if slider is true\n * @type {string}\n * @default ''\n * */\n @Prop() blockTitle: string;\n\n /**\n * Sub title of the block - works only if slider is true\n * @type {string}\n * @default ''\n * */\n @Prop() subTitle: string;\n\n /**\n * Slider Id, if not provided will be generated automatically\n * @type {string}\n * @default ''\n * */\n @Prop() sliderId: string;\n\n /**\n * Display 'ALL' URL\n * @type {string}\n * @default ''\n * */\n @Prop() displayAllUrl: string;\n\n /**\n * autoplay option for products slider\n */\n @Prop({ mutable: true }) autoplay: boolean\n\n /**\n * Source of the products, if api will get the products from the API, if json will get the products from the products prop\n * @type {string}\n * @default ''\n * */\n @Prop({\n reflect: true,\n mutable: true\n }) source: 'categories' | 'latest' | 'related' | 'brands' | 'json' | 'tags' | 'selected' | 'offers' | 'landing-page';\n\n /**\n * The source value, cloud be different values as following:\n * - array of ids when `source` in ['categories', 'brands', 'tags', 'selected']\n * - products payload when `source` = 'json'\n * - product_id when `source` = 'related'\n *\n * @type {string}\n * */\n @Prop() sourceValue: string;\n\n /**\n * Limit for number of products in the list.\n */\n @Prop({ mutable: true }) limit: number;\n\n /**\n * Slider Configs refer to https://swiperjs.com/swiper-api#parameters and pass the entire config object\n * @example\n * let slider = document.querySelector('salla-slider');\n * slider.sliderConfig = {\n * slidesPerView: 1,\n * spaceBetween : 30,\n * lazy: true,\n * }\n *\n */\n @Prop({ reflect: true }) sliderConfig: any;\n\n /**\n * Custom Card Component for the Salla Products Slider.\n *\n * This component allows you to customize the appearance of individual product cards within a Salla Products Slider.\n *\n * @example\n * <salla-products-slider product-card-component=\"my-custom-card-style1\" ...\n * <salla-products-slider product-card-component=\"my-custom-card-style2\" ...\n */\n @Prop() productCardComponent: string = 'custom-salla-product-card';\n\n\n @State() productsData: any;\n @State() isReady: boolean;\n @State() sourceValueIsValid: boolean;\n @State() hasCustomComponent: boolean;\n @State() apiUrl: string = '';\n @State() parsedSourceValue: any;\n\n private getItemHTML(product) {\n if (this.hasCustomComponent && this.productCardComponent.toLowerCase()=='custom-salla-product-card') {\n return <div class=\"s-products-slider-card\">\n <custom-salla-product-card product={product} source={this.getSource()} source-value={this.getSourceValue()} />\n </div>\n }\n\n if(this.hasCustomComponent){\n const customElem = document.createElement(this.productCardComponent);\n customElem.setAttribute('product', JSON.stringify(product));\n customElem.setAttribute('source', this.getSource());\n customElem.setAttribute('source-value', this.getSourceValue());\n \n return <div class=\"s-products-slider-card\" innerHTML={customElem.outerHTML}/>;\n }\n\n return <div class=\"s-products-slider-card\">\n <salla-product-card\n show-quantity={this.getSource() == 'landing-page'}\n hide-add-btn={this.getSource() == 'landing-page'}\n shadow-on-hover={true}\n product={product} />\n </div>;\n }\n\n\n private canRender() {\n return this.sourceValueIsValid && this.isReady;\n }\n componentWillLoad() {\n return Helper.onSallaReadyPromise(() => {\n this.sourceValueIsValid = !!(this.getSourceValue() || this.isSourceWithoutValue());\n if (!this.sourceValueIsValid) {\n salla.logger.warn(`source-value prop is required for source [${\n this.getSource()\n }]`);\n return;\n }\n this.hasCustomComponent = !!customElements.get(this.productCardComponent);\n\n if (this.source === 'json') {\n this.productsData = this.getSourceValue();\n this.isReady = true\n return;\n }\n\n if ((this.getSource() == 'related' && !salla.config.get('store.settings.product.related_products_enabled'))) {\n return this.isReady = false;\n }\n \n return Helper.fetchProducts(this.getSource(), this.getSourceValue(), this.limit).then(res => {\n this.productsData = res.data\n this.isReady = true\n salla.event.emit('salla-products-slider::products.fetched', res.data);\n });\n });\n }\n\n private getSource() {\n return Helper.getProductsSource(this.source);\n }\n\n private getSourceValue() {\n return Helper.getProductsSourceValue(this.source, this.sourceValue);\n }\n\n render() {\n \n if (!this.canRender()) {\n return;\n }\n return (\n <Host class=\"s-products-slider-wrapper\">\n <salla-slider\n class=\"s-products-slider-slider\"\n id={this.sliderId || `s-products-slider-${Math.random().toString(36).substr(2, 9)}`}\n auto-play={this.autoplay}\n type=\"carousel\"\n block-title={this.blockTitle}\n block-subTitle={this.subTitle}\n display-all-url={this.displayAllUrl}\n sliderConfig={this.sliderConfig ? this.sliderConfig : null}\n >\n <div slot=\"items\">\n {this.productsData?.map(product => this.getItemHTML(product))}\n </div>\n </salla-slider>\n </Host>\n );\n }\n\n}\n"],"mappings":";;;wMAAA,IAAMA,EAAyB,G,ICQlBC,EAAmBC,EAAA,mC,mRAwFS,4B,mIAOb,G,iCA9FlBC,EAAAC,UAAAC,qBAAA,WACN,MAAO,CAAC,SAAU,SAAU,SAASC,SAASC,KAAKC,Y,EAgG7CL,EAAAC,UAAAK,YAAA,SAAYC,GAClB,GAAIH,KAAKI,oBAAsBJ,KAAKK,qBAAqBC,eAAe,4BAA6B,CACnG,OAAOC,EAAA,OAAKC,MAAM,0BACfD,EAAA,6BAA2BJ,QAASA,EAASM,OAAQT,KAAKC,YAAW,eAAgBD,KAAKU,mB,CAI/F,GAAGV,KAAKI,mBAAmB,CACzB,IAAMO,EAAaC,SAASC,cAAcb,KAAKK,sBAC/CM,EAAWG,aAAa,UAAWC,KAAKC,UAAUb,IAClDQ,EAAWG,aAAa,SAAUd,KAAKC,aACvCU,EAAWG,aAAa,eAAgBd,KAAKU,kBAE7C,OAAOH,EAAA,OAAKC,MAAM,yBAAyBS,UAAWN,EAAWO,W,CAGnE,OAAOX,EAAA,OAAKC,MAAM,0BAChBD,EAAA,sCACiBP,KAAKC,aAAe,eAAc,eACnCD,KAAKC,aAAe,eAAc,kBAC/B,KACjBE,QAASA,I,EAKPP,EAAAC,UAAAsB,UAAA,WACN,OAAOnB,KAAKoB,oBAAsBpB,KAAKqB,O,EAEzCzB,EAAAC,UAAAyB,kBAAA,eAAAC,EAAAvB,KACI,OAAOwB,EAAOC,qBAAoB,WAC9BF,EAAKH,sBAAwBG,EAAKb,kBAAoBa,EAAKzB,wBAC3D,IAAKyB,EAAKH,mBAAoB,CAC1BM,MAAMC,OAAOC,KAAK,6CAAAC,OACdN,EAAKtB,YACT,MACA,M,CAEJsB,EAAKnB,qBAAuB0B,eAAeC,IAAIR,EAAKlB,sBAEpD,GAAIkB,EAAKd,SAAW,OAAQ,CACxBc,EAAKS,aAAeT,EAAKb,iBACzBa,EAAKF,QAAU,KACf,M,CAGJ,GAAKE,EAAKtB,aAAe,YAAcyB,MAAMO,OAAOF,IAAI,mDAAqD,CAC3G,OAAOR,EAAKF,QAAU,K,CAGxB,OAAOG,EAAOU,cAAcX,EAAKtB,YAAasB,EAAKb,iBAAkBa,EAAKY,OAAOC,MAAK,SAAAC,GAClFd,EAAKS,aAAeK,EAAIC,KACxBf,EAAKF,QAAU,KACfK,MAAMa,MAAMC,KAAK,0CAA2CH,EAAIC,K,QAKpE1C,EAAAC,UAAAI,UAAA,WACN,OAAOuB,EAAOiB,kBAAkBzC,KAAKS,O,EAG/Bb,EAAAC,UAAAa,eAAA,WACN,OAAOc,EAAOkB,uBAAuB1C,KAAKS,OAAQT,KAAK2C,Y,EAGzD/C,EAAAC,UAAA+C,OAAA,eAAArB,EAAAvB,K,MAEE,IAAKA,KAAKmB,YAAa,CACrB,M,CAEF,OACEZ,EAACsC,EAAI,CAACrC,MAAM,6BACVD,EAAA,gBACEC,MAAM,2BACNsC,GAAI9C,KAAK+C,UAAY,qBAAAlB,OAAqBmB,KAAKC,SAASC,SAAS,IAAIC,OAAO,EAAG,IAAI,YACxEnD,KAAKoD,SAChBC,KAAK,WAAU,cACFrD,KAAKsD,WAAU,iBACZtD,KAAKuD,SAAQ,kBACZvD,KAAKwD,cACtBC,aAAczD,KAAKyD,aAAezD,KAAKyD,aAAe,MAEtDlD,EAAA,OAAKmD,KAAK,UACPC,EAAA3D,KAAKgC,gBAAY,MAAA2B,SAAA,SAAAA,EAAEC,KAAI,SAAAzD,GAAW,OAAAoB,EAAKrB,YAAYC,EAAjB,M,yHAtLf,I"}