@nanoporetech-digital/components 5.2.1 → 5.3.0

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

@@ -0,0 +1 @@
+{"version":3,"names":["async","clientFetch","url","_a","body","customConfig","__rest","headers","Accept","Cache","config","Object","assign","method","credentials","keepalive","mode","JSON","stringify","id","setTimeout","window","AbortController","controller","timeout","abort","signal","response","fetch","clearTimeout","ok","json","errorMessage","text","Error","globalNavCss","THRESHOLDBREAKS","about","main","login","search","icon","GlobalNav","constructor","hostRef","this","currSize","thresholdsGoingUp","THRESHOLDLIMIT","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","menuWrapDiv","focus","preventScroll","threshold","scrollHeight","innerHeight","document","overflow","menuFullScreen","overflowX","modalIsOpen","onMenuHidden","removeEventListener","activeElement","menuBtn","mainBarDiv","subMenuClose","target","closest","open","onUserBtnClick","userMenuOpen","onUserBtnKeyDown","onUserMenuBlur","relatedTarget","onSearchBtnClick","searchBarShown","searchbarShow","searchbarHide","onSearchBtnKeyDown","onSearchBarShown","searchBarEl","searchInput","setFocus","showAutocomplete","searchValInternal","addEventListener","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","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","assessSlottedContent","readTask","hasSiteSlot","querySelectorAll","hasLoggedinSlot","hasPromotionSlot","aboutSlotLen","iconSlotLen","mainSlotLen","overflowSlotLen","searchSlotLen","encodeURIComponent","location","href","protocol","host","bind","handleMyAccountData","myAccountData","user","links","myAccountUser","processMyAccLinks","processMyAccData","remoteDataReady","openClose","undefined","env","userProfileUrl","getMyAccountData","ssoDataUrl","import","foundIndex","changeInternalSearchVal","initAlgoliaClient","algoliasearch","addAlgoliaIndeces","addIndeces","searchIndeces","forEach","initIndex","thresholdChange","newThreshold","oldThreshold","ratioChange","intersectRatio","thresholdReady","menuItems","barItems","Array","from","push","writeTask","item","classList","add","remove","assessReady","ready","remoteReady","attachIO","isReady","nanoIsReady","setupAutocompleteBlur","closeSearchBar","secondaryMenuOpen","slotChange","thresholdClasses","classes","onWindowResize","innerWidth","secondaryOpen","secondaryMenu","stopPropagation","menuSelectedItems","menuContentDiv","minHeight","secondaryClose","force","composedPath","some","contains","requestAnimationFrame","displayTransition","userLinkPanel","widgetHeight","querySelector","toString","autocompleteSnippet","hit","lookFor","_snippetResult","prop","matchLevel","title","substring","resetHitFocus","autocompleteEle","setAttribute","io","root","IntersectionObserver","data","slice","intersectionRatio","observe","componentDidLoad","debounceResize","componentWillLoad","ComponentStore","init","disconnectedCallback","disconnect","mo","connectedCallback","getMyAccData","autocompleteList","content","scrollingUp","currentScopeHits","scopeChangeSuggestions","scopeSuggestReducer","total","currentSuggestReducer","reduce","scopeSuggestions","h","class","role","ref","a","tabindex","innerHTML","button","onClick","onMouseDown","hidden","onKeyDown","searchWidget","onSubmit","label","hideLabel","showInlineError","onNanoChange","mask","slot","placeholder","input","onNanoInput","onNanoFocus","render","isRtl","ownerDocument","dir","Host","join","resizing","div","part","activeMyAccountSections","includes","msgUrl","msgCount","cartUrl","cartCount","urls","ssoRedirect","onSlotchange","link","address","small_avatar_url","forgot_password","logout","quietMode","w","btn","showLogo","logoUrl","src","getAssetPath","alt","showSearch","_b","show","onTouchEnd","domainFor","origin","dm","multiResults","singleResult","match","indeces","api_key","app_id","cart","count","notifications","messages","area"],"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"],"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@use '../../../global/style/nano-theme/form' as nanoForm;\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(12 90 113);\n  --bar-color-tint: rgb(19 89 111);\n  --bar-color-focus: #99a3a6;\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: flex;\n  flex-direction: column;\n  position: relative;\n  line-height: 1.5;\n  height: 100%;\n  font-size: 0.9375em;\n  font-size: clamp(0.77rem, 1vw, 0.9rem);\n\n  input,\n  select,\n  button {\n    font-family: inherit;\n    appearance: none;\n    font-size: inherit;\n  }\n\n  a,\n  button {\n    &:focus {\n      outline: none;\n    }\n\n    &:focus-visible {\n      box-shadow: #{nanoForm.$control-focus-style};\n    }\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 from 'algoliasearch/dist/algoliasearch-lite.esm.browser';\nimport { clientFetch } from '../../utils/fetch';\nimport { ComponentStore } from '../../utils/store/component-store';\nimport { debounce } from '../../utils/throttle';\nimport { displayTransition } from '../../utils/transitions';\nimport type { SearchClient as AlgoliaClient } from 'algoliasearch/lite';\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  about: 0,\n  main: 1,\n  login: 2,\n  search: 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 *\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 * @slot - if using search functionality, place a `<nano-search-results />` element in the default slot\n *\n * @part burger - the overflow / burger ui element\n * @part burger-menu - the overflow / burger menu\n * @part burger-actions-bar - the top bar of the overflow / burger menu\n * @part burger-content - the main content area of the overflow / burger menu\n * @part sticker - the `nano-sticker` wrapping the main nav-bar\n * @part bars - the main wrapper around the `main-bar` and `search-bar` nav bars\n * @part main-bar - the main nav menu bar\n * @part logo-link - the link wrapping the logo\n * @part search-bar - the search bar that appears under the main nav menu bar\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  private menuSelectedItems: NodeListOf<HTMLNanoNavItemElement>;\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  constructor() {\n    this.assessSlottedContent = debounce(\n      this.assessSlottedContent.bind(this),\n      10\n    );\n  }\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  // threshold / sizing\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\n  // modals state\n  @State() modalOpen: boolean = false;\n  @State() modalIsOpen: boolean = false;\n  @State() searchBarShown: boolean = false;\n  @State() scrollingUp: boolean = true;\n  @State() showAutocomplete: boolean = false;\n  @State() secondaryMenuOpen: HTMLNanoNavItemElement = null;\n  @State() userMenuOpen: boolean = false;\n  @State() menuFullScreen: boolean = false;\n\n  // search\n  @State() searchLoading: boolean = false;\n  @State() searchValInternal: string = '';\n  @State() internalSearchIndeces: Array<SearchIndex> = [];\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   * An alternative to both 'env' and 'ssoDataUrl'.\n   * You can directly provide a JSON object of myaccount data.\n   * (e.g. https://myaccount.nanoporetech.com/nav_bar_data.json)\n   * This is useful for SSR\n   */\n  @Prop() myAccountData: MyAccountData | null;\n  @Watch('myAccountData')\n  handleMyAccountData() {\n    if (!this.myAccountData) return;\n\n    if (!this.myAccountData.user || !this.myAccountData.links) return;\n\n    this.myAccData = this.myAccountData;\n    if (this.myAccData.user.id) {\n      this.isLoggedIn = true;\n      this.myAccountUser = this.myAccData.user;\n    }\n\n    this.processMyAccLinks();\n    this.processMyAccData();\n    this.remoteDataReady = true;\n  }\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 programmatically get or to preload search results\n   */\n  @Prop({ mutable: true }) searchValue: string = '';\n\n  /**\n   * Algolia search index to programmatically 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  /**\n   * Manually open or close the overflow (burger) menu\n   * @param openClose - optionally force open (true) or close (false)\n   */\n  @Method()\n  async toggleOverflowMenu(openClose?: boolean) {\n    if (openClose === true || (openClose === undefined && !this.modalIsOpen)) {\n      this.menuOpen();\n    } else {\n      this.menuClose(null, true);\n    }\n  }\n\n  @Watch('env')\n  @Watch('ssoDataUrl')\n  async getMyAccData() {\n    if (!!this.myAccData) return;\n\n    switch (this.env) {\n      case 'prod':\n        this.userProfileUrl = 'https://myaccount.nanoporetech.com/';\n      case 'local':\n      case 'dev':\n      case 'test':\n      default:\n        this.userProfileUrl = 'https://myaccount.nanoporetech.com/';\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    if (!this.searchIndex) return this.internalSearchIndeces[0];\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\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  @Watch('secondaryMenuOpen')\n  closeSearchBar() {\n    if (!!this.secondaryMenuOpen && this.searchBarShown) this.searchbarHide();\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    if (this.ready) this.ratioChange();\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      this.ratioChange();\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 & { target: HTMLNanoNavItemElement }) {\n    if (!(ev.detail as NavItemEventDetail).secondaryMenu) return;\n    ev.stopPropagation();\n    this.secondaryMenuOpen = ev.target;\n\n    if (!this.menuSelectedItems) {\n      this.menuSelectedItems = this.el.querySelectorAll(\n        'nano-nav-item.selected'\n      );\n      this.menuSelectedItems.forEach((i) => i.classList.remove('selected'));\n      this.menuSelectedItems.forEach((i) => (i.selected = false));\n    }\n\n    this.menuContentDiv.style.minHeight =\n      (ev.detail as NavItemEventDetail).secondaryMenu.scrollHeight + 'px';\n  }\n\n  @Listen('nanoClose')\n  secondaryClose(ev: CustomEvent & { target: HTMLNanoNavItemElement }) {\n    if (!(ev.detail as NavItemEventDetail).secondaryMenu) return;\n    ev.stopPropagation();\n\n    setTimeout(() => {\n      if (this.secondaryMenuOpen === ev.target && this.menuSelectedItems) {\n        this.secondaryMenuOpen = null;\n        this.menuContentDiv.style.minHeight = '';\n        this.menuSelectedItems.forEach((i) => i.classList.add('selected'));\n        this.menuSelectedItems.forEach((i) => (i.selected = true));\n        this.menuSelectedItems = null;\n      }\n    }, 200);\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.modalOpen = true;\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    setTimeout(() => (this.modalIsOpen = true), 300);\n  };\n\n  private onMenuHidden = () => {\n    this.menuDiv.removeEventListener('transitionend', this.onMenuHidden);\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  @Listen('click', { target: 'body' })\n  menuClose(\n    ev?: FocusEvent | MouseEvent | KeyboardEvent | TouchEvent,\n    force: boolean = false\n  ) {\n    if (!this.modalIsOpen) return;\n\n    if (force) {\n      this.modalOpen = false;\n      this.menuDiv.addEventListener('transitionend', this.onMenuHidden);\n      return;\n    }\n\n    if (\n      !ev\n        .composedPath()\n        .some(\n          (el) =>\n            el === this.menuContentDiv ||\n            (el as Element).classList?.contains('gn-menu_actions')\n        )\n    ) {\n      requestAnimationFrame(() => {\n        if (!!this.secondaryMenuOpen) return;\n\n        this.modalOpen = false;\n        this.menuDiv.addEventListener('transitionend', this.onMenuHidden);\n      });\n    }\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      const widgetHeight =\n        Math.floor(\n          this.searchBarEl.querySelector('.search-widget').scrollHeight\n        ) - 1;\n      this.searchBarEl.style.height = widgetHeight.toString() + '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\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.search(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    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  connectedCallback() {\n    this.handleMyAccountData();\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-icon\n            name=\"light/chevron-down\"\n            class=\"select-input__arrow\"\n            slot=\"down-arrow\"\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.searchValue && !this.searchLoading,\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            part=\"burger\"\n          >\n            <div\n              class=\"gn-menu_wrap\"\n              ref={(div) => (this.menuWrapDiv = div)}\n              tabindex=\"-1\"\n              part=\"burger-menu\"\n            >\n              <div class=\"gn-menu_actions\" part=\"burger-actions-bar\">\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\" part=\"burger-content\">\n                  <nav class=\"nav-links nav-links--main\" role=\"menu\">\n                    <slot\n                      name=\"overflow\"\n                      onSlotchange={this.assessSlottedContent}\n                    />\n                    {this.threshold <\n                      this.THRESHOLDLIMIT - THRESHOLDBREAKS.main &&\n                      !!this.mainSlotLen && (\n                        <slot\n                          name=\"main\"\n                          onSlotchange={this.assessSlottedContent}\n                        />\n                      )}\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                      {/* 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 nav-links_title--sites\">\n                                Sites\n                              </h4>\n                              <nav\n                                class=\"nav-links nav-links--sub nav-links--sites\"\n                                aria-label=\"Different company site links\"\n                              >\n                                <slot\n                                  name=\"site\"\n                                  onSlotchange={this.assessSlottedContent}\n                                />\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\n                                      name=\"site\"\n                                      onSlotchange={this.assessSlottedContent}\n                                    />\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                {/* USER PROFILE IN BURGER */}\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\n                                name=\"loggedin\"\n                                onSlotchange={this.assessSlottedContent}\n                              />\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\n                  name=\"promotion\"\n                  onSlotchange={this.assessSlottedContent}\n                />\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          <div class=\"sticker-trigger\" />\n          <nano-sticker\n            auto-resize=\"false\"\n            break-point-max=\"800\"\n            quietMode={{ h: 600, w: 800 }}\n            part=\"sticker\"\n          >\n            <div class=\"bars\" part=\"bars\">\n              <nav\n                part=\"main-bar\"\n                class=\"main-bar\"\n                aria-label=\"Main site navigation\"\n                tabindex=\"-1\"\n                ref={(div) => (this.mainBarDiv = div)}\n                role={\n                  !!this.mainSlotLen &&\n                  this.threshold >= this.THRESHOLDLIMIT - THRESHOLDBREAKS.main\n                    ? 'menu'\n                    : undefined\n                }\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\" part=\"logo-link\">\n                    <img\n                      src={getAssetPath(`../nano-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\n                      name=\"logo\"\n                      onSlotchange={this.assessSlottedContent}\n                    />\n                  </div>\n                )}\n\n                <div class=\"nav-links nav-links--main\">\n                  <slot name=\"main\" onSlotchange={this.assessSlottedContent} />\n                </div>\n\n                {/* search widget displayed in the bar (there is enough space to show it) */}\n                {this.mainSlotLen === 0 &&\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 && (\n                        <slot\n                          name=\"search\"\n                          onSlotchange={this.assessSlottedContent}\n                        />\n                      ),\n                  ]}\n\n                {/* Bar Icon buttons */}\n\n                {/* Bar search icon button (when not enough to show search in bar) */}\n                {(this.mainSlotLen > 0 ||\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                      role=\"menu\"\n                    >\n                      <slot\n                        name=\"about\"\n                        onSlotchange={this.assessSlottedContent}\n                      />\n                      {!!this.aboutNavItms.length && (\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                      )}\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              {/* Search widget shown in bar underneath main bar when there is not enough space  */}\n              {(this.mainSlotLen > 0 ||\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                  part=\"search-bar\"\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 && (\n                        <slot\n                          name=\"search\"\n                          onSlotchange={this.assessSlottedContent}\n                        />\n                      )}\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\">\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"],"mappings":"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"}

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

@@ -0,0 +1,5 @@
+/*!
+ * Web Components for Nanopore digital Web Apps
+ */
+import{r as e,c as a,h as t,g as r}from"./p-f6a8467a.js";import{M as i}from"./p-2234694a.js";import{l as n,u as s}from"./p-d7c34990.js";import{h as o}from"./p-dc565459.js";import{w as d}from"./p-9bfdee71.js";import{C as l}from"./p-653ae985.js";import"./p-f88fa15c.js";import"./p-257432ff.js";import"./p-7bff5224.js";const h=":host{box-sizing:border-box}*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}:host{--size:25rem;--panel-background:white;--panel-shadow:var(--nano-layer-shadow-xlarge, 0 4px 16px rgba(0, 0, 0, 0.4));--scrim-color:var(--nano-layer-overlay-dark, rgb(74 74 74 / 50%));--header-button-color:#b5aea7;--footer-background:#e4e6e8;--header-background:var(--panel-background);--header-spacing:var(--nano-spacing-large, 20px);--body-spacing:var(--nano-spacing-large, 20px);--footer-spacing:var(--nano-spacing-medium, 16px) var(--nano-spacing-large, 20px);--dir:1}:host(:dir(rtl)){--dir:-1}:host-context([dir=rtl]){--dir:-1}.drawer{inset-block-start:0;inset-inline-start:0;width:100%;height:100%;pointer-events:none;overflow:hidden}.drawer--contained{position:absolute;z-index:initial}.drawer--fixed{position:fixed;z-index:var(--nano-layer-index-modal, 700)}.drawer__panel{position:absolute;z-index:2;max-width:100%;max-height:100%;background-color:var(--panel-background);box-shadow:var(--panel-shadow);pointer-events:all;transition:var(--nano-transition-fast, 0.3s) opacity, var(--nano-transition-fast, 0.3s) transform;display:flex;flex-direction:column}@media (forced-colors: active){.drawer__panel{border:solid 1px #4a4a4a}}.drawer__panel:focus{outline:none}.drawer--nodismiss .drawer__panel{animation:cannotClose 0.25s ease-in-out 1}@keyframes cannotClose{0%{transform:scale(1)}50%{transform:scale(1.08)}100%{transform:scale(1)}}.drawer--top .drawer__panel{inset-block:0 auto;inset-inline-end:auto;inset-inline-start:0;width:100%;height:var(--size);opacity:0;transform:translateY(-100%)}.drawer--bottom .drawer__panel{inset-block:auto 0;inset-inline-end:auto;inset-inline-start:0;width:100%;height:var(--size);opacity:0;transform:translateY(100%)}.drawer--top.drawer--open .drawer__panel,.drawer--bottom.drawer--open .drawer__panel{opacity:1;transform:translateY(0)}.drawer--start .drawer__panel{inset-block:0 auto;inset-inline-end:auto;inset-inline-start:0;width:var(--size);height:100%;opacity:0;transform:translateX(calc(var(--dir) * -100%))}.drawer--end .drawer__panel{inset-block:0 auto;inset-inline-end:0;inset-inline-start:auto;width:var(--size);height:100%;opacity:0;transform:translateX(calc(var(--dir) * 100%))}.drawer--start.drawer--open .drawer__panel,.drawer--end.drawer--open .drawer__panel{opacity:1;transform:translateX(0)}.drawer__header{inline-size:100%;display:flex;background-color:var(--header-background)}[stuck] .drawer__header{box-shadow:var(--nano-layer-shadow-medium, 0 2px 4px rgba(0, 0, 0, 0.2))}.drawer__title{flex:1 1 auto;font:inherit;font-size:var(--nano-fontsize-large, 1.25rem);line-height:1.2;padding:var(--header-spacing);margin:0}.drawer__header-actions{flex-shrink:0;display:flex;flex-wrap:wrap;justify-content:flex-end;gap:var(--nano-spacing-xsmall, 4px);padding:0 var(--header-spacing)}.drawer__header-actions .drawer__close,.drawer__header-actions ::slotted(nano-icon-button){flex:0 0 auto;display:flex;align-items:center;font-size:var(--nano-fontsize-xlarge, 1.5rem);--color:var(--header-button-color)}.drawer__main{display:flex;flex-direction:column;overflow:auto;-webkit-overflow-scrolling:touch;flex:1 1 auto}.drawer__body{display:block;flex:1 1 auto;padding:var(--body-spacing);padding-block:0 var(--body-spacing);padding-inline:var(--body-spacing)}.drawer:not(.drawer--has-header) .drawer__body{-webkit-padding-before:var(--body-spacing);padding-block-start:var(--body-spacing)}.drawer__footer{inline-size:100%;text-align:end;padding:var(--footer-spacing);background:var(--footer-background);inset-block-start:1px;position:relative}.drawer__footer ::slotted(button:not(:last-of-type)){-webkit-margin-end:var(--nano-spacing-xsmall, 4px);margin-inline-end:var(--nano-spacing-xsmall, 4px)}.drawer:not(.drawer--has-footer) .drawer__footer{display:none}.drawer__overlay{display:block;position:fixed;inset:0;background-color:var(--scrim-color);pointer-events:all;-webkit-backdrop-filter:blur(var(--nano-layer-overlay-blur, 3px));backdrop-filter:blur(var(--nano-layer-overlay-blur, 3px));opacity:0;transition:var(--nano-transition-fast, 0.3s) opacity}.drawer--open .drawer__overlay{opacity:1}.drawer--contained .drawer__overlay{display:none}";const c=class{constructor(t){e(this,t);this.nanoShow=a(this,"nanoShow",7);this.nanoHide=a(this,"nanoHide",7);this.nanoAfterHide=a(this,"nanoAfterHide",7);this.nanoAfterShow=a(this,"nanoAfterShow",7);this.nanoInitialFocus=a(this,"nanoInitialFocus",7);this.nanoRquestClose=a(this,"nanoRquestClose",7);this.handleDocumentKeyDown=e=>{if(this.contained){return}if(e.key==="Escape"&&this.modal.isActive()&&this.open){e.stopImmediatePropagation();this.requestClose("keyboard")}};this.handleTransitionEnd=e=>{if(e.propertyName==="opacity"&&e.composedPath().find((e=>e===this.panel||e===this.overlay))){if(!this.open){this.drawer.hidden=true;this.overlay.hidden=false;this.panel.hidden=false}this.open?this.nanoAfterShow.emit():this.nanoAfterHide.emit()}};this.handleSlotChange=()=>{this.hasFooter=o(this.host,"footer")};this.noDismiss=false;this.hasFooter=undefined;this.open=false;this.label=undefined;this.placement="end";this.contained=false;this.noHeader=false;this.storeId=undefined;this.storeMethod="url-hash";this.noUserDismiss=false;this.hoist=false}get panel(){return this._panel}set panel(e){if(this._panel){this.panel.removeEventListener("animationend",this.handleTransitionEnd)}if(!e)return;e.addEventListener("transitionend",this.handleTransitionEnd);this._panel=e}handleHoistChange(){if(!this.hoist||Array.from(document.body.children).includes(this.host))return;document.body.prepend(this.host)}async show(){if(this.open)return undefined;this.open=true;return d(this.host,"nanoAfterShow")}async hide(){if(!this.open)return undefined;this.open=false;return d(this.host,"nanoAfterHide")}requestClose(e){const a=this.nanoRquestClose.emit({source:e});if(a.defaultPrevented||this.noUserDismiss){this.noDismiss=true;setTimeout((()=>this.noDismiss=false),250);return}this.hide()}handleNoModalChange(){if(this.open&&!this.contained){this.modal.activate();n(this.host)}if(this.open&&this.contained){this.modal.deactivate();s(this.host)}}async handleOpenChange(){if(this.open){this.nanoShow.emit();this.addOpenListeners();this.originalTrigger=document.activeElement;if(!this.contained){this.modal.activate();n(this.host)}const e=this.host.querySelector("[autofocus]");if(e){e.removeAttribute("autofocus")}this.drawer.hidden=false;requestAnimationFrame((()=>{const a=this.nanoInitialFocus.emit();if(!a.defaultPrevented){if(e){e.focus({preventScroll:true})}else{this.panel.focus({preventScroll:true})}}if(e){e.setAttribute("autofocus","")}}));this.nanoAfterShow.emit();return}this.nanoHide.emit();this.removeOpenListeners();if(!this.contained){this.modal.deactivate();s(this.host)}const e=this.originalTrigger;if(typeof(e===null||e===void 0?void 0:e.focus)==="function"){setTimeout((()=>e.focus()))}}addOpenListeners(){document.addEventListener("keydown",this.handleDocumentKeyDown)}removeOpenListeners(){document.removeEventListener("keydown",this.handleDocumentKeyDown)}connectedCallback(){this.handleHoistChange();this.modal=new i(this.host)}disconnectedCallback(){s(this.host)}componentWillLoad(){this.handleSlotChange();if(this.open)this.show();if(this.storeId)l.init(this,["open"],this.storeMethod,this.storeId)}componentDidLoad(){this.drawer.hidden=!this.open;if(this.open){this.addOpenListeners();if(!this.contained){this.modal.activate();n(this.host)}}}render(){return t("div",{ref:e=>this.drawer=e,part:"base",class:{drawer:true,"drawer--open":this.open,[`drawer--${this.placement}`]:true,"drawer--contained":this.contained,"drawer--fixed":!this.contained,"drawer--has-footer":o(this.host,"footer"),"drawer--has-header":!this.noHeader,"drawer--nodismiss":this.noDismiss}},t("div",{ref:e=>this.overlay=e,part:"overlay",class:"drawer__overlay",onClick:()=>this.requestClose("overlay"),tabindex:"-1"}),t("div",{ref:e=>this.panel=e,part:"panel",class:"drawer__panel",role:"dialog","aria-modal":"true","aria-hidden":this.open?"false":"true","aria-label":this.noHeader?this.label:undefined,"aria-labelledby":!this.noHeader?"title":undefined,tabindex:"0"},t("div",{class:"drawer__main"},!this.noHeader&&t("nano-sticker",null,t("header",{part:"header",class:"drawer__header"},t("h2",{part:"title",class:"drawer__title",id:"title"},t("slot",{name:"label"},this.label.length>0?this.label:String.fromCharCode(65279))),t("div",{part:"header-actions",class:"drawer__header-actions"},t("slot",{name:"header-actions"}),!this.noUserDismiss&&t("nano-icon-button",{part:"close-button",exportparts:"base:close-button__base",class:"drawer__close",iconName:"light/times",label:"Close",onClick:()=>this.requestClose("close-button")})))),t("div",{part:"body",class:"drawer__body"},t("slot",null)),t("nano-sticker",{position:"bottom"},t("footer",{part:"footer",class:"drawer__footer"},t("slot",{name:"footer",onSlotchange:this.handleSlotChange}))))))}get host(){return r(this)}static get watchers(){return{hoist:["handleHoistChange"],contained:["handleNoModalChange"],open:["handleOpenChange"]}}};c.style=h;export{c as nano_drawer};
+//# sourceMappingURL=p-ace7743c.entry.js.map

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

@@ -0,0 +1 @@
+{"version":3,"names":["drawerCss","Drawer","this","handleDocumentKeyDown","event","contained","key","modal","isActive","open","stopImmediatePropagation","requestClose","handleTransitionEnd","propertyName","composedPath","find","node","panel","overlay","drawer","hidden","nanoAfterShow","emit","nanoAfterHide","handleSlotChange","hasFooter","hasSlot","host","_panel","ele","removeEventListener","addEventListener","handleHoistChange","hoist","Array","from","document","body","children","includes","prepend","async","undefined","waitForEvent","source","nanoRequestClose","nanoRquestClose","defaultPrevented","noUserDismiss","noDismiss","setTimeout","hide","handleNoModalChange","activate","lockBodyScrolling","deactivate","unlockBodyScrolling","nanoShow","addOpenListeners","originalTrigger","activeElement","autoFocusTarget","querySelector","removeAttribute","requestAnimationFrame","nanoInitialFocus","focus","preventScroll","setAttribute","nanoHide","removeOpenListeners","trigger","connectedCallback","Modal","disconnectedCallback","componentWillLoad","show","storeId","ComponentStore","init","storeMethod","componentDidLoad","render","h","ref","part","class","placement","noHeader","onClick","tabindex","role","label","id","name","length","String","fromCharCode","exportparts","iconName","position","onSlotchange"],"sources":["./src/components/drawer/drawer.scss?tag=nano-drawer&encapsulation=shadow","./src/components/drawer/drawer.tsx"],"sourcesContent":["@use 'sass:map';\n@use '../../global/style/utilities/mixins' as mx;\n@use '../../global/style/nano-theme/base' as base;\n@use '../../global/style/utilities/globals' as global;\n@use '../../global/style/nano-theme/colours' as color;\n@use '../../global/style/nano-theme/layers' as layer;\n\n:host {\n  /**\n  * @prop --size: The preferred size of the drawer; width or height depending on placement. Note that the drawer will shrink to accommodate smaller screens. Defaults to 25rem\n  * @prop --panel-background: background color of panel. Default to 'white'\n  * @prop --panel-shadow: Defaults to #{layer.$layer-shadow-xlarge};\n  * @prop --scrim-color: overlay colour of alert display. Defaults to #{layer.$layer-overlay-dark};\n  * @prop --footer-background: Defaults to #{map.get(color.$colors, lightgrey)};\n  * @prop --header-spacing: The amount of padding to use for the header.\n  * @prop --body-spacing: The amount of padding to use for the body.\n  * @prop --footer-spacing: The amount of padding to use for the footer. Defaults to #{base.$spacing-medium} #{base.$spacing-large}\n  * @prop --header-button-color: defaults to #{map.get(color.$colors, palegrey)};\n  */\n\n  --size: 25rem;\n  --panel-background: white;\n  --panel-shadow: #{layer.$layer-shadow-xlarge};\n  --scrim-color: #{layer.$layer-overlay-dark};\n  --header-button-color: #{map.get(color.$colors, palegrey)};\n  --footer-background: #{map.get(color.$colors, lightgrey)};\n  --header-background: var(--panel-background);\n  --header-spacing: #{base.$spacing-large};\n  --body-spacing: #{base.$spacing-large};\n  --footer-spacing: #{base.$spacing-medium} #{base.$spacing-large};\n  --dir: 1;\n}\n\n@include mx.rtl-host() {\n  --dir: -1;\n}\n\n.drawer {\n  inset-block-start: 0;\n  inset-inline-start: 0;\n  width: 100%;\n  height: 100%;\n  pointer-events: none;\n  overflow: hidden;\n\n  &--contained {\n    position: absolute;\n    z-index: initial;\n  }\n\n  &--fixed {\n    position: fixed;\n    z-index: #{layer.$layer-index-modal};\n  }\n}\n\n.drawer__panel {\n  position: absolute;\n  z-index: 2;\n  max-width: 100%;\n  max-height: 100%;\n  background-color: var(--panel-background);\n  box-shadow: var(--panel-shadow);\n  pointer-events: all;\n  transition: #{base.$transition-fast} opacity, #{base.$transition-fast} transform;\n  display: flex;\n  flex-direction: column;\n\n  @media (forced-colors: active) {\n    border: solid 1px #{map.get(color.$colors, black)};\n  }\n\n  &:focus {\n    outline: none;\n  }\n\n  .drawer--nodismiss & {\n    animation: cannotClose 0.25s ease-in-out 1;\n\n    @keyframes cannotClose {\n      0% {\n        transform: scale(1);\n      }\n\n      50% {\n        transform: scale(1.08);\n      }\n\n      100% {\n        transform: scale(1);\n      }\n    }\n  }\n\n  .drawer--top & {\n    inset-block: 0 auto;\n    inset-inline-end: auto;\n    inset-inline-start: 0;\n    width: 100%;\n    height: var(--size);\n    opacity: 0;\n    transform: translateY(-100%);\n  }\n\n  .drawer--bottom & {\n    inset-block: auto 0;\n    inset-inline-end: auto;\n    inset-inline-start: 0;\n    width: 100%;\n    height: var(--size);\n    opacity: 0;\n    transform: translateY(100%);\n  }\n\n  .drawer--top.drawer--open &,\n  .drawer--bottom.drawer--open & {\n    opacity: 1;\n    transform: translateY(0);\n  }\n\n  .drawer--start & {\n    inset-block: 0 auto;\n    inset-inline-end: auto;\n    inset-inline-start: 0;\n    width: var(--size);\n    height: 100%;\n    opacity: 0;\n    transform: translateX(calc(var(--dir) * -100%));\n  }\n\n  .drawer--end & {\n    inset-block: 0 auto;\n    inset-inline-end: 0;\n    inset-inline-start: auto;\n    width: var(--size);\n    height: 100%;\n    opacity: 0;\n    transform: translateX(calc(var(--dir) * 100%));\n  }\n\n  .drawer--start.drawer--open &,\n  .drawer--end.drawer--open & {\n    opacity: 1;\n    transform: translateX(0);\n  }\n}\n\n.drawer__header {\n  inline-size: 100%;\n  display: flex;\n  background-color: var(--header-background);\n\n  [stuck] & {\n    box-shadow: #{layer.$layer-shadow-medium};\n  }\n}\n\n.drawer__title {\n  flex: 1 1 auto;\n  font: inherit;\n  font-size: #{base.$fontsize-large};\n  line-height: 1.2;\n  padding: var(--header-spacing);\n  margin: 0;\n}\n\n.drawer__header-actions {\n  flex-shrink: 0;\n  display: flex;\n  flex-wrap: wrap;\n  justify-content: flex-end;\n  gap: #{base.$spacing-xsmall};\n  padding: 0 var(--header-spacing);\n\n  .drawer__close,\n  ::slotted(nano-icon-button) {\n    flex: 0 0 auto;\n    display: flex;\n    align-items: center;\n    font-size: #{base.$fontsize-xlarge};\n\n    --color: var(--header-button-color);\n  }\n}\n\n.drawer__main {\n  display: flex;\n  flex-direction: column;\n  overflow: auto;\n  -webkit-overflow-scrolling: touch;\n  flex: 1 1 auto;\n}\n\n.drawer__body {\n  display: block;\n  flex: 1 1 auto;\n  padding: var(--body-spacing);\n  padding-block: 0 var(--body-spacing);\n  padding-inline: var(--body-spacing);\n\n  .drawer:not(.drawer--has-header) & {\n    padding-block-start: var(--body-spacing);\n  }\n}\n\n.drawer__footer {\n  inline-size: 100%;\n  text-align: end;\n  padding: var(--footer-spacing);\n  background: var(--footer-background);\n  inset-block-start: 1px;\n  position: relative;\n\n  ::slotted(button:not(:last-of-type)) {\n    margin-inline-end: #{base.$spacing-xsmall};\n  }\n\n  .drawer:not(.drawer--has-footer) & {\n    display: none;\n  }\n}\n\n.drawer__overlay {\n  display: block;\n  position: fixed;\n  inset: 0;\n  background-color: var(--scrim-color);\n  pointer-events: all;\n  backdrop-filter: blur(#{layer.$layer-overlay-blur});\n  opacity: 0;\n  transition: #{base.$transition-fast} opacity;\n\n  .drawer--open & {\n    opacity: 1;\n  }\n\n  .drawer--contained & {\n    display: none;\n  }\n}\n","import {\n  Component,\n  Element,\n  Event,\n  EventEmitter,\n  Prop,\n  State,\n  Watch,\n  h,\n  ComponentInterface,\n  Method,\n} from '@stencil/core';\nimport Modal from '../../utils/modal';\nimport { lockBodyScrolling, unlockBodyScrolling } from '../../utils/scroll';\nimport { hasSlot } from '../../utils/slot';\nimport { waitForEvent } from '../../utils/events';\nimport {\n  ComponentStore,\n  StorageMethods,\n} from '../../utils/store/component-store';\n\n/**\n * Drawers slide in from a container to expose additional options and information.\n *\n * @slot - The drawer's main content\n * @slot label - The drawer's label. Alternatively, you can use the `label` attribute\n * @slot header-actions - Optional actions to add to the header. Works best with `<nano-icon-button>`\n * @slot footer - The drawer's footer, usually one or more buttons representing various options\n *\n * @part base - The component's base wrapper\n * @part overlay - The overlay that covers the screen behind the drawer\n * @part panel - The drawer's panel (where the drawer and its content are rendered)\n * @part header - The drawer's header. This element wraps the title and header actions\n * @part header-actions - Optional actions to add to the header. Works best with `<nano-icon-button>`\n * @part title - The drawer's title\n * @part close-button - The close button, an `<nano-icon-button>`\n * @part close-button__base - The close button's exported `base` part\n * @part body - The drawer's body\n * @part footer - The drawer's footer\n */\n\n@Component({\n  tag: 'nano-drawer',\n  shadow: true,\n  styleUrl: 'drawer.scss',\n})\nexport class Drawer implements ComponentInterface {\n  // Private State\n\n  @Element() host: HTMLNanoDrawerElement;\n\n  private originalTrigger: HTMLElement | null;\n  private drawer: HTMLElement;\n  private overlay: HTMLElement;\n  private modal: Modal;\n\n  get panel() {\n    return this._panel;\n  }\n  set panel(ele: HTMLElement) {\n    if (this._panel) {\n      this.panel.removeEventListener('animationend', this.handleTransitionEnd);\n    }\n    if (!ele) return;\n\n    ele.addEventListener('transitionend', this.handleTransitionEnd);\n    this._panel = ele;\n  }\n  private _panel: HTMLElement;\n\n  @State() noDismiss = false;\n  @State() hasFooter: boolean;\n\n  // Public API\n\n  /**\n   * Indicates whether or not the drawer is open. You can toggle this attribute to show and hide the drawer, or you can\n   * use the `show()` and `hide()` methods and this attribute will reflect the drawer's open state.\n   */\n  @Prop({ reflect: true }) open = false;\n\n  /**\n   * The drawer's label as displayed in the header. You should always include a relevant label even when using\n   * `no-header`, as it is required for proper accessibility. If you need to display HTML, use the `label` slot instead.\n   */\n  @Prop({ reflect: true }) label!: string;\n\n  /** The direction from which the drawer will open. */\n  @Prop({ reflect: true }) placement: 'top' | 'end' | 'bottom' | 'start' =\n    'end';\n\n  /**\n   * By default, the drawer slides out of its containing block (usually the viewport). To make the drawer slide out of\n   * its parent element, set this attribute and add `position: relative` to the parent.\n   */\n  @Prop({ reflect: true }) contained = false;\n\n  /**\n   * Removes the header. This will also remove the default close button, so please ensure you provide an easy,\n   * accessible way for users to dismiss the drawer.\n   */\n  @Prop({ reflect: true }) noHeader = false;\n\n  /** Store search queries (against this ID) to the component store. Use in conjunction with storeMethod */\n  @Prop() storeId?: string;\n\n  /** The method of storage. Either session storage, url hash (after the '#') or url query (after the '?'). */\n  @Prop() storeMethod: StorageMethods = 'url-hash';\n\n  /** An alternative to `preventDefault()` on the `nanoRequestClose` event. This will hide the close button and disable clicks on the overlay or presses the `Escape` key  */\n  @Prop() noUserDismiss = false;\n\n  /** Relocate the dialog to the root of the DOM. Useful for elements bound via css `transform: ...` */\n  @Prop() hoist = false;\n\n  @Watch('hoist')\n  handleHoistChange() {\n    if (!this.hoist || Array.from(document.body.children).includes(this.host))\n      return;\n    document.body.prepend(this.host);\n  }\n\n  /** Emitted when the drawer opens. */\n  @Event() nanoShow: EventEmitter;\n\n  /** Emitted when the drawer closes. */\n  @Event() nanoHide: EventEmitter;\n\n  /** Emitted after the drawer closes and all animations are complete. */\n  @Event() nanoAfterHide: EventEmitter;\n\n  /** Emitted after the drawer opens and all animations are complete. */\n  @Event() nanoAfterShow: EventEmitter;\n\n  /**\n   * Emitted when the drawer opens and is ready to receive focus. Calling\n   * `event.preventDefault()` will prevent focusing and allow you to set it on a different element, such as an input.\n   */\n  @Event() nanoInitialFocus: EventEmitter;\n\n  /**\n   * Emitted when the user attempts to\n   * close the drawer by clicking the close button, clicking the overlay, or pressing escape. Calling\n   * `event.preventDefault()` will keep the drawer open. Avoid using this unless closing the drawer will result in\n   * destructive behavior such as data loss.\n   */\n  @Event() nanoRquestClose: EventEmitter<{\n    source: 'close-button' | 'keyboard' | 'overlay';\n  }>;\n\n  /** Shows the drawer. */\n  @Method()\n  async show() {\n    if (this.open) return undefined;\n\n    this.open = true;\n    return waitForEvent(this.host, 'nanoAfterShow');\n  }\n\n  /** Hides the drawer */\n  @Method()\n  async hide() {\n    if (!this.open) return undefined;\n\n    this.open = false;\n    return waitForEvent(this.host, 'nanoAfterHide');\n  }\n\n  private requestClose(source: 'close-button' | 'keyboard' | 'overlay') {\n    const nanoRequestClose = this.nanoRquestClose.emit({ source });\n\n    if (nanoRequestClose.defaultPrevented || this.noUserDismiss) {\n      this.noDismiss = true;\n      setTimeout(() => (this.noDismiss = false), 250);\n      return;\n    }\n\n    this.hide();\n  }\n\n  // Prop Change Handlers\n\n  @Watch('contained')\n  handleNoModalChange() {\n    if (this.open && !this.contained) {\n      this.modal.activate();\n      lockBodyScrolling(this.host);\n    }\n\n    if (this.open && this.contained) {\n      this.modal.deactivate();\n      unlockBodyScrolling(this.host);\n    }\n  }\n\n  @Watch('open')\n  async handleOpenChange() {\n    if (this.open) {\n      // Show\n      this.nanoShow.emit();\n      this.addOpenListeners();\n      this.originalTrigger = document.activeElement as HTMLElement;\n\n      // Lock body scrolling only if the drawer isn't contained\n      if (!this.contained) {\n        this.modal.activate();\n        lockBodyScrolling(this.host);\n      }\n\n      // When the drawer is shown, Safari will attempt to set focus on whatever element has autofocus. This causes the\n      // drawer's animation to jitter, so we'll temporarily remove the attribute, call `focus({ preventScroll: true })`\n      // ourselves, and add the attribute back afterwards.\n      const autoFocusTarget = this.host.querySelector('[autofocus]');\n      if (autoFocusTarget) {\n        autoFocusTarget.removeAttribute('autofocus');\n      }\n      this.drawer.hidden = false;\n\n      // Set initial focus\n      requestAnimationFrame(() => {\n        const nanoInitialFocus = this.nanoInitialFocus.emit();\n\n        if (!nanoInitialFocus.defaultPrevented) {\n          // Set focus to the autofocus target and restore the attribute\n          if (autoFocusTarget) {\n            (autoFocusTarget as HTMLInputElement).focus({\n              preventScroll: true,\n            });\n          } else {\n            this.panel.focus({ preventScroll: true });\n          }\n        }\n\n        // Restore the autofocus attribute\n        if (autoFocusTarget) {\n          autoFocusTarget.setAttribute('autofocus', '');\n        }\n      });\n\n      this.nanoAfterShow.emit();\n      return;\n    }\n\n    // Hide\n    this.nanoHide.emit();\n    this.removeOpenListeners();\n\n    if (!this.contained) {\n      this.modal.deactivate();\n      unlockBodyScrolling(this.host);\n    }\n\n    // Restore focus to the original trigger\n    const trigger = this.originalTrigger;\n    if (typeof trigger?.focus === 'function') {\n      setTimeout(() => trigger.focus());\n    }\n  }\n\n  // Event Handling\n\n  private addOpenListeners() {\n    document.addEventListener('keydown', this.handleDocumentKeyDown);\n  }\n\n  private removeOpenListeners() {\n    document.removeEventListener('keydown', this.handleDocumentKeyDown);\n  }\n\n  private handleDocumentKeyDown = (event: KeyboardEvent) => {\n    // Contained drawers aren't modal and don't response to the escape key\n    if (this.contained) {\n      return;\n    }\n\n    if (event.key === 'Escape' && this.modal.isActive() && this.open) {\n      event.stopImmediatePropagation();\n      this.requestClose('keyboard');\n    }\n  };\n\n  private handleTransitionEnd = (event: TransitionEvent) => {\n    if (\n      event.propertyName === 'opacity' &&\n      event\n        .composedPath()\n        .find((node) => node === this.panel || node === this.overlay)\n    ) {\n      if (!this.open) {\n        this.drawer.hidden = true;\n        // Now that the dialog is hidden, restore the overlay and panel for next time\n        this.overlay.hidden = false;\n        this.panel.hidden = false;\n      }\n      this.open ? this.nanoAfterShow.emit() : this.nanoAfterHide.emit();\n    }\n  };\n\n  private handleSlotChange = () => {\n    this.hasFooter = hasSlot(this.host, 'footer');\n  };\n\n  // Component Lifecycle\n\n  connectedCallback() {\n    this.handleHoistChange();\n    this.modal = new Modal(this.host);\n  }\n\n  disconnectedCallback() {\n    unlockBodyScrolling(this.host);\n  }\n\n  componentWillLoad() {\n    this.handleSlotChange();\n    // Show on init if open\n    if (this.open) this.show();\n    if (this.storeId)\n      ComponentStore.init(this, ['open'], this.storeMethod, this.storeId);\n  }\n\n  componentDidLoad() {\n    this.drawer.hidden = !this.open;\n\n    if (this.open) {\n      this.addOpenListeners();\n\n      if (!this.contained) {\n        this.modal.activate();\n        lockBodyScrolling(this.host);\n      }\n    }\n  }\n\n  render() {\n    return (\n      <div\n        ref={(ele) => (this.drawer = ele)}\n        part=\"base\"\n        class={{\n          drawer: true,\n          'drawer--open': this.open,\n          [`drawer--${this.placement}`]: true,\n          'drawer--contained': this.contained,\n          'drawer--fixed': !this.contained,\n          'drawer--has-footer': hasSlot(this.host, 'footer'),\n          'drawer--has-header': !this.noHeader,\n          'drawer--nodismiss': this.noDismiss,\n        }}\n      >\n        <div\n          ref={(ele) => (this.overlay = ele)}\n          part=\"overlay\"\n          class=\"drawer__overlay\"\n          onClick={() => this.requestClose('overlay')}\n          tabindex=\"-1\"\n        />\n\n        <div\n          ref={(ele) => (this.panel = ele)}\n          part=\"panel\"\n          class=\"drawer__panel\"\n          role=\"dialog\"\n          aria-modal=\"true\"\n          aria-hidden={this.open ? 'false' : 'true'}\n          aria-label={this.noHeader ? this.label : undefined}\n          aria-labelledby={!this.noHeader ? 'title' : undefined}\n          tabindex=\"0\"\n        >\n          <div class=\"drawer__main\">\n            {!this.noHeader && (\n              <nano-sticker>\n                <header part=\"header\" class=\"drawer__header\">\n                  <h2 part=\"title\" class=\"drawer__title\" id=\"title\">\n                    {/* If there's no label, use an invisible character to prevent the header from collapsing */}\n                    <slot name=\"label\">\n                      {this.label.length > 0\n                        ? this.label\n                        : String.fromCharCode(65279)}\n                    </slot>\n                  </h2>\n                  <div part=\"header-actions\" class=\"drawer__header-actions\">\n                    <slot name=\"header-actions\" />\n\n                    {!this.noUserDismiss && (\n                      <nano-icon-button\n                        part=\"close-button\"\n                        exportparts=\"base:close-button__base\"\n                        class=\"drawer__close\"\n                        iconName=\"light/times\"\n                        label=\"Close\"\n                        onClick={() => this.requestClose('close-button')}\n                      />\n                    )}\n                  </div>\n                </header>\n              </nano-sticker>\n            )}\n\n            <div part=\"body\" class=\"drawer__body\">\n              <slot />\n            </div>\n\n            <nano-sticker position=\"bottom\">\n              <footer part=\"footer\" class=\"drawer__footer\">\n                <slot name=\"footer\" onSlotchange={this.handleSlotChange} />\n              </footer>\n            </nano-sticker>\n          </div>\n        </div>\n      </div>\n    );\n  }\n}\n"],"mappings":"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"}

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

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

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

@@ -0,0 +1,5 @@
+/*!
+ * Web Components for Nanopore digital Web Apps
+ */
+import{r as t,c as i,h as e,a,g as s}from"./p-f6a8467a.js";import{M as n}from"./p-2234694a.js";import{l as r,u as o}from"./p-d7c34990.js";import{c as l}from"./p-411bb8f1.js";import"./p-f88fa15c.js";import"./p-257432ff.js";const h=":host{box-sizing:border-box}*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}:host{--border-radius:var(--nano-layer-border-radius, var(--nano-border-radius-medium, 4px));--border-color:var(--nano-layer-border-color, rgba(0, 0, 0, 0.1));--border-width:var(--nano-layer-border-width, 1px);--background:var(--nano-layer-bg, #fff);--tint-color:var(--nano-color-base, var(--nano-color-primary, #007495));--icon-size:2rem;--scrim-color:var(--nano-layer-overlay-dark, rgb(74 74 74 / 50%));--close-button-color:#b5aea7;display:block}:host(.nano-color){--tint-color:var(--nano-color-base, var(--nano-color-primary, #007495))}.alert{position:relative;background-color:var(--background);border:solid var(--border-width) var(--border-color);border-block-start-width:4px;border-block-start-color:var(--tint-color);border-radius:var(--border-radius);opacity:0;transform:scale(0.9);transition:var(--nano-transition-medium, 0.5s) opacity ease, var(--nano-transition-fast, 0.3s) transform ease}.alert:focus{outline:none}.alert:not(.alert--showing){position:absolute;inline-size:1px;block-size:1px;clip:rect(0 0 0 0);-webkit-clip-path:inset(50%);clip-path:inset(50%);overflow:hidden;pointer-events:none;visibility:hidden}.alert--open{opacity:1;transform:none}.alert--toasty,.alert--modal{box-shadow:var(--nano-layer-shadow-large, 0 2px 8px rgba(0, 0, 0, 0.2));margin:var(--nano-spacing-medium, 16px)}.alert--modal.alert--nodismiss{animation:cannotClose 0.25s ease-in-out 1}@keyframes cannotClose{0%{transform:scale(1)}50%{transform:scale(1.08)}100%{transform:scale(1)}}.alert__content{display:flex;align-items:stretch}.alert__modal-wrap{position:fixed;display:flex;align-items:center;justify-content:center;inset:0;z-index:var(--nano-layer-index-alert, 800)}.alert__message{flex:1 1 auto;padding:var(--nano-spacing-medium, 16px);overflow:hidden;line-height:1.6}.alert__close{--color:var(--close-button-color);flex:0 0 auto;display:flex;align-items:center;font-size:1.1em;padding-inline:0 var(--nano-spacing-medium, 16px);padding-block:0}.alert__footer{padding:0 var(--nano-spacing-small, 8px) 0;display:flex;flex-direction:row;justify-content:space-around;align-items:center}.alert__footer ::slotted(*){flex:1;margin:0 var(--nano-spacing-small, 8px) var(--nano-spacing-medium, 16px) !important}.alert__overlay{position:fixed;inset:0;background-color:var(--scrim-color);opacity:0;transition:var(--nano-transition-fast, 0.3s) opacity;z-index:var(--nano-layer-index-alert, 800);-webkit-backdrop-filter:blur(var(--nano-layer-overlay-blur, 3px));backdrop-filter:blur(var(--nano-layer-overlay-blur, 3px));pointer-events:all}.alert__overlay--open{opacity:1}.alert__icon{flex:0 0 auto;display:flex;align-items:center;font-size:var(--icon-size)}.alert__icon ::slotted(*){color:var(--tint-color);-webkit-margin-start:var(--nano-spacing-medium, 16px);margin-inline-start:var(--nano-spacing-medium, 16px)}";let c;let d;let f;let u;if(globalThis["document"]){c=Object.assign(document.createElement("div"),{className:"nano-toast-stack nano-toast-stack--tr"});d=Object.assign(document.createElement("div"),{className:"nano-toast-stack nano-toast-stack--tl"});f=Object.assign(document.createElement("div"),{className:"nano-toast-stack nano-toast-stack--bl"});u=Object.assign(document.createElement("div"),{className:"nano-toast-stack nano-toast-stack--br"})}const m=class{constructor(a){t(this,a);this.nanoShow=i(this,"nanoShow",7);this.nanoAfterShow=i(this,"nanoAfterShow",7);this.nanoHide=i(this,"nanoHide",7);this.nanoAfterHide=i(this,"nanoAfterHide",7);this.addedTransEnd=false;this.goingToHide=false;this.goingToShow=false;this.handleMouseMove=()=>{this.restartAutoHide()};this.handleCloseClick=()=>{this.hide()};this.handleTransitionEnd=t=>{if(t.propertyName==="opacity"&&(t.target===this.panel||t.target===this.overlay)){this.host.hidden=!this.open;this.isShowing=this.open;this.open?this.nanoAfterShow.emit():this.nanoAfterHide.emit()}};this.handleButtonClick=t=>{if(t.defaultPrevented)return;if(t.target.tagName&&t.target.tagName.toLowerCase()==="button")this.hide()};this.restartAutoHide=()=>{clearTimeout(this.autoHideTimeout);if(this.open&&this.duration<Infinity){this.autoHideTimeout=setTimeout((()=>this.hide()),this.duration)}};this.Panel=()=>e("div",{ref:t=>this.panel=t,part:"panel",class:{alert:true,"alert--open":this.open,"alert--toasty":this.isToast,"alert--modal":!!this.isModal,"alert--showing":this.isShowing,"alert--nodismiss":this.noDismiss},role:!!this.isModal?"alertdialog":"alert","aria-live":"assertive","aria-atomic":"true","aria-hidden":this.open?"false":"true","aria-modal":!!this.isModal?"true":undefined,"aria-label":this.label?this.label:undefined,onMouseMove:this.handleMouseMove,tabIndex:!!this.isModal?0:undefined},e("div",{class:"alert__content"},e("div",{part:"icon",class:"alert__icon"},e("slot",{name:"icon"})),e("div",{part:"message",class:"alert__message"},e("slot",null)),this.closable&&e("div",{class:"alert__close"},e("nano-icon-button",{class:"alert__close",iconName:"light/times",label:"close menu",onClick:this.handleCloseClick}))),e("div",{class:"alert__footer"},e("slot",{name:"footer"})));this.isModal=false;this.isToast=false;this.isShowing=false;this.label=undefined;this.noDismiss=false;this.open=false;this.closable=false;this.color=undefined;this.duration=Infinity;this.hoist=false}handleOpenChange(){this.open?this.show():this.hide()}handleDurationChange(){this.restartAutoHide()}handleHoistChange(){if(!this.hoist||document.body.children[0]===this.host)return;document.body.prepend(this.host)}async show(){if(this.goingToShow){return}const t=this.nanoShow.emit();if(t.defaultPrevented){this.open=false;return false}this.host.hidden=false;this.goingToShow=true;this.open=true;requestAnimationFrame((()=>{this.isShowing=true;this.goingToShow=false}));if(this.duration<Infinity){clearTimeout(this.autoHideTimeout);this.autoHideTimeout=setTimeout((()=>this.hide()),this.duration)}}async hide(){if(this.goingToHide){return}const t=this.nanoHide.emit();if(t.defaultPrevented){this.open=true;return false}this.goingToHide=true;this.open=false;requestAnimationFrame((()=>this.goingToHide=false));clearTimeout(this.autoHideTimeout)}async toast(t="tr"){this.isToast=true;return new Promise((i=>{let e;switch(t){case"tl":e=d;break;case"bl":e=f;break;case"br":e=u;break;default:e=c;break}if(!e.parentElement){document.body.appendChild(e)}e.appendChild(this.host);this.connectedCallback();this.show();const a=()=>{this.host.remove();this.isToast=false;i();if(!e.querySelector("nano-alert")){e.remove()}};this.host.addEventListener("nanoAfterHide",a,{once:true});this.host.addEventListener("nano-after-hide",a,{once:true})}))}async alert(t){this.isModal=true;this.label=t;return new Promise((t=>{if(!document.body.contains(this.host)){document.body.appendChild(this.host)}this.modal.activate();r(this.host);this.originalTrigger=document.activeElement;requestAnimationFrame((()=>{this.show()}));const i=()=>requestAnimationFrame((()=>this.panel.focus({preventScroll:true})));const e=()=>{this.modal.deactivate();this.host.remove();this.label=undefined;this.isModal=false;t();if(this.originalTrigger&&typeof this.originalTrigger.focus==="function"){setTimeout((()=>this.originalTrigger.focus()))}};this.host.addEventListener("nanoAfterShow",i,{once:true});this.host.addEventListener("nano-after-show",i,{once:true});this.host.addEventListener("nanoAfterHide",e,{once:true});this.host.addEventListener("nano-after-hide",e,{once:true})}))}connectedCallback(){this.modal=new n(this.host);this.handleHoistChange();this.host.addEventListener("click",this.handleButtonClick);if(this.panel){this.addedTransEnd=true;this.panel.addEventListener("transitionend",this.handleTransitionEnd)}}disconnectedCallback(){o(this.host);this.host.removeEventListener("click",this.handleButtonClick);this.addedTransEnd=false;if(this.panel)this.panel.removeEventListener("transitionend",this.handleTransitionEnd)}componentDidLoad(){if(this.open){this.show()}if(!this.addedTransEnd){this.panel.addEventListener("transitionend",this.handleTransitionEnd)}}render(){return e(a,{class:Object.assign({},l(this.color)),showing:this.isShowing},this.isModal&&[e("div",{part:"overlay",class:{alert__overlay:true,"alert__overlay--open":this.open},ref:t=>this.overlay=t}),e("div",{class:"alert__modal-wrap",onClick:t=>{if(!t.target.classList.contains("alert__modal-wrap"))return;this.noDismiss=true;setTimeout((()=>this.noDismiss=false),250)}},e(this.Panel,null))],!this.isModal&&e(this.Panel,null))}get host(){return s(this)}static get watchers(){return{open:["handleOpenChange"],duration:["handleDurationChange"],hoist:["handleHoistChange"]}}};m.style=h;export{m as nano_alert};
+//# sourceMappingURL=p-bdb5b6fc.entry.js.map

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

@@ -0,0 +1 @@
+{"version":3,"names":["alertCss","toastStackTr","toastStackTl","toastStackBl","toastStackBr","globalThis","Object","assign","document","createElement","className","Alert","this","addedTransEnd","goingToHide","goingToShow","handleMouseMove","restartAutoHide","handleCloseClick","hide","handleTransitionEnd","event","propertyName","target","panel","overlay","host","hidden","open","isShowing","nanoAfterShow","emit","nanoAfterHide","handleButtonClick","e","defaultPrevented","tagName","toLowerCase","clearTimeout","autoHideTimeout","duration","Infinity","setTimeout","Panel","h","ref","el","part","class","alert","isToast","isModal","noDismiss","role","undefined","label","onMouseMove","tabIndex","name","closable","iconName","onClick","handleOpenChange","show","handleDurationChange","handleHoistChange","hoist","body","children","prepend","async","nanoShow","requestAnimationFrame","nanoHide","position","Promise","resolve","toastStack","parentElement","appendChild","connectedCallback","onClose","remove","querySelector","addEventListener","once","contains","modal","activate","lockBodyScrolling","originalTrigger","activeElement","onOpen","focus","preventScroll","deactivate","Modal","disconnectedCallback","unlockBodyScrolling","removeEventListener","componentDidLoad","render","Host","createColorClasses","color","showing","alert__overlay","div","classList"],"sources":["./src/components/alert/alert.scss?tag=nano-alert&encapsulation=shadow","./src/components/alert/alert.tsx"],"sourcesContent":["@use 'sass:map';\n@use 'sass:list';\n\n@import '../../global/style/nano-theme/base';\n@import '../../global/style/nano-theme/colours';\n@import '../../global/style/nano-theme/layers';\n\n:host {\n  /**\n   * @prop --border-radius: defaults to #{$layer-border-radius};\n   * @prop --border-color: defaults to #{$layer-border-color};\n   * @prop --border-width: defaults to #{$layer-border-width};\n   * @prop --background: defaults to #{$layer-bg-color};\n   * @prop --tint-color: defaults to var(--nano-color-base, #{nano-color(primary, base)});\n   * @prop --icon-size: defaults to 1.5rem;\n   * @prop --scrim-color: overlay colour of alert display. Defaults to #{$layer-overlay-dark};\n   * @prop --close-button-color: defaults to #{map.get($colors, mediumgrey)} ;\n   */\n\n  --border-radius: #{$layer-border-radius};\n  --border-color: #{$layer-border-color};\n  --border-width: #{$layer-border-width};\n  --background: #{$layer-bg-color};\n  --tint-color: var(--nano-color-base, #{nano-color(primary, base)});\n  --icon-size: 2rem;\n  --scrim-color: #{$layer-overlay-dark};\n  --close-button-color: #{map.get($colors, palegrey)};\n\n  display: block;\n}\n\n:host(.nano-color) {\n  --tint-color: var(--nano-color-base, #{nano-color(primary, base)});\n}\n\n.alert {\n  position: relative;\n  background-color: var(--background);\n  border: solid var(--border-width) var(--border-color);\n  border-block-start-width: 4px;\n  border-block-start-color: var(--tint-color);\n  border-radius: var(--border-radius);\n  opacity: 0;\n  transform: scale(0.9);\n  transition:\n    #{$transition-medium} opacity ease,\n    #{$transition-fast} transform ease;\n\n  &:focus {\n    outline: none;\n  }\n\n  &:not(.alert--showing) {\n    @include hidden;\n  }\n\n  &--open {\n    opacity: 1;\n    transform: none;\n  }\n\n  &--toasty,\n  &--modal {\n    box-shadow: #{$layer-shadow-large};\n    margin: #{$spacing-medium};\n  }\n\n  &--modal {\n    &.alert--nodismiss {\n      animation: cannotClose 0.25s ease-in-out 1;\n\n      @keyframes cannotClose {\n        0% {\n          transform: scale(1);\n        }\n\n        50% {\n          transform: scale(1.08);\n        }\n\n        100% {\n          transform: scale(1);\n        }\n      }\n    }\n  }\n}\n\n.alert__content {\n  display: flex;\n  align-items: stretch;\n}\n\n.alert__modal-wrap {\n  position: fixed;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  inset: 0;\n  z-index: #{$layer-index-alert};\n}\n\n.alert__message {\n  flex: 1 1 auto;\n  padding: #{$spacing-medium};\n  overflow: hidden;\n  line-height: 1.6;\n}\n\n.alert__close {\n  --color: var(--close-button-color);\n\n  flex: 0 0 auto;\n  display: flex;\n  align-items: center;\n  font-size: 1.1em;\n  padding-inline: 0 #{$spacing-medium};\n  padding-block: 0;\n}\n\n.alert__footer {\n  padding: 0 #{$spacing-small} 0;\n  display: flex;\n  flex-direction: row;\n  justify-content: space-around;\n  align-items: center;\n\n  ::slotted(*) {\n    flex: 1;\n    margin: 0 #{$spacing-small} #{$spacing-medium} !important;\n  }\n}\n\n.alert__overlay {\n  position: fixed;\n  inset: 0;\n  background-color: var(--scrim-color);\n  opacity: 0;\n  transition: #{$transition-fast} opacity;\n  z-index: #{$layer-index-alert};\n  backdrop-filter: blur(#{$layer-overlay-blur});\n  pointer-events: all;\n\n  &--open {\n    opacity: 1;\n  }\n}\n\n.alert__icon {\n  flex: 0 0 auto;\n  display: flex;\n  align-items: center;\n  font-size: var(--icon-size);\n\n  ::slotted(*) {\n    color: var(--tint-color);\n    margin-inline-start: #{$spacing-medium};\n  }\n}\n","import {\n  Component,\n  ComponentInterface,\n  Element,\n  Event,\n  EventEmitter,\n  Method,\n  Prop,\n  State,\n  Watch,\n  h,\n  Host,\n  VNode,\n} from '@stencil/core';\nimport Modal from '../../utils/modal';\nimport { lockBodyScrolling, unlockBodyScrolling } from '../../utils/scroll';\nimport { createColorClasses } from '../../utils/theme';\nimport type { Color } from '../../interface';\n\nlet toastStackTr: HTMLElement;\nlet toastStackTl: HTMLElement;\nlet toastStackBl: HTMLElement;\nlet toastStackBr: HTMLElement;\n\nif (globalThis['document']) {\n  toastStackTr = Object.assign(document.createElement('div'), {\n    className: 'nano-toast-stack nano-toast-stack--tr',\n  });\n  toastStackTl = Object.assign(document.createElement('div'), {\n    className: 'nano-toast-stack nano-toast-stack--tl',\n  });\n  toastStackBl = Object.assign(document.createElement('div'), {\n    className: 'nano-toast-stack nano-toast-stack--bl',\n  });\n  toastStackBr = Object.assign(document.createElement('div'), {\n    className: 'nano-toast-stack nano-toast-stack--br',\n  });\n}\n\n/**\n * Alerts are used to display important messages either inline, as toast notifications or as modals requiring action.\n * @slot - The alert's content.\n * @slot icon - An icon to show in the alert.\n * @slot footer - Place items at the bottom of the alert. Best used with `button` elements - esp when used as with the `alert()` method.\n */\n@Component({\n  tag: 'nano-alert',\n  styleUrl: 'alert.scss',\n  shadow: true,\n})\nexport class Alert implements ComponentInterface {\n  private autoHideTimeout: ReturnType<typeof setTimeout>;\n  private panel: HTMLElement;\n  private overlay: HTMLElement;\n  private modal: Modal;\n  private originalTrigger: HTMLElement | null;\n  private addedTransEnd = false;\n  private goingToHide = false;\n  private goingToShow = false;\n\n  @State() isModal = false;\n  @State() isToast = false;\n  @State() isShowing = false;\n  @State() label: string;\n  @State() noDismiss = false;\n\n  @Element() host: HTMLNanoAlertElement;\n\n  /** Indicates whether or not the alert is open. You can use this in lieu of the show/hide methods. */\n  @Prop({ mutable: true, reflect: true }) open = false;\n\n  @Watch('open')\n  handleOpenChange() {\n    this.open ? this.show() : this.hide();\n  }\n\n  /** Set to true to make the alert closable. */\n  @Prop({ reflect: true }) closable = false;\n\n  /** The color to use from the application's color palette. */\n  @Prop({ reflect: true }) color?: Color;\n\n  /**\n   * The length of time, in milliseconds, the alert will show before closing itself. If the user interacts with the\n   * alert before it closes (e.g. moves the mouse over it), the timer will restart.\n   */\n  @Prop() duration = Infinity;\n\n  @Watch('duration')\n  handleDurationChange() {\n    this.restartAutoHide();\n  }\n\n  /**\n   * Relocate the dialog to the root of the DOM.\n   * Most useful in conjunction with `alert()` when parental elements\n   * have css stacking constraints which don't allow for `position: fixed`\n   */\n  @Prop() hoist = false;\n\n  @Watch('hoist')\n  handleHoistChange() {\n    if (!this.hoist || document.body.children[0] === this.host) return;\n    document.body.prepend(this.host);\n  }\n\n  /** Emitted when the alert opens. Calling `event.preventDefault()` will prevent it from being opened. */\n  @Event() nanoShow: EventEmitter;\n\n  /** Emitted after the alert opens and all transitions are complete. */\n  @Event() nanoAfterShow: EventEmitter;\n\n  /** Emitted when the alert closes. Calling `event.preventDefault()` will prevent it from being closed. */\n  @Event() nanoHide: EventEmitter;\n\n  /** Emitted after the alert closes and all transitions are complete. */\n  @Event() nanoAfterHide: EventEmitter;\n\n  /** Shows the alert. */\n  @Method()\n  async show() {\n    if (this.goingToShow) {\n      return;\n    }\n    const nanoShow = this.nanoShow.emit();\n    if (nanoShow.defaultPrevented) {\n      this.open = false;\n      return false;\n    }\n\n    this.host.hidden = false;\n    this.goingToShow = true;\n    this.open = true;\n    requestAnimationFrame(() => {\n      this.isShowing = true;\n      this.goingToShow = false;\n    });\n\n    if (this.duration < Infinity) {\n      clearTimeout(this.autoHideTimeout);\n      this.autoHideTimeout = setTimeout(() => this.hide(), this.duration);\n    }\n  }\n\n  /** Hides the alert */\n  @Method()\n  async hide() {\n    if (this.goingToHide) {\n      return;\n    }\n    const nanoHide = this.nanoHide.emit();\n\n    if (nanoHide.defaultPrevented) {\n      this.open = true;\n      return false;\n    }\n    this.goingToHide = true;\n    this.open = false;\n\n    requestAnimationFrame(() => (this.goingToHide = false));\n    clearTimeout(this.autoHideTimeout);\n  }\n\n  /**\n   * Displays the alert as a toast notification. This will move the alert out of its position in the DOM and, when\n   * dismissed, it will be removed from the DOM completely. By storing a reference to the alert, you can reuse it by\n   * calling this method again. The returned promise will resolve after the alert is hidden.\n   *\n   * @param position options are tr (top-right - default), tl (top-left), br (bottom-right), bl (bottom-left)\n   * @returns a promise which will resolve after the alert has hidden\n   */\n  @Method()\n  async toast(position: 'tr' | 'tl' | 'bl' | 'br' = 'tr') {\n    this.isToast = true;\n    return new Promise<void>((resolve) => {\n      let toastStack: HTMLElement;\n      switch (position) {\n        case 'tl':\n          toastStack = toastStackTl;\n          break;\n        case 'bl':\n          toastStack = toastStackBl;\n          break;\n        case 'br':\n          toastStack = toastStackBr;\n          break;\n        default:\n          toastStack = toastStackTr;\n          break;\n      }\n\n      if (!toastStack.parentElement) {\n        document.body.appendChild(toastStack);\n      }\n\n      toastStack.appendChild(this.host);\n      this.connectedCallback();\n      this.show();\n\n      const onClose = () => {\n        this.host.remove();\n        this.isToast = false;\n        resolve();\n\n        // Remove the toast stack from the DOM when there are no more alerts\n        if (!toastStack.querySelector('nano-alert')) {\n          toastStack.remove();\n        }\n      };\n\n      this.host.addEventListener('nanoAfterHide', onClose, { once: true });\n      this.host.addEventListener('nano-after-hide', onClose, { once: true });\n    });\n  }\n\n  /**\n   * Displays the alert as a dialog / modal - more akin to a traditional js alert().\n   * @param label a label for assistive technology\n   */\n  @Method()\n  async alert(label: string) {\n    this.isModal = true;\n    this.label = label;\n\n    return new Promise<void>((resolve) => {\n      if (!document.body.contains(this.host)) {\n        document.body.appendChild(this.host);\n      }\n\n      this.modal.activate();\n      lockBodyScrolling(this.host);\n      this.originalTrigger = document.activeElement as HTMLElement;\n\n      requestAnimationFrame(() => {\n        this.show();\n      });\n\n      const onOpen = () =>\n        requestAnimationFrame(() => this.panel.focus({ preventScroll: true }));\n\n      const onClose = () => {\n        this.modal.deactivate();\n        this.host.remove();\n        this.label = undefined;\n        this.isModal = false;\n        resolve();\n\n        // Restore focus to the original trigger\n        if (\n          this.originalTrigger &&\n          typeof this.originalTrigger.focus === 'function'\n        ) {\n          setTimeout(() => this.originalTrigger.focus());\n        }\n      };\n\n      this.host.addEventListener('nanoAfterShow', onOpen, { once: true });\n      this.host.addEventListener('nano-after-show', onOpen, { once: true });\n\n      this.host.addEventListener('nanoAfterHide', onClose, {\n        once: true,\n      });\n      this.host.addEventListener('nano-after-hide', onClose, {\n        once: true,\n      });\n    });\n  }\n\n  private handleMouseMove = () => {\n    this.restartAutoHide();\n  };\n\n  private handleCloseClick = () => {\n    this.hide();\n  };\n\n  private handleTransitionEnd = (event: TransitionEvent) => {\n    if (\n      event.propertyName === 'opacity' &&\n      (event.target === this.panel || event.target === this.overlay)\n    ) {\n      this.host.hidden = !this.open;\n      this.isShowing = this.open;\n      this.open ? this.nanoAfterShow.emit() : this.nanoAfterHide.emit();\n    }\n  };\n\n  private handleButtonClick = (e: PointerEvent & { target: HTMLElement }) => {\n    if (e.defaultPrevented) return;\n    if (e.target.tagName && e.target.tagName.toLowerCase() === 'button')\n      this.hide();\n  };\n\n  private restartAutoHide = () => {\n    clearTimeout(this.autoHideTimeout);\n    if (this.open && this.duration < Infinity) {\n      this.autoHideTimeout = setTimeout(() => this.hide(), this.duration);\n    }\n  };\n\n  connectedCallback() {\n    this.modal = new Modal(this.host);\n    this.handleHoistChange();\n    this.host.addEventListener('click', this.handleButtonClick);\n\n    if (this.panel) {\n      this.addedTransEnd = true;\n      this.panel.addEventListener('transitionend', this.handleTransitionEnd);\n    }\n  }\n\n  disconnectedCallback() {\n    unlockBodyScrolling(this.host);\n    this.host.removeEventListener('click', this.handleButtonClick);\n\n    this.addedTransEnd = false;\n    if (this.panel)\n      this.panel.removeEventListener('transitionend', this.handleTransitionEnd);\n  }\n\n  componentDidLoad() {\n    // Show on init if open\n    if (this.open) {\n      this.show();\n    }\n    if (!this.addedTransEnd) {\n      this.panel.addEventListener('transitionend', this.handleTransitionEnd);\n    }\n  }\n\n  private Panel = (): VNode => {\n    return (\n      <div\n        ref={(el) => (this.panel = el)}\n        part=\"panel\"\n        class={{\n          alert: true,\n          'alert--open': this.open,\n          'alert--toasty': this.isToast,\n          'alert--modal': !!this.isModal,\n          'alert--showing': this.isShowing,\n          'alert--nodismiss': this.noDismiss,\n        }}\n        role={!!this.isModal ? 'alertdialog' : 'alert'}\n        aria-live=\"assertive\"\n        aria-atomic=\"true\"\n        aria-hidden={this.open ? 'false' : 'true'}\n        aria-modal={!!this.isModal ? 'true' : undefined}\n        aria-label={this.label ? this.label : undefined}\n        onMouseMove={this.handleMouseMove}\n        tabIndex={!!this.isModal ? 0 : undefined}\n      >\n        <div class=\"alert__content\">\n          <div part=\"icon\" class=\"alert__icon\">\n            <slot name=\"icon\" />\n          </div>\n          <div part=\"message\" class=\"alert__message\">\n            <slot />\n          </div>\n          {this.closable && (\n            <div class=\"alert__close\">\n              <nano-icon-button\n                class=\"alert__close\"\n                iconName=\"light/times\"\n                label=\"close menu\"\n                onClick={this.handleCloseClick}\n              ></nano-icon-button>\n            </div>\n          )}\n        </div>\n        <div class=\"alert__footer\">\n          <slot name=\"footer\" />\n        </div>\n      </div>\n    );\n  };\n\n  render() {\n    return (\n      <Host\n        class={{ ...createColorClasses(this.color) }}\n        showing={this.isShowing}\n      >\n        {this.isModal && [\n          <div\n            part=\"overlay\"\n            class={{\n              alert__overlay: true,\n              'alert__overlay--open': this.open,\n            }}\n            ref={(div) => (this.overlay = div)}\n          />,\n          <div\n            class=\"alert__modal-wrap\"\n            onClick={(e: MouseEvent & { target: HTMLElement }) => {\n              if (!e.target.classList.contains('alert__modal-wrap')) return;\n              this.noDismiss = true;\n              setTimeout(() => (this.noDismiss = false), 250);\n            }}\n          >\n            <this.Panel />\n          </div>,\n        ]}\n        {!this.isModal && <this.Panel />}\n      </Host>\n    );\n  }\n}\n"],"mappings":"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"}

package/dist/nano-components/p-cad86fb8.js

@@ -0,0 +1,5 @@
+/*!
+ * Web Components for Nanopore digital Web Apps
+ */
+function e(e){const t=`algoliasearch-client-js-${e.key}`;let r;const n=()=>{if(r===undefined){r=e.localStorage||window.localStorage}return r};const s=()=>JSON.parse(n().getItem(t)||"{}");return{get(e,t,r={miss:()=>Promise.resolve()}){return Promise.resolve().then((()=>{const r=JSON.stringify(e);const n=s()[r];return Promise.all([n||t(),n!==undefined])})).then((([e,t])=>Promise.all([e,t||r.miss(e)]))).then((([e])=>e))},set(e,r){return Promise.resolve().then((()=>{const o=s();o[JSON.stringify(e)]=r;n().setItem(t,JSON.stringify(o));return r}))},delete(e){return Promise.resolve().then((()=>{const r=s();delete r[JSON.stringify(e)];n().setItem(t,JSON.stringify(r))}))},clear(){return Promise.resolve().then((()=>{n().removeItem(t)}))}}}function t(e){const n=[...e.caches];const s=n.shift();if(s===undefined){return r()}return{get(e,r,o={miss:()=>Promise.resolve()}){return s.get(e,r,o).catch((()=>t({caches:n}).get(e,r,o)))},set(e,r){return s.set(e,r).catch((()=>t({caches:n}).set(e,r)))},delete(e){return s.delete(e).catch((()=>t({caches:n}).delete(e)))},clear(){return s.clear().catch((()=>t({caches:n}).clear()))}}}function r(){return{get(e,t,r={miss:()=>Promise.resolve()}){const n=t();return n.then((e=>Promise.all([e,r.miss(e)]))).then((([e])=>e))},set(e,t){return Promise.resolve(t)},delete(e){return Promise.resolve()},clear(){return Promise.resolve()}}}function n(e={serializable:true}){let t={};return{get(r,n,s={miss:()=>Promise.resolve()}){const o=JSON.stringify(r);if(o in t){return Promise.resolve(e.serializable?JSON.parse(t[o]):t[o])}const c=n();const u=s&&s.miss||(()=>Promise.resolve());return c.then((e=>u(e))).then((()=>c))},set(r,n){t[JSON.stringify(r)]=e.serializable?JSON.stringify(n):n;return Promise.resolve(n)},delete(e){delete t[JSON.stringify(e)];return Promise.resolve()},clear(){t={};return Promise.resolve()}}}function s(e,t,r){const n={"x-algolia-api-key":r,"x-algolia-application-id":t};return{headers(){return e===i.WithinHeaders?n:{}},queryParameters(){return e===i.WithinQueryParameters?n:{}}}}function o(e){let t=e.length-1;for(t;t>0;t--){const r=Math.floor(Math.random()*(t+1));const n=e[t];e[t]=e[r];e[r]=n}return e}function c(e,t){if(!t){return e}Object.keys(t).forEach((r=>{e[r]=t[r](e)}));return e}function u(e,...t){let r=0;return e.replace(/%s/g,(()=>encodeURIComponent(t[r++])))}const a="4.14.3";const i={WithinQueryParameters:0,WithinHeaders:1};function l(e,t){const r=e||{};const n=r.data||{};Object.keys(r).forEach((e=>{if(["timeout","headers","queryParameters","data","cacheable"].indexOf(e)===-1){n[e]=r[e]}}));return{data:Object.entries(n).length>0?n:undefined,timeout:r.timeout||t,headers:r.headers||{},queryParameters:r.queryParameters||{},cacheable:r.cacheable}}const m={Read:1,Write:2,Any:3};const d={Up:1,Down:2,Timeouted:3};const f=2*60*1e3;function h(e,t=d.Up){return{...e,status:t,lastUpdate:Date.now()}}function p(e){return e.status===d.Up||Date.now()-e.lastUpdate>f}function P(e){return e.status===d.Timeouted&&Date.now()-e.lastUpdate<=f}function g(e){if(typeof e==="string"){return{protocol:"https",url:e,accept:m.Any}}return{protocol:e.protocol||"https",url:e.url,accept:e.accept||m.Any}}const y={Delete:"DELETE",Get:"GET",Post:"POST",Put:"PUT"};function O(e,t){return Promise.all(t.map((t=>e.get(t,(()=>Promise.resolve(h(t))))))).then((e=>{const r=e.filter((e=>p(e)));const n=e.filter((e=>P(e)));const s=[...r,...n];const o=s.length>0?s.map((e=>g(e))):t;return{getTimeout(e,t){const r=n.length===0&&e===0?1:n.length+3+e;return r*t},statelessHosts:o}}))}const q=({isTimedOut:e,status:t})=>!e&&~~t===0;const b=e=>{const t=e.status;const r=e.isTimedOut;return r||q(e)||~~(t/100)!==2&&~~(t/100)!==4};const S=({status:e})=>~~(e/100)===2;const T=(e,t)=>{if(b(e)){return t.onRetry(e)}if(S(e)){return t.onSuccess(e)}return t.onFail(e)};function N(e,t,r,n){const s=[];const o=A(r,n);const c=F(e,n);const u=r.method;const a=r.method!==y.Get?{}:{...r.data,...n.data};const i={"x-algolia-agent":e.userAgent.value,...e.queryParameters,...a,...n.queryParameters};let l=0;const m=(t,a)=>{const f=t.pop();if(f===undefined){throw I(D(s))}const p={data:o,headers:c,method:u,url:C(f,r.path,i),connectTimeout:a(l,e.timeouts.connect),responseTimeout:a(l,n.timeout)};const P=e=>{const r={request:p,response:e,host:f,triesLeft:t.length};s.push(r);return r};const g={onSuccess:e=>J(e),onRetry(r){const n=P(r);if(r.isTimedOut){l++}return Promise.all([e.logger.info("Retryable failure",E(n)),e.hostsCache.set(f,h(f,r.isTimedOut?d.Timeouted:d.Down))]).then((()=>m(t,a)))},onFail(e){P(e);throw j(e,D(s))}};return e.requester.send(p).then((e=>T(e,g)))};return O(e.hostsCache,t).then((e=>m([...e.statelessHosts].reverse(),e.getTimeout)))}function $(e){const{hostsCache:t,logger:r,requester:n,requestsCache:s,responsesCache:o,timeouts:c,userAgent:u,hosts:a,queryParameters:i,headers:d}=e;const f={hostsCache:t,logger:r,requester:n,requestsCache:s,responsesCache:o,timeouts:c,userAgent:u,headers:d,queryParameters:i,hosts:a.map((e=>g(e))),read(e,t){const r=l(t,f.timeouts.read);const n=()=>N(f,f.hosts.filter((e=>(e.accept&m.Read)!==0)),e,r);const s=r.cacheable!==undefined?r.cacheable:e.cacheable;if(s!==true){return n()}const o={request:e,mappedRequestOptions:r,transporter:{queryParameters:f.queryParameters,headers:f.headers}};return f.responsesCache.get(o,(()=>f.requestsCache.get(o,(()=>f.requestsCache.set(o,n()).then((e=>Promise.all([f.requestsCache.delete(o),e])),(e=>Promise.all([f.requestsCache.delete(o),Promise.reject(e)]))).then((([e,t])=>t))))),{miss:e=>f.responsesCache.set(o,e)})},write(e,t){return N(f,f.hosts.filter((e=>(e.accept&m.Write)!==0)),e,l(t,f.timeouts.write))}};return f}function w(e){const t={value:`Algolia for JavaScript (${e})`,add(e){const r=`; ${e.segment}${e.version!==undefined?` (${e.version})`:""}`;if(t.value.indexOf(r)===-1){t.value=`${t.value}${r}`}return t}};return t}function J(e){try{return JSON.parse(e.content)}catch(t){throw k(t.message,e)}}function j({content:e,status:t},r){let n=e;try{n=JSON.parse(e).message}catch(e){}return R(n,t,r)}function C(e,t,r){const n=x(r);let s=`${e.protocol}://${e.url}/${t.charAt(0)==="/"?t.substr(1):t}`;if(n.length){s+=`?${n}`}return s}function x(e){const t=e=>Object.prototype.toString.call(e)==="[object Object]"||Object.prototype.toString.call(e)==="[object Array]";return Object.keys(e).map((r=>u("%s=%s",r,t(e[r])?JSON.stringify(e[r]):e[r]))).join("&")}function A(e,t){if(e.method===y.Get||e.data===undefined&&t.data===undefined){return undefined}const r=Array.isArray(e.data)?e.data:{...e.data,...t.data};return JSON.stringify(r)}function F(e,t){const r={...e.headers,...t.headers};const n={};Object.keys(r).forEach((e=>{const t=r[e];n[e.toLowerCase()]=t}));return n}function D(e){return e.map((e=>E(e)))}function E(e){const t=e.request.headers["x-algolia-api-key"]?{"x-algolia-api-key":"*****"}:{};return{...e,request:{...e.request,headers:{...e.request.headers,...t}}}}function R(e,t,r){return{name:"ApiError",message:e,status:t,transporterStackTrace:r}}function k(e,t){return{name:"DeserializationError",message:e,response:t}}function I(e){return{name:"RetryError",message:"Unreachable hosts - your application id may be incorrect. If the error persists, contact support@algolia.com.",transporterStackTrace:e}}const U=e=>{const t=e.appId;const r=s(e.authMode!==undefined?e.authMode:i.WithinHeaders,t,e.apiKey);const n=$({hosts:[{url:`${t}-dsn.algolia.net`,accept:m.Read},{url:`${t}.algolia.net`,accept:m.Write}].concat(o([{url:`${t}-1.algolianet.com`},{url:`${t}-2.algolianet.com`},{url:`${t}-3.algolianet.com`}])),...e,headers:{...r.headers(),...{"content-type":"application/x-www-form-urlencoded"},...e.headers},queryParameters:{...r.queryParameters(),...e.queryParameters}});const u={transporter:n,appId:t,addAlgoliaAgent(e,t){n.userAgent.add({segment:e,version:t})},clearCache(){return Promise.all([n.requestsCache.clear(),n.responsesCache.clear()]).then((()=>undefined))}};return c(u,e.methods)};const v=e=>(t,r)=>{if(t.method===y.Get){return e.transporter.read(t,r)}return e.transporter.write(t,r)};const L=e=>(t,r={})=>{const n={transporter:e.transporter,appId:e.appId,indexName:t};return c(n,r.methods)};const M=e=>(t,r)=>{const n=t.map((e=>({...e,params:x(e.params||{})})));return e.transporter.read({method:y.Post,path:"1/indexes/*/queries",data:{requests:n},cacheable:true},r)};const Q=e=>(t,r)=>Promise.all(t.map((t=>{const{facetName:n,facetQuery:s,...o}=t.params;return L(e)(t.indexName,{methods:{searchForFacetValues:H}}).searchForFacetValues(n,s,{...r,...o})})));const V=e=>(t,r,n)=>e.transporter.read({method:y.Post,path:u("1/answers/%s/prediction",e.indexName),data:{query:t,queryLanguages:r},cacheable:true},n);const z=e=>(t,r)=>e.transporter.read({method:y.Post,path:u("1/indexes/%s/query",e.indexName),data:{query:t},cacheable:true},r);const H=e=>(t,r,n)=>e.transporter.read({method:y.Post,path:u("1/indexes/%s/facets/%s/query",e.indexName,t),data:{facetQuery:r},cacheable:true},n);const W={Debug:1,Info:2,Error:3};function G(e){return{debug(t,r){if(W.Debug>=e){console.debug(t,r)}return Promise.resolve()},info(t,r){if(W.Info>=e){console.info(t,r)}return Promise.resolve()},error(e,t){console.error(e,t);return Promise.resolve()}}}function B(){return{send(e){return new Promise((t=>{const r=new XMLHttpRequest;r.open(e.method,e.url,true);Object.keys(e.headers).forEach((t=>r.setRequestHeader(t,e.headers[t])));const n=(e,n)=>setTimeout((()=>{r.abort();t({status:0,content:n,isTimedOut:true})}),e*1e3);const s=n(e.connectTimeout,"Connection timeout");let o;r.onreadystatechange=()=>{if(r.readyState>r.OPENED&&o===undefined){clearTimeout(s);o=n(e.responseTimeout,"Socket timeout")}};r.onerror=()=>{if(r.status===0){clearTimeout(s);clearTimeout(o);t({content:r.responseText||"Network request failed",status:r.status,isTimedOut:false})}};r.onload=()=>{clearTimeout(s);clearTimeout(o);t({content:r.responseText,status:r.status,isTimedOut:false})};r.send(e.data)}))}}}function K(r,s,o){const c={appId:r,apiKey:s,timeouts:{connect:1,read:2,write:30},requester:B(),logger:G(W.Error),responsesCache:n(),requestsCache:n({serializable:false}),hostsCache:t({caches:[e({key:`${a}-${r}`}),n()]}),userAgent:w(a).add({segment:"Browser",version:"lite"}),authMode:i.WithinQueryParameters};return U({...c,...o,methods:{search:M,searchForFacetValues:Q,multipleQueries:M,multipleSearchForFacetValues:Q,customRequest:v,initIndex:e=>t=>L(e)(t,{methods:{search:z,searchForFacetValues:H,findAnswers:V}})}})}K.version=a;export{K as a};
+//# sourceMappingURL=p-cad86fb8.js.map