@salla.sa/twilight-components 2.11.110 → 2.11.112
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.
- package/README.md +48 -42
- package/dist/cjs/{app-globals-c392da62.js → app-globals-38ac4fe8.js} +2 -2
- package/dist/cjs/{app-globals-c392da62.js.map → app-globals-38ac4fe8.js.map} +1 -1
- package/dist/cjs/loader.cjs.js +2 -2
- package/dist/cjs/salla-add-product-button_40.cjs.entry.js +74 -24
- package/dist/cjs/salla-add-product-button_40.cjs.entry.js.map +1 -1
- package/dist/cjs/salla-filters-widget.cjs.entry.js +5 -27
- package/dist/cjs/salla-filters-widget.cjs.entry.js.map +1 -1
- package/dist/cjs/salla-filters.cjs.entry.js +8 -4
- package/dist/cjs/salla-filters.cjs.entry.js.map +1 -1
- package/dist/cjs/salla-price-range.cjs.entry.js +109 -37
- package/dist/cjs/salla-price-range.cjs.entry.js.map +1 -1
- package/dist/cjs/salla-products-list.cjs.entry.js +85 -59
- package/dist/cjs/salla-products-list.cjs.entry.js.map +1 -1
- package/dist/cjs/salla-products-slider.cjs.entry.js +12 -4
- package/dist/cjs/salla-products-slider.cjs.entry.js.map +1 -1
- package/dist/cjs/twilight.cjs.js +2 -2
- package/dist/collection/components/salla-filters/salla-filters.js +8 -4
- package/dist/collection/components/salla-filters/salla-filters.js.map +1 -1
- package/dist/collection/components/salla-filters-widget/salla-filters-widget.js +5 -27
- package/dist/collection/components/salla-filters-widget/salla-filters-widget.js.map +1 -1
- package/dist/collection/components/salla-login-modal/intefaces.js.map +1 -1
- package/dist/collection/components/salla-login-modal/salla-login-modal.js +1 -1
- package/dist/collection/components/salla-login-modal/salla-login-modal.js.map +1 -1
- package/dist/collection/components/salla-maintenance-alert/salla-maintenance-alert.js +14 -1
- package/dist/collection/components/salla-maintenance-alert/salla-maintenance-alert.js.map +1 -1
- package/dist/collection/components/salla-price-range/salla-price-range.js +152 -148
- package/dist/collection/components/salla-price-range/salla-price-range.js.map +1 -1
- package/dist/collection/components/salla-products-list/salla-products-list.js +85 -59
- package/dist/collection/components/salla-products-list/salla-products-list.js.map +1 -1
- package/dist/collection/components/salla-products-slider/salla-products-slider.js +29 -5
- package/dist/collection/components/salla-products-slider/salla-products-slider.js.map +1 -1
- package/dist/collection/components/salla-verify/salla-verify.css +12 -0
- package/dist/collection/components/salla-verify/salla-verify.js +59 -21
- package/dist/collection/components/salla-verify/salla-verify.js.map +1 -1
- package/dist/components/index.js +1 -1
- package/dist/components/index.js.map +1 -1
- package/dist/components/salla-filters-widget2.js +5 -27
- package/dist/components/salla-filters-widget2.js.map +1 -1
- package/dist/components/salla-filters.js +8 -4
- package/dist/components/salla-filters.js.map +1 -1
- package/dist/components/salla-login-modal.js +1 -1
- package/dist/components/salla-login-modal.js.map +1 -1
- package/dist/components/salla-maintenance-alert.js +14 -1
- package/dist/components/salla-maintenance-alert.js.map +1 -1
- package/dist/components/salla-price-range2.js +113 -43
- package/dist/components/salla-price-range2.js.map +1 -1
- package/dist/components/salla-products-list.js +85 -59
- package/dist/components/salla-products-list.js.map +1 -1
- package/dist/components/salla-products-slider.js +13 -5
- package/dist/components/salla-products-slider.js.map +1 -1
- package/dist/components/salla-verify2.js +60 -22
- package/dist/components/salla-verify2.js.map +1 -1
- package/dist/esm/{app-globals-663240cc.js → app-globals-3a81b4f2.js} +2 -2
- package/dist/esm/{app-globals-663240cc.js.map → app-globals-3a81b4f2.js.map} +1 -1
- package/dist/esm/loader.js +2 -2
- package/dist/esm/salla-add-product-button_40.entry.js +74 -24
- package/dist/esm/salla-add-product-button_40.entry.js.map +1 -1
- package/dist/esm/salla-filters-widget.entry.js +5 -27
- package/dist/esm/salla-filters-widget.entry.js.map +1 -1
- package/dist/esm/salla-filters.entry.js +8 -4
- package/dist/esm/salla-filters.entry.js.map +1 -1
- package/dist/esm/salla-price-range.entry.js +109 -37
- package/dist/esm/salla-price-range.entry.js.map +1 -1
- package/dist/esm/salla-products-list.entry.js +85 -59
- package/dist/esm/salla-products-list.entry.js.map +1 -1
- package/dist/esm/salla-products-slider.entry.js +12 -4
- package/dist/esm/salla-products-slider.entry.js.map +1 -1
- package/dist/esm/twilight.js +2 -2
- package/dist/esm-es5/{app-globals-663240cc.js → app-globals-3a81b4f2.js} +2 -2
- package/dist/{twilight/p-dcfa0f39.system.js.map → esm-es5/app-globals-3a81b4f2.js.map} +1 -1
- package/dist/esm-es5/loader.js +1 -1
- package/dist/esm-es5/loader.js.map +1 -1
- package/dist/esm-es5/salla-add-product-button_40.entry.js +4 -4
- package/dist/esm-es5/salla-add-product-button_40.entry.js.map +1 -1
- package/dist/esm-es5/salla-filters-widget.entry.js +1 -1
- package/dist/esm-es5/salla-filters-widget.entry.js.map +1 -1
- package/dist/esm-es5/salla-filters.entry.js +1 -1
- package/dist/esm-es5/salla-filters.entry.js.map +1 -1
- package/dist/esm-es5/salla-price-range.entry.js +2 -2
- package/dist/esm-es5/salla-price-range.entry.js.map +1 -1
- package/dist/esm-es5/salla-products-list.entry.js +2 -2
- package/dist/esm-es5/salla-products-list.entry.js.map +1 -1
- package/dist/esm-es5/salla-products-slider.entry.js +1 -1
- package/dist/esm-es5/salla-products-slider.entry.js.map +1 -1
- package/dist/esm-es5/twilight.js +1 -1
- package/dist/esm-es5/twilight.js.map +1 -1
- package/dist/twilight/{p-6948b825.js → p-1edec127.js} +2 -2
- package/dist/twilight/{p-6948b825.js.map → p-1edec127.js.map} +1 -1
- package/dist/twilight/{p-7c6638f5.system.entry.js → p-2739ddc5.system.entry.js} +2 -2
- package/dist/twilight/p-2739ddc5.system.entry.js.map +1 -0
- package/dist/twilight/p-3212e42c.entry.js +5 -0
- package/dist/twilight/p-3212e42c.entry.js.map +1 -0
- package/dist/twilight/{p-6404a9a5.system.js → p-37389934.system.js} +2 -2
- package/dist/twilight/{p-6404a9a5.system.js.map → p-37389934.system.js.map} +1 -1
- package/dist/twilight/{p-dcfa0f39.system.js → p-38496eab.system.js} +2 -2
- package/dist/{esm-es5/app-globals-663240cc.js.map → twilight/p-38496eab.system.js.map} +1 -1
- package/dist/twilight/p-3f03d17c.system.entry.js +5 -0
- package/dist/twilight/p-3f03d17c.system.entry.js.map +1 -0
- package/dist/twilight/p-46b7f931.system.entry.js +5 -0
- package/dist/twilight/p-46b7f931.system.entry.js.map +1 -0
- package/dist/twilight/p-54783694.system.entry.js +5 -0
- package/dist/twilight/p-54783694.system.entry.js.map +1 -0
- package/dist/twilight/{p-1e4abb42.system.entry.js → p-9a1231a6.system.entry.js} +2 -2
- package/dist/twilight/p-9a1231a6.system.entry.js.map +1 -0
- package/dist/twilight/{p-9713044b.entry.js → p-b766115a.entry.js} +2 -2
- package/dist/twilight/p-b766115a.entry.js.map +1 -0
- package/dist/twilight/p-cd5cb2f7.entry.js +5 -0
- package/dist/twilight/p-cd5cb2f7.entry.js.map +1 -0
- package/dist/twilight/p-d7a62fb3.system.entry.js +5 -0
- package/dist/twilight/p-d7a62fb3.system.entry.js.map +1 -0
- package/dist/twilight/p-def222e1.entry.js +5 -0
- package/dist/twilight/p-def222e1.entry.js.map +1 -0
- package/dist/twilight/p-e393f123.entry.js +5 -0
- package/dist/twilight/p-e393f123.entry.js.map +1 -0
- package/dist/twilight/p-e3dc0687.entry.js +5 -0
- package/dist/twilight/p-e3dc0687.entry.js.map +1 -0
- package/dist/twilight/twilight.esm.js +1 -1
- package/dist/twilight/twilight.esm.js.map +1 -1
- package/dist/twilight/twilight.js +1 -1
- package/dist/types/components/salla-filters-widget/salla-filters-widget.d.ts +0 -7
- package/dist/types/components/salla-login-modal/intefaces.d.ts +1 -0
- package/dist/types/components/salla-maintenance-alert/salla-maintenance-alert.d.ts +3 -0
- package/dist/types/components/salla-price-range/salla-price-range.d.ts +16 -10
- package/dist/types/components/salla-products-list/salla-products-list.d.ts +2 -2
- package/dist/types/components/salla-products-slider/salla-products-slider.d.ts +5 -1
- package/dist/types/components/salla-verify/salla-verify.d.ts +6 -1
- package/dist/types/components.d.ts +14 -8
- package/package.json +4 -4
- package/dist/twilight/p-1e4abb42.system.entry.js.map +0 -1
- package/dist/twilight/p-3b1a0059.entry.js +0 -5
- package/dist/twilight/p-3b1a0059.entry.js.map +0 -1
- package/dist/twilight/p-41b3e09d.entry.js +0 -5
- package/dist/twilight/p-41b3e09d.entry.js.map +0 -1
- package/dist/twilight/p-4a743b5e.system.entry.js +0 -5
- package/dist/twilight/p-4a743b5e.system.entry.js.map +0 -1
- package/dist/twilight/p-62c1b309.entry.js +0 -5
- package/dist/twilight/p-62c1b309.entry.js.map +0 -1
- package/dist/twilight/p-6349125a.entry.js +0 -5
- package/dist/twilight/p-6349125a.entry.js.map +0 -1
- package/dist/twilight/p-7c6638f5.system.entry.js.map +0 -1
- package/dist/twilight/p-8ee37cc6.entry.js +0 -5
- package/dist/twilight/p-8ee37cc6.entry.js.map +0 -1
- package/dist/twilight/p-9713044b.entry.js.map +0 -1
- package/dist/twilight/p-9e27da8e.system.entry.js +0 -5
- package/dist/twilight/p-9e27da8e.system.entry.js.map +0 -1
- package/dist/twilight/p-b1f8b436.system.entry.js +0 -5
- package/dist/twilight/p-b1f8b436.system.entry.js.map +0 -1
- package/dist/twilight/p-c9cdaea6.system.entry.js +0 -5
- package/dist/twilight/p-c9cdaea6.system.entry.js.map +0 -1
|
@@ -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 a}from"./p-3c7d3f26.js";import{F as l,a as r}from"./p-d3cc3770.js";const n=":host{display:block}.s-rating-stars-small{line-height:12px}.s-filters-radio{background-image:none !important}";const o=class{constructor(i){t(this,i);this.changed=s(this,"changed",7);this.isReady=false;this.filters=undefined;this.isSidebarOpen=undefined;this.filtersData={};this.apply=undefined;this.reset=undefined;salla.event.on("filters::hidden",(()=>this.host.style.display="none"));salla.lang.onLoaded((()=>{this.apply=salla.lang.get("pages.checkout.apply");this.reset=salla.lang.get("pages.categories.filters_reset")}));salla.event.on("filters::fetched",(({filters:t})=>{this.host.style.display="";let s={};this.filters=t.map((t=>{t.label={category_id:salla.lang.get("common.titles.categories"),brand_id:salla.lang.get("common.titles.brands"),rating:salla.lang.get("pages.categories.filter_rating"),price_range:salla.lang.get("pages.categories.filter_price")}[t.key]||t.label;t.inputType=l.CHECKBOX;if(t.key=="rating"){t.inputType=l.RADIO;let{max:s,min:i}=t.values;t.values=[1,2,3,4,5].filter((t=>t>=i||t<=s))}if(this.filtersData[t.key]){s[t.key]=this.filtersData[t.key]}return t}));this.filtersData=s}))}connectedCallback(){try{let t=new URLSearchParams(window.location.search).get("filters");this.filtersData=t?JSON.parse(decodeURIComponent(t)):{}}catch(t){salla.logger.warn("failed to get filters from url",t.message)}}async getFilters(){return this.filtersData}async applyFilters(){if(!this.isReady){return}window.history.pushState({},"",salla.url.addParamToUrl("filters",encodeURIComponent(JSON.stringify(this.filtersData))));salla.event.emit("salla-filters::changed",this.filtersData);this.changed.emit(this.filtersData)}async resetFilters(){this.filtersData={};this.host.childNodes.forEach((t=>t.reset&&t.reset()));salla.event.emit("salla-filters::reset");return this.applyFilters()}handleOptionChange(t,s,i){if(s.type===r.RANGE){this.filtersData[s.key]=i;return}let e=t.target.checked;if(t.target.type==l.RADIO){e&&(this.filtersData[s.key]=i);e||delete this.filtersData[s.key];return}this.filtersData[s.key]=this.filtersData[s.key]||[];if(e){this.filtersData[s.key].push(i);return}this.filtersData[s.key]=this.filtersData[s.key].filter((t=>t!=i))}render(){var t,s;return i(e,null,(t=this.filters)===null||t===void 0?void 0:t.map((t=>i("salla-filters-widget",{option:t,filtersData:this.filtersData,onChanged:({detail:{event:t,option:s,value:i}})=>this.handleOptionChange(t,s,i)}))),((s=this.filters)===null||s===void 0?void 0:s.length)&&i("div",{class:"s-filters-footer"},i("salla-button",{color:"primary",onClick:()=>this.applyFilters()},this.apply),i("salla-button",{color:"gray",fill:"outline",onClick:()=>this.resetFilters()},this.reset)))}componentDidLoad(){this.isReady=true}get host(){return a(this)}};o.style=n;export{o as salla_filters};
|
|
5
|
-
//# sourceMappingURL=p-3b1a0059.entry.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"names":["sallaFiltersCss","SallaFilters","constructor","hostRef","this","isReady","salla","event","on","host","style","display","lang","onLoaded","apply","get","reset","filters","freshFilterData","map","filter","label","category_id","brand_id","rating","price_range","key","inputType","FilterOptionInputType","CHECKBOX","RADIO","max","min","values","stars","filtersData","connectedCallback","URLSearchParams","window","location","search","JSON","parse","decodeURIComponent","e","logger","warn","message","async","history","pushState","url","addParamToUrl","encodeURIComponent","stringify","emit","changed","childNodes","forEach","widget","applyFilters","handleOptionChange","option","value","type","FilterOptionTypes","RANGE","isChecked","target","checked","push","val","render","h","Host","_a","onChanged","detail","_b","length","class","color","onClick","fill","resetFilters","componentDidLoad"],"sources":["./src/components/salla-filters/salla-filters.scss?tag=salla-filters","./src/components/salla-filters/salla-filters.tsx"],"sourcesContent":[":host {\n display: block;\n}\n\n.s-rating-stars-small {\n line-height: 12px;\n}\n.s-filters-radio{\n background-image: none !important;\n}","import {Component, Element, h, Event, EventEmitter, Host, Method, Prop, State} from '@stencil/core';\nimport {Filter, FilterOptionInputType, FilterOptionTypes} from \"./interfaces\";\n\n//todo::\n\n\n@Component({\n tag: 'salla-filters',\n styleUrl: 'salla-filters.scss',\n})\nexport class SallaFilters {\n\n constructor() {\n salla.event.on('filters::hidden', () => this.host.style.display = 'none');\n\n salla.lang.onLoaded(() => {\n this.apply = salla.lang.get('pages.checkout.apply');\n this.reset = salla.lang.get('pages.categories.filters_reset');\n });\n\n salla.event.on('filters::fetched', ({filters}) => {\n this.host.style.display = '';\n let freshFilterData = {};\n this.filters = filters\n .map((filter: Filter) => {\n filter.label = {\n category_id: salla.lang.get('common.titles.categories'),\n brand_id: salla.lang.get('common.titles.brands'),\n rating: salla.lang.get('pages.categories.filter_rating'),\n price_range: salla.lang.get('pages.categories.filter_price'),\n }[filter.key] || filter.label;\n filter.inputType = FilterOptionInputType.CHECKBOX;\n if (filter.key == 'rating') {\n filter.inputType = FilterOptionInputType.RADIO;\n //@ts-ignore\n let {max, min} = filter.values;\n //@ts-ignore\n filter.values = [1, 2, 3, 4, 5].filter(stars => stars >= min || stars <= max)\n }\n\n //when getting new filters, maybe less than we had, so let's get from the old one, only what is existed now.\n if (this.filtersData[filter.key]) {\n freshFilterData[filter.key] = this.filtersData[filter.key];\n }\n\n return filter;\n });\n this.filtersData = freshFilterData;\n });\n }\n\n connectedCallback() {\n try {\n let filters = (new URLSearchParams(window.location.search)).get('filters')\n this.filtersData = filters ? JSON.parse(decodeURIComponent(filters)) : {};\n } catch (e) {\n salla.logger.warn('failed to get filters from url', e.message);\n }\n }\n\n @Element() host: HTMLElement;\n @Prop({reflect: true, mutable: true}) filters?: Filter[];\n private isReady = false;//to avoid triggering the changed event\n @State() isSidebarOpen: boolean;\n @State() filtersData: object = {}\n @State() apply: string;\n @State() reset: string;\n @Event() changed: EventEmitter;\n\n //TODO:: move all @methods into one section\n @Method()\n async getFilters() {\n return this.filtersData;\n }\n\n @Method()\n async applyFilters() {\n if (!this.isReady) {\n return;\n }\n window.history.pushState({}, '', salla.url.addParamToUrl('filters', encodeURIComponent(JSON.stringify(this.filtersData))));\n salla.event.emit('salla-filters::changed', this.filtersData);\n this.changed.emit(this.filtersData);\n }\n\n @Method()\n async resetFilters() {\n this.filtersData = {};\n this.host.childNodes.forEach((widget: HTMLSallaFiltersWidgetElement) => widget.reset && widget.reset())\n salla.event.emit('salla-filters::reset');\n return this.applyFilters();\n }\n\n /**\n * @param {{target:HTMLInputElement}} event\n * @param option\n * @param value\n * @private\n */\n private handleOptionChange(event, option: Filter, value) {\n if (option.type === FilterOptionTypes.RANGE) {\n this.filtersData[option.key] = value;\n return;\n }\n let isChecked = event.target.checked;\n if (event.target.type == FilterOptionInputType.RADIO) {\n isChecked && (this.filtersData[option.key] = value);\n isChecked || (delete this.filtersData[option.key]);\n return;\n }\n\n //it's checkbox\n this.filtersData[option.key] = this.filtersData[option.key] || [];\n if (isChecked) {\n this.filtersData[option.key].push(value);\n return;\n }\n this.filtersData[option.key] = this.filtersData[option.key].filter(val => val != value);\n }\n\n render() {\n return <Host>\n {this.filters?.map(option => <salla-filters-widget\n option={option}\n filtersData={this.filtersData}\n onChanged={({detail: {event, option, value}}) => this.handleOptionChange(event, option, value)}/>)}\n\n {this.filters?.length && <div class=\"s-filters-footer\">\n <salla-button color='primary' onClick={() => this.applyFilters()}>{this.apply}</salla-button>\n <salla-button color='gray' fill='outline' onClick={() => this.resetFilters()}>{this.reset}</salla-button>\n </div>}\n </Host>;\n }\n\n componentDidLoad() {\n this.isReady = true;\n }\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-3c7d3f26.js";import{a as r}from"./p-201c8085.js";const l=`\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 a="";const n=class{constructor(t){s(this,t);this.source=undefined;this.sourceValue=undefined;this.limit=undefined;this.sortBy=undefined;this.filtersResults=undefined;this.horizontalCards=undefined;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;salla.onReady((()=>{this.hasCustomComponent=!!customElements.get("custom-salla-product-card");this.sourceValueIsValid=!!(this.getSourceValue()||this.isSourceWithoutValue());this.hasInfiniteScroll=!["json","selected","related","landing-page"].includes(this.getSource());this.buildNextPageUrl();this.createStatusDom();this.isReady=true}));if(!this.sourceValueIsValid){salla.logger.warn(`source-value prop is required for source [${this.getSource()}]`);return}salla.event.on("salla-filters::changed",(s=>this.setFilters(s)))}connectedCallback(){try{let s=new URLSearchParams(window.location.search);this.sortBy=this.sortBy||s.get("sort")||s.get("by");let t=s.get("filters");this.parsedFilters=t?JSON.parse(decodeURIComponent(t)):{}}catch(s){salla.logger.warn("failed to get filters from url",s.message)}}async setFilters(s){this.parsedFilters=s;return this.reload()}async reload(){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(){r({targets:"salla-products-list salla-product-card",opacity:[0,1],duration:1200,translateY:[20,0],delay:function(s,t){return t*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")}))}buildNextPageUrl(){let s=this.getSource();if(s==="json"){return}let t=this.getUrlPrefix();if(this.isSourceWithoutValue()){this.nextPage=salla.url.api(`products?source=${s}${t}`);return}if(["search","related","landing-page"].includes(s)){this.nextPage=salla.url.api(`products?source=${s}&source_value=${this.getSourceValue()}${t}`);return}try{this.nextPage=salla.url.api(`products?source=${s}&source_value[]=${this.getSourceValue().join("&source_value[]=")}${t}`)}catch(t){salla.logger.warn(`source-value prop should be array of ids ex source-value="[1,2,3]" for the source [${s}]`);this.sourceValueIsValid=false}}getUrlPrefix(){let s="";if(this.limit){s=`&per_page=${this.limit>32?32:this.limit}`}if(this.sortBy){s=`&sort=${this.sortBy}`}if(!this.isFilterable()){return s}s+="&filterable=1";for(const[t,i]of Object.entries(this.parsedFilters||{})){if(typeof i=="string"){s+=`&filters[${t}]=${i}`}else if(Array.isArray(i)){i.forEach((i=>{s+=`&filters[${t}][]=${i}}`}))}}return s}getSource(){return{"brands.single":"brands","product.index":"categories","product.index.latest":"latest","product.index.offers":"offers","product.index.search":"search","landing-page":"landing-page","product.index.tag":"tags","product.index.sales":"sales","components.most_sales_products":"sales"}[this.source||salla.config.get("page.slug")]||this.source||"latest"}getSourceValue(){let s=this.getSource();if(!["search","json","offers","latest","sales"].includes(s)){if(this.sourceValue&&Array.isArray(JSON.parse(this.sourceValue))&&JSON.parse(this.sourceValue).length){return JSON.parse(this.sourceValue)}if(this.sourceValue&&typeof JSON.parse(this.sourceValue)=="number"){return[JSON.parse(this.sourceValue)]}if(!this.sourceValue&&["categories","tags","brands","landing-page"].includes(this.getSource())){return[salla.config.get("page.id")]}}if(this.sourceValue){return this.sourceValue}if(s==="search"){return new URLSearchParams(window.location.search).get("q")}return salla.config.get("page.id")}loading(s=true){this.btnLoader.style.display=s?"inherit":"none"}getItemHTML(s){let t=this.hasCustomComponent?"custom-salla-product-card":"salla-product-card";let i=document.createElement(t);i.product=s;if(this.getSource()=="landing-page"&&!this.hasCustomComponent){i.toggleAttribute("hide-add-btn",true);i.classList.add("s-product-card-fit-height")}if(this.horizontalCards&&!this.hasCustomComponent){i.toggleAttribute("horizontal",true)}i.toggleAttribute("shadow-on-hover",true);return i}initiateInfiniteScroll(){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);this.infiniteScroll.on("request",(()=>this.loading()));this.infiniteScroll.on("load",(s=>this.infiniteScroll.appendItems(this.handleResponse(s))));this.infiniteScroll.on("error",(()=>{this.status.querySelector(".s-infinite-scroll-error").classList.remove("s-hidden");this.loading(false)}))}canRender(){return this.sourceValueIsValid&&this.isReady}render(){if(!this.canRender()){return""}if(this.showPlaceholder){return t("div",{class:"s-products-list-placeholder"},t("span",{innerHTML:l}),t("p",null,this.placeholderText))}return t(i,{class:"s-products-list"},t("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:s=>this.wrapper=s}))}componentDidLoad(){if(!this.canRender()){return}if(this.getSource()==="json"){if(!this.getSourceValue().length){this.showPlaceholder=true;return}this.getSourceValue().map((s=>this.wrapper.append(this.getItemHTML(s))));return}this.init()}init(){this.initiateInfiniteScroll();this.loading();salla.product.fetch({source:this.getSource(),source_value:this.getSourceValue(),filters:this.parsedFilters,limit:this.limit,filterable:this.isFilterable()?1:0,sort:this.sortBy}).then((s=>{var t;if(!((t=s.data)===null||t===void 0?void 0:t.length)){this.showPlaceholder=true;this.loading(false);return}this.handleResponse(s).forEach((s=>this.wrapper.append(s)));this.animateItems()}))}handleResponse(s){var t;if(s.filters&&this.isFilterable()){salla.event.emit("filters::fetched",{filters:s.filters})}else if(this.isFilterable()){salla.event.emit("filters::hidden")}this.nextPage=s.cursor?s.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((t=s.data)===null||t===void 0?void 0:t.map((s=>this.getItemHTML(s))))||[]}get host(){return e(this)}};n.style=a;export{n as salla_products_list};
|
|
5
|
-
//# sourceMappingURL=p-41b3e09d.entry.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"names":["sallaProductsListCss","SallaProductsList","constructor","hostRef","salla","onReady","this","hasCustomComponent","customElements","get","sourceValueIsValid","getSourceValue","isSourceWithoutValue","hasInfiniteScroll","includes","getSource","buildNextPageUrl","createStatusDom","isReady","logger","warn","event","on","filters","setFilters","connectedCallback","searchParams","URLSearchParams","window","location","search","sortBy","parsedFilters","JSON","parse","decodeURIComponent","e","message","async","reload","wrapper","innerHTML","init","isFilterable","config","filtersResults","animateItems","anime","targets","opacity","duration","translateY","delay","_el","i","status","document","createElement","className","lang","btnLoader","querySelector","onLoaded","placeholderText","source","urlPrefix","getUrlPrefix","nextPage","url","api","join","limit","key","value","Object","entries","Array","isArray","forEach","item","sourceValue","length","loading","isLoading","style","display","getItemHTML","product","customComponentTag","customComponent","toggleAttribute","classList","add","horizontalCards","initiateInfiniteScroll","host","insertAdjacentElement","infiniteScroll","initiate","path","history","scrollThreshold","response","appendItems","handleResponse","remove","canRender","render","showPlaceholder","h","class","ShoppingBag","Host","ref","componentDidLoad","map","append","fetch","source_value","filterable","sort","then","res","_a","data","card","emit","cursor","next","option","loadOnScroll"],"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} from '@stencil/core';\nimport anime from 'animejs';\nimport ShoppingBag from '../../assets/svg/shopping-bag.svg';\n\n@Component({\n tag: 'salla-products-list',\n styleUrl: 'salla-products-list.scss'\n})\nexport class SallaProductsList {\n constructor() {\n salla.onReady(() => {\n this.hasCustomComponent = !!customElements.get('custom-salla-product-card');\n this.sourceValueIsValid = !!(this.getSourceValue() || this.isSourceWithoutValue());\n this.hasInfiniteScroll = !['json', 'selected', 'related', 'landing-page'].includes(this.getSource());\n\n this.buildNextPageUrl();\n this.createStatusDom();\n this.isReady = true;\n });\n\n if (!this.sourceValueIsValid) {\n salla.logger.warn(`source-value prop is required for source [${this.getSource()}]`);\n return;\n }\n salla.event.on('salla-filters::changed', filters => this.setFilters(filters))\n }\n\n connectedCallback() {\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 }\n\n @Method()\n async setFilters(filters) {\n this.parsedFilters = filters;\n return this.reload();\n }\n\n\n @Method()\n async reload() {\n this.buildNextPageUrl();\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 // 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 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 buildNextPageUrl() {\n let source = this.getSource();\n if (source === 'json') {\n return;\n }\n let urlPrefix = this.getUrlPrefix();\n if (this.isSourceWithoutValue()) {\n this.nextPage = salla.url.api(`products?source=${source}${urlPrefix}`);\n return;\n }\n\n if (['search', 'related', 'landing-page'].includes(source)) {\n this.nextPage = salla.url.api(`products?source=${source}&source_value=${this.getSourceValue()}${urlPrefix}`);\n return;\n }\n\n try {\n this.nextPage = salla.url.api(`products?source=${source}&source_value[]=${this.getSourceValue().join('&source_value[]=')}${urlPrefix}`);\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 private getUrlPrefix() {\n let urlPrefix = '';\n if (this.limit) {\n urlPrefix = `&per_page=${this.limit > 32 ? 32 : this.limit}`;\n }\n if (this.sortBy) {\n urlPrefix = `&sort=${this.sortBy}`;\n }\n if (!this.isFilterable()) {\n return urlPrefix;\n }\n urlPrefix += '&filterable=1';\n for (const [key, value] of Object.entries(this.parsedFilters || {})) {\n if (typeof value == \"string\") {\n urlPrefix += `&filters[${key}]=${value}`;\n } else if (Array.isArray(value)) {\n (value as any).forEach(item => {\n urlPrefix += `&filters[${key}][]=${item}}`\n })\n }\n }\n return urlPrefix;\n }\n\n private getSource() {\n return {\n 'brands.single': 'brands',\n 'product.index': 'categories',\n 'product.index.latest': 'latest',\n 'product.index.offers': 'offers',\n 'product.index.search': 'search',\n 'landing-page': 'landing-page',\n 'product.index.tag': 'tags',\n 'product.index.sales': 'sales',\n 'components.most_sales_products': 'sales',//temporary, delete it after two days from now\n }[this.source || salla.config.get('page.slug')] || this.source || 'latest';\n }\n\n private getSourceValue() {\n let source = this.getSource();\n\n //todo:: enhance this code, it call JSON.parse too many times.\n if (!['search', 'json', 'offers', 'latest', 'sales'].includes(source)) {\n if (this.sourceValue && Array.isArray(JSON.parse(this.sourceValue)) && JSON.parse(this.sourceValue).length) {\n return JSON.parse(this.sourceValue);\n }\n\n if (this.sourceValue && typeof JSON.parse(this.sourceValue) == 'number') {\n return [JSON.parse(this.sourceValue)];\n }\n if (!this.sourceValue && ['categories', 'tags', 'brands', 'landing-page'].includes(this.getSource())) {\n return [salla.config.get('page.id')];\n }\n }\n\n if (this.sourceValue) {\n return this.sourceValue;\n }\n\n\n if (source === 'search') {\n return (new URLSearchParams(window.location.search)).get('q');\n }\n\n return salla.config.get('page.id');\n }\n\n\n private loading(isLoading = true) {\n this.btnLoader.style.display = isLoading ? 'inherit' : 'none';\n }\n\n private getItemHTML(product) {\n let customComponentTag: string = this.hasCustomComponent ? 'custom-salla-product-card' : 'salla-product-card';\n let customComponent: HTMLSallaProductCardElement = document.createElement(customComponentTag) as HTMLSallaProductCardElement;\n customComponent.product = product;\n // customComponent.setAttribute('product', JSON.stringify(product));\n if (this.getSource() == 'landing-page' && !this.hasCustomComponent) {\n customComponent.toggleAttribute('hide-add-btn', true);\n customComponent.classList.add('s-product-card-fit-height');\n }\n if (this.horizontalCards && !this.hasCustomComponent) {\n customComponent.toggleAttribute('horizontal', true);\n }\n customComponent.toggleAttribute('shadow-on-hover', true);\n return customComponent;\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 => this.infiniteScroll.appendItems(this.handleResponse(response)))\n this.infiniteScroll.on('error', () => {\n this.status.querySelector('.s-infinite-scroll-error').classList.remove('s-hidden')\n this.loading(false);\n });\n }\n\n private canRender() {\n return this.sourceValueIsValid && this.isReady;\n }\n\n render() {\n if (!this.canRender()) {\n return '';\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 if (!this.canRender()) {\n return;\n }\n if (this.getSource() === 'json') {\n if (!this.getSourceValue().length) {\n this.showPlaceholder = true;\n return;\n }\n this.getSourceValue().map(product => this.wrapper.append(this.getItemHTML(product)));\n return;\n }\n this.init();\n }\n\n private init() {\n this.initiateInfiniteScroll();\n this.loading();\n salla.product.fetch({\n source: this.getSource(),\n source_value: this.getSourceValue(),\n filters: this.parsedFilters,\n limit: this.limit,\n filterable: this.isFilterable() ? 1 : 0,\n sort: this.sortBy,\n })\n .then(res => {\n if (!res.data?.length) {\n this.showPlaceholder = true;\n this.loading(false);\n return;\n }\n this.handleResponse(res).forEach(card => this.wrapper.append(card));\n this.animateItems();\n })\n }\n\n private handleResponse(response): Array<HTMLElement> {\n //💡 when source is related, cursor will not be existed\n if (response.filters && this.isFilterable()) {\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
|
-
var __awaiter=this&&this.__awaiter||function(t,e,r,s){function i(t){return t instanceof r?t:new r((function(e){e(t)}))}return new(r||(r=Promise))((function(r,n){function o(t){try{l(s.next(t))}catch(t){n(t)}}function a(t){try{l(s["throw"](t))}catch(t){n(t)}}function l(t){t.done?r(t.value):i(t.value).then(o,a)}l((s=s.apply(t,e||[])).next())}))};var __generator=this&&this.__generator||function(t,e){var r={label:0,sent:function(){if(n[0]&1)throw n[1];return n[1]},trys:[],ops:[]},s,i,n,o;return o={next:a(0),throw:a(1),return:a(2)},typeof Symbol==="function"&&(o[Symbol.iterator]=function(){return this}),o;function a(t){return function(e){return l([t,e])}}function l(a){if(s)throw new TypeError("Generator is already executing.");while(o&&(o=0,a[0]&&(r=0)),r)try{if(s=1,i&&(n=a[0]&2?i["return"]:a[0]?i["throw"]||((n=i["return"])&&n.call(i),0):i.next)&&!(n=n.call(i,a[1])).done)return n;if(i=0,n)a=[a[0]&2,n.value];switch(a[0]){case 0:case 1:n=a;break;case 4:r.label++;return{value:a[1],done:false};case 5:r.label++;i=a[1];a=[0];continue;case 7:a=r.ops.pop();r.trys.pop();continue;default:if(!(n=r.trys,n=n.length>0&&n[n.length-1])&&(a[0]===6||a[0]===2)){r=0;continue}if(a[0]===3&&(!n||a[1]>n[0]&&a[1]<n[3])){r.label=a[1];break}if(a[0]===6&&r.label<n[1]){r.label=n[1];n=a;break}if(n&&r.label<n[2]){r.label=n[2];r.ops.push(a);break}if(n[2])r.ops.pop();r.trys.pop();continue}a=e.call(t,r)}catch(t){a=[6,t];i=0}finally{s=n=0}if(a[0]&5)throw a[1];return{value:a[0]?a[1]:void 0,done:true}}};
|
|
2
|
-
/*!
|
|
3
|
-
* Crafted with ❤ by Salla
|
|
4
|
-
*/System.register(["./p-5ee0461b.system.js","./p-f6803599.system.js"],(function(t){"use strict";var e,r,s,i,n;return{setters:[function(t){e=t.r;r=t.h;s=t.H;i=t.g},function(t){n=t.a}],execute:function(){var 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';var a="";var l=t("salla_products_list",function(){function t(t){var r=this;e(this,t);this.source=undefined;this.sourceValue=undefined;this.limit=undefined;this.sortBy=undefined;this.filtersResults=undefined;this.horizontalCards=undefined;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;salla.onReady((function(){r.hasCustomComponent=!!customElements.get("custom-salla-product-card");r.sourceValueIsValid=!!(r.getSourceValue()||r.isSourceWithoutValue());r.hasInfiniteScroll=!["json","selected","related","landing-page"].includes(r.getSource());r.buildNextPageUrl();r.createStatusDom();r.isReady=true}));if(!this.sourceValueIsValid){salla.logger.warn("source-value prop is required for source [".concat(this.getSource(),"]"));return}salla.event.on("salla-filters::changed",(function(t){return r.setFilters(t)}))}t.prototype.connectedCallback=function(){try{var t=new URLSearchParams(window.location.search);this.sortBy=this.sortBy||t.get("sort")||t.get("by");var e=t.get("filters");this.parsedFilters=e?JSON.parse(decodeURIComponent(e)):{}}catch(t){salla.logger.warn("failed to get filters from url",t.message)}};t.prototype.setFilters=function(t){return __awaiter(this,void 0,void 0,(function(){return __generator(this,(function(e){this.parsedFilters=t;return[2,this.reload()]}))}))};t.prototype.reload=function(){return __awaiter(this,void 0,void 0,(function(){return __generator(this,(function(t){this.buildNextPageUrl();this.wrapper.innerHTML="";this.init();return[2]}))}))};t.prototype.isFilterable=function(){return salla.config.get("store.settings.product.filters")&&this.filtersResults};t.prototype.isSourceWithoutValue=function(){return["offers","latest","sales"].includes(this.getSource())};t.prototype.animateItems=function(){n({targets:"salla-products-list salla-product-card",opacity:[0,1],duration:1200,translateY:[20,0],delay:function(t,e){return e*100}})};t.prototype.createStatusDom=function(){var t=this;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" >'.concat(salla.lang.get("common.elements.end_of_content"),'</p>\n <p class="s-infinite-scroll-error infinite-scroll-error s-hidden">').concat(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((function(){t.status.querySelector(".s-infinite-scroll-last").innerHTML=salla.lang.get("common.elements.end_of_content");t.status.querySelector(".s-infinite-scroll-error").innerHTML=salla.lang.get("common.elements.failed_to_load_more");t.placeholderText=salla.lang.get("pages.categories.no_products")}))};t.prototype.buildNextPageUrl=function(){var t=this.getSource();if(t==="json"){return}var e=this.getUrlPrefix();if(this.isSourceWithoutValue()){this.nextPage=salla.url.api("products?source=".concat(t).concat(e));return}if(["search","related","landing-page"].includes(t)){this.nextPage=salla.url.api("products?source=".concat(t,"&source_value=").concat(this.getSourceValue()).concat(e));return}try{this.nextPage=salla.url.api("products?source=".concat(t,"&source_value[]=").concat(this.getSourceValue().join("&source_value[]=")).concat(e))}catch(e){salla.logger.warn('source-value prop should be array of ids ex source-value="[1,2,3]" for the source ['.concat(t,"]"));this.sourceValueIsValid=false}};t.prototype.getUrlPrefix=function(){var t="";if(this.limit){t="&per_page=".concat(this.limit>32?32:this.limit)}if(this.sortBy){t="&sort=".concat(this.sortBy)}if(!this.isFilterable()){return t}t+="&filterable=1";var e=function(e,r){if(typeof r=="string"){t+="&filters[".concat(e,"]=").concat(r)}else if(Array.isArray(r)){r.forEach((function(r){t+="&filters[".concat(e,"][]=").concat(r,"}")}))}};for(var r=0,s=Object.entries(this.parsedFilters||{});r<s.length;r++){var i=s[r],n=i[0],o=i[1];e(n,o)}return t};t.prototype.getSource=function(){return{"brands.single":"brands","product.index":"categories","product.index.latest":"latest","product.index.offers":"offers","product.index.search":"search","landing-page":"landing-page","product.index.tag":"tags","product.index.sales":"sales","components.most_sales_products":"sales"}[this.source||salla.config.get("page.slug")]||this.source||"latest"};t.prototype.getSourceValue=function(){var t=this.getSource();if(!["search","json","offers","latest","sales"].includes(t)){if(this.sourceValue&&Array.isArray(JSON.parse(this.sourceValue))&&JSON.parse(this.sourceValue).length){return JSON.parse(this.sourceValue)}if(this.sourceValue&&typeof JSON.parse(this.sourceValue)=="number"){return[JSON.parse(this.sourceValue)]}if(!this.sourceValue&&["categories","tags","brands","landing-page"].includes(this.getSource())){return[salla.config.get("page.id")]}}if(this.sourceValue){return this.sourceValue}if(t==="search"){return new URLSearchParams(window.location.search).get("q")}return salla.config.get("page.id")};t.prototype.loading=function(t){if(t===void 0){t=true}this.btnLoader.style.display=t?"inherit":"none"};t.prototype.getItemHTML=function(t){var e=this.hasCustomComponent?"custom-salla-product-card":"salla-product-card";var r=document.createElement(e);r.product=t;if(this.getSource()=="landing-page"&&!this.hasCustomComponent){r.toggleAttribute("hide-add-btn",true);r.classList.add("s-product-card-fit-height")}if(this.horizontalCards&&!this.hasCustomComponent){r.toggleAttribute("horizontal",true)}r.toggleAttribute("shadow-on-hover",true);return r};t.prototype.initiateInfiniteScroll=function(){var t=this;if(!this.hasInfiniteScroll){return}this.host.insertAdjacentElement("beforeend",this.status);this.infiniteScroll=salla.infiniteScroll.initiate(this.wrapper,this.wrapper,{path:function(){return t.nextPage},history:false,nextPage:this.nextPage,scrollThreshold:100},true);this.infiniteScroll.on("request",(function(){return t.loading()}));this.infiniteScroll.on("load",(function(e){return t.infiniteScroll.appendItems(t.handleResponse(e))}));this.infiniteScroll.on("error",(function(){t.status.querySelector(".s-infinite-scroll-error").classList.remove("s-hidden");t.loading(false)}))};t.prototype.canRender=function(){return this.sourceValueIsValid&&this.isReady};t.prototype.render=function(){var t=this;if(!this.canRender()){return""}if(this.showPlaceholder){return r("div",{class:"s-products-list-placeholder"},r("span",{innerHTML:o}),r("p",null,this.placeholderText))}return r(s,{class:"s-products-list"},r("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:function(e){return t.wrapper=e}}))};t.prototype.componentDidLoad=function(){var t=this;if(!this.canRender()){return}if(this.getSource()==="json"){if(!this.getSourceValue().length){this.showPlaceholder=true;return}this.getSourceValue().map((function(e){return t.wrapper.append(t.getItemHTML(e))}));return}this.init()};t.prototype.init=function(){var t=this;this.initiateInfiniteScroll();this.loading();salla.product.fetch({source:this.getSource(),source_value:this.getSourceValue(),filters:this.parsedFilters,limit:this.limit,filterable:this.isFilterable()?1:0,sort:this.sortBy}).then((function(e){var r;if(!((r=e.data)===null||r===void 0?void 0:r.length)){t.showPlaceholder=true;t.loading(false);return}t.handleResponse(e).forEach((function(e){return t.wrapper.append(e)}));t.animateItems()}))};t.prototype.handleResponse=function(t){var e=this;var r;if(t.filters&&this.isFilterable()){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((r=t.data)===null||r===void 0?void 0:r.map((function(t){return e.getItemHTML(t)})))||[]};Object.defineProperty(t.prototype,"host",{get:function(){return i(this)},enumerable:false,configurable:true});return t}());l.style=a}}}));
|
|
5
|
-
//# sourceMappingURL=p-4a743b5e.system.entry.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"names":["sallaProductsListCss","SallaProductsList","exports","class_1","hostRef","_this","this","salla","onReady","hasCustomComponent","customElements","get","sourceValueIsValid","getSourceValue","isSourceWithoutValue","hasInfiniteScroll","includes","getSource","buildNextPageUrl","createStatusDom","isReady","logger","warn","concat","event","on","filters","setFilters","prototype","connectedCallback","searchParams","URLSearchParams","window","location","search","sortBy","parsedFilters","JSON","parse","decodeURIComponent","e","message","reload","wrapper","innerHTML","init","isFilterable","config","filtersResults","animateItems","anime","targets","opacity","duration","translateY","delay","_el","i","status","document","createElement","className","lang","btnLoader","querySelector","onLoaded","placeholderText","source","urlPrefix","getUrlPrefix","nextPage","url","api","join","limit","key","value","Array","isArray","forEach","item","_i","_b","Object","entries","length","_c","sourceValue","loading","isLoading","style","display","getItemHTML","product","customComponentTag","customComponent","toggleAttribute","classList","add","horizontalCards","initiateInfiniteScroll","host","insertAdjacentElement","infiniteScroll","initiate","path","history","scrollThreshold","response","appendItems","handleResponse","remove","canRender","render","showPlaceholder","h","class","ShoppingBag","Host","ref","componentDidLoad","map","append","fetch","source_value","filterable","sort","then","res","_a","data","card","emit","cursor","next","option","loadOnScroll"],"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} from '@stencil/core';\nimport anime from 'animejs';\nimport ShoppingBag from '../../assets/svg/shopping-bag.svg';\n\n@Component({\n tag: 'salla-products-list',\n styleUrl: 'salla-products-list.scss'\n})\nexport class SallaProductsList {\n constructor() {\n salla.onReady(() => {\n this.hasCustomComponent = !!customElements.get('custom-salla-product-card');\n this.sourceValueIsValid = !!(this.getSourceValue() || this.isSourceWithoutValue());\n this.hasInfiniteScroll = !['json', 'selected', 'related', 'landing-page'].includes(this.getSource());\n\n this.buildNextPageUrl();\n this.createStatusDom();\n this.isReady = true;\n });\n\n if (!this.sourceValueIsValid) {\n salla.logger.warn(`source-value prop is required for source [${this.getSource()}]`);\n return;\n }\n salla.event.on('salla-filters::changed', filters => this.setFilters(filters))\n }\n\n connectedCallback() {\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 }\n\n @Method()\n async setFilters(filters) {\n this.parsedFilters = filters;\n return this.reload();\n }\n\n\n @Method()\n async reload() {\n this.buildNextPageUrl();\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 // 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 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 buildNextPageUrl() {\n let source = this.getSource();\n if (source === 'json') {\n return;\n }\n let urlPrefix = this.getUrlPrefix();\n if (this.isSourceWithoutValue()) {\n this.nextPage = salla.url.api(`products?source=${source}${urlPrefix}`);\n return;\n }\n\n if (['search', 'related', 'landing-page'].includes(source)) {\n this.nextPage = salla.url.api(`products?source=${source}&source_value=${this.getSourceValue()}${urlPrefix}`);\n return;\n }\n\n try {\n this.nextPage = salla.url.api(`products?source=${source}&source_value[]=${this.getSourceValue().join('&source_value[]=')}${urlPrefix}`);\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 private getUrlPrefix() {\n let urlPrefix = '';\n if (this.limit) {\n urlPrefix = `&per_page=${this.limit > 32 ? 32 : this.limit}`;\n }\n if (this.sortBy) {\n urlPrefix = `&sort=${this.sortBy}`;\n }\n if (!this.isFilterable()) {\n return urlPrefix;\n }\n urlPrefix += '&filterable=1';\n for (const [key, value] of Object.entries(this.parsedFilters || {})) {\n if (typeof value == \"string\") {\n urlPrefix += `&filters[${key}]=${value}`;\n } else if (Array.isArray(value)) {\n (value as any).forEach(item => {\n urlPrefix += `&filters[${key}][]=${item}}`\n })\n }\n }\n return urlPrefix;\n }\n\n private getSource() {\n return {\n 'brands.single': 'brands',\n 'product.index': 'categories',\n 'product.index.latest': 'latest',\n 'product.index.offers': 'offers',\n 'product.index.search': 'search',\n 'landing-page': 'landing-page',\n 'product.index.tag': 'tags',\n 'product.index.sales': 'sales',\n 'components.most_sales_products': 'sales',//temporary, delete it after two days from now\n }[this.source || salla.config.get('page.slug')] || this.source || 'latest';\n }\n\n private getSourceValue() {\n let source = this.getSource();\n\n //todo:: enhance this code, it call JSON.parse too many times.\n if (!['search', 'json', 'offers', 'latest', 'sales'].includes(source)) {\n if (this.sourceValue && Array.isArray(JSON.parse(this.sourceValue)) && JSON.parse(this.sourceValue).length) {\n return JSON.parse(this.sourceValue);\n }\n\n if (this.sourceValue && typeof JSON.parse(this.sourceValue) == 'number') {\n return [JSON.parse(this.sourceValue)];\n }\n if (!this.sourceValue && ['categories', 'tags', 'brands', 'landing-page'].includes(this.getSource())) {\n return [salla.config.get('page.id')];\n }\n }\n\n if (this.sourceValue) {\n return this.sourceValue;\n }\n\n\n if (source === 'search') {\n return (new URLSearchParams(window.location.search)).get('q');\n }\n\n return salla.config.get('page.id');\n }\n\n\n private loading(isLoading = true) {\n this.btnLoader.style.display = isLoading ? 'inherit' : 'none';\n }\n\n private getItemHTML(product) {\n let customComponentTag: string = this.hasCustomComponent ? 'custom-salla-product-card' : 'salla-product-card';\n let customComponent: HTMLSallaProductCardElement = document.createElement(customComponentTag) as HTMLSallaProductCardElement;\n customComponent.product = product;\n // customComponent.setAttribute('product', JSON.stringify(product));\n if (this.getSource() == 'landing-page' && !this.hasCustomComponent) {\n customComponent.toggleAttribute('hide-add-btn', true);\n customComponent.classList.add('s-product-card-fit-height');\n }\n if (this.horizontalCards && !this.hasCustomComponent) {\n customComponent.toggleAttribute('horizontal', true);\n }\n customComponent.toggleAttribute('shadow-on-hover', true);\n return customComponent;\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 => this.infiniteScroll.appendItems(this.handleResponse(response)))\n this.infiniteScroll.on('error', () => {\n this.status.querySelector('.s-infinite-scroll-error').classList.remove('s-hidden')\n this.loading(false);\n });\n }\n\n private canRender() {\n return this.sourceValueIsValid && this.isReady;\n }\n\n render() {\n if (!this.canRender()) {\n return '';\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 if (!this.canRender()) {\n return;\n }\n if (this.getSource() === 'json') {\n if (!this.getSourceValue().length) {\n this.showPlaceholder = true;\n return;\n }\n this.getSourceValue().map(product => this.wrapper.append(this.getItemHTML(product)));\n return;\n }\n this.init();\n }\n\n private init() {\n this.initiateInfiniteScroll();\n this.loading();\n salla.product.fetch({\n source: this.getSource(),\n source_value: this.getSourceValue(),\n filters: this.parsedFilters,\n limit: this.limit,\n filterable: this.isFilterable() ? 1 : 0,\n sort: this.sortBy,\n })\n .then(res => {\n if (!res.data?.length) {\n this.showPlaceholder = true;\n this.loading(false);\n return;\n }\n this.handleResponse(res).forEach(card => this.wrapper.append(card));\n this.animateItems();\n })\n }\n\n private handleResponse(response): Array<HTMLElement> {\n //💡 when source is related, cursor will not be existed\n if (response.filters && this.isFilterable()) {\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,c as t,h as i,H as e,g as h}from"./p-3c7d3f26.js";import{H as n}from"./p-dad8bacc.js";import{a as r,F as l}from"./p-d3cc3770.js";const a=":host{display:block}";const o=class{constructor(i){s(this,i);this.changed=t(this,"changed",7);this.initHeight=195;this.widgetTitle=undefined;this.withLoadMore=undefined;this.filtersData=undefined;this.option=undefined;this.isOpen=true;this.isShowMore=false}connectedCallback(){this.withLoadMore=Array.isArray(this.option.values)&&this.option.values.length>8;this.widgetTitle=this.option.label}componentDidLoad(){this.widgetValues.scrollHeight<this.initHeight&&(this.withLoadMore=false);this.withLoadMore&&this.widgetValues&&(this.widgetValues.style.maxHeight=`${this.initHeight}px`);this.widgetContent.style.height=`${this.widgetContent.scrollHeight}px`}async reset(){var s,t;if(this.option.type===r.RANGE){this.priceRange.minPrice=(s=this.option.values)===null||s===void 0?void 0:s.min;this.priceRange.maxPrice=(t=this.option.values)===null||t===void 0?void 0:t.max;await this.priceRange.maxTrigger();await this.priceRange.minTrigger()}Array.from(this.host.querySelectorAll("input")).forEach((s=>s.checked=false))}async showMore(){this.isShowMore=!this.isShowMore;this.widgetContent.style.height="auto";this.widgetValues.style.maxHeight=this.isShowMore?`${this.widgetValues.scrollHeight}px`:`${this.initHeight}px`;setTimeout((()=>{this.widgetContent.style.height=`${this.widgetContent.scrollHeight}px`}),400)}async toggleWidget(){this.isOpen=!this.isOpen;n.toggleElementClassIf(this.widgetContent,"s-filters-widget-opened","s-filters-widget-closed",(()=>this.isOpen))}handlePriceSelection(s,t){this.changed.emit({event:s,option:t,value:{max:s.currentTarget.maxPrice,min:s.currentTarget.minPrice}})}renderSliderOption(s){if(s.type!==r.RANGE){return""}return i("salla-price-range",{onMinPriceSelected:t=>this.handlePriceSelection(t,s),onMaxPriceSelected:t=>this.handlePriceSelection(t,s),ref:s=>this.priceRange=s,"min-price":s.values.min,"max-price":s.values.max})}renderFilterOption(s){if(![r.VALUES,r.MINIMUM,r.VARIANTS].includes(s.type)){return""}return s.values.map(((t,e)=>{let h=typeof t=="number"?t:t.key||t.value;return i("label",{class:"s-filters-label",htmlFor:`${s.key}-option-${e}`},i("input",{id:`${s.key}-option-${e}`,name:s.key,type:s.inputType,checked:this.isSelectedOption(s,h),class:`s-filters-${s.inputType}`,onChange:t=>this.changed.emit({event:t,option:s,value:h})}),this.getOptionLabel(s,t))}))}isSelectedOption(s,t){if(!this.filtersData||!this.filtersData[s.key]){return false}return s.inputType===l.CHECKBOX?this.filtersData[s.key].includes(t):this.filtersData[s.key]==t}getOptionLabel(s,t){if(s.key=="rating"){return i("salla-rating-stars",{size:"small",value:t})}let e=t.value||"null";return i("span",{class:"s-filters-option-name"},e)}render(){return i(e,{class:"s-filters-widget-container"},i("h3",{class:"s-filters-widget-title",onClick:()=>this.toggleWidget()},i("span",null,this.widgetTitle),i("span",{class:`s-filters-widget-plusminus ${this.isOpen?"s-filters-widget-plusminus-active":""}`})),i("div",{class:"s-filters-widget-content",ref:s=>this.widgetContent=s},i("div",{class:"s-filters-widget-values",ref:s=>this.widgetValues=s},i("slot",null),this.renderFilterOption(this.option),this.renderSliderOption(this.option)),this.withLoadMore&&i("a",{class:"s-filters-widget-more",onClick:()=>this.showMore()},!this.isShowMore?"عرض المزيد":"عرض أقل")))}get host(){return h(this)}};o.style=a;export{o as salla_filters_widget};
|
|
5
|
-
//# sourceMappingURL=p-62c1b309.entry.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"names":["sallaFiltersWidgetCss","SallaFiltersWidget","this","initHeight","connectedCallback","withLoadMore","Array","isArray","option","values","length","widgetTitle","label","componentDidLoad","widgetValues","scrollHeight","style","maxHeight","widgetContent","height","async","type","FilterOptionTypes","RANGE","priceRange","minPrice","_a","min","maxPrice","_b","max","maxTrigger","minTrigger","from","host","querySelectorAll","forEach","input","checked","isShowMore","setTimeout","isOpen","Helper","toggleElementClassIf","handlePriceSelection","event","changed","emit","value","currentTarget","renderSliderOption","h","onMinPriceSelected","onMaxPriceSelected","ref","el","renderFilterOption","VALUES","MINIMUM","VARIANTS","includes","map","filterOption","index","key","class","htmlFor","id","name","inputType","isSelectedOption","onChange","e","getOptionLabel","filtersData","FilterOptionInputType","CHECKBOX","size","render","Host","onClick","toggleWidget","showMore"],"sources":["./src/components/salla-filters-widget/salla-filters-widget.scss?tag=salla-filters-widget","./src/components/salla-filters-widget/salla-filters-widget.tsx"],"sourcesContent":[":host {\n display: block;\n}\n","import {Component, Host, h, Method, State, Prop, Event, Element} from '@stencil/core';\nimport Helper from '../../Helpers/Helper';\nimport {Filter, FilterOptionInputType, FilterOptionTypes} from \"../salla-filters/interfaces\";\n\n@Component({\n tag: 'salla-filters-widget',\n styleUrl: 'salla-filters-widget.scss',\n})\nexport class SallaFiltersWidget {\n @Element() host: HTMLElement;\n @Prop({mutable: true}) widgetTitle: string;\n @Prop({mutable: true}) withLoadMore: boolean;\n @Prop({reflect: true}) filtersData: object;\n @Prop({reflect: true}) option: Filter;\n priceRange: HTMLSallaPriceRangeElement\n\n\n private widgetValues: HTMLElement;\n private widgetContent: HTMLDivElement;\n private initHeight: number = 195;\n @State() isOpen: boolean = true;\n @State() isShowMore: boolean = false;\n\n @Event() changed: any;\n\n connectedCallback() {\n //lets be smart and don't show 5 and more link for 8 options\n this.withLoadMore = Array.isArray(this.option.values) && this.option.values.length > 8;\n this.widgetTitle = this.option.label;\n }\n\n componentDidLoad() {\n this.widgetValues.scrollHeight < this.initHeight && (this.withLoadMore = false);\n (this.withLoadMore && this.widgetValues) && (this.widgetValues.style.maxHeight = `${this.initHeight}px`);\n this.widgetContent.style.height = `${this.widgetContent.scrollHeight}px`;\n }\n\n @Method()\n async reset() {\n if (this.option.type === FilterOptionTypes.RANGE) {\n this.priceRange.minPrice = (this.option.values as any)?.min;\n this.priceRange.maxPrice = (this.option.values as any)?.max;\n await this.priceRange.maxTrigger();\n await this.priceRange.minTrigger();\n }\n Array.from(this.host.querySelectorAll('input')).forEach(input => input.checked = false);\n }\n\n @Method()\n async showMore() {\n this.isShowMore = !this.isShowMore\n this.widgetContent.style.height = 'auto';\n this.widgetValues.style.maxHeight = this.isShowMore ? `${this.widgetValues.scrollHeight}px` : `${this.initHeight}px`;\n setTimeout(() => {\n this.widgetContent.style.height = `${this.widgetContent.scrollHeight}px`;\n }, 400); // get height after time of collapse animtion (duration-300)\n }\n\n @Method()\n async toggleWidget() {\n this.isOpen = !this.isOpen;\n Helper.toggleElementClassIf(this.widgetContent, 's-filters-widget-opened', 's-filters-widget-closed', () => this.isOpen);\n }\n\n /**\n * @param {currentTarget: HTMLSallaPriceRangeElement} event\n * @param option\n * @private\n */\n private handlePriceSelection(event, option: Filter) {\n this.changed.emit({\n event: event,\n option: option,\n value: {\n max: event.currentTarget.maxPrice,\n min: event.currentTarget.minPrice,\n }\n })\n }\n\n renderSliderOption(option) {\n if (option.type !== FilterOptionTypes.RANGE) {\n return '';\n }\n return <salla-price-range\n onMinPriceSelected={(event) => this.handlePriceSelection(event, option)}\n onMaxPriceSelected={(event) => this.handlePriceSelection(event, option)}\n ref={el => this.priceRange = el}\n min-price={option.values.min}\n max-price={option.values.max}/>;\n }\n\n renderFilterOption(option: Filter) {\n if (![FilterOptionTypes.VALUES, FilterOptionTypes.MINIMUM, FilterOptionTypes.VARIANTS].includes(option.type)) {\n return '';\n }\n //@ts-ignore\n return option.values.map((filterOption, index) => {\n let value = typeof filterOption == 'number' ? filterOption : (filterOption.key || filterOption.value);\n\n return <label class=\"s-filters-label\" htmlFor={`${option.key}-option-${index}`}>\n <input\n id={`${option.key}-option-${index}`}\n name={option.key}\n type={option.inputType}\n //TODO:: debug more why sometimes it's not rendered as selected🤨\n checked={this.isSelectedOption(option, value)}\n class={`s-filters-${option.inputType}`}\n onChange={e => this.changed.emit({event: e, option: option, value: value})}\n />\n {this.getOptionLabel(option, filterOption)}\n </label>\n }\n )\n }\n\n private isSelectedOption(option: Filter, value) {\n if (!this.filtersData || !this.filtersData[option.key]) {\n return false\n }\n\n return option.inputType === FilterOptionInputType.CHECKBOX\n ? this.filtersData[option.key].includes(value)\n : this.filtersData[option.key] == value;\n }\n\n private getOptionLabel(option: Filter, filterOption) {\n if (option.key == 'rating') {\n return <salla-rating-stars size=\"small\" value={filterOption}/>;\n }\n let label = filterOption.value || 'null';\n //label+=filterOption.count ? ` (${salla.helpers.number(filterOption.count)})` : '';\n return <span class=\"s-filters-option-name\">{label}</span>;\n }\n\n render() {\n return (\n <Host class=\"s-filters-widget-container\">\n <h3 class=\"s-filters-widget-title\" onClick={() => this.toggleWidget()}>\n <span>{this.widgetTitle}</span>\n <span class={`s-filters-widget-plusminus ${this.isOpen ? 's-filters-widget-plusminus-active' : ''}`}/>\n </h3>\n <div class=\"s-filters-widget-content\" ref={(el) => this.widgetContent = el}>\n <div class=\"s-filters-widget-values\" ref={(el) => this.widgetValues = el}>\n <slot/>\n {this.renderFilterOption(this.option)}\n {this.renderSliderOption(this.option)}\n </div>\n {this.withLoadMore &&\n <a class=\"s-filters-widget-more\"\n onClick={() => this.showMore()}>{!this.isShowMore ? 'عرض المزيد' : 'عرض أقل'}</a>\n }\n </div>\n </Host>\n );\n }\n\n}\n"],"mappings":";;;+IAAA,MAAMA,EAAwB,uB,MCQjBC,EAAkB,M,0DAWrBC,KAAAC,WAAqB,I,oHACF,K,gBACI,K,CAI/BC,oBAEEF,KAAKG,aAAeC,MAAMC,QAAQL,KAAKM,OAAOC,SAAWP,KAAKM,OAAOC,OAAOC,OAAS,EACrFR,KAAKS,YAAcT,KAAKM,OAAOI,K,CAGjCC,mBACEX,KAAKY,aAAaC,aAAeb,KAAKC,aAAeD,KAAKG,aAAe,OACxEH,KAAKG,cAAgBH,KAAKY,eAAkBZ,KAAKY,aAAaE,MAAMC,UAAY,GAAGf,KAAKC,gBACzFD,KAAKgB,cAAcF,MAAMG,OAAS,GAAGjB,KAAKgB,cAAcH,gB,CAI1DK,c,QACE,GAAIlB,KAAKM,OAAOa,OAASC,EAAkBC,MAAO,CAChDrB,KAAKsB,WAAWC,UAAWC,EAACxB,KAAKM,OAAOC,UAAc,MAAAiB,SAAA,SAAAA,EAAEC,IACxDzB,KAAKsB,WAAWI,UAAWC,EAAC3B,KAAKM,OAAOC,UAAc,MAAAoB,SAAA,SAAAA,EAAEC,UAClD5B,KAAKsB,WAAWO,mBAChB7B,KAAKsB,WAAWQ,Y,CAExB1B,MAAM2B,KAAK/B,KAAKgC,KAAKC,iBAAiB,UAAUC,SAAQC,GAASA,EAAMC,QAAU,O,CAInFlB,iBACElB,KAAKqC,YAAcrC,KAAKqC,WACxBrC,KAAKgB,cAAcF,MAAMG,OAAS,OAClCjB,KAAKY,aAAaE,MAAMC,UAAYf,KAAKqC,WAAa,GAAGrC,KAAKY,aAAaC,iBAAmB,GAAGb,KAAKC,eACtGqC,YAAW,KACTtC,KAAKgB,cAAcF,MAAMG,OAAS,GAAGjB,KAAKgB,cAAcH,gBAAgB,GACvE,I,CAILK,qBACElB,KAAKuC,QAAUvC,KAAKuC,OACpBC,EAAOC,qBAAqBzC,KAAKgB,cAAe,0BAA2B,2BAA2B,IAAMhB,KAAKuC,Q,CAQ3GG,qBAAqBC,EAAOrC,GAClCN,KAAK4C,QAAQC,KAAK,CAChBF,MAAOA,EACPrC,OAAQA,EACRwC,MAAO,CACLlB,IAAKe,EAAMI,cAAcrB,SACzBD,IAAKkB,EAAMI,cAAcxB,W,CAK/ByB,mBAAmB1C,GACjB,GAAIA,EAAOa,OAASC,EAAkBC,MAAO,CAC3C,MAAO,E,CAET,OAAO4B,EAAA,qBACLC,mBAAqBP,GAAU3C,KAAK0C,qBAAqBC,EAAOrC,GAChE6C,mBAAqBR,GAAU3C,KAAK0C,qBAAqBC,EAAOrC,GAChE8C,IAAKC,GAAMrD,KAAKsB,WAAa+B,EAAE,YACpB/C,EAAOC,OAAOkB,IAAG,YACjBnB,EAAOC,OAAOqB,K,CAG7B0B,mBAAmBhD,GACjB,IAAK,CAACc,EAAkBmC,OAAQnC,EAAkBoC,QAASpC,EAAkBqC,UAAUC,SAASpD,EAAOa,MAAO,CAC5G,MAAO,E,CAGT,OAAOb,EAAOC,OAAOoD,KAAI,CAACC,EAAcC,KACpC,IAAIf,SAAec,GAAgB,SAAWA,EAAgBA,EAAaE,KAAOF,EAAad,MAE/F,OAAOG,EAAA,SAAOc,MAAM,kBAAkBC,QAAS,GAAG1D,EAAOwD,cAAcD,KACrEZ,EAAA,SACEgB,GAAI,GAAG3D,EAAOwD,cAAcD,IAC5BK,KAAM5D,EAAOwD,IACb3C,KAAMb,EAAO6D,UAEb/B,QAASpC,KAAKoE,iBAAiB9D,EAAQwC,GACvCiB,MAAO,aAAazD,EAAO6D,YAC3BE,SAAUC,GAAKtE,KAAK4C,QAAQC,KAAK,CAACF,MAAO2B,EAAGhE,OAAQA,EAAQwC,MAAOA,MAEpE9C,KAAKuE,eAAejE,EAAQsD,GACvB,G,CAKNQ,iBAAiB9D,EAAgBwC,GACvC,IAAK9C,KAAKwE,cAAgBxE,KAAKwE,YAAYlE,EAAOwD,KAAM,CACtD,OAAO,K,CAGT,OAAOxD,EAAO6D,YAAcM,EAAsBC,SAC9C1E,KAAKwE,YAAYlE,EAAOwD,KAAKJ,SAASZ,GACtC9C,KAAKwE,YAAYlE,EAAOwD,MAAQhB,C,CAG9ByB,eAAejE,EAAgBsD,GACrC,GAAItD,EAAOwD,KAAO,SAAU,CAC1B,OAAOb,EAAA,sBAAoB0B,KAAK,QAAQ7B,MAAOc,G,CAEjD,IAAIlD,EAAQkD,EAAad,OAAS,OAElC,OAAOG,EAAA,QAAMc,MAAM,yBAAyBrD,E,CAG9CkE,SACE,OACE3B,EAAC4B,EAAI,CAACd,MAAM,8BACVd,EAAA,MAAIc,MAAM,yBAAyBe,QAAS,IAAM9E,KAAK+E,gBACrD9B,EAAA,YAAOjD,KAAKS,aACZwC,EAAA,QAAMc,MAAO,8BAA8B/D,KAAKuC,OAAS,oCAAsC,QAEjGU,EAAA,OAAKc,MAAM,2BAA2BX,IAAMC,GAAOrD,KAAKgB,cAAgBqC,GACtEJ,EAAA,OAAKc,MAAM,0BAA0BX,IAAMC,GAAOrD,KAAKY,aAAeyC,GACpEJ,EAAA,aACCjD,KAAKsD,mBAAmBtD,KAAKM,QAC7BN,KAAKgD,mBAAmBhD,KAAKM,SAE/BN,KAAKG,cACN8C,EAAA,KAAGc,MAAM,wBACNe,QAAS,IAAM9E,KAAKgF,aAAchF,KAAKqC,WAAa,aAAe,Y"}
|
|
@@ -1,5 +0,0 @@
|
|
|
1
|
-
/*!
|
|
2
|
-
* Crafted with ❤ by Salla
|
|
3
|
-
*/
|
|
4
|
-
import{r as s,h as t,H as e,g as i}from"./p-3c7d3f26.js";const r="";const a=class{constructor(t){s(this,t);this.blockTitle=undefined;this.subTitle=undefined;this.sliderId=undefined;this.displayAllUrl=undefined;this.source=undefined;this.sourceValue=undefined;this.productsData=undefined;this.isReady=undefined;this.sourceValueIsValid=undefined;this.hasCustomComponent=undefined;this.urlPrefix="";this.apiUrl="";this.parsedSourceValue=undefined;salla.onReady((()=>{this.sourceValueIsValid=!!(this.sourceValue||["latest","offers"].includes(this.getSource()))}));if(!this.sourceValueIsValid){salla.logger.warn(`source-value prop is required for source [${this.getSource()}]`);return}this.hasCustomComponent=!!customElements.get("custom-salla-product-card")}getItemHTML(s){if(this.hasCustomComponent){return t("div",{class:"s-products-slider-card"},t("custom-salla-product-card",{product:s,source:this.getSource(),"source-value":this.getSourceValue()}))}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}))}getApiUrl(){if(this.getSource()==="json"){return}if(["offers","latest"].includes(this.getSource())){return salla.url.api(`products?source=${this.getSource()}${this.urlPrefix}`)}if(["related","landing-page"].includes(this.getSource())){return salla.url.api(`products?source=${this.getSource()}&source_value=${this.getSourceValue()}${this.urlPrefix}`)}try{return salla.url.api(`products?source=${this.getSource()}&source_value[]=${this.getSourceValue().join("&source_value[]=")}${this.urlPrefix}`)}catch(s){salla.logger.warn(`source-value prop should be array of ids ex source-value="[1,2,3]" for the source [${this.getSource()}]`);this.sourceValueIsValid=false}}getSource(){return{"brands.single":"brands","product.index":"categories","product.index.latest":"latest","product.index.offers":"offers","product.index.search":"search","landing-page":"landing-page","product.index.tag":"tags"}[this.source||salla.config.get("page.slug")]||this.source||"latest"}getSourceValue(){if(!["search","json"].includes(this.getSource())){if(Array.isArray(JSON.parse(this.sourceValue))&&JSON.parse(this.sourceValue).length){return JSON.parse(this.sourceValue)}if(typeof JSON.parse(this.sourceValue)=="number"){return[JSON.parse(this.sourceValue)]}}return this.sourceValue||salla.config.get("page.id")}canRender(){return this.sourceValueIsValid&&this.isReady}componentWillLoad(){if(this.source==="json"){this.productsData=this.getSourceValue();this.isReady=true;return}salla.api.request(this.getApiUrl(),null,"get").then((s=>{this.productsData=s.data;this.isReady=true}))}render(){var s;if(this.getSource()=="related"&&!salla.config.get("store.settings.product.related_products_enabled")||!this.canRender()){return}return t(e,{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)}`,type:"carousel","block-title":this.blockTitle,"block-subTitle":this.subTitle,"display-all-url":this.displayAllUrl},t("div",{slot:"items"},(s=this.productsData)===null||s===void 0?void 0:s.map((s=>this.getItemHTML(s))))))}get host(){return i(this)}};a.style=r;export{a as salla_products_slider};
|
|
5
|
-
//# sourceMappingURL=p-6349125a.entry.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"names":["sallaProductsSliderCss","SallaProductsSlider","constructor","hostRef","salla","onReady","this","sourceValueIsValid","sourceValue","includes","getSource","logger","warn","hasCustomComponent","customElements","get","getItemHTML","product","h","class","source","getSourceValue","getApiUrl","url","api","urlPrefix","join","e","config","Array","isArray","JSON","parse","length","canRender","isReady","componentWillLoad","productsData","request","then","res","data","render","Host","id","sliderId","Math","random","toString","substr","type","blockTitle","subTitle","displayAllUrl","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';\n\n@Component({\n tag: 'salla-products-slider',\n styleUrl: 'salla-products-slider.scss'\n})\nexport class SallaProductsSlider {\n constructor() {\n salla.onReady(() => {\n this.sourceValueIsValid = !!(this.sourceValue || ['latest', 'offers'].includes(this.getSource()));\n });\n if (!this.sourceValueIsValid) {\n salla.logger.warn(`source-value prop is required for source [${this.getSource()}]`);\n return;\n }\n this.hasCustomComponent = !!customElements.get('custom-salla-product-card');\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 * 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 @State() productsData: any;\n @State() isReady: boolean;\n @State() sourceValueIsValid: boolean;\n @State() hasCustomComponent: boolean;\n @State() urlPrefix: string = '';\n @State() apiUrl: string = '';\n @State() parsedSourceValue: any;\n\n private getItemHTML(product) {\n if (this.hasCustomComponent) {\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 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 getApiUrl() {\n if (this.getSource() === 'json') {\n return;\n }\n if (['offers', 'latest'].includes(this.getSource())) {\n return salla.url.api(`products?source=${this.getSource()}${this.urlPrefix}`);\n }\n if (['related', 'landing-page'].includes(this.getSource())) {\n return salla.url.api(`products?source=${this.getSource()}&source_value=${this.getSourceValue()}${this.urlPrefix}`);\n }\n\n try {\n return salla.url.api(`products?source=${this.getSource()}&source_value[]=${this.getSourceValue().join('&source_value[]=')}${this.urlPrefix}`);\n } catch (e) {\n salla.logger.warn(`source-value prop should be array of ids ex source-value=\"[1,2,3]\" for the source [${this.getSource()}]`);\n this.sourceValueIsValid = false;\n }\n }\n private getSource(){\n return {\n 'brands.single': 'brands',\n 'product.index': 'categories',\n 'product.index.latest': 'latest',\n 'product.index.offers': 'offers',\n 'product.index.search': 'search',\n 'landing-page': 'landing-page',\n 'product.index.tag': 'tags',\n }[this.source || salla.config.get('page.slug')] || this.source ||'latest';\n }\n\n private getSourceValue() {\n if (!['search', 'json'].includes(this.getSource())) {\n if (Array.isArray(JSON.parse(this.sourceValue)) && JSON.parse(this.sourceValue).length) {\n return JSON.parse(this.sourceValue);\n }\n\n if (typeof JSON.parse(this.sourceValue) == 'number') {\n return [JSON.parse(this.sourceValue)];\n }\n }\n return this.sourceValue || salla.config.get('page.id');\n }\n private canRender() {\n return this.sourceValueIsValid && this.isReady;\n }\n\n componentWillLoad() {\n if (this.source === 'json') {\n this.productsData = this.getSourceValue();\n this.isReady = true\n return;\n }\n salla.api.request(this.getApiUrl(), null, 'get').then(res => {\n this.productsData = res.data\n this.isReady = true\n })\n }\n\n render() {\n if ((this.getSource() == 'related' && !salla.config.get('store.settings.product.related_products_enabled')) || !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 type=\"carousel\"\n block-title={this.blockTitle}\n block-subTitle={this.subTitle}\n display-all-url={this.displayAllUrl}\n >\n <div slot=\"items\">\n {this.productsData?.map((product) =>\n this.getItemHTML(product)\n )}\n </div>\n </salla-slider>\n </Host>\n );\n }\n\n}\n"],"mappings":"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"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"names":["sallaFiltersCss","SallaFilters","exports","class_1","hostRef","_this","this","isReady","salla","event","on","host","style","display","lang","onLoaded","apply","get","reset","_c","filters","freshFilterData","map","filter","label","category_id","brand_id","rating","price_range","key","inputType","FilterOptionInputType","CHECKBOX","RADIO","values","max_1","max","min_1","min","stars","filtersData","prototype","connectedCallback","URLSearchParams","window","location","search","JSON","parse","decodeURIComponent","e","logger","warn","message","getFilters","applyFilters","history","pushState","url","addParamToUrl","encodeURIComponent","stringify","emit","changed","resetFilters","childNodes","forEach","widget","handleOptionChange","option","value","type","FilterOptionTypes","RANGE","isChecked","target","checked","push","val","render","h","Host","_a","onChanged","_d","detail","_b","length","class","color","onClick","fill","componentDidLoad"],"sources":["src/components/salla-filters/salla-filters.scss?tag=salla-filters","src/components/salla-filters/salla-filters.tsx"],"sourcesContent":[":host {\n display: block;\n}\n\n.s-rating-stars-small {\n line-height: 12px;\n}\n.s-filters-radio{\n background-image: none !important;\n}","import {Component, Element, h, Event, EventEmitter, Host, Method, Prop, State} from '@stencil/core';\nimport {Filter, FilterOptionInputType, FilterOptionTypes} from \"./interfaces\";\n\n//todo::\n\n\n@Component({\n tag: 'salla-filters',\n styleUrl: 'salla-filters.scss',\n})\nexport class SallaFilters {\n\n constructor() {\n salla.event.on('filters::hidden', () => this.host.style.display = 'none');\n\n salla.lang.onLoaded(() => {\n this.apply = salla.lang.get('pages.checkout.apply');\n this.reset = salla.lang.get('pages.categories.filters_reset');\n });\n\n salla.event.on('filters::fetched', ({filters}) => {\n this.host.style.display = '';\n let freshFilterData = {};\n this.filters = filters\n .map((filter: Filter) => {\n filter.label = {\n category_id: salla.lang.get('common.titles.categories'),\n brand_id: salla.lang.get('common.titles.brands'),\n rating: salla.lang.get('pages.categories.filter_rating'),\n price_range: salla.lang.get('pages.categories.filter_price'),\n }[filter.key] || filter.label;\n filter.inputType = FilterOptionInputType.CHECKBOX;\n if (filter.key == 'rating') {\n filter.inputType = FilterOptionInputType.RADIO;\n //@ts-ignore\n let {max, min} = filter.values;\n //@ts-ignore\n filter.values = [1, 2, 3, 4, 5].filter(stars => stars >= min || stars <= max)\n }\n\n //when getting new filters, maybe less than we had, so let's get from the old one, only what is existed now.\n if (this.filtersData[filter.key]) {\n freshFilterData[filter.key] = this.filtersData[filter.key];\n }\n\n return filter;\n });\n this.filtersData = freshFilterData;\n });\n }\n\n connectedCallback() {\n try {\n let filters = (new URLSearchParams(window.location.search)).get('filters')\n this.filtersData = filters ? JSON.parse(decodeURIComponent(filters)) : {};\n } catch (e) {\n salla.logger.warn('failed to get filters from url', e.message);\n }\n }\n\n @Element() host: HTMLElement;\n @Prop({reflect: true, mutable: true}) filters?: Filter[];\n private isReady = false;//to avoid triggering the changed event\n @State() isSidebarOpen: boolean;\n @State() filtersData: object = {}\n @State() apply: string;\n @State() reset: string;\n @Event() changed: EventEmitter;\n\n //TODO:: move all @methods into one section\n @Method()\n async getFilters() {\n return this.filtersData;\n }\n\n @Method()\n async applyFilters() {\n if (!this.isReady) {\n return;\n }\n window.history.pushState({}, '', salla.url.addParamToUrl('filters', encodeURIComponent(JSON.stringify(this.filtersData))));\n salla.event.emit('salla-filters::changed', this.filtersData);\n this.changed.emit(this.filtersData);\n }\n\n @Method()\n async resetFilters() {\n this.filtersData = {};\n this.host.childNodes.forEach((widget: HTMLSallaFiltersWidgetElement) => widget.reset && widget.reset())\n salla.event.emit('salla-filters::reset');\n return this.applyFilters();\n }\n\n /**\n * @param {{target:HTMLInputElement}} event\n * @param option\n * @param value\n * @private\n */\n private handleOptionChange(event, option: Filter, value) {\n if (option.type === FilterOptionTypes.RANGE) {\n this.filtersData[option.key] = value;\n return;\n }\n let isChecked = event.target.checked;\n if (event.target.type == FilterOptionInputType.RADIO) {\n isChecked && (this.filtersData[option.key] = value);\n isChecked || (delete this.filtersData[option.key]);\n return;\n }\n\n //it's checkbox\n this.filtersData[option.key] = this.filtersData[option.key] || [];\n if (isChecked) {\n this.filtersData[option.key].push(value);\n return;\n }\n this.filtersData[option.key] = this.filtersData[option.key].filter(val => val != value);\n }\n\n render() {\n return <Host>\n {this.filters?.map(option => <salla-filters-widget\n option={option}\n filtersData={this.filtersData}\n onChanged={({detail: {event, option, value}}) => this.handleOptionChange(event, option, value)}/>)}\n\n {this.filters?.length && <div class=\"s-filters-footer\">\n <salla-button color='primary' onClick={() => this.applyFilters()}>{this.apply}</salla-button>\n <salla-button color='gray' fill='outline' onClick={() => this.resetFilters()}>{this.reset}</salla-button>\n </div>}\n </Host>;\n }\n\n componentDidLoad() {\n this.isReady = true;\n }\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 i,h as e,H as s}from"./p-3c7d3f26.js";const r=":host{display:block}.rtl .rtl-range-slider,[dir=rtl] .rtl-range-slider{-webkit-transform:rotateY(180deg);transform:rotateY(180deg)}.rtl .rtl-range-numbers,[dir=rtl] .rtl-range-numbers{-ms-flex-direction:row-reverse;flex-direction:row-reverse}.rtl .form-select,.rtl select,[dir=rtl] .form-select,[dir=rtl] select{background-position:left 0.5rem center;padding-right:12px}.rtl .menu-divide li:not(:last-child):after,[dir=rtl] .menu-divide li:not(:last-child):after{left:0;right:auto}input[type=range]::-webkit-slider-thumb{pointer-events:all;width:24px;height:24px;-webkit-appearance:none}[type=checkbox]:checked{background-size:80%}";const n=class{constructor(e){t(this,e);this.minPriceSelected=i(this,"minPriceSelected",7);this.maxPriceSelected=i(this,"maxPriceSelected",7);this.minPrice=1e3;this.maxPrice=5e3;this.min=0;this.max=1e4;this.minthumb=0;this.maxthumb=0}componentWillLoad(){this.minTrigger();this.maxTrigger()}async minTrigger(t=null){let i=t?t.target.value*1:null;this.minInputValidation(i);this.minthumb=(this.minPrice-this.min)/(this.max-this.min)*100;this.changeLeftHandle();this.isReady&&this.minPriceSelected.emit(i)}async maxTrigger(t=null){let i=t?t.target.value*1:null;this.maxInputValidation(i);this.maxthumb=100-(this.maxPrice-this.min)/(this.max-this.min)*100;this.changeRightHandle();this.isReady&&this.maxPriceSelected.emit(i)}async minInputValidation(t){if(t&&(t>this.max||t>this.maxPrice))return;else if(t<this.min){this.minPrice=this.min}else{t&&(this.minPrice=t)}}async maxInputValidation(t){if(t&&(t<this.min||t<this.minPrice))return;else if(t>this.max){this.maxPrice=this.max}else{t&&(this.maxPrice=t)}}async changeRightHandle(){this.rightHandle&&(this.rightHandle.style.right=`${this.maxthumb}%`);this.activeBar&&(this.activeBar.style.right=`${this.maxthumb}%`)}async changeLeftHandle(){this.leftHandle&&(this.leftHandle.style.left=`${this.minthumb}%`);this.activeBar&&(this.activeBar.style.left=`${this.minthumb}%`)}render(){return e(s,null,e("div",{style:{direction:"ltr"},class:"flex justify-center items-center"},e("div",{class:"relative max-w-xl w-full"},e("div",{class:"rtl-range-slider"},e("input",{type:"range",step:"100",min:this.min,max:this.max,onInput:t=>this.minTrigger(t),value:this.minPrice,class:"s-price-range-input"}),e("input",{type:"range",step:"100",min:this.min,max:this.max,onInput:t=>this.maxTrigger(t),value:this.maxPrice,class:"s-price-range-input"}),e("div",{class:"s-price-range-bar-container"},e("div",{class:"s-price-range-bar"}),e("div",{class:"s-price-range-active-bar",ref:t=>this.activeBar=t}),e("div",{class:"s-price-range-left-handle",ref:t=>this.leftHandle=t}),e("div",{class:"s-price-range-right-handle",ref:t=>this.rightHandle=t}))),e("div",{class:"s-price-range-inputs"},e("div",{class:"s-price-range-relative"},e("div",{class:"s-price-range-currency"}," ",salla.config.currency().symbol),e("input",{type:"number",maxlength:"5",onInput:t=>this.minTrigger(t),value:this.minPrice,class:"s-price-range-number-input"})),e("div",{class:"s-price-range-gray-text"}," - "),e("div",{class:"s-price-range-relative"},e("div",{class:"s-price-range-currency"}," ",salla.config.currency().symbol),e("input",{type:"number",maxlength:"5",onInput:t=>this.maxTrigger(t),value:this.maxPrice,class:"s-price-range-number-input",placeholder:"0.00","aria-describedby":"price-currency"}))))))}componentDidLoad(){this.changeLeftHandle();this.changeRightHandle();this.isReady=true}};n.style=r;export{n as salla_price_range};
|
|
5
|
-
//# sourceMappingURL=p-8ee37cc6.entry.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"names":["sallaPriceRangeCss","SallaPriceRange","componentWillLoad","this","minTrigger","maxTrigger","async","event","value","target","minInputValidation","minthumb","minPrice","min","max","changeLeftHandle","isReady","minPriceSelected","emit","maxInputValidation","maxthumb","maxPrice","changeRightHandle","maxPriceSelected","rightHandle","style","right","activeBar","leftHandle","left","render","h","Host","direction","class","type","step","onInput","ref","el","salla","config","currency","symbol","maxlength","placeholder","componentDidLoad"],"sources":["./src/components/salla-price-range/salla-price-range.scss?tag=salla-price-range","./src/components/salla-price-range/salla-price-range.tsx"],"sourcesContent":[":host {\n display: block;\n}\n\n\n.rtl, [dir=\"rtl\"] {\n .rtl-range-slider {\n transform: rotateY(180deg);\n }\n\n .rtl-range-numbers{\n flex-direction: row-reverse;\n }\n\n .form-select, select{\n background-position: left 0.5rem center;\n padding-right: 12px;\n } \n\n // divide\n.menu-divide {\n li {\n &:not(:last-child) {\n &:after {\n left: 0;\n right: auto;\n }\n }\n }\n}\n}\n\ninput[type=range]::-webkit-slider-thumb {\n pointer-events: all;\n width: 24px;\n height: 24px;\n -webkit-appearance: none;\n}\n\n[type='checkbox']:checked{\n background-size: 80%;\n}","import {Component, Host, h, Method, State, Prop, Event, EventEmitter} from '@stencil/core';\n\n@Component({\n tag: 'salla-price-range',\n styleUrl: 'salla-price-range.scss',\n})\nexport class SallaPriceRange {\n @Prop({mutable: true}) minPrice = 1000;\n @Prop({mutable: true}) maxPrice = 5000;\n @State() min = 0;\n @State() max = 10000;\n\n @State() minthumb = 0;\n @State() maxthumb = 0;\n\n @Event() minPriceSelected: EventEmitter<number>;\n @Event() maxPriceSelected: EventEmitter<number>;\n\n isReady: Boolean;\n rightHandle: HTMLDivElement;\n leftHandle: HTMLDivElement;\n activeBar: HTMLDivElement;\n\n componentWillLoad() {\n this.minTrigger();\n this.maxTrigger();\n }\n\n @Method()\n async minTrigger(event = null) {\n let value = event ? event.target.value * 1 : null\n this.minInputValidation(value);\n this.minthumb = ((this.minPrice - this.min) / (this.max - this.min)) * 100;\n this.changeLeftHandle()\n \n this.isReady && this.minPriceSelected.emit(value);\n }\n\n @Method()\n async maxTrigger(event = null) {\n let value = event ? event.target.value * 1 : null\n this.maxInputValidation(value)\n this.maxthumb = 100 - (((this.maxPrice - this.min) / (this.max - this.min)) * 100);\n this.changeRightHandle()\n \n this.isReady && this.maxPriceSelected.emit(value);\n }\n\n @Method()\n async minInputValidation(value) {\n if (value && (value > this.max || value > this.maxPrice)) return;\n else if (value < this.min) {\n this.minPrice = this.min;\n } else {\n value && (this.minPrice = value)\n }\n }\n\n @Method()\n async maxInputValidation(value) {\n if (value && (value < this.min || value < this.minPrice)) return;\n else if (value > this.max) {\n this.maxPrice = this.max;\n } else {\n value && (this.maxPrice = value)\n }\n }\n\n @Method()\n async changeRightHandle() {\n this.rightHandle && (this.rightHandle.style.right = `${this.maxthumb}%`);\n this.activeBar && (this.activeBar.style.right = `${this.maxthumb}%`);\n }\n\n @Method()\n async changeLeftHandle() {\n this.leftHandle && (this.leftHandle.style.left = `${this.minthumb}%`);\n this.activeBar && (this.activeBar.style.left = `${this.minthumb}%`);\n }\n\n\n render() {\n return (\n <Host>\n <div style={{direction: 'ltr'}} class=\"flex justify-center items-center\">\n <div class=\"relative max-w-xl w-full\">\n <div class=\"rtl-range-slider\">\n <input\n type=\"range\"\n step=\"100\"\n min={this.min} max={this.max}\n onInput={(event) => this.minTrigger(event)}\n value={this.minPrice}\n class=\"s-price-range-input\"\n />\n\n <input\n type=\"range\"\n step=\"100\"\n min={this.min}\n max={this.max}\n onInput={(event) => this.maxTrigger(event)}\n value={this.maxPrice}\n class=\"s-price-range-input\"\n />\n\n <div class=\"s-price-range-bar-container\">\n <div class=\"s-price-range-bar\"/>\n <div class=\"s-price-range-active-bar\" ref={(el) => this.activeBar = el}/>\n <div class=\"s-price-range-left-handle\" ref={(el) => this.leftHandle = el}/>\n <div class=\"s-price-range-right-handle\" ref={(el) => this.rightHandle = el}/>\n </div>\n\n </div>\n\n\n <div class=\"s-price-range-inputs\">\n <div class=\"s-price-range-relative\">\n <div class=\"s-price-range-currency\"> {salla.config.currency().symbol}</div>\n <input\n type=\"number\"\n maxlength=\"5\"\n onInput={(event) => this.minTrigger(event)}\n value={this.minPrice}\n class=\"s-price-range-number-input\"\n />\n </div>\n\n <div class=\"s-price-range-gray-text\"> - </div>\n <div class=\"s-price-range-relative\">\n <div class=\"s-price-range-currency\"> {salla.config.currency().symbol}</div>\n <input type=\"number\" maxlength=\"5\"\n onInput={(event) => this.maxTrigger(event)}\n value={this.maxPrice}\n class=\"s-price-range-number-input\" placeholder=\"0.00\" aria-describedby=\"price-currency\"/>\n </div>\n\n </div>\n\n </div>\n </div>\n </Host>\n );\n }\n\n componentDidLoad() {\n // this.max=this.maxPrice;\n this.changeLeftHandle()\n this.changeRightHandle()\n this.isReady = true;\n }\n}\n"],"mappings":"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"}
|