@nanoporetech-digital/components 8.3.2 → 8.4.1

package/dist/nano-components/nano-global-nav.entry.js

@@ -1,4 +1,4 @@
 /*!
  * Custom elements for Nanopore-Digital Web applications
  */
-import{g as n,r as e,c as a,a as o,k as t}from"./index-BM3Om9WE.js";import{a as i}from"./algoliasearch-lite.esm.browser-BTIloVU8.js";import{h as r}from"./renderer-BaP2L8CT.js";import{d as s}from"./throttle-C93FMm2Z.js";import{a as l}from"./style-Ds52s5za.js";import{s as c}from"./search-insights-8OL2oeQN.js";const h=class{get host(){return n(this)}overflowMenu;overflowOpen=!1;logoUrl=location.protocol+"//"+location.host;cartUrl="";msgUrl="";loginUrl="";logoutUrl="";contactUrl="https://nanoporetech.com/contact";_sessionRedirect=window.location.href;get sessionRedirect(){return encodeURIComponent(this._sessionRedirect)}set sessionRedirect(n){this._sessionRedirect=n}cartCount=0;msgCount=0;async openOverflowMenu(){this.overflowOpen=!0}async closeOverflowMenu(){this.overflowOpen=!1}myAccountUrl;async handleMyAccountUrl(){this.myAccountUrl&&("local-logged-in"!==this.myAccountUrl?"local-logged-out"!==this.myAccountUrl?fetch(this.myAccountUrl+"/nav_bar_data.json").then((n=>n.json())).then((n=>{this.myAccountData=n})).catch((n=>{console.error("Error fetching MyAccount data",n)})):this.myAccountData=await import("./local-logged-out-BQyUtSml.js"):this.myAccountData=await import("./local-logged-in-Bh5fOkeO.js"))}myAccountData;nanoUserData;userLinks=[];isLoggedIn=!1;get myAccountUser(){return this.myAccountData?.user?.uuid?this.myAccountData.user:null}processUserData(){this.myAccountUser&&(this.userLinks=this.myAccountData?.links.filter((n=>"profile-panel-list"===n.area)),this.loginUrl=this.loginUrl||this.myAccountData.urls.login,this.logoutUrl=this.logoutUrl||this.myAccountData.urls.logout,this.msgUrl=this.msgUrl||this.myAccountData.urls.messages,this.msgCount=this.msgCount||this.myAccountData.notifications.count,this.cartUrl=this.cartUrl||this.myAccountData.urls.cart,this.cartCount=this.cartCount||this.myAccountData.cart.count,this.isLoggedIn=!0,this.nanoUserData.emit(this.myAccountUser))}formatLoginLink(n){return n?this.sessionRedirect?n.endsWith("=")?n+this.sessionRedirect:n.includes("?")?n+"&ReplayState="+this.sessionRedirect:n+"?ReplayState="+this.sessionRedirect:n:""}resizeObserver;cachedWidth;mainMenu;_mainMenuBar;get mainMenuBar(){return this._mainMenuBar}set mainMenuBar(n){this._mainMenuBar!==n&&(this._mainMenuBar=n,this.addMainmenuRo())}async triggerResize(){this.shouldResize=!0,this.breakpoint=0}shouldResize=!0;breakpoint=0;breakpointChanged(){this.breakpoint<this.bpPartials.mainMenu.breakpoint&&!1===this.shouldResize&&(this.overflowOpen=!1)}debounceResetResize=s((()=>{this.shouldResize=!1}),300);addMainmenuRo(){this.removeMainmenuRo(),(this.resizeObserver=new ResizeObserver((()=>{this.shouldResize||this.mainMenuBar.clientWidth>=this.cachedWidth&&0===this.breakpoint||this.mainMenuBar.clientWidth<=this.cachedWidth&&this.mainMenuBar.clientWidth>=this.mainMenu.scrollWidth||(this.shouldResize=!0,this.breakpoint=0)}))).observe(this.mainMenuBar)}removeMainmenuRo(){this.resizeObserver&&(this.mainMenuBar?this.resizeObserver.unobserve(this.mainMenuBar):this.resizeObserver.disconnect())}handleResize=()=>{this.shouldResize&&(this.breakpoint<4&&this.mainMenu.scrollWidth>this.mainMenuBar.clientWidth?this.breakpoint++:(this.cachedWidth=this.mainMenuBar.clientWidth,this.debounceResetResize()))};algoliaClient;searchResults;searchInput;activeIndex;autocompleteResults;searchForm;searchIndices=[];searchBarShown=!1;searchLoading=!1;_searchValue="";nanoSearchResult;nanoSearchError;nanoSearchReset;searchIndex="All";get searchValue(){return this._searchValue}set searchValue(n){n&&this.host.componentOnReady().then((()=>{this.searchBarShown=!0,this.handleSearchTermChangeEvent(n)}))}async submitSearch(){this.onSearchSubmit()}handleSearchIndex(){if(this.searchIndices?.length){if(this.searchIndex)return this.activeIndex=this.searchIndices.find((n=>n.name===this.searchIndex))||this.searchIndices[0],this.activeIndex;this.activeIndex=this.searchIndices[0]}}initSearch(){if(!this.myAccountData)return;const{search:n}=this.myAccountData;n?.app_id&&n?.api_key&&(this.algoliaClient=i(n.app_id,n.api_key),c.init(n.app_id,n.api_key).then((()=>{this.myAccountUser&&c.setUser(this.myAccountUser.uuid)})),this.searchIndices=this.myAccountData.search.indeces,this.searchIndices.forEach((n=>{n.algoliaIndex=this.algoliaClient.initIndex(n.index)})),this.searchIndex||(this.searchIndex=this.searchIndices[0].name))}onSearchSubmit=async n=>{if(n&&n.preventDefault(),!this.activeIndex||!this.myAccountData||this._searchValue?.length<3)return;this.searchResults||await this.doAlgoliaSearch();const{search:e}=this.myAccountData,a=this.searchResults?.results.find((n=>this.activeIndex.index===n.index)),{index:o,domain:t,filters:i,query:r,replicas:s}=a;this.searchBarShown=!1,this.nanoSearchResult.emit({meta:{indexTitle:a.indexName,index:o,domain:t,filters:i,query:r,replicas:s},client:{apiKey:e.api_key,appId:e.app_id}})};async doAlgoliaSearch(){if(this.searchResults=null,!this.algoliaClient)return;const n=this.searchIndices.map((n=>{const e={clickAnalytics:!0,attributesToSnippet:["body:5","title:8"],indexName:n.index,query:this._searchValue,facets:n.filters,hitsPerPage:5,filters:""};return"Community"===n.name&&(e.filters="created > "+Math.floor((Date.now()-631152e5)/1e3)),e}));try{this.searchLoading=!0,this.searchResults=this.processSearchResults(await this.algoliaClient.search(n))}catch(n){console.error(n),this.nanoSearchError.emit(n)}return this.searchLoading=!1,this.searchResults}processSearchResults(n){const e=n,a=n;return e?.results?(e.results.forEach(((n,a)=>{n={...n,indexName:this.searchIndices[a].name,selected:this.activeIndex.name===this.searchIndices[a].name,domain:this.activeIndex.domain||null,domains:this.myAccountData.domains||null,allGroup:!!this.searchIndices[a].allGroup,filters:this.searchIndices[a].filters,replicas:this.activeIndex.replicas},e.results[a]=this.processSearchResults(n)})),e):(a.hits.map((n=>{n.url&&!n.url.match(/^http/)&&(n.url=location.protocol+"//"+this.domainFor(n.origin)+n.url)})),a)}domainFor(n){if(!this.myAccountData)return"";const e=this.myAccountData.domains.find((e=>e.origin===n));return e?e.domain:""}async setAutocompleteResults(){this.autocompleteResults=null,this._searchValue.length<3?this._searchValue.length||this.nanoSearchReset.emit():this.autocompleteResults=(await this.doAlgoliaSearch())?.results.find((n=>n.selected))}autocompleteSnippet(n){return n._snippetResult?.title?.value||n.title}handleSearchOpenEvent=n=>{n.target.classList.contains("gn__search-dropdown")&&this.searchInput&&(this.searchInput.setFocus(),this.searchBarShown=!0)};handleSearchCloseEvent=n=>{n.target.classList.contains("gn__search-dropdown")&&(this.searchBarShown=!1)};handleSearchTermInputEvent=n=>{"input"===n.detail.type&&this.searchInput.value.length>=3&&(this.autocompleteResults=null,this.searchLoading=!0)};handleSearchTermChangeEvent=n=>{this._searchValue!==n&&(this._searchValue=n,this.setAutocompleteResults())};handleSearchIndexChangeEvent=n=>{if(!n.detail?.value?.length)return;const e=n.detail.value;if(this.activeIndex.index===e)return;const a=this.searchIndices.find((n=>n.index===e));a&&a.algoliaIndex&&(this.searchIndex=a.name,this._searchValue.length>=3&&(this.searchInput.setFocus(),this.searchBarShown=!0,this.setAutocompleteResults()))};constructor(n){e(this,n),this.nanoUserData=a(this,"nanoUserData",7),this.nanoSearchResult=a(this,"nanoSearchResult",7),this.nanoSearchError=a(this,"nanoSearchError",7),this.nanoSearchReset=a(this,"nanoSearchReset",7),this.handleResize=s(this.handleResize,75)}componentWillLoad(){this.handleMyAccountUrl(),this.initSearch(),this.processUserData(),l(this.host.shadowRoot)}componentDidRender(){this.handleResize()}loggedInPanel(){if(this.isLoggedIn&&this.myAccountUser)return r("div",{part:"user-panel",class:"gn__user-panel nano-theme-dark"},r("div",{class:"gn__user-panel-head",slot:"label"},r("nano-avatar",{initials:this.myAccountUser.first_name?.charAt(0)+this.myAccountUser.last_name?.charAt(0)},this.myAccountUser.small_avatar_url&&!this.myAccountUser.small_avatar_url.includes("generic")&&r("img",{src:this.myAccountUser.small_avatar_url,alt:"User Avatar",height:40,width:40})),r("div",null,this.myAccountUser.name,r("br",null),this.myAccountUser.job_title,", ",this.myAccountUser.company)),r("div",{class:"gn__user-panel-body"},this.userLinks.map((n=>r("a",{href:n.address,target:n.target||void 0},n.title,("Messages"===n.title||n.address.includes(this.msgUrl)||this.msgUrl.includes(n.address))&&this.msgCount>0&&r("nano-badge",{theme:"danger",strength:"2"},this.msgCount))))),r("div",{class:"gn__user-panel-foot"},r("nano-cta",{secondary:!0,size:"small",icon:"false",class:"gn__login-cta"},r("a",{href:this.formatLoginLink(this.logoutUrl)},"Logout"))))}bpPartials={contact:{tpl:()=>r("a",{href:this.contactUrl},"Contact"),breakpoint:0},mainMenu:{tpl:()=>r("slot",{name:"menu"}),breakpoint:1},logo:{tpl:()=>{},breakpoint:2}};noResultPartial(){if(this.searchLoading||this.autocompleteResults?.hits.length||this._searchValue.length<3)return;const n=[];return"All"===this.searchIndex?(n.push(r("div",{slot:"no-result",class:"gn__search-no-results"},'No results matching for "',r("strong",null,this._searchValue),'" Try another phrase')),n):(this.searchResults?.results.forEach((e=>{e.hits.length&&n.push(r("nano-option",{class:"gn__search-result",onNanoSelect:n=>{n.preventDefault(),this.searchIndex=e.indexName,this.onSearchSubmit(n)}},'Show results for "',r("strong",null,this._searchValue),'" in ',r("strong",null,e.indexName)))})),n.unshift(r("div",{slot:n.length?"list-top":"no-result",class:"gn__search-no-results"},'No results matching for "',r("strong",null,this._searchValue),'" in'," ",r("strong",null,this.searchIndex),". Try another phrase")),n)}render(){const n=this.bpPartials;return r(o,{key:"a11b011a86053bb118d2a2718fde17ba98a818a2",class:{"overflow-menu":this.breakpoint>n.mainMenu.breakpoint,"bar-menu":this.breakpoint<=n.mainMenu.breakpoint,"nano-global-nav":!0}},r("div",{key:"883aa872acfdd67b58b11bb6bd36f520e21308a6",class:{gn:!0,"gn__search-open":this.searchBarShown}},r("nano-drawer",{key:"8eab86995bdb7a64ab20a5922f8fed085c00dd9a",ref:n=>this.overflowMenu=n,label:"Main menu",part:"drawer",class:"gn__drawer nano-theme-dark",placement:"start",open:this.overflowOpen,onNanoAfterHide:()=>this.overflowOpen=!1,onNanoAfterShow:()=>this.overflowOpen=!0},r("div",{key:"bec24a05669c928f332f52531da350fede81e09b",class:"gn__drawer-header",part:"overflow-header",slot:"label"},"Main menu"),r("nav",{key:"79ea2417881502eea913922536255ff07a520dec",class:"gn__drawer-menu",part:"overflow-menu"},this.breakpoint>n.mainMenu.breakpoint?n.mainMenu.tpl():"",r("slot",{key:"139e672405b09a05784765c02fdcd2937ef72ee8",name:"overflow"}))),r("div",{key:"52f185901c3d7b53f94fe23598941c836177ca4f",class:"gn__menu-bar-wrapper"},r("div",{key:"8fa34c4322037f38f2804e385c90155ba0cc6566",class:"gn__menu-bar",part:"menu-bar",ref:n=>this.mainMenuBar=n},r("nav",{key:"807c175fb7c54c6e88fe03ef13b105b601110fc9",class:"gn__main-menu "+(this.shouldResize?"resizing":""),part:"main-menu",ref:n=>this.mainMenu=n},this.breakpoint>n.mainMenu.breakpoint&&r("nano-icon-button",{key:"4e524e4266f8b4c980bad91a821da3864d6ef7c5",class:"gn__overflow-button",iconName:"light/bars",label:"Open Menu",onClick:()=>this.overflowMenu.show()}),r("slot",{key:"cd5251ce86c170167cecc3927caeb3d96c46c038",name:"logo"},r("a",{key:"cba3f5560b1285b99e893adab8df08739d7a55ba",href:this.logoUrl,class:"gn__logo-link",part:"logo-link"},r("img",this.breakpoint<=n.logo.breakpoint?{src:t("../nano-assets/ont-logo.svg"),alt:"Oxford Nanopore Technologies logo. Features a stylised representation of a nanopore,\n                            (a tiny protein channel embedded in a membrane) through which DNA or RNA molecules are passed in for sequencing.",class:"gn__logo gn__logo--large",width:"152",height:"36",part:"logo logo--large"}:{src:t("../nano-assets/ont-wheel.svg"),alt:"Oxford Nanopore Technologies logo. A stylised representation of a nanopore,\n                            (a tiny protein channel embedded in a membrane) through which DNA or RNA molecules are passed in for sequencing.",class:"gn__logo gn__logo--small",width:"36",height:"36",part:"logo logo--small"}))),this.breakpoint<=n.mainMenu.breakpoint&&r("div",{key:"49ee4adade1ad0cda74fbb3fbd210f2469057b3e",class:"gn__main-menu-links"},n.mainMenu.tpl()),r("div",{key:"5600be22c0fcd69fb51a2e1ee9a5f4b3ea1a8c35",class:"gn__main-menu-actions"},r("nano-dropdown",{key:"24eabdc75c19c564382096ca71b7f1f8ad36a3b0",dialogTitle:"Search Oxford Nanopore Technologies",placement:"bottom",class:"gn__search-dropdown",skidding:-30,distance:25,open:this.searchBarShown,onNanoAfterShow:this.handleSearchOpenEvent,onNanoAfterHide:this.handleSearchCloseEvent,autoOpen:!!this.searchIndices.length},r("nano-icon-button",{key:"458613e1f5e9fe71ba73bc67b30725e3394251ba",class:"gn__search-button",slot:"trigger",iconName:"light/magnifying-glass",label:"Search"}),!!this.searchIndices.length&&r("form",{key:"844fb0cdc10c8c9e1e0e2c9d8a035c4e1e651b7f",ref:n=>this.searchForm=n,class:"gn__search-form",part:"search-form",onSubmit:this.onSearchSubmit},this.searchIndices.length>1&&r("nano-select",{key:"34493f43a9ce0a4143f2b506d3ff2c5983c0ebf2",part:"search-select",label:"Which site do you wish to search in?",mask:!0,hideLabel:!0,value:this.activeIndex?.index,onNanoChange:this.handleSearchIndexChangeEvent},this.searchIndices.map((n=>r("nano-option",{selected:n.name===this.searchIndex,value:n.index},n.name||n.index)))),r("nano-input",{key:"b8f9415058b665e618509e080a8d99de1d6875cf",ref:n=>this.searchInput=n,part:"search-input",label:"Search Oxford Nanopore Technologies",placeholder:"Search Oxford Nanopore...",hideLabel:!0,clearable:!0,onNanoChange:n=>{this.handleSearchTermChangeEvent(n.detail.value)},onNanoInput:this.handleSearchTermInputEvent,debounce:500,value:this._searchValue},r("nano-icon",{key:"fdce329dcd11f5fd47b80407cca87e4ba5586b6c",slot:"end",name:"light/magnifying-glass"}),r("nano-datalist",{key:"9647d74f50b93ffa2f7164d661382a7ba23a1518",class:"gn__search-results",onNanoSelect:n=>n.preventDefault(),dropDownConfig:{tetherTo:this.searchForm},disableFilter:!0},this.searchLoading&&r("div",{key:"f0b1bb77607ddbe71fe15a7ec0b4a0211e6c56b9",slot:"no-result",class:"gn__search-loading"},r("nano-spinner",{key:"0c87148566edcae34bfa237cd4fb8a4a8a482ee8"},"Searching...")),this.noResultPartial(),!!this.autocompleteResults?.hits.length&&[this.autocompleteResults.hits.map(((n,e)=>r("nano-option",{href:n.url,class:"gn__search-result",onClick:()=>{c.sendClick({index:this.activeIndex.index,eventName:"Global nav quick search - search result clicked",queryID:this.autocompleteResults.queryID,objectIDs:[n.objectID],positions:[e+1]})}},r("span",{innerHTML:this.autocompleteSnippet(n)})))),r("nano-option",{key:"a7b6d4ff2b9d356342bcb2fbbd03356d982953f3",class:"gn__search-viewall",onNanoSelect:this.onSearchSubmit},"View all results")])))),r("div",{key:"884fe3776886eaf768355c60ba5a8eb7d41caa54",class:"gn__cart"},r("nano-icon-button",{key:"17d8b0611855c47d200504c7885c270f20736109",iconName:"light/cart-shopping",label:"View your cart",href:this.cartUrl}),!!this.cartCount&&r("nano-badge",{key:"e00aed6a3ba8165f56738ab5494fabc66af68381",theme:"danger",strength:"2"},this.cartCount>9?"9+":this.cartCount)),this.breakpoint<=n.contact.breakpoint?n.contact.tpl():"",this.isLoggedIn?r("nano-dropdown",{dialogTitle:"User menu",class:"gn__user-dropdown",distance:10,placement:"bottom-end"},r("button",{slot:"trigger",class:"gn__user-dropdown-trigger"},r("nano-icon",{name:"light/user"}),r("nano-icon",{name:"light/chevron-down",class:"gn__user-dropdown-chevron"}),!!this.msgCount&&r("nano-badge",{theme:"danger",strength:"2"},this.msgCount>9?"9+":this.msgCount)),this.loggedInPanel()):r("nano-cta",{secondary:!0,size:"small",icon:"false",class:"gn__login-cta"},r("a",{href:this.formatLoginLink(this.loginUrl)},"Login")))))),r("nano-global-search-results",{key:"3b292618916afe3f08fc456c105df868725ddb26",part:"site-search-results"},r("div",{key:"8bb4b9fe8389ac2f4aa2784294fd1bd1f736e9c4",class:"gn__site",part:"site-wrapper"},r("slot",{key:"cf2327c16e479d36cc4f2dcd67d2c026518a3ebc"})))))}static get assetsDirs(){return["assets"]}static get watchers(){return{myAccountUrl:["handleMyAccountUrl"],myAccountData:["processUserData","initSearch"],shouldResize:["breakpointChanged"],breakpoint:["breakpointChanged"],searchIndices:["handleSearchIndex"],searchIndex:["handleSearchIndex"]}}};h.style=':host,*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}@media (prefers-reduced-motion: reduce){:host,*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}:host,*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}@media (prefers-reduced-motion: reduce){:host,*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}:host{--main-menu-bar-bg-color:var(--nano-color-base-0);--main-menu-text-color:var(--nano-color-base-1000);--main-menu-hover-text-color:var(--nano-color-primary-1000);--main-menu-active-text-color:var(--nano-color-primary-1200);--main-menu-active-border-color:var(--nano-color-primary-1000);--overflow-bg-color:var(--nano-color-grey-mono-1600);--overflow-text-color:var(--nano-color-basic-white);--overflow-hover-text-color:var(--nano-color-blue-cerulean-700);--overflow-active-text-color:var(--nano-color-blue-cerulean-300);display:block;color:var(--main-menu-text-color)}img{max-inline-size:none;display:block}::slotted(a),:host::slotted(a),a{text-decoration:none}a:has(img){display:inline-block}a:focus{outline:var(--nano-focus-ring);outline-offset:var(--nano-focus-ring-offset)}nano-drawer:not(:defined){display:none}nano-badge{position:absolute;font-size:0.5625rem;pointer-events:none}.gn__cart{position:relative}.gn__cart nano-badge{inset-block-start:-0.35rem;inset-inline-end:-0.4rem}.gn__login-cta{--bg:transparent;--font-size:var(--nano-font-size-2xs);--padding-v:0.5em}.gn__menu-bar-wrapper{z-index:var(--nano-z-index-menubar);position:relative}.gn__menu-bar-wrapper::after{content:"";position:absolute;block-size:1px;inline-size:100%;inset-inline:0;inset-block-end:-1px;z-index:-3;background-color:var(--nano-color-neutral-200)}.gn__menu-bar{inline-size:100%;overflow:clip;background-color:var(--main-menu-bar-bg-color)}.gn__menu-bar a{color:var(--main-menu-text-color)}.gn__menu-bar a:hover{color:var(--main-menu-hover-text-color)}.gn__menu-bar a:active{color:var(--main-menu-active-text-color)}.gn__main-menu{display:inline-flex;align-items:center;min-inline-size:100%;padding:var(--nano-spacing-md);transition:opacity var(--nano-transition-x-fast) ease;opacity:1}.gn__main-menu.resizing{transition:none;opacity:0}.gn__main-menu>*{margin-inline-end:var(--nano-spacing-xl)}.gn__main-menu>*:is(slot,slot-fb){display:flex}.gn__main-menu>*:last-child{margin-inline-end:0}.gn__overflow-button{--padding:0.5rem 0.875rem 0.5rem 0;margin-inline-end:0.875rem;font-size:1.125rem;position:relative}.gn__overflow-button::after{content:"";position:absolute;inline-size:1px;block-size:100%;inset-inline-end:0;background-color:var(--nano-color-neutral-300);opacity:0.7;inset-block-start:0}.gn__main-menu-links,.gn__main-menu-actions{display:inline-flex;align-items:center}.gn__main-menu-links .nano-icon,.gn__main-menu-links .nano-icon-button,.gn__main-menu-actions .nano-icon,.gn__main-menu-actions .nano-icon-button{--active-color:var(--main-menu-active-text-color);--hover-color:var(--main-menu-hover-text-color);font-size:1rem}.gn__main-menu-links .nano-icon-button:hover,.gn__main-menu-actions .nano-icon-button:hover{color:var(--main-menu-hover-text-color)}.gn__main-menu-links{gap:var(--nano-spacing-xl)}.gn__main-menu-links ::slotted(a),.gn__main-menu-links::slotted(a){color:var(--main-menu-text-color)}.gn__main-menu-links ::slotted(a:hover){color:var(--main-menu-hover-text-color)}.gn__main-menu-links ::slotted(*:active){color:var(--main-menu-active-text-color)}.gn__main-menu-actions{margin-inline-start:auto;font-size:0.9375rem;gap:var(--nano-spacing-md)}.gn__search-dropdown{--overflow:visible;--padding:0;--background:transparent}.gn__search-dropdown .nano-icon-button{position:relative}.gn__search-dropdown .nano-icon-button::before{content:"";position:absolute;background-color:var(--main-menu-active-border-color);block-size:4px;inset-inline:5px 2px;inset-block-end:-1.5625rem;transform:translateZ(0) scaleX(0);transform-origin:0 center;transition:transform var(--nano-transition-x-fast) ease-in-out}.gn__search-open .gn__search-dropdown .nano-icon-button::before{transform:translateZ(0) scaleX(1)}.gn__search-form{display:inline-flex;max-inline-size:100vw;inline-size:30.625rem}.gn__search-form .nano-select{--input-bg-color:var(--nano-color-neutral-200);flex:0}.gn__search-form .nano-select:focus-within{z-index:1}.gn__search-form .nano-select .form-ctrl__input{border-inline-end:none}.gn__search-form .nano-input{flex:1}.gn__search-results{--padding-start:var(--nano-spacing-md);--padding-top:var(--nano-spacing-sm);--padding-bottom:var(--nano-spacing-sm);font-size:var(--nano-font-size-2xs)}.gn__search-loading{display:flex;justify-content:center}.gn__search-result{--padding-start:0.3125rem;--padding-top:var(--nano-spacing-sm);--padding-bottom:var(--nano-spacing-sm);--bg-focus:var(--nano-color-primary-300);--color-focus:var(--nano-color-neutral-1400);--color:var(--nano-color-neutral-1400);font-size:var(--nano-font-size-2xs)}.gn__search-result .search__highlight{font-style:normal;background:var(--nano-color-highlight)}.gn__search-viewall{--bg-focus:var(--nano-color-primary-300);--color-focus:var(--nano-color-neutral-1400);--color:var(--nano-color-primary-1200)}.gn__search-viewall::part(label){justify-content:flex-end;text-decoration:underline}.gn__user-dropdown-trigger{all:unset;cursor:pointer;color:var(--nano-color-primary-1200);display:flex;white-space:nowrap;gap:var(--nano-spacing-xs);align-items:center;position:relative;padding-inline-start:var(--nano-spacing-md)}.gn__user-dropdown-trigger:hover{color:var(--main-menu-hover-text-color)}.gn__user-dropdown-trigger:active{color:var(--main-menu-active-text-color)}.gn__user-dropdown-trigger:focus-visible{outline:var(--nano-focus-ring);outline-offset:var(--nano-focus-ring-offset)}.gn__user-dropdown-trigger::before{content:"";position:absolute;inline-size:1px;block-size:100%;inset-inline-start:0;background-color:var(--nano-color-neutral-300);opacity:0.7;inset-block-start:0}.gn__user-dropdown-trigger .gn__user-dropdown-chevron{transition:rotate var(--nano-transition-x-fast) linear}[open] .gn__user-dropdown-trigger .gn__user-dropdown-chevron{rotate:180deg}.gn__user-dropdown-trigger nano-badge{inset-block-start:-0.7rem;inset-inline-end:-0.7rem}.gn__user-dropdown{--background:var(--overflow-bg-color);--padding:0;--overflow:visible}.gn__user-panel{inline-size:21.25rem;max-inline-size:21.25rem;color:var(--overflow-text-color);padding:var(--nano-spacing-md)}.gn__user-panel a{color:var(--overflow-text-color)}.gn__user-panel a:hover{text-decoration:underline;color:var(--overflow-hover-text-color)}.gn__user-panel-head{font-size:var(--nano-font-size-xs);line-height:var(--nano-line-height-normal);letter-spacing:var(--nano-letter-spacing-loose);padding-block-end:var(--nano-spacing-md);display:flex;align-items:center;gap:var(--nano-spacing-sm);font-size:var(--nano-font-size-xs)}.gn__user-panel-head .gn__user-avatar nano-icon{font-size:2.5rem}.gn__user-panel-body{display:flex;flex-direction:column}.gn__user-panel-body a{position:relative;border-block-end:1px solid rgb(var(--nano-color-base-rgb-1000)/10%);padding-block:var(--nano-spacing-md)}.gn__user-panel-body a:first-child{border-block-start:1px solid rgb(var(--nano-color-base-rgb-1000)/10%)}.gn__user-panel-foot{padding-block-start:var(--nano-spacing-md);display:flex;align-items:center;justify-content:space-between;gap:var(--nano-spacing-md)}.gn__drawer{--panel-background:var(--overflow-bg-color);--header-button-color:var(--overflow-text-color);--body-spacing:0;--header-spacing:var(--nano-spacing-md) 0;--footer-spacing:var(--nano-spacing-md)}.gn__drawer::part(title){display:flex;justify-content:flex-end}.gn__drawer::part(header-actions){order:-1}.gn__drawer-header{clip-path:inset(50%);block-size:1px;overflow:hidden;position:absolute;white-space:nowrap;inline-size:1px}.gn__drawer-menu{display:flex;flex-direction:column;margin:0 var(--nano-spacing-md);padding-block-end:var(--nano-spacing-md);color:var(--overflow-text-color);border-block-start:1px solid rgb(var(--nano-color-base-rgb-1000)/10%);position:relative}.gn__drawer-menu ::slotted(a),.gn__drawer-menu::slotted(a){padding:var(--nano-spacing-md) 0}.gn__drawer-menu ::slotted(a),.gn__drawer-menu ::slotted(.nano-nav-item),.gn__drawer-menu::slotted(a),.gn__drawer-menu::slotted(.nano-nav-item){--padding:var(--nano-spacing-md) 0;display:block;color:inherit !important;border-block-end:1px solid rgb(var(--nano-color-base-rgb-1000)/10%)}.gn__drawer-menu ::slotted(a:hover),.gn__drawer-menu ::slotted(.nano-nav-item:hover){text-decoration:underline;color:var(--overflow-hover-text-color) !important}';export{h as nano_global_nav}
+import{g as n,r as e,c as a,a as o,k as t}from"./index-BM3Om9WE.js";import{a as i}from"./algoliasearch-lite.esm.browser-BTIloVU8.js";import{h as r}from"./renderer-BaP2L8CT.js";import{d as s}from"./throttle-C93FMm2Z.js";import{a as l}from"./style-Ds52s5za.js";import{s as c}from"./search-insights-8OL2oeQN.js";const h=class{get host(){return n(this)}overflowMenu;overflowOpen=!1;logoUrl=location.protocol+"//"+location.host;cartUrl="";msgUrl="";loginUrl="";logoutUrl="";contactUrl="https://nanoporetech.com/contact";_sessionRedirect=window.location.href;get sessionRedirect(){return encodeURIComponent(this._sessionRedirect)}set sessionRedirect(n){this._sessionRedirect=n}cartCount=0;msgCount=0;async openOverflowMenu(){this.overflowOpen=!0}async closeOverflowMenu(){this.overflowOpen=!1}myAccountUrl;async handleMyAccountUrl(){this.myAccountUrl&&("local-logged-in"!==this.myAccountUrl?"local-logged-out"!==this.myAccountUrl?fetch(this.myAccountUrl+"/nav_bar_data.json").then((n=>n.json())).then((n=>{this.myAccountData=n})).catch((n=>{console.error("Error fetching MyAccount data",n)})):this.myAccountData=await import("./local-logged-out-BQyUtSml.js"):this.myAccountData=await import("./local-logged-in-Bh5fOkeO.js"))}myAccountData;nanoUserData;userLinks=[];isLoggedIn=!1;get myAccountUser(){return this.myAccountData?.user?.uuid?this.myAccountData.user:null}processUserData(){this.myAccountUser&&(this.userLinks=this.myAccountData?.links.filter((n=>"profile-panel-list"===n.area)),this.loginUrl=this.loginUrl||this.myAccountData.urls.login,this.logoutUrl=this.logoutUrl||this.myAccountData.urls.logout,this.msgUrl=this.msgUrl||this.myAccountData.urls.messages,this.msgCount=this.msgCount||this.myAccountData.notifications.count,this.cartUrl=this.cartUrl||this.myAccountData.urls.cart,this.cartCount=this.cartCount||this.myAccountData.cart.count,this.isLoggedIn=!0,this.nanoUserData.emit(this.myAccountUser))}formatLoginLink(n){return n?this.sessionRedirect?n.endsWith("=")?n+this.sessionRedirect:n.includes("?")?n+"&ReplayState="+this.sessionRedirect:n+"?ReplayState="+this.sessionRedirect:n:""}resizeObserver;cachedWidth;mainMenu;_mainMenuBar;get mainMenuBar(){return this._mainMenuBar}set mainMenuBar(n){this._mainMenuBar!==n&&(this._mainMenuBar=n,this.addMainmenuRo())}async triggerResize(){this.shouldResize=!0,this.breakpoint=0}shouldResize=!0;breakpoint=0;breakpointChanged(){this.breakpoint<this.bpPartials.mainMenu.breakpoint&&!1===this.shouldResize&&(this.overflowOpen=!1)}debounceResetResize=s((()=>{this.shouldResize=!1}),300);addMainmenuRo(){this.removeMainmenuRo(),(this.resizeObserver=new ResizeObserver((()=>{this.shouldResize||this.mainMenuBar.clientWidth>=this.cachedWidth&&0===this.breakpoint||this.mainMenuBar.clientWidth<=this.cachedWidth&&this.mainMenuBar.clientWidth>=this.mainMenu.scrollWidth||(this.shouldResize=!0,this.breakpoint=0)}))).observe(this.mainMenuBar)}removeMainmenuRo(){this.resizeObserver&&(this.mainMenuBar?this.resizeObserver.unobserve(this.mainMenuBar):this.resizeObserver.disconnect())}handleResize=()=>{this.shouldResize&&(this.breakpoint<4&&this.mainMenu.scrollWidth>this.mainMenuBar.clientWidth?this.breakpoint++:(this.cachedWidth=this.mainMenuBar.clientWidth,this.debounceResetResize()))};algoliaClient;searchResults;searchInput;activeIndex;autocompleteResults;searchForm;searchIndices=[];searchBarShown=!1;searchLoading=!1;_searchValue="";nanoSearchResult;nanoSearchError;nanoSearchReset;searchIndex="All";get searchValue(){return this._searchValue}set searchValue(n){n&&this.host.componentOnReady().then((()=>{this.searchBarShown=!0,this.handleSearchTermChangeEvent(n)}))}async submitSearch(){this.onSearchSubmit()}handleSearchIndex(){if(this.searchIndices?.length){if(this.searchIndex)return this.activeIndex=this.searchIndices.find((n=>n.name===this.searchIndex))||this.searchIndices[0],this.activeIndex;this.activeIndex=this.searchIndices[0]}}initSearch(){if(!this.myAccountData)return;const{search:n}=this.myAccountData;n?.app_id&&n?.api_key&&(this.algoliaClient=i(n.app_id,n.api_key),c.init(n.app_id,n.api_key).then((()=>{this.myAccountUser&&c.setUser(this.myAccountUser.uuid)})),this.searchIndices=this.myAccountData.search.indeces,this.searchIndices.forEach((n=>{n.algoliaIndex=this.algoliaClient.initIndex(n.index)})),this.searchIndex||(this.searchIndex=this.searchIndices[0].name))}onSearchSubmit=async n=>{if(n&&n.preventDefault(),!this.activeIndex||!this.myAccountData||this._searchValue?.length<3)return;this.searchResults||await this.doAlgoliaSearch();const{search:e}=this.myAccountData,a=this.searchResults?.results.find((n=>this.activeIndex.index===n.index)),{index:o,domain:t,filters:i,query:r,replicas:s}=a;this.searchBarShown=!1,this.nanoSearchResult.emit({meta:{indexTitle:a.indexName,index:o,domain:t,filters:i,query:r,replicas:s},client:{apiKey:e.api_key,appId:e.app_id}})};async doAlgoliaSearch(){if(this.searchResults=null,!this.algoliaClient)return;const n=this.searchIndices.map((n=>{const e={clickAnalytics:!0,attributesToSnippet:["body:5","title:8"],indexName:n.index,query:this._searchValue,facets:n.filters,hitsPerPage:5,filters:""};return"Community"===n.name&&(e.filters="created > "+Math.floor((Date.now()-631152e5)/1e3)),e}));try{this.searchLoading=!0,this.searchResults=this.processSearchResults(await this.algoliaClient.search(n))}catch(n){console.error(n),this.nanoSearchError.emit(n)}return this.searchLoading=!1,this.searchResults}processSearchResults(n){const e=n,a=n;return e?.results?(e.results.forEach(((n,a)=>{n={...n,indexName:this.searchIndices[a].name,selected:this.activeIndex.name===this.searchIndices[a].name,domain:this.activeIndex.domain||null,domains:this.myAccountData.domains||null,allGroup:!!this.searchIndices[a].allGroup,filters:this.searchIndices[a].filters,replicas:this.activeIndex.replicas},e.results[a]=this.processSearchResults(n)})),e):(a.hits.map((n=>{n.url&&!n.url.match(/^http/)&&(n.url=location.protocol+"//"+this.domainFor(n.origin)+n.url)})),a)}domainFor(n){if(!this.myAccountData)return"";const e=this.myAccountData.domains.find((e=>e.origin===n));return e?e.domain:""}async setAutocompleteResults(){this.autocompleteResults=null,this._searchValue.length<3?this._searchValue.length||this.nanoSearchReset.emit():this.autocompleteResults=(await this.doAlgoliaSearch())?.results.find((n=>n.selected))}autocompleteSnippet(n){return n._snippetResult?.title?.value||n.title}handleSearchOpenEvent=n=>{n.target.classList.contains("gn__search-dropdown")&&this.searchInput&&(this.searchInput.setFocus(),this.searchBarShown=!0)};handleSearchCloseEvent=n=>{n.target.classList.contains("gn__search-dropdown")&&requestAnimationFrame((()=>this.searchBarShown=!1))};handleSearchTermInputEvent=n=>{"input"===n.detail.type&&this.searchInput.value.length>=3&&(this.autocompleteResults=null,this.searchLoading=!0)};handleSearchTermChangeEvent=n=>{this._searchValue!==n&&(this._searchValue=n,this.setAutocompleteResults())};handleSearchIndexChangeEvent=n=>{if(!n.detail?.value?.length)return;const e=n.detail.value;if(this.activeIndex.index===e)return;const a=this.searchIndices.find((n=>n.index===e));a&&a.algoliaIndex&&(this.searchIndex=a.name,this._searchValue.length>=3&&(this.searchInput.setFocus(),this.searchBarShown=!0,this.setAutocompleteResults()))};constructor(n){e(this,n),this.nanoUserData=a(this,"nanoUserData",7),this.nanoSearchResult=a(this,"nanoSearchResult",7),this.nanoSearchError=a(this,"nanoSearchError",7),this.nanoSearchReset=a(this,"nanoSearchReset",7),this.handleResize=s(this.handleResize,75)}componentWillLoad(){this.handleMyAccountUrl(),this.initSearch(),this.processUserData(),l(this.host.shadowRoot)}componentDidRender(){this.handleResize()}loggedInPanel(){if(this.isLoggedIn&&this.myAccountUser)return r("div",{part:"user-panel",class:"gn__user-panel nano-theme-dark"},r("div",{class:"gn__user-panel-head",slot:"label"},r("nano-avatar",{initials:this.myAccountUser.first_name?.charAt(0)+this.myAccountUser.last_name?.charAt(0)},this.myAccountUser.small_avatar_url&&!this.myAccountUser.small_avatar_url.includes("generic")&&r("img",{src:this.myAccountUser.small_avatar_url,alt:"User Avatar",height:40,width:40})),r("div",null,this.myAccountUser.name,r("br",null),this.myAccountUser.job_title,", ",this.myAccountUser.company)),r("div",{class:"gn__user-panel-body"},this.userLinks.map((n=>r("a",{href:n.address,target:n.target||void 0},n.title,("Messages"===n.title||n.address.includes(this.msgUrl)||this.msgUrl.includes(n.address))&&this.msgCount>0&&r("nano-badge",{theme:"danger",strength:"2"},this.msgCount))))),r("div",{class:"gn__user-panel-foot"},r("nano-cta",{secondary:!0,size:"small",icon:"false",class:"gn__login-cta"},r("a",{href:this.formatLoginLink(this.logoutUrl)},"Logout"))))}bpPartials={contact:{tpl:()=>r("a",{href:this.contactUrl},"Contact"),breakpoint:0},mainMenu:{tpl:()=>r("slot",{name:"menu"}),breakpoint:1},logo:{tpl:()=>{},breakpoint:2}};noResultPartial(){if(this.searchLoading||this.autocompleteResults?.hits.length||this._searchValue.length<3)return;const n=[];return"All"===this.searchIndex?(n.push(r("div",{slot:"no-result",class:"gn__search-no-results"},'No results matching for "',r("strong",null,this._searchValue),'" Try another phrase')),n):(this.searchResults?.results.forEach((e=>{e.hits.length&&n.push(r("nano-option",{class:"gn__search-result",onNanoSelect:n=>{n.preventDefault(),this.searchIndex=e.indexName,this.onSearchSubmit(n)}},'Show results for "',r("strong",null,this._searchValue),'" in ',r("strong",null,e.indexName)))})),n.unshift(r("div",{slot:n.length?"list-top":"no-result",class:"gn__search-no-results"},'No results matching for "',r("strong",null,this._searchValue),'" in'," ",r("strong",null,this.searchIndex),". Try another phrase")),n)}render(){const n=this.bpPartials;return r(o,{key:"3964e8a3aab86d4252876816ca934c69e75da22b",class:{"overflow-menu":this.breakpoint>n.mainMenu.breakpoint,"bar-menu":this.breakpoint<=n.mainMenu.breakpoint,"nano-global-nav":!0}},r("div",{key:"fc2f728b3c4412913ffc2d18c07d057bf6e0bf87",class:{gn:!0,"gn__search-open":this.searchBarShown}},r("nano-drawer",{key:"9a2c9109327ff9cd4eb2553df7e93571a29aa237",ref:n=>this.overflowMenu=n,label:"Main menu",part:"drawer",class:"gn__drawer nano-theme-dark",placement:"start",open:this.overflowOpen,onNanoAfterHide:()=>this.overflowOpen=!1,onNanoAfterShow:()=>this.overflowOpen=!0},r("div",{key:"649c672f237ce2145eda6c8988744f6709835615",class:"gn__drawer-header",part:"overflow-header",slot:"label"},"Main menu"),r("nav",{key:"d002c07a9eb1cdcc4e188e5b146ce8a11257ab98",class:"gn__drawer-menu",part:"overflow-menu"},this.breakpoint>n.mainMenu.breakpoint?n.mainMenu.tpl():"",r("slot",{key:"b6bf65e8ed92636f1eba4b376ecb2fd617bcd67f",name:"overflow"}))),r("div",{key:"b7a5e9d074b63f1841d3946d0166389c73161f25",class:"gn__menu-bar-wrapper"},r("div",{key:"6b4d27a83ed4cbf3a62c0b924b08c887e415904a",class:"gn__menu-bar",part:"menu-bar",ref:n=>this.mainMenuBar=n},r("nav",{key:"64acb1e7f44c8931bd928e0c6be01eaf83cf47ff",class:"gn__main-menu "+(this.shouldResize?"resizing":""),part:"main-menu",ref:n=>this.mainMenu=n},this.breakpoint>n.mainMenu.breakpoint&&r("nano-icon-button",{key:"49dc9cf7e3d75dee49d7a50defde7a260c33f867",class:"gn__overflow-button",iconName:"light/bars",label:"Open Menu",onClick:()=>this.overflowMenu.show()}),r("slot",{key:"ffb1b38b1e7682ab2fe26d44a0c9686306634197",name:"logo"},r("a",{key:"a8427d3042b4871027a08b5ea993c57659ab12c0",href:this.logoUrl,class:"gn__logo-link",part:"logo-link"},r("img",this.breakpoint<=n.logo.breakpoint?{src:t("../nano-assets/ont-logo.svg"),alt:"Oxford Nanopore Technologies logo. Features a stylised representation of a nanopore,\n                            (a tiny protein channel embedded in a membrane) through which DNA or RNA molecules are passed in for sequencing.",class:"gn__logo gn__logo--large",width:"152",height:"36",part:"logo logo--large"}:{src:t("../nano-assets/ont-wheel.svg"),alt:"Oxford Nanopore Technologies logo. A stylised representation of a nanopore,\n                            (a tiny protein channel embedded in a membrane) through which DNA or RNA molecules are passed in for sequencing.",class:"gn__logo gn__logo--small",width:"36",height:"36",part:"logo logo--small"}))),this.breakpoint<=n.mainMenu.breakpoint&&r("div",{key:"51d372b7aaa316b4d1ddc945bf0b3c5cdba579af",class:"gn__main-menu-links"},n.mainMenu.tpl()),r("div",{key:"7af369c343889985cfda4d596576e6ad0913f34c",class:"gn__main-menu-actions"},!this.myAccountData||!!this.searchIndices.length&&r("nano-dropdown",{key:"f122c285ba5966efe5fdb5698ab759fa89eb9282",dialogTitle:"Search Oxford Nanopore Technologies",placement:"bottom",class:"gn__search-dropdown",skidding:-30,distance:25,open:this.searchBarShown,onNanoAfterShow:this.handleSearchOpenEvent,onNanoAfterHide:this.handleSearchCloseEvent,autoOpen:!!this.searchIndices.length},r("nano-icon-button",{key:"8fe139d799eeb34b1ff129808338ce8d6304d262",class:"gn__search-button",slot:"trigger",iconName:"light/magnifying-glass",label:"Search"}),r("form",{key:"95d27edc95e00c96ce9751e9501429e0062bcab6",ref:n=>this.searchForm=n,class:"gn__search-form",part:"search-form",onSubmit:this.onSearchSubmit},this.searchIndices.length>1&&r("nano-select",{key:"109461b01a0cbd6ee5c0d0120d93802f8b4a2642",part:"search-select",label:"Which site do you wish to search in?",mask:!0,hideLabel:!0,value:this.activeIndex?.index,onNanoChange:this.handleSearchIndexChangeEvent},this.searchIndices.map((n=>r("nano-option",{selected:n.name===this.searchIndex,value:n.index},n.name||n.index)))),r("nano-input",{key:"81d5c3531557500daebe167defe8b068909ffe9f",ref:n=>this.searchInput=n,part:"search-input",label:"Search Oxford Nanopore Technologies",placeholder:"Search Oxford Nanopore...",hideLabel:!0,clearable:!0,showInlineError:!1,onNanoChange:n=>{this.handleSearchTermChangeEvent(n.detail.value)},onNanoInput:this.handleSearchTermInputEvent,debounce:500,value:this._searchValue},r("nano-icon",{key:"4c3dc50a07877f4c10bbebe2b91d5cc2a6924aee",slot:"end",name:"light/magnifying-glass"}),r("nano-datalist",{key:"ab9037d4d2c5dc5bca7cdb21ced7a50a5ea181b1",class:"gn__search-results",onNanoSelect:n=>n.preventDefault(),dropDownConfig:{tetherTo:this.searchForm},disableFilter:!0},this.searchLoading&&r("div",{key:"794cbd8cc6fd876e931457c93caad690be445400",slot:"no-result",class:"gn__search-loading"},r("nano-spinner",{key:"de620a03a8bba906542c10e46d1529f1b6a63327"},"Searching...")),this.noResultPartial(),!!this.autocompleteResults?.hits.length&&[this.autocompleteResults.hits.map(((n,e)=>r("nano-option",{href:n.url,class:"gn__search-result",onClick:()=>{c.sendClick({index:this.activeIndex.index,eventName:"Global nav quick search - search result clicked",queryID:this.autocompleteResults.queryID,objectIDs:[n.objectID],positions:[e+1]})}},r("span",{innerHTML:this.autocompleteSnippet(n)})))),r("nano-option",{key:"35962d666c2f47c4952f1a06324db3db186a21e1",class:"gn__search-viewall",onNanoSelect:this.onSearchSubmit},"View all results")])))),r("div",{key:"930f8a1adb7566478ec7e9e96b08ecdefecfd4b8",class:"gn__cart"},r("nano-icon-button",{key:"76f447b14988391240284c66d1e6e347c8873067",iconName:"light/cart-shopping",label:"View your cart",href:this.cartUrl}),!!this.cartCount&&r("nano-badge",{key:"389552b85553b498ce5b799dc182f73933dadc59",theme:"danger",strength:"2"},this.cartCount>9?"9+":this.cartCount)),this.breakpoint<=n.contact.breakpoint?n.contact.tpl():"",this.isLoggedIn?r("nano-dropdown",{dialogTitle:"User menu",class:"gn__user-dropdown",distance:10,placement:"bottom-end"},r("button",{slot:"trigger",class:"gn__user-dropdown-trigger"},r("nano-icon",{name:"light/user"}),r("nano-icon",{name:"light/chevron-down",class:"gn__user-dropdown-chevron"}),!!this.msgCount&&r("nano-badge",{theme:"danger",strength:"2"},this.msgCount>9?"9+":this.msgCount)),this.loggedInPanel()):r("nano-cta",{secondary:!0,size:"small",icon:"false",class:"gn__login-cta"},r("a",{href:this.formatLoginLink(this.loginUrl)},"Login")))))),r("nano-global-search-results",{key:"38b900fdb5dbcd1d24642c8862c320c473de6dc3",part:"site-search-results"},r("div",{key:"b5b824f4a54aa2989ca0a359f7c7b74ae5e6d777",class:"gn__site",part:"site-wrapper"},r("slot",{key:"02dd2c08252ba31c972fffe9c956e7ead76f61ef"})))))}static get assetsDirs(){return["assets"]}static get watchers(){return{myAccountUrl:["handleMyAccountUrl"],myAccountData:["processUserData","initSearch"],shouldResize:["breakpointChanged"],breakpoint:["breakpointChanged"],searchIndices:["handleSearchIndex"],searchIndex:["handleSearchIndex"]}}};h.style=':host,*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}@media (prefers-reduced-motion: reduce){:host,*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}:host,*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}@media (prefers-reduced-motion: reduce){:host,*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}:host{--main-menu-bar-bg-color:var(--nano-color-base-0);--main-menu-text-color:var(--nano-color-base-1000);--main-menu-hover-text-color:var(--nano-color-primary-1000);--main-menu-active-text-color:var(--nano-color-primary-1200);--main-menu-active-border-color:var(--nano-color-primary-1000);--overflow-bg-color:var(--nano-color-grey-mono-1600);--overflow-text-color:var(--nano-color-basic-white);--overflow-hover-text-color:var(--nano-color-blue-cerulean-700);--overflow-active-text-color:var(--nano-color-blue-cerulean-300);display:block;color:var(--main-menu-text-color)}img{max-inline-size:none;display:block}::slotted(a),:host::slotted(a),a{text-decoration:none}a:has(img){display:inline-block}a:focus{outline:var(--nano-focus-ring);outline-offset:var(--nano-focus-ring-offset)}nano-drawer:not(:defined){display:none}nano-badge{position:absolute;font-size:0.5625rem;pointer-events:none}.gn__cart{position:relative}.gn__cart nano-badge{inset-block-start:-0.35rem;inset-inline-end:-0.4rem}.gn__login-cta{--bg:transparent;--font-size:var(--nano-font-size-2xs);--padding-v:0.5em}.gn__menu-bar-wrapper{z-index:var(--nano-z-index-menubar);position:relative}.gn__menu-bar-wrapper::after{content:"";position:absolute;block-size:1px;inline-size:100%;inset-inline:0;inset-block-end:-1px;z-index:-3;background-color:var(--nano-color-neutral-200)}.gn__menu-bar{inline-size:100%;overflow:clip;background-color:var(--main-menu-bar-bg-color)}.gn__menu-bar a{color:var(--main-menu-text-color)}.gn__menu-bar a:hover{color:var(--main-menu-hover-text-color)}.gn__menu-bar a:active{color:var(--main-menu-active-text-color)}.gn__main-menu{display:inline-flex;align-items:center;min-inline-size:100%;padding:var(--nano-spacing-md);transition:opacity var(--nano-transition-x-fast) ease;opacity:1}.gn__main-menu.resizing{transition:none;opacity:0}.gn__main-menu>*{margin-inline-end:var(--nano-spacing-xl)}.gn__main-menu>*:is(slot,slot-fb){display:flex}.gn__main-menu>*:last-child{margin-inline-end:0}.gn__overflow-button{--padding:0.5rem 0.875rem 0.5rem 0;margin-inline-end:0.875rem;font-size:1.125rem;position:relative}.gn__overflow-button::after{content:"";position:absolute;inline-size:1px;block-size:100%;inset-inline-end:0;background-color:var(--nano-color-neutral-300);opacity:0.7;inset-block-start:0}.gn__main-menu-links,.gn__main-menu-actions{display:inline-flex;align-items:center}.gn__main-menu-links .nano-icon,.gn__main-menu-links .nano-icon-button,.gn__main-menu-actions .nano-icon,.gn__main-menu-actions .nano-icon-button{--active-color:var(--main-menu-active-text-color);--hover-color:var(--main-menu-hover-text-color);font-size:1rem}.gn__main-menu-links .nano-icon-button:hover,.gn__main-menu-actions .nano-icon-button:hover{color:var(--main-menu-hover-text-color)}.gn__main-menu-links{gap:var(--nano-spacing-xl)}.gn__main-menu-links ::slotted(a),.gn__main-menu-links::slotted(a){color:var(--main-menu-text-color)}.gn__main-menu-links ::slotted(a:hover){color:var(--main-menu-hover-text-color)}.gn__main-menu-links ::slotted(*:active){color:var(--main-menu-active-text-color)}.gn__main-menu-actions{margin-inline-start:auto;font-size:0.9375rem;gap:var(--nano-spacing-md)}.gn__search-dropdown{--overflow:visible;--padding:0;--background:transparent}.gn__search-dropdown .nano-icon-button{position:relative}.gn__search-dropdown .nano-icon-button::before{content:"";position:absolute;background-color:var(--main-menu-active-border-color);block-size:4px;inset-inline:5px 2px;inset-block-end:-1.5625rem;transform:translateZ(0) scaleX(0);transform-origin:0 center;transition:transform var(--nano-transition-x-fast) ease-in-out}.gn__search-open .gn__search-dropdown .nano-icon-button::before{transform:translateZ(0) scaleX(1)}.gn__search-form{display:inline-flex;max-inline-size:100vw;inline-size:30.625rem}.gn__search-form .nano-select{--input-bg-color:var(--nano-color-neutral-200);flex:0}.gn__search-form .nano-select:focus-within{z-index:1}.gn__search-form .nano-select .form-ctrl__input{border-inline-end:none}.gn__search-form .nano-input{flex:1}.gn__search-results{--padding-start:var(--nano-spacing-md);--padding-top:var(--nano-spacing-sm);--padding-bottom:var(--nano-spacing-sm);font-size:var(--nano-font-size-2xs)}.gn__search-loading{display:flex;justify-content:center}.gn__search-result{--padding-start:0.3125rem;--padding-top:var(--nano-spacing-sm);--padding-bottom:var(--nano-spacing-sm);--bg-focus:var(--nano-color-primary-300);--color-focus:var(--nano-color-neutral-1400);--color:var(--nano-color-neutral-1400);font-size:var(--nano-font-size-2xs)}.gn__search-result .search__highlight{font-style:normal;background:var(--nano-color-highlight)}.gn__search-viewall{--bg-focus:var(--nano-color-primary-300);--color-focus:var(--nano-color-neutral-1400);--color:var(--nano-color-primary-1200)}.gn__search-viewall::part(label){justify-content:flex-end;text-decoration:underline}.gn__user-dropdown-trigger{all:unset;cursor:pointer;color:var(--nano-color-primary-1200);display:flex;white-space:nowrap;gap:var(--nano-spacing-xs);align-items:center;position:relative;padding-inline-start:var(--nano-spacing-md)}.gn__user-dropdown-trigger:hover{color:var(--main-menu-hover-text-color)}.gn__user-dropdown-trigger:active{color:var(--main-menu-active-text-color)}.gn__user-dropdown-trigger:focus-visible{outline:var(--nano-focus-ring);outline-offset:var(--nano-focus-ring-offset)}.gn__user-dropdown-trigger::before{content:"";position:absolute;inline-size:1px;block-size:100%;inset-inline-start:0;background-color:var(--nano-color-neutral-300);opacity:0.7;inset-block-start:0}.gn__user-dropdown-trigger .gn__user-dropdown-chevron{transition:rotate var(--nano-transition-x-fast) linear}[open] .gn__user-dropdown-trigger .gn__user-dropdown-chevron{rotate:180deg}.gn__user-dropdown-trigger nano-badge{inset-block-start:-0.7rem;inset-inline-end:-0.7rem}.gn__user-dropdown{--background:var(--overflow-bg-color);--padding:0;--overflow:visible}.gn__user-panel{inline-size:21.25rem;max-inline-size:21.25rem;color:var(--overflow-text-color);padding:var(--nano-spacing-md)}.gn__user-panel a{color:var(--overflow-text-color)}.gn__user-panel a:hover{text-decoration:underline;color:var(--overflow-hover-text-color)}.gn__user-panel-head{font-size:var(--nano-font-size-xs);line-height:var(--nano-line-height-normal);letter-spacing:var(--nano-letter-spacing-loose);padding-block-end:var(--nano-spacing-md);display:flex;align-items:center;gap:var(--nano-spacing-sm);font-size:var(--nano-font-size-xs)}.gn__user-panel-head .gn__user-avatar nano-icon{font-size:2.5rem}.gn__user-panel-body{display:flex;flex-direction:column}.gn__user-panel-body a{position:relative;border-block-end:1px solid rgb(var(--nano-color-base-rgb-1000)/10%);padding-block:var(--nano-spacing-md)}.gn__user-panel-body a:first-child{border-block-start:1px solid rgb(var(--nano-color-base-rgb-1000)/10%)}.gn__user-panel-foot{padding-block-start:var(--nano-spacing-md);display:flex;align-items:center;justify-content:space-between;gap:var(--nano-spacing-md)}.gn__drawer{--panel-background:var(--overflow-bg-color);--header-button-color:var(--overflow-text-color);--body-spacing:0;--header-spacing:var(--nano-spacing-md) 0;--footer-spacing:var(--nano-spacing-md)}.gn__drawer::part(title){display:flex;justify-content:flex-end}.gn__drawer::part(header-actions){order:-1}.gn__drawer-header{clip-path:inset(50%);block-size:1px;overflow:hidden;position:absolute;white-space:nowrap;inline-size:1px}.gn__drawer-menu{display:flex;flex-direction:column;margin:0 var(--nano-spacing-md);padding-block-end:var(--nano-spacing-md);color:var(--overflow-text-color);border-block-start:1px solid rgb(var(--nano-color-base-rgb-1000)/10%);position:relative}.gn__drawer-menu ::slotted(a),.gn__drawer-menu::slotted(a){padding:var(--nano-spacing-md) 0}.gn__drawer-menu ::slotted(a),.gn__drawer-menu ::slotted(.nano-nav-item),.gn__drawer-menu::slotted(a),.gn__drawer-menu::slotted(.nano-nav-item){--padding:var(--nano-spacing-md) 0;display:block;color:inherit !important;border-block-end:1px solid rgb(var(--nano-color-base-rgb-1000)/10%)}.gn__drawer-menu ::slotted(a:hover),.gn__drawer-menu ::slotted(.nano-nav-item:hover){text-decoration:underline;color:var(--overflow-hover-text-color) !important}';export{h as nano_global_nav}

package/dist/nano-components/nano-grid-item.entry.js

@@ -1,4 +1,4 @@
 /*!
  * Custom elements for Nanopore-Digital Web applications
  */
-import{r as e,h as r}from"./index-BM3Om9WE.js";const s=class{constructor(r){e(this,r)}render(){return r("slot",{key:"8df6ce243d4a12c9cfe966f33d70b181eeb84b43"})}};s.style=":host { display: inline-block; }";export{s as nano_grid_item}
+import{r,h as s}from"./index-BM3Om9WE.js";const o=class{constructor(s){r(this,s)}render(){return s("slot",{key:"9a50a1034bd70b2d0c461f01acdb6b0484e492d3"})}};o.style=":host { display: inline-block; }";export{o as nano_grid_item}

package/dist/nano-components/nano-grid_2.entry.js

@@ -1,4 +1,4 @@
 /*!
  * Custom elements for Nanopore-Digital Web applications
  */
-import{h as t,a as i,g as e,r as n,c as r}from"./index-BM3Om9WE.js";import{h as s}from"./renderer-BaP2L8CT.js";const o=(()=>{try{return!!new CSSStyleSheet}catch(t){return!1}})(),a=new WeakMap;function c(i,e,n){(function(t){for(const i in t)if(i in t&&Array.isArray(t[i]))return t[i]}(i)||[]).push(t("style",{type:"text/css","constructible-style":e},n))}function l(t,i,e,n){i.__constructableStyle||(i.__constructableStyle={});const r=t[n.cacheKeyProperty];return i.__constructableStyle[r]||(i.__constructableStyle[r]=new CSSStyleSheet,i.__constructableStyle[r].replace(e)),i.__constructableStyle[r]}const d=class{constructor(t){n(this,t)}grids=[];cacheKey;sSize=300;mSize=550;lSize=800;xlSize=1e3;sCols;mCols;lCols;xlCols;xxlCols;sTpl;mTpl;lTpl;xlTpl;xxlTpl;showHelper=!1;constructSizeArray(){this.grids=[],this.sCols&&this.grids.push({cols:this.sCols,breakpoint:0,name:"s",template:this.sTpl}),this.mCols&&this.grids.push({cols:this.mCols,breakpoint:this.sSize,name:"m",template:this.mTpl}),this.lCols&&this.grids.push({cols:this.lCols,breakpoint:this.mSize,name:"l",template:this.lTpl}),this.xlCols&&this.grids.push({cols:this.xlCols,breakpoint:this.lSize,name:"xl",template:this.xlTpl}),this.xxlCols&&this.grids.push({cols:this.xxlCols,breakpoint:this.xlSize,name:"xxl",template:this.xxlTpl}),this.cacheKey=this.grids.map((t=>`${t.cols}-${t.breakpoint}-${t.template||""}`)).join("")+"-helper-"+this.showHelper}styles=()=>`\n      ${this.grids.map((t=>`\n          @container (min-width: ${Number(t.breakpoint+1)?Number(t.breakpoint)+1+"px":t.breakpoint}) {\n            [cache-key="${this.cacheKey}"].grid {\n              --current-grid-size: "grid size: ${t.name}";\n              ${t.template?`grid-template: ${t.template};`:`grid-template-columns: repeat(${t.cols}, minmax(calc((100% / ${t.cols}) - var(--grid-col-gap)), 1fr));`}\n            }\n            ${[...Array(t.cols)].map(((i,e)=>{const n=e+1;return`\n                  [cache-key="${this.cacheKey}"].grid > [grid-states~="${t.name}-col-start-${n}"],\n                  ::slotted([grid-states~="${t.name}-col-start-${n}"]) {\n                    grid-column-start: ${n} !important;\n                  }\n                  [cache-key="${this.cacheKey}"].grid > [grid-states~="${t.name}-col-span-${n}"],\n                  ::slotted([grid-states~="${t.name}-col-span-${n}"]) {\n                    grid-column-end: span ${n} !important;\n                  }\n              `})).join("")}\n              ${[...Array(24)].map(((i,e)=>{const n=e+1;return`\n                    [cache-key="${this.cacheKey}"].grid > [grid-states~="${t.name}-row-start-${n}"],\n                    ::slotted([grid-states~="${t.name}-row-start-${n}"]) {\n                      grid-row-start: ${n} !important;\n                    }\n                    [cache-key="${this.cacheKey}"].grid > [grid-states~="${t.name}-row-span-${n}"],\n                    ::slotted([grid-states~="${t.name}-row-span-${n}"]) {\n                      grid-row-end: span ${n} !important;\n                    }\n                `})).join("")}\n            ${this.showHelper?`\n                [cache-key="${this.cacheKey}"].grid--helper :nth-child(-n+${t.cols}) {\n                  display: block !important;\n                }\n              `:""}\n          }\n        `)).join("")}\n    `.replace(/\/\*[\s\S]*?\*\//g,"").replace(/\s{2,}/g," ").replace(/\s*([{}:;,])\s*/g,"$1").replace(/\n/g,"");componentWillLoad(){this.constructSizeArray()}render(){return s(i,{key:"74b98156bf6fbb3bf105135be4f461737d7774ac",class:"nano-grid"},s("div",{key:"dda06ec152c7d25ee0e6090e6c301bc8e5e81aac",part:"grid",class:"grid","cache-key":this.cacheKey},s("slot",{key:"175e120e0198bfad25600316aa8a8becf9390866"})),this.showHelper&&s("div",{key:"773d0ca81af12cc416550578e4df88f08b7af3cd",class:"grid grid--helper",part:"helper","cache-key":this.cacheKey},[...Array(24)].map((()=>s("div",{class:"grid__helper-item"})))))}static get watchers(){return{sTpl:["constructSizeArray"],mTpl:["constructSizeArray"],lTpl:["constructSizeArray"],xlTpl:["constructSizeArray"],xxlTpl:["constructSizeArray"],sSize:["constructSizeArray"],mSize:["constructSizeArray"],lSize:["constructSizeArray"],xlSize:["constructSizeArray"],sCols:["constructSizeArray"],mCols:["constructSizeArray"],lCols:["constructSizeArray"],xlCols:["constructSizeArray"],xxlCols:["constructSizeArray"],showHelper:["constructSizeArray"]}}};(function(t,i,e,n){var r,s=arguments.length,o=s<3?i:null===n?n=Object.getOwnPropertyDescriptor(i,e):n;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)o=Reflect.decorate(t,i,e,n);else for(var a=t.length-1;a>=0;a--)(r=t[a])&&(o=(s<3?r(o):s>3?r(i,e,o):r(i,e))||o);s>3&&o&&Object.defineProperty(i,e,o)})([function(n={}){return(r,s)=>{n.cacheKeyProperty||(n.cacheKeyProperty=s);const{componentWillLoad:d,render:h,componentWillRender:m}=r;if(d||console.warn(`ConstructibleStyle requires you to have a \`componentWillLoad\` lifecycle method in \`${r.constructor.name}\`. Failure to add this function may cause ConstructibleStyle to fail due to StencilJS build optimizations.`),o){const t=t=>{if(!t[n.cacheKeyProperty]||a.get(t)&&a.get(t)===t[n.cacheKeyProperty])return;a.set(t,t[n.cacheKeyProperty]);const i=e(t),o="function"==typeof t[s]?t[s]():t[s],c=i.shadowRoot||document;c.adoptedStyleSheets=[...c.adoptedStyleSheets||[],l(t,r,o,n)]};r.componentWillLoad=function(){const i=d&&d.call(this);return t(this),i},r.componentWillRender=function(){const i=m&&m.call(this);return t(this),i}}else r.render=function(){const e="function"==typeof this[s]?this[s]():this[s];let n=h.call(this);if(function(t){for(const e in t)if(e in t&&t[e]===i)return!0;return!1}(n))c(n,r.constructor.name,e);else if(n=t(i,null,n),"attachShadow"in HTMLElement.prototype){if(!r.__constructableStyle){const t=document.createElement("style");t.setAttribute("type","text/css"),t.setAttribute("constructible-style",r.constructor.name),t.innerHTML=e,r.__constructableStyle=t,document.head.appendChild(t)}}else c(n,r.constructor.name,e);return n}}}({cacheKeyProperty:"cacheKey"}),function(t,i){if("object"==typeof Reflect&&"function"==typeof Reflect.metadata)return Reflect.metadata(t,i)}("design:type",Object)],d.prototype,"styles",void 0),d.style=':host,*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}@media (prefers-reduced-motion: reduce){:host,*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}:host,*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}@media (prefers-reduced-motion: reduce){:host,*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}:host{--grid-col-gap:var(--nano-spacing-md);--grid-row-gap:var(--nano-spacing-md);--grid-align-items:start;--grid-justify-items:normal;--current-grid-size:"grid size: s";container-type:inline-size;display:block}:host .grid{display:grid;gap:var(--grid-row-gap) var(--grid-col-gap);block-size:inherit;min-block-size:inherit;place-items:var(--grid-align-items) var(--grid-justify-items)}:host([show-helper]:not([show-helper=false])){position:relative}:host([show-helper]:not([show-helper=false])) .grid--helper{position:absolute;inset:0;pointer-events:none;display:grid !important;overflow:hidden}:host([show-helper]:not([show-helper=false])) .grid--helper::before{content:var(--current-grid-size);font-size:30px;position:absolute;inline-size:100%;inset-inline-start:0;text-align:center;inset-block-start:50%;transform:translateY(-50%);color:rgba(0, 0, 0, 0.2);text-transform:uppercase;z-index:99;pointer-events:none}:host([show-helper]:not([show-helper=false])) .grid__helper-item{background:hsla(204, 80%, 72%, 0.25);block-size:100vh;inline-size:100%}';const h=class{constructor(t){n(this,t),this.nanoImgWillLoad=r(this,"nanoImgWillLoad",7),this.nanoImgDidLoad=r(this,"nanoImgDidLoad",7),this.nanoImgError=r(this,"nanoImgError",7)}io;_srcSet={};get host(){return e(this)}loadSrc;loadError;hasLoaded=!1;imgStates=null;_src;_srcChanged(){this.hasLoaded=!1,this.addIO()}alt;src;srcChanged(){this._src=this.src}srcSet;srcSetChanged(){this.srcSet&&(delete this._srcSet,this._srcSet={},this.imgStates=this.srcSet.split(",").map((t=>{const[i,e]=t.split(" ").filter((t=>t.length));return this._srcSet[i]={src:e,active:!1},i})).join(", "))}lazy=!0;lazyChanged(){this.lazy||this.load()}background;autoHeight="content";nanoImgWillLoad;nanoImgDidLoad;nanoImgError;addIO(){this._src&&!this.hasLoaded&&(this.lazy?"undefined"!=typeof window&&"IntersectionObserver"in window?(this.removeIO(),this.io=new IntersectionObserver((t=>{t[0].isIntersecting&&(this.load(),this.removeIO())})),this.io.observe(this.host)):setTimeout((()=>this.load()),200):this.load())}load(){this.loadError=this.onError,this.loadSrc=this._src,this.nanoImgWillLoad.emit()}onLoad=()=>{this.nanoImgDidLoad.emit(),setTimeout((()=>this.hasLoaded=!0),50)};onError=()=>{this.nanoImgError.emit()};onResize=t=>{Object.entries(t.detail).forEach((([t,i])=>{this._srcSet[t].active=!!i}));const i=[];Object.keys(this._srcSet).sort().forEach((t=>{this._srcSet[t].active&&i.push(this._srcSet[t].src)})),this._src=i.length?i.slice(-1)[0]:this.src};removeIO(){this.io&&(this.io.disconnect(),this.io=void 0)}connectedCallback(){this.srcChanged(),this.srcSetChanged(),this.lazyChanged()}componentDidLoad(){this.addIO()}disconnectedCallback(){this.removeIO()}render(){const t=this.loadSrc?{"background-image":`url(${this.loadSrc})`}:{};return s(i,{key:"640969f1b1d3872d0314b455fd602be4e68955cc",class:"nano-img"},s("div",{key:"fdc45639dabc5872b5a00e7db92865efd5a2ac77",class:"img"},s("div",{key:"5b9cc3e0ef11e3941a6085625b1d9f5e9d6de56a",class:"img__loader n-loader-skeleton"},"Loading"),!!this.background&&s("div",{key:"d8c3a0f6bf742608335189f33ba076d70b08d4a9",class:{loaded:this.hasLoaded,img__bg:!0,"no-height":"image"===this.autoHeight},style:t},s("slot",{key:"ec35744e264cb18d1ec97a4e9c84f0c7a2d80a3e"})),s("img",{key:"be687a80241f559f7df7567854e1a59812437624",class:{img__image:!0,loaded:this.hasLoaded,hide:this.background,"no-height":"content"===this.autoHeight},decoding:"async",src:this.loadSrc,loading:void 0,alt:this.alt,onLoad:this.onLoad,onError:this.loadError}),s("nano-resize-observe",{key:"62398606dab9cc346ffb2acbbb913458684030db",class:"img__observer",onNanoResizeStateChange:this.onResize,states:this.imgStates})))}static get watchers(){return{_src:["_srcChanged"],src:["srcChanged"],srcSet:["srcSetChanged"],lazy:["lazyChanged"]}}};h.style=":host,*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}@media (prefers-reduced-motion: reduce){:host,*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}:host,*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}@media (prefers-reduced-motion: reduce){:host,*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}:host{--padding:0;display:inline-block;object-fit:cover;object-position:center;background-size:cover;background-position:center}:host *{border-radius:inherit}:host([background]:not([background=false])){display:block}.img{position:relative;object-fit:inherit;object-position:inherit;background-color:inherit;background-position:inherit;background-size:inherit;background-origin:inherit;background-attachment:inherit;background-repeat:inherit;flex:1 1 100%;display:flex;flex-direction:column;min-block-size:inherit;min-inline-size:inherit;block-size:inherit;inline-size:inherit;max-block-size:inherit;max-inline-size:inherit;aspect-ratio:inherit}.img__loader,.img__observer{position:absolute;inset:0;block-size:100%;inline-size:100%;z-index:-1}.img__image,.img__bg{border-radius:inherit;display:block;opacity:0;transition:0.5s ease opacity, 0.3s ease filter 0.4s;filter:blur(5px);flex:1}.img__image.loaded,.img__bg.loaded{opacity:1;filter:blur(0)}@media not all and (resolution >= 0.001dpcm){@supports (-webkit-appearance: none){.img__image.loaded,.img__bg.loaded{filter:blur(0)}}}.img__image{object-fit:inherit;object-position:inherit;min-block-size:inherit;min-inline-size:inherit;block-size:inherit;inline-size:inherit;max-block-size:inherit;max-inline-size:inherit;aspect-ratio:inherit}.img__image.hide{visibility:hidden}.img__image.hide.no-height{block-size:1px;position:absolute;z-index:-1}.img__bg{background-color:inherit;background-position:inherit;background-size:inherit;background-origin:inherit;background-attachment:inherit;background-repeat:inherit;overflow:auto;padding:var(--padding)}.img__bg.no-height{position:absolute;inset:0}";export{d as nano_grid,h as nano_img}
+import{r as i,a as t,c as e,g as r}from"./index-BM3Om9WE.js";import{C as s}from"./constructible-style-B2_GfhhS.js";import{h as n}from"./renderer-BaP2L8CT.js";const o=class{constructor(t){i(this,t)}grids=[];cacheKey;sSize=300;mSize=550;lSize=800;xlSize=1e3;sCols;mCols;lCols;xlCols;xxlCols;sTpl;mTpl;lTpl;xlTpl;xxlTpl;showHelper=!1;constructSizeArray(){this.grids=[],this.sCols&&this.grids.push({cols:this.sCols,breakpoint:0,name:"s",template:this.sTpl}),this.mCols&&this.grids.push({cols:this.mCols,breakpoint:this.sSize,name:"m",template:this.mTpl}),this.lCols&&this.grids.push({cols:this.lCols,breakpoint:this.mSize,name:"l",template:this.lTpl}),this.xlCols&&this.grids.push({cols:this.xlCols,breakpoint:this.lSize,name:"xl",template:this.xlTpl}),this.xxlCols&&this.grids.push({cols:this.xxlCols,breakpoint:this.xlSize,name:"xxl",template:this.xxlTpl}),this.cacheKey=this.grids.map((i=>`${i.cols}-${i.breakpoint}-${i.template||""}`)).join("")+"-helper-"+this.showHelper}styles=()=>`\n      ${this.grids.map((i=>`\n          @container (min-width: ${Number(i.breakpoint+1)?Number(i.breakpoint)+1+"px":i.breakpoint}) {\n            [cache-key="${this.cacheKey}"].grid {\n              --current-grid-size: "grid size: ${i.name}";\n              ${i.template?`grid-template: ${i.template};`:`grid-template-columns: repeat(${i.cols}, minmax(calc((100% / ${i.cols}) - var(--grid-col-gap)), 1fr));`}\n            }\n            ${[...Array(i.cols)].map(((t,e)=>{const r=e+1;return`\n                  [cache-key="${this.cacheKey}"].grid > [grid-states~="${i.name}-col-start-${r}"],\n                  ::slotted([grid-states~="${i.name}-col-start-${r}"]) {\n                    grid-column-start: ${r} !important;\n                  }\n                  [cache-key="${this.cacheKey}"].grid > [grid-states~="${i.name}-col-span-${r}"],\n                  ::slotted([grid-states~="${i.name}-col-span-${r}"]) {\n                    grid-column-end: span ${r} !important;\n                  }\n              `})).join("")}\n              ${[...Array(24)].map(((t,e)=>{const r=e+1;return`\n                    [cache-key="${this.cacheKey}"].grid > [grid-states~="${i.name}-row-start-${r}"],\n                    ::slotted([grid-states~="${i.name}-row-start-${r}"]) {\n                      grid-row-start: ${r} !important;\n                    }\n                    [cache-key="${this.cacheKey}"].grid > [grid-states~="${i.name}-row-span-${r}"],\n                    ::slotted([grid-states~="${i.name}-row-span-${r}"]) {\n                      grid-row-end: span ${r} !important;\n                    }\n                `})).join("")}\n            ${this.showHelper?`\n                [cache-key="${this.cacheKey}"].grid--helper :nth-child(-n+${i.cols}) {\n                  display: block !important;\n                }\n              `:""}\n          }\n        `)).join("")}\n    `.replace(/\/\*[\s\S]*?\*\//g,"").replace(/\s{2,}/g," ").replace(/\s*([{}:;,])\s*/g,"$1").replace(/\n/g,"");componentWillLoad(){this.constructSizeArray()}render(){return n(t,{key:"56ae0bda8aedac96841dd8cf308117ef1aaa9824",class:"nano-grid"},n("div",{key:"6fffc201e4261b8f6c458bd044b31fe12cd9045e",part:"grid",class:"grid","cache-key":this.cacheKey},n("slot",{key:"a6d7473ba9a8ffd21c4df95c2028e67026ffd1a5"})),this.showHelper&&n("div",{key:"275145f83283b504171fdc973741a1398cca6317",class:"grid grid--helper",part:"helper","cache-key":this.cacheKey},[...Array(24)].map((()=>n("div",{class:"grid__helper-item"})))))}static get watchers(){return{sTpl:["constructSizeArray"],mTpl:["constructSizeArray"],lTpl:["constructSizeArray"],xlTpl:["constructSizeArray"],xxlTpl:["constructSizeArray"],sSize:["constructSizeArray"],mSize:["constructSizeArray"],lSize:["constructSizeArray"],xlSize:["constructSizeArray"],sCols:["constructSizeArray"],mCols:["constructSizeArray"],lCols:["constructSizeArray"],xlCols:["constructSizeArray"],xxlCols:["constructSizeArray"],showHelper:["constructSizeArray"]}}};(function(i,t,e,r){var s,n=arguments.length,o=n<3?t:null===r?r=Object.getOwnPropertyDescriptor(t,e):r;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)o=Reflect.decorate(i,t,e,r);else for(var a=i.length-1;a>=0;a--)(s=i[a])&&(o=(n<3?s(o):n>3?s(t,e,o):s(t,e))||o);n>3&&o&&Object.defineProperty(t,e,o)})([s({cacheKeyProperty:"cacheKey"}),function(i,t){if("object"==typeof Reflect&&"function"==typeof Reflect.metadata)return Reflect.metadata(i,t)}("design:type",Object)],o.prototype,"styles",void 0),o.style=':host,*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}@media (prefers-reduced-motion: reduce){:host,*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}:host,*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}@media (prefers-reduced-motion: reduce){:host,*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}:host{--grid-col-gap:var(--nano-spacing-md);--grid-row-gap:var(--nano-spacing-md);--grid-align-items:start;--grid-justify-items:normal;--current-grid-size:"grid size: s";container-type:inline-size;display:block}:host .grid{display:grid;gap:var(--grid-row-gap) var(--grid-col-gap);block-size:inherit;min-block-size:inherit;place-items:var(--grid-align-items) var(--grid-justify-items)}:host([show-helper]:not([show-helper=false])){position:relative}:host([show-helper]:not([show-helper=false])) .grid--helper{position:absolute;inset:0;pointer-events:none;display:grid !important;overflow:hidden}:host([show-helper]:not([show-helper=false])) .grid--helper::before{content:var(--current-grid-size);font-size:30px;position:absolute;inline-size:100%;inset-inline-start:0;text-align:center;inset-block-start:50%;transform:translateY(-50%);color:rgba(0, 0, 0, 0.2);text-transform:uppercase;z-index:99;pointer-events:none}:host([show-helper]:not([show-helper=false])) .grid__helper-item{background:hsla(204, 80%, 72%, 0.25);block-size:100vh;inline-size:100%}';const a=class{constructor(t){i(this,t),this.nanoImgWillLoad=e(this,"nanoImgWillLoad",7),this.nanoImgDidLoad=e(this,"nanoImgDidLoad",7),this.nanoImgError=e(this,"nanoImgError",7)}io;_srcSet={};get host(){return r(this)}loadSrc;loadError;hasLoaded=!1;imgStates=null;_src;_srcChanged(){this.hasLoaded=!1,this.addIO()}alt;src;srcChanged(){this._src=this.src}srcSet;srcSetChanged(){this.srcSet&&(delete this._srcSet,this._srcSet={},this.imgStates=this.srcSet.split(",").map((i=>{const[t,e]=i.split(" ").filter((i=>i.length));return this._srcSet[t]={src:e,active:!1},t})).join(", "))}lazy=!0;lazyChanged(){this.lazy||this.load()}background;autoHeight="content";nanoImgWillLoad;nanoImgDidLoad;nanoImgError;addIO(){this._src&&!this.hasLoaded&&(this.lazy?"undefined"!=typeof window&&"IntersectionObserver"in window?(this.removeIO(),this.io=new IntersectionObserver((i=>{i[0].isIntersecting&&(this.load(),this.removeIO())})),this.io.observe(this.host)):setTimeout((()=>this.load()),200):this.load())}load(){this.loadError=this.onError,this.loadSrc=this._src,this.nanoImgWillLoad.emit()}onLoad=()=>{this.nanoImgDidLoad.emit(),setTimeout((()=>this.hasLoaded=!0),50)};onError=()=>{this.nanoImgError.emit()};onResize=i=>{Object.entries(i.detail).forEach((([i,t])=>{this._srcSet[i].active=!!t}));const t=[];Object.keys(this._srcSet).sort().forEach((i=>{this._srcSet[i].active&&t.push(this._srcSet[i].src)})),this._src=t.length?t.slice(-1)[0]:this.src};removeIO(){this.io&&(this.io.disconnect(),this.io=void 0)}connectedCallback(){this.srcChanged(),this.srcSetChanged(),this.lazyChanged()}componentDidLoad(){this.addIO()}disconnectedCallback(){this.removeIO()}render(){const i=this.loadSrc?{"background-image":`url(${this.loadSrc})`}:{};return n(t,{key:"f8774fc9ad6e94727378337c2f405a068a7c88fb",class:"nano-img"},n("div",{key:"15ae3c8ea944c8f0eab8616194f44fc1033e8fe2",class:"img"},n("div",{key:"ec3f433ded23dcb7fc57e53b0ecaba789ba492e0",class:"img__loader n-loader-skeleton"},"Loading"),!!this.background&&n("div",{key:"8f4e8c9d595a31b477b0ae3f9e135f6b5c3f0e69",class:{loaded:this.hasLoaded,img__bg:!0,"no-height":"image"===this.autoHeight},style:i},n("slot",{key:"29bab2a5c86b3dfe18db8936af77674c44d743d0"})),n("img",{key:"e6731b48ed137d97aa98e64dc55488d56724f672",class:{img__image:!0,loaded:this.hasLoaded,hide:this.background,"no-height":"content"===this.autoHeight},decoding:"async",src:this.loadSrc,loading:void 0,alt:this.alt,onLoad:this.onLoad,onError:this.loadError}),n("nano-resize-observe",{key:"0f1ce7d8b82adc19bfa459ff2adae708a4263c6e",class:"img__observer",onNanoResizeStateChange:this.onResize,states:this.imgStates})))}static get watchers(){return{_src:["_srcChanged"],src:["srcChanged"],srcSet:["srcSetChanged"],lazy:["lazyChanged"]}}};a.style=":host,*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}@media (prefers-reduced-motion: reduce){:host,*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}:host,*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}@media (prefers-reduced-motion: reduce){:host,*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}:host{--padding:0;display:inline-block;object-fit:cover;object-position:center;background-size:cover;background-position:center}:host *{border-radius:inherit}:host([background]:not([background=false])){display:block}.img{position:relative;object-fit:inherit;object-position:inherit;background-color:inherit;background-position:inherit;background-size:inherit;background-origin:inherit;background-attachment:inherit;background-repeat:inherit;flex:1 1 100%;display:flex;flex-direction:column;min-block-size:inherit;min-inline-size:inherit;block-size:inherit;inline-size:inherit;max-block-size:inherit;max-inline-size:inherit;aspect-ratio:inherit}.img__loader,.img__observer{position:absolute;inset:0;block-size:100%;inline-size:100%;z-index:-1}.img__image,.img__bg{border-radius:inherit;display:block;opacity:0;transition:0.5s ease opacity, 0.3s ease filter 0.4s;filter:blur(5px);flex:1}.img__image.loaded,.img__bg.loaded{opacity:1;filter:blur(0)}@media not all and (resolution >= 0.001dpcm){@supports (-webkit-appearance: none){.img__image.loaded,.img__bg.loaded{filter:blur(0)}}}.img__image{object-fit:inherit;object-position:inherit;min-block-size:inherit;min-inline-size:inherit;block-size:inherit;inline-size:inherit;max-block-size:inherit;max-inline-size:inherit;aspect-ratio:inherit}.img__image.hide{visibility:hidden}.img__image.hide.no-height{block-size:1px;position:absolute;z-index:-1}.img__bg{background-color:inherit;background-position:inherit;background-size:inherit;background-origin:inherit;background-attachment:inherit;background-repeat:inherit;overflow:auto;padding:var(--padding)}.img__bg.no-height{position:absolute;inset:0}";export{o as nano_grid,a as nano_img}

package/dist/nano-components/nano-hero.entry.js

@@ -1,4 +1,4 @@
 /*!
  * Custom elements for Nanopore-Digital Web applications
  */
-import{r as n,g as o,a as e}from"./index-BM3Om9WE.js";import{h as t}from"./renderer-BaP2L8CT.js";const i=class{constructor(o){n(this,o)}mo;get host(){return o(this)}hasIconBox;hasScrim;hasSecondaryContent;hasQuote;hasBg;hasBackBtn;hasCtas;breadCrumbs;breadCrumbChange(){this.breadCrumbs.filter((n=>"A"===n.tagName&&!n.nextElementSibling.classList.contains("slash"))).forEach((n=>{n.insertAdjacentHTML("afterend",'<span slot="breadcrumb" class="slash">/</span>')}))}iconBoxItems;iconBoxItemChange(){this.iconBoxItems.forEach((n=>n.classList.remove("last"))),this.iconBoxItems[this.iconBoxItems.length-1]&&this.iconBoxItems[this.iconBoxItems.length-1].classList&&this.iconBoxItems[this.iconBoxItems.length-1].classList.add("last")}imgSrc;imgSrcSet=null;largeScreenBP=900;theme="dark";level="top";slotChangeObserver(){this.mo&&this.mo.disconnect(),(this.mo=new MutationObserver((()=>this.processSlottedContent()))).observe(this.host,{childList:!0})}processSlottedContent(){this.hasCtas=!!this.host.querySelector('[slot="secondary-ctas"]'),this.iconBoxItems=Array.from(this.host.querySelectorAll('[slot="icon-box-item"]')),this.hasIconBox=!!this.host.querySelector('[slot="icon-box"]')||!!this.iconBoxItems.length,this.hasScrim=!!this.host.querySelector('[slot="scrim"]'),this.breadCrumbs=Array.from(this.host.querySelectorAll('[slot="breadcrumb"]')),this.hasSecondaryContent=!!(this.host.querySelector('[slot="icon-box"]')||this.host.querySelector('[slot="quote"]')||this.host.querySelector('[slot="icon-box-item"]')||this.host.querySelector('[slot="secondary-content"]')),this.hasBg=!!this.host.querySelector('[slot="background"]')||!!this.imgSrc,this.hasBackBtn=!!this.host.querySelector('[slot="back-btn"]'),this.hasQuote=!!this.host.querySelector('[slot="quote"]')}disconnectedCallback(){this.mo&&this.mo.disconnect()}componentDidLoad(){this.slotChangeObserver()}componentWillLoad(){this.processSlottedContent()}HeroContent=()=>[!this.hasIconBox&&this.hasCtas?t("div",{class:"hero__ctas"},t("slot",{name:"secondary-ctas"})):"",t("div",{class:"hero__scrim"},t("slot",{name:"scrim"})),t("nano-grid",{class:"hero__content",xlCols:2,xlSize:this.largeScreenBP},t("div",{"grid-states":"xl-col-span-2"},t("div",{class:"hero__breadcrumbs"},t("slot",{name:"breadcrumb"}))),t("div",{"grid-states":this.hasSecondaryContent?"xl-col-span-1 xl-col-start-1 xl-row-start-2":"xl-col-span-2 xl-col-start-1 xl-row-start-2"},t("div",{class:"hero__primary"},t("div",{class:"hero__primary-content"},t("slot",{name:"back-btn"}),t("div",null,t("slot",{name:"primary-content"}))))),this.hasSecondaryContent&&t("div",{"grid-states":"xl-col-span-1 xl-col-start-2 xl-row-start-2"},t("div",{class:"hero__secondary"},t("slot",{name:"secondary-content"}),this.hasIconBox&&t("div",{class:"hero__icon-box"},t("slot",{name:"icon-box"}),t("slot",{name:"icon-box-item"})),this.hasQuote&&t("div",{class:"hero__quote-content"},t("span",{class:"hero__quote"},t("slot",{name:"quote"})),t("div",{class:"hero__quote-author"},t("slot",{name:"quote-author"}))))))];render(){return t(e,{key:"fd48435b9a236d4b0a13853b495fa6e7a17d759f",class:"nano-hero"},t("div",{key:"6d4a1d9deb8bdbb1a2c6d55bcedecf03dafbe1d3",class:{hero:!0,"hero--light":"light"===this.theme,"hero--secondary":this.hasSecondaryContent,"hero--iconbox":this.hasIconBox,"hero--rtl":"rtl"===this.host.dir||"rtl"===this.host.ownerDocument.dir,"hero--scrim":this.hasScrim,"hero--breadcrumb":!!this.breadCrumbs.length,"hero--hasbg":this.hasBg,"hero--backbtn":this.hasBackBtn,"hero--sub":"sub"===this.level}},t("div",{key:"d6b6675e229a107dd71d12e6b5c3b2decd36c86d",class:"hero__bg-wrap"},!!this.imgSrc&&t("nano-img",{key:"eeaa0dce87aedba0e30d3a73ae1bc5732a284732",class:"hero__img",lazy:!1,background:!0,srcSet:this.imgSrcSet,src:this.imgSrc},t(this.HeroContent,{key:"fe87fdc964d9b97611014a905620d43ef2d9b01d"})),!this.imgSrc&&[t("div",{key:"74d6e0d9eb61110f8f395258efd2541f795de7f4",class:"hero__bg-slot"},t("slot",{key:"125bbc331e99605bd2795a4720c0ca53fb4b1862",name:"background"})),t(this.HeroContent,{key:"15ff774728e7dd459bbbaab916b0b2577989aac8"})])))}static get watchers(){return{breadCrumbs:["breadCrumbChange"],iconBoxItems:["iconBoxItemChange"]}}};i.style=":host,\n*,\n*::before,\n*::after {\n  box-sizing: border-box;\n}\n[hidden] {\n  display: none !important;\n}\n@media (prefers-reduced-motion: reduce) {\n    :host,\n    *,\n    *::before,\n    *::after {\n      animation-duration: 0.01ms !important;\n      animation-iteration-count: 1 !important;\n      transition-duration: 0.01ms !important;\n      scroll-behavior: auto !important;\n    }\n  }:host,\n*,\n*::before,\n*::after {\n  box-sizing: border-box;\n}\n[hidden] {\n  display: none !important;\n}\n@media (prefers-reduced-motion: reduce) {\n    :host,\n    *,\n    *::before,\n    *::after {\n      animation-duration: 0.01ms !important;\n      animation-iteration-count: 1 !important;\n      transition-duration: 0.01ms !important;\n      scroll-behavior: auto !important;\n    }\n  }:host {\n  /**\n   * @prop --nano-loader-base: Base colour of nano-skeleton. Default depends on theme;\n   * @prop --nano-loader-tint: Tint colour of nano-skeleton. Default depends on theme;\n   * @prop --theme-color: Text color. Default depends on theme;\n   * @prop --theme-tint-color: Color used for bread crumbs and icons. Defaults to #90c6e7;\n   * @prop --scrim-color: Color of the gradient covering the background. Default depends on theme;\n   * @prop --scrim-direction: Direction of the gradient covering the background. Default what content slots are present;\n   * @prop --scrim-opacity-from: Starting opactiy of the gradient covering the background. Default .25;\n   * @prop --scrim-opacity-to: Final opactiy of the gradient covering the background. Default depends on `theme`;\n   * @prop --quote-size: Font size of the quote. Defaults to 1.3em and grows to 3rem on the xl breakpoint;\n  */\n  --nano-loader-base: #4a4a4a;\n  --nano-loader-tint: #7d7d7d;\n  --theme-color: #fff;\n  --theme-tint-color: #90c6e7;\n  --scrim-color: 0 0 0;\n  --scrim-direction: -50deg;\n  --scrim-opacity-from: 0.25;\n  --scrim-opacity-to: 0.7;\n  --padding: 0;\n  --quote-size: 1.3rem;\n  color: var(--theme-color);\n  display: block;\n  container-type: inline-size;\n}\n\n:host([theme=light]) {\n  --nano-loader-base: #fff;\n  --nano-loader-tint: white;\n  --theme-color: #4a4a4a;\n  --scrim-color: 255 255 255;\n  --scrim-opacity-from: 0.25;\n  --scrim-opacity-to: 1;\n  --scrim-direction: 270deg;\n  color: var(--theme-color);\n}\n:host([theme=light]) .hero__primary-content {\n  --color: #4a4a4a;\n}\n\n.hero {\n  position: relative;\n}\n@container (min-width: 800px) {\n  .hero {\n    --quote-size: 3rem;\n  }\n}\n.hero--rtl {\n  --scrim-direction: 270deg;\n}\n.hero--secondary:not(.hero--iconbox) {\n  --scrim-direction: 0deg;\n}\n.hero__bg-wrap {\n  overflow: hidden;\n}\n.hero__bg-slot {\n  position: absolute;\n  inset: 0;\n}\n.hero__ctas {\n  display: flex;\n  justify-content: flex-end;\n  padding-block: 32px 0;\n  padding-inline: 32px;\n  margin-block-end: -64px;\n  position: relative;\n  z-index: 1;\n}\n@media (width <= 52em) {\n  .hero__ctas {\n    display: none;\n  }\n}\n@media (width <= 58em) {\n  .hero__ctas {\n    margin-block-end: -48px;\n  }\n}\n.hero__ctas ::slotted(a.button[slot=secondary-ctas]) {\n  padding-inline: 0.5rem !important;\n  font-size: 0.875rem !important;\n  margin-block: 0 !important;\n  margin-inline: 0.25rem !important;\n}\n.hero__img {\n  display: block;\n  --padding: inherit;\n}\n.hero__breadcrumbs {\n  display: none;\n  margin-block: 20px 0;\n  margin-inline: 14px;\n  line-height: 14px;\n}\n.hero--breadcrumb .hero__breadcrumbs {\n  display: block;\n}\n@container (min-width: 800px) {\n  .hero__breadcrumbs {\n    margin-block: 0;\n    margin-inline: 50px;\n    max-inline-size: 50%;\n  }\n}\n@container (min-width: 900px) {\n  .hero__breadcrumbs {\n    margin-block: 0;\n    margin-inline: 83px;\n  }\n}\n.hero__breadcrumbs ::slotted(*[slot=breadcrumb]) {\n  font-size: 0.85rem;\n  text-transform: uppercase;\n  letter-spacing: 1.5px;\n  font-weight: 600;\n  font-stretch: 125%;\n  display: inline-block;\n  margin-block-end: 16px;\n  position: relative;\n  z-index: 2;\n}\n.hero--hasbg .hero__breadcrumbs ::slotted(*[slot=breadcrumb]) {\n  text-shadow: 1px 1px rgba(0, 0, 0, 0.15);\n}\n.hero__breadcrumbs ::slotted(a[slot=breadcrumb]) {\n  color: var(--theme-tint-color) !important;\n  cursor: pointer;\n}\n.hero__breadcrumbs ::slotted(.slash[slot=breadcrumb]) {\n  color: var(--theme-color);\n  position: relative;\n  margin-block: 0;\n  margin-inline: 0.5rem;\n  display: inline-block;\n}\n.hero__scrim {\n  position: absolute;\n  inset: 0;\n  z-index: 0;\n  background: linear-gradient(var(--scrim-direction), rgb(var(--scrim-color)/var(--scrim-opacity-from)) 0%, rgb(var(--scrim-color)/var(--scrim-opacity-to)) 100%);\n}\n.hero--scrim .hero__scrim {\n  background: none;\n}\n.hero__content {\n  max-inline-size: 1440px;\n  display: block;\n  --grid-row-gap: 0;\n  margin-block: 0;\n  margin-inline: auto;\n  position: relative;\n}\n@container (min-width: 800px) {\n  .hero__content {\n    margin-block: 50px 0 !important;\n    max-inline-size: 1540px !important;\n  }\n}\n@container (min-width: 900px) {\n  .hero__content {\n    margin-block: 83px 0 !important;\n    max-inline-size: 1606px !important;\n  }\n}\n.hero__primary {\n  margin: 16px;\n}\n.hero--breadcrumb .hero__primary {\n  margin-block: 0;\n  margin-inline: 16px;\n}\n.hero--backbtn .hero__primary {\n  margin-inline-start: 0;\n}\n.hero__primary ::slotted(.nano-icon-button[slot=back-btn]) {\n  font-size: 2rem;\n}\n@container (min-width: 800px) {\n  .hero__primary {\n    margin-block: 0 50px !important;\n    margin-inline: 50px 0 !important;\n  }\n  .hero__primary ::slotted(.nano-icon-button[slot=back-btn]) {\n    margin-block: 0 !important;\n    margin-inline: -3rem 0 !important;\n  }\n}\n@container (min-width: 900px) {\n  .hero__primary {\n    margin-block: 0 83px !important;\n    margin-inline: 83px 0 !important;\n  }\n}\n.hero__primary-content {\n  max-inline-size: 45rem;\n  --color: #fff;\n  display: flex;\n}\n.hero--backbtn .hero__primary-content > div {\n  padding-block: 10px 0;\n  padding-inline: 0;\n}\n.hero__primary-content ::slotted(h1[slot=primary-content]) {\n  margin-block: 0 18px !important;\n  font-size: 2rem !important;\n}\n@container (min-width: 800px) {\n  .hero__primary-content ::slotted(h1[slot=primary-content]) {\n    line-height: 31px !important;\n    margin-block-end: 30px !important;\n  }\n  .hero__primary-content ::slotted(.button[slot=primary-content]) {\n    margin-block-start: 20px !important;\n  }\n}\n.hero__secondary {\n  display: none;\n  block-size: 100%;\n  padding-block: 0 20px;\n  padding-inline: 14px;\n}\n.hero--secondary .hero__secondary {\n  display: flex;\n  align-items: center;\n}\n@container (min-width: 800px) {\n  .hero__secondary {\n    padding-block: 0 50px;\n    padding-inline: 50px;\n    justify-content: flex-end;\n  }\n}\n@container (min-width: 900px) {\n  .hero__secondary {\n    padding-block: 0 83px;\n    padding-inline: 83px;\n  }\n}\n.hero__icon-box {\n  background: rgba(0, 0, 0, 0.7);\n  padding: 24px;\n  inline-size: 100%;\n  margin-block-end: auto;\n  display: flex;\n  flex-direction: column;\n  color: white;\n}\n@container (min-width: 800px) {\n  .hero__icon-box {\n    max-inline-size: 410px;\n    flex: 0 1 410px;\n  }\n}\n.hero__icon-box ::slotted([slot=icon-box-item]) {\n  --nano-color-base: var(--theme-tint-color);\n  --nano-icon-size: 32px;\n  --nano-icon-margin-end: 20px;\n  display: flex;\n  align-items: center;\n  font-size: 0.8125rem;\n  margin-block-end: 20px;\n}\n.hero__icon-box ::slotted(.last[slot=icon-box-item]) {\n  margin-block-end: 0;\n}\n.hero__quote-content {\n  margin-block-start: auto;\n  text-align: center;\n  inline-size: 100%;\n}\n@container (min-width: 800px) {\n  .hero__quote-content {\n    max-inline-size: 500px;\n    flex: 0 1 500px;\n    text-align: initial;\n  }\n}\n.hero__quote::before, .hero__quote::after {\n  content: '\"';\n  font-size: var(--quote-size);\n  font-weight: 600;\n  font-style: italic;\n  line-height: 0;\n  color: #abb6b8;\n  display: inline;\n  position: relative;\n}\n.hero__quote ::slotted([slot=quote]) {\n  font-size: var(--quote-size);\n  font-weight: 200;\n  display: inline;\n}\n.hero__quote-author {\n  text-align: end;\n  font-size: 1rem;\n  opacity: 0.8;\n}\n@container (min-width: 800px) {\n  .hero--sub .hero__content {\n    margin-block-start: 40px;\n  }\n  .hero--sub .hero__content .hero__primary {\n    margin-block: 0 40px;\n    margin-inline: 50px 0;\n  }\n  .hero--sub .hero__content .hero__secondary {\n    padding-block: 0 50px;\n    padding-inline: 40px 50px;\n  }\n  .hero--sub .hero__content ::slotted(.button[slot=primary-content]) {\n    margin-block-start: 8px !important;\n  }\n  .hero--sub .hero__content ::slotted(h1[slot=primary-content]) {\n    margin-block-end: 18px !important;\n  }\n}\n@container (min-width: 900px) {\n  .hero--sub .hero__content .hero__primary {\n    margin-block: 0 40px;\n    margin-inline: 83px 0;\n  }\n  .hero--sub .hero__content .hero__secondary {\n    padding-block: 0 83px;\n    padding-inline: 40px 83px;\n  }\n}";export{i as nano_hero}
+import{r as n,g as o,a as e}from"./index-BM3Om9WE.js";import{h as t}from"./renderer-BaP2L8CT.js";const i=class{constructor(o){n(this,o)}mo;get host(){return o(this)}hasIconBox;hasScrim;hasSecondaryContent;hasQuote;hasBg;hasBackBtn;hasCtas;breadCrumbs;breadCrumbChange(){this.breadCrumbs.filter((n=>"A"===n.tagName&&!n.nextElementSibling.classList.contains("slash"))).forEach((n=>{n.insertAdjacentHTML("afterend",'<span slot="breadcrumb" class="slash">/</span>')}))}iconBoxItems;iconBoxItemChange(){this.iconBoxItems.forEach((n=>n.classList.remove("last"))),this.iconBoxItems[this.iconBoxItems.length-1]&&this.iconBoxItems[this.iconBoxItems.length-1].classList&&this.iconBoxItems[this.iconBoxItems.length-1].classList.add("last")}imgSrc;imgSrcSet=null;largeScreenBP=900;theme="dark";level="top";slotChangeObserver(){this.mo&&this.mo.disconnect(),(this.mo=new MutationObserver((()=>this.processSlottedContent()))).observe(this.host,{childList:!0})}processSlottedContent(){this.hasCtas=!!this.host.querySelector('[slot="secondary-ctas"]'),this.iconBoxItems=Array.from(this.host.querySelectorAll('[slot="icon-box-item"]')),this.hasIconBox=!!this.host.querySelector('[slot="icon-box"]')||!!this.iconBoxItems.length,this.hasScrim=!!this.host.querySelector('[slot="scrim"]'),this.breadCrumbs=Array.from(this.host.querySelectorAll('[slot="breadcrumb"]')),this.hasSecondaryContent=!!(this.host.querySelector('[slot="icon-box"]')||this.host.querySelector('[slot="quote"]')||this.host.querySelector('[slot="icon-box-item"]')||this.host.querySelector('[slot="secondary-content"]')),this.hasBg=!!this.host.querySelector('[slot="background"]')||!!this.imgSrc,this.hasBackBtn=!!this.host.querySelector('[slot="back-btn"]'),this.hasQuote=!!this.host.querySelector('[slot="quote"]')}disconnectedCallback(){this.mo&&this.mo.disconnect()}componentDidLoad(){this.slotChangeObserver()}componentWillLoad(){this.processSlottedContent()}HeroContent=()=>[!this.hasIconBox&&this.hasCtas?t("div",{class:"hero__ctas"},t("slot",{name:"secondary-ctas"})):"",t("div",{class:"hero__scrim"},t("slot",{name:"scrim"})),t("nano-grid",{class:"hero__content",xlCols:2,xlSize:this.largeScreenBP},t("div",{"grid-states":"xl-col-span-2"},t("div",{class:"hero__breadcrumbs"},t("slot",{name:"breadcrumb"}))),t("div",{"grid-states":this.hasSecondaryContent?"xl-col-span-1 xl-col-start-1 xl-row-start-2":"xl-col-span-2 xl-col-start-1 xl-row-start-2"},t("div",{class:"hero__primary"},t("div",{class:"hero__primary-content"},t("slot",{name:"back-btn"}),t("div",null,t("slot",{name:"primary-content"}))))),this.hasSecondaryContent&&t("div",{"grid-states":"xl-col-span-1 xl-col-start-2 xl-row-start-2"},t("div",{class:"hero__secondary"},t("slot",{name:"secondary-content"}),this.hasIconBox&&t("div",{class:"hero__icon-box"},t("slot",{name:"icon-box"}),t("slot",{name:"icon-box-item"})),this.hasQuote&&t("div",{class:"hero__quote-content"},t("span",{class:"hero__quote"},t("slot",{name:"quote"})),t("div",{class:"hero__quote-author"},t("slot",{name:"quote-author"}))))))];render(){return t(e,{key:"8270c80717ac41cc4cd5bedb577b131fe01ac967",class:"nano-hero"},t("div",{key:"8b04bda451af03b648beb5576cd0badd48364aab",class:{hero:!0,"hero--light":"light"===this.theme,"hero--secondary":this.hasSecondaryContent,"hero--iconbox":this.hasIconBox,"hero--rtl":"rtl"===this.host.dir||"rtl"===this.host.ownerDocument.dir,"hero--scrim":this.hasScrim,"hero--breadcrumb":!!this.breadCrumbs.length,"hero--hasbg":this.hasBg,"hero--backbtn":this.hasBackBtn,"hero--sub":"sub"===this.level}},t("div",{key:"be91fa5b23ceddaf411b269eb6635b886c83174d",class:"hero__bg-wrap"},!!this.imgSrc&&t("nano-img",{key:"961b0a21220f0305cc0f4a4af0c6cd5e99446c41",class:"hero__img",lazy:!1,background:!0,srcSet:this.imgSrcSet,src:this.imgSrc},t(this.HeroContent,{key:"b272423beee722ae9d4adc0313d2d9ca4e6e3cd4"})),!this.imgSrc&&[t("div",{key:"f10056208ed97f1d4a051572261c874e5dae6e96",class:"hero__bg-slot"},t("slot",{key:"225c3a0b114b16e8edb063d6979683b343e85419",name:"background"})),t(this.HeroContent,{key:"375442509ce1954ca651d56d49488b0da464e577"})])))}static get watchers(){return{breadCrumbs:["breadCrumbChange"],iconBoxItems:["iconBoxItemChange"]}}};i.style=":host,\n*,\n*::before,\n*::after {\n  box-sizing: border-box;\n}\n[hidden] {\n  display: none !important;\n}\n@media (prefers-reduced-motion: reduce) {\n    :host,\n    *,\n    *::before,\n    *::after {\n      animation-duration: 0.01ms !important;\n      animation-iteration-count: 1 !important;\n      transition-duration: 0.01ms !important;\n      scroll-behavior: auto !important;\n    }\n  }:host,\n*,\n*::before,\n*::after {\n  box-sizing: border-box;\n}\n[hidden] {\n  display: none !important;\n}\n@media (prefers-reduced-motion: reduce) {\n    :host,\n    *,\n    *::before,\n    *::after {\n      animation-duration: 0.01ms !important;\n      animation-iteration-count: 1 !important;\n      transition-duration: 0.01ms !important;\n      scroll-behavior: auto !important;\n    }\n  }:host {\n  /**\n   * @prop --nano-loader-base: Base colour of nano-skeleton. Default depends on theme;\n   * @prop --nano-loader-tint: Tint colour of nano-skeleton. Default depends on theme;\n   * @prop --theme-color: Text color. Default depends on theme;\n   * @prop --theme-tint-color: Color used for bread crumbs and icons. Defaults to #90c6e7;\n   * @prop --scrim-color: Color of the gradient covering the background. Default depends on theme;\n   * @prop --scrim-direction: Direction of the gradient covering the background. Default what content slots are present;\n   * @prop --scrim-opacity-from: Starting opactiy of the gradient covering the background. Default .25;\n   * @prop --scrim-opacity-to: Final opactiy of the gradient covering the background. Default depends on `theme`;\n   * @prop --quote-size: Font size of the quote. Defaults to 1.3em and grows to 3rem on the xl breakpoint;\n  */\n  --nano-loader-base: #4a4a4a;\n  --nano-loader-tint: #7d7d7d;\n  --theme-color: #fff;\n  --theme-tint-color: #90c6e7;\n  --scrim-color: 0 0 0;\n  --scrim-direction: -50deg;\n  --scrim-opacity-from: 0.25;\n  --scrim-opacity-to: 0.7;\n  --padding: 0;\n  --quote-size: 1.3rem;\n  color: var(--theme-color);\n  display: block;\n  container-type: inline-size;\n}\n\n:host([theme=light]) {\n  --nano-loader-base: #fff;\n  --nano-loader-tint: white;\n  --theme-color: #4a4a4a;\n  --scrim-color: 255 255 255;\n  --scrim-opacity-from: 0.25;\n  --scrim-opacity-to: 1;\n  --scrim-direction: 270deg;\n  color: var(--theme-color);\n}\n:host([theme=light]) .hero__primary-content {\n  --color: #4a4a4a;\n}\n\n.hero {\n  position: relative;\n}\n@container (min-width: 800px) {\n  .hero {\n    --quote-size: 3rem;\n  }\n}\n.hero--rtl {\n  --scrim-direction: 270deg;\n}\n.hero--secondary:not(.hero--iconbox) {\n  --scrim-direction: 0deg;\n}\n.hero__bg-wrap {\n  overflow: hidden;\n}\n.hero__bg-slot {\n  position: absolute;\n  inset: 0;\n}\n.hero__ctas {\n  display: flex;\n  justify-content: flex-end;\n  padding-block: 32px 0;\n  padding-inline: 32px;\n  margin-block-end: -64px;\n  position: relative;\n  z-index: 1;\n}\n@media (width <= 52em) {\n  .hero__ctas {\n    display: none;\n  }\n}\n@media (width <= 58em) {\n  .hero__ctas {\n    margin-block-end: -48px;\n  }\n}\n.hero__ctas ::slotted(a.button[slot=secondary-ctas]) {\n  padding-inline: 0.5rem !important;\n  font-size: 0.875rem !important;\n  margin-block: 0 !important;\n  margin-inline: 0.25rem !important;\n}\n.hero__img {\n  display: block;\n  --padding: inherit;\n}\n.hero__breadcrumbs {\n  display: none;\n  margin-block: 20px 0;\n  margin-inline: 14px;\n  line-height: 14px;\n}\n.hero--breadcrumb .hero__breadcrumbs {\n  display: block;\n}\n@container (min-width: 800px) {\n  .hero__breadcrumbs {\n    margin-block: 0;\n    margin-inline: 50px;\n    max-inline-size: 50%;\n  }\n}\n@container (min-width: 900px) {\n  .hero__breadcrumbs {\n    margin-block: 0;\n    margin-inline: 83px;\n  }\n}\n.hero__breadcrumbs ::slotted(*[slot=breadcrumb]) {\n  font-size: 0.85rem;\n  text-transform: uppercase;\n  letter-spacing: 1.5px;\n  font-weight: 600;\n  font-stretch: 125%;\n  display: inline-block;\n  margin-block-end: 16px;\n  position: relative;\n  z-index: 2;\n}\n.hero--hasbg .hero__breadcrumbs ::slotted(*[slot=breadcrumb]) {\n  text-shadow: 1px 1px rgba(0, 0, 0, 0.15);\n}\n.hero__breadcrumbs ::slotted(a[slot=breadcrumb]) {\n  color: var(--theme-tint-color) !important;\n  cursor: pointer;\n}\n.hero__breadcrumbs ::slotted(.slash[slot=breadcrumb]) {\n  color: var(--theme-color);\n  position: relative;\n  margin-block: 0;\n  margin-inline: 0.5rem;\n  display: inline-block;\n}\n.hero__scrim {\n  position: absolute;\n  inset: 0;\n  z-index: 0;\n  background: linear-gradient(var(--scrim-direction), rgb(var(--scrim-color)/var(--scrim-opacity-from)) 0%, rgb(var(--scrim-color)/var(--scrim-opacity-to)) 100%);\n}\n.hero--scrim .hero__scrim {\n  background: none;\n}\n.hero__content {\n  max-inline-size: 1440px;\n  display: block;\n  --grid-row-gap: 0;\n  margin-block: 0;\n  margin-inline: auto;\n  position: relative;\n}\n@container (min-width: 800px) {\n  .hero__content {\n    margin-block: 50px 0 !important;\n    max-inline-size: 1540px !important;\n  }\n}\n@container (min-width: 900px) {\n  .hero__content {\n    margin-block: 83px 0 !important;\n    max-inline-size: 1606px !important;\n  }\n}\n.hero__primary {\n  margin: 16px;\n}\n.hero--breadcrumb .hero__primary {\n  margin-block: 0;\n  margin-inline: 16px;\n}\n.hero--backbtn .hero__primary {\n  margin-inline-start: 0;\n}\n.hero__primary ::slotted(.nano-icon-button[slot=back-btn]) {\n  font-size: 2rem;\n}\n@container (min-width: 800px) {\n  .hero__primary {\n    margin-block: 0 50px !important;\n    margin-inline: 50px 0 !important;\n  }\n  .hero__primary ::slotted(.nano-icon-button[slot=back-btn]) {\n    margin-block: 0 !important;\n    margin-inline: -3rem 0 !important;\n  }\n}\n@container (min-width: 900px) {\n  .hero__primary {\n    margin-block: 0 83px !important;\n    margin-inline: 83px 0 !important;\n  }\n}\n.hero__primary-content {\n  max-inline-size: 45rem;\n  --color: #fff;\n  display: flex;\n}\n.hero--backbtn .hero__primary-content > div {\n  padding-block: 10px 0;\n  padding-inline: 0;\n}\n.hero__primary-content ::slotted(h1[slot=primary-content]) {\n  margin-block: 0 18px !important;\n  font-size: 2rem !important;\n}\n@container (min-width: 800px) {\n  .hero__primary-content ::slotted(h1[slot=primary-content]) {\n    line-height: 31px !important;\n    margin-block-end: 30px !important;\n  }\n  .hero__primary-content ::slotted(.button[slot=primary-content]) {\n    margin-block-start: 20px !important;\n  }\n}\n.hero__secondary {\n  display: none;\n  block-size: 100%;\n  padding-block: 0 20px;\n  padding-inline: 14px;\n}\n.hero--secondary .hero__secondary {\n  display: flex;\n  align-items: center;\n}\n@container (min-width: 800px) {\n  .hero__secondary {\n    padding-block: 0 50px;\n    padding-inline: 50px;\n    justify-content: flex-end;\n  }\n}\n@container (min-width: 900px) {\n  .hero__secondary {\n    padding-block: 0 83px;\n    padding-inline: 83px;\n  }\n}\n.hero__icon-box {\n  background: rgba(0, 0, 0, 0.7);\n  padding: 24px;\n  inline-size: 100%;\n  margin-block-end: auto;\n  display: flex;\n  flex-direction: column;\n  color: white;\n}\n@container (min-width: 800px) {\n  .hero__icon-box {\n    max-inline-size: 410px;\n    flex: 0 1 410px;\n  }\n}\n.hero__icon-box ::slotted([slot=icon-box-item]) {\n  --nano-color-base: var(--theme-tint-color);\n  --nano-icon-size: 32px;\n  --nano-icon-margin-end: 20px;\n  display: flex;\n  align-items: center;\n  font-size: 0.8125rem;\n  margin-block-end: 20px;\n}\n.hero__icon-box ::slotted(.last[slot=icon-box-item]) {\n  margin-block-end: 0;\n}\n.hero__quote-content {\n  margin-block-start: auto;\n  text-align: center;\n  inline-size: 100%;\n}\n@container (min-width: 800px) {\n  .hero__quote-content {\n    max-inline-size: 500px;\n    flex: 0 1 500px;\n    text-align: initial;\n  }\n}\n.hero__quote::before, .hero__quote::after {\n  content: '\"';\n  font-size: var(--quote-size);\n  font-weight: 600;\n  font-style: italic;\n  line-height: 0;\n  color: #abb6b8;\n  display: inline;\n  position: relative;\n}\n.hero__quote ::slotted([slot=quote]) {\n  font-size: var(--quote-size);\n  font-weight: 200;\n  display: inline;\n}\n.hero__quote-author {\n  text-align: end;\n  font-size: 1rem;\n  opacity: 0.8;\n}\n@container (min-width: 800px) {\n  .hero--sub .hero__content {\n    margin-block-start: 40px;\n  }\n  .hero--sub .hero__content .hero__primary {\n    margin-block: 0 40px;\n    margin-inline: 50px 0;\n  }\n  .hero--sub .hero__content .hero__secondary {\n    padding-block: 0 50px;\n    padding-inline: 40px 50px;\n  }\n  .hero--sub .hero__content ::slotted(.button[slot=primary-content]) {\n    margin-block-start: 8px !important;\n  }\n  .hero--sub .hero__content ::slotted(h1[slot=primary-content]) {\n    margin-block-end: 18px !important;\n  }\n}\n@container (min-width: 900px) {\n  .hero--sub .hero__content .hero__primary {\n    margin-block: 0 40px;\n    margin-inline: 83px 0;\n  }\n  .hero--sub .hero__content .hero__secondary {\n    padding-block: 0 83px;\n    padding-inline: 40px 83px;\n  }\n}";export{i as nano_hero}

package/dist/nano-components/nano-icon-button_2.entry.js

@@ -0,0 +1,4 @@
+/*!
+ * Custom elements for Nanopore-Digital Web applications
+ */
+import{r as t,g as o,a as i,c as r}from"./index-BM3Om9WE.js";import{h as n}from"./renderer-BaP2L8CT.js";import{P as e}from"./popover-CWVbjtKn.js";const a=class{constructor(o){t(this,o)}button;get host(){return o(this)}iconName;iconSrc;type="button";name;value;label;showTooltip=!1;disabled=!1;href;rel;target;form;async setFocus(){this.button.focus()}findForm(){const{form:t,host:o}=this;if(!t)return o.closest("form");if(t instanceof HTMLFormElement)return t;if("string"==typeof t){const o=document.getElementById(t);if(o instanceof HTMLFormElement)return o}return null}handleClick=t=>{if("button"===this.type)return;const o=this.findForm();if(o){t.preventDefault();const i=document.createElement("button");i.type=this.type,i.style.display="none",o.appendChild(i),i.click(),i.remove()}};content(){return n(void 0===this.href?"button":"a",{onClick:this.handleClick,part:"base",ref:t=>this.button=t,class:{"icon-button":!0,"icon-button--disabled":this.disabled},name:this.name,value:this.value,href:this.href||void 0,target:this.href&&this.target?this.target:void 0,rel:this.rel||void 0,type:!this.href&&this.type?this.type:void 0},n("span",{class:"icon-button__label"},this.label),n("nano-icon",{name:this.iconName,src:this.iconSrc,"aria-hidden":"true",lazy:!1,part:"icon"}))}render(){return n(i,{class:"nano-icon-button","aria-disabled":this.disabled?"true":null},this.showTooltip?n("nano-tooltip",{content:this.label},this.content()):this.content())}};a.style=":host,*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}@media (prefers-reduced-motion: reduce){:host,*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}:host,*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}@media (prefers-reduced-motion: reduce){:host,*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}:host{--border-radius:none;--active-color:var(--nano-color-neutral-800);--hover-color:var(--nano-color-primary-1100);--padding:var(--nano-spacing-xs);--box-shadow:none;--button-bg:transparent;color:currentcolor;border-radius:var(--border-radius);display:inline-block}.icon-button{flex:0 0 auto;display:flex;align-items:center;border:none;border-radius:inherit;background:inherit;font-size:inherit;color:inherit;padding:var(--padding);cursor:pointer;appearance:none;box-shadow:var(--box-shadow)}.icon-button:hover:not(.icon-button--disabled),.icon-button:focus:not(.icon-button--disabled){color:var(--hover-color)}.icon-button:active:not(.icon-button--disabled){color:var(--active-color)}.icon-button:focus-visible:not(.icon-button--disabled){outline:var(--nano-focus-ring);outline-offset:var(--nano-focus-ring-offset)}.icon-button__label{clip-path:inset(50%);block-size:1px;overflow:hidden;position:absolute;white-space:nowrap;inline-size:1px}:host([disabled]:not([disabled=false])){opacity:0.5;cursor:not-allowed}.icon-button--disabled{pointer-events:none}";const s=class{constructor(o){t(this,o),this.nanoShow=r(this,"nanoShow",7),this.nanoAfterShow=r(this,"nanoAfterShow",7),this.nanoHide=r(this,"nanoHide",7),this.nanoAfterHide=r(this,"nanoAfterHide",7)}isVisible=!1;popover;tooltipPositioner;tooltip;_target;get target(){return this._target}set target(t){t!==this._target&&this._target&&this._target.removeAttribute("aria-label"),t.setAttribute("aria-label",this.label),this._target=t}label="";get host(){return o(this)}content="";setLabel(){const t=Array.from(this.host.querySelectorAll('[slot="content"]')).map((t=>t.textContent)).join(" ").trim();(this.target||(this.target=this.getTarget(),this.target))&&(this.label=t||this.content,this.target.setAttribute("aria-label",this.label))}placement="top";disabled=!1;distance=10;open=!1;skidding=0;hoist=!1;trigger="hover focus";handleOpenChange(){this.open?this.show():this.hide()}nanoShow;nanoAfterShow;nanoHide;nanoAfterHide;async show(){this.isVisible||this.disabled||(this.nanoShow.emit().defaultPrevented?this.open=!1:(this.isVisible=!0,this.open=!0,"function"==typeof this.tooltipPositioner?.showPopover?(this.hoist=!0,this.popover.show(),this.tooltipPositioner.showPopover()):this.popover.show()))}async hide(){this.isVisible&&(this.nanoHide.emit().defaultPrevented?this.open=!0:(this.isVisible=!1,this.open=!1,this.popover.hide(),setTimeout((()=>{this.open||"function"!=typeof this.tooltipPositioner?.hidePopover||this.tooltipPositioner.hidePopover()}),300)))}getTarget(){let t=Array.from(this.host.children);t=t.flatMap((t=>{const o=getComputedStyle(t).display;return"none"===o?[]:"contents"===o&&t.children?.length?Array.from(t.children):t}));const o=t.find((t=>"style"!==t.tagName.toLowerCase()&&"content"!==t.getAttribute("slot")));if(!o)throw new Error("Invalid tooltip target: no child element was found.");return o}hasTrigger(t){return this.trigger.split(" ").includes(t)}syncOptions(){this.popover.setOptions({strategy:this.hoist?"fixed":"absolute",placement:this.placement,distance:this.distance,skidding:this.skidding,transitionElement:this.tooltip,onAfterHide:()=>this.nanoAfterHide.emit(),onAfterShow:()=>this.nanoAfterShow.emit()})}handleBlur=()=>{this.hasTrigger("focus")&&this.hide()};handleClick=()=>{this.hasTrigger("click")&&(this.open?this.hide():this.show())};handleFocus=()=>{this.hasTrigger("focus")&&this.show()};handleKeyDown=t=>{this.open&&"Escape"===t.key&&(t.stopPropagation(),this.hide())};handleMouseOver=()=>{this.hasTrigger("hover")&&this.show()};handleMouseOut=()=>{this.hasTrigger("hover")&&this.hide()};handleSlotChange=()=>{this.target=this.getTarget()};componentDidLoad(){this.target=this.getTarget(),this.popover=new e(this.target,this.tooltipPositioner,{sameWidth:!1}),this.syncOptions(),this.setLabel(),this.tooltipPositioner.hidden=!this.open,this.open&&this.show()}componentDidUpdate(){this.syncOptions()}disconnectedCallback(){this.popover&&this.popover.destroy()}render(){return n(i,{key:"94758bb18228b14884cf2be79228e554de84013f",onKeyDown:this.handleKeyDown,onMouseOver:this.handleMouseOver,onMouseOut:this.handleMouseOut,onBlur:this.handleBlur,onFocus:this.handleFocus,onClick:this.handleClick,class:"nano-tooltip"},n("slot",{key:"45589386e68d89c21abbb50513678152e8bce9d1",onSlotchange:this.handleSlotChange}),n("div",{key:"6a76c101c35d45458f0a680753a381cc95631b87",ref:t=>this.tooltipPositioner=t,class:"tooltip-positioner",popover:"manual"},n("div",{key:"d3b2cc9c9018c9a0a5dc4cef256c8b9c568cd0b4",part:"base",ref:t=>this.tooltip=t,class:{tooltip:!0,"tooltip--open":this.open},role:"tooltip","aria-hidden":this.open?"false":"true"},n("slot",{key:"1c51cdc6a7ec88107e3290b0b9750198e7176c20",name:"content",onSlotchange:()=>this.setLabel()},this.content),n("div",{key:"00f090eee000e6bba713dc21a1d53c348eb94a76",class:"tooltip-arrow","data-popper-arrow":!0}))))}static get watchers(){return{content:["setLabel"],open:["handleOpenChange"]}}};s.style=':host,*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}@media (prefers-reduced-motion: reduce){:host,*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}:host,*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}@media (prefers-reduced-motion: reduce){:host,*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}:host{--border-radius:0px;--max-width:20rem;--hide-delay:var(--nano-transition-x-fast);--hide-duration:var(--nano-transition-x-fast);--hide-timing-function:ease;--show-delay:var(--nano-transition-x-fast);--show-duration:var(--nano-transition-x-fast);--show-timing-function:ease;--background:var(--nano-color-neutral-1200);--color:var(--nano-color-base-0);--padding:var(--nano-spacing-sm);--arrow-size:5px;--arrow-offset:5px;display:contents}.tooltip-arrow{content:"";position:absolute;color:var(--background);transform:none !important;inset-inline-start:unset !important}.tooltip{max-inline-size:var(--max-width);border-radius:var(--border-radius);background-color:var(--background);font-size:var(--nano-font-size-2xs);line-height:1.5;color:var(--color);opacity:0;padding:var(--padding);transform:translateY(10px) translateZ(0);transform-origin:bottom;transition:opacity, transform var(--hide-duration) var(--hide-timing-function) var(--hide-delay);white-space:normal;transition-delay:var(--show-delay);transition-duration:var(--show-duration);transition-timing-function:var(--show-timing-function)}.tooltip ::slotted(*){color:inherit;font-size:inherit;line-height:inherit}.tooltip-positioner{position:absolute;z-index:var(--nano-z-index-tooltip);border:0;background:none;padding:0;overflow:visible;color:unset}.tooltip-positioner::backdrop{display:none}.tooltip-positioner[popover],.tooltip-positioner:popover-open{inset:unset}.tooltip-positioner[data-popper-placement^=top] .tooltip{transform-origin:bottom;transform:translateY(-10px) translateZ(0)}.tooltip-positioner[data-popper-placement^=bottom] .tooltip{transform-origin:top}.tooltip-positioner[data-popper-placement^=left] .tooltip{transform-origin:right}.tooltip-positioner[data-popper-placement^=right] .tooltip{transform-origin:left}.tooltip-positioner.popover-visible .tooltip{opacity:1;transform:none}.tooltip-positioner[data-popper-placement^=bottom] .tooltip-arrow{inset-block-end:100%;inset-inline-start:calc(50% - var(--arrow-size)) !important;border-block-end:var(--arrow-size) solid;border-inline-start:var(--arrow-size) solid transparent;border-inline-end:var(--arrow-size) solid transparent}.tooltip-positioner[data-popper-placement=bottom-start] .tooltip-arrow{inset-inline-start:var(--arrow-offset) !important}.tooltip-positioner[data-popper-placement=bottom-end] .tooltip-arrow{inset-inline:auto var(--arrow-offset) !important}.tooltip-positioner[data-popper-placement^=top] .tooltip-arrow{inset-block-start:100%;inset-inline-start:calc(50% - var(--arrow-size)) !important;border-block-start:var(--arrow-size) solid;border-inline-start:var(--arrow-size) solid transparent;border-inline-end:var(--arrow-size) solid transparent}.tooltip-positioner[data-popper-placement=top-start] .tooltip-arrow{inset-inline-start:var(--arrow-offset) !important}.tooltip-positioner[data-popper-placement=top-end] .tooltip-arrow{inset-inline:auto var(--arrow-offset) !important}.tooltip-positioner[data-popper-placement^=left] .tooltip-arrow{inset-block-start:calc(50% - var(--arrow-size)) !important;inset-inline-start:100% !important;border-inline-start:var(--arrow-size) solid;border-block-start:var(--arrow-size) solid transparent;border-block-end:var(--arrow-size) solid transparent}.tooltip-positioner[data-popper-placement=left-start] .tooltip-arrow{inset-block-start:var(--arrow-offset) !important}.tooltip-positioner[data-popper-placement=left-end] .tooltip-arrow{inset-block:auto var(--arrow-offset) !important}.tooltip-positioner[data-popper-placement^=right] .tooltip-arrow{inset-block-start:calc(50% - var(--arrow-size)) !important;inset-inline-end:100% !important;border-inline-end:var(--arrow-size) solid;border-block-start:var(--arrow-size) solid transparent;border-block-end:var(--arrow-size) solid transparent}.tooltip-positioner[data-popper-placement=right-start] .tooltip-arrow{inset-block-start:var(--arrow-offset) !important}.tooltip-positioner[data-popper-placement=right-end] .tooltip-arrow{inset-block:auto var(--arrow-offset) !important}';export{a as nano_icon_button,s as nano_tooltip}

package/dist/nano-components/nano-icon.entry.js

@@ -0,0 +1,4 @@
+/*!
+ * Custom elements for Nanopore-Digital Web applications
+ */
+import{k as i,r as o,c as t,g as n,a as r}from"./index-BM3Om9WE.js";import{h as e}from"./renderer-BaP2L8CT.js";let s;const a=(i,o)=>(i||!o||l(o)||(i=o),m(i)&&(i=h(i)),m(i)&&""!==i.trim()?""!==i.replace(/[a-z]|-|\/|\d/gi,"")?(console.warn("invalid characters in icon name "+i),null):i:null),c=i=>m(i)&&(i=i.trim(),l(i))?i:null,l=i=>i.length>0&&/(\/|\.)/.test(i),m=i=>"string"==typeof i,h=i=>i.toLowerCase(),d=i=>{if(1===i.nodeType){if("script"===i.nodeName.toLowerCase())return!1;for(let o=0;o<i.attributes.length;o++){const t=i.attributes[o].value;if(m(t)&&0===t.toLowerCase().indexOf("on"))return!1}for(let o=0;o<i.childNodes.length;o++)if(!d(i.childNodes[o]))return!1}return!0},p=new Map,f=new Map,u=class{constructor(i){o(this,i),this.nanoLoad=t(this,"nanoLoad",7),this.nanoError=t(this,"nanoError",7)}io;get el(){return n(this)}svgContent;isVisible=!1;isLoading=!0;color;role;setAriaLabel(){if(this.ariaLabel||this.el.ariaLabel)"presentation"===this.role&&(this.ariaLabel=void 0);else if(!this.role||"presentation"!==this.role){const i=a(this.name,this.icon);i&&(this.ariaLabel=i.split("/").slice(-1)[0].replace(/-/g," "))}}ariaLabel;updateRole(){this.ariaLabel?this.role="img":this.ariaLabel||(this.role="presentation")}flipRtl;name;src;icon;size="auto";lazy=!0;loadIcon(){if(this.isVisible){const o=(o=>{let t=c(o.src);return t||(t=a(o.name,o.icon),t?(n=t,(()=>{if(!s){const i=window;i.Nanoicons=i.Nanoicons||{},s=i.Nanoicons.map=i.Nanoicons.map||new Map}return s})().get(n)||(n.startsWith("device/")||n.startsWith("pictogram/")?i(`../nano-assets/icon/${n}.svg`):i(`../nano-assets/fontawesome-pro/svgs/${n}.svg`))):o.icon&&(t=c(o.icon),t)?t:null);var n})(this);o&&(p.has(o)?(this.svgContent=p.get(o),requestAnimationFrame((()=>{this.isLoading=!1,this.nanoLoad.emit()}))):(i=>{let o=f.get(i);return o||(o=fetch(i).then((o=>{if(o.ok)return o.text().then((o=>{p.set(i,(i=>{if(i&&document){const o=document.createElement("div");o.innerHTML=i;for(let i=o.childNodes.length-1;i>=0;i--)"svg"!==o.childNodes[i].nodeName.toLowerCase()&&o.removeChild(o.childNodes[i]);const t=o.firstElementChild;if(t&&"svg"===t.nodeName.toLowerCase()){const i=t.getAttribute("class")||"";if(t.setAttribute("class",(i+" sc-nano-icon s-nano-icon svg").trim()),d(t))return o.innerHTML}}return""})(o))}));p.set(i,"")})),f.set(i,o)),o})(o).then((()=>{this.svgContent=p.get(o),requestAnimationFrame((()=>{this.isLoading=!1,this.nanoLoad.emit()})),this.setAriaLabel()}),(()=>{this.nanoError.emit()})))}}nanoLoad;nanoError;waitUntilVisible(i,o,t){if(this.lazy&&"undefined"!=typeof window&&window.IntersectionObserver){const n=this.io=new window.IntersectionObserver((i=>{(i[0].isIntersecting||i[1]&&i[1].isIntersecting)&&(n.disconnect(),this.io=void 0,t())}),{rootMargin:o});n.observe(i)}else t()}isRtl(){if("rtl"===this.el.ownerDocument?.dir)return!0;if(this.el.closest('[dir="rtl"]'))return!0;const i=this.el.getRootNode().host;return!(!i||!i.closest('[dir="rtl"]'))}connectedCallback(){this.waitUntilVisible(this.el,"50px",(()=>{this.isVisible=!0,this.loadIcon()}))}disconnectedCallback(){this.io&&(this.io.disconnect(),this.io=void 0)}componentWillLoad(){this.updateRole(),this.setAriaLabel()}render(){const i=this.flipRtl||this.name&&this.name.match(/right|left/)&&(this.name.indexOf("arrow")>-1||this.name.indexOf("chevron")>-1)&&this.isRtl();return e(r,{key:"0bc1c17119f0e49b9798a1b61a4a768f6406129f",class:{loading:this.isLoading,"flip-rtl":!!i,"nano-icon":!0}},e("div",this.svgContent?{class:"icon-inner",innerHTML:this.svgContent}:{class:"icon-inner"}))}static get assetsDirs(){return["device","pictogram"]}static get watchers(){return{role:["setAriaLabel"],ariaLabel:["updateRole"],name:["loadIcon"],src:["loadIcon"],icon:["loadIcon"]}}};u.style=":host,*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}@media (prefers-reduced-motion: reduce){:host,*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}:host,*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}@media (prefers-reduced-motion: reduce){:host,*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}:host{--icon-size:1em;--primary-color:currentcolor\n  --secondary-color: color-mix(in srgb, currentColor 50%, transparent);--primary-opacity:0.8;--secondary-opacity:1;display:inline-block;inline-size:var(--icon-size);block-size:var(--icon-size);min-inline-size:var(--icon-size);min-block-size:var(--icon-size);contain:strict;fill:currentcolor;box-sizing:content-box !important;transition:opacity 0.3s ease;color:currentcolor}:host .nanoicon{stroke:currentcolor}.nanoicon-fill-none{fill:none}.icon-inner,.nanoicon,svg,.svg{display:block;block-size:100%;inline-size:100%;overflow:visible}:host(.loading){opacity:0}.fa-primary{color:var(--primary-color);opacity:var(--primary-opacity, 1)}.fa-secondary{color:var(--secondary-color);opacity:var(--secondary-opacity) !important}:host(.flip-rtl) .icon-inner{transform:scaleX(-1)}:host([name^=pictogram]),:host([name^=device]){font-size:max(var(--nano-pictogram-size-medium), var(--icon-size))}:host([size=small][name^=pictogram]),:host([size=small][name^=device]){font-size:var(--nano-pictogram-size-small)}:host([size=regular]){font-size:var(--nano-icon-size-small)}:host([size=regular][name^=pictogram]),:host([size=regular][name^=device]){font-size:var(--nano-pictogram-size-medium)}:host([size=large]){font-size:var(--nano-icon-size-large)}:host([size=large][name^=pictogram]),:host([size=large][name^=device]){font-size:var(--nano-pictogram-size-large)}:host([size=xl][name^=pictogram]),:host([size=xl][name^=device]){font-size:var(--nano-pictogram-size-x-large)}:host([name^=pictogram]),:host([name^=device]),:host([color=primary]){color:var(--nano-color-primary-1100)}:host([color=neutral]){color:var(--nano-color-base-1000)}";export{u as nano_icon}

package/dist/nano-components/nano-in-page-nav.entry.js

@@ -1,4 +1,4 @@
 /*!
  * Custom elements for Nanopore-Digital Web applications
  */
-import{r as a,g as e,a as r}from"./index-BM3Om9WE.js";import{h as t}from"./renderer-BaP2L8CT.js";import{H as i}from"./slot-CFTP7C_Z.js";import{g as o}from"./dom-dlicJTEJ.js";const n=class{constructor(e){a(this,e)}stickyHeaders=!0;get el(){return e(this)}mobileNavWrapper;slotCtrl=new i(this,"[default]","mobile","back","accessory");componentDidLoad(){this.createMobileMenu()}createMobileMenu(){const a=o(this.el,"ul")[0];if(!a)return;const e=a.cloneNode(!0);o(e,"li",!0).forEach((a=>{const e=o(a,"a",!0)[0],r=o(a,"ul",!0)[0];if(e&&r){const t=this.createDetails(e.textContent?.trim()||"",r);e.remove(),a.prepend(t)}})),this.mobileNavWrapper.appendChild(e)}createDetails(a,e){const r=document.createElement("nano-details");return r.setAttribute("label",a),r.classList.add("nav-details"),r.appendChild(e),r}render(){return t(r,{key:"5fc7993edd48363da225ffce7e8d3dad8689e761",class:"nano-in-page-nav"},t("nav",{key:"4cc75849661bb1e2fd144ac075a693ce9e5af58f",part:"root"},(this.slotCtrl.has("back")||this.slotCtrl.has("accessory"))&&t("div",{key:"286df7a444423180967750017575414cce154b0d",class:"header"},t("slot",{key:"255d81a0c2d26b0069a83a08e552e6afeb035295",name:"back"}),t("slot",{key:"c939561b8be1b4a479e1f0c01684f5dd0a3014ce",name:"accessory"})),t("div",{key:"411231a64e23575d76722f59446567f5cd68575e",class:"desktop-nav"},t("slot",{key:"892a93de5de705e392b687ee62ab89c17bcc349a"})),t("nano-details",{key:"34d89f9f7927db1cb817124cf0d053f88963484c",label:"Menu",class:"details-wrapper mobile-nav",ref:a=>this.mobileNavWrapper=a})))}};n.style=':host,*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}@media (prefers-reduced-motion: reduce){:host,*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}:host,*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}@media (prefers-reduced-motion: reduce){:host,*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}:host{display:block}.desktop-nav{display:block}@media (width <= 767px){.desktop-nav{display:none}}.mobile-nav{display:none}@media (width <= 767px){.mobile-nav{display:block}}nav{background-color:var(--color-bg);padding:0}nav:has(.details-wrapper[open]){box-shadow:var(--nano-shadow-l1)}.header{padding:var(--spacing-l2) var(--spacing-l2) 0;display:flex;flex-direction:column;gap:var(--spacing-l2);font-size:var(--font-size)}.header ::slotted(a[slot=back]),.header::slotted(a[slot=back]){display:flex !important;align-items:center !important;padding:0 !important;margin:0;gap:var(--spacing-l3) !important;cursor:pointer}.header ::slotted(a[slot=back])::before,.header::slotted(a[slot=back])::before{content:"";display:inline-block;background-size:cover;inline-size:1rem;block-size:1rem;background-color:var(--color-primary);-webkit-mask-image:var(--nano-component-icon-chevron);mask-image:var(--nano-component-icon-chevron);-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center;transform-origin:center;rotate:calc(180deg * var(--flip-icon-ltr))}.details-wrapper{--padding:0;--btn-bg-color:transparent;--btn-bg-color--hover:transparent;--btn-text-color:var(--color-text);border:none}.details-wrapper::part(header){font-size:var(--font-size);line-height:var(--line-height);font-weight:var(--font-weight);letter-spacing:var(--letter-spacing);padding:var(--spacing-l2)}.details-wrapper[open]::part(header){background-color:var(--nano-color-primary-75)}.details-wrapper::part(content){padding:0}.details-wrapper::part(body){padding:0}.details-wrapper.sticky.stuck[open]::part(header){z-index:var(--nano-z-index-menubar);inset-block-start:0;position:sticky;box-shadow:var(--nano-shadow-l1);padding:var(--spacing-l2)}.details-wrapper a,.details-wrapper ul,.details-wrapper li{all:unset}.details-wrapper ul{display:flex;flex-direction:column;list-style:none}.details-wrapper ul:not(ul ul){padding:0 var(--spacing-l2) 0 var(--spacing-l2)}.details-wrapper a{cursor:pointer}.details-wrapper a:hover{text-decoration:underline}.details-wrapper a:focus-visible{outline:var(--nano-focus-ring);outline-offset:var(--nano-focus-ring-offset)}.details-wrapper ul>li:not(ul>li li){margin:0;padding:var(--spacing-l2) 0;display:flex;flex-direction:column;align-items:stretch;justify-content:stretch;inline-size:100%}.details-wrapper ul>li:not(ul>li li):not(:last-of-type){border-block-end:1px solid var(--color-bottom-border)}.details-wrapper ul>li:not(ul>li li) a{color:var(--color-text)}.details-wrapper ul>li:not(ul>li li) a.is-active{border-inline-start:var(--border-active);padding-inline-start:1rem}.details-wrapper ul>li:not(ul>li li) a:hover{color:var(--color-text-hover)}.details-wrapper ul>li>ul,.details-wrapper ul>li>.nano-details>ul{padding:var(--list-gap) 0 0 var(--spacing-l2);gap:var(--list-gap)}.details-wrapper ul>li>ul a,.details-wrapper ul>li>.nano-details>ul a{color:var(--color-primary) !important}.details-wrapper ul>li>ul>li>.nano-details>ul,.details-wrapper ul>li>.nano-details>ul>li>.nano-details>ul{padding:var(--list-gap) 0 0 var(--nano-spacing-xl)}.details-wrapper .nano-details .nano-details:not(.nano-details .nano-details .nano-details){color:var(--color-text)}.details-wrapper .nano-details{--padding:0;--btn-bg-color:transparent;--btn-bg-color--open:var(--nano-color-primary-75);--btn-bg-color--hover:transparent;border:none;color:var(--color-primary)}.details-wrapper .nano-details .is-active::part(header){border-inline-start:var(--border-active);padding-inline-start:1rem !important;color:var(--color-primary)}.details-wrapper .nano-details[open]>[slot=icon-start]{rotate:90deg}.details-wrapper .nano-details::part(icon--start){margin-inline-end:var(--spacing-l3)}.details-wrapper .nano-details::part(header){font-size:var(--font-size);line-height:var(--line-height);font-weight:var(--font-weight);letter-spacing:var(--letter-spacing)}.details-wrapper .nano-details::part(header):hover{text-decoration:underline}.details-wrapper .nano-details:not(.nav-details){color:var(--color-primary)}';export{n as nano_in_page_nav}
+import{r as a,g as e,a as r}from"./index-BM3Om9WE.js";import{h as t}from"./renderer-BaP2L8CT.js";import{H as i}from"./slot-CFTP7C_Z.js";import{g as o}from"./dom-dlicJTEJ.js";const n=class{constructor(e){a(this,e)}stickyHeaders=!0;get el(){return e(this)}mobileNavWrapper;slotCtrl=new i(this,"[default]","mobile","back","accessory");componentDidLoad(){this.createMobileMenu()}createMobileMenu(){const a=o(this.el,"ul")[0];if(!a)return;const e=a.cloneNode(!0);o(e,"li",!0).forEach((a=>{const e=o(a,"a",!0)[0],r=o(a,"ul",!0)[0];if(e&&r){const t=this.createDetails(e.textContent?.trim()||"",r);e.remove(),a.prepend(t)}})),this.mobileNavWrapper.appendChild(e)}createDetails(a,e){const r=document.createElement("nano-details");return r.setAttribute("label",a),r.classList.add("nav-details"),r.appendChild(e),r}render(){return t(r,{key:"8b88cd04f960c4c8ea7ae2dd79a6ec82694570e6",class:"nano-in-page-nav"},t("nav",{key:"4df4a5ef8aecad356c6ad1acd9a6a886edce8139",part:"root"},(this.slotCtrl.has("back")||this.slotCtrl.has("accessory"))&&t("div",{key:"ed1315ac689d77ffd4005df5a6eeb01f3fc9f599",class:"header"},t("slot",{key:"0db0fb3919268a14fb924b292302c563181e87c0",name:"back"}),t("slot",{key:"95a5fafda43239ef7cc9208efc254fb335bc9f66",name:"accessory"})),t("div",{key:"5a273c033b193efe7d4c72c3ccfdbf30b4442eae",class:"desktop-nav"},t("slot",{key:"7d0cff62b54d21daa5b8e7d9551a9d0ed08cfe6f"})),t("nano-details",{key:"c337ce8ac65560e5914f8566304f9382540316f2",label:"Menu",class:"details-wrapper mobile-nav",ref:a=>this.mobileNavWrapper=a})))}};n.style=':host,*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}@media (prefers-reduced-motion: reduce){:host,*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}:host,*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}@media (prefers-reduced-motion: reduce){:host,*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}:host{display:block}.desktop-nav{display:block}@media (width <= 767px){.desktop-nav{display:none}}.mobile-nav{display:none}@media (width <= 767px){.mobile-nav{display:block}}nav{background-color:var(--color-bg);padding:0}nav:has(.details-wrapper[open]){box-shadow:var(--nano-shadow-l1)}.header{padding:var(--spacing-l2) var(--spacing-l2) 0;display:flex;flex-direction:column;gap:var(--spacing-l2);font-size:var(--font-size)}.header ::slotted(a[slot=back]),.header::slotted(a[slot=back]){display:flex !important;align-items:center !important;padding:0 !important;margin:0;gap:var(--spacing-l3) !important;cursor:pointer}.header ::slotted(a[slot=back])::before,.header::slotted(a[slot=back])::before{content:"";display:inline-block;background-size:cover;inline-size:1rem;block-size:1rem;background-color:var(--color-primary);-webkit-mask-image:var(--nano-component-icon-chevron);mask-image:var(--nano-component-icon-chevron);-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center;transform-origin:center;rotate:calc(180deg * var(--flip-icon-ltr))}.details-wrapper{--padding:0;--btn-bg-color:transparent;--btn-bg-color--hover:transparent;--btn-text-color:var(--color-text);border:none}.details-wrapper::part(header){font-size:var(--font-size);line-height:var(--line-height);font-weight:var(--font-weight);letter-spacing:var(--letter-spacing);padding:var(--spacing-l2)}.details-wrapper[open]::part(header){background-color:var(--nano-color-primary-75)}.details-wrapper::part(content){padding:0}.details-wrapper::part(body){padding:0}.details-wrapper.sticky.stuck[open]::part(header){z-index:var(--nano-z-index-menubar);inset-block-start:0;position:sticky;box-shadow:var(--nano-shadow-l1);padding:var(--spacing-l2)}.details-wrapper a,.details-wrapper ul,.details-wrapper li{all:unset}.details-wrapper ul{display:flex;flex-direction:column;list-style:none}.details-wrapper ul:not(ul ul){padding:0 var(--spacing-l2) 0 var(--spacing-l2)}.details-wrapper a{cursor:pointer}.details-wrapper a:hover{text-decoration:underline}.details-wrapper a:focus-visible{outline:var(--nano-focus-ring);outline-offset:var(--nano-focus-ring-offset)}.details-wrapper ul>li:not(ul>li li){margin:0;padding:var(--spacing-l2) 0;display:flex;flex-direction:column;align-items:stretch;justify-content:stretch;inline-size:100%}.details-wrapper ul>li:not(ul>li li):not(:last-of-type){border-block-end:1px solid var(--color-bottom-border)}.details-wrapper ul>li:not(ul>li li) a{color:var(--color-text)}.details-wrapper ul>li:not(ul>li li) a.is-active{border-inline-start:var(--border-active);padding-inline-start:1rem}.details-wrapper ul>li:not(ul>li li) a:hover{color:var(--color-text-hover)}.details-wrapper ul>li>ul,.details-wrapper ul>li>.nano-details>ul{padding:var(--list-gap) 0 0 var(--spacing-l2);gap:var(--list-gap)}.details-wrapper ul>li>ul a,.details-wrapper ul>li>.nano-details>ul a{color:var(--color-primary) !important}.details-wrapper ul>li>ul>li>.nano-details>ul,.details-wrapper ul>li>.nano-details>ul>li>.nano-details>ul{padding:var(--list-gap) 0 0 var(--nano-spacing-xl)}.details-wrapper .nano-details .nano-details:not(.nano-details .nano-details .nano-details){color:var(--color-text)}.details-wrapper .nano-details{--padding:0;--btn-bg-color:transparent;--btn-bg-color--open:var(--nano-color-primary-75);--btn-bg-color--hover:transparent;border:none;color:var(--color-primary)}.details-wrapper .nano-details .is-active::part(header){border-inline-start:var(--border-active);padding-inline-start:1rem !important;color:var(--color-primary)}.details-wrapper .nano-details[open]>[slot=icon-start]{rotate:90deg}.details-wrapper .nano-details::part(icon--start){margin-inline-end:var(--spacing-l3)}.details-wrapper .nano-details::part(header){font-size:var(--font-size);line-height:var(--line-height);font-weight:var(--font-weight);letter-spacing:var(--letter-spacing)}.details-wrapper .nano-details::part(header):hover{text-decoration:underline}.details-wrapper .nano-details:not(.nav-details){color:var(--color-primary)}';export{n as nano_in_page_nav}

package/dist/nano-components/nano-increment.entry.js

@@ -1,4 +1,4 @@
 /*!
  * Custom elements for Nanopore-Digital Web applications
  */
-import{r as t,g as n,a as e}from"./index-BM3Om9WE.js";import{h as i}from"./renderer-BaP2L8CT.js";const o=class{constructor(n){t(this,n)}get host(){return n(this)}inputElement;ignoreInputChange=!1;inputElementChanged(t,n){n&&n.removeEventListener("nanoChange",this.inputChangeHandler),this.inputElement&&(this.inputElement.label=this.inputElement.label||"Increment value",this.inputElement.hideLabel=!0,this.inputElement.type="number",this.inputElement.max=this.inputElement.max||"10",this.inputElement.min=this.inputElement.min||"0",this.inputElement.step=this.inputElement.step||"1",this.inputElement.value=this.inputElement.value||"0",this.inputElement.addEventListener("nanoChange",this.inputChangeHandler))}inputChangeHandler=()=>{if(!this.ignoreInputChange){this.ignoreInputChange=!0;let t=Number(this.inputElement.value);t=isNaN(t)?0:t,t=Math.max(t,parseFloat(this.inputElement.min)||0),t=Math.min(t,parseFloat(this.inputElement.max)||1/0),this.inputElement.value=t.toString(),requestAnimationFrame((()=>{this.ignoreInputChange=!1}))}};handleSlotChange=()=>{this.inputElement=this.host.querySelector("nano-input")};handleMinus=()=>{if(this.inputElement){const t=parseFloat(this.inputElement.value)||0,n=parseFloat(this.inputElement.step)||1,e=Math.max(t-n,parseFloat(this.inputElement.min)||0);this.ignoreInputChange=!0,this.inputElement.value=e.toString(),this.ignoreInputChange=!1}};handlePlus=()=>{if(this.inputElement){const t=parseFloat(this.inputElement.value)||0,n=parseFloat(this.inputElement.step)||1,e=Math.min(t+n,parseFloat(this.inputElement.max)||1/0);this.ignoreInputChange=!0,this.inputElement.value=e.toString(),this.ignoreInputChange=!1}};componentWillLoad(){this.handleSlotChange()}render(){return i(e,{key:"fab6b5bdecb8ccd3661d7054e08d66a46c2dd0a8",class:"nano-increment"},i("div",{key:"c064903981622ce66ac3a19efce6d595d59b7ed0",class:"root"},i("div",{key:"447735cf16956d0ae172cc2bb1b3a7ffffd7fa0c",class:"minus"},i("nano-icon-button",{key:"24e73eee061669ea0dd5423bae53886bed60478a",iconName:"light/minus",label:"Decrement",onClick:this.handleMinus})),i("slot",{key:"855358fe5a99004f52432dd42cf8c986f67afe69",onSlotchange:this.handleSlotChange}),i("div",{key:"17b1a5d9988023f4869489beffd697f4329a1d61",class:"plus"},i("nano-icon-button",{key:"8b2e763e3f871355085e13b20a26f751c153a329",iconName:"light/plus",label:"Increment",onClick:this.handlePlus}))))}static get watchers(){return{inputElement:["inputElementChanged"]}}};o.style=":host,*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}@media (prefers-reduced-motion: reduce){:host,*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}:host,*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}@media (prefers-reduced-motion: reduce){:host,*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}:host{display:inline-block}.root{display:grid;grid-template-columns:min-content auto 1fr;grid-template-rows:max-content max-content;align-items:stretch}::slotted(*){text-align:center}nano-icon-button{background:var(--nano-color-base-0);color:var(--nano-color-primary-1000);display:flex;border-radius:var(--nano-border-radius-pill);position:relative;z-index:1;inline-size:fit-content;block-size:100%}nano-icon-button:hover{background:var(--nano-color-primary-100)}nano-icon-button:active{background:var(--nano-color-primary-300)}nano-icon-button::part(base){border:1px solid var(--nano-color-neutral-300)}nano-icon-button::part(base):focus-visible{outline:var(--nano-focus-ring-color) solid 3px;outline-offset:-2px}.minus{grid-column:1;grid-row:1}.minus nano-icon-button{--padding:0.4375em 0.625em 0.4375em 1.125em;border-start-end-radius:0;border-end-end-radius:0}.minus nano-icon-button::part(base){border-inline-end:none}.plus{grid-column:3;grid-row:1}.plus nano-icon-button{--padding:0.4375em 1.125em 0.4375em 0.625em;border-start-start-radius:0;border-end-start-radius:0}.plus nano-icon-button::part(base){border-inline-start:none}";export{o as nano_increment}
+import{r as t,g as n,a}from"./index-BM3Om9WE.js";import{h as i}from"./renderer-BaP2L8CT.js";const o=class{constructor(n){t(this,n)}get host(){return n(this)}inputElement;ignoreInputChange=!1;inputElementChanged(t,n){n&&n.removeEventListener("nanoChange",this.inputChangeHandler),this.inputElement&&(this.inputElement.label=this.inputElement.label||"Increment value",this.inputElement.hideLabel=!0,this.inputElement.type="number",this.inputElement.max=this.inputElement.max||"10",this.inputElement.min=this.inputElement.min||"0",this.inputElement.step=this.inputElement.step||"1",this.inputElement.value=this.inputElement.value||"0",this.inputElement.addEventListener("nanoChange",this.inputChangeHandler))}inputChangeHandler=()=>{if(!this.ignoreInputChange){this.ignoreInputChange=!0;let t=Number(this.inputElement.value);t=isNaN(t)?0:t,t=Math.max(t,parseFloat(this.inputElement.min)||0),t=Math.min(t,parseFloat(this.inputElement.max)||1/0),this.inputElement.value=t.toString(),requestAnimationFrame((()=>{this.ignoreInputChange=!1}))}};handleSlotChange=()=>{this.inputElement=this.host.querySelector("nano-input")};handleMinus=()=>{if(this.inputElement){const t=parseFloat(this.inputElement.value)||0,n=parseFloat(this.inputElement.step)||1,a=Math.max(t-n,parseFloat(this.inputElement.min)||0);this.ignoreInputChange=!0,this.inputElement.value=a.toString(),this.ignoreInputChange=!1}};handlePlus=()=>{if(this.inputElement){const t=parseFloat(this.inputElement.value)||0,n=parseFloat(this.inputElement.step)||1,a=Math.min(t+n,parseFloat(this.inputElement.max)||1/0);this.ignoreInputChange=!0,this.inputElement.value=a.toString(),this.ignoreInputChange=!1}};componentWillLoad(){this.handleSlotChange()}render(){return i(a,{key:"14c12f59b2f00d22bc58fb5ca64616a0a6b19749",class:"nano-increment"},i("div",{key:"77800505fe9e0d79fda864dc48cb199e6ea611c7",class:"root"},i("div",{key:"01576d846ca2708319d9faf1c7a0a25169f6c3f4",class:"minus"},i("nano-icon-button",{key:"a6b30034c64de602ac504a882aa3ff7c5a933083",iconName:"light/minus",label:"Decrement",onClick:this.handleMinus})),i("slot",{key:"f04566d5f4a52f23a36bfb1c86a8dadfa3638d66",onSlotchange:this.handleSlotChange}),i("div",{key:"4f1e183e7d547d5f72154115300d14cfbbe3d62b",class:"plus"},i("nano-icon-button",{key:"20af1b2a19cd8c9264e6375f4a5c05b9f917d979",iconName:"light/plus",label:"Increment",onClick:this.handlePlus}))))}static get watchers(){return{inputElement:["inputElementChanged"]}}};o.style=":host,*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}@media (prefers-reduced-motion: reduce){:host,*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}:host,*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}@media (prefers-reduced-motion: reduce){:host,*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}:host{display:inline-block}.root{display:grid;grid-template-columns:min-content auto 1fr;grid-template-rows:max-content max-content;align-items:stretch}::slotted(*){text-align:center}nano-icon-button{background:var(--nano-color-base-0);color:var(--nano-color-primary-1000);display:flex;border-radius:var(--nano-border-radius-pill);position:relative;z-index:1;inline-size:fit-content;block-size:100%}nano-icon-button:hover{background:var(--nano-color-primary-100)}nano-icon-button:active{background:var(--nano-color-primary-300)}nano-icon-button::part(base){border:1px solid var(--nano-color-neutral-300)}nano-icon-button::part(base):focus-visible{outline:var(--nano-focus-ring-color) solid 3px;outline-offset:-2px}.minus{grid-column:1;grid-row:1}.minus nano-icon-button{--padding:0.4375em 0.625em 0.4375em 1.125em;border-start-end-radius:0;border-end-end-radius:0}.minus nano-icon-button::part(base){border-inline-end:none}.plus{grid-column:3;grid-row:1}.plus nano-icon-button{--padding:0.4375em 1.125em 0.4375em 0.625em;border-start-start-radius:0;border-end-start-radius:0}.plus nano-icon-button::part(base){border-inline-start:none}";export{o as nano_increment}

package/dist/nano-components/nano-intersection-observe.entry.js

@@ -1,4 +1,4 @@
 /*!
  * Custom elements for Nanopore-Digital Web applications
  */
-import{r as t,c as s,g as e,a as i}from"./index-BM3Om9WE.js";import{h as n}from"./renderer-BaP2L8CT.js";import{f as o}from"./scroll-1nFw8CNk.js";import"./dom-dlicJTEJ.js";const h=class{constructor(e){t(this,e),this.nanoIntersectionChange=s(this,"nanoIntersectionChange",7),this.nanoIntersecting=s(this,"nanoIntersecting",7),this.nanoNotIntersecting=s(this,"nanoNotIntersecting",7)}io;_root;_threshold;defaultSlot;get observerOptions(){const t={};return this._root&&(t.root=this._root),this.rootMargin&&(t.rootMargin=this.rootMargin),this.threshold&&(t.threshold=this._threshold),t}get elements(){return(this.defaultSlot?.assignedElements()||[]).flatMap((t=>getComputedStyle(t).display.includes("contents")?Array.from(t.children):t))}get host(){return e(this)}root="auto";handleRootChange(){if(this.removeIO(),!this.root)return;let t;"auto"===this.root?t=o(this.host):"root"===this.root?t=void 0:"string"==typeof this.root?(t=this.host.closest(this.root),t||(console.warn(`nano-intersection-observe: root element "${this.root}" not found.`),t=void 0)):t=this.root,t===document.documentElement&&(t=void 0),t===this._root&&this.io||(this._root=t,this.addIO())}rootMargin;threshold;handleThresholdChange(){this._threshold=this.threshold?this.threshold.includes(",")?this.threshold.split(",").map((t=>Number(t))):Number(this.threshold):void 0}nanoIntersectionChange;nanoIntersecting;nanoNotIntersecting;ioCallback=t=>{t.forEach((t=>{this.nanoIntersectionChange.emit(t),t.isIntersecting&&this.nanoIntersecting.emit(t),t.isIntersecting||this.nanoNotIntersecting.emit(t)}))};handleSlotChange=()=>{this.addIO()};addIO(){if(!this.elements?.length)return;this.io&&this.removeIO();const t=this.io=new IntersectionObserver(this.ioCallback,this.observerOptions);this.elements?.forEach((s=>{t.observe(s)}))}removeIO(){this.io&&(this.io.disconnect(),this.io=void 0)}connectedCallback(){this.handleThresholdChange(),this.handleRootChange()}disconnectedCallback(){this.removeIO()}render(){return n(i,{key:"be24c77cb033ff3fdb33b37cd8414edd99785795",class:"nano-intersection-observe"},n("slot",{key:"e1cf1e9175a9249c6f6f5b202d27a3f9bf937bac",ref:t=>this.defaultSlot=t,onSlotchange:this.handleSlotChange}))}static get watchers(){return{root:["handleRootChange"],threshold:["handleThresholdChange"],defaultSlot:["addIO"]}}};h.style="nano-intersection-observe { display: contents }";export{h as nano_intersection_observe}
+import{r as t,c as e,g as s,a as i}from"./index-BM3Om9WE.js";import{h as n}from"./renderer-BaP2L8CT.js";import{f as o}from"./scroll-1nFw8CNk.js";import"./dom-dlicJTEJ.js";const h=class{constructor(s){t(this,s),this.nanoIntersectionChange=e(this,"nanoIntersectionChange",7),this.nanoIntersecting=e(this,"nanoIntersecting",7),this.nanoNotIntersecting=e(this,"nanoNotIntersecting",7)}io;_root;_threshold;defaultSlot;get observerOptions(){const t={};return this._root&&(t.root=this._root),this.rootMargin&&(t.rootMargin=this.rootMargin),this.threshold&&(t.threshold=this._threshold),t}get elements(){return(this.defaultSlot?.assignedElements()||[]).flatMap((t=>getComputedStyle(t).display.includes("contents")?Array.from(t.children):t))}get host(){return s(this)}root="auto";handleRootChange(){if(this.removeIO(),!this.root)return;let t;"auto"===this.root?t=o(this.host):"root"===this.root?t=void 0:"string"==typeof this.root?(t=this.host.closest(this.root),t||(console.warn(`nano-intersection-observe: root element "${this.root}" not found.`),t=void 0)):t=this.root,t===document.documentElement&&(t=void 0),t===this._root&&this.io||(this._root=t,this.addIO())}rootMargin;threshold;handleThresholdChange(){this._threshold=this.threshold?this.threshold.includes(",")?this.threshold.split(",").map((t=>Number(t))):Number(this.threshold):void 0}nanoIntersectionChange;nanoIntersecting;nanoNotIntersecting;ioCallback=t=>{t.forEach((t=>{this.nanoIntersectionChange.emit(t),t.isIntersecting&&this.nanoIntersecting.emit(t),t.isIntersecting||this.nanoNotIntersecting.emit(t)}))};handleSlotChange=()=>{this.addIO()};addIO(){if(!this.elements?.length)return;this.io&&this.removeIO();const t=this.io=new IntersectionObserver(this.ioCallback,this.observerOptions);this.elements?.forEach((e=>{t.observe(e)}))}removeIO(){this.io&&(this.io.disconnect(),this.io=void 0)}connectedCallback(){this.handleThresholdChange(),this.handleRootChange()}disconnectedCallback(){this.removeIO()}render(){return n(i,{key:"aadf019427b2d2c3020fd6e667d5932fd14aea45",class:"nano-intersection-observe"},n("slot",{key:"eae74417c304de7b8e377229b603d88468a5c7f5",ref:t=>this.defaultSlot=t,onSlotchange:this.handleSlotChange}))}static get watchers(){return{root:["handleRootChange"],threshold:["handleThresholdChange"],defaultSlot:["addIO"]}}};h.style="nano-intersection-observe { display: contents }";export{h as nano_intersection_observe}

package/dist/nano-components/nano-masked-overflow.entry.js

@@ -1,4 +1,4 @@
 /*!
  * Custom elements for Nanopore-Digital Web applications
  */
-import{r as t,g as i,a}from"./index-BM3Om9WE.js";import{h as o}from"./renderer-BaP2L8CT.js";import{g as s,a as e}from"./dom-dlicJTEJ.js";import{d as n}from"./throttle-C93FMm2Z.js";import{s as r}from"./scroll-1nFw8CNk.js";const l=class{label;scrollControls=!0;orientation="horizontal";showIndicator=!1;hideScrollbars;watchHideScrollbars(){null==this.hideScrollbars&&(this.hideScrollbars="vertical"!==this.orientation)}activeHandler=t=>t.classList.add("active");inactiveHandler=t=>t.classList.remove("active");isActiveHandler=t=>t.classList.contains("active");watchIsActiveHandler(){this.instantReCalc=!0,this.activeItem=this.allActiveItems.find(((t,i)=>this.isActiveHandler(t,i))),setTimeout((()=>this.instantReCalc=!1),300)}async syncActiveItem(){this.activeItem=this.allActiveItems.find(((t,i)=>this.isActiveHandler(t,i)))}constructor(i){t(this,i),this.recalculatePositions=n(this.recalculatePositions.bind(this),80)}ro;nav;itemContainer;isRtl;endBtn;startBtn;activeIndicator;mutationObservers=new WeakMap;get scrollProp(){return"horizontal"===this.orientation?"scrollWidth":"scrollHeight"}get clientDimensionProp(){return"horizontal"===this.orientation?"clientWidth":"clientHeight"}get scrollOffset(){return"horizontal"===this.orientation?"scrollLeft":"scrollTop"}get host(){return i(this)}instantReCalc=!1;hasScrollControls=!1;watchScrollControls(){this.hasScrollControls?this.handleScroll():this.hideControlStart=this.hideControlEnd=!0}hideControlEnd=!0;hideEndBtn(){this.endBtn&&this.activateBtn(this.endBtn,!this.hideControlEnd)}hideControlStart=!0;hideStartBtn(){this.startBtn&&this.activateBtn(this.startBtn,!this.hideControlStart)}activateBtn(t,i=!0){if(!i)return t.tabIndex=-1,t.disabled=!0,void t.classList.remove("is-shown");t.removeAttribute("tabindex"),t.disabled=!1,t.classList.add("is-shown")}get allActiveItems(){return this.allItems.filter((t=>!t.disabled||t.classList.contains("disabled")))}get allItems(){return s(this.host,"*","slot")}get activeItem(){return this._activeItem}set activeItem(t){t&&t!==this.activeItem&&!t.disabled&&this.allActiveItems.includes(t)&&(this._activeItem=t,this.allActiveItems.forEach(((t,i)=>{t===this._activeItem?this.activeHandler(t,i):this.inactiveHandler(t,i)})),this.recalculatePositions())}_activeItem;get navDim(){if(!this.nav)return 0;const t=getComputedStyle(this.nav);let i=this.nav[this.clientDimensionProp];return"horizontal"===this.orientation?i-(parseFloat(t.paddingLeft)+parseFloat(t.paddingRight)):i-(parseFloat(t.paddingTop)+parseFloat(t.paddingBottom))}scrollToActiveItem(){this.nav&&this.activeItem&&this.hasScrollControls&&r(this.activeItem,this.nav,this.orientation,"center")}syncActiveItemIndicator(){if(!this.activeItem||!this.showIndicator)return;const t=this.activeItem,i=t.clientWidth||0,a=t.clientHeight+2||0,o=e(t,this.itemContainer);if(!this.activeIndicator)return;const s=o.top,n=o.left;switch(this.instantReCalc&&(this.activeIndicator.style.transition="none"),this.orientation){case"horizontal":this.activeIndicator.style.width=`${i}px`,this.activeIndicator.style.height=null,this.activeIndicator.style.transform=`translateX(${n}px)`;break;case"vertical":this.activeIndicator.style.width=null,this.activeIndicator.style.height=`${a}px`,this.activeIndicator.style.transform=`translateY(${s}px)`}setTimeout((()=>this.activeIndicator.style.transition=null),400)}updateScrollControls=()=>{this.nav&&(this.hasScrollControls=this.nav[this.scrollProp]>this.nav[this.clientDimensionProp]&&this.nav[this.scrollProp]>=this.itemContainer[this.clientDimensionProp],this.handleScroll())};handleScroll=()=>{if(!this.hasScrollControls)return void(this.hideControlStart=this.hideControlEnd=!0);const t=this.isRtl?0===this.nav[this.scrollOffset]:Math.abs(this.nav[this.clientDimensionProp]-(this.nav[this.scrollProp]-this.nav[this.scrollOffset]))<2;(this.isRtl?Math.abs(this.nav[this.scrollProp]+this.nav[this.scrollOffset]-this.nav[this.clientDimensionProp])<2:0===this.nav[this.scrollOffset])?(this.hideControlStart=!0,this.hideControlEnd=!1):t?(this.hideControlStart=!1,this.hideControlEnd=!0):(this.hideControlEnd=!1,this.hideControlStart=!1)};handleBtnClick=(t=!1)=>{const i=this.navDim;let a;a=t?this.nav[this.scrollOffset]+i-20:this.nav[this.scrollOffset]-i+20;try{this.nav.scroll({left:"horizontal"===this.orientation?a:0,top:"vertical"===this.orientation?a:0,behavior:"smooth"})}catch(t){this.nav[this.scrollOffset]=a}};slotChangeHandler=()=>{if(this.allActiveItems.length<2)return;const t=this.allActiveItems.find(((t,i)=>this.isActiveHandler(t,i)));t&&(this.activeItem=t),this.recalculatePositions(),this.showIndicator&&this.allActiveItems.forEach((t=>{if(this.mutationObservers.get(t))return;const i=new MutationObserver((()=>this.syncActiveItemIndicator()));i.observe(t,{characterData:!0,childList:!0,subtree:!0}),this.mutationObservers.set(t,i)}))};handleClick=t=>{if(this.allActiveItems.length<2)return;const i=t.composedPath().find((t=>this.allActiveItems.includes(t)));i&&(this.activeItem=i)};handleKeyDown=t=>{if(["Enter"," "].includes(t.key)){const i=t.composedPath().find((t=>this.allActiveItems.includes(t)));i&&(this.activeItem=i)}};recalculatePositions=()=>{this.updateScrollControls(),this.syncActiveItemIndicator(),this.scrollToActiveItem()};connectedCallback(){this.instantReCalc=!0,this.isRtl="horizontal"===this.orientation&&!!this.host.closest('[dir="rtl"]'),window.MutationObserver&&this.slotChangeHandler(),window.ResizeObserver&&(this.ro&&(this.ro.disconnect(),this.ro=void 0),(this.ro=new ResizeObserver(this.recalculatePositions)).observe(this.host))}componentWillLoad(){this.watchHideScrollbars()}componentDidLoad(){this.activeItem=this.allActiveItems.find(((t,i)=>this.isActiveHandler(t,i))),requestAnimationFrame((()=>this.instantReCalc=!1))}disconnectedCallback(){this.ro&&(this.ro.disconnect(),this.ro=void 0)}render(){return o(a,{key:"5e3818d9ff886b75194db22fd7f42af484fe17d7",dir:this.isRtl?"rtl":null,class:"nano-masked-overflow","has-scroll-controls":this.hasScrollControls},o("div",{key:"991fa196ffc2eb42c907519bb8187f15c9868161",part:"base",class:{onav:!0,[`onav--${this.orientation}`]:!0,"onav--has-scroll-controls":this.hasScrollControls,"onav--has-scroll-controls-start":!this.hideControlStart,"onav--has-scroll-controls-end":!this.hideControlEnd,"onav--no-transitions":this.instantReCalc,"onnav--has-indicator":this.showIndicator,"onnav--hide-scrollbars":this.hideScrollbars&&"false"!==this.hideScrollbars},onClick:this.handleClick,onKeyDown:this.handleKeyDown},o("div",{key:"e6958d0060691af605afa2c6fd53194b4284f29d",class:"onav__nav"},this.scrollControls&&o("nano-icon-button",{key:"167bb7fa1450371ceab4dc8467e5debbd672101f",part:"scroll-button scroll-button-prev",class:{"onav__scroll-button":!0,"onav__scroll-button--start":!0},ref:t=>this.startBtn=t,onClick:()=>this.handleBtnClick(!1),label:"Click to scroll",iconName:"horizontal"===this.orientation?"light/chevron-left":"light/chevron-up"}),o("div",{key:"8d8d7c305c0c89738d9660aff6b75ca029506ab7",part:"scroller",ref:t=>this.nav=t,class:"onav__scroller",onScroll:this.handleScroll,tabindex:this.hasScrollControls?0:void 0,role:"region","aria-label":this.label||void 0},o("div",{key:"fdd83d15c431538a2992887e58aed07e9393d411",part:"items",ref:t=>this.itemContainer=t,class:"onav__items"},this.showIndicator&&o("div",{key:"a1fba6d2c2e62e05b5a062c563f22c8e2b0222a4",part:"indicator",ref:t=>this.activeIndicator=t,class:"onav__active-indicator"}),o("slot",{key:"a6d602d437702479bd67d71bd5ac838d0ae02941",onSlotchange:this.slotChangeHandler}))),this.scrollControls&&o("nano-icon-button",{key:"30eae4cf86f7bead75734736b7192420255a64fc",part:"scroll-button scroll-button-next",class:{"onav__scroll-button":!0,"onav__scroll-button--end":!0},ref:t=>this.endBtn=t,onClick:()=>this.handleBtnClick(!0),label:"Click to scroll",iconName:"horizontal"===this.orientation?"light/chevron-right":"light/chevron-down"}))))}static get watchers(){return{hideScrollbars:["watchHideScrollbars"],isActiveHandler:["watchIsActiveHandler"],hasScrollControls:["watchScrollControls"],hideControlEnd:["hideEndBtn"],hideControlStart:["hideStartBtn"]}}};l.style=':host,*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}@media (prefers-reduced-motion: reduce){:host,*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}:host,*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}@media (prefers-reduced-motion: reduce){:host,*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}:host{--indicator-transition:var(--nano-transition-fast);--indicator-color:var(--nano-color-primary-1000);--indicator-size:3px;--indicator-track-color:var(--nano-color-neutral-300);--indicator-track-size:var(--indicator-size);--scroll-btn-color:var(--nano-color-primary-1200);--scroll-btn-size:1rem;--fade-size:100px;position:relative;z-index:var(--nano-z-index-raised)}:host([orientation=horizontal]){display:block}:host([orientation=vertical]){display:flex}.onav--no-transitions *{transition-duration:0s !important}.onav__nav:has(.onav__scroller:focus-visible){outline:var(--nano-focus-ring);outline-offset:var(--nano-focus-ring-offset)}.onav__scroller{scrollbar-width:thin;overflow:auto;display:flex;transition:var(--nano-transition-fast) ease}.onav__scroller:focus{outline:none}.onnav--hide-scrollbars .onav__scroller{scrollbar-width:none;-ms-overflow-style:none}.onnav--hide-scrollbars .onav__scroller::-webkit-scrollbar{inline-size:0;block-size:0}.onav__items{flex:1 1 auto;position:relative;inline-size:auto;flex-wrap:nowrap;display:flex}.onnav--has-indicator .onav__items::before{content:"";background:var(--indicator-track-color);display:block;position:absolute;z-index:1}.onav__active-indicator{position:absolute;z-index:10;transition:var(--indicator-transition) transform ease, var(--indicator-transition) width ease, var(--indicator-transition) height ease}.nano-icon-button.onav__scroll-button{display:flex;align-items:center;justify-content:center;position:absolute;border:unset;z-index:2;transition:var(--nano-transition-fast) ease opacity;opacity:0;color:var(--scroll-btn-color);font-size:var(--scroll-btn-size);pointer-events:none}.nano-icon-button.onav__scroll-button.is-shown{opacity:1;pointer-events:all}.onav--horizontal.onav--has-scroll-controls .onav__scroller{-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-image:linear-gradient(to right, rgba(0, 0, 0, 0) 0, rgba(0, 0, 0, 0) calc(var(--fade-size) * 0.2), rgb(0, 0, 0) var(--fade-size), rgb(0, 0, 0) calc(100% - var(--fade-size)), rgba(0, 0, 0, 0) calc(100% - var(--fade-size) * 0.2), rgba(0, 0, 0, 0) 100%);mask-image:linear-gradient(to right, rgba(0, 0, 0, 0) 0, rgba(0, 0, 0, 0) calc(var(--fade-size) * 0.2), rgb(0, 0, 0) var(--fade-size), rgb(0, 0, 0) calc(100% - var(--fade-size)), rgba(0, 0, 0, 0) calc(100% - var(--fade-size) * 0.2), rgba(0, 0, 0, 0) 100%)}.onav--horizontal.onav--has-scroll-controls-start .onav__scroller{-webkit-mask-position:0 0;mask-position:0 0;-webkit-mask-size:calc(100% + var(--fade-size) * 2);mask-size:calc(100% + var(--fade-size) * 2)}.onav--horizontal.onav--has-scroll-controls-end .onav__scroller{-webkit-mask-position:calc(var(--fade-size) * -2) 0;mask-position:calc(var(--fade-size) * -2) 0;-webkit-mask-size:calc(100% + var(--fade-size) * 2);mask-size:calc(100% + var(--fade-size) * 2)}.onav--horizontal.onav--has-scroll-controls-start.onav--has-scroll-controls-end .onav__scroller{-webkit-mask-position:0 0;mask-position:0 0;-webkit-mask-size:100%;mask-size:100%}.onav--horizontal .onav__items{flex-direction:row}.onav--horizontal .onav__items::before{inline-size:100%;block-size:var(--indicator-track-size);inset-block-end:0}.onav--horizontal .onav__active-indicator{inset-block-end:0;border-block-end:solid var(--indicator-size) var(--indicator-color)}.onav--horizontal .onav__scroll-button{inset-block:0}.onav--horizontal .onav__scroll-button--start{inset-inline-start:0}.onav--horizontal .onav__scroll-button--end{inset-inline-end:0}.onav--vertical{--fade-size:70px;inline-size:100%;display:flex}.onav--vertical .onav__nav{max-block-size:100%;min-inline-size:100%;display:flex}.onav--vertical .onav__scroller{inline-size:100%;flex-direction:column}.onav--vertical.onav--has-scroll-controls .onav__scroller{-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-image:linear-gradient(to bottom, rgba(0, 0, 0, 0) 0, rgba(0, 0, 0, 0) calc(var(--fade-size) * 0.2), rgb(0, 0, 0) var(--fade-size), rgb(0, 0, 0) calc(100% - var(--fade-size)), rgba(0, 0, 0, 0) calc(100% - var(--fade-size) * 0.2), rgba(0, 0, 0, 0) 100%);mask-image:linear-gradient(to bottom, rgba(0, 0, 0, 0) 0, rgba(0, 0, 0, 0) calc(var(--fade-size) * 0.2), rgb(0, 0, 0) var(--fade-size), rgb(0, 0, 0) calc(100% - var(--fade-size)), rgba(0, 0, 0, 0) calc(100% - var(--fade-size) * 0.2), rgba(0, 0, 0, 0) 100%)}.onav--vertical.onav--has-scroll-controls-start .onav__scroller{-webkit-mask-position:0 0;mask-position:0 0;-webkit-mask-size:100% calc(100% + var(--fade-size) * 2);mask-size:100% calc(100% + var(--fade-size) * 2)}.onav--vertical.onav--has-scroll-controls-end .onav__scroller{-webkit-mask-position:0 calc(var(--fade-size) * -2);mask-position:0 calc(var(--fade-size) * -2);-webkit-mask-size:100% calc(100% + var(--fade-size) * 2);mask-size:100% calc(100% + var(--fade-size) * 2)}.onav--vertical.onav--has-scroll-controls-start.onav--has-scroll-controls-end .onav__scroller{-webkit-mask-position:0 0;mask-position:0 0;-webkit-mask-size:100% 100%;mask-size:100% 100%}.onav--vertical .onav__items{flex-direction:column;inline-size:fit-content}.onav--vertical .onav__items::before{block-size:100%;inline-size:var(--indicator-track-size);inset-inline-start:0}.onav--vertical .onav__active-indicator{inset-inline-start:0;border-inline-start:solid var(--indicator-size) var(--indicator-color)}.onav--vertical .onav__scroll-button{inset-inline:0}.onav--vertical .onav__scroll-button--start{inset-block-start:0}.onav--vertical .onav__scroll-button--end{inset-block-end:0}';export{l as nano_masked_overflow}
+import{r as t,g as i,a}from"./index-BM3Om9WE.js";import{h as o}from"./renderer-BaP2L8CT.js";import{g as s,a as e}from"./dom-dlicJTEJ.js";import{d as n}from"./throttle-C93FMm2Z.js";import{s as r}from"./scroll-1nFw8CNk.js";const l=class{label;scrollControls=!0;orientation="horizontal";showIndicator=!1;hideScrollbars;watchHideScrollbars(){null==this.hideScrollbars&&(this.hideScrollbars="vertical"!==this.orientation)}activeHandler=t=>t.classList.add("active");inactiveHandler=t=>t.classList.remove("active");isActiveHandler=t=>t.classList.contains("active");watchIsActiveHandler(){this.instantReCalc=!0,this.activeItem=this.allActiveItems.find(((t,i)=>this.isActiveHandler(t,i))),setTimeout((()=>this.instantReCalc=!1),300)}async syncActiveItem(){this.activeItem=this.allActiveItems.find(((t,i)=>this.isActiveHandler(t,i)))}constructor(i){t(this,i),this.recalculatePositions=n(this.recalculatePositions.bind(this),80)}ro;nav;itemContainer;isRtl;endBtn;startBtn;activeIndicator;mutationObservers=new WeakMap;get scrollProp(){return"horizontal"===this.orientation?"scrollWidth":"scrollHeight"}get clientDimensionProp(){return"horizontal"===this.orientation?"clientWidth":"clientHeight"}get scrollOffset(){return"horizontal"===this.orientation?"scrollLeft":"scrollTop"}get host(){return i(this)}instantReCalc=!1;hasScrollControls=!1;watchScrollControls(){this.hasScrollControls?this.handleScroll():this.hideControlStart=this.hideControlEnd=!0}hideControlEnd=!0;hideEndBtn(){this.endBtn&&this.activateBtn(this.endBtn,!this.hideControlEnd)}hideControlStart=!0;hideStartBtn(){this.startBtn&&this.activateBtn(this.startBtn,!this.hideControlStart)}activateBtn(t,i=!0){if(!i)return t.tabIndex=-1,t.disabled=!0,void t.classList.remove("is-shown");t.removeAttribute("tabindex"),t.disabled=!1,t.classList.add("is-shown")}get allActiveItems(){return this.allItems.filter((t=>!t.disabled||t.classList.contains("disabled")))}get allItems(){return s(this.host,"*","slot")}get activeItem(){return this._activeItem}set activeItem(t){t&&t!==this.activeItem&&!t.disabled&&this.allActiveItems.includes(t)&&(this._activeItem=t,this.allActiveItems.forEach(((t,i)=>{t===this._activeItem?this.activeHandler(t,i):this.inactiveHandler(t,i)})),this.recalculatePositions())}_activeItem;get navDim(){if(!this.nav)return 0;const t=getComputedStyle(this.nav);let i=this.nav[this.clientDimensionProp];return"horizontal"===this.orientation?i-(parseFloat(t.paddingLeft)+parseFloat(t.paddingRight)):i-(parseFloat(t.paddingTop)+parseFloat(t.paddingBottom))}scrollToActiveItem(){this.nav&&this.activeItem&&this.hasScrollControls&&r(this.activeItem,this.nav,this.orientation,"center")}syncActiveItemIndicator(){if(!this.activeItem||!this.showIndicator)return;const t=this.activeItem,i=t.clientWidth||0,a=t.clientHeight+2||0,o=e(t,this.itemContainer);if(!this.activeIndicator)return;const s=o.top,n=o.left;switch(this.instantReCalc&&(this.activeIndicator.style.transition="none"),this.orientation){case"horizontal":this.activeIndicator.style.width=`${i}px`,this.activeIndicator.style.height=null,this.activeIndicator.style.transform=`translateX(${n}px)`;break;case"vertical":this.activeIndicator.style.width=null,this.activeIndicator.style.height=`${a}px`,this.activeIndicator.style.transform=`translateY(${s}px)`}setTimeout((()=>this.activeIndicator.style.transition=null),400)}updateScrollControls=()=>{this.nav&&(this.hasScrollControls=this.nav[this.scrollProp]>this.nav[this.clientDimensionProp]&&this.nav[this.scrollProp]>=this.itemContainer[this.clientDimensionProp],this.handleScroll())};handleScroll=()=>{if(!this.hasScrollControls)return void(this.hideControlStart=this.hideControlEnd=!0);const t=this.isRtl?0===this.nav[this.scrollOffset]:Math.abs(this.nav[this.clientDimensionProp]-(this.nav[this.scrollProp]-this.nav[this.scrollOffset]))<2;(this.isRtl?Math.abs(this.nav[this.scrollProp]+this.nav[this.scrollOffset]-this.nav[this.clientDimensionProp])<2:0===this.nav[this.scrollOffset])?(this.hideControlStart=!0,this.hideControlEnd=!1):t?(this.hideControlStart=!1,this.hideControlEnd=!0):(this.hideControlEnd=!1,this.hideControlStart=!1)};handleBtnClick=(t=!1)=>{const i=this.navDim;let a;a=t?this.nav[this.scrollOffset]+i-20:this.nav[this.scrollOffset]-i+20;try{this.nav.scroll({left:"horizontal"===this.orientation?a:0,top:"vertical"===this.orientation?a:0,behavior:"smooth"})}catch(t){this.nav[this.scrollOffset]=a}};slotChangeHandler=()=>{if(this.allActiveItems.length<2)return;const t=this.allActiveItems.find(((t,i)=>this.isActiveHandler(t,i)));t&&(this.activeItem=t),this.recalculatePositions(),this.showIndicator&&this.allActiveItems.forEach((t=>{if(this.mutationObservers.get(t))return;const i=new MutationObserver((()=>this.syncActiveItemIndicator()));i.observe(t,{characterData:!0,childList:!0,subtree:!0}),this.mutationObservers.set(t,i)}))};handleClick=t=>{if(this.allActiveItems.length<2)return;const i=t.composedPath().find((t=>this.allActiveItems.includes(t)));i&&(this.activeItem=i)};handleKeyDown=t=>{if(["Enter"," "].includes(t.key)){const i=t.composedPath().find((t=>this.allActiveItems.includes(t)));i&&(this.activeItem=i)}};recalculatePositions=()=>{this.updateScrollControls(),this.syncActiveItemIndicator(),this.scrollToActiveItem()};connectedCallback(){this.instantReCalc=!0,this.isRtl="horizontal"===this.orientation&&!!this.host.closest('[dir="rtl"]'),window.MutationObserver&&this.slotChangeHandler(),window.ResizeObserver&&(this.ro&&(this.ro.disconnect(),this.ro=void 0),(this.ro=new ResizeObserver(this.recalculatePositions)).observe(this.host))}componentWillLoad(){this.watchHideScrollbars()}componentDidLoad(){this.activeItem=this.allActiveItems.find(((t,i)=>this.isActiveHandler(t,i))),requestAnimationFrame((()=>this.instantReCalc=!1))}disconnectedCallback(){this.ro&&(this.ro.disconnect(),this.ro=void 0)}render(){return o(a,{key:"49485c7d6a96e8dd122f862abd2bd2f95b2343e7",dir:this.isRtl?"rtl":null,class:"nano-masked-overflow","has-scroll-controls":this.hasScrollControls},o("div",{key:"acd0541992b9dda0c1ab6414e67cd8a71f429918",part:"base",class:{onav:!0,[`onav--${this.orientation}`]:!0,"onav--has-scroll-controls":this.hasScrollControls,"onav--has-scroll-controls-start":!this.hideControlStart,"onav--has-scroll-controls-end":!this.hideControlEnd,"onav--no-transitions":this.instantReCalc,"onnav--has-indicator":this.showIndicator,"onnav--hide-scrollbars":this.hideScrollbars&&"false"!==this.hideScrollbars},onClick:this.handleClick,onKeyDown:this.handleKeyDown},o("div",{key:"ba25b3551a2b6be4906d538cbaabf0ba8cb859f6",class:"onav__nav"},this.scrollControls&&o("nano-icon-button",{key:"72ca6ae1ef0300fc91a95d347702bac94fec97ac",part:"scroll-button scroll-button-prev",class:{"onav__scroll-button":!0,"onav__scroll-button--start":!0},ref:t=>this.startBtn=t,onClick:()=>this.handleBtnClick(!1),label:"Click to scroll",iconName:"horizontal"===this.orientation?"light/chevron-left":"light/chevron-up"}),o("div",{key:"34893f5e055e8b44a78cb0706e974ee45261bdb8",part:"scroller",ref:t=>this.nav=t,class:"onav__scroller",onScroll:this.handleScroll,tabindex:this.hasScrollControls?0:void 0,role:"region","aria-label":this.label||void 0},o("div",{key:"19ea27abc4878c5ab034e8ac0ee7085f19607a92",part:"items",ref:t=>this.itemContainer=t,class:"onav__items"},this.showIndicator&&o("div",{key:"6cfdb83598367d649e6705fe709e89d8a8b505a6",part:"indicator",ref:t=>this.activeIndicator=t,class:"onav__active-indicator"}),o("slot",{key:"43f3164d6c962f951ac672f79d48943c44e0514e",onSlotchange:this.slotChangeHandler}))),this.scrollControls&&o("nano-icon-button",{key:"eaa09e8faa9343fca660d1f2e0a4b5366b7c6668",part:"scroll-button scroll-button-next",class:{"onav__scroll-button":!0,"onav__scroll-button--end":!0},ref:t=>this.endBtn=t,onClick:()=>this.handleBtnClick(!0),label:"Click to scroll",iconName:"horizontal"===this.orientation?"light/chevron-right":"light/chevron-down"}))))}static get watchers(){return{hideScrollbars:["watchHideScrollbars"],isActiveHandler:["watchIsActiveHandler"],hasScrollControls:["watchScrollControls"],hideControlEnd:["hideEndBtn"],hideControlStart:["hideStartBtn"]}}};l.style=':host,*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}@media (prefers-reduced-motion: reduce){:host,*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}:host,*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}@media (prefers-reduced-motion: reduce){:host,*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}:host{--indicator-transition:var(--nano-transition-fast);--indicator-color:var(--nano-color-primary-1000);--indicator-size:3px;--indicator-track-color:var(--nano-color-neutral-300);--indicator-track-size:var(--indicator-size);--scroll-btn-color:var(--nano-color-primary-1200);--scroll-btn-size:1rem;--fade-size:100px;position:relative;z-index:var(--nano-z-index-raised)}:host([orientation=horizontal]){display:block}:host([orientation=vertical]){display:flex}.onav--no-transitions *{transition-duration:0s !important}.onav__nav:has(.onav__scroller:focus-visible){outline:var(--nano-focus-ring);outline-offset:var(--nano-focus-ring-offset)}.onav__scroller{scrollbar-width:thin;overflow:auto;display:flex;transition:var(--nano-transition-fast) ease}.onav__scroller:focus{outline:none}.onnav--hide-scrollbars .onav__scroller{scrollbar-width:none;-ms-overflow-style:none}.onnav--hide-scrollbars .onav__scroller::-webkit-scrollbar{inline-size:0;block-size:0}.onav__items{flex:1 1 auto;position:relative;inline-size:auto;flex-wrap:nowrap;display:flex}.onnav--has-indicator .onav__items::before{content:"";background:var(--indicator-track-color);display:block;position:absolute;z-index:1}.onav__active-indicator{position:absolute;z-index:10;transition:var(--indicator-transition) transform ease, var(--indicator-transition) width ease, var(--indicator-transition) height ease}.nano-icon-button.onav__scroll-button{display:flex;align-items:center;justify-content:center;position:absolute;border:unset;z-index:2;transition:var(--nano-transition-fast) ease opacity;opacity:0;color:var(--scroll-btn-color);font-size:var(--scroll-btn-size);pointer-events:none}.nano-icon-button.onav__scroll-button.is-shown{opacity:1;pointer-events:all}.onav--horizontal.onav--has-scroll-controls .onav__scroller{-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-image:linear-gradient(to right, rgba(0, 0, 0, 0) 0, rgba(0, 0, 0, 0) calc(var(--fade-size) * 0.2), rgb(0, 0, 0) var(--fade-size), rgb(0, 0, 0) calc(100% - var(--fade-size)), rgba(0, 0, 0, 0) calc(100% - var(--fade-size) * 0.2), rgba(0, 0, 0, 0) 100%);mask-image:linear-gradient(to right, rgba(0, 0, 0, 0) 0, rgba(0, 0, 0, 0) calc(var(--fade-size) * 0.2), rgb(0, 0, 0) var(--fade-size), rgb(0, 0, 0) calc(100% - var(--fade-size)), rgba(0, 0, 0, 0) calc(100% - var(--fade-size) * 0.2), rgba(0, 0, 0, 0) 100%)}.onav--horizontal.onav--has-scroll-controls-start .onav__scroller{-webkit-mask-position:0 0;mask-position:0 0;-webkit-mask-size:calc(100% + var(--fade-size) * 2);mask-size:calc(100% + var(--fade-size) * 2)}.onav--horizontal.onav--has-scroll-controls-end .onav__scroller{-webkit-mask-position:calc(var(--fade-size) * -2) 0;mask-position:calc(var(--fade-size) * -2) 0;-webkit-mask-size:calc(100% + var(--fade-size) * 2);mask-size:calc(100% + var(--fade-size) * 2)}.onav--horizontal.onav--has-scroll-controls-start.onav--has-scroll-controls-end .onav__scroller{-webkit-mask-position:0 0;mask-position:0 0;-webkit-mask-size:100%;mask-size:100%}.onav--horizontal .onav__items{flex-direction:row}.onav--horizontal .onav__items::before{inline-size:100%;block-size:var(--indicator-track-size);inset-block-end:0}.onav--horizontal .onav__active-indicator{inset-block-end:0;border-block-end:solid var(--indicator-size) var(--indicator-color)}.onav--horizontal .onav__scroll-button{inset-block:0}.onav--horizontal .onav__scroll-button--start{inset-inline-start:0}.onav--horizontal .onav__scroll-button--end{inset-inline-end:0}.onav--vertical{--fade-size:70px;inline-size:100%;display:flex}.onav--vertical .onav__nav{max-block-size:100%;min-inline-size:100%;display:flex}.onav--vertical .onav__scroller{inline-size:100%;flex-direction:column}.onav--vertical.onav--has-scroll-controls .onav__scroller{-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-image:linear-gradient(to bottom, rgba(0, 0, 0, 0) 0, rgba(0, 0, 0, 0) calc(var(--fade-size) * 0.2), rgb(0, 0, 0) var(--fade-size), rgb(0, 0, 0) calc(100% - var(--fade-size)), rgba(0, 0, 0, 0) calc(100% - var(--fade-size) * 0.2), rgba(0, 0, 0, 0) 100%);mask-image:linear-gradient(to bottom, rgba(0, 0, 0, 0) 0, rgba(0, 0, 0, 0) calc(var(--fade-size) * 0.2), rgb(0, 0, 0) var(--fade-size), rgb(0, 0, 0) calc(100% - var(--fade-size)), rgba(0, 0, 0, 0) calc(100% - var(--fade-size) * 0.2), rgba(0, 0, 0, 0) 100%)}.onav--vertical.onav--has-scroll-controls-start .onav__scroller{-webkit-mask-position:0 0;mask-position:0 0;-webkit-mask-size:100% calc(100% + var(--fade-size) * 2);mask-size:100% calc(100% + var(--fade-size) * 2)}.onav--vertical.onav--has-scroll-controls-end .onav__scroller{-webkit-mask-position:0 calc(var(--fade-size) * -2);mask-position:0 calc(var(--fade-size) * -2);-webkit-mask-size:100% calc(100% + var(--fade-size) * 2);mask-size:100% calc(100% + var(--fade-size) * 2)}.onav--vertical.onav--has-scroll-controls-start.onav--has-scroll-controls-end .onav__scroller{-webkit-mask-position:0 0;mask-position:0 0;-webkit-mask-size:100% 100%;mask-size:100% 100%}.onav--vertical .onav__items{flex-direction:column;inline-size:fit-content}.onav--vertical .onav__items::before{block-size:100%;inline-size:var(--indicator-track-size);inset-inline-start:0}.onav--vertical .onav__active-indicator{inset-inline-start:0;border-inline-start:solid var(--indicator-size) var(--indicator-color)}.onav--vertical .onav__scroll-button{inset-inline:0}.onav--vertical .onav__scroll-button--start{inset-block-start:0}.onav--vertical .onav__scroll-button--end{inset-block-end:0}';export{l as nano_masked_overflow}

package/dist/nano-components/nano-menu-drawer.entry.js

@@ -1,4 +1,4 @@
 /*!
  * Custom elements for Nanopore-Digital Web applications
  */
-import{r as o,g as n,d as e,a as t}from"./index-BM3Om9WE.js";import{c as a}from"./dom-dlicJTEJ.js";import{t as i,h as s}from"./renderer-BaP2L8CT.js";import{H as r}from"./slot-CFTP7C_Z.js";const l=class{constructor(n){o(this,n)}containerDiv;contentDiv;globalNav;children=[];ro;slotCtrl=new r(this,"foot");get el(){return n(this)}reset=!1;isLoading=!0;hide=!1;secondaryOpen=!1;open=!0;hideWidth=576;cancelNavItemEvents(o){o.detail.secondaryMenu&&(o.stopPropagation(),this.secondaryOpen="nanoOpen"===o.type)}openChange(){if(localStorage.setItem("nanoMenuDrawerOpen",this.open.toString()),this.containerDiv){const o=document.documentElement.clientWidth,n=Math.abs(window.innerWidth-o);if(this.open){const o=this.contentDiv.scrollWidth;e((()=>{this.containerDiv.style.width=o+"px",this.containerDiv.style.setProperty("--menu-width",o+"px"),this.containerDiv.style.setProperty("--scrollbar-width",n+"px")}))}else e((()=>{this.containerDiv.style.width=null,this.containerDiv.style.removeProperty("--menu-width"),this.containerDiv.style.setProperty("--scrollbar-width",n+"px")}))}}moveItemsToGlobalNav(){const o=this.el.querySelectorAll(i("nano-nav-item"));this.hide=!0,this.globalNav.triggerResize(),o.forEach((o=>{this.children.push({slot:o.getAttribute("slot"),element:o}),o.setAttribute("slot","menu"),o.classList.add("nano-global-nav-menu"),this.globalNav.appendChild(o)}))}moveItemsToDrawer(){this.children&&this.children.length&&(this.children.forEach((o=>{o.element.removeAttribute("slot"),o.element.classList.remove("nano-global-nav-menu"),o.slot&&o.slot.length&&o.element.setAttribute("slot",o.slot),this.el.appendChild(o.element)})),this.children=[],this.hide=!1)}onResize=()=>{if(!this.globalNav)return;const{width:o}=this.globalNav.getBoundingClientRect();o>this.hideWidth?this.moveItemsToDrawer():this.moveItemsToGlobalNav()};toggle=o=>{o.preventDefault(),this.open=!this.open};attachRO(){this.ro||(this.ro=new ResizeObserver((()=>{this.onResize()})),this.ro.observe(this.globalNav))}componentWillLoad(){this.globalNav=a(i("nano-global-nav"),this.el),this.globalNav||console.warn("nano-menu-drawer: no nano-global-nav found in the document. nano-global-nav is required to use nano-menu-drawer.");{const o=localStorage.getItem("nanoMenuDrawerOpen");this.open=o?"true"===o:this.open,this.globalNav.componentOnReady().then((()=>{this.openChange()}))}}connectedCallback(){this.onResize()}componentDidLoad(){this.attachRO()}disconnectedCallback(){this.ro?.disconnect(),this.ro=void 0}render(){return s(t,{key:"39da1804ff710702cacbbadf0d8bb1d47c2d732b",class:{open:this.open,"secondary-open":this.secondaryOpen,hide:this.hide,loading:this.isLoading,"has-global-nav":!!this.globalNav,"nano-menu-drawer":!0},dir:"rtl"===this.el.ownerDocument.dir?"rtl":null},s("div",{key:"90b0e1a831d49af7d81fe5ca2da977a697c08ee7",ref:o=>this.containerDiv=o,class:"container"},s("div",{key:"37d6443befe1a93169e15a8becbefe974c8a8d1c",class:"content-wrap "+(this.secondaryOpen?"secondary-open":"")},s("nav",{key:"7373abf5ec1ef567407abedc4b786ae3d51c9e93",ref:o=>this.contentDiv=o,class:"content"},s("div",{key:"6f243a3de7b59072d43fac86c1d9c8acd62ec9d4",class:"head"},s("button",{key:"6bf443330190314bf84583fc540cd2cb821f4f53",onClick:this.toggle,class:"collapse-btn"},s("nano-icon",{key:"87025c0165c2e61bd51724ef15e8e1b110ded3e4",name:"light/arrow-right-to-line"}),s("span",{key:"6bfd0162936fc4ce0546194a227960ce9dd718a1",class:"visually-hidden"},"collapse / expand menu"))),s("slot",{key:"07039af321133321dedceaaff462472bd22b4f12"}),this.slotCtrl.has("foot")&&s("div",{key:"252fe22caae99dc7ba850207a92f9390665bf3c0",class:"foot"},s("slot",{key:"f142bd0852c6fa01fcc3fba2de5528d1d96d03b7",name:"foot"}))))))}static get watchers(){return{open:["openChange"]}}};l.style=':host,*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}@media (prefers-reduced-motion: reduce){:host,*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}:host,*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}@media (prefers-reduced-motion: reduce){:host,*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}:host{--padding-top:13px;--padding-end:13px;--padding-bottom:13px;--padding-start:13px;--icon-size:19px;--font-size:var(--nano-font-size-xs);--bg-color:var(--nano-color-surface-50);--bg-color-hover:var(--nano-color-neutral-75);--bg-color-selected:var(--nano-color-neutral-300);--bg-color-open:var(--nano-color-neutral-300);--content-color:var(--nano-color-neutral-1400);--divider-color:var(--nano-color-neutral-300);--global-nav-height:76px;--menu-width:calc((var(--padding-end) + var(--padding-start)) + var(--icon-size));color-scheme:dark;display:block;z-index:1;background:var(--bg-color);color:var(--content-color);min-block-size:100%}:host(.hide){display:none}.head{border-block-end:var(--divider-color) 1px solid}.container{inset-inline-end:auto;color:var(--content-color);inline-size:var(--menu-width);transition:inline-size 0.3s ease;inset-block-start:var(--global-nav-height);position:sticky;display:flex;flex-direction:column;block-size:100%;max-block-size:calc(100vh - var(--global-nav-height))}:host(.open) .container{inline-size:auto}.content-wrap{inset-inline-start:0;inset-block-start:0;inline-size:inherit;background:var(--bg-color);font-size:var(--font-size);line-height:1;display:flex;flex-direction:column;align-items:stretch;flex:1;box-shadow:var(--nano-shadow-ls)}.content-wrap.secondary-open{box-shadow:none}.content-wrap::after{content:"";position:absolute;inset:calc(var(--global-nav-height) * -1) 0 0;background-color:var(--bg-color);z-index:-1}.content{inline-size:auto;display:flex;flex-direction:column;overflow:hidden visible;flex:1}.collapse-btn{all:unset;padding-block:6px;margin-block-start:5px;padding-inline:var(--padding-start) var(--padding-end);inline-size:100%;display:flex;justify-items:flex-start;appearance:none;cursor:pointer;font-size:var(--icon-size)}.collapse-btn:focus-visible{outline:var(--nano-focus-ring);outline-offset:var(--nano-focus-ring-offset)}.collapse-btn:hover{background-color:var(--bg-color-hover)}.collapse-btn:active{background-color:var(--bg-color-selected)}.collapse-btn .nano-icon{transition:var(--nano-transition-x-fast) rotate ease-in-out;rotate:0deg}:host(.open) .collapse-btn .nano-icon{rotate:180deg}.visually-hidden{clip-path:inset(50%);block-size:1px;overflow:hidden;position:absolute;white-space:nowrap;inline-size:1px}.foot{margin-block:auto var(--padding-bottom)}';export{l as nano_menu_drawer}
+import{r as o,g as n,d as e,a as t}from"./index-BM3Om9WE.js";import{c as a}from"./dom-dlicJTEJ.js";import{t as i,h as s}from"./renderer-BaP2L8CT.js";import{H as r}from"./slot-CFTP7C_Z.js";const l=class{constructor(n){o(this,n)}containerDiv;contentDiv;globalNav;children=[];ro;slotCtrl=new r(this,"foot");get el(){return n(this)}reset=!1;isLoading=!0;hide=!1;secondaryOpen=!1;open=!0;hideWidth=576;cancelNavItemEvents(o){o.detail.secondaryMenu&&(o.stopPropagation(),this.secondaryOpen="nanoOpen"===o.type)}openChange(){if(localStorage.setItem("nanoMenuDrawerOpen",this.open.toString()),this.containerDiv){const o=document.documentElement.clientWidth,n=Math.abs(window.innerWidth-o);if(this.open){const o=this.contentDiv.scrollWidth;e((()=>{this.containerDiv.style.width=o+"px",this.containerDiv.style.setProperty("--menu-width",o+"px"),this.containerDiv.style.setProperty("--scrollbar-width",n+"px")}))}else e((()=>{this.containerDiv.style.width=null,this.containerDiv.style.removeProperty("--menu-width"),this.containerDiv.style.setProperty("--scrollbar-width",n+"px")}))}}moveItemsToGlobalNav(){const o=this.el.querySelectorAll(i("nano-nav-item"));this.hide=!0,this.globalNav.triggerResize(),o.forEach((o=>{this.children.push({slot:o.getAttribute("slot"),element:o}),o.setAttribute("slot","menu"),o.classList.add("nano-global-nav-menu"),this.globalNav.appendChild(o)}))}moveItemsToDrawer(){this.children&&this.children.length&&(this.children.forEach((o=>{o.element.removeAttribute("slot"),o.element.classList.remove("nano-global-nav-menu"),o.slot&&o.slot.length&&o.element.setAttribute("slot",o.slot),this.el.appendChild(o.element)})),this.children=[],this.hide=!1)}onResize=()=>{if(!this.globalNav)return;const{width:o}=this.globalNav.getBoundingClientRect();o>this.hideWidth?this.moveItemsToDrawer():this.moveItemsToGlobalNav()};toggle=o=>{o.preventDefault(),this.open=!this.open};attachRO(){this.ro||(this.ro=new ResizeObserver((()=>{this.onResize()})),this.ro.observe(this.globalNav))}componentWillLoad(){this.globalNav=a(i("nano-global-nav"),this.el),this.globalNav||console.warn("nano-menu-drawer: no nano-global-nav found in the document. nano-global-nav is required to use nano-menu-drawer.");{const o=localStorage.getItem("nanoMenuDrawerOpen");this.open=o?"true"===o:this.open,this.globalNav.componentOnReady().then((()=>{this.openChange()}))}}connectedCallback(){this.onResize()}componentDidLoad(){this.attachRO()}disconnectedCallback(){this.ro?.disconnect(),this.ro=void 0}render(){return s(t,{key:"4ad542c84da0045168bcee1df744cb94c2a1196e",class:{open:this.open,"secondary-open":this.secondaryOpen,hide:this.hide,loading:this.isLoading,"has-global-nav":!!this.globalNav,"nano-menu-drawer":!0},dir:"rtl"===this.el.ownerDocument.dir?"rtl":null},s("div",{key:"b00cad9c3696b9c373e8d98fcd1f86c2c7b23aa2",ref:o=>this.containerDiv=o,class:"container"},s("div",{key:"a7746088c4458802d386f1c3d092e0a386fe4bd6",class:"content-wrap "+(this.secondaryOpen?"secondary-open":"")},s("nav",{key:"993f550de47fc9410aa04bf98d9d076a6290637c",ref:o=>this.contentDiv=o,class:"content"},s("div",{key:"3da3d0268df95d3080938e33f6e80d659dce1525",class:"head"},s("button",{key:"af104da5e67aaf06194317086daa6a5d4c008b6a",onClick:this.toggle,class:"collapse-btn"},s("nano-icon",{key:"b6e85eb6690440da7ccd893ccd9feb082d7a4552",name:"light/arrow-right-to-line"}),s("span",{key:"443c2afa504892d6de2a75a126e09c484540c677",class:"visually-hidden"},"collapse / expand menu"))),s("slot",{key:"275ab007d04f3bde8269f0b4927aec81d1e47ccd"}),this.slotCtrl.has("foot")&&s("div",{key:"c0eb043b9447264d48ca65d6e51c986c05ba10eb",class:"foot"},s("slot",{key:"bee82590231f9cfffc15c22ba0fafb313298e232",name:"foot"}))))))}static get watchers(){return{open:["openChange"]}}};l.style=':host,*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}@media (prefers-reduced-motion: reduce){:host,*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}:host,*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}@media (prefers-reduced-motion: reduce){:host,*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}:host{--padding-top:13px;--padding-end:13px;--padding-bottom:13px;--padding-start:13px;--icon-size:19px;--font-size:var(--nano-font-size-xs);--bg-color:var(--nano-color-surface-50);--bg-color-hover:var(--nano-color-neutral-75);--bg-color-selected:var(--nano-color-neutral-300);--bg-color-open:var(--nano-color-neutral-300);--content-color:var(--nano-color-neutral-1400);--divider-color:var(--nano-color-neutral-300);--global-nav-height:76px;--menu-width:calc((var(--padding-end) + var(--padding-start)) + var(--icon-size));color-scheme:dark;display:block;z-index:1;background:var(--bg-color);color:var(--content-color);min-block-size:100%}:host(.hide){display:none}.head{border-block-end:var(--divider-color) 1px solid}.container{inset-inline-end:auto;color:var(--content-color);inline-size:var(--menu-width);transition:inline-size 0.3s ease;inset-block-start:var(--global-nav-height);position:sticky;display:flex;flex-direction:column;block-size:100%;max-block-size:calc(100vh - var(--global-nav-height))}:host(.open) .container{inline-size:auto}.content-wrap{inset-inline-start:0;inset-block-start:0;inline-size:inherit;background:var(--bg-color);font-size:var(--font-size);line-height:1;display:flex;flex-direction:column;align-items:stretch;flex:1;box-shadow:var(--nano-shadow-ls)}.content-wrap.secondary-open{box-shadow:none}.content-wrap::after{content:"";position:absolute;inset:calc(var(--global-nav-height) * -1) 0 0;background-color:var(--bg-color);z-index:-1}.content{inline-size:auto;display:flex;flex-direction:column;overflow:hidden visible;flex:1}.collapse-btn{all:unset;padding-block:6px;margin-block-start:5px;padding-inline:var(--padding-start) var(--padding-end);inline-size:100%;display:flex;justify-items:flex-start;appearance:none;cursor:pointer;font-size:var(--icon-size)}.collapse-btn:focus-visible{outline:var(--nano-focus-ring);outline-offset:var(--nano-focus-ring-offset)}.collapse-btn:hover{background-color:var(--bg-color-hover)}.collapse-btn:active{background-color:var(--bg-color-selected)}.collapse-btn .nano-icon{transition:var(--nano-transition-x-fast) rotate ease-in-out;rotate:0deg}:host(.open) .collapse-btn .nano-icon{rotate:180deg}.visually-hidden{clip-path:inset(50%);block-size:1px;overflow:hidden;position:absolute;white-space:nowrap;inline-size:1px}.foot{margin-block:auto var(--padding-bottom)}';export{l as nano_menu_drawer}

package/dist/nano-components/nano-more-less.entry.js

@@ -1,4 +1,4 @@
 /*!
  * Custom elements for Nanopore-Digital Web applications
  */
-import{r as t,g as e,a as s}from"./index-BM3Om9WE.js";import{h as n}from"./renderer-BaP2L8CT.js";const o=class{constructor(e){t(this,e)}get host(){return e(this)}show=!1;childrenSelector;maxToShow=3;noHideBtn=!1;get children(){let t;return t=this.childrenSelector?this.host.querySelectorAll(this.childrenSelector):this.host.children,Array.from(t).filter((t=>!t.hasAttribute("slot")))}handleShowHideElements(){this.children.forEach(((t,e)=>{this.show?"none"===t.style.display&&(t.style.display=""):t.style.display=e>=this.maxToShow?"none":""}))}handleClick(t){this.show=!this.show}connectedCallback(){this.handleShowHideElements()}render(){return n(s,{key:"fbb60961810fe863ebebc729cbe4ecb955608c82",class:"nano-more-less"},n("slot",{key:"6823f661e722640622d421c96244cd4a0eee1953",onSlotchange:()=>this.handleShowHideElements()}),this.children?.length>this.maxToShow&&[n("div",{key:"134fadd869470a34cbd21b06d9cc2c85fc4e614c",style:{display:this.show?"none":"contents"},class:"button-wrapper",part:"button-wrapper button-wrapper--less",onClick:t=>this.handleClick(t)},n("slot",{key:"62544d207ac12171da4905e3006e26113b1b0189",name:"less"},n("button",{key:"54badba3d736faf5b2b686ec989998a4319c5001",part:"button button--less"},"Show more (+",this.children.length-this.maxToShow,")"))),this.noHideBtn?"":n("div",{style:{display:this.show?"contents":"none"},class:"button-wrapper",part:"button-wrapper button-wrapper--more",onClick:t=>this.handleClick(t)},n("slot",{name:"more"},n("button",{part:"button button--more"},"Show less (-",this.children.length-this.maxToShow,")")))])}static get watchers(){return{maxToShow:["handleShowHideElements"],show:["handleShowHideElements"],childrenSelector:["handleShowHideElements"]}}};o.style=":host { display: contents; }";export{o as nano_more_less}
+import{r as e,g as t,a as s}from"./index-BM3Om9WE.js";import{h as n}from"./renderer-BaP2L8CT.js";const o=class{constructor(t){e(this,t)}get host(){return t(this)}show=!1;childrenSelector;maxToShow=3;noHideBtn=!1;get children(){let e;return e=this.childrenSelector?this.host.querySelectorAll(this.childrenSelector):this.host.children,Array.from(e).filter((e=>!e.hasAttribute("slot")))}handleShowHideElements(){this.children.forEach(((e,t)=>{this.show?"none"===e.style.display&&(e.style.display=""):e.style.display=t>=this.maxToShow?"none":""}))}handleClick(e){this.show=!this.show}connectedCallback(){this.handleShowHideElements()}render(){return n(s,{key:"cdfbe00c8ce785ad89f711c8488b514dba8f3fb6",class:"nano-more-less"},n("slot",{key:"8c17f3540c587129feff6905e518e01f4866b90d",onSlotchange:()=>this.handleShowHideElements()}),this.children?.length>this.maxToShow&&[n("div",{key:"fd937a181108336345a5278b4e2e230feb13f891",style:{display:this.show?"none":"contents"},class:"button-wrapper",part:"button-wrapper button-wrapper--less",onClick:e=>this.handleClick(e)},n("slot",{key:"bd7c0630e06de922c8ed48e5efc0db640594c776",name:"less"},n("button",{key:"8c924f74b1b7939d17a9defd02ccb41ecd403257",part:"button button--less"},"Show more (+",this.children.length-this.maxToShow,")"))),this.noHideBtn?"":n("div",{style:{display:this.show?"contents":"none"},class:"button-wrapper",part:"button-wrapper button-wrapper--more",onClick:e=>this.handleClick(e)},n("slot",{name:"more"},n("button",{part:"button button--more"},"Show less (-",this.children.length-this.maxToShow,")")))])}static get watchers(){return{maxToShow:["handleShowHideElements"],show:["handleShowHideElements"],childrenSelector:["handleShowHideElements"]}}};o.style=":host { display: contents; }";export{o as nano_more_less}