@nanoporetech-digital/components 5.9.4 → 5.9.6
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +25 -0
- package/dist/cjs/{dom-7acf7afd.js → dom-1d35ea4d.js} +2 -2
- package/dist/cjs/{dom-7acf7afd.js.map → dom-1d35ea4d.js.map} +1 -1
- package/dist/cjs/nano-accordion.cjs.entry.js +1 -1
- package/dist/cjs/nano-alert.cjs.entry.js +2 -2
- package/dist/cjs/nano-algolia-pagination.cjs.entry.js +1 -1
- package/dist/cjs/nano-algolia-pagination.cjs.entry.js.map +1 -1
- package/dist/cjs/nano-algolia.cjs.entry.js +1 -1
- package/dist/cjs/nano-datalist_3.cjs.entry.js +1 -1
- package/dist/cjs/nano-details.cjs.entry.js +1 -1
- package/dist/cjs/nano-dialog.cjs.entry.js +2 -2
- package/dist/cjs/nano-drawer.cjs.entry.js +2 -2
- package/dist/cjs/nano-dropdown.cjs.entry.js +10 -6
- package/dist/cjs/nano-dropdown.cjs.entry.js.map +1 -1
- package/dist/cjs/nano-global-nav-user-profile_3.cjs.entry.js +3 -3
- package/dist/cjs/nano-global-nav-user-profile_3.cjs.entry.js.map +1 -1
- package/dist/cjs/nano-global-nav.cjs.entry.js +9 -7
- package/dist/cjs/nano-global-nav.cjs.entry.js.map +1 -1
- package/dist/cjs/nano-icon-button_2.cjs.entry.js +1 -1
- package/dist/cjs/nano-input.cjs.entry.js +1 -1
- package/dist/cjs/nano-menu-drawer.cjs.entry.js +1 -1
- package/dist/cjs/nano-overflow-nav.cjs.entry.js +1 -1
- package/dist/cjs/nano-sticker.cjs.entry.js +1 -1
- package/dist/cjs/nano-tab-group.cjs.entry.js +12 -6
- package/dist/cjs/nano-tab-group.cjs.entry.js.map +1 -1
- package/dist/cjs/{nano-table-9bd1168f.js → nano-table-49b4b3a6.js} +3 -3
- package/dist/cjs/{nano-table-9bd1168f.js.map → nano-table-49b4b3a6.js.map} +1 -1
- package/dist/cjs/nano-table.cjs.entry.js +1 -1
- package/dist/cjs/{popover-088646b2.js → popover-b506f6ae.js} +10 -17
- package/dist/cjs/popover-b506f6ae.js.map +1 -0
- package/dist/cjs/{scroll-6a9bedb4.js → scroll-fc1b8387.js} +2 -2
- package/dist/cjs/{scroll-6a9bedb4.js.map → scroll-fc1b8387.js.map} +1 -1
- package/dist/cjs/{table.worker-894a0418.js → table.worker-da980a2f.js} +2 -2
- package/dist/cjs/table.worker-da980a2f.js.map +1 -0
- package/dist/cjs/{transitions-c985e9a9.js → transitions-cc18619c.js} +3 -3
- package/dist/cjs/transitions-cc18619c.js.map +1 -0
- package/dist/collection/components/algolia/algolia-pagination.js +1 -1
- package/dist/collection/components/algolia/algolia-pagination.js.map +1 -1
- package/dist/collection/components/dropdown/dropdown.js +9 -5
- package/dist/collection/components/dropdown/dropdown.js.map +1 -1
- package/dist/collection/components/global-nav/global-nav.js +7 -5
- package/dist/collection/components/global-nav/global-nav.js.map +1 -1
- package/dist/collection/components/global-nav/style/global-nav.css +18 -18
- package/dist/collection/components/nav-item/nav-item.css +4 -4
- package/dist/collection/components/table/table.js +2 -2
- package/dist/collection/components/table/table.js.map +1 -1
- package/dist/collection/components/tabs/tab-group.js +9 -3
- package/dist/collection/components/tabs/tab-group.js.map +1 -1
- package/dist/collection/utils/dom.js +1 -1
- package/dist/collection/utils/dom.js.map +1 -1
- package/dist/collection/utils/transitions.js +2 -2
- package/dist/collection/utils/transitions.js.map +1 -1
- package/dist/components/dom.js +1 -1
- package/dist/components/dom.js.map +1 -1
- package/dist/components/dropdown.js +9 -5
- package/dist/components/dropdown.js.map +1 -1
- package/dist/components/nano-algolia-pagination.js +1 -1
- package/dist/components/nano-algolia-pagination.js.map +1 -1
- package/dist/components/nano-global-nav.js +8 -6
- package/dist/components/nano-global-nav.js.map +1 -1
- package/dist/components/nano-tab-group.js +9 -3
- package/dist/components/nano-tab-group.js.map +1 -1
- package/dist/components/nav-item.js +1 -1
- package/dist/components/nav-item.js.map +1 -1
- package/dist/components/popover.js +9 -16
- package/dist/components/popover.js.map +1 -1
- package/dist/components/table.js +1 -1
- package/dist/components/table.js.map +1 -1
- package/dist/components/transitions.js +2 -2
- package/dist/components/transitions.js.map +1 -1
- package/dist/esm/{dom-311c9e1e.js → dom-8599fac1.js} +2 -2
- package/dist/esm/{dom-311c9e1e.js.map → dom-8599fac1.js.map} +1 -1
- package/dist/esm/nano-accordion.entry.js +1 -1
- package/dist/esm/nano-alert.entry.js +2 -2
- package/dist/esm/nano-algolia-pagination.entry.js +1 -1
- package/dist/esm/nano-algolia-pagination.entry.js.map +1 -1
- package/dist/esm/nano-algolia.entry.js +1 -1
- package/dist/esm/nano-datalist_3.entry.js +1 -1
- package/dist/esm/nano-details.entry.js +1 -1
- package/dist/esm/nano-dialog.entry.js +2 -2
- package/dist/esm/nano-drawer.entry.js +2 -2
- package/dist/esm/nano-dropdown.entry.js +10 -6
- package/dist/esm/nano-dropdown.entry.js.map +1 -1
- package/dist/esm/nano-global-nav-user-profile_3.entry.js +3 -3
- package/dist/esm/nano-global-nav-user-profile_3.entry.js.map +1 -1
- package/dist/esm/nano-global-nav.entry.js +9 -7
- package/dist/esm/nano-global-nav.entry.js.map +1 -1
- package/dist/esm/nano-icon-button_2.entry.js +1 -1
- package/dist/esm/nano-input.entry.js +1 -1
- package/dist/esm/nano-menu-drawer.entry.js +1 -1
- package/dist/esm/nano-overflow-nav.entry.js +1 -1
- package/dist/esm/nano-sticker.entry.js +1 -1
- package/dist/esm/nano-tab-group.entry.js +12 -6
- package/dist/esm/nano-tab-group.entry.js.map +1 -1
- package/dist/esm/{nano-table-baba1696.js → nano-table-673838b5.js} +3 -3
- package/dist/esm/{nano-table-baba1696.js.map → nano-table-673838b5.js.map} +1 -1
- package/dist/esm/nano-table.entry.js +1 -1
- package/dist/esm/{popover-02e6714d.js → popover-e5e7a641.js} +10 -17
- package/dist/esm/popover-e5e7a641.js.map +1 -0
- package/dist/esm/{scroll-952d292a.js → scroll-ec7ac257.js} +2 -2
- package/dist/esm/{scroll-952d292a.js.map → scroll-ec7ac257.js.map} +1 -1
- package/dist/esm/{table.worker-ae46bca0.js → table.worker-608a4868.js} +2 -2
- package/dist/esm/table.worker-608a4868.js.map +1 -0
- package/dist/esm/{transitions-732f45a2.js → transitions-fb09eb32.js} +3 -3
- package/dist/esm/transitions-fb09eb32.js.map +1 -0
- package/dist/nano-components/nano-components.esm.js +1 -1
- package/dist/nano-components/{p-587d3e3d.js → p-06c85b64.js} +2 -2
- package/dist/nano-components/{p-a1ead0a7.entry.js → p-0b7c676c.entry.js} +2 -2
- package/dist/nano-components/{p-a2b73d79.entry.js → p-0e4da739.entry.js} +2 -2
- package/dist/nano-components/{p-6bdbcaa6.entry.js → p-191352c4.entry.js} +2 -2
- package/dist/nano-components/{p-03f8b115.entry.js → p-24dcd788.entry.js} +2 -2
- package/dist/nano-components/p-2a105609.entry.js +5 -0
- package/dist/nano-components/p-2a105609.entry.js.map +1 -0
- package/dist/nano-components/{p-4a79eafe.entry.js → p-359b7cd2.entry.js} +2 -2
- package/dist/nano-components/p-36c3ded8.entry.js +5 -0
- package/dist/nano-components/p-36c3ded8.entry.js.map +1 -0
- package/dist/nano-components/{p-760d80d2.entry.js → p-51133e62.entry.js} +2 -2
- package/dist/nano-components/{p-2a7d0c13.entry.js → p-5fc3035d.entry.js} +2 -2
- package/dist/nano-components/p-67ab5a5f.entry.js +5 -0
- package/dist/nano-components/p-67ab5a5f.entry.js.map +1 -0
- package/dist/nano-components/p-688f1a55.entry.js +5 -0
- package/dist/nano-components/p-688f1a55.entry.js.map +1 -0
- package/dist/nano-components/{p-ac7953e0.entry.js → p-7670058b.entry.js} +2 -2
- package/dist/nano-components/{p-04d5c9ea.entry.js → p-79fff4fd.entry.js} +2 -2
- package/dist/nano-components/p-842f826a.entry.js +5 -0
- package/dist/nano-components/p-842f826a.entry.js.map +1 -0
- package/dist/nano-components/{p-800c4260.entry.js → p-9f60ff14.entry.js} +2 -2
- package/dist/nano-components/{p-73312f19.entry.js → p-a225e976.entry.js} +2 -2
- package/dist/nano-components/p-b27b56d3.js +5 -0
- package/dist/nano-components/p-c3e8e3f9.js +5 -0
- package/dist/nano-components/p-c3e8e3f9.js.map +1 -0
- package/dist/nano-components/{p-18e0d957.entry.js → p-c80336b2.entry.js} +2 -2
- package/dist/nano-components/p-cd1fd454.js +5 -0
- package/dist/nano-components/p-cd1fd454.js.map +1 -0
- package/dist/nano-components/p-cdfc507e.js +5 -0
- package/dist/nano-components/p-cdfc507e.js.map +1 -0
- package/dist/nano-components/{p-f0226ce2.js → p-d18c0a7a.js} +2 -2
- package/dist/nano-components/p-d18c0a7a.js.map +1 -0
- package/dist/nano-components/{p-fcd8df14.entry.js → p-f73f52ed.entry.js} +2 -2
- package/dist/types/components/tabs/tab-group.d.ts +1 -0
- package/docs-json.json +1 -1
- package/hydrate/index.js +44 -39
- package/package.json +3 -3
- package/dist/cjs/popover-088646b2.js.map +0 -1
- package/dist/cjs/table.worker-894a0418.js.map +0 -1
- package/dist/cjs/transitions-c985e9a9.js.map +0 -1
- package/dist/esm/popover-02e6714d.js.map +0 -1
- package/dist/esm/table.worker-ae46bca0.js.map +0 -1
- package/dist/esm/transitions-732f45a2.js.map +0 -1
- package/dist/nano-components/p-186e8559.js +0 -5
- package/dist/nano-components/p-186e8559.js.map +0 -1
- package/dist/nano-components/p-257432ff.js +0 -5
- package/dist/nano-components/p-257432ff.js.map +0 -1
- package/dist/nano-components/p-4d0c0873.entry.js +0 -5
- package/dist/nano-components/p-4d0c0873.entry.js.map +0 -1
- package/dist/nano-components/p-51bc8b59.js +0 -5
- package/dist/nano-components/p-51bc8b59.js.map +0 -1
- package/dist/nano-components/p-79c96564.entry.js +0 -5
- package/dist/nano-components/p-79c96564.entry.js.map +0 -1
- package/dist/nano-components/p-8a72d576.entry.js +0 -5
- package/dist/nano-components/p-8a72d576.entry.js.map +0 -1
- package/dist/nano-components/p-c876624c.entry.js +0 -5
- package/dist/nano-components/p-c876624c.entry.js.map +0 -1
- package/dist/nano-components/p-d7c34990.js +0 -5
- package/dist/nano-components/p-f0226ce2.js.map +0 -1
- package/dist/nano-components/p-f073ee84.entry.js +0 -5
- package/dist/nano-components/p-f073ee84.entry.js.map +0 -1
- /package/dist/nano-components/{p-587d3e3d.js.map → p-06c85b64.js.map} +0 -0
- /package/dist/nano-components/{p-a1ead0a7.entry.js.map → p-0b7c676c.entry.js.map} +0 -0
- /package/dist/nano-components/{p-a2b73d79.entry.js.map → p-0e4da739.entry.js.map} +0 -0
- /package/dist/nano-components/{p-6bdbcaa6.entry.js.map → p-191352c4.entry.js.map} +0 -0
- /package/dist/nano-components/{p-03f8b115.entry.js.map → p-24dcd788.entry.js.map} +0 -0
- /package/dist/nano-components/{p-4a79eafe.entry.js.map → p-359b7cd2.entry.js.map} +0 -0
- /package/dist/nano-components/{p-760d80d2.entry.js.map → p-51133e62.entry.js.map} +0 -0
- /package/dist/nano-components/{p-2a7d0c13.entry.js.map → p-5fc3035d.entry.js.map} +0 -0
- /package/dist/nano-components/{p-ac7953e0.entry.js.map → p-7670058b.entry.js.map} +0 -0
- /package/dist/nano-components/{p-04d5c9ea.entry.js.map → p-79fff4fd.entry.js.map} +0 -0
- /package/dist/nano-components/{p-800c4260.entry.js.map → p-9f60ff14.entry.js.map} +0 -0
- /package/dist/nano-components/{p-73312f19.entry.js.map → p-a225e976.entry.js.map} +0 -0
- /package/dist/nano-components/{p-d7c34990.js.map → p-b27b56d3.js.map} +0 -0
- /package/dist/nano-components/{p-18e0d957.entry.js.map → p-c80336b2.entry.js.map} +0 -0
- /package/dist/nano-components/{p-fcd8df14.entry.js.map → p-f73f52ed.entry.js.map} +0 -0
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"names":["AlgoliaPagination","currentPageChange","infiniteScrollChange","this","show","infiniteScroll","async","page","console","info","updateContent","outputTo","outputSlot","outputEle","templateStr","indexResults","componentWillLoad","templateSlot","el","querySelector","innerHTML","componentDidLoad","render","h","Host","class","ref","div","name","Wormhole"],"sources":["./src/components/algolia/algolia-pagination.tsx"],"sourcesContent":["import {\n Component,\n h,\n Element,\n Host,\n Prop,\n Watch,\n State,\n Method,\n Event,\n EventEmitter,\n} from '@stencil/core';\nimport { Wormhole, WormholeConsumerConstructor } from '../algolia/algolia-data';\nimport type { IndexResult } from '../../interface';\n\n/**\n * Displays results from Algolia searches.\n * TODO / WIP */\n@Component({\n tag: 'nano-algolia-pagination',\n shadow: true,\n})\nexport class AlgoliaPagination {\n @Element() el: HTMLNanoAlgoliaPaginationElement;\n\n private outputEle: HTMLDivElement;\n private outputSlot: HTMLElement;\n private outputTo: HTMLElement;\n private templateStr: string;\n private templateSlot: HTMLElement;\n\n @State() currentPage: number = null;\n @State() canGoPrev: boolean = false;\n @State() canGoNext: boolean = false;\n @State() show: boolean = true;\n @State() tplRenderFn: (...args: any[]) => string;\n @State() indexResults: IndexResult = null;\n @State() infiniteScroll: boolean = false;\n\n /** Max number of page numbers to show */\n @Prop() maxToShow: number = null;\n\n /**\n * Emitted when the page number changes\n */\n @Event() nanoPageChanged!: EventEmitter<{ page: number }>;\n\n @Watch('currentPage')\n currentPageChange() {}\n\n @Watch('infiniteScroll')\n infiniteScrollChange() {\n this.show = !this.infiniteScroll;\n }\n\n /** Go to next page from current */\n @Method()\n async nextPage() {}\n\n /** Go to previous page from current */\n @Method()\n async prevPage() {}\n\n /** Go to a particular page */\n @Method()\n async goToPage(page: number) {\n console.info(page);\n }\n\n private updateContent() {\n this.outputTo = this.outputSlot || this.outputEle;\n if (!this.templateStr || !this.outputTo || !this.indexResults) {\n this.show = false;\n return;\n }\n\n // this.outputTo.innerHTML = this.tplRenderFn(this.templateStr, {\n // orig: { ...this.currentIndex.origFilters[this.filterName] },\n // dyn: { ...this.currentIndex.dynFilters[this.filterName] }\n // });\n }\n\n componentWillLoad() {\n this.templateSlot = this.el.querySelector('[slot=\"filter-template\"]');\n this.outputSlot = this.el.querySelector('[slot=\"output\"]');\n\n if (!!this.templateSlot) this.templateStr = this.templateSlot.innerHTML;\n // this.boundChangeEvent = this.handleChangeEvent.bind(this);\n }\n\n componentDidLoad() {\n this.updateContent();\n }\n\n render() {\n return (\n <Host\n class={{\n 'show-pagination': this.show,\n }}\n >\n <div ref={(div) => (this.outputEle = div)}>\n <slot name=\"output\" />\n </div>\n </Host>\n );\n }\n}\n\n// Use the injectProps method to pass from the tunnel as props to the component\nWormhole(AlgoliaPagination as WormholeConsumerConstructor, [\n 'indexResults',\n 'filterChanged',\n 'tplRenderFn',\n]);\n"],"mappings":";;;0GAsBaA,EAAiB,M,2FASG,K,eACD,M,eACA,M,UACL,K,6CAEY,K,oBACF,M,eAGP,I,CAQ5BC,oBAAiB,CAGjBC,uBACEC,KAAKC,MAAQD,KAAKE,c,CAKpBC,iBAAc,CAIdA,iBAAc,CAIdA,eAAeC,GACbC,QAAQC,KAAKF,E,CAGPG,gBACNP,KAAKQ,SAAWR,KAAKS,YAAcT,KAAKU,UACxC,IAAKV,KAAKW,cAAgBX,KAAKQ,WAAaR,KAAKY,aAAc,CAC7DZ,KAAKC,KAAO,MACZ,M,EASJY,oBACEb,KAAKc,aAAed,KAAKe,GAAGC,cAAc,4BAC1ChB,KAAKS,WAAaT,KAAKe,GAAGC,cAAc,mBAExC,KAAMhB,KAAKc,aAAcd,KAAKW,YAAcX,KAAKc,aAAaG,S,CAIhEC,mBACElB,KAAKO,e,CAGPY,SACE,OACEC,EAACC,EAAI,CACHC,MAAO,CACL,kBAAmBtB,KAAKC,OAG1BmB,EAAA,OAAKG,IAAMC,GAASxB,KAAKU,UAAYc,GACnCJ,EAAA,QAAMK,KAAK,Y,mIAQrBC,EAAS7B,EAAkD,CACzD,eACA,gBACA,uB"}
|
@@ -0,0 +1,5 @@
|
|
1
|
+
/*!
|
2
|
+
* Web Components for Nanopore digital Web Apps
|
3
|
+
*/
|
4
|
+
import{r as i,c as t,h as s,g as e}from"./p-d6a04b3a.js";import{g as o}from"./p-74a7fc4f.js";import{P as n}from"./p-cd1fd454.js";import{a as r}from"./p-f88fa15c.js";const h=":host{box-sizing:border-box}*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}:host{--width:auto;--border:var(--nano-layer-border-style, 1px solid var(--nano-layer-border-color, rgba(0, 0, 0, 0.1)));--border-radius:var(--nano-layer-border-radius, var(--nano-border-radius-medium, 4px));--background:var(--nano-layer-bg, #fff);--padding:10px 0;--overflow:auto;--dropdown-z-index:var(--nano-layer-index-dropdown, 300);--min-width:0;--box-shadow:var(--nano-layer-shadow-large, 0 2px 8px rgba(0, 0, 0, 0.2));--menu-height:var(--max-menu-height, 50vh);display:flex}.dropdown{position:relative}.dropdown__trigger{display:block}.dropdown__positioner{position:absolute;z-index:var(--dropdown-z-index);min-inline-size:var(--min-width);border:0;background:none;padding:0;overflow:visible;color:unset}.dropdown__positioner::backdrop{display:none}.dropdown__positioner[popover],.dropdown__positioner:popover-open{inset:unset}@media (max-width: 35.9375em){.dropdown__positioner{z-index:100}}.dropdown__panel{padding:var(--padding);background:var(--background);min-inline-size:var(--min-width);inline-size:var(--width);border:var(--border);border-radius:var(--border-radius);color:currentcolor;box-shadow:var(--box-shadow);opacity:0;transition:0.2s ease opacity, 0.2s ease transform, 0.2s ease min-block-size;min-block-size:20px;overflow:var(--overflow);box-sizing:content-box !important}.dropdown__panel.loading{overflow-y:hidden}.dropdown__panel.top{transform:translateY(-20px) translateZ(0)}.dropdown__panel.bottom{transform:translateY(20px) translateZ(0)}.dropdown__positioner.popover-visible .dropdown__panel{opacity:1;transform:translateY(0) translateZ(0)}.dropdown__panel ::slotted(nano-menu){max-block-size:var(--menu-height)}.dropdown__accessible-title{clip:rect(1px, 1px, 1px, 1px);-webkit-clip-path:inset(50%);clip-path:inset(50%);block-size:1px;inline-size:1px;margin:-1px;overflow:hidden;padding:0;position:absolute}";let a=0;const d=class{constructor(s){i(this,s);this.nanoShow=t(this,"nanoShow",7);this.nanoAfterShow=t(this,"nanoAfterShow",7);this.nanoHide=t(this,"nanoHide",7);this.nanoAfterHide=t(this,"nanoAfterHide",7);this.dropdownId=`dropdown-${a++}`;this.labelId=this.dropdownId+"-title";this.ignoreOpenWatcher=false;this.didLoad=false;this.togglePanel=()=>{if(!this.autoOpen)return;this.open?this.hide():this.show()};this.handleTriggerKeyDown=i=>{if(["ArrowDown","ArrowUp"," "].includes(i.key)){this.show();i.preventDefault();i.stopPropagation();if(this.menu)this.menu.setFocus()}};this.handleTriggerSlotChange=()=>{this.updateAccessibleTrigger()};this.autoOpen=true;this.open=false;this.closeOnSelect=true;this.containingElement=undefined;this.tetherTo=null;this.placement="bottom-start";this.distance=2;this.skidding=0;this.hoist=false;this.dialogTitle=undefined;this.eventType=undefined}get menu(){return this.host.querySelector("nano-menu")}handleOpenChange(){if(this.ignoreOpenWatcher)return;this.open?this.show():this.hide();if(this.accessibleTrigger){this.accessibleTrigger.setAttribute("aria-expanded",this.open.toString());return}this.updateAccessibleTrigger()}handleTetherToChange(){this.createPopover();this.updateAccessibleTrigger()}handlePopoverOptionsChange(){if(!this.popover)return;this.popover.setOptions({strategy:this.hoist?"fixed":"absolute",placement:this.placement,skidding:this.skidding,distance:this.distance})}secondaryOpen(i){if(!i.detail.secondaryMenu)return;i.stopPropagation();this.panel.classList.add("loading");this.panel.addEventListener("transitionend",(()=>{this.panel.classList.remove("loading")}),{once:true});this.panel.style.minHeight=i.detail.secondaryMenu.scrollHeight+"px"}secondaryClose(i){if(!i.detail.secondaryMenu)return;i.stopPropagation();if(!i.target.parentElement)return;this.panel.style.minHeight=i.target.parentElement.scrollHeight+"px"}handlePanelSelect(i){const t=i.target;if(this.closeOnSelect&&t.tagName.toLowerCase()==="nano-menu")this.hide()}async show(){var i;this.ignoreOpenWatcher=true;this.open=true;const t=this.nanoShow.emit();if(t.defaultPrevented){this.open=false;this.ignoreOpenWatcher=false;return}if(typeof((i=this.positioner)===null||i===void 0?void 0:i.showPopover)==="function"){this.hoist=true;this.popover.show();this.positioner.showPopover()}else{this.popover.show()}this.ignoreOpenWatcher=false;document.addEventListener("mousedown",this.handleDocumentMouseDown);document.addEventListener("keydown",this.handleDocumentKeyDown)}async hide(){this.ignoreOpenWatcher=true;this.open=false;const i=this.nanoHide.emit();if(i.defaultPrevented){this.open=true;this.ignoreOpenWatcher=false;return}if(this.popover)this.popover.hide();this.ignoreOpenWatcher=false;document.removeEventListener("mousedown",this.handleDocumentMouseDown);document.removeEventListener("keydown",this.handleDocumentKeyDown);if(this.accessibleTrigger&&this.focusEleInDropDwn()){this.accessibleTrigger.focus()}setTimeout((()=>{var i;if(!this.open&&typeof((i=this.positioner)===null||i===void 0?void 0:i.hidePopover)==="function"){this.positioner.hidePopover()}}),300)}focusEleInDropDwn(i){var t;const s=o();if(i&&((t=i.composedPath())===null||t===void 0?void 0:t.length)){const t=i.composedPath().includes(this.containingElement);return!i.composedPath().includes(this.accessibleTrigger)&&t}return s&&s.closest(this.containingElement.tagName.toLowerCase())===this.containingElement&&s!==this.accessibleTrigger}updateAccessibleTrigger(){if(!this.didLoad)return;let i;this.accessibleTrigger=null;if(!this.tetherTo){const t=Array.from(this.host.querySelectorAll('[slot="trigger"]'));i=t.map(r)[0]}else{i=r(this.tetherTo)}if(i){i.setAttribute("aria-haspopup","true");i.setAttribute("aria-expanded",this.open?"true":"false");this.accessibleTrigger=i}}handleDocumentKeyDown(i){if(i.key==="Escape"){this.hide();return}if(i.key==="Tab"){setTimeout((()=>{if(document.activeElement&&document.activeElement.closest(this.containingElement.tagName.toLowerCase())!==this.containingElement){this.hide();return}}))}if(this.menu&&["ArrowDown","ArrowUp"].includes(i.key)){if(!this.open||this.focusEleInDropDwn(i))return;i.preventDefault();this.menu.setFocus();return}const t=i.composedPath();if(this.menu&&t.length&&!t.find((i=>i!==this.menu))){this.menu.dispatchEvent(new KeyboardEvent(i.type,i));return}}handleDocumentMouseDown(i){if(!this.focusEleInDropDwn(i)){this.hide();return}}createPopover(){if(!this.tetherTo&&!this.trigger||!this.positioner)return;if(this.popover){if(this.open)this.hide();this.popover.destroy();this.popover=null}this.popover=new n(this.tetherTo||this.trigger,this.positioner,{strategy:this.hoist?"fixed":"absolute",placement:this.placement,distance:this.distance,skidding:this.skidding,transitionElement:this.panel,onAfterHide:()=>this.nanoAfterHide.emit(),onAfterShow:()=>this.nanoAfterShow.emit(),onTransitionEnd:()=>{if(!this.open){this.panel.scrollTop=0}else if(this.menu){this.menu.showActiveElement()}}});if(this.open){this.show()}}connectedCallback(){this.handleDocumentKeyDown=this.handleDocumentKeyDown.bind(this);this.handleDocumentMouseDown=this.handleDocumentMouseDown.bind(this);if(!this.containingElement)this.containingElement=this.host}componentDidLoad(){this.didLoad=true;this.createPopover();setTimeout((()=>this.updateAccessibleTrigger()),100)}disconnectedCallback(){if(this.host.isConnected)this.hide();if(this.popover)this.popover.destroy()}render(){return s("div",{part:"base",id:this.dropdownId,class:{dropdown:true,"dropdown--open":this.open}},s("span",{part:"trigger",class:"dropdown__trigger",ref:i=>this.trigger=i,onKeyDown:this.handleTriggerKeyDown,onClick:this.togglePanel},s("slot",{name:"trigger",onSlotchange:this.handleTriggerSlotChange})),s("div",{ref:i=>this.positioner=i,class:"dropdown__positioner",popover:"manual",id:this.dropdownId+"-positioner"},s("div",{ref:i=>this.panel=i,part:"panel",class:`dropdown__panel ${this.placement.split("-").join(" ")}`,"aria-hidden":!this.open,role:this.host.getAttribute("role")==="group"?"group":"dialog","aria-modal":this.host.getAttribute("role")==="group"?undefined:"true","aria-labelledby":this.dialogTitle?this.labelId:undefined},this.dialogTitle&&s("span",{id:this.labelId,class:"dropdown__accessible-title","aria-live":this.host.getAttribute("role")==="group"?undefined:"polite"},this.dialogTitle),s("slot",null))))}get host(){return e(this)}static get watchers(){return{open:["handleOpenChange"],tetherTo:["handleTetherToChange"],placement:["handlePopoverOptionsChange"],distance:["handlePopoverOptionsChange"],skidding:["handlePopoverOptionsChange"],hoist:["handlePopoverOptionsChange"]}}};d.style=h;export{d as nano_dropdown};
|
5
|
+
//# sourceMappingURL=p-688f1a55.entry.js.map
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"names":["dropdownCss","dropDownIds","Dropdown","this","dropdownId","labelId","ignoreOpenWatcher","didLoad","togglePanel","autoOpen","open","hide","show","handleTriggerKeyDown","event","includes","key","preventDefault","stopPropagation","menu","setFocus","handleTriggerSlotChange","updateAccessibleTrigger","host","querySelector","handleOpenChange","accessibleTrigger","setAttribute","toString","handleTetherToChange","createPopover","handlePopoverOptionsChange","popover","setOptions","strategy","hoist","placement","skidding","distance","secondaryOpen","ev","detail","secondaryMenu","panel","classList","add","addEventListener","remove","once","style","minHeight","scrollHeight","secondaryClose","target","parentElement","handlePanelSelect","closeOnSelect","tagName","toLowerCase","async","nanoShow","emit","defaultPrevented","_a","positioner","showPopover","document","handleDocumentMouseDown","handleDocumentKeyDown","nanoHide","removeEventListener","focusEleInDropDwn","focus","setTimeout","hidePopover","e","activeElement","getActiveElement","composedPath","length","ddInPath","containingElement","closest","tetherTo","assignedElements","Array","from","querySelectorAll","map","getNearestTabbableElement","ePath","find","el","dispatchEvent","KeyboardEvent","type","trigger","destroy","Popover","transitionElement","onAfterHide","nanoAfterHide","onAfterShow","nanoAfterShow","onTransitionEnd","scrollTop","showActiveElement","connectedCallback","bind","componentDidLoad","disconnectedCallback","isConnected","render","h","part","id","class","dropdown","ref","onKeyDown","onClick","name","onSlotchange","split","join","role","getAttribute","undefined","dialogTitle"],"sources":["./src/components/dropdown/dropdown.scss?tag=nano-dropdown&encapsulation=shadow","./src/components/dropdown/dropdown.tsx"],"sourcesContent":["@import '../../global/style/utilities/globals';\n@import '../../global/style/nano-theme/layers';\n\n:host {\n /**\n * @prop --width: width of the dropdown. Defaults to 'auto'\n * @prop --border: Defaults to #{$layer-border-style}\n * @prop --border-radius: Defaults to #{$layer-bg-color};\n * @prop --background: Defaults to #{$layer-bg-color};\n * @prop --padding: padding of the drop down. Default to '10px 0';\n * @prop --overflow: `nano-menu` with nested `nav-item` requires hidden overflow. This can be overidden;\n * @prop --dropdown-z-index: Defaults to #{$layer-index-dropdown};\n * @prop --min-width: Defaults to 0;\n * @prop --box-shadow: #{$layer-shadow-large};\n * @prop --max-menu-height: max height of a slotted menu. defaults to 50vh\n */\n\n --width: auto;\n --border: #{$layer-border-style};\n --border-radius: #{$layer-border-radius};\n --background: #{$layer-bg-color};\n --padding: 10px 0;\n --overflow: auto;\n --dropdown-z-index: #{$layer-index-dropdown};\n --min-width: 0;\n --box-shadow: #{$layer-shadow-large};\n --menu-height: var(--max-menu-height, 50vh);\n\n display: flex;\n}\n\n.dropdown {\n position: relative;\n\n &__trigger {\n display: block;\n }\n\n &__positioner {\n position: absolute;\n z-index: var(--dropdown-z-index);\n min-inline-size: var(--min-width);\n border: 0;\n background: none;\n padding: 0;\n overflow: visible;\n color: unset;\n\n &::backdrop { display: none; }\n\n &[popover],\n &:popover-open {\n inset: unset;\n }\n\n @media (max-width: 35.9375em) {\n z-index: 100;\n }\n }\n\n &__panel {\n padding: var(--padding);\n background: var(--background);\n min-inline-size: var(--min-width);\n inline-size: var(--width);\n border: var(--border);\n border-radius: var(--border-radius);\n color: currentcolor;\n box-shadow: var(--box-shadow);\n opacity: 0;\n transition: 0.2s ease opacity, 0.2s ease transform, 0.2s ease min-block-size;\n min-block-size: 20px;\n overflow: var(--overflow);\n box-sizing: content-box !important;\n\n &.loading {\n overflow-y: hidden;\n }\n\n &.top {\n transform: translateY(-20px) translateZ(0);\n }\n\n &.bottom {\n transform: translateY(20px) translateZ(0);\n }\n\n .dropdown__positioner.popover-visible & {\n opacity: 1;\n transform: translateY(0) translateZ(0);\n }\n\n ::slotted(nano-menu) {\n max-block-size: var(--menu-height);\n }\n }\n\n &__accessible-title {\n @include visually-hide();\n }\n}\n","import {\n Component,\n Element,\n Event,\n Method,\n Prop,\n Watch,\n h,\n Listen,\n ComponentInterface,\n EventEmitter,\n} from '@stencil/core';\nimport { getActiveElement } from '../../utils/active-element';\nimport Popover, { PopoverPlacement } from '../../utils/popover';\nimport { getNearestTabbableElement } from '../../utils/tabbable';\nimport type { NavItemEventDetail } from '../../interface';\n\nlet dropDownIds = 0;\n\n/**\n * Dropdowns show additional content in a panel.\n * Designed to work well with nano-menu components to provide a list of options (`nano-nav-items` / `nano-option`).\n * @slot trigger - The dropdown's trigger.\n * @slot - The dropdown's content.\n */\n@Component({\n tag: 'nano-dropdown',\n styleUrl: 'dropdown.scss',\n shadow: true,\n})\nexport class Dropdown implements ComponentInterface {\n private dropdownId = `dropdown-${dropDownIds++}`;\n private labelId = this.dropdownId + '-title';\n private ignoreOpenWatcher = false;\n private panel: HTMLElement;\n private popover: Popover;\n private trigger: HTMLElement;\n private positioner: HTMLElement;\n private accessibleTrigger: HTMLElement;\n private didLoad = false;\n private get menu() {\n return this.host.querySelector('nano-menu') as HTMLNanoMenuElement;\n }\n\n @Element() host: HTMLNanoDropdownElement;\n\n /** Determines if the dropdown should open automatically when the trigger is clicked */\n @Prop() autoOpen = true;\n\n /** Indicates whether or not the dropdown 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 if (this.ignoreOpenWatcher) return;\n\n this.open ? this.show() : this.hide();\n\n if (this.accessibleTrigger) {\n this.accessibleTrigger.setAttribute(\n 'aria-expanded',\n this.open.toString()\n );\n return;\n }\n\n this.updateAccessibleTrigger();\n }\n\n /**\n * Determines whether the dropdown should hide when a menu item is selected.\n */\n @Prop() closeOnSelect = true;\n\n /**\n * The dropdown will close when the user interacts outside of this element (e.g. clicking).\n */\n @Prop({ mutable: true }) containingElement: HTMLElement;\n\n /**\n * If you don't want to use the trigger slot, you can use this to 'tether' the dropdown to another element.\n * And you will still need to control when the component is opened (using show() / hide() or the `open` prop)\n */\n @Prop() tetherTo: HTMLElement = null;\n\n @Watch('tetherTo')\n handleTetherToChange() {\n this.createPopover();\n this.updateAccessibleTrigger();\n }\n\n /**\n * The preferred placement of the dropdown panel. Note that the actual placement may vary as needed to keep the panel\n * inside of the viewport.\n */\n @Prop() placement: PopoverPlacement = 'bottom-start';\n\n /**\n * The distance in pixels from which to offset the panel away from its trigger.\n */\n @Prop() distance = 2;\n\n /**\n * The distance in pixels from which to offset the panel along its trigger.\n */\n @Prop() skidding = 0;\n\n /**\n * Enable this option to prevent the panel from being clipped when the component is placed inside a container with\n * `overflow: auto|scroll`.\n */\n @Prop() hoist = false;\n\n @Watch('placement')\n @Watch('distance')\n @Watch('skidding')\n @Watch('hoist')\n handlePopoverOptionsChange() {\n if (!this.popover) return;\n\n this.popover.setOptions({\n strategy: this.hoist ? 'fixed' : 'absolute',\n placement: this.placement,\n skidding: this.skidding,\n distance: this.distance,\n });\n }\n\n /**\n * Title used to describe the dropdown content for accessibility\n */\n @Prop() dialogTitle!: string;\n\n // Events\n\n /**\n * Emitted when the dropdown opens. Calling `event.preventDefault()` will prevent it from being opened.\n */\n @Event() nanoShow: EventEmitter;\n\n /**\n * Emitted after the dropdown opens and all transitions are complete.\n */\n @Event() nanoAfterShow: EventEmitter;\n\n /**\n * Emitted when the dropdown closes. Calling `event.preventDefault()` will prevent it from being closed.\n */\n @Event() nanoHide: EventEmitter;\n\n /**\n * Emitted after the dropdown closes and all transitions are complete.\n */\n @Event() nanoAfterHide: EventEmitter;\n\n // this is a massive hack to make stencil expose the `EventEmitter` type in the final build\n // because the `Dropdown` class is used as a type in `nano-datalist`\n /** @internal */\n @Prop() eventType: EventEmitter;\n\n // Listeners\n\n @Listen('nanoOpen')\n secondaryOpen(ev: CustomEvent) {\n if (!(ev.detail as NavItemEventDetail).secondaryMenu) return;\n ev.stopPropagation();\n\n this.panel.classList.add('loading');\n this.panel.addEventListener(\n 'transitionend',\n () => {\n this.panel.classList.remove('loading');\n },\n { once: true }\n );\n\n this.panel.style.minHeight =\n (ev.detail as NavItemEventDetail).secondaryMenu.scrollHeight + 'px';\n }\n\n @Listen('nanoClose')\n secondaryClose(ev: CustomEvent) {\n if (!(ev.detail as NavItemEventDetail).secondaryMenu) return;\n ev.stopPropagation();\n if (!(ev.target as HTMLElement).parentElement) return;\n this.panel.style.minHeight =\n (ev.target as HTMLElement).parentElement.scrollHeight + 'px';\n }\n\n @Listen('nanoSelect')\n handlePanelSelect(event: CustomEvent) {\n const target = event.target as HTMLElement;\n\n // Hide the dropdown when a menu item is selected\n if (this.closeOnSelect && target.tagName.toLowerCase() === 'nano-menu')\n this.hide();\n }\n\n // Methods\n\n /** Shows the dropdown panel */\n @Method()\n async show() {\n this.ignoreOpenWatcher = true;\n this.open = true;\n\n const nanoShow = this.nanoShow.emit();\n\n if (nanoShow.defaultPrevented) {\n this.open = false;\n this.ignoreOpenWatcher = false;\n return;\n }\n\n // @ts-ignore\n if (typeof this.positioner?.showPopover === 'function') {\n this.hoist = true;\n this.popover.show();\n // @ts-ignore\n this.positioner.showPopover();\n } else {\n this.popover.show();\n }\n\n this.ignoreOpenWatcher = false;\n document.addEventListener('mousedown', this.handleDocumentMouseDown);\n document.addEventListener('keydown', this.handleDocumentKeyDown);\n }\n\n /** Hides the dropdown panel */\n @Method()\n async hide() {\n this.ignoreOpenWatcher = true;\n this.open = false;\n\n const nanoHide = this.nanoHide.emit();\n\n if (nanoHide.defaultPrevented) {\n this.open = true;\n this.ignoreOpenWatcher = false;\n return;\n }\n\n if (this.popover) this.popover.hide();\n this.ignoreOpenWatcher = false;\n\n document.removeEventListener('mousedown', this.handleDocumentMouseDown);\n document.removeEventListener('keydown', this.handleDocumentKeyDown);\n\n if (this.accessibleTrigger && this.focusEleInDropDwn()) {\n this.accessibleTrigger.focus();\n }\n\n setTimeout(() => {\n // @ts-ignore\n if (!this.open && typeof this.positioner?.hidePopover === 'function') {\n // @ts-ignore\n this.positioner.hidePopover();\n }\n }, 300);\n }\n\n // Private methods\n\n /**\n * Decides if the current active element or element\n * connected to the current event is connected to the Dropdown\n * @param e\n * @returns whether the current focus is within the dropdown\n */\n private focusEleInDropDwn(e?: Event) {\n const activeElement = getActiveElement();\n\n if (e && e.composedPath()?.length) {\n const ddInPath = e.composedPath().includes(this.containingElement);\n return !e.composedPath().includes(this.accessibleTrigger) && ddInPath;\n }\n\n return (\n activeElement &&\n activeElement.closest(this.containingElement.tagName.toLowerCase()) ===\n this.containingElement &&\n activeElement !== this.accessibleTrigger\n );\n }\n\n private togglePanel = () => {\n if (!this.autoOpen) return;\n this.open ? this.hide() : this.show();\n };\n\n // Slotted triggers can be arbitrary content, but we need to link them to the dropdown panel with `aria-haspopup` and\n // `aria-expanded`. These must be applied to the \"accessible trigger\" (the tabbable portion of the trigger element\n // that gets slotted in) so screen readers will understand them. The accessible trigger could be the slotted element,\n private updateAccessibleTrigger() {\n if (!this.didLoad) return;\n\n let accessibleTrigger: HTMLElement;\n this.accessibleTrigger = null;\n\n if (!this.tetherTo) {\n const assignedElements = Array.from(\n this.host.querySelectorAll('[slot=\"trigger\"]')\n );\n accessibleTrigger = assignedElements.map(getNearestTabbableElement)[0];\n } else {\n accessibleTrigger = getNearestTabbableElement(this.tetherTo);\n }\n\n if (accessibleTrigger) {\n accessibleTrigger.setAttribute('aria-haspopup', 'true');\n accessibleTrigger.setAttribute(\n 'aria-expanded',\n this.open ? 'true' : 'false'\n );\n this.accessibleTrigger = accessibleTrigger;\n }\n }\n\n // Handlers\n\n private handleDocumentKeyDown(event: KeyboardEvent) {\n // Close when escape is pressed\n if (event.key === 'Escape') {\n this.hide();\n return;\n }\n\n // Close when tabbing results in the focus leaving the close element\n if (event.key === 'Tab') {\n setTimeout(() => {\n if (\n document.activeElement &&\n document.activeElement.closest(\n this.containingElement.tagName.toLowerCase()\n ) !== this.containingElement\n ) {\n this.hide();\n return;\n }\n });\n }\n\n // If a menu is present, focus on it when certain keys are pressed\n if (this.menu && ['ArrowDown', 'ArrowUp'].includes(event.key)) {\n // must have menu item, must have pressed down, must be open and must not have focus within dd\n if (!this.open || this.focusEleInDropDwn(event)) return;\n event.preventDefault();\n this.menu.setFocus();\n return;\n }\n\n // All other keys focus the menu and pass the event through to menu (necessary for type-to-search to work)\n const ePath = event.composedPath();\n if (this.menu && ePath.length && !ePath.find((el) => el !== this.menu)) {\n this.menu.dispatchEvent(new KeyboardEvent(event.type, event));\n return;\n }\n }\n\n private handleDocumentMouseDown(event: MouseEvent) {\n // Close when clicking outside of the close element\n if (!this.focusEleInDropDwn(event)) {\n this.hide();\n return;\n }\n }\n\n private handleTriggerKeyDown = (event: KeyboardEvent) => {\n // Open the panel when pressing down or up while focused on the trigger\n if (['ArrowDown', 'ArrowUp', ' '].includes(event.key)) {\n this.show();\n event.preventDefault();\n event.stopPropagation();\n\n if (this.menu) this.menu.setFocus();\n }\n };\n\n private handleTriggerSlotChange = () => {\n this.updateAccessibleTrigger();\n };\n\n private createPopover() {\n if ((!this.tetherTo && !this.trigger) || !this.positioner) return;\n\n if (this.popover) {\n if (this.open) this.hide();\n this.popover.destroy();\n this.popover = null;\n }\n\n this.popover = new Popover(this.tetherTo || this.trigger, this.positioner, {\n strategy: this.hoist ? 'fixed' : 'absolute',\n placement: this.placement,\n distance: this.distance,\n skidding: this.skidding,\n transitionElement: this.panel,\n onAfterHide: () => this.nanoAfterHide.emit(),\n onAfterShow: () => this.nanoAfterShow.emit(),\n onTransitionEnd: () => {\n if (!this.open) {\n this.panel.scrollTop = 0;\n } else if (this.menu) {\n this.menu.showActiveElement();\n }\n },\n });\n // Show on init if open\n if (this.open) {\n this.show();\n }\n }\n\n // Stencil hooks\n\n connectedCallback() {\n this.handleDocumentKeyDown = this.handleDocumentKeyDown.bind(this);\n this.handleDocumentMouseDown = this.handleDocumentMouseDown.bind(this);\n\n if (!this.containingElement) this.containingElement = this.host;\n }\n\n componentDidLoad() {\n this.didLoad = true;\n this.createPopover();\n setTimeout(() => this.updateAccessibleTrigger(), 100);\n }\n\n disconnectedCallback() {\n if (this.host.isConnected) this.hide();\n if (this.popover) this.popover.destroy();\n }\n\n render() {\n return (\n <div\n part=\"base\"\n id={this.dropdownId}\n class={{\n dropdown: true,\n 'dropdown--open': this.open,\n }}\n >\n <span\n part=\"trigger\"\n class=\"dropdown__trigger\"\n ref={(el) => (this.trigger = el)}\n onKeyDown={this.handleTriggerKeyDown}\n onClick={this.togglePanel}\n >\n <slot name=\"trigger\" onSlotchange={this.handleTriggerSlotChange} />\n </span>\n\n <div\n ref={(el) => (this.positioner = el)}\n class=\"dropdown__positioner\"\n // @ts-ignore\n popover=\"manual\"\n id={this.dropdownId + '-positioner'}\n >\n <div\n ref={(el) => (this.panel = el)}\n part=\"panel\"\n class={`dropdown__panel ${this.placement.split('-').join(' ')}`}\n aria-hidden={!this.open}\n role={\n this.host.getAttribute('role') === 'group' ? 'group' : 'dialog'\n }\n aria-modal={\n this.host.getAttribute('role') === 'group' ? undefined : 'true'\n }\n aria-labelledby={this.dialogTitle ? this.labelId : undefined}\n >\n {this.dialogTitle && (\n <span\n id={this.labelId}\n class=\"dropdown__accessible-title\"\n aria-live={\n this.host.getAttribute('role') === 'group'\n ? undefined\n : 'polite'\n }\n >\n {this.dialogTitle}\n </span>\n )}\n <slot />\n </div>\n </div>\n </div>\n );\n }\n}\n"],"mappings":"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"}
|
@@ -1,5 +1,5 @@
|
|
1
1
|
/*!
|
2
2
|
* Web Components for Nanopore digital Web Apps
|
3
3
|
*/
|
4
|
-
import{r as e,c as a,h as t,g as r}from"./p-d6a04b3a.js";import{M as i}from"./p-2234694a.js";import{l as n,u as s}from"./p-
|
5
|
-
//# sourceMappingURL=p-
|
4
|
+
import{r as e,c as a,h as t,g as r}from"./p-d6a04b3a.js";import{M as i}from"./p-2234694a.js";import{l as n,u as s}from"./p-b27b56d3.js";import{h as o}from"./p-dc565459.js";import{w as d}from"./p-9bfdee71.js";import{C as l}from"./p-dd5687db.js";import"./p-f88fa15c.js";import"./p-cdfc507e.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};
|
5
|
+
//# sourceMappingURL=p-7670058b.entry.js.map
|
@@ -1,5 +1,5 @@
|
|
1
1
|
/*!
|
2
2
|
* Web Components for Nanopore digital Web Apps
|
3
3
|
*/
|
4
|
-
import{r as i,c as a,h as o,a as t,g as s}from"./p-d6a04b3a.js";import{M as e}from"./p-2234694a.js";import{l as n,u as r}from"./p-
|
5
|
-
//# sourceMappingURL=p-
|
4
|
+
import{r as i,c as a,h as o,a as t,g as s}from"./p-d6a04b3a.js";import{M as e}from"./p-2234694a.js";import{l as n,u as r}from"./p-b27b56d3.js";import{h as d}from"./p-dc565459.js";import{C as l}from"./p-dd5687db.js";import"./p-f88fa15c.js";import"./p-cdfc507e.js";import"./p-7bff5224.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));--content-background:#fafafa;--footer-content:#e4e6e8;--scrim-color:var(--nano-layer-overlay-dark, rgb(74 74 74 / 50%));--box-shadow:var(--nano-layer-shadow-large, 0 2px 8px rgba(0, 0, 0, 0.2));--close-button-color:#b5aea7;--width:60rem;--tint-color:#00607b;--body-padding-v:var(--nano-spacing-large, 20px);--body-padding-h:var(--nano-spacing-large, 20px);--header-padding-v:var(--nano-spacing-medium, 16px);--header-padding-h:var(--nano-spacing-large, 20px);--footer-padding-v:var(--nano-spacing-medium, 16px);--footer-padding-h:var(--nano-spacing-large, 20px)}.dialog{display:flex;align-items:center;justify-content:center;position:fixed;inset:0;z-index:var(--nano-layer-index-modal, 700)}.dialog__panel{display:flex;flex-direction:column;z-index:2;inline-size:var(--width);max-inline-size:calc(100% - var(--nano-spacing-xlarge, 24px));max-block-size:calc(92% - var(--nano-spacing-xlarge, 24px));background-color:var(--content-background);border-radius:var(--border-radius);box-shadow:var(--box-shadow);opacity:0;transform:scale(0.8);transition:var(--nano-transition-fast, 0.3s) opacity, var(--nano-transition-fast, 0.3s) transform}.dialog__panel:focus{outline:none}.dialog--with-ribbon .dialog__panel{-webkit-border-before:5px solid var(--tint-color);border-block-start:5px solid var(--tint-color)}.dialog--open .dialog__panel{display:flex;opacity:1;transform:none}.dialog--nodismiss .dialog__panel{animation:cannotClose 0.25s ease-in-out 1}@keyframes cannotClose{0%{transform:scale(1)}50%{transform:scale(1.08)}100%{transform:scale(1)}}.dialog__header{flex:0 0 auto;display:flex;inline-size:100%;background-color:var(--content-background);border-radius:var(--border-radius) var(--border-radius) 0 0;transition:var(--nano-transition-fast, 0.1s) box-shadow;min-inline-size:auto}[stuck] .dialog__header{box-shadow:var(--nano-layer-shadow-medium, 0 2px 4px rgba(0, 0, 0, 0.2))}.dialog__title{flex:1 1 auto;font-size:var(--nano-fontsize-large, 1.25rem);line-height:1.6;padding-block:var(--header-padding-v);padding-inline:var(--header-padding-h)}.dialog .dialog__close-icon{flex:0 0 auto;display:flex;align-items:center;font-size:var(--nano-fontsize-xlarge, 1.5rem);padding-block:0;padding-inline:var(--header-padding-h);--color:var(--close-button-color)}.dialog__body{padding-block:0 var(--body-padding-v);padding-inline:var(--body-padding-h)}.dialog:not(.dialog--has-header) .dialog__body{-webkit-padding-before:var(--body-padding-v);padding-block-start:var(--body-padding-v)}.dialog__body ::slotted(*){max-inline-size:100%}.dialog__body-wrap{flex:1 1 auto;overflow:auto;-webkit-overflow-scrolling:touch;border-radius:var(--border-radius)}.dialog:not(.dialog--has-header) .dialog__body-wrap{border-radius:0 0 inherit inherit}.dialog:not(.dialog--has-footer) .dialog__body-wrap{border-radius:inherit inherit 0 0}.dialog__footer{inline-size:100%;padding-block:var(--footer-padding-v);padding-inline:var(--footer-padding-h);background:var(--footer-content);border-radius:0 0 var(--border-radius) var(--border-radius);position:relative;inset-block-start:1px;min-inline-size:auto}.dialog__footer ::slotted(button){-webkit-margin-end:var(--nano-spacing-small, 8px) !important;margin-inline-end:var(--nano-spacing-small, 8px) !important}.dialog:not(.dialog--has-footer) .dialog__footer{display:none}.dialog__close-txt{color:var(--tint-color);border:none;text-decoration:underline;margin:0;text-underline-offset:4px;background-color:transparent;font:inherit;-webkit-box-align:center;cursor:pointer;font-size:var(--nano-fontsize-small, 0.875rem);padding:0.5rem;border-radius:var(--nano-border-radius-small, 2px);transition:box-shadow 100ms ease-in-out}.dialog__close-txt:focus{outline:none;box-shadow:var(--nano-control-focus-shadow, 0 0 0 0.1875rem var(--nano-control-focus-color, rgba(144, 198, 231, 0.8)))}.dialog__overlay{position:fixed;inset:0;background-color:var(--scrim-color);opacity:0;transition:var(--nano-transition-fast, 0.3s) opacity;-webkit-backdrop-filter:blur(var(--nano-layer-overlay-blur, 3px));backdrop-filter:blur(var(--nano-layer-overlay-blur, 3px))}.dialog--open .dialog__overlay{opacity:1}";let c=0;const p=class{constructor(o){i(this,o);this.nanoShow=a(this,"nanoShow",7);this.nanoAfterShow=a(this,"nanoAfterShow",7);this.nanoHide=a(this,"nanoHide",7);this.nanoAfterHide=a(this,"nanoAfterHide",7);this.nanoInitialFocus=a(this,"nanoInitialFocus",7);this.nanoRequestClose=a(this,"nanoRequestClose",7);this.componentId=`dialog-${++c}`;this.willShow=false;this.willHide=false;this.handleKeyDown=i=>{if(i.key==="Escape"){this.requestClose()}};this.requestClose=()=>{const i=this.nanoRequestClose.emit();if(!i.defaultPrevented&&!this.noUserDismiss){this.hide()}else{this.noDismiss=true;setTimeout((()=>this.noDismiss=false),250)}};this.handleTransitionEnd=i=>{if(i.propertyName==="opacity"&&i.composedPath().find((i=>i===this.panel||i===this.overlay))){this.willShow=false;this.willHide=false;this.open?this.nanoAfterShow.emit():this.nanoAfterHide.emit();if(!this.open)this.dialog.hidden=true}};this.handleSlotChange=()=>{this.hasFooter=d(this.host,"footer")};this.noDismiss=false;this.hasFooter=false;this.showRibbon=true;this.open=false;this.label=undefined;this.noHeader=false;this.noFooter=false;this.noUserDismiss=false;this.storeId=undefined;this.storeMethod="url-hash";this.hoist=false}get panel(){return this._panel}set panel(i){if(this._panel){this.panel.removeEventListener("transitionend",this.handleTransitionEnd)}i.addEventListener("transitionend",this.handleTransitionEnd);this._panel=i}handleOpenChange(){this.open?this.show():this.hide()}handleHoistChange(){if(!this.hoist||Array.from(document.body.children).includes(this.host))return;document.body.prepend(this.host)}async show(){if(this.willShow){return}const i=this.nanoShow.emit();if(i.defaultPrevented){this.open=false;return}if(this.dialog)this.dialog.hidden=false;this.originalTrigger=document.activeElement;this.willShow=true;this.open=true;this.modal.activate();n(this.host);if(this.open){this.host.addEventListener("nanoAfterShow",(()=>{const i=this.nanoInitialFocus.emit();if(!i.defaultPrevented){this.panel.focus({preventScroll:true})}}),{once:true})}}async hide(){if(this.willHide){return}const i=this.nanoHide.emit();if(i.defaultPrevented){this.open=true;return}this.willHide=true;this.open=false;this.modal.deactivate();r(this.host);this.stopVideos();const a=this.originalTrigger;if(a&&typeof a.focus==="function"){setTimeout((()=>a.focus()))}}stopVideos(){const i=Array.from(this.host.querySelectorAll("iframe,video"));i.forEach((i=>{if(i.tagName.toLowerCase()==="video")i.pause();else{const a=i.src;i.src=a}}))}connectedCallback(){this.handleHoistChange();this.modal=new e(this.host)}componentWillLoad(){this.handleSlotChange();if(this.open)this.show();if(this.storeId)l.init(this,["open"],this.storeMethod,this.storeId)}componentDidLoad(){this.dialog.hidden=!this.open}disconnectedCallback(){r(this.host);if(!this.panel)return;this.panel.removeEventListener("transitionend",this.handleTransitionEnd)}render(){return o(t,null,o("div",{part:"base",class:{dialog:true,"dialog--open":this.open,"dialog--has-footer":!this.noFooter,"dialog--has-header":!this.noHeader,"dialog--nodismiss":this.noDismiss,"dialog--with-ribbon":this.showRibbon},onKeyDown:this.handleKeyDown,ref:i=>this.dialog=i},o("div",{part:"overlay",class:"dialog__overlay",ref:i=>this.overlay=i,onClick:this.requestClose}),o("div",{ref:i=>this.panel=i,part:"panel",class:"dialog__panel",role:"dialog","aria-modal":"true","aria-hidden":this.open?"false":"true","aria-label":this.noHeader?this.label:null,"aria-labelledby":!this.noHeader?`${this.componentId}-title`:null,tabIndex:0},o("div",{class:"dialog__body-wrap"},!this.noHeader&&o("nano-sticker",null,o("header",{part:"header",class:"dialog__header"},o("span",{part:"title",class:"dialog__title",id:`${this.componentId}-title`},o("slot",{name:"label"},this.label||String.fromCharCode(65279))),!this.noUserDismiss&&o("nano-icon-button",{part:"close-button",exportparts:"base:close-button__base",class:"dialog__close-icon",label:"close dialog",onClick:this.requestClose,iconName:"light/times"}))),o("div",{part:"body",class:"dialog__body"},o("slot",null)),!this.noFooter&&(this.hasFooter||!this.noUserDismiss)&&o("nano-sticker",{position:"bottom"},o("footer",{part:"footer",class:"dialog__footer"},o("slot",{name:"footer",onSlotchange:this.handleSlotChange}),!this.noUserDismiss&&o("button",{class:"dialog__close-txt",onClick:this.requestClose},"Close")))))))}get host(){return s(this)}static get watchers(){return{open:["handleOpenChange"],hoist:["handleHoistChange"]}}};p.style=h;export{p as nano_dialog};
|
5
|
+
//# sourceMappingURL=p-79fff4fd.entry.js.map
|
@@ -0,0 +1,5 @@
|
|
1
|
+
/*!
|
2
|
+
* Web Components for Nanopore digital Web Apps
|
3
|
+
*/
|
4
|
+
import{r as t,c as i,d as e,w as n,h as s,i as a,a as o,g as r}from"./p-d6a04b3a.js";import{a as h}from"./p-cad86fb8.js";import{C as l}from"./p-dd5687db.js";import{d as c}from"./p-7bff5224.js";import{d}from"./p-c3e8e3f9.js";var u=undefined&&undefined.__rest||function(t,i){var e={};for(var n in t)if(Object.prototype.hasOwnProperty.call(t,n)&&i.indexOf(n)<0)e[n]=t[n];if(t!=null&&typeof Object.getOwnPropertySymbols==="function")for(var s=0,n=Object.getOwnPropertySymbols(t);s<n.length;s++){if(i.indexOf(n[s])<0&&Object.prototype.propertyIsEnumerable.call(t,n[s]))e[n[s]]=t[n[s]]}return e};async function p(t,i={}){var{body:e}=i,n=u(i,["body"]);const s={Accept:"application/json, text/plain, */*","Access-Control-Allow-Origin":"*","Content-Type":"application/json",Cache:"no-cache"};const a=Object.assign(Object.assign({method:e?"POST":"GET",credentials:"include",keepalive:true,mode:"cors"},n),{headers:Object.assign(Object.assign({},s),n.headers)});if(e){a.body=JSON.stringify(e)}let o=setTimeout((()=>{}),0);if(window.AbortController){const t=new AbortController;const{timeout:i=500}=n;o=setTimeout((()=>t.abort()),i);a.signal=t.signal}const r=await fetch(t,a);clearTimeout(o);if(r.ok){return await r.json()}else{const t=await r.text();return new Error(t)}}const g=':host{box-sizing:border-box}*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}.global-nav{font-family:inherit;font-size:inherit;font-stretch:inherit;font-style:inherit;font-weight:inherit;letter-spacing:inherit;text-decoration:inherit;text-overflow:inherit;text-transform:inherit;text-align:inherit;white-space:inherit;color:inherit}.global-nav>.sticker-trigger{display:none}.global-nav>.sticker-trigger~.sticker-trigger{display:block}.global-nav button{background:none;color:inherit;border:none}.global-nav .icon-btn{position:relative;background:none;color:inherit;border:none;align-self:normal;padding:9px 7px;cursor:pointer;display:flex;align-items:center}.global-nav .icon-btn nano-icon{width:18px;height:18px}.global-nav ::slotted(nano-nav-item[slot=icon]){--padding-top:9px;--padding-bottom:9px;--padding-start:7px;--padding-end:7px;--display:flex;font-size:18px}.global-nav a{color:inherit;text-decoration:none;white-space:nowrap}.global-nav .nav-links_title{margin:8px 0 3px}.global-nav .nav-links ul{margin:0;padding:0}.global-nav .nav-links li{list-style:none}.global-nav .login-btn{display:flex;align-items:center}.global-nav .menu-btn{padding:9px var(--bar-item-spacing) 9px var(--bar-item-spacing)}.site-content{display:flex;transition:min-height 0.2s ease;position:relative;z-index:auto;align-items:stretch;flex:1}.bars{color:var(--bar-text-color);z-index:var(--nano-layer-index-menubar, 10);position:relative;max-width:100%;min-width:100%;box-shadow:none;transition:0.2s ease box-shadow}[stuck] .bars{box-shadow:0 1px 25px 0 rgba(0, 0, 0, 0.15)}.bars::before{content:"";width:100%;height:100%;z-index:-1;background:var(--bar-background);position:absolute}.main-bar{width:100%;padding-inline:0 var(--bar-item-spacing);padding-block:var(--bar-vertical-padding);display:flex;align-items:center;justify-content:space-between;overflow-x:hidden}.main-bar:focus{outline:none}:host(.ready) .main-bar{overflow-x:visible}.main-bar>*,.main-bar ::slotted(*){transition:opacity 0.2s ease}:host(:not(.ready)) .main-bar>*,:host(:not(.ready)) .main-bar ::slotted(*){opacity:0 !important}:host(.ready) .main-bar>*,:host(.ready) .main-bar ::slotted(*){opacity:1}:host(.resizing) .main-bar>*,:host(.resizing) .main-bar ::slotted(*){opacity:0 !important}.main-bar>*{flex:0 0 auto}.main-bar>* ::slotted(nano-nav-item[slot=icon]){-webkit-margin-start:11px;margin-inline-start:11px}.main-bar>* ::slotted(nano-nav-item),.main-bar>* nano-nav-item{--color-hover:var(--bar-color-focus);--secondary-bg-color:var(--bar-dropdown-bg);--secondary-color:var(--bar-dropdown-text);--bg-color-open:var(--bar-background);--padding-top:7px;--padding-bottom:7px;--padding-end:2px;--padding-start:2px;text-decoration:none !important}.main-bar .icon-btn{-webkit-margin-before:0;margin-block-start:0;-webkit-margin-after:0;margin-block-end:0;-webkit-margin-start:6px;margin-inline-start:6px}:host(.threshold-2) .main-bar .icon-btn{-webkit-margin-before:0;margin-block-start:0;-webkit-margin-after:0;margin-block-end:0;-webkit-margin-start:11px;margin-inline-start:11px}.main-bar .menu-btn.icon-btn{margin:0 !important;-webkit-border-end:1.5px solid var(--bar-color-shade);border-inline-end:1.5px solid var(--bar-color-shade)}.main-bar .logo{height:36px;width:200px;min-width:200px}:host(:not(.threshold-1)) .main-bar .logo{height:30px}.main-bar .logo-link{-webkit-margin-end:0;margin-inline-end:0;-webkit-margin-start:0;margin-inline-start:0;padding-inline:var(--bar-item-spacing);display:flex;align-items:center;border:none}.main-bar .nav-links{flex:0 0 auto;display:flex;justify-content:space-around}.main-bar .nav-links ul{display:flex;justify-content:space-around}.main-bar .nav-links ::slotted(nano-nav-item),.main-bar .nav-links nano-nav-item{--padding-top:7px;--padding-bottom:7px;--padding-end:2px;--padding-start:2px;--margin:0 var(--bar-item-spacing)}.main-bar .nav-links--main{justify-content:flex-start;letter-spacing:1.5px;font-weight:600;font-stretch:condensed;text-transform:uppercase;font-size:1.065em;-webkit-margin-end:auto;margin-inline-end:auto}.main-bar .nav-links--main ::slotted(nano-nav-item){--color:var(--bar-text-color);--padding-end:3px;--padding-start:0}.main-bar .nav-links--sub{--color:var(--color, #e2e2e2);-webkit-margin-start:6px;margin-inline-start:6px;justify-content:flex-end}.main-bar .login-btn{display:inline-block;border-radius:4px;background-color:var(--login-button-bg);color:var(--login-button-text);padding:3px 10px;position:relative;inset-inline-start:auto;inset-block-end:auto;margin-inline:11px 0}.main-bar .measure-ele{min-width:1px;display:block;margin:0;padding:0}.sticker-trigger{background:var(--bar-background);width:100%;height:1px;z-index:20;position:relative}.gn-menu{position:fixed;inset-block-start:0;inset-inline-start:0;z-index:-1;display:none;transition:z-index 0.01s ease 0.2s;height:100vh;width:100vw;overflow-y:auto}:host(.threshold-4) .gn-menu{position:absolute;width:calc(100vw - 20px)}.gn-menu.menu-full-screen{width:100vw !important}.gn-menu_wrap{max-width:92vw;width:335px;background:var(--menu-background);color:var(--menu-text-color);padding:calc(var(--bar-vertical-padding) + 1px) 0 0;box-shadow:0 0 36px 0 rgba(0, 0, 0, 0.8);position:relative;pointer-events:all;-webkit-margin-after:36px;margin-block-end:36px;opacity:0;outline:none;transition:transform 0.2s ease, opacity 0.2s ease;overflow:hidden}.gn-menu_wrap.has-promotion{padding:var(--menu-padding) 0 0}.gn-menu.open{z-index:var(--nano-layer-index-dropdown, 300);transition:z-index 0.01s ease}.gn-menu.open .gn-menu_wrap{opacity:1;transform:translate3d(0, 0, 0) !important;transition:transform 0.2s ease 0.01s, opacity 0.2s ease 0.01s}.gn-menu_actions{-webkit-padding-end:calc(var(--menu-padding) / 2);padding-inline-end:calc(var(--menu-padding) / 2);display:flex;justify-content:space-between}.gn-menu_actions-counter{background:#d0021b;color:var(--menu-text-color);position:absolute;inset-block-end:4px;inset-inline:auto 0;font-size:9px;height:14px;line-height:14px;width:auto;min-width:14px;border-radius:50%;box-sizing:border-box;text-align:center;text-indent:0}.gn-menu .content-wrap{position:relative;transition:0.2s ease min-height;min-height:190px}.gn-menu .content--sub{padding:var(--menu-padding) 0 var(--menu-padding) 7px}.gn-menu .menu-btn{-webkit-margin-end:auto;margin-inline-end:auto}.gn-menu .nav-links{display:flex;flex-wrap:wrap}.gn-menu .nav-links ::slotted(nano-nav-item),.gn-menu .nav-links nano-nav-item{--icon-size:14px;--display:inline-block;--secondary-bg-color:#001a21;--padding-top:10px;--padding-bottom:10px;--padding-end:calc(var(--menu-padding) * 2);--padding-start:calc(var(--menu-padding) + 3px);--color:var(--menu-text-color);--color-hover:var(--menu-title-text);--bg-color-hover:transparent;--bg-color-focus:#002530;--focus-outline:none;width:100%}.gn-menu .nav-links .user-nav{--bg-color:var(--menu-user-panel-bg);--padding-top:9px;--padding-bottom:9px;font-weight:bold;margin:5px 0 0}.gn-menu .nav-links .user-nav ::slotted(nano-nav-item),.gn-menu .nav-links .user-nav nano-nav-item{font-weight:400;--bg-color:transparent}.gn-menu .nav-links .user-nav .content{padding:0;background-color:var(--menu-user-panel-bg)}.gn-menu .nav-links .user-nav .content--sub{padding-inline:var(--menu-padding)}.gn-menu .nav-links .user-nav .back-btn{-webkit-padding-start:var(--menu-padding);padding-inline-start:var(--menu-padding)}.gn-menu .nav-links_title{margin:0 var(--menu-padding) 4px;-webkit-border-after:1px solid var(--menu-hint-color);border-block-end:1px solid var(--menu-hint-color);-webkit-padding-after:8px;padding-block-end:8px;text-transform:uppercase;color:var(--menu-title-text);letter-spacing:1px;font-weight:700}.gn-menu .nav-links_title--sites{-webkit-border-after:none;border-block-end:none}.gn-menu .nav-links-wrap{margin:18px 0}.gn-menu .nav-links-wrap:last-child{-webkit-margin-after:0;margin-block-end:0}.gn-menu .nav-links .back-btn{-webkit-border-before:1px solid var(--menu-hint-color);border-block-start:1px solid var(--menu-hint-color);-webkit-border-after:1px solid var(--menu-hint-color);border-block-end:1px solid var(--menu-hint-color);display:flex;align-items:center;padding:10px 11px 10px 0;width:100%;font-size:12px;text-transform:uppercase;color:var(--menu-title-text);letter-spacing:1px;font-weight:700;cursor:pointer;font-stretch:expanded}.gn-menu .nav-links .back-btn:hover{color:var(--menu-text-color)}.gn-menu .nav-links .back-btn nano-icon{-webkit-margin-end:10px;margin-inline-end:10px;font-size:12px;color:var(--menu-icon-color)}.gn-menu .nav-links--sub{display:flex;flex-wrap:wrap}.gn-menu .nav-links--sub ::slotted(nano-nav-item),.gn-menu .nav-links--sub nano-nav-item{--border-bottom:none;--padding-end:var(--menu-padding);--padding-start:var(--menu-padding);--padding-top:8px;--padding-bottom:8px;margin:0;width:50%;line-height:1.8}.gn-menu .nav-links--sites ::slotted(nano-nav-item),.gn-menu .nav-links--sites nano-nav-item{width:100%}.gn-menu .nav-links .content{padding:8px var(--menu-padding)}.gn-menu .login-btn{padding-inline:7px var(--menu-padding);padding-block:var(--menu-padding)}.gn-menu .login-btn nano-icon{-webkit-margin-start:10px;margin-inline-start:10px}.gn-menu .logout-btn{justify-content:flex-end}.gn-menu .logout-btn a{padding:0 5px}.mask{opacity:0;background:rgba(0, 0, 0, 0.3);position:fixed;inset-inline:0;inset-block-start:0;height:100vh;z-index:-1;transition:transform 0.2s ease, opacity 0.2s ease, visibility 0.01s ease 0.2s, z-index 0.01s ease 0.2s;visibility:hidden}.mask.open{opacity:1;transition:z-index 0.01s ease, visibility 0.01s ease, transform 0.2s ease 0.01s, opacity 0.2s ease 0.01s;z-index:var(--nano-layer-index-mask, 10);visibility:visible}.search-btn::before{content:"";background-color:#0c5a71;height:9px;inset-inline:0 5px;inset-block-end:-20px;position:absolute;transform:translateZ(0) scaleX(0);transform-origin:0;transition:0.2s ease transform}.search-btn--open::before{transform:translateZ(0) scaleX(1);opacity:0.7}.search-bar{height:0;overflow:hidden;transition:0.2s ease height;padding:0 var(--bar-item-spacing);outline:none;max-width:45em;-webkit-margin-start:auto;margin-inline-start:auto;}.search-bar .search-widget{margin:0;overflow:inherit;max-width:none;max-height:none;min-width:auto;-webkit-padding-end:0;padding-inline-end:0}.search-bar .search-widget .search-icon--search{display:none}.search-bar .search-widget .search-input{--input-border-width:2px 0 0 0;--input-bg-color:#f3f3f3;--nano-input-border-color:transparent;--nano-input-border-color--focus:var(--bar-color-shade);font-size:1.1875em}.search-bar .search-widget nano-select.search-input{--input-border-width:2px 3px 0 0;--input-bg-color:var(--bar-color-shade);--input-bg-color--focus:#f3f3f3;color:#f3f3f3}.search-bar .search-widget nano-select.search-input.has-focus{color:var(--bar-color-shade)}.search-bar .search-widget .select-input__arrow{font-size:0.75em}.search-bar .search-widget .select__mask.sc-nano-select{line-height:2.35em;min-height:2.35em;-webkit-padding-before:2px;padding-block-start:2px}.search-bar .search-inputs{padding:0;margin:0}.search-bar .search-autocomplete{inset-block-start:100%;width:100%}.search-widget{-webkit-padding-end:var(--bar-item-spacing);padding-inline-end:var(--bar-item-spacing);-webkit-margin-start:var(--bar-item-spacing);margin-inline-start:var(--bar-item-spacing);-webkit-margin-end:auto;margin-inline-end:auto;position:relative;flex:1 1 auto;max-width:500px;min-width:350px;max-height:36px;inset-block-start:-1px}.search-inputs{display:flex;margin:0}.search-inputs input[type=submit]{display:none}.search-autocomplete{position:absolute;inset-block-start:calc(100% + 15px);width:calc(100% - var(--bar-item-spacing));inset-inline-start:0;background:white;border:2px solid var(--bar-color-tint);border-radius:0 0 5px 5px;color:#4a4a4a;-webkit-padding-before:calc(var(--bar-vertical-padding) / 2);padding-block-start:calc(var(--bar-vertical-padding) / 2);-webkit-padding-end:0;padding-inline-end:0;-webkit-padding-after:1px;padding-block-end:1px;-webkit-padding-start:0;padding-inline-start:0;z-index:1}.search-autocomplete-hit{padding-block:calc(var(--bar-vertical-padding) / 4);padding-inline:var(--bar-item-spacing);width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:block;text-align:start;line-height:1.5;cursor:pointer}.search-autocomplete-hit-scope{color:#a7b0b3;font-weight:600}.search-autocomplete-hit:hover,.search-autocomplete-hit:focus-visible{background-color:#e4e6e8}.search-autocomplete-hit:focus-visible{box-shadow:var(--nano-control-focus-shadow, 0 0 0 0.1875rem var(--nano-control-focus-color, rgba(144, 198, 231, 0.8)))}.search-autocomplete-hit:focus{outline:none}.search-autocomplete-hit .search__highlight,.search-autocomplete-hit em{font-weight:bold;font-style:normal}.search-autocomplete-hit--no-result:hover,.search-autocomplete-hit--no-result:focus{background:none !important}.search-autocomplete-foot{margin:7px 0 0}.search-autocomplete-submit{background:none;border:none;align-self:normal;padding:9px var(--bar-item-spacing) !important;cursor:pointer;display:flex;align-items:center;color:#007495;justify-content:flex-end;width:100%;text-decoration:underline;-webkit-border-before:1px solid #e8eaea;border-block-start:1px solid #e8eaea}.search-autocomplete-submit:hover,.search-autocomplete-submit:focus{background-color:#e4e6e8}nano-select.search-input{--input-border-width:0 0 2px 0;--input-text-color:var(--bar-text-color);--nano-input-border-color:rgb(103 138 154);--padding-end:var(--bar-item-spacing);--nano-input-border-color--focus:black;font-stretch:condensed;font-weight:600;letter-spacing:1.5px;font-size:1.2em;flex:0 1 auto;width:auto;display:flex;align-items:center;flex-direction:column;position:relative;inset-inline-start:1px;text-transform:uppercase}:host(:not(.ready)) nano-select.search-input{overflow:hidden;max-height:1em}nano-select.search-input .down-arrow{font-size:0.65em}nano-input.search-input{--clear-btn-color:var(--bar-text-color);--nano-input-border-color:rgb(103 138 154);--input-border-width:0 0 2px 0;--placeholder-color:var(--bar-text-color);--input-text-color:var(--bar-text-color);--padding-start:21px;--nano-input-border-color--focus:black;font-size:1.2em;width:206px;display:flex;align-items:center;flex-direction:column;flex:1}:host(:dir(rtl)) nano-input.search-input{--input-border-radius:5px 0 0 5px}:host-context([dir=rtl]) nano-input.search-input{--input-border-radius:5px 0 0 5px}:host(:not(.ready)) nano-input.search-input{overflow:hidden;max-height:1em}nano-input.search-input .search-icon{background:none;padding:0 8px;display:none;font-size:0.9em}nano-input.search-input .search-icon--show{display:flex !important}nano-input.search-input .search-icon--loader{animation:spin 1s linear infinite}@keyframes spin{100%{transform:rotate(360deg)}}nano-input.search-input .search-icon nano-icon{height:1.4em}.user-profile{display:flex;justify-content:space-between;align-items:center;padding:2em;background-color:var(--menu-user-profile-bg)}.user-profile .left{display:flex;align-items:center}.user-profile .avatar-container{position:relative}.user-profile .avatar-container img.avatar{border-radius:50px}.user-profile .avatar-container img.logo-small{position:absolute;height:30px;width:30px;inset-block-end:0;inset-inline-end:0;background-color:#27586e;border-radius:10px;padding:5px}.user-profile .user-details{display:flex;flex-direction:column;margin:0 1.25em;color:white}.user-profile .user-details .name{font-size:1.25em}.user-profile .user-details .bio{margin:0.5em 0}.user-profile .user-details .kudos span{background-color:#81c7eb;color:#415958;padding:0.25em;border-radius:0.5em;font-weight:bold}.user-profile .chevron-right{font-size:1.5em;color:white}.user-links{position:relative}.user-links .icon-btn{-webkit-padding-end:0;padding-inline-end:0;font-weight:400;padding:7px}.user-links .icon-btn nano-icon{-webkit-margin-start:5px;margin-inline-start:5px;width:16px;height:16px;transform-origin:center;transition:transform 0.2s ease, color 0.2s ease}.user-links .icon-btn.open nano-icon{transform:rotate(180deg);color:#007495}.user-links-panel{display:none;position:absolute;border-radius:4px 0 4px 4px;box-shadow:0 1px 5px 0 rgba(0, 0, 0, 0.4);background-color:#568c9d;opacity:0;transform:translate3d(0, 30px, 0);transition:transform 0.2s ease, opacity 0.2s ease;inset-inline-end:0;min-width:318px;z-index:2}.user-links-panel:focus{outline:none}.user-links-panel.show{opacity:1;transform:translate3d(0, calc(var(--padding) + 1px), 0)}.user-links-panel-content{padding:0 18px;display:flex;flex-direction:column;color:white}.user-links-panel-content a{padding:11px 0;-webkit-border-after:#669dac 1px solid;border-block-end:#669dac 1px solid}.user-links-panel-content a:hover,.user-links-panel-content a:focus{color:#455556}.user-links-panel-content a:last-child{-webkit-border-after:none;border-block-end:none}.user-links-panel-foot{background-color:#aac5cd;border-radius:0 0 4px 4px;padding:var(--padding);color:#455556;display:flex;align-items:center;font-weight:400;justify-content:space-between}.user-links-panel-foot a:hover{text-decoration:underline}.user-links-panel .user-profile{background-color:var(--bar-user-panel-bg)}:host{--bar-vertical-padding:21px;--bar-item-spacing:13px;--bar-background:white;--bar-text-color:#196c82;--bar-color-shade:rgb(12 90 113);--bar-color-tint:rgb(19 89 111);--bar-color-focus:#99a3a6;--bar-user-panel-bg:#016d86;--bar-dropdown-bg:#196c82;--bar-dropdown-text:white;--menu-background:#001a21;--menu-text-color:white;--menu-user-profile-bg:#001a21;--menu-user-panel-bg:#193037;--menu-padding:12px;--menu-hint-color:#33484d;--menu-title-text:#90c6e7;--menu-icon-color:white;--login-button-bg:#17bb75;--login-button-text:white;--padding:12px;--padding-top:var(--padding);--padding-end:var(--padding);--padding-bottom:var(--padding);--padding-start:var(--padding);display:flex;flex-direction:column;position:relative;line-height:1.5;height:100%;font-size:0.9375em;font-size:clamp(0.77rem, 1vw, 0.9rem)}:host input,:host select,:host button{font-family:inherit;-webkit-appearance:none;appearance:none;font-size:inherit}:host a:focus,:host button:focus{outline:none}:host a:focus-visible,:host button:focus-visible{box-shadow:var(--nano-control-focus-shadow, 0 0 0 0.1875rem var(--nano-control-focus-color, rgba(144, 198, 231, 0.8)))}';const b={about:0,main:1,login:2,search:3,icon:4};const m=class{constructor(n){t(this,n);this.nanoIsReady=i(this,"nanoIsReady",7);this.nanoSearchResult=i(this,"nanoSearchResult",7);this.nanoSearchError=i(this,"nanoSearchError",7);this.nanoSearchReset=i(this,"nanoSearchReset",7);this.currSize=0;this.thresholdsGoingUp=false;this.THRESHOLDLIMIT=Object.keys(b).length;this.autocompleteEles=[];this.currAIndex=-1;this.isLoggedIn=false;this.myAccData=null;this.aboutNavItms=[];this.siteNavItms=[];this.loggedInNavItms=[];this.setResizingState=(t=false)=>{if(typeof this.debounceSetResizingState==="undefined"){this.debounceSetResizingState=c(this.setResizingState,600)}if(t){this.isResizing=true;this.debounceSetResizingState()}else{this.isResizing=false;this.thresholdsGoingUp=false}};this.onMenuBtnKeyDown=t=>{switch(t.key){case"Enter":case" ":this.modalOpen?this.menuClose(t,true):this.menuOpen();break}};this.onMenuBtnClick=t=>{this.menuClose(t,true)};this.menuOpen=t=>{if(t)t.preventDefault();this.menuDiv.style.display="block";this.modalOpen=true;this.menuWrapDiv.focus({preventScroll:true});if(this.threshold<2||this.menuWrapDiv.scrollHeight>window.innerHeight){document.body.style.overflow="hidden";this.menuFullScreen=true}else document.body.style.overflowX="hidden";setTimeout((()=>this.modalIsOpen=true),300)};this.onMenuHidden=()=>{this.menuDiv.removeEventListener("transitionend",this.onMenuHidden);document.body.style.overflow="";this.menuDiv.style.display="none";this.modalIsOpen=false;this.menuFullScreen=false;setTimeout((()=>{if(document.activeElement===document.body&&this.menuBtn)this.mainBarDiv.focus({preventScroll:true})}),50)};this.subMenuClose=t=>{t.preventDefault();t.target.closest("nano-nav-item").open=false};this.onUserBtnClick=t=>{t.preventDefault();this.userMenuOpen=!this.userMenuOpen};this.onUserBtnKeyDown=t=>{switch(t.key){case"Enter":case" ":this.userMenuOpen=!this.userMenuOpen;break}};this.onUserMenuBlur=t=>{if(!t.relatedTarget){this.userMenuOpen=false;return}if(!!t.relatedTarget.closest(".user-links-panel"))return false;this.userMenuOpen=false};this.onSearchBtnClick=t=>{t.preventDefault();if(!this.searchBarShown)this.searchbarShow();else this.searchbarHide()};this.onSearchBtnKeyDown=t=>{switch(t.key){case"Enter":case" ":this.searchBarShown?this.searchbarHide():this.searchbarShow();break}};this.onSearchBarShown=()=>{this.searchBarEl.removeEventListener("transitionend",this.onSearchBarShown);if(this.searchInput)this.searchInput.setFocus();this.searchBarEl.style.overflow="visible"};this.searchbarHide=t=>{if(t&&t.relatedTarget&&t.relatedTarget.closest("#global-nav-search-bar"))return;this.showAutocomplete=false;if(this.searchValInternal.length&&t)return;this.searchBarEl.addEventListener("transitionend",this.onSearchBarHidden);this.searchBarEl.style.overflow="hidden";this.searchBarEl.style.height="0px"};this.onSearchBarHidden=()=>{this.searchBarEl.removeEventListener("transitionend",this.onSearchBarHidden);this.searchBarEl.style.display="none";this.searchBarShown=false};this.onSearchInput=t=>{this.searchValInternal=this.searchInput.value;if(!this.isSearchValSet()){this.searchLoading=false;return}if(t.detail.type==="input"){this.showAutocomplete=false;this.searchLoading=true}};this.onSearchChange=async t=>{this.searchValInternal=this.searchValue=t?t.detail.value:this.searchValInternal;this.showAutocomplete=false;this.autocompleteResults=null;if(!this.isSearchValSet()){if(!this.searchValInternal.length){this.nanoSearchReset.emit()}this.searchLoading=false;return}if(!this.currentIndex)this.currentSelectedIndex();try{this.autocompleteResults=this.processSearchResults(await this.currentIndex.alogliaIndex.search(this.searchValInternal,{attributesToSnippet:["body:5","title:8"],hitsPerPage:5,filters:"created > "+Math.floor((Date.now()-631152e5)/1e3)}))}catch(t){console.error(t)}this.scopeSearch=null;this.scopeSearch=await this.onSearchSubmit(null,false);this.searchLoading=false;this.showAutocompleteResults()};this.onSearchSubmit=async(t,i=true)=>{if(t)t.preventDefault();if(!this.isSearchValSet())return;this.searchLoading=true;this.algoliaSearchResults=null;if(!this.currentIndex)this.currentSelectedIndex();const e=this.internalSearchIndeces.map((t=>({indexName:t.index,query:this.searchValInternal,facets:t.filters,hitsPerPage:10,filters:"created > "+Math.floor((Date.now()-631152e5)/1e3)})));try{this.algoliaSearchResults=this.processSearchResults(await this.algoliaClient.search(e))}catch(t){this.nanoSearchError.emit(t)}this.searchLoading=false;if(!this.algoliaSearchResults)return;this.algoliaSearchResults.results.map(((t,i)=>{t.indexName=this.internalSearchIndeces[i].name;t.selected=this.currentIndex.name===this.internalSearchIndeces[i].name;t.domain=this.currentIndex.domain||null;t.domains=this.myAccData.domains||null;t.allGroup=!!this.internalSearchIndeces[i].allGroup;t.filters=this.internalSearchIndeces[i].filters}));if(i){this.nanoSearchResult.emit({results:this.algoliaSearchResults.results,client:{apiKey:this.searchApiKey,appId:this.searchAppId}});this.showAutocomplete=false}return this.algoliaSearchResults};this.onSearchIndexChange=async t=>{const i=t;let e=t;if(!this.currentIndex)this.currentSelectedIndex();if(i.detail&&i.detail.value.length)e=i.detail.value;if(!e||!e.length)return;if(this.currentIndex.index===e)return;const n=this.internalSearchIndeces.find((t=>t.index===e));if(!n||!n.alogliaIndex)return;this.searchIndex=n.index;if(this.isSearchValSet())await this.onSearchChange()};this.switchIndexSubmit=async t=>{if(this.isSearchValSet()){await this.onSearchIndexChange(t);this.onSearchSubmit()}else this.onSearchIndexChange(t)};this.onAutocompleteBlur=t=>{if(!this.showAutocomplete||!this.autocompleteResults)return;if(t&&t.target&&t.target.closest(".search-widget"))return;this.showAutocomplete=false};this.showAutocompleteResults=()=>{if(!this.autocompleteResults||!this.autocompleteResults.hits)return;this.showAutocomplete=true};this.onAutocompleteInteract=t=>{if(!this.showAutocomplete||!this.autocompleteResults)return;let i=this.currAIndex;switch(t.key){case"Tab":setTimeout((()=>{if(!this.el.shadowRoot.activeElement||!this.el.shadowRoot.activeElement.closest(".search-widget")){this.showAutocomplete=false;return}else{const t=this.autocompleteEles.find(((t,i)=>{if(t===this.el.shadowRoot.activeElement){this.currAIndex=i;return true}}));if(t)this.setActiveElement(t);else this.currAIndex=-1}}));break;case"ArrowDown":case"ArrowUp":if(t.key==="ArrowDown")i++;else if(t.key==="ArrowUp")i--;const e=this.autocompleteEles[i];if(e||i<0||i>this.autocompleteEles.length-1)t.preventDefault();if(e){this.setActiveElement(e);this.currAIndex=i}else if(i<0){this.searchInput.setFocus();this.currAIndex=-1}break;case"Enter":case" ":if(this.autocompleteEles[this.currAIndex]){this.autocompleteEles[this.currAIndex].click()}break}};this.assessSlottedContent=()=>{e((()=>{this.hasSiteSlot=!!this.el.querySelectorAll('[slot="site"]').length;this.hasLoggedinSlot=!!this.el.querySelectorAll('[slot="loggedin"]').length;this.hasPromotionSlot=!!this.el.querySelectorAll('[slot="promotion"]').length;this.aboutSlotLen=this.el.querySelectorAll('[slot="about"]').length;this.iconSlotLen=this.el.querySelectorAll('[slot="icon"]').length;this.mainSlotLen=this.el.querySelectorAll('[slot="main"]').length;this.overflowSlotLen=this.el.querySelectorAll('[slot="overflow"]').length;this.searchSlotLen=this.el.querySelectorAll('[slot="search"]').length}))};this.userProfileUrl="";this.hasLoggedinSlot=false;this.hasSiteSlot=false;this.hasPromotionSlot=false;this.aboutSlotLen=0;this.iconSlotLen=0;this.mainSlotLen=0;this.overflowSlotLen=0;this.searchSlotLen=0;this.thresholdReady=false;this.remoteDataReady=false;this.ready=false;this.isResizing=false;this.intersectRatio=undefined;this.threshold=this.THRESHOLDLIMIT;this.modalOpen=false;this.modalIsOpen=false;this.searchBarShown=false;this.scrollingUp=true;this.showAutocomplete=false;this.secondaryMenuOpen=null;this.userMenuOpen=false;this.menuFullScreen=false;this.searchLoading=false;this.searchValInternal="";this.internalSearchIndeces=[];this.env="prod";this.ssoDataUrl=undefined;this.myAccountData=undefined;this.ssoRedirect=encodeURIComponent(window.location.href);this.getMyAccountData=true;this.activeMyAccountSections=null;this.showSearch=true;this.showLogo=true;this.logoUrl=location.protocol+"//"+location.host;this.searchIndeces=[];this.myAccountUser=null;this.searchAppId=undefined;this.searchApiKey=undefined;this.searchValue="";this.searchIndex="all_prod_en";this.cartCount=0;this.msgCount=0;this.cartUrl=null;this.msgUrl=null;this.assessSlottedContent=c(this.assessSlottedContent.bind(this),10)}handleMyAccountData(){if(!this.myAccountData)return;if(!this.myAccountData.user||!this.myAccountData.links)return;this.myAccData=this.myAccountData;if(this.myAccData.user.id){this.isLoggedIn=true;this.myAccountUser=this.myAccData.user}this.processMyAccLinks();this.processMyAccData();this.remoteDataReady=true}async submitSearch(){this.onSearchSubmit();this.showAutocomplete=false;return}async toggleOverflowMenu(t){if(t===true||t===undefined&&!this.modalIsOpen){this.menuOpen()}else{this.menuClose(null,true)}}async getMyAccData(){if(!!this.myAccData)return;switch(this.env){case"prod":this.userProfileUrl="https://myaccount.nanoporetech.com/";case"local":case"dev":case"test":default:this.userProfileUrl="https://myaccount.nanoporetech.com/";break}if(!this.getMyAccountData||this.myAccData){this.remoteDataReady=true;return}let t=this.ssoDataUrl;if(!t){switch(this.env){case"dev":t="https://myaccount-dev.nanoporetech.com/";break;case"test":t="https://myaccount-test.nanoporetech.com/";break;default:t="https://myaccount.nanoporetech.com/";break}}const i={timeout:5e3};try{if(this.env==="local"){this.myAccData=await import("./p-2155fc2c.js")}else{this.myAccData=await p(t+"nav_bar_data.json",i)}if(this.myAccData.user.id){this.isLoggedIn=true;this.myAccountUser=this.myAccData.user}this.processMyAccLinks();this.processMyAccData();setTimeout((()=>this.remoteDataReady=true),300)}catch(t){console.error(t);this.remoteDataReady=true}}currentSelectedIndex(){if(!this.internalSearchIndeces.length){return}if(!this.searchIndex)return this.internalSearchIndeces[0];const t=this.internalSearchIndeces.find((t=>t.index===this.searchIndex));if(!t){this.currentIndex=this.internalSearchIndeces[0];console.error("index not found");return}this.currentIndex=t;return t}changeInternalSearchVal(){if(this.searchValInternal!==this.searchValue)this.searchValue=this.searchValInternal}initAlgoliaClient(){if(!this.searchAppId||!this.searchApiKey)return;this.algoliaClient=h(this.searchAppId,this.searchApiKey);this.addAlgoliaIndeces()}addIndeces(){this.internalSearchIndeces=[...this.internalSearchIndeces,...this.searchIndeces]}addAlgoliaIndeces(){if(!this.algoliaClient||!this.internalSearchIndeces.length)return;this.internalSearchIndeces.forEach((t=>{t.alogliaIndex=this.algoliaClient.initIndex(t.index)}));if(!this.searchIndex)this.searchIndex=this.internalSearchIndeces[0].index}thresholdChange(t,i){if(t>i){this.thresholdsGoingUp=true;this.setResizingState(true)}}ratioChange(){if(this.intersectRatio<1&&this.threshold>0){if(this.thresholdsGoingUp)this.setResizingState(true);this.threshold--;setTimeout((()=>this.ratioChange()),500)}else{this.thresholdReady=true;let t,i;e((()=>{t=[...Array.from(this.el.querySelectorAll('nano-nav-item[slot="site"]')),...Array.from(this.el.querySelectorAll('nano-nav-item[slot="overflow"]'))];i=[];if(this.threshold<this.THRESHOLDLIMIT-b.icon)t.push(...Array.from(this.el.querySelectorAll('nano-nav-item[slot="icon"]')));else i.push(...Array.from(this.el.querySelectorAll('nano-nav-item[slot="icon"]')));if(this.threshold<this.THRESHOLDLIMIT-b.login)t.push(...Array.from(this.el.querySelectorAll('nano-nav-item[slot="loggedin"]')));else i.push(...Array.from(this.el.querySelectorAll('nano-nav-item[slot="loggedin"]')));if(this.threshold<this.THRESHOLDLIMIT-b.main)t.push(...Array.from(this.el.querySelectorAll('nano-nav-item[slot="main"]')));else i.push(...Array.from(this.el.querySelectorAll('nano-nav-item[slot="main"]')));if(this.threshold<this.THRESHOLDLIMIT-b.about)t.push(...Array.from(this.el.querySelectorAll('nano-nav-item[slot="about"]')));else i.push(...Array.from(this.el.querySelectorAll('nano-nav-item[slot="about"]')))}));n((()=>{t.forEach((t=>{t.classList.add("nano-global-nav-menu");t.classList.remove("nano-global-nav-bar")}));i.forEach((t=>{t.classList.remove("nano-global-nav-menu");t.classList.add("nano-global-nav-bar")}))}))}}assessReady(){if(this.thresholdReady&&this.remoteDataReady){this.ready=true}}remoteReady(){this.attachIO()}isReady(){this.nanoIsReady.emit()}setupAutocompleteBlur(){if(this.showAutocomplete){this.el.shadowRoot.addEventListener("click",this.onAutocompleteBlur)}else{this.el.shadowRoot.removeEventListener("click",this.onAutocompleteBlur)}}closeSearchBar(){if(!!this.secondaryMenuOpen&&this.searchBarShown)this.searchbarHide()}slotChange(){this.threshold=this.THRESHOLDLIMIT;if(this.ready)this.ratioChange()}thresholdClasses(){const t=[];let i=0;for(i;i<this.threshold;i++)t.push("threshold-"+(i+1));return t}onWindowResize(){if(this.threshold<this.THRESHOLDLIMIT&&window.innerWidth>this.currSize){this.threshold=this.THRESHOLDLIMIT;this.ratioChange()}this.currSize=window.innerWidth;this.searchBarShown=false}secondaryOpen(t){if(!t.detail.secondaryMenu)return;t.stopPropagation();this.secondaryMenuOpen=t.target;if(!this.menuSelectedItems){this.menuSelectedItems=this.el.querySelectorAll("nano-nav-item.selected");this.menuSelectedItems.forEach((t=>t.classList.remove("selected")));this.menuSelectedItems.forEach((t=>t.selected=false))}this.menuContentDiv.style.minHeight=t.detail.secondaryMenu.scrollHeight+"px"}secondaryClose(t){if(!t.detail.secondaryMenu)return;t.stopPropagation();setTimeout((()=>{if(this.secondaryMenuOpen===t.target&&this.menuSelectedItems){this.secondaryMenuOpen=null;this.menuContentDiv.style.minHeight="";this.menuSelectedItems.forEach((t=>t.classList.add("selected")));this.menuSelectedItems.forEach((t=>t.selected=true));this.menuSelectedItems=null}}),300)}menuClose(t,i=false){if(!this.modalIsOpen)return;if(i){this.modalOpen=false;this.menuDiv.addEventListener("transitionend",this.onMenuHidden);return}if(!t.composedPath().some((t=>{var i;return t===this.menuContentDiv||((i=t.classList)===null||i===void 0?void 0:i.contains("gn-menu_actions"))}))){requestAnimationFrame((()=>{if(!!this.secondaryMenuOpen)return;this.modalOpen=false;this.menuDiv.addEventListener("transitionend",this.onMenuHidden)}))}}async handleUserMenu(){await d(this.userLinkPanel,{className:"show",show:this.userMenuOpen});if(this.userMenuOpen){this.userLinkPanel.focus();this.userLinkPanel.addEventListener("focusout",this.onUserMenuBlur)}else{this.userLinkPanel.removeEventListener("focusout",this.onUserMenuBlur);this.el.focus()}}searchbarShow(){this.searchBarShown=true;this.searchBarEl.addEventListener("transitionend",this.onSearchBarShown);this.searchBarEl.style.display="block";setTimeout((()=>{const t=Math.floor(this.searchBarEl.querySelector(".search-widget").scrollHeight)-1;this.searchBarEl.style.height=t.toString()+"px"}),50)}autocompleteSnippet(t){const i=["title"];if(t._snippetResult){const e=i.find((i=>t._snippetResult[i]&&t._snippetResult[i].matchLevel!=="none"));if(e){if(e!=="title")return(t.title.length>15?t.title.substring(0,15)+" ...":t.title)+" "+t._snippetResult[e].value;else return t._snippetResult["title"].value}}return t.title}isSearchValSet(){if(this.searchValInternal.length<3)return false;return true}resetHitFocus(){this.currAIndex=-1}setActiveElement(t){this.autocompleteEles.map((t=>t.setAttribute("aria-selected","false")));t.focus({preventScroll:true});t.setAttribute("aria-selected","true")}attachIO(){if(this.io)return;const t=this.el.shadowRoot.querySelector(".global-nav .main-bar");if(typeof window!=="undefined"&&window.IntersectionObserver&&!!t){const i=this.io=new window.IntersectionObserver((t=>{this.intersectRatio=t.slice(-1)[0].intersectionRatio}),{root:t,threshold:1});i.observe(t.querySelector(".measure-ele"))}}componentDidLoad(){{this.debounceResize=c(this.onWindowResize.bind(this),300);window.addEventListener("resize",this.debounceResize);this.currSize=window.innerWidth}this.initAlgoliaClient();this.addAlgoliaIndeces();if(this.remoteDataReady)this.attachIO()}componentWillLoad(){l.init(this,["searchIndex","searchValue"],"url-hash","gns");this.assessSlottedContent()}disconnectedCallback(){if(this.io){this.io.disconnect();this.io=undefined}if(this.mo){this.mo.disconnect();this.mo=undefined}window.removeEventListener("resize",this.debounceResize)}connectedCallback(){this.handleMyAccountData();this.getMyAccData()}autocompleteList(){let t;if(this.showAutocomplete&&this.scrollingUp){let i=0;let e=0;const n=(t,i)=>i.index!==this.currentIndex.index?t+i.hits.length:t;const a=(t,i)=>i.index===this.currentIndex.index?t+i.hits.length:t;if(this.scopeSearch){e=this.scopeSearch.results.reduce(n,0);i=this.scopeSearch.results.reduce(a,0)}if(this.autocompleteResults&&this.autocompleteResults.hits.length||e&&!i){let e=0;t=s("div",null,!i&&s("div",{class:"search-autocomplete-hit search-autocomplete-hit--no-result"},"No results matching '",this.searchValInternal,"' were found in"," ",s("strong",null,this.currentIndex.name),". Try another phrase."),this.autocompleteResults&&[this.autocompleteResults.hits.map(((t,i)=>s("a",{role:"option",ref:t=>this.autocompleteEles.push(t),tabindex:"-1",id:"autocomplete-hit-"+i,href:t.url,class:"search-autocomplete-hit",innerHTML:this.autocompleteSnippet(t)})))],(!i||this.currentIndex.allGroup)&&this.scopeSearch&&this.scopeSearch.results&&[this.scopeSearch.results.map(((t,i)=>{if(!t.hits.length||t.index===this.currentIndex.index||e>1)return;e++;return s("button",{role:"option",ref:t=>this.autocompleteEles.push(t),tabindex:"-1",id:"autocomplete-scope-"+i,class:"search-autocomplete-hit",onClick:()=>this.switchIndexSubmit(t.index),onMouseDown:()=>this.switchIndexSubmit(t.index)},'"',this.searchValInternal,'"'," ",s("div",{class:"search-autocomplete-hit-scope"},"in ",t.indexName))}))],!!i&&s("div",{class:"search-autocomplete-foot"},s("button",{role:"option",class:"search-autocomplete-submit",ref:t=>this.autocompleteEles.push(t),id:"autocomplete-foot",onClick:this.onSearchSubmit,onMouseDown:this.onSearchSubmit},"View all results")))}else if(!i){t=s("div",{class:"search-autocomplete-hit search-autocomplete-hit--no-result"},"No results matching '",this.searchValInternal,"' were found. Try another phrase.")}}return s("div",{class:"search-autocomplete",role:"listbox",id:"autocomplete-results","aria-expanded":this.showAutocomplete?"true":"false",hidden:!this.showAutocomplete,onKeyDown:this.onAutocompleteInteract},t)}searchWidget(){return[s("form",{class:"search-inputs",onSubmit:this.onSearchSubmit,id:"global-nav-search"},s("nano-select",{class:"search-input",label:"Which area of content would you like to search?",hideLabel:true,showInlineError:false,value:this.searchIndex,onNanoChange:this.onSearchIndexChange,mask:true},this.internalSearchIndeces.map((t=>s("nano-option",{selected:t.index===this.searchIndex,value:t.index},t.name||t.index))),s("nano-icon",{name:"light/chevron-down",class:"select-input__arrow",slot:"down-arrow"})),s("nano-input",{class:"search-input",label:"What would you like to search for?","aria-label":"What would you like to search for",hideLabel:true,showInlineError:false,"clear-input":true,placeholder:"Search Nanopore",type:"text",ref:t=>this.searchInput=t,onNanoChange:this.onSearchChange,onNanoInput:this.onSearchInput,onKeyDown:this.onAutocompleteInteract,debounce:500,"aria-autocomplete":"list","aria-activedescendant":this.autocompleteEles[this.currAIndex]?this.autocompleteEles[this.currAIndex].id:false,"aria-controls":"autocomplete-results",onNanoFocus:this.showAutocompleteResults,value:this.searchValue,role:"textbox"},s("button",{class:{"search-icon":true,"search-icon--search":true,"search-icon--show":!!this.searchValue&&!this.searchLoading},slot:"end",onMouseDown:t=>{this.searchValInternal=this.searchInput.value;this.onSearchSubmit(t,true)}},s("nano-icon",{name:"light/search"})),s("span",{class:{"search-icon":true,"search-icon--loader":true,"search-icon--show":this.searchLoading},slot:"end"},s("nano-icon",{name:"light/spinner-third"}))),s("input",{type:"submit"}))]}render(){var t,i;this.autocompleteEles=[];const e=this.el.ownerDocument.dir==="rtl";const n=this.searchWidget();n.push(this.autocompleteList());return s(o,{class:{[this.thresholdClasses().join(" ")]:true,ready:this.ready,"search-bar-shown":this.searchBarShown&&this.scrollingUp,"search-auto-complete-shown":this.showAutocomplete&&this.scrollingUp,"modal-open":this.modalIsOpen,resizing:this.isResizing},dir:e?"rtl":null},s("div",{class:{"global-nav":true,"scrolling-down":!this.scrollingUp}},s("nav",{id:"global-nav-menu",class:{"gn-menu":true,open:this.modalOpen,"has-promotion":this.hasPromotionSlot,"menu-full-screen":this.menuFullScreen,"secondary-open":!!this.secondaryMenuOpen},"aria-expanded":this.modalOpen?"true":"false",ref:t=>this.menuDiv=t,part:"burger"},s("div",{class:"gn-menu_wrap",ref:t=>this.menuWrapDiv=t,tabindex:"-1",part:"burger-menu"},s("div",{class:"gn-menu_actions",part:"burger-actions-bar"},s("button",{class:"menu-btn icon-btn icon-btn",onMouseDown:this.onMenuBtnClick,onKeyDown:this.onMenuBtnKeyDown},this.threshold<this.THRESHOLDLIMIT-b.login&&s("nano-icon",{name:"light/times","aria-label":"close menu"}),this.threshold>=this.THRESHOLDLIMIT-b.login&&s("nano-icon",{name:"light/bars","aria-label":"close menu"})),this.threshold<this.THRESHOLDLIMIT-b.icon&&[!!this.iconSlotLen&&s("slot",{name:"icon"}),this.myAccData&&(!this.activeMyAccountSections||this.activeMyAccountSections.includes("icons"))&&[this.msgUrl&&s("a",{href:this.msgUrl,class:"icon-btn"},s("nano-icon",{name:"light/bell"}),this.msgCount>0&&s("span",{class:"gn-menu_actions-counter"},this.msgCount)),this.cartUrl&&s("a",{href:this.cartUrl,class:"icon-btn"},s("nano-icon",{name:"light/shopping-cart"}),this.cartCount>0&&s("span",{class:"gn-menu_actions-counter"},this.cartCount))]],this.myAccData&&this.myAccData.urls.login&&s("a",{href:this.myAccData.urls.login+this.ssoRedirect,class:"login-btn"},"Login / Register"," ",s("nano-icon",{name:"solid/chevron-right"}))),s("div",{class:"content-wrap",ref:t=>this.menuContentDiv=t},s("div",{class:"content",part:"burger-content"},s("nav",{class:"nav-links nav-links--main",role:"menu"},s("slot",{name:"overflow",onSlotchange:this.assessSlottedContent}),this.threshold<this.THRESHOLDLIMIT-b.main&&!!this.mainSlotLen&&s("slot",{name:"main",onSlotchange:this.assessSlottedContent})),((!!this.aboutSlotLen||!!this.aboutNavItms.length)&&this.hasSiteSlot||!!this.siteNavItms.length)&&s("div",null,(this.hasSiteSlot||!!this.siteNavItms.length)&&[(this.threshold>=this.THRESHOLDLIMIT-2||this.mainSlotLen<2)&&this.overflowSlotLen<2&&s("div",{class:"nav-links-wrap"},s("h4",{class:"nav-links_title nav-links_title--sites"},"Sites"),s("nav",{class:"nav-links nav-links--sub nav-links--sites","aria-label":"Different company site links"},s("slot",{name:"site",onSlotchange:this.assessSlottedContent}),this.siteNavItms.map((t=>s("nano-nav-item",{class:"nano-global-nav nano-global-nav-menu"},s("a",{href:t.address,target:t.target},t.title)))))),(this.threshold<this.THRESHOLDLIMIT-2&&this.mainSlotLen>=2||this.overflowSlotLen>=2)&&s("nav",{class:"nav-links","aria-label":"Different company site links"},s("nano-nav-item",{class:"nano-global-nav nano-global-nav-menu",closeOnBlur:false},"Sites",s("nano-icon",{slot:"icon-end",name:"solid/chevron-right"}),s("div",{slot:"secondary"},s("div",{class:"content"},s("button",{class:"back-btn",onClick:this.subMenuClose},s("nano-icon",{slot:"icon-end",name:"solid/chevron-left","aria-label":"go back"}),"Sites"),s("div",{class:"content--sub"},s("slot",{name:"site",onSlotchange:this.assessSlottedContent}),this.siteNavItms.map((t=>s("nano-nav-item",{class:"nano-global-nav nano-global-nav-menu"},s("a",{href:t.address,target:t.target},t.title)))))))))])),this.isLoggedIn&&this.threshold<this.THRESHOLDLIMIT-b.login&&(this.loggedInNavItms.length||this.hasLoggedinSlot)&&s("nav",{class:"nav-links","aria-label":"Your user account links"},s("nano-nav-item",{class:"nano-global-nav user-nav nano-global-nav-menu",closeOnBlur:false},this.myAccountUser.name,s("nano-icon",{slot:"icon-end",name:"solid/chevron-right"}),s("div",{slot:"secondary"},s("div",{class:"content"},s("button",{class:"back-btn",onClick:this.subMenuClose},s("nano-icon",{slot:"icon-end",name:"solid/chevron-left","aria-label":"go back"}),this.myAccountUser.name),!!((t=this.myAccountUser)===null||t===void 0?void 0:t.small_avatar_url)&&s("nano-global-nav-user-profile",{myAccountUser:this.myAccountUser,userProfileUrl:this.userProfileUrl}),s("div",{class:"content--sub"},s("slot",{name:"loggedin",onSlotchange:this.assessSlottedContent}),this.loggedInNavItms.map((t=>s("nano-nav-item",{class:"nano-global-nav nano-global-nav-menu"},s("a",{href:t.address,target:t.target},t.title)))),s("nano-nav-item",{class:"nano-global-nav nano-global-nav-menu"},s("a",{href:this.myAccData.urls.forgot_password+this.ssoRedirect},"Change Password"))))))),s("slot",{name:"promotion",onSlotchange:this.assessSlottedContent}),this.myAccData&&this.myAccData.urls.logout&&s("div",{class:"login-btn logout-btn"},s("a",{href:this.myAccData.urls.logout+this.ssoRedirect},"Logout"))))),s("div",{class:"sticker-trigger"}),s("nano-sticker",{"auto-resize":"false","break-point-max":"800",quietMode:{h:600,w:800},part:"sticker"},s("div",{class:"bars",part:"bars"},s("nav",{part:"main-bar",class:"main-bar","aria-label":"Main site navigation",tabindex:"-1",ref:t=>this.mainBarDiv=t},(this.hasPromotionSlot||!!this.overflowSlotLen||(this.myAccData||!!this.iconSlotLen)&&this.threshold<this.THRESHOLDLIMIT-b.icon||this.isLoggedIn&&(!!this.loggedInNavItms.length||this.hasLoggedinSlot)&&this.threshold<this.THRESHOLDLIMIT-b.login||!!this.mainSlotLen&&this.threshold<this.THRESHOLDLIMIT-b.main||(!!this.aboutSlotLen||!!this.aboutNavItms.length)&&this.threshold<this.THRESHOLDLIMIT-b.about||this.hasSiteSlot||!!this.siteNavItms.length)&&s("button",{class:"menu-btn icon-btn",onMouseDown:this.menuOpen,onKeyDown:this.onMenuBtnKeyDown,"aria-expanded":this.modalOpen?"true":"false","aria-controls":"global-nav-menu",ref:t=>this.menuBtn=t},s("nano-icon",{name:"light/bars","aria-label":"open menu"})),this.showLogo&&s("a",{href:this.logoUrl,class:"logo-link",part:"logo-link"},s("img",{src:a(`../nano-assets/ont-logo.svg`),alt:"Oxford Nanopore Technologies Logo",class:"logo"})),!this.showLogo&&s("div",{class:"logo-link"},s("slot",{name:"logo",onSlotchange:this.assessSlottedContent})),s("div",{class:"nav-links nav-links--main"},s("slot",{name:"main",onSlotchange:this.assessSlottedContent})),this.mainSlotLen===0&&this.threshold>=this.THRESHOLDLIMIT-b.search&&[this.showSearch&&!!this.internalSearchIndeces.length&&s("div",{class:"search-widget",role:"combobox","aria-owns":"autocomplete-results","aria-expanded":this.showAutocomplete&&this.autocompleteResults?"true":"false"},n),(!this.showSearch||!this.myAccData)&&!!this.searchSlotLen&&s("slot",{name:"search",onSlotchange:this.assessSlottedContent})],(this.mainSlotLen>0||this.threshold<this.THRESHOLDLIMIT-b.search)&&(this.showSearch&&!!this.internalSearchIndeces.length||!!this.searchSlotLen)&&s("button",{class:{"icon-btn":true,"search-btn":true,"search-btn--open":this.searchBarShown},"aria-controls":"global-nav-search-bar","aria-expanded":this.searchBarShown?"true":"false",onMouseDown:this.onSearchBtnClick,onKeyDown:this.onSearchBtnKeyDown},s("nano-icon",{name:"light/search"})),this.threshold>=this.THRESHOLDLIMIT-b.icon&&[!!this.iconSlotLen&&s("slot",{name:"icon"}),this.myAccData&&(!this.activeMyAccountSections||this.activeMyAccountSections.includes("icons"))&&[this.msgUrl&&s("a",{href:this.msgUrl,class:"icon-btn"},s("nano-icon",{name:"light/bell"}),this.msgCount>0&&s("span",{class:"gn-menu_actions-counter"},this.msgCount)),this.cartUrl&&!!this.cartCount&&s("a",{href:this.cartUrl,class:"icon-btn"},s("nano-icon",{name:"light/shopping-cart"}),this.cartCount>0&&s("span",{class:"gn-menu_actions-counter"},this.cartCount))]],(!!this.aboutSlotLen||!!this.aboutNavItms.length)&&this.threshold>=this.THRESHOLDLIMIT-b.about&&s("nav",{class:"nav-links nav-links--sub","aria-label":"About the company. Links",role:"menu"},s("slot",{name:"about",onSlotchange:this.assessSlottedContent}),!!this.aboutNavItms.length&&s("nano-nav-item",{class:"nano-global-nav nano-global-nav-bar"},s("a",{href:this.aboutNavItms[0].address,target:this.aboutNavItms[0].target},this.aboutNavItms[0].title))),this.myAccData&&(!this.activeMyAccountSections||this.activeMyAccountSections.includes("loggedin"))&&this.threshold>=this.THRESHOLDLIMIT-b.login&&[this.myAccData.urls.login&&s("a",{href:this.myAccData.urls.login+this.ssoRedirect,class:"login-btn"},"Login / Register"),this.myAccountUser&&s("div",{class:"user-links"},s("button",{class:{"icon-btn":true,"user-links-btn":true,open:this.userMenuOpen},onMouseDown:this.onUserBtnClick,onKeyDown:this.onUserBtnKeyDown}," ",this.myAccountUser.name,s("nano-icon",{name:"solid/caret-down"})),s("div",{class:"user-links-panel",tabindex:"-1",ref:t=>this.userLinkPanel=t},!!((i=this.myAccountUser)===null||i===void 0?void 0:i.small_avatar_url)&&s("nano-global-nav-user-profile",{myAccountUser:this.myAccountUser,userProfileUrl:this.userProfileUrl}),s("div",{class:"user-links-panel-content"},this.loggedInNavItms.map((t=>s("a",{href:t.address,target:t.target},t.title)))),s("div",{class:"user-links-panel-foot"},s("a",{href:this.myAccData.urls.forgot_password+this.ssoRedirect},"Change Password"),s("a",{href:this.myAccData.urls.logout+this.ssoRedirect},"Logout"))))],s("span",{class:"measure-ele"})),(this.mainSlotLen>0||this.threshold<this.THRESHOLDLIMIT-b.search)&&s("div",{id:"global-nav-search-bar",class:{"search-bar":true,show:this.searchBarShown},"aria-expanded":this.searchBarShown?"true":"false",role:"region",tabindex:"-1",ref:t=>this.searchBarEl=t,part:"search-bar"},s("div",{class:"search-widget"},this.showSearch&&!!this.internalSearchIndeces.length&&s("div",null,n),(!this.showSearch||!this.myAccData)&&!!this.searchSlotLen&&s("slot",{name:"search",onSlotchange:this.assessSlottedContent}))))),(this.threshold<this.THRESHOLDLIMIT-b.login||this.menuFullScreen)&&s("div",{class:{mask:true,open:this.modalOpen},onClick:this.menuClose,onTouchEnd:this.menuClose})),s("div",{class:"site-content"},s("slot",null)))}domainFor(t){if(!this.myAccData)return"";const i=this.myAccData.domains.find((i=>i.origin===t));return i?i.domain:""}processSearchResults(t){const i=t;const e=t;if(i.results){i.results.forEach(((t,e)=>{i.results[e]=this.processSearchResults(t)}));return i}else{e.hits.map((t=>{if(t.url&&!t.url.match(/^http/))t.url=location.protocol+"//"+this.domainFor(t.origin)+t.url}));return e}}processMyAccData(){if(!this.myAccData||!this.myAccData.search.indeces.length)return;if(this.myAccData.search.api_key)this.searchApiKey=this.myAccData.search.api_key;if(this.myAccData.search.app_id)this.searchAppId=this.myAccData.search.app_id;if(this.myAccData.cart.count)this.cartCount=this.myAccData.cart.count;if(this.myAccData.notifications.count)this.msgCount=this.myAccData.notifications.count;if(!this.searchAppId||!this.searchApiKey)return;this.internalSearchIndeces=[...this.myAccData.search.indeces,...this.searchIndeces];if(this.myAccData.urls.cart&&!this.cartUrl)this.cartUrl=this.myAccData.urls.cart;if(this.myAccData.urls.messages&&!this.msgUrl)this.msgUrl=this.myAccData.urls.messages}processMyAccLinks(){if(!this.myAccData.links||!this.myAccData.links.length)return;this.myAccData.links.forEach((t=>{switch(t.area){case"left-side-logged-in":case"left-side-logged-out":if(this.activeMyAccountSections&&!this.activeMyAccountSections.includes("sites"))break;if(this.isLoggedIn&&t.area==="left-side-logged-in")this.siteNavItms.push(t);else if(!this.isLoggedIn&&t.area==="left-side-logged-out")this.siteNavItms.push(t);break;case"right-side-logged-in":case"right-side-logged-out":if(this.activeMyAccountSections&&!this.activeMyAccountSections.includes("about"))break;if(this.isLoggedIn&&t.area==="right-side-logged-in")this.aboutNavItms.push(t);else if(!this.isLoggedIn&&t.area==="right-side-logged-out")this.aboutNavItms.push(t);break;case"profile-panel-list":if(this.activeMyAccountSections&&!this.activeMyAccountSections.includes("loggedin"))break;this.loggedInNavItms.push(t);break}}))}static get assetsDirs(){return["assets"]}get el(){return r(this)}static get watchers(){return{myAccountData:["handleMyAccountData"],env:["getMyAccData"],ssoDataUrl:["getMyAccData"],searchIndex:["currentSelectedIndex"],searchValInternal:["changeInternalSearchVal"],searchApiKey:["initAlgoliaClient"],searchAppId:["initAlgoliaClient"],searchIndeces:["addIndeces"],internalSearchIndeces:["addAlgoliaIndeces"],threshold:["thresholdChange"],intersectRatio:["ratioChange"],thresholdReady:["assessReady"],remoteDataReady:["assessReady","remoteReady"],ready:["isReady"],showAutocomplete:["setupAutocompleteBlur","resetHitFocus"],secondaryMenuOpen:["closeSearchBar"],aboutSlotLen:["slotChange"],iconSlotLen:["slotChange"],mainSlotLen:["slotChange"],overflowSlotLen:["slotChange"],searchSlotLen:["slotChange"],userMenuOpen:["handleUserMenu"]}}};m.style=g;export{m as nano_global_nav};
|
5
|
+
//# sourceMappingURL=p-842f826a.entry.js.map
|