@salla.sa/twilight-components 2.11.91 → 2.11.92
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/{app-globals-692917e6.js → app-globals-25af4319.js} +3 -3
- package/dist/cjs/app-globals-25af4319.js.map +1 -0
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/cjs/salla-add-product-button_40.cjs.entry.js +1 -1
- package/dist/cjs/salla-add-product-button_40.cjs.entry.js.map +1 -1
- package/dist/cjs/salla-products-list.cjs.entry.js +2 -1
- package/dist/cjs/salla-products-list.cjs.entry.js.map +1 -1
- package/dist/cjs/twilight.cjs.js +1 -1
- package/dist/collection/components/salla-products-list/salla-products-list.js +2 -1
- package/dist/collection/components/salla-products-list/salla-products-list.js.map +1 -1
- package/dist/collection/components/salla-user-menu/salla-user-menu.js +0 -1
- package/dist/collection/components/salla-user-menu/salla-user-menu.js.map +1 -1
- package/dist/components/index.js +2 -2
- package/dist/components/index.js.map +1 -1
- package/dist/components/salla-products-list.js +2 -1
- package/dist/components/salla-products-list.js.map +1 -1
- package/dist/components/salla-user-menu.js +1 -1
- package/dist/components/salla-user-menu.js.map +1 -1
- package/dist/esm/{app-globals-b317c476.js → app-globals-138bc479.js} +3 -3
- package/dist/esm/app-globals-138bc479.js.map +1 -0
- package/dist/esm/loader.js +1 -1
- package/dist/esm/salla-add-product-button_40.entry.js +1 -1
- package/dist/esm/salla-add-product-button_40.entry.js.map +1 -1
- package/dist/esm/salla-products-list.entry.js +2 -1
- package/dist/esm/salla-products-list.entry.js.map +1 -1
- package/dist/esm/twilight.js +1 -1
- package/dist/esm-es5/{app-globals-b317c476.js → app-globals-138bc479.js} +3 -3
- package/dist/esm-es5/app-globals-138bc479.js.map +1 -0
- package/dist/esm-es5/loader.js +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-products-list.entry.js +1 -1
- package/dist/esm-es5/salla-products-list.entry.js.map +1 -1
- package/dist/esm-es5/twilight.js +1 -1
- package/dist/twilight/{p-b4d0f765.system.js → p-1356d900.system.js} +2 -2
- package/dist/twilight/{p-7d80e30e.system.entry.js → p-15174057.system.entry.js} +2 -2
- package/dist/twilight/p-15174057.system.entry.js.map +1 -0
- package/dist/twilight/{p-5cbafa09.system.js → p-5615c33d.system.js} +3 -3
- package/dist/twilight/p-5615c33d.system.js.map +1 -0
- package/dist/twilight/{p-8799a043.system.entry.js → p-73aacf46.system.entry.js} +2 -2
- package/dist/twilight/p-73aacf46.system.entry.js.map +1 -0
- package/dist/twilight/{p-d28f1ca5.entry.js → p-90cc80c6.entry.js} +2 -2
- package/dist/twilight/p-90cc80c6.entry.js.map +1 -0
- package/dist/twilight/{p-3914c37e.entry.js → p-a04518c5.entry.js} +2 -2
- package/dist/twilight/p-a04518c5.entry.js.map +1 -0
- package/dist/twilight/{p-3f3755b0.js → p-aca7dcc7.js} +2 -2
- package/dist/twilight/p-aca7dcc7.js.map +1 -0
- package/dist/twilight/twilight.esm.js +1 -1
- package/dist/twilight/twilight.js +1 -1
- package/package.json +3 -3
- package/dist/cjs/app-globals-692917e6.js.map +0 -1
- package/dist/esm/app-globals-b317c476.js.map +0 -1
- package/dist/esm-es5/app-globals-b317c476.js.map +0 -1
- package/dist/twilight/p-3914c37e.entry.js.map +0 -1
- package/dist/twilight/p-3f3755b0.js.map +0 -1
- package/dist/twilight/p-5cbafa09.system.js.map +0 -1
- package/dist/twilight/p-7d80e30e.system.entry.js.map +0 -1
- package/dist/twilight/p-8799a043.system.entry.js.map +0 -1
- package/dist/twilight/p-d28f1ca5.entry.js.map +0 -1
- /package/dist/twilight/{p-b4d0f765.system.js.map → p-1356d900.system.js.map} +0 -0
|
@@ -171,7 +171,8 @@ const SallaProductsList = class {
|
|
|
171
171
|
}
|
|
172
172
|
this.initiateInfiniteScroll();
|
|
173
173
|
this.loading();
|
|
174
|
-
salla.
|
|
174
|
+
salla.product.fetch({ source: this.source, sourceValue: this.sourceValue, filters: this.filters, limit: this.limit })
|
|
175
|
+
.then(res => {
|
|
175
176
|
if (!res.data.length) {
|
|
176
177
|
this.showPlaceholder = true;
|
|
177
178
|
this.loading(false);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"file":"salla-products-list.entry.cjs.js","mappings":"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","names":["h","Host"],"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, Watch } from '@stencil/core';\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 // this.source = this.source || 'latest';\n salla.onReady(() => {\n this.source = this.source || {\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 }[salla.config.get('page.slug')] || 'latest';\n this.sourceValue = this.sourceValue || this.getSourceValue()\n this.sourceValueIsValid = !!(this.sourceValue || ['latest', 'offers'].includes(this.source));\n this.isReady = true;\n });\n this.buildNextPageUrl();\n if (!this.sourceValueIsValid) {\n salla.logger.warn(`source-value prop is required for source [${this.source}]`);\n return;\n }\n this.hasCustomComponent = !!customElements.get('custom-salla-product-card');\n\n this.hasInfiniteScroll = !['json', 'selected', 'related', 'landing-page'].includes(this.source);\n // Language\n //enhance\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 readonly 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';\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() sourceValue: string;\n\n /**\n * Limit for number of products in the list.\n */\n @Prop({mutable: true}) limit: number;\n\n /**\n * Filter parameters. JSON STRING or object\n */\n @Prop({mutable: true}) filters: string;\n\n @Watch('limit')\n validateLimitMaximumValue(_newValue: number, _) {\n if (this.limit) {\n this.urlPrefix += `&per_page=${this.limit > 32 ? 32 : this.limit}}`;\n }\n }\n\n @Watch('filters')\n parseFilters(newValue: string | object, _) {\n this.filters = typeof newValue == 'string' ? JSON.parse(newValue) : newValue\n for (const [key, value] of Object.entries(this.filters)) {\n if (typeof value == \"string\") {\n this.urlPrefix += `&filters[${key}]=${value}}`;\n // TODO: only if there is going to be another type of value\n // otherwise we can remove the `else if` check. Just a fail safety\n } else if (Array.isArray(value)) {\n (value as any).forEach(item => {\n this.urlPrefix += `&filters[${key}][]=${item}}`\n })\n }\n }\n }\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() urlPrefix: string = '';\n\n\n private buildNextPageUrl() {\n if (this.source === 'json') {\n return;\n }\n if (['offers', 'latest'].includes(this.source)) {\n this.nextPage = salla.url.api(`products?source=${this.source}${this.urlPrefix}`);\n return;\n }\n\n if (['search', 'related', 'landing-page'].includes(this.source)) {\n this.nextPage = salla.url.api(`products?source=${this.source}&source_value=${this.sourceValue}${this.urlPrefix}`);\n return;\n }\n\n try {\n let ids: Array<number> = JSON.parse(this.sourceValue);\n this.nextPage = salla.url.api(`products?source=${this.source}&source_value[]=${ids.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.source}]`);\n this.sourceValueIsValid = false;\n }\n }\n\n private getSourceValue() {\n if (['landing-page'].includes(this.source)) {\n return `${salla.config.get('page.id')}`\n } else if (['categories', 'brands', 'tags'].includes(this.source)){\n return JSON.stringify([salla.config.get('page.id')])\n }\n return this.sourceValue;\n }\n \n private loading(isLoading = true) {\n this.btnLoader.style.display = isLoading ? 'inherit' : 'none';\n }\n\n private getItemHTML(product) {\n let customComponent: string | HTMLElement = this.hasCustomComponent ? 'custom-salla-product-card' : 'salla-product-card';\n customComponent = document.createElement(customComponent);\n customComponent.setAttribute('product', JSON.stringify(product));\n if (this.source == 'landing-page' && !this.hasCustomComponent) {\n customComponent.toggleAttribute('hide-add-btn', true);\n customComponent.toggleAttribute('show-quantity', true);\n customComponent.classList.add('s-product-card-fit-height');\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('afterend', 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\n\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}></span>\n <p>{this.placeholderText}</p>\n </div>;\n }\n return (\n <Host class=\"s-products-list\">\n <div class=\"s-products-list-wrapper\" ref={wrapper => this.wrapper = wrapper} />\n </Host>\n );\n }\n\n componentDidLoad() {\n if (!this.canRender()) {\n return;\n }\n if (this.source === 'json') {\n if (!this.sourceValue.length) {\n this.showPlaceholder = true;\n return;\n }\n JSON.parse(this.sourceValue).map(product => this.wrapper.append(this.getItemHTML(product)));\n return;\n }\n\n this.initiateInfiniteScroll();\n this.loading();\n salla.api.request(this.nextPage, null, 'get').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 handleResponse(response): Array<HTMLElement> {\n //💡 when source is related, cursor will not be existed\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"],"version":3}
|
|
1
|
+
{"file":"salla-products-list.entry.cjs.js","mappings":"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","names":["h","Host"],"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, Watch } from '@stencil/core';\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 // this.source = this.source || 'latest';\n salla.onReady(() => {\n this.source = this.source || {\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 }[salla.config.get('page.slug')] || 'latest';\n this.sourceValue = this.sourceValue || this.getSourceValue()\n this.sourceValueIsValid = !!(this.sourceValue || ['latest', 'offers'].includes(this.source));\n this.isReady = true;\n });\n this.buildNextPageUrl();\n if (!this.sourceValueIsValid) {\n salla.logger.warn(`source-value prop is required for source [${this.source}]`);\n return;\n }\n this.hasCustomComponent = !!customElements.get('custom-salla-product-card');\n\n this.hasInfiniteScroll = !['json', 'selected', 'related', 'landing-page'].includes(this.source);\n // Language\n //enhance\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 readonly 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';\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() sourceValue: string;\n\n /**\n * Limit for number of products in the list.\n */\n @Prop({mutable: true}) limit: number;\n\n /**\n * Filter parameters. JSON STRING or object\n */\n @Prop({mutable: true}) filters: string;\n\n @Watch('limit')\n validateLimitMaximumValue(_newValue: number, _) {\n if (this.limit) {\n this.urlPrefix += `&per_page=${this.limit > 32 ? 32 : this.limit}}`;\n }\n }\n\n @Watch('filters')\n parseFilters(newValue: string | object, _) {\n this.filters = typeof newValue == 'string' ? JSON.parse(newValue) : newValue\n for (const [key, value] of Object.entries(this.filters)) {\n if (typeof value == \"string\") {\n this.urlPrefix += `&filters[${key}]=${value}}`;\n // TODO: only if there is going to be another type of value\n // otherwise we can remove the `else if` check. Just a fail safety\n } else if (Array.isArray(value)) {\n (value as any).forEach(item => {\n this.urlPrefix += `&filters[${key}][]=${item}}`\n })\n }\n }\n }\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() urlPrefix: string = '';\n\n\n private buildNextPageUrl() {\n if (this.source === 'json') {\n return;\n }\n if (['offers', 'latest'].includes(this.source)) {\n this.nextPage = salla.url.api(`products?source=${this.source}${this.urlPrefix}`);\n return;\n }\n\n if (['search', 'related', 'landing-page'].includes(this.source)) {\n this.nextPage = salla.url.api(`products?source=${this.source}&source_value=${this.sourceValue}${this.urlPrefix}`);\n return;\n }\n\n try {\n let ids: Array<number> = JSON.parse(this.sourceValue);\n this.nextPage = salla.url.api(`products?source=${this.source}&source_value[]=${ids.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.source}]`);\n this.sourceValueIsValid = false;\n }\n }\n\n private getSourceValue() {\n if (['landing-page'].includes(this.source)) {\n return `${salla.config.get('page.id')}`\n } else if (['categories', 'brands', 'tags'].includes(this.source)){\n return JSON.stringify([salla.config.get('page.id')])\n }\n return this.sourceValue;\n }\n\n private loading(isLoading = true) {\n this.btnLoader.style.display = isLoading ? 'inherit' : 'none';\n }\n\n private getItemHTML(product) {\n let customComponent: string | HTMLElement = this.hasCustomComponent ? 'custom-salla-product-card' : 'salla-product-card';\n customComponent = document.createElement(customComponent);\n customComponent.setAttribute('product', JSON.stringify(product));\n if (this.source == 'landing-page' && !this.hasCustomComponent) {\n customComponent.toggleAttribute('hide-add-btn', true);\n customComponent.toggleAttribute('show-quantity', true);\n customComponent.classList.add('s-product-card-fit-height');\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('afterend', 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\n\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}></span>\n <p>{this.placeholderText}</p>\n </div>;\n }\n return (\n <Host class=\"s-products-list\">\n <div class=\"s-products-list-wrapper\" ref={wrapper => this.wrapper = wrapper} />\n </Host>\n );\n }\n\n componentDidLoad() {\n if (!this.canRender()) {\n return;\n }\n if (this.source === 'json') {\n if (!this.sourceValue.length) {\n this.showPlaceholder = true;\n return;\n }\n JSON.parse(this.sourceValue).map(product => this.wrapper.append(this.getItemHTML(product)));\n return;\n }\n\n this.initiateInfiniteScroll();\n this.loading();\n salla.product.fetch({source: this.source, sourceValue: this.sourceValue, filters: this.filters, limit: this.limit})\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 handleResponse(response): Array<HTMLElement> {\n //💡 when source is related, cursor will not be existed\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"],"version":3}
|
package/dist/cjs/twilight.cjs.js
CHANGED
|
@@ -160,7 +160,8 @@ export class SallaProductsList {
|
|
|
160
160
|
}
|
|
161
161
|
this.initiateInfiniteScroll();
|
|
162
162
|
this.loading();
|
|
163
|
-
salla.
|
|
163
|
+
salla.product.fetch({ source: this.source, sourceValue: this.sourceValue, filters: this.filters, limit: this.limit })
|
|
164
|
+
.then(res => {
|
|
164
165
|
if (!res.data.length) {
|
|
165
166
|
this.showPlaceholder = true;
|
|
166
167
|
this.loading(false);
|
|
@@ -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, Watch } from '@stencil/core';\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 // this.source = this.source || 'latest';\n salla.onReady(() => {\n this.source = this.source || {\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 }[salla.config.get('page.slug')] || 'latest';\n this.sourceValue = this.sourceValue || this.getSourceValue()\n this.sourceValueIsValid = !!(this.sourceValue || ['latest', 'offers'].includes(this.source));\n this.isReady = true;\n });\n this.buildNextPageUrl();\n if (!this.sourceValueIsValid) {\n salla.logger.warn(`source-value prop is required for source [${this.source}]`);\n return;\n }\n this.hasCustomComponent = !!customElements.get('custom-salla-product-card');\n\n this.hasInfiniteScroll = !['json', 'selected', 'related', 'landing-page'].includes(this.source);\n // Language\n //enhance\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 readonly 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';\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() sourceValue: string;\n\n /**\n * Limit for number of products in the list.\n */\n @Prop({mutable: true}) limit: number;\n\n /**\n * Filter parameters. JSON STRING or object\n */\n @Prop({mutable: true}) filters: string;\n\n @Watch('limit')\n validateLimitMaximumValue(_newValue: number, _) {\n if (this.limit) {\n this.urlPrefix += `&per_page=${this.limit > 32 ? 32 : this.limit}}`;\n }\n }\n\n @Watch('filters')\n parseFilters(newValue: string | object, _) {\n this.filters = typeof newValue == 'string' ? JSON.parse(newValue) : newValue\n for (const [key, value] of Object.entries(this.filters)) {\n if (typeof value == \"string\") {\n this.urlPrefix += `&filters[${key}]=${value}}`;\n // TODO: only if there is going to be another type of value\n // otherwise we can remove the `else if` check. Just a fail safety\n } else if (Array.isArray(value)) {\n (value as any).forEach(item => {\n this.urlPrefix += `&filters[${key}][]=${item}}`\n })\n }\n }\n }\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() urlPrefix: string = '';\n\n\n private buildNextPageUrl() {\n if (this.source === 'json') {\n return;\n }\n if (['offers', 'latest'].includes(this.source)) {\n this.nextPage = salla.url.api(`products?source=${this.source}${this.urlPrefix}`);\n return;\n }\n\n if (['search', 'related', 'landing-page'].includes(this.source)) {\n this.nextPage = salla.url.api(`products?source=${this.source}&source_value=${this.sourceValue}${this.urlPrefix}`);\n return;\n }\n\n try {\n let ids: Array<number> = JSON.parse(this.sourceValue);\n this.nextPage = salla.url.api(`products?source=${this.source}&source_value[]=${ids.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.source}]`);\n this.sourceValueIsValid = false;\n }\n }\n\n private getSourceValue() {\n if (['landing-page'].includes(this.source)) {\n return `${salla.config.get('page.id')}`\n } else if (['categories', 'brands', 'tags'].includes(this.source)){\n return JSON.stringify([salla.config.get('page.id')])\n }\n return this.sourceValue;\n }\n \n private loading(isLoading = true) {\n this.btnLoader.style.display = isLoading ? 'inherit' : 'none';\n }\n\n private getItemHTML(product) {\n let customComponent: string | HTMLElement = this.hasCustomComponent ? 'custom-salla-product-card' : 'salla-product-card';\n customComponent = document.createElement(customComponent);\n customComponent.setAttribute('product', JSON.stringify(product));\n if (this.source == 'landing-page' && !this.hasCustomComponent) {\n customComponent.toggleAttribute('hide-add-btn', true);\n customComponent.toggleAttribute('show-quantity', true);\n customComponent.classList.add('s-product-card-fit-height');\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('afterend', 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\n\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}></span>\n <p>{this.placeholderText}</p>\n </div>;\n }\n return (\n <Host class=\"s-products-list\">\n <div class=\"s-products-list-wrapper\" ref={wrapper => this.wrapper = wrapper} />\n </Host>\n );\n }\n\n componentDidLoad() {\n if (!this.canRender()) {\n return;\n }\n if (this.source === 'json') {\n if (!this.sourceValue.length) {\n this.showPlaceholder = true;\n return;\n }\n JSON.parse(this.sourceValue).map(product => this.wrapper.append(this.getItemHTML(product)));\n return;\n }\n\n this.initiateInfiniteScroll();\n this.loading();\n salla.api.request(this.nextPage, null, 'get').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 handleResponse(response): Array<HTMLElement> {\n //💡 when source is related, cursor will not be existed\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, Watch } from '@stencil/core';\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 // this.source = this.source || 'latest';\n salla.onReady(() => {\n this.source = this.source || {\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 }[salla.config.get('page.slug')] || 'latest';\n this.sourceValue = this.sourceValue || this.getSourceValue()\n this.sourceValueIsValid = !!(this.sourceValue || ['latest', 'offers'].includes(this.source));\n this.isReady = true;\n });\n this.buildNextPageUrl();\n if (!this.sourceValueIsValid) {\n salla.logger.warn(`source-value prop is required for source [${this.source}]`);\n return;\n }\n this.hasCustomComponent = !!customElements.get('custom-salla-product-card');\n\n this.hasInfiniteScroll = !['json', 'selected', 'related', 'landing-page'].includes(this.source);\n // Language\n //enhance\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 readonly 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';\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() sourceValue: string;\n\n /**\n * Limit for number of products in the list.\n */\n @Prop({mutable: true}) limit: number;\n\n /**\n * Filter parameters. JSON STRING or object\n */\n @Prop({mutable: true}) filters: string;\n\n @Watch('limit')\n validateLimitMaximumValue(_newValue: number, _) {\n if (this.limit) {\n this.urlPrefix += `&per_page=${this.limit > 32 ? 32 : this.limit}}`;\n }\n }\n\n @Watch('filters')\n parseFilters(newValue: string | object, _) {\n this.filters = typeof newValue == 'string' ? JSON.parse(newValue) : newValue\n for (const [key, value] of Object.entries(this.filters)) {\n if (typeof value == \"string\") {\n this.urlPrefix += `&filters[${key}]=${value}}`;\n // TODO: only if there is going to be another type of value\n // otherwise we can remove the `else if` check. Just a fail safety\n } else if (Array.isArray(value)) {\n (value as any).forEach(item => {\n this.urlPrefix += `&filters[${key}][]=${item}}`\n })\n }\n }\n }\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() urlPrefix: string = '';\n\n\n private buildNextPageUrl() {\n if (this.source === 'json') {\n return;\n }\n if (['offers', 'latest'].includes(this.source)) {\n this.nextPage = salla.url.api(`products?source=${this.source}${this.urlPrefix}`);\n return;\n }\n\n if (['search', 'related', 'landing-page'].includes(this.source)) {\n this.nextPage = salla.url.api(`products?source=${this.source}&source_value=${this.sourceValue}${this.urlPrefix}`);\n return;\n }\n\n try {\n let ids: Array<number> = JSON.parse(this.sourceValue);\n this.nextPage = salla.url.api(`products?source=${this.source}&source_value[]=${ids.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.source}]`);\n this.sourceValueIsValid = false;\n }\n }\n\n private getSourceValue() {\n if (['landing-page'].includes(this.source)) {\n return `${salla.config.get('page.id')}`\n } else if (['categories', 'brands', 'tags'].includes(this.source)){\n return JSON.stringify([salla.config.get('page.id')])\n }\n return this.sourceValue;\n }\n\n private loading(isLoading = true) {\n this.btnLoader.style.display = isLoading ? 'inherit' : 'none';\n }\n\n private getItemHTML(product) {\n let customComponent: string | HTMLElement = this.hasCustomComponent ? 'custom-salla-product-card' : 'salla-product-card';\n customComponent = document.createElement(customComponent);\n customComponent.setAttribute('product', JSON.stringify(product));\n if (this.source == 'landing-page' && !this.hasCustomComponent) {\n customComponent.toggleAttribute('hide-add-btn', true);\n customComponent.toggleAttribute('show-quantity', true);\n customComponent.classList.add('s-product-card-fit-height');\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('afterend', 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\n\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}></span>\n <p>{this.placeholderText}</p>\n </div>;\n }\n return (\n <Host class=\"s-products-list\">\n <div class=\"s-products-list-wrapper\" ref={wrapper => this.wrapper = wrapper} />\n </Host>\n );\n }\n\n componentDidLoad() {\n if (!this.canRender()) {\n return;\n }\n if (this.source === 'json') {\n if (!this.sourceValue.length) {\n this.showPlaceholder = true;\n return;\n }\n JSON.parse(this.sourceValue).map(product => this.wrapper.append(this.getItemHTML(product)));\n return;\n }\n\n this.initiateInfiniteScroll();\n this.loading();\n salla.product.fetch({source: this.source, sourceValue: this.sourceValue, filters: this.filters, limit: this.limit})\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 handleResponse(response): Array<HTMLElement> {\n //💡 when source is related, cursor will not be existed\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"]}
|
|
@@ -177,7 +177,6 @@ export class SallaUserMenu {
|
|
|
177
177
|
}
|
|
178
178
|
if (this.inline) {
|
|
179
179
|
return h(Host, null,
|
|
180
|
-
"this.inline ?",
|
|
181
180
|
h("ul", { class: "s-user-menu-inline" }, Object.entries(this.items).map((item, i) => this.getMenuItem(item, i))));
|
|
182
181
|
}
|
|
183
182
|
return (h(Host, null,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"salla-user-menu.js","sourceRoot":"","sources":["../../../src/components/salla-user-menu/salla-user-menu.tsx"],"names":[],"mappings":"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","sourcesContent":["import {Component, Host, h, State, Element, Prop} from '@stencil/core';\n// Icons\nimport ArrowDown from \"../../assets/svg/keyboard_arrow_down.svg\"\nimport BellRing from \"../../assets/svg/bell-ring.svg\"\nimport OrderIcon from \"../../assets/svg/box-bankers.svg\"\nimport PendingOrdersIcon from \"../../assets/svg/cart.svg\"\nimport WishListIcon from \"../../assets/svg/star.svg\"\nimport ProfileIcon from \"../../assets/svg/user-circle.svg\"\nimport LogoutIcon from \"../../assets/svg/send-out.svg\"\nimport Cancel from \"../../assets/svg/cancel.svg\"\nimport Rate from \"../../assets/svg/star2.svg\";\nimport UserCircle from \"../../assets/svg/user-circle.svg\";\n\n/**\n * @slot trigger - Replaces trigger widget, has replaceable props `{avatar}`, `{hello}`, `{first_name}`, `{last_name}`, `{icon}`.\n * @slot login-btn - Replaces the login button, it must be used with `salla.event.dispatch('login::open')` to open the login modal.\n */\n@Component({\n tag: 'salla-user-menu',\n styleUrl: 'salla-user-menu.scss',\n})\nexport class SallaUserMenu {\n constructor() {\n\n // salla.auth.event.onLoggedIn(() => {\n // this.is_loggedIn = true\n // })\n\n salla.lang.onLoaded(() => {\n this.notifications = salla.lang.get(\"common.titles.notifications\");\n this.orders = salla.lang.get(\"common.titles.orders\");\n this.pending_orders = salla.lang.get(\"common.titles.pending_orders\");\n this.wishlist = salla.lang.get(\"common.titles.wishlist\");\n this.profile = salla.lang.get(\"common.titles.profile\");\n this.hello = salla.lang.get(\"pages.checkout.hello\");\n this.rating = salla.lang.get(\"common.titles.rating\");\n this.logout = salla.lang.get(\"blocks.header.logout\");\n });\n\n //we need it only in theme-y\n if (this.host.hasAttribute('with-rating')) {\n this.items.rating = Rate;\n }\n //we need it to be the last item\n this.items.logout = LogoutIcon;\n\n this.triggerSlot = this.host.querySelector('[slot=\"trigger\"]')?.innerHTML || '<div class=\"s-user-menu-trigger\"><div class=\"s-user-menu-avatar-wrap\"><img class=\"s-user-menu-trigger-avatar\" src=\"{avatar}\" alt=\"{first_name}{last_name}\" /></div><div class=\"s-user-menu-trigger-content\"><span class=\"s-user-menu-trigger-hello\">{hello}</span><p class=\"s-user-menu-trigger-name\">{first_name} {last_name}</p></div> <i class=\"s-user-menu-trigger-icon\">{icon}</i></div>';\n salla.onReady(() => {\n if (salla.config.isGuest()) {\n return;\n }\n\n this.is_loggedIn = true;\n /**\n * Get Fresh Notifications In These Cases:\n * - is notification page, if user already changed the status of his orders (to reset notification badge)\n * - is pending orders page, if user already changed the status of his orders (to reset orders badge)\n * - is profile page, in case user changed his name or avatar, we need to update it\n * - half hour is passed from the last user data fetched\n *\n * //todo:: update the data in the storage in customer pages\n * //todo:: cover two requests in customer pages\n * //todo:: make sure to run this only after token is set\n */\n if (salla.url.is_page('customer.notifications')\n || salla.url.is_page('customer.orders.index.pending')\n || salla.url.is_page('customer.profile')\n || ((Date.now() - (salla.storage.get('user.fetched_at') || 0)) / 1000 / 60) > 30) {\n this.fetchFreshProfile();\n }\n });\n }\n\n private items: any = {\n notifications: BellRing,\n orders: OrderIcon,\n pending_orders: PendingOrdersIcon,\n wishlist: WishListIcon,\n profile: ProfileIcon,\n };\n\n @Element() host: HTMLElement;\n private readonly triggerSlot: string;\n @State() accountLoading: boolean = false;\n @State() opened: boolean = false;\n @State() notifications: string = salla.lang.get(\"common.titles.notifications\");\n @State() orders: string = salla.lang.get(\"common.titles.orders\");\n @State() pending_orders: string = salla.lang.get(\"common.titles.pending_orders\");\n @State() wishlist: string = salla.lang.get(\"common.titles.wishlist\");\n @State() profile: string = salla.lang.get(\"common.titles.profile\");\n @State() rating: string = salla.lang.get(\"common.titles.rating\");\n @State() logout: string = salla.lang.get(\"blocks.header.logout\");\n @State() hello: string = salla.lang.get(\"pages.checkout.hello\");\n @State() first_name: string = salla.storage.get('user.first_name') || '';\n @State() last_name: string = salla.storage.get('user.last_name') || '';\n @State() avatar: string = salla.storage.get('user.avatar') || salla.url.cdn('images/avatar.png');\n @State() is_loggedIn: boolean;\n @State() badges: any = {\n notifications: salla.helpers.number(salla.storage.get('user.notifications') || 0),\n pending_orders: salla.helpers.number(salla.storage.get('user.pending_orders') || 0)\n };\n\n @State() hasBadges: boolean = Number(salla.storage.get('user.pending_orders')) > 0 || Number(salla.storage.get('user.notifications')) > 0;\n /**\n * To display only the list without the dropdown functionality\n */\n @Prop({reflect: true}) inline: boolean = false;\n\n /**\n * To display the trigger as an avatar only\n */\n @Prop({reflect: true}) avatarOnly: boolean = false;\n\n /**\n * To display the dropdown header in mobile sheet\n */\n @Prop({reflect: true}) showHeader: boolean = false;\n\n /**\n * To Make the dropdown menu relative to parent element or not\n */\n @Prop({reflect: true}) relativeDropdown: boolean = false;\n\n private onClickOutside = () => {\n this.opened = false;\n }\n\n @State() OrderUpdate: number = 0;\n\n private fetchFreshProfile() {\n //don't request fetchFreshProfile unless token is injected into the api\n if (!salla.api.token) {\n salla.log('trying to fetchFreshProfile before injected the token!!');\n return;\n }\n salla.profile.api.info()\n .then((res) => {\n this.badges.pending_orders = salla.helpers.number(res.data.pending_orders || 0);\n this.badges.notifications = salla.helpers.number(res.data.notifications || 0);\n this.hasBadges = Number(res.data.pending_orders) > 0 || Number(res.data.notifications) > 0;\n this.first_name = res.data.first_name;\n this.last_name = res.data.last_name;\n this.avatar = res.data.avatar || salla.url.cdn('images/avatar.png');\n });\n }\n\n async open(e) {\n this.opened = !this.opened;\n e.stopPropagation()\n if (this.opened) {\n window.addEventListener('click', this.onClickOutside);\n }\n }\n\n private menuItemClicked(event: Event, item: string[]) {\n if (item[0] !== 'logout') {\n return;\n }\n event.preventDefault();\n salla.auth.logout();\n }\n\n private getTheHeader() {\n return <div class={{\n 's-user-menu-trigger-slot': true,\n 's-user-menu-red-dot': this.hasBadges,\n 's-user-menu-trigger-avatar-only': this.avatarOnly\n }}\n id='trigger-slot' onClick={(e) => this.open(e)} innerHTML={this.triggerSlot\n .replace(/\\{hello\\}/g, this.hello)\n .replace(/\\{first_name\\}/g, this.first_name)\n .replace(/\\{last_name\\}/g, this.last_name)\n .replace(/\\{avatar\\}/g, this.avatar)\n .replace(/\\{icon\\}/g, ArrowDown)}>\n </div>;\n }\n\n private getMenuItem(item: any[], i: number) {\n //todo:: enhancement support slot here\n return <li class={{\n 's-user-menu-dropdown-item': true,\n 's-user-menu-dropdown-item-logout': i + 1 == Object.entries(this.items).length\n }}>\n <a href={salla.url.get(item[0])} onClick={event => this.menuItemClicked(event, item)}>\n <i innerHTML={item[1]}> </i>\n <span class=\"s-user-menu-dropdown-item-title\">{this[item[0]]}</span>\n {!['٠', '0', undefined].includes(this.badges[item[0]])\n ? <span class=\"s-user-menu-dropdown-item-badge\">{this.badges[item[0]]}</span>\n : \"\"}\n </a>\n </li>;\n }\n\n componentShouldUpdate() {\n if (!this.opened) {\n window.removeEventListener('click', this.onClickOutside);\n }\n }\n\n render() {\n if (!this.is_loggedIn) {\n return <Host>\n <slot name='login-btn'>\n <button class=\"s-user-menu-login-btn\" onClick={() => salla.event.dispatch('login::open')}\n innerHTML={UserCircle}>\n </button>\n </slot>\n </Host>\n }\n\n if (this.inline) {\n return <Host>\n this.inline ?\n <ul class=\"s-user-menu-inline\">\n {Object.entries(this.items).map((item, i) => this.getMenuItem(item, i))}\n </ul>\n </Host>\n }\n\n return (\n <Host>\n <div class={{'s-user-menu-wrapper': true, 's-user-menu-relative-dropdown': this.relativeDropdown}}>\n {this.getTheHeader()}\n <div class={{'s-user-menu-toggler': true, 'opened': this.opened}}>\n <div class=\"s-user-menu-dropdown\" onClick={(e) => e.stopPropagation()}>\n {this.showHeader ? <div class=\"s-user-menu-dropdown-header\">\n <img src={this.avatar} alt={`${this.first_name} ${this.last_name}`}/>\n <div class=\"s-user-menu-dropdown-header-content\">\n <span>{this.hello}</span>\n <p>{this.first_name} {this.last_name}</p>\n </div>\n <button class=\"s-user-menu-dropdown-header-close\" innerHTML={Cancel}\n onClick={() => this.opened = false}>\n </button>\n </div> : ''}\n <ul class=\"s-user-menu-dropdown-list\">\n {Object.entries(this.items).map((item, i) => this.getMenuItem(item, i))}\n </ul>\n </div>\n </div>\n </div>\n </Host>\n );\n }\n\n componentDidLoad() {\n //make sure to load the avatar if it's lazy, we use it in Y\n document.lazyLoadInstance?.update(this.host.querySelectorAll('.lazy'));\n }\n}\n"]}
|
|
1
|
+
{"version":3,"file":"salla-user-menu.js","sourceRoot":"","sources":["../../../src/components/salla-user-menu/salla-user-menu.tsx"],"names":[],"mappings":"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","sourcesContent":["import {Component, Host, h, State, Element, Prop} from '@stencil/core';\n// Icons\nimport ArrowDown from \"../../assets/svg/keyboard_arrow_down.svg\"\nimport BellRing from \"../../assets/svg/bell-ring.svg\"\nimport OrderIcon from \"../../assets/svg/box-bankers.svg\"\nimport PendingOrdersIcon from \"../../assets/svg/cart.svg\"\nimport WishListIcon from \"../../assets/svg/star.svg\"\nimport ProfileIcon from \"../../assets/svg/user-circle.svg\"\nimport LogoutIcon from \"../../assets/svg/send-out.svg\"\nimport Cancel from \"../../assets/svg/cancel.svg\"\nimport Rate from \"../../assets/svg/star2.svg\";\nimport UserCircle from \"../../assets/svg/user-circle.svg\";\n\n/**\n * @slot trigger - Replaces trigger widget, has replaceable props `{avatar}`, `{hello}`, `{first_name}`, `{last_name}`, `{icon}`.\n * @slot login-btn - Replaces the login button, it must be used with `salla.event.dispatch('login::open')` to open the login modal.\n */\n@Component({\n tag: 'salla-user-menu',\n styleUrl: 'salla-user-menu.scss',\n})\nexport class SallaUserMenu {\n constructor() {\n\n // salla.auth.event.onLoggedIn(() => {\n // this.is_loggedIn = true\n // })\n\n salla.lang.onLoaded(() => {\n this.notifications = salla.lang.get(\"common.titles.notifications\");\n this.orders = salla.lang.get(\"common.titles.orders\");\n this.pending_orders = salla.lang.get(\"common.titles.pending_orders\");\n this.wishlist = salla.lang.get(\"common.titles.wishlist\");\n this.profile = salla.lang.get(\"common.titles.profile\");\n this.hello = salla.lang.get(\"pages.checkout.hello\");\n this.rating = salla.lang.get(\"common.titles.rating\");\n this.logout = salla.lang.get(\"blocks.header.logout\");\n });\n\n //we need it only in theme-y\n if (this.host.hasAttribute('with-rating')) {\n this.items.rating = Rate;\n }\n //we need it to be the last item\n this.items.logout = LogoutIcon;\n\n this.triggerSlot = this.host.querySelector('[slot=\"trigger\"]')?.innerHTML || '<div class=\"s-user-menu-trigger\"><div class=\"s-user-menu-avatar-wrap\"><img class=\"s-user-menu-trigger-avatar\" src=\"{avatar}\" alt=\"{first_name}{last_name}\" /></div><div class=\"s-user-menu-trigger-content\"><span class=\"s-user-menu-trigger-hello\">{hello}</span><p class=\"s-user-menu-trigger-name\">{first_name} {last_name}</p></div> <i class=\"s-user-menu-trigger-icon\">{icon}</i></div>';\n salla.onReady(() => {\n if (salla.config.isGuest()) {\n return;\n }\n\n this.is_loggedIn = true;\n /**\n * Get Fresh Notifications In These Cases:\n * - is notification page, if user already changed the status of his orders (to reset notification badge)\n * - is pending orders page, if user already changed the status of his orders (to reset orders badge)\n * - is profile page, in case user changed his name or avatar, we need to update it\n * - half hour is passed from the last user data fetched\n *\n * //todo:: update the data in the storage in customer pages\n * //todo:: cover two requests in customer pages\n * //todo:: make sure to run this only after token is set\n */\n if (salla.url.is_page('customer.notifications')\n || salla.url.is_page('customer.orders.index.pending')\n || salla.url.is_page('customer.profile')\n || ((Date.now() - (salla.storage.get('user.fetched_at') || 0)) / 1000 / 60) > 30) {\n this.fetchFreshProfile();\n }\n });\n }\n\n private items: any = {\n notifications: BellRing,\n orders: OrderIcon,\n pending_orders: PendingOrdersIcon,\n wishlist: WishListIcon,\n profile: ProfileIcon,\n };\n\n @Element() host: HTMLElement;\n private readonly triggerSlot: string;\n @State() accountLoading: boolean = false;\n @State() opened: boolean = false;\n @State() notifications: string = salla.lang.get(\"common.titles.notifications\");\n @State() orders: string = salla.lang.get(\"common.titles.orders\");\n @State() pending_orders: string = salla.lang.get(\"common.titles.pending_orders\");\n @State() wishlist: string = salla.lang.get(\"common.titles.wishlist\");\n @State() profile: string = salla.lang.get(\"common.titles.profile\");\n @State() rating: string = salla.lang.get(\"common.titles.rating\");\n @State() logout: string = salla.lang.get(\"blocks.header.logout\");\n @State() hello: string = salla.lang.get(\"pages.checkout.hello\");\n @State() first_name: string = salla.storage.get('user.first_name') || '';\n @State() last_name: string = salla.storage.get('user.last_name') || '';\n @State() avatar: string = salla.storage.get('user.avatar') || salla.url.cdn('images/avatar.png');\n @State() is_loggedIn: boolean;\n @State() badges: any = {\n notifications: salla.helpers.number(salla.storage.get('user.notifications') || 0),\n pending_orders: salla.helpers.number(salla.storage.get('user.pending_orders') || 0)\n };\n\n @State() hasBadges: boolean = Number(salla.storage.get('user.pending_orders')) > 0 || Number(salla.storage.get('user.notifications')) > 0;\n /**\n * To display only the list without the dropdown functionality\n */\n @Prop({reflect: true}) inline: boolean = false;\n\n /**\n * To display the trigger as an avatar only\n */\n @Prop({reflect: true}) avatarOnly: boolean = false;\n\n /**\n * To display the dropdown header in mobile sheet\n */\n @Prop({reflect: true}) showHeader: boolean = false;\n\n /**\n * To Make the dropdown menu relative to parent element or not\n */\n @Prop({reflect: true}) relativeDropdown: boolean = false;\n\n private onClickOutside = () => {\n this.opened = false;\n }\n\n @State() OrderUpdate: number = 0;\n\n private fetchFreshProfile() {\n //don't request fetchFreshProfile unless token is injected into the api\n if (!salla.api.token) {\n salla.log('trying to fetchFreshProfile before injected the token!!');\n return;\n }\n salla.profile.api.info()\n .then((res) => {\n this.badges.pending_orders = salla.helpers.number(res.data.pending_orders || 0);\n this.badges.notifications = salla.helpers.number(res.data.notifications || 0);\n this.hasBadges = Number(res.data.pending_orders) > 0 || Number(res.data.notifications) > 0;\n this.first_name = res.data.first_name;\n this.last_name = res.data.last_name;\n this.avatar = res.data.avatar || salla.url.cdn('images/avatar.png');\n });\n }\n\n async open(e) {\n this.opened = !this.opened;\n e.stopPropagation()\n if (this.opened) {\n window.addEventListener('click', this.onClickOutside);\n }\n }\n\n private menuItemClicked(event: Event, item: string[]) {\n if (item[0] !== 'logout') {\n return;\n }\n event.preventDefault();\n salla.auth.logout();\n }\n\n private getTheHeader() {\n return <div class={{\n 's-user-menu-trigger-slot': true,\n 's-user-menu-red-dot': this.hasBadges,\n 's-user-menu-trigger-avatar-only': this.avatarOnly\n }}\n id='trigger-slot' onClick={(e) => this.open(e)} innerHTML={this.triggerSlot\n .replace(/\\{hello\\}/g, this.hello)\n .replace(/\\{first_name\\}/g, this.first_name)\n .replace(/\\{last_name\\}/g, this.last_name)\n .replace(/\\{avatar\\}/g, this.avatar)\n .replace(/\\{icon\\}/g, ArrowDown)}>\n </div>;\n }\n\n private getMenuItem(item: any[], i: number) {\n //todo:: enhancement support slot here\n return <li class={{\n 's-user-menu-dropdown-item': true,\n 's-user-menu-dropdown-item-logout': i + 1 == Object.entries(this.items).length\n }}>\n <a href={salla.url.get(item[0])} onClick={event => this.menuItemClicked(event, item)}>\n <i innerHTML={item[1]}> </i>\n <span class=\"s-user-menu-dropdown-item-title\">{this[item[0]]}</span>\n {!['٠', '0', undefined].includes(this.badges[item[0]])\n ? <span class=\"s-user-menu-dropdown-item-badge\">{this.badges[item[0]]}</span>\n : \"\"}\n </a>\n </li>;\n }\n\n componentShouldUpdate() {\n if (!this.opened) {\n window.removeEventListener('click', this.onClickOutside);\n }\n }\n\n render() {\n if (!this.is_loggedIn) {\n return <Host>\n <slot name='login-btn'>\n <button class=\"s-user-menu-login-btn\" onClick={() => salla.event.dispatch('login::open')}\n innerHTML={UserCircle}>\n </button>\n </slot>\n </Host>\n }\n\n if (this.inline) {\n return <Host>\n <ul class=\"s-user-menu-inline\">\n {Object.entries(this.items).map((item, i) => this.getMenuItem(item, i))}\n </ul>\n </Host>\n }\n\n return (\n <Host>\n <div class={{'s-user-menu-wrapper': true, 's-user-menu-relative-dropdown': this.relativeDropdown}}>\n {this.getTheHeader()}\n <div class={{'s-user-menu-toggler': true, 'opened': this.opened}}>\n <div class=\"s-user-menu-dropdown\" onClick={(e) => e.stopPropagation()}>\n {this.showHeader ? <div class=\"s-user-menu-dropdown-header\">\n <img src={this.avatar} alt={`${this.first_name} ${this.last_name}`}/>\n <div class=\"s-user-menu-dropdown-header-content\">\n <span>{this.hello}</span>\n <p>{this.first_name} {this.last_name}</p>\n </div>\n <button class=\"s-user-menu-dropdown-header-close\" innerHTML={Cancel}\n onClick={() => this.opened = false}>\n </button>\n </div> : ''}\n <ul class=\"s-user-menu-dropdown-list\">\n {Object.entries(this.items).map((item, i) => this.getMenuItem(item, i))}\n </ul>\n </div>\n </div>\n </div>\n </Host>\n );\n }\n\n componentDidLoad() {\n //make sure to load the avatar if it's lazy, we use it in Y\n document.lazyLoadInstance?.update(this.host.querySelectorAll('.lazy'));\n }\n}\n"]}
|