@nanoporetech-digital/components 2.10.1 → 2.13.0

package/dist/nano-components/p-aa84c727.system.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["src/components/datalist/datalist.scss?tag=nano-datalist&encapsulation=shadow","src/components/datalist/datalist.tsx","src/components/menu/menu.scss?tag=nano-menu&encapsulation=shadow","src/components/menu/menu.tsx","src/components/option/option.scss?tag=nano-option&encapsulation=shadow","src/components/option/option.tsx"],"names":["datalistCss","findLabel","formCtrl","foundLabel","id","document","querySelector","closest","listIds","DataList","exports","class_1","hostRef","_this","this","isNanoInput","typeToSelect","listId","isFiltered","shouldFocus","_allOptEles","actvOptEles","canOpen","optionIds","selected","_dropDownConfig","skidding","options","type","open","disableFilter","disabled","optSelected","e","stopPropagation","changeInputValue","detail","raf","inputChange","shouldOpen","handleShow","__awaiter","listBox","setFocus","showActiveElement","inputClick","manageDropdownDisplay","inputKeydown","ignoreKeys","includes","key","typeToSelectTimeout","test","clearTimeout","window","setTimeout","setOptStartsWith","preventDefault","optionKeyDown","connectedInput","focus","deleteKeys","exactMatch","debounce","bind","Object","defineProperty","prototype","opts","_a","value","forEach","opt","ddc","assign","allOptEles","openWatcher","writeTask","nanoDropdown","setAttribute","toString","watchInputChange","nanoInput","host","_b","getInputElement","_c","sent","input","HTMLElement","manageSlotChangeListener","length","mo","MutationObserver","processSlottedContent","observe","childList","subtree","disconnect","undefined","flatMap","option","i","label","createElement","ariaPosinset","ariaSetsize","textContent","slot","append","__spreadArray","watchTypeChange","dwConfig","closeOnSelect","autocompleteType","readonly","placement","tetherTo","dropDownConfig","readOnly","manageInputEvents","newInput","oldInput","removeEventListener","inputLabel","removeAttribute","addEventListener","labels","item","watchActvOptChange","c","val","optIds","hidden","isSelected","push","manageCanOpen","hasNoResult","fireActiveOptsEvent","nanoOptionsUpdated","emit","find","nanoSelected","filter","nanoDeselect","nanoSelect","defaultPrevented","event","Event","dispatchEvent","attrFind","toFind","toLowerCase","substring","foundEle","trim","filterMeta","Array","from","querySelectorAll","valStr","activeEles","indexOf","connectedCallback","componentDidLoad","componentDidRender","console","warn","render","h","Host","role","aria-owns","join","aria-label","ref","el","dialogTitle","class","dlist__dropdown","dlist--isfiltered","onNanoAfterShow","onNanoAfterHide","_","dlist__menu","dlist__menu--open","dropwdownOpen","tabIndex","onNanoSelect","onKeyDown","name","aria-live","menuCss","CANSHADOW","head","attachShadow","Menu","class_2","ignoreMouseEvents","_hasFocus","handleFocus","setActiveFocusItem","selectedItem","getItems","nanoFocus","handleClick","target","handleKeyDown","ignoreMouseTimeout","activeItem","click","items","index","scrollIntoView","block","_i","items_1","shadowRoot","getTextContent","handleMouseOver","menu","preventScroll","removeFocus","blur","resetActiveItem","tagName","map","opened","ctx","getDirectChildren","activeElement","getActiveElement","getAttribute","classList","contains","handleBlur","hasFocus","kev","found","composedPath","nanoBlur","legacy","onClick","onMouseOver","onFocus","part","optionCss","Option","class_3","optId","valueChanged","labelContent","labelChanged","componentWillLoad","aria-selected","aria-disabled","onMouseDown","option--selected","option--disabled","option--novalue","aria-hidden"],"mappings":"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","sourcesContent":["@use 'sass:map';\n@use 'sass:list';\n\n@import '../../global/style/utilities/globals';\n@import '../../global/style/nano-theme/form';\n@import '../../global/style/nano-theme/base';\n@import '../../global/style/nano-theme/layers';\n\n:host {\n  /**\n  * @prop --padding-top: for all nested `nano-option` elements. Defaults to #{$spacing-small};\n  * @prop --padding-bottom: for all nested `nano-option` elements. Defaults to #{$spacing-small};\n  * @prop --padding-start: for all nested `nano-option` elements. Defaults to #{$spacing-xlarge};\n  * @prop --padding-end: for all nested `nano-option` elements. Defaults to #{$spacing-xlarge};\n  * @prop --font-size: for all nested `nano-option` elements. Defaults to .8em;\n  * @prop --color: default text color of content other than `nano-option`. Defaults to #{map.get($colors, palegrey)};\n  */\n\n  --padding-top: #{$spacing-small};\n  --padding-bottom: #{$spacing-small};\n  --padding-start: #{$spacing-xlarge};\n  --padding-end: #{$spacing-xlarge};\n  --font-size: 0.8em;\n  --color: #{map.get($colors, palegrey)};\n\n  color: var(--color);\n}\n\n.dlist {\n  &--isfiltered {\n    ::slotted(*:not(nano-option):not([slot='no-result']):not([slot='list-top']):not([slot='list-bottom'])) {\n      display: none !important;\n    }\n  }\n\n  &__dropdown {\n    --min-width: 100%;\n    --overflow: auto;\n  }\n\n  &__status {\n    @include visually-hide();\n  }\n\n  &__menu {\n    --padding-top: inherit;\n    --padding-bottom: inherit;\n    --padding-start: inherit;\n    --padding-end: inherit;\n    --font-size: inherit;\n  }\n}\n","import {\n  Component,\n  ComponentInterface,\n  h,\n  Host,\n  Element,\n  State,\n  Watch,\n  Prop,\n  Event,\n  EventEmitter,\n  writeTask,\n  Build,\n} from '@stencil/core';\nimport { debounce, raf } from '../../utils';\nimport type { Dropdown } from '../dropdown/dropdown';\nimport type { OptionInterface } from '../../interface';\n\nfunction findLabel(formCtrl: Element) {\n  let foundLabel: HTMLLabelElement;\n\n  if (formCtrl.id) {\n    foundLabel = document.querySelector(`label[for='${formCtrl.id}']`);\n  }\n  if (!foundLabel) {\n    foundLabel = formCtrl.closest('label');\n  }\n  return foundLabel;\n}\n\nlet listIds = 0;\n\n/**\n * `nano-datalist` a visually consistent and more flexible replacement for a native\n * [datalist](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/datalist). Can be nested within a `nano-input`\n * or linked to any input control via the `input` prop. Is used internally within `nano-select`.\n * Options can be defined declaratively by nesting `<nano-option>` elements or imperatively using the `options` prop\n *\n * @slot - use `<nano-option>` elements for more complex html. Alternatively use the `options` prop\n * @slot list-top - shows at the top of the list when there are options present\n * @slot list-bottom - shows at the bottom of the list when there are options present\n * @slot no-result - shown when there are no results otherwise nothing will be shown\n */\n@Component({\n  tag: 'nano-datalist',\n  styleUrl: 'datalist.scss',\n  shadow: true,\n})\nexport class DataList implements ComponentInterface {\n  // Private State\n\n  private isNanoInput = false;\n  private typeToSelect = '';\n  private typeToSelectTimeout: number;\n  private nanoDropdown: HTMLNanoDropdownElement;\n  private listBox: HTMLNanoMenuElement;\n  private mo?: MutationObserver;\n  private listId = `nano-datalist-${listIds++}`;\n  private isFiltered = false;\n  private shouldFocus = false;\n  // all potential option eles. Set via slot or `options` prop.\n  // Some may get hidden due to filtering\n  private get allOptEles() {\n    return this._allOptEles;\n  }\n  private set allOptEles(opts) {\n    // when allOptEles are initially set (on slot change / options) -\n    // add options to 'selected' and fire selected event *if*\n    // value isn't set on the input\n    this._allOptEles = opts;\n    if (this.connectedInput?.value) return;\n\n    opts.forEach((opt) => {\n      if (opt.selected && !this.selected.includes(opt.value)) {\n        this.changeInputValue(opt);\n      }\n    });\n  }\n  private _allOptEles: HTMLNanoOptionElement[] = [];\n\n  @Element() host: HTMLNanoDatalistElement;\n\n  // active option eles that are not hidden.\n  @State() actvOptEles: HTMLNanoOptionElement[] = [];\n  @State() connectedInput: HTMLInputElement | HTMLTextAreaElement;\n  @State() inputLabel: HTMLLabelElement;\n  @State() hasNoResult: boolean;\n  @State() shouldOpen: boolean;\n  @State() canOpen: boolean = true;\n  @State() optionIds: string[] = [];\n\n  constructor() {\n    this.inputChange = debounce(this.inputChange.bind(this), 50);\n  }\n\n  // Public API\n\n  /** By default, items in the list will appear 'selected' when the value in the linked input control matches.\n   * However you can add other selected options via the the selected prop. */\n  @Prop({ mutable: true }) selected: string[] = [];\n\n  /** nano-dropdown config options you can pass to the nested dropdown component */\n  @Prop()\n  get dropDownConfig() {\n    return this._dropDownConfig;\n  }\n  set dropDownConfig(ddc: Partial<Dropdown>) {\n    this._dropDownConfig = { ...this._dropDownConfig, ...ddc };\n  }\n  private _dropDownConfig: Partial<Dropdown> = {\n    skidding: -1,\n  };\n\n  /** Provide an option list.\n   * Options can be defined declaratively by nesting `<nano-option>` elements or imperatively using this prop */\n  @Prop() options?: OptionInterface[] = [];\n\n  /** A selector to a HTMLInputElement */\n  @Prop() input?: string | HTMLInputElement;\n\n  /** Tweaks the datalist behaviour and linked control semantics and behaviour.\n   * e.g. 'select' will make the linked input control `readonly`.\n   */\n  @Prop() type: 'select' | 'selctMulti' | 'input' = 'input';\n\n  /** return all the active options currently within the datalist. Can be useful for validation */\n  @Prop()\n  get activeOptions() {\n    return this.allOptEles;\n  }\n\n  /** Force datalist open */\n  @Prop({ mutable: true }) open: boolean = false;\n\n  @Watch('open')\n  openWatcher() {\n    writeTask(() => {\n      this.nanoDropdown.open = this.open;\n      this.connectedInput.setAttribute('aria-expanded', this.open.toString());\n    });\n  }\n\n  /** Use this option to disable to default filtering. This is useful if filtering happens\n   * externally via another method (e.g. via ajax)\n   */\n  @Prop() disableFilter = false;\n\n  /** Activate / deactivate the datalist control */\n  @Prop() disabled = false;\n\n  // State change watchers\n\n  @Watch('input')\n  async watchInputChange() {\n    let nanoInput;\n    if ((nanoInput = this.host.closest('nano-input'))) {\n      this.isNanoInput = true;\n      this.connectedInput = await nanoInput.getInputElement();\n    } else if (\n      this.input &&\n      typeof this.input === 'string' &&\n      (nanoInput = document.querySelector(this.input))\n    ) {\n      this.isNanoInput = false;\n      this.connectedInput = nanoInput;\n    } else if (this.input instanceof HTMLElement) {\n      this.connectedInput = this.input;\n    }\n  }\n\n  @Watch('options')\n  manageSlotChangeListener() {\n    if (!this.host) return;\n\n    // we're not using `options` - setup new MO\n    if ((!this.options || !this.options.length) && !this.mo) {\n      if (Build.isBrowser) {\n        const mo = (this.mo = new MutationObserver(() =>\n          this.processSlottedContent()\n        ));\n        mo.observe(this.host, { childList: true, subtree: true });\n      }\n      this.processSlottedContent();\n      return;\n    }\n\n    // we're using `options` - trash current MO\n    if (this.options?.length) {\n      if (!!this.mo) {\n        this.mo.disconnect();\n        this.mo = undefined;\n      }\n\n      // add imperative `options`\n      writeTask(() => {\n        this.allOptEles = this.options.flatMap((option, i) => {\n          if (option.value || option.label) {\n            const opt = Object.assign(document.createElement('nano-option'), {\n              label: option.label,\n              value: option.value,\n              ariaPosinset: i,\n              ariaSetsize: this.options.length,\n              selected: option.selected,\n              id: this.listId + '-option-' + i,\n              textContent: option.label ? option.label : option.value,\n              slot: 'internal-opts',\n            });\n            this.host.append(opt);\n            return opt;\n          }\n        });\n\n        if (this.connectedInput?.value.length && this.type !== 'select') {\n          this.inputChange();\n        } else this.actvOptEles = [...this.allOptEles];\n      });\n    }\n    // forceUpdate(this.host);\n  }\n\n  @Watch('type')\n  @Watch('connectedInput')\n  watchTypeChange() {\n    if (!this.connectedInput) return;\n\n    let dwConfig: Partial<Dropdown> = { closeOnSelect: false };\n    let autocompleteType: 'list' | 'both' = 'both';\n    let readonly = false;\n\n    switch (this.type) {\n      case 'selctMulti':\n        // dwConfig.closeOnSelect = false;\n        break;\n      case 'select':\n        autocompleteType = 'list';\n        readonly = true;\n        dwConfig = { closeOnSelect: true, placement: 'center' };\n        break;\n    }\n\n    if (!this.isNanoInput) {\n      dwConfig.tetherTo = this.connectedInput;\n    }\n\n    this.dropDownConfig = { ...this.dropDownConfig, ...dwConfig };\n    this.connectedInput.setAttribute('aria-autocomplete', autocompleteType);\n    this.connectedInput.readOnly = readonly;\n  }\n\n  @Watch('connectedInput')\n  manageInputEvents(newInput?: HTMLInputElement, oldInput?: HTMLInputElement) {\n    if (!!oldInput) {\n      const nanoInput = oldInput.closest('nano-input');\n      if (nanoInput) {\n        nanoInput.removeEventListener('nanoChange', this.inputChange);\n      }\n      oldInput.removeEventListener('change', this.inputChange);\n      oldInput.removeEventListener('click', this.inputClick);\n      oldInput.removeEventListener('keydown', this.inputKeydown);\n      oldInput.removeEventListener('input', this.inputChange);\n\n      this.inputLabel = null;\n\n      writeTask(() => {\n        oldInput.removeAttribute('role');\n        oldInput.removeAttribute('aria-expanded');\n        oldInput.removeAttribute('aria-controls');\n        oldInput.removeAttribute('aria-owns');\n        oldInput.removeAttribute('aria-haspopup');\n        oldInput.removeAttribute('aria-autocomplete');\n        oldInput.removeAttribute('autocomplete');\n      });\n    }\n    if (!!newInput) {\n      const nanoInput = newInput.closest('nano-input');\n      if (nanoInput) {\n        nanoInput.addEventListener('nanoChange', this.inputChange);\n      }\n      newInput.addEventListener('change', this.inputChange);\n      newInput.addEventListener('click', this.inputClick);\n      newInput.addEventListener('keydown', this.inputKeydown);\n      newInput.addEventListener('input', this.inputChange);\n      this.listId = this.host.id || this.listId;\n\n      this.inputLabel = newInput?.labels?.item(0) || findLabel(newInput);\n\n      writeTask(() => {\n        this.host.id = this.listId;\n        newInput.setAttribute('role', 'combobox');\n        newInput.setAttribute('aria-expanded', 'false');\n        newInput.setAttribute('aria-controls', this.listId);\n        newInput.setAttribute('aria-owns', this.listId);\n        newInput.setAttribute('aria-haspopup', 'listbox');\n        newInput.setAttribute('autocomplete', 'off');\n      });\n    }\n  }\n\n  @Watch('selected')\n  @Watch('actvOptEles')\n  watchActvOptChange() {\n    let c = 0;\n    const val = this.connectedInput?.value || '';\n    const optIds = [];\n\n    writeTask(() => {\n      this.allOptEles.forEach((opt, i) => {\n        if (this.actvOptEles.includes(opt)) {\n          c++;\n          opt.setAttribute('aria-posinset', c + '');\n          opt.setAttribute('aria-setsize', this.actvOptEles.length + '');\n          opt.hidden = false;\n          this.isSelected(opt, val);\n        } else {\n          opt.removeAttribute('aria-posinset');\n          opt.removeAttribute('aria-setsize');\n          opt.hidden = true;\n          opt.selected = false;\n        }\n        opt.id = this.listId + '-option-' + i;\n        optIds.push(opt.id);\n      });\n      this.optionIds = optIds;\n    });\n  }\n\n  @Watch('actvOptEles')\n  @Watch('hasNoResult')\n  manageCanOpen() {\n    if (this.actvOptEles.length || this.hasNoResult) this.canOpen = true;\n    else this.canOpen = false;\n  }\n\n  /**\n   * Opens the dropdown if it can, it should and there are items to display.\n   */\n  @Watch('shouldOpen')\n  @Watch('canOpen')\n  manageDropdownDisplay() {\n    if (this.shouldOpen && this.canOpen && !this.disabled) this.open = true;\n    if (!this.shouldOpen || !this.canOpen) this.open = false;\n    this.openWatcher();\n  }\n\n  @Watch('actvOptEles')\n  fireActiveOptsEvent() {\n    this.nanoOptionsUpdated.emit(this.actvOptEles);\n  }\n\n  // Events\n\n  /** Fired when an item is selected. */\n  @Event() nanoSelect: EventEmitter<HTMLNanoOptionElement>;\n\n  /** Fired when a currently selected item is reselected. */\n  @Event() nanoDeselect: EventEmitter<HTMLNanoOptionElement>;\n\n  /** Fired when active options change */\n  @Event() nanoOptionsUpdated: EventEmitter<HTMLNanoOptionElement[]>;\n\n  // Private logic\n\n  private isSelected(opt: HTMLNanoOptionElement, val: string) {\n    if (val === opt.value || this.selected.includes(opt.value)) {\n      opt.selected = true;\n    } else opt.selected = false;\n  }\n\n  private get dropwdownOpen() {\n    if (!this.nanoDropdown || !this.open) return false;\n    return true;\n  }\n\n  private get exactMatch() {\n    return this.allOptEles.find(\n      (opt) => this.connectedInput.value === opt.value\n    );\n  }\n\n  /** reflect value back to the connected input unless the event is cancelled */\n  private changeInputValue(opt: HTMLNanoOptionElement) {\n    let nanoSelected;\n\n    if (this.selected.includes(opt.value)) {\n      // deselect option\n      this.selected = this.selected.filter((val) => val !== opt.value);\n      nanoSelected = this.nanoDeselect.emit(opt);\n    } else {\n      // select new option\n      this.selected = [...this.selected];\n      nanoSelected = this.nanoSelect.emit(opt);\n    }\n\n    if (!nanoSelected.defaultPrevented) {\n      if (this.connectedInput) this.connectedInput.value = opt.value;\n\n      const event = new window.Event('change');\n      this.connectedInput?.dispatchEvent(event);\n    }\n  }\n\n  // a new option has been picked\n  private optSelected = (e: CustomEvent<HTMLNanoOptionElement>) => {\n    e.stopPropagation();\n    this.changeInputValue(e.detail);\n    raf(() => this.inputChange());\n\n    if (this.type === 'select') this.shouldOpen = false;\n  };\n\n  // this is for type=\"select\" only.\n  // Filter options that start with text - aggregates letters (as opposed to getting the value from input)\n  private setOptStartsWith() {\n    const attrFind = (toFind: string) =>\n      toFind.toLowerCase().substring(0, this.typeToSelect.length) ===\n      this.typeToSelect;\n\n    const foundEle = this.allOptEles.find(\n      (opt) =>\n        opt.value.trim().length > 0 &&\n        !opt.disabled &&\n        (attrFind(opt.textContent) ||\n          attrFind(opt.value) ||\n          attrFind(opt.label) ||\n          attrFind(opt.filterMeta))\n    );\n    if (foundEle) this.changeInputValue(foundEle);\n  }\n\n  // Event handlers\n\n  private processSlottedContent() {\n    raf(() => {\n      this.allOptEles = Array.from(this.host.querySelectorAll('nano-option'));\n      this.hasNoResult = !!this.host.querySelector('[slot=\"no-result\"]');\n\n      if (this.connectedInput?.value.length && this.type !== 'select') {\n        this.inputChange();\n      } else this.actvOptEles = this.allOptEles;\n    });\n  }\n\n  // sets focus immediately on open when 'select' - mirroring native behaviour\n  private handleShow = async () => {\n    if (this.shouldFocus) {\n      this.shouldFocus = false;\n      this.listBox.setFocus();\n    } else if (this.type === 'select') this.listBox.showActiveElement();\n  };\n\n  // any changes to the connected input value will filter the list of active options\n  private inputChange() {\n    if (this.disableFilter) {\n      this.actvOptEles = this.allOptEles;\n      return;\n    }\n\n    const val = this.connectedInput.value;\n    const valStr = val.trim().toLowerCase();\n\n    let exactMatch = false;\n    const activeEles = [];\n    const attrFind = (toFind: string) =>\n      toFind.toLowerCase().indexOf(valStr) > -1;\n\n    this.allOptEles.forEach((opt) => {\n      if (\n        (val === opt.value || val === opt.label) &&\n        this.type !== 'selctMulti'\n      ) {\n        opt.selected = true;\n        exactMatch = true;\n      } else this.isSelected(opt, val);\n    });\n\n    this.allOptEles.forEach((opt) => {\n      if (!valStr.length || exactMatch) {\n        activeEles.push(opt);\n      } else if (\n        opt.value.trim().length > 0 &&\n        !opt.disabled &&\n        (attrFind(opt.textContent) ||\n          attrFind(opt.value) ||\n          attrFind(opt.label) ||\n          attrFind(opt.filterMeta))\n      ) {\n        activeEles.push(opt);\n      }\n    });\n\n    this.isFiltered = valStr.length && !exactMatch;\n    this.actvOptEles = activeEles;\n  }\n\n  private inputClick = () => {\n    this.shouldOpen = true;\n    // open dropdown if possible\n    this.manageDropdownDisplay();\n  };\n\n  private inputKeydown = (e: KeyboardEvent) => {\n    const ignoreKeys = [\n      'Shift',\n      'ArrowRight',\n      'ArrowLeft',\n      'Escape',\n      'Enter',\n      'Tab',\n    ];\n    if (ignoreKeys.includes(e.key)) {\n      if (e.key === 'Tab') this.shouldOpen = false;\n      return;\n    }\n\n    // When select, mirror native select behaviour. Search on closed list\n    if (\n      this.type === 'select' &&\n      !['ArrowDown', 'ArrowUp'].includes(e.key) &&\n      (e.key !== ' ' || this.typeToSelectTimeout)\n    ) {\n      if (e.key === ' ' || /^[a-z0-9]+$/i.test(e.key)) {\n        clearTimeout(this.typeToSelectTimeout);\n        this.typeToSelectTimeout = window.setTimeout(() => {\n          this.typeToSelect = '';\n          this.typeToSelectTimeout = 0;\n        }, 750);\n        this.typeToSelect += e.key;\n        this.setOptStartsWith();\n      }\n      return;\n    }\n\n    this.shouldOpen = true;\n    // open dropdown if possible\n    this.manageDropdownDisplay();\n    if (['ArrowDown', 'ArrowUp'].includes(e.key)) {\n      e.preventDefault();\n      this.shouldFocus = true;\n    }\n  };\n\n  // handles key down on options. Either 'picks'\n  // an option or passes event back to input for search / filter\n  private optionKeyDown = (\n    e: KeyboardEvent & { target: HTMLNanoOptionElement }\n  ) => {\n    const ignoreKeys = [\n      'Shift',\n      'ArrowUp',\n      'ArrowDown',\n      'Escape',\n      'Enter',\n      'Tab',\n      'Space',\n      'PageUp',\n      'PageDown',\n      'Home',\n      'End',\n      ' ',\n    ];\n    if (ignoreKeys.includes(e.key)) {\n      if (e.key === 'Escape') this.connectedInput.focus();\n      return;\n    }\n\n    const deleteKeys = ['Delete', 'Backspace'];\n    // this passes whatever's typed back to our input control\n    if (\n      this.type !== 'select' &&\n      (!this.exactMatch || deleteKeys.includes(e.key))\n    ) {\n      this.connectedInput.focus();\n    }\n  };\n\n  // Component lifecycle\n\n  connectedCallback() {\n    this.watchInputChange();\n  }\n\n  componentDidLoad() {\n    this.manageSlotChangeListener();\n    this.openWatcher();\n  }\n\n  componentDidRender(): void {\n    setTimeout(() => {\n      if (!this.connectedInput)\n        console.warn(\n          'no `nano-input` found. `nano-datalist` should be nested within an `nano-input` or linked via `input` prop',\n          this.host\n        );\n    }, 500);\n  }\n\n  render() {\n    return (\n      <Host\n        role=\"listbox\"\n        aria-owns={this.optionIds.join(' ')}\n        aria-label=\"Select options from the list below\"\n      >\n        <nano-dropdown\n          {...this.dropDownConfig}\n          ref={(el) => (this.nanoDropdown = el)}\n          dialogTitle=\"Select options from the list below\"\n          class={{\n            dlist__dropdown: true,\n            'dlist--isfiltered': this.isFiltered,\n          }}\n          onNanoAfterShow={this.handleShow}\n          onNanoAfterHide={(_) => (this.open = false)}\n        >\n          <nano-menu\n            hidden={!this.actvOptEles.length}\n            type=\"listbox\"\n            label={this.inputLabel ? this.inputLabel.textContent : undefined}\n            class={{\n              dlist__menu: true,\n              'dlist__menu--open': this.dropwdownOpen,\n            }}\n            tabIndex={-1}\n            onNanoSelect={this.optSelected}\n            onKeyDown={this.optionKeyDown}\n            ref={(el) => (this.listBox = el)}\n          >\n            <slot name=\"list-top\" />\n            {!this.options.length && <slot />}\n            {!!this.options.length && <slot name=\"internal-opts\" />}\n            <slot name=\"list-bottom\" />\n          </nano-menu>\n          <nano-menu\n            type=\"listbox\"\n            label=\"No results found\"\n            hidden={!!this.actvOptEles.length}\n            class={{\n              dlist__menu: true,\n              'dlist__menu--open': this.dropwdownOpen,\n            }}\n          >\n            <slot name=\"no-result\" />\n          </nano-menu>\n          {!!this.actvOptEles && (\n            <div aria-live=\"polite\" role=\"status\" class=\"dlist__status\">\n              {this.actvOptEles.length} result\n              {this.actvOptEles.length > 1 ? 's' : ''} available.\n            </div>\n          )}\n        </nano-dropdown>\n      </Host>\n    );\n  }\n}\n","@use 'sass:map';\n@use 'sass:list';\n\n@import '../../global/style/utilities/globals';\n@import '../../global/style/nano-theme/colours';\n@import '../../global/style/nano-theme/layers';\n\n:host {\n  /**\n   * @prop --padding-start: padding at the start of nav-items (left r2l / right l2r). Defaults to '10px'\n   * @prop --padding-end: padding at the end of nav-items (right r2l / left l2r). Defaults to '10px'\n   * @prop --padding-top: padding at the top of nav-items. Defaults to '10px'\n   * @prop --padding-bottom: padding at the bottom of nav-items. Defaults to '10px'\n\n   * @prop --secondary-padding-top: padding at the top of nested nav-items. Defaults to 0\n   * @prop --secondary-padding-bottom: padding at the bottom of nested nav-items. Defaults to 0\n\n   * @prop --bg-color-hover: bg hover color of nav-items. Defaults to #{map.get($colors, blue--faded)};\n   * @prop --bg-color-focus: bg focus color of nav-items. Defaults to #{map.get($colors, blue--faded)};\n   * @prop --bg-color-selected: bg selected color of nav-items. Defaults to #{map.get($colors, blue--faded)};\n\n   * @prop --color-hover: text hover color of nav-items. Defaults to #{map.get($colors, blue)}\n   * @prop --color-selected: text selected color of nav-items. Defaults to #{map.get($colors, blue)}\n   * @prop --color-focus: text focus color of nav-items. Defaults to #{map.get($colors, blue)}\n\n   * @prop --focus-outline: the focus style of nav-items. Defaults to 'none'\n   * @prop --font-size: default font-size for all items. Defaults .9em;\n  */\n\n  --padding-start: #{$spacing-medium};\n  --padding-end: #{$spacing-medium};\n  --padding-top: #{$spacing-small};\n  --padding-bottom: #{$spacing-small};\n  --secondary-padding-top: 0;\n  --secondary-padding-bottom: 0;\n  --bg-color-hover: #{map.get($colors, blue--faded)};\n  --bg-color-focus: #{map.get($colors, blue--faded)};\n  --bg-color-selected: #{map.get($colors, blue--faded)};\n  --color-hover: #{map.get($colors, blue)};\n  --color-selected: #{map.get($colors, blue)};\n  --color-focus: #{map.get($colors, blue)};\n  --focus-outline: none;\n  --font-size: 0.9em;\n\n  display: block;\n}\n\n.menu {\n  font-size: var(--font-size, 0.9em);\n  overscroll-behavior: none;\n  min-width: var(--width);\n  position: relative;\n\n  &:focus {\n    outline: none;\n  }\n}\n\n::slotted(*:not(nano-nav-item):not(nano-option):not(hr):not(slot)) {\n  @include padding(\n    var(--padding-top),\n    var(--padding-end),\n    var(--padding-bottom),\n    var(--padding-start)\n  );\n\n  display: block;\n}\n","import {\n  Component,\n  Event,\n  EventEmitter,\n  Method,\n  h,\n  Host,\n  Element,\n  Prop,\n  Listen,\n} from '@stencil/core';\nimport {\n  getTextContent,\n  getDirectChildren,\n  getActiveElement,\n} from '../../utils';\n\nconst CANSHADOW = !!document.head.attachShadow;\n\ntype ValidElement = HTMLNanoNavItemElement | HTMLNanoOptionElement;\ntype NNI = HTMLNanoNavItemElement;\n\n/**\n * Menu element. Commonly wrapped by `nano-dropdown` with `nano-option` and `nano-nav-item` elements nested.\n * Manages focus state / active.\n * @slot - The menu's content; `nano-option`, `nano-nav-item` elements as well as <hr> and more.\n */\n@Component({\n  tag: 'nano-menu',\n  styleUrl: 'menu.scss',\n  shadow: true,\n})\nexport class Menu {\n  private ignoreMouseEvents = false;\n  private ignoreMouseTimeout: any;\n  private menu: HTMLElement;\n  private typeToSelect = '';\n  private typeToSelectTimeout: any;\n\n  @Element() private el: HTMLNanoMenuElement;\n\n  // Public API\n\n  /** get the focus state of the menu @readonly */\n  @Prop()\n  get hasFocus() {\n    return this._hasFocus;\n  }\n  private _hasFocus = false;\n\n  /** changes the role of the underlying control - sometimes required for semantics */\n  @Prop() type: 'menu' | 'listbox' = 'menu';\n\n  /** an accessible label */\n  @Prop() label: string;\n\n  // Events\n\n  /** Emitted when the menu gains focus. */\n  @Event() nanoFocus: EventEmitter;\n\n  /** Emitted when the menu loses focus. */\n  @Event() nanoBlur: EventEmitter;\n\n  /** Emitted when a menu item is selected. */\n  @Event() nanoSelect: EventEmitter<\n    HTMLNanoOptionElement | HTMLNanoNavItemElement\n  >;\n\n  // Public Methods\n\n  /** Sets focus on the menu. */\n  @Method()\n  async setFocus() {\n    if (this.menu?.focus) this.menu.focus({ preventScroll: true });\n  }\n\n  /** Removes focus from the menu. */\n  @Method()\n  async removeFocus() {\n    if (this.menu?.blur) this.menu.blur();\n  }\n\n  /** Sets the current active item */\n  @Method()\n  async showActiveElement() {\n    if (this.selectedItem)\n      this.selectedItem.scrollIntoView({ block: 'nearest' });\n  }\n\n  /** Removes any active item's state */\n  @Method()\n  async resetActiveItem() {\n    this.getItems\n      .filter((i) => i.tagName.toLowerCase() === 'nano-option')\n      .map((i) => i.setAttribute('tabindex', '-1'));\n  }\n\n  // Private methods\n\n  get getItems() {\n    let items: ValidElement[];\n    let opened = this.el.querySelectorAll('nano-nav-item.secondary-open');\n    if (opened.length) {\n      const ctx = opened[opened.length - 1] as HTMLNanoNavItemElement;\n      items = Array.from(ctx.querySelectorAll('nano-nav-item, nano-option'));\n    } else {\n      items = getDirectChildren(\n        this.el,\n        'nano-nav-item, nano-option',\n        'slot'\n      ) as ValidElement[];\n    }\n    return items.filter((el) => !el.disabled && !el.hidden);\n  }\n\n  get activeItem() {\n    const activeElement = getActiveElement();\n    return this.getItems.find(\n      (i) =>\n        i.getAttribute('tabindex') === '0' ||\n        i === activeElement ||\n        i.classList.contains('has-focus')\n    );\n  }\n\n  get selectedItem() {\n    return this.getItems.find((i) => i.selected);\n  }\n\n  private async setActiveFocusItem(item?: ValidElement, focus = true) {\n    const items = this.getItems;\n    let activeItem =\n      !item || item.disabled ? items.find((i) => i.selected) || items[0] : item;\n\n    items\n      .filter((i) => i.tagName.toLowerCase() === 'nano-option')\n      .map((i: HTMLNanoOptionElement) =>\n        i.setAttribute('tabindex', i === activeItem ? '0' : '-1')\n      );\n\n    if (!focus) return;\n\n    if (activeItem) {\n      (activeItem as NNI).setFocus\n        ? (activeItem as NNI).setFocus()\n        : activeItem.focus();\n    } else this.menu.focus();\n  }\n\n  // Event Handlers\n\n  @Listen('mousedown', { target: 'body' })\n  @Listen('keydown')\n  handleBlur(e: KeyboardEvent | MouseEvent) {\n    if (!this.hasFocus) return;\n\n    const kev = e as KeyboardEvent;\n    let found: boolean;\n\n    if (kev.key) {\n      if (kev.key !== 'Tab') return;\n      found =\n        getActiveElement() &&\n        getActiveElement().closest(this.el.tagName.toLowerCase()) === this.el;\n    } else found = !!e.composedPath().find((el) => el === this.el);\n\n    if (!found) {\n      this.resetActiveItem();\n      this._hasFocus = false;\n      this.nanoBlur.emit();\n    }\n  }\n\n  private handleFocus = () => {\n    this.setActiveFocusItem(this.selectedItem || this.getItems[0]);\n\n    this._hasFocus = true;\n    this.nanoFocus.emit();\n  };\n\n  private handleClick = (event: MouseEvent) => {\n    const target = event.target as HTMLElement;\n    const item = target.closest('nano-nav-item');\n\n    if (item && !item.disabled) {\n      this.nanoSelect.emit(item);\n    }\n  };\n\n  private handleKeyDown = (event: KeyboardEvent) => {\n    // When keying through the menu, if the mouse happens to be hovering over a menu item and the menu scrolls, the\n    // mouseout/mouseover event will fire causing the selection to be different than what the user expects. This gives\n    // us a way to temporarily ignore mouse events while the user is interacting with a keyboard.\n    clearTimeout(this.ignoreMouseTimeout);\n    this.ignoreMouseTimeout = setTimeout(\n      () => (this.ignoreMouseEvents = false),\n      500\n    );\n    this.ignoreMouseEvents = true;\n\n    // Make a selection when pressing enter\n    switch (event.key) {\n      case ' ':\n        if (this.activeItem) this.activeItem.click();\n        break;\n      case 'ArrowDown':\n      case 'ArrowUp':\n      case 'PageDown':\n      case 'PageUp':\n      case 'Home':\n      case 'End':\n        const items = this.getItems;\n        const selectedItem = this.activeItem;\n        let index = items.indexOf(selectedItem);\n\n        if (items.length) {\n          event.preventDefault();\n\n          if (event.key === 'ArrowDown') {\n            index++;\n          } else if (event.key === 'ArrowUp') {\n            index--;\n          } else if (event.key === 'Home' || event.key === 'PageUp') {\n            index = 0;\n          } else if (event.key === 'End' || event.key === 'PageDown') {\n            index = items.length - 1;\n          }\n\n          if (index < 0) index = items.length - 1;\n          if (index > items.length - 1) index = 0;\n\n          this.setActiveFocusItem(items[index]);\n          if (items[index]) items[index].scrollIntoView({ block: 'nearest' });\n          return;\n        }\n        break;\n    }\n\n    // Handle type-to-search behavior when non-control characters are entered\n    if (event.key === ' ' || /^[a-z0-9]+$/i.test(event.key)) {\n      clearTimeout(this.typeToSelectTimeout);\n      this.typeToSelectTimeout = setTimeout(\n        () => (this.typeToSelect = ''),\n        750\n      );\n      this.typeToSelect += event.key;\n\n      const items = this.getItems;\n      for (const item of items) {\n        const slot = item.shadowRoot.querySelector(\n          'slot:not([name])'\n        ) as HTMLSlotElement;\n        const label = getTextContent(slot).toLowerCase().trim();\n        if (\n          label.substring(0, this.typeToSelect.length) === this.typeToSelect\n        ) {\n          this.setActiveFocusItem(item);\n          break;\n        }\n      }\n    }\n  };\n\n  private handleMouseOver = (event: MouseEvent) => {\n    const target = event.target as HTMLElement;\n    const item =\n      target.closest('nano-nav-item') || target.closest('nano-option');\n\n    if (item && !this.ignoreMouseEvents) {\n      this.setActiveFocusItem(item);\n    }\n  };\n\n  // Component Lifecycle\n\n  render() {\n    return (\n      <Host\n        class={{\n          legacy: !CANSHADOW,\n        }}\n      >\n        <div\n          onClick={this.handleClick}\n          onKeyDown={this.handleKeyDown}\n          onMouseOver={this.handleMouseOver}\n          onFocus={this.handleFocus}\n          aria-label={this.label ? this.label : undefined}\n          role={this.type}\n          ref={(el) => (this.menu = el)}\n          part=\"base\"\n          class={{\n            menu: true,\n            ['menu--' + this.type]: true,\n            'menu--has-focus': this.hasFocus,\n          }}\n          tabIndex={-1}\n        >\n          <slot />\n        </div>\n      </Host>\n    );\n  }\n}\n","@use 'sass:map';\n@use 'sass:list';\n\n@import '../../global/style/utilities/globals';\n@import '../../global/style/nano-theme/form';\n@import '../../global/style/nano-theme/base';\n@import '../../global/style/nano-theme/layers';\n\n:host {\n  /**\n   * @prop --padding-top: Defaults to #{$spacing-small};\n   * @prop --padding-bottom: Defaults to #{$spacing-small};\n   * @prop --padding-start: Defaults to #{$spacing-small};\n   * @prop --padding-end: Defaults to #{$spacing-small};\n\n   * @prop --bg: default background. Defaults to none;\n   * @prop --bg-selected: background when selected. Defaults to #{$select-opt-selected};\n   * @prop --bg-focus: background when focused. Defaults to var(--nano-color-base, #{nano-color(primary, tint)});\n   * @prop --bg-disabled: background when disabled. Defaults to none;\n\n   * @prop --color: default text color. Defaults to var(--input-text-color, #{$input-text-color});\n   * @prop --color-selected: text color when selected. Defaults to var(--nano-color-base, #{nano-color(primary, base)});\n   * @prop --color-focus: text color when focused. Defaults to var(--nano-color-base, #{nano-color(primary, contrast)});\n   * @prop --color-disabled: text color when disabled. Defaults to #{map.get($colors, palegrey)};\n\n    * @prop --opt-icon-size: Sizes all icons within the option. Defaults to 1.4em;\n  */\n\n  --bg: none;\n  --bg-selected: #{$select-opt-selected};\n  --bg-focus: var(--nano-color-base, #{nano-color(primary, tint)});\n  --bg-disabled: none;\n  --color: var(--input-text-color, #{$input-text-color});\n  --color-selected: var(--nano-color-base, #{nano-color(primary, base)});\n  --color-focus: var(--nano-color-contrast, #{nano-color(primary, contrast)});\n  --color-disabled: #{map.get($colors, palegrey)};\n  --opt-icon-size: 1.6em;\n\n  display: block;\n  color: var(--color);\n  overflow: hidden;\n  font-size: 14px;\n  font-size: #{'clamp(12px, .9em, 16px)'};\n}\n\n:host(:focus) {\n  outline: none;\n}\n\n.option {\n  $self: &;\n\n  position: relative;\n  user-select: none;\n  cursor: pointer;\n  display: flex;\n  align-items: stretch;\n  width: 100%;\n  background: var(--bg);\n\n  @include padding(\n    var(--padding-top),\n    var(--padding-end),\n    var(--padding-bottom),\n    var(--padding-start)\n  );\n\n  // focus\n  :host(:focus) &:not(.option--disabled),\n  :host &.option--selected {\n    outline: none;\n    background: var(--bg-selected);\n    color: var(--color-selected);\n  }\n\n  :host(:focus) &:not(.option--disabled) {\n    background: var(--bg-focus);\n    color: var(--color-focus);\n  }\n\n  // disabled\n  &.option--disabled {\n    outline: none;\n    color: var(--color-disabled);\n    cursor: not-allowed;\n    background: var(--bg-disabled);\n  }\n\n  // no value\n  &.option--novalue {\n    font-style: italic;\n    opacity: 0.7;\n  }\n\n  &__label {\n    flex: 1 1 auto;\n    display: flex;\n    align-items: center;\n  }\n\n  &__start {\n    flex: 0 0 auto;\n    display: flex;\n    align-items: center;\n\n    ::slotted(nano-icon) {\n      font-size: var(--opt-icon-size);\n    }\n\n    ::slotted(:last-child) {\n      @include margin(null, 0.5em, null, null);\n    }\n  }\n\n  &__end {\n    flex: 0 0 auto;\n    display: flex;\n    align-items: center;\n\n    ::slotted(nano-icon) {\n      font-size: var(--opt-icon-size);\n    }\n\n    ::slotted(:first-child) {\n      @include margin(null, null, null, 0.5em);\n    }\n  }\n\n  &__check {\n    visibility: hidden;\n    display: flex;\n    position: absolute;\n    left: 0.6em;\n    top: calc(50% - 0.6em);\n    align-items: center;\n    font-size: 0.9em;\n\n    #{$self}--selected:not(#{$self}--novalue) & {\n      visibility: visible;\n    }\n  }\n}\n","import {\n  Component,\n  Prop,\n  h,\n  Host,\n  State,\n  Watch,\n  Element,\n  Listen,\n  Event,\n  EventEmitter,\n} from '@stencil/core';\nimport { OptionInterface } from '../../interface';\nimport { debounce, getDirectChildren } from '../../utils';\n\nlet optIds = 0;\n\n/**\n * Select options to be used with [nano-select](/story/nano-components-select) or [nano-datalist](/story/nano-components-select)\n *\n * @slot - main label. Defaults to `label` or `value` prop\n * @slot checked-icon - icon to indicated checked / selected state. Defaults to fontawesome light/check\n * @slot start - suitable for an icon or content displayed at the start of the main label\n * @slot end - suitable for an icon or content displayed at the end of the main label\n */\n@Component({\n  tag: 'nano-option',\n  styleUrl: 'option.scss',\n  shadow: true,\n})\nexport class Option implements OptionInterface {\n  private optId = `nano-option-${optIds++}`;\n  @Element() host: HTMLNanoOptionElement;\n  @State() hasFocus = false;\n\n  constructor() {\n    this.handleClick = debounce(this.handleClick.bind(this), 5);\n  }\n\n  // Public API\n\n  /**\n   * Value of the option\n   */\n  @Prop({ mutable: true, reflect: true }) value: string = '';\n\n  @Watch('value')\n  valueChanged() {\n    if (!this.value || !this.value.length) this.value = this.labelContent;\n  }\n\n  /**\n   * Label of the option\n   */\n  @Prop({ mutable: true, reflect: true }) label: string = '';\n\n  @Watch('label')\n  labelChanged() {\n    if (!this.label || !this.label.length)\n      this.label = this.labelContent.length ? this.labelContent : this.value;\n  }\n\n  /**\n   * Whether this option is selected\n   */\n  @Prop({ reflect: true }) selected: boolean = false;\n\n  /**\n   * Whether this option should be disabled\n   */\n  @Prop({ reflect: true }) disabled: boolean = false;\n\n  /** You can add extra meta for this option. When displayed in a list, users\n   * search / filter via extra related terms. Another usecase is 'endonyms'\n   */\n  @Prop() filterMeta: string = '';\n\n  /** Fired when an option is selected */\n  @Event() nanoSelect!: EventEmitter<HTMLNanoOptionElement>;\n\n  // Event handlers\n\n  // stop scrolling on select\n  @Listen('keydown')\n  handleKeyDown(e: KeyboardEvent) {\n    if (e.key !== ' ' && e.key !== 'Enter') return;\n    e.preventDefault();\n    this.nanoSelect.emit(this.host);\n  }\n\n  private handleClick() {\n    if (this.disabled) return;\n    this.nanoSelect.emit(this.host);\n  }\n\n  // Private logic\n\n  private get labelContent() {\n    return getDirectChildren(this.host, '*:not([slot])', false)\n      .map((el) => el.textContent)\n      .join(' ')\n      .trim();\n  }\n\n  // Component lifecycle\n\n  componentWillLoad() {\n    this.valueChanged();\n    this.labelChanged();\n  }\n\n  render() {\n    return (\n      <Host\n        role=\"option\"\n        aria-selected={this.selected ? 'true' : 'false'}\n        aria-disabled={this.disabled ? 'true' : 'false'}\n      >\n        <div\n          onMouseDown={this.handleClick}\n          id={this.optId}\n          class={{\n            option: true,\n            'option--selected': this.selected,\n            'option--disabled': this.disabled,\n            'option--novalue': !this.value,\n          }}\n        >\n          <div part=\"check-icon\" class=\"option__check\">\n            <slot name=\"check-icon\">\n              <nano-icon name=\"light/check\" aria-hidden=\"true\" />\n            </slot>\n          </div>\n          <div part=\"start\" class=\"option__start\">\n            <slot name=\"start\"></slot>\n          </div>\n          <div part=\"label\" class=\"option__label\">\n            <slot>{this.label || this.value}</slot>\n          </div>\n          <div part=\"end\" class=\"option__end\">\n            <slot name=\"end\"></slot>\n          </div>\n        </div>\n      </Host>\n    );\n  }\n}\n"]}

package/dist/nano-components/p-ac5e3775.system.entry.js

@@ -0,0 +1,5 @@
+var __awaiter=this&&this.__awaiter||function(t,e,i,s){function n(t){return t instanceof i?t:new i((function(e){e(t)}))}return new(i||(i=Promise))((function(i,o){function r(t){try{h(s.next(t))}catch(e){o(e)}}function c(t){try{h(s["throw"](t))}catch(e){o(e)}}function h(t){t.done?i(t.value):n(t.value).then(r,c)}h((s=s.apply(t,e||[])).next())}))};var __generator=this&&this.__generator||function(t,e){var i={label:0,sent:function(){if(o[0]&1)throw o[1];return o[1]},trys:[],ops:[]},s,n,o,r;return r={next:c(0),throw:c(1),return:c(2)},typeof Symbol==="function"&&(r[Symbol.iterator]=function(){return this}),r;function c(t){return function(e){return h([t,e])}}function h(r){if(s)throw new TypeError("Generator is already executing.");while(i)try{if(s=1,n&&(o=r[0]&2?n["return"]:r[0]?n["throw"]||((o=n["return"])&&o.call(n),0):n.next)&&!(o=o.call(n,r[1])).done)return o;if(n=0,o)r=[r[0]&2,o.value];switch(r[0]){case 0:case 1:o=r;break;case 4:i.label++;return{value:r[1],done:false};case 5:i.label++;n=r[1];r=[0];continue;case 7:r=i.ops.pop();i.trys.pop();continue;default:if(!(o=i.trys,o=o.length>0&&o[o.length-1])&&(r[0]===6||r[0]===2)){i=0;continue}if(r[0]===3&&(!o||r[1]>o[0]&&r[1]<o[3])){i.label=r[1];break}if(r[0]===6&&i.label<o[1]){i.label=o[1];o=r;break}if(o&&i.label<o[2]){i.label=o[2];i.ops.push(r);break}if(o[2])i.ops.pop();i.trys.pop();continue}r=e.call(t,i)}catch(c){r=[6,c];n=0}finally{s=o=0}if(r[0]&5)throw r[1];return{value:r[0]?r[1]:void 0,done:true}}};
+/*!
+ * Web Components for Nanopore digital Web Apps
+ */System.register(["./p-f48be9f5.system.js","./p-1c216ca4.system.js","./p-1d13dbdf.system.js","./p-ef053a2f.system.js"],(function(t){"use strict";var e,i,s,n,o,r,c,h,a,l;return{setters:[function(t){e=t.r;i=t.c;s=t.h;n=t.e;o=t.g},function(t){r=t.r;c=t.h;h=t.b},function(t){a=t.a},function(t){l=t.d}],execute:function(){var u=':host{-webkit-box-sizing:border-box;box-sizing:border-box}*,*::before,*::after{-webkit-box-sizing:border-box;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-width:100%}:host([sticky]){position:-webkit-sticky;position:sticky;-webkit-transition:0.3s ease transform;transition:0.3s ease transform;will-change:min-height}:host([sticky][stuck]){left:var(--stuck-left);right:var(--stuck-right);z-index:var(--stuck-z-index) !important}:host([sticky][hide][placed-top]){-webkit-transform:var(--top-hide);transform:var(--top-hide)}:host([sticky][hide][placed-bottom]){-webkit-transform:var(--bottom-hide);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-width:inherit;width:100%}.sticker:not(.stuck){width:auto !important}.sticker.sticky{-webkit-transition:0.3s ease all;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;left:var(--stuck-left);right:var(--stuck-right);z-index:var(--stuck-z-index);-webkit-transform:translateY(0);transform:translateY(0)}:host([placed-top]) .sticker.stuck{top:0}:host([placed-bottom]) .sticker.stuck{bottom:0}:host([placed-top]) .sticker.stuck.hide{-webkit-transform:var(--top-hide);transform:var(--top-hide)}:host([placed-bottom]) .sticker.stuck.hide{-webkit-transform:var(--bottom-hide);transform:var(--bottom-hide)}.sticker-content{display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap}';function f(t){return t instanceof Document?window.pageYOffset:t.scrollTop}function d(t,e){var i=e instanceof Document?document.documentElement:e;return a(t,i)}var p=t("nano_sticker",function(){function t(t){var s=this;e(this,t);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.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._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.setupParentResizeListener=function(){if(s.parentSizeObserver){s.parentSizeObserver.disconnect();s.parentSizeObserver=undefined}s.parentSizeObserver=new ResizeObserver((function(t){for(var e=0,i=t;e<i.length;e++){var n=i[e];var o=void 0,r=void 0;if(n.contentRect.height)o=n.contentRect.height;if(n.contentRect.width)r=n.contentRect.width;if(typeof s.quietMode==="object"){if(r<s.quietMode.w||o<s.quietMode.h)s.quietModeIsOn=true;else s.quietModeIsOn=false}if(s.breakPointMin){if(r>s.breakPointMin)s.isSticky=true;else s.isSticky=false}if(s.breakPointMax){if(r<s.breakPointMax)s.isSticky=true;else s.isSticky=false}if(s.isRootSticker&&s.sticker&&s.autoResize)s.sticker.style.width=s.host.scrollWidth+"px"}}));var t=s.scrollParent instanceof Document?s.scrollParent.documentElement:s.scrollParent;if(t)s.parentSizeObserver.observe(t)};this.onStickToDisplayEvent=function(t){if(t.detail.sticker!==s.stickToEle)return;switch(t.type){case"nanoHide":s._offset=0;s.cacheOffset=s.offset;s.offset=0;if(!s.isStuck)s.moveTrigger(false);if(!s.isRootSticker&&s.quietModeIsOn){r((function(){s.stickToEle.style.minHeight=s.stickToEleInitSize.height+(s.host.scrollHeight+(typeof s.cacheOffset==="object"?s.cacheOffset.v:s.cacheOffset))+"px";s.stickToEle.setTriggerPos(s.stickToEleInitSize.height*-1)}))}break;case"nanoShow":s._offset=s.stickToEleInitSize.height;s.offset=s.cacheOffset;s.moveTrigger(true);if(!s.isRootSticker&&s.quietModeIsOn){r((function(){s.stickToEle.style.minHeight="";s.stickToEle.setTriggerPos(0)}))}break;case"nanoStuck":s.stickToEleInitSize=s.stickToEle.getBoundingClientRect();s._offset=s.stickToEleInitSize.height;break}};this.onStickEvent=function(t){return __awaiter(s,void 0,void 0,(function(){var e,i;return __generator(this,(function(s){switch(s.label){case 0:e=t.detail?t.detail.sticker:null;if(!e||e.position!==this.position)return[2];return[4,e.getTriggerPos()];case 1:i=s.sent();if(t.type==="nanoStuck"&&e!==this.host&&e.scrollParent===this.host.scrollParent){this.stickerIndex++;if(!this.hideOnNewStickers)return[2];if(this.positions.includes("top")&&this.triggerPos.top<i.top||this.positions.includes("bottom")&&this.triggerPos.top>i.top){this.multiStickerHide=true;this.stuckCounter++}}if(t.type==="nanoUnstuck"&&e!==this.host&&e.scrollParent===this.host.scrollParent){this.stickerIndex--;if(!this.hideOnNewStickers)return[2];if(this.positions.includes("top")&&this.triggerPos.top<i.top||this.positions.includes("bottom")&&this.triggerPos.top>i.top){this.stuckCounter--;if(this.stuckCounter<1)this.multiStickerHide=false}}return[2]}}))}))};this.onScroll=function(){var t=f(s.scrollParent);if(t<s.scrollPosCache){if(!s.positions.includes("bottom"))s.handleScrollTo();else s.handleScrollAway(t)}if(t>s.scrollPosCache){if(!s.positions.includes("bottom"))s.handleScrollAway(t);else s.handleScrollTo()}s.scrollPosCache=t}}t.prototype.isHiding=function(){return __awaiter(this,void 0,void 0,(function(){return __generator(this,(function(t){return[2,this.hide]}))}))};t.prototype.isSticking=function(){return __awaiter(this,void 0,void 0,(function(){return __generator(this,(function(t){this.shouldStick();return[2,this.isStuck]}))}))};t.prototype.setTriggerPos=function(t){return __awaiter(this,void 0,void 0,(function(){return __generator(this,(function(e){return[2,this._offset=t]}))}))};t.prototype.getTriggerPos=function(){return __awaiter(this,void 0,void 0,(function(){return __generator(this,(function(t){return[2,this.triggerPos]}))}))};t.prototype.pauseHiding=function(t){return __awaiter(this,void 0,void 0,(function(){return __generator(this,(function(e){return[2,this.pauseHide=t]}))}))};t.prototype.updateTriggerOffset=function(){if(!this.trigger||!this.scrollParent||!this.listenForScrollParent)return;this.triggerPos=d(this.trigger,this.scrollParent)};t.prototype.stickerResizeListener=function(){var t=this;if(this.contentSizeObserver){this.contentSizeObserver.disconnect();this.contentSizeObserver=undefined}this.contentSizeObserver=new ResizeObserver((function(e){for(var i=0,s=e;i<s.length;i++){var n=s[i];if(t.pauseResizeWatcher)return;if(n.contentRect.height){if(t.position==="top")t.host.style.height=n.contentRect.height+"px";if(t.position==="bottom")t.host.style.minHeight=n.contentRect.height+"px"}}}));this.contentSizeObserver.observe(this.content)};t.prototype.quietModeChange=function(){var t=this;if(this.quietMode==="on")r((function(){return t.quietModeIsOn=true}));else if(this.quietMode==="off")r((function(){return t.quietModeIsOn=false}))};t.prototype.setOffset=function(){var t,e,i,s;var n=this;this.trigger.setAttribute("style","");var o,r,c,a;var l=this.isRootSticker||this.stickToEle?this.sticker:this.host;if(!l)return;if(typeof this.offset==="object")t=this.offset,o=t.v,r=t.h;else o=r=this.offset;if(typeof this._offset==="object")e=this._offset,i=e.v,o=i===void 0?c:i,s=e.h,r=s===void 0?a:s;else c=a=this._offset;var u=function(t){var e=t.match(/(top|bottom)/)?o:r;f(t);l.style[t]=e+"px";if(!h())return;if(e)n.host.style.setProperty("--hide-transform-amount","(110% + "+e+"px)");else n.host.style.setProperty("--hide-transform-amount",null)};var f=function(t){var e=t.match(/(top|bottom)/)?o+c:r+a;n.trigger.style[t]=e*-1+"px";n.trigger.style.position="relative";n.trigger.style.height="1px"};if(this.positions.includes("start")&&this.isRtl||this.positions.includes("end")&&!this.isRtl)u("right");if(this.positions.includes("end")&&this.isRtl||this.positions.includes("start")&&!this.isRtl)u("left");if(this.positions.includes("top"))u("top");if(this.positions.includes("bottom"))u("bottom")};t.prototype.positionChange=function(){this.positions=this.position.split("-");this.setOffset()};t.prototype.stuckChange=function(){return __awaiter(this,void 0,void 0,(function(){var t;var e=this;return __generator(this,(function(i){if(this.isStuck){if(this.stickToEle){t=c(this.host)?this.host.children:this.content.children;this.slottedContent=Array.from(t);this.slottedContent.forEach((function(t){if(c(e.host))e.stickToEle.appendChild(t);else e.stickToEle.querySelector(".sticker-content").appendChild(t);t.style.order=e.stickerIndex+""}));this.nanoStuck.emit({sticker:this.stickToEle})}else this.nanoStuck.emit({sticker:this.host})}else{this.scrollHide=false;if(this.stickToEle){this.slottedContent.forEach((function(t){e.host.appendChild(t);t.style.order=""}));this.nanoUnstuck.emit({sticker:this.stickToEle})}else this.nanoUnstuck.emit({sticker:this.host})}return[2]}))}))};t.prototype.attachScrollListeners=function(){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)}};t.prototype.handleParentEvents=function(t,e){if(e===void 0){e=null}if(!this.listenForScrollParent)return;if(e)this.manageListenersOnParent(false,e);if(this.scrollParent)this.manageListenersOnParent(!this.stickToEle)};t.prototype.stickToEleChange=function(t,e){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(e){e.removeEventListener("nanoHide",this.onStickToDisplayEvent);e.removeEventListener("nanoShow",this.onStickToDisplayEvent);e.removeEventListener("nanoStuck",this.onStickToDisplayEvent);e.removeEventListener("nanoUnstuck",this.onStickToDisplayEvent)}};t.prototype.stickToChange=function(){if(this.stickTo)this.stickToEle=this.scrollParent.querySelector(this.stickTo);else this.stickToEle=undefined};t.prototype.visibilityDecisionHandler=function(){if(this.multiStickerHide||this.scrollHide)this.hide=true;else this.hide=false};t.prototype.handleHideChange=function(){if(this.hide)this.nanoHide.emit({sticker:this.host});else this.nanoShow.emit({sticker:this.host})};t.prototype.setupIO=function(){var t=this;if(this.io){this.io.disconnect();this.io=undefined}if(!this.scrollParent||!this.hasBootstrapped||!this.trigger)return;this.isRootSticker=this.scrollParent instanceof Document;var e=this.scrollParent;if(this.scrollParent instanceof Document)e=null;this.io=new window.IntersectionObserver((function(e){if(t.pauseResizeWatcher||!t.isSticky)return;t.shouldStick(e.slice(-1)[0])}),{root:e});this.io.observe(this.trigger)};t.prototype.manageListenersOnParent=function(t,e){var i=e||this.scrollParent;if(!i)return;if(!t){try{if(this.quietModeIsOn)i.removeEventListener("scroll",this.onScroll);i.removeEventListener("nanoStuck",this.onStickEvent);i.removeEventListener("nanoUnstuck",this.onStickEvent)}catch(s){console.error("Events haven`t been added")}}else{i.addEventListener("nanoStuck",this.onStickEvent);i.addEventListener("nanoUnstuck",this.onStickEvent);if(this.quietModeIsOn)this.attachScrollListeners()}this.setupParentResizeListener()};t.prototype.handleScrollTo=function(){this.scrollPosThresholdCache=null;if(!this.scrollHide)return;if(this.scrollingTo!==true){this._offset=this.cacheOffset||this._offset}this.scrollingTo=true;this.scrollHide=false};t.prototype.handleScrollAway=function(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};t.prototype.moveTrigger=function(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)};t.prototype.getScrollParent=function(){var t=/(auto|scroll)/;var e=function(t,i){if(t.parentNode===null){return i}return e(t.parentNode,i.concat([t]))};var i=function(t,e){return getComputedStyle(t,null).getPropertyValue(e)};var s=function(t){return i(t,"overflow")+i(t,"overflow-y")+i(t,"overflow-x")};var n=function(e){return t.test(s(e))};var o=document.documentElement.getBoundingClientRect().height;var r=function(t){if(!(t instanceof HTMLElement))return;var i=e(t,[]);return i.find((function(t){return n(t)&&t.getBoundingClientRect().height!==o}))||document};return r(this.host)};t.prototype.shouldStick=function(t){var e;if(this.positions.includes("top")){if(!this.isRootSticker)e=d(this.trigger,this.scrollParent).top;else e=this.trigger.getBoundingClientRect().top;this.isStuck=e<-1}else if(this.positions.includes("bottom")){e=this.trigger.getBoundingClientRect().top;var i=t&&t.rootBounds?t.rootBounds:(this.scrollParent instanceof Document?document.documentElement:this.scrollParent).getBoundingClientRect();this.isStuck=e>i.height+i.top}};t.prototype.bootstrapGurantor=function(){var t=this;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((function(e){return e.position===t.position})).findIndex((function(e){return e===t.host}));this.setOffset();this.stickerResizeListener();this.setupParentResizeListener();this.slottedContent=Array.from(this.host.children);this.slottedContent.forEach((function(e){e.style.order=t.stickerIndex+""}));this.updateTriggerOffset();this.stickToChange();this.setupIO();this.onStickToDisplayEvent=l(this.onStickToDisplayEvent,50)};t.prototype.connectedCallback=function(){var t=this;this.isRtl=this.host.dir==="rtl"||this.host.ownerDocument.dir==="rtl";document.documentElement.addEventListener("nanoComponentsReady",(function(){setTimeout((function(e){return t.bootstrapGurantor()}),200)}));setTimeout((function(e){if(!t.hasBootstrapped)t.bootstrapGurantor()}),1e3)};t.prototype.disconnectedCallback=function(){if(this.io){this.io.disconnect();this.io=undefined}if(this.parentSizeObserver){this.parentSizeObserver.disconnect();this.parentSizeObserver=undefined}this.scrollParent=null;this.hasBootstrapped=false};t.prototype.render=function(){var t=this;return s(n,{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:function(e){return t.sticker=e}},s("div",{class:"sticker-content",ref:function(e){return t.content=e}},s("slot",null))))};Object.defineProperty(t.prototype,"host",{get:function(){return o(this)},enumerable:false,configurable:true});Object.defineProperty(t,"watchers",{get:function(){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"]}},enumerable:false,configurable:true});return t}());p.style=u}}}));
+//# sourceMappingURL=p-ac5e3775.system.entry.js.map

package/dist/nano-components/p-ac5e3775.system.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["src/components/sticker/sticker.scss?tag=nano-sticker&encapsulation=shadow","src/components/sticker/sticker.tsx"],"names":["stickerCss","_getScrollTop","ele","Document","window","pageYOffset","scrollTop","_getOffset","parent","parentEle","document","documentElement","getOffset","Sticker","exports","class_1","hostRef","_this","this","isRtl","scrollPosCache","scrollPosThresholdCache","cacheOffset","pauseResizeWatcher","listenForScrollParent","positions","pauseHide","hasBootstrapped","isStuck","isRootSticker","hide","scrollHide","multiStickerHide","scrollingTo","quietModeIsOn","stuckCounter","stickerIndex","_offset","autoResize","isSticky","offset","position","quietMode","h","w","hideOnNewStickers","breakPointMax","breakPointMin","setupParentResizeListener","parentSizeObserver","disconnect","undefined","ResizeObserver","entries","_i","entries_1","length","entry","height","width","contentRect","sticker","style","host","scrollWidth","toWatch","scrollParent","observe","onStickToDisplayEvent","e","detail","stickToEle","type","moveTrigger","raf","minHeight","stickToEleInitSize","scrollHeight","v","setTriggerPos","getBoundingClientRect","onStickEvent","__awaiter","getTriggerPos","incomingTriggerPos","_a","sent","includes","triggerPos","top","onScroll","y","handleScrollTo","handleScrollAway","prototype","isHiding","isSticking","shouldStick","pauseHiding","pause","updateTriggerOffset","trigger","stickerResizeListener","contentSizeObserver","entries_2","content","quietModeChange","setOffset","setAttribute","_v","_h","_b","_c","_d","setPos","pos","u","match","setTriggetPos","browserCanUseCssVariables","setProperty","positionChange","split","stuckChange","hasShadowDom","children","slottedContent","Array","from","forEach","child","appendChild","querySelector","order","nanoStuck","emit","nanoUnstuck","attachScrollListeners","addEventListener","passive","capture","removeEventListener","handleParentEvents","_","oldParent","manageListenersOnParent","stickToEleChange","oldEle","stickToChange","stickTo","visibilityDecisionHandler","handleHideChange","nanoHide","nanoShow","setupIO","io","root","IntersectionObserver","slice","addEvents","console","error","currScroll","Math","abs","toInitial","parentNode","insertBefore","nextSibling","getScrollParent","regex","parents","_node","ps","concat","prop","getComputedStyle","getPropertyValue","overflow","scroll","test","docHeight","HTMLElement","find","data","scrollAmt","parentBounding","rootBounds","bootstrapGurantor","createElement","classList","add","querySelectorAll","filter","findIndex","debounce","connectedCallback","dir","ownerDocument","setTimeout","disconnectedCallback","render","Host","sticky","siblings","index","stuck","placed-bottom","placed-top","placed-end","placed-start","class","ref","div"],"mappings":"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","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-width: 100%;\n}\n\n:host([sticky]) {\n  position: sticky;\n  transition: 0.3s ease transform;\n  will-change: min-height;\n}\n\n:host([sticky][stuck]) {\n  left: var(--stuck-left);\n  right: 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-width: inherit;\n  width: 100%;\n\n  &:not(.stuck) {\n    width: 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    left: var(--stuck-left);\n    right: var(--stuck-right);\n    z-index: var(--stuck-z-index);\n    transform: translateY(0);\n\n    :host([placed-top]) & {\n      top: 0;\n    }\n\n    :host([placed-bottom]) & {\n      bottom: 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 {\n  browserCanUseCssVariables,\n  debounce,\n  getOffset,\n  hasShadowDom,\n  raf,\n} from '../../utils';\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  let 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   * A JS query selector that returns a <nano-sticker> */\n  @Prop() stickTo: string;\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.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') raf(() => (this.quietModeIsOn = true));\n    else if (this.quietMode === 'off') raf(() => (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    let 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      let u = pos.match(/(top|bottom)/) ? v : h;\n      setTriggetPos(pos);\n      sticker.style[pos] = u + 'px';\n      if (!browserCanUseCssVariables()) return;\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      let 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.height = '1px';\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        let content = hasShadowDom(this.host)\n          ? this.host.children\n          : this.content.children;\n        this.slottedContent = Array.from(content);\n\n        this.slottedContent.forEach((child: HTMLElement) => {\n          if (hasShadowDom(this.host)) this.stickToEle.appendChild(child);\n          else\n            this.stickToEle\n              .querySelector('.sticker-content')\n              .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 (this.stickTo)\n      this.stickToEle = this.scrollParent.querySelector(this.stickTo);\n    else this.stickToEle = undefined;\n  }\n\n  /** 2 potential criteria for hiding. Multi-stickers or quietmode. */\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 'smallscreen', or there is a breakpointmax / min it will add a resizeobserver to conditionally add behaviour */\n  private setupParentResizeListener = () => {\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    let 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 ammend the hide/show trigger\n   * Main diffs from rootstickers / 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          raf(() => {\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          raf(() => {\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    let 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    let 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    let 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  /** Gets the 'closest' scrolling parent */\n  private getScrollParent() {\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 (!(_node instanceof HTMLElement)) 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 scrollAmt = this.trigger.getBoundingClientRect().top;\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 = 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.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 metthods\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"]}

package/dist/nano-components/p-b85cf493.system.entry.js

@@ -0,0 +1,5 @@
+var __awaiter=this&&this.__awaiter||function(e,t,a,o){function n(e){return e instanceof a?e:new a((function(t){t(e)}))}return new(a||(a=Promise))((function(a,i){function s(e){try{d(o.next(e))}catch(t){i(t)}}function r(e){try{d(o["throw"](e))}catch(t){i(t)}}function d(e){e.done?a(e.value):n(e.value).then(s,r)}d((o=o.apply(e,t||[])).next())}))};var __generator=this&&this.__generator||function(e,t){var a={label:0,sent:function(){if(i[0]&1)throw i[1];return i[1]},trys:[],ops:[]},o,n,i,s;return s={next:r(0),throw:r(1),return:r(2)},typeof Symbol==="function"&&(s[Symbol.iterator]=function(){return this}),s;function r(e){return function(t){return d([e,t])}}function d(s){if(o)throw new TypeError("Generator is already executing.");while(a)try{if(o=1,n&&(i=s[0]&2?n["return"]:s[0]?n["throw"]||((i=n["return"])&&i.call(n),0):n.next)&&!(i=i.call(n,s[1])).done)return i;if(n=0,i)s=[s[0]&2,i.value];switch(s[0]){case 0:case 1:i=s;break;case 4:a.label++;return{value:s[1],done:false};case 5:a.label++;n=s[1];s=[0];continue;case 7:s=a.ops.pop();a.trys.pop();continue;default:if(!(i=a.trys,i=i.length>0&&i[i.length-1])&&(s[0]===6||s[0]===2)){a=0;continue}if(s[0]===3&&(!i||s[1]>i[0]&&s[1]<i[3])){a.label=s[1];break}if(s[0]===6&&a.label<i[1]){a.label=i[1];i=s;break}if(i&&a.label<i[2]){a.label=i[2];a.ops.push(s);break}if(i[2])a.ops.pop();a.trys.pop();continue}s=t.call(e,a)}catch(r){s=[6,r];n=0}finally{o=i=0}if(s[0]&5)throw s[1];return{value:s[0]?s[1]:void 0,done:true}}};
+/*!
+ * Web Components for Nanopore digital Web Apps
+ */System.register(["./p-f48be9f5.system.js","./p-8378428e.system.js","./p-89edc042.system.js","./p-0784f2ad.system.js"],(function(e){"use strict";var t,a,o,n,i,s,r,d,l,c,u,h,f,b,p,v,y,g,_,m;return{setters:[function(e){t=e.h;a=e.r;o=e.c;n=e.e;i=e.g},function(e){s=e.b;r=e.D;d=e.i;l=e.p;c=e.d;u=e.s;h=e.e;f=e.f;b=e.g;p=e.h;v=e.j;y=e.k;g=e.a},function(e){_=e.c},function(e){m=e.f}],execute:function(){var x;(function(e){e[e["Sunday"]=0]="Sunday";e[e["Monday"]=1]="Monday";e[e["Tuesday"]=2]="Tuesday";e[e["Wednesday"]=3]="Wednesday";e[e["Thursday"]=4]="Thursday";e[e["Friday"]=5]="Friday";e[e["Saturday"]=6]="Saturday"})(x||(x={}));function D(e,t){if(e==null||t==null){return false}return e.getFullYear()===t.getFullYear()&&e.getMonth()===t.getMonth()&&e.getDate()===t.getDate()}function w(e,t){var a=new Date(e);a.setDate(a.getDate()+t);return a}function k(e,t){if(t===void 0){t=x.Monday}var a=new Date(e);var o=a.getDay();var n=(o<t?7:0)+o-t;a.setDate(a.getDate()-n);return a}function M(e,t){if(t===void 0){t=x.Monday}var a=new Date(e);var o=a.getDay();var n=(o<t?-7:0)+6-(o-t);a.setDate(a.getDate()+n);return a}function S(e){return new Date(e.getFullYear(),e.getMonth(),1)}function F(e){return new Date(e.getFullYear(),e.getMonth()+1,0)}function T(e,t,a){return N(e,t,a)===e}function N(e,t,a){var o=e.getTime();if(t&&t instanceof Date&&o<t.getTime()){return t}if(a&&a instanceof Date&&o>a.getTime()){return a}return e}function Y(e,t){var a=[];var o=e;while(!D(o,t)){a.push(o);o=w(o,1)}a.push(o);return a}function z(e,t){if(t===void 0){t=x.Monday}var a=k(S(e),t);var o=M(F(e),t);return Y(a,o)}var C=function(e){var a=e.focusedDay,o=e.today,n=e.day,i=e.onDaySelect,s=e.onKeyboardNavigation,r=e.focusedDayRef,d=e.inRange,l=e.disabled,c=e.isSelected;var u=D(n,o);var h=D(n,a);var f=n.getMonth()!==a.getMonth()||l;var b=!d;function p(e){i(e,n)}return t("button",{class:{"duet-date__day":true,"is-outside":b,"is-disabled":f,"is-today":u},tabIndex:h?0:-1,onClick:p,onKeyDown:s,disabled:b,type:"button","aria-pressed":c?"true":"false",ref:function(e){if(h&&e&&r){r(e)}}},t("span",{"aria-hidden":"true"},n.getDate()),t("span",{class:"duet-date__vhidden"},n.toLocaleDateString(undefined,{day:"numeric",month:"long"})))};function I(e,t){var a=[];for(var o=0;o<e.length;o+=t){a.push(e.slice(o,o+t))}return a}function L(e,t,a){return e.map((function(o,n){var i=(n+t)%e.length;return a(e[i])}))}var O=function(e){var a=e.selectedDate,o=e.focusedDate,n=e.labelledById,i=e.localization,s=e.firstDayOfWeek,r=e.min,d=e.max,l=e.onDateSelect,c=e.onKeyboardNavigation,u=e.focusedDayRef,h=e.onMouseDown,f=e.onFocusIn,b=e.isDateDisabled;var p=new Date;var v=z(o,s);return t("table",{class:"duet-date__table",role:"grid","aria-labelledby":n,onFocusin:f,onMouseDown:h},t("thead",null,t("tr",null,L(i.dayNames,s,(function(e){return t("th",{class:"duet-date__table-header",scope:"col"},t("span",{"aria-hidden":"true"},e.substr(0,2)),t("span",{class:"duet-date__vhidden"},e))})))),t("tbody",null,I(v,7).map((function(e){return t("tr",{class:"duet-date__row"},e.map((function(e){return t("td",{class:"duet-date__cell",role:"gridcell","aria-selected":D(e,a)?"true":undefined},t(C,{day:e,today:p,focusedDay:o,inRange:T(e,r,d),onDaySelect:l,onKeyboardNavigation:c,focusedDayRef:u,disabled:b(e),isSelected:D(e,a)}))})))}))))};var W={buttonLabel:"Choose date",placeholder:"YYYY-MM-DD",selectedDateMessage:"Selected date is",prevMonthLabel:"Previous month",nextMonthLabel:"Next month",monthSelectLabel:"Month",yearSelectLabel:"Year",closeLabel:"Close window",keyboardInstruction:"You can use arrow keys to navigate dates",calendarHeading:"Choose a date",dayNames:["Sunday","Monday","Tuesday","Wednesday","Thursday","Friday","Saturday"],monthNames:["January","February","March","April","May","June","July","August","September","October","November","December"],monthNamesShort:["Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec"]};var A=':host{-webkit-box-sizing:border-box;box-sizing:border-box}*,*::before,*::after{-webkit-box-sizing:border-box;box-sizing:border-box}[hidden]{display:none !important}:host{--background:var(--nano-layer-bg, #fff);--active-color:var(--nano-color-base, var(--nano-color-primary, #007495));--active-text-color:var(\n      --nano-color-contrast,\n      var(--nano-color-primary-contrast, #fff)\n    );--focus-shadow:var(--nano-control-focus-shadow, 0 0 0 0.1875rem  var(--nano-control-focus-color, rgba(144, 198, 231, 0.8)));--inactive-color:var(--nano-button-color, #f0efed);display:block;font-size:16px}:host(.nano-color){--active-color:var(--nano-color-base, var(--nano-color-primary, #007495));--active-text-color:var(--nano-color-contrast);--focus-shadow:0 0 0 0.1875rem rgba(var(--nano-color-tint-rgb), 0.56)}.duet-date *,.duet-date *::before,.duet-date *::after{-webkit-box-sizing:border-box;box-sizing:border-box;margin:0}.duet-date{-webkit-box-sizing:border-box;box-sizing:border-box;color:currentColor;display:block;margin:0;position:relative;text-align:left;width:100%}.duet-date__dialog{display:-webkit-box;display:-ms-flexbox;display:flex;top:100%;max-width:100%;width:100%}.duet-date__dialog.is-left{left:auto;right:0;width:auto}.duet-date__dialog-content{background:var(--background);min-width:290px;padding:16px 16px 20px;position:relative;-webkit-transform:none;transform:none;max-width:100%;width:100%}.duet-date__table{border-collapse:collapse;border-spacing:0;font-size:1em;line-height:1.25;text-align:center;width:100%}.duet-date__table-header{font-size:0.75em;font-weight:600;letter-spacing:1px;line-height:1.25;padding-bottom:8px;text-decoration:none;text-transform:uppercase}.duet-date__cell{text-align:center}.duet-date__day{-moz-appearance:none;-webkit-appearance:none;appearance:none;background:transparent;border:0;border-radius:50%;cursor:pointer;display:inline-block;font-size:0.875em;font-variant-numeric:tabular-nums;line-height:1.25;position:relative;text-align:center;vertical-align:middle;z-index:1;-webkit-transition:0.15s ease all;transition:0.15s ease all;height:2.5em;width:2.5em}.duet-date__day.is-today{-webkit-box-shadow:0 0 0 1px var(--active-color);box-shadow:0 0 0 1px var(--active-color);position:relative}.duet-date__day:hover::before,.duet-date__day.is-today::before{content:"";background:var(--active-color);border-radius:50%;bottom:0;left:0;opacity:0.16;position:absolute;right:0;top:0}[aria-selected=true] .duet-date__day{background:var(--active-color) !important;color:var(--active-text-color);-webkit-box-shadow:none;box-shadow:none;outline:0}.duet-date__day:active{background:var(--active-color);-webkit-box-shadow:var(--focus-shadow);box-shadow:var(--focus-shadow);color:var(--active-text-color)}.duet-date__day:focus{-webkit-box-shadow:var(--focus-shadow);box-shadow:var(--focus-shadow);outline:0}.duet-date__day.is-disabled{background:transparent;-webkit-box-shadow:none;box-shadow:none;cursor:default;opacity:0.5}.duet-date__day.is-disabled::before{display:none}.duet-date__day.is-outside{background:var(--inactive-color);-webkit-box-shadow:none;box-shadow:none;cursor:default;opacity:0.6;pointer-events:none}.duet-date__day.is-outside::before{display:none}.duet-date__header{-webkit-box-align:center;-ms-flex-align:center;align-items:center;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;margin-bottom:16px;width:100%}.duet-date__nav{white-space:nowrap}.duet-date__prev,.duet-date__next{background:var(--inactive-color);-moz-appearance:none;-webkit-appearance:none;-webkit-box-align:center;-ms-flex-align:center;align-items:center;appearance:none;border:0;border-radius:50%;cursor:pointer;display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;-ms-flex-pack:distribute;justify-content:space-around;margin-left:8px;padding:0;-webkit-transition:background-color 300ms ease;transition:background-color 300ms ease;font-size:0.9em;height:2.2em;width:2.2em}.duet-date__prev:focus,.duet-date__next:focus{-webkit-box-shadow:var(--focus-shadow);box-shadow:var(--focus-shadow);outline:0}.duet-date__prev:active:focus,.duet-date__next:active:focus{-webkit-box-shadow:none;box-shadow:none}.duet-date__prev:disabled,.duet-date__next:disabled{cursor:default;opacity:0.5}.duet-date__prev nano-icon,.duet-date__next nano-icon{margin:0 auto}.duet-date__select{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;margin-top:4px;position:relative}.duet-date__select span{margin-right:4px}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){.duet-date__select span{margin-right:unset;-webkit-margin-end:4px;margin-inline-end:4px}}.duet-date__select select{cursor:pointer;font-size:1em;height:100%;left:0;opacity:0;position:absolute;top:0;width:100%;z-index:2}.duet-date__select select.focus-visible:focus+.duet-date__select-label{-webkit-box-shadow:var(--focus-shadow);box-shadow:var(--focus-shadow)}.duet-date__select-label{-webkit-box-align:center;-ms-flex-align:center;align-items:center;border-radius:4px;display:-webkit-box;display:-ms-flexbox;display:flex;font-size:1.25em;font-weight:600;line-height:1.25;padding:0 4px 0 8px;pointer-events:none;position:relative;width:100%;z-index:1}.duet-date__select-label nano-icon{font-size:0.55em}.duet-date__vhidden{border:0;clip:rect(1px, 1px, 1px, 1px);height:1px;overflow:hidden;padding:0;position:absolute;top:0;width:1px}';function j(e,t){var a=[];for(var o=e;o<=t;o++){a.push(o)}return a}var P=e("nano_date_picker",function(){function e(e){var t=this;a(this,e);this.nanoDatePicked=o(this,"nanoDatePicked",7);this.monthSelectId=s("NanoDateMonth");this.yearSelectId=s("NanoDateYear");this.dialogLabelId=s("NanoDateLabel");this.initialTouchX=null;this.initialTouchY=null;this.activeFocus=false;this.focusedDay=new Date;this.selectedDate="";this.min="";this.max="";this.firstDayOfWeek=r.Monday;this.localization=W;this.isDateDisabled=function(){return false};this.isModal=false;this.enableActiveFocus=function(){t.activeFocus=true};this.disableActiveFocus=function(){t.activeFocus=false};this.handleTouchStart=function(e){var a=e.changedTouches[0];t.initialTouchX=a.pageX;t.initialTouchY=a.pageY};this.handleTouchMove=function(e){e.preventDefault()};this.handleTouchEnd=function(e){var a=e.changedTouches[0];var o=a.pageX-t.initialTouchX;var n=a.pageY-t.initialTouchY;var i=70;var s=Math.abs(o)>=i&&Math.abs(n)<=i;if(s){t.addMonths(o<0?1:-1)}t.initialTouchY=null;t.initialTouchX=null};this.handleNextMonthClick=function(e){e.preventDefault();t.addMonths(1)};this.handlePreviousMonthClick=function(e){e.preventDefault();t.addMonths(-1)};this.handleKeyboardNavigation=function(e){if(e.key==="Tab"&&!e.shiftKey&&t.isModal){e.preventDefault();var a=t.firstFocusEle||t.firstFocusableElement;a.focus();return}var o=true;switch(e.key){case"ArrowRight":t.addDays(1);break;case"ArrowLeft":t.addDays(-1);break;case"ArrowDown":t.addDays(7);break;case"ArrowUp":t.addDays(-7);break;case"PageUp":if(e.shiftKey){t.addYears(-1)}else{t.addMonths(-1)}break;case"PageDown":if(e.shiftKey){t.addYears(1)}else{t.addMonths(1)}break;case"Home":t.startOfWeek();break;case"End":t.endOfWeek();break;default:o=false}if(o){e.preventDefault();t.enableActiveFocus()}};this.handleDaySelect=function(e,a){var o=!t.isDateDisabled(a);var n=d(a,l(t.min),l(t.max));if(!n||!o){return}if(a.getMonth()===t.focusedDay.getMonth()){t.setValue(a)}else{t.setFocusedDay(a)}};this.handleMonthSelect=function(e){t.setMonth(parseInt(e.target.value,10))};this.handleYearSelect=function(e){t.setYear(parseInt(e.target.value,10))};this.processFocusedDayNode=function(e){t.focusedDayNode=e;if(t.activeFocus){setTimeout((function(){return e.focus()}),0)}}}e.prototype.setFocus=function(e,t){if(e===void 0){e=false}if(t===void 0){t=false}return __awaiter(this,void 0,void 0,(function(){var a=this;return __generator(this,(function(o){this.setFocusedDay(l(this.selectedDate)||new Date);if(e){setTimeout((function(e){return a.focusedDayNode.focus()}),20);return[2]}clearTimeout(this.focusTimeoutId);this.focusTimeoutId=setTimeout((function(){if(t)m.force(a.monthSelectNode);a.monthSelectNode.focus()}),20);return[2]}))}))};e.prototype.handleSelectedDateChange=function(){this.setFocus(true)};e.prototype.addDays=function(e){this.setFocusedDay(c(this.focusedDay,e))};e.prototype.addMonths=function(e){this.setMonth(this.focusedDay.getMonth()+e)};e.prototype.addYears=function(e){this.setYear(this.focusedDay.getFullYear()+e)};e.prototype.startOfWeek=function(){this.setFocusedDay(u(this.focusedDay,this.firstDayOfWeek))};e.prototype.endOfWeek=function(){this.setFocusedDay(h(this.focusedDay,this.firstDayOfWeek))};e.prototype.setMonth=function(e){var t=f(b(this.focusedDay),e);var a=p(t);var o=f(this.focusedDay,e);this.setFocusedDay(v(o,t,a))};e.prototype.setYear=function(e){var t=y(b(this.focusedDay),e);var a=p(t);var o=y(this.focusedDay,e);this.setFocusedDay(v(o,t,a))};e.prototype.setFocusedDay=function(e){this.focusedDay=v(e,l(this.min),l(this.max))};e.prototype.setValue=function(e){this.selectedDate=g(e);this.nanoDatePicked.emit({value:this.selectedDate,valueAsDate:e})};e.prototype.connectedCallback=function(){if(this.yearSelectNode)m.observe(this.yearSelectNode);if(this.monthSelectNode)m.observe(this.monthSelectNode)};e.prototype.componentWillLoad=function(){this.handleSelectedDateChange()};e.prototype.componentDidLoad=function(){this.connectedCallback()};e.prototype.disconnectedCallback=function(){m.unobserve(this.yearSelectNode);m.unobserve(this.monthSelectNode)};e.prototype.render=function(){var e=this;var a=l(this.selectedDate);var o=(a||this.focusedDay).getFullYear();var i=this.focusedDay.getMonth();var s=this.focusedDay.getFullYear();var r=l(this.min);var c=l(this.max);var u=r!=null&&r.getMonth()===i&&r.getFullYear()===s;var h=c!=null&&c.getMonth()===i&&c.getFullYear()===s;var f=o-10;var v=o+10;if(r)f=r.getFullYear();if(c)v=c.getFullYear();return t(n,{class:Object.assign({},_(this.color))},t("div",{class:"duet-date"},t("div",{class:{"duet-date__dialog":true,"is-active":true},onTouchMove:this.handleTouchMove,onTouchStart:this.handleTouchStart,onTouchEnd:this.handleTouchEnd},t("div",{class:"duet-date__dialog-content"},t("div",{class:"duet-date__vhidden duet-date__instructions","aria-live":"polite"},this.localization.keyboardInstruction),t("div",{class:"duet-date__header",onFocusin:this.disableActiveFocus},t("div",null,t("h2",{id:this.dialogLabelId,class:"duet-date__vhidden","aria-live":"polite"},this.localization.monthNames[i]," ",this.focusedDay.getFullYear()),t("label",{htmlFor:this.monthSelectId,class:"duet-date__vhidden"},this.localization.monthSelectLabel),t("div",{class:"duet-date__select"},t("select",{id:this.monthSelectId,class:"duet-date__select--month",ref:function(t){return e.firstFocusableElement=e.monthSelectNode=t},onChange:this.handleMonthSelect},this.localization.monthNames.map((function(e,a){return t("option",{key:e,value:a,selected:a===i,disabled:!d(new Date(s,a,1),r?b(r):null,c?p(c):null)},e)}))),t("div",{class:"duet-date__select-label","aria-hidden":"true"},t("span",null,this.localization.monthNamesShort[i]),t("nano-icon",{name:"light/chevron-down"}))),t("label",{htmlFor:this.yearSelectId,class:"duet-date__vhidden"},this.localization.yearSelectLabel),t("div",{class:"duet-date__select"},t("select",{id:this.yearSelectId,class:"duet-date__select--year",onChange:this.handleYearSelect,ref:function(t){return e.yearSelectNode=t}},j(f,v).map((function(e){return t("option",{key:e,selected:e===s},e)}))),t("div",{class:"duet-date__select-label","aria-hidden":"true"},t("span",null,this.focusedDay.getFullYear()),t("nano-icon",{name:"light/chevron-down"})))),t("div",{class:"duet-date__nav"},t("button",{class:"duet-date__prev",onClick:this.handlePreviousMonthClick,disabled:u,type:"button"},t("nano-icon",{name:"light/chevron-left"}),t("span",{class:"duet-date__vhidden"},this.localization.prevMonthLabel)),t("button",{class:"duet-date__next",onClick:this.handleNextMonthClick,disabled:h,type:"button"},t("nano-icon",{name:"light/chevron-right"}),t("span",{class:"duet-date__vhidden"},this.localization.nextMonthLabel)))),t("div",null,t(O,{selectedDate:a,focusedDate:this.focusedDay,onDateSelect:this.handleDaySelect,onKeyboardNavigation:this.handleKeyboardNavigation,labelledById:this.dialogLabelId,localization:this.localization,firstDayOfWeek:this.firstDayOfWeek,focusedDayRef:this.processFocusedDayNode,min:r,max:c,isDateDisabled:this.isDateDisabled}))))))};Object.defineProperty(e.prototype,"host",{get:function(){return i(this)},enumerable:false,configurable:true});Object.defineProperty(e,"watchers",{get:function(){return{selectedDate:["handleSelectedDateChange"]}},enumerable:false,configurable:true});return e}());P.style=A}}}));
+//# sourceMappingURL=p-b85cf493.system.entry.js.map