@nanoporetech-digital/components 2.9.0 → 2.11.0

package/dist/nano-components/p-32900c91.entry.js

@@ -0,0 +1,5 @@
+/*!
+ * Web Components for Nanopore digital Web Apps
+ */
+import{r as t,c as i,f as e,h as s,e as n,g as o}from"./p-b5c33aff.js";import{r as a}from"./p-289aa03f.js";import{d as r}from"./p-1da5f8df.js";import{g as l}from"./p-b619500f.js";import{g as h}from"./p-8971a867.js";import{g as d}from"./p-74a7fc4f.js";const c=":host{-webkit-box-sizing:border-box;box-sizing:border-box}*,*::before,*::after{-webkit-box-sizing:border-box;box-sizing:border-box}[hidden]{display:none !important}:host{--padding-top:var(--nano-spacing-small, 8px);--padding-bottom:var(--nano-spacing-small, 8px);--padding-start:var(--nano-spacing-xlarge, 24px);--padding-end:var(--nano-spacing-xlarge, 24px);--font-size:0.8em;--color:#b5aea7;color:var(--color)}.dlist--isfiltered ::slotted(*:not(nano-option):not([slot=no-result]):not([slot=list-top]):not([slot=list-bottom])){display:none !important}.dlist__dropdown{--min-width:100%;--overflow:auto}.dlist__status{clip:rect(1px, 1px, 1px, 1px);-webkit-clip-path:inset(50%);clip-path:inset(50%);height:1px;width:1px;margin:-1px;overflow:hidden;padding:0;position:absolute}.dlist__menu{--padding-top:inherit;--padding-bottom:inherit;--padding-start:inherit;--padding-end:inherit;--font-size:inherit}";function p(t){let i;if(t.id){i=document.querySelector(`label[for='${t.id}']`)}if(!i){i=t.closest("label")}return i}let f=0;let u=class{constructor(e){t(this,e);this.nanoSelect=i(this,"nanoSelect",7);this.nanoDeselect=i(this,"nanoDeselect",7);this.nanoOptionsUpdated=i(this,"nanoOptionsUpdated",7);this.isNanoInput=false;this.typeToSelect="";this.listId=`nano-datalist-${f++}`;this.isFiltered=false;this.shouldFocus=false;this._allOptEles=[];this.actvOptEles=[];this.canOpen=true;this.optionIds=[];this.selected=[];this._dropDownConfig={skidding:-1};this.options=[];this.type="input";this.open=false;this.disableFilter=false;this.disabled=false;this.optSelected=t=>{t.stopPropagation();this.changeInputValue(t.detail);a((()=>this.inputChange()));if(this.type==="select")this.shouldOpen=false};this.handleShow=async()=>{if(this.shouldFocus){this.shouldFocus=false;this.listBox.setFocus()}else if(this.type==="select")this.listBox.showActiveElement()};this.inputClick=()=>{this.shouldOpen=true;this.manageDropdownDisplay()};this.inputKeydown=t=>{const i=["Shift","ArrowRight","ArrowLeft","Escape","Enter","Tab"];if(i.includes(t.key)){if(t.key==="Tab")this.shouldOpen=false;return}if(this.type==="select"&&!["ArrowDown","ArrowUp"].includes(t.key)&&(t.key!==" "||this.typeToSelectTimeout)){if(t.key===" "||/^[a-z0-9]+$/i.test(t.key)){clearTimeout(this.typeToSelectTimeout);this.typeToSelectTimeout=window.setTimeout((()=>{this.typeToSelect="";this.typeToSelectTimeout=0}),750);this.typeToSelect+=t.key;this.setOptStartsWith()}return}this.shouldOpen=true;this.manageDropdownDisplay();if(["ArrowDown","ArrowUp"].includes(t.key)){t.preventDefault();this.shouldFocus=true}};this.optionKeyDown=t=>{const i=["Shift","ArrowUp","ArrowDown","Escape","Enter","Tab","Space","PageUp","PageDown","Home","End"," "];if(i.includes(t.key)){if(t.key==="Escape")this.connectedInput.focus();return}const e=["Delete","Backspace"];if(this.type!=="select"&&(!this.exactMatch||e.includes(t.key))){this.connectedInput.focus()}};this.inputChange=r(this.inputChange.bind(this),50)}get allOptEles(){return this._allOptEles}set allOptEles(t){var i;this._allOptEles=t;if((i=this.connectedInput)===null||i===void 0?void 0:i.value)return;t.forEach((t=>{if(t.selected&&!this.selected.includes(t.value)){this.changeInputValue(t)}}))}get dropDownConfig(){return this._dropDownConfig}set dropDownConfig(t){this._dropDownConfig=Object.assign(Object.assign({},this._dropDownConfig),t)}get activeOptions(){return this.allOptEles}openWatcher(){e((()=>{this.nanoDropdown.open=this.open;this.connectedInput.setAttribute("aria-expanded",this.open.toString())}))}async watchInputChange(){let t;if(t=this.host.closest("nano-input")){this.isNanoInput=true;this.connectedInput=await t.getInputElement()}else if(this.input&&typeof this.input==="string"&&(t=document.querySelector(this.input))){this.isNanoInput=false;this.connectedInput=t}else if(this.input instanceof HTMLElement){this.connectedInput=this.input}}manageSlotChangeListener(){var t;if(!this.host)return;if((!this.options||!this.options.length)&&!this.mo){{const t=this.mo=new MutationObserver((()=>this.processSlottedContent()));t.observe(this.host,{childList:true,subtree:true})}this.processSlottedContent();return}if((t=this.options)===null||t===void 0?void 0:t.length){if(!!this.mo){this.mo.disconnect();this.mo=undefined}e((()=>{var t;this.allOptEles=this.options.flatMap(((t,i)=>{if(t.value||t.label){const e=Object.assign(document.createElement("nano-option"),{label:t.label,value:t.value,ariaPosinset:i,ariaSetsize:this.options.length,selected:t.selected,id:this.listId+"-option-"+i,textContent:t.label?t.label:t.value,slot:"internal-opts"});this.host.append(e);return e}}));if(((t=this.connectedInput)===null||t===void 0?void 0:t.value.length)&&this.type!=="select"){this.inputChange()}else this.actvOptEles=[...this.allOptEles]}))}}watchTypeChange(){if(!this.connectedInput)return;let t={closeOnSelect:false};let i="both";let e=false;switch(this.type){case"selctMulti":break;case"select":i="list";e=true;t={closeOnSelect:true,placement:"center"};break}if(!this.isNanoInput){t.tetherTo=this.connectedInput}this.dropDownConfig=Object.assign(Object.assign({},this.dropDownConfig),t);this.connectedInput.setAttribute("aria-autocomplete",i);this.connectedInput.readOnly=e}manageInputEvents(t,i){var s;if(!!i){const t=i.closest("nano-input");if(t){t.removeEventListener("nanoChange",this.inputChange)}i.removeEventListener("change",this.inputChange);i.removeEventListener("click",this.inputClick);i.removeEventListener("keydown",this.inputKeydown);i.removeEventListener("input",this.inputChange);this.inputLabel=null;e((()=>{i.removeAttribute("role");i.removeAttribute("aria-expanded");i.removeAttribute("aria-controls");i.removeAttribute("aria-owns");i.removeAttribute("aria-haspopup");i.removeAttribute("aria-autocomplete");i.removeAttribute("autocomplete")}))}if(!!t){const i=t.closest("nano-input");if(i){i.addEventListener("nanoChange",this.inputChange)}t.addEventListener("change",this.inputChange);t.addEventListener("click",this.inputClick);t.addEventListener("keydown",this.inputKeydown);t.addEventListener("input",this.inputChange);this.listId=this.host.id||this.listId;this.inputLabel=((s=t===null||t===void 0?void 0:t.labels)===null||s===void 0?void 0:s.item(0))||p(t);e((()=>{this.host.id=this.listId;t.setAttribute("role","combobox");t.setAttribute("aria-expanded","false");t.setAttribute("aria-controls",this.listId);t.setAttribute("aria-owns",this.listId);t.setAttribute("aria-haspopup","listbox");t.setAttribute("autocomplete","off")}))}}watchActvOptChange(){var t;let i=0;const s=((t=this.connectedInput)===null||t===void 0?void 0:t.value)||"";const n=[];e((()=>{this.allOptEles.forEach(((t,e)=>{if(this.actvOptEles.includes(t)){i++;t.setAttribute("aria-posinset",i+"");t.setAttribute("aria-setsize",this.actvOptEles.length+"");t.hidden=false;this.isSelected(t,s)}else{t.removeAttribute("aria-posinset");t.removeAttribute("aria-setsize");t.hidden=true;t.selected=false}t.id=this.listId+"-option-"+e;n.push(t.id)}));this.optionIds=n}))}manageCanOpen(){if(this.actvOptEles.length||this.hasNoResult)this.canOpen=true;else this.canOpen=false}manageDropdownDisplay(){if(this.shouldOpen&&this.canOpen&&!this.disabled)this.open=true;if(!this.shouldOpen||!this.canOpen)this.open=false;this.openWatcher()}fireActiveOptsEvent(){this.nanoOptionsUpdated.emit(this.actvOptEles)}isSelected(t,i){if(i===t.value||this.selected.includes(t.value)){t.selected=true}else t.selected=false}get dropwdownOpen(){if(!this.nanoDropdown||!this.open)return false;return true}get exactMatch(){return this.allOptEles.find((t=>this.connectedInput.value===t.value))}changeInputValue(t){var i;let e;if(this.selected.includes(t.value)){this.selected=this.selected.filter((i=>i!==t.value));e=this.nanoDeselect.emit(t)}else{this.selected=[...this.selected];e=this.nanoSelect.emit(t)}if(!e.defaultPrevented){if(this.connectedInput)this.connectedInput.value=t.value;const e=new window.Event("change");(i=this.connectedInput)===null||i===void 0?void 0:i.dispatchEvent(e)}}setOptStartsWith(){const t=t=>t.toLowerCase().substring(0,this.typeToSelect.length)===this.typeToSelect;const i=this.allOptEles.find((i=>i.value.trim().length>0&&!i.disabled&&(t(i.textContent)||t(i.value)||t(i.label)||t(i.filterMeta))));if(i)this.changeInputValue(i)}processSlottedContent(){a((()=>{var t;this.allOptEles=Array.from(this.host.querySelectorAll("nano-option"));this.hasNoResult=!!this.host.querySelector('[slot="no-result"]');if(((t=this.connectedInput)===null||t===void 0?void 0:t.value.length)&&this.type!=="select"){this.inputChange()}else this.actvOptEles=this.allOptEles}))}inputChange(){if(this.disableFilter){this.actvOptEles=this.allOptEles;return}const t=this.connectedInput.value;const i=t.trim().toLowerCase();let e=false;const s=[];const n=t=>t.toLowerCase().indexOf(i)>-1;this.allOptEles.forEach((i=>{if((t===i.value||t===i.label)&&this.type!=="selctMulti"){i.selected=true;e=true}else this.isSelected(i,t)}));this.allOptEles.forEach((t=>{if(!i.length||e){s.push(t)}else if(t.value.trim().length>0&&!t.disabled&&(n(t.textContent)||n(t.value)||n(t.label)||n(t.filterMeta))){s.push(t)}}));this.isFiltered=i.length&&!e;this.actvOptEles=s}connectedCallback(){this.watchInputChange()}componentDidLoad(){this.manageSlotChangeListener();this.openWatcher()}componentDidRender(){setTimeout((()=>{if(!this.connectedInput)console.warn("no `nano-input` found. `nano-datalist` should be nested within an `nano-input` or linked via `input` prop",this.host)}),500)}render(){return s(n,{role:"listbox","aria-owns":this.optionIds.join(" "),"aria-label":"Select options from the list below"},s("nano-dropdown",Object.assign({},this.dropDownConfig,{ref:t=>this.nanoDropdown=t,dialogTitle:"Select options from the list below",class:{dlist__dropdown:true,"dlist--isfiltered":this.isFiltered},onNanoAfterShow:this.handleShow,onNanoAfterHide:t=>this.open=false}),s("nano-menu",{hidden:!this.actvOptEles.length,type:"listbox",label:this.inputLabel?this.inputLabel.textContent:undefined,class:{dlist__menu:true,"dlist__menu--open":this.dropwdownOpen},tabIndex:-1,onNanoSelect:this.optSelected,onKeyDown:this.optionKeyDown,ref:t=>this.listBox=t},s("slot",{name:"list-top"}),!this.options.length&&s("slot",null),!!this.options.length&&s("slot",{name:"internal-opts"}),s("slot",{name:"list-bottom"})),s("nano-menu",{type:"listbox",label:"No results found",hidden:!!this.actvOptEles.length,class:{dlist__menu:true,"dlist__menu--open":this.dropwdownOpen}},s("slot",{name:"no-result"})),!!this.actvOptEles&&s("div",{"aria-live":"polite",role:"status",class:"dlist__status"},this.actvOptEles.length," result",this.actvOptEles.length>1?"s":""," available.")))}get host(){return o(this)}static get watchers(){return{open:["openWatcher"],input:["watchInputChange"],options:["manageSlotChangeListener"],type:["watchTypeChange"],connectedInput:["watchTypeChange","manageInputEvents"],selected:["watchActvOptChange"],actvOptEles:["watchActvOptChange","manageCanOpen","fireActiveOptsEvent"],hasNoResult:["manageCanOpen"],shouldOpen:["manageDropdownDisplay"],canOpen:["manageDropdownDisplay"]}}};u.style=c;const g=":host{-webkit-box-sizing:border-box;box-sizing:border-box}*,*::before,*::after{-webkit-box-sizing:border-box;box-sizing:border-box}[hidden]{display:none !important}:host{--padding-start:var(--nano-spacing-medium, 16px);--padding-end:var(--nano-spacing-medium, 16px);--padding-top:var(--nano-spacing-small, 8px);--padding-bottom:var(--nano-spacing-small, 8px);--secondary-padding-top:0;--secondary-padding-bottom:0;--bg-color-hover:#f2f7f9;--bg-color-focus:#f2f7f9;--bg-color-selected:#f2f7f9;--color-hover:#007495;--color-selected:#007495;--color-focus:#007495;--focus-outline:none;--font-size:0.9em;display:block}.menu{font-size:var(--font-size, 0.9em);-ms-scroll-chaining:none;overscroll-behavior:none;min-width:var(--width);position:relative}.menu:focus{outline:none}::slotted(*:not(nano-nav-item):not(nano-option):not(hr):not(slot)){padding-left:var(--padding-start);padding-right:var(--padding-end);padding-top:var(--padding-top);padding-bottom:var(--padding-bottom);display:block}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){::slotted(*:not(nano-nav-item):not(nano-option):not(hr):not(slot)){padding-left:unset;padding-right:unset;-webkit-padding-start:var(--padding-start);padding-inline-start:var(--padding-start);-webkit-padding-end:var(--padding-end);padding-inline-end:var(--padding-end)}}";const b=!!document.head.attachShadow;let m=class{constructor(e){t(this,e);this.nanoFocus=i(this,"nanoFocus",7);this.nanoBlur=i(this,"nanoBlur",7);this.nanoSelect=i(this,"nanoSelect",7);this.ignoreMouseEvents=false;this.typeToSelect="";this._hasFocus=false;this.type="menu";this.handleFocus=()=>{this.setActiveFocusItem(this.selectedItem||this.getItems[0]);this._hasFocus=true;this.nanoFocus.emit()};this.handleClick=t=>{const i=t.target;const e=i.closest("nano-nav-item");if(e&&!e.disabled){this.nanoSelect.emit(e)}};this.handleKeyDown=t=>{clearTimeout(this.ignoreMouseTimeout);this.ignoreMouseTimeout=setTimeout((()=>this.ignoreMouseEvents=false),500);this.ignoreMouseEvents=true;switch(t.key){case" ":if(this.activeItem)this.activeItem.click();break;case"ArrowDown":case"ArrowUp":case"PageDown":case"PageUp":case"Home":case"End":const i=this.getItems;const e=this.activeItem;let s=i.indexOf(e);if(i.length){t.preventDefault();if(t.key==="ArrowDown"){s++}else if(t.key==="ArrowUp"){s--}else if(t.key==="Home"||t.key==="PageUp"){s=0}else if(t.key==="End"||t.key==="PageDown"){s=i.length-1}if(s<0)s=i.length-1;if(s>i.length-1)s=0;this.setActiveFocusItem(i[s]);if(i[s])i[s].scrollIntoView({block:"nearest"});return}break}if(t.key===" "||/^[a-z0-9]+$/i.test(t.key)){clearTimeout(this.typeToSelectTimeout);this.typeToSelectTimeout=setTimeout((()=>this.typeToSelect=""),750);this.typeToSelect+=t.key;const i=this.getItems;for(const t of i){const i=t.shadowRoot.querySelector("slot:not([name])");const e=h(i).toLowerCase().trim();if(e.substring(0,this.typeToSelect.length)===this.typeToSelect){this.setActiveFocusItem(t);break}}}};this.handleMouseOver=t=>{const i=t.target;const e=i.closest("nano-nav-item")||i.closest("nano-option");if(e&&!this.ignoreMouseEvents){this.setActiveFocusItem(e)}}}get hasFocus(){return this._hasFocus}async setFocus(){var t;if((t=this.menu)===null||t===void 0?void 0:t.focus)this.menu.focus({preventScroll:true})}async removeFocus(){var t;if((t=this.menu)===null||t===void 0?void 0:t.blur)this.menu.blur()}async showActiveElement(){if(this.selectedItem)this.selectedItem.scrollIntoView({block:"nearest"})}async resetActiveItem(){this.getItems.filter((t=>t.tagName.toLowerCase()==="nano-option")).map((t=>t.setAttribute("tabindex","-1")))}get getItems(){let t;let i=this.el.querySelectorAll("nano-nav-item.secondary-open");if(i.length){const e=i[i.length-1];t=Array.from(e.querySelectorAll("nano-nav-item, nano-option"))}else{t=l(this.el,"nano-nav-item, nano-option","slot")}return t.filter((t=>!t.disabled&&!t.hidden))}get activeItem(){const t=d();return this.getItems.find((i=>i.getAttribute("tabindex")==="0"||i===t||i.classList.contains("has-focus")))}get selectedItem(){return this.getItems.find((t=>t.selected))}async setActiveFocusItem(t,i=true){const e=this.getItems;let s=!t||t.disabled?e.find((t=>t.selected))||e[0]:t;e.filter((t=>t.tagName.toLowerCase()==="nano-option")).map((t=>t.setAttribute("tabindex",t===s?"0":"-1")));if(!i)return;if(s){s.setFocus?s.setFocus():s.focus()}else this.menu.focus()}handleBlur(t){if(!this.hasFocus)return;const i=t;let e;if(i.key){if(i.key!=="Tab")return;e=d()&&d().closest(this.el.tagName.toLowerCase())===this.el}else e=!!t.composedPath().find((t=>t===this.el));if(!e){this.resetActiveItem();this._hasFocus=false;this.nanoBlur.emit()}}render(){return s(n,{class:{legacy:!b}},s("div",{onClick:this.handleClick,onKeyDown:this.handleKeyDown,onMouseOver:this.handleMouseOver,onFocus:this.handleFocus,"aria-label":this.label?this.label:undefined,role:this.type,ref:t=>this.menu=t,part:"base",class:{menu:true,["menu--"+this.type]:true,"menu--has-focus":this.hasFocus},tabIndex:-1},s("slot",null)))}get el(){return o(this)}};m.style=g;const v=":host{-webkit-box-sizing:border-box;box-sizing:border-box}*,*::before,*::after{-webkit-box-sizing:border-box;box-sizing:border-box}[hidden]{display:none !important}:host{--bg:none;--bg-selected:var(--nano-select-opt-bg, #f2f7f9);--bg-focus:var(--nano-color-base, var(--nano-color-primary-tint, #2689a5));--bg-disabled:none;--color:var(--input-text-color, var(--nano-input-text-color, #4a4a4a));--color-selected:var(--nano-color-base, var(--nano-color-primary, #007495));--color-focus:var(--nano-color-contrast, var(--nano-color-primary-contrast, #fff));--color-disabled:#b5aea7;--opt-icon-size:1.6em;display:block;color:var(--color);overflow:hidden;font-size:14px;font-size:clamp(12px, .9em, 16px)}:host(:focus){outline:none}.option{position:relative;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;cursor:pointer;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:stretch;-ms-flex-align:stretch;align-items:stretch;width:100%;background:var(--bg);padding-left:var(--padding-start);padding-right:var(--padding-end);padding-top:var(--padding-top);padding-bottom:var(--padding-bottom)}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){.option{padding-left:unset;padding-right:unset;-webkit-padding-start:var(--padding-start);padding-inline-start:var(--padding-start);-webkit-padding-end:var(--padding-end);padding-inline-end:var(--padding-end)}}:host(:focus) .option:not(.option--disabled),:host .option.option--selected{outline:none;background:var(--bg-selected);color:var(--color-selected)}:host(:focus) .option:not(.option--disabled){background:var(--bg-focus);color:var(--color-focus)}.option.option--disabled{outline:none;color:var(--color-disabled);cursor:not-allowed;background:var(--bg-disabled)}.option.option--novalue{font-style:italic;opacity:0.7}.option__label{-webkit-box-flex:1;-ms-flex:1 1 auto;flex:1 1 auto;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.option__start{-webkit-box-flex:0;-ms-flex:0 0 auto;flex:0 0 auto;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.option__start ::slotted(nano-icon){font-size:var(--opt-icon-size)}.option__start ::slotted(:last-child){margin-right:0.5em}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){.option__start ::slotted(:last-child){margin-right:unset;-webkit-margin-end:0.5em;margin-inline-end:0.5em}}.option__end{-webkit-box-flex:0;-ms-flex:0 0 auto;flex:0 0 auto;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.option__end ::slotted(nano-icon){font-size:var(--opt-icon-size)}.option__end ::slotted(:first-child){margin-left:0.5em}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){.option__end ::slotted(:first-child){margin-left:unset;-webkit-margin-start:0.5em;margin-inline-start:0.5em;}}.option__check{visibility:hidden;display:-webkit-box;display:-ms-flexbox;display:flex;position:absolute;left:0.6em;top:calc(50% - 0.6em);-webkit-box-align:center;-ms-flex-align:center;align-items:center;font-size:0.9em}.option--selected:not(.option--novalue) .option__check{visibility:visible}";let w=0;let x=class{constructor(e){t(this,e);this.nanoSelect=i(this,"nanoSelect",7);this.optId=`nano-option-${w++}`;this.hasFocus=false;this.value="";this.label="";this.selected=false;this.disabled=false;this.filterMeta="";this.handleClick=r(this.handleClick.bind(this),5)}valueChanged(){if(!this.value||!this.value.length)this.value=this.labelContent}labelChanged(){if(!this.label||!this.label.length)this.label=this.labelContent.length?this.labelContent:this.value}handleKeyDown(t){if(t.key!==" "&&t.key!=="Enter")return;t.preventDefault();this.nanoSelect.emit(this.host)}handleClick(){if(this.disabled)return;this.nanoSelect.emit(this.host)}get labelContent(){return l(this.host,"*:not([slot])",false).map((t=>t.textContent)).join(" ").trim()}componentWillLoad(){this.valueChanged();this.labelChanged()}render(){return s(n,{role:"option","aria-selected":this.selected?"true":"false","aria-disabled":this.disabled?"true":"false"},s("div",{onMouseDown:this.handleClick,id:this.optId,class:{option:true,"option--selected":this.selected,"option--disabled":this.disabled,"option--novalue":!this.value}},s("div",{part:"check-icon",class:"option__check"},s("slot",{name:"check-icon"},s("nano-icon",{name:"light/check","aria-hidden":"true"}))),s("div",{part:"start",class:"option__start"},s("slot",{name:"start"})),s("div",{part:"label",class:"option__label"},s("slot",null,this.label||this.value)),s("div",{part:"end",class:"option__end"},s("slot",{name:"end"}))))}get host(){return o(this)}static get watchers(){return{value:["valueChanged"],label:["labelChanged"]}}};x.style=v;export{u as nano_datalist,m as nano_menu,x as nano_option};
+//# sourceMappingURL=p-32900c91.entry.js.map

package/dist/nano-components/p-32900c91.entry.js.map

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

package/dist/nano-components/p-32f4516e.js

@@ -0,0 +1,5 @@
+/*!
+ * Web Components for Nanopore digital Web Apps
+ */
+import{g as r}from"./p-b5c33aff.js";import{c as e,g as t}from"./p-69a3e911.js";import{d as n}from"./p-1da5f8df.js";var o=function r(){if(typeof Symbol!=="function"||typeof Object.getOwnPropertySymbols!=="function"){return false}if(typeof Symbol.iterator==="symbol"){return true}var e={};var t=Symbol("test");var n=Object(t);if(typeof t==="string"){return false}if(Object.prototype.toString.call(t)!=="[object Symbol]"){return false}if(Object.prototype.toString.call(n)!=="[object Symbol]"){return false}var o=42;e[t]=o;for(t in e){return false}if(typeof Object.keys==="function"&&Object.keys(e).length!==0){return false}if(typeof Object.getOwnPropertyNames==="function"&&Object.getOwnPropertyNames(e).length!==0){return false}var i=Object.getOwnPropertySymbols(e);if(i.length!==1||i[0]!==t){return false}if(!Object.prototype.propertyIsEnumerable.call(e,t)){return false}if(typeof Object.getOwnPropertyDescriptor==="function"){var a=Object.getOwnPropertyDescriptor(e,t);if(a.value!==o||a.enumerable!==true){return false}}return true};var i=typeof Symbol!=="undefined"&&Symbol;var a=function r(){if(typeof i!=="function"){return false}if(typeof Symbol!=="function"){return false}if(typeof i("foo")!=="symbol"){return false}if(typeof Symbol("bar")!=="symbol"){return false}return o()};var f="Function.prototype.bind called on incompatible ";var u=Array.prototype.slice;var c=Object.prototype.toString;var y="[object Function]";var p=function r(e){var t=this;if(typeof t!=="function"||c.call(t)!==y){throw new TypeError(f+t)}var n=u.call(arguments,1);var o;var i=function(){if(this instanceof o){var r=t.apply(this,n.concat(u.call(arguments)));if(Object(r)===r){return r}return this}else{return t.apply(e,n.concat(u.call(arguments)))}};var a=Math.max(0,t.length-n.length);var p=[];for(var s=0;s<a;s++){p.push("$"+s)}o=Function("binder","return function ("+p.join(",")+"){ return binder.apply(this,arguments); }")(i);if(t.prototype){var l=function r(){};l.prototype=t.prototype;o.prototype=new l;l.prototype=null}return o};var s=Function.prototype.bind||p;var l=s.call(Function.call,Object.prototype.hasOwnProperty);var v;var d=SyntaxError;var b=Function;var h=TypeError;var m=function(r){try{return b('"use strict"; return ('+r+").constructor;")()}catch(e){}};var g=Object.getOwnPropertyDescriptor;var S=function(){throw new h};var j=g?function(){try{return S}catch(r){try{return g(arguments,"callee").get}catch(e){return S}}}():S;var w=a();var A=Object.getPrototypeOf||function(r){return r.__proto__};var O={};var P=typeof Uint8Array==="undefined"?v:A(Uint8Array);var E={"%AggregateError%":typeof AggregateError==="undefined"?v:AggregateError,"%Array%":Array,"%ArrayBuffer%":typeof ArrayBuffer==="undefined"?v:ArrayBuffer,"%ArrayIteratorPrototype%":w?A([][Symbol.iterator]()):v,"%AsyncFromSyncIteratorPrototype%":v,"%AsyncFunction%":O,"%AsyncGenerator%":O,"%AsyncGeneratorFunction%":O,"%AsyncIteratorPrototype%":O,"%Atomics%":typeof Atomics==="undefined"?v:Atomics,"%BigInt%":typeof BigInt==="undefined"?v:BigInt,"%Boolean%":Boolean,"%DataView%":typeof DataView==="undefined"?v:DataView,"%Date%":Date,"%decodeURI%":decodeURI,"%decodeURIComponent%":decodeURIComponent,"%encodeURI%":encodeURI,"%encodeURIComponent%":encodeURIComponent,"%Error%":Error,"%eval%":eval,"%EvalError%":EvalError,"%Float32Array%":typeof Float32Array==="undefined"?v:Float32Array,"%Float64Array%":typeof Float64Array==="undefined"?v:Float64Array,"%FinalizationRegistry%":typeof FinalizationRegistry==="undefined"?v:FinalizationRegistry,"%Function%":b,"%GeneratorFunction%":O,"%Int8Array%":typeof Int8Array==="undefined"?v:Int8Array,"%Int16Array%":typeof Int16Array==="undefined"?v:Int16Array,"%Int32Array%":typeof Int32Array==="undefined"?v:Int32Array,"%isFinite%":isFinite,"%isNaN%":isNaN,"%IteratorPrototype%":w?A(A([][Symbol.iterator]())):v,"%JSON%":typeof JSON==="object"?JSON:v,"%Map%":typeof Map==="undefined"?v:Map,"%MapIteratorPrototype%":typeof Map==="undefined"||!w?v:A((new Map)[Symbol.iterator]()),"%Math%":Math,"%Number%":Number,"%Object%":Object,"%parseFloat%":parseFloat,"%parseInt%":parseInt,"%Promise%":typeof Promise==="undefined"?v:Promise,"%Proxy%":typeof Proxy==="undefined"?v:Proxy,"%RangeError%":RangeError,"%ReferenceError%":ReferenceError,"%Reflect%":typeof Reflect==="undefined"?v:Reflect,"%RegExp%":RegExp,"%Set%":typeof Set==="undefined"?v:Set,"%SetIteratorPrototype%":typeof Set==="undefined"||!w?v:A((new Set)[Symbol.iterator]()),"%SharedArrayBuffer%":typeof SharedArrayBuffer==="undefined"?v:SharedArrayBuffer,"%String%":String,"%StringIteratorPrototype%":w?A(""[Symbol.iterator]()):v,"%Symbol%":w?Symbol:v,"%SyntaxError%":d,"%ThrowTypeError%":j,"%TypedArray%":P,"%TypeError%":h,"%Uint8Array%":typeof Uint8Array==="undefined"?v:Uint8Array,"%Uint8ClampedArray%":typeof Uint8ClampedArray==="undefined"?v:Uint8ClampedArray,"%Uint16Array%":typeof Uint16Array==="undefined"?v:Uint16Array,"%Uint32Array%":typeof Uint32Array==="undefined"?v:Uint32Array,"%URIError%":URIError,"%WeakMap%":typeof WeakMap==="undefined"?v:WeakMap,"%WeakRef%":typeof WeakRef==="undefined"?v:WeakRef,"%WeakSet%":typeof WeakSet==="undefined"?v:WeakSet};var F=function r(e){var t;if(e==="%AsyncFunction%"){t=m("async function () {}")}else if(e==="%GeneratorFunction%"){t=m("function* () {}")}else if(e==="%AsyncGeneratorFunction%"){t=m("async function* () {}")}else if(e==="%AsyncGenerator%"){var n=r("%AsyncGeneratorFunction%");if(n){t=n.prototype}}else if(e==="%AsyncIteratorPrototype%"){var o=r("%AsyncGenerator%");if(o){t=A(o.prototype)}}E[e]=t;return t};var I={"%ArrayBufferPrototype%":["ArrayBuffer","prototype"],"%ArrayPrototype%":["Array","prototype"],"%ArrayProto_entries%":["Array","prototype","entries"],"%ArrayProto_forEach%":["Array","prototype","forEach"],"%ArrayProto_keys%":["Array","prototype","keys"],"%ArrayProto_values%":["Array","prototype","values"],"%AsyncFunctionPrototype%":["AsyncFunction","prototype"],"%AsyncGenerator%":["AsyncGeneratorFunction","prototype"],"%AsyncGeneratorPrototype%":["AsyncGeneratorFunction","prototype","prototype"],"%BooleanPrototype%":["Boolean","prototype"],"%DataViewPrototype%":["DataView","prototype"],"%DatePrototype%":["Date","prototype"],"%ErrorPrototype%":["Error","prototype"],"%EvalErrorPrototype%":["EvalError","prototype"],"%Float32ArrayPrototype%":["Float32Array","prototype"],"%Float64ArrayPrototype%":["Float64Array","prototype"],"%FunctionPrototype%":["Function","prototype"],"%Generator%":["GeneratorFunction","prototype"],"%GeneratorPrototype%":["GeneratorFunction","prototype","prototype"],"%Int8ArrayPrototype%":["Int8Array","prototype"],"%Int16ArrayPrototype%":["Int16Array","prototype"],"%Int32ArrayPrototype%":["Int32Array","prototype"],"%JSONParse%":["JSON","parse"],"%JSONStringify%":["JSON","stringify"],"%MapPrototype%":["Map","prototype"],"%NumberPrototype%":["Number","prototype"],"%ObjectPrototype%":["Object","prototype"],"%ObjProto_toString%":["Object","prototype","toString"],"%ObjProto_valueOf%":["Object","prototype","valueOf"],"%PromisePrototype%":["Promise","prototype"],"%PromiseProto_then%":["Promise","prototype","then"],"%Promise_all%":["Promise","all"],"%Promise_reject%":["Promise","reject"],"%Promise_resolve%":["Promise","resolve"],"%RangeErrorPrototype%":["RangeError","prototype"],"%ReferenceErrorPrototype%":["ReferenceError","prototype"],"%RegExpPrototype%":["RegExp","prototype"],"%SetPrototype%":["Set","prototype"],"%SharedArrayBufferPrototype%":["SharedArrayBuffer","prototype"],"%StringPrototype%":["String","prototype"],"%SymbolPrototype%":["Symbol","prototype"],"%SyntaxErrorPrototype%":["SyntaxError","prototype"],"%TypedArrayPrototype%":["TypedArray","prototype"],"%TypeErrorPrototype%":["TypeError","prototype"],"%Uint8ArrayPrototype%":["Uint8Array","prototype"],"%Uint8ClampedArrayPrototype%":["Uint8ClampedArray","prototype"],"%Uint16ArrayPrototype%":["Uint16Array","prototype"],"%Uint32ArrayPrototype%":["Uint32Array","prototype"],"%URIErrorPrototype%":["URIError","prototype"],"%WeakMapPrototype%":["WeakMap","prototype"],"%WeakSetPrototype%":["WeakSet","prototype"]};var R=s.call(Function.call,Array.prototype.concat);var k=s.call(Function.apply,Array.prototype.splice);var M=s.call(Function.call,String.prototype.replace);var x=s.call(Function.call,String.prototype.slice);var N=s.call(Function.call,RegExp.prototype.exec);var U=/[^%.[\]]+|\[(?:(-?\d+(?:\.\d+)?)|(["'])((?:(?!\2)[^\\]|\\.)*?)\2)\]|(?=(?:\.|\[\])(?:\.|\[\]|%$))/g;var W=/\\(\\)?/g;var T=function r(e){var t=x(e,0,1);var n=x(e,-1);if(t==="%"&&n!=="%"){throw new d("invalid intrinsic syntax, expected closing `%`")}else if(n==="%"&&t!=="%"){throw new d("invalid intrinsic syntax, expected opening `%`")}var o=[];M(e,U,(function(r,e,t,n){o[o.length]=t?M(n,W,"$1"):e||r}));return o};var B=function r(e,t){var n=e;var o;if(l(I,n)){o=I[n];n="%"+o[0]+"%"}if(l(E,n)){var i=E[n];if(i===O){i=F(n)}if(typeof i==="undefined"&&!t){throw new h("intrinsic "+e+" exists, but is not available. Please file an issue!")}return{alias:o,name:n,value:i}}throw new d("intrinsic "+e+" does not exist!")};var D=function r(e,t){if(typeof e!=="string"||e.length===0){throw new h("intrinsic name must be a non-empty string")}if(arguments.length>1&&typeof t!=="boolean"){throw new h('"allowMissing" argument must be a boolean')}if(N(/^%?[^%]*%?$/g,e)===null){throw new d("`%` may not be present anywhere but at the beginning and end of the intrinsic name")}var n=T(e);var o=n.length>0?n[0]:"";var i=B("%"+o+"%",t);var a=i.name;var f=i.value;var u=false;var c=i.alias;if(c){o=c[0];k(n,R([0,1],c))}for(var y=1,p=true;y<n.length;y+=1){var s=n[y];var b=x(s,0,1);var m=x(s,-1);if((b==='"'||b==="'"||b==="`"||(m==='"'||m==="'"||m==="`"))&&b!==m){throw new d("property names with quotes must have matching quotes")}if(s==="constructor"||!p){u=true}o+="."+s;a="%"+o+"%";if(l(E,a)){f=E[a]}else if(f!=null){if(!(s in f)){if(!t){throw new h("base intrinsic for "+e+" exists, but the property is not available.")}return void v}if(g&&y+1>=n.length){var S=g(f,s);p=!!S;if(p&&"get"in S&&!("originalValue"in S.get)){f=S.get}else{f=f[s]}}else{p=l(f,s);f=f[s]}if(p&&!u){E[a]=f}}}return f};var C=e((function(r){var e=D("%Function.prototype.apply%");var t=D("%Function.prototype.call%");var n=D("%Reflect.apply%",true)||s.call(t,e);var o=D("%Object.getOwnPropertyDescriptor%",true);var i=D("%Object.defineProperty%",true);var a=D("%Math.max%");if(i){try{i({},"a",{value:1})}catch(u){i=null}}r.exports=function r(e){var f=n(s,t,arguments);if(o&&i){var u=o(f,"length");if(u.configurable){i(f,"length",{value:1+a(0,e.length-(arguments.length-1))})}}return f};var f=function r(){return n(s,e,arguments)};if(i){i(r.exports,"apply",{value:f})}else{r.exports.apply=f}}));var _=C(D("String.prototype.indexOf"));var q=function r(e,t){var n=D(e,!!t);if(typeof n==="function"&&_(e,".prototype.")>-1){return C(n)}return n};const G={};const $=Object.freeze({__proto__:null,default:G});const J=t($);var V=typeof Map==="function"&&Map.prototype;var H=Object.getOwnPropertyDescriptor&&V?Object.getOwnPropertyDescriptor(Map.prototype,"size"):null;var L=V&&H&&typeof H.get==="function"?H.get:null;var z=V&&Map.prototype.forEach;var Q=typeof Set==="function"&&Set.prototype;var Y=Object.getOwnPropertyDescriptor&&Q?Object.getOwnPropertyDescriptor(Set.prototype,"size"):null;var K=Q&&Y&&typeof Y.get==="function"?Y.get:null;var X=Q&&Set.prototype.forEach;var Z=typeof WeakMap==="function"&&WeakMap.prototype;var rr=Z?WeakMap.prototype.has:null;var er=typeof WeakSet==="function"&&WeakSet.prototype;var tr=er?WeakSet.prototype.has:null;var nr=typeof WeakRef==="function"&&WeakRef.prototype;var or=nr?WeakRef.prototype.deref:null;var ir=Boolean.prototype.valueOf;var ar=Object.prototype.toString;var fr=Function.prototype.toString;var ur=String.prototype.match;var cr=String.prototype.slice;var yr=String.prototype.replace;var pr=String.prototype.toUpperCase;var sr=String.prototype.toLowerCase;var lr=RegExp.prototype.test;var vr=Array.prototype.concat;var dr=Array.prototype.join;var br=Array.prototype.slice;var hr=Math.floor;var mr=typeof BigInt==="function"?BigInt.prototype.valueOf:null;var gr=Object.getOwnPropertySymbols;var Sr=typeof Symbol==="function"&&typeof Symbol.iterator==="symbol"?Symbol.prototype.toString:null;var jr=typeof Symbol==="function"&&typeof Symbol.iterator==="object";var wr=typeof Symbol==="function"&&Symbol.toStringTag&&(typeof Symbol.toStringTag===jr?"object":"symbol")?Symbol.toStringTag:null;var Ar=Object.prototype.propertyIsEnumerable;var Or=(typeof Reflect==="function"?Reflect.getPrototypeOf:Object.getPrototypeOf)||([].__proto__===Array.prototype?function(r){return r.__proto__}:null);function Pr(r,e){if(r===Infinity||r===-Infinity||r!==r||r&&r>-1e3&&r<1e3||lr.call(/e/,e)){return e}var t=/[0-9](?=(?:[0-9]{3})+(?![0-9]))/g;if(typeof r==="number"){var n=r<0?-hr(-r):hr(r);if(n!==r){var o=String(n);var i=cr.call(e,o.length+1);return yr.call(o,t,"$&_")+"."+yr.call(yr.call(i,/([0-9]{3})/g,"$&_"),/_$/,"")}}return yr.call(e,t,"$&_")}var Er=J.custom;var Fr=Dr(Er)?Er:null;var Ir=function r(e,t,n,o){var i=t||{};if(qr(i,"quoteStyle")&&(i.quoteStyle!=="single"&&i.quoteStyle!=="double")){throw new TypeError('option "quoteStyle" must be "single" or "double"')}if(qr(i,"maxStringLength")&&(typeof i.maxStringLength==="number"?i.maxStringLength<0&&i.maxStringLength!==Infinity:i.maxStringLength!==null)){throw new TypeError('option "maxStringLength", if provided, must be a positive integer, Infinity, or `null`')}var a=qr(i,"customInspect")?i.customInspect:true;if(typeof a!=="boolean"&&a!=="symbol"){throw new TypeError("option \"customInspect\", if provided, must be `true`, `false`, or `'symbol'`")}if(qr(i,"indent")&&i.indent!==null&&i.indent!=="\t"&&!(parseInt(i.indent,10)===i.indent&&i.indent>0)){throw new TypeError('option "indent" must be "\\t", an integer > 0, or `null`')}if(qr(i,"numericSeparator")&&typeof i.numericSeparator!=="boolean"){throw new TypeError('option "numericSeparator", if provided, must be `true` or `false`')}var f=i.numericSeparator;if(typeof e==="undefined"){return"undefined"}if(e===null){return"null"}if(typeof e==="boolean"){return e?"true":"false"}if(typeof e==="string"){return Kr(e,i)}if(typeof e==="number"){if(e===0){return Infinity/e>0?"0":"-0"}var u=String(e);return f?Pr(e,u):u}if(typeof e==="bigint"){var c=String(e)+"n";return f?Pr(e,c):c}var y=typeof i.depth==="undefined"?5:i.depth;if(typeof n==="undefined"){n=0}if(n>=y&&y>0&&typeof e==="object"){return Mr(e)?"[Array]":"[Object]"}var p=ne(i,n);if(typeof o==="undefined"){o=[]}else if(Jr(o,e)>=0){return"[Circular]"}function s(e,t,a){if(t){o=br.call(o);o.push(t)}if(a){var f={depth:i.depth};if(qr(i,"quoteStyle")){f.quoteStyle=i.quoteStyle}return r(e,f,n+1,o)}return r(e,i,n+1,o)}if(typeof e==="function"&&!Nr(e)){var l=$r(e);var v=ie(e,s);return"[Function"+(l?": "+l:" (anonymous)")+"]"+(v.length>0?" { "+dr.call(v,", ")+" }":"")}if(Dr(e)){var d=jr?yr.call(String(e),/^(Symbol\(.*\))_[^)]*$/,"$1"):Sr.call(e);return typeof e==="object"&&!jr?Zr(d):d}if(Yr(e)){var b="<"+sr.call(String(e.nodeName));var h=e.attributes||[];for(var m=0;m<h.length;m++){b+=" "+h[m].name+"="+Rr(kr(h[m].value),"double",i)}b+=">";if(e.childNodes&&e.childNodes.length){b+="..."}b+="</"+sr.call(String(e.nodeName))+">";return b}if(Mr(e)){if(e.length===0){return"[]"}var g=ie(e,s);if(p&&!te(g)){return"["+oe(g,p)+"]"}return"[ "+dr.call(g,", ")+" ]"}if(Ur(e)){var S=ie(e,s);if(!("cause"in Error.prototype)&&"cause"in e&&!Ar.call(e,"cause")){return"{ ["+String(e)+"] "+dr.call(vr.call("[cause]: "+s(e.cause),S),", ")+" }"}if(S.length===0){return"["+String(e)+"]"}return"{ ["+String(e)+"] "+dr.call(S,", ")+" }"}if(typeof e==="object"&&a){if(Fr&&typeof e[Fr]==="function"&&J){return J(e,{depth:y-n})}else if(a!=="symbol"&&typeof e.inspect==="function"){return e.inspect()}}if(Vr(e)){var j=[];z.call(e,(function(r,t){j.push(s(t,e,true)+" => "+s(r,e))}));return ee("Map",L.call(e),j,p)}if(zr(e)){var w=[];X.call(e,(function(r){w.push(s(r,e))}));return ee("Set",K.call(e),w,p)}if(Hr(e)){return re("WeakMap")}if(Qr(e)){return re("WeakSet")}if(Lr(e)){return re("WeakRef")}if(Tr(e)){return Zr(s(Number(e)))}if(Cr(e)){return Zr(s(mr.call(e)))}if(Br(e)){return Zr(ir.call(e))}if(Wr(e)){return Zr(s(String(e)))}if(!xr(e)&&!Nr(e)){var A=ie(e,s);var O=Or?Or(e)===Object.prototype:e instanceof Object||e.constructor===Object;var P=e instanceof Object?"":"null prototype";var E=!O&&wr&&Object(e)===e&&wr in e?cr.call(Gr(e),8,-1):P?"Object":"";var F=O||typeof e.constructor!=="function"?"":e.constructor.name?e.constructor.name+" ":"";var I=F+(E||P?"["+dr.call(vr.call([],E||[],P||[]),": ")+"] ":"");if(A.length===0){return I+"{}"}if(p){return I+"{"+oe(A,p)+"}"}return I+"{ "+dr.call(A,", ")+" }"}return String(e)};function Rr(r,e,t){var n=(t.quoteStyle||e)==="double"?'"':"'";return n+r+n}function kr(r){return yr.call(String(r),/"/g,"&quot;")}function Mr(r){return Gr(r)==="[object Array]"&&(!wr||!(typeof r==="object"&&wr in r))}function xr(r){return Gr(r)==="[object Date]"&&(!wr||!(typeof r==="object"&&wr in r))}function Nr(r){return Gr(r)==="[object RegExp]"&&(!wr||!(typeof r==="object"&&wr in r))}function Ur(r){return Gr(r)==="[object Error]"&&(!wr||!(typeof r==="object"&&wr in r))}function Wr(r){return Gr(r)==="[object String]"&&(!wr||!(typeof r==="object"&&wr in r))}function Tr(r){return Gr(r)==="[object Number]"&&(!wr||!(typeof r==="object"&&wr in r))}function Br(r){return Gr(r)==="[object Boolean]"&&(!wr||!(typeof r==="object"&&wr in r))}function Dr(r){if(jr){return r&&typeof r==="object"&&r instanceof Symbol}if(typeof r==="symbol"){return true}if(!r||typeof r!=="object"||!Sr){return false}try{Sr.call(r);return true}catch(e){}return false}function Cr(r){if(!r||typeof r!=="object"||!mr){return false}try{mr.call(r);return true}catch(e){}return false}var _r=Object.prototype.hasOwnProperty||function(r){return r in this};function qr(r,e){return _r.call(r,e)}function Gr(r){return ar.call(r)}function $r(r){if(r.name){return r.name}var e=ur.call(fr.call(r),/^function\s*([\w$]+)/);if(e){return e[1]}return null}function Jr(r,e){if(r.indexOf){return r.indexOf(e)}for(var t=0,n=r.length;t<n;t++){if(r[t]===e){return t}}return-1}function Vr(r){if(!L||!r||typeof r!=="object"){return false}try{L.call(r);try{K.call(r)}catch(e){return true}return r instanceof Map}catch(t){}return false}function Hr(r){if(!rr||!r||typeof r!=="object"){return false}try{rr.call(r,rr);try{tr.call(r,tr)}catch(e){return true}return r instanceof WeakMap}catch(t){}return false}function Lr(r){if(!or||!r||typeof r!=="object"){return false}try{or.call(r);return true}catch(e){}return false}function zr(r){if(!K||!r||typeof r!=="object"){return false}try{K.call(r);try{L.call(r)}catch(e){return true}return r instanceof Set}catch(t){}return false}function Qr(r){if(!tr||!r||typeof r!=="object"){return false}try{tr.call(r,tr);try{rr.call(r,rr)}catch(e){return true}return r instanceof WeakSet}catch(t){}return false}function Yr(r){if(!r||typeof r!=="object"){return false}if(typeof HTMLElement!=="undefined"&&r instanceof HTMLElement){return true}return typeof r.nodeName==="string"&&typeof r.getAttribute==="function"}function Kr(r,e){if(r.length>e.maxStringLength){var t=r.length-e.maxStringLength;var n="... "+t+" more character"+(t>1?"s":"");return Kr(cr.call(r,0,e.maxStringLength),e)+n}var o=yr.call(yr.call(r,/(['\\])/g,"\\$1"),/[\x00-\x1f]/g,Xr);return Rr(o,"single",e)}function Xr(r){var e=r.charCodeAt(0);var t={8:"b",9:"t",10:"n",12:"f",13:"r"}[e];if(t){return"\\"+t}return"\\x"+(e<16?"0":"")+pr.call(e.toString(16))}function Zr(r){return"Object("+r+")"}function re(r){return r+" { ? }"}function ee(r,e,t,n){var o=n?oe(t,n):dr.call(t,", ");return r+" ("+e+") {"+o+"}"}function te(r){for(var e=0;e<r.length;e++){if(Jr(r[e],"\n")>=0){return false}}return true}function ne(r,e){var t;if(r.indent==="\t"){t="\t"}else if(typeof r.indent==="number"&&r.indent>0){t=dr.call(Array(r.indent+1)," ")}else{return null}return{base:t,prev:dr.call(Array(e+1),t)}}function oe(r,e){if(r.length===0){return""}var t="\n"+e.prev+e.base;return t+dr.call(r,","+t)+"\n"+e.prev}function ie(r,e){var t=Mr(r);var n=[];if(t){n.length=r.length;for(var o=0;o<r.length;o++){n[o]=qr(r,o)?e(r[o],r):""}}var i=typeof gr==="function"?gr(r):[];var a;if(jr){a={};for(var f=0;f<i.length;f++){a["$"+i[f]]=i[f]}}for(var u in r){if(!qr(r,u)){continue}if(t&&String(Number(u))===u&&u<r.length){continue}if(jr&&a["$"+u]instanceof Symbol){continue}else if(lr.call(/[^\w$]/,u)){n.push(e(u,r)+": "+e(r[u],r))}else{n.push(u+": "+e(r[u],r))}}if(typeof gr==="function"){for(var c=0;c<i.length;c++){if(Ar.call(r,i[c])){n.push("["+e(i[c])+"]: "+e(r[i[c]],r))}}}return n}var ae=D("%TypeError%");var fe=D("%WeakMap%",true);var ue=D("%Map%",true);var ce=q("WeakMap.prototype.get",true);var ye=q("WeakMap.prototype.set",true);var pe=q("WeakMap.prototype.has",true);var se=q("Map.prototype.get",true);var le=q("Map.prototype.set",true);var ve=q("Map.prototype.has",true);var de=function(r,e){for(var t=r,n;(n=t.next)!==null;t=n){if(n.key===e){t.next=n.next;n.next=r.next;r.next=n;return n}}};var be=function(r,e){var t=de(r,e);return t&&t.value};var he=function(r,e,t){var n=de(r,e);if(n){n.value=t}else{r.next={key:e,next:r.next,value:t}}};var me=function(r,e){return!!de(r,e)};var ge=function r(){var e;var t;var n;var o={assert:function(r){if(!o.has(r)){throw new ae("Side channel does not contain "+Ir(r))}},get:function(r){if(fe&&r&&(typeof r==="object"||typeof r==="function")){if(e){return ce(e,r)}}else if(ue){if(t){return se(t,r)}}else{if(n){return be(n,r)}}},has:function(r){if(fe&&r&&(typeof r==="object"||typeof r==="function")){if(e){return pe(e,r)}}else if(ue){if(t){return ve(t,r)}}else{if(n){return me(n,r)}}return false},set:function(r,o){if(fe&&r&&(typeof r==="object"||typeof r==="function")){if(!e){e=new fe}ye(e,r,o)}else if(ue){if(!t){t=new ue}le(t,r,o)}else{if(!n){n={key:{},next:null}}he(n,r,o)}}};return o};var Se=String.prototype.replace;var je=/%20/g;var we={RFC1738:"RFC1738",RFC3986:"RFC3986"};var Ae={default:we.RFC3986,formatters:{RFC1738:function(r){return Se.call(r,je,"+")},RFC3986:function(r){return String(r)}},RFC1738:we.RFC1738,RFC3986:we.RFC3986};var Oe=Object.prototype.hasOwnProperty;var Pe=Array.isArray;var Ee=function(){var r=[];for(var e=0;e<256;++e){r.push("%"+((e<16?"0":"")+e.toString(16)).toUpperCase())}return r}();var Fe=function r(e){while(e.length>1){var t=e.pop();var n=t.obj[t.prop];if(Pe(n)){var o=[];for(var i=0;i<n.length;++i){if(typeof n[i]!=="undefined"){o.push(n[i])}}t.obj[t.prop]=o}}};var Ie=function r(e,t){var n=t&&t.plainObjects?Object.create(null):{};for(var o=0;o<e.length;++o){if(typeof e[o]!=="undefined"){n[o]=e[o]}}return n};var Re=function r(e,t,n){if(!t){return e}if(typeof t!=="object"){if(Pe(e)){e.push(t)}else if(e&&typeof e==="object"){if(n&&(n.plainObjects||n.allowPrototypes)||!Oe.call(Object.prototype,t)){e[t]=true}}else{return[e,t]}return e}if(!e||typeof e!=="object"){return[e].concat(t)}var o=e;if(Pe(e)&&!Pe(t)){o=Ie(e,n)}if(Pe(e)&&Pe(t)){t.forEach((function(t,o){if(Oe.call(e,o)){var i=e[o];if(i&&typeof i==="object"&&t&&typeof t==="object"){e[o]=r(i,t,n)}else{e.push(t)}}else{e[o]=t}}));return e}return Object.keys(t).reduce((function(e,o){var i=t[o];if(Oe.call(e,o)){e[o]=r(e[o],i,n)}else{e[o]=i}return e}),o)};var ke=function r(e,t){return Object.keys(t).reduce((function(r,e){r[e]=t[e];return r}),e)};var Me=function(r,e,t){var n=r.replace(/\+/g," ");if(t==="iso-8859-1"){return n.replace(/%[0-9a-f]{2}/gi,unescape)}try{return decodeURIComponent(n)}catch(o){return n}};var xe=function r(e,t,n,o,i){if(e.length===0){return e}var a=e;if(typeof e==="symbol"){a=Symbol.prototype.toString.call(e)}else if(typeof e!=="string"){a=String(e)}if(n==="iso-8859-1"){return escape(a).replace(/%u[0-9a-f]{4}/gi,(function(r){return"%26%23"+parseInt(r.slice(2),16)+"%3B"}))}var f="";for(var u=0;u<a.length;++u){var c=a.charCodeAt(u);if(c===45||c===46||c===95||c===126||c>=48&&c<=57||c>=65&&c<=90||c>=97&&c<=122||i===Ae.RFC1738&&(c===40||c===41)){f+=a.charAt(u);continue}if(c<128){f=f+Ee[c];continue}if(c<2048){f=f+(Ee[192|c>>6]+Ee[128|c&63]);continue}if(c<55296||c>=57344){f=f+(Ee[224|c>>12]+Ee[128|c>>6&63]+Ee[128|c&63]);continue}u+=1;c=65536+((c&1023)<<10|a.charCodeAt(u)&1023);f+=Ee[240|c>>18]+Ee[128|c>>12&63]+Ee[128|c>>6&63]+Ee[128|c&63]}return f};var Ne=function r(e){var t=[{obj:{o:e},prop:"o"}];var n=[];for(var o=0;o<t.length;++o){var i=t[o];var a=i.obj[i.prop];var f=Object.keys(a);for(var u=0;u<f.length;++u){var c=f[u];var y=a[c];if(typeof y==="object"&&y!==null&&n.indexOf(y)===-1){t.push({obj:a,prop:c});n.push(y)}}}Fe(t);return e};var Ue=function r(e){return Object.prototype.toString.call(e)==="[object RegExp]"};var We=function r(e){if(!e||typeof e!=="object"){return false}return!!(e.constructor&&e.constructor.isBuffer&&e.constructor.isBuffer(e))};var Te=function r(e,t){return[].concat(e,t)};var Be=function r(e,t){if(Pe(e)){var n=[];for(var o=0;o<e.length;o+=1){n.push(t(e[o]))}return n}return t(e)};var De={arrayToObject:Ie,assign:ke,combine:Te,compact:Ne,decode:Me,encode:xe,isBuffer:We,isRegExp:Ue,maybeMap:Be,merge:Re};var Ce=Object.prototype.hasOwnProperty;var _e={brackets:function r(e){return e+"[]"},comma:"comma",indices:function r(e,t){return e+"["+t+"]"},repeat:function r(e){return e}};var qe=Array.isArray;var Ge=String.prototype.split;var $e=Array.prototype.push;var Je=function(r,e){$e.apply(r,qe(e)?e:[e])};var Ve=Date.prototype.toISOString;var He=Ae["default"];var Le={addQueryPrefix:false,allowDots:false,charset:"utf-8",charsetSentinel:false,delimiter:"&",encode:true,encoder:De.encode,encodeValuesOnly:false,format:He,formatter:Ae.formatters[He],indices:false,serializeDate:function r(e){return Ve.call(e)},skipNulls:false,strictNullHandling:false};var ze=function r(e){return typeof e==="string"||typeof e==="number"||typeof e==="boolean"||typeof e==="symbol"||typeof e==="bigint"};var Qe={};var Ye=function r(e,t,n,o,i,a,f,u,c,y,p,s,l,v,d){var b=e;var h=d;var m=0;var g=false;while((h=h.get(Qe))!==void undefined&&!g){var S=h.get(e);m+=1;if(typeof S!=="undefined"){if(S===m){throw new RangeError("Cyclic object value")}else{g=true}}if(typeof h.get(Qe)==="undefined"){m=0}}if(typeof f==="function"){b=f(t,b)}else if(b instanceof Date){b=y(b)}else if(n==="comma"&&qe(b)){b=De.maybeMap(b,(function(r){if(r instanceof Date){return y(r)}return r}))}if(b===null){if(o){return a&&!l?a(t,Le.encoder,v,"key",p):t}b=""}if(ze(b)||De.isBuffer(b)){if(a){var j=l?t:a(t,Le.encoder,v,"key",p);if(n==="comma"&&l){var w=Ge.call(String(b),",");var A="";for(var O=0;O<w.length;++O){A+=(O===0?"":",")+s(a(w[O],Le.encoder,v,"value",p))}return[s(j)+(qe(b)&&w.length===1?"[]":"")+"="+A]}return[s(j)+"="+s(a(b,Le.encoder,v,"value",p))]}return[s(t)+"="+s(String(b))]}var P=[];if(typeof b==="undefined"){return P}var E;if(n==="comma"&&qe(b)){E=[{value:b.length>0?b.join(",")||null:void undefined}]}else if(qe(f)){E=f}else{var F=Object.keys(b);E=u?F.sort(u):F}var I=n==="comma"&&qe(b)&&b.length===1?t+"[]":t;for(var R=0;R<E.length;++R){var k=E[R];var M=typeof k==="object"&&typeof k.value!=="undefined"?k.value:b[k];if(i&&M===null){continue}var x=qe(b)?typeof n==="function"?n(I,k):I:I+(c?"."+k:"["+k+"]");d.set(e,m);var N=ge();N.set(Qe,d);Je(P,r(M,x,n,o,i,a,f,u,c,y,p,s,l,v,N))}return P};var Ke=function r(e){if(!e){return Le}if(e.encoder!==null&&typeof e.encoder!=="undefined"&&typeof e.encoder!=="function"){throw new TypeError("Encoder has to be a function.")}var t=e.charset||Le.charset;if(typeof e.charset!=="undefined"&&e.charset!=="utf-8"&&e.charset!=="iso-8859-1"){throw new TypeError("The charset option must be either utf-8, iso-8859-1, or undefined")}var n=Ae["default"];if(typeof e.format!=="undefined"){if(!Ce.call(Ae.formatters,e.format)){throw new TypeError("Unknown format option provided.")}n=e.format}var o=Ae.formatters[n];var i=Le.filter;if(typeof e.filter==="function"||qe(e.filter)){i=e.filter}return{addQueryPrefix:typeof e.addQueryPrefix==="boolean"?e.addQueryPrefix:Le.addQueryPrefix,allowDots:typeof e.allowDots==="undefined"?Le.allowDots:!!e.allowDots,charset:t,charsetSentinel:typeof e.charsetSentinel==="boolean"?e.charsetSentinel:Le.charsetSentinel,delimiter:typeof e.delimiter==="undefined"?Le.delimiter:e.delimiter,encode:typeof e.encode==="boolean"?e.encode:Le.encode,encoder:typeof e.encoder==="function"?e.encoder:Le.encoder,encodeValuesOnly:typeof e.encodeValuesOnly==="boolean"?e.encodeValuesOnly:Le.encodeValuesOnly,filter:i,format:n,formatter:o,serializeDate:typeof e.serializeDate==="function"?e.serializeDate:Le.serializeDate,skipNulls:typeof e.skipNulls==="boolean"?e.skipNulls:Le.skipNulls,sort:typeof e.sort==="function"?e.sort:null,strictNullHandling:typeof e.strictNullHandling==="boolean"?e.strictNullHandling:Le.strictNullHandling}};var Xe=function(r,e){var t=r;var n=Ke(e);var o;var i;if(typeof n.filter==="function"){i=n.filter;t=i("",t)}else if(qe(n.filter)){i=n.filter;o=i}var a=[];if(typeof t!=="object"||t===null){return""}var f;if(e&&e.arrayFormat in _e){f=e.arrayFormat}else if(e&&"indices"in e){f=e.indices?"indices":"repeat"}else{f="indices"}var u=_e[f];if(!o){o=Object.keys(t)}if(n.sort){o.sort(n.sort)}var c=ge();for(var y=0;y<o.length;++y){var p=o[y];if(n.skipNulls&&t[p]===null){continue}Je(a,Ye(t[p],p,u,n.strictNullHandling,n.skipNulls,n.encode?n.encoder:null,n.filter,n.sort,n.allowDots,n.serializeDate,n.format,n.formatter,n.encodeValuesOnly,n.charset,c))}var s=a.join(n.delimiter);var l=n.addQueryPrefix===true?"?":"";if(n.charsetSentinel){if(n.charset==="iso-8859-1"){l+="utf8=%26%2310003%3B&"}else{l+="utf8=%E2%9C%93&"}}return s.length>0?l+s:""};var Ze=Object.prototype.hasOwnProperty;var rt=Array.isArray;var et={allowDots:false,allowPrototypes:false,allowSparse:false,arrayLimit:20,charset:"utf-8",charsetSentinel:false,comma:false,decoder:De.decode,delimiter:"&",depth:5,ignoreQueryPrefix:false,interpretNumericEntities:false,parameterLimit:1e3,parseArrays:true,plainObjects:false,strictNullHandling:false};var tt=function(r){return r.replace(/&#(\d+);/g,(function(r,e){return String.fromCharCode(parseInt(e,10))}))};var nt=function(r,e){if(r&&typeof r==="string"&&e.comma&&r.indexOf(",")>-1){return r.split(",")}return r};var ot="utf8=%26%2310003%3B";var it="utf8=%E2%9C%93";var at=function r(e,t){var n={};var o=t.ignoreQueryPrefix?e.replace(/^\?/,""):e;var i=t.parameterLimit===Infinity?undefined:t.parameterLimit;var a=o.split(t.delimiter,i);var f=-1;var u;var c=t.charset;if(t.charsetSentinel){for(u=0;u<a.length;++u){if(a[u].indexOf("utf8=")===0){if(a[u]===it){c="utf-8"}else if(a[u]===ot){c="iso-8859-1"}f=u;u=a.length}}}for(u=0;u<a.length;++u){if(u===f){continue}var y=a[u];var p=y.indexOf("]=");var s=p===-1?y.indexOf("="):p+1;var l,v;if(s===-1){l=t.decoder(y,et.decoder,c,"key");v=t.strictNullHandling?null:""}else{l=t.decoder(y.slice(0,s),et.decoder,c,"key");v=De.maybeMap(nt(y.slice(s+1),t),(function(r){return t.decoder(r,et.decoder,c,"value")}))}if(v&&t.interpretNumericEntities&&c==="iso-8859-1"){v=tt(v)}if(y.indexOf("[]=")>-1){v=rt(v)?[v]:v}if(Ze.call(n,l)){n[l]=De.combine(n[l],v)}else{n[l]=v}}return n};var ft=function(r,e,t,n){var o=n?e:nt(e,t);for(var i=r.length-1;i>=0;--i){var a;var f=r[i];if(f==="[]"&&t.parseArrays){a=[].concat(o)}else{a=t.plainObjects?Object.create(null):{};var u=f.charAt(0)==="["&&f.charAt(f.length-1)==="]"?f.slice(1,-1):f;var c=parseInt(u,10);if(!t.parseArrays&&u===""){a={0:o}}else if(!isNaN(c)&&f!==u&&String(c)===u&&c>=0&&(t.parseArrays&&c<=t.arrayLimit)){a=[];a[c]=o}else if(u!=="__proto__"){a[u]=o}}o=a}return o};var ut=function r(e,t,n,o){if(!e){return}var i=n.allowDots?e.replace(/\.([^.[]+)/g,"[$1]"):e;var a=/(\[[^[\]]*])/;var f=/(\[[^[\]]*])/g;var u=n.depth>0&&a.exec(i);var c=u?i.slice(0,u.index):i;var y=[];if(c){if(!n.plainObjects&&Ze.call(Object.prototype,c)){if(!n.allowPrototypes){return}}y.push(c)}var p=0;while(n.depth>0&&(u=f.exec(i))!==null&&p<n.depth){p+=1;if(!n.plainObjects&&Ze.call(Object.prototype,u[1].slice(1,-1))){if(!n.allowPrototypes){return}}y.push(u[1])}if(u){y.push("["+i.slice(u.index)+"]")}return ft(y,t,n,o)};var ct=function r(e){if(!e){return et}if(e.decoder!==null&&e.decoder!==undefined&&typeof e.decoder!=="function"){throw new TypeError("Decoder has to be a function.")}if(typeof e.charset!=="undefined"&&e.charset!=="utf-8"&&e.charset!=="iso-8859-1"){throw new TypeError("The charset option must be either utf-8, iso-8859-1, or undefined")}var t=typeof e.charset==="undefined"?et.charset:e.charset;return{allowDots:typeof e.allowDots==="undefined"?et.allowDots:!!e.allowDots,allowPrototypes:typeof e.allowPrototypes==="boolean"?e.allowPrototypes:et.allowPrototypes,allowSparse:typeof e.allowSparse==="boolean"?e.allowSparse:et.allowSparse,arrayLimit:typeof e.arrayLimit==="number"?e.arrayLimit:et.arrayLimit,charset:t,charsetSentinel:typeof e.charsetSentinel==="boolean"?e.charsetSentinel:et.charsetSentinel,comma:typeof e.comma==="boolean"?e.comma:et.comma,decoder:typeof e.decoder==="function"?e.decoder:et.decoder,delimiter:typeof e.delimiter==="string"||De.isRegExp(e.delimiter)?e.delimiter:et.delimiter,depth:typeof e.depth==="number"||e.depth===false?+e.depth:et.depth,ignoreQueryPrefix:e.ignoreQueryPrefix===true,interpretNumericEntities:typeof e.interpretNumericEntities==="boolean"?e.interpretNumericEntities:et.interpretNumericEntities,parameterLimit:typeof e.parameterLimit==="number"?e.parameterLimit:et.parameterLimit,parseArrays:e.parseArrays!==false,plainObjects:typeof e.plainObjects==="boolean"?e.plainObjects:et.plainObjects,strictNullHandling:typeof e.strictNullHandling==="boolean"?e.strictNullHandling:et.strictNullHandling}};var yt=function(r,e){var t=ct(e);if(r===""||r===null||typeof r==="undefined"){return t.plainObjects?Object.create(null):{}}var n=typeof r==="string"?at(r,t):r;var o=t.plainObjects?Object.create(null):{};var i=Object.keys(n);for(var a=0;a<i.length;++a){var f=i[a];var u=ut(f,n[f],t,typeof r==="string");o=De.merge(o,u,t)}if(t.allowSparse===true){return o}return De.compact(o)};var pt={formats:Ae,parse:yt,stringify:Xe};const st="nano-component-store:";const lt=(r="hash",e=window)=>{if(!e||!e.location)return{};if(r==="hash"&&e.location.hash)return pt.parse(e.location.hash.replace(/^\#/,""),{strictNullHandling:true});else if(r==="query"&&e.location.search)return pt.parse(e.location.search,{ignoreQueryPrefix:true});return{}};const vt=(r,e="hash",t=window,n="replace")=>{if(!t||!t.history)return;const o=e==="query"?t.location.search:t.location.hash;let i=e==="query"?t.location.pathname:t.location.pathname+t.location.search;let a=pt.stringify(r,{strictNullHandling:true,addQueryPrefix:false,encodeValuesOnly:true});if(!a||!a.length){if(!o||!o.length)return;if(n==="replace")t.history.replaceState(null,null,i);else t.history.pushState(null,null,i);return}if(e==="hash"&&t.location.hash==="#"+a){try{document.querySelector("#"+a).focus()}catch(f){}return}a=(e==="hash"?"#":"?")+a;if(a===o)return;if(n==="replace")t.history.replaceState(null,null,i+a);else t.history.pushState(null,null,i+a)};const dt=(r,e,t="hash",n=window,o="replace")=>{r=Object.keys(pt.parse(r))[0];let i={};i[r]=e;let a=lt(t,n);a=Object.assign(Object.assign({},a),i);vt(a,t,n,o)};const bt=(r,e="hash",t=window)=>{r=Object.keys(pt.parse(r))[0];let n=lt(e,t);return n[r]||null};const ht=(r,e,t=window)=>{try{if(!e){t.sessionStorage.removeItem(st+r);return}t.sessionStorage.setItem(st+r,JSON.stringify(e))}catch(n){throw n}};const mt=(r,e=window)=>{try{const t=e.sessionStorage.getItem(st+r);return t!==null?JSON.parse(t):null}catch(t){throw t}};const gt=(r,e,t=window)=>{try{if(!e){t.localStorage.removeItem(st+r);return}t.localStorage.setItem(st+r,JSON.stringify(e))}catch(n){throw n}};const St=(r,e=window)=>{try{const t=e.localStorage.getItem(st+r);return t!==null?JSON.parse(t):null}catch(t){throw t}};const jt=new Map;const wt={init(e,t,n,o){const i=o||e.storeId||r(e).id;if(!i){console.error("No id set. You can only instantiate a new component store with an id. ");return}if(jt.get(i)){console.error("Duplicate store id usage. A store ID must be unique!",i);return}const a=t.reduce(((r,t)=>{if(typeof e[t]!==undefined)r[t]=e[t];return r}),{});jt.set(i,new At(i,e,t,a,n));let f=jt.get(i);f.dispatchToProps();const u=e.connectedCallback;e.connectedCallback=function(){jt.set(i,new At(i,e,t,a,n));let r=jt.get(i);if(u){u.call(e)}if(r)r.dispatchToProps()};const c=e.componentDidRender;e.componentDidRender=function(){let r=jt.get(i);if(c){c.call(e)}if(r)r.savePropsToStore()};const y=e.disconnectedCallback;e.disconnectedCallback=function(){let r=jt.get(i);if(r)r.delete();jt.delete(i);if(y){y.call(e)}}}};class At{constructor(r,e,t,o,i){this.method="session";this.initialState={};this.updateStore=true;this.onUrlChange=()=>{this.dispatchToProps(false)};this.savePropsToStore=()=>{if(this.updateStore){this.save(this.getData)}else if(!this.updateStore)this.updateStore=true};this.dispatchToProps=(r=true)=>{let e=this.retrieve();if(!e&&r)return;this.updateStore=r;this.keys.forEach((r=>{this.component[r]=e?e[r]:undefined}))};this.delete=()=>{if(this.method==="url-hash-push"||this.method==="url-query-push"){window.removeEventListener("popstate",this.onUrlChange)}};if(!r)throw new Error("No id set. You can only instantiate a new component store with an id");this.id=r;this.keys=t;this.component=e;if(o)this.initialState=o;if(i)this.method=i;this.savePropsToStore=n(this.savePropsToStore,500);if(this.method==="url-hash-push"||this.method==="url-query-push"){window.addEventListener("popstate",this.onUrlChange)}}equality(r,e){if(typeof r!==typeof e)return false;if(typeof r!=="object")return r===e;return JSON.stringify(r)===JSON.stringify(e)}get getData(){const r=this.keys.reduce(((r,e)=>{let t=this.equality(this.component[e],this.initialState[e]);if(typeof this.component[e]!=="undefined"&&!t){r[e]=this.component[e]}else if(t)delete r[e];return r}),{});return Object.keys(r).length?r:undefined}retrieve(){switch(this.method){case"url-hash":case"url-hash-push":return bt(this.id,"hash");case"url-query":case"url-query-push":return bt(this.id,"query");case"local":return St(this.id);default:return mt(this.id)}}save(r){switch(this.method){case"url-hash":return dt(this.id,r,"hash");case"url-query":return dt(this.id,r,"query");case"url-hash-push":return dt(this.id,r,"hash",window,"push");case"url-query-push":return dt(this.id,r,"query",window,"push");case"local":return gt(this.id,r);default:return ht(this.id,r)}}}export{wt as C};
+//# sourceMappingURL=p-32f4516e.js.map