@salla.sa/twilight-components 2.12.32 → 2.12.34

package/dist/esm-es5/salla-products-list.entry.js.map

@@ -1 +1 @@
-{"version":3,"names":["sallaProductsListCss","SallaProductsList","class_1","prototype","connectedCallback","_this","this","salla","onReady","hasCustomComponent","customElements","get","sourceValueIsValid","getSourceValue","isSourceWithoutValue","hasInfiniteScroll","includes","getSource","searchParams","URLSearchParams","window","location","search","sortBy","filters","parsedFilters","JSON","parse","decodeURIComponent","e","logger","warn","message","buildNextPageUrl","createStatusDom","isReady","concat","event","on","setFilters","stringify","scrollTo","top","behavior","reload","infiniteScroll","destroy","wrapper","innerHTML","init","isFilterable","config","filtersResults","animateItems","anime","targets","opacity","duration","translateY","delay","_el","i","status","document","createElement","className","lang","btnLoader","querySelector","onLoaded","placeholderText","initBaseNextPageUrl","source","nextPage","url","api","limit","key","value","this_1","encodeURIComponent","Array","isArray","forEach","item","_j","_k","Object","entries","length","_l","k","v","_i","_g","_h","join","loading","isLoading","style","display","getItemHTML","product","customComponentTag","productCard","applyLandingPageStyles","applyHorizontalCardStyles","toggleAttribute","classList","add","horizontalCards","setAttribute","Helper","getProductsSource","getProductsSourceValue","sourceValue","fetchProducts","fetch","source_value","then","res","data","showPlaceholder","handleResponse","card","append","initiateInfiniteScroll","host","insertAdjacentElement","initiate","path","history","scrollThreshold","_a","_b","response","pageIndex","appendItems","_c","remove","loadNextPage","canRender","render","h","class","ShoppingBag","Host","ref","componentDidLoad","map","title","cursor","current","getPageTitleForSource","word","catId_1","category_id","_d","find","filter","values","cat","choice","_e","replace","emit","productsFetched","next","option","loadOnScroll","_f"],"sources":["src/components/salla-products-list/salla-products-list.scss?tag=salla-products-list","src/components/salla-products-list/salla-products-list.tsx"],"sourcesContent":["\n","import { Component, Host, h, Prop, State, Element, Method, Event, EventEmitter } from '@stencil/core';\nimport anime from 'animejs';\nimport ShoppingBag from '../../assets/svg/shopping-bag.svg';\nimport Helper from '../../Helpers/Helper';\n@Component({\n  tag: 'salla-products-list',\n  styleUrl: 'salla-products-list.scss'\n})\nexport class SallaProductsList {\n  connectedCallback() {\n    salla.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  /**\n   * Set parsed filters data from URI\n   * @param filters\n   */\n  @Method()\n  async setFilters(filters) {\n    if (!!filters && JSON.stringify(this.parsedFilters) === JSON.stringify(filters)) {\n      return;\n    }\n    window.scrollTo({ top: 0, behavior: 'smooth' });\n    this.parsedFilters = filters;\n    return this.reload();\n  }\n\n  /**\n   * Reload the list of products (entire content of the component).\n   */\n  @Method()\n  async reload() {\n    salla.infiniteScroll.destroy(this.infiniteScroll);\n    this.buildNextPageUrl();\n    // TODO: this is problematic in testing, for the time being it's been resolved like this\n    this.wrapper.innerHTML = '';\n    this.init();\n  }\n\n\n  private status: HTMLDivElement;\n  private btnLoader: HTMLAnchorElement;\n  @Element() host: HTMLElement;\n  private wrapper: any;\n  private infiniteScroll: any;\n  /**\n   * The source of the products list\n   * @type {string}\n   * */\n  @Prop({\n    reflect: true,\n    mutable: true\n  }) source: 'categories' | 'latest' | 'related' | 'brands' | 'json' | 'search' | 'tags' | 'selected' | 'offers' | 'landing-page' | 'sales';\n\n  /**\n   * The source value, cloud be different values as following:\n   * - array of ids when `source` in ['categories', 'brands', 'tags', 'selected']\n   * - keyword when `source` = 'search'\n   * - products payload when `source` = 'json'\n   * - product_id when `source` = 'related'\n   *\n   * @type {string}\n   * */\n  @Prop({ mutable: true }) sourceValue: any;\n\n  /**\n   * Limit for number of products in the list.\n   */\n  @Prop({ mutable: true }) limit: number;\n\n  /**\n   * Sorting the list of products\n   */\n  @Prop({ mutable: true }) sortBy?: string | 'ourSuggest' | 'bestSell' | 'topRated' | 'priceFromTopToLow' | 'priceFromLowToTop';\n\n  /**\n   * should listen to filters events `salla-filters::changed` and re-render\n   */\n  @Prop({ reflect: true, mutable: true }) filtersResults: boolean;\n\n  /**\n   * Horizontal cards\n   */\n  @Prop({ reflect: true }) horizontalCards: boolean\n\n  // State\n  @State() page: number = 1;\n  @State() nextPage: string;\n  @State() hasInfiniteScroll: boolean;\n  @State() hasCustomComponent: boolean;\n  @State() sourceValueIsValid: boolean;\n  @State() placeholderText: string;\n  @State() isReady: boolean;\n  @State() showPlaceholder: boolean;\n  @State() parsedFilters: any;\n\n  /**\n   * Custom event fired when the the products fetched.\n   */\n  @Event() productsFetched: EventEmitter;\n\n  private isFilterable() {\n    return salla.config.get('store.settings.product.filters') && this.filtersResults;\n  }\n\n  private isSourceWithoutValue() {\n    return ['offers', 'latest', 'sales'].includes(this.getSource());\n  }\n\n  private animateItems() {\n    anime({\n      targets: 'salla-products-list salla-product-card',\n      opacity: [0, 1],\n      duration: 1200,\n      translateY: [20, 0],\n      delay: function (_el, i) {\n        return i * 100;\n      },\n    })\n  }\n\n  private createStatusDom() {\n    this.status = document.createElement('div');\n    this.status.className = 's-infinite-scroll-wrapper';\n    this.status.innerHTML = `<div class=\"s-infinite-scroll-status\">\n        <p class=\"s-infinite-scroll-last infinite-scroll-last s-hidden\" >${salla.lang.get('common.elements.end_of_content')}</p>\n        <p class=\"s-infinite-scroll-error infinite-scroll-error s-hidden\">${salla.lang.get('common.elements.failed_to_load_more')}</p>\n      </div>\n      <a href=\"#\" class=\"s-infinite-scroll-btn s-button-btn\">\n        <span class=\"s-button-loader s-button-loader-center s-infinite-scroll-btn-loader\" style=\"display: none\"></span>\n      </a>`;\n    this.btnLoader = this.status.querySelector('.s-button-loader');\n    salla.lang.onLoaded(() => {\n      this.status.querySelector('.s-infinite-scroll-last').innerHTML = salla.lang.get('common.elements.end_of_content');\n      this.status.querySelector('.s-infinite-scroll-error').innerHTML = salla.lang.get('common.elements.failed_to_load_more');\n      this.placeholderText = salla.lang.get('pages.categories.no_products');\n    });\n  }\n\n  private initBaseNextPageUrl(source: string) {\n\n    this.nextPage = salla.url.api(`products?source=${source}`);\n\n    if (this.limit) {\n      this.nextPage += `&per_page=${this.limit > 32 ? 32 : this.limit}`;\n    }\n    if (this.sortBy) {\n      this.nextPage += `&sort=${this.sortBy}`;\n    }\n    // if (!this.isFilterable()) {\n    //   return this.nextPage;\n    // }\n    this.nextPage += '&filterable=1';\n    for (const [key, value] of Object.entries(this.parsedFilters || {})) {\n      if ([\"string\", \"number\"].includes(typeof value)) {\n        // @ts-ignore\n        this.nextPage += `&filters[${encodeURIComponent(key)}]=${encodeURIComponent(value)}`;\n      } else if (Array.isArray(value)) {\n        value.forEach(item => this.nextPage += `&filters[${encodeURIComponent(key)}][]=${encodeURIComponent(item)}`);\n      } else if (typeof value === 'object') {\n        for (const [k, v] of Object.entries(value)) {\n          this.nextPage += `&filters[${encodeURIComponent(key)}][${encodeURIComponent(k)}]=${encodeURIComponent(v)}`;\n        }\n      }\n    }\n  }\n\n  private buildNextPageUrl() {\n    let source = this.getSource();\n    if (source === 'json') {\n      return;\n    }\n    this.initBaseNextPageUrl(source);\n    if (this.isSourceWithoutValue()) {\n      return;\n    }\n\n    if (['search', 'related', 'landing-page'].includes(source)) {\n      this.nextPage += `&source_value=${this.getSourceValue()}`;\n      return;\n    }\n\n    try {\n      this.nextPage += `&source_value[]=${this.getSourceValue().join('&source_value[]=')}`;\n    } catch (e) {\n      salla.logger.warn(`source-value prop should be array of ids ex source-value=\"[1,2,3]\" for the source [${source}]`);\n      this.sourceValueIsValid = false;\n    }\n  }\n\n\n  private loading(isLoading = true) {\n    this.btnLoader.style.display = isLoading ? 'inherit' : 'none';\n  }\n\n  private getItemHTML(product) {\n    const customComponentTag = this.hasCustomComponent ? 'custom-salla-product-card' : 'salla-product-card';\n    const productCard = document.createElement(customComponentTag) as HTMLSallaProductCardElement;\n    productCard.product = product;\n\n    this.applyLandingPageStyles(productCard);\n    this.applyHorizontalCardStyles(productCard);\n\n    return productCard;\n  }\n\n  private applyLandingPageStyles(productCard) {\n    if (this.getSource() === 'landing-page' && !this.hasCustomComponent) {\n      productCard.toggleAttribute('hide-add-btn', true);\n      productCard.classList.add('s-product-card-fit-height');\n    }\n  }\n\n  private applyHorizontalCardStyles(productCard) {\n    if (!this.horizontalCards) {\n      return;\n    }\n    productCard.setAttribute('horizontal', true);\n    if (!this.hasCustomComponent) {\n      productCard.setAttribute('shadow-on-hover', true);\n    }\n\n  }\n\n  private getSource() {\n    return Helper.getProductsSource(this.source);\n  }\n\n  private getSourceValue() {\n    return Helper.getProductsSourceValue(this.source, this.sourceValue);\n  }\n\n  private fetchProducts() {\n    salla.product.api.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 && this.infiniteScroll.pageIndex == 2) {\n        this.showPlaceholder = true;\n        salla.infiniteScroll.destroy(this.infiniteScroll);\n        this.loading(false);\n        return;\n      } else {\n        this.showPlaceholder = false;\n\n      }\n      this.infiniteScroll.appendItems(this.handleResponse(response))\n      if (this.infiniteScroll.pageIndex == 2) {\n        this.animateItems();\n      }\n    })\n    this.infiniteScroll?.on('error', () => {\n      this.status.querySelector('.s-infinite-scroll-error').classList.remove('s-hidden')\n      this.loading(false);\n    });\n    salla.onReady(() => salla.infiniteScroll.loadNextPage(this.infiniteScroll))\n  }\n\n  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    let source=this.getSource();\n    let title = '';\n    //help the developer to know the current page title\n    if (response.cursor?.current === 1) {\n        title = Helper.getPageTitleForSource(source);\n        try {\n            if (this.getSource() === 'search') {\n                title = salla.lang.get('common.elements.search_about', {'word': this.getSourceValue()});\n            } else if (!title) {\n                let catId = this.parsedFilters.category_id || this.getSourceValue()[0];\n                // get the first filter that its key is category_id, then get the value when filter.value.*.key==catId\n                title = response.filters.find(filter => filter.key == 'category_id') ?. values ?. find(cat => cat.key == catId) ?. value || '';\n            }\n            title += (title ? ' - ' : '') + salla.lang.choice('blocks.header.products_count', response.data ?. length);\n            if (response.data.length === 20) {\n                title = title.replace(response.data.length, salla.lang.get('common.elements.more_than') + ' ' + response.data.length)\n            }\n            response.title = title;\n        } catch (e) {}\n    }\n\n    salla.event.emit('salla-products-list::products.fetched', response);\n    this.productsFetched.emit(response);\n    //💡 when source is related, cursor will not be existed\n    if (response.filters && this.isFilterable()) {\n      this.filtersResults = true;\n      salla.event.emit('filters::fetched', { filters: response.filters });\n    } else if (this.isFilterable()) {\n      salla.event.emit('filters::hidden');\n    }\n    this.nextPage = response.cursor ? response.cursor.next : this.nextPage;\n    this.loading(false);\n    if (this.hasInfiniteScroll && !this.nextPage) {\n      this.infiniteScroll.option({ scrollThreshold: false, loadOnScroll: false });\n      this.status.querySelector('.s-infinite-scroll-last').classList.remove('s-hidden');\n    }\n    return response.data?.map(product => this.getItemHTML(product)) || [];\n  }\n}\n"],"mappings":"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"}
+{"version":3,"names":["sallaProductsListCss","SallaProductsList","class_1","prototype","connectedCallback","_this","this","salla","onReady","hasCustomComponent","customElements","get","sourceValueIsValid","getSourceValue","isSourceWithoutValue","hasInfiniteScroll","includes","getSource","searchParams","URLSearchParams","window","location","search","sortBy","filters","parsedFilters","JSON","parse","decodeURIComponent","e","logger","warn","message","buildNextPageUrl","createStatusDom","isReady","concat","event","on","setFilters","stringify","scrollTo","top","behavior","reload","infiniteScroll","destroy","wrapper","innerHTML","init","isFilterable","config","filtersResults","animateItems","anime","targets","opacity","duration","translateY","delay","_el","i","status","document","createElement","className","lang","btnLoader","querySelector","onLoaded","placeholderText","initBaseNextPageUrl","source","nextPage","url","api","limit","key","value","this_1","encodeURIComponent","Array","isArray","forEach","item","_j","_k","Object","entries","length","_l","k","v","_i","_g","_h","join","loading","isLoading","style","display","getItemHTML","product","customComponentTag","productCard","applyLandingPageStyles","applyHorizontalCardStyles","toggleAttribute","classList","add","horizontalCards","setAttribute","Helper","getProductsSource","getProductsSourceValue","sourceValue","fetchProducts","fetch","source_value","then","res","data","showPlaceholder","handleResponse","card","append","catch","log","getHeaders","setTimeout","initiateInfiniteScroll","host","insertAdjacentElement","initiate","path","history","scrollThreshold","_a","_b","response","pageIndex","appendItems","_c","remove","loadNextPage","canRender","render","h","class","ShoppingBag","Host","ref","componentDidLoad","map","title","cursor","current","getPageTitleForSource","word","catId_1","category_id","_d","find","filter","values","cat","choice","_e","replace","emit","productsFetched","next","option","loadOnScroll","_f"],"sources":["src/components/salla-products-list/salla-products-list.scss?tag=salla-products-list","src/components/salla-products-list/salla-products-list.tsx"],"sourcesContent":["\n","import { Component, Host, h, Prop, State, Element, Method, Event, EventEmitter } from '@stencil/core';\nimport anime from 'animejs';\nimport ShoppingBag from '../../assets/svg/shopping-bag.svg';\nimport Helper from '../../Helpers/Helper';\n@Component({\n  tag: 'salla-products-list',\n  styleUrl: 'salla-products-list.scss'\n})\nexport class SallaProductsList {\n  connectedCallback() {\n    salla.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  /**\n   * Set parsed filters data from URI\n   * @param filters\n   */\n  @Method()\n  async setFilters(filters) {\n    if (!!filters && JSON.stringify(this.parsedFilters) === JSON.stringify(filters)) {\n      return;\n    }\n    window.scrollTo({ top: 0, behavior: 'smooth' });\n    this.parsedFilters = filters;\n    return this.reload();\n  }\n\n  /**\n   * Reload the list of products (entire content of the component).\n   */\n  @Method()\n  async reload() {\n    salla.infiniteScroll.destroy(this.infiniteScroll);\n    this.buildNextPageUrl();\n    // TODO: this is problematic in testing, for the time being it's been resolved like this\n    this.wrapper.innerHTML = '';\n    this.init();\n  }\n\n\n  private status: HTMLDivElement;\n  private btnLoader: HTMLAnchorElement;\n  @Element() host: HTMLElement;\n  private wrapper: any;\n  private infiniteScroll: any;\n  /**\n   * The source of the products list\n   * @type {string}\n   * */\n  @Prop({\n    reflect: true,\n    mutable: true\n  }) source: 'categories' | 'latest' | 'related' | 'brands' | 'json' | 'search' | 'tags' | 'selected' | 'offers' | 'landing-page' | 'sales';\n\n  /**\n   * The source value, cloud be different values as following:\n   * - array of ids when `source` in ['categories', 'brands', 'tags', 'selected']\n   * - keyword when `source` = 'search'\n   * - products payload when `source` = 'json'\n   * - product_id when `source` = 'related'\n   *\n   * @type {string}\n   * */\n  @Prop({ mutable: true }) sourceValue: any;\n\n  /**\n   * Limit for number of products in the list.\n   */\n  @Prop({ mutable: true }) limit: number;\n\n  /**\n   * Sorting the list of products\n   */\n  @Prop({ mutable: true }) sortBy?: string | 'ourSuggest' | 'bestSell' | 'topRated' | 'priceFromTopToLow' | 'priceFromLowToTop';\n\n  /**\n   * should listen to filters events `salla-filters::changed` and re-render\n   */\n  @Prop({ reflect: true, mutable: true }) filtersResults: boolean;\n\n  /**\n   * Horizontal cards\n   */\n  @Prop({ reflect: true }) horizontalCards: boolean\n\n  // State\n  @State() page: number = 1;\n  @State() nextPage: string;\n  @State() hasInfiniteScroll: boolean;\n  @State() hasCustomComponent: boolean;\n  @State() sourceValueIsValid: boolean;\n  @State() placeholderText: string;\n  @State() isReady: boolean;\n  @State() showPlaceholder: boolean;\n  @State() parsedFilters: any;\n\n  /**\n   * Custom event fired when the the products fetched.\n   */\n  @Event() productsFetched: EventEmitter;\n\n  private isFilterable() {\n    return salla.config.get('store.settings.product.filters') && this.filtersResults;\n  }\n\n  private isSourceWithoutValue() {\n    return ['offers', 'latest', 'sales'].includes(this.getSource());\n  }\n\n  private animateItems() {\n    anime({\n      targets: 'salla-products-list salla-product-card',\n      opacity: [0, 1],\n      duration: 1200,\n      translateY: [20, 0],\n      delay: function (_el, i) {\n        return i * 100;\n      },\n    })\n  }\n\n  private createStatusDom() {\n    this.status = document.createElement('div');\n    this.status.className = 's-infinite-scroll-wrapper';\n    this.status.innerHTML = `<div class=\"s-infinite-scroll-status\">\n        <p class=\"s-infinite-scroll-last infinite-scroll-last s-hidden\" >${salla.lang.get('common.elements.end_of_content')}</p>\n        <p class=\"s-infinite-scroll-error infinite-scroll-error s-hidden\">${salla.lang.get('common.elements.failed_to_load_more')}</p>\n      </div>\n      <a href=\"#\" class=\"s-infinite-scroll-btn s-button-btn\">\n        <span class=\"s-button-loader s-button-loader-center s-infinite-scroll-btn-loader\" style=\"display: none\"></span>\n      </a>`;\n    this.btnLoader = this.status.querySelector('.s-button-loader');\n    salla.lang.onLoaded(() => {\n      this.status.querySelector('.s-infinite-scroll-last').innerHTML = salla.lang.get('common.elements.end_of_content');\n      this.status.querySelector('.s-infinite-scroll-error').innerHTML = salla.lang.get('common.elements.failed_to_load_more');\n      this.placeholderText = salla.lang.get('pages.categories.no_products');\n    });\n  }\n\n  private initBaseNextPageUrl(source: string) {\n\n    this.nextPage = salla.url.api(`products?source=${source}`);\n\n    if (this.limit) {\n      this.nextPage += `&per_page=${this.limit > 32 ? 32 : this.limit}`;\n    }\n    if (this.sortBy) {\n      this.nextPage += `&sort=${this.sortBy}`;\n    }\n    // if (!this.isFilterable()) {\n    //   return this.nextPage;\n    // }\n    this.nextPage += '&filterable=1';\n    for (const [key, value] of Object.entries(this.parsedFilters || {})) {\n      if ([\"string\", \"number\"].includes(typeof value)) {\n        // @ts-ignore\n        this.nextPage += `&filters[${encodeURIComponent(key)}]=${encodeURIComponent(value)}`;\n      } else if (Array.isArray(value)) {\n        value.forEach(item => this.nextPage += `&filters[${encodeURIComponent(key)}][]=${encodeURIComponent(item)}`);\n      } else if (typeof value === 'object') {\n        for (const [k, v] of Object.entries(value)) {\n          this.nextPage += `&filters[${encodeURIComponent(key)}][${encodeURIComponent(k)}]=${encodeURIComponent(v)}`;\n        }\n      }\n    }\n  }\n\n  private buildNextPageUrl() {\n    let source = this.getSource();\n    if (source === 'json') {\n      return;\n    }\n    this.initBaseNextPageUrl(source);\n    if (this.isSourceWithoutValue()) {\n      return;\n    }\n\n    if (['search', 'related', 'landing-page'].includes(source)) {\n      this.nextPage += `&source_value=${this.getSourceValue()}`;\n      return;\n    }\n\n    try {\n      this.nextPage += `&source_value[]=${this.getSourceValue().join('&source_value[]=')}`;\n    } catch (e) {\n      salla.logger.warn(`source-value prop should be array of ids ex source-value=\"[1,2,3]\" for the source [${source}]`);\n      this.sourceValueIsValid = false;\n    }\n  }\n\n\n  private loading(isLoading = true) {\n    this.btnLoader.style.display = isLoading ? 'inherit' : 'none';\n  }\n\n  private getItemHTML(product) {\n    const customComponentTag = this.hasCustomComponent ? 'custom-salla-product-card' : 'salla-product-card';\n    const productCard = document.createElement(customComponentTag) as HTMLSallaProductCardElement;\n    productCard.product = product;\n\n    this.applyLandingPageStyles(productCard);\n    this.applyHorizontalCardStyles(productCard);\n\n    return productCard;\n  }\n\n  private applyLandingPageStyles(productCard) {\n    if (this.getSource() === 'landing-page' && !this.hasCustomComponent) {\n      productCard.toggleAttribute('hide-add-btn', true);\n      productCard.classList.add('s-product-card-fit-height');\n    }\n  }\n\n  private applyHorizontalCardStyles(productCard) {\n    if (!this.horizontalCards) {\n      return;\n    }\n    productCard.setAttribute('horizontal', true);\n    if (!this.hasCustomComponent) {\n      productCard.setAttribute('shadow-on-hover', true);\n    }\n\n  }\n\n  private getSource() {\n    return Helper.getProductsSource(this.source);\n  }\n\n  private getSourceValue() {\n    return Helper.getProductsSourceValue(this.source, this.sourceValue);\n  }\n\n  private fetchProducts() {\n    \n    salla.product.api.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      }).catch(() => {\n        // TODO: Find the real issue and fix it\n        salla.log('Request headers', salla.api.getHeaders());\n        setTimeout(() => this.fetchProducts(), 1000);\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 && this.infiniteScroll.pageIndex == 2) {\n        this.showPlaceholder = true;\n        salla.infiniteScroll.destroy(this.infiniteScroll);\n        this.loading(false);\n        return;\n      } else {\n        this.showPlaceholder = false;\n\n      }\n      this.infiniteScroll.appendItems(this.handleResponse(response))\n      if (this.infiniteScroll.pageIndex == 2) {\n        this.animateItems();\n      }\n    })\n    this.infiniteScroll?.on('error', () => {\n      this.status.querySelector('.s-infinite-scroll-error').classList.remove('s-hidden')\n      this.loading(false);\n    });\n    salla.onReady(() => salla.infiniteScroll.loadNextPage(this.infiniteScroll))\n  }\n\n  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    let source=this.getSource();\n    let title = '';\n    //help the developer to know the current page title\n    if (response.cursor?.current === 1) {\n        title = Helper.getPageTitleForSource(source);\n        try {\n            if (this.getSource() === 'search') {\n                title = salla.lang.get('common.elements.search_about', {'word': this.getSourceValue()});\n            } else if (!title) {\n                let catId = this.parsedFilters.category_id || this.getSourceValue()[0];\n                // get the first filter that its key is category_id, then get the value when filter.value.*.key==catId\n                title = response.filters.find(filter => filter.key == 'category_id') ?. values ?. find(cat => cat.key == catId) ?. value || '';\n            }\n            title += (title ? ' - ' : '') + salla.lang.choice('blocks.header.products_count', response.data ?. length);\n            if (response.data.length === 20) {\n                title = title.replace(response.data.length, salla.lang.get('common.elements.more_than') + ' ' + response.data.length)\n            }\n            response.title = title;\n        } catch (e) {}\n    }\n\n    salla.event.emit('salla-products-list::products.fetched', response);\n    this.productsFetched.emit(response);\n    //💡 when source is related, cursor will not be existed\n    if (response.filters && this.isFilterable()) {\n      this.filtersResults = true;\n      salla.event.emit('filters::fetched', { filters: response.filters });\n    } else if (this.isFilterable()) {\n      salla.event.emit('filters::hidden');\n    }\n    this.nextPage = response.cursor ? response.cursor.next : this.nextPage;\n    this.loading(false);\n    if (this.hasInfiniteScroll && !this.nextPage) {\n      this.infiniteScroll.option({ scrollThreshold: false, loadOnScroll: false });\n      this.status.querySelector('.s-infinite-scroll-last').classList.remove('s-hidden');\n    }\n    return response.data?.map(product => this.getItemHTML(product)) || [];\n  }\n}\n"],"mappings":"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"}

package/dist/esm-es5/salla-products-slider.entry.js

@@ -1,5 +1,5 @@
 /*!
  * Crafted with ❤ by Salla
  */
-import{r as registerInstance,h,H as Host,g as getElement}from"./index-56f9513d.js";import{H as Helper}from"./Helper-c2739d13.js";var sallaProductsSliderCss="";var SallaProductsSlider=function(){function e(e){var t=this;registerInstance(this,e);this.blockTitle=undefined;this.subTitle=undefined;this.sliderId=undefined;this.displayAllUrl=undefined;this.autoplay=undefined;this.source=undefined;this.sourceValue=undefined;this.limit=undefined;this.productsData=undefined;this.isReady=undefined;this.sourceValueIsValid=undefined;this.hasCustomComponent=undefined;this.apiUrl="";this.parsedSourceValue=undefined;salla.onReady((function(){t.sourceValueIsValid=!!(t.getSourceValue()||t.isSourceWithoutValue());if(!t.sourceValueIsValid){salla.logger.warn("source-value prop is required for source [".concat(t.getSource(),"]"));return}t.hasCustomComponent=!!customElements.get("custom-salla-product-card")}))}e.prototype.isSourceWithoutValue=function(){return["offers","latest","sales"].includes(this.getSource())};e.prototype.getItemHTML=function(e){if(this.hasCustomComponent){return h("div",{class:"s-products-slider-card"},h("custom-salla-product-card",{product:e,source:this.getSource(),"source-value":this.getSourceValue()}))}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:e}))};e.prototype.canRender=function(){return this.sourceValueIsValid&&this.isReady};e.prototype.componentWillLoad=function(){var e=this;if(this.source==="json"){this.productsData=this.getSourceValue();this.isReady=true;return}return salla.product.api.fetch({source:this.getSource(),source_value:this.getSourceValue(),limit:this.limit}).then((function(t){e.productsData=t.data;e.isReady=true;salla.event.emit("salla-products-slider::products.fetched",t.data)}))};e.prototype.getSource=function(){return Helper.getProductsSource(this.source)};e.prototype.getSourceValue=function(){return Helper.getProductsSourceValue(this.source,this.sourceValue)};e.prototype.render=function(){var e=this;var t;if(this.getSource()=="related"&&!salla.config.get("store.settings.product.related_products_enabled")||!this.canRender()){return}return h(Host,{class:"s-products-slider-wrapper"},h("salla-slider",{class:"s-products-slider-slider",id:this.sliderId||"s-products-slider-".concat(Math.random().toString(36).substr(2,9)),"auto-play":this.autoplay,type:"carousel","block-title":this.blockTitle,"block-subTitle":this.subTitle,"display-all-url":this.displayAllUrl},h("div",{slot:"items"},(t=this.productsData)===null||t===void 0?void 0:t.map((function(t){return e.getItemHTML(t)})))))};Object.defineProperty(e.prototype,"host",{get:function(){return getElement(this)},enumerable:false,configurable:true});return e}();SallaProductsSlider.style=sallaProductsSliderCss;export{SallaProductsSlider as salla_products_slider};
+import{r as registerInstance,h,H as Host,g as getElement}from"./index-56f9513d.js";import{H as Helper}from"./Helper-c2739d13.js";var sallaProductsSliderCss="";var SallaProductsSlider=function(){function e(e){var t=this;registerInstance(this,e);this.blockTitle=undefined;this.subTitle=undefined;this.sliderId=undefined;this.displayAllUrl=undefined;this.autoplay=undefined;this.source=undefined;this.sourceValue=undefined;this.limit=undefined;this.productsData=undefined;this.isReady=undefined;this.sourceValueIsValid=undefined;this.hasCustomComponent=undefined;this.apiUrl="";this.parsedSourceValue=undefined;salla.onReady((function(){t.sourceValueIsValid=!!(t.getSourceValue()||t.isSourceWithoutValue());if(!t.sourceValueIsValid){salla.logger.warn("source-value prop is required for source [".concat(t.getSource(),"]"));return}t.hasCustomComponent=!!customElements.get("custom-salla-product-card")}))}e.prototype.isSourceWithoutValue=function(){return["offers","latest","sales"].includes(this.getSource())};e.prototype.getItemHTML=function(e){if(this.hasCustomComponent){return h("div",{class:"s-products-slider-card"},h("custom-salla-product-card",{product:e,source:this.getSource(),"source-value":this.getSourceValue()}))}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:e}))};e.prototype.canRender=function(){return this.sourceValueIsValid&&this.isReady};e.prototype.componentWillLoad=function(){if(this.source==="json"){this.productsData=this.getSourceValue();this.isReady=true;return}return this.fetchProducts()};e.prototype.fetchProducts=function(){var e=this;return salla.product.api.fetch({source:this.getSource(),source_value:this.getSourceValue(),limit:this.limit}).then((function(t){e.productsData=t.data;e.isReady=true;salla.event.emit("salla-products-slider::products.fetched",t.data)})).catch((function(){salla.log("Request headers",salla.api.getHeaders());setTimeout((function(){return e.fetchProducts()}),1e3)}))};e.prototype.getSource=function(){return Helper.getProductsSource(this.source)};e.prototype.getSourceValue=function(){return Helper.getProductsSourceValue(this.source,this.sourceValue)};e.prototype.render=function(){var e=this;var t;if(this.getSource()=="related"&&!salla.config.get("store.settings.product.related_products_enabled")||!this.canRender()){return}return h(Host,{class:"s-products-slider-wrapper"},h("salla-slider",{class:"s-products-slider-slider",id:this.sliderId||"s-products-slider-".concat(Math.random().toString(36).substr(2,9)),"auto-play":this.autoplay,type:"carousel","block-title":this.blockTitle,"block-subTitle":this.subTitle,"display-all-url":this.displayAllUrl},h("div",{slot:"items"},(t=this.productsData)===null||t===void 0?void 0:t.map((function(t){return e.getItemHTML(t)})))))};Object.defineProperty(e.prototype,"host",{get:function(){return getElement(this)},enumerable:false,configurable:true});return e}();SallaProductsSlider.style=sallaProductsSliderCss;export{SallaProductsSlider as salla_products_slider};
 //# sourceMappingURL=salla-products-slider.entry.js.map

package/dist/esm-es5/salla-products-slider.entry.js.map

@@ -1 +1 @@
-{"version":3,"names":["sallaProductsSliderCss","SallaProductsSlider","hostRef","_this","this","salla","onReady","sourceValueIsValid","getSourceValue","isSourceWithoutValue","logger","warn","concat","getSource","hasCustomComponent","customElements","get","prototype","includes","getItemHTML","product","h","class","source","canRender","isReady","componentWillLoad","productsData","api","fetch","source_value","limit","then","res","data","event","emit","Helper","getProductsSource","getProductsSourceValue","sourceValue","render","config","Host","id","sliderId","Math","random","toString","substr","autoplay","type","blockTitle","subTitle","displayAllUrl","slot","_a","map"],"sources":["src/components/salla-products-slider/salla-products-slider.scss?tag=salla-products-slider","src/components/salla-products-slider/salla-products-slider.tsx"],"sourcesContent":[".s-products-slider{\n  &-wrapper{\n\n  }\n  &-slider{\n\n  }\n  &-card{\n\n  }\n}","import { Component, Host, h, Prop, Element, State } from '@stencil/core';\nimport Helper from '../../Helpers/Helper';\n@Component({\n  tag: 'salla-products-slider',\n  styleUrl: 'salla-products-slider.scss'\n})\n\n//todo:: extends this component from salla-products-list or the opposite\nexport class SallaProductsSlider {\n  constructor() {\n    salla.onReady(() => {\n      this.sourceValueIsValid = !!(this.getSourceValue() || 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  * autoplay option for products slider\n  */\n  @Prop({ mutable: true }) autoplay: boolean\n\n  /**\n   * Source of the products, if api will get the products from the API, if json will get the products from the products prop\n   * @type {string}\n   * @default ''\n   * */\n  @Prop({\n    reflect: true,\n    mutable: true\n  }) source: 'categories' | 'latest' | 'related' | 'brands' | 'json' | 'tags' | 'selected' | 'offers' | 'landing-page';\n\n  /**\n   * The source value, cloud be different values as following:\n   * - array of ids when `source` in ['categories', 'brands', 'tags', 'selected']\n   * - products payload when `source` = 'json'\n   * - product_id when `source` = 'related'\n   *\n   * @type {string}\n   * */\n  @Prop() sourceValue: string;\n\n  /**\n   * Limit for number of products in the list.\n   */\n  @Prop({ mutable: true }) limit: number;\n\n\n  @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\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.api.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      salla.event.emit('salla-products-slider::products.fetched', res.data);\n    })\n  }\n  private getSource() {\n    return Helper.getProductsSource(this.source);\n  }\n\n  private getSourceValue() {\n    return Helper.getProductsSourceValue(this.source, this.sourceValue);\n  }\n\n  render() {\n    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          auto-play={this.autoplay}\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"],"mappings":";;;iIAAA,IAAMA,uBAAyB,G,ICQlBC,oBAAmB,WAC9B,SAAAA,EAAAC,GAAA,IAAAC,EAAAC,K,iWAgF0B,G,iCA/ExBC,MAAMC,SAAQ,WACZH,EAAKI,sBAAwBJ,EAAKK,kBAAoBL,EAAKM,wBAC3D,IAAKN,EAAKI,mBAAoB,CAC5BF,MAAMK,OAAOC,KAAK,6CAAAC,OAA6CT,EAAKU,YAAW,MAC/E,M,CAEFV,EAAKW,qBAAuBC,eAAeC,IAAI,4B,IAG3Cf,EAAAgB,UAAAR,qBAAA,WACN,MAAO,CAAC,SAAU,SAAU,SAASS,SAASd,KAAKS,Y,EAwE7CZ,EAAAgB,UAAAE,YAAA,SAAYC,GAClB,GAAIhB,KAAKU,mBAAoB,CAC3B,OAAOO,EAAA,OAAKC,MAAM,0BAChBD,EAAA,6BAA2BD,QAASA,EAASG,OAAQnB,KAAKS,YAAW,eAAgBT,KAAKI,mB,CAI9F,OAAOa,EAAA,OAAKC,MAAM,0BAChBD,EAAA,sCACiBjB,KAAKS,aAAe,eAAc,eACnCT,KAAKS,aAAe,eAAc,kBAC/B,KACjBO,QAASA,I,EAMPnB,EAAAgB,UAAAO,UAAA,WACN,OAAOpB,KAAKG,oBAAsBH,KAAKqB,O,EAGzCxB,EAAAgB,UAAAS,kBAAA,eAAAvB,EAAAC,KACE,GAAIA,KAAKmB,SAAW,OAAQ,CAC1BnB,KAAKuB,aAAevB,KAAKI,iBACzBJ,KAAKqB,QAAU,KACf,M,CAEF,OAAQpB,MAAMe,QAAQQ,IAAIC,MAAM,CAC9BN,OAAQnB,KAAKS,YACbiB,aAAc1B,KAAKI,iBACnBuB,MAAO3B,KAAK2B,QACXC,MAAK,SAAAC,GACN9B,EAAKwB,aAAeM,EAAIC,KACxB/B,EAAKsB,QAAU,KACfpB,MAAM8B,MAAMC,KAAK,0CAA2CH,EAAIC,K,KAG5DjC,EAAAgB,UAAAJ,UAAA,WACN,OAAOwB,OAAOC,kBAAkBlC,KAAKmB,O,EAG/BtB,EAAAgB,UAAAT,eAAA,WACN,OAAO6B,OAAOE,uBAAuBnC,KAAKmB,OAAQnB,KAAKoC,Y,EAGzDvC,EAAAgB,UAAAwB,OAAA,eAAAtC,EAAAC,K,MACE,GAAKA,KAAKS,aAAe,YAAcR,MAAMqC,OAAO1B,IAAI,qDAAwDZ,KAAKoB,YAAa,CAChI,M,CAEF,OACEH,EAACsB,KAAI,CAACrB,MAAM,6BACVD,EAAA,gBACEC,MAAM,2BACNsB,GAAIxC,KAAKyC,UAAY,qBAAAjC,OAAqBkC,KAAKC,SAASC,SAAS,IAAIC,OAAO,EAAG,IAAI,YACxE7C,KAAK8C,SAChBC,KAAK,WAAU,cACF/C,KAAKgD,WAAU,iBACZhD,KAAKiD,SAAQ,kBACZjD,KAAKkD,eAEtBjC,EAAA,OAAKkC,KAAK,UACPC,EAAApD,KAAKuB,gBAAY,MAAA6B,SAAA,SAAAA,EAAEC,KAAI,SAAArC,GAAW,OAAAjB,EAAKgB,YAAYC,EAAjB,M,kIAlJf,G"}
+{"version":3,"names":["sallaProductsSliderCss","SallaProductsSlider","hostRef","_this","this","salla","onReady","sourceValueIsValid","getSourceValue","isSourceWithoutValue","logger","warn","concat","getSource","hasCustomComponent","customElements","get","prototype","includes","getItemHTML","product","h","class","source","canRender","isReady","componentWillLoad","productsData","fetchProducts","api","fetch","source_value","limit","then","res","data","event","emit","catch","log","getHeaders","setTimeout","Helper","getProductsSource","getProductsSourceValue","sourceValue","render","config","Host","id","sliderId","Math","random","toString","substr","autoplay","type","blockTitle","subTitle","displayAllUrl","slot","_a","map"],"sources":["src/components/salla-products-slider/salla-products-slider.scss?tag=salla-products-slider","src/components/salla-products-slider/salla-products-slider.tsx"],"sourcesContent":[".s-products-slider{\n  &-wrapper{\n\n  }\n  &-slider{\n\n  }\n  &-card{\n\n  }\n}","import { Component, Host, h, Prop, Element, State } from '@stencil/core';\nimport Helper from '../../Helpers/Helper';\n@Component({\n  tag: 'salla-products-slider',\n  styleUrl: 'salla-products-slider.scss'\n})\n\n//todo:: extends this component from salla-products-list or the opposite\nexport class SallaProductsSlider {\n  constructor() {\n    salla.onReady(() => {\n      this.sourceValueIsValid = !!(this.getSourceValue() || 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  * autoplay option for products slider\n  */\n  @Prop({ mutable: true }) autoplay: boolean\n\n  /**\n   * Source of the products, if api will get the products from the API, if json will get the products from the products prop\n   * @type {string}\n   * @default ''\n   * */\n  @Prop({\n    reflect: true,\n    mutable: true\n  }) source: 'categories' | 'latest' | 'related' | 'brands' | 'json' | 'tags' | 'selected' | 'offers' | 'landing-page';\n\n  /**\n   * The source value, cloud be different values as following:\n   * - array of ids when `source` in ['categories', 'brands', 'tags', 'selected']\n   * - products payload when `source` = 'json'\n   * - product_id when `source` = 'related'\n   *\n   * @type {string}\n   * */\n  @Prop() sourceValue: string;\n\n  /**\n   * Limit for number of products in the list.\n   */\n  @Prop({ mutable: true }) limit: number;\n\n\n  @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\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 this.fetchProducts();\n\n  }\n\n  private fetchProducts() {\n    return salla.product.api.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      salla.event.emit('salla-products-slider::products.fetched', res.data);\n    }).catch(() => {\n      // TODO: Find the real issue and fix it\n      salla.log('Request headers', salla.api.getHeaders());\n      setTimeout(() => this.fetchProducts(), 1000);\n    })\n  }\n  private getSource() {\n    return Helper.getProductsSource(this.source);\n  }\n\n  private getSourceValue() {\n    return Helper.getProductsSourceValue(this.source, this.sourceValue);\n  }\n\n  render() {\n    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          auto-play={this.autoplay}\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"],"mappings":";;;iIAAA,IAAMA,uBAAyB,G,ICQlBC,oBAAmB,WAC9B,SAAAA,EAAAC,GAAA,IAAAC,EAAAC,K,iWAgF0B,G,iCA/ExBC,MAAMC,SAAQ,WACZH,EAAKI,sBAAwBJ,EAAKK,kBAAoBL,EAAKM,wBAC3D,IAAKN,EAAKI,mBAAoB,CAC5BF,MAAMK,OAAOC,KAAK,6CAAAC,OAA6CT,EAAKU,YAAW,MAC/E,M,CAEFV,EAAKW,qBAAuBC,eAAeC,IAAI,4B,IAG3Cf,EAAAgB,UAAAR,qBAAA,WACN,MAAO,CAAC,SAAU,SAAU,SAASS,SAASd,KAAKS,Y,EAwE7CZ,EAAAgB,UAAAE,YAAA,SAAYC,GAClB,GAAIhB,KAAKU,mBAAoB,CAC3B,OAAOO,EAAA,OAAKC,MAAM,0BAChBD,EAAA,6BAA2BD,QAASA,EAASG,OAAQnB,KAAKS,YAAW,eAAgBT,KAAKI,mB,CAI9F,OAAOa,EAAA,OAAKC,MAAM,0BAChBD,EAAA,sCACiBjB,KAAKS,aAAe,eAAc,eACnCT,KAAKS,aAAe,eAAc,kBAC/B,KACjBO,QAASA,I,EAMPnB,EAAAgB,UAAAO,UAAA,WACN,OAAOpB,KAAKG,oBAAsBH,KAAKqB,O,EAGzCxB,EAAAgB,UAAAS,kBAAA,WACE,GAAItB,KAAKmB,SAAW,OAAQ,CAC1BnB,KAAKuB,aAAevB,KAAKI,iBACzBJ,KAAKqB,QAAU,KACf,M,CAEF,OAAOrB,KAAKwB,e,EAIN3B,EAAAgB,UAAAW,cAAA,eAAAzB,EAAAC,KACN,OAAOC,MAAMe,QAAQS,IAAIC,MAAM,CAC7BP,OAAQnB,KAAKS,YACbkB,aAAc3B,KAAKI,iBACnBwB,MAAO5B,KAAK4B,QACXC,MAAK,SAAAC,GACN/B,EAAKwB,aAAeO,EAAIC,KACxBhC,EAAKsB,QAAU,KACfpB,MAAM+B,MAAMC,KAAK,0CAA2CH,EAAIC,K,IAC/DG,OAAM,WAEPjC,MAAMkC,IAAI,kBAAmBlC,MAAMwB,IAAIW,cACvCC,YAAW,WAAM,OAAAtC,EAAKyB,eAAL,GAAsB,I,KAGnC3B,EAAAgB,UAAAJ,UAAA,WACN,OAAO6B,OAAOC,kBAAkBvC,KAAKmB,O,EAG/BtB,EAAAgB,UAAAT,eAAA,WACN,OAAOkC,OAAOE,uBAAuBxC,KAAKmB,OAAQnB,KAAKyC,Y,EAGzD5C,EAAAgB,UAAA6B,OAAA,eAAA3C,EAAAC,K,MACE,GAAKA,KAAKS,aAAe,YAAcR,MAAM0C,OAAO/B,IAAI,qDAAwDZ,KAAKoB,YAAa,CAChI,M,CAEF,OACEH,EAAC2B,KAAI,CAAC1B,MAAM,6BACVD,EAAA,gBACEC,MAAM,2BACN2B,GAAI7C,KAAK8C,UAAY,qBAAAtC,OAAqBuC,KAAKC,SAASC,SAAS,IAAIC,OAAO,EAAG,IAAI,YACxElD,KAAKmD,SAChBC,KAAK,WAAU,cACFpD,KAAKqD,WAAU,iBACZrD,KAAKsD,SAAQ,kBACZtD,KAAKuD,eAEtBtC,EAAA,OAAKuC,KAAK,UACPC,EAAAzD,KAAKuB,gBAAY,MAAAkC,SAAA,SAAAA,EAAEC,KAAI,SAAA1C,GAAW,OAAAjB,EAAKgB,YAAYC,EAAjB,M,kIA3Jf,G"}

package/dist/twilight/p-233b2fbc.entry.js

@@ -0,0 +1,5 @@
+/*!
+ * Crafted with ❤ by Salla
+ */
+import{r as t,c as i,h as o,H as s,g as n}from"./p-a3d07260.js";import{C as e}from"./p-ccd78636.js";var a;(function(t){t["COLOR"]="color";t["DATE"]="date";t["DATETIME"]="datetime";t["DONATION"]="donation";t["IMAGE"]="image";t["MULTIPLE_OPTIONS"]="multiple-options";t["NUMBER"]="number";t["SINGLE_OPTION"]="single-option";t["SPLITTER"]="splitter";t["TEXT"]="text";t["TEXTAREA"]="textarea";t["THUMBNAIL"]="thumbnail";t["TIME"]="time";t["RADIO"]="radio";t["CHECKBOX"]="checkbox";t["MAP"]="map";t["FILE"]="file";t["COLOR_PICKER"]="color_picker"})(a||(a={}));var l;(function(t){t["Sar"]="SAR"})(l||(l={}));const r=`\x3c!-- Generated by IcoMoon.io --\x3e\n<svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32">\n<title>check</title>\n<path d="M27.521 6.976c-0.569-0.472-1.407-0.393-1.879 0.171l-12.567 15.080-7.003-4.668c-0.615-0.411-1.441-0.244-1.849 0.369-0.409 0.612-0.244 1.441 0.369 1.849l8 5.333c0.227 0.149 0.484 0.223 0.739 0.223 0.384 0 0.763-0.165 1.027-0.48l13.333-16c0.471-0.565 0.393-1.407-0.171-1.877z"></path>\n</svg>\n`;const p=`\x3c!-- Generated by IcoMoon.io --\x3e\n<svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32">\n<title>file-upload</title>\n<path d="M21.333 24c0.341 0 0.683-0.131 0.943-0.391 0.521-0.521 0.521-1.364 0-1.885l-5.333-5.333c-0.123-0.123-0.271-0.22-0.433-0.288-0.327-0.135-0.693-0.135-1.019 0-0.163 0.068-0.311 0.165-0.433 0.288l-5.333 5.333c-0.521 0.521-0.521 1.364 0 1.885s1.364 0.521 1.885 0l3.057-3.057v10.115c0 0.736 0.597 1.333 1.333 1.333s1.333-0.597 1.333-1.333v-10.115l3.057 3.057c0.26 0.26 0.601 0.391 0.943 0.391zM28.943 9.724l-9.333-9.333c-0.249-0.251-0.589-0.391-0.943-0.391h-12c-2.205 0-4 1.795-4 4v24c0 2.205 1.795 4 4 4h4c0.736 0 1.333-0.597 1.333-1.333s-0.597-1.333-1.333-1.333h-4c-0.735 0-1.333-0.599-1.333-1.333v-24c0-0.735 0.599-1.333 1.333-1.333h11.448l8.552 8.552v16.781c0 0.735-0.599 1.333-1.333 1.333h-4c-0.736 0-1.333 0.597-1.333 1.333s0.597 1.333 1.333 1.333h4c2.205 0 4-1.795 4-4v-17.333c0-0.353-0.14-0.693-0.391-0.943z"></path>\n</svg>\n`;const d="";const c=class{constructor(s){t(this,s);this.changed=i(this,"changed",7);this.fileTypes={pdf:"application/pdf",png:"image/png",jpg:"image/jpeg",word:"application/doc,application/ms-doc,application/msword,application/vnd.openxmlformats-officedocument.wordprocessingml.document",exl:"application/excel,application/vnd.ms-excel,application/x-excel,application/x-msexcel,application/vnd.openxmlformats-officedocument.spreadsheetml.sheet",txt:"text/plain"};this.outSkus=[];this.handleDonationOptions=(t,i,o)=>{if(i=="custom"&&o=="input"){salla.helpers.inputDigitsOnly(t.target);salla.event.emit("product-options::donation-changed",{id:this.productId,price:t.target.value});return}t.preventDefault();t.stopPropagation();this.isCustomDonation=t.target.value==="custom";if(this.donationInput){if(t.target.value==="custom"){this.donationInput.value="";this.donationInput.focus()}else{this.donationInput.value=t.target.value}if(i=="custom"){return}salla.event.emit("product-options::donation-changed",{id:this.productId,price:t.target.value})}};this.hideLabel=t=>{if(t.type===a.DONATION&&(t.donation&&!t.donation.can_donate)){return true}return false};this.getExpireDonationMessage=t=>{if(!t.donation){return}let i=t.donation.target_amount<=t.donation.collected_amount;return o("div",{class:{"s-product-options-donation-message":true,"s-product-options-donation-completed":i,"s-product-options-donation-expired":!i}},o("p",null,t.donation.target_message),o("span",null,i?salla.money(t.donation.target_amount):""))};this.optionsData=undefined;this.outOfStockText="";this.donationAmount=salla.lang.get("pages.products.donation_amount");this.selectDonationAmount=salla.lang.getWithDefault("pages.products.select_donation_amount","تحديد مبلغ التبرع");this.selectAmount=salla.lang.getWithDefault("pages.products.select_amount","اختر المبلغ");this.isCustomDonation=false;this.selectedOptions=[];this.canDisabled=undefined;this.selectedSkus=undefined;this.selectedOutSkus=undefined;this.productId=salla.config.get("page.id");this.options=undefined;this.canDisabled=!salla.config.get("store.settings.products.notify_options_availability");salla.lang.onLoaded((()=>{this.outOfStockText=salla.lang.get("pages.products.out_of_stock");this.donationAmount=salla.lang.get("pages.products.donation_amount");this.selectDonationAmount=salla.lang.getWithDefault("pages.products.select_donation_amount","تحديد مبلغ التبرع");this.selectAmount=salla.lang.getWithDefault("pages.products.select_amount","اختر المبلغ")}));if(this.options){try{this.setOptionsData(Array.isArray(this.options)?this.options:JSON.parse(this.options));return}catch(t){salla.log("Bad json passed via options prop")}}if(!Array.isArray(this.optionsData)){salla.log("Options is not an array[] ---\x3e ",this.optionsData);this.setOptionsData([])}if(this.productId&&!salla.url.is_page("cart")){salla.api.product.getDetails(this.productId,["options"]).then((t=>this.setOptionsData(t.data.options)))}}setOptionsData(t){var i,o;this.optionsData=t;let s=this;(o=(i=this.optionsData[0])===null||i===void 0?void 0:i.details)===null||o===void 0?void 0:o.forEach((function(t){Object.entries(t.skus_availability||{}).filter((t=>!t[1])).map((t=>s.outSkus.push(Number(t[0]))))}))}async getSelectedOptionsData(){let t={};let i=this.host.getElementSallaData();i.forEach((function(i,o){o.startsWith("options[")&&(t[o.replace("options[","").replace("]","")]=i)}));return t}async reportValidity(){let t=this.host.querySelectorAll("[required]");let i=true;for(let o=0;o<t.length;o++){if("reportValidity"in t[o]&&!t[o].reportValidity()){i=false}}return i}async hasOutOfStockOption(){var t,i;return this.selectedOptions.some((t=>t.is_out))||((t=this.selectedSkus)===null||t===void 0?void 0:t.length)&&((i=this.selectedSkus)===null||i===void 0?void 0:i.every((t=>this.outSkus.includes(t))))}async getSelectedOptions(){return this.selectedOptions}async getOption(t){return this.optionsData.find((i=>i.id===t))}invalidHandler(t,i){const o=t.target.closest(".s-product-options-option");if(!salla.url.is_page("cart")){o.scrollIntoView({behavior:"smooth",block:"center"})}o.classList.add("s-product-options-option-error")}changedHandler(t,i){let o={event:t,option:i,detail:null};if(i.details){let s=i.details.find((i=>Number(i.id)===Number(t.target.value)));o.detail=s}let s=t.target.closest(".s-product-options-option");if(t.target.value||(i.type==a.FILE||i.type==a.IMAGE)&&t.type==="added"||i.type==a.MAP&&t.type==="selected"&&(t.target.lat&&t.target.lng)){setTimeout((()=>{s.classList.remove("s-product-options-option-error")}),200)}const n=this.selectedOptions.findIndex((t=>t.option_id===o.option.id));n>-1?this.selectedOptions[n]=Object.assign(Object.assign({},o.detail),{option_id:o.option.id}):this.selectedOptions.push(Object.assign(Object.assign({},o.detail),{option_id:o.option.id}));if(i.type==a.DONATION){salla.event.emit("product-options::donation-changed",{id:this.productId,price:t.target.value})}this.setSelectedSkus();this.handleRequiredMultipleOptions(i);this.changed.emit(o);salla.event.emit("product-options::change",o)}setSelectedSkus(){this.selectedSkus=this.selectedOptions.map((t=>Object.keys(t.skus_availability||{}))).reduce(((t,i)=>t.filter((t=>i.includes(t))))).map((t=>Number(t)))}handleRequiredMultipleOptions(t){if(t.type!==a.MULTIPLE_OPTIONS||!t.required){return}const i=this.host.querySelector(`[data-option-id="${t.id}"]`);const o=i.querySelectorAll("input:checked").length;i.querySelectorAll("input").forEach((t=>t.toggleAttribute("required",!o)))}getLatLng(t,i){return t?t.split(",")[i=="lat"?0:1]:""}getDisplayForType(t){if(this[`${t.type}Option`]){return this[`${t.type}Option`](t)}if(t.type===a.COLOR_PICKER){return this.colorPickerOption(t)}if(t.type===a.MULTIPLE_OPTIONS){return this.multipleOptions(t)}if(t.type===a.SINGLE_OPTION){return this.singleOption(t)}salla.log(`Couldn't find options type(${t.type})😢`);return""}getOptionShownWhen(t){return t.visibility_condition?{"data-show-when":`options[${t.visibility_condition.option}] ${t.visibility_condition.operator} ${t.visibility_condition.value}`}:{}}componentWillLoad(){this.outOfStockText=salla.lang.get("pages.products.out_of_stock");return salla.api.cart.getCurrentCartId()}componentDidRender(){var t,i;if(((t=this.optionsData)===null||t===void 0?void 0:t.length)==0&&!this.optionsData.some((t=>t.type==a.DONATION))){return}let o=(i=this.optionsData.find((t=>t.type==a.DONATION)))===null||i===void 0?void 0:i.details.find((t=>t.is_selected));if(!o){return}setTimeout((()=>{salla.event.emit("product-options::donation-changed",{id:this.productId,price:o.additional_price})}),1e3)}render(){var t;if(((t=this.optionsData)===null||t===void 0?void 0:t.length)==0){return}return o(s,{class:"s-product-options-wrapper"},o("salla-conditional-fields",null,this.optionsData.map((t=>o("div",Object.assign({class:`s-product-options-option-container${t.visibility_condition?" hidden":""}`,"data-option-id":t.id},this.getOptionShownWhen(t)),t.name=="splitter"?this.splitterOption():o("div",{class:"s-product-options-option","data-option-type":t.type,"data-option-required":`${t.required}`},o("label",{htmlFor:"options["+t.id+"]",class:`s-product-options-option-label ${this.hideLabel(t)?"s-product-options-option-label-hidden":""}`},o("b",null,t.name,t.required&&o("span",null," * ")," "),o("small",null,t.placeholder)),o("div",{class:`s-product-options-option-content ${this.hideLabel(t)?"s-product-options-option-content-full-width":""}`},this.getDisplayForType(t))))))))}donationOption(t,i){var s,n;return o("div",{class:"s-product-options-donation-wrapper"},((s=t.donation)===null||s===void 0?void 0:s.can_donate)?[t.donation?o("div",{class:"s-product-options-donation-progress"},o("salla-progress-bar",{donation:t.donation})):"",t.details.length?[o("h4",null,this.selectAmount),o("div",{class:"s-product-options-donation-options"},t.details.map(((t,i)=>o("div",{class:"s-product-options-donation-options-item"},o("input",{id:`donation-option-${i}`,type:"radio",name:"donating_option",checked:t.is_selected,value:t.additional_price,onChange:i=>this.handleDonationOptions(i,t,"option")}),o("label",{htmlFor:`donation-option-${i}`},o("span",null,salla.money(t.name)))))),((n=t.donation)===null||n===void 0?void 0:n.custom_amount_enabled)?o("div",{class:"s-product-options-donation-options-item"},o("input",{id:`donation-option-custom`,type:"radio",name:"donating_option",value:"custom",onChange:t=>this.handleDonationOptions(t,"custom","option")}),o("label",{htmlFor:`donation-option-custom`},o("span",null," ",this.selectDonationAmount," "))):"")]:"",o("div",{class:{"s-product-options-donation-input-group":true,shown:!t.details.length||t.details.length&&this.isCustomDonation}},o("input",{type:"text",id:"donating-amount",name:"donation_amount",class:"s-form-control",ref:t=>this.donationInput=t,value:t.details.length&&t.details.some((t=>t.is_selected))?t.details.find((t=>t.is_selected)).additional_price:t.value,placeholder:t.placeholder,onInput:t=>this.handleDonationOptions(t,"custom","input"),onBlur:i=>this.changedHandler(i,t),onInvalid:i=>this.invalidHandler(i,t)}),o("span",{class:"s-product-options-donation-amount-currency"},salla.config.currency(salla.config.get("user.currency_code")).symbol))]:this.getExpireDonationMessage(t))}fileUploader(t,i=null){return o("salla-file-upload",Object.assign({},i||{},{"payload-name":"file",value:t.value,"instant-upload":true,name:`options[${t.id}]`,required:!t.visibility_condition&&t.required,height:"120px",onAdded:i=>this.changedHandler(i,t),url:salla.cart.api.getUploadImageEndpoint(),"form-data":{cart_item_id:this.productId,product_id:this.productId},onInvalidInput:i=>this.invalidHandler(i,t),class:{"s-product-options-image-input":true,required:t.required}}),o("div",{class:"s-product-options-filepond-placeholder"},o("span",{class:"s-product-options-filepond-placeholder-icon",innerHTML:i.accept&&i.accept.split(",").every((t=>t.includes("image")))?e:p}),o("p",{class:"s-product-options-filepond-placeholder-text"},salla.lang.get("common.uploader.drag_and_drop")),o("span",{class:"filepond--label-action"},salla.lang.get("common.uploader.browse"))))}imageOption(t){return this.fileUploader(t,{accept:"image/png,image/jpeg,image/jpg,image/gif"})}fileOption(t){let i=t.details.map((t=>this.fileTypes[t.name])).filter(Boolean);return(i===null||i===void 0?void 0:i.length)?this.fileUploader(t,{accept:i.join(",")}):"File types not selected."}numberOption(t){return o("input",{type:"text",value:t.value,class:"s-form-control",required:!t.visibility_condition&&t.required,name:`options[${t.id}]`,placeholder:t.placeholder,onBlur:i=>this.changedHandler(i,t),onInvalid:i=>this.invalidHandler(i,t),onInput:t=>salla.helpers.inputDigitsOnly(t.target)})}splitterOption(){return o("div",{class:"s-product-options-splitter"})}textOption(t){return o("div",{class:"s-product-options-text"},o("input",{type:"text",value:t.value,class:"s-form-control",required:!t.visibility_condition&&t.required,name:`options[${t.id}]`,placeholder:t.placeholder,onInvalid:i=>this.invalidHandler(i,t),onInput:i=>this.changedHandler(i,t)}))}textareaOption(t){return o("div",{class:"s-product-options-textarea"},o("div",{class:"mt-1"},o("textarea",{rows:4,value:t.value,class:"s-form-control",required:!t.visibility_condition&&t.required,id:`options[${t.id}]`,name:`options[${t.id}]`,placeholder:t.placeholder,onInvalid:i=>this.invalidHandler(i,t),onInput:i=>this.changedHandler(i,t)})))}mapOption(t){return o("salla-map",{zoom:15,lat:this.getLatLng(t.value,"lat"),lng:this.getLatLng(t.value,"lng"),name:`options[${t.id}]`,searchable:true,required:t.required,onInvalidInput:i=>this.invalidHandler(i,t),onSelected:i=>this.changedHandler(i,t)})}colorPickerOption(t){return o("salla-color-picker",{onSubmitted:i=>this.changedHandler(i,t),name:`options[${t.id}]`,required:!t.visibility_condition&&t.required,onInvalidInput:i=>this.invalidHandler(i,t),color:t.value})}timeOption(t){return o("salla-datetime-picker",{noCalendar:true,enableTime:true,dateFormat:"h:i K",value:t.value,placeholder:t.name,required:!t.visibility_condition&&t.required,name:`options[${t.id}]`,class:"s-product-options-time-element",onInvalidInput:i=>this.invalidHandler(i,t),onPicked:i=>this.changedHandler(i,t)})}dateOption(t){return o("div",{class:"s-product-options-date-element"},o("salla-datetime-picker",{value:t.value,placeholder:t.name,required:!t.visibility_condition&&t.required,minDate:new Date,name:`options[${t.id}]`,onInvalidInput:i=>this.invalidHandler(i,t),onPicked:i=>this.changedHandler(i,t)}))}datetimeOption(t){return o("div",{class:"s-product-options-datetime-element"},o("salla-datetime-picker",{enableTime:true,value:t.value,dateFormat:"Y-m-d G:i:K",placeholder:t.name,required:!t.visibility_condition&&t.required,name:`options[${t.id}]`,maxDate:t.to_date_time,minDate:t.from_date_time,onInvalidInput:i=>this.invalidHandler(i,t),onPicked:i=>this.changedHandler(i,t)}))}getOptionDetailName(t,i=true,o){if(o&&o==a.COLOR){return t.name+(i&&this.isOptionDetailOut(t)?` <br/> <p> ${this.outOfStockText} </p>`:"")+(t.additional_price?` <p> (${salla.money(t.additional_price)}) </p>`:"")}return t.name+(i&&this.isOptionDetailOut(t)?` - ${this.outOfStockText}`:"")+(t.additional_price?` (${salla.money(t.additional_price)})`:"")}isOptionDetailOut(t){var i;if(t.is_out||!t.skus_availability||!((i=this.selectedSkus)===null||i===void 0?void 0:i.length)){return t.is_out}let o=this.selectedOptions.filter((i=>i.id==t.id)).length;if(o&&this.selectedOptions.length==1){return false}if(o){let i=this.selectedSkus.filter((t=>this.outSkus.includes(t)));return Object.keys(t.skus_availability).some((t=>i.includes(Number(t))))}return this.selectedOptions.some((i=>i.is_out&&i.option_id!==t.option_id))}singleOption(t){return o("div",null,o("select",{name:`options[${t.id}]`,required:!t.visibility_condition&&t.required,class:"s-form-control",onInvalid:i=>this.invalidHandler(i,t),onChange:i=>this.changedHandler(i,t)},o("option",{value:""},t.placeholder),t===null||t===void 0?void 0:t.details.map((t=>o("option",{value:t.id,disabled:this.canDisabled&&this.isOptionDetailOut(t),selected:t.is_selected},this.getOptionDetailName(t))))))}multipleOptions(t){let i=t.required&&!t.details.some((t=>t.is_selected))&&!t.visibility_condition;return o("div",{class:{"s-product-options-multiple-options-wrapper":true,required:t.required}},t===null||t===void 0?void 0:t.details.map((s=>o("div",null,o("input",{type:"checkbox",value:s.id,disabled:this.isOptionDetailOut(s),checked:s.is_selected,required:i,name:`options[${t.id}][]`,id:`field-${t.id}-${s.id}`,onChange:i=>this.changedHandler(i,t),onInvalid:i=>this.invalidHandler(i,t),"aria-describedby":`options[${t.id}]-description`}),o("label",{htmlFor:`field-${t.id}-${s.id}`},this.getOptionDetailName(s))))))}colorOption(t){return o("fieldset",{class:"s-product-options-colors-wrapper"},t===null||t===void 0?void 0:t.details.map((i=>o("div",{class:"s-product-options-colors-item"},o("input",{type:"radio",value:i.id,required:!t.visibility_condition&&t.required,checked:i.is_selected,name:`options[${t.id}]`,disabled:this.canDisabled&&this.isOptionDetailOut(i),id:`color-${this.productId}-${t.id}-${i.id}`,onInvalid:i=>this.invalidHandler(i,t),onChange:i=>this.changedHandler(i,t)}),o("label",{htmlFor:`color-${this.productId}-${t.id}-${i.id}`},o("span",{style:{"background-color":i.color}}),o("div",{innerHTML:this.getOptionDetailName(i,true,t.type)}))))))}thumbnailOption(t){return o("div",{class:"s-product-options-thumbnails-wrapper"},t.details.map((i=>o("div",null,o("input",{type:"radio",value:i.id,"data-itemid":i.id,required:!t.visibility_condition&&t.required,checked:i.is_selected,name:`options[${t.id}]`,"data-img-id":i.option_value,disabled:this.canDisabled&&this.isOptionDetailOut(i),id:`option_${this.productId}-${t.id}_${i.id}`,onInvalid:i=>this.invalidHandler(i,t),onChange:i=>this.changedHandler(i,t)}),o("label",{htmlFor:`option_${this.productId}-${t.id}_${i.id}`,"data-img-id":i.option_value,class:"go-to-slide"},o("img",{"data-src":i.image,src:i.image,title:i.name,alt:i.name}),o("span",{innerHTML:r,class:"s-product-options-thumbnails-icon"}),this.isOptionDetailOut(i)?[o("small",{class:"s-product-options-thumbnails-stock-badge"},this.outOfStockText),this.canDisabled?o("div",{class:"s-product-options-thumbnails-badge-overlay"}):""]:""),o("p",null,this.getOptionDetailName(i,false)," ")))))}get host(){return n(this)}};c.style=d;export{c as salla_product_options};
+//# sourceMappingURL=p-233b2fbc.entry.js.map

package/dist/twilight/p-233b2fbc.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["DisplayType","Currency","sallaProductOptionsCss","SallaProductOptions","constructor","hostRef","this","fileTypes","pdf","png","jpg","word","exl","txt","outSkus","handleDonationOptions","event","detail","type","salla","helpers","inputDigitsOnly","target","emit","id","productId","price","value","preventDefault","stopPropagation","isCustomDonation","donationInput","focus","hideLabel","option","DONATION","donation","can_donate","getExpireDonationMessage","completed","target_amount","collected_amount","h","class","target_message","money","lang","get","getWithDefault","config","canDisabled","onLoaded","outOfStockText","donationAmount","selectDonationAmount","selectAmount","options","setOptionsData","Array","isArray","JSON","parse","e","log","optionsData","url","is_page","api","product","getDetails","then","resp","data","that","_b","_a","details","forEach","Object","entries","skus_availability","filter","sku","map","push","Number","async","selectedOptions","formData","host","getElementSallaData","key","startsWith","replace","requiredElements","querySelectorAll","pass","i","length","reportValidity","some","is_out","selectedSkus","every","includes","option_id","find","invalidHandler","closestProductOption","closest","scrollIntoView","behavior","block","classList","add","changedHandler","optionElement","FILE","IMAGE","MAP","lat","lng","setTimeout","remove","index","findIndex","assign","setSelectedSkus","handleRequiredMultipleOptions","changed","keys","reduce","p","c","MULTIPLE_OPTIONS","required","optionContainer","querySelector","hasChecked","input","toggleAttribute","getLatLng","split","getDisplayForType","COLOR_PICKER","colorPickerOption","multipleOptions","SINGLE_OPTION","singleOption","getOptionShownWhen","visibility_condition","operator","componentWillLoad","cart","getCurrentCartId","componentDidRender","selectedDonationOption","is_selected","additional_price","render","Host","name","splitterOption","htmlFor","placeholder","donationOption","checked","onChange","custom_amount_enabled","shown","ref","el","onInput","onBlur","onInvalid","currency","symbol","fileUploader","additions","height","onAdded","getUploadImageEndpoint","cart_item_id","product_id","onInvalidInput","innerHTML","accept","CameraIcon","FileIcon","imageOption","fileOption","types","Boolean","join","numberOption","textOption","textareaOption","rows","mapOption","zoom","searchable","onSelected","onSubmitted","color","timeOption","noCalendar","enableTime","dateFormat","onPicked","dateOption","minDate","Date","datetimeOption","maxDate","to_date_time","from_date_time","getOptionDetailName","outOfStock","optionType","COLOR","isOptionDetailOut","isDetailSelected","outSelectableSkus","disabled","selected","is_required","colorOption","style","thumbnailOption","option_value","image","src","title","alt","CheckCircleIcon"],"sources":["./src/components/salla-product-options/interfaces.ts","./src/components/salla-product-options/salla-product-options.scss?tag=salla-product-options","./src/components/salla-product-options/salla-product-options.tsx"],"sourcesContent":["export enum DisplayType {\n  COLOR = \"color\",\n  DATE = \"date\",\n  DATETIME = \"datetime\",\n  DONATION = \"donation\",\n  IMAGE = \"image\",\n  MULTIPLE_OPTIONS = \"multiple-options\",\n  NUMBER = \"number\",\n  SINGLE_OPTION = \"single-option\",\n  SPLITTER = \"splitter\",\n  TEXT = \"text\",\n  TEXTAREA = \"textarea\",\n  THUMBNAIL = \"thumbnail\",\n  TIME = \"time\",\n  RADIO = \"radio\",\n  CHECKBOX = \"checkbox\",\n  MAP = \"map\",\n  FILE = \"file\", // similar to image type (file-uploader component)\n  COLOR_PICKER = \"color_picker\"\n\n}\n\nexport interface ProductDetail {\n  id: string;\n  sku: string;\n  name: string;\n  description: string;\n  url: string;\n  promotion_title: string;\n  subtitle: string;\n  type: string;\n  status: string;\n  price: number;\n  sale_price: number;\n  regular_price: number;\n  starting_price: null;\n  quantity: number;\n  max_quantity: number;\n  discount_ends: number;\n  is_taxable: boolean;\n  has_read_more: boolean;\n  can_add_note: boolean;\n  can_show_remained_quantity: boolean;\n  can_upload_file: boolean;\n  has_custom_form: boolean;\n  is_on_sale: boolean;\n  is_hidden_quantity: boolean;\n  is_available: boolean;\n  is_out_of_stock: boolean;\n  weight: null;\n  calories: null;\n  image: SimpleImage;\n  brand: Brand;\n  donation?: ProductDonation;\n  images: Image[];\n  tags: Tag[];\n  notify_availability: null;\n  rating: Rating;\n  options: Option[];\n  sold_quantity: number;\n  category: Category;\n}\n\nexport interface SimpleImage {\n  url: string;\n  alt: string;\n}\n\nexport interface Category {\n  name: string;\n  url: string;\n  icon: string;\n}\n\nexport interface ProductDonation {\n  target_message?: string;\n  collected_amount?: number;\n  target_amount?: number;\n  target_percent?: number;\n  target_end_date?: string;\n  can_donate: boolean;\n  custom_amount_enabled: boolean;\n}\n\nexport interface Image {\n  id: number;\n  url: string;\n  main: boolean;\n  three_d_image_url: string;\n  alt: string;\n  video_url: string;\n  type: string;\n  sort: number;\n}\n\nexport interface Option {\n  id: number;\n  name: string;\n  required: boolean;\n  type: string;\n  placeholder: string;\n  option_type: string;\n  not_same_day_order: boolean;\n  availability_range: number;\n  from_date_time: null;\n  to_date_time: null;\n  visibility_condition?: { option: number, operator: \"=\" | \"!=\", value: number };\n  details?: Detail[];\n  condition_attributes: string;\n  value?: any;\n  donation?: Donation\n}\n\nexport interface Donation {\n  custom_amount_enabled: boolean;\n  target_message?: string;\n  target_date: string | \"2023-04-18\";\n  target_end_date: string | \"2023-04-18\";\n  target_amount: number;\n  collected_amount: number;\n  can_donate: boolean;\n}\n\nexport interface Detail {\n  id: number;\n  option_id: number;\n  name: string;\n  additional_price: number;\n  option_value: null | string;\n  image: null | string;\n  color: null | string;\n  is_out: boolean;\n  skus_availability?: { [sku_id: number]: boolean };\n  is_selected: boolean;\n}\n\nexport interface Brand {\n  id: string;\n  url: string;\n  name: string;\n  logo: string;\n}\n\nexport interface PreTaxPrice {\n  amount: number;\n  currency: Currency;\n}\n\nexport enum Currency {\n  Sar = \"SAR\",\n}\n\nexport interface Promotion {\n  title: string;\n  sub_title: string;\n}\n\nexport interface Rating {\n  count: number;\n  stars: number;\n}\n\nexport interface Tag {\n  name: string;\n  url: string;\n}\n","\n.s-product-options{\n  &-wrapper{\n\n  }\n  &-option-container{\n\n  }\n  &-option{\n\n  }\n  &-option-label{\n\n  }\n  &-option-content{\n\n  }\n  &-colors-wrapper{\n\n  }\n  &-date-element{\n\n  }\n  &-time-element{\n    \n  }\n  &-datetime-element{\n\n  }\n  &-image-input{\n\n  }\n  &-multiple-options-wrapper{\n\n  }\n  &-splitter{\n\n  }\n  &-text{\n\n  }\n  &-textarea{\n\n  }\n  &-thumbnails-wrapper{\n\n  }\n}","import { Component, Prop, h, State, Element, Host, Event, EventEmitter, Method } from '@stencil/core';\nimport { Option, DisplayType, Detail } from './interfaces';\nimport CheckCircleIcon from '../../assets/svg/check.svg';\nimport CameraIcon from '../../assets/svg/camera.svg';\nimport FileIcon from '../../assets/svg/file-upload.svg';\n\n\n@Component({\n  tag: 'salla-product-options',\n  styleUrl: 'salla-product-options.scss',\n})\nexport class SallaProductOptions {\n\n  constructor() {\n    this.canDisabled = !salla.config.get('store.settings.products.notify_options_availability');\n    salla.lang.onLoaded(() => {\n      this.outOfStockText = salla.lang.get(\"pages.products.out_of_stock\");\n      this.donationAmount = salla.lang.get('pages.products.donation_amount');\n      this.selectDonationAmount = salla.lang.getWithDefault('pages.products.select_donation_amount', 'تحديد مبلغ التبرع');\n      this.selectAmount = salla.lang.getWithDefault('pages.products.select_amount', 'اختر المبلغ');\n    });\n\n    if (this.options) {\n      try {\n        this.setOptionsData(Array.isArray(this.options) ? this.options : JSON.parse(this.options));\n        return;\n      } catch (e) {\n        salla.log('Bad json passed via options prop');\n      }\n    }\n    if (!Array.isArray(this.optionsData)) {\n      salla.log('Options is not an array[] ---> ', this.optionsData);\n      this.setOptionsData([]);\n    }\n\n    if (this.productId && !salla.url.is_page('cart')) {\n      salla.api.product.getDetails(this.productId, ['options']).then(resp => this.setOptionsData(resp.data.options));\n    }\n  }\n\n  private setOptionsData(optionsData: Option[]) {\n    this.optionsData = optionsData;\n    let that = this\n    this.optionsData[0]?.details?.forEach(function (detail) {\n      Object.entries(detail.skus_availability || {})\n        .filter(sku => !sku[1])\n        .map(sku => that.outSkus.push(Number(sku[0])));\n    });\n  }\n\n  @Element() host: HTMLElement;\n\n  private fileTypes: Object = {\n    pdf: 'application/pdf',\n    png: 'image/png',\n    jpg: 'image/jpeg',\n    word: 'application/doc,application/ms-doc,application/msword,application/vnd.openxmlformats-officedocument.wordprocessingml.document',\n    exl: 'application/excel,application/vnd.ms-excel,application/x-excel,application/x-msexcel,application/vnd.openxmlformats-officedocument.spreadsheetml.sheet',\n    txt: 'text/plain',\n  };\n\n  @State() optionsData: Option[];\n  @State() outOfStockText: string = ''\n  @State() donationAmount: string = salla.lang.get('pages.products.donation_amount')\n  @State() selectDonationAmount: string = salla.lang.getWithDefault('pages.products.select_donation_amount', 'تحديد مبلغ التبرع')\n  @State() selectAmount: string = salla.lang.getWithDefault('pages.products.select_amount', 'اختر المبلغ')\n  @State() isCustomDonation: boolean = false;\n  @State() selectedOptions: Array<any> = [];\n  @State() canDisabled: boolean;\n  @State() selectedSkus?: Array<string | number>;\n  @State() selectedOutSkus?: Array<string | number>;\n  private outSkus: Array<string | number> = [];\n  private donationInput?: HTMLInputElement;\n\n  /**\n   * The id of the product to which the options are going to be fetched for.\n   */\n  @Prop() productId: number = salla.config.get('page.id');\n\n  /**\n   * Product detail information.\n   */\n  @Prop() options: string;\n\n  /**\n   * Get the id's of the selected options.\n   * */\n  @Method()\n  async getSelectedOptionsData() {\n    let selectedOptions = {}\n    let formData = (this.host as any).getElementSallaData();\n    formData.forEach(function (value, key) {\n      key.startsWith('options[') && (selectedOptions[key.replace('options[', '').replace(']', '')] = value);\n    });\n    return selectedOptions;\n  }\n\n  /**\n   * Report options form validity.\n   * */\n  @Method()\n  async reportValidity() {\n    let requiredElements: Array<HTMLInputElement> = this.host.querySelectorAll('[required]') as any;\n    let pass = true;\n    for (let i = 0; i < requiredElements.length; i++) {\n      //if there is only one invalid option, return false\n      if ('reportValidity' in requiredElements[i] && !requiredElements[i].reportValidity()) {\n        pass = false;\n      }\n    }\n    return pass;\n  }\n\n  /**\n   * Return true if there is any out of stock options are selected and vise versa.\n   * */\n  @Method()\n  async hasOutOfStockOption() {\n    return this.selectedOptions.some(option => option.is_out) || (this.selectedSkus?.length && this.selectedSkus?.every(sku => this.outSkus.includes(sku)));\n  }\n\n  /**\n   * Get selected options.\n   * */\n  @Method()\n  async getSelectedOptions() {\n    return this.selectedOptions;\n  }\n\n  /**\n   * Get a specific option by its id.\n   * */\n  @Method()\n  async getOption(option_id) {\n    return this.optionsData.find(option => option.id === option_id);\n  }\n\n  /**\n   * An event that emitted when any option is changed.\n   */\n  @Event() changed: EventEmitter;\n\n  // @ts-ignore\n  private invalidHandler(event, option: Option) {\n    const closestProductOption = (event.target as HTMLInputElement).closest('.s-product-options-option') as HTMLElement;\n    if (!salla.url.is_page('cart')) {\n      closestProductOption.scrollIntoView({ behavior: 'smooth', block: 'center' });\n    }\n    closestProductOption.classList.add('s-product-options-option-error');\n  }\n\n  private changedHandler(event, option) {\n    let data = { event: event, option: option, detail: null };\n    if (option.details) {\n      let detail = option.details.find((detail) => {\n        return Number(detail.id) === Number(event.target.value);\n      });\n      data.detail = detail\n    }\n\n    let optionElement = event.target.closest('.s-product-options-option');\n    if (event.target.value\n      || ((option.type == DisplayType.FILE || option.type == DisplayType.IMAGE) && event.type === 'added')\n      || (option.type == DisplayType.MAP && event.type === 'selected' && (event.target.lat && event.target.lng))) {\n      setTimeout(() => {\n        optionElement.classList.remove('s-product-options-option-error');\n      }, 200);\n    }\n\n    const index = this.selectedOptions.findIndex(option => option.option_id === data.option.id);\n    index > -1 ? this.selectedOptions[index] = {\n      ...data.detail,\n      option_id: data.option.id\n    } : this.selectedOptions.push({ ...data.detail, option_id: data.option.id })\n\n    if (option.type == DisplayType.DONATION) {\n      salla.event.emit('product-options::donation-changed', {\n        id: this.productId,\n        price: event.target.value\n      });\n    }\n    this.setSelectedSkus();\n    this.handleRequiredMultipleOptions(option);\n    this.changed.emit(data);\n    salla.event.emit('product-options::change', data);\n  }\n\n\n  private handleDonationOptions = (event, detail, type) => {\n    if (detail == 'custom' && type == 'input') {\n      salla.helpers.inputDigitsOnly(event.target)\n      salla.event.emit('product-options::donation-changed', {\n        id: this.productId,\n        price: event.target.value\n      });\n      return;\n    }\n    event.preventDefault();\n    event.stopPropagation();\n    this.isCustomDonation = event.target.value === 'custom';\n    if (this.donationInput) {\n      if (event.target.value === 'custom') {\n        this.donationInput.value = '';\n        this.donationInput.focus()\n      } else {\n        this.donationInput.value = event.target.value;\n      }\n      if (detail == 'custom') {\n        return\n      }\n      salla.event.emit('product-options::donation-changed', {\n        id: this.productId,\n        price: event.target.value\n      });\n    }\n  }\n\n  private hideLabel = (option) => {\n    if (option.type === DisplayType.DONATION && (option.donation && !option.donation.can_donate)) {\n      return true;\n    }\n    return false;\n  }\n\n  private getExpireDonationMessage = (option) => {\n    if (!option.donation) {\n      return;\n    }\n    let completed = option.donation.target_amount <= option.donation.collected_amount;\n    return <div class={{ \"s-product-options-donation-message\": true, \"s-product-options-donation-completed\": completed, \"s-product-options-donation-expired\": !completed }}>\n      <p>{option.donation.target_message}</p>\n      <span>{completed ? salla.money(option.donation.target_amount) : ''}</span>\n    </div>\n  }\n  /**\n   * loop throw all selected details, then get common sku, if it's only one, means we selected all of them;\n   */\n  private setSelectedSkus() {\n    this.selectedSkus = this.selectedOptions.map(detail => Object.keys(detail.skus_availability || {}))\n      .reduce((p, c) => p.filter(e => c.includes(e)))\n      .map(sku => Number(sku));\n  }\n\n  private handleRequiredMultipleOptions(option) {\n    if (option.type !== DisplayType.MULTIPLE_OPTIONS || !option.required) {\n      return;\n    }\n    const optionContainer = this.host.querySelector(`[data-option-id=\"${option.id}\"]`);\n    const hasChecked = optionContainer.querySelectorAll('input:checked').length;\n    optionContainer.querySelectorAll('input').forEach(input => input.toggleAttribute('required', !hasChecked));\n  }\n\n  private getLatLng(value, type: 'lat' | 'lng') {\n    return value\n      ? value.split(',')[type == 'lat' ? 0 : 1]\n      : '';\n  }\n\n  private getDisplayForType(option: Option) {\n    if (this[`${option.type}Option`]) {\n      return this[`${option.type}Option`](option);\n    }\n\n    if (option.type === DisplayType.COLOR_PICKER) {\n      return this.colorPickerOption(option)\n    }\n\n    if (option.type === DisplayType.MULTIPLE_OPTIONS) {\n      return this.multipleOptions(option);\n    }\n\n    if (option.type === DisplayType.SINGLE_OPTION) {\n      return this.singleOption(option);\n    }\n    salla.log(`Couldn't find options type(${option.type})😢`);\n    return '';\n  }\n\n  protected getOptionShownWhen(option: Option) {\n    return option.visibility_condition\n      ? { \"data-show-when\": `options[${option.visibility_condition.option}] ${option.visibility_condition.operator} ${option.visibility_condition.value}` }\n      : {};\n  }\n\n  //we need the cart Id for productOption Image\n  componentWillLoad() {\n    this.outOfStockText = salla.lang.get('pages.products.out_of_stock')\n    return salla.api.cart.getCurrentCartId();\n  }\n\n  componentDidRender() {\n      if (this.optionsData?.length == 0 && !this.optionsData.some(option => option.type == DisplayType.DONATION)) {\n        return;\n      }\n      let selectedDonationOption =  this.optionsData.find(option => option.type == DisplayType.DONATION)?.details.find(detail => detail.is_selected);\n      if (!selectedDonationOption) {\n        return;\n      }\n      setTimeout(() => {\n        salla.event.emit('product-options::donation-changed', {\n          id: this.productId,\n          price: selectedDonationOption.additional_price\n        });\n      }, 1000);\n  }\n\n  render() {\n    if (this.optionsData?.length == 0) {\n      return;\n    }\n\n    return (\n      <Host class=\"s-product-options-wrapper\">\n        {/* TODO:: move salla-conditional-field logic to here, no need of another component*/}\n        <salla-conditional-fields>\n          {this.optionsData.map((option: Option) =>\n            <div class={`s-product-options-option-container${option.visibility_condition ? ' hidden' : ''}`}\n              data-option-id={option.id}\n              {...this.getOptionShownWhen(option)}>\n              {option.name == 'splitter' ?\n                this.splitterOption()\n                : <div class=\"s-product-options-option\" data-option-type={option.type}\n                  data-option-required={`${option.required}`}>\n                  <label htmlFor={'options[' + option.id + ']'} class={`s-product-options-option-label ${this.hideLabel(option) ? 's-product-options-option-label-hidden' : ''}`}>\n                    <b>\n                      {option.name}\n                      {option.required && <span> * </span>} </b>\n                    <small>{option.placeholder}</small>\n                  </label>\n                  <div class={`s-product-options-option-content ${this.hideLabel(option) ? 's-product-options-option-content-full-width' : ''}`}>\n                    {this.getDisplayForType(option)}\n                  </div>\n                </div>}\n            </div>\n          )}\n        </salla-conditional-fields>\n      </Host>\n    );\n\n  }\n\n  //@ts-ignore\n  private donationOption(option: Option, product: Product) {\n    return <div class=\"s-product-options-donation-wrapper\">\n\n      {option.donation?.can_donate ? [\n        option.donation ?\n          <div class=\"s-product-options-donation-progress\">\n            <salla-progress-bar donation={option.donation}>\n            </salla-progress-bar>\n          </div>\n          : '',\n        option.details.length ?\n          [<h4>{this.selectAmount}</h4>,\n          <div class=\"s-product-options-donation-options\">\n            {option.details.map((detail, i) =>\n              <div class=\"s-product-options-donation-options-item\">\n                <input id={`donation-option-${i}`} type=\"radio\" name=\"donating_option\" checked={detail.is_selected} value={detail.additional_price} onChange={e => this.handleDonationOptions(e, detail, 'option')} />\n                <label htmlFor={`donation-option-${i}`}>\n                  <span>{salla.money(detail.name)}</span>\n                </label>\n              </div>\n            )}\n            {option.donation?.custom_amount_enabled ?\n              <div class=\"s-product-options-donation-options-item\">\n                <input id={`donation-option-custom`} type=\"radio\" name=\"donating_option\" value=\"custom\" onChange={e => this.handleDonationOptions(e, 'custom', 'option')} />\n                <label htmlFor={`donation-option-custom`}>\n                  <span> {this.selectDonationAmount} </span>\n                </label>\n              </div>\n              : ''\n            }\n          </div>] : '',\n\n        <div class={{ \"s-product-options-donation-input-group\": true, \"shown\": !option.details.length || (option.details.length && this.isCustomDonation) }}>\n          <input\n            type=\"text\"\n            id=\"donating-amount\"\n            name=\"donation_amount\"\n            class=\"s-form-control\"\n            ref={el => this.donationInput = el as HTMLInputElement}\n            value={\n              option.details.length\n                && option.details.some(detail => detail.is_selected)\n                ? option.details.find(detail => detail.is_selected).additional_price\n                : option.value}\n            // required\n            placeholder={option.placeholder}\n            onInput={e => this.handleDonationOptions(e, 'custom', 'input')}\n            onBlur={e => this.changedHandler(e, option)}\n            onInvalid={(e) => this.invalidHandler(e, option)}\n          />\n          {/* value={option.value} */}\n          <span class=\"s-product-options-donation-amount-currency\">\n            {salla.config.currency(salla.config.get('user.currency_code')).symbol}\n          </span>\n        </div>\n      ] :\n        this.getExpireDonationMessage(option)\n      }\n    </div>\n  }\n\n  private fileUploader(option: Option, additions: Object | null = null) {\n    return <salla-file-upload\n      {...(additions || {})}\n      payload-name=\"file\"\n      value={option.value}\n      instant-upload={true}\n      name={`options[${option.id}]`}\n      required={!option.visibility_condition && option.required}\n      height=\"120px\"\n      onAdded={(e) => this.changedHandler(e, option)}\n      url={salla.cart.api.getUploadImageEndpoint()}\n      form-data={{ cart_item_id: this.productId, product_id: this.productId }}\n      onInvalidInput={(e) => this.invalidHandler(e, option)}\n      class={{ \"s-product-options-image-input\": true, required: option.required }}\n    >\n      <div class=\"s-product-options-filepond-placeholder\">\n        <span class=\"s-product-options-filepond-placeholder-icon\"\n          innerHTML={(additions as any).accept && (additions as any).accept.split(',').every(type => type.includes('image'))\n            ? CameraIcon\n            : FileIcon}\n        />\n        <p class=\"s-product-options-filepond-placeholder-text\">{salla.lang.get('common.uploader.drag_and_drop')}</p>\n        <span class=\"filepond--label-action\">{salla.lang.get('common.uploader.browse')}</span>\n      </div>\n    </salla-file-upload>\n  }\n\n  //@ts-ignore\n  private imageOption(option: Option) {\n    return this.fileUploader(option, { accept: 'image/png,image/jpeg,image/jpg,image/gif' });\n  }\n\n  //@ts-ignore\n  private fileOption(option: Option) {\n    let types = option.details.map(detail => this.fileTypes[detail.name]).filter(Boolean);\n    return types?.length\n      ? this.fileUploader(option, { accept: types.join(',') })\n      : 'File types not selected.';\n  }\n\n  // TODO: (ONLY FOR TESTING!) find a better way to make it testable, e.g. wrap it with a unique class like textOption\n  //@ts-ignore\n  private numberOption(option: Option) {\n    return <input\n      type=\"text\"\n      value={option.value}\n      class=\"s-form-control\"\n      required={!option.visibility_condition && option.required}\n      name={`options[${option.id}]`}\n      placeholder={option.placeholder}\n      onBlur={e => this.changedHandler(e, option)}\n      onInvalid={(e) => this.invalidHandler(e, option)}\n      onInput={e => salla.helpers.inputDigitsOnly(e.target)} />\n  }\n\n  //@ts-ignore\n  private splitterOption() {\n    return <div class=\"s-product-options-splitter\" />\n  }\n\n  //@ts-ignore\n  private textOption(option: Option) {\n    return <div class=\"s-product-options-text\">\n      <input\n        type=\"text\"\n        value={option.value}\n        class='s-form-control'\n        required={!option.visibility_condition && option.required}\n        name={`options[${option.id}]`}\n        placeholder={option.placeholder}\n        onInvalid={(e) => this.invalidHandler(e, option)}\n        onInput={e => this.changedHandler(e, option)} />\n    </div>\n  }\n\n  //@ts-ignore\n  private textareaOption(option: Option) {\n    //todo::remove mt-1 class, and if it's okay to remove the tag itself will be great\n    return <div class=\"s-product-options-textarea\">\n      <div class=\"mt-1\">\n        <textarea\n          rows={4}\n          value={option.value}\n          class=\"s-form-control\"\n          required={!option.visibility_condition && option.required}\n          id={`options[${option.id}]`}\n          name={`options[${option.id}]`}\n          placeholder={option.placeholder}\n          onInvalid={(e) => this.invalidHandler(e, option)}\n          onInput={(e) => this.changedHandler(e, option)} />\n      </div>\n    </div>\n  }\n\n  //@ts-ignore\n  private mapOption(option: Option) {\n    return <salla-map\n      zoom={15}\n      lat={this.getLatLng(option.value, 'lat')}\n      lng={this.getLatLng(option.value, 'lng')}\n      name={`options[${option.id}]`}\n      searchable={true}\n      required={option.required}\n      onInvalidInput={(e) => this.invalidHandler(e, option)}\n      onSelected={e => this.changedHandler(e, option)} />\n  }\n\n  private colorPickerOption(option: Option) {\n    return <salla-color-picker\n      onSubmitted={e => this.changedHandler(e, option)}\n      name={`options[${option.id}]`}\n      required={!option.visibility_condition && option.required}\n      onInvalidInput={(e) => this.invalidHandler(e, option)}\n      color={option.value} />\n  }\n\n  /**\n   * ============= Date Time options =============\n   */\n  //@ts-ignore\n  private timeOption(option: Option) {\n    return <salla-datetime-picker\n      noCalendar={true}\n      enableTime={true}\n      dateFormat=\"h:i K\"\n      value={option.value}\n      placeholder={option.name}\n      required={!option.visibility_condition && option.required}\n      name={`options[${option.id}]`}\n      class=\"s-product-options-time-element\"\n      onInvalidInput={(e) => this.invalidHandler(e, option)}\n      onPicked={e => this.changedHandler(e, option)} />\n  }\n\n  //@ts-ignore\n  private dateOption(option: Option) {\n    //todo:: consider date-range @see https://github.com/SallaApp/theme-raed/blob/master/src/assets/js/partials/product-options.js#L8-L23\n    return <div class=\"s-product-options-date-element\">\n      <salla-datetime-picker\n        value={option.value}\n        placeholder={option.name}\n        required={!option.visibility_condition && option.required}\n        minDate={new Date()}\n        name={`options[${option.id}]`}\n        onInvalidInput={(e) => this.invalidHandler(e, option)}\n        onPicked={e => this.changedHandler(e, option)} />\n    </div>\n  }\n\n  //@ts-ignore\n  private datetimeOption(option: Option) {\n    //todo:: consider date-range @see https://github.com/SallaApp/theme-raed/blob/master/src/assets/js/partials/product-options.js#L8-L23\n    return <div class=\"s-product-options-datetime-element\">\n      <salla-datetime-picker\n        enableTime={true}\n        value={option.value}\n        dateFormat=\"Y-m-d G:i:K\"\n        placeholder={option.name}\n        required={!option.visibility_condition && option.required}\n        name={`options[${option.id}]`}\n        maxDate={option.to_date_time}\n        minDate={option.from_date_time}\n        onInvalidInput={(e) => this.invalidHandler(e, option)}\n        onPicked={e => this.changedHandler(e, option)} />\n    </div>\n  }\n\n  /**\n   * ============= Advanced options =============\n   */\n  protected getOptionDetailName(detail: Detail, outOfStock: boolean = true, optionType?: string) {\n    if (optionType && optionType == DisplayType.COLOR) {\n      return detail.name\n        + ((outOfStock && this.isOptionDetailOut(detail)) ? ` <br/> <p> ${this.outOfStockText} </p>` : '')\n        + (detail.additional_price ? ` <p> (${salla.money(detail.additional_price)}) </p>` : '');\n    }\n\n    return detail.name\n      + ((outOfStock && this.isOptionDetailOut(detail)) ? ` - ${this.outOfStockText}` : '')\n      + (detail.additional_price ? ` (${salla.money(detail.additional_price)})` : '');\n  }\n\n\n  protected isOptionDetailOut(detail: Detail) {\n    if (detail.is_out || !detail.skus_availability || !this.selectedSkus?.length) {\n      return detail.is_out;\n    }\n\n    let isDetailSelected = this.selectedOptions.filter(option => option.id == detail.id).length;\n    //if the current options is the only selected option, so we are sure that it's not out, because there is no other options selected yet\n    if (isDetailSelected && this.selectedOptions.length == 1) {\n      return false;\n    }\n\n    //if current details has sku in the possible outSkus it's out for sure\n    if (isDetailSelected) {\n      //here we will get the possible outSkus for current selected options\n      let outSelectableSkus = this.selectedSkus.filter(sku => this.outSkus.includes(sku));\n      return Object.keys(detail.skus_availability).some(sku => outSelectableSkus.includes(Number(sku)))\n    }\n\n    return this.selectedOptions.some(option => option.is_out && option.option_id !== detail.option_id)\n\n  }\n\n  private singleOption(option: Option) {\n    return <div>\n      <select name={`options[${option.id}]`}\n        required={!option.visibility_condition && option.required}\n        class=\"s-form-control\"\n        onInvalid={(e) => this.invalidHandler(e, option)}\n        onChange={e => this.changedHandler(e, option)}>\n        <option value=\"\">{option.placeholder}</option>\n        {\n          option?.details.map((detail: Detail) => {\n            return <option value={detail.id} disabled={this.canDisabled && this.isOptionDetailOut(detail)}\n              selected={detail.is_selected}>\n              {this.getOptionDetailName(detail)}\n            </option>\n          })\n        }\n      </select>\n    </div>\n  }\n\n  private multipleOptions(option: Option) {\n    let is_required = option.required && !option.details.some(detail => detail.is_selected) && !option.visibility_condition;\n    return <div class={{ \"s-product-options-multiple-options-wrapper\": true, 'required': option.required }}>\n      {\n        option?.details.map((detail: Detail) => {\n          return <div>\n            <input type=\"checkbox\"\n              value={detail.id}\n              disabled={this.isOptionDetailOut(detail)}\n              checked={detail.is_selected}\n              required={is_required}\n              name={`options[${option.id}][]`}\n              id={`field-${option.id}-${detail.id}`}\n              onChange={(e) => this.changedHandler(e, option)}\n              onInvalid={(e) => this.invalidHandler(e, option)}\n              aria-describedby={`options[${option.id}]-description`} />\n            <label htmlFor={`field-${option.id}-${detail.id}`}>{this.getOptionDetailName(detail)}</label>\n          </div>\n        })\n      }\n    </div>\n  }\n\n  //@ts-ignore\n  private colorOption(option: Option) {\n    return <fieldset class=\"s-product-options-colors-wrapper\">\n      {\n        option?.details.map((detail) =>\n          <div class=\"s-product-options-colors-item\">\n            <input type=\"radio\"\n              value={detail.id}\n              required={!option.visibility_condition && option.required}\n              checked={detail.is_selected}\n              name={`options[${option.id}]`}\n              disabled={this.canDisabled && this.isOptionDetailOut(detail)}\n              id={`color-${this.productId}-${option.id}-${detail.id}`}\n              onInvalid={(e) => this.invalidHandler(e, option)}\n              onChange={e => this.changedHandler(e, option)} />\n            <label htmlFor={`color-${this.productId}-${option.id}-${detail.id}`}>\n              <span style={{ \"background-color\": detail.color }} />\n              <div innerHTML={this.getOptionDetailName(detail, true, option.type)}></div>\n            </label>\n          </div>\n        )\n      }\n    </fieldset>\n  }\n\n  //@ts-ignore\n  private thumbnailOption(option: Option) {\n    return <div class=\"s-product-options-thumbnails-wrapper\">\n      {option.details.map((detail: Detail) => {\n        return <div>\n          <input type=\"radio\"\n            value={detail.id}\n            data-itemid={detail.id} //todo:: why need this? it's already in the value!\n            required={!option.visibility_condition && option.required}\n            checked={detail.is_selected}\n            name={`options[${option.id}]`}\n            data-img-id={detail.option_value}\n            disabled={this.canDisabled && this.isOptionDetailOut(detail)}\n            id={`option_${this.productId}-${option.id}_${detail.id}`}\n            onInvalid={(e) => this.invalidHandler(e, option)}\n            onChange={(e) => this.changedHandler(e, option)} />\n          <label htmlFor={`option_${this.productId}-${option.id}_${detail.id}`}\n            data-img-id={detail.option_value}\n            class=\"go-to-slide\">\n            <img data-src={detail.image} src={detail.image} title={detail.name} alt={detail.name} />\n            <span innerHTML={CheckCircleIcon} class=\"s-product-options-thumbnails-icon\" />\n            {this.isOptionDetailOut(detail) ?\n              [\n                <small class=\"s-product-options-thumbnails-stock-badge\">{this.outOfStockText}</small>,\n                this.canDisabled ? <div class=\"s-product-options-thumbnails-badge-overlay\" /> : '',\n              ]\n              : ''}\n          </label>\n          <p>{this.getOptionDetailName(detail, false)} </p>\n        </div>\n      })}\n    </div>\n  }\n}\n"],"mappings":"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"}

package/dist/twilight/p-34bf40ac.system.js

@@ -1,5 +1,5 @@
 /*!
  * Crafted with ❤ by Salla
  */
-System.register(["./p-f0c68bf7.system.js","./p-38000a24.system.js","./p-9beb6b7b.system.js"],(function(e,t){"use strict";var a,l,o;return{setters:[function(t){a=t.p;l=t.b;e("setNonce",t.s)},function(e){o=e.g},function(){}],execute:function(){var e=function(){var e=t.meta.url;var l={};if(e!==""){l.resourcesUrl=new URL(".",e).href}return a(l)};e().then((function(e){o();return l(JSON.parse('[["p-e552c228.system",[[4,"salla-gifting",{"productId":[2,"product-id"],"widgetTitle":[1,"widget-title"],"widgetSubtitle":[1,"widget-subtitle"],"sectionTitle":[32],"sectionSubtitle":[32],"sectionBtnText":[32],"giftDetails":[32],"selectImageForYourGift":[32],"selectImageOrUpload":[32],"selectGiftMessage":[32],"giftCustomText":[32],"textId":[32],"incorrectGiftText":[32],"nextStep":[32],"senderNameLabel":[32],"receiverNameFieldLabel":[32],"receiverMobileFieldLabel":[32],"receiverEmailFieldLabel":[32],"emailPlaceholder":[32],"sendLater":[32],"selectSendDateAndTime":[32],"canNotEditOrderAfterSelectDate":[32],"sendGift":[32],"donationRequired":[32],"currentStep":[32],"showCalendar":[32],"showGiftText":[32],"currentLang":[32],"parentClass":[32],"errors":[32],"gift":[32],"selectedGiftTextOption":[32],"showTextArea":[32],"selectedImage":[32],"uploadedImage":[32],"selectedText":[32],"senderName":[32],"errorMessage":[32],"hasError":[32],"quantity":[32],"deliveryDate":[32],"timeZone":[32],"receiverName":[32],"receiverMobile":[32],"receiverCountryCode":[32],"receiverEmail":[32],"open":[64],"close":[64],"goToStep2":[64]}],[4,"salla-loyalty",{"prizePoints":[1544,"prize-points"],"customerPoints":[1538,"customer-points"],"prizeTitle":[1537,"prize-title"],"allowEmail":[4,"allow-email"],"allowMobile":[4,"allow-mobile"],"requireEmail":[4,"require-email"],"guestMessage":[1025,"guest-message"],"loyaltyProgram":[32],"buttonLoading":[32],"selectedItem":[32],"askConfirmation":[32],"is_loggedin":[32],"hasError":[32],"errorMessage":[32],"translationLoaded":[32],"open":[64],"close":[64],"resetExchange":[64],"exchangeLoyaltyPoint":[64]}],[4,"salla-product-size-guide",{"guides":[32],"productId":[32],"placeholder_title":[32],"placeholder_description":[32],"modal_title":[32],"hasError":[32],"open":[64],"close":[64]}],[4,"salla-login-modal",{"isEmailAllowed":[1028,"is-email-allowed"],"isMobileAllowed":[1028,"is-mobile-allowed"],"isEmailRequired":[1028,"is-email-required"],"supportWebAuth":[516,"support-web-auth"],"currentTabName":[32],"regType":[32],"translationLoaded":[32],"currentPhone":[32],"currentEmail":[32],"title":[32],"emailErrorMsg":[32],"firstNameErrorMsg":[32],"lastNameErrorMsg":[32],"dragAndDrop":[32],"browseFromFiles":[32],"customFields":[32],"uploadedImage":[32],"open":[64]},[[8,"verified","onVerified"]]],[0,"salla-offer-modal",{"offer":[32],"offer_name":[32],"offer_message":[32],"hasError":[32],"errorMessage":[32],"productID":[32],"offer_type":[32],"translationLoaded":[32],"addToCartLabel":[32],"open":[64],"showOffer":[64]}],[0,"salla-rating-modal",{"orderId":[2,"order-id"],"order":[32],"hasError":[32],"errorMessage":[32],"translationLoaded":[32],"open":[64],"close":[64]}],[4,"salla-scopes",{"selection":[1],"searchDisplayLimit":[2,"search-display-limit"],"translationLoaded":[32],"mode":[32],"current_scope":[32],"scopes":[32],"originalScopesList":[32],"selected_scope":[32],"isOpenedBefore":[32],"hasError":[32],"loading":[32],"close":[64],"open":[64],"handleSubmit":[64]}],[0,"salla-localization-modal",{"language":[1537],"currency":[1537],"translationLoaded":[32],"languages":[32],"currencies":[32],"hasError":[32],"errorMessage":[32],"open":[64],"close":[64],"submit":[64]}],[0,"salla-bottom-alert",{"type":[513],"icon":[513],"message":[513],"actionUrl":[513,"action-url"],"actionLabel":[513,"action-label"],"storeId":[32],"loading":[32],"templateData":[32],"defaultMessage":[32],"defaultActionLabel":[32],"storeFeatures":[32],"storeDetails":[32],"templateInformation":[32],"buyTheTemplate":[32]}],[0,"salla-quick-order",{"quickOrderTitle":[1025,"quick-order-title"],"subTitle":[1025,"sub-title"],"payButtonTitle":[1025,"pay-button-title"],"confirmPayButtonTitle":[1025,"confirm-pay-button-title"],"agreementText":[1025,"agreement-text"],"isEmailRequired":[1028,"is-email-required"],"productId":[1025,"product-id"],"thanksMessage":[1025,"thanks-message"],"quickOrderStyle":[1025,"quick-order-style"],"user":[32],"isAvailable":[32],"oneClick":[32],"expanded":[32],"isTermsRequired":[32],"countryCode":[32],"submitSucess":[32],"placeHolderEmail":[32],"emailOptional":[32],"agreementShowText":[32],"agreementModalHead":[32],"userNameLabel":[32],"termsChecked":[32]}],[0,"salla-user-settings",{"isNotifiable":[516,"is-notifiable"],"deactivateAccount":[32],"promotionalMsgs":[32],"deactivateDesc":[32],"promotionalMsgsDesc":[32],"sorryForLeavingText":[32],"warningText":[32],"keepAccount":[32],"buttonLoading":[32]}],[0,"salla-search",{"inline":[4],"oval":[4],"height":[2],"translationLoaded":[32],"results":[32],"loading":[32],"typing":[32],"debounce":[32],"search_term":[32]},[[0,"keydown","handleKeyDown"]]],[4,"salla-social-share",{"url":[513],"urlName":[513,"url-name"],"platforms":[513],"opened":[32],"allPlatforms":[32],"platformIcons":[32],"convertedPlatforms":[32],"open":[64],"refresh":[64]}],[4,"salla-cart-summary",{"showCartLabel":[4,"show-cart-label"],"cartSummaryCount":[32],"cartSummaryTotal":[32],"cartLabel":[32],"animateToCart":[64]}],[4,"salla-infinite-scroll",{"nextPage":[1,"next-page"],"autoload":[1028],"container":[1],"loadMoreText":[1,"load-more-text"],"item":[1],"loadMore":[32],"noMore":[32],"failedToLoad":[32]}],[0,"salla-maintenance-alert",{"title":[32],"message":[32],"buttonTitle":[32]}],[4,"salla-quantity-input",{"cartItemId":[8,"cart-item-id"],"quantity":[32],"fireChangeEvent":[32],"decrease":[64],"increase":[64],"setValue":[64]}],[4,"salla-user-menu",{"inline":[516],"avatarOnly":[516,"avatar-only"],"showHeader":[516,"show-header"],"relativeDropdown":[516,"relative-dropdown"],"accountLoading":[32],"opened":[32],"notifications":[32],"orders":[32],"pending_orders":[32],"wishlist":[32],"profile":[32],"rating":[32],"logout":[32],"hello":[32],"first_name":[32],"last_name":[32],"avatar":[32],"is_loggedIn":[32],"badges":[32],"hasBadges":[32],"OrderUpdate":[32]}],[4,"salla-product-card",{"product":[1],"horizontal":[4],"shadowOnHover":[4,"shadow-on-hover"],"hideAddBtn":[4,"hide-add-btn"],"fullImage":[4,"full-image"],"minimal":[4],"isSpecial":[4,"is-special"],"showQuantity":[4,"show-quantity"],"productData":[32],"fitImageHeight":[32],"remained":[32],"outOfStock":[32],"donationAmount":[32],"startingPrice":[32],"addToCart":[32],"placeholder":[32]}],[4,"salla-map",{"name":[1],"required":[4],"readonly":[4],"searchable":[1028],"lat":[1026],"lng":[1026],"apiKey":[1025,"api-key"],"modalTitle":[1,"modal-title"],"zoom":[1026],"theme":[1025],"modalActivityTitle":[32],"confirmButtonTitle":[32],"locateButtonTitle":[32],"locateButtonEdit":[32],"searchPlaceholder":[32],"searchInputValue":[32],"formattedAddress":[32],"geolocationError":[32],"searchInput":[32],"mapInput":[32],"mapElement":[32],"selectedLat":[32],"selectedLng":[32],"open":[64]}],[4,"salla-verify",{"display":[1],"type":[1025],"autoReload":[4,"auto-reload"],"supportWebAuth":[4,"support-web-auth"],"translationLoaded":[32],"title":[32],"resendAfter":[32],"isProfileVerify":[32],"getCode":[64],"open":[64]}],[4,"salla-color-picker",{"name":[1],"required":[4],"color":[1537],"format":[1],"showCancelButton":[4,"show-cancel-button"],"showTextField":[4,"show-text-field"],"enableAlpha":[4,"enable-alpha"],"widgetColor":[32],"setPickerOption":[64],"movePopUp":[64],"setColorValue":[64],"openPicker":[64],"closePicker":[64],"destroyPicker":[64]}],[4,"salla-add-product-button",{"channels":[513],"subscribedOptions":[1,"subscribed-options"],"quickBuy":[1540,"quick-buy"],"quantity":[514],"donatingAmount":[514,"donating-amount"],"notifyOptionsAvailability":[516,"notify-options-availability"],"productId":[520,"product-id"],"supportStickyBar":[516,"support-sticky-bar"],"productStatus":[513,"product-status"],"productType":[513,"product-type"],"hasOutOfStockOption":[32],"hasSubscribedOptions":[32],"selectedOptions":[32],"showQuickBuy":[32]}],[0,"salla-count-down",{"date":[1],"boxed":[4],"size":[1],"color":[1],"labeled":[4],"endText":[1,"end-text"],"digits":[1],"endOfDay":[4,"end-of-day"],"daysLabel":[32],"hoursLabel":[32],"minutesLabel":[32],"secondsLabel":[32],"endLabel":[32],"invalidDate":[32],"offerEnded":[32],"countInterval":[32],"days":[32],"hours":[32],"minutes":[32],"seconds":[32],"endCountDown":[64]}],[0,"salla-datetime-picker",{"value":[1537],"required":[4],"name":[513],"placeholder":[1],"allowInput":[4,"allow-input"],"allowInvalidPreload":[4,"allow-invalid-preload"],"altFormat":[1,"alt-format"],"altInput":[4,"alt-input"],"altInputClass":[1,"alt-input-class"],"appendTo":[16],"ariaDateFormat":[1,"aria-date-format"],"autoFillDefaultTime":[4,"auto-fill-default-time"],"clickOpens":[4,"click-opens"],"closeOnSelect":[4,"close-on-select"],"conjunction":[1],"dateFormat":[1,"date-format"],"defaultDate":[8,"default-date"],"defaultHour":[2,"default-hour"],"defaultMinute":[2,"default-minute"],"defaultSeconds":[2,"default-seconds"],"disable":[16],"disableMobile":[4,"disable-mobile"],"enable":[16],"enableSeconds":[4,"enable-seconds"],"enableTime":[4,"enable-time"],"formatDate":[16],"hourIncrement":[2,"hour-increment"],"inline":[4],"locale":[1],"maxDate":[8,"max-date"],"maxTime":[8,"max-time"],"minDate":[8,"min-date"],"minTime":[8,"min-time"],"minuteIncrement":[2,"minute-increment"],"mode":[1],"monthSelectorType":[1,"month-selector-type"],"nextArrow":[1,"next-arrow"],"noCalendar":[4,"no-calendar"],"dateParser":[16],"position":[1],"positionElement":[16],"prevArrow":[1,"prev-arrow"],"shorthandCurrentMonth":[4,"shorthand-current-month"],"static":[4],"showMonths":[2,"show-months"],"time_24hr":[4,"time_-2-4hr"],"weekNumbers":[4,"week-numbers"],"wrap":[4]}],[4,"salla-tab-content",{"name":[1],"isSelected":[32],"getChild":[64]}],[4,"salla-tab-header",{"name":[1],"activeClass":[1,"active-class"],"height":[8],"centered":[4],"isSelected":[32],"getChild":[64]}],[4,"salla-tabs",{"backgroundColor":[1,"background-color"],"vertical":[4]},[[0,"tabSelected","onSelectedTab"]]],[0,"salla-product-availability",{"channels":[1],"notifyOptionsAvailability":[4,"notify-options-availability"],"productId":[2,"product-id"],"isSubscribed":[1028,"is-subscribed"],"translationLoaded":[32],"title_":[32],"isVisitorSubscribed":[32]}],[0,"salla-quick-buy",{"type":[1025],"productId":[1025,"product-id"],"amount":[1538],"currency":[1025],"options":[16],"isRequireShipping":[1028,"is-require-shipping"],"isApplePayActive":[32],"quickBuy":[32]}],[0,"salla-file-upload",{"value":[1537],"files":[513],"height":[513],"cartItemId":[1,"cart-item-id"],"profileImage":[516,"profile-image"],"name":[1537],"payloadName":[1,"payload-name"],"accept":[1537],"fileId":[2,"file-id"],"url":[1025],"method":[1],"formData":[1,"form-data"],"required":[4],"maxFileSize":[1,"max-file-size"],"disabled":[4],"allowDrop":[4,"allow-drop"],"allowBrowse":[4,"allow-browse"],"allowPaste":[4,"allow-paste"],"allowMultiple":[4,"allow-multiple"],"allowReplace":[4,"allow-replace"],"allowRevert":[4,"allow-revert"],"allowRemove":[4,"allow-remove"],"allowProcess":[4,"allow-process"],"allowReorder":[4,"allow-reorder"],"storeAsFile":[4,"store-as-file"],"forceRevert":[4,"force-revert"],"maxFilesCount":[2,"max-files-count"],"maxParallelUploads":[2,"max-parallel-uploads"],"checkValidity":[4,"check-validity"],"itemInsertLocation":[1,"item-insert-location"],"itemInsertInterval":[2,"item-insert-interval"],"credits":[4],"dropOnPage":[4,"drop-on-page"],"dropOnElement":[4,"drop-on-element"],"dropValidation":[4,"drop-validation"],"ignoredFiles":[16],"instantUpload":[1028,"instant-upload"],"chunkUploads":[4,"chunk-uploads"],"chunkForce":[4,"chunk-force"],"chunkSize":[2,"chunk-size"],"chunkRetryDelays":[16],"labelDecimalSeparator":[1,"label-decimal-separator"],"labelThousandsSeparator":[1,"label-thousands-separator"],"labelIdle":[1025,"label-idle"],"iconRemove":[1,"icon-remove"],"iconProcess":[1,"icon-process"],"iconRetry":[1,"icon-retry"],"iconUndo":[1,"icon-undo"],"setOption":[64]}],[0,"salla-progress-bar",{"donation":[1],"target":[1026],"value":[1026],"height":[1025],"header":[1025],"stripped":[1028],"message":[1025],"unit":[1025],"color":[1025]}],[0,"salla-rating-stars",{"name":[1],"size":[1],"value":[2],"reviews":[2]}],[4,"salla-list-tile",{"href":[1],"target":[1]}],[4,"salla-slider",{"blockTitle":[513,"block-title"],"listenToThumbnailsOption":[516,"listen-to-thumbnails-option"],"blockSubtitle":[513,"block-subtitle"],"displayAllUrl":[513,"display-all-url"],"arrowsCentered":[516,"arrows-centered"],"verticalThumbs":[516,"vertical-thumbs"],"gridThumbs":[516,"grid-thumbs"],"vertical":[516],"autoHeight":[516,"auto-height"],"showControls":[516,"show-controls"],"controlsOuter":[516,"controls-outer"],"showThumbsControls":[4,"show-thumbs-controls"],"autoPlay":[4,"auto-play"],"slidesPerView":[1,"slides-per-view"],"pagination":[4],"centered":[4],"loop":[4],"direction":[1537],"type":[1],"sliderConfig":[520,"slider-config"],"thumbsConfig":[520,"thumbs-config"],"currentIndex":[32],"isEnd":[32],"isBeginning":[32],"swiperScript":[32],"displayAllTitle":[32],"windowWidth":[32],"slideTo":[64],"slideNext":[64],"slidePrev":[64],"slideToLoop":[64],"slideNextLoop":[64],"slidePrevLoop":[64],"slideReset":[64],"slideToClosest":[64],"update":[64],"updateAutoHeight":[64],"updateSlides":[64],"updateProgress":[64],"updateSlidesClasses":[64],"getSlides":[64]}],[4,"salla-placeholder",{"icon":[1],"alignment":[1],"iconSize":[1,"icon-size"],"translationLoaded":[32]}],[0,"salla-skeleton",{"type":[1],"width":[1],"height":[1]}],[0,"salla-tel-input",{"phone":[1025],"name":[1],"countryCode":[1025,"country-code"],"mobileRequired":[32],"countryCodeLabel":[32],"mobileLabel":[32],"tooShort":[32],"tooLong":[32],"invalidCountryCode":[32],"invalidNumber":[32],"errorMap":[32],"getValues":[64],"isValid":[64]}],[4,"salla-modal",{"isClosable":[1028,"is-closable"],"width":[513],"position":[513],"visible":[516],"hasSkeleton":[516,"has-skeleton"],"isLoading":[1540,"is-loading"],"subTitleFirst":[4,"sub-title-first"],"noPadding":[4,"no-padding"],"subTitle":[1,"sub-title"],"centered":[4],"iconStyle":[1,"icon-style"],"modalTitle":[32],"open":[64],"close":[64],"setTitle":[64],"loading":[64],"stopLoading":[64]},[[0,"keyup","handleKeyUp"]]],[0,"salla-loading",{"size":[8],"width":[8],"color":[1],"bgColor":[1,"bg-color"]}],[4,"salla-button",{"shape":[513],"color":[513],"fill":[513],"size":[513],"width":[513],"loading":[516],"disabled":[516],"loaderPosition":[1,"loader-position"],"href":[1],"load":[64],"stop":[64],"setText":[64],"disable":[64],"enable":[64]}]]],["p-c813caf6.system",[[0,"salla-products-slider",{"blockTitle":[1,"block-title"],"subTitle":[1,"sub-title"],"sliderId":[1,"slider-id"],"displayAllUrl":[1,"display-all-url"],"autoplay":[1028],"source":[1537],"sourceValue":[1,"source-value"],"limit":[1026],"productsData":[32],"isReady":[32],"sourceValueIsValid":[32],"hasCustomComponent":[32],"apiUrl":[32],"parsedSourceValue":[32]}]]],["p-6b07bfc3.system",[[0,"salla-product-options",{"productId":[2,"product-id"],"options":[1],"optionsData":[32],"outOfStockText":[32],"donationAmount":[32],"selectDonationAmount":[32],"selectAmount":[32],"isCustomDonation":[32],"selectedOptions":[32],"canDisabled":[32],"selectedSkus":[32],"selectedOutSkus":[32],"getSelectedOptionsData":[64],"reportValidity":[64],"hasOutOfStockOption":[64],"getSelectedOptions":[64],"getOption":[64]}]]],["p-0776e726.system",[[0,"salla-filters",{"filters":[1040],"isSidebarOpen":[32],"filtersData":[32],"apply":[32],"reset":[32],"getFilters":[64],"applyFilters":[64],"resetFilters":[64]}]]],["p-ff434208.system",[[0,"salla-comment-form",{"type":[1537],"showAvatar":[4,"show-avatar"],"itemId":[1544,"item-id"],"placeholder":[32],"submitText":[32],"canComment":[32]}]]],["p-90362986.system",[[0,"salla-installment",{"price":[1],"language":[1],"currency":[1],"tamaraIsActive":[32],"tabbyIsActive":[32],"spotiiIsActive":[32]}]]],["p-cb5d2739.system",[[0,"salla-loyalty-prize-item",{"item":[16]}]]],["p-8bf6c217.system",[[0,"salla-products-list",{"source":[1537],"sourceValue":[1032,"source-value"],"limit":[1026],"sortBy":[1025,"sort-by"],"filtersResults":[1540,"filters-results"],"horizontalCards":[516,"horizontal-cards"],"page":[32],"nextPage":[32],"hasInfiniteScroll":[32],"hasCustomComponent":[32],"sourceValueIsValid":[32],"placeholderText":[32],"isReady":[32],"showPlaceholder":[32],"parsedFilters":[32],"setFilters":[64],"reload":[64]}]]],["p-8429c1fe.system",[[0,"salla-price-range",{"minPrice":[1032,"min-price"],"maxPrice":[1032,"max-price"],"option":[16],"filtersData":[520,"filters-data"],"min":[32],"max":[32],"priceOptions":[32],"moreThanLabel":[32],"lessThanLabel":[32],"toLabel":[32],"fromLabel":[32],"reset":[64]}]]],["p-20659764.system",[[4,"salla-filters-widget",{"withLoadMore":[1028,"with-load-more"],"filtersData":[16],"option":[16],"isOpen":[32],"isShowMore":[32],"showMoreLabel":[32],"showLessLabel":[32],"setWidgetHeight":[64],"reset":[64],"showMore":[64],"toggleWidget":[64]}]]],["p-7c7a3aff.system",[[4,"salla-conditional-fields",null,[[0,"change","changeHandler"]]]]]]'),e)}))}}}));
+System.register(["./p-f0c68bf7.system.js","./p-38000a24.system.js","./p-9beb6b7b.system.js"],(function(e,t){"use strict";var a,l,o;return{setters:[function(t){a=t.p;l=t.b;e("setNonce",t.s)},function(e){o=e.g},function(){}],execute:function(){var e=function(){var e=t.meta.url;var l={};if(e!==""){l.resourcesUrl=new URL(".",e).href}return a(l)};e().then((function(e){o();return l(JSON.parse('[["p-e552c228.system",[[4,"salla-gifting",{"productId":[2,"product-id"],"widgetTitle":[1,"widget-title"],"widgetSubtitle":[1,"widget-subtitle"],"sectionTitle":[32],"sectionSubtitle":[32],"sectionBtnText":[32],"giftDetails":[32],"selectImageForYourGift":[32],"selectImageOrUpload":[32],"selectGiftMessage":[32],"giftCustomText":[32],"textId":[32],"incorrectGiftText":[32],"nextStep":[32],"senderNameLabel":[32],"receiverNameFieldLabel":[32],"receiverMobileFieldLabel":[32],"receiverEmailFieldLabel":[32],"emailPlaceholder":[32],"sendLater":[32],"selectSendDateAndTime":[32],"canNotEditOrderAfterSelectDate":[32],"sendGift":[32],"donationRequired":[32],"currentStep":[32],"showCalendar":[32],"showGiftText":[32],"currentLang":[32],"parentClass":[32],"errors":[32],"gift":[32],"selectedGiftTextOption":[32],"showTextArea":[32],"selectedImage":[32],"uploadedImage":[32],"selectedText":[32],"senderName":[32],"errorMessage":[32],"hasError":[32],"quantity":[32],"deliveryDate":[32],"timeZone":[32],"receiverName":[32],"receiverMobile":[32],"receiverCountryCode":[32],"receiverEmail":[32],"open":[64],"close":[64],"goToStep2":[64]}],[4,"salla-loyalty",{"prizePoints":[1544,"prize-points"],"customerPoints":[1538,"customer-points"],"prizeTitle":[1537,"prize-title"],"allowEmail":[4,"allow-email"],"allowMobile":[4,"allow-mobile"],"requireEmail":[4,"require-email"],"guestMessage":[1025,"guest-message"],"loyaltyProgram":[32],"buttonLoading":[32],"selectedItem":[32],"askConfirmation":[32],"is_loggedin":[32],"hasError":[32],"errorMessage":[32],"translationLoaded":[32],"open":[64],"close":[64],"resetExchange":[64],"exchangeLoyaltyPoint":[64]}],[4,"salla-product-size-guide",{"guides":[32],"productId":[32],"placeholder_title":[32],"placeholder_description":[32],"modal_title":[32],"hasError":[32],"open":[64],"close":[64]}],[4,"salla-login-modal",{"isEmailAllowed":[1028,"is-email-allowed"],"isMobileAllowed":[1028,"is-mobile-allowed"],"isEmailRequired":[1028,"is-email-required"],"supportWebAuth":[516,"support-web-auth"],"currentTabName":[32],"regType":[32],"translationLoaded":[32],"currentPhone":[32],"currentEmail":[32],"title":[32],"emailErrorMsg":[32],"firstNameErrorMsg":[32],"lastNameErrorMsg":[32],"dragAndDrop":[32],"browseFromFiles":[32],"customFields":[32],"uploadedImage":[32],"open":[64]},[[8,"verified","onVerified"]]],[0,"salla-offer-modal",{"offer":[32],"offer_name":[32],"offer_message":[32],"hasError":[32],"errorMessage":[32],"productID":[32],"offer_type":[32],"translationLoaded":[32],"addToCartLabel":[32],"open":[64],"showOffer":[64]}],[0,"salla-rating-modal",{"orderId":[2,"order-id"],"order":[32],"hasError":[32],"errorMessage":[32],"translationLoaded":[32],"open":[64],"close":[64]}],[4,"salla-scopes",{"selection":[1],"searchDisplayLimit":[2,"search-display-limit"],"translationLoaded":[32],"mode":[32],"current_scope":[32],"scopes":[32],"originalScopesList":[32],"selected_scope":[32],"isOpenedBefore":[32],"hasError":[32],"loading":[32],"close":[64],"open":[64],"handleSubmit":[64]}],[0,"salla-localization-modal",{"language":[1537],"currency":[1537],"translationLoaded":[32],"languages":[32],"currencies":[32],"hasError":[32],"errorMessage":[32],"open":[64],"close":[64],"submit":[64]}],[0,"salla-bottom-alert",{"type":[513],"icon":[513],"message":[513],"actionUrl":[513,"action-url"],"actionLabel":[513,"action-label"],"storeId":[32],"loading":[32],"templateData":[32],"defaultMessage":[32],"defaultActionLabel":[32],"storeFeatures":[32],"storeDetails":[32],"templateInformation":[32],"buyTheTemplate":[32]}],[0,"salla-quick-order",{"quickOrderTitle":[1025,"quick-order-title"],"subTitle":[1025,"sub-title"],"payButtonTitle":[1025,"pay-button-title"],"confirmPayButtonTitle":[1025,"confirm-pay-button-title"],"agreementText":[1025,"agreement-text"],"isEmailRequired":[1028,"is-email-required"],"productId":[1025,"product-id"],"thanksMessage":[1025,"thanks-message"],"quickOrderStyle":[1025,"quick-order-style"],"user":[32],"isAvailable":[32],"oneClick":[32],"expanded":[32],"isTermsRequired":[32],"countryCode":[32],"submitSucess":[32],"placeHolderEmail":[32],"emailOptional":[32],"agreementShowText":[32],"agreementModalHead":[32],"userNameLabel":[32],"termsChecked":[32]}],[0,"salla-user-settings",{"isNotifiable":[516,"is-notifiable"],"deactivateAccount":[32],"promotionalMsgs":[32],"deactivateDesc":[32],"promotionalMsgsDesc":[32],"sorryForLeavingText":[32],"warningText":[32],"keepAccount":[32],"buttonLoading":[32]}],[0,"salla-search",{"inline":[4],"oval":[4],"height":[2],"translationLoaded":[32],"results":[32],"loading":[32],"typing":[32],"debounce":[32],"search_term":[32]},[[0,"keydown","handleKeyDown"]]],[4,"salla-social-share",{"url":[513],"urlName":[513,"url-name"],"platforms":[513],"opened":[32],"allPlatforms":[32],"platformIcons":[32],"convertedPlatforms":[32],"open":[64],"refresh":[64]}],[4,"salla-cart-summary",{"showCartLabel":[4,"show-cart-label"],"cartSummaryCount":[32],"cartSummaryTotal":[32],"cartLabel":[32],"animateToCart":[64]}],[4,"salla-infinite-scroll",{"nextPage":[1,"next-page"],"autoload":[1028],"container":[1],"loadMoreText":[1,"load-more-text"],"item":[1],"loadMore":[32],"noMore":[32],"failedToLoad":[32]}],[0,"salla-maintenance-alert",{"title":[32],"message":[32],"buttonTitle":[32]}],[4,"salla-quantity-input",{"cartItemId":[8,"cart-item-id"],"quantity":[32],"fireChangeEvent":[32],"decrease":[64],"increase":[64],"setValue":[64]}],[4,"salla-user-menu",{"inline":[516],"avatarOnly":[516,"avatar-only"],"showHeader":[516,"show-header"],"relativeDropdown":[516,"relative-dropdown"],"accountLoading":[32],"opened":[32],"notifications":[32],"orders":[32],"pending_orders":[32],"wishlist":[32],"profile":[32],"rating":[32],"logout":[32],"hello":[32],"first_name":[32],"last_name":[32],"avatar":[32],"is_loggedIn":[32],"badges":[32],"hasBadges":[32],"OrderUpdate":[32]}],[4,"salla-product-card",{"product":[1],"horizontal":[4],"shadowOnHover":[4,"shadow-on-hover"],"hideAddBtn":[4,"hide-add-btn"],"fullImage":[4,"full-image"],"minimal":[4],"isSpecial":[4,"is-special"],"showQuantity":[4,"show-quantity"],"productData":[32],"fitImageHeight":[32],"remained":[32],"outOfStock":[32],"donationAmount":[32],"startingPrice":[32],"addToCart":[32],"placeholder":[32]}],[4,"salla-map",{"name":[1],"required":[4],"readonly":[4],"searchable":[1028],"lat":[1026],"lng":[1026],"apiKey":[1025,"api-key"],"modalTitle":[1,"modal-title"],"zoom":[1026],"theme":[1025],"modalActivityTitle":[32],"confirmButtonTitle":[32],"locateButtonTitle":[32],"locateButtonEdit":[32],"searchPlaceholder":[32],"searchInputValue":[32],"formattedAddress":[32],"geolocationError":[32],"searchInput":[32],"mapInput":[32],"mapElement":[32],"selectedLat":[32],"selectedLng":[32],"open":[64]}],[4,"salla-verify",{"display":[1],"type":[1025],"autoReload":[4,"auto-reload"],"supportWebAuth":[4,"support-web-auth"],"translationLoaded":[32],"title":[32],"resendAfter":[32],"isProfileVerify":[32],"getCode":[64],"open":[64]}],[4,"salla-color-picker",{"name":[1],"required":[4],"color":[1537],"format":[1],"showCancelButton":[4,"show-cancel-button"],"showTextField":[4,"show-text-field"],"enableAlpha":[4,"enable-alpha"],"widgetColor":[32],"setPickerOption":[64],"movePopUp":[64],"setColorValue":[64],"openPicker":[64],"closePicker":[64],"destroyPicker":[64]}],[4,"salla-add-product-button",{"channels":[513],"subscribedOptions":[1,"subscribed-options"],"quickBuy":[1540,"quick-buy"],"quantity":[514],"donatingAmount":[514,"donating-amount"],"notifyOptionsAvailability":[516,"notify-options-availability"],"productId":[520,"product-id"],"supportStickyBar":[516,"support-sticky-bar"],"productStatus":[513,"product-status"],"productType":[513,"product-type"],"hasOutOfStockOption":[32],"hasSubscribedOptions":[32],"selectedOptions":[32],"showQuickBuy":[32]}],[0,"salla-count-down",{"date":[1],"boxed":[4],"size":[1],"color":[1],"labeled":[4],"endText":[1,"end-text"],"digits":[1],"endOfDay":[4,"end-of-day"],"daysLabel":[32],"hoursLabel":[32],"minutesLabel":[32],"secondsLabel":[32],"endLabel":[32],"invalidDate":[32],"offerEnded":[32],"countInterval":[32],"days":[32],"hours":[32],"minutes":[32],"seconds":[32],"endCountDown":[64]}],[0,"salla-datetime-picker",{"value":[1537],"required":[4],"name":[513],"placeholder":[1],"allowInput":[4,"allow-input"],"allowInvalidPreload":[4,"allow-invalid-preload"],"altFormat":[1,"alt-format"],"altInput":[4,"alt-input"],"altInputClass":[1,"alt-input-class"],"appendTo":[16],"ariaDateFormat":[1,"aria-date-format"],"autoFillDefaultTime":[4,"auto-fill-default-time"],"clickOpens":[4,"click-opens"],"closeOnSelect":[4,"close-on-select"],"conjunction":[1],"dateFormat":[1,"date-format"],"defaultDate":[8,"default-date"],"defaultHour":[2,"default-hour"],"defaultMinute":[2,"default-minute"],"defaultSeconds":[2,"default-seconds"],"disable":[16],"disableMobile":[4,"disable-mobile"],"enable":[16],"enableSeconds":[4,"enable-seconds"],"enableTime":[4,"enable-time"],"formatDate":[16],"hourIncrement":[2,"hour-increment"],"inline":[4],"locale":[1],"maxDate":[8,"max-date"],"maxTime":[8,"max-time"],"minDate":[8,"min-date"],"minTime":[8,"min-time"],"minuteIncrement":[2,"minute-increment"],"mode":[1],"monthSelectorType":[1,"month-selector-type"],"nextArrow":[1,"next-arrow"],"noCalendar":[4,"no-calendar"],"dateParser":[16],"position":[1],"positionElement":[16],"prevArrow":[1,"prev-arrow"],"shorthandCurrentMonth":[4,"shorthand-current-month"],"static":[4],"showMonths":[2,"show-months"],"time_24hr":[4,"time_-2-4hr"],"weekNumbers":[4,"week-numbers"],"wrap":[4]}],[4,"salla-tab-content",{"name":[1],"isSelected":[32],"getChild":[64]}],[4,"salla-tab-header",{"name":[1],"activeClass":[1,"active-class"],"height":[8],"centered":[4],"isSelected":[32],"getChild":[64]}],[4,"salla-tabs",{"backgroundColor":[1,"background-color"],"vertical":[4]},[[0,"tabSelected","onSelectedTab"]]],[0,"salla-product-availability",{"channels":[1],"notifyOptionsAvailability":[4,"notify-options-availability"],"productId":[2,"product-id"],"isSubscribed":[1028,"is-subscribed"],"translationLoaded":[32],"title_":[32],"isVisitorSubscribed":[32]}],[0,"salla-quick-buy",{"type":[1025],"productId":[1025,"product-id"],"amount":[1538],"currency":[1025],"options":[16],"isRequireShipping":[1028,"is-require-shipping"],"isApplePayActive":[32],"quickBuy":[32]}],[0,"salla-file-upload",{"value":[1537],"files":[513],"height":[513],"cartItemId":[1,"cart-item-id"],"profileImage":[516,"profile-image"],"name":[1537],"payloadName":[1,"payload-name"],"accept":[1537],"fileId":[2,"file-id"],"url":[1025],"method":[1],"formData":[1,"form-data"],"required":[4],"maxFileSize":[1,"max-file-size"],"disabled":[4],"allowDrop":[4,"allow-drop"],"allowBrowse":[4,"allow-browse"],"allowPaste":[4,"allow-paste"],"allowMultiple":[4,"allow-multiple"],"allowReplace":[4,"allow-replace"],"allowRevert":[4,"allow-revert"],"allowRemove":[4,"allow-remove"],"allowProcess":[4,"allow-process"],"allowReorder":[4,"allow-reorder"],"storeAsFile":[4,"store-as-file"],"forceRevert":[4,"force-revert"],"maxFilesCount":[2,"max-files-count"],"maxParallelUploads":[2,"max-parallel-uploads"],"checkValidity":[4,"check-validity"],"itemInsertLocation":[1,"item-insert-location"],"itemInsertInterval":[2,"item-insert-interval"],"credits":[4],"dropOnPage":[4,"drop-on-page"],"dropOnElement":[4,"drop-on-element"],"dropValidation":[4,"drop-validation"],"ignoredFiles":[16],"instantUpload":[1028,"instant-upload"],"chunkUploads":[4,"chunk-uploads"],"chunkForce":[4,"chunk-force"],"chunkSize":[2,"chunk-size"],"chunkRetryDelays":[16],"labelDecimalSeparator":[1,"label-decimal-separator"],"labelThousandsSeparator":[1,"label-thousands-separator"],"labelIdle":[1025,"label-idle"],"iconRemove":[1,"icon-remove"],"iconProcess":[1,"icon-process"],"iconRetry":[1,"icon-retry"],"iconUndo":[1,"icon-undo"],"setOption":[64]}],[0,"salla-progress-bar",{"donation":[1],"target":[1026],"value":[1026],"height":[1025],"header":[1025],"stripped":[1028],"message":[1025],"unit":[1025],"color":[1025]}],[0,"salla-rating-stars",{"name":[1],"size":[1],"value":[2],"reviews":[2]}],[4,"salla-list-tile",{"href":[1],"target":[1]}],[4,"salla-slider",{"blockTitle":[513,"block-title"],"listenToThumbnailsOption":[516,"listen-to-thumbnails-option"],"blockSubtitle":[513,"block-subtitle"],"displayAllUrl":[513,"display-all-url"],"arrowsCentered":[516,"arrows-centered"],"verticalThumbs":[516,"vertical-thumbs"],"gridThumbs":[516,"grid-thumbs"],"vertical":[516],"autoHeight":[516,"auto-height"],"showControls":[516,"show-controls"],"controlsOuter":[516,"controls-outer"],"showThumbsControls":[4,"show-thumbs-controls"],"autoPlay":[4,"auto-play"],"slidesPerView":[1,"slides-per-view"],"pagination":[4],"centered":[4],"loop":[4],"direction":[1537],"type":[1],"sliderConfig":[520,"slider-config"],"thumbsConfig":[520,"thumbs-config"],"currentIndex":[32],"isEnd":[32],"isBeginning":[32],"swiperScript":[32],"displayAllTitle":[32],"windowWidth":[32],"slideTo":[64],"slideNext":[64],"slidePrev":[64],"slideToLoop":[64],"slideNextLoop":[64],"slidePrevLoop":[64],"slideReset":[64],"slideToClosest":[64],"update":[64],"updateAutoHeight":[64],"updateSlides":[64],"updateProgress":[64],"updateSlidesClasses":[64],"getSlides":[64]}],[4,"salla-placeholder",{"icon":[1],"alignment":[1],"iconSize":[1,"icon-size"],"translationLoaded":[32]}],[0,"salla-skeleton",{"type":[1],"width":[1],"height":[1]}],[0,"salla-tel-input",{"phone":[1025],"name":[1],"countryCode":[1025,"country-code"],"mobileRequired":[32],"countryCodeLabel":[32],"mobileLabel":[32],"tooShort":[32],"tooLong":[32],"invalidCountryCode":[32],"invalidNumber":[32],"errorMap":[32],"getValues":[64],"isValid":[64]}],[4,"salla-modal",{"isClosable":[1028,"is-closable"],"width":[513],"position":[513],"visible":[516],"hasSkeleton":[516,"has-skeleton"],"isLoading":[1540,"is-loading"],"subTitleFirst":[4,"sub-title-first"],"noPadding":[4,"no-padding"],"subTitle":[1,"sub-title"],"centered":[4],"iconStyle":[1,"icon-style"],"modalTitle":[32],"open":[64],"close":[64],"setTitle":[64],"loading":[64],"stopLoading":[64]},[[0,"keyup","handleKeyUp"]]],[0,"salla-loading",{"size":[8],"width":[8],"color":[1],"bgColor":[1,"bg-color"]}],[4,"salla-button",{"shape":[513],"color":[513],"fill":[513],"size":[513],"width":[513],"loading":[516],"disabled":[516],"loaderPosition":[1,"loader-position"],"href":[1],"load":[64],"stop":[64],"setText":[64],"disable":[64],"enable":[64]}]]],["p-535b0024.system",[[0,"salla-products-slider",{"blockTitle":[1,"block-title"],"subTitle":[1,"sub-title"],"sliderId":[1,"slider-id"],"displayAllUrl":[1,"display-all-url"],"autoplay":[1028],"source":[1537],"sourceValue":[1,"source-value"],"limit":[1026],"productsData":[32],"isReady":[32],"sourceValueIsValid":[32],"hasCustomComponent":[32],"apiUrl":[32],"parsedSourceValue":[32]}]]],["p-ab0d1a8b.system",[[0,"salla-product-options",{"productId":[2,"product-id"],"options":[1],"optionsData":[32],"outOfStockText":[32],"donationAmount":[32],"selectDonationAmount":[32],"selectAmount":[32],"isCustomDonation":[32],"selectedOptions":[32],"canDisabled":[32],"selectedSkus":[32],"selectedOutSkus":[32],"getSelectedOptionsData":[64],"reportValidity":[64],"hasOutOfStockOption":[64],"getSelectedOptions":[64],"getOption":[64]}]]],["p-0776e726.system",[[0,"salla-filters",{"filters":[1040],"isSidebarOpen":[32],"filtersData":[32],"apply":[32],"reset":[32],"getFilters":[64],"applyFilters":[64],"resetFilters":[64]}]]],["p-ff434208.system",[[0,"salla-comment-form",{"type":[1537],"showAvatar":[4,"show-avatar"],"itemId":[1544,"item-id"],"placeholder":[32],"submitText":[32],"canComment":[32]}]]],["p-90362986.system",[[0,"salla-installment",{"price":[1],"language":[1],"currency":[1],"tamaraIsActive":[32],"tabbyIsActive":[32],"spotiiIsActive":[32]}]]],["p-cb5d2739.system",[[0,"salla-loyalty-prize-item",{"item":[16]}]]],["p-7508e0b1.system",[[0,"salla-products-list",{"source":[1537],"sourceValue":[1032,"source-value"],"limit":[1026],"sortBy":[1025,"sort-by"],"filtersResults":[1540,"filters-results"],"horizontalCards":[516,"horizontal-cards"],"page":[32],"nextPage":[32],"hasInfiniteScroll":[32],"hasCustomComponent":[32],"sourceValueIsValid":[32],"placeholderText":[32],"isReady":[32],"showPlaceholder":[32],"parsedFilters":[32],"setFilters":[64],"reload":[64]}]]],["p-8429c1fe.system",[[0,"salla-price-range",{"minPrice":[1032,"min-price"],"maxPrice":[1032,"max-price"],"option":[16],"filtersData":[520,"filters-data"],"min":[32],"max":[32],"priceOptions":[32],"moreThanLabel":[32],"lessThanLabel":[32],"toLabel":[32],"fromLabel":[32],"reset":[64]}]]],["p-20659764.system",[[4,"salla-filters-widget",{"withLoadMore":[1028,"with-load-more"],"filtersData":[16],"option":[16],"isOpen":[32],"isShowMore":[32],"showMoreLabel":[32],"showLessLabel":[32],"setWidgetHeight":[64],"reset":[64],"showMore":[64],"toggleWidget":[64]}]]],["p-7c7a3aff.system",[[4,"salla-conditional-fields",null,[[0,"change","changeHandler"]]]]]]'),e)}))}}}));
 //# sourceMappingURL=p-34bf40ac.system.js.map

package/dist/twilight/p-535b0024.system.entry.js

@@ -0,0 +1,5 @@
+/*!
+ * Crafted with ❤ by Salla
+ */
+System.register(["./p-f0c68bf7.system.js","./p-68d3a0d2.system.js"],(function(t){"use strict";var e,s,r,u,i;return{setters:[function(t){e=t.r;s=t.h;r=t.H;u=t.g},function(t){i=t.H}],execute:function(){var o="";var a=t("salla_products_slider",function(){function t(t){var s=this;e(this,t);this.blockTitle=undefined;this.subTitle=undefined;this.sliderId=undefined;this.displayAllUrl=undefined;this.autoplay=undefined;this.source=undefined;this.sourceValue=undefined;this.limit=undefined;this.productsData=undefined;this.isReady=undefined;this.sourceValueIsValid=undefined;this.hasCustomComponent=undefined;this.apiUrl="";this.parsedSourceValue=undefined;salla.onReady((function(){s.sourceValueIsValid=!!(s.getSourceValue()||s.isSourceWithoutValue());if(!s.sourceValueIsValid){salla.logger.warn("source-value prop is required for source [".concat(s.getSource(),"]"));return}s.hasCustomComponent=!!customElements.get("custom-salla-product-card")}))}t.prototype.isSourceWithoutValue=function(){return["offers","latest","sales"].includes(this.getSource())};t.prototype.getItemHTML=function(t){if(this.hasCustomComponent){return s("div",{class:"s-products-slider-card"},s("custom-salla-product-card",{product:t,source:this.getSource(),"source-value":this.getSourceValue()}))}return s("div",{class:"s-products-slider-card"},s("salla-product-card",{"show-quantity":this.getSource()=="landing-page","hide-add-btn":this.getSource()=="landing-page","shadow-on-hover":true,product:t}))};t.prototype.canRender=function(){return this.sourceValueIsValid&&this.isReady};t.prototype.componentWillLoad=function(){if(this.source==="json"){this.productsData=this.getSourceValue();this.isReady=true;return}return this.fetchProducts()};t.prototype.fetchProducts=function(){var t=this;return salla.product.api.fetch({source:this.getSource(),source_value:this.getSourceValue(),limit:this.limit}).then((function(e){t.productsData=e.data;t.isReady=true;salla.event.emit("salla-products-slider::products.fetched",e.data)})).catch((function(){salla.log("Request headers",salla.api.getHeaders());setTimeout((function(){return t.fetchProducts()}),1e3)}))};t.prototype.getSource=function(){return i.getProductsSource(this.source)};t.prototype.getSourceValue=function(){return i.getProductsSourceValue(this.source,this.sourceValue)};t.prototype.render=function(){var t=this;var e;if(this.getSource()=="related"&&!salla.config.get("store.settings.product.related_products_enabled")||!this.canRender()){return}return s(r,{class:"s-products-slider-wrapper"},s("salla-slider",{class:"s-products-slider-slider",id:this.sliderId||"s-products-slider-".concat(Math.random().toString(36).substr(2,9)),"auto-play":this.autoplay,type:"carousel","block-title":this.blockTitle,"block-subTitle":this.subTitle,"display-all-url":this.displayAllUrl},s("div",{slot:"items"},(e=this.productsData)===null||e===void 0?void 0:e.map((function(e){return t.getItemHTML(e)})))))};Object.defineProperty(t.prototype,"host",{get:function(){return u(this)},enumerable:false,configurable:true});return t}());a.style=o}}}));
+//# sourceMappingURL=p-535b0024.system.entry.js.map

package/dist/twilight/p-535b0024.system.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["sallaProductsSliderCss","SallaProductsSlider","exports","class_1","hostRef","_this","this","salla","onReady","sourceValueIsValid","getSourceValue","isSourceWithoutValue","logger","warn","concat","getSource","hasCustomComponent","customElements","get","prototype","includes","getItemHTML","product","h","class","source","canRender","isReady","componentWillLoad","productsData","fetchProducts","api","fetch","source_value","limit","then","res","data","event","emit","catch","log","getHeaders","setTimeout","Helper","getProductsSource","getProductsSourceValue","sourceValue","render","config","Host","id","sliderId","Math","random","toString","substr","autoplay","type","blockTitle","subTitle","displayAllUrl","slot","_a","map"],"sources":["src/components/salla-products-slider/salla-products-slider.scss?tag=salla-products-slider","src/components/salla-products-slider/salla-products-slider.tsx"],"sourcesContent":[".s-products-slider{\n  &-wrapper{\n\n  }\n  &-slider{\n\n  }\n  &-card{\n\n  }\n}","import { Component, Host, h, Prop, Element, State } from '@stencil/core';\nimport Helper from '../../Helpers/Helper';\n@Component({\n  tag: 'salla-products-slider',\n  styleUrl: 'salla-products-slider.scss'\n})\n\n//todo:: extends this component from salla-products-list or the opposite\nexport class SallaProductsSlider {\n  constructor() {\n    salla.onReady(() => {\n      this.sourceValueIsValid = !!(this.getSourceValue() || 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  * autoplay option for products slider\n  */\n  @Prop({ mutable: true }) autoplay: boolean\n\n  /**\n   * Source of the products, if api will get the products from the API, if json will get the products from the products prop\n   * @type {string}\n   * @default ''\n   * */\n  @Prop({\n    reflect: true,\n    mutable: true\n  }) source: 'categories' | 'latest' | 'related' | 'brands' | 'json' | 'tags' | 'selected' | 'offers' | 'landing-page';\n\n  /**\n   * The source value, cloud be different values as following:\n   * - array of ids when `source` in ['categories', 'brands', 'tags', 'selected']\n   * - products payload when `source` = 'json'\n   * - product_id when `source` = 'related'\n   *\n   * @type {string}\n   * */\n  @Prop() sourceValue: string;\n\n  /**\n   * Limit for number of products in the list.\n   */\n  @Prop({ mutable: true }) limit: number;\n\n\n  @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\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 this.fetchProducts();\n\n  }\n\n  private fetchProducts() {\n    return salla.product.api.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      salla.event.emit('salla-products-slider::products.fetched', res.data);\n    }).catch(() => {\n      // TODO: Find the real issue and fix it\n      salla.log('Request headers', salla.api.getHeaders());\n      setTimeout(() => this.fetchProducts(), 1000);\n    })\n  }\n  private getSource() {\n    return Helper.getProductsSource(this.source);\n  }\n\n  private getSourceValue() {\n    return Helper.getProductsSourceValue(this.source, this.sourceValue);\n  }\n\n  render() {\n    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          auto-play={this.autoplay}\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"],"mappings":";;;wMAAA,IAAMA,EAAyB,G,ICQlBC,EAAmBC,EAAA,mCAC9B,SAAAC,EAAAC,GAAA,IAAAC,EAAAC,K,kVAgF0B,G,iCA/ExBC,MAAMC,SAAQ,WACZH,EAAKI,sBAAwBJ,EAAKK,kBAAoBL,EAAKM,wBAC3D,IAAKN,EAAKI,mBAAoB,CAC5BF,MAAMK,OAAOC,KAAK,6CAAAC,OAA6CT,EAAKU,YAAW,MAC/E,M,CAEFV,EAAKW,qBAAuBC,eAAeC,IAAI,4B,IAG3Cf,EAAAgB,UAAAR,qBAAA,WACN,MAAO,CAAC,SAAU,SAAU,SAASS,SAASd,KAAKS,Y,EAwE7CZ,EAAAgB,UAAAE,YAAA,SAAYC,GAClB,GAAIhB,KAAKU,mBAAoB,CAC3B,OAAOO,EAAA,OAAKC,MAAM,0BAChBD,EAAA,6BAA2BD,QAASA,EAASG,OAAQnB,KAAKS,YAAW,eAAgBT,KAAKI,mB,CAI9F,OAAOa,EAAA,OAAKC,MAAM,0BAChBD,EAAA,sCACiBjB,KAAKS,aAAe,eAAc,eACnCT,KAAKS,aAAe,eAAc,kBAC/B,KACjBO,QAASA,I,EAMPnB,EAAAgB,UAAAO,UAAA,WACN,OAAOpB,KAAKG,oBAAsBH,KAAKqB,O,EAGzCxB,EAAAgB,UAAAS,kBAAA,WACE,GAAItB,KAAKmB,SAAW,OAAQ,CAC1BnB,KAAKuB,aAAevB,KAAKI,iBACzBJ,KAAKqB,QAAU,KACf,M,CAEF,OAAOrB,KAAKwB,e,EAIN3B,EAAAgB,UAAAW,cAAA,eAAAzB,EAAAC,KACN,OAAOC,MAAMe,QAAQS,IAAIC,MAAM,CAC7BP,OAAQnB,KAAKS,YACbkB,aAAc3B,KAAKI,iBACnBwB,MAAO5B,KAAK4B,QACXC,MAAK,SAAAC,GACN/B,EAAKwB,aAAeO,EAAIC,KACxBhC,EAAKsB,QAAU,KACfpB,MAAM+B,MAAMC,KAAK,0CAA2CH,EAAIC,K,IAC/DG,OAAM,WAEPjC,MAAMkC,IAAI,kBAAmBlC,MAAMwB,IAAIW,cACvCC,YAAW,WAAM,OAAAtC,EAAKyB,eAAL,GAAsB,I,KAGnC3B,EAAAgB,UAAAJ,UAAA,WACN,OAAO6B,EAAOC,kBAAkBvC,KAAKmB,O,EAG/BtB,EAAAgB,UAAAT,eAAA,WACN,OAAOkC,EAAOE,uBAAuBxC,KAAKmB,OAAQnB,KAAKyC,Y,EAGzD5C,EAAAgB,UAAA6B,OAAA,eAAA3C,EAAAC,K,MACE,GAAKA,KAAKS,aAAe,YAAcR,MAAM0C,OAAO/B,IAAI,qDAAwDZ,KAAKoB,YAAa,CAChI,M,CAEF,OACEH,EAAC2B,EAAI,CAAC1B,MAAM,6BACVD,EAAA,gBACEC,MAAM,2BACN2B,GAAI7C,KAAK8C,UAAY,qBAAAtC,OAAqBuC,KAAKC,SAASC,SAAS,IAAIC,OAAO,EAAG,IAAI,YACxElD,KAAKmD,SAChBC,KAAK,WAAU,cACFpD,KAAKqD,WAAU,iBACZrD,KAAKsD,SAAQ,kBACZtD,KAAKuD,eAEtBtC,EAAA,OAAKuC,KAAK,UACPC,EAAAzD,KAAKuB,gBAAY,MAAAkC,SAAA,SAAAA,EAAEC,KAAI,SAAA1C,GAAW,OAAAjB,EAAKgB,YAAYC,EAAjB,M,yHA3Jf,I"}