@nanoporetech-digital/components 5.2.1 → 5.3.1

package/dist/nano-components/{p-6920ad69.entry.js.map → p-27422aa9.entry.js.map}

@@ -1 +1 @@
-{"version":3,"names":["algoliaFilterCss","AlgoliaFilter","this","filterId","tplWillRnder","Promise","resolve","tplDidRnder","undefined","valueSet","valStr","value","vals","length","split","didValueChange","foundVals","setFieldValues","internalValue","then","_","valueChanged","nanoFilterChanged","emit","facetName","filterName","operator","appliedFilterChanged","filterChanged","updateContent","tplUpdate","handleFilterChange","indexResults","appliedFilters","foundValue","find","filter","name","values","handleChangeEvent","getFieldValues","outputTo","outputSlot","outputEle","el","templateStr","showFilter","origFilters","writeTask","innerHTML","tplRenderFn","orig","dyn","selected","Object","assign","dynFilters","nanoTplUpdated","fields","querySelectorAll","i","field","type","select","n","options","push","checked","found","disabled","includes","newVal","hasChanged","connectedCallback","templateSlot","querySelector","filterIds","replace","componentWillLoad","storeId","ComponentStore","init","storeMethod","globalStoreMethod","componentDidLoad","render","h","Host","class","ref","div","Wormhole"],"sources":["./src/components/algolia/algolia-filter.scss?tag=nano-algolia-filter&encapsulation=shadow","./src/components/algolia/algolia-filter.tsx"],"sourcesContent":[":host {\n  display: none;\n\n  ::slotted([slot='filter-template']) {\n    display: none !important;\n  }\n}\n\n:host(.show-filter) {\n  display: block;\n}\n","import {\n  Component,\n  h,\n  Element,\n  Host,\n  Prop,\n  Watch,\n  State,\n  EventEmitter,\n  Event,\n  writeTask,\n  Listen,\n} from '@stencil/core';\nimport {\n  ComponentStore,\n  StorageMethods,\n} from '../../utils/store/component-store';\nimport {\n  SearchChangeEvent,\n  Wormhole,\n  WormholeConsumerConstructor,\n} from '../algolia/algolia-data';\nimport type {\n  IndexResult,\n  FilterChangeEventDetail,\n  AlgoliaFacet,\n} from '../../interface';\n\n/**\n * Displays and syncs algolia filters\n * Must be nested within an nano-algolia component.\n * @slot filter-template - Template string (format from nano-algolia 'tplEngine' property).\n * @slot output - A placeholder for template output.\n */\n@Component({\n  tag: 'nano-algolia-filter',\n  shadow: true,\n  styleUrl: 'algolia-filter.scss',\n})\nexport class AlgoliaFilter {\n  @Element() el: HTMLNanoAlgoliaFilterElement;\n\n  private templateStr: string;\n  private templateSlot: HTMLElement;\n  private outputSlot: HTMLElement;\n  private outputEle: HTMLElement;\n  private filterId: string = null;\n  private tplDidRnder;\n  private tplWillRnder = new Promise((resolve) => {\n    this.tplDidRnder = resolve;\n  });\n\n  @State() changeEvent: SearchChangeEvent;\n  @State() internalValue: Array<string> = [undefined];\n  @State() showFilter: boolean = false;\n  @State() indexResults: IndexResult = null;\n  @State() filterChanged: string = null;\n  @State() facets: AlgoliaFacet;\n  @State() tplRenderFn: (...args: any[]) => string;\n  @State() globalStoreMethod: StorageMethods;\n\n  /**\n   * Name of this filter - must match an appropriate algolia facet on a parent nano-algolia index to display\n   */\n  @Prop() filterName: string = null;\n\n  /**\n   * Set values of this filter. Will result in form elements being selected. '|' delimited string or array.\n   */\n  @Prop({ mutable: true }) value: string | Array<string> = '';\n\n  /**\n   * The internal operator joining filter values.\n   */\n  @Prop() operator: 'or' | 'and' = 'or';\n\n  /**\n   * Store search queries (against this ID) to the component store.\n   * Use in conjunction with storeMethod\n   */\n  @Prop() storeId?: string;\n\n  /**\n   * The method of storage.\n   * Either session storage, url hash (after the '#') or url query (after the '?').\n   */\n  @Prop() storeMethod: StorageMethods = 'session';\n\n  /**\n   * Emitted when the filter value changes\n   */\n  @Event() nanoFilterChanged!: EventEmitter<FilterChangeEventDetail>;\n\n  /**\n   * Emitted when templates are updated\n   */\n  @Event() nanoTplUpdated!: EventEmitter<HTMLNanoAlgoliaFilterElement>;\n\n  // Public facing. When changed attempts to 'check' any relevant fields in the template.\n  @Watch('value')\n  valueSet() {\n    const valStr = this.value as string;\n    let vals;\n\n    if (typeof valStr === 'string')\n      vals = valStr.length ? valStr.split('|') : [];\n    else vals = this.value as Array<string>;\n\n    if (this.didValueChange(vals)) {\n      const foundVals = this.setFieldValues(vals);\n      // found in template, set the internal state (this emits the changed event)\n      if (foundVals && foundVals.length) this.internalValue = vals;\n      // not found in template, wait for it to render.\n      else {\n        this.tplWillRnder.then((_) => {\n          this.setFieldValues(vals);\n          this.internalValue = vals;\n        });\n      }\n    }\n  }\n\n  // Value has changed and is reflected in template. Emit event.\n  @Watch('internalValue')\n  valueChanged() {\n    this.value = this.internalValue;\n    this.nanoFilterChanged.emit({\n      filterId: this.filterId,\n      facetName: this.filterName,\n      value: this.internalValue,\n      operator: this.operator,\n    });\n  }\n\n  // New facets from algolia. Update template\n  @Watch('facets')\n  appliedFilterChanged() {\n    if (\n      this.filterName &&\n      this.filterChanged &&\n      (this.filterChanged !== this.filterId || this.operator === 'and')\n    ) {\n      this.updateContent();\n    }\n  }\n\n  @Watch('tplRenderFn')\n  tplUpdate() {\n    this.updateContent();\n  }\n\n  @Watch('indexResults')\n  handleFilterChange() {\n    if (this.indexResults && this.indexResults.appliedFilters) {\n      const foundValue = this.indexResults.appliedFilters.find(\n        (filter) => filter.name === this.filterName\n      );\n      if (!foundValue) return;\n\n      this.tplWillRnder.then((_) => {\n        const foundVals = this.setFieldValues(foundValue.values);\n        if (foundVals && foundVals.length) this.value = foundVals;\n      });\n    }\n    this.updateContent();\n  }\n\n  @Listen('nanoChange')\n  @Listen('change')\n  handleChangeEvent() {\n    const vals = this.getFieldValues();\n    if (this.didValueChange(vals)) {\n      this.internalValue = vals;\n      return true;\n    }\n    return false;\n  }\n\n  private updateContent() {\n    const outputTo = this.outputSlot || this.outputEle;\n    if (!this.el) return;\n\n    // there's no template so show output right away\n    if (!this.templateStr) this.showFilter = true;\n    // there's a template but no index set so hide filters atm\n    else if (\n      !this.filterName ||\n      !outputTo ||\n      (this.templateStr &&\n        (!this.indexResults || !this.indexResults.origFilters[this.filterName]))\n    ) {\n      this.showFilter = false;\n    }\n\n    // there's no output element so nothing else to do\n    if (!outputTo) return;\n\n    // there's no index set atm but get any static filter values so we can apply them\n    if (!this.indexResults) {\n      if (this.templateStr) {\n        writeTask(() => {\n          outputTo.innerHTML = this.tplRenderFn(this.templateStr, {\n            orig: {},\n            dyn: {},\n            selected:\n              this.internalValue && this.internalValue.length\n                ? this.internalValue\n                : this.value,\n          });\n          if (!this.value || !this.value.length) this.handleChangeEvent();\n        });\n      } else if (!this.value || !this.value.length) this.handleChangeEvent();\n      return;\n    }\n\n    // everything is in place - render as normal and set values\n    writeTask(() => {\n      outputTo.innerHTML = this.tplRenderFn(this.templateStr, {\n        orig: { ...this.indexResults.origFilters[this.filterName] },\n        dyn: { ...this.indexResults.dynFilters[this.filterName] },\n        selected:\n          this.internalValue && this.internalValue.length\n            ? this.internalValue\n            : this.value,\n      });\n      this.tplDidRnder();\n      this.setFieldValues();\n\n      if (!this.showFilter) this.showFilter = true;\n      this.nanoTplUpdated.emit(this.el);\n    });\n  }\n\n  // go through form elements and extract their current value\n  private getFieldValues() {\n    const values = [];\n    const fields = this.outputSlot.querySelectorAll(\n      'input[type=\"checkbox\"], input[type=\"radio\"], select'\n    );\n\n    for (let i = 0; i < fields.length; i++) {\n      const field = fields[i] as HTMLInputElement;\n\n      // If a multi-select, get all selections\n      if (field.type === 'select-multiple') {\n        const select: HTMLSelectElement = field as any;\n        for (let n = 0; n < select.options.length; n++) {\n          if (!select.options[n].selected || !select.options[n].value.length)\n            continue;\n          values.push(select.options[n].value);\n        }\n      } else if (\n        (field.type !== 'checkbox' && field.type !== 'radio') ||\n        (field.checked && field.value.length)\n      ) {\n        values.push(field.value);\n      }\n    }\n    return values;\n  }\n\n  // go through form elements and select / check them as appropriate\n  private setFieldValues(vals?: string[]): void | string[] {\n    vals = vals || this.internalValue;\n    if (!vals) return;\n\n    const found = [];\n    const fields = this.outputSlot.querySelectorAll(\n      'input[type=\"checkbox\"], input[type=\"radio\"], select, nano-select, nano-checkbox'\n    );\n\n    for (let i = 0; i < fields.length; i++) {\n      const field = fields[i] as HTMLInputElement;\n\n      if (\n        field.disabled ||\n        field.type === 'file' ||\n        field.type === 'reset' ||\n        field.type === 'submit' ||\n        field.type === 'button'\n      )\n        continue;\n\n      if (field.type === 'select-multiple' || field.type === 'select-one') {\n        const select: HTMLSelectElement = field as any;\n        for (let n = 0; n < select.options.length; n++) {\n          if (!vals.includes(select.options[n].value))\n            select.options[n].selected = false;\n          else {\n            found.push(select.value);\n            select.options[n].selected = true;\n            if (field.type === 'select-one')\n              select.value = select.options[n].value;\n          }\n        }\n      } else if (\n        ['checkbox', 'radio', 'tag', 'segment', 'segment-pill'].includes(\n          field.type\n        )\n      ) {\n        if (vals.includes(field.value)) {\n          found.push(field.value);\n          field.checked = true;\n        } else if (!vals.length && !field.value.length) {\n          field.checked = true;\n        } else field.checked = false;\n      }\n    }\n    return found;\n  }\n\n  private didValueChange(newVal: Array<string>) {\n    if (!!this.internalValue && !newVal) return true;\n    if (!this.internalValue && !newVal) return false;\n    if (this.internalValue && newVal.length !== this.internalValue.length)\n      return true;\n\n    let hasChanged = false;\n    for (let i = 0; i < newVal.length; i++) {\n      if (\n        !hasChanged &&\n        (!this.internalValue || !this.internalValue.includes(newVal[i]))\n      )\n        hasChanged = true;\n    }\n    return hasChanged;\n  }\n\n  connectedCallback() {\n    this.templateSlot = this.el.querySelector('[slot=\"filter-template\"]');\n    this.outputSlot = this.el.querySelector('[slot=\"output\"]');\n    this.filterId = this.filterName + '_' + filterIds++;\n\n    if (!!this.templateSlot) {\n      this.templateStr = this.templateSlot.innerHTML;\n      this.templateStr = this.templateStr.replace(/=&gt;/gm, '=>');\n    }\n  }\n\n  componentWillLoad() {\n    if (this.storeId)\n      ComponentStore.init(\n        this,\n        ['value'],\n        this.storeMethod || this.globalStoreMethod,\n        this.storeId\n      );\n  }\n\n  componentDidLoad() {\n    this.updateContent();\n\n    if (\n      this.templateStr &&\n      this.filterName &&\n      this.indexResults &&\n      this.indexResults.origFilters[this.filterName]\n    )\n      this.showFilter = true;\n  }\n\n  render() {\n    return (\n      <Host\n        class={{\n          'show-filter': this.showFilter,\n        }}\n      >\n        <div ref={(div) => (this.outputEle = div)}>\n          <slot name=\"output\" />\n        </div>\n      </Host>\n    );\n  }\n}\n\nWormhole(AlgoliaFilter as WormholeConsumerConstructor, [\n  'globalStoreMethod',\n  'indexResults',\n  'filterChanged',\n  'facets',\n  'tplRenderFn',\n  'changeEvent',\n]);\nlet filterIds = 0;\n"],"mappings":"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"}
+{"version":3,"names":["algoliaFilterCss","AlgoliaFilter","this","filterId","tplWillRnder","Promise","resolve","tplDidRnder","undefined","valueSet","valStr","value","vals","length","split","didValueChange","foundVals","setFieldValues","internalValue","then","_","valueChanged","nanoFilterChanged","emit","facetName","filterName","operator","appliedFilterChanged","filterChanged","updateContent","tplUpdate","handleFilterChange","indexResults","appliedFilters","foundValue","find","filter","name","values","handleChangeEvent","getFieldValues","outputTo","outputSlot","outputEle","el","templateStr","showFilter","origFilters","writeTask","innerHTML","tplRenderFn","orig","dyn","selected","Object","assign","dynFilters","nanoTplUpdated","fields","querySelectorAll","i","field","type","select","n","options","push","checked","found","disabled","includes","newVal","hasChanged","connectedCallback","templateSlot","querySelector","filterIds","replace","componentWillLoad","storeId","ComponentStore","init","storeMethod","globalStoreMethod","componentDidLoad","render","h","Host","class","ref","div","Wormhole"],"sources":["./src/components/algolia/algolia-filter.scss?tag=nano-algolia-filter&encapsulation=shadow","./src/components/algolia/algolia-filter.tsx"],"sourcesContent":[":host {\n  display: none;\n\n  ::slotted([slot='filter-template']) {\n    display: none !important;\n  }\n}\n\n:host(.show-filter) {\n  display: block;\n}\n","import {\n  Component,\n  h,\n  Element,\n  Host,\n  Prop,\n  Watch,\n  State,\n  EventEmitter,\n  Event,\n  writeTask,\n  Listen,\n} from '@stencil/core';\nimport {\n  ComponentStore,\n  StorageMethods,\n} from '../../utils/store/component-store';\nimport {\n  SearchChangeEvent,\n  Wormhole,\n  WormholeConsumerConstructor,\n} from '../algolia/algolia-data';\nimport type {\n  IndexResult,\n  FilterChangeEventDetail,\n  AlgoliaFacet,\n} from '../../interface';\n\n/**\n * Displays and syncs algolia filters\n * Must be nested within an nano-algolia component.\n * @slot filter-template - Template string (format from nano-algolia 'tplEngine' property).\n * @slot output - A placeholder for template output.\n */\n@Component({\n  tag: 'nano-algolia-filter',\n  shadow: true,\n  styleUrl: 'algolia-filter.scss',\n})\nexport class AlgoliaFilter {\n  @Element() el: HTMLNanoAlgoliaFilterElement;\n\n  private templateStr: string;\n  private templateSlot: HTMLElement;\n  private outputSlot: HTMLElement;\n  private outputEle: HTMLElement;\n  private filterId: string = null;\n  private tplDidRnder;\n  private tplWillRnder = new Promise((resolve) => {\n    this.tplDidRnder = resolve;\n  });\n\n  @State() changeEvent: SearchChangeEvent;\n  @State() internalValue: Array<string> = [undefined];\n  @State() showFilter: boolean = false;\n  @State() indexResults: IndexResult = null;\n  @State() filterChanged: string = null;\n  @State() facets: AlgoliaFacet;\n  @State() tplRenderFn: (...args: any[]) => string;\n  @State() globalStoreMethod: StorageMethods;\n\n  /**\n   * Name of this filter - must match an appropriate algolia facet on a parent nano-algolia index to display\n   */\n  @Prop() filterName: string = null;\n\n  /**\n   * Set values of this filter. Will result in form elements being selected. '|' delimited string or array.\n   */\n  @Prop({ mutable: true }) value: string | Array<string> = '';\n\n  /**\n   * The internal operator joining filter values.\n   */\n  @Prop() operator: 'or' | 'and' = 'or';\n\n  /**\n   * Store search queries (against this ID) to the component store.\n   * Use in conjunction with storeMethod\n   */\n  @Prop() storeId?: string;\n\n  /**\n   * The method of storage.\n   * Either session storage, url hash (after the '#') or url query (after the '?').\n   */\n  @Prop() storeMethod: StorageMethods = 'session';\n\n  /**\n   * Emitted when the filter value changes\n   */\n  @Event() nanoFilterChanged!: EventEmitter<FilterChangeEventDetail>;\n\n  /**\n   * Emitted when templates are updated\n   */\n  @Event() nanoTplUpdated!: EventEmitter<HTMLNanoAlgoliaFilterElement>;\n\n  // Public facing. When changed attempts to 'check' any relevant fields in the template.\n  @Watch('value')\n  valueSet() {\n    const valStr = this.value as string;\n    let vals;\n\n    if (typeof valStr === 'string')\n      vals = valStr.length ? valStr.split('|') : [];\n    else vals = this.value as Array<string>;\n\n    if (this.didValueChange(vals)) {\n      const foundVals = this.setFieldValues(vals);\n      // found in template, set the internal state (this emits the changed event)\n      if (foundVals && foundVals.length) this.internalValue = vals;\n      // not found in template, wait for it to render.\n      else {\n        this.tplWillRnder.then((_) => {\n          this.setFieldValues(vals);\n          this.internalValue = vals;\n        });\n      }\n    }\n  }\n\n  // Value has changed and is reflected in template. Emit event.\n  @Watch('internalValue')\n  valueChanged() {\n    this.value = this.internalValue;\n    this.nanoFilterChanged.emit({\n      filterId: this.filterId,\n      facetName: this.filterName,\n      value: this.internalValue,\n      operator: this.operator,\n    });\n  }\n\n  // New facets from algolia. Update template\n  @Watch('facets')\n  appliedFilterChanged() {\n    if (\n      this.filterName &&\n      this.filterChanged &&\n      (this.filterChanged !== this.filterId || this.operator === 'and')\n    ) {\n      this.updateContent();\n    }\n  }\n\n  @Watch('tplRenderFn')\n  tplUpdate() {\n    this.updateContent();\n  }\n\n  @Watch('indexResults')\n  handleFilterChange() {\n    if (this.indexResults && this.indexResults.appliedFilters) {\n      const foundValue = this.indexResults.appliedFilters.find(\n        (filter) => filter.name === this.filterName\n      );\n      if (!foundValue) return;\n\n      this.tplWillRnder.then((_) => {\n        const foundVals = this.setFieldValues(foundValue.values);\n        if (foundVals && foundVals.length) this.value = foundVals;\n      });\n    }\n    this.updateContent();\n  }\n\n  @Listen('nanoChange')\n  @Listen('change')\n  handleChangeEvent() {\n    const vals = this.getFieldValues();\n    if (this.didValueChange(vals)) {\n      this.internalValue = vals;\n      return true;\n    }\n    return false;\n  }\n\n  private updateContent() {\n    const outputTo = this.outputSlot || this.outputEle;\n    if (!this.el) return;\n\n    // there's no template so show output right away\n    if (!this.templateStr) this.showFilter = true;\n    // there's a template but no index set so hide filters atm\n    else if (\n      !this.filterName ||\n      !outputTo ||\n      (this.templateStr &&\n        (!this.indexResults || !this.indexResults.origFilters[this.filterName]))\n    ) {\n      this.showFilter = false;\n    }\n\n    // there's no output element so nothing else to do\n    if (!outputTo) return;\n\n    // there's no index set atm but get any static filter values so we can apply them\n    if (!this.indexResults) {\n      if (this.templateStr) {\n        writeTask(() => {\n          outputTo.innerHTML = this.tplRenderFn(this.templateStr, {\n            orig: {},\n            dyn: {},\n            selected:\n              this.internalValue && this.internalValue.length\n                ? this.internalValue\n                : this.value,\n          });\n          if (!this.value || !this.value.length) this.handleChangeEvent();\n        });\n      } else if (!this.value || !this.value.length) this.handleChangeEvent();\n      return;\n    }\n\n    // everything is in place - render as normal and set values\n    writeTask(() => {\n      outputTo.innerHTML = this.tplRenderFn(this.templateStr, {\n        orig: { ...this.indexResults.origFilters[this.filterName] },\n        dyn: { ...this.indexResults.dynFilters[this.filterName] },\n        selected:\n          this.internalValue && this.internalValue.length\n            ? this.internalValue\n            : this.value,\n      });\n      this.tplDidRnder();\n      this.setFieldValues();\n\n      if (!this.showFilter) this.showFilter = true;\n      this.nanoTplUpdated.emit(this.el);\n    });\n  }\n\n  // go through form elements and extract their current value\n  private getFieldValues() {\n    const values = [];\n    const fields = this.outputSlot.querySelectorAll(\n      'input[type=\"checkbox\"], input[type=\"radio\"], select'\n    );\n\n    for (let i = 0; i < fields.length; i++) {\n      const field = fields[i] as HTMLInputElement;\n\n      // If a multi-select, get all selections\n      if (field.type === 'select-multiple') {\n        const select: HTMLSelectElement = field as any;\n        for (let n = 0; n < select.options.length; n++) {\n          if (!select.options[n].selected || !select.options[n].value.length)\n            continue;\n          values.push(select.options[n].value);\n        }\n      } else if (\n        (field.type !== 'checkbox' && field.type !== 'radio') ||\n        (field.checked && field.value.length)\n      ) {\n        values.push(field.value);\n      }\n    }\n    return values;\n  }\n\n  // go through form elements and select / check them as appropriate\n  private setFieldValues(vals?: string[]): void | string[] {\n    vals = vals || this.internalValue;\n    if (!vals) return;\n\n    const found = [];\n    const fields = this.outputSlot.querySelectorAll(\n      'input[type=\"checkbox\"], input[type=\"radio\"], select, nano-select, nano-checkbox'\n    );\n\n    for (let i = 0; i < fields.length; i++) {\n      const field = fields[i] as HTMLInputElement;\n\n      if (\n        field.disabled ||\n        field.type === 'file' ||\n        field.type === 'reset' ||\n        field.type === 'submit' ||\n        field.type === 'button'\n      )\n        continue;\n\n      if (field.type === 'select-multiple' || field.type === 'select-one') {\n        const select: HTMLSelectElement = field as any;\n        for (let n = 0; n < select.options.length; n++) {\n          if (!vals.includes(select.options[n].value))\n            select.options[n].selected = false;\n          else {\n            found.push(select.value);\n            select.options[n].selected = true;\n            if (field.type === 'select-one')\n              select.value = select.options[n].value;\n          }\n        }\n      } else if (\n        ['checkbox', 'radio', 'tag', 'segment', 'segment-pill'].includes(\n          field.type\n        )\n      ) {\n        if (vals.includes(field.value)) {\n          found.push(field.value);\n          field.checked = true;\n        } else if (!vals.length && !field.value.length) {\n          field.checked = true;\n        } else field.checked = false;\n      }\n    }\n    return found;\n  }\n\n  private didValueChange(newVal: Array<string>) {\n    if (!!this.internalValue && !newVal) return true;\n    if (!this.internalValue && !newVal) return false;\n    if (this.internalValue && newVal.length !== this.internalValue.length)\n      return true;\n\n    let hasChanged = false;\n    for (let i = 0; i < newVal.length; i++) {\n      if (\n        !hasChanged &&\n        (!this.internalValue || !this.internalValue.includes(newVal[i]))\n      )\n        hasChanged = true;\n    }\n    return hasChanged;\n  }\n\n  connectedCallback() {\n    this.templateSlot = this.el.querySelector('[slot=\"filter-template\"]');\n    this.outputSlot = this.el.querySelector('[slot=\"output\"]');\n    this.filterId = this.filterName + '_' + filterIds++;\n\n    if (!!this.templateSlot) {\n      this.templateStr = this.templateSlot.innerHTML;\n      this.templateStr = this.templateStr.replace(/=&gt;/gm, '=>');\n    }\n  }\n\n  componentWillLoad() {\n    if (this.storeId)\n      ComponentStore.init(\n        this,\n        ['value'],\n        this.storeMethod || this.globalStoreMethod,\n        this.storeId\n      );\n  }\n\n  componentDidLoad() {\n    this.updateContent();\n\n    if (\n      this.templateStr &&\n      this.filterName &&\n      this.indexResults &&\n      this.indexResults.origFilters[this.filterName]\n    )\n      this.showFilter = true;\n  }\n\n  render() {\n    return (\n      <Host\n        class={{\n          'show-filter': this.showFilter,\n        }}\n      >\n        <div ref={(div) => (this.outputEle = div)}>\n          <slot name=\"output\" />\n        </div>\n      </Host>\n    );\n  }\n}\n\nWormhole(AlgoliaFilter as WormholeConsumerConstructor, [\n  'globalStoreMethod',\n  'indexResults',\n  'filterChanged',\n  'facets',\n  'tplRenderFn',\n  'changeEvent',\n]);\nlet filterIds = 0;\n"],"mappings":"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"}

package/dist/nano-components/{p-0697795a.entry.js → p-31c23d6e.entry.js}

@@ -1,5 +1,5 @@
 /*!
  * Web Components for Nanopore digital Web Apps
  */
-import{r as t,c as i,h as s,a as e,g as h}from"./p-f6a8467a.js";import{a as n}from"./p-257432ff.js";import{d as o}from"./p-7bff5224.js";const r=':host{box-sizing:border-box}*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}:host{--stuck-left:initial;--stuck-right:initial;--stuck-z-index:var(--nano-layer-index-menubar, 10);--top-hide:translateY(-110%);--bottom-hide:translateY(110%);display:block;max-inline-size:100%}:host([sticky]){position:sticky;transition:0.3s ease transform;will-change:min-block-size}:host([sticky][stuck]){inset-inline:var(--stuck-left) var(--stuck-right);z-index:var(--stuck-z-index) !important}:host([sticky][hide][placed-top]){transform:var(--top-hide)}:host([sticky][hide][placed-bottom]){transform:var(--bottom-hide)}:host([sticky][index="1"]){z-index:calc(var(--stuck-z-index) + 1)}:host([sticky][index="2"]){z-index:calc(var(--stuck-z-index) + 2)}:host([sticky][index="3"]){z-index:calc(var(--stuck-z-index) + 3)}:host([sticky][index="4"]){z-index:calc(var(--stuck-z-index) + 4)}:host([sticky][index="5"]){z-index:calc(var(--stuck-z-index) + 5)}.sticker{display:inherit;max-inline-size:inherit;inline-size:100%}.sticker:not(.stuck){inline-size:auto !important}.sticker.sticky{transition:0.3s ease all;position:relative}:host([index="1"]) .sticker.sticky{z-index:calc(var(--stuck-z-index) + 1)}:host([index="2"]) .sticker.sticky{z-index:calc(var(--stuck-z-index) + 2)}:host([index="3"]) .sticker.sticky{z-index:calc(var(--stuck-z-index) + 3)}:host([index="4"]) .sticker.sticky{z-index:calc(var(--stuck-z-index) + 4)}:host([index="5"]) .sticker.sticky{z-index:calc(var(--stuck-z-index) + 5)}.sticker.stuck{position:fixed;inset-inline:var(--stuck-left) var(--stuck-right);z-index:var(--stuck-z-index);transform:translateY(0)}:host([placed-top]) .sticker.stuck{inset-block-start:0}:host([placed-bottom]) .sticker.stuck{inset-block-end:0}:host([placed-top]) .sticker.stuck.hide{transform:var(--top-hide)}:host([placed-bottom]) .sticker.stuck.hide{transform:var(--bottom-hide)}.sticker-content{display:flex;flex-wrap:wrap}';function a(t){return t instanceof Document?window.pageYOffset:t.scrollTop}function c(t,i){const s=i instanceof Document?document.documentElement:i;return n(t,s)}const f=class{constructor(s){t(this,s);this.nanoStuck=i(this,"nanoStuck",7);this.nanoUnstuck=i(this,"nanoUnstuck",7);this.nanoHide=i(this,"nanoHide",7);this.nanoShow=i(this,"nanoShow",7);this.isRtl=false;this.scrollPosCache=0;this.scrollPosThresholdCache=0;this.cacheOffset=0;this.pauseResizeWatcher=false;this.listenForScrollParent=false;this.positions=[];this.pauseHide=false;this.hasBootstrapped=false;this.setupParentResizeListener=()=>{if(!window["ResizeObserver"])return;if(this.parentSizeObserver){this.parentSizeObserver.disconnect();this.parentSizeObserver=undefined}this.parentSizeObserver=new ResizeObserver((t=>{for(const i of t){let t,s;if(i.contentRect.height)t=i.contentRect.height;if(i.contentRect.width)s=i.contentRect.width;if(typeof this.quietMode==="object"){if(s<this.quietMode.w||t<this.quietMode.h)this.quietModeIsOn=true;else this.quietModeIsOn=false}if(this.breakPointMin){if(s>this.breakPointMin)this.isSticky=true;else this.isSticky=false}if(this.breakPointMax){if(s<this.breakPointMax)this.isSticky=true;else this.isSticky=false}if(this.isRootSticker&&this.sticker&&this.autoResize)this.sticker.style.width=this.host.scrollWidth+"px"}}));const t=this.scrollParent instanceof Document?this.scrollParent.documentElement:this.scrollParent;if(t)this.parentSizeObserver.observe(t)};this.onStickToDisplayEvent=t=>{if(t.detail.sticker!==this.stickToEle)return;switch(t.type){case"nanoHide":this._offset=0;this.cacheOffset=this.offset;this.offset=0;if(!this.isStuck)this.moveTrigger(false);if(!this.isRootSticker&&this.quietModeIsOn){requestAnimationFrame((()=>{this.stickToEle.style.minHeight=this.stickToEleInitSize.height+(this.host.scrollHeight+(typeof this.cacheOffset==="object"?this.cacheOffset.v:this.cacheOffset))+"px";this.stickToEle.setTriggerPos(this.stickToEleInitSize.height*-1)}))}break;case"nanoShow":this._offset=this.stickToEleInitSize.height;this.offset=this.cacheOffset;this.moveTrigger(true);if(!this.isRootSticker&&this.quietModeIsOn){requestAnimationFrame((()=>{this.stickToEle.style.minHeight="";this.stickToEle.setTriggerPos(0)}))}break;case"nanoStuck":this.stickToEleInitSize=this.stickToEle.getBoundingClientRect();this._offset=this.stickToEleInitSize.height;break}};this.onStickEvent=async t=>{const i=t.detail?t.detail.sticker:null;if(!i||i.position!==this.position)return;const s=await i.getTriggerPos();if(t.type==="nanoStuck"&&i!==this.host&&i.scrollParent===this.host.scrollParent){this.stickerIndex++;if(!this.hideOnNewStickers)return;if(this.positions.includes("top")&&this.triggerPos.top<s.top||this.positions.includes("bottom")&&this.triggerPos.top>s.top){this.multiStickerHide=true;this.stuckCounter++}}if(t.type==="nanoUnstuck"&&i!==this.host&&i.scrollParent===this.host.scrollParent){this.stickerIndex--;if(!this.hideOnNewStickers)return;if(this.positions.includes("top")&&this.triggerPos.top<s.top||this.positions.includes("bottom")&&this.triggerPos.top>s.top){this.stuckCounter--;if(this.stuckCounter<1)this.multiStickerHide=false}}};this.onScroll=()=>{const t=a(this.scrollParent);if(t<this.scrollPosCache){if(!this.positions.includes("bottom"))this.handleScrollTo();else this.handleScrollAway(t)}if(t>this.scrollPosCache){if(!this.positions.includes("bottom"))this.handleScrollAway(t);else this.handleScrollTo()}this.scrollPosCache=t};this.isStuck=false;this.isRootSticker=true;this.hide=false;this.scrollHide=false;this.multiStickerHide=false;this.scrollingTo=false;this.quietModeIsOn=false;this.stuckCounter=0;this.stickerIndex=0;this.stickToEle=undefined;this.triggerPos=undefined;this.trigger=undefined;this._offset=0;this.autoResize=true;this.isSticky=true;this.offset=0;this.position="top";this.quietMode={h:600,w:600};this.hideOnNewStickers=true;this.breakPointMax=null;this.breakPointMin=null;this.scrollParent=undefined;this.stickTo=undefined}async isHiding(){return this.hide}async isSticking(){this.shouldStick();return this.isStuck}async setTriggerPos(t){return this._offset=t}async getTriggerPos(){return this.triggerPos}async pauseHiding(t){return this.pauseHide=t}updateTriggerOffset(){if(!this.trigger||!this.scrollParent||!this.listenForScrollParent)return;this.triggerPos=c(this.trigger,this.scrollParent)}stickerResizeListener(){if(!this.content||!window["ResizeObserver"])return;if(this.contentSizeObserver){this.contentSizeObserver.disconnect();this.contentSizeObserver=undefined}this.contentSizeObserver=new ResizeObserver((t=>{for(const i of t){if(this.pauseResizeWatcher)return;if(i.contentRect.height){if(this.position==="top")this.host.style.height=i.contentRect.height+"px";if(this.position==="bottom")this.host.style.minHeight=i.contentRect.height+"px"}}}));this.contentSizeObserver.observe(this.content)}quietModeChange(){if(this.quietMode==="on")requestAnimationFrame((()=>this.quietModeIsOn=true));else if(this.quietMode==="off")requestAnimationFrame((()=>this.quietModeIsOn=false))}setOffset(){this.trigger.setAttribute("style","");let t,i,s,e;const h=this.isRootSticker||this.stickToEle?this.sticker:this.host;if(!h)return;if(typeof this.offset==="object")({v:t,h:i}=this.offset);else t=i=this.offset;if(typeof this._offset==="object")({v:t=s,h:i=e}=this._offset);else s=e=this._offset;const n=s=>{const e=s.match(/(top|bottom)/)?t:i;o(s);h.style[s]=e+"px";if(e)this.host.style.setProperty("--hide-transform-amount",`(110% + ${e}px)`);else this.host.style.setProperty("--hide-transform-amount",null)};const o=h=>{const n=h.match(/(top|bottom)/)?t+s:i+e;this.trigger.style[h]=n*-1+"px";this.trigger.style.position="relative";this.trigger.style.height="1px"};if(this.positions.includes("start")&&this.isRtl||this.positions.includes("end")&&!this.isRtl)n("right");if(this.positions.includes("end")&&this.isRtl||this.positions.includes("start")&&!this.isRtl)n("left");if(this.positions.includes("top"))n("top");if(this.positions.includes("bottom"))n("bottom")}positionChange(){this.positions=this.position.split("-");this.setOffset()}async stuckChange(){if(this.isStuck){if(this.stickToEle){const t=this.host.children;this.slottedContent=Array.from(t);this.slottedContent.forEach((t=>{this.stickToEle.appendChild(t);t.style.order=this.stickerIndex+""}));this.nanoStuck.emit({sticker:this.stickToEle})}else this.nanoStuck.emit({sticker:this.host})}else{this.scrollHide=false;if(this.stickToEle){this.slottedContent.forEach((t=>{this.host.appendChild(t);t.style.order=""}));this.nanoUnstuck.emit({sticker:this.stickToEle})}else this.nanoUnstuck.emit({sticker:this.host})}}attachScrollListeners(){if(this.quietModeIsOn)this.scrollParent.addEventListener("scroll",this.onScroll,{passive:true,capture:false});else if(this.scrollParent){this.scrollParent.removeEventListener("scroll",this.onScroll);this.moveTrigger(true)}}handleParentEvents(t,i=null){if(!this.listenForScrollParent)return;if(i)this.manageListenersOnParent(false,i);if(this.scrollParent)this.manageListenersOnParent(!this.stickToEle)}stickToEleChange(t,i){if(this.stickToEle){this.stickToEle.addEventListener("nanoHide",this.onStickToDisplayEvent);this.stickToEle.addEventListener("nanoShow",this.onStickToDisplayEvent);this.stickToEle.addEventListener("nanoStuck",this.onStickToDisplayEvent);this.stickToEle.addEventListener("nanoUnstuck",this.onStickToDisplayEvent)}if(i){i.removeEventListener("nanoHide",this.onStickToDisplayEvent);i.removeEventListener("nanoShow",this.onStickToDisplayEvent);i.removeEventListener("nanoStuck",this.onStickToDisplayEvent);i.removeEventListener("nanoUnstuck",this.onStickToDisplayEvent)}}stickToChange(){if(typeof this.stickTo==="string")this.stickToEle=this.scrollParent.querySelector(this.stickTo);else if(!!this.stickTo)this.stickToEle=this.stickTo;else this.stickToEle=undefined}visibilityDecisionHandler(){if(this.multiStickerHide||this.scrollHide)this.hide=true;else this.hide=false}handleHideChange(){if(this.hide)this.nanoHide.emit({sticker:this.host});else this.nanoShow.emit({sticker:this.host})}setupIO(){if(this.io){this.io.disconnect();this.io=undefined}if(!this.scrollParent||!this.hasBootstrapped||!this.trigger)return;this.isRootSticker=this.scrollParent instanceof Document;let t=this.scrollParent;if(this.scrollParent instanceof Document)t=null;this.io=new window.IntersectionObserver((t=>{if(this.pauseResizeWatcher||!this.isSticky)return;this.shouldStick(t.slice(-1)[0])}),{root:t});this.io.observe(this.trigger)}manageListenersOnParent(t,i){const s=i||this.scrollParent;if(!s)return;if(!t){try{if(this.quietModeIsOn)s.removeEventListener("scroll",this.onScroll);s.removeEventListener("nanoStuck",this.onStickEvent);s.removeEventListener("nanoUnstuck",this.onStickEvent)}catch(t){console.error("Events haven`t been added")}}else{s.addEventListener("nanoStuck",this.onStickEvent);s.addEventListener("nanoUnstuck",this.onStickEvent);if(this.quietModeIsOn)this.attachScrollListeners()}this.setupParentResizeListener()}handleScrollTo(){this.scrollPosThresholdCache=null;if(!this.scrollHide)return;if(this.scrollingTo!==true){this._offset=this.cacheOffset||this._offset}this.scrollingTo=true;this.scrollHide=false}handleScrollAway(t){if(this.scrollHide)return;if(!this.isStuck)return;if(this.scrollingTo!==false){this.cacheOffset=this._offset;this._offset=0}this.scrollingTo=false;if(!this.scrollPosThresholdCache)this.scrollPosThresholdCache=t;else if(!this.pauseHide&&Math.abs(t-this.scrollPosThresholdCache)>100)this.scrollHide=true}moveTrigger(t){if(this.positions.includes("bottom")&&!t||!this.positions.includes("bottom")&&t){this.host.parentNode.insertBefore(this.trigger,this.host)}else this.host.parentNode.insertBefore(this.trigger,this.host.nextSibling)}getScrollParent(){const t=/(auto|scroll)/;const i=(t,s)=>{if(t.parentNode===null){return s}return i(t.parentNode,s.concat([t]))};const s=(t,i)=>getComputedStyle(t,null).getPropertyValue(i);const e=t=>s(t,"overflow")+s(t,"overflow-y")+s(t,"overflow-x");const h=i=>t.test(e(i));const n=document.documentElement.getBoundingClientRect().height;const o=t=>{if(!(typeof t==="object"))return;const s=i(t,[]);return s.find((t=>h(t)&&t.getBoundingClientRect().height!==n))||document};return o(this.host)}shouldStick(t){let i;if(this.positions.includes("top")){if(!this.isRootSticker)i=c(this.trigger,this.scrollParent).top;else i=this.trigger.getBoundingClientRect().top;this.isStuck=i<-1}else if(this.positions.includes("bottom")){i=this.trigger.getBoundingClientRect().top;const s=t&&t.rootBounds?t.rootBounds:(this.scrollParent instanceof Document?document.documentElement:this.scrollParent).getBoundingClientRect();this.isStuck=i>s.height+s.top}}bootstrapGurantor(){this.hasBootstrapped=true;this.scrollParent=this.scrollParent||this.getScrollParent();this.isRootSticker=this.scrollParent instanceof Document;this.trigger=this.trigger||document.createElement("div");this.trigger.classList.add("sticker-trigger");this.positionChange();this.moveTrigger(true);this.quietModeChange();this.listenForScrollParent=true;this.handleParentEvents(true);this.stickerIndex=Array.from(this.scrollParent.querySelectorAll("nano-sticker")).filter((t=>t.position===this.position)).findIndex((t=>t===this.host));this.setOffset();this.stickerResizeListener();this.setupParentResizeListener();this.slottedContent=Array.from(this.host.children);this.slottedContent.forEach((t=>{t.style.order=this.stickerIndex+""}));this.updateTriggerOffset();this.stickToChange();this.setupIO();this.onStickToDisplayEvent=o(this.onStickToDisplayEvent,50)}connectedCallback(){this.isRtl=this.host.dir==="rtl"||this.host.ownerDocument.dir==="rtl";document.documentElement.addEventListener("nanoComponentsReady",(()=>{setTimeout((t=>this.bootstrapGurantor()),200)}));setTimeout((t=>{if(!this.hasBootstrapped)this.bootstrapGurantor()}),1e3)}disconnectedCallback(){if(this.io){this.io.disconnect();this.io=undefined}if(this.parentSizeObserver){this.parentSizeObserver.disconnect();this.parentSizeObserver=undefined}this.scrollParent=null;this.hasBootstrapped=false}render(){return s(e,{sticky:!this.isRootSticker&&!this.stickToEle&&this.isSticky,hide:this.hide&&this.isStuck,siblings:this.stuckCounter,index:this.stickerIndex,stuck:this.isStuck&&this.isSticky,"placed-bottom":this.positions.includes("bottom"),"placed-top":this.positions.includes("top"),"placed-end":this.positions.includes("end"),"placed-start":this.positions.includes("start")},s("div",{class:{sticker:true,sticky:this.isRootSticker&&this.isSticky,stuck:this.isStuck&&this.isRootSticker&&this.isSticky,hide:this.isRootSticker&&this.hide&&this.isStuck},ref:t=>this.sticker=t},s("div",{class:"sticker-content",ref:t=>this.content=t},s("slot",null))))}get host(){return h(this)}static get watchers(){return{trigger:["updateTriggerOffset"],scrollParent:["updateTriggerOffset","handleParentEvents","setupIO"],position:["stickerResizeListener","positionChange"],quietMode:["quietModeChange"],offset:["setOffset"],_offset:["setOffset"],isStuck:["stuckChange"],quietModeIsOn:["attachScrollListeners"],stickToEle:["handleParentEvents","stickToEleChange"],stickTo:["stickToChange"],multiStickerHide:["visibilityDecisionHandler"],scrollHide:["visibilityDecisionHandler"],hide:["handleHideChange"]}}};f.style=r;export{f as nano_sticker};
-//# sourceMappingURL=p-0697795a.entry.js.map
+import{r as t,c as i,h as s,a as e,g as h}from"./p-f6a8467a.js";import{a as n}from"./p-257432ff.js";import{d as o}from"./p-7bff5224.js";const r=':host{box-sizing:border-box}*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}:host{--stuck-left:initial;--stuck-right:initial;--stuck-z-index:var(--nano-layer-index-menubar, 10);--top-hide:translateY(-110%);--bottom-hide:translateY(110%);display:block;max-inline-size:100%}:host([sticky]){position:sticky;transition:0.3s ease transform;will-change:min-block-size}:host([sticky][stuck]){inset-inline:var(--stuck-left) var(--stuck-right);z-index:var(--stuck-z-index) !important}:host([sticky][hide][placed-top]){transform:var(--top-hide)}:host([sticky][hide][placed-bottom]){transform:var(--bottom-hide)}:host([sticky][index="1"]){z-index:calc(var(--stuck-z-index) + 1)}:host([sticky][index="2"]){z-index:calc(var(--stuck-z-index) + 2)}:host([sticky][index="3"]){z-index:calc(var(--stuck-z-index) + 3)}:host([sticky][index="4"]){z-index:calc(var(--stuck-z-index) + 4)}:host([sticky][index="5"]){z-index:calc(var(--stuck-z-index) + 5)}.sticker{display:inherit;max-inline-size:inherit;inline-size:100%}.sticker:not(.stuck){inline-size:auto !important}.sticker.sticky{transition:0.3s ease all;position:relative}:host([index="1"]) .sticker.sticky{z-index:calc(var(--stuck-z-index) + 1)}:host([index="2"]) .sticker.sticky{z-index:calc(var(--stuck-z-index) + 2)}:host([index="3"]) .sticker.sticky{z-index:calc(var(--stuck-z-index) + 3)}:host([index="4"]) .sticker.sticky{z-index:calc(var(--stuck-z-index) + 4)}:host([index="5"]) .sticker.sticky{z-index:calc(var(--stuck-z-index) + 5)}.sticker.stuck{position:fixed;inset-inline:var(--stuck-left) var(--stuck-right);z-index:var(--stuck-z-index);transform:translateY(0)}:host([placed-top]) .sticker.stuck{inset-block-start:0}:host([placed-bottom]) .sticker.stuck{inset-block-end:0}:host([placed-top]) .sticker.stuck.hide{transform:var(--top-hide)}:host([placed-bottom]) .sticker.stuck.hide{transform:var(--bottom-hide)}.sticker-content{display:flex;flex-wrap:wrap}';function a(t){return t instanceof Document?window.pageYOffset:t.scrollTop}function c(t,i){const s=i instanceof Document?document.documentElement:i;return n(t,s)}const f=class{constructor(s){t(this,s);this.nanoStuck=i(this,"nanoStuck",7);this.nanoUnstuck=i(this,"nanoUnstuck",7);this.nanoHide=i(this,"nanoHide",7);this.nanoShow=i(this,"nanoShow",7);this.isRtl=false;this.scrollPosCache=0;this.scrollPosThresholdCache=0;this.cacheOffset=0;this.pauseResizeWatcher=false;this.listenForScrollParent=false;this.positions=[];this.pauseHide=false;this.hasBootstrapped=false;this.setupParentResizeListener=()=>{if(!window["ResizeObserver"])return;if(this.parentSizeObserver){this.parentSizeObserver.disconnect();this.parentSizeObserver=undefined}this.parentSizeObserver=new ResizeObserver((t=>{for(const i of t){let t,s;if(i.contentRect.height)t=i.contentRect.height;if(i.contentRect.width)s=i.contentRect.width;if(typeof this.quietMode==="object"){if(s<this.quietMode.w||t<this.quietMode.h)this.quietModeIsOn=true;else this.quietModeIsOn=false}if(this.breakPointMin){if(s>this.breakPointMin)this.isSticky=true;else this.isSticky=false}if(this.breakPointMax){if(s<this.breakPointMax)this.isSticky=true;else this.isSticky=false}if(this.isRootSticker&&this.sticker&&this.autoResize)this.sticker.style.width=this.host.scrollWidth+"px"}}));const t=this.scrollParent instanceof Document?this.scrollParent.documentElement:this.scrollParent;if(t)this.parentSizeObserver.observe(t)};this.onStickToDisplayEvent=t=>{if(t.detail.sticker!==this.stickToEle)return;switch(t.type){case"nanoHide":this._offset=0;this.cacheOffset=this.offset;this.offset=0;if(!this.isStuck)this.moveTrigger(false);if(!this.isRootSticker&&this.quietModeIsOn){requestAnimationFrame((()=>{this.stickToEle.style.minHeight=this.stickToEleInitSize.height+(this.host.scrollHeight+(typeof this.cacheOffset==="object"?this.cacheOffset.v:this.cacheOffset))+"px";this.stickToEle.setTriggerPos(this.stickToEleInitSize.height*-1)}))}break;case"nanoShow":this._offset=this.stickToEleInitSize.height;this.offset=this.cacheOffset;this.moveTrigger(true);if(!this.isRootSticker&&this.quietModeIsOn){requestAnimationFrame((()=>{this.stickToEle.style.minHeight="";this.stickToEle.setTriggerPos(0)}))}break;case"nanoStuck":this.stickToEleInitSize=this.stickToEle.getBoundingClientRect();this._offset=this.stickToEleInitSize.height;break}};this.onStickEvent=async t=>{const i=t.detail?t.detail.sticker:null;if(!i||i.position!==this.position)return;const s=await i.getTriggerPos();if(t.type==="nanoStuck"&&i!==this.host&&i.scrollParent===this.host.scrollParent){this.stickerIndex++;if(!this.hideOnNewStickers)return;if(this.positions.includes("top")&&this.triggerPos.top<s.top||this.positions.includes("bottom")&&this.triggerPos.top>s.top){this.multiStickerHide=true;this.stuckCounter++}}if(t.type==="nanoUnstuck"&&i!==this.host&&i.scrollParent===this.host.scrollParent){this.stickerIndex--;if(!this.hideOnNewStickers)return;if(this.positions.includes("top")&&this.triggerPos.top<s.top||this.positions.includes("bottom")&&this.triggerPos.top>s.top){this.stuckCounter--;if(this.stuckCounter<1)this.multiStickerHide=false}}};this.onScroll=()=>{const t=a(this.scrollParent);if(t<this.scrollPosCache){if(!this.positions.includes("bottom"))this.handleScrollTo();else this.handleScrollAway(t)}if(t>this.scrollPosCache){if(!this.positions.includes("bottom"))this.handleScrollAway(t);else this.handleScrollTo()}this.scrollPosCache=t};this.isStuck=false;this.isRootSticker=true;this.hide=false;this.scrollHide=false;this.multiStickerHide=false;this.scrollingTo=false;this.quietModeIsOn=false;this.stuckCounter=0;this.stickerIndex=0;this.stickToEle=undefined;this.triggerPos=undefined;this.trigger=undefined;this._offset=0;this.autoResize=true;this.isSticky=true;this.offset=0;this.position="top";this.quietMode={h:600,w:600};this.hideOnNewStickers=true;this.breakPointMax=null;this.breakPointMin=null;this.scrollParent=undefined;this.stickTo=undefined}async isHiding(){return this.hide}async isSticking(){this.shouldStick();return this.isStuck}async setTriggerPos(t){return this._offset=t}async getTriggerPos(){return this.triggerPos}async pauseHiding(t){return this.pauseHide=t}updateTriggerOffset(){if(!this.trigger||!this.scrollParent||!this.listenForScrollParent)return;this.triggerPos=c(this.trigger,this.scrollParent)}stickerResizeListener(){if(!this.content||!window["ResizeObserver"])return;if(this.contentSizeObserver){this.contentSizeObserver.disconnect();this.contentSizeObserver=undefined}this.contentSizeObserver=new ResizeObserver((t=>{for(const i of t){if(this.pauseResizeWatcher)return;if(i.contentRect.height){if(this.position==="top")this.host.style.height=i.contentRect.height+"px";if(this.position==="bottom")this.host.style.minHeight=i.contentRect.height+"px"}}}));this.contentSizeObserver.observe(this.content)}quietModeChange(){if(this.quietMode==="on")requestAnimationFrame((()=>this.quietModeIsOn=true));else if(this.quietMode==="off")requestAnimationFrame((()=>this.quietModeIsOn=false))}setOffset(){this.trigger.setAttribute("style","");let t,i,s,e;const h=this.isRootSticker||this.stickToEle?this.sticker:this.host;if(!h)return;if(typeof this.offset==="object")({v:t,h:i}=this.offset);else t=i=this.offset;if(typeof this._offset==="object")({v:t=s,h:i=e}=this._offset);else s=e=this._offset;const n=s=>{const e=s.match(/(top|bottom)/)?t:i;o(s);h.style[s]=e+"px";if(e)this.host.style.setProperty("--hide-transform-amount",`(110% + ${e}px)`);else this.host.style.setProperty("--hide-transform-amount",null)};const o=h=>{const n=h.match(/(top|bottom)/)?t+s:i+e;this.trigger.style[h]=n*-1+"px";this.trigger.style.position="relative";this.trigger.style.minHeight="1px";this.trigger.style.maxHeight="1px";this.trigger.style.overflow="hidden"};if(this.positions.includes("start")&&this.isRtl||this.positions.includes("end")&&!this.isRtl)n("right");if(this.positions.includes("end")&&this.isRtl||this.positions.includes("start")&&!this.isRtl)n("left");if(this.positions.includes("top"))n("top");if(this.positions.includes("bottom"))n("bottom")}positionChange(){this.positions=this.position.split("-");this.setOffset()}async stuckChange(){if(this.isStuck){if(this.stickToEle){const t=this.host.children;this.slottedContent=Array.from(t);this.slottedContent.forEach((t=>{this.stickToEle.appendChild(t);t.style.order=this.stickerIndex+""}));this.nanoStuck.emit({sticker:this.stickToEle})}else this.nanoStuck.emit({sticker:this.host})}else{this.scrollHide=false;if(this.stickToEle){this.slottedContent.forEach((t=>{this.host.appendChild(t);t.style.order=""}));this.nanoUnstuck.emit({sticker:this.stickToEle})}else this.nanoUnstuck.emit({sticker:this.host})}}attachScrollListeners(){if(this.quietModeIsOn)this.scrollParent.addEventListener("scroll",this.onScroll,{passive:true,capture:false});else if(this.scrollParent){this.scrollParent.removeEventListener("scroll",this.onScroll);this.moveTrigger(true)}}handleParentEvents(t,i=null){if(!this.listenForScrollParent)return;if(i)this.manageListenersOnParent(false,i);if(this.scrollParent)this.manageListenersOnParent(!this.stickToEle)}stickToEleChange(t,i){if(this.stickToEle){this.stickToEle.addEventListener("nanoHide",this.onStickToDisplayEvent);this.stickToEle.addEventListener("nanoShow",this.onStickToDisplayEvent);this.stickToEle.addEventListener("nanoStuck",this.onStickToDisplayEvent);this.stickToEle.addEventListener("nanoUnstuck",this.onStickToDisplayEvent)}if(i){i.removeEventListener("nanoHide",this.onStickToDisplayEvent);i.removeEventListener("nanoShow",this.onStickToDisplayEvent);i.removeEventListener("nanoStuck",this.onStickToDisplayEvent);i.removeEventListener("nanoUnstuck",this.onStickToDisplayEvent)}}stickToChange(){if(typeof this.stickTo==="string")this.stickToEle=this.scrollParent.querySelector(this.stickTo);else if(!!this.stickTo)this.stickToEle=this.stickTo;else this.stickToEle=undefined}visibilityDecisionHandler(){if(this.multiStickerHide||this.scrollHide)this.hide=true;else this.hide=false}handleHideChange(){if(this.hide)this.nanoHide.emit({sticker:this.host});else this.nanoShow.emit({sticker:this.host})}setupIO(){if(this.io){this.io.disconnect();this.io=undefined}if(!this.scrollParent||!this.hasBootstrapped||!this.trigger)return;this.isRootSticker=this.scrollParent instanceof Document;let t=this.scrollParent;if(this.scrollParent instanceof Document)t=null;this.io=new window.IntersectionObserver((t=>{if(this.pauseResizeWatcher||!this.isSticky)return;this.shouldStick(t.slice(-1)[0])}),{root:t});this.io.observe(this.trigger)}manageListenersOnParent(t,i){const s=i||this.scrollParent;if(!s)return;if(!t){try{if(this.quietModeIsOn)s.removeEventListener("scroll",this.onScroll);s.removeEventListener("nanoStuck",this.onStickEvent);s.removeEventListener("nanoUnstuck",this.onStickEvent)}catch(t){console.error("Events haven`t been added")}}else{s.addEventListener("nanoStuck",this.onStickEvent);s.addEventListener("nanoUnstuck",this.onStickEvent);if(this.quietModeIsOn)this.attachScrollListeners()}this.setupParentResizeListener()}handleScrollTo(){this.scrollPosThresholdCache=null;if(!this.scrollHide)return;if(this.scrollingTo!==true){this._offset=this.cacheOffset||this._offset}this.scrollingTo=true;this.scrollHide=false}handleScrollAway(t){if(this.scrollHide)return;if(!this.isStuck)return;if(this.scrollingTo!==false){this.cacheOffset=this._offset;this._offset=0}this.scrollingTo=false;if(!this.scrollPosThresholdCache)this.scrollPosThresholdCache=t;else if(!this.pauseHide&&Math.abs(t-this.scrollPosThresholdCache)>100)this.scrollHide=true}moveTrigger(t){if(this.positions.includes("bottom")&&!t||!this.positions.includes("bottom")&&t){this.host.parentNode.insertBefore(this.trigger,this.host)}else this.host.parentNode.insertBefore(this.trigger,this.host.nextSibling)}getScrollParent(){const t=/(auto|scroll)/;const i=(t,s)=>{if(t.parentNode===null){return s}return i(t.parentNode,s.concat([t]))};const s=(t,i)=>getComputedStyle(t,null).getPropertyValue(i);const e=t=>s(t,"overflow")+s(t,"overflow-y")+s(t,"overflow-x");const h=i=>t.test(e(i));const n=document.documentElement.getBoundingClientRect().height;const o=t=>{if(!(typeof t==="object"))return;const s=i(t,[]);return s.find((t=>h(t)&&t.getBoundingClientRect().height!==n))||document};return o(this.host)}shouldStick(t){let i;if(this.positions.includes("top")){if(!this.isRootSticker){i=c(this.trigger,this.scrollParent).top}else{i=this.trigger.getBoundingClientRect().top}this.isStuck=i<-1}else if(this.positions.includes("bottom")){i=this.trigger.getBoundingClientRect().top;const s=t&&t.rootBounds?t.rootBounds:(this.scrollParent instanceof Document?document.documentElement:this.scrollParent).getBoundingClientRect();this.isStuck=!t.isIntersecting||i>s.height+s.top}}bootstrapGurantor(){this.hasBootstrapped=true;this.scrollParent=this.scrollParent||this.getScrollParent();this.isRootSticker=this.scrollParent instanceof Document;this.trigger=this.trigger||document.createElement("div");this.trigger.innerHTML="&nbsp;";this.trigger.classList.add("sticker-trigger");this.positionChange();this.moveTrigger(true);this.quietModeChange();this.listenForScrollParent=true;this.handleParentEvents(true);this.stickerIndex=Array.from(this.scrollParent.querySelectorAll("nano-sticker")).filter((t=>t.position===this.position)).findIndex((t=>t===this.host));this.setOffset();this.stickerResizeListener();this.setupParentResizeListener();this.slottedContent=Array.from(this.host.children);this.slottedContent.forEach((t=>{t.style.order=this.stickerIndex+""}));this.updateTriggerOffset();this.stickToChange();this.setupIO();this.onStickToDisplayEvent=o(this.onStickToDisplayEvent,50)}connectedCallback(){this.isRtl=this.host.dir==="rtl"||this.host.ownerDocument.dir==="rtl";document.documentElement.addEventListener("nanoComponentsReady",(()=>{setTimeout((t=>this.bootstrapGurantor()),200)}));setTimeout((t=>{if(!this.hasBootstrapped)this.bootstrapGurantor()}),1e3)}disconnectedCallback(){if(this.io){this.io.disconnect();this.io=undefined}if(this.parentSizeObserver){this.parentSizeObserver.disconnect();this.parentSizeObserver=undefined}this.scrollParent=null;this.hasBootstrapped=false}render(){return s(e,{sticky:!this.isRootSticker&&!this.stickToEle&&this.isSticky,hide:this.hide&&this.isStuck,siblings:this.stuckCounter,index:this.stickerIndex,stuck:this.isStuck&&this.isSticky,"placed-bottom":this.positions.includes("bottom"),"placed-top":this.positions.includes("top"),"placed-end":this.positions.includes("end"),"placed-start":this.positions.includes("start")},s("div",{class:{sticker:true,sticky:this.isRootSticker&&this.isSticky,stuck:this.isStuck&&this.isRootSticker&&this.isSticky,hide:this.isRootSticker&&this.hide&&this.isStuck},ref:t=>this.sticker=t},s("div",{class:"sticker-content",ref:t=>this.content=t},s("slot",null))))}get host(){return h(this)}static get watchers(){return{trigger:["updateTriggerOffset"],scrollParent:["updateTriggerOffset","handleParentEvents","setupIO"],position:["stickerResizeListener","positionChange"],quietMode:["quietModeChange"],offset:["setOffset"],_offset:["setOffset"],isStuck:["stuckChange"],quietModeIsOn:["attachScrollListeners"],stickToEle:["handleParentEvents","stickToEleChange"],stickTo:["stickToChange"],multiStickerHide:["visibilityDecisionHandler"],scrollHide:["visibilityDecisionHandler"],hide:["handleHideChange"]}}};f.style=r;export{f as nano_sticker};
+//# sourceMappingURL=p-31c23d6e.entry.js.map

package/dist/nano-components/p-31c23d6e.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["stickerCss","_getScrollTop","ele","Document","window","pageYOffset","scrollTop","_getOffset","parent","parentEle","document","documentElement","getOffset","Sticker","this","isRtl","scrollPosCache","scrollPosThresholdCache","cacheOffset","pauseResizeWatcher","listenForScrollParent","positions","pauseHide","hasBootstrapped","setupParentResizeListener","parentSizeObserver","disconnect","undefined","ResizeObserver","entries","entry","height","width","contentRect","quietMode","w","h","quietModeIsOn","breakPointMin","isSticky","breakPointMax","isRootSticker","sticker","autoResize","style","host","scrollWidth","toWatch","scrollParent","observe","onStickToDisplayEvent","e","detail","stickToEle","type","_offset","offset","isStuck","moveTrigger","requestAnimationFrame","minHeight","stickToEleInitSize","scrollHeight","v","setTriggerPos","getBoundingClientRect","onStickEvent","async","position","incomingTriggerPos","getTriggerPos","stickerIndex","hideOnNewStickers","includes","triggerPos","top","multiStickerHide","stuckCounter","onScroll","y","handleScrollTo","handleScrollAway","hide","shouldStick","pause","updateTriggerOffset","trigger","stickerResizeListener","content","contentSizeObserver","quietModeChange","setOffset","setAttribute","_v","_h","setPos","pos","u","match","setTriggetPos","setProperty","maxHeight","overflow","positionChange","split","children","slottedContent","Array","from","forEach","child","appendChild","order","nanoStuck","emit","scrollHide","nanoUnstuck","attachScrollListeners","addEventListener","passive","capture","removeEventListener","handleParentEvents","_","oldParent","manageListenersOnParent","stickToEleChange","oldEle","stickToChange","stickTo","querySelector","visibilityDecisionHandler","handleHideChange","nanoHide","nanoShow","setupIO","io","root","IntersectionObserver","slice","addEvents","console","error","scrollingTo","currScroll","Math","abs","toInitial","parentNode","insertBefore","nextSibling","getScrollParent","regex","parents","_node","ps","concat","prop","getComputedStyle","getPropertyValue","scroll","test","docHeight","find","data","scrollAmt","parentBounding","rootBounds","isIntersecting","bootstrapGurantor","createElement","innerHTML","classList","add","querySelectorAll","filter","findIndex","debounce","connectedCallback","dir","ownerDocument","setTimeout","disconnectedCallback","render","Host","sticky","siblings","index","stuck","class","ref","div"],"sources":["./src/components/sticker/sticker.scss?tag=nano-sticker&encapsulation=shadow","./src/components/sticker/sticker.tsx"],"sourcesContent":["@import '../../global/style/nano-theme/layers';\n\n:host {\n  /**\n  * @prop --stuck-left: The left position when your sticker is stuck. This can be useful to force your sticker to fill the viewport for example. Defaults to initial\n  * @prop --stuck-right: The right position when your sticker is stuck. This can be useful to force your sticker to fill the viewport for example. Defaults to initial\n  * @prop --stuck-z-index: The z-index order to display your sticker. Can be useful when displaying multiple stickers simultaneously. Defaults to #{$layer-index-menubar};\n  * @prop --top-hide: This is used for the hide transform animation (e.g. when quiet-mode is on). Defaults to translateY(-110%);\n  * @prop --bottom-hide: This is used for the hide transform animation (e.g. when quiet-mode is on). Defaults to translateY(110%);\n  */\n\n  --stuck-left: initial;\n  --stuck-right: initial;\n  --stuck-z-index: #{$layer-index-menubar};\n  --top-hide: translateY(-110%);\n  --bottom-hide: translateY(110%);\n\n  display: block;\n  max-inline-size: 100%;\n}\n\n:host([sticky]) {\n  position: sticky;\n  transition: 0.3s ease transform;\n  will-change: min-block-size;\n}\n\n:host([sticky][stuck]) {\n  inset-inline: var(--stuck-left) var(--stuck-right);\n  z-index: var(--stuck-z-index) !important;\n}\n\n:host([sticky][hide][placed-top]) {\n  transform: var(--top-hide);\n}\n\n:host([sticky][hide][placed-bottom]) {\n  transform: var(--bottom-hide);\n}\n\n:host([sticky][index='1']) {\n  z-index: calc(var(--stuck-z-index) + 1);\n}\n\n:host([sticky][index='2']) {\n  z-index: calc(var(--stuck-z-index) + 2);\n}\n\n:host([sticky][index='3']) {\n  z-index: calc(var(--stuck-z-index) + 3);\n}\n\n:host([sticky][index='4']) {\n  z-index: calc(var(--stuck-z-index) + 4);\n}\n\n:host([sticky][index='5']) {\n  z-index: calc(var(--stuck-z-index) + 5);\n}\n\n.sticker {\n  display: inherit;\n  max-inline-size: inherit;\n  inline-size: 100%;\n\n  &:not(.stuck) {\n    inline-size: auto !important;\n  }\n\n  &.sticky {\n    transition: 0.3s ease all;\n    position: relative;\n\n    :host([index='1']) & {\n      z-index: calc(var(--stuck-z-index) + 1);\n    }\n\n    :host([index='2']) & {\n      z-index: calc(var(--stuck-z-index) + 2);\n    }\n\n    :host([index='3']) & {\n      z-index: calc(var(--stuck-z-index) + 3);\n    }\n\n    :host([index='4']) & {\n      z-index: calc(var(--stuck-z-index) + 4);\n    }\n\n    :host([index='5']) & {\n      z-index: calc(var(--stuck-z-index) + 5);\n    }\n  }\n\n  &.stuck {\n    position: fixed;\n    inset-inline: var(--stuck-left) var(--stuck-right);\n    z-index: var(--stuck-z-index);\n    transform: translateY(0);\n\n    :host([placed-top]) & {\n      inset-block-start: 0;\n    }\n\n    :host([placed-bottom]) & {\n      inset-block-end: 0;\n    }\n\n    &.hide {\n      :host([placed-top]) & {\n        transform: var(--top-hide);\n      }\n\n      :host([placed-bottom]) & {\n        transform: var(--bottom-hide);\n      }\n    }\n  }\n}\n\n.sticker-content {\n  display: flex;\n  flex-wrap: wrap;\n}\n","import {\n  Component,\n  ComponentInterface,\n  h,\n  Host,\n  Prop,\n  State,\n  Watch,\n  Element,\n  Event,\n  EventEmitter,\n  Method,\n} from '@stencil/core';\nimport { getOffset } from '../../utils/dom';\nimport { debounce } from '../../utils/throttle';\n\nfunction _getScrollTop(ele: HTMLElement | Document) {\n  return ele instanceof Document ? window.pageYOffset : ele.scrollTop;\n}\n\nfunction _getOffset(ele: HTMLElement, parent: HTMLElement | Document) {\n  const parentEle =\n    parent instanceof Document ? document.documentElement : parent;\n  return getOffset(ele, parentEle);\n}\n\ntype Positions = 'top' | 'bottom' | 'start' | 'end';\n\n/**\n * The Sticker component is a toolbox for 'sticking' items to scrolling containers.\n *\n */\n@Component({\n  tag: 'nano-sticker',\n  styleUrl: 'sticker.scss',\n  shadow: true,\n})\nexport class Sticker implements ComponentInterface {\n  private isRtl: boolean = false;\n  private io: IntersectionObserver;\n  private contentSizeObserver: ResizeObserver;\n  private parentSizeObserver: ResizeObserver;\n  private sticker: HTMLDivElement;\n  private content: HTMLDivElement;\n  private scrollPosCache = 0;\n  private scrollPosThresholdCache = 0;\n  private cacheOffset: number | { v: number; h: number } = 0;\n  private slottedContent: Element[];\n  private pauseResizeWatcher = false;\n  private listenForScrollParent = false;\n  private stickToEleInitSize?: DOMRect;\n  private positions: Positions[] = [];\n  private pauseHide: boolean = false;\n  private hasBootstrapped = false;\n\n  @Element() host: HTMLNanoStickerElement;\n\n  // Internal State\n\n  @State() isStuck = false;\n  @State() isRootSticker = true;\n  @State() hide = false;\n  @State() scrollHide = false;\n  @State() multiStickerHide = false;\n  @State() scrollingTo = false;\n  @State() quietModeIsOn = false;\n  @State() stuckCounter = 0;\n  @State() stickerIndex = 0;\n  @State() stickToEle?: HTMLNanoStickerElement;\n  @State() triggerPos: { top: number; left: number };\n  @State() trigger: HTMLDivElement;\n  @State() _offset: number | { v: number; h: number } = 0;\n\n  // Public API\n\n  /** Only applicable to root stickers. When applied the sticker will grow or shrink to the scrollParent size */\n  @Prop() autoResize = true;\n\n  /** Manually enable / disabled sticky behaviour */\n  @Prop({ mutable: true }) isSticky = true;\n\n  /** Distance the item should be stuck from the sticky edge. */\n  @Prop({ mutable: true }) offset: number | { v: number; h: number } = 0;\n\n  /** The edge of the scroll-parent to stick to */\n  @Prop() position: 'top' | 'bottom' = 'top';\n  // other opts I'd like one day. 'start' | 'end' | 'top-start' | 'top-end' | 'bottom-start' | 'bottom-end'\n\n  /** When applied, the sticker will hide when the scroll-parent\n   * is scrolling away from the sticker's stuck position and show when scrolling toward it.\n   * By default this will apply when the parent is below either the h or w dimensions */\n  @Prop() quietMode: 'on' | 'off' | { h: number; w: number } = {\n    h: 600,\n    w: 600,\n  };\n\n  /** When applied stickers will hide upon new stickers being stuck to the same position */\n  @Prop() hideOnNewStickers = true;\n\n  /** The max width of the item to implement sticky behaviour. */\n  @Prop() breakPointMax: null | number = null;\n\n  /** The min width of the item to implement sticky behaviour. */\n  @Prop() breakPointMin: null | number = null;\n\n  /** Define which scroll element to listen & stick to.\n   * By default, it will find traverse the DOM to find the closest. */\n  @Prop({ mutable: true }) scrollParent?: HTMLElement | Document;\n\n  /** Upon being stuck, attach the sticker to another sticker element.\n   * JS query selector string or DOM element pointing to a `<nano-sticker>`  */\n  @Prop() stickTo: string | HTMLNanoStickerElement;\n\n  // Broadcasted Events\n\n  /** Emitted when a sticker is stuck */\n  @Event() nanoStuck!: EventEmitter<{ sticker: HTMLNanoStickerElement }>;\n\n  /** Emitted when a sticker is unstuck */\n  @Event() nanoUnstuck!: EventEmitter<{ sticker: HTMLNanoStickerElement }>;\n\n  /** Emitted when a sticker is hidden */\n  @Event() nanoHide!: EventEmitter<{ sticker: HTMLNanoStickerElement }>;\n\n  /** Emitted when a sticker is showing */\n  @Event() nanoShow!: EventEmitter<{ sticker: HTMLNanoStickerElement }>;\n\n  // Public methods\n\n  /**\n   * Method to return the visibility status of the sticker\n   * @returns boolean\n   */\n  @Method()\n  async isHiding() {\n    return this.hide;\n  }\n\n  /**\n   * Method to return the stuck status of the sticker\n   * @returns boolean\n   */\n  @Method()\n  async isSticking() {\n    this.shouldStick();\n    return this.isStuck;\n  }\n\n  /** @internal */\n  @Method()\n  async setTriggerPos(offset: number | { v: number; h: number }) {\n    return (this._offset = offset);\n  }\n\n  /** @internal */\n  @Method()\n  async getTriggerPos() {\n    return this.triggerPos;\n  }\n\n  /** @internal */\n  @Method()\n  async pauseHiding(pause: boolean) {\n    return (this.pauseHide = pause);\n  }\n\n  // Watchers\n\n  /** Keep a note of trigger position. Need this to track sticker order in the DOM */\n  @Watch('trigger')\n  @Watch('scrollParent')\n  updateTriggerOffset() {\n    if (!this.trigger || !this.scrollParent || !this.listenForScrollParent)\n      return;\n    this.triggerPos = _getOffset(this.trigger, this.scrollParent);\n  }\n\n  /** A root sticker is a fixed element Or this sticker is sticking to another.\n   * We need a content resize watcher to make sure we maintain a correct placeholder size in the body */\n  @Watch('position')\n  stickerResizeListener() {\n    if (!this.content || !window['ResizeObserver']) return;\n\n    if (this.contentSizeObserver) {\n      this.contentSizeObserver.disconnect();\n      this.contentSizeObserver = undefined;\n    }\n\n    this.contentSizeObserver = new ResizeObserver((entries) => {\n      for (const entry of entries) {\n        if (this.pauseResizeWatcher) return;\n\n        if (entry.contentRect.height) {\n          if (this.position === 'top')\n            this.host.style.height = entry.contentRect.height + 'px';\n          if (this.position === 'bottom')\n            this.host.style.minHeight = entry.contentRect.height + 'px';\n        }\n      }\n    });\n    this.contentSizeObserver.observe(this.content);\n  }\n\n  @Watch('quietMode')\n  quietModeChange() {\n    if (this.quietMode === 'on')\n      requestAnimationFrame(() => (this.quietModeIsOn = true));\n    else if (this.quietMode === 'off')\n      requestAnimationFrame(() => (this.quietModeIsOn = false));\n  }\n\n  /** offset is part of the public API but we also use it to manipulate trigger points */\n  @Watch('offset')\n  @Watch('_offset')\n  setOffset() {\n    this.trigger.setAttribute('style', '');\n    let v: number, h: number, _v: number, _h: number;\n    const sticker: HTMLElement =\n      this.isRootSticker || this.stickToEle ? this.sticker : this.host;\n\n    if (!sticker) return;\n\n    if (typeof this.offset === 'object') ({ v, h } = this.offset);\n    else v = h = this.offset;\n\n    if (typeof this._offset === 'object') ({ v = _v, h = _h } = this._offset);\n    else _v = _h = this._offset;\n\n    const setPos = (pos: 'top' | 'bottom' | 'left' | 'right') => {\n      const u = pos.match(/(top|bottom)/) ? v : h;\n      setTriggetPos(pos);\n      sticker.style[pos] = u + 'px';\n      if (u)\n        this.host.style.setProperty(\n          '--hide-transform-amount',\n          `(110% + ${u}px)`\n        );\n      else this.host.style.setProperty('--hide-transform-amount', null);\n    };\n\n    const setTriggetPos = (pos: 'top' | 'bottom' | 'left' | 'right') => {\n      const u = pos.match(/(top|bottom)/) ? v + _v : h + _h;\n      this.trigger.style[pos] = u * -1 + 'px';\n      this.trigger.style.position = 'relative';\n      this.trigger.style.minHeight = '1px';\n      this.trigger.style.maxHeight = '1px';\n      this.trigger.style.overflow = 'hidden';\n    };\n\n    if (\n      (this.positions.includes('start') && this.isRtl) ||\n      (this.positions.includes('end') && !this.isRtl)\n    )\n      setPos('right');\n\n    if (\n      (this.positions.includes('end') && this.isRtl) ||\n      (this.positions.includes('start') && !this.isRtl)\n    )\n      setPos('left');\n\n    if (this.positions.includes('top')) setPos('top');\n    if (this.positions.includes('bottom')) setPos('bottom');\n  }\n\n  @Watch('position')\n  positionChange() {\n    this.positions = this.position.split('-') as Positions[];\n    this.setOffset();\n  }\n\n  /** If this sticker is attached to a 'master' sticker (stickToEle),\n   * here we move the content of this sticker in and out accordingly */\n  @Watch('isStuck')\n  async stuckChange() {\n    if (this.isStuck) {\n      if (this.stickToEle) {\n        const content = this.host.children;\n        this.slottedContent = Array.from(content);\n\n        this.slottedContent.forEach((child: HTMLElement) => {\n          this.stickToEle.appendChild(child);\n          child.style.order = this.stickerIndex + '';\n        });\n\n        this.nanoStuck.emit({ sticker: this.stickToEle });\n      } else this.nanoStuck.emit({ sticker: this.host });\n    } else {\n      this.scrollHide = false;\n\n      if (this.stickToEle) {\n        this.slottedContent.forEach((child: HTMLElement) => {\n          this.host.appendChild(child);\n          child.style.order = '';\n        });\n        this.nanoUnstuck.emit({ sticker: this.stickToEle });\n      } else this.nanoUnstuck.emit({ sticker: this.host });\n    }\n  }\n\n  /** attach scroll listener. 'hides' stickers when scrolling away from trigger and 'shows' when scrolling toward */\n  @Watch('quietModeIsOn')\n  attachScrollListeners() {\n    if (this.quietModeIsOn)\n      this.scrollParent.addEventListener('scroll', this.onScroll, {\n        passive: true,\n        capture: false,\n      });\n    else if (this.scrollParent) {\n      this.scrollParent.removeEventListener('scroll', this.onScroll);\n      this.moveTrigger(true);\n    }\n  }\n\n  /** Add / remove parent scrolling listeners. If there's stickToEle we need to remove them */\n  @Watch('scrollParent')\n  @Watch('stickToEle')\n  handleParentEvents(_, oldParent: null | HTMLElement = null) {\n    if (!this.listenForScrollParent) return;\n    if (oldParent) this.manageListenersOnParent(false, oldParent);\n    if (this.scrollParent) this.manageListenersOnParent(!this.stickToEle);\n  }\n\n  /** Add remove specific listeners if we're sticking to a sticker.\n   * We need to adjust triggers according to the status of the 'master'  */\n  @Watch('stickToEle')\n  stickToEleChange(_, oldEle: null | HTMLNanoStickerElement) {\n    if (this.stickToEle) {\n      this.stickToEle.addEventListener('nanoHide', this.onStickToDisplayEvent);\n      this.stickToEle.addEventListener('nanoShow', this.onStickToDisplayEvent);\n      this.stickToEle.addEventListener('nanoStuck', this.onStickToDisplayEvent);\n      this.stickToEle.addEventListener(\n        'nanoUnstuck',\n        this.onStickToDisplayEvent\n      );\n    }\n    if (oldEle) {\n      oldEle.removeEventListener('nanoHide', this.onStickToDisplayEvent);\n      oldEle.removeEventListener('nanoShow', this.onStickToDisplayEvent);\n      oldEle.removeEventListener('nanoStuck', this.onStickToDisplayEvent);\n      oldEle.removeEventListener('nanoUnstuck', this.onStickToDisplayEvent);\n    }\n  }\n\n  /** Find and set the stickToEle from the public, selector string */\n  @Watch('stickTo')\n  stickToChange() {\n    if (typeof this.stickTo === 'string')\n      this.stickToEle = this.scrollParent.querySelector(this.stickTo);\n    else if (!!this.stickTo) this.stickToEle = this.stickTo;\n    else this.stickToEle = undefined;\n  }\n\n  /** 2 potential criteria for hiding. Multi-stickers or quiet mode. */\n  @Watch('multiStickerHide')\n  @Watch('scrollHide')\n  visibilityDecisionHandler() {\n    if (this.multiStickerHide || this.scrollHide) this.hide = true;\n    else this.hide = false;\n  }\n\n  @Watch('hide')\n  handleHideChange() {\n    if (this.hide) this.nanoHide.emit({ sticker: this.host });\n    else this.nanoShow.emit({ sticker: this.host });\n  }\n\n  @Watch('scrollParent')\n  setupIO() {\n    if (this.io) {\n      this.io.disconnect();\n      this.io = undefined;\n    }\n    if (!this.scrollParent || !this.hasBootstrapped || !this.trigger) return;\n\n    this.isRootSticker = this.scrollParent instanceof Document;\n    let root = this.scrollParent;\n    if (this.scrollParent instanceof Document) root = null;\n\n    this.io = new window.IntersectionObserver(\n      (_) => {\n        if (this.pauseResizeWatcher || !this.isSticky) return;\n        this.shouldStick(_.slice(-1)[0]);\n      },\n      { root: root as HTMLElement }\n    );\n\n    this.io.observe(this.trigger);\n  }\n\n  // Private methods / handlers\n\n  /** Assesses the public API quitemode and works out if it should be applied atm.\n   * If 'small screen', or there is a breakpointmax / min it will add a resizeobserver to conditionally add behaviour */\n  private setupParentResizeListener = () => {\n    if (!window['ResizeObserver']) return;\n\n    if (this.parentSizeObserver) {\n      this.parentSizeObserver.disconnect();\n      this.parentSizeObserver = undefined;\n    }\n\n    this.parentSizeObserver = new ResizeObserver((entries) => {\n      for (const entry of entries) {\n        let height: number, width: number;\n        if (entry.contentRect.height) height = entry.contentRect.height;\n        if (entry.contentRect.width) width = entry.contentRect.width;\n\n        if (typeof this.quietMode === 'object') {\n          if (width < this.quietMode.w || height < this.quietMode.h)\n            this.quietModeIsOn = true;\n          else this.quietModeIsOn = false;\n        }\n\n        if (this.breakPointMin) {\n          if (width > this.breakPointMin) this.isSticky = true;\n          else this.isSticky = false;\n        }\n\n        if (this.breakPointMax) {\n          if (width < this.breakPointMax) this.isSticky = true;\n          else this.isSticky = false;\n        }\n\n        if (this.isRootSticker && this.sticker && this.autoResize)\n          this.sticker.style.width = this.host.scrollWidth + 'px';\n      }\n    });\n\n    const toWatch =\n      this.scrollParent instanceof Document\n        ? this.scrollParent.documentElement\n        : this.scrollParent;\n    if (toWatch) this.parentSizeObserver.observe(toWatch);\n  };\n\n  /** For stickTo stickers. We listen to the events from the 'master' sticker to amend the hide/show trigger\n   * Main diffs from root-stickers / non is height being on 'master' */\n  private onStickToDisplayEvent = (\n    e: CustomEvent<{ sticker: HTMLNanoStickerElement }>\n  ) => {\n    if (e.detail.sticker !== this.stickToEle) return;\n\n    switch (e.type) {\n      case 'nanoHide':\n        this._offset = 0;\n        this.cacheOffset = this.offset;\n        this.offset = 0;\n        /** trigger moves down, underneath sticker if the main sticker hides */\n        if (!this.isStuck) this.moveTrigger(false);\n\n        /** If it's an actual 'position: sticky' element, we need to give the sticker an appropriate height.\n         * This minimises content jumping around as items are added */\n        if (!this.isRootSticker && this.quietModeIsOn) {\n          requestAnimationFrame(() => {\n            this.stickToEle.style.minHeight =\n              this.stickToEleInitSize.height +\n              (this.host.scrollHeight +\n                (typeof this.cacheOffset === 'object'\n                  ? this.cacheOffset.v\n                  : this.cacheOffset)) +\n              'px';\n            this.stickToEle.setTriggerPos(this.stickToEleInitSize.height * -1);\n          });\n        }\n        break;\n      case 'nanoShow':\n        this._offset = this.stickToEleInitSize.height;\n        this.offset = this.cacheOffset;\n        this.moveTrigger(true);\n\n        /** reset master sticker size */\n        if (!this.isRootSticker && this.quietModeIsOn) {\n          requestAnimationFrame(() => {\n            this.stickToEle.style.minHeight = '';\n            this.stickToEle.setTriggerPos(0);\n          });\n        }\n        break;\n      case 'nanoStuck':\n        this.stickToEleInitSize = this.stickToEle.getBoundingClientRect();\n        this._offset = this.stickToEleInitSize.height;\n        break;\n    }\n  };\n\n  /** Add or removes event listeners / observers on scrolling parent\n   * for when the scrolling parent changes, or, this sticker is sticking to another */\n  private manageListenersOnParent(\n    addEvents: boolean,\n    ele?: HTMLElement | Document\n  ) {\n    const scrollParent = ele || this.scrollParent;\n\n    if (!scrollParent) return;\n\n    if (!addEvents) {\n      try {\n        if (this.quietModeIsOn)\n          scrollParent.removeEventListener('scroll', this.onScroll);\n        scrollParent.removeEventListener('nanoStuck', this.onStickEvent);\n        scrollParent.removeEventListener('nanoUnstuck', this.onStickEvent);\n      } catch (e) {\n        console.error('Events haven`t been added');\n      }\n    } else {\n      scrollParent.addEventListener('nanoStuck', this.onStickEvent);\n      scrollParent.addEventListener('nanoUnstuck', this.onStickEvent);\n\n      if (this.quietModeIsOn) this.attachScrollListeners();\n    }\n    this.setupParentResizeListener();\n  }\n\n  /** Handler applied to scrolling parent. When 'hideOnNewStickers' is true, hide this sticker on subsequent stuck stickers.  */\n  private onStickEvent = async (\n    e: CustomEvent<{ sticker: HTMLNanoStickerElement }>\n  ) => {\n    const sticker = e.detail ? e.detail.sticker : null;\n    if (!sticker || sticker.position !== this.position) return;\n\n    const incomingTriggerPos = await sticker.getTriggerPos();\n\n    if (\n      e.type === 'nanoStuck' &&\n      sticker !== this.host &&\n      sticker.scrollParent === this.host.scrollParent\n    ) {\n      this.stickerIndex++;\n\n      if (!this.hideOnNewStickers) return;\n\n      if (\n        (this.positions.includes('top') &&\n          this.triggerPos.top < incomingTriggerPos.top) ||\n        (this.positions.includes('bottom') &&\n          this.triggerPos.top > incomingTriggerPos.top)\n      ) {\n        this.multiStickerHide = true;\n        this.stuckCounter++;\n      }\n    }\n\n    if (\n      e.type === 'nanoUnstuck' &&\n      sticker !== this.host &&\n      sticker.scrollParent === this.host.scrollParent\n    ) {\n      this.stickerIndex--;\n\n      if (!this.hideOnNewStickers) return;\n\n      if (\n        (this.positions.includes('top') &&\n          this.triggerPos.top < incomingTriggerPos.top) ||\n        (this.positions.includes('bottom') &&\n          this.triggerPos.top > incomingTriggerPos.top)\n      ) {\n        this.stuckCounter--;\n        if (this.stuckCounter < 1) this.multiStickerHide = false;\n      }\n    }\n  };\n\n  /** Scroll handler applied to scrolling parent. Only applied when quietmode is on.\n   * 'hides' stickers when scrolling over 100px away from trigger and 'shows' when scrolling toward */\n  private onScroll = () => {\n    const y: number = _getScrollTop(this.scrollParent);\n\n    // scrolling up\n    if (y < this.scrollPosCache) {\n      if (!this.positions.includes('bottom')) this.handleScrollTo();\n      else this.handleScrollAway(y);\n    }\n\n    // scrolling down\n    if (y > this.scrollPosCache) {\n      if (!this.positions.includes('bottom')) this.handleScrollAway(y);\n      else this.handleScrollTo();\n    }\n    this.scrollPosCache = y;\n  };\n\n  /** Watch for scroll direction. Only applies when quietmode is on.\n   * We need to addjust the position of the trigger when the sticker is hidden */\n  private handleScrollTo() {\n    this.scrollPosThresholdCache = null;\n    if (!this.scrollHide) return;\n\n    if (this.scrollingTo !== true) {\n      this._offset = this.cacheOffset || this._offset;\n    }\n    this.scrollingTo = true;\n    this.scrollHide = false;\n  }\n\n  private handleScrollAway(currScroll: number) {\n    if (this.scrollHide) return;\n\n    if (!this.isStuck) return;\n\n    if (this.scrollingTo !== false) {\n      this.cacheOffset = this._offset;\n      this._offset = 0;\n    }\n    this.scrollingTo = false;\n\n    if (!this.scrollPosThresholdCache)\n      this.scrollPosThresholdCache = currScroll;\n    else if (\n      !this.pauseHide &&\n      Math.abs(currScroll - this.scrollPosThresholdCache) > 100\n    )\n      this.scrollHide = true;\n  }\n\n  private moveTrigger(toInitial?: boolean) {\n    if (\n      (this.positions.includes('bottom') && !toInitial) ||\n      (!this.positions.includes('bottom') && toInitial)\n    ) {\n      this.host.parentNode.insertBefore(this.trigger, this.host);\n    } else\n      this.host.parentNode.insertBefore(this.trigger, this.host.nextSibling);\n  }\n\n  /**\n   * Gets the 'closest' scrolling parent\n   * @returns either an element with `overflow: scroll | auto` or the parent Document\n   */\n  private getScrollParent(): HTMLElement | Document {\n    const regex = /(auto|scroll)/;\n    const parents = (_node: Node, ps: Node[]) => {\n      if (_node.parentNode === null) {\n        return ps;\n      }\n      return parents(_node.parentNode, ps.concat([_node]));\n    };\n    const style = (_node, prop) =>\n      getComputedStyle(_node, null).getPropertyValue(prop);\n    const overflow = (_node) =>\n      style(_node, 'overflow') +\n      style(_node, 'overflow-y') +\n      style(_node, 'overflow-x');\n    const scroll = (_node) => regex.test(overflow(_node));\n    const docHeight = document.documentElement.getBoundingClientRect().height;\n\n    const scrollParent = (_node: HTMLElement) => {\n      if (!(typeof _node === 'object')) return;\n\n      const ps = parents(_node, []);\n      return (\n        ps.find(\n          (ele) =>\n            scroll(ele) && ele.getBoundingClientRect().height !== docHeight\n        ) || document\n      );\n    };\n\n    return scrollParent(this.host);\n  }\n\n  private shouldStick(data?: IntersectionObserverEntry) {\n    let scrollAmt: number;\n\n    if (this.positions.includes('top')) {\n      if (!this.isRootSticker) {\n        scrollAmt = _getOffset(this.trigger, this.scrollParent).top;\n      } else {\n        scrollAmt = this.trigger.getBoundingClientRect().top;\n      }\n      this.isStuck = scrollAmt < -1;\n    } else if (this.positions.includes('bottom')) {\n      scrollAmt = this.trigger.getBoundingClientRect().top;\n      const parentBounding =\n        data && data.rootBounds\n          ? data.rootBounds\n          : (this.scrollParent instanceof Document\n              ? document.documentElement\n              : this.scrollParent\n            ).getBoundingClientRect();\n      this.isStuck =\n        !data.isIntersecting ||\n        scrollAmt > parentBounding.height + parentBounding.top;\n    }\n  }\n\n  private bootstrapGurantor() {\n    this.hasBootstrapped = true;\n\n    this.scrollParent = this.scrollParent || this.getScrollParent();\n    this.isRootSticker = this.scrollParent instanceof Document;\n\n    this.trigger = this.trigger || document.createElement('div');\n    this.trigger.innerHTML = '&nbsp;';\n    this.trigger.classList.add('sticker-trigger');\n\n    this.positionChange();\n    this.moveTrigger(true);\n    this.quietModeChange();\n\n    this.listenForScrollParent = true;\n    this.handleParentEvents(true);\n\n    this.stickerIndex = Array.from(\n      this.scrollParent.querySelectorAll('nano-sticker')\n    )\n      .filter(\n        (sticker: HTMLNanoStickerElement) => sticker.position === this.position\n      )\n      .findIndex((sticker) => sticker === this.host);\n\n    this.setOffset();\n    this.stickerResizeListener();\n    this.setupParentResizeListener();\n\n    // bit of a hack ... add default 'order'. Required for 'stickTo' elements.\n    this.slottedContent = Array.from(this.host.children);\n    this.slottedContent.forEach((child: HTMLElement) => {\n      child.style.order = this.stickerIndex + '';\n    });\n\n    this.updateTriggerOffset();\n    this.stickToChange();\n    this.setupIO();\n    this.onStickToDisplayEvent = debounce(this.onStickToDisplayEvent, 50);\n  }\n\n  // Stencil methods\n\n  connectedCallback() {\n    this.isRtl =\n      this.host.dir === 'rtl' ||\n      (this.host.ownerDocument as Document).dir === 'rtl';\n\n    // this is all horrible.... shrug\n    document.documentElement.addEventListener('nanoComponentsReady', () => {\n      setTimeout((_) => this.bootstrapGurantor(), 200);\n    });\n    setTimeout((_) => {\n      if (!this.hasBootstrapped) this.bootstrapGurantor();\n    }, 1000);\n  }\n\n  disconnectedCallback() {\n    if (this.io) {\n      this.io.disconnect();\n      this.io = undefined;\n    }\n\n    if (this.parentSizeObserver) {\n      this.parentSizeObserver.disconnect();\n      this.parentSizeObserver = undefined;\n    }\n\n    this.scrollParent = null;\n    this.hasBootstrapped = false;\n  }\n\n  render() {\n    return (\n      <Host\n        sticky={!this.isRootSticker && !this.stickToEle && this.isSticky}\n        hide={this.hide && this.isStuck}\n        siblings={this.stuckCounter}\n        index={this.stickerIndex}\n        stuck={this.isStuck && this.isSticky}\n        placed-bottom={this.positions.includes('bottom')}\n        placed-top={this.positions.includes('top')}\n        placed-end={this.positions.includes('end')}\n        placed-start={this.positions.includes('start')}\n      >\n        <div\n          class={{\n            sticker: true,\n            sticky: this.isRootSticker && this.isSticky,\n            stuck: this.isStuck && this.isRootSticker && this.isSticky,\n            hide: this.isRootSticker && this.hide && this.isStuck,\n          }}\n          ref={(div) => (this.sticker = div)}\n        >\n          <div class=\"sticker-content\" ref={(div) => (this.content = div)}>\n            <slot />\n          </div>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"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"}

package/dist/nano-components/{p-39aec880.entry.js → p-35d3072e.entry.js}

@@ -1,5 +1,5 @@
 /*!
  * Web Components for Nanopore digital Web Apps
  */
-export{T as nano_table}from"./p-9b533dc3.js";import"./p-f6a8467a.js";import"./p-ee045579.js";import"./p-7bff5224.js";import"./p-9ebbb814.js";
-//# sourceMappingURL=p-39aec880.entry.js.map
+export{T as nano_table}from"./p-00a18187.js";import"./p-f6a8467a.js";import"./p-ee045579.js";import"./p-7bff5224.js";import"./p-9ebbb814.js";
+//# sourceMappingURL=p-35d3072e.entry.js.map