@nanoporetech-digital/components 3.1.1 → 3.3.0

package/dist/nano-components/p-1ae8c03e.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["src/utils/fetch.ts","src/components/global-nav/style/global-nav.scss?tag=nano-global-nav&encapsulation=shadow","src/components/global-nav/global-nav.tsx"],"names":["async","clientFetch","url","body","customConfig","headers","Accept","Access-Control-Allow-Origin","Content-Type","Cache","config","method","credentials","keepalive","mode","JSON","stringify","id","setTimeout","window","AbortController","controller","timeout","abort","signal","response","fetch","clearTimeout","ok","json","errorMessage","text","Error","globalNavCss","THRESHOLDBREAKS","search","about","main","login","icon","GlobalNav","this","currSize","thresholdsGoingUp","THRESHOLDLIMIT","Object","keys","length","autocompleteEles","currAIndex","isLoggedIn","myAccData","aboutNavItms","siteNavItms","loggedInNavItms","setResizingState","state","debounceSetResizingState","debounce","isResizing","onMenuBtnKeyDown","ev","key","modalOpen","menuClose","menuOpen","onMenuBtnClick","e","preventDefault","menuDiv","style","display","modalIsOpen","menuWrapDiv","addEventListener","focus","preventScroll","threshold","scrollHeight","innerHeight","document","overflow","menuFullScreen","overflowX","onMenuHidden","removeEventListener","activeElement","menuBtn","mainBarDiv","force","relatedTarget","closestElement","closest","secondaryMenuOpen","subMenuClose","target","open","onUserBtnClick","userMenuOpen","onUserBtnKeyDown","onUserMenuBlur","onSearchBtnClick","searchBarShown","searchbarShow","searchbarHide","onSearchBtnKeyDown","onSearchBarShown","searchBarEl","searchInput","setFocus","showAutocomplete","searchValInternal","onSearchBarHidden","height","onSearchInput","value","isSearchValSet","searchLoading","detail","type","onSearchChange","searchValue","autocompleteResults","nanoSearchReset","emit","currentIndex","currentSelectedIndex","processSearchResults","alogliaIndex","attributesToSnippet","hitsPerPage","filters","Math","floor","Date","now","console","error","scopeSearch","onSearchSubmit","showAutocompleteResults","algoliaSearchResults","queries","internalSearchIndeces","map","index","indexName","query","facets","algoliaClient","multipleQueries","nanoSearchError","results","result","i","name","selected","domain","domains","allGroup","nanoSearchResult","client","apiKey","searchApiKey","appId","searchAppId","onSearchIndexChange","indexStr","selectedIndex","find","searchIndex","switchIndexSubmit","onAutocompleteBlur","hits","onAutocompleteInteract","testIndex","el","shadowRoot","found","ele","setActiveElement","click","encodeURIComponent","location","href","protocol","host","[object Object]","env","userProfileUrl","getMyAccountData","remoteDataReady","ssoDataUrl","import","user","myAccountUser","processMyAccLinks","processMyAccData","foundIndex","algoliasearch","addAlgoliaIndeces","searchIndeces","forEach","initIndex","newThreshold","oldThreshold","intersectRatio","ratioChange","thresholdReady","siteContent","minHeight","barsDiv","clientHeight","menuItems","barItems","readTask","Array","from","querySelectorAll","push","writeTask","item","classList","add","remove","ready","attachIO","nanoIsReady","classes","innerWidth","secondaryMenu","stopPropagation","menuContentDiv","displayTransition","userLinkPanel","querySelector","hit","lookFor","_snippetResult","prop","matchLevel","title","substring","autocompleteEle","setAttribute","hasSiteSlot","hasLoggedinSlot","hasPromotionSlot","aboutSlotLen","iconSlotLen","mainSlotLen","overflowSlotLen","searchSlotLen","io","root","IntersectionObserver","data","slice","intersectionRatio","observe","debounceResize","onWindowResize","bind","initAlgoliaClient","ComponentStore","init","MutationObserver","mo","assessSlottedContent","childList","subtree","disconnect","undefined","getMyAccData","content","scrollingUp","currentScopeHits","scopeChangeSuggestions","scopeSuggestReducer","total","currentSuggestReducer","reduce","scopeSuggestions","h","class","role","ref","a","tabindex","innerHTML","autocompleteSnippet","button","onClick","onMouseDown","aria-expanded","hidden","onKeyDown","onSubmit","label","hideLabel","showInlineError","onNanoChange","mask","aria-label","clear-input","placeholder","input","onNanoInput","aria-autocomplete","aria-activedescendant","aria-controls","onNanoFocus","search-icon","search-icon--search","search-icon--show","slot","search-icon--loader","isRtl","ownerDocument","dir","searchWidget","autocompleteList","Host","thresholdClasses","join","search-bar-shown","search-auto-complete-shown","modal-open","resizing","global-nav","scrolling-down","gn-menu","has-promotion","menu-full-screen","secondary-open","div","activeMyAccountSections","includes","msgUrl","msgCount","cartUrl","cartCount","urls","ssoRedirect","link","address","small_avatar_url","forgot_password","logout","auto-resize","break-point-max","quietMode","w","btn","showLogo","logoUrl","src","getAssetPath","alt","showSearch","aria-owns","icon-btn","search-btn","search-btn--open","user-links-btn","search-bar","show","onTouchEnd","origin","dm","multiResults","singleResult","match","domainFor","indeces","api_key","app_id","cart","count","notifications","messages","links","area"],"mappings":"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","sourcesContent":["interface FetchInputConfig {\n  body?: { [prop: string]: string };\n  headers?: { [prop: string]: string };\n  [prop: string]: any;\n}\n\nexport async function clientFetch(\n  url: string,\n  { body, ...customConfig }: FetchInputConfig = {}\n) {\n  const headers: { [prop: string]: string } = {\n    Accept: 'application/json, text/plain, */*',\n    'Access-Control-Allow-Origin': '*',\n    'Content-Type': 'application/json',\n    Cache: 'no-cache',\n  };\n  const config: RequestInit = {\n    method: body ? 'POST' : 'GET',\n    credentials: 'include',\n    keepalive: true,\n    mode: 'cors',\n    ...customConfig,\n    headers: {\n      ...headers,\n      ...customConfig.headers,\n    },\n  };\n  if (body) {\n    config.body = JSON.stringify(body);\n  }\n\n  let id = setTimeout(() => {}, 0);\n  if (window.AbortController) {\n    const controller = new AbortController();\n    const { timeout = 500 } = customConfig;\n    id = setTimeout(() => controller.abort(), timeout);\n    config.signal = controller.signal;\n  }\n\n  const response = await fetch(url, config);\n  clearTimeout(id);\n\n  if (response.ok) {\n    return await response.json();\n  } else {\n    const errorMessage = await response.text();\n    return new Error(errorMessage);\n  }\n}\n","@use 'sass:map';\n@use 'sass:list';\n\n// globals\n@import '../../../global/style/utilities/globals';\n@import '../../../global/style/nano-theme/base';\n@import '../../../global/style/nano-theme/colours';\n@import '../../../global/style/nano-theme/layers';\n\n// local\n@import 'setup';\n@import 'bar';\n@import 'burger';\n@import 'search';\n@import 'user';\n\n:host {\n  /**\n   * @prop --bar-vertical-padding. Defaults to 21px;\n   * @prop --bar-item-spacing. Defaults to 16px;\n   * @prop --bar-background. Defaults to white;\n   * @prop --bar-text-color. Defaults to #196c82;\n   * @prop --bar-color-shade. Defaults to rgb(19, 89, 111);\n   * @prop --bar-color-tint. Defaults to rgb(19, 89, 111);\n   * @prop --bar-color-focus. Defaults to #001a21;\n   * @prop --bar-user-panel-bg. Defaults to #016d86;\n\n   * @prop --menu-background. Defaults to #001a21;\n   * @prop --menu-text-color. Defaults to white;\n   * @prop --bar-dropdown-bg. Defaults to #196c82;\n   * @prop --bar-dropdown-text. Defaults to white;\n   * @prop --menu-user-profile-bg. Defaults to #001a21;\n   * @prop --menu-user-panel-bg. Defaults to #193037;\n   * @prop --menu-padding. Defaults to 12px;\n   * @prop --menu-hint-color. Defaults to #33484d;\n   * @prop --menu-title-text. Defaults to #{map.get($colors, lightblue)};\n   * @prop --menu-icon-color. Defaults to white;\n\n   * @prop --login-button-bg. Defaults to #17bb75;\n   * @prop --login-button-text. Defaults to white;\n   */\n\n  --bar-vertical-padding: 21px;\n  --bar-item-spacing: 13px;\n  --bar-background: white;\n  --bar-text-color: #196c82;\n  --bar-color-shade: rgb(19, 89, 111);\n  --bar-color-tint: rgb(19, 89, 111);\n  --bar-color-focus: #001a21;\n  --bar-user-panel-bg: #016d86;\n  --bar-dropdown-bg: #196c82;\n  --bar-dropdown-text: white;\n  --menu-background: #001a21;\n  --menu-text-color: white;\n  --menu-user-profile-bg: #001a21;\n  --menu-user-panel-bg: #193037;\n  --menu-padding: 12px;\n  --menu-hint-color: #33484d;\n  --menu-title-text: #{map.get($colors, lightblue)};\n  --menu-icon-color: white;\n  --login-button-bg: #17bb75;\n  --login-button-text: white;\n\n  // not sure if this required any more\n  --padding: 12px;\n  --padding-top: var(--padding);\n  --padding-end: var(--padding);\n  --padding-bottom: var(--padding);\n  --padding-start: var(--padding);\n\n  display: block;\n  position: relative;\n  line-height: 1.5;\n  height: 100%;\n  font-size: 0.9375em;\n  font-size: clamp(0.77rem, 1vw, 1rem);\n\n  input,\n  select,\n  button {\n    font-family: inherit;\n    appearance: none;\n    font-size: inherit;\n  }\n}\n","import {\n  Component,\n  h,\n  Host,\n  Element,\n  State,\n  Watch,\n  Event,\n  EventEmitter,\n  Prop,\n  Listen,\n  Build,\n  getAssetPath,\n  readTask,\n  writeTask,\n  Method,\n  VNode,\n  ComponentInterface,\n} from '@stencil/core';\nimport algoliasearch, { SearchClient as AlgoliaClient } from 'algoliasearch';\nimport { closestElement } from '../../utils/dom';\nimport { clientFetch } from '../../utils/fetch';\nimport { ComponentStore } from '../../utils/store/component-store';\nimport { debounce } from '../../utils/throttle';\nimport { displayTransition } from '../../utils/transitions';\nimport type {\n  InputChangeEventDetail,\n  SelectChangeEventDetail,\n  AlgoliaResults,\n  SearchIndex,\n  MyAccountLink,\n  AloliaSearchResultDetail,\n  AlgoliaMultiResult,\n  MyAccountUser,\n  MyAccountData,\n  NavItemEventDetail,\n  AlgoliaResultHit,\n  AlgoliaNetworkError,\n  AlgoliaMultiResults,\n} from '../../interface';\n\n// the 'breakpoints' where different segments of content go into or out-of the burger / overflow menu\nconst THRESHOLDBREAKS = {\n  search: 0,\n  about: 1,\n  main: 2,\n  login: 3,\n  icon: 4,\n};\n\n/**\n * Nanopore digital global navigation and search bar.\n * Incorporates MyAccount / SSO states (messages / cart / user name etc).\n * Incorporates Algolia search.\n * GlobalNav is designed to be at the root of the `<body>`.\n * There should only be one <nano-global-nav> in the DOM.\n * The following demo uses static data.\n * @slot main - main nav items. Should be used with nano-nav-item's\n * @slot icon - nano-nav-item's displayed alongside icon links that come from MyAccount\n * @slot loggedin - nano-nav-item's to display when users are signed in, alongside links from from MyAccount (within the overflow menu panel).\n * @slot about - nano-nav-item's to display with about links that come from MyAccount\n * @slot site - nano-nav-item's to display with site links that come from MyAccount\n * @slot overflow - items to always display in the overflow menu\n * @slot search - when not using myaccount search OR show-search=\"false\" you can utilise the search slot\n * @slot promotion - a free area for any promotional content, displayed within the overflow menu panel\n * @slot logo - when show-logo=\"false\" you can utilise the logo slot\n */\n@Component({\n  tag: 'nano-global-nav',\n  styleUrl: 'style/global-nav.scss',\n  shadow: true,\n  assetsDirs: ['assets'],\n})\nexport class GlobalNav implements ComponentInterface {\n  // position and dimension state\n  private io: IntersectionObserver;\n  private debounceResize: () => {};\n  private debounceSetResizingState: () => {};\n  private currSize: number = 0;\n  private thresholdsGoingUp: boolean = false;\n  private THRESHOLDLIMIT = Object.keys(THRESHOLDBREAKS).length;\n\n  // menu\n  private menuDiv: HTMLElement;\n  private menuBtn: HTMLButtonElement;\n  private menuWrapDiv: HTMLDivElement;\n  private menuContentDiv: HTMLDivElement;\n\n  // search\n  private searchBarEl: HTMLDivElement;\n  private searchInput: HTMLNanoInputElement;\n  private algoliaClient: AlgoliaClient;\n  private currentIndex: SearchIndex;\n  private autocompleteResults: AlgoliaResults | null;\n  private autocompleteEles: Array<HTMLAnchorElement | HTMLButtonElement> = [];\n  private currAIndex: number = -1;\n  private algoliaSearchResults: AlgoliaMultiResults | null;\n  private scopeSearch: AlgoliaMultiResults | null;\n\n  // general\n  private mainBarDiv: HTMLElement;\n  private barsDiv: HTMLDivElement;\n  private siteContent: HTMLDivElement;\n  private userLinkPanel: HTMLDivElement;\n  private isLoggedIn: boolean = false;\n\n  private myAccData: MyAccountData = null;\n\n  // myaccount links\n  private aboutNavItms: MyAccountLink[] = [];\n  private siteNavItms: MyAccountLink[] = [];\n  private loggedInNavItms: MyAccountLink[] = [];\n\n  // user profile link\n  @State() userProfileUrl: string = '';\n\n  // has slot tests\n  private mo?: MutationObserver;\n  @State() hasLoggedinSlot: boolean = false;\n  @State() hasSiteSlot: boolean = false;\n  @State() hasPromotionSlot: boolean = false;\n\n  // slot item number tests\n  @State() aboutSlotLen: number = 0;\n  @State() iconSlotLen: number = 0;\n  @State() mainSlotLen: number = 0;\n  @State() overflowSlotLen: number = 0;\n  @State() searchSlotLen: number = 0;\n\n  @State() internalSearchIndeces: Array<SearchIndex> = [];\n  @State() thresholdReady: boolean = false;\n  @State() remoteDataReady: boolean = false;\n  @State() ready: boolean = false;\n  @State() isResizing: boolean = false;\n  @State() intersectRatio: number;\n  @State() threshold: number = this.THRESHOLDLIMIT;\n  @State() modalOpen: boolean = false;\n  @State() modalIsOpen: boolean = false;\n  @State() searchBarShown: boolean = false;\n  @State() scrollingUp: boolean = true;\n  @State() searchLoading: boolean = false;\n  @State() showAutocomplete: boolean = false;\n  @State() secondaryMenuOpen: boolean = false;\n  @State() userMenuOpen: boolean = false;\n  @State() menuFullScreen: boolean = false;\n  @State() searchValInternal: string = '';\n\n  @Element() private el: HTMLNanoGlobalNavElement;\n\n  /**\n   * Connect to local, dev, test or prod MyAccount\n   * environments to retrieve global nav / sso data.\n   * Alternatively, you can use the `ssoDataUrl` prop.\n   */\n  @Prop() env?: 'local' | 'dev' | 'test' | 'prod' = 'prod';\n\n  /**\n   * A base url to retrieve global nav / sso data.\n   * `nav_bar_data.json` will be appended to this url.\n   * An alternative to the pre-defined `env` urls\n   */\n  @Prop() ssoDataUrl?: string;\n\n  /**\n   * Where to take user after SSO login\n   */\n  @Prop() ssoRedirect: string = encodeURIComponent(window.location.href);\n\n  /**\n   * Whether to attempt to get global nav / sso data from MyAccount\n   */\n  @Prop() getMyAccountData: boolean = true;\n\n  /**\n   * Active MyAccount link sections. By default all will show.\n   */\n  @Prop() activeMyAccountSections: (\n    | 'about'\n    | 'loggedin'\n    | 'sites'\n    | 'icons'\n  )[] = null;\n\n  /**\n   * Whether to show search functionality\n   */\n  @Prop() showSearch: boolean = true;\n\n  /**\n   * Whether to show Nanopore logo\n   */\n  @Prop() showLogo: boolean = true;\n\n  /**\n   * The link to put on the logo\n   */\n  @Prop() logoUrl: string = location.protocol + '//' + location.host;\n\n  /**\n   * An array of Algolia search indexes (and optional display names). Will be automatically populated from MyAccount\n   */\n  @Prop() searchIndeces: Array<SearchIndex> = [];\n\n  /**\n   * Logged in user details automatically populated from MyAccount\n   */\n  @Prop({ mutable: true }) myAccountUser: MyAccountUser = null;\n\n  /**\n   * An Algolia App ID key. Will be automatically populated from MyAccount\n   */\n  @Prop({ mutable: true }) searchAppId: string;\n\n  /**\n   * An Algolia API Key. Will be automatically populated from MyAccount\n   */\n  @Prop({ mutable: true }) searchApiKey: string;\n\n  /**\n   * A search value to passed to Algolia to programatically get or to preload search results\n   */\n  @Prop({ mutable: true }) searchValue: string = '';\n\n  /**\n   * Algolia search index to programatically set or to set an initial index\n   */\n  @Prop({ mutable: true }) searchIndex: string = 'all_prod_en';\n\n  /**\n   * MyAccount store cart count.\n   */\n  @Prop({ mutable: true }) cartCount: number = 0;\n\n  /**\n   * MyAccount un-read message count.\n   */\n  @Prop({ mutable: true }) msgCount: number = 0;\n\n  /**\n   * Url to the Nanopore store cart. Will default to the url supplied by MyAccount\n   */\n  @Prop({ mutable: true }) cartUrl: string = null;\n\n  /**\n   * Url to the Nanopore message center. Will default to the url supplied by MyAccount\n   */\n  @Prop({ mutable: true }) msgUrl: string = null;\n\n  /**\n   * Emitted when the global nav is ready.\n   */\n  @Event() nanoIsReady!: EventEmitter<void>;\n\n  /**\n   * Emitted when search results are successfully returned from Algolia.\n   */\n  @Event() nanoSearchResult!: EventEmitter<AloliaSearchResultDetail>;\n\n  /**\n   * Emitted when algolia returns an error.\n   */\n  @Event() nanoSearchError!: EventEmitter<AlgoliaNetworkError>;\n\n  /**\n   * Emitted when search field is cleared.\n   */\n  @Event() nanoSearchReset!: EventEmitter<AloliaSearchResultDetail>;\n\n  /**\n   * Submit the search form (a search value must be present)\n   */\n  @Method()\n  async submitSearch() {\n    this.onSearchSubmit();\n    this.showAutocomplete = false;\n    return;\n  }\n\n  @Watch('env')\n  @Watch('ssoDataUrl')\n  async getMyAccData() {\n    switch (this.env) {\n      case 'prod':\n        this.userProfileUrl = 'https://community.nanoporetech.com/profile/me';\n      case 'local':\n      case 'dev':\n      case 'test':\n      default:\n        this.userProfileUrl =\n          'https://community-test.nanoporetech.com/profile/me';\n        break;\n    }\n\n    if (!this.getMyAccountData || this.myAccData) {\n      this.remoteDataReady = true;\n      return;\n    }\n\n    let url = this.ssoDataUrl;\n\n    if (!url) {\n      switch (this.env) {\n        case 'dev':\n          url = 'https://myaccount-dev.nanoporetech.com/';\n          break;\n        case 'test':\n          url = 'https://myaccount-test.nanoporetech.com/';\n          break;\n        default:\n          url = 'https://myaccount.nanoporetech.com/';\n          break;\n      }\n    }\n\n    const config = { timeout: 5000 };\n\n    try {\n      if (this.env === 'local') {\n        this.myAccData = (await import(\n          `./assets/local-my-account.json`\n        )) as unknown as MyAccountData;\n      } else {\n        this.myAccData = await clientFetch(url + 'nav_bar_data.json', config);\n      }\n      if (this.myAccData.user.id) {\n        this.isLoggedIn = true;\n        this.myAccountUser = this.myAccData.user;\n      }\n      this.processMyAccLinks();\n      this.processMyAccData();\n      setTimeout(() => (this.remoteDataReady = true), 300);\n    } catch (e) {\n      console.error(e);\n      this.remoteDataReady = true;\n    }\n  }\n\n  @Watch('searchIndex')\n  currentSelectedIndex() {\n    if (!this.internalSearchIndeces.length) {\n      return;\n    }\n\n    const foundIndex = this.internalSearchIndeces.find(\n      (index) => index.index === this.searchIndex\n    );\n\n    if (!foundIndex) {\n      this.currentIndex = this.internalSearchIndeces[0];\n      console.error('index not found');\n      return;\n    }\n\n    this.currentIndex = foundIndex;\n    return foundIndex;\n  }\n\n  @Watch('searchValInternal')\n  changeInternalSearchVal() {\n    if (this.searchValInternal !== this.searchValue)\n      this.searchValue = this.searchValInternal;\n  }\n\n  @Watch('searchApiKey')\n  @Watch('searchAppId')\n  initAlgoliaClient() {\n    if (!this.searchAppId || !this.searchApiKey) return;\n\n    this.algoliaClient = algoliasearch(this.searchAppId, this.searchApiKey);\n    this.addAlgoliaIndeces();\n  }\n\n  @Watch('searchIndeces')\n  addIndeces() {\n    this.internalSearchIndeces = [\n      ...this.internalSearchIndeces,\n      ...this.searchIndeces,\n    ];\n  }\n\n  @Watch('internalSearchIndeces')\n  addAlgoliaIndeces() {\n    if (!this.algoliaClient || !this.internalSearchIndeces.length) return;\n\n    this.internalSearchIndeces.forEach((searchIndex) => {\n      searchIndex.alogliaIndex = this.algoliaClient.initIndex(\n        searchIndex.index\n      );\n    });\n    if (!this.searchIndex)\n      this.searchIndex = this.internalSearchIndeces[0].index;\n  }\n\n  @Watch('threshold')\n  thresholdChange(newThreshold, oldThreshold) {\n    if (newThreshold > oldThreshold) {\n      // we've resized to larger screen.\n      this.thresholdsGoingUp = true;\n      this.setResizingState(true);\n    }\n  }\n\n  /**\n   * Primary logic for resizing changes.\n   * When content doesn't fit - we loop down through break points until it does\n   */\n  @Watch('intersectRatio')\n  ratioChange() {\n    if (this.intersectRatio < 1 && this.threshold > 0) {\n      // content doesn't fit\n      if (this.thresholdsGoingUp) this.setResizingState(true);\n      this.threshold--;\n      setTimeout(() => this.ratioChange(), 500);\n    } else {\n      this.thresholdReady = true;\n\n      // content now fits so add / remove context classes\n      // on nav-items depending on whether they're added to bar or burger.\n      this.siteContent.style.minHeight = `calc(100% - ${\n        this.barsDiv.clientHeight + 1\n      }px)`;\n\n      let menuItems: Array<Element>, barItems: Array<Element>;\n      readTask(() => {\n        menuItems = [\n          ...Array.from(this.el.querySelectorAll('nano-nav-item[slot=\"site\"]')),\n          ...Array.from(\n            this.el.querySelectorAll('nano-nav-item[slot=\"overflow\"]')\n          ),\n        ];\n        barItems = [];\n\n        if (this.threshold < this.THRESHOLDLIMIT - THRESHOLDBREAKS.icon)\n          menuItems.push(\n            ...Array.from(\n              this.el.querySelectorAll('nano-nav-item[slot=\"icon\"]')\n            )\n          );\n        else\n          barItems.push(\n            ...Array.from(\n              this.el.querySelectorAll('nano-nav-item[slot=\"icon\"]')\n            )\n          );\n\n        if (this.threshold < this.THRESHOLDLIMIT - THRESHOLDBREAKS.login)\n          menuItems.push(\n            ...Array.from(\n              this.el.querySelectorAll('nano-nav-item[slot=\"loggedin\"]')\n            )\n          );\n        else\n          barItems.push(\n            ...Array.from(\n              this.el.querySelectorAll('nano-nav-item[slot=\"loggedin\"]')\n            )\n          );\n\n        if (this.threshold < this.THRESHOLDLIMIT - THRESHOLDBREAKS.main)\n          menuItems.push(\n            ...Array.from(\n              this.el.querySelectorAll('nano-nav-item[slot=\"main\"]')\n            )\n          );\n        else\n          barItems.push(\n            ...Array.from(\n              this.el.querySelectorAll('nano-nav-item[slot=\"main\"]')\n            )\n          );\n\n        if (this.threshold < this.THRESHOLDLIMIT - THRESHOLDBREAKS.about)\n          menuItems.push(\n            ...Array.from(\n              this.el.querySelectorAll('nano-nav-item[slot=\"about\"]')\n            )\n          );\n        else\n          barItems.push(\n            ...Array.from(\n              this.el.querySelectorAll('nano-nav-item[slot=\"about\"]')\n            )\n          );\n      });\n\n      writeTask(() => {\n        menuItems.forEach((item) => {\n          item.classList.add('nano-global-nav-menu');\n          item.classList.remove('nano-global-nav-bar');\n        });\n        barItems.forEach((item) => {\n          item.classList.remove('nano-global-nav-menu');\n          item.classList.add('nano-global-nav-bar');\n        });\n      });\n    }\n  }\n\n  @Watch('thresholdReady')\n  @Watch('remoteDataReady')\n  assessReady() {\n    if (this.thresholdReady && this.remoteDataReady) {\n      this.ready = true;\n    }\n  }\n\n  @Watch('remoteDataReady')\n  remoteReady() {\n    this.attachIO();\n  }\n\n  @Watch('ready')\n  isReady() {\n    this.nanoIsReady.emit();\n  }\n\n  /**\n   * Add / remove events when autocomplete results show / hide.\n   */\n  @Watch('showAutocomplete')\n  setupAutocompleteBlur() {\n    this.searchInput.clientWidth; // force reflow\n    if (this.showAutocomplete) {\n      this.el.shadowRoot.addEventListener('click', this.onAutocompleteBlur);\n    } else {\n      this.el.shadowRoot.removeEventListener('click', this.onAutocompleteBlur);\n    }\n  }\n\n  /**\n   * As relevant slotted items change, reset resizing breakpoints\n   */\n  @Watch('aboutSlotLen')\n  @Watch('iconSlotLen')\n  @Watch('mainSlotLen')\n  @Watch('overflowSlotLen')\n  @Watch('searchSlotLen')\n  slotChange() {\n    this.threshold = this.THRESHOLDLIMIT;\n  }\n\n  // General classes for visuals\n\n  private thresholdClasses() {\n    const classes = [];\n    let i = 0;\n    for (i; i < this.threshold; i++) classes.push('threshold-' + (i + 1));\n    return classes;\n  }\n\n  /**\n   * provides 'isResizing' - we use this to fade content out on 'breakpoint' increase\n   * (when the screen size increases). Otherwise the stepping through of\n   * breakpoints to calculate if content currently fits shows on screen (looks ugly)\n   */\n  private setResizingState = (state: boolean = false) => {\n    if (typeof this.debounceSetResizingState === 'undefined') {\n      this.debounceSetResizingState = debounce(this.setResizingState, 600);\n    }\n    if (state) {\n      this.isResizing = true;\n      this.debounceSetResizingState();\n    } else {\n      this.isResizing = false;\n      this.thresholdsGoingUp = false;\n    }\n  };\n\n  // Global DOM Events\n\n  private onWindowResize() {\n    if (\n      this.threshold < this.THRESHOLDLIMIT &&\n      window.innerWidth > this.currSize\n    ) {\n      this.threshold = this.THRESHOLDLIMIT;\n    }\n    this.currSize = window.innerWidth;\n    this.searchBarShown = false;\n  }\n\n  // Burger / Overflow Menu\n\n  // listen to nav-item secondary open / close events primarily for resizing the menu\n  @Listen('nanoOpen')\n  secondaryOpen(ev: CustomEvent) {\n    if (!(ev.detail as NavItemEventDetail).secondaryMenu) return;\n    ev.stopPropagation();\n    this.secondaryMenuOpen = true;\n    this.menuContentDiv.style.minHeight =\n      (ev.detail as NavItemEventDetail).secondaryMenu.scrollHeight + 'px';\n  }\n\n  @Listen('nanoClose')\n  secondaryClose(ev: CustomEvent) {\n    if (!(ev.detail as NavItemEventDetail).secondaryMenu) return;\n    ev.stopPropagation();\n    this.secondaryMenuOpen = false;\n    this.menuContentDiv.style.minHeight = '';\n  }\n\n  private onMenuBtnKeyDown = (ev: KeyboardEvent) => {\n    switch (ev.key) {\n      case 'Enter':\n      case ' ':\n        this.modalOpen ? this.menuClose(ev, true) : this.menuOpen();\n        break;\n    }\n  };\n\n  private onMenuBtnClick = (ev: MouseEvent) => {\n    this.menuClose(ev, true);\n  };\n\n  private menuOpen = (e?: MouseEvent) => {\n    if (e) e.preventDefault();\n\n    this.menuDiv.style.display = 'block';\n    // need to open menu in stages\n    // wait for re-flow after changing display\n    // wait for repaint after animate, then focus\n\n    this.menuDiv.clientWidth; // force reflow\n\n    this.modalOpen = true;\n    this.modalIsOpen = true;\n    this.menuWrapDiv.addEventListener('focusout', this.menuClose);\n\n    this.menuDiv.clientWidth; // force reflow\n\n    this.menuWrapDiv.focus({ preventScroll: true });\n    if (\n      this.threshold < 2 ||\n      this.menuWrapDiv.scrollHeight > window.innerHeight\n    ) {\n      document.body.style.overflow = 'hidden';\n      this.menuFullScreen = true;\n    } else document.body.style.overflowX = 'hidden';\n  };\n\n  private onMenuHidden = () => {\n    this.menuDiv.removeEventListener('transitionend', this.onMenuHidden);\n    this.menuWrapDiv.removeEventListener('focusout', this.menuClose);\n\n    document.body.style.overflow = '';\n    this.menuDiv.style.display = 'none';\n    this.modalIsOpen = false;\n    this.menuFullScreen = false;\n\n    setTimeout(() => {\n      if (document.activeElement === document.body && this.menuBtn)\n        this.mainBarDiv.focus({ preventScroll: true });\n    }, 50);\n  };\n\n  private menuClose = (\n    ev?: FocusEvent | MouseEvent | KeyboardEvent | TouchEvent,\n    force: boolean = false\n  ) => {\n    if (!force) {\n      const e = ev as FocusEvent;\n      if (\n        e &&\n        e.relatedTarget &&\n        closestElement('#global-nav-menu', e.relatedTarget as HTMLElement)\n      )\n        return;\n      if (\n        e &&\n        e.relatedTarget &&\n        (e.relatedTarget as HTMLElement).closest('#global-nav-menu')\n      )\n        return;\n      if (\n        e &&\n        e.relatedTarget &&\n        (e.relatedTarget as HTMLElement).closest('[slot=\"promotion\"]')\n      )\n        return;\n      if (this.secondaryMenuOpen) return;\n    }\n\n    this.modalOpen = false;\n    this.menuDiv.addEventListener('transitionend', this.onMenuHidden);\n  };\n\n  private subMenuClose = (ev?: MouseEvent) => {\n    ev.preventDefault();\n    (ev.target as HTMLNanoNavItemElement).closest('nano-nav-item').open = false;\n  };\n\n  // User profile menu\n\n  private onUserBtnClick = (ev: MouseEvent) => {\n    ev.preventDefault();\n    this.userMenuOpen = !this.userMenuOpen;\n  };\n\n  private onUserBtnKeyDown = (ev: KeyboardEvent) => {\n    switch (ev.key) {\n      case 'Enter':\n      case ' ':\n        this.userMenuOpen = !this.userMenuOpen;\n        break;\n    }\n  };\n\n  private onUserMenuBlur = (ev: FocusEvent) => {\n    if (!ev.relatedTarget) {\n      this.userMenuOpen = false;\n      return;\n    }\n    if (!!(ev.relatedTarget as HTMLElement).closest('.user-links-panel'))\n      return false;\n    this.userMenuOpen = false;\n  };\n\n  @Watch('userMenuOpen')\n  async handleUserMenu() {\n    await displayTransition(this.userLinkPanel, 'show', this.userMenuOpen);\n    if (this.userMenuOpen) {\n      this.userLinkPanel.focus();\n      this.userLinkPanel.addEventListener('focusout', this.onUserMenuBlur);\n    } else {\n      this.userLinkPanel.removeEventListener('focusout', this.onUserMenuBlur);\n      this.el.focus();\n    }\n  }\n\n  // Search bar (smaller screens / mobile)\n\n  private onSearchBtnClick = (ev: MouseEvent) => {\n    ev.preventDefault();\n    if (!this.searchBarShown) this.searchbarShow();\n    else this.searchbarHide();\n  };\n\n  private onSearchBtnKeyDown = (ev: KeyboardEvent) => {\n    switch (ev.key) {\n      case 'Enter':\n      case ' ':\n        this.searchBarShown ? this.searchbarHide() : this.searchbarShow();\n        break;\n    }\n  };\n\n  private searchbarShow() {\n    this.searchBarShown = true;\n    this.searchBarEl.addEventListener('transitionend', this.onSearchBarShown);\n    this.searchBarEl.style.display = 'block';\n\n    setTimeout(() => {\n      this.searchBarEl.style.height =\n        this.searchBarEl.querySelector('.search-widget').scrollHeight + 'px';\n    }, 50);\n  }\n\n  private onSearchBarShown = () => {\n    this.searchBarEl.removeEventListener(\n      'transitionend',\n      this.onSearchBarShown\n    );\n    if (this.searchInput) this.searchInput.setFocus();\n    this.searchBarEl.style.overflow = 'visible';\n  };\n\n  private searchbarHide = (ev?: FocusEvent) => {\n    if (\n      ev &&\n      ev.relatedTarget &&\n      (ev.relatedTarget as HTMLElement).closest('#global-nav-search-bar')\n    )\n      return;\n    this.showAutocomplete = false;\n    if (this.searchValInternal.length && ev) return;\n\n    this.searchBarEl.addEventListener('transitionend', this.onSearchBarHidden);\n    this.searchBarEl.style.overflow = 'hidden';\n    this.searchBarEl.style.height = '0px';\n  };\n\n  private onSearchBarHidden = () => {\n    this.searchBarEl.removeEventListener(\n      'transitionend',\n      this.onSearchBarHidden\n    );\n    this.searchBarEl.style.display = 'none';\n    this.searchBarShown = false;\n  };\n\n  // Algolia search\n\n  private autocompleteSnippet(hit: AlgoliaResultHit) {\n    const lookFor = ['title']; // , 'body'\n    if (hit._snippetResult) {\n      const found = lookFor.find(\n        (prop) =>\n          hit._snippetResult[prop] &&\n          hit._snippetResult[prop].matchLevel !== 'none'\n      );\n\n      if (found) {\n        if (found !== 'title')\n          return (\n            (hit.title.length > 15\n              ? hit.title.substring(0, 15) + ' ...'\n              : hit.title) +\n            ' ' +\n            hit._snippetResult[found].value\n          );\n        else return hit._snippetResult['title'].value;\n      }\n    }\n    return hit.title;\n  }\n\n  private onSearchInput = (ev: CustomEvent<InputEvent>) => {\n    this.searchValInternal = this.searchInput.value;\n\n    if (!this.isSearchValSet()) {\n      this.searchLoading = false;\n      return;\n    }\n\n    if (ev.detail.type === 'input') {\n      this.showAutocomplete = false;\n      this.searchLoading = true;\n    }\n  };\n\n  private onSearchChange = async (ev?: CustomEvent<InputChangeEventDetail>) => {\n    this.searchValInternal = this.searchValue = ev\n      ? ev.detail.value\n      : this.searchValInternal;\n    this.showAutocomplete = false;\n    this.autocompleteResults = null;\n\n    if (!this.isSearchValSet()) {\n      if (!this.searchValInternal.length) {\n        this.nanoSearchReset.emit();\n      }\n      this.searchLoading = false;\n      return;\n    }\n    if (!this.currentIndex) this.currentSelectedIndex();\n\n    try {\n      this.autocompleteResults = this.processSearchResults(\n        (await this.currentIndex.alogliaIndex.search(this.searchValInternal, {\n          attributesToSnippet: ['body:5', 'title:8'],\n          hitsPerPage: 5,\n          filters: 'created > ' + Math.floor((Date.now() - 63115200000) / 1000), // only get last 2 years\n        })) as any\n      ) as AlgoliaResults;\n    } catch (e) {\n      console.error(e);\n    }\n\n    this.scopeSearch = null;\n    this.scopeSearch = await this.onSearchSubmit(null, false);\n\n    this.searchLoading = false;\n    this.showAutocompleteResults();\n  };\n\n  private onSearchSubmit = async (ev?, emit: boolean = true) => {\n    if (ev) ev.preventDefault();\n    if (!this.isSearchValSet()) return;\n    this.searchLoading = true;\n    this.algoliaSearchResults = null;\n\n    if (!this.currentIndex) this.currentSelectedIndex();\n\n    const queries = this.internalSearchIndeces.map((index) => {\n      return {\n        indexName: index.index,\n        query: this.searchValInternal,\n        facets: index.filters,\n        hitsPerPage: 10,\n        filters: 'created > ' + Math.floor((Date.now() - 63115200000) / 1000), // only get last 2 years\n      };\n    });\n\n    try {\n      this.algoliaSearchResults = this.processSearchResults(\n        (await this.algoliaClient.multipleQueries(queries)) as any\n      ) as AlgoliaMultiResults;\n    } catch (e) {\n      this.nanoSearchError.emit(e as AlgoliaNetworkError);\n    }\n    this.searchLoading = false;\n    if (!this.algoliaSearchResults) return;\n\n    this.algoliaSearchResults.results.map((result, i) => {\n      result.indexName = this.internalSearchIndeces[i].name;\n      result.selected =\n        this.currentIndex.name === this.internalSearchIndeces[i].name;\n      result.domain = this.currentIndex.domain || null;\n      result.domains = this.myAccData.domains || null;\n      result.allGroup = !!this.internalSearchIndeces[i].allGroup;\n      result.filters = this.internalSearchIndeces[i].filters;\n    });\n\n    if (emit) {\n      this.nanoSearchResult.emit({\n        results: this.algoliaSearchResults.results,\n        client: { apiKey: this.searchApiKey, appId: this.searchAppId },\n      });\n      this.showAutocomplete = false;\n    }\n    return this.algoliaSearchResults;\n  };\n\n  private onSearchIndexChange = async (\n    index: CustomEvent<SelectChangeEventDetail> | string\n  ) => {\n    const ev = index as CustomEvent<SelectChangeEventDetail>;\n    let indexStr = index as string;\n\n    if (!this.currentIndex) this.currentSelectedIndex();\n\n    if (ev.detail && ev.detail.value.length)\n      indexStr = ev.detail.value as string;\n    if (!indexStr || !indexStr.length) return;\n    if (this.currentIndex.index === indexStr) return;\n\n    const selectedIndex = this.internalSearchIndeces.find(\n      (index) => index.index === indexStr\n    );\n    if (!selectedIndex || !selectedIndex.alogliaIndex) return;\n\n    this.searchIndex = selectedIndex.index;\n    if (this.isSearchValSet()) await this.onSearchChange();\n  };\n\n  private isSearchValSet() {\n    if (this.searchValInternal.length < 3) return false;\n    return true;\n  }\n\n  private switchIndexSubmit = async (index: string) => {\n    if (this.isSearchValSet()) {\n      await this.onSearchIndexChange(index);\n      this.onSearchSubmit();\n    } else this.onSearchIndexChange(index);\n  };\n\n  // Autocomplete\n\n  @Watch('showAutocomplete')\n  resetHitFocus() {\n    this.currAIndex = -1;\n  }\n\n  private onAutocompleteBlur = (ev: MouseEvent) => {\n    if (!this.showAutocomplete || !this.autocompleteResults) return;\n    if (ev && ev.target && (ev.target as HTMLElement).closest('.search-widget'))\n      return;\n    this.showAutocomplete = false;\n  };\n\n  private showAutocompleteResults = () => {\n    if (!this.autocompleteResults || !this.autocompleteResults.hits) return;\n    this.showAutocomplete = true;\n  };\n\n  private setActiveElement(\n    autocompleteEle: HTMLAnchorElement | HTMLButtonElement\n  ) {\n    this.autocompleteEles.map((ele) =>\n      ele.setAttribute('aria-selected', 'false')\n    );\n    autocompleteEle.focus({ preventScroll: true });\n    autocompleteEle.setAttribute('aria-selected', 'true');\n  }\n\n  private onAutocompleteInteract = (ev: KeyboardEvent) => {\n    // list open, navigate items with arrows\n    if (!this.showAutocomplete || !this.autocompleteResults) return;\n    let testIndex = this.currAIndex;\n\n    switch (ev.key) {\n      case 'Tab':\n        setTimeout(() => {\n          if (\n            !this.el.shadowRoot.activeElement ||\n            !this.el.shadowRoot.activeElement.closest('.search-widget')\n          ) {\n            this.showAutocomplete = false;\n            return;\n          } else {\n            const found = this.autocompleteEles.find((ele, i) => {\n              if (ele === this.el.shadowRoot.activeElement) {\n                this.currAIndex = i;\n                return true;\n              }\n            });\n            if (found) this.setActiveElement(found);\n            else this.currAIndex = -1;\n          }\n        });\n        break;\n      case 'ArrowDown':\n      case 'ArrowUp':\n        if (ev.key === 'ArrowDown') testIndex++;\n        else if (ev.key === 'ArrowUp') testIndex--;\n\n        const found = this.autocompleteEles[testIndex];\n        if (\n          found ||\n          testIndex < 0 ||\n          testIndex > this.autocompleteEles.length - 1\n        )\n          ev.preventDefault();\n        this.searchInput.clientWidth; // force reflow\n\n        if (found) {\n          this.setActiveElement(found);\n          this.currAIndex = testIndex;\n        } else if (testIndex < 0) {\n          this.searchInput.setFocus();\n          this.currAIndex = -1;\n        }\n        break;\n      case 'Enter':\n      case ' ':\n        if (this.autocompleteEles[this.currAIndex]) {\n          this.autocompleteEles[this.currAIndex].click();\n        }\n        break;\n    }\n  };\n\n  // Various.\n\n  /**\n   * Assesses what content is present in which slots\n   */\n  private assessSlottedContent() {\n    readTask(() => {\n      this.hasSiteSlot = !!this.el.querySelectorAll('[slot=\"site\"]').length;\n      this.hasLoggedinSlot =\n        !!this.el.querySelectorAll('[slot=\"loggedin\"]').length;\n      this.hasPromotionSlot =\n        !!this.el.querySelectorAll('[slot=\"promotion\"]').length;\n\n      this.aboutSlotLen = this.el.querySelectorAll('[slot=\"about\"]').length;\n      this.iconSlotLen = this.el.querySelectorAll('[slot=\"icon\"]').length;\n      this.mainSlotLen = this.el.querySelectorAll('[slot=\"main\"]').length;\n      this.overflowSlotLen =\n        this.el.querySelectorAll('[slot=\"overflow\"]').length;\n      this.searchSlotLen = this.el.querySelectorAll('[slot=\"search\"]').length;\n    });\n  }\n\n  /**\n   * Attach the IntersectionObserver - from which all threshold / breakpoint logic hinges\n   */\n  private attachIO() {\n    if (this.io) return;\n    const root = this.el.shadowRoot.querySelector('.global-nav .main-bar');\n    if (\n      Build.isBrowser &&\n      typeof window !== 'undefined' &&\n      (window as any).IntersectionObserver &&\n      !!root\n    ) {\n      const io = (this.io = new (window as any).IntersectionObserver(\n        (data: IntersectionObserverEntry[]) => {\n          this.intersectRatio = data.slice(-1)[0].intersectionRatio;\n        },\n        { root, threshold: 1 }\n      ));\n      io.observe(root.querySelector('.measure-ele'));\n    }\n  }\n\n  // Stencil Lifecycle / Rendering\n\n  componentDidLoad() {\n    if (Build.isBrowser) {\n      this.debounceResize = debounce(this.onWindowResize.bind(this), 300);\n\n      window.addEventListener('resize', this.debounceResize);\n      this.currSize = window.innerWidth;\n    }\n\n    this.initAlgoliaClient();\n    this.addAlgoliaIndeces();\n    if (this.remoteDataReady) this.attachIO();\n  }\n\n  componentWillLoad() {\n    ComponentStore.init(\n      this,\n      ['searchIndex', 'searchValue'],\n      'url-hash',\n      'gns'\n    );\n\n    if (\n      Build.isBrowser &&\n      typeof window !== 'undefined' &&\n      (window as any).MutationObserver\n    ) {\n      const mo = (this.mo = new MutationObserver(() => {\n        this.assessSlottedContent();\n      }));\n      mo.observe(this.el, { childList: true, subtree: false });\n    }\n    this.assessSlottedContent();\n  }\n\n  disconnectedCallback() {\n    if (this.io) {\n      this.io.disconnect();\n      this.io = undefined;\n    }\n    if (this.mo) {\n      this.mo.disconnect();\n      this.mo = undefined;\n    }\n    if (Build.isBrowser)\n      window.removeEventListener('resize', this.debounceResize);\n  }\n\n  async connectedCallback() {\n    this.getMyAccData();\n  }\n\n  // Render output\n\n  private autocompleteList(): VNode {\n    let content;\n    if (this.showAutocomplete && this.scrollingUp) {\n      let currentScopeHits = 0;\n      let scopeChangeSuggestions = 0;\n\n      const scopeSuggestReducer = (\n        total: number,\n        result: AlgoliaMultiResult\n      ) => {\n        return result.index !== this.currentIndex.index\n          ? total + result.hits.length\n          : total;\n      };\n      const currentSuggestReducer = (\n        total: number,\n        result: AlgoliaMultiResult\n      ) => {\n        return result.index === this.currentIndex.index\n          ? total + result.hits.length\n          : total;\n      };\n\n      if (this.scopeSearch) {\n        scopeChangeSuggestions = this.scopeSearch.results.reduce(\n          scopeSuggestReducer,\n          0\n        );\n        currentScopeHits = this.scopeSearch.results.reduce(\n          currentSuggestReducer,\n          0\n        );\n      }\n\n      if (\n        (this.autocompleteResults && this.autocompleteResults.hits.length) ||\n        (scopeChangeSuggestions && !currentScopeHits)\n      ) {\n        let scopeSuggestions = 0;\n\n        content = (\n          <div>\n            {!currentScopeHits && (\n              <div class=\"search-autocomplete-hit search-autocomplete-hit--no-result\">\n                No results matching '{this.searchValInternal}' were found in{' '}\n                <strong>{this.currentIndex.name}</strong>. Try another phrase.\n              </div>\n            )}\n            {this.autocompleteResults && [\n              this.autocompleteResults.hits.map((hit, i) => {\n                return (\n                  <a\n                    role=\"option\"\n                    ref={(a) => this.autocompleteEles.push(a)}\n                    tabindex=\"-1\"\n                    id={'autocomplete-hit-' + i}\n                    href={hit.url}\n                    class=\"search-autocomplete-hit\"\n                    innerHTML={this.autocompleteSnippet(hit)}\n                  ></a>\n                );\n              }),\n            ]}\n            {(!currentScopeHits || this.currentIndex.allGroup) &&\n              this.scopeSearch &&\n              this.scopeSearch.results && [\n                this.scopeSearch.results.map((result, i) => {\n                  if (\n                    !result.hits.length ||\n                    result.index === this.currentIndex.index ||\n                    scopeSuggestions > 1\n                  )\n                    return;\n                  scopeSuggestions++;\n                  return (\n                    <button\n                      role=\"option\"\n                      ref={(button) => this.autocompleteEles.push(button)}\n                      tabindex=\"-1\"\n                      id={'autocomplete-scope-' + i}\n                      class=\"search-autocomplete-hit\"\n                      onClick={() => this.switchIndexSubmit(result.index)}\n                      onMouseDown={() => this.switchIndexSubmit(result.index)}\n                    >\n                      \"{this.searchValInternal}\"{' '}\n                      <div class=\"search-autocomplete-hit-scope\">\n                        in {result.indexName}\n                      </div>\n                    </button>\n                  );\n                }),\n              ]}\n            {!!currentScopeHits && (\n              <div class=\"search-autocomplete-foot\">\n                <button\n                  role=\"option\"\n                  class=\"search-autocomplete-submit\"\n                  ref={(button) => this.autocompleteEles.push(button)}\n                  id={'autocomplete-foot'}\n                  onClick={this.onSearchSubmit}\n                  onMouseDown={this.onSearchSubmit}\n                >\n                  View all results\n                </button>\n              </div>\n            )}\n          </div>\n        );\n      } else if (!currentScopeHits) {\n        content = (\n          <div class=\"search-autocomplete-hit search-autocomplete-hit--no-result\">\n            No results matching '{this.searchValInternal}' were found. Try\n            another phrase.\n          </div>\n        );\n      }\n    }\n\n    return (\n      <div\n        class=\"search-autocomplete\"\n        role=\"listbox\"\n        id=\"autocomplete-results\"\n        aria-expanded={this.showAutocomplete ? 'true' : 'false'}\n        hidden={!this.showAutocomplete}\n        onKeyDown={this.onAutocompleteInteract}\n      >\n        {content}\n      </div>\n    );\n  }\n\n  private searchWidget(): VNode[] {\n    return [\n      <form\n        class=\"search-inputs\"\n        onSubmit={this.onSearchSubmit}\n        id=\"global-nav-search\"\n      >\n        <nano-select\n          class=\"search-input\"\n          label=\"Which area of content would you like to search?\"\n          hideLabel={true}\n          showInlineError={false}\n          value={this.searchIndex}\n          onNanoChange={this.onSearchIndexChange}\n          mask={true}\n        >\n          {this.internalSearchIndeces.map((index) => {\n            return (\n              <nano-option\n                selected={index.index === this.searchIndex}\n                value={index.index}\n              >\n                {index.name || index.index}\n              </nano-option>\n            );\n          })}\n        </nano-select>\n        <nano-input\n          class=\"search-input\"\n          label=\"What would you like to search for?\"\n          aria-label=\"What would you like to search for?\"\n          hideLabel={true}\n          showInlineError={false}\n          clear-input\n          placeholder=\"Search Nanopore\"\n          type=\"text\"\n          ref={(input) => (this.searchInput = input)}\n          onNanoChange={this.onSearchChange}\n          onNanoInput={this.onSearchInput}\n          onKeyDown={this.onAutocompleteInteract}\n          debounce={500}\n          aria-autocomplete=\"list\"\n          aria-activedescendant={\n            this.autocompleteEles[this.currAIndex]\n              ? this.autocompleteEles[this.currAIndex].id\n              : false\n          }\n          aria-controls=\"autocomplete-results\"\n          onNanoFocus={this.showAutocompleteResults}\n          value={this.searchValue}\n          role=\"textbox\"\n        >\n          <button\n            class={{\n              'search-icon': true,\n              'search-icon--search': true,\n              'search-icon--show': !this.searchValInternal.length,\n            }}\n            slot=\"end\"\n            onMouseDown={(e) => {\n              this.searchValInternal = this.searchInput.value;\n              this.onSearchSubmit(e, true);\n            }}\n          >\n            <nano-icon name=\"light/search\"></nano-icon>\n          </button>\n          <span\n            class={{\n              'search-icon': true,\n              'search-icon--loader': true,\n              'search-icon--show': this.searchLoading,\n            }}\n            slot=\"end\"\n          >\n            <nano-icon name=\"light/spinner-third\"></nano-icon>\n          </span>\n        </nano-input>\n        <input type=\"submit\" />\n      </form>,\n    ];\n  }\n\n  render() {\n    this.autocompleteEles = [];\n    const isRtl = (this.el.ownerDocument as Document).dir === 'rtl';\n\n    const searchWidget = this.searchWidget();\n    searchWidget.push(this.autocompleteList());\n\n    return (\n      <Host\n        class={{\n          [this.thresholdClasses().join(' ')]: true,\n          ready: this.ready,\n          'search-bar-shown': this.searchBarShown && this.scrollingUp,\n          'search-auto-complete-shown':\n            this.showAutocomplete && this.scrollingUp,\n          'modal-open': this.modalIsOpen,\n          resizing: this.isResizing,\n        }}\n        dir={isRtl ? 'rtl' : null}\n      >\n        <div\n          class={{\n            'global-nav': true,\n            'scrolling-down': !this.scrollingUp,\n          }}\n        >\n          {/* START BURGER / OVERFLOW MENU */}\n          <nav\n            id=\"global-nav-menu\"\n            class={{\n              'gn-menu': true,\n              open: this.modalOpen,\n              'has-promotion': this.hasPromotionSlot,\n              'menu-full-screen': this.menuFullScreen,\n              'secondary-open': this.secondaryMenuOpen,\n            }}\n            aria-expanded={this.modalOpen ? 'true' : 'false'}\n            ref={(div) => (this.menuDiv = div)}\n          >\n            <div\n              class=\"gn-menu_wrap\"\n              ref={(div) => (this.menuWrapDiv = div)}\n              tabindex=\"-1\"\n            >\n              <div class=\"gn-menu_actions\">\n                <button\n                  class=\"menu-btn icon-btn icon-btn\"\n                  onMouseDown={this.onMenuBtnClick}\n                  onKeyDown={this.onMenuBtnKeyDown}\n                >\n                  {this.threshold < this.THRESHOLDLIMIT - 3 && (\n                    <nano-icon\n                      name=\"light/times\"\n                      aria-label=\"close menu\"\n                    ></nano-icon>\n                  )}\n                  {this.threshold >= this.THRESHOLDLIMIT - 3 && (\n                    <nano-icon\n                      name=\"light/bars\"\n                      aria-label=\"close menu\"\n                    ></nano-icon>\n                  )}\n                </button>\n\n                {this.threshold <\n                  this.THRESHOLDLIMIT - THRESHOLDBREAKS.icon && [\n                  !!this.iconSlotLen && <slot name=\"icon\" />,\n                  this.myAccData &&\n                    (!this.activeMyAccountSections ||\n                      this.activeMyAccountSections.includes('icons')) && [\n                      this.msgUrl && (\n                        <a href={this.msgUrl} class=\"icon-btn\">\n                          <nano-icon name=\"light/bell\"></nano-icon>\n                          {this.msgCount > 0 && (\n                            <span class=\"gn-menu_actions-counter\">\n                              {this.msgCount}\n                            </span>\n                          )}\n                        </a>\n                      ),\n                      this.cartUrl && (\n                        <a href={this.cartUrl} class=\"icon-btn\">\n                          <nano-icon name=\"light/shopping-cart\"></nano-icon>\n                          {this.cartCount > 0 && (\n                            <span class=\"gn-menu_actions-counter\">\n                              {this.cartCount}\n                            </span>\n                          )}\n                        </a>\n                      ),\n                    ],\n                ]}\n\n                {this.myAccData && this.myAccData.urls.login && (\n                  <a\n                    href={this.myAccData.urls.login + this.ssoRedirect}\n                    class=\"login-btn\"\n                  >\n                    Login / Register{' '}\n                    <nano-icon name=\"solid/chevron-right\"></nano-icon>\n                  </a>\n                )}\n              </div>\n\n              <div\n                class=\"content-wrap\"\n                ref={(div) => (this.menuContentDiv = div)}\n              >\n                <div class=\"content\">\n                  <nav class=\"nav-links nav-links--main\">\n                    <slot name=\"overflow\" />\n                    {this.threshold <\n                      this.THRESHOLDLIMIT - THRESHOLDBREAKS.main &&\n                      !!this.mainSlotLen && <slot name=\"main\" />}\n                  </nav>\n\n                  {/* ABOUT AND SITE MENU IN BURGER */}\n                  {(((!!this.aboutSlotLen || !!this.aboutNavItms.length) &&\n                    this.hasSiteSlot) ||\n                    !!this.siteNavItms.length) && (\n                    <div>\n                      {(!!this.aboutSlotLen || !!this.aboutNavItms.length) && [\n                        // About Menu as an open list (before more items are added to burger)`\n                        (this.threshold >=\n                          this.THRESHOLDLIMIT - (THRESHOLDBREAKS.about + 1) ||\n                          this.mainSlotLen < 2) &&\n                          this.overflowSlotLen < 2 && (\n                            <div class=\"nav-links-wrap\">\n                              {!!this.aboutNavItms.length && (\n                                <h4 class=\"nav-links_title\">About</h4>\n                              )}\n                              <nav\n                                class=\"nav-links nav-links--sub\"\n                                aria-label=\"About the company links\"\n                              >\n                                <slot name=\"about\" />\n\n                                {this.aboutNavItms.map((link) => {\n                                  return (\n                                    <nano-nav-item class=\"nano-global-nav nano-global-nav-menu\">\n                                      <a\n                                        href={link.address}\n                                        target={link.target}\n                                      >\n                                        {link.title}\n                                      </a>\n                                    </nano-nav-item>\n                                  );\n                                })}\n                              </nav>\n                            </div>\n                          ),\n                        // About Menu as hidden list (when more items are added to burger)\n                        ((this.threshold <\n                          this.THRESHOLDLIMIT - (THRESHOLDBREAKS.about + 1) &&\n                          this.mainSlotLen >= 2) ||\n                          this.overflowSlotLen >= 2) && (\n                          <nav\n                            class=\"nav-links\"\n                            aria-label=\"About the company links\"\n                          >\n                            {!this.aboutNavItms.length && <slot name=\"about\" />}\n                            {!!this.aboutNavItms.length && (\n                              <nano-nav-item class=\"nano-global-nav nano-global-nav-menu\">\n                                Company\n                                <nano-icon\n                                  slot=\"icon-end\"\n                                  name=\"solid/chevron-right\"\n                                ></nano-icon>\n                                <div slot=\"secondary\">\n                                  <div class=\"content\">\n                                    <button\n                                      class=\"back-btn\"\n                                      onClick={this.subMenuClose}\n                                    >\n                                      <nano-icon\n                                        slot=\"icon-end\"\n                                        name=\"solid/chevron-left\"\n                                        aria-label=\"go back\"\n                                      ></nano-icon>\n                                      Company\n                                    </button>\n                                    <slot name=\"about\" />\n                                    <div class=\"content--sub\">\n                                      {this.aboutNavItms.map((link) => {\n                                        return (\n                                          <nano-nav-item class=\"nano-global-nav nano-global-nav-menu\">\n                                            <a\n                                              href={link.address}\n                                              target={link.target}\n                                            >\n                                              {link.title}\n                                            </a>\n                                          </nano-nav-item>\n                                        );\n                                      })}\n                                    </div>\n                                  </div>\n                                </div>\n                              </nano-nav-item>\n                            )}\n                          </nav>\n                        ),\n                      ]}\n\n                      {/* SITES MENU (Always in burger) */}\n                      {(this.hasSiteSlot || !!this.siteNavItms.length) && [\n                        (this.threshold >= this.THRESHOLDLIMIT - 2 ||\n                          this.mainSlotLen < 2) &&\n                          this.overflowSlotLen < 2 && (\n                            <div class=\"nav-links-wrap\">\n                              <h4 class=\"nav-links_title\">Sites</h4>\n                              <nav\n                                class=\"nav-links nav-links--sub\"\n                                aria-label=\"Different company site links\"\n                              >\n                                <slot name=\"site\" />\n                                {this.siteNavItms.map((link) => {\n                                  return (\n                                    <nano-nav-item class=\"nano-global-nav nano-global-nav-menu\">\n                                      <a\n                                        href={link.address}\n                                        target={link.target}\n                                      >\n                                        {link.title}\n                                      </a>\n                                    </nano-nav-item>\n                                  );\n                                })}\n                              </nav>\n                            </div>\n                          ),\n                        ((this.threshold < this.THRESHOLDLIMIT - 2 &&\n                          this.mainSlotLen >= 2) ||\n                          this.overflowSlotLen >= 2) && (\n                          <nav\n                            class=\"nav-links\"\n                            aria-label=\"Different company site links\"\n                          >\n                            <nano-nav-item class=\"nano-global-nav nano-global-nav-menu\">\n                              Sites\n                              <nano-icon\n                                slot=\"icon-end\"\n                                name=\"solid/chevron-right\"\n                              ></nano-icon>\n                              <div slot=\"secondary\">\n                                <div class=\"content\">\n                                  <button\n                                    class=\"back-btn\"\n                                    onClick={this.subMenuClose}\n                                  >\n                                    <nano-icon\n                                      slot=\"icon-end\"\n                                      name=\"solid/chevron-left\"\n                                      aria-label=\"go back\"\n                                    ></nano-icon>\n                                    Sites\n                                  </button>\n                                  <div class=\"content--sub\">\n                                    <slot name=\"site\" />\n                                    {this.siteNavItms.map((link) => {\n                                      return (\n                                        <nano-nav-item class=\"nano-global-nav nano-global-nav-menu\">\n                                          <a\n                                            href={link.address}\n                                            target={link.target}\n                                          >\n                                            {link.title}\n                                          </a>\n                                        </nano-nav-item>\n                                      );\n                                    })}\n                                  </div>\n                                </div>\n                              </div>\n                            </nano-nav-item>\n                          </nav>\n                        ),\n                      ]}\n                    </div>\n                  )}\n                </div>\n\n                {this.isLoggedIn &&\n                  this.threshold <\n                    this.THRESHOLDLIMIT - THRESHOLDBREAKS.login &&\n                  (this.loggedInNavItms.length || this.hasLoggedinSlot) && (\n                    <nav class=\"nav-links\" aria-label=\"Your user account links\">\n                      <nano-nav-item class=\"nano-global-nav user-nav nano-global-nav-menu\">\n                        {this.myAccountUser.name}\n                        <nano-icon\n                          slot=\"icon-end\"\n                          name=\"solid/chevron-right\"\n                        ></nano-icon>\n                        <div slot=\"secondary\">\n                          <div class=\"content\">\n                            <button\n                              class=\"back-btn\"\n                              onClick={this.subMenuClose}\n                            >\n                              <nano-icon\n                                slot=\"icon-end\"\n                                name=\"solid/chevron-left\"\n                                aria-label=\"go back\"\n                              ></nano-icon>\n                              {this.myAccountUser.name}\n                            </button>\n                            {!!this.myAccountUser?.small_avatar_url && (\n                              <nano-global-nav-user-profile\n                                myAccountUser={this.myAccountUser}\n                                userProfileUrl={this.userProfileUrl}\n                              ></nano-global-nav-user-profile>\n                            )}\n                            <div class=\"content--sub\">\n                              <slot name=\"loggedin\" />\n                              {this.loggedInNavItms.map((link) => {\n                                return (\n                                  <nano-nav-item class=\"nano-global-nav nano-global-nav-menu\">\n                                    <a href={link.address} target={link.target}>\n                                      {link.title}\n                                    </a>\n                                  </nano-nav-item>\n                                );\n                              })}\n                              <nano-nav-item class=\"nano-global-nav nano-global-nav-menu\">\n                                <a\n                                  href={\n                                    this.myAccData.urls.forgot_password +\n                                    this.ssoRedirect\n                                  }\n                                >\n                                  Change Password\n                                </a>\n                              </nano-nav-item>\n                            </div>\n                          </div>\n                        </div>\n                      </nano-nav-item>\n                    </nav>\n                  )}\n\n                <slot name=\"promotion\" />\n\n                {this.myAccData && this.myAccData.urls.logout && (\n                  <div class=\"login-btn logout-btn\">\n                    <a href={this.myAccData.urls.logout + this.ssoRedirect}>\n                      Logout\n                    </a>\n                  </div>\n                )}\n              </div>\n            </div>\n          </nav>\n          {/* END BURGER / OVERFLOW MENU */}\n\n          {/* START MAIN NAV BAR */}\n          <nano-sticker\n            auto-resize=\"false\"\n            break-point-max=\"800\"\n            quietMode={{ h: 600, w: 800 }}\n          >\n            <div class=\"bars\" ref={(div) => (this.barsDiv = div)}>\n              <nav\n                class=\"main-bar\"\n                aria-label=\"Main site navigation\"\n                tabindex=\"-1\"\n                ref={(div) => (this.mainBarDiv = div)}\n              >\n                {(this.hasPromotionSlot ||\n                  !!this.overflowSlotLen ||\n                  ((this.myAccData || !!this.iconSlotLen) &&\n                    this.threshold <\n                      this.THRESHOLDLIMIT - THRESHOLDBREAKS.icon) ||\n                  (this.isLoggedIn &&\n                    (!!this.loggedInNavItms.length || this.hasLoggedinSlot) &&\n                    this.threshold <\n                      this.THRESHOLDLIMIT - THRESHOLDBREAKS.login) ||\n                  (!!this.mainSlotLen &&\n                    this.threshold <\n                      this.THRESHOLDLIMIT - THRESHOLDBREAKS.main) ||\n                  ((!!this.aboutSlotLen || !!this.aboutNavItms.length) &&\n                    this.threshold <\n                      this.THRESHOLDLIMIT - THRESHOLDBREAKS.about) ||\n                  this.hasSiteSlot ||\n                  !!this.siteNavItms.length) && (\n                  <button\n                    class=\"menu-btn icon-btn\"\n                    onMouseDown={this.menuOpen}\n                    onKeyDown={this.onMenuBtnKeyDown}\n                    aria-expanded={this.modalOpen ? 'true' : 'false'}\n                    aria-controls=\"global-nav-menu\"\n                    ref={(btn) => (this.menuBtn = btn)}\n                  >\n                    <nano-icon\n                      name=\"light/bars\"\n                      aria-label=\"open menu\"\n                    ></nano-icon>\n                  </button>\n                )}\n\n                {this.showLogo && (\n                  <a href={this.logoUrl} class=\"logo-link\">\n                    <img\n                      src={getAssetPath(`./assets/ont-logo.svg`)}\n                      alt=\"Oxford Nanopore Technologies Logo\"\n                      class=\"logo\"\n                    />\n                  </a>\n                )}\n                {!this.showLogo && (\n                  <div class=\"logo-link\">\n                    <slot name=\"logo\" />\n                  </div>\n                )}\n\n                <div class=\"nav-links nav-links--main\">\n                  <slot name=\"main\" />\n                </div>\n\n                {this.threshold >=\n                  this.THRESHOLDLIMIT - THRESHOLDBREAKS.search && [\n                  this.showSearch && !!this.internalSearchIndeces.length && (\n                    <div\n                      class=\"search-widget\"\n                      role=\"combobox\"\n                      aria-owns=\"autocomplete-results\"\n                      aria-expanded={\n                        this.showAutocomplete && this.autocompleteResults\n                          ? 'true'\n                          : 'false'\n                      }\n                    >\n                      {searchWidget}\n                    </div>\n                  ),\n                  (!this.showSearch || !this.myAccData) &&\n                    !!this.searchSlotLen && <slot name=\"search\" />,\n                ]}\n\n                {/* Bar Icon buttons */}\n\n                {/* Bar search icon button (when not enough to show search in bar) */}\n                {this.threshold <\n                  this.THRESHOLDLIMIT - THRESHOLDBREAKS.search &&\n                  ((this.showSearch && !!this.internalSearchIndeces.length) ||\n                    !!this.searchSlotLen) && (\n                    <button\n                      class={{\n                        'icon-btn': true,\n                        'search-btn': true,\n                        'search-btn--open': this.searchBarShown,\n                      }}\n                      aria-controls=\"global-nav-search-bar\"\n                      aria-expanded={this.searchBarShown ? 'true' : 'false'}\n                      onMouseDown={this.onSearchBtnClick}\n                      onKeyDown={this.onSearchBtnKeyDown}\n                    >\n                      <nano-icon name=\"light/search\"></nano-icon>\n                    </button>\n                  )}\n\n                {/* Bar cart and notifications  */}\n                {this.threshold >=\n                  this.THRESHOLDLIMIT - THRESHOLDBREAKS.icon && [\n                  !!this.iconSlotLen && <slot name=\"icon\" />,\n                  this.myAccData &&\n                    (!this.activeMyAccountSections ||\n                      this.activeMyAccountSections.includes('icons')) && [\n                      this.msgUrl && (\n                        <a href={this.msgUrl} class=\"icon-btn\">\n                          <nano-icon name=\"light/bell\"></nano-icon>\n                          {this.msgCount > 0 && (\n                            <span class=\"gn-menu_actions-counter\">\n                              {this.msgCount}\n                            </span>\n                          )}\n                        </a>\n                      ),\n                      this.cartUrl && !!this.cartCount && (\n                        <a href={this.cartUrl} class=\"icon-btn\">\n                          <nano-icon name=\"light/shopping-cart\"></nano-icon>\n                          {this.cartCount > 0 && (\n                            <span class=\"gn-menu_actions-counter\">\n                              {this.cartCount}\n                            </span>\n                          )}\n                        </a>\n                      ),\n                    ],\n                ]}\n\n                {/* Bar about links */}\n                {(!!this.aboutSlotLen || !!this.aboutNavItms.length) &&\n                  this.threshold >=\n                    this.THRESHOLDLIMIT - THRESHOLDBREAKS.about && (\n                    <nav\n                      class=\"nav-links nav-links--sub\"\n                      aria-label=\"About the company. Links\"\n                    >\n                      <slot name=\"about\" />\n                      <nano-nav-item class=\"nano-global-nav nano-global-nav-bar\">\n                        <a\n                          href={this.aboutNavItms[0].address}\n                          target={this.aboutNavItms[0].target}\n                        >\n                          {this.aboutNavItms[0].title}\n                        </a>\n                      </nano-nav-item>\n                    </nav>\n                  )}\n\n                {/* Bar login button / User panel */}\n                {this.myAccData &&\n                  (!this.activeMyAccountSections ||\n                    this.activeMyAccountSections.includes('loggedin')) &&\n                  this.threshold >=\n                    this.THRESHOLDLIMIT - THRESHOLDBREAKS.login && [\n                    this.myAccData.urls.login && (\n                      <a\n                        href={this.myAccData.urls.login + this.ssoRedirect}\n                        class=\"login-btn\"\n                      >\n                        Login / Register\n                      </a>\n                    ),\n                    this.myAccountUser && (\n                      <div class=\"user-links\">\n                        <button\n                          class={{\n                            'icon-btn': true,\n                            'user-links-btn': true,\n                            open: this.userMenuOpen,\n                          }}\n                          onMouseDown={this.onUserBtnClick}\n                          onKeyDown={this.onUserBtnKeyDown}\n                        >\n                          {' '}\n                          {this.myAccountUser.name}\n                          <nano-icon name=\"solid/caret-down\"></nano-icon>\n                        </button>\n                        <div\n                          class=\"user-links-panel\"\n                          tabindex=\"-1\"\n                          ref={(div) => (this.userLinkPanel = div)}\n                        >\n                          {!!this.myAccountUser?.small_avatar_url && (\n                            <nano-global-nav-user-profile\n                              myAccountUser={this.myAccountUser}\n                              userProfileUrl={this.userProfileUrl}\n                            ></nano-global-nav-user-profile>\n                          )}\n                          <div class=\"user-links-panel-content\">\n                            {this.loggedInNavItms.map((link) => {\n                              return (\n                                <a href={link.address} target={link.target}>\n                                  {link.title}\n                                </a>\n                              );\n                            })}\n                          </div>\n                          <div class=\"user-links-panel-foot\">\n                            <a\n                              href={\n                                this.myAccData.urls.forgot_password +\n                                this.ssoRedirect\n                              }\n                            >\n                              Change Password\n                            </a>\n                            <a\n                              href={\n                                this.myAccData.urls.logout + this.ssoRedirect\n                              }\n                            >\n                              Logout\n                            </a>\n                          </div>\n                        </div>\n                      </div>\n                    ),\n                  ]}\n                <span class=\"measure-ele\"></span>\n              </nav>\n\n              {this.threshold <\n                this.THRESHOLDLIMIT - THRESHOLDBREAKS.search && (\n                <div\n                  id=\"global-nav-search-bar\"\n                  class={{\n                    'search-bar': true,\n                    show: this.searchBarShown,\n                  }}\n                  aria-expanded={this.searchBarShown ? 'true' : 'false'}\n                  role=\"region\"\n                  tabindex=\"-1\"\n                  ref={(div) => (this.searchBarEl = div)}\n                >\n                  <div class=\"search-widget\">\n                    {this.showSearch && !!this.internalSearchIndeces.length && (\n                      <div>{searchWidget}</div>\n                    )}\n                    {(!this.showSearch || !this.myAccData) &&\n                      !!this.searchSlotLen && <slot name=\"search\" />}\n                  </div>\n                </div>\n              )}\n            </div>\n          </nano-sticker>\n          {/* END MAIN NAV BAR */}\n\n          {(this.threshold < this.THRESHOLDLIMIT - 3 ||\n            this.menuFullScreen) && (\n            <div\n              class={{\n                mask: true,\n                open: this.modalOpen,\n              }}\n              onClick={this.menuClose}\n              onTouchEnd={this.menuClose}\n            ></div>\n          )}\n        </div>\n        <div class=\"site-content\" ref={(div) => (this.siteContent = div)}>\n          <slot />\n        </div>\n      </Host>\n    );\n  }\n\n  // Data processing\n\n  private domainFor(origin: string): string {\n    if (!this.myAccData) return '';\n    const domain = this.myAccData.domains.find((dm) => dm.origin === origin);\n    return domain ? domain.domain : '';\n  }\n\n  private processSearchResults(results: AlgoliaMultiResults | AlgoliaResults) {\n    const multiResults = results as AlgoliaMultiResults;\n    const singleResult = results as AlgoliaResults;\n\n    if (multiResults.results) {\n      multiResults.results.forEach((result, i) => {\n        multiResults.results[i] = this.processSearchResults(\n          result\n        ) as AlgoliaResults;\n      });\n      return multiResults;\n    } else {\n      singleResult.hits.map((hit) => {\n        if (hit.url && !hit.url.match(/^http/))\n          hit.url =\n            location.protocol + '//' + this.domainFor(hit.origin) + hit.url;\n      });\n      return singleResult;\n    }\n  }\n\n  private processMyAccData() {\n    if (!this.myAccData || !this.myAccData.search.indeces.length) return;\n\n    if (this.myAccData.search.api_key)\n      this.searchApiKey = this.myAccData.search.api_key;\n    if (this.myAccData.search.app_id)\n      this.searchAppId = this.myAccData.search.app_id;\n\n    if (this.myAccData.cart.count) this.cartCount = this.myAccData.cart.count;\n    if (this.myAccData.notifications.count)\n      this.msgCount = this.myAccData.notifications.count;\n\n    if (!this.searchAppId || !this.searchApiKey) return;\n    this.internalSearchIndeces = [\n      ...this.myAccData.search.indeces,\n      ...this.searchIndeces,\n    ];\n\n    if (this.myAccData.urls.cart && !this.cartUrl)\n      this.cartUrl = this.myAccData.urls.cart;\n    if (this.myAccData.urls.messages && !this.msgUrl)\n      this.msgUrl = this.myAccData.urls.messages;\n  }\n\n  private processMyAccLinks() {\n    if (!this.myAccData.links || !this.myAccData.links.length) return;\n\n    this.myAccData.links.forEach((link) => {\n      switch (link.area) {\n        case 'left-side-logged-in':\n        case 'left-side-logged-out':\n          if (\n            this.activeMyAccountSections &&\n            !this.activeMyAccountSections.includes('sites')\n          )\n            break;\n          if (this.isLoggedIn && link.area === 'left-side-logged-in')\n            this.siteNavItms.push(link);\n          else if (!this.isLoggedIn && link.area === 'left-side-logged-out')\n            this.siteNavItms.push(link);\n          break;\n        case 'right-side-logged-in':\n        case 'right-side-logged-out':\n          if (\n            this.activeMyAccountSections &&\n            !this.activeMyAccountSections.includes('about')\n          )\n            break;\n          if (this.isLoggedIn && link.area === 'right-side-logged-in')\n            this.aboutNavItms.push(link);\n          else if (!this.isLoggedIn && link.area === 'right-side-logged-out')\n            this.aboutNavItms.push(link);\n          break;\n        case 'profile-panel-list':\n          if (\n            this.activeMyAccountSections &&\n            !this.activeMyAccountSections.includes('loggedin')\n          )\n            break;\n          this.loggedInNavItms.push(link);\n          break;\n      }\n    });\n  }\n}\n"]}

package/dist/nano-components/p-282987e6.entry.js

@@ -1,5 +0,0 @@
-/*!
- * Web Components for Nanopore digital Web Apps
- */
-import{i as n,r as i,h as o,a as t,g as r}from"./p-1fe12320.js";import{c as s}from"./p-7b3638b7.js";let e;const a=()=>{if(!e){const n=window;n.Nanoicons=n.Nanoicons||{};e=n.Nanoicons.map=n.Nanoicons.map||new Map}return e};const c=n=>{let i=h(n.src);if(i){return i}i=f(n.name,n.icon);if(i){return l(i)}if(n.icon){i=h(n.icon);if(i){return i}}return null};const l=i=>{const o=a().get(i);if(o){return o}return n(`../node_modules/@fortawesome/fontawesome-pro/svgs/${i}.svg`)};const f=(n,i)=>{if(!n&&i&&!d(i)){n=i}if(u(n)){n=m(n)}if(!u(n)||n.trim()===""){return null}const o=n.replace(/[a-z]|-|\/|\d/gi,"");if(o!==""){console.warn("invalid characters in icon name "+n);return null}return n};const h=n=>{if(u(n)){n=n.trim();if(d(n)){return n}}return null};const d=n=>n.length>0&&/(\/|\.)/.test(n);const u=n=>typeof n==="string";const m=n=>n.toLowerCase();const p=n=>{if(n){const i=document.createElement("div");i.innerHTML=n;for(let n=i.childNodes.length-1;n>=0;n--){if(i.childNodes[n].nodeName.toLowerCase()!=="svg"){i.removeChild(i.childNodes[n])}}const o=i.firstElementChild;if(o&&o.nodeName.toLowerCase()==="svg"){const n=o.getAttribute("class")||"";o.setAttribute("class",(n+" sc-nano-icon s-nano-icon svg").trim());if(g(o)){return i.innerHTML}}}return""};const g=n=>{if(n.nodeType===1){if(n.nodeName.toLowerCase()==="script"){return false}for(let i=0;i<n.attributes.length;i++){const o=n.attributes[i].value;if(u(o)&&o.toLowerCase().indexOf("on")===0){return false}}for(let i=0;i<n.childNodes.length;i++){if(!g(n.childNodes[i])){return false}}}return true};const v=new Map;const w=new Map;const b=n=>{let i=w.get(n);if(!i){i=fetch(n).then((i=>{if(i.ok){return i.text().then((i=>{v.set(n,p(i))}))}v.set(n,"")}));w.set(n,i)}return i};const y=':host{box-sizing:border-box}*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}:host{--color:var(--nano-color-base, "currentColor");--primary-color:var(--nano-color-tint, "currentColor");--secondary-color:var(--nano-color-shade, "currentColor");--stroke-width:32px;--primary-opacity:0.8;--secondary-opacity:1;--icon-size:var(--nano-icon-size, 1em);--icon-margin-top:var(--nano-icon-margin-top, 0);--icon-margin-end:var(--nano-icon-margin-end, 0);--icon-margin-bottom:var(--nano-icon-margin-bottom, 0);--icon-margin-start:var(--nano-icon-margin-start, 0);display:inline-block;width:var(--icon-size);height:var(--icon-size);min-width:var(--icon-size);min-height:var(--icon-size);contain:strict;fill:currentColor;-webkit-box-sizing:content-box !important;box-sizing:content-box !important;-webkit-transition:opacity 0.3s ease;transition:opacity 0.3s ease;color:var(--color);margin-inline:var(--icon-margin-start) var(--icon-margin-end);margin-block:var(--icon-margin-top) var(--icon-margin-bottom)}:host .nanoicon{stroke:currentColor}.nanoicon-fill-none{fill:none}.nanoicon-stroke-width{stroke-width:32px;stroke-width:var(--stroke-width)}.icon-inner,.nanoicon,svg,.svg{display:block;height:100%;width:100%;overflow:visible}:host(.loading){opacity:0}.fa-primary{color:var(--primary-color);opacity:var(--primary-opacity, 1)}.fa-secondary{color:var(--secondary-color);opacity:var(--secondary-opacity) !important}:host(.flip-rtl) .icon-inner{-webkit-transform:scaleX(-1);transform:scaleX(-1)}:host(.icon-small){font-size:18px !important}:host(.icon-large){font-size:32px !important}';const k=!!document.head.attachShadow;const x=class{constructor(n){i(this,n);this.svgContent=undefined;this.isVisible=false;this.isLoading=true;this.color=undefined;this.ariaLabel=undefined;this.flipRtl=undefined;this.name=undefined;this.src=undefined;this.icon=undefined;this.size=undefined;this.lazy=true}setAriaLabel(){if(!this.ariaLabel){const n=f(this.name,this.icon);if(n){this.ariaLabel=n.split("/").slice(-1)[0].replace(/\-/g," ")}}}connectedCallback(){this.waitUntilVisible(this.el,"50px",(()=>{this.isVisible=true;this.loadIcon()}))}disconnectedCallback(){if(this.io){this.io.disconnect();this.io=undefined}}componentWillLoad(){this.setAriaLabel()}waitUntilVisible(n,i,o){if(k&&this.lazy&&typeof window!=="undefined"&&window.IntersectionObserver){const t=this.io=new window.IntersectionObserver((n=>{if(n[0].isIntersecting||n[1]&&n[1].isIntersecting){t.disconnect();this.io=undefined;o()}}),{rootMargin:i});t.observe(n)}else{o()}}loadIcon(){if(this.isVisible){const n=c(this);if(n){if(v.has(n)){this.svgContent=v.get(n);this.isLoading=false}else{b(n).then((()=>{this.svgContent=v.get(n);this.isLoading=false}))}}}this.setAriaLabel()}render(){const n=this.flipRtl||this.name&&(this.name.indexOf("arrow")>-1||this.name.indexOf("chevron")>-1)&&this.el.ownerDocument.dir==="rtl"&&this.flipRtl!==false;return o(t,{role:"img",class:{...s(this.color),loading:this.isLoading,[`icon-${this.size}`]:!!this.size,"flip-rtl":!!n}},this.svgContent?o("div",{class:"icon-inner",innerHTML:this.svgContent}):o("div",{class:"icon-inner"}))}static get assetsDirs(){return["../../../node_modules/@fortawesome/fontawesome-pro/svgs"]}get el(){return r(this)}static get watchers(){return{name:["loadIcon"],src:["loadIcon"],icon:["loadIcon"]}}};x.style=y;export{x as nano_icon};
-//# sourceMappingURL=p-282987e6.entry.js.map

package/dist/nano-components/p-28b43ee9.entry.js

@@ -1,5 +0,0 @@
-/*!
- * Web Components for Nanopore digital Web Apps
- */
-import{r as t,c as n,h as i,a as e,g as a}from"./p-1fe12320.js";import{c as o}from"./p-845ae77e.js";import{c as r}from"./p-7b3638b7.js";import{d as s,a as l}from"./p-9746b0a5.js";import{F as c,a as p}from"./p-77cad8d1.js";const h='.sc-nano-input-h{box-sizing:border-box}*.sc-nano-input,*.sc-nano-input::before,*.sc-nano-input::after{box-sizing:border-box}[hidden].sc-nano-input{display:none !important}[disabled].sc-nano-input-h:not([disabled=false]){opacity:0.5}.form-ctrl.sc-nano-input{min-inline-size:100%;display:block}.form-ctrl.has-helper-end.sc-nano-input{display:-webkit-box;display:-ms-flexbox;display:flex;gap:1rem;opacity:0}.form-ctrl.has-helper-end.is-ready.sc-nano-input{opacity:1}.form-ctrl.has-helper-end.sc-nano-input .form-ctrl__wrapper.sc-nano-input{-webkit-box-flex:1;-ms-flex:1 1 100%;flex:1 1 100%}.form-ctrl.has-helper-end.sc-nano-input .form-ctrl__helper-end.sc-nano-input{display:none}.form-ctrl.has-helper-end.has-enough-width.sc-nano-input .form-ctrl__helper-end.sc-nano-input{display:block}.form-ctrl.has-helper-end.has-enough-width.sc-nano-input .form-ctrl__helper.sc-nano-input{display:none}.form-ctrl__wrapper.sc-nano-input{display:block}label.sc-nano-input,.form-ctrl__more.sc-nano-input,.form-ctrl__error.sc-nano-input,.form-ctrl__helper.sc-nano-input{display:block;inline-size:100%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}label.visually-hide.sc-nano-input,.form-ctrl__more.visually-hide.sc-nano-input,.form-ctrl__error.visually-hide.sc-nano-input,.form-ctrl__helper.visually-hide.sc-nano-input{clip:rect(1px, 1px, 1px, 1px);-webkit-clip-path:inset(50%);clip-path:inset(50%);block-size:1px;inline-size:1px;margin:-1px;overflow:hidden;padding:0;position:absolute}.form-ctrl__float-label.sc-nano-input{padding-block:0;-webkit-padding-end:0;padding-inline-end:0;-webkit-padding-start:var(--padding-start);padding-inline-start:var(--padding-start);color:var(--label-color);position:absolute;font-size:1.15em;-webkit-transform:translateY(-50%);transform:translateY(-50%);-webkit-transform-origin:top left;transform-origin:top left;inset-block-start:50%;-webkit-transition:all 0.125s ease-in;transition:all 0.125s ease-in;opacity:1}.has-focus.sc-nano-input-h .form-ctrl__float-label.sc-nano-input,.has-value.sc-nano-input-h .form-ctrl__float-label.sc-nano-input{-webkit-transform:translateY(-110%);transform:translateY(-110%);font-size:0.8em;opacity:0.7}.form-ctrl__float-label.sc-nano-input .form-ctrl__label-charcount.sc-nano-input{opacity:0;-webkit-transition:opacity 0.125s ease-in;transition:opacity 0.125s ease-in}.has-focus.sc-nano-input-h .form-ctrl__float-label.sc-nano-input .form-ctrl__label-charcount.sc-nano-input,.has-value.sc-nano-input-h .form-ctrl__float-label.sc-nano-input .form-ctrl__label-charcount.sc-nano-input{opacity:1}.form-ctrl__textarea.sc-nano-input .form-ctrl__float-label.sc-nano-input{inset-block-start:50%}.has-focus.sc-nano-input-h .form-ctrl__textarea.sc-nano-input .form-ctrl__float-label.sc-nano-input{inset-block-start:0;-webkit-transform:translateY(38%);transform:translateY(38%)}.has-value.sc-nano-input-h .form-ctrl__textarea.sc-nano-input .form-ctrl__float-label.sc-nano-input{inset-block-start:0;-webkit-transform:translateY(38%);transform:translateY(38%)}.form-ctrl__label.sc-nano-input{color:var(--label-color);font-size:var(--label-font-size);-webkit-padding-after:var(--padding-bottom);padding-block-end:var(--padding-bottom);line-height:1;display:-webkit-box;display:-ms-flexbox;display:flex}.form-ctrl__label.sc-nano-input .form-ctrl__label-wrap.sc-nano-input{-webkit-box-flex:1;-ms-flex:1;flex:1;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.form-ctrl__label.sc-nano-input .form-ctrl__label-placeholder.sc-nano-input{margin-block:unset;-webkit-margin-end:5px;margin-inline-end:5px;-webkit-margin-start:0;margin-inline-start:0;opacity:0;-webkit-appearance:none;-moz-appearance:none;appearance:none;-webkit-transition:0.3s ease opacity;transition:0.3s ease opacity;font-size:0.9em}.form-ctrl__label.sc-nano-input .form-ctrl__label-charcount.sc-nano-input{margin-block:unset;-webkit-margin-end:0;margin-inline-end:0;-webkit-margin-start:auto;margin-inline-start:auto;font-size:0.9em;opacity:0.5}.has-value.sc-nano-input-h .form-ctrl__label.sc-nano-input .form-ctrl__label-placeholder.sc-nano-input{opacity:0.5}.has-focus.sc-nano-input-h .form-ctrl__label.sc-nano-input{color:var(--label-color--focus)}.is-invalid.sc-nano-input-h .form-ctrl__label.sc-nano-input{color:var(--label-color--invalid)}.has-float-label.sc-nano-input .select__multi-input.sc-nano-input,.has-float-label.sc-nano-input .select__native-input.sc-nano-input,.has-float-label.sc-nano-input .input__native-ctrl.sc-nano-input{opacity:0;-webkit-transition:opacity 0.125s ease-in;transition:opacity 0.125s ease-in}.has-focus.sc-nano-input-h .has-float-label.sc-nano-input .select__multi-input.sc-nano-input,.has-value.sc-nano-input-h .has-float-label.sc-nano-input .select__multi-input.sc-nano-input,.has-focus.sc-nano-input-h .has-float-label.sc-nano-input .select__native-input.sc-nano-input,.has-value.sc-nano-input-h .has-float-label.sc-nano-input .select__native-input.sc-nano-input,.has-focus.sc-nano-input-h .has-float-label.sc-nano-input .input__native-ctrl.sc-nano-input,.has-value.sc-nano-input-h .has-float-label.sc-nano-input .input__native-ctrl.sc-nano-input{opacity:1}.form-ctrl__more.sc-nano-input{block-size:1em;position:relative;margin-block:4px var(--padding-bottom);margin-inline:3px 0}.form-ctrl__helper.sc-nano-input,.form-ctrl__error.sc-nano-input{inset-block-start:0;inset-inline-start:0;position:absolute;font-size:var(--invalid-msg-font-size);line-height:1.2;-webkit-transition:0.3s ease-out opacity;transition:0.3s ease-out opacity}.form-ctrl__helper.sc-nano-input{font-style:italic;color:var(--help-msg-color)}[show-inline-error].sc-nano-input-h:not([show-inline-error=false]).is-invalid .form-ctrl__helper.sc-nano-input{opacity:0}.form-ctrl__helper-end.sc-nano-input{-webkit-box-flex:1;-ms-flex:1 1 30%;flex:1 1 30%;min-inline-size:150px;font-size:var(--invalid-msg-font-size);color:var(--help-msg-color);font-style:italic}.form-ctrl__error.sc-nano-input{opacity:0;color:var(--invalid-msg-color);font-stretch:condensed}.is-invalid.sc-nano-input-h .form-ctrl__error.sc-nano-input{opacity:1}.form-ctrl__input.sc-nano-input{font-family:inherit;font-size:inherit;font-stretch:inherit;font-style:inherit;font-weight:inherit;letter-spacing:inherit;text-decoration:inherit;text-overflow:inherit;text-transform:inherit;text-align:inherit;white-space:inherit;color:inherit;border-radius:var(--input-border-radius);inline-size:100%;padding:0 !important;position:relative;-webkit-box-flex:1;-ms-flex:1 0 auto;flex:1 0 auto;display:-webkit-box;display:-ms-flexbox;display:flex;background:var(--input-bg-color);border:var(--input-border-style);border-width:var(--input-border-width);font-size:var(--input-font-size);-webkit-padding-start:calc(var(--input-border-hint-width) - var(--input-border-width)) !important;padding-inline-start:calc(var(--input-border-hint-width) - var(--input-border-width)) !important}.has-focus.sc-nano-input-h .form-ctrl__input.sc-nano-input{background:var(--input-bg-color--focus);border:var(--input-border-style--focus);border-width:var(--input-border-width);-webkit-padding-start:calc(var(--input-border-hint-width) - var(--input-border-width)) !important;padding-inline-start:calc(var(--input-border-hint-width) - var(--input-border-width)) !important}.is-invalid.sc-nano-input-h .form-ctrl__input.sc-nano-input{background:var(--input-bg-color--invalid);border:var(--input-border-style--invalid);border-width:var(--input-border-width);-webkit-border-start:var(--input-border-style--invalid-focus) var(--input-border-hint-width);border-inline-start:var(--input-border-style--invalid-focus) var(--input-border-hint-width);-webkit-padding-start:0 !important;padding-inline-start:0 !important}.is-invalid.has-focus.sc-nano-input-h .form-ctrl__input.sc-nano-input{background:var(--input-bg-color--invalid);border:var(--input-border-style--invalid-focus);border-width:var(--input-border-width);-webkit-border-start:var(--input-border-style--invalid-focus) var(--input-border-hint-width);border-inline-start:var(--input-border-style--invalid-focus) var(--input-border-hint-width);-webkit-padding-start:0 !important;padding-inline-start:0 !important}.form-ctrl__input-wrap.sc-nano-input{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:stretch;-ms-flex-align:stretch;align-items:stretch;-webkit-box-flex:1;-ms-flex:1;flex:1;max-inline-size:100%}.form-ctrl__clear-btn.sc-nano-input,.form-ctrl__slot-end.sc-nano-input,.form-ctrl__slot-start.sc-nano-input,.form-ctrl__slot-value-end.sc-nano-input{--nano-icon-size:1.4em;margin-block:0;margin-inline:0;font-size:1em;border:0;outline:none;background-color:transparent;background-repeat:no-repeat;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:stretch;-ms-flex-align:stretch;align-items:stretch;inline-size:auto}.has-float-label.sc-nano-input .form-ctrl__slot-start.sc-nano-input{display:none}.form-ctrl__slot-start.sc-nano-input-s>*,.form-ctrl__slot-start .sc-nano-input-s>*,.form-ctrl__slot-end.sc-nano-input-s>*,.form-ctrl__slot-end .sc-nano-input-s>*,.form-ctrl__slot-value-end.sc-nano-input-s>*,.form-ctrl__slot-value-end .sc-nano-input-s>*,.form-ctrl__slot-value-end.sc-nano-input *.sc-nano-input{--nano-icon-size:1.4em;padding-inline:unset;-webkit-padding-start:var(--padding-start);padding-inline-start:var(--padding-start);-webkit-padding-end:var(--padding-end);padding-inline-end:var(--padding-end);font-size:1em;-webkit-box-align:center;-ms-flex-align:center;align-items:center;display:-webkit-box;display:-ms-flexbox;display:flex;block-size:100%;z-index:1}.sc-nano-input-h[disabled]:not([disabled=false]) .form-ctrl__slot-start.sc-nano-input-s>*,.sc-nano-input-h[disabled]:not([disabled=false]) .form-ctrl__slot-start .sc-nano-input-s>*,.sc-nano-input-h[disabled]:not([disabled=false]) .form-ctrl__slot-end.sc-nano-input-s>*,.sc-nano-input-h[disabled]:not([disabled=false]) .form-ctrl__slot-end .sc-nano-input-s>*,.sc-nano-input-h[disabled]:not([disabled=false]) .form-ctrl__slot-value-end.sc-nano-input-s>*,.sc-nano-input-h[disabled]:not([disabled=false]) .form-ctrl__slot-value-end .sc-nano-input-s>*,[disabled].sc-nano-input-h:not([disabled=false]) .form-ctrl__slot-value-end.sc-nano-input *.sc-nano-input{pointer-events:none}.form-ctrl__slot-value-end.sc-nano-input-s>*,.form-ctrl__slot-value-end .sc-nano-input-s>*,.form-ctrl__slot-value-end.sc-nano-input *.sc-nano-input{pointer-events:none}.form-ctrl__clear-btn.sc-nano-input{color:var(--clear-btn-color);padding:0;opacity:0;inline-size:0;-webkit-appearance:none;-moz-appearance:none;appearance:none;-webkit-box-align:center;-ms-flex-align:center;align-items:center;overflow:hidden}.is-invalid.sc-nano-input-h .form-ctrl__clear-btn.sc-nano-input{color:var(--clear-btn-color--invalid)}.has-value.sc-nano-input-h .form-ctrl__clear-btn.sc-nano-input{padding-block:0;padding-inline:var(--padding-start) var(--padding-end);opacity:1;inline-size:auto}.form-ctrl__clear-btn.sc-nano-input:hover{color:var(--clear-btn-color--hover)}.sc-nano-input-h{--placeholder-color:var(--nano-input-placeholder-color, initial);--placeholder-font-style:var(--nano-input-placeholder-style, initial);--placeholder-font-weight:var(--nano-input-placeholder-weight, initial);--placeholder-opacity:var(--nano-input-placeholder-opacity, 0.5);--padding-top:var(--nano-input-padding-top, var(--nano-input-padding, 8px));--padding-end:var(--nano-input-padding-end, var(--nano-input-padding, 8px));--padding-bottom:var(--nano-input-padding-bottom, var(--nano-input-padding, 6px));--padding-start:var(--nano-input-padding-start, var(--nano-input-padding, 8px));--color-invalid:var(--nano-color-danger-rgb, 239, 65, 53);--color--focus-rgb:var(\n      --nano-color-base-rgb,\n      var(--nano-color-primary-rgb, 0, 116, 149)\n    );--input-font-size:var(--nano-input-font-size, 0.87em);--input-text-color:var(--nano-input-text-color, #4a4a4a);--input-border-width:var(--nano-input-border-width, 1px);--input-border-hint-width:3px;--input-border-color:var(--nano-input-border-color, #e4e6e8);--input-border-radius:var(--nano-input-border-radius, 0);--input-border-style:var(--nano-input-border-style, solid) var(--nano-input-border-color, #e4e6e8);--input-border-style--focus:var(--nano-input-border-style, solid) var(--nano-input-border-color--focus, #90c6e7);--input-border-style--invalid:var(--nano-input-border-style, solid) var(--nano-input-border-color--invalid, #e4e6e8);--input-border-style--invalid-focus:var(--nano-input-border-style, solid) var(--nano-input-border-color--invalid, #ef4135);--input-bg-color:var(--nano-input-background-color, #fff);--input-bg-color--focus:var(--input-bg-color);--input-bg-color--invalid:var(--nano-input-background-color, white);--invalid-msg-color:rgba(var(--color-invalid), 1);--invalid-msg-font-size:var(--nano-input-help-font-size, 0.75em);--help-msg-color:var(--nano-input-help-color, #616d6e);--clear-btn-color:var(--nano-clear-btn-color, rgba(0, 0, 0, 0.3));--clear-btn-color--hover:rgba(var(--color--focus-rgb), 1);--clear-btn-color--invalid:rgba(var(--color-invalid), 1);--label-color:var(--nano-input-label-color, "currentColor");--label-color--focus:var(--label-color);--label-color--invalid:var(--nano-input-label-color-invalid, "currentColor");--label-font-size:var(--nano-input-label-color, 1em);--multi-input-value-bg:var(--nano-input-tag-bg, 186, 220, 240);--multi-input-value-text-color:var(--nano-input-tag-color, #455556);--multi-input-value-border:var(--nano-input-tag-color, #badcf0);position:relative;inline-size:100%;padding:0 !important;color:currentColor;display:block}.nano-color.sc-nano-input-h{color:var(--nano-color-base);--input-border-style--focus:var(--nano-input-border-style, solid) var(--nano-color-tint, var(--nano-color-primary-tint, #2689a5))}.input__native-ctrl.sc-nano-input{font-family:inherit;font-size:inherit;font-stretch:inherit;font-style:inherit;font-weight:inherit;letter-spacing:inherit;text-decoration:inherit;text-overflow:inherit;text-transform:inherit;text-align:inherit;white-space:inherit;color:inherit;padding-block:0;padding-inline:var(--padding-start) var(--padding-end);border-radius:var(--input-border-radius);text-overflow:ellipsis;color:var(--input-text-color);display:inline-block;-webkit-box-flex:1;-ms-flex:1;flex:1;inline-size:100%;max-inline-size:100%;max-block-size:100%;border:0;outline:none;background:transparent;-webkit-appearance:none;-moz-appearance:none;appearance:none;margin:0;-webkit-box-sizing:border-box;box-sizing:border-box;resize:none;overflow:hidden;line-height:2.5em}.has-float-label.sc-nano-input .input__native-ctrl.sc-nano-input{line-height:2.1em;min-height:2.1em;-webkit-padding-before:1.4em;padding-block-start:1.4em}.input__native-ctrl.sc-nano-input::-webkit-input-placeholder{color:var(--placeholder-color);font-family:inherit;font-style:var(--placeholder-font-style);font-weight:var(--placeholder-font-weight);opacity:var(--placeholder-opacity);line-height:inherit;min-height:initial}.input__native-ctrl.sc-nano-input::-moz-placeholder{color:var(--placeholder-color);font-family:inherit;font-style:var(--placeholder-font-style);font-weight:var(--placeholder-font-weight);opacity:var(--placeholder-opacity);line-height:inherit;min-height:initial}.input__native-ctrl.sc-nano-input:-ms-input-placeholder{color:var(--placeholder-color);font-family:inherit;font-style:var(--placeholder-font-style);font-weight:var(--placeholder-font-weight);opacity:var(--placeholder-opacity);line-height:inherit;min-height:initial}.input__native-ctrl.sc-nano-input::-ms-input-placeholder{color:var(--placeholder-color);font-family:inherit;font-style:var(--placeholder-font-style);font-weight:var(--placeholder-font-weight);opacity:var(--placeholder-opacity);line-height:inherit;min-height:initial}.input__native-ctrl.sc-nano-input::placeholder{color:var(--placeholder-color);font-family:inherit;font-style:var(--placeholder-font-style);font-weight:var(--placeholder-font-weight);opacity:var(--placeholder-opacity);line-height:inherit;min-height:initial}.input__native-ctrl.sc-nano-input::-moz-placeholder{line-height:2.8em;text-overflow:ellipsis}.input__native-ctrl.sc-nano-input:-webkit-autofill{background-color:transparent}.input__native-ctrl.sc-nano-input::-webkit-search-decoration,.input__native-ctrl.sc-nano-input::-webkit-search-cancel-button,.input__native-ctrl.sc-nano-input::-webkit-search-results-button,.input__native-ctrl.sc-nano-input::-webkit-search-results-decoration{-webkit-appearance:none;appearance:none}.input__native-ctrl.sc-nano-input:invalid{-webkit-box-shadow:none;box-shadow:none}.input__native-ctrl.sc-nano-input::-ms-clear,.input__native-ctrl.sc-nano-input::-ms-reveal{display:none}.input__native-ctrl.input__resizable.sc-nano-input{resize:vertical;overflow:auto}.form-ctrl__textarea.sc-nano-input .input__native-ctrl.sc-nano-input{line-height:1.5em;padding-block:var(--padding-top) 0.25em;white-space:pre-wrap}.form-ctrl__textarea.sc-nano-input .input__native-ctrl.sc-nano-input::-webkit-input-placeholder{line-height:1.5em}.form-ctrl__textarea.sc-nano-input .input__native-ctrl.sc-nano-input::-moz-placeholder{line-height:1.5em}.form-ctrl__textarea.sc-nano-input .input__native-ctrl.sc-nano-input:-ms-input-placeholder{line-height:1.5em}.form-ctrl__textarea.sc-nano-input .input__native-ctrl.sc-nano-input::-ms-input-placeholder{line-height:1.5em}.form-ctrl__textarea.sc-nano-input .input__native-ctrl.sc-nano-input::placeholder{line-height:1.5em}.has-float-label.sc-nano-input .form-ctrl__textarea.sc-nano-input .input__native-ctrl.sc-nano-input{-webkit-padding-before:1.75em;padding-block-start:1.75em}[readonly].sc-nano-input-h:not([readonly=false]) .input__native-ctrl.sc-nano-input{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}';let d=0;const u=class{constructor(i){t(this,i);this.nanoInput=n(this,"nanoInput",7);this.nanoChange=n(this,"nanoChange",7);this.nanoBlur=n(this,"nanoBlur",7);this.nanoFocus=n(this,"nanoFocus",7);this.nanoDidLoad=n(this,"nanoDidLoad",7);this.nanoDidUnload=n(this,"nanoDidUnload",7);this.nanoValidate=n(this,"nanoValidate",7);this.inputId=`nano-input-${d++}`;this.didBlurAfterEdit=false;this.rtl=false;this.charCount=0;this.hasRendered=false;this.validate=t=>{if(this.validateOn==="submitThenDirty")this.validateOn="dirty";if(!this.nativeInput.validity.valid){if(this.showInlineError){if(t)t.preventDefault();this.errorMessage=this.nativeInput.validationMessage}this._invalid=true}else this._invalid=false;this.nanoValidate.emit({isValid:!this._invalid,errorMessage:this.nativeInput.validationMessage,originalEvent:t})};this.onInput=t=>{const n=t.target;this.value=n?.value||"";this.nanoInput.emit(t)};this.onBlur=()=>{this.hasFocus=false;this.focusChanged();if(this.validateOn==="dirty")this.validate();this.nanoBlur.emit()};this.onFocus=()=>{this.hasFocus=true;this.focusChanged();this.nanoFocus.emit()};this.onKeydown=()=>{if(this.shouldClearOnEdit()){if(this.didBlurAfterEdit&&this.hasValue()){this.clearTextInput()}this.didBlurAfterEdit=false}};this.clearTextInput=t=>{if(this.clearInput&&!this.readonly&&!this.disabled&&t){t.preventDefault();t.stopPropagation()}this.value="";this.nativeInput.value="";const n=new window.Event("change");this.nativeInput.dispatchEvent(n)};this.hasFocus=false;this.hasLabelSlot=false;this.hasHelperSlot=false;this.hasHelperEndSlot=false;this.errorMessage="";this.datalist=null;this._invalid=false;this.color=undefined;this.accept=undefined;this.autocapitalise="none";this.autocomplete="off";this.autocorrect="off";this.autofocus=false;this.clearInput=false;this.clearOnEdit=undefined;this.debounce=0;this.disabled=false;this.inputmode=undefined;this.validateOn="submitThenDirty";this.showInlineError=true;this.label=undefined;this.hideLabel=false;this.floatLabel=false;this.max=undefined;this.maxlength=undefined;this.min=undefined;this.minlength=undefined;this.multiple=undefined;this.name=this.inputId;this.pattern=undefined;this.placeholder=undefined;this.readonly=false;this.required=false;this.spellcheck=false;this.step=undefined;this.size=undefined;this.type="text";this.form=undefined;this.value="";this.resize="auto";this.rows=2;this.showCharCount=false;this.validate=s(this.validate,50);this.handleBlur=this.handleBlur.bind(this)}get nativeInputWrap(){return this._nativeInputWrap}set nativeInputWrap(t){if(this._nativeInputWrap===t)return;this._nativeInputWrap=t;this.setDataListOpts()}setDataListOpts(){if(!this.datalist)return;const t=this.datalist.dropDownConfig||{};this.datalist.dropDownConfig={...t,skidding:-1,tetherTo:this.nativeInputWrap}}get invalid(){return this._invalid}get validityMessage(){if(!this.nativeInput)return"";return this.nativeInput.validationMessage}shouldValidate(){if(!this.hasRendered)return;requestAnimationFrame((()=>{if(this.validateOn==="dirty")this.validate()}))}valueChanged(){this.nanoChange.emit({value:this.value});this.charCount=this.value.length;if(this.type==="textarea"&&this.resize==="auto"){this.nativeInput.style.height="auto";if(this.value.length)this.nativeInput.style.height=this.nativeInput.scrollHeight+"px"}requestAnimationFrame((()=>{if(this.validateOn==="dirty")this.validate()}))}debounceChanged(){this.nanoChange=l(this.nanoChange,this.debounce)}async reportValidity(t){return new Promise((n=>{if(t)this.validate();setTimeout((()=>{n({isValid:!this._invalid,errorMessage:this.nativeInput.validationMessage})}),50)}))}async setFocus(){if(this.nativeInput){this.nativeInput.focus();this.nativeInput.click()}}async select(){if(this.nativeInput){this.nativeInput.select()}}getInputElement(){return Promise.resolve(this.nativeInput)}async showError(t){if(this.nativeInput){this.nativeInput.setCustomValidity(t);this.validate()}}onReset(t){const n=this.form?document.querySelector("#"+this.form):this.el.closest("form");if(!n||t.target!==this.el.closest("form"))return;this.value=""}handleBlur(t){if(!this.hasFocus)return;const n=t;let i;requestAnimationFrame((()=>{if(t instanceof KeyboardEvent&&n.key){if(n.key!=="Tab")return;i=document.activeElement}else if(t instanceof FocusEvent){i=document.activeElement}else i=t.target;if(o(this.el.tagName.toLowerCase(),i)!==this.el){this.onBlur()}}))}shouldClearOnEdit(){const{type:t,clearOnEdit:n}=this;return n===undefined?t==="password":n}getValue(){return this.value||""}focusChanged(){if(!this.hasFocus&&this.shouldClearOnEdit()&&this.hasValue()){this.didBlurAfterEdit=true}}hasValue(){return this.getValue().length>0}slotChangeObserver(){if(this.mo)this.mo.disconnect();const t=this.mo=new MutationObserver((()=>this.processSlottedContent()));t.observe(this.el,{childList:true,subtree:true})}processSlottedContent(){this.hasLabelSlot=!!this.el.querySelectorAll('[slot="label"]');this.hasHelperSlot=!!this.el.querySelector('[slot="helper"]');this.hasHelperEndSlot=!!this.el.querySelector('[slot="helper-end"]');this.datalist=this.el.querySelector("nano-datalist:not([slot])");if(!!this.el.querySelector('[slot="inline-button"]')){console.warn("The `inline-button` slot was renamed to `end` in v2 - please update your code",this.el)}}connectedCallback(){this.debounceChanged();{this.el.dispatchEvent(new CustomEvent("nanoDidLoad",{detail:this.el}))}}disconnectedCallback(){{document.dispatchEvent(new CustomEvent("nanoDidUnload",{detail:this.el}))}if(this.mo)this.mo.disconnect()}componentDidLoad(){this.slotChangeObserver();this.hasRendered=true;if(this.autofocus)setTimeout((t=>this.setFocus()),300)}componentWillLoad(){this.processSlottedContent()}render(){const t=this.getValue();const n=this.inputId+"-lbl";const a=this.showInlineError||this.hasHelperSlot?this.inputId+"-more":"";const o=this.hasHelperEndSlot?this.inputId+"-helper":"";this.rtl=this.el.ownerDocument.dir==="rtl";const s=(({el:t,floatLabel:n,label:i,errorMessage:e,type:a,showInlineError:o,hasHelperSlot:r,hasLabelSlot:s,hideLabel:l,placeholder:c,maxlength:p,charCount:h,showCharCount:d,rtl:u,hasHelperEndSlot:f})=>({el:t,floatLabel:n,label:i,errorMessage:e,type:a,showInlineError:o,hasHelperSlot:r,hasLabelSlot:s,hideLabel:l,placeholder:c,maxlength:p,charCount:h,showCharCount:d,rtl:u,hasHelperEndSlot:f}))(this);const l={...s,labelId:n,moreId:a,helperEndId:o,hasValue:this.hasValue(),controlId:this.inputId};const h=(({clearInput:t,readonly:n,disabled:i})=>({clearInput:t,readonly:n,disabled:i,clearControl:this.clearInput}))(this);return i(e,{"aria-disabled":this.disabled?"true":null,dir:this.rtl?"rtl":null,class:{...r(this.color),"has-value":this.hasValue(),"has-focus":this.hasFocus,"is-invalid":this._invalid}},i(c,{...l},i(p,{...h,onClearText:this.clearTextInput,control:this.el,ref:t=>this.nativeInputWrap=t},this.type!=="textarea"&&i("input",{id:this.inputId,class:"input__native-ctrl",ref:t=>this.nativeInput=t,"aria-labelledby":n+" "+a+" "+o,disabled:this.disabled,accept:this.accept,autoCapitalize:this.autocapitalise,autoComplete:this.autocomplete,autoCorrect:this.autocorrect,autoFocus:this.autofocus,inputMode:this.inputmode,form:this.form,min:this.min,max:this.max,minLength:this.minlength,maxLength:this.maxlength,multiple:this.multiple,name:this.name,pattern:this.pattern,placeholder:this.placeholder,readOnly:this.readonly,required:this.required,spellcheck:this.spellcheck,step:this.step,size:this.size,type:this.type,value:t,onInput:this.onInput,onChange:this.onInput,onFocus:this.onFocus,onBlur:this.handleBlur,onKeyDown:this.onKeydown,onInvalid:this.validate}),this.type==="textarea"&&i("textarea",{rows:this.floatLabel?1:this.rows,id:this.inputId,class:{"input__native-ctrl":true,input__resizable:this.resize==="true"},ref:t=>this.nativeInput=t,"aria-labelledby":n+" "+a+" "+o,disabled:this.disabled,autoCapitalize:this.autocapitalise,autoCorrect:this.autocorrect,autoFocus:this.autofocus,inputMode:this.inputmode,form:this.form,minLength:this.minlength,maxLength:this.maxlength,name:this.name,placeholder:this.placeholder,readOnly:this.readonly,required:this.required,spellcheck:this.spellcheck,value:t,onInput:this.onInput,onChange:this.onInput,onFocus:this.onFocus,onKeyDown:this.onKeydown,onInvalid:this.validate,onBlur:this.handleBlur})),i("slot",null)))}get el(){return a(this)}static get watchers(){return{datalist:["setDataListOpts"],minlength:["shouldValidate"],maxlength:["shouldValidate"],min:["shouldValidate"],max:["shouldValidate"],required:["shouldValidate"],disabled:["shouldValidate"],readonly:["shouldValidate"],pattern:["shouldValidate"],inputmode:["shouldValidate"],value:["valueChanged"],debounce:["debounceChanged"]}}};u.style=h;export{u as nano_input};
-//# sourceMappingURL=p-28b43ee9.entry.js.map

package/dist/nano-components/p-28b43ee9.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["src/components/input/input.scss?tag=nano-input&encapsulation=scoped","src/components/input/input.tsx"],"names":["inputCss","inputIds","Input","[object Object]","hostRef","this","inputId","didBlurAfterEdit","rtl","charCount","hasRendered","validate","ev","validateOn","nativeInput","validity","valid","showInlineError","preventDefault","errorMessage","validationMessage","_invalid","nanoValidate","emit","isValid","originalEvent","onInput","input","target","value","nanoInput","onBlur","hasFocus","focusChanged","nanoBlur","onFocus","nanoFocus","onKeydown","shouldClearOnEdit","hasValue","clearTextInput","clearInput","readonly","disabled","stopPropagation","event","window","Event","dispatchEvent","debounce","handleBlur","bind","nativeInputWrap","_nativeInputWrap","ele","setDataListOpts","datalist","currDWConfig","dropDownConfig","skidding","tetherTo","invalid","validityMessage","requestAnimationFrame","nanoChange","length","type","resize","style","height","scrollHeight","debounceEvent","validateFirst","Promise","resolve","setTimeout","focus","click","select","message","setCustomValidity","e","form","document","querySelector","el","closest","kev","KeyboardEvent","key","activeElement","FocusEvent","closestElement","tagName","toLowerCase","clearOnEdit","undefined","getValue","mo","disconnect","MutationObserver","processSlottedContent","observe","childList","subtree","hasLabelSlot","querySelectorAll","hasHelperSlot","hasHelperEndSlot","console","warn","debounceChanged","CustomEvent","detail","slotChangeObserver","autofocus","_","setFocus","labelId","moreId","helperEndId","ownerDocument","dir","compWrapOptions","floatLabel","label","hideLabel","placeholder","maxlength","showCharCount","wrapOptions","controlId","controlOptions","clearControl","h","Host","aria-disabled","class","createColorClasses","color","has-value","has-focus","is-invalid","FormControlWrap","FormControl","onClearText","control","ref","id","aria-labelledby","accept","autoCapitalize","autocapitalise","autoComplete","autocomplete","autoCorrect","autocorrect","autoFocus","inputMode","inputmode","min","max","minLength","minlength","maxLength","multiple","name","pattern","readOnly","required","spellcheck","step","size","onChange","onKeyDown","onInvalid","rows","input__native-ctrl","input__resizable"],"mappings":"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","sourcesContent":["@import '../../global/style/utilities/globals';\n@import '../../global/style/nano-theme/form';\n@import '../form-control/form-control';\n@import '../form-control/form-control-vars';\n\n:host {\n  @include formControlVars;\n\n  position: relative;\n  inline-size: 100%;\n  padding: 0 !important;\n  color: currentColor;\n  display: block;\n}\n\n:host(.nano-color) {\n  color: current-color(base);\n\n  --input-border-style--focus: #{$input-border-style} var(--nano-color-tint, #{nano-color(primary, tint)});\n}\n\n.input__native-ctrl {\n  @include text-inherit();\n\n  padding-block: 0;\n  padding-inline: var(--padding-start) var(--padding-end);\n  border-radius: var(--input-border-radius);\n  text-overflow: ellipsis;\n  color: var(--input-text-color);\n  display: inline-block;\n  flex: 1;\n  inline-size: 100%;\n  max-inline-size: 100%;\n  max-block-size: 100%;\n  border: 0;\n  outline: none;\n  background: transparent;\n  appearance: none;\n  margin: 0;\n  box-sizing: border-box;\n  resize: none;\n  overflow: hidden;\n  line-height: 2.5em;\n  // min-height: 2.5em;\n\n  .has-float-label & {\n    line-height: 2.1em;\n    min-height: 2.1em;\n    padding-block-start: 1.4em;\n  }\n\n  &::placeholder {\n    color: var(--placeholder-color);\n    font-family: inherit;\n    font-style: var(--placeholder-font-style);\n    font-weight: var(--placeholder-font-weight);\n    opacity: var(--placeholder-opacity);\n    line-height: inherit;\n    min-height: initial;\n  }\n\n  &::-moz-placeholder {\n    line-height: 2.8em;\n    text-overflow: ellipsis;\n  }\n\n  &:-webkit-autofill {\n    background-color: transparent;\n  }\n\n  &::-webkit-search-decoration,\n  &::-webkit-search-cancel-button,\n  &::-webkit-search-results-button,\n  &::-webkit-search-results-decoration {\n    appearance: none;\n  }\n\n  &:invalid {\n    box-shadow: none;\n  }\n\n  &::-ms-clear,\n  &::-ms-reveal {\n    display: none;\n  }\n\n  &.input__resizable {\n    resize: vertical;\n    overflow: auto;\n  }\n\n  .form-ctrl__textarea & {\n    line-height: 1.5em;\n    padding-block: var(--padding-top) 0.25em;\n    white-space: pre-wrap;\n\n    &::placeholder {\n      line-height: 1.5em;\n    }\n\n    .has-float-label & {\n      padding-block-start: 1.75em;\n    }\n  }\n\n  :host([readonly]:not([readonly='false'])) & {\n    user-select: none;\n  }\n}\n","import {\n  Build,\n  Component,\n  ComponentInterface,\n  Element,\n  Event,\n  EventEmitter,\n  Host,\n  Method,\n  Prop,\n  State,\n  Watch,\n  h,\n  Listen,\n} from '@stencil/core';\n\nimport { closestElement } from '../../utils/dom';\nimport { createColorClasses } from '../../utils/theme';\nimport { debounceEvent, debounce } from '../../utils/throttle';\nimport { FormControl, FormControlWrap } from '../form-control/form-control';\nimport type {\n  Color,\n  ControlValidity,\n  ControlValidityEventDetail,\n  InputChangeEventDetail,\n  TextFieldTypes,\n} from '../../interface';\n\nlet inputIds = 0;\n\n/**\n * The input component is a wrapper to the HTML input element with custom styling and additional functionality. It accepts most of the same properties as the HTML [input](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input), but works great on desktop devices and integrates with the keyboard on mobile devices.\n\nIt is meant for text type inputs only, such as \"text\", \"password\", \"email\", \"number\", \"search\", \"tel\", and \"url\". It supports all standard text input events including keyup, keydown, keypress, and more.\nThe default styling reference comes from the [ONT styleguide](https://nanoporetech.zeroheight.com/styleguide/s/31282/p/230c74-text-input--textarea/b/942ee4)\n * @slot start - suitable for inline action buttons or icons that may add extra contextual information\n * @slot end - suitable for inline action buttons or icons that may add extra contextual information\n * @slot value-start - similar to 'start', however clicking elements using this slot will activate the input control. This would be suitable to show a secodary 'value' for context or to show a dropdown arrow if using a datalist\n * @slot value-end - similar to 'end', however clicking elements using this slot will activate the input control. This would be suitable to show a secodary 'value' for context or to show a dropdown arrow if using a datalist\n * @slot label - if you do not set a label attribute, you can use this slot for more complex markup\n * @slot helper - helper text to accompany the form field underneath.\n * @slot helper-end - helper text to accompany the form field on the side.\n * @slot - can be used with a `nano-datalist`. See the `nano-datalist` docs for more information\n */\n@Component({\n  tag: 'nano-input',\n  styleUrl: 'input.scss',\n  scoped: true,\n})\nexport class Input implements ComponentInterface {\n  private nativeInput?: HTMLInputElement | HTMLTextAreaElement;\n  private inputId = `nano-input-${inputIds++}`;\n  private didBlurAfterEdit = false;\n  private rtl: boolean = false;\n  private mo?: MutationObserver;\n  private charCount = 0;\n  private hasRendered = false;\n\n  // we don't want these rendered eles decorated with @State\n  // because that will cause re-renders. User get/set to set datalist options\n  private _nativeInputWrap: HTMLElement;\n  private get nativeInputWrap() {\n    return this._nativeInputWrap;\n  }\n  private set nativeInputWrap(ele: HTMLElement) {\n    if (this._nativeInputWrap === ele) return;\n    this._nativeInputWrap = ele;\n    this.setDataListOpts();\n  }\n\n  constructor() {\n    this.validate = debounce(this.validate, 50);\n    this.handleBlur = this.handleBlur.bind(this);\n  }\n\n  @State() hasFocus = false;\n  @State() hasLabelSlot = false;\n  @State() hasHelperSlot = false;\n  @State() hasHelperEndSlot = false;\n  @State() errorMessage: string = '';\n  @State() datalist: HTMLNanoDatalistElement = null;\n\n  @Watch('datalist')\n  setDataListOpts() {\n    if (!this.datalist) return;\n    const currDWConfig = this.datalist.dropDownConfig || {};\n    this.datalist.dropDownConfig = {\n      ...currDWConfig,\n      skidding: -1,\n      tetherTo: this.nativeInputWrap,\n    };\n  }\n\n  @Element() el!: HTMLNanoInputElement;\n\n  /**\n   * This will be true when the control is in an invalid state.\n   * Validity is determined by the `required` prop. Or if custom validity message is set. @readonly\n   */\n  @Prop({ reflect: true })\n  get invalid() {\n    return this._invalid;\n  }\n  @State() _invalid = false;\n\n  /**\n   * Current validation message - if any. @readonly\n   */\n  @Prop()\n  get validityMessage() {\n    if (!this.nativeInput) return '';\n    return this.nativeInput.validationMessage;\n  }\n\n  /**\n   * The color to use from the application's color palette.\n   */\n  @Prop() color?: Color;\n\n  /**\n   * If the value of the type attribute is `\"file\"`, then this attribute will indicate the types of files that the server accepts, otherwise it will be ignored. The value must be a comma-separated list of unique content type specifiers.\n   */\n  @Prop() accept?: string;\n\n  /**\n   * Indicates whether and how the text value should be automatically capitalized as it is entered/edited by the user.\n   */\n  @Prop() autocapitalise: 'none' | 'sentences' | 'words' | 'characters' =\n    'none';\n\n  /**\n   * Indicates whether the value of the control can be automatically completed by the browser.\n   */\n  @Prop() autocomplete: 'on' | 'off' = 'off';\n\n  /**\n   * Whether auto correction should be enabled when the user is entering/editing the text value.\n   */\n  @Prop() autocorrect: 'on' | 'off' = 'off';\n\n  /**\n   * This Boolean attribute lets you specify that a form control should have input focus when the page loads.\n   */\n  @Prop() autofocus = false;\n\n  /**\n   * If `true`, a clear icon will appear in the input when there is a value. Clicking it clears the input.\n   */\n  @Prop() clearInput = false;\n\n  /**\n   * If `true`, the value will be cleared after focus upon edit. Defaults to `true` when `type` is `\"password\"`, `false` for all other types.\n   */\n  @Prop() clearOnEdit?: boolean;\n\n  /**\n   * Set the amount of time, in milliseconds, to wait to trigger the `nanoChange` event after each keystroke.\n   */\n  @Prop() debounce = 0;\n\n  /**\n   * If `true`, the user cannot interact with the input.\n   */\n  @Prop({ reflect: true }) disabled = false;\n\n  /**\n   * A hint to the browser for which keyboard to display.\n   * Possible values: `\"none\"`, `\"text\"`, `\"tel\"`, `\"url\"`,\n   * `\"email\"`, `\"numeric\"`, `\"decimal\"`, and `\"search\"`.\n   */\n  @Prop() inputmode?:\n    | 'none'\n    | 'text'\n    | 'tel'\n    | 'url'\n    | 'email'\n    | 'numeric'\n    | 'decimal'\n    | 'search';\n\n  /**\n   * When should the field perform validation\n   */\n  @Prop({ mutable: true }) validateOn: 'dirty' | 'submit' | 'submitThenDirty' =\n    'submitThenDirty';\n\n  /**\n   * Whether to show validation errors underneath input\n   */\n  @Prop({ reflect: true }) showInlineError = true;\n\n  /**\n   * String to place within a label element. Alternatively you may use a label slot.\n   */\n  @Prop() label!: string;\n\n  /**\n   * Visually hide the label - but make it accessible.\n   */\n  @Prop() hideLabel?: boolean = false;\n\n  /**\n   * Enable floating label behaviour. Will disable placeholder if set.\n   */\n  @Prop() floatLabel: boolean = false;\n\n  /**\n   * The maximum value, which must not be less than its minimum (min attribute) value.\n   */\n  @Prop() max?: string;\n\n  /**\n   * If the value of the type attribute is `text`, `email`, `search`, `password`, `tel`, or `url`, this attribute specifies the maximum number of characters that the user can enter.\n   */\n  @Prop() maxlength?: number;\n\n  /**\n   * The minimum value, which must not be greater than its maximum (max attribute) value.\n   */\n  @Prop() min?: string;\n\n  /**\n   * If the value of the type attribute is `text`, `email`, `search`, `password`, `tel`, or `url`, this attribute specifies the minimum number of characters that the user can enter.\n   */\n  @Prop() minlength?: number;\n\n  /**\n   * If `true`, the user can enter more than one value. This attribute applies when the type attribute is set to `\"email\"` or `\"file\"`, otherwise it is ignored.\n   */\n  @Prop() multiple?: boolean;\n\n  /**\n   * The name of the control, which is submitted with the form data.\n   */\n  @Prop() name: string = this.inputId;\n\n  /**\n   * A regular expression that the value is checked against. The pattern must match the entire value, not just some subset. Use the title attribute to describe the pattern to help the user. This attribute applies when the value of the type attribute is `\"text\"`, `\"search\"`, `\"tel\"`, `\"url\"`, `\"email\"`, or `\"password\"`, otherwise it is ignored.\n   */\n  @Prop() pattern?: string;\n\n  /**\n   * Instructional text that shows before the input has a value.\n   */\n  @Prop() placeholder?: string | null;\n\n  /**\n   * If `true`, the user cannot modify the value.\n   */\n  @Prop({ reflect: true }) readonly = false;\n\n  /**\n   * If `true`, the user must fill in a value before submitting a form.\n   */\n  @Prop() required = false;\n\n  /**\n   * If `true`, the element will have its spelling and grammar checked.\n   */\n  @Prop() spellcheck = false;\n\n  /**\n   * Works with the min and max attributes to limit the increments at which a value can be set.\n   * Possible values are: `\"any\"` or a positive floating point number.\n   */\n  @Prop() step?: string;\n\n  /**\n   * The initial size of the control. This value is in pixels unless the value of the type attribute is `\"text\"` or `\"password\"`, in which case it is an integer number of characters. This attribute applies only when the `type` attribute is set to `\"text\"`, `\"search\"`, `\"tel\"`, `\"url\"`, `\"email\"`, or `\"password\"`, otherwise it is ignored.\n   */\n  @Prop() size?: number;\n\n  /**\n   * The type of control to display. The default type is text.\n   */\n  @Prop({ reflect: true }) type: TextFieldTypes = 'text';\n\n  /**\n   * The form element to associate the input with (its form owner). Must be the id of a form.\n   */\n  @Prop() form?: string | null;\n\n  /**\n   * The value of the input.\n   */\n  @Prop({ mutable: true }) value?: string | null = '';\n\n  /**\n   * relevant to type=\"textarea\". Vertical resizing - enable / disable or make automatic.\n   */\n  @Prop() resize: 'true' | 'false' | 'auto' = 'auto';\n\n  /**\n   * relevant to type=\"textarea\". Default number of rows to show\n   */\n  @Prop() rows = 2;\n\n  /**\n   * relevant to type=\"textarea\".\n   */\n  @Prop() showCharCount = false;\n\n  @Watch('minlength')\n  @Watch('maxlength')\n  @Watch('min')\n  @Watch('max')\n  @Watch('required')\n  @Watch('disabled')\n  @Watch('readonly')\n  @Watch('pattern')\n  @Watch('inputmode')\n  protected shouldValidate() {\n    if (!this.hasRendered) return;\n    requestAnimationFrame(() => {\n      if (this.validateOn === 'dirty') this.validate();\n    });\n  }\n\n  /**\n   * Update the native input element when the value changes\n   */\n  @Watch('value')\n  protected valueChanged() {\n    this.nanoChange.emit({ value: this.value });\n    this.charCount = this.value.length;\n\n    if (this.type === 'textarea' && this.resize === 'auto') {\n      this.nativeInput.style.height = 'auto';\n      if (this.value.length)\n        this.nativeInput.style.height = this.nativeInput.scrollHeight + 'px';\n    }\n\n    requestAnimationFrame(() => {\n      if (this.validateOn === 'dirty') this.validate();\n    });\n  }\n\n  @Watch('debounce')\n  protected debounceChanged() {\n    this.nanoChange = debounceEvent(this.nanoChange, this.debounce);\n  }\n\n  /**\n   * Emitted when a keyboard input occurred.\n   */\n  @Event() nanoInput!: EventEmitter<InputEvent>;\n\n  /**\n   * Emitted when the value has changed.\n   */\n  @Event() nanoChange!: EventEmitter<InputChangeEventDetail>;\n\n  /**\n   * Emitted when the input loses focus.\n   */\n  @Event() nanoBlur!: EventEmitter<void>;\n\n  /**\n   * Emitted when the input has focus.\n   */\n  @Event() nanoFocus!: EventEmitter<void>;\n\n  /**\n   * Emitted when the input has been created.\n   * @internal\n   */\n  @Event() nanoDidLoad!: EventEmitter<void>;\n\n  /**\n   * Emitted when the input has been removed.\n   * @internal\n   */\n  @Event() nanoDidUnload!: EventEmitter<void>;\n\n  /**\n   * Called when validation is performed (which depends on `validateOn`).\n   * @returns event.detail: `{ isValid: boolean, errorMessage: string, originalEvent: Event }`.\n   */\n  @Event() nanoValidate: EventEmitter<ControlValidityEventDetail>;\n\n  /**\n   * Get the current state of the control.\n   * @param validateFirst - perform validation first before reporting\n   * @returns `{ isValid: boolean, errorMessage: string }`\n   */\n  @Method()\n  async reportValidity(validateFirst: boolean): Promise<ControlValidity> {\n    return new Promise((resolve) => {\n      if (validateFirst) this.validate();\n      setTimeout(() => {\n        resolve({\n          isValid: !this._invalid,\n          errorMessage: this.nativeInput.validationMessage,\n        });\n      }, 50);\n    });\n  }\n\n  /**\n   * Sets focus on the specified `nano-input`. Use this method instead of the global\n   * `input.focus()`.\n   */\n  @Method()\n  async setFocus() {\n    if (this.nativeInput) {\n      this.nativeInput.focus();\n      this.nativeInput.click();\n    }\n  }\n\n  /**\n   * Sets focus and select the text on the specified `nano-input`. Use this method instead of the global\n   * `input.select()`.\n   */\n  @Method()\n  async select() {\n    if (this.nativeInput) {\n      this.nativeInput.select();\n    }\n  }\n\n  /**\n   * @returns the native `<input>` element used under the hood.\n   */\n  @Method()\n  getInputElement(): Promise<HTMLInputElement | HTMLTextAreaElement> {\n    return Promise.resolve(this.nativeInput);\n  }\n\n  /**\n   * Invalidate the field and show a custom error message. To clear the error you will need to re-call this method with an empty string.\n   */\n  @Method()\n  async showError(message: string) {\n    if (this.nativeInput) {\n      this.nativeInput.setCustomValidity(message);\n      this.validate();\n    }\n  }\n\n  @Listen('reset', { target: 'body' })\n  onReset(e) {\n    const form = this.form\n      ? document.querySelector('#' + this.form)\n      : this.el.closest('form');\n    if (!form || e.target !== this.el.closest('form')) return;\n\n    this.value = '';\n  }\n\n  @Listen('mousedown', { target: 'body' })\n  @Listen('keydown')\n  handleBlur(e: KeyboardEvent | MouseEvent | FocusEvent) {\n    if (!this.hasFocus) return;\n\n    const kev = e as KeyboardEvent;\n    let target: Element;\n\n    requestAnimationFrame(() => {\n      if (e instanceof KeyboardEvent && kev.key) {\n        if (kev.key !== 'Tab') return;\n        target = document.activeElement;\n      } else if (e instanceof FocusEvent) {\n        target = document.activeElement;\n      } else target = e.target as Element;\n\n      if (closestElement(this.el.tagName.toLowerCase(), target) !== this.el) {\n        this.onBlur();\n      }\n    });\n  }\n\n  private shouldClearOnEdit() {\n    const { type, clearOnEdit } = this;\n    return clearOnEdit === undefined ? type === 'password' : clearOnEdit;\n  }\n\n  private getValue(): string {\n    return this.value || '';\n  }\n\n  private validate = (ev?: Event) => {\n    if (this.validateOn === 'submitThenDirty') this.validateOn = 'dirty';\n\n    if (!this.nativeInput.validity.valid) {\n      if (this.showInlineError) {\n        if (ev) ev.preventDefault();\n        this.errorMessage = this.nativeInput.validationMessage;\n      }\n      this._invalid = true;\n    } else this._invalid = false;\n\n    this.nanoValidate.emit({\n      isValid: !this._invalid,\n      errorMessage: this.nativeInput.validationMessage,\n      originalEvent: ev,\n    });\n  };\n\n  private onInput = (ev: InputEvent) => {\n    const input = ev.target as HTMLInputElement | null;\n    this.value = input?.value || '';\n    this.nanoInput.emit(ev);\n  };\n\n  private onBlur = () => {\n    this.hasFocus = false;\n    this.focusChanged();\n    if (this.validateOn === 'dirty') this.validate();\n    this.nanoBlur.emit();\n  };\n\n  private onFocus = () => {\n    this.hasFocus = true;\n    this.focusChanged();\n    this.nanoFocus.emit();\n  };\n\n  private onKeydown = () => {\n    if (this.shouldClearOnEdit()) {\n      // Did the input value change after it was blurred and edited?\n      if (this.didBlurAfterEdit && this.hasValue()) {\n        // Clear the input\n        this.clearTextInput();\n      }\n\n      // Reset the flag\n      this.didBlurAfterEdit = false;\n    }\n  };\n\n  private clearTextInput = (ev?: Event) => {\n    if (this.clearInput && !this.readonly && !this.disabled && ev) {\n      ev.preventDefault();\n      ev.stopPropagation();\n    }\n\n    this.value = '';\n    this.nativeInput.value = '';\n    const event = new window.Event('change');\n    this.nativeInput.dispatchEvent(event);\n  };\n\n  private focusChanged() {\n    // If clearOnEdit is enabled and the input blurred but has a value, set a flag\n    if (!this.hasFocus && this.shouldClearOnEdit() && this.hasValue()) {\n      this.didBlurAfterEdit = true;\n    }\n  }\n\n  private hasValue(): boolean {\n    return this.getValue().length > 0;\n  }\n\n  private slotChangeObserver() {\n    if (!Build.isBrowser) return;\n\n    if (this.mo) this.mo.disconnect();\n    const mo = (this.mo = new MutationObserver(() =>\n      this.processSlottedContent()\n    ));\n    mo.observe(this.el, { childList: true, subtree: true });\n  }\n\n  private processSlottedContent() {\n    // see if we have label / button content\n    this.hasLabelSlot = !!this.el.querySelectorAll('[slot=\"label\"]');\n    this.hasHelperSlot = !!this.el.querySelector('[slot=\"helper\"]');\n    this.hasHelperEndSlot = !!this.el.querySelector('[slot=\"helper-end\"]');\n    this.datalist = this.el.querySelector('nano-datalist:not([slot])');\n\n    // breaking change introduced in v2. Rm in v3\n    if (!!this.el.querySelector('[slot=\"inline-button\"]')) {\n      console.warn(\n        'The `inline-button` slot was renamed to `end` in v2 - please update your code',\n        this.el\n      );\n    }\n  }\n\n  connectedCallback() {\n    this.debounceChanged();\n    if (Build.isBrowser) {\n      this.el.dispatchEvent(\n        new CustomEvent('nanoDidLoad', {\n          detail: this.el,\n        })\n      );\n    }\n  }\n\n  disconnectedCallback() {\n    if (Build.isBrowser) {\n      document.dispatchEvent(\n        new CustomEvent('nanoDidUnload', {\n          detail: this.el,\n        })\n      );\n    }\n    if (this.mo) this.mo.disconnect();\n  }\n\n  componentDidLoad() {\n    this.slotChangeObserver();\n    this.hasRendered = true;\n    if (this.autofocus) setTimeout((_) => this.setFocus(), 300);\n  }\n\n  componentWillLoad() {\n    this.processSlottedContent();\n  }\n\n  render() {\n    const value = this.getValue();\n    const labelId = this.inputId + '-lbl';\n    const moreId =\n      this.showInlineError || this.hasHelperSlot ? this.inputId + '-more' : '';\n    const helperEndId = this.hasHelperEndSlot ? this.inputId + '-helper' : '';\n    this.rtl = (this.el.ownerDocument as Document).dir === 'rtl';\n\n    const compWrapOptions = (({\n      el,\n      floatLabel,\n      label,\n      errorMessage,\n      type,\n      showInlineError,\n      hasHelperSlot,\n      hasLabelSlot,\n      hideLabel,\n      placeholder,\n      maxlength,\n      charCount,\n      showCharCount,\n      rtl,\n      hasHelperEndSlot,\n    }) => ({\n      el,\n      floatLabel,\n      label,\n      errorMessage,\n      type,\n      showInlineError,\n      hasHelperSlot,\n      hasLabelSlot,\n      hideLabel,\n      placeholder,\n      maxlength,\n      charCount,\n      showCharCount,\n      rtl,\n      hasHelperEndSlot,\n    }))(this);\n    const wrapOptions = {\n      ...compWrapOptions,\n      labelId,\n      moreId,\n      helperEndId,\n      hasValue: this.hasValue(),\n      controlId: this.inputId,\n    };\n\n    const controlOptions = (({ clearInput, readonly, disabled }) => ({\n      clearInput,\n      readonly,\n      disabled,\n      clearControl: this.clearInput,\n    }))(this);\n\n    return (\n      <Host\n        aria-disabled={this.disabled ? 'true' : null}\n        dir={this.rtl ? 'rtl' : null}\n        class={{\n          ...createColorClasses(this.color),\n          'has-value': this.hasValue(),\n          'has-focus': this.hasFocus,\n          'is-invalid': this._invalid,\n        }}\n      >\n        <FormControlWrap {...wrapOptions}>\n          <FormControl\n            {...controlOptions}\n            onClearText={this.clearTextInput}\n            control={this.el}\n            ref={(el) => (this.nativeInputWrap = el)}\n          >\n            {this.type !== 'textarea' && (\n              <input\n                id={this.inputId}\n                class=\"input__native-ctrl\"\n                ref={(input) => (this.nativeInput = input)}\n                aria-labelledby={labelId + ' ' + moreId + ' ' + helperEndId}\n                disabled={this.disabled}\n                accept={this.accept}\n                autoCapitalize={this.autocapitalise}\n                autoComplete={this.autocomplete}\n                autoCorrect={this.autocorrect}\n                autoFocus={this.autofocus}\n                inputMode={this.inputmode}\n                form={this.form}\n                min={this.min}\n                max={this.max}\n                minLength={this.minlength}\n                maxLength={this.maxlength}\n                multiple={this.multiple}\n                name={this.name}\n                pattern={this.pattern}\n                placeholder={this.placeholder}\n                readOnly={this.readonly}\n                required={this.required}\n                spellcheck={this.spellcheck}\n                step={this.step}\n                size={this.size}\n                type={this.type}\n                value={value}\n                onInput={this.onInput}\n                onChange={this.onInput}\n                onFocus={this.onFocus}\n                onBlur={this.handleBlur}\n                onKeyDown={this.onKeydown}\n                onInvalid={this.validate}\n              />\n            )}\n            {this.type === 'textarea' && (\n              <textarea\n                rows={this.floatLabel ? 1 : this.rows}\n                id={this.inputId}\n                class={{\n                  'input__native-ctrl': true,\n                  input__resizable: this.resize === 'true',\n                }}\n                ref={(input) => (this.nativeInput = input)}\n                aria-labelledby={labelId + ' ' + moreId + ' ' + helperEndId}\n                disabled={this.disabled}\n                autoCapitalize={this.autocapitalise}\n                autoCorrect={this.autocorrect}\n                autoFocus={this.autofocus}\n                inputMode={this.inputmode}\n                form={this.form}\n                minLength={this.minlength}\n                maxLength={this.maxlength}\n                name={this.name}\n                placeholder={this.placeholder}\n                readOnly={this.readonly}\n                required={this.required}\n                spellcheck={this.spellcheck}\n                value={value}\n                onInput={this.onInput}\n                onChange={this.onInput}\n                onFocus={this.onFocus}\n                onKeyDown={this.onKeydown}\n                onInvalid={this.validate}\n                onBlur={this.handleBlur}\n              ></textarea>\n            )}\n          </FormControl>\n          <slot />\n        </FormControlWrap>\n      </Host>\n    );\n  }\n}\n"]}

package/dist/nano-components/p-28f713fb.entry.js

@@ -1,5 +0,0 @@
-/*!
- * Web Components for Nanopore digital Web Apps
- */
-import{h as e,r as t,c as a,a as i,g as s}from"./p-1fe12320.js";import{i as n,g as o,b as d,p as r,D as l,d as c,s as h,e as u,f as b,h as p,j as f,k as _,l as x,a as v}from"./p-15a60f7e.js";import{f as g}from"./p-f8f89998.js";import{c as y}from"./p-7b3638b7.js";const m={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"]};const k=({focusedDay:t,today:a,day:i,onDaySelect:s,onKeyboardNavigation:o,focusedDayRef:d,inRange:r,disabled:l,isSelected:c})=>{const h=n(i,a);const u=n(i,t);const b=i.getMonth()!==t.getMonth()||l;const p=!r;function f(e){s(e,i)}return e("button",{class:{"duet-date__day":true,"is-outside":p,"is-disabled":b,"is-today":h},tabIndex:u?0:-1,onClick:f,onKeyDown:o,disabled:p,type:"button","aria-pressed":c?"true":"false",ref:e=>{if(u&&e&&d){d(e)}}},e("span",{"aria-hidden":"true"},i.getDate()),e("span",{class:"duet-date__vhidden"},i.toLocaleDateString(undefined,{day:"numeric",month:"long"})))};function w(e,t){const a=[];for(let i=0;i<e.length;i+=t){a.push(e.slice(i,i+t))}return a}function D(e,t,a){return e.map(((i,s)=>{const n=(s+t)%e.length;return a(e[n])}))}const z=({selectedDate:t,focusedDate:a,labelledById:i,localization:s,firstDayOfWeek:r,min:l,max:c,onDateSelect:h,onKeyboardNavigation:u,focusedDayRef:b,onMouseDown:p,onFocusIn:f,isDateDisabled:_})=>{const x=new Date;const v=o(a,r);return e("table",{class:"duet-date__table",role:"grid","aria-labelledby":i,onFocusin:f,onMouseDown:p},e("thead",null,e("tr",null,D(s.dayNames,r,(t=>e("th",{class:"duet-date__table-header",scope:"col"},e("span",{"aria-hidden":"true"},t.substr(0,2)),e("span",{class:"duet-date__vhidden"},t)))))),e("tbody",null,w(v,7).map((i=>e("tr",{class:"duet-date__row"},i.map((i=>e("td",{class:"duet-date__cell",role:"gridcell","aria-selected":n(i,t)?"true":undefined},e(k,{day:i,today:x,focusedDay:a,inRange:d(i,l,c),onDaySelect:h,onKeyboardNavigation:u,focusedDayRef:b,disabled:_(i),isSelected:n(i,t)})))))))))};const M=':host{box-sizing:border-box}*,*::before,*::after{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:start;inline-size:100%}.duet-date__dialog{display:-webkit-box;display:-ms-flexbox;display:flex;inset-block-start:100%;max-inline-size:100%;inline-size:100%}.duet-date__dialog.is-left{inset-inline:auto 0;inline-size:auto}.duet-date__dialog-content{background:var(--background);min-inline-size:290px;padding-block:16px 20px;padding-inline:16px;position:relative;-webkit-transform:none;transform:none;max-inline-size:100%;inline-size:100%}.duet-date__table{border-collapse:collapse;border-spacing:0;font-size:1em;line-height:1.25;text-align:center;inline-size:100%}.duet-date__table-header{font-size:0.75em;font-weight:600;letter-spacing:1px;line-height:1.25;-webkit-padding-after:8px;padding-block-end: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;block-size:2.5em;inline-size: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%;opacity:0.16;position:absolute;inset: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;-webkit-margin-after:16px;margin-block-end:16px;inline-size: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;-webkit-margin-start:8px;margin-inline-start:8px;padding:0;-webkit-transition:background-color 300ms ease;transition:background-color 300ms ease;font-size:0.9em;block-size:2.2em;inline-size: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-block:0;margin-inline:auto}.duet-date__select{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;-webkit-margin-before:4px;margin-block-start:4px;position:relative}.duet-date__select span{-webkit-margin-end:4px;margin-inline-end:4px}.duet-date__select select{cursor:pointer;font-size:1em;block-size:100%;inset-inline-start:0;opacity:0;position:absolute;inset-block-start:0;inline-size: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-block:0;padding-inline:8px 4px;pointer-events:none;position:relative;inline-size: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);block-size:1px;overflow:hidden;padding:0;position:absolute;inset-block-start:0;inline-size:1px}';function S(e,t){const a=[];for(let i=e;i<=t;i++){a.push(i)}return a}let C=0;const F=class{constructor(e){t(this,e);this.nanoDatePicked=a(this,"nanoDatePicked",7);this.dateId=`nano-datepicker-${C++}`;this.monthSelectId=this.dateId+"-"+"month";this.yearSelectId=this.dateId+"-"+"year";this.dialogLabelId=this.dateId+"-"+"dialog";this.initialTouchX=null;this.initialTouchY=null;this.enableActiveFocus=()=>{this.activeFocus=true};this.disableActiveFocus=()=>{this.activeFocus=false};this.handleTouchStart=e=>{const t=e.changedTouches[0];this.initialTouchX=t.pageX;this.initialTouchY=t.pageY};this.handleTouchMove=e=>{e.preventDefault()};this.handleTouchEnd=e=>{const t=e.changedTouches[0];const a=t.pageX-this.initialTouchX;const i=t.pageY-this.initialTouchY;const s=70;const n=Math.abs(a)>=s&&Math.abs(i)<=s;if(n){this.addMonths(a<0?1:-1)}this.initialTouchY=null;this.initialTouchX=null};this.handleNextMonthClick=e=>{e.preventDefault();this.addMonths(1)};this.handlePreviousMonthClick=e=>{e.preventDefault();this.addMonths(-1)};this.handleKeyboardNavigation=e=>{if(e.key==="Tab"&&!e.shiftKey&&this.isModal){e.preventDefault();const t=this.firstFocusEle||this.firstFocusableElement;t.focus();return}let t=true;switch(e.key){case"ArrowRight":this.addDays(1);break;case"ArrowLeft":this.addDays(-1);break;case"ArrowDown":this.addDays(7);break;case"ArrowUp":this.addDays(-7);break;case"PageUp":if(e.shiftKey){this.addYears(-1)}else{this.addMonths(-1)}break;case"PageDown":if(e.shiftKey){this.addYears(1)}else{this.addMonths(1)}break;case"Home":this.startOfWeek();break;case"End":this.endOfWeek();break;default:t=false}if(t){e.preventDefault();this.enableActiveFocus()}};this.handleDaySelect=(e,t)=>{const a=!this.isDateDisabled(t);const i=d(t,r(this.min),r(this.max));if(!i||!a){return}if(t.getMonth()===this.focusedDay.getMonth()){this.setValue(t)}else{this.setFocusedDay(t)}};this.handleMonthSelect=e=>{this.setMonth(parseInt(e.target.value,10))};this.handleYearSelect=e=>{this.setYear(parseInt(e.target.value,10))};this.processFocusedDayNode=e=>{this.focusedDayNode=e;if(this.activeFocus){setTimeout((()=>e.focus()),0)}};this.activeFocus=false;this.focusedDay=new Date;this.selectedDate="";this.min="";this.max="";this.firstDayOfWeek=l.Monday;this.localization=m;this.color=undefined;this.isDateDisabled=()=>false;this.isModal=false;this.firstFocusEle=undefined}async setFocus(e=false,t=false){this.setFocusedDay(r(this.selectedDate)||new Date);if(e){setTimeout((e=>this.focusedDayNode.focus()),20);return}clearTimeout(this.focusTimeoutId);this.focusTimeoutId=setTimeout((()=>{if(t)g.force(this.monthSelectNode);this.monthSelectNode.focus()}),20)}handleSelectedDateChange(){this.setFocus(true)}addDays(e){this.setFocusedDay(c(this.focusedDay,e))}addMonths(e){this.setMonth(this.focusedDay.getMonth()+e)}addYears(e){this.setYear(this.focusedDay.getFullYear()+e)}startOfWeek(){this.setFocusedDay(h(this.focusedDay,this.firstDayOfWeek))}endOfWeek(){this.setFocusedDay(u(this.focusedDay,this.firstDayOfWeek))}setMonth(e){const t=b(p(this.focusedDay),e);const a=f(t);const i=b(this.focusedDay,e);this.setFocusedDay(_(i,t,a))}setYear(e){const t=x(p(this.focusedDay),e);const a=f(t);const i=x(this.focusedDay,e);this.setFocusedDay(_(i,t,a))}setFocusedDay(e){this.focusedDay=_(e,r(this.min),r(this.max))}setValue(e){this.selectedDate=v(e);this.nanoDatePicked.emit({value:this.selectedDate,valueAsDate:e})}connectedCallback(){if(this.yearSelectNode)g.observe(this.yearSelectNode);if(this.monthSelectNode)g.observe(this.monthSelectNode)}componentWillLoad(){this.handleSelectedDateChange()}componentDidLoad(){this.connectedCallback()}disconnectedCallback(){g.unobserve(this.yearSelectNode);g.unobserve(this.monthSelectNode)}render(){const t=r(this.selectedDate);const a=(t||this.focusedDay).getFullYear();const s=this.focusedDay.getMonth();const n=this.focusedDay.getFullYear();const o=r(this.min);const l=r(this.max);const c=o!=null&&o.getMonth()===s&&o.getFullYear()===n;const h=l!=null&&l.getMonth()===s&&l.getFullYear()===n;let u=a-10;let b=a+10;if(o)u=o.getFullYear();if(l)b=l.getFullYear();return e(i,{class:{...y(this.color)}},e("div",{class:"duet-date"},e("div",{class:{"duet-date__dialog":true,"is-active":true},onTouchMove:this.handleTouchMove,onTouchStart:this.handleTouchStart,onTouchEnd:this.handleTouchEnd},e("div",{class:"duet-date__dialog-content"},e("div",{class:"duet-date__vhidden duet-date__instructions","aria-live":"polite"},this.localization.keyboardInstruction),e("div",{class:"duet-date__header",onFocusin:this.disableActiveFocus},e("div",null,e("h2",{id:this.dialogLabelId,class:"duet-date__vhidden","aria-live":"polite"},this.localization.monthNames[s]," ",this.focusedDay.getFullYear()),e("label",{htmlFor:this.monthSelectId,class:"duet-date__vhidden"},this.localization.monthSelectLabel),e("div",{class:"duet-date__select"},e("select",{id:this.monthSelectId,class:"duet-date__select--month",ref:e=>this.firstFocusableElement=this.monthSelectNode=e,onChange:this.handleMonthSelect},this.localization.monthNames.map(((t,a)=>e("option",{key:t,value:a,selected:a===s,disabled:!d(new Date(n,a,1),o?p(o):null,l?f(l):null)},t)))),e("div",{class:"duet-date__select-label","aria-hidden":"true"},e("span",null,this.localization.monthNamesShort[s]),e("nano-icon",{name:"light/chevron-down"}))),e("label",{htmlFor:this.yearSelectId,class:"duet-date__vhidden"},this.localization.yearSelectLabel),e("div",{class:"duet-date__select"},e("select",{id:this.yearSelectId,class:"duet-date__select--year",onChange:this.handleYearSelect,ref:e=>this.yearSelectNode=e},S(u,b).map((t=>e("option",{key:t,selected:t===n},t)))),e("div",{class:"duet-date__select-label","aria-hidden":"true"},e("span",null,this.focusedDay.getFullYear()),e("nano-icon",{name:"light/chevron-down"})))),e("div",{class:"duet-date__nav"},e("button",{class:"duet-date__prev",onClick:this.handlePreviousMonthClick,disabled:c,type:"button"},e("nano-icon",{name:"light/chevron-left"}),e("span",{class:"duet-date__vhidden"},this.localization.prevMonthLabel)),e("button",{class:"duet-date__next",onClick:this.handleNextMonthClick,disabled:h,type:"button"},e("nano-icon",{name:"light/chevron-right"}),e("span",{class:"duet-date__vhidden"},this.localization.nextMonthLabel)))),e("div",null,e(z,{selectedDate:t,focusedDate:this.focusedDay,onDateSelect:this.handleDaySelect,onKeyboardNavigation:this.handleKeyboardNavigation,labelledById:this.dialogLabelId,localization:this.localization,firstDayOfWeek:this.firstDayOfWeek,focusedDayRef:this.processFocusedDayNode,min:o,max:l,isDateDisabled:this.isDateDisabled}))))))}get host(){return s(this)}static get watchers(){return{selectedDate:["handleSelectedDateChange"]}}};F.style=M;export{F as nano_date_picker};
-//# sourceMappingURL=p-28f713fb.entry.js.map

package/dist/nano-components/p-37553477.entry.js

@@ -1,5 +0,0 @@
-/*!
- * Web Components for Nanopore digital Web Apps
- */
-import{r as e,c as t,h as i,a as n}from"./p-1fe12320.js";const o=":host{box-sizing:border-box}*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}:host{display:-webkit-box;display:-ms-flexbox;display:flex;position:relative;-ms-flex-negative:0;flex-shrink:0;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;inline-size:100%;min-block-size:100%;font-size:18px;text-align:center;-webkit-box-sizing:border-box;box-sizing:border-box;overflow:hidden;-webkit-transition:opacity 0.2s;transition:opacity 0.2s;opacity:0}:host([ready]){opacity:1}";const s=class{constructor(i){e(this,i);this.nanoSlideReady=t(this,"nanoSlideReady",7);this.ready=null}readyChange(e,t){if(typeof t!=="undefined"&&t===false&&e===true){this.nanoSlideReady.emit()}}componentDidLoad(){if(typeof this.ready==="boolean")return;setTimeout((()=>{this.nanoSlideReady.emit();this.ready=true}))}render(){return i(n,null,i("slot",null))}static get watchers(){return{ready:["readyChange"]}}};s.style=o;export{s as nano_slide};
-//# sourceMappingURL=p-37553477.entry.js.map

package/dist/nano-components/p-37553477.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["src/components/slides/slide.scss?tag=nano-slide&encapsulation=shadow","src/components/slides/slide.tsx"],"names":["slideCss","Slide","[object Object]","newReady","oldReady","this","nanoSlideReady","emit","ready","setTimeout","h","Host"],"mappings":";;;yDAAA,MAAMA,EAAW,2kBCgBJC,EAAK,yFAUgD,KAGhEC,YAAYC,EAA0BC,GACpC,UACSA,IAAa,aACpBA,IAAa,OACbD,IAAa,KACb,CACAE,KAAKC,eAAeC,QAIxBL,mBAEE,UAAWG,KAAKG,QAAU,UAAW,OACrCC,YAAW,KACTJ,KAAKC,eAAeC,OACpBF,KAAKG,MAAQ,QAIjBN,SACE,OACEQ,EAACC,EAAI,KACHD,EAAA,OAAA","sourcesContent":["// Slide\n// --------------------------------------------------\n\n:host {\n  // Center slide text vertically\n  display: flex;\n  position: relative;\n  flex-shrink: 0;\n  align-items: center;\n  justify-content: center;\n  inline-size: 100%;\n  min-block-size: 100%;\n  font-size: 18px;\n  text-align: center;\n  box-sizing: border-box;\n  overflow: hidden;\n  transition: opacity 0.2s;\n  opacity: 0;\n}\n\n:host([ready]) {\n  opacity: 1;\n}\n","import {\n  Component,\n  ComponentInterface,\n  Host,\n  h,\n  Event,\n  EventEmitter,\n  Prop,\n  Watch,\n} from '@stencil/core';\n\n@Component({\n  tag: 'nano-slide',\n  styleUrl: 'slide.scss',\n  shadow: true,\n})\nexport class Slide implements ComponentInterface {\n  /**\n   * Fired when the slide has loaded.\n   */\n  @Event() nanoSlideReady!: EventEmitter<void>;\n\n  /**\n   * Used to to inform the parent slides components of readiness.\n   * This will automatically be set to true when the slide has loaded but can be set and updated manually.\n   */\n  @Prop({ mutable: true, reflect: true }) ready: boolean | null = null;\n\n  @Watch('ready')\n  readyChange(newReady: boolean | null, oldReady?: boolean | null) {\n    if (\n      typeof oldReady !== 'undefined' &&\n      oldReady === false &&\n      newReady === true\n    ) {\n      this.nanoSlideReady.emit();\n    }\n  }\n\n  componentDidLoad() {\n    // ready state is being loaded manually\n    if (typeof this.ready === 'boolean') return;\n    setTimeout(() => {\n      this.nanoSlideReady.emit();\n      this.ready = true;\n    });\n  }\n\n  render() {\n    return (\n      <Host>\n        <slot />\n      </Host>\n    );\n  }\n}\n"]}

package/dist/nano-components/p-4c97f05f.entry.js

@@ -1,5 +0,0 @@
-/*!
- * Web Components for Nanopore digital Web Apps
- */
-import{r as n,c as a,h as e,a as r,g as t}from"./p-1fe12320.js";import{c as s}from"./p-ee045579.js";import{c as i}from"./p-7b3638b7.js";import{a as o}from"./p-9746b0a5.js";const c=(n,a,e,r)=>{let t=n.querySelector("input.aux-input");if(!t){t=n.ownerDocument.createElement("input");t.type="hidden";t.classList.add("aux-input");n.appendChild(t)}t.disabled=r;t.name=a;t.value=e||""};const h='.sc-nano-range-h{box-sizing:border-box}*.sc-nano-range,*.sc-nano-range::before,*.sc-nano-range::after{box-sizing:border-box}[hidden].sc-nano-range{display:none !important}.sc-nano-range-h{--knob-handle-size:(var(--knob-size) * 2);--rgb-inactive:165, 165, 165;--knob-border-radius:50%;--knob-background:var(--nano-color-primary, #007495);--knob-box-shadow:0 2px 4px 0 rgba(0, 0, 0, 0.3);--knob-size:30px;--bar-height:8px;--bar-background:#e2e1e0;--bar-background-active:#a5a5a5;--bar-border-radius:4px;--height:42px;--pin-background:var(--nano-color-primary, #007495);--pin-color:var(--nano-color-primary-contrast, #fff);--focus-style:0 0 0 5px var(--nano-control-focus-color, rgba(144, 198, 231, 0.8))}.range-wrap.sc-nano-range{display:-webkit-box;display:-ms-flexbox;display:flex;position:relative;-webkit-box-flex:3;-ms-flex:3;flex:3;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.range-wrap.sc-nano-range-s>ion-icon[slot],.range-wrap .sc-nano-range-s>ion-icon[slot]{font-size:1.5em}.range-wrap.sc-nano-range-s>[slot=start],.range-wrap .sc-nano-range-s>[slot=start]{margin-inline:0 14px;margin-block:0;font-size:0.9em}.range-wrap.sc-nano-range-s>[slot=end],.range-wrap .sc-nano-range-s>[slot=end]{margin-inline:14px 0;margin-block:0;font-size:0.9em}.range-slider.sc-nano-range{position:relative;-webkit-box-flex:1;-ms-flex:1;flex:1;width:100%;height:var(--height);contain:size layout style;cursor:-webkit-grab;cursor:grab;-ms-touch-action:pan-y;touch-action:pan-y}.range-pressed.sc-nano-range-h .range-slider.sc-nano-range{cursor:-webkit-grabbing;cursor:grabbing}.range-bar.sc-nano-range{border-radius:var(--bar-border-radius);inset-block-start:calc((var(--height) - var(--bar-height)) / 2);inset-inline-start:0;position:absolute;width:100%;height:var(--bar-height);background:var(--bar-background);pointer-events:none}.range-snaps.sc-nano-range-h .range-bar.sc-nano-range{border-radius:var(--bar-border-radius) 0 0 var(--bar-border-radius)}.range-bar-active.sc-nano-range{inset-block-end:0;width:auto;background:var(--bar-background-active)}.range-bar-active .range-pressed.sc-nano-range-h{will-change:left, right}.range-knob.sc-nano-range{border-radius:var(--knob-border-radius);inset-block-start:calc(50% - var(--knob-size) / 2);inset-inline-start:calc(50% - var(--knob-size) / 2);position:absolute;width:var(--knob-size);height:var(--knob-size);background:var(--knob-background);-webkit-box-shadow:var(--knob-box-shadow);box-shadow:var(--knob-box-shadow);z-index:2;pointer-events:none;-webkit-transform:scale(0.67);transform:scale(0.67);-webkit-transition-duration:120ms;transition-duration:120ms;-webkit-transition-property:background-color, border, -webkit-transform;transition-property:background-color, border, -webkit-transform;transition-property:transform, background-color, border;transition-property:transform, background-color, border, -webkit-transform;-webkit-transition-timing-function:ease;transition-timing-function:ease}.sc-nano-range-h:not(.range-has-pin) .range-knob-pressed.sc-nano-range .range-knob.sc-nano-range{-webkit-transform:scale(1);transform:scale(1)}.range-knob-handle.sc-nano-range{inset-block-start:calc((var(--height) - var(--knob-handle-size)) / 2);inset-inline-start:0;-webkit-margin-start:calc(0px - var(--knob-handle-size) / 2);margin-inline-start:calc(0px - var(--knob-handle-size) / 2);position:absolute;width:calc(var(--knob-handle-size));height:calc(var(--knob-handle-size));text-align:center}.range-knob-handle.sc-nano-range:active,.range-knob-handle.sc-nano-range:focus{outline:none}.range-knob-handle.sc-nano-range:active .range-knob.sc-nano-range,.range-knob-handle.sc-nano-range:focus .range-knob.sc-nano-range{-webkit-box-shadow:var(--knob-box-shadow), var(--focus-style);box-shadow:var(--knob-box-shadow), var(--focus-style)}.range-tick.sc-nano-range{position:absolute;inset-block-start:calc((var(--height) - var(--bar-height)) / 2);width:var(--bar-height);height:var(--bar-height);background:var(--bar-background-active);z-index:1;pointer-events:none}.range-tick.sc-nano-range:first-of-type{border-radius:var(--bar-border-radius) 0 0 var(--bar-border-radius)}.range-tick.sc-nano-range:last-of-type{border-radius:0 var(--bar-border-radius) var(--bar-border-radius) 0}.range-tick-active.sc-nano-range{background:transparent}.range-pin.sc-nano-range{-webkit-transform:translate3d(0, 0, 0) scale(0.01);transform:translate3d(0, 0, 0) scale(0.01);-webkit-transform-origin:center top;transform-origin:center top;padding:0.66em 0;border-radius:50%;text-align:center;-webkit-box-sizing:border-box;box-sizing:border-box;display:inline-block;position:relative;min-width:2.33em;height:2.33em;-webkit-transition:background 120ms ease, -webkit-transform 120ms ease;transition:background 120ms ease, -webkit-transform 120ms ease;transition:transform 120ms ease, background 120ms ease;transition:transform 120ms ease, background 120ms ease, -webkit-transform 120ms ease;background:var(--pin-background);color:var(--pin-color);font-size:0.75em}.range-pin.sc-nano-range::before{inset-block-start:0.25em;inset-inline-start:50%;-webkit-margin-start:-1.08em;margin-inline-start:-1.08em;border-radius:50% 50% 50% 0;position:absolute;width:2.16em;height:2.16em;-webkit-transform:rotate(-45deg);transform:rotate(-45deg);-webkit-transition:background 120ms ease;transition:background 120ms ease;background:var(--pin-background);content:"";z-index:-1}.range-knob-pressed.sc-nano-range .range-pin.sc-nano-range{-webkit-transform:translate3d(0, -50%, 0) scale(1);transform:translate3d(0, -50%, 0) scale(1);-webkit-transform:translate3d(0, calc((100% - var(--bar-height)) * -1), 0) scale(1);transform:translate3d(0, calc((100% - var(--bar-height)) * -1), 0) scale(1)}.range-disabled.sc-nano-range-h{pointer-events:none}.range-disabled.sc-nano-range-h .range-bar-active.sc-nano-range,.range-disabled.sc-nano-range-h .range-bar.sc-nano-range,.range-disabled.sc-nano-range-h .range-tick.sc-nano-range{background-color:rgba(var(--rgb-inactive), 0.5)}.range-disabled.sc-nano-range-h .range-knob.sc-nano-range{-webkit-transform:scale(0.55);transform:scale(0.55);outline:5px solid #fff;background-color:rgba(var(--rgb-inactive), 0.5)}.nano-color.sc-nano-range-h .range-bar-active.sc-nano-range,.nano-color.sc-nano-range-h .range-knob.sc-nano-range,.nano-color.sc-nano-range-h .range-pin.sc-nano-range,.nano-color.sc-nano-range-h .range-pin.sc-nano-range::before,.nano-color.sc-nano-range-h .range-tick.sc-nano-range{background:var(--nano-color-base);color:var(--nano-color-contrast)}.nano-color.sc-nano-range-h .range-bar.sc-nano-range{background:rgba(var(--nano-color-base-rgb), 0.26)}.nano-color.sc-nano-range-h .range-knob-handle.sc-nano-range:active .range-knob.sc-nano-range,.nano-color.sc-nano-range-h .range-knob-handle.sc-nano-range:focus .range-knob.sc-nano-range{-webkit-box-shadow:var(--knob-box-shadow), 0 0 0 5px rgba(var(--nano-color-tint-rgb), 0.56);box-shadow:var(--knob-box-shadow), 0 0 0 5px rgba(var(--nano-color-tint-rgb), 0.56)}';const b=class{constructor(e){n(this,e);this.nanoChange=a(this,"nanoChange",7);this.nanoStyle=a(this,"nanoStyle",7);this.nanoFocus=a(this,"nanoFocus",7);this.nanoBlur=a(this,"nanoBlur",7);this.noUpdate=false;this.hasFocus=false;this.clampBounds=n=>s(this.min,n,this.max);this.ensureValueInBounds=n=>{if(this.dualKnobs){return{lower:this.clampBounds(n.lower),upper:this.clampBounds(n.upper)}}else{return this.clampBounds(n)}};this.handleKeyboard=(n,a)=>{let e=this.step;e=e>0?e:1;e=e/(this.max-this.min);if(!a){e*=-1}if(n==="A"){this.ratioA=s(0,this.ratioA+e,1)}else{this.ratioB=s(0,this.ratioB+e,1)}this.updateValue()};this.onBlur=()=>{if(this.hasFocus){this.hasFocus=false;this.nanoBlur.emit();this.emitStyle()}};this.onFocus=()=>{if(!this.hasFocus){this.hasFocus=true;this.nanoFocus.emit();this.emitStyle()}};this.ratioA=0;this.ratioB=0;this.pressedKnob=undefined;this.color=undefined;this.debounce=0;this.name="";this.dualKnobs=false;this.min=0;this.max=100;this.pin=false;this.snaps=false;this.step=1;this.ticks=false;this.disabled=false;this.value=0}debounceChanged(){this.nanoChange=o(this.nanoChange,this.debounce)}minChanged(){if(!this.noUpdate){this.updateRatio()}}maxChanged(){if(!this.noUpdate){this.updateRatio()}}disabledChanged(){if(this.gesture){this.gesture.enable(!this.disabled)}this.emitStyle()}valueChanged(n){if(!this.noUpdate){this.updateRatio()}n=this.ensureValueInBounds(n);this.nanoChange.emit({value:n})}connectedCallback(){this.updateRatio();this.debounceChanged();this.disabledChanged()}disconnectedCallback(){if(this.gesture){this.gesture.destroy();this.gesture=undefined}}async componentDidLoad(){const n=this.rangeSlider;if(n){this.gesture=(await import("./p-2828788c.js")).createGesture({el:n,gestureName:"range",gesturePriority:100,threshold:0,onStart:n=>this.onStart(n),onMove:n=>this.onMove(n),onEnd:n=>this.onEnd(n)});this.gesture.enable(!this.disabled)}}getValue(){const n=this.value||0;if(this.dualKnobs){if(typeof n==="object"){return n}return{lower:0,upper:n}}else{if(typeof n==="object"){return n.upper}return n}}emitStyle(){this.nanoStyle.emit({interactive:true,"interactive-disabled":this.disabled})}onStart(n){const a=this.rect=this.rangeSlider.getBoundingClientRect();const e=n.currentX;let r=s(0,(e-a.left)/a.width,1);if(document.dir==="rtl"){r=1-r}this.pressedKnob=!this.dualKnobs||Math.abs(this.ratioA-r)<Math.abs(this.ratioB-r)?"A":"B";this.setFocus(this.pressedKnob);this.update(e)}onMove(n){this.update(n.currentX)}onEnd(n){this.update(n.currentX);this.pressedKnob=undefined}update(n){const a=this.rect;let e=s(0,(n-a.left)/a.width,1);if(document.dir==="rtl"){e=1-e}if(this.snaps){e=d(l(e,this.min,this.max,this.step),this.min,this.max)}if(this.pressedKnob==="A"){this.ratioA=e}else{this.ratioB=e}this.updateValue()}get valA(){return l(this.ratioA,this.min,this.max,this.step)}get valB(){return l(this.ratioB,this.min,this.max,this.step)}get ratioLower(){if(this.dualKnobs){return Math.min(this.ratioA,this.ratioB)}return 0}get ratioUpper(){if(this.dualKnobs){return Math.max(this.ratioA,this.ratioB)}return this.ratioA}updateRatio(){const n=this.getValue();const{min:a,max:e}=this;if(this.dualKnobs){this.ratioA=d(n.lower,a,e);this.ratioB=d(n.upper,a,e)}else{this.ratioA=d(n,a,e)}}updateValue(){this.noUpdate=true;const{valA:n,valB:a}=this;this.value=!this.dualKnobs?n:{lower:Math.min(n,a),upper:Math.max(n,a)};this.noUpdate=false}setFocus(n){if(this.el.shadowRoot){const a=this.el.shadowRoot.querySelector(n==="A"?".range-knob-a":".range-knob-b");if(a){a.focus()}}}render(){const{min:n,max:a,step:t,el:s,handleKeyboard:o,pressedKnob:h,disabled:b,pin:l,ratioLower:u,ratioUpper:k}=this;const p=`${u*100}%`;const f=`${100-k*100}%`;const m=document;const v=m.dir==="rtl";const w=v?"right":"left";const x=v?"left":"right";const y=n=>({[w]:n[w]});const z={[w]:p,[x]:f};const A=[];if(this.snaps&&this.ticks){for(let e=n;e<=a;e+=t){const r=d(e,n,a);const t={ratio:r,active:r>=u&&r<=k};t[w]=`${r*100}%`;A.push(t)}}c(s,this.name,JSON.stringify(this.getValue()),b);return e(r,{onFocusin:this.onFocus,onFocusout:this.onBlur,class:i(this.color,{"range-disabled":b,"range-pressed":h!==undefined,"range-has-pin":l,"range-snaps":this.snaps})},e("div",{class:"range-wrap"},e("slot",{name:"start"}),e("div",{class:"range-slider",ref:n=>this.rangeSlider=n},A.map((n=>e("span",{style:y(n),role:"presentation",class:{"range-tick":true,"range-tick-active":n.active},part:n.active?"tick-active":"tick"}))),e("div",{class:"range-bar",role:"presentation",part:"bar"}),e("div",{class:"range-bar range-bar-active",role:"presentation",style:z,part:"bar-active"}),g(v,{knob:"A",pressed:h==="A",value:this.valA,ratio:this.ratioA,pin:l,disabled:b,handleKeyboard:o,min:n,max:a}),this.dualKnobs&&g(v,{knob:"B",pressed:h==="B",value:this.valB,ratio:this.ratioB,pin:l,disabled:b,handleKeyboard:o,min:n,max:a})),e("slot",{name:"end"})))}get el(){return t(this)}static get watchers(){return{debounce:["debounceChanged"],min:["minChanged"],max:["maxChanged"],disabled:["disabledChanged"],value:["valueChanged"]}}};const g=(n,{knob:a,value:r,ratio:t,min:s,max:i,disabled:o,pressed:c,pin:h,handleKeyboard:b})=>{const g=n?"right":"left";const l=()=>{const n={};n[g]=`${t*100}%`;return n};return e("div",{onKeyDown:n=>{const e=n.key;if(e==="ArrowLeft"||e==="ArrowDown"){b(a,false);n.preventDefault();n.stopPropagation()}else if(e==="ArrowRight"||e==="ArrowUp"){b(a,true);n.preventDefault();n.stopPropagation()}},class:{"range-knob-handle":true,"range-knob-a":a==="A","range-knob-b":a==="B","range-knob-pressed":c,"range-knob-min":r===s,"range-knob-max":r===i},style:l(),role:"slider",tabindex:o?-1:0,"aria-valuemin":s,"aria-valuemax":i,"aria-disabled":o?"true":null,"aria-valuenow":r},h&&e("div",{class:"range-pin",role:"presentation",part:"pin"},Math.round(r)),e("div",{class:"range-knob",role:"presentation",part:"knob"}))};const l=(n,a,e,r)=>{let t=(e-a)*n;if(r>0){t=Math.round(t/r)*r+a}return s(a,t,e)};const d=(n,a,e)=>s(0,(n-a)/(e-a),1);b.style=h;export{b as nano_range};
-//# sourceMappingURL=p-4c97f05f.entry.js.map