@salla.sa/twilight-components 2.12.71 → 2.12.73

package/dist/twilight/p-2f8608f8.system.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["sallaFiltersWidgetCss","SallaFiltersWidget","exports","this","initHeight","salla","config","get","class_1","prototype","connectedCallback","_this","withLoadMore","option","key","Array","isArray","values","length","onReady","page","lang","onLoaded","showMoreLabel","getWithDefault","showLessLabel","componentDidLoad","widgetValues","scrollHeight","style","maxHeight","concat","widgetContent","height","setWidgetHeight","delay","removeAttribute","setTimeout","currentWidgetHeight","offsetHeight","reset","type","FilterOptionTypes","RANGE","priceRange","from","host","querySelectorAll","forEach","input","checked","showMore","isShowMore","toggleWidget","isOpen","Helper","toggleElementClassIf","renderFilterOption","VALUES","MINIMUM","VARIANTS","includes","map","filterOption","index","value","h","class","htmlFor","id","name","inputType","isSelectedOption","onChange","e","changed","emit","event","getOptionLabel","slug","filtersData","FilterOptionInputType","CHECKBOX","size","label","render","Host","onClick","ref","el","onChanged","detail","price"],"sources":["src/components/salla-filters-widget/salla-filters-widget.scss?tag=salla-filters-widget","src/components/salla-filters-widget/salla-filters-widget.tsx"],"sourcesContent":[":host {\n  display: block;\n}\n","import { Component, Host, h, Method, State, Prop, Event, Element } from '@stencil/core';\nimport Helper from '../../Helpers/Helper';\nimport { Filter, FilterOptionInputType, FilterOptionTypes } from \"../salla-filters/interfaces\";\n\n@Component({\n  tag: 'salla-filters-widget',\n  styleUrl: 'salla-filters-widget.scss',\n})\nexport class SallaFiltersWidget {\n  @Element() host: HTMLElement;\n\n  /**\n   * Show more or less filter options.\n   */\n  @Prop({ mutable: true }) withLoadMore: boolean;\n\n  /**\n   * Selected filter options value.\n   */\n  @Prop({ reflect: true }) filtersData: object;\n\n  /**\n   * Filter option along with possible values.\n   */\n  @Prop({ reflect: true }) option: Filter;\n\n\n  priceRange: HTMLSallaPriceRangeElement\n\n\n  private widgetValues: HTMLElement;\n  private widgetContent: HTMLDivElement;\n  private initHeight: number = 195;\n\n  @State() isOpen: boolean = true;\n  @State() isShowMore: boolean = false;\n  @State() showMoreLabel: string = \"عرض المزيد\";\n  @State() showLessLabel: string = \"عرض أقل\";\n  @State() page: any = salla.config.get('page');\n\n  /**\n   * Custom event emitted up on filter option selection changes.\n   */\n  @Event() changed: any;\n\n  connectedCallback() {\n    //lets be smart and don't show 5 and more link for 8 options\n    this.withLoadMore = this.option.key != 'price' && Array.isArray(this.option.values) && this.option.values.length > 8;\n    salla.onReady(() => {\n      this.page = salla.config.get('page');\n    })\n    salla.lang.onLoaded(() => {\n      this.showMoreLabel = salla.lang.getWithDefault('common.titles.more', this.showMoreLabel)\n      this.showLessLabel = salla.lang.getWithDefault('common.elements.show_less', this.showLessLabel)\n    })\n  }\n\n  componentDidLoad() {\n    this.widgetValues.scrollHeight < this.initHeight && (this.withLoadMore = false);\n    (this.withLoadMore && this.widgetValues) && (this.widgetValues.style.maxHeight = `${this.initHeight}px`);\n    this.widgetContent.style.height = `${this.widgetContent.scrollHeight}px`;\n  }\n\n  @Method()\n  async setWidgetHeight(delay = 250) {\n    this.widgetContent.removeAttribute('style');\n    setTimeout(() => {\n      let currentWidgetHeight: number = this.widgetContent.offsetHeight;\n      this.widgetContent.style.height = currentWidgetHeight + 'px';\n    }, delay)\n  }\n\n  /**\n   * Reset selected filter options.\n   */\n  @Method()\n  async reset() {\n    if (this.option.type === FilterOptionTypes.RANGE) {\n      this.priceRange.reset()\n    }\n    Array.from(this.host.querySelectorAll('input')).forEach(input => input.checked = false);\n  }\n\n\n  /**\n   * Action to show more or less filter options.\n   */\n  @Method()\n  async showMore() {\n    this.isShowMore = !this.isShowMore\n    this.widgetContent.style.height = 'auto';\n    this.widgetValues.style.maxHeight = this.isShowMore ? `${this.widgetValues.scrollHeight}px` : `${this.initHeight}px`;\n    setTimeout(() => {\n      this.widgetContent.style.height = `${this.widgetContent.scrollHeight}px`;\n    }, 400); // get height after time of collapse animtion (duration-300)\n  }\n\n  /**\n   * Action to toggle widget open or closed (expand/ collapse).\n   */\n  @Method()\n  async toggleWidget() {\n    this.isOpen = !this.isOpen;\n    Helper.toggleElementClassIf(this.widgetContent, 's-filters-widget-opened', 's-filters-widget-closed', () => this.isOpen);\n  }\n\n  renderFilterOption(option: Filter) {\n    if (![FilterOptionTypes.VALUES, FilterOptionTypes.MINIMUM, FilterOptionTypes.VARIANTS].includes(option.type)) {\n      return '';\n    }\n    //@ts-ignore\n    return option.values.map((filterOption, index) => {\n      let value = typeof filterOption == 'number' ? filterOption : (filterOption.key || filterOption.value);\n\n      return <label class=\"s-filters-label\" htmlFor={`${option.key}-option-${index}`}>\n        <input\n          id={`${option.key}-option-${index}`}\n          name={option.key}\n          type={option.inputType}\n          //TODO:: debug more why sometimes it's not rendered as selected🤨\n          checked={this.isSelectedOption(option, value)}\n          class={`s-filters-${option.inputType}`}\n          onChange={e => this.changed.emit({ event: e, option: option, value: value })}\n        />\n        {this.getOptionLabel(option, filterOption)}\n      </label>\n    }\n    )\n  }\n\n  private isSelectedOption(option: Filter, value) {\n    if (this.page.slug == 'product.index' && this.option.key == 'category_id') {\n      return this.page.id == value\n    }\n    \n    if (!this.filtersData || !this.filtersData[option.key]) {\n      return false\n    }\n\n    return option.inputType === FilterOptionInputType.CHECKBOX\n      ? this.filtersData[option.key].includes(value)\n      : this.filtersData[option.key] == value;\n  }\n\n  private getOptionLabel(option: Filter, filterOption) {\n    if (option.key == 'rating') {\n      //in amazon has stars & up, should we add it, to avoid those people who will come to say I selected 4 why I see 5 sars products\n      return <salla-rating-stars size=\"small\" value={filterOption} />;\n    }\n    let label = filterOption.value || 'null';\n    //label+=filterOption.count ? ` (${salla.helpers.number(filterOption.count)})` : '';\n    return <span class=\"s-filters-option-name\">{label}</span>;\n  }\n\n  render() {\n    return (\n      <Host class=\"s-filters-widget-container\">\n        <h3 class=\"s-filters-widget-title\" onClick={() => this.toggleWidget()}>\n          <span>{this.option.label}</span>\n          <span class={`s-filters-widget-plusminus ${this.isOpen ? 's-filters-widget-plusminus-active' : ''}`} />\n        </h3>\n        <div class=\"s-filters-widget-content\" ref={(el) => this.widgetContent = el}>\n          <div class=\"s-filters-widget-values\" ref={(el) => this.widgetValues = el}>\n            <slot />\n            {\n              this.option.type !== FilterOptionTypes.RANGE\n                ? this.renderFilterOption(this.option)\n                : <salla-price-range onChanged={(event) => this.changed.emit(event.detail)}\n                  ref={price => this.priceRange = price}\n                  filtersData={this.filtersData}\n                  option={this.option} />\n            }\n          </div>\n          {this.withLoadMore &&\n            <a class=\"s-filters-widget-more\"\n              onClick={() => this.showMore()}>{!this.isShowMore ? this.showMoreLabel : this.showLessLabel}</a>\n          }\n        </div>\n      </Host>\n    );\n  }\n\n}\n"],"mappings":"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"}

package/dist/twilight/p-52890817.entry.js

@@ -1,5 +0,0 @@
-/*!
- * Crafted with ❤ by Salla
- */
-import{r as t,c as e,h as i,H as s}from"./p-dd9b5ccb.js";const r=":host{display:block}.rtl .rtl-range-slider,[dir=rtl] .rtl-range-slider{-webkit-transform:rotateY(180deg);transform:rotateY(180deg)}.rtl .rtl-range-numbers,[dir=rtl] .rtl-range-numbers{-ms-flex-direction:row-reverse;flex-direction:row-reverse}.rtl .form-select,.rtl select,[dir=rtl] .form-select,[dir=rtl] select{background-position:left 0.5rem center;padding-right:12px}.rtl .menu-divide li:not(:last-child):after,[dir=rtl] .menu-divide li:not(:last-child):after{left:0;right:auto}input[type=range]::-webkit-slider-thumb{pointer-events:all;width:24px;height:24px;-webkit-appearance:none}[type=checkbox]:checked{background-size:80%}";const l=class{constructor(i){t(this,i);this.changed=e(this,"changed",7);this.filterValues=[];this.minPrice=undefined;this.maxPrice=undefined;this.option=undefined;this.filtersData=undefined;this.min=0;this.max=1e4;this.priceOptions=undefined;this.moreThanLabel="أكثر من";this.lessThanLabel="أقل من";this.toLabel="الى";this.fromLabel="من"}connectedCallback(){var t;if(this.filtersData&&((t=this.filtersData)===null||t===void 0?void 0:t.price)){this.minPrice=this.filtersData.price.min;this.maxPrice=this.filtersData.price.max}salla.lang.onLoaded((()=>{this.moreThanLabel=salla.lang.getWithDefault("common.elements.more_than",this.moreThanLabel);this.lessThanLabel=salla.lang.getWithDefault("common.elements.less_than",this.lessThanLabel);this.toLabel=salla.lang.getWithDefault("common.elements.to",this.toLabel);this.fromLabel=salla.lang.getWithDefault("common.elements.from",this.fromLabel)}));if(this.option.values.length==1){return}if(this.option.values.length<=5){this.filterValues=this.option.values;return}const e=Math.ceil(this.option.values.length/5);for(let t=0;t<this.option.values.length;t+=e){this.filterValues.push(this.option.values.slice(t,t+e).reduce(((t,e)=>{t.to=e.to;t.count+=e.count;return t})))}}async reset(){this.minInput.value=null;this.maxInput.value=null}getPriceLabel(t){if(isNaN(t.from)||t.from<1){return`${this.lessThanLabel} ${salla.money(t.to)}`}if(isNaN(t.to)||t.to<1){return`${this.moreThanLabel} ${salla.money(t.from)}`}return`${salla.money(t.from)} ${this.toLabel} ${salla.money(t.to)}`}handleMinMaxPrice(t,e){this.minPrice=e.from;this.maxPrice=e.to!="*"?e.to:null;this.changedEventHandler(t)}async changedEventHandler(t,e=false){salla.helpers.inputDigitsOnly(t.target);let i=t?t.target.value*1:null;if(e){this.minInputValidation(i)}else{this.maxInputValidation(i)}this.isReady&&this.changed.emit({event:t,option:this.option,value:{max:this.maxPrice,min:this.minPrice}})}minInputValidation(t){if(t&&(t>this.max||t>this.maxPrice)){return}if(t<this.min){this.minPrice=this.min;return}if(t){this.minPrice=t}}maxInputValidation(t){if(t&&(t<this.min||t<this.minPrice)){return}if(t>this.max){this.maxPrice=this.max;return}if(t){this.maxPrice=t}}isChecked(t){if(!this.minPrice&&!this.maxPrice){return false}let e=(t.from<1||t.from=="*")&&this.minPrice==0||t.from==this.minPrice;let i=t.to=="*"||!t.to||t.to==this.maxPrice;return e&&i}render(){return i(s,null,this.filterValues.map(((t,e)=>i("label",{class:"s-filters-label",htmlFor:`${this.option.key}-${e}`},i("input",{id:`${this.option.key}-${e}`,name:"price",type:"radio",checked:this.isChecked(t),class:"s-filters-radio",onChange:e=>this.handleMinMaxPrice(e,t)}),this.getPriceLabel(t)))),i("div",{class:"flex justify-center items-center"},i("div",{class:"relative max-w-xl w-full"},i("div",{class:"s-price-range-inputs"},i("div",{class:"s-price-range-relative"},i("div",{class:"s-price-range-currency"}," ",salla.config.currency().symbol),i("input",{type:"number",maxlength:"5",ref:t=>this.minInput=t,onInput:t=>this.changedEventHandler(t,true),value:this.minPrice,placeholder:this.fromLabel,class:"s-price-range-number-input"})),i("div",{class:"s-price-range-gray-text"}," -"),i("div",{class:"s-price-range-relative"},i("div",{class:"s-price-range-currency"}," ",salla.config.currency().symbol),i("input",{type:"number",maxlength:"5",placeholder:this.toLabel,ref:t=>this.maxInput=t,onInput:t=>this.changedEventHandler(t),value:this.maxPrice,class:"s-price-range-number-input","aria-describedby":"price-currency"}))))))}componentDidLoad(){this.isReady=true}};l.style=r;export{l as salla_price_range};
-//# sourceMappingURL=p-52890817.entry.js.map

package/dist/twilight/p-52890817.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["sallaPriceRangeCss","SallaPriceRange","this","filterValues","connectedCallback","filtersData","_a","price","minPrice","min","maxPrice","max","salla","lang","onLoaded","moreThanLabel","getWithDefault","lessThanLabel","toLabel","fromLabel","option","values","length","chunkSize","Math","ceil","i","push","slice","reduce","final","currentValue","to","count","reset","minInput","value","maxInput","getPriceLabel","filterValue","isNaN","from","money","handleMinMaxPrice","event","changedEventHandler","isMin","helpers","inputDigitsOnly","target","minInputValidation","maxInputValidation","isReady","changed","emit","isChecked","isMinEqual","isMaxEqual","render","h","Host","map","index","class","htmlFor","key","id","name","type","checked","onChange","e","config","currency","symbol","maxlength","ref","el","onInput","placeholder","componentDidLoad"],"sources":["src/components/salla-price-range/salla-price-range.scss?tag=salla-price-range","src/components/salla-price-range/salla-price-range.tsx"],"sourcesContent":[":host {\n  display: block;\n}\n\n\n.rtl, [dir=\"rtl\"] {\n  .rtl-range-slider {\n      transform: rotateY(180deg);\n  }\n\n  .rtl-range-numbers{\n      flex-direction: row-reverse;\n  }\n\n  .form-select, select{\n      background-position: left 0.5rem center;\n      padding-right: 12px;\n  }   \n\n  // divide\n.menu-divide {\n  li {\n      &:not(:last-child) {\n          &:after {\n              left: 0;\n              right: auto;\n          }\n      }\n  }\n}\n}\n\ninput[type=range]::-webkit-slider-thumb {\n  pointer-events: all;\n  width: 24px;\n  height: 24px;\n  -webkit-appearance: none;\n}\n\n[type='checkbox']:checked{\n  background-size: 80%;\n}","import {Component, Host, h, State, Prop, Event, Method} from '@stencil/core';\nimport {Filter, FilterValue} from \"../salla-filters/interfaces\";\n\n@Component({\n  tag: 'salla-price-range',\n  styleUrl: 'salla-price-range.scss',\n})\nexport class SallaPriceRange {\n  /**\n   * Minimum price threshold value\n   */\n  @Prop({mutable: true}) minPrice;\n\n  /**\n   * Maximum price threshold value\n   */\n  @Prop({mutable: true}) maxPrice;\n\n  /**\n   * Product price range filter option object instance\n   */\n  @Prop({reflect: true}) option: Filter;\n\n  /**\n   * Currently selected price filter data\n   */\n  @Prop({reflect: true}) filtersData: any;\n\n\n  @State() min = 0;\n  @State() max = 10000;\n  @State() priceOptions: any;\n  @State() moreThanLabel: string=\"أكثر من\";\n  @State() lessThanLabel: string=\"أقل من\";\n  @State() toLabel: string=\"الى\";\n  @State() fromLabel: string=\"من\";\n\n  /**\n   * Custome event emitted when there is a change in price input.\n   */\n  @Event() changed: any;\n\n  isReady: Boolean;\n  minInput: HTMLInputElement;\n  maxInput: HTMLInputElement;\n  filterValues: Array<FilterValue> = [];\n\n\n  connectedCallback() {\n    if (this.filtersData && this.filtersData?.price) {\n      this.minPrice = this.filtersData.price.min;\n      this.maxPrice = this.filtersData.price.max;\n    }\n    salla.lang.onLoaded(() => {\n      this.moreThanLabel=salla.lang.getWithDefault('common.elements.more_than', this.moreThanLabel)\n      this.lessThanLabel=salla.lang.getWithDefault('common.elements.less_than', this.lessThanLabel)\n      this.toLabel=salla.lang.getWithDefault('common.elements.to', this.toLabel)\n      this.fromLabel=salla.lang.getWithDefault('common.elements.from', this.fromLabel)\n    })\n\n    //no need to show one option only\n    if (this.option.values.length == 1) {\n      return;\n    }\n    //here we may receive too many prices, we will group all inputs to\n    if (this.option.values.length <= 5) {\n      this.filterValues = this.option.values;\n      return;\n    }\n    const chunkSize = Math.ceil(this.option.values.length / 5);\n    for (let i = 0; i < this.option.values.length; i += chunkSize) {\n      this.filterValues.push(\n        this.option.values\n          .slice(i, i + chunkSize)\n          .reduce((final: FilterValue, currentValue: FilterValue) => {\n            final.to = currentValue.to;\n            final.count += currentValue.count;\n            return final;\n          })\n      );\n      // do whatever\n    }\n  }\n\n  /**\n   * reset the price range inputs\n   */\n  @Method()\n  async reset() {\n    //@ts-ignore\n    this.minInput.value = null;\n    this.maxInput.value = null;\n  }\n\n  private getPriceLabel(filterValue: FilterValue) {\n    // @ts-ignore\n    if (isNaN(filterValue.from) || filterValue.from < 1) {\n      return `${this.lessThanLabel} ${salla.money(filterValue.to)}`;\n    }\n    // @ts-ignore\n    if (isNaN(filterValue.to) || filterValue.to < 1) {\n      return `${this.moreThanLabel} ${salla.money(filterValue.from)}`;\n    }\n\n    return `${salla.money(filterValue.from)} ${this.toLabel} ${salla.money(filterValue.to)}`;\n  }\n\n  private handleMinMaxPrice(event: Event, value: FilterValue): void {\n\n    //todo:: cover when from is star\n    this.minPrice = value.from;\n    this.maxPrice = value.to != '*' ? value.to : null;\n\n    this.changedEventHandler(event);\n  }\n\n  private async changedEventHandler(event, isMin = false) {\n    salla.helpers.inputDigitsOnly(event.target)\n    let value = event ? event.target.value * 1 : null\n    if (isMin) {\n      this.minInputValidation(value);\n    } else {\n      this.maxInputValidation(value)\n    }\n\n\n    this.isReady && this.changed.emit({\n      event: event,\n      option: this.option,\n      value: {max: this.maxPrice, min: this.minPrice}\n    })\n  }\n\n\n  minInputValidation(value) {\n    if (value && (value > this.max || value > this.maxPrice)) {\n      // this.minPrice = this.maxPrice;\n      return;\n    }\n\n    if (value < this.min) {\n      this.minPrice = this.min;\n      return;\n    }\n\n    if (value) {\n      this.minPrice = value;\n    }\n  }\n\n  maxInputValidation(value) {\n    if (value && (value < this.min || value < this.minPrice)) {\n      // this.maxPrice = this.minPrice;\n      return;\n    }\n    if (value > this.max) {\n      this.maxPrice = this.max;\n      return;\n    }\n\n    if (value) {\n      this.maxPrice = value;\n    }\n  }\n\n  private isChecked(filterValue: FilterValue) {\n    if (!this.minPrice && !this.maxPrice) {\n      return false;\n    }\n\n    //1 filterValue.from zero or * and this.minPrice not set or zero\n    //2 filterValue.from == this.minPrice\n    //@ts-ignore\n    let isMinEqual = ((filterValue.from < 1 || filterValue.from == '*') && this.minPrice == 0) || filterValue.from == this.minPrice;\n\n    //1 filterValue.to == \"*\" or null\n    //2 filterValue.to == this.max\n    let isMaxEqual = filterValue.to == '*' || !filterValue.to || filterValue.to == this.maxPrice;\n    return isMinEqual && isMaxEqual;\n  }\n\n\n  render() {\n    return (\n      <Host>\n        {\n          this.filterValues.map((filterValue: FilterValue, index: number) => {\n            return <label class=\"s-filters-label\" htmlFor={`${this.option.key}-${index}`}>\n              <input\n                id={`${this.option.key}-${index}`}\n                name=\"price\"\n                type=\"radio\"\n                checked={this.isChecked(filterValue)}\n                class=\"s-filters-radio\"\n                onChange={e => this.handleMinMaxPrice(e, filterValue)}\n              />\n              {this.getPriceLabel(filterValue)}\n            </label>\n          })\n        }\n\n\n        <div class=\"flex justify-center items-center\">\n          <div class=\"relative max-w-xl w-full\">\n            <div class=\"s-price-range-inputs\">\n              <div class=\"s-price-range-relative\">\n                <div class=\"s-price-range-currency\"> {salla.config.currency().symbol}</div>\n                <input\n                  type=\"number\"\n                  maxlength=\"5\"\n                  ref={el => this.minInput = el}\n                  onInput={(event) => this.changedEventHandler(event, true)}\n                  value={this.minPrice}\n                  placeholder={this.fromLabel}\n                  class=\"s-price-range-number-input\"\n                />\n              </div>\n\n              <div class=\"s-price-range-gray-text\"> -</div>\n              <div class=\"s-price-range-relative\">\n                <div class=\"s-price-range-currency\"> {salla.config.currency().symbol}</div>\n                <input type=\"number\" maxlength=\"5\"\n                       placeholder={this.toLabel}\n                       ref={el => this.maxInput = el}\n                       onInput={(event) => this.changedEventHandler(event)}\n                       value={this.maxPrice}\n                       class=\"s-price-range-number-input\" aria-describedby=\"price-currency\"/>\n              </div>\n            </div>\n          </div>\n        </div>\n      </Host>\n    );\n  }\n\n  componentDidLoad() {\n    this.isReady = true;\n  }\n}\n"],"mappings":"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"}