@salla.sa/twilight-components 2.11.112 → 2.11.114
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/dist/cjs/interfaces-56bf4b49.js.map +1 -1
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/cjs/salla-add-product-button_40.cjs.entry.js +7 -7
- package/dist/cjs/salla-add-product-button_40.cjs.entry.js.map +1 -1
- package/dist/cjs/salla-filters-widget.cjs.entry.js +1 -1
- package/dist/cjs/salla-filters-widget.cjs.entry.js.map +1 -1
- package/dist/cjs/salla-price-range.cjs.entry.js +57 -75
- package/dist/cjs/salla-price-range.cjs.entry.js.map +1 -1
- package/dist/cjs/salla-products-list.cjs.entry.js +3 -3
- package/dist/cjs/salla-products-list.cjs.entry.js.map +1 -1
- package/dist/cjs/salla-products-slider.cjs.entry.js +30 -38
- package/dist/cjs/salla-products-slider.cjs.entry.js.map +1 -1
- package/dist/cjs/twilight.cjs.js +1 -1
- package/dist/collection/components/salla-filters/interfaces.js.map +1 -1
- package/dist/collection/components/salla-filters-widget/salla-filters-widget.js +1 -1
- package/dist/collection/components/salla-filters-widget/salla-filters-widget.js.map +1 -1
- package/dist/collection/components/salla-price-range/salla-price-range.js +64 -86
- 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 +3 -3
- 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 +31 -38
- package/dist/collection/components/salla-products-slider/salla-products-slider.js.map +1 -1
- package/dist/collection/components/salla-search/salla-search.js +7 -7
- package/dist/collection/components/salla-search/salla-search.js.map +1 -1
- package/dist/collection/components/salla-search/search-response.js.map +1 -1
- package/dist/components/salla-filters-widget2.js +1 -1
- package/dist/components/salla-filters-widget2.js.map +1 -1
- package/dist/components/salla-price-range2.js +59 -79
- package/dist/components/salla-price-range2.js.map +1 -1
- package/dist/components/salla-products-list.js +3 -3
- package/dist/components/salla-products-list.js.map +1 -1
- package/dist/components/salla-products-slider.js +30 -38
- package/dist/components/salla-products-slider.js.map +1 -1
- package/dist/components/salla-search.js +7 -7
- package/dist/components/salla-search.js.map +1 -1
- package/dist/esm/interfaces-5bea5a45.js.map +1 -1
- package/dist/esm/loader.js +1 -1
- package/dist/esm/salla-add-product-button_40.entry.js +7 -7
- package/dist/esm/salla-add-product-button_40.entry.js.map +1 -1
- package/dist/esm/salla-filters-widget.entry.js +1 -1
- package/dist/esm/salla-filters-widget.entry.js.map +1 -1
- package/dist/esm/salla-price-range.entry.js +57 -75
- package/dist/esm/salla-price-range.entry.js.map +1 -1
- package/dist/esm/salla-products-list.entry.js +3 -3
- package/dist/esm/salla-products-list.entry.js.map +1 -1
- package/dist/esm/salla-products-slider.entry.js +30 -38
- package/dist/esm/salla-products-slider.entry.js.map +1 -1
- package/dist/esm/twilight.js +1 -1
- package/dist/esm-es5/interfaces-5bea5a45.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 +1 -1
- 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-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 +1 -1
- 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-01a0d85b.system.js.map +1 -1
- package/dist/twilight/p-061fedeb.entry.js +5 -0
- package/dist/twilight/p-061fedeb.entry.js.map +1 -0
- package/dist/twilight/{p-9a1231a6.system.entry.js → p-11c9d4f1.system.entry.js} +2 -2
- package/dist/twilight/p-11c9d4f1.system.entry.js.map +1 -0
- package/dist/twilight/p-1726b13b.entry.js +5 -0
- package/dist/twilight/p-1726b13b.entry.js.map +1 -0
- package/dist/twilight/p-37389934.system.js +1 -1
- package/dist/twilight/p-37389934.system.js.map +1 -1
- package/dist/twilight/p-384e9a27.system.entry.js +5 -0
- package/dist/twilight/p-384e9a27.system.entry.js.map +1 -0
- package/dist/twilight/p-7180e106.entry.js +5 -0
- package/dist/twilight/p-7180e106.entry.js.map +1 -0
- package/dist/twilight/{p-54783694.system.entry.js → p-8dbe3def.system.entry.js} +2 -2
- package/dist/twilight/p-8dbe3def.system.entry.js.map +1 -0
- package/dist/twilight/{p-b766115a.entry.js → p-aa4bff7e.entry.js} +2 -2
- package/dist/twilight/p-aa4bff7e.entry.js.map +1 -0
- package/dist/twilight/p-bada2f30.system.entry.js +5 -0
- package/dist/twilight/p-bada2f30.system.entry.js.map +1 -0
- package/dist/twilight/p-cda133d3.system.entry.js +5 -0
- package/dist/twilight/p-cda133d3.system.entry.js.map +1 -0
- package/dist/twilight/p-d3cc3770.js.map +1 -1
- package/dist/twilight/{p-3212e42c.entry.js → p-f1d68104.entry.js} +2 -2
- package/dist/twilight/p-f1d68104.entry.js.map +1 -0
- package/dist/twilight/twilight.esm.js +1 -1
- package/dist/twilight/twilight.esm.js.map +1 -1
- package/dist/types/components/salla-filters/interfaces.d.ts +10 -7
- package/dist/types/components/salla-filters-widget/salla-filters-widget.d.ts +1 -1
- package/dist/types/components/salla-price-range/salla-price-range.d.ts +5 -10
- package/dist/types/components/salla-products-slider/salla-products-slider.d.ts +4 -5
- package/dist/types/components/salla-search/search-response.d.ts +2 -1
- package/dist/types/components.d.ts +4 -4
- package/package.json +3 -3
- package/dist/twilight/p-3212e42c.entry.js.map +0 -1
- package/dist/twilight/p-3f03d17c.system.entry.js +0 -5
- package/dist/twilight/p-3f03d17c.system.entry.js.map +0 -1
- package/dist/twilight/p-46b7f931.system.entry.js +0 -5
- package/dist/twilight/p-46b7f931.system.entry.js.map +0 -1
- package/dist/twilight/p-54783694.system.entry.js.map +0 -1
- package/dist/twilight/p-9a1231a6.system.entry.js.map +0 -1
- package/dist/twilight/p-b766115a.entry.js.map +0 -1
- package/dist/twilight/p-d7a62fb3.system.entry.js +0 -5
- package/dist/twilight/p-d7a62fb3.system.entry.js.map +0 -1
- package/dist/twilight/p-def222e1.entry.js +0 -5
- package/dist/twilight/p-def222e1.entry.js.map +0 -1
- package/dist/twilight/p-e393f123.entry.js +0 -5
- package/dist/twilight/p-e393f123.entry.js.map +0 -1
- package/dist/twilight/p-e3dc0687.entry.js +0 -5
- package/dist/twilight/p-e3dc0687.entry.js.map +0 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"salla-products-list.js","sourceRoot":"","sources":["../../../src/components/salla-products-list/salla-products-list.tsx"],"names":[],"mappings":"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","sourcesContent":["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 connectedCallback() {\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 try {\n let searchParams = new URLSearchParams(window.location.search);\n this.sortBy = this.sortBy || searchParams.get('sort') || searchParams.get('by');\n let filters = searchParams.get('filters')\n this.parsedFilters = filters ? JSON.parse(decodeURIComponent(filters)) : {};\n } catch (e) {\n salla.logger.warn('failed to get filters from url', e.message);\n }\n this.buildNextPageUrl();\n this.createStatusDom();\n\n this.isReady = true;\n });\n\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 }\n\n @Method()\n async setFilters(filters) {\n this.parsedFilters = filters;\n return this.reload();\n }\n\n\n @Method()\n async reload() {\n salla.infiniteScroll.destroy(this.infiniteScroll);\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 initBaseNextPageUrl(source: string) {\n\n this.nextPage = salla.url.api(`products?source=${source}`);\n\n if (this.limit) {\n this.nextPage += `&per_page=${this.limit > 32 ? 32 : this.limit}`;\n }\n if (this.sortBy) {\n this.nextPage += `&sort=${this.sortBy}`;\n }\n // if (!this.isFilterable()) {\n // return this.nextPage;\n // }\n this.nextPage += '&filterable=1';\n for (const [key, value] of Object.entries(this.parsedFilters || {})) {\n if ([\"string\", \"number\"].includes(typeof value)) {\n this.nextPage += `&filters[${key}]=${value}`;\n } else if (Array.isArray(value)) {\n (value as any).forEach(item => this.nextPage += `&filters[${key}][]=${item}`)\n } else if (typeof value === 'object') {\n for (const [k, v] of Object.entries(value)) {\n this.nextPage += `&filters[${key}][${k}]=${v}`;\n }\n }\n }\n }\n\n private buildNextPageUrl() {\n let source = this.getSource();\n if (source === 'json') {\n return;\n }\n this.initBaseNextPageUrl(source);\n if (this.isSourceWithoutValue()) {\n return;\n }\n\n if (['search', 'related', 'landing-page'].includes(source)) {\n this.nextPage += `&source_value=${this.getSourceValue()}`;\n return;\n }\n\n try {\n this.nextPage += `&source_value[]=${this.getSourceValue().join('&source_value[]=')}`;\n } catch (e) {\n salla.logger.warn(`source-value prop should be array of ids ex source-value=\"[1,2,3]\" for the source [${source}]`);\n this.sourceValueIsValid = false;\n }\n }\n\n 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 customComponent.toggleAttribute('shadow-on-hover', true);\n }\n return customComponent;\n }\n\n private fetchProducts() {\n salla.product.fetch({\n source: this.getSource(),\n source_value: this.getSourceValue(),\n limit: this.limit\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 })\n }\n \n private initiateInfiniteScroll() {\n if (!this.hasInfiniteScroll) {\n return;\n }\n\n this.host.insertAdjacentElement('beforeend', this.status);\n this.infiniteScroll = salla.infiniteScroll.initiate(this.wrapper, this.wrapper, {\n path: () => this.nextPage,\n history: false,\n nextPage: this.nextPage,\n scrollThreshold: 100,\n }, /* infinite via api*/true);\n this.infiniteScroll.on('request', () => this.loading())\n this.infiniteScroll.on('load', response => {\n if (!response.data?.length) {\n this.showPlaceholder = true;\n salla.infiniteScroll.destroy(this.infiniteScroll);\n this.loading(false);\n return;\n }else{\n this.showPlaceholder = false;\n\n }\n this.infiniteScroll.appendItems(this.handleResponse(response))\n if (this.infiniteScroll.pageIndex == 2) {\n this.animateItems();\n }\n })\n this.infiniteScroll.on('error', () => {\n this.status.querySelector('.s-infinite-scroll-error').classList.remove('s-hidden')\n this.loading(false);\n });\n salla.onReady(() => salla.infiniteScroll.loadNextPage(this.infiniteScroll))\n }\n\n 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\n // Handle json source\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 // Handle selected source\n if (this.getSource() === 'selected') {\n if (!this.getSourceValue().length) {\n this.showPlaceholder = true;\n return;\n }\n this.fetchProducts()\n return;\n }\n this.init();\n }\n\n private init() {\n this.initiateInfiniteScroll();\n this.loading();\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 this.filtersResults = true;\n salla.event.emit('filters::fetched', {filters: response.filters});\n } else if (this.isFilterable()) {\n salla.event.emit('filters::hidden');\n }\n this.nextPage = response.cursor ? response.cursor.next : this.nextPage;\n this.loading(false);\n if (this.hasInfiniteScroll && !this.nextPage) {\n this.infiniteScroll.option({scrollThreshold: false, loadOnScroll: false});\n this.status.querySelector('.s-infinite-scroll-last').classList.remove('s-hidden');\n }\n return response.data?.map(product => this.getItemHTML(product)) || [];\n }\n}\n"]}
|
|
1
|
+
{"version":3,"file":"salla-products-list.js","sourceRoot":"","sources":["../../../src/components/salla-products-list/salla-products-list.tsx"],"names":[],"mappings":"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","sourcesContent":["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 connectedCallback() {\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 try {\n let searchParams = new URLSearchParams(window.location.search);\n this.sortBy = this.sortBy || searchParams.get('sort') || searchParams.get('by');\n let filters = searchParams.get('filters')\n this.parsedFilters = filters ? JSON.parse(decodeURIComponent(filters)) : {};\n } catch (e) {\n salla.logger.warn('failed to get filters from url', e.message);\n }\n this.buildNextPageUrl();\n this.createStatusDom();\n\n this.isReady = true;\n });\n\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 }\n\n @Method()\n async setFilters(filters) {\n this.parsedFilters = filters;\n return this.reload();\n }\n\n\n @Method()\n async reload() {\n salla.infiniteScroll.destroy(this.infiniteScroll);\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 initBaseNextPageUrl(source: string) {\n\n this.nextPage = salla.url.api(`products?source=${source}`);\n\n if (this.limit) {\n this.nextPage += `&per_page=${this.limit > 32 ? 32 : this.limit}`;\n }\n if (this.sortBy) {\n this.nextPage += `&sort=${this.sortBy}`;\n }\n // if (!this.isFilterable()) {\n // return this.nextPage;\n // }\n this.nextPage += '&filterable=1';\n for (const [key, value] of Object.entries(this.parsedFilters || {})) {\n if ([\"string\", \"number\"].includes(typeof value)) {\n this.nextPage += `&filters[${key}]=${value}`;\n } else if (Array.isArray(value)) {\n (value as any).forEach(item => this.nextPage += `&filters[${key}][]=${item}`)\n } else if (typeof value === 'object') {\n for (const [k, v] of Object.entries(value)) {\n this.nextPage += `&filters[${key}][${k}]=${v}`;\n }\n }\n }\n }\n\n private buildNextPageUrl() {\n let source = this.getSource();\n if (source === 'json') {\n return;\n }\n this.initBaseNextPageUrl(source);\n if (this.isSourceWithoutValue()) {\n return;\n }\n\n if (['search', 'related', 'landing-page'].includes(source)) {\n this.nextPage += `&source_value=${this.getSourceValue()}`;\n return;\n }\n\n try {\n this.nextPage += `&source_value[]=${this.getSourceValue().join('&source_value[]=')}`;\n } catch (e) {\n salla.logger.warn(`source-value prop should be array of ids ex source-value=\"[1,2,3]\" for the source [${source}]`);\n this.sourceValueIsValid = false;\n }\n }\n\n 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'].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 customComponent.toggleAttribute('shadow-on-hover', true);\n }\n return customComponent;\n }\n\n private fetchProducts() {\n salla.product.fetch({\n source: this.getSource(),\n source_value: this.getSourceValue(),\n limit: this.limit\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 })\n }\n \n private initiateInfiniteScroll() {\n if (!this.hasInfiniteScroll) {\n return;\n }\n\n this.host.insertAdjacentElement('beforeend', this.status);\n this.infiniteScroll = salla.infiniteScroll.initiate(this.wrapper, this.wrapper, {\n path: () => this.nextPage,\n history: false,\n nextPage: this.nextPage,\n scrollThreshold: 100,\n }, /* infinite via api*/true);\n this.infiniteScroll.on('request', () => this.loading())\n this.infiniteScroll.on('load', response => {\n if (!response.data?.length) {\n this.showPlaceholder = true;\n salla.infiniteScroll.destroy(this.infiniteScroll);\n this.loading(false);\n return;\n }else{\n this.showPlaceholder = false;\n\n }\n this.infiniteScroll.appendItems(this.handleResponse(response))\n if (this.infiniteScroll.pageIndex == 2) {\n this.animateItems();\n }\n })\n this.infiniteScroll.on('error', () => {\n this.status.querySelector('.s-infinite-scroll-error').classList.remove('s-hidden')\n this.loading(false);\n });\n salla.onReady(() => salla.infiniteScroll.loadNextPage(this.infiniteScroll))\n }\n\n 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\n // Handle json source\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 // Handle selected source\n if (this.getSource() === 'selected' || this.getSource() === 'landing-page') {\n if (this.getSource() === 'selected' && !this.getSourceValue().length) {\n this.showPlaceholder = true;\n return;\n }\n this.fetchProducts()\n return;\n }\n this.init();\n }\n\n private init() {\n this.initiateInfiniteScroll();\n this.loading();\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 this.filtersResults = true;\n salla.event.emit('filters::fetched', {filters: response.filters});\n } else if (this.isFilterable()) {\n salla.event.emit('filters::hidden');\n }\n this.nextPage = response.cursor ? response.cursor.next : this.nextPage;\n this.loading(false);\n if (this.hasInfiniteScroll && !this.nextPage) {\n this.infiniteScroll.option({scrollThreshold: false, loadOnScroll: false});\n this.status.querySelector('.s-infinite-scroll-last').classList.remove('s-hidden');\n }\n return response.data?.map(product => this.getItemHTML(product)) || [];\n }\n}\n"]}
|
|
@@ -2,6 +2,7 @@
|
|
|
2
2
|
* Crafted with ❤ by Salla
|
|
3
3
|
*/
|
|
4
4
|
import { Host, h } from '@stencil/core';
|
|
5
|
+
//todo:: extends this component from salla-products-list or the opposite
|
|
5
6
|
export class SallaProductsSlider {
|
|
6
7
|
constructor() {
|
|
7
8
|
this.blockTitle = undefined;
|
|
@@ -18,13 +19,16 @@ export class SallaProductsSlider {
|
|
|
18
19
|
this.apiUrl = '';
|
|
19
20
|
this.parsedSourceValue = undefined;
|
|
20
21
|
salla.onReady(() => {
|
|
21
|
-
this.sourceValueIsValid = !!(this.
|
|
22
|
+
this.sourceValueIsValid = !!(this.getSource() || this.isSourceWithoutValue());
|
|
23
|
+
if (!this.sourceValueIsValid) {
|
|
24
|
+
salla.logger.warn(`source-value prop is required for source [${this.getSource()}]`);
|
|
25
|
+
return;
|
|
26
|
+
}
|
|
27
|
+
this.hasCustomComponent = !!customElements.get('custom-salla-product-card');
|
|
22
28
|
});
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
}
|
|
27
|
-
this.hasCustomComponent = !!customElements.get('custom-salla-product-card');
|
|
29
|
+
}
|
|
30
|
+
isSourceWithoutValue() {
|
|
31
|
+
return ['offers', 'latest', 'sales'].includes(this.getSource());
|
|
28
32
|
}
|
|
29
33
|
getItemHTML(product) {
|
|
30
34
|
if (this.hasCustomComponent) {
|
|
@@ -32,32 +36,6 @@ export class SallaProductsSlider {
|
|
|
32
36
|
}
|
|
33
37
|
return h("div", { class: "s-products-slider-card" }, h("salla-product-card", { "show-quantity": this.getSource() == 'landing-page', "hide-add-btn": this.getSource() == 'landing-page', "shadow-on-hover": true, product: product }));
|
|
34
38
|
}
|
|
35
|
-
getUrlPrefix() {
|
|
36
|
-
let urlPrefix = '';
|
|
37
|
-
if (this.limit) {
|
|
38
|
-
urlPrefix = `&per_page=${this.limit > 32 ? 32 : this.limit}`;
|
|
39
|
-
}
|
|
40
|
-
return urlPrefix;
|
|
41
|
-
}
|
|
42
|
-
getApiUrl() {
|
|
43
|
-
if (this.getSource() === 'json') {
|
|
44
|
-
return;
|
|
45
|
-
}
|
|
46
|
-
let prefixes = this.getUrlPrefix();
|
|
47
|
-
if (['offers', 'latest'].includes(this.getSource())) {
|
|
48
|
-
return salla.url.api(`products?source=${this.getSource()}${prefixes}`);
|
|
49
|
-
}
|
|
50
|
-
if (['related', 'landing-page'].includes(this.getSource())) {
|
|
51
|
-
return salla.url.api(`products?source=${this.getSource()}&source_value=${this.getSourceValue()}${prefixes}`);
|
|
52
|
-
}
|
|
53
|
-
try {
|
|
54
|
-
return salla.url.api(`products?source=${this.getSource()}&source_value[]=${this.getSourceValue().join('&source_value[]=')}${prefixes}`);
|
|
55
|
-
}
|
|
56
|
-
catch (e) {
|
|
57
|
-
salla.logger.warn(`source-value prop should be array of ids ex source-value="[1,2,3]" for the source [${this.getSource()}]`);
|
|
58
|
-
this.sourceValueIsValid = false;
|
|
59
|
-
}
|
|
60
|
-
}
|
|
61
39
|
getSource() {
|
|
62
40
|
return {
|
|
63
41
|
'brands.single': 'brands',
|
|
@@ -70,15 +48,26 @@ export class SallaProductsSlider {
|
|
|
70
48
|
}[this.source || salla.config.get('page.slug')] || this.source || 'latest';
|
|
71
49
|
}
|
|
72
50
|
getSourceValue() {
|
|
73
|
-
|
|
74
|
-
|
|
51
|
+
let source = this.getSource();
|
|
52
|
+
//todo:: enhance this code, it call JSON.parse too many times.
|
|
53
|
+
if (!['search', 'json', 'offers', 'latest', 'sales', 'related'].includes(source)) {
|
|
54
|
+
if (this.sourceValue && Array.isArray(JSON.parse(this.sourceValue)) && JSON.parse(this.sourceValue).length) {
|
|
75
55
|
return JSON.parse(this.sourceValue);
|
|
76
56
|
}
|
|
77
|
-
if (typeof JSON.parse(this.sourceValue) == 'number') {
|
|
57
|
+
if (this.sourceValue && typeof JSON.parse(this.sourceValue) == 'number') {
|
|
78
58
|
return [JSON.parse(this.sourceValue)];
|
|
79
59
|
}
|
|
60
|
+
if (!this.sourceValue && ['categories', 'tags', 'brands'].includes(this.getSource())) {
|
|
61
|
+
return [salla.config.get('page.id')];
|
|
62
|
+
}
|
|
63
|
+
}
|
|
64
|
+
if (this.sourceValue) {
|
|
65
|
+
return this.sourceValue;
|
|
66
|
+
}
|
|
67
|
+
if (source === 'search') {
|
|
68
|
+
return (new URLSearchParams(window.location.search)).get('q');
|
|
80
69
|
}
|
|
81
|
-
return
|
|
70
|
+
return salla.config.get('page.id');
|
|
82
71
|
}
|
|
83
72
|
canRender() {
|
|
84
73
|
return this.sourceValueIsValid && this.isReady;
|
|
@@ -89,7 +78,11 @@ export class SallaProductsSlider {
|
|
|
89
78
|
this.isReady = true;
|
|
90
79
|
return;
|
|
91
80
|
}
|
|
92
|
-
salla.
|
|
81
|
+
return salla.product.fetch({
|
|
82
|
+
source: this.getSource(),
|
|
83
|
+
source_value: this.getSourceValue(),
|
|
84
|
+
limit: this.limit,
|
|
85
|
+
}).then(res => {
|
|
93
86
|
this.productsData = res.data;
|
|
94
87
|
this.isReady = true;
|
|
95
88
|
});
|
|
@@ -99,7 +92,7 @@ export class SallaProductsSlider {
|
|
|
99
92
|
if ((this.getSource() == 'related' && !salla.config.get('store.settings.product.related_products_enabled')) || !this.canRender()) {
|
|
100
93
|
return;
|
|
101
94
|
}
|
|
102
|
-
return (h(Host, { class: "s-products-slider-wrapper" }, h("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 }, h("div", { slot: "items" }, (_a = this.productsData) === null || _a === void 0 ? void 0 : _a.map(
|
|
95
|
+
return (h(Host, { class: "s-products-slider-wrapper" }, h("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 }, h("div", { slot: "items" }, (_a = this.productsData) === null || _a === void 0 ? void 0 : _a.map(product => this.getItemHTML(product))))));
|
|
103
96
|
}
|
|
104
97
|
static get is() { return "salla-products-slider"; }
|
|
105
98
|
static get originalStyleUrls() {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"salla-products-slider.js","sourceRoot":"","sources":["../../../src/components/salla-products-slider/salla-products-slider.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAC,SAAS,EAAE,IAAI,EAAE,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,KAAK,EAAC,MAAM,eAAe,CAAC;AAMvE,MAAM,OAAO,mBAAmB;EAC9B;;;;;;;;;;;;kBAwE0B,EAAE;;IAvE1B,KAAK,CAAC,OAAO,CAAC,GAAG,EAAE;MACjB,IAAI,CAAC,kBAAkB,GAAG,CAAC,CAAC,CAAC,IAAI,CAAC,WAAW,IAAI,CAAC,QAAQ,EAAE,QAAQ,CAAC,CAAC,QAAQ,CAAC,IAAI,CAAC,SAAS,EAAE,CAAC,CAAC,CAAC;IACpG,CAAC,CAAC,CAAC;IACH,IAAI,CAAC,IAAI,CAAC,kBAAkB,EAAE;MAC5B,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,6CAA6C,IAAI,CAAC,SAAS,EAAE,GAAG,CAAC,CAAC;MACpF,OAAO;KACR;IACD,IAAI,CAAC,kBAAkB,GAAG,CAAC,CAAC,cAAc,CAAC,GAAG,CAAC,2BAA2B,CAAC,CAAC;GAC7E;EAkEO,WAAW,CAAC,OAAO;IACzB,IAAI,IAAI,CAAC,kBAAkB,EAAE;MAC3B,OAAO,WAAK,KAAK,EAAC,wBAAwB;QACxC,iCAA2B,OAAO,EAAE,OAAO,EAAE,MAAM,EAAE,IAAI,CAAC,SAAS,EAAE,kBAAgB,IAAI,CAAC,cAAc,EAAE,GAAG,CACzG,CAAC;KACR;IAED,OAAO,WAAK,KAAK,EAAC,wBAAwB;MACxC,2CACiB,IAAI,CAAC,SAAS,EAAE,IAAI,cAAc,kBACnC,IAAI,CAAC,SAAS,EAAE,IAAI,cAAc,qBAC/B,IAAI,EACrB,OAAO,EAAE,OAAO,GAAG,CACjB,CAAC;EACT,CAAC;EAEO,YAAY;IAClB,IAAI,SAAS,GAAG,EAAE,CAAC;IACnB,IAAI,IAAI,CAAC,KAAK,EAAE;MACd,SAAS,GAAG,aAAa,IAAI,CAAC,KAAK,GAAG,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,IAAI,CAAC,KAAK,EAAE,CAAC;KAC9D;IACD,OAAO,SAAS,CAAC;EACnB,CAAC;EAED,SAAS;IACP,IAAI,IAAI,CAAC,SAAS,EAAE,KAAK,MAAM,EAAE;MAC/B,OAAO;KACR;IACD,IAAI,QAAQ,GAAG,IAAI,CAAC,YAAY,EAAE,CAAC;IACnC,IAAI,CAAC,QAAQ,EAAE,QAAQ,CAAC,CAAC,QAAQ,CAAC,IAAI,CAAC,SAAS,EAAE,CAAC,EAAE;MACnD,OAAO,KAAK,CAAC,GAAG,CAAC,GAAG,CAAC,mBAAmB,IAAI,CAAC,SAAS,EAAE,GAAG,QAAQ,EAAE,CAAC,CAAC;KACxE;IACD,IAAI,CAAC,SAAS,EAAE,cAAc,CAAC,CAAC,QAAQ,CAAC,IAAI,CAAC,SAAS,EAAE,CAAC,EAAE;MAC1D,OAAO,KAAK,CAAC,GAAG,CAAC,GAAG,CAAC,mBAAmB,IAAI,CAAC,SAAS,EAAE,iBAAiB,IAAI,CAAC,cAAc,EAAE,GAAG,QAAQ,EAAE,CAAC,CAAC;KAC9G;IAED,IAAI;MACF,OAAO,KAAK,CAAC,GAAG,CAAC,GAAG,CAAC,mBAAmB,IAAI,CAAC,SAAS,EAAE,mBAAmB,IAAI,CAAC,cAAc,EAAE,CAAC,IAAI,CAAC,kBAAkB,CAAC,GAAG,QAAQ,EAAE,CAAC,CAAC;KACzI;IAAC,OAAO,CAAC,EAAE;MACV,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,sFAAsF,IAAI,CAAC,SAAS,EAAE,GAAG,CAAC,CAAC;MAC7H,IAAI,CAAC,kBAAkB,GAAG,KAAK,CAAC;KACjC;EACH,CAAC;EACO,SAAS;IACf,OAAO;MACL,eAAe,EAAE,QAAQ;MACzB,eAAe,EAAE,YAAY;MAC7B,sBAAsB,EAAE,QAAQ;MAChC,sBAAsB,EAAE,QAAQ;MAChC,sBAAsB,EAAE,QAAQ;MAChC,cAAc,EAAE,cAAc;MAC9B,mBAAmB,EAAE,MAAM;KAC5B,CAAC,IAAI,CAAC,MAAM,IAAI,KAAK,CAAC,MAAM,CAAC,GAAG,CAAC,WAAW,CAAC,CAAC,IAAI,IAAI,CAAC,MAAM,IAAG,QAAQ,CAAC;EAC5E,CAAC;EAEO,cAAc;IACnB,IAAI,CAAC,CAAC,QAAQ,EAAE,MAAM,CAAC,CAAC,QAAQ,CAAC,IAAI,CAAC,SAAS,EAAE,CAAC,EAAE;MACnD,IAAI,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC,IAAI,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC,MAAM,EAAE;QACtF,OAAO,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC;OACrC;MAED,IAAI,OAAO,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,WAAW,CAAC,IAAI,QAAQ,EAAE;QACnD,OAAO,CAAC,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC,CAAC;OACvC;KACF;IACD,OAAO,IAAI,CAAC,WAAW,IAAI,KAAK,CAAC,MAAM,CAAC,GAAG,CAAC,SAAS,CAAC,CAAC;EACzD,CAAC;EACO,SAAS;IACf,OAAO,IAAI,CAAC,kBAAkB,IAAI,IAAI,CAAC,OAAO,CAAC;EACjD,CAAC;EAED,iBAAiB;IACf,IAAI,IAAI,CAAC,MAAM,KAAK,MAAM,EAAE;MAC1B,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC,cAAc,EAAE,CAAC;MAC1C,IAAI,CAAC,OAAO,GAAG,IAAI,CAAA;MACnB,OAAO;KACR;IACD,KAAK,CAAC,GAAG,CAAC,OAAO,CAAC,IAAI,CAAC,SAAS,EAAE,EAAE,IAAI,EAAE,KAAK,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,EAAE;MAC1D,IAAI,CAAC,YAAY,GAAG,GAAG,CAAC,IAAI,CAAA;MAC5B,IAAI,CAAC,OAAO,GAAG,IAAI,CAAA;IACrB,CAAC,CAAC,CAAA;EACJ,CAAC;EAED,MAAM;;IACJ,IAAI,CAAC,IAAI,CAAC,SAAS,EAAE,IAAI,SAAS,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,GAAG,CAAC,iDAAiD,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC,SAAS,EAAE,EAAE;MAChI,OAAO;KACR;IACD,OAAO,CACL,EAAC,IAAI,IAAC,KAAK,EAAC,2BAA2B;MACrC,oBACE,KAAK,EAAC,0BAA0B,EAChC,EAAE,EAAE,IAAI,CAAC,QAAQ,IAAI,qBAAqB,IAAI,CAAC,MAAM,EAAE,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAC,MAAM,CAAC,CAAC,EAAE,CAAC,CAAC,EAAE,EACnF,IAAI,EAAC,UAAU,iBACF,IAAI,CAAC,UAAU,oBACZ,IAAI,CAAC,QAAQ,qBACZ,IAAI,CAAC,aAAa;QAEnC,WAAK,IAAI,EAAC,OAAO,IACd,MAAA,IAAI,CAAC,YAAY,0CAAE,GAAG,CAAC,CAAC,OAAO,EAAE,EAAE,CAClC,IAAI,CAAC,WAAW,CAAC,OAAO,CAAC,CAC1B,CACG,CACO,CACV,CACR,CAAC;EACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAEF","sourcesContent":["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\n /**\n * Limit for number of products in the list.\n */\n @Prop({mutable: true}) limit: number;\n\n \n @State() productsData: any;\n @State() isReady: boolean;\n @State() sourceValueIsValid: boolean;\n @State() hasCustomComponent: boolean;\n @State() apiUrl: string = '';\n @State() parsedSourceValue: any;\n\n private getItemHTML(product) {\n if (this.hasCustomComponent) {\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 private getUrlPrefix() {\n let urlPrefix = '';\n if (this.limit) {\n urlPrefix = `&per_page=${this.limit > 32 ? 32 : this.limit}`;\n }\n return urlPrefix;\n }\n\n getApiUrl() {\n if (this.getSource() === 'json') {\n return;\n }\n let prefixes = this.getUrlPrefix();\n if (['offers', 'latest'].includes(this.getSource())) {\n return salla.url.api(`products?source=${this.getSource()}${prefixes}`);\n }\n if (['related', 'landing-page'].includes(this.getSource())) {\n return salla.url.api(`products?source=${this.getSource()}&source_value=${this.getSourceValue()}${prefixes}`);\n }\n\n try {\n return salla.url.api(`products?source=${this.getSource()}&source_value[]=${this.getSourceValue().join('&source_value[]=')}${prefixes}`);\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"]}
|
|
1
|
+
{"version":3,"file":"salla-products-slider.js","sourceRoot":"","sources":["../../../src/components/salla-products-slider/salla-products-slider.tsx"],"names":[],"mappings":"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","sourcesContent":["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})\n\n//todo:: extends this component from salla-products-list or the opposite\nexport class SallaProductsSlider {\n constructor() {\n salla.onReady(() => {\n this.sourceValueIsValid = !!(this.getSource() || this.isSourceWithoutValue());\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 private isSourceWithoutValue() {\n return ['offers', 'latest', 'sales'].includes(this.getSource());\n }\n\n @Element() host: HTMLElement;\n //todo:: support limit, default =10, make sure that maximum is 32,\n\n /**\n * Title of the block - works only if slider is true\n * @type {string}\n * @default ''\n * */\n @Prop() blockTitle: string;\n\n /**\n * Sub title of the block - works only if slider is true\n * @type {string}\n * @default ''\n * */\n @Prop() subTitle: string;\n\n /**\n * Slider Id, if not provided will be generated automatically\n * @type {string}\n * @default ''\n * */\n @Prop() sliderId: string;\n\n /**\n * Display 'ALL' URL\n * @type {string}\n * @default ''\n * */\n @Prop() displayAllUrl: string;\n\n /**\n * Source of the products, if api will get the products from the API, if json will get the products from the products prop\n * @type {string}\n * @default ''\n * */\n @Prop({\n reflect: true,\n mutable: true\n }) source: 'categories' | 'latest' | 'related' | 'brands' | 'json' | 'tags' | 'selected' | 'offers' | 'landing-page';\n\n /**\n * The source value, cloud be different values as following:\n * - array of ids when `source` in ['categories', 'brands', 'tags', 'selected']\n * - products payload when `source` = 'json'\n * - product_id when `source` = 'related'\n *\n * @type {string}\n * */\n @Prop() sourceValue: string;\n\n /**\n * Limit for number of products in the list.\n */\n @Prop({mutable: true}) limit: number;\n\n\n @State() productsData: any;\n @State() isReady: boolean;\n @State() sourceValueIsValid: boolean;\n @State() hasCustomComponent: boolean;\n @State() apiUrl: string = '';\n @State() parsedSourceValue: any;\n\n private getItemHTML(product) {\n if (this.hasCustomComponent) {\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 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 let source = this.getSource();\n\n //todo:: enhance this code, it call JSON.parse too many times.\n if (!['search', 'json', 'offers', 'latest', 'sales' , 'related'].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'].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 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 return salla.product.fetch({\n source: this.getSource(),\n source_value: this.getSourceValue(),\n limit: this.limit,\n }).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 => this.getItemHTML(product))}\n </div>\n </salla-slider>\n </Host>\n );\n }\n\n}\n"]}
|
|
@@ -74,7 +74,7 @@ export class SallaSearch {
|
|
|
74
74
|
this.noResults.style.display = 'none';
|
|
75
75
|
//run loading spinner or stop it
|
|
76
76
|
this.loading = true;
|
|
77
|
-
salla.product.search
|
|
77
|
+
salla.product.fetch({ source: "search", source_value: val })
|
|
78
78
|
.then(response => this.results = response)
|
|
79
79
|
.catch(err => err !== 'Query is same as previous one!' ? this.results = undefined : null)
|
|
80
80
|
.finally(() => this.afterSearching(/*isEmpty*/ false));
|
|
@@ -89,12 +89,12 @@ export class SallaSearch {
|
|
|
89
89
|
}
|
|
90
90
|
render() {
|
|
91
91
|
var _a;
|
|
92
|
-
const searchContent = h("div", { class: { 's-search-container': true, 's-search-inline': this.inline }, ref: container => this.container = container }, h("input", { type: "search", enterkeyhint: "search", autocomplete: "off", class: "s-search-input", placeholder: salla.lang.get('blocks.header.search_placeholder'), onInput: e => this.debounceSearch(e), onKeyDown: e => this.handleKeyDown(e), ref: input => this.searchInput = input, style: { height: this.height + 'px', borderRadius: this.oval ? this.height / 2 + 'px' : '' } }), h("span", { class: "s-search-icon-wrap" }, h("span", { class: "s-search-icon", innerHTML: this.loading ? '<i class="s-search-spinner-loader"
|
|
93
|
-
_a.data.map(
|
|
94
|
-
.replace(/\{name\}/g,
|
|
95
|
-
.replace(/\{price\}/g, salla.money(
|
|
96
|
-
.replace(/\{regular_price\}/g,
|
|
97
|
-
.replace(/\{image\}/g,
|
|
92
|
+
const searchContent = h("div", { class: { 's-search-container': true, 's-search-inline': this.inline }, ref: container => this.container = container }, h("input", { type: "search", enterkeyhint: "search", autocomplete: "off", class: "s-search-input", placeholder: salla.lang.get('blocks.header.search_placeholder'), onInput: e => this.debounceSearch(e), onKeyDown: e => this.handleKeyDown(e), ref: input => this.searchInput = input, style: { height: this.height + 'px', borderRadius: this.oval ? this.height / 2 + 'px' : '' } }), h("span", { class: "s-search-icon-wrap" }, h("span", { class: "s-search-icon", innerHTML: this.loading ? '<i class="s-search-spinner-loader"/>' : Search })), h("div", { class: "s-search-results" }, (_a = this.results) === null || _a === void 0 ? void 0 :
|
|
93
|
+
_a.data.map((product) => h("a", { href: product.url, class: { "s-search-product": true, 's-search-product-not-available': !product.is_available }, innerHTML: this.productSlot
|
|
94
|
+
.replace(/\{name\}/g, product.name)
|
|
95
|
+
.replace(/\{price\}/g, salla.money(product.price))
|
|
96
|
+
.replace(/\{regular_price\}/g, product.is_on_sale ? salla.money(product.regular_price) : '')
|
|
97
|
+
.replace(/\{image\}/g, product.image.url) })), h("p", { ref: el => this.noResults = el, class: "s-search-no-results-placeholder" }, salla.lang.get('common.elements.no_options'))));
|
|
98
98
|
return (this.inline ?
|
|
99
99
|
h("div", { class: "s-search-modal" }, searchContent)
|
|
100
100
|
:
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"salla-search.js","sourceRoot":"","sources":["../../../src/components/salla-search/salla-search.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Prop, h, State, Element, Listen, Watch } from '@stencil/core';\nimport { HTMLStencilElement } from '@stencil/core/internal';\nimport SearchProductsResponse from \"./search-response\";\nimport Search from \"../../assets/svg/search.svg\";\nimport Helper from '../../Helpers/Helper';\n\n/**\n * @slot product - Replaces products card in the results, has replaceable props `{name}`, `{price}`, `{regular_price}`, `{image}`.\n */\n@Component({ tag: 'salla-search', styleUrl: 'salla-search.scss' })\nexport class SallaSearch {\n constructor() {\n this.productSlot = this.host.querySelector('[slot=\"product\"]')?.innerHTML || this.getDefaultProductSlot();\n salla.event.on('search::open', () => this.open());\n\n salla.lang.onLoaded(() => {\n this.translationLoaded = true;\n });\n\n salla.event.on('modalClosed', () => this.onModalClose())\n }\n\n private readonly productSlot: string;\n private modal: HTMLSallaModalElement;\n private container: HTMLElement;\n private searchInput: HTMLInputElement;\n private noResults: HTMLElement;\n private inputValue: string = '';\n\n @Element() host: HTMLStencilElement;\n @State() translationLoaded: boolean = false;\n @State() results: SearchProductsResponse | undefined;\n @State() loading: boolean = false;\n @State() typing: boolean = false;\n @State() debounce: ReturnType<typeof setTimeout> = setTimeout(() => '', 1000);\n @State() search_term: string;\n\n /**\n * Set the component display without modal window. Defaults to `false`\n */\n @Prop() inline: boolean = false;\n\n /**\n * Adds a border radius to the input. Half of the height.\n */\n @Prop() oval: boolean = false;\n\n /**\n * Sets the height of the input\n */\n @Prop() height: number = 60;\n\n async open() {\n if (!this.inline) {\n await this.modal.open().then(() => setTimeout(() => this.searchInput.focus(), 300)\n );\n }\n }\n onModalClose() {\n this.searchInput.value = '';\n this.results = undefined;\n this.afterSearching();\n this.container.classList.remove('s-search-no-results')\n }\n\n @Listen('keydown')\n handleKeyDown(ev: KeyboardEvent) {\n if (ev.key === 'Enter' && this.search_term?.length) {\n window.location.href = salla.url.get('search?q=' + encodeURI(this.search_term))\n }\n }\n\n private getDefaultProductSlot() {\n return '<div class=\"s-search-product-image-container\">' +\n ' <img class=\"s-search-product-image\" src=\"{image}\" alt=\"{name}\"/>' +\n '</div>' +\n '<div class=\"s-search-product-details\">' +\n ' <div class=\"s-search-product-title\">{name}</div> <div class=\"s-search-product-price\">{price} <span class=\"s-search-product-regular-price\">{regular_price}</span></div>' +\n '</div>';\n }\n\n private debounceSearch(event) {\n this.typing = true;\n clearTimeout(this.debounce)\n this.debounce = setTimeout(() => {\n this.typing = false\n this.search_term = event.target.value\n }, 700)\n }\n\n @Watch('search_term')\n handleSearch(val: string) {\n this.inputValue = val;\n if (val.length > 2) {\n this.search(val);\n }\n else {\n this.results = undefined;\n this.afterSearching();\n }\n }\n\n search(val) {\n\n this.noResults.style.display = 'none';\n //run loading spinner or stop it\n this.loading = true;\n salla.product.search(val)\n .then(response => this.results = response)\n .catch(err => err !== 'Query is same as previous one!' ? this.results = undefined : null)\n .finally(() => this.afterSearching(/*isEmpty*/ false));\n }\n\n private afterSearching(isEmpty = true) {\n this.noResults.style.display = isEmpty || this.results?.data.length > 0 ? 'none' : 'block';\n Helper.toggleElementClassIf(this.container, 's-search-container-open', 's-search-no-results', () => this.results?.data.length)\n this.loading = false\n salla.product.api.previousQuery = ''; //avoid having error 'Query is same as previous one!' after reopen modal;\n this.inputValue.length < 3 ? this.container.classList.remove('s-search-no-results') : '';\n }\n\n render() {\n const searchContent =\n <div class={{ 's-search-container': true, 's-search-inline': this.inline }} ref={container => this.container = container}>\n <input type=\"search\"\n enterkeyhint=\"search\"\n autocomplete=\"off\"\n class=\"s-search-input\"\n placeholder={salla.lang.get('blocks.header.search_placeholder')}\n onInput={e => this.debounceSearch(e)}\n onKeyDown={e => this.handleKeyDown(e)}\n ref={input => this.searchInput = input as HTMLInputElement}\n style={{ height: this.height + 'px', borderRadius: this.oval ? this.height / 2 + 'px' : '' }} />\n <span class=\"s-search-icon-wrap\"><span class=\"s-search-icon\" innerHTML={this.loading ? '<i class=\"s-search-spinner-loader\"></i>' : Search}></span></span>\n <div class=\"s-search-results\">\n {this.results?.data.map(item =>\n <a href={item.url} class={{ \"s-search-product\": true, 's-search-product-not-available': !item.is_available }} innerHTML={this.productSlot\n .replace(/\\{name\\}/g, item.name)\n .replace(/\\{price\\}/g, salla.money(item.price))\n .replace(/\\{regular_price\\}/g, item.has_special_price ? salla.money(item.regular_price) : '')\n .replace(/\\{image\\}/g, item.thumbnail)}/>\n )}\n <p ref={el => this.noResults = el} class=\"s-search-no-results-placeholder\">{salla.lang.get('common.elements.no_options')}</p>\n </div>\n </div>\n\n return (\n this.inline ?\n <div class=\"s-search-modal\">{searchContent}</div>\n :\n <salla-modal position=\"top\" class=\"s-search-modal\" ref={modal => this.modal = modal}>\n {searchContent}\n </salla-modal>\n );\n }\n\n /**\n * Run it one time after load\n */\n componentDidLoad() {\n this.afterSearching();\n }\n}\n"]}
|
|
1
|
+
{"version":3,"file":"salla-search.js","sourceRoot":"","sources":["../../../src/components/salla-search/salla-search.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Prop, h, State, Element, Listen, Watch } from '@stencil/core';\nimport { HTMLStencilElement } from '@stencil/core/internal';\nimport SearchProductsResponse from \"./search-response\";\nimport Search from \"../../assets/svg/search.svg\";\nimport Helper from '../../Helpers/Helper';\n\n/**\n * @slot product - Replaces products card in the results, has replaceable props `{name}`, `{price}`, `{regular_price}`, `{image}`.\n */\n@Component({ tag: 'salla-search', styleUrl: 'salla-search.scss' })\nexport class SallaSearch {\n constructor() {\n this.productSlot = this.host.querySelector('[slot=\"product\"]')?.innerHTML || this.getDefaultProductSlot();\n salla.event.on('search::open', () => this.open());\n\n salla.lang.onLoaded(() => {\n this.translationLoaded = true;\n });\n\n salla.event.on('modalClosed', () => this.onModalClose())\n }\n\n private readonly productSlot: string;\n private modal: HTMLSallaModalElement;\n private container: HTMLElement;\n private searchInput: HTMLInputElement;\n private noResults: HTMLElement;\n private inputValue: string = '';\n\n @Element() host: HTMLStencilElement;\n @State() translationLoaded: boolean = false;\n @State() results: SearchProductsResponse | undefined;\n @State() loading: boolean = false;\n @State() typing: boolean = false;\n @State() debounce: ReturnType<typeof setTimeout> = setTimeout(() => '', 1000);\n @State() search_term: string;\n\n /**\n * Set the component display without modal window. Defaults to `false`\n */\n @Prop() inline: boolean = false;\n\n /**\n * Adds a border radius to the input. Half of the height.\n */\n @Prop() oval: boolean = false;\n\n /**\n * Sets the height of the input\n */\n @Prop() height: number = 60;\n\n async open() {\n if (!this.inline) {\n await this.modal.open().then(() => setTimeout(() => this.searchInput.focus(), 300)\n );\n }\n }\n onModalClose() {\n this.searchInput.value = '';\n this.results = undefined;\n this.afterSearching();\n this.container.classList.remove('s-search-no-results')\n }\n\n @Listen('keydown')\n handleKeyDown(ev: KeyboardEvent) {\n if (ev.key === 'Enter' && this.search_term?.length) {\n window.location.href = salla.url.get('search?q=' + encodeURI(this.search_term))\n }\n }\n\n private getDefaultProductSlot() {\n return '<div class=\"s-search-product-image-container\">' +\n ' <img class=\"s-search-product-image\" src=\"{image}\" alt=\"{name}\"/>' +\n '</div>' +\n '<div class=\"s-search-product-details\">' +\n ' <div class=\"s-search-product-title\">{name}</div> <div class=\"s-search-product-price\">{price} <span class=\"s-search-product-regular-price\">{regular_price}</span></div>' +\n '</div>';\n }\n\n private debounceSearch(event) {\n this.typing = true;\n clearTimeout(this.debounce)\n this.debounce = setTimeout(() => {\n this.typing = false\n this.search_term = event.target.value\n }, 700)\n }\n\n @Watch('search_term')\n handleSearch(val: string) {\n this.inputValue = val;\n if (val.length > 2) {\n this.search(val);\n }\n else {\n this.results = undefined;\n this.afterSearching();\n }\n }\n\n search(val) {\n\n this.noResults.style.display = 'none';\n //run loading spinner or stop it\n this.loading = true;\n salla.product.fetch({source:\"search\", source_value:val})\n .then(response => this.results = response)\n .catch(err => err !== 'Query is same as previous one!' ? this.results = undefined : null)\n .finally(() => this.afterSearching(/*isEmpty*/ false));\n }\n\n private afterSearching(isEmpty = true) {\n this.noResults.style.display = isEmpty || this.results?.data.length > 0 ? 'none' : 'block';\n Helper.toggleElementClassIf(this.container, 's-search-container-open', 's-search-no-results', () => this.results?.data.length)\n this.loading = false\n salla.product.api.previousQuery = ''; //avoid having error 'Query is same as previous one!' after reopen modal;\n this.inputValue.length < 3 ? this.container.classList.remove('s-search-no-results') : '';\n }\n\n render() {\n const searchContent =\n <div class={{ 's-search-container': true, 's-search-inline': this.inline }} ref={container => this.container = container}>\n <input type=\"search\"\n enterkeyhint=\"search\"\n autocomplete=\"off\"\n class=\"s-search-input\"\n placeholder={salla.lang.get('blocks.header.search_placeholder')}\n onInput={e => this.debounceSearch(e)}\n onKeyDown={e => this.handleKeyDown(e)}\n ref={input => this.searchInput = input as HTMLInputElement}\n style={{ height: this.height + 'px', borderRadius: this.oval ? this.height / 2 + 'px' : '' }} />\n <span class=\"s-search-icon-wrap\"><span class=\"s-search-icon\" innerHTML={this.loading ? '<i class=\"s-search-spinner-loader\"/>' : Search}/></span>\n <div class=\"s-search-results\">\n {this.results?.data.map((product) =>\n <a href={product.url} class={{ \"s-search-product\": true, 's-search-product-not-available': !product.is_available }} innerHTML={this.productSlot\n .replace(/\\{name\\}/g, product.name)\n .replace(/\\{price\\}/g, salla.money(product.price))\n .replace(/\\{regular_price\\}/g, product.is_on_sale ? salla.money(product.regular_price) : '')\n .replace(/\\{image\\}/g, product.image.url)}/>\n )}\n <p ref={el => this.noResults = el} class=\"s-search-no-results-placeholder\">{salla.lang.get('common.elements.no_options')}</p>\n </div>\n </div>\n\n return (\n this.inline ?\n <div class=\"s-search-modal\">{searchContent}</div>\n :\n <salla-modal position=\"top\" class=\"s-search-modal\" ref={modal => this.modal = modal}>\n {searchContent}\n </salla-modal>\n );\n }\n\n /**\n * Run it one time after load\n */\n componentDidLoad() {\n this.afterSearching();\n }\n}\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"search-response.js","sourceRoot":"","sources":["../../../src/components/salla-search/search-response.ts"],"names":[],"mappings":"","sourcesContent":["
|
|
1
|
+
{"version":3,"file":"search-response.js","sourceRoot":"","sources":["../../../src/components/salla-search/search-response.ts"],"names":[],"mappings":"","sourcesContent":["import {ProductDetail} from \"@salla.sa/twilight/types/api/product\";\n\ntype Nullable<T> = T | undefined | null | '';\ntype Price= {\n amount: string;\n currency: string;\n}\ntype ProductType = 'product' | 'service' | 'group_products' | 'codes' | 'digital' | 'food' | 'donating';\n\nexport interface Product {\n id: number;\n name: string;\n type: ProductType;\n promotion: {\n title: Nullable<string>;\n sub_title: Nullable<string>;\n };\n price: Price;\n sale_price: Nullable<Price>;\n regular_price: Price;\n has_special_price: boolean;\n status: 'sale' | 'out';\n is_available: boolean;\n sku: Nullable<string>;\n currency: string | 'SAR';\n url: string;\n thumbnail: string;\n calories: Nullable<number>;\n}\n\ntype SortOption = {\n id: \"ourSuggest\" | \"bestSell\" | \"topRated\" | \"priceFromTopToLow\" | \"priceFromLowToTop\";\n name: string\n};\n\nexport default interface SearchProductsResponse {\n data: ProductDetail[];\n cursor: {\n current: number;\n previous: Nullable<string>;\n next: Nullable<string>;\n count: number;\n };\n features?: { sorting?: true };\n sort_options: SortOption[];\n}\n"]}
|
|
@@ -41,7 +41,7 @@ const SallaFiltersWidget = /*@__PURE__*/ proxyCustomElement(class extends HTMLEl
|
|
|
41
41
|
}
|
|
42
42
|
connectedCallback() {
|
|
43
43
|
//lets be smart and don't show 5 and more link for 8 options
|
|
44
|
-
this.withLoadMore = Array.isArray(this.option.values) && this.option.values.length > 8;
|
|
44
|
+
this.withLoadMore = this.option.key != 'price' && Array.isArray(this.option.values) && this.option.values.length > 8;
|
|
45
45
|
this.widgetTitle = this.option.label;
|
|
46
46
|
}
|
|
47
47
|
componentDidLoad() {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"file":"salla-filters-widget2.js","mappings":";;;;;;;;IAAY;AAAZ,WAAY,iBAAiB;;;;;;EAM3B,sCAAiB,CAAA;EACjB,0CAAqB,CAAA;EACrB,wCAAmB,CAAA;EACnB,oCAAe,CAAA;AACjB,CAAC,EAVW,iBAAiB,KAAjB,iBAAiB,QAU5B;IAEW;AAAZ,WAAY,qBAAqB;EAC/B,8CAAqB,CAAA;EACrB,wCAAe,CAAA;AACjB,CAAC,EAHW,qBAAqB,KAArB,qBAAqB;;ACZjC,MAAM,qBAAqB,GAAG,sBAAsB;;MCQvC,kBAAkB;;;;;IAWrB,eAAU,GAAW,GAAG,CAAC;;;;;kBACN,IAAI;sBACA,KAAK;;EAIpC,iBAAiB;;IAEf,IAAI,CAAC,YAAY,GAAG,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,MAAM,CAAC,MAAM,CAAC,IAAI,IAAI,CAAC,MAAM,CAAC,MAAM,CAAC,MAAM,GAAG,CAAC,CAAC;IACvF,IAAI,CAAC,WAAW,GAAG,IAAI,CAAC,MAAM,CAAC,KAAK,CAAC;GACtC;EAED,gBAAgB;IACd,IAAI,CAAC,YAAY,CAAC,YAAY,GAAG,IAAI,CAAC,UAAU,KAAK,IAAI,CAAC,YAAY,GAAG,KAAK,CAAC,CAAC;IAChF,CAAC,IAAI,CAAC,YAAY,IAAI,IAAI,CAAC,YAAY,MAAM,IAAI,CAAC,YAAY,CAAC,KAAK,CAAC,SAAS,GAAG,GAAG,IAAI,CAAC,UAAU,IAAI,CAAC,CAAC;IACzG,IAAI,CAAC,aAAa,CAAC,KAAK,CAAC,MAAM,GAAG,GAAG,IAAI,CAAC,aAAa,CAAC,YAAY,IAAI,CAAC;GAC1E;EAGD,MAAM,KAAK;IACT,IAAI,IAAI,CAAC,MAAM,CAAC,IAAI,KAAK,iBAAiB,CAAC,KAAK,EAAE;MAChD,IAAI,CAAC,UAAU,CAAC,KAAK,EAAE,CAAA;KACxB;IACD,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,gBAAgB,CAAC,OAAO,CAAC,CAAC,CAAC,OAAO,CAAC,KAAK,IAAI,KAAK,CAAC,OAAO,GAAG,KAAK,CAAC,CAAC;GACzF;EAID,MAAM,QAAQ;IACZ,IAAI,CAAC,UAAU,GAAG,CAAC,IAAI,CAAC,UAAU,CAAA;IAClC,IAAI,CAAC,aAAa,CAAC,KAAK,CAAC,MAAM,GAAG,MAAM,CAAC;IACzC,IAAI,CAAC,YAAY,CAAC,KAAK,CAAC,SAAS,GAAG,IAAI,CAAC,UAAU,GAAG,GAAG,IAAI,CAAC,YAAY,CAAC,YAAY,IAAI,GAAG,GAAG,IAAI,CAAC,UAAU,IAAI,CAAC;IACrH,UAAU,CAAC;MACT,IAAI,CAAC,aAAa,CAAC,KAAK,CAAC,MAAM,GAAG,GAAG,IAAI,CAAC,aAAa,CAAC,YAAY,IAAI,CAAC;KAC1E,EAAE,GAAG,CAAC,CAAC;GACT;EAGD,MAAM,YAAY;IAChB,IAAI,CAAC,MAAM,GAAG,CAAC,IAAI,CAAC,MAAM,CAAC;IAC3B,MAAM,CAAC,oBAAoB,CAAC,IAAI,CAAC,aAAa,EAAE,yBAAyB,EAAE,yBAAyB,EAAE,MAAM,IAAI,CAAC,MAAM,CAAC,CAAC;GAC1H;EAED,kBAAkB,CAAC,MAAc;IAC/B,IAAI,CAAC,CAAC,iBAAiB,CAAC,MAAM,EAAE,iBAAiB,CAAC,OAAO,EAAE,iBAAiB,CAAC,QAAQ,CAAC,CAAC,QAAQ,CAAC,MAAM,CAAC,IAAI,CAAC,EAAE;MAC5G,OAAO,EAAE,CAAC;KACX;;IAED,OAAO,MAAM,CAAC,MAAM,CAAC,GAAG,CAAC,CAAC,YAAY,EAAE,KAAK;MACzC,IAAI,KAAK,GAAG,OAAO,YAAY,IAAI,QAAQ,GAAG,YAAY,IAAI,YAAY,CAAC,GAAG,IAAI,YAAY,CAAC,KAAK,CAAC,CAAC;MAEtG,OAAO,aAAO,KAAK,EAAC,iBAAiB,EAAC,OAAO,EAAE,GAAG,MAAM,CAAC,GAAG,WAAW,KAAK,EAAE,IAC5E,aACE,EAAE,EAAE,GAAG,MAAM,CAAC,GAAG,WAAW,KAAK,EAAE,EACnC,IAAI,EAAE,MAAM,CAAC,GAAG,EAChB,IAAI,EAAE,MAAM,CAAC,SAAS;;QAEtB,OAAO,EAAE,IAAI,CAAC,gBAAgB,CAAC,MAAM,EAAE,KAAK,CAAC,EAC7C,KAAK,EAAE,aAAa,MAAM,CAAC,SAAS,EAAE,EACtC,QAAQ,EAAE,CAAC,IAAI,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,EAAC,KAAK,EAAE,CAAC,EAAE,MAAM,EAAE,MAAM,EAAE,KAAK,EAAE,KAAK,EAAC,CAAC,GAC1E,EACD,IAAI,CAAC,cAAc,CAAC,MAAM,EAAE,YAAY,CAAC,CACpC,CAAA;KACT,CACF,CAAA;GACF;EAEO,gBAAgB,CAAC,MAAc,EAAE,KAAK;IAC5C,IAAI,CAAC,IAAI,CAAC,WAAW,IAAI,CAAC,IAAI,CAAC,WAAW,CAAC,MAAM,CAAC,GAAG,CAAC,EAAE;MACtD,OAAO,KAAK,CAAA;KACb;IAED,OAAO,MAAM,CAAC,SAAS,KAAK,qBAAqB,CAAC,QAAQ;QACtD,IAAI,CAAC,WAAW,CAAC,MAAM,CAAC,GAAG,CAAC,CAAC,QAAQ,CAAC,KAAK,CAAC;QAC5C,IAAI,CAAC,WAAW,CAAC,MAAM,CAAC,GAAG,CAAC,IAAI,KAAK,CAAC;GAC3C;EAEO,cAAc,CAAC,MAAc,EAAE,YAAY;IACjD,IAAI,MAAM,CAAC,GAAG,IAAI,QAAQ,EAAE;;MAE1B,OAAO,0BAAoB,IAAI,EAAC,OAAO,EAAC,KAAK,EAAE,YAAY,GAAG,CAAC;KAChE;IACD,IAAI,KAAK,GAAG,YAAY,CAAC,KAAK,IAAI,MAAM,CAAC;;IAEzC,OAAO,YAAM,KAAK,EAAC,uBAAuB,IAAE,KAAK,CAAQ,CAAC;GAC3D;EAED,MAAM;IACJ,QACE,EAAC,IAAI,IAAC,KAAK,EAAC,4BAA4B,IACtC,UAAI,KAAK,EAAC,wBAAwB,EAAC,OAAO,EAAE,MAAM,IAAI,CAAC,YAAY,EAAE,IACnE,gBAAO,IAAI,CAAC,WAAW,CAAQ,EAC/B,YAAM,KAAK,EAAE,8BAA8B,IAAI,CAAC,MAAM,GAAG,mCAAmC,GAAG,EAAE,EAAE,GAAG,CACnG,EACL,WAAK,KAAK,EAAC,0BAA0B,EAAC,GAAG,EAAE,CAAC,EAAE,KAAK,IAAI,CAAC,aAAa,GAAG,EAAE,IACxE,WAAK,KAAK,EAAC,yBAAyB,EAAC,GAAG,EAAE,CAAC,EAAE,KAAK,IAAI,CAAC,YAAY,GAAG,EAAE,IACtE,eAAO,EAEL,IAAI,CAAC,MAAM,CAAC,IAAI,KAAK,iBAAiB,CAAC,KAAK;QACxC,IAAI,CAAC,kBAAkB,CAAC,IAAI,CAAC,MAAM,CAAC;QACpC,yBAAmB,SAAS,EAAE,CAAC,KAAK,KAAK,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,EACrD,GAAG,EAAE,KAAK,IAAI,IAAI,CAAC,UAAU,GAAG,KAAK,EACrC,WAAW,EAAE,IAAI,CAAC,WAAW,EAC7B,MAAM,EAAE,IAAI,CAAC,MAAM,GAAG,CAE3C,EACL,IAAI,CAAC,YAAY;MAClB,SAAG,KAAK,EAAC,uBAAuB,EAC7B,OAAO,EAAE,MAAM,IAAI,CAAC,QAAQ,EAAE,IAAG,CAAC,IAAI,CAAC,UAAU,GAAG,YAAY,GAAG,SAAS,CAAK,CAEhF,CACD,EACP;GACH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["./src/components/salla-filters/interfaces.ts","./src/components/salla-filters-widget/salla-filters-widget.scss?tag=salla-filters-widget","./src/components/salla-filters-widget/salla-filters-widget.tsx"],"sourcesContent":["export enum FilterOptionTypes {\n // CATEGORIES = \"categories\",\n // BRANDs = \"brands\",\n // RATING = \"rating\",\n // PRICE = \"price\",\n // RADIO = \"radio\",\n VALUES = \"values\",\n VARIANTS = \"variants\",\n MINIMUM = \"minimum\",\n RANGE = \"range\",\n}\n\nexport enum FilterOptionInputType {\n CHECKBOX = \"checkbox\",\n RADIO = \"radio\",\n}\n\n\nexport interface Filter {\n label: string,\n key: \"categories\" | string,//todo:: add possible values\n inputType: FilterOptionInputType,\n type: FilterOptionTypes,\n values: Array<{ count: string, value: string }> | { min: number, max: number }\n}\n",":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.reset()\n }\n Array.from(this.host.querySelectorAll('input')).forEach(input => input.checked = false);\n }\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 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 //in amazon has stars & up, should we add it, to avoid those people who will come to say I selected 4 why I see 5 sars products\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 {\n this.option.type !== FilterOptionTypes.RANGE\n ? this.renderFilterOption(this.option)\n : <salla-price-range onChanged={(event) => this.changed.emit(event.detail)}\n ref={price => this.priceRange = price}\n filtersData={this.filtersData}\n option={this.option}/>\n }\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"],"version":3}
|
|
1
|
+
{"file":"salla-filters-widget2.js","mappings":"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","names":[],"sources":["./src/components/salla-filters/interfaces.ts","./src/components/salla-filters-widget/salla-filters-widget.scss?tag=salla-filters-widget","./src/components/salla-filters-widget/salla-filters-widget.tsx"],"sourcesContent":["export enum FilterOptionTypes {\n // CATEGORIES = \"categories\",\n // BRANDs = \"brands\",\n // RATING = \"rating\",\n // PRICE = \"price\",\n // RADIO = \"radio\",\n VALUES = \"values\",\n VARIANTS = \"variants\",\n MINIMUM = \"minimum\",\n RANGE = \"range\",\n}\n\nexport enum FilterOptionInputType {\n CHECKBOX = \"checkbox\",\n RADIO = \"radio\",\n}\n\nexport interface FilterValue {\n key: string,\n count: string,\n value: string,\n from?: number| \"*\",\n to?: number | \"*\"\n}\n\nexport interface Filter {\n label: string,\n key: \"categories\" | string,//todo:: add possible values\n inputType: FilterOptionInputType,\n type: FilterOptionTypes,\n min?: number,\n max?: number,\n values: Array<FilterValue>\n}\n",":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 = this.option.key!='price' && 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.reset()\n }\n Array.from(this.host.querySelectorAll('input')).forEach(input => input.checked = false);\n }\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 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 //in amazon has stars & up, should we add it, to avoid those people who will come to say I selected 4 why I see 5 sars products\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 {\n this.option.type !== FilterOptionTypes.RANGE\n ? this.renderFilterOption(this.option)\n : <salla-price-range onChanged={(event) => this.changed.emit(event.detail)}\n ref={price => this.priceRange = price}\n filtersData={this.filtersData}\n option={this.option}/>\n }\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"],"version":3}
|