@nanoporetech-digital/components 8.0.0-alpha.0 → 8.0.0-alpha.2

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

@@ -1,4 +1,4 @@
 /*!
  * Custom elements for Nanopore-Digital Web applications
  */
-import{r as t,a,d as e}from"./index-CFYZ-ZOT.js";import{h as o}from"./renderer-LJzCFyMt.js";import{H as r}from"./slot-DBzVpliZ.js";const n=class{constructor(a){t(this,a)}breakpoint=767;stickyHeaders=!0;get el(){return a(this)}isMobile=window.innerWidth<=this.breakpoint;stickyClass="sticky";stuckClass="stuck";stickyObserver;slotCtrl=new r(this,"[default]","mobile","back","accessory");componentDidLoad(){this.updateNavForBreakpoint(),window.addEventListener("resize",this.updateNavForBreakpoint)}updateNavForBreakpoint=()=>{this.isMobile=window.innerWidth<=this.breakpoint,this.isMobile?this.slotCtrl.has("mobile")||this.transformToMobile():this.transformToDesktop(),this.isMobile&&this.stickyHeaders&&this.initStickiness()};initStickiness(){let t=0;const a=this.isMobile&&this.slotCtrl.has("mobile")?this.el.shadowRoot?.querySelectorAll(".details-wrapper"):this.el.querySelectorAll(".details-wrapper");a?.length&&(a.forEach((t=>{t.classList.add(this.stickyClass)})),this.stickyObserver=new IntersectionObserver((a=>{const e=window.pageYOffset||document.documentElement.scrollTop;a.forEach((a=>{const o=a.target;a.intersectionRatio<1?e>t?(o.classList.add(this.stuckClass),o.classList.remove("hidden")):o.classList.add("hidden"):(o.classList.remove(this.stuckClass),o.classList.remove("hidden"))})),t=e<=0?0:e}),{threshold:[1],root:this.el.closest("nav"),rootMargin:"0px 0px 0px 0px"}),a.forEach((t=>{this.stickyObserver.observe(t)})))}disconnectedCallback(){this.stickyObserver&&this.stickyObserver.disconnect(),this.updateNavForBreakpoint&&window.removeEventListener("resize",this.updateNavForBreakpoint)}transformToMobile(){const t=this.el.shadowRoot?.querySelector("slot:not([name])");(t?.assignedElements({flatten:!0})?.filter((t=>"UL"===t.tagName))||[]).forEach((t=>{if(!(t instanceof HTMLUListElement))return;t.querySelectorAll(":scope > li").forEach((t=>{const a=t.querySelector(":scope > a"),e=t.querySelector(":scope > ul");if(a&&e&&!t.querySelector(":scope > nano-details")){const o=this.createDetails(a.textContent?.trim()||"",e,a.attributes);a.remove(),t.prepend(o)}}));const a=t.parentElement;if(!a)return;a.removeChild(t);const e=this.createDetails("Menu",t);e.classList.add("details-wrapper"),e.appendChild(t),a.appendChild(e)}))}createDetails(t,a,e){const o=document.createElement("nano-details");return o.setAttribute("label",t),e&&Array.from(e).forEach((t=>{o.setAttribute(`data-link-${t.name}`,t.value)})),o.appendChild(a),o}transformToDesktop(){const t=this.el.shadowRoot?.querySelector("slot:not([name])");(t?.assignedElements({flatten:!0})?.filter((t=>"nano-details"===t.tagName.toLowerCase()))||[]).forEach((t=>{if(!(t instanceof HTMLElement))return;t.querySelector("ul").querySelectorAll(":scope > li").forEach((t=>{const a=t.querySelector("nano-details");if(!a)return;const e=a.querySelector("ul"),o=a?.getAttribute("label"),r=a?.getAttribute("data-href")||"#";if(e&&o){const n=document.createElement("a");n.textContent=o,n.href=r,Array.from(a.attributes).forEach((t=>{t.name.startsWith("data-link-")&&n.setAttribute(t.name.replace("data-link-",""),t.value)})),t.prepend(n),t.appendChild(e),a.remove()}}));const a=t.parentElement;if(!a)return;a.removeChild(t);const e=t.querySelector("ul");e&&(a.appendChild(e),t.remove())}))}render(){return o(e,{key:"92552373d8a09fb223e32246547a8d134cb09da2",class:"nano-in-page-nav"},o("nav",{key:"6fa0d66432e09b4a3e744f2d9e6c90d2d589f1b2",part:"root"},(this.slotCtrl.has("back")||this.slotCtrl.has("accessory"))&&o("div",{key:"1c596d58e78b17a8ba5e408a5156a6be59cf1765",class:"header"},o("slot",{key:"9d6b924c2a24e85681564744a3667eb23692ae07",name:"back"}),o("slot",{key:"c3f9a3a6f2879054df7b50074872a3341d02f0f5",name:"accessory"})),this.slotCtrl.has("mobile")&&this.isMobile?o("nano-details",{label:"Menu",class:this.stickyHeaders?`details-wrapper ${this.stickyClass}`:"details-wrapper"},o("slot",{name:"mobile"})):o("slot",null)))}};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 nav{background-color:var(--color-bg);padding:0}:host nav:has(nano-details){padding:0}:host .details-wrapper{--padding:0;--btn-bg-color:transparent;--btn-bg-color--hover:transparent;--btn-text-color:var(--color-text);border:none}:host .details-wrapper::part(header),:host .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)}:host .details-wrapper[open]::part(header),:host .details-wrapper[open] [part~="header"]{background-color:var(--nano-color-primary-75)}:host .details-wrapper::part(content),:host .details-wrapper [part~="content"]{padding:0}:host .details-wrapper::part(body),:host .details-wrapper [part~="body"]{padding:0}:host .header{padding:var(--spacing-l2) var(--spacing-l2) 0;display:flex;flex-direction:column;gap:var(--spacing-l2);font-size:var(--font-size)}:host .header ::slotted(a[slot=back]),:host .header::slotted(a[slot=back]){display:flex !important;align-items:center !important;padding:0 !important;margin:0;gap:var(--spacing-l3) !important;cursor:pointer}:host .header ::slotted(a[slot=back])::before,:host .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))}:host nav:has(.details-wrapper[open]){box-shadow:var(--nano-shadow-l1)}:host .details-wrapper.sticky.stuck[open]::part(header),:host .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)}';export{n as nano_in_page_nav}
+import{r as t,a,d as e}from"./index-DXvE-U_j.js";import{h as o}from"./renderer-BUaAsDso.js";import{H as n}from"./slot-DYFgWo5f.js";const i=class{constructor(a){t(this,a)}breakpoint=767;stickyHeaders=!0;get el(){return a(this)}isMobile=window.innerWidth<=this.breakpoint;stickyClass="sticky";stuckClass="stuck";stickyObserver;slotCtrl=new n(this,"[default]","mobile","back","accessory");componentDidLoad(){this.updateNavForBreakpoint(),window.addEventListener("resize",this.updateNavForBreakpoint)}updateNavForBreakpoint=()=>{this.isMobile=window.innerWidth<=this.breakpoint,this.isMobile?this.slotCtrl.has("mobile")||this.transformToMobile():this.transformToDesktop(),this.isMobile&&this.stickyHeaders&&this.initStickiness()};initStickiness(){let t=0;const a=this.isMobile&&this.slotCtrl.has("mobile")?this.el.shadowRoot?.querySelectorAll(".details-wrapper"):this.el.querySelectorAll(".details-wrapper");a?.length&&(a.forEach((t=>{t.classList.add(this.stickyClass)})),this.stickyObserver=new IntersectionObserver((a=>{const e=window.pageYOffset||document.documentElement.scrollTop;a.forEach((a=>{const o=a.target;a.intersectionRatio<1?e>t?(o.classList.add(this.stuckClass),o.classList.remove("hidden")):o.classList.add("hidden"):(o.classList.remove(this.stuckClass),o.classList.remove("hidden"))})),t=e<=0?0:e}),{threshold:[1],root:this.el.closest("nav"),rootMargin:"0px 0px 0px 0px"}),a.forEach((t=>{this.stickyObserver.observe(t)})))}disconnectedCallback(){this.stickyObserver&&this.stickyObserver.disconnect(),this.updateNavForBreakpoint&&window.removeEventListener("resize",this.updateNavForBreakpoint)}transformToMobile(){const t=this.el.shadowRoot?.querySelector("slot:not([name])");(t?.assignedElements({flatten:!0})?.filter((t=>"UL"===t.tagName))||[]).forEach((t=>{if(!(t instanceof HTMLUListElement))return;t.querySelectorAll(":scope > li").forEach((t=>{const a=t.querySelector(":scope > a"),e=t.querySelector(":scope > ul");if(a&&e&&!t.querySelector(":scope > nano-details")){const o=this.createDetails(a.textContent?.trim()||"",e,a.attributes);a.remove(),t.prepend(o)}}));const a=t.parentElement;if(!a)return;a.removeChild(t);const e=this.createDetails("Menu",t);e.classList.add("details-wrapper"),e.appendChild(t),a.appendChild(e)}))}createDetails(t,a,e){const o=document.createElement("nano-details");return o.setAttribute("label",t),e&&Array.from(e).forEach((t=>{o.setAttribute(`data-link-${t.name}`,t.value)})),o.appendChild(a),o}transformToDesktop(){const t=this.el.shadowRoot?.querySelector("slot:not([name])");(t?.assignedElements({flatten:!0})?.filter((t=>"nano-details"===t.tagName.toLowerCase()))||[]).forEach((t=>{if(!(t instanceof HTMLElement))return;t.querySelector("ul").querySelectorAll(":scope > li").forEach((t=>{const a=t.querySelector("nano-details");if(!a)return;const e=a.querySelector("ul"),o=a?.getAttribute("label"),n=a?.getAttribute("data-href")||"#";if(e&&o){const i=document.createElement("a");i.textContent=o,i.href=n,Array.from(a.attributes).forEach((t=>{t.name.startsWith("data-link-")&&i.setAttribute(t.name.replace("data-link-",""),t.value)})),t.prepend(i),t.appendChild(e),a.remove()}}));const a=t.parentElement;if(!a)return;a.removeChild(t);const e=t.querySelector("ul");e&&(a.appendChild(e),t.remove())}))}render(){return o(e,{key:"92552373d8a09fb223e32246547a8d134cb09da2",class:"nano-in-page-nav"},o("nav",{key:"6fa0d66432e09b4a3e744f2d9e6c90d2d589f1b2",part:"root"},(this.slotCtrl.has("back")||this.slotCtrl.has("accessory"))&&o("div",{key:"1c596d58e78b17a8ba5e408a5156a6be59cf1765",class:"header"},o("slot",{key:"9d6b924c2a24e85681564744a3667eb23692ae07",name:"back"}),o("slot",{key:"c3f9a3a6f2879054df7b50074872a3341d02f0f5",name:"accessory"})),this.slotCtrl.has("mobile")&&this.isMobile?o("nano-details",{label:"Menu",class:this.stickyHeaders?`details-wrapper ${this.stickyClass}`:"details-wrapper"},o("slot",{name:"mobile"})):o("slot",null)))}};i.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 nav{background-color:var(--color-bg);padding:0}:host nav:has(nano-details){padding:0}:host .details-wrapper{--padding:0;--btn-bg-color:transparent;--btn-bg-color--hover:transparent;--btn-text-color:var(--color-text);border:none}:host .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)}:host .details-wrapper[open]::part(header){background-color:var(--nano-color-primary-75)}:host .details-wrapper::part(content){padding:0}:host .details-wrapper::part(body){padding:0}:host .header{padding:var(--spacing-l2) var(--spacing-l2) 0;display:flex;flex-direction:column;gap:var(--spacing-l2);font-size:var(--font-size)}:host .header ::slotted(a[slot=back]),:host .header::slotted(a[slot=back]){display:flex !important;align-items:center !important;padding:0 !important;margin:0;gap:var(--spacing-l3) !important;cursor:pointer}:host .header ::slotted(a[slot=back])::before,:host .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))}:host nav:has(.details-wrapper[open]){box-shadow:var(--nano-shadow-l1)}:host .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)}';export{i as nano_in_page_nav}

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,a as e,d as i}from"./index-CFYZ-ZOT.js";import{h as o}from"./renderer-LJzCFyMt.js";import{f as n}from"./scroll-BRRzrkAi.js";import"./dom-CF0Ycs9M.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.root)return this._root=void 0,void this.removeIO();let t;"auto"===this.root?t=n(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._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(!window.IntersectionObserver||!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(),this.root=this._root=void 0}render(){return o(i,{key:"4bd6cf4cc8888421ec7879e22fc24886838bd091",class:"nano-intersection-observe"},o("slot",{key:"afc52867f75d9f3679470f016c49eb9c4af6f6db",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 s,a as e,d as o}from"./index-DXvE-U_j.js";import{h as i}from"./renderer-BUaAsDso.js";import{f as n}from"./scroll-iCYjzh9N.js";import"./dom-Cb7FUtXp.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=n(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 i(o,{key:"abd4c2df3455d52b6c9df1fcec2ba6f715cca32d",class:"nano-intersection-observe"},i("slot",{key:"e91b2a33b11abfa42411b996a0ba2e71892ab5d1",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,a as i,d as a}from"./index-CFYZ-ZOT.js";import{h as o}from"./renderer-LJzCFyMt.js";import{g as s,a as n}from"./dom-CF0Ycs9M.js";import{d as e}from"./throttle-C93FMm2Z.js";import{s as r}from"./scroll-BRRzrkAi.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=e(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=n(t,this.itemContainer);if(!this.activeIndicator)return;const s=o.top,e=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(${e}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:"95eee57fdc7f8527fbbe4b6d9fbf6f48d5764ac8",dir:this.isRtl?"rtl":null,class:"nano-masked-overflow","has-scroll-controls":this.hasScrollControls},o("div",{key:"fb8fb3b5946a4ce7b8b144df89541012c44d9aff",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},onClick:this.handleClick,onKeyDown:this.handleKeyDown},o("div",{key:"23da0af8abf895a7bb2b158965f9ef955e798e0c",class:"onav__nav"},this.scrollControls&&o("nano-icon-button",{key:"28573455243fe42c090dbcdb569d376a7f9d5eb3",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:"b1c4626550336c2723ef68df1f4b5a3034c383d5",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:"c751fd48b83e957c156448841939df286dff0c37",part:"items",ref:t=>this.itemContainer=t,class:"onav__items"},this.showIndicator&&o("div",{key:"059962178e1c122d95ebbcfb8b98114b0507d3df",part:"indicator",ref:t=>this.activeIndicator=t,class:"onav__active-indicator"}),o("slot",{key:"6cc5fe32c97aa75700feea39cd6d77d18c968c80",onSlotchange:this.slotChangeHandler}))),this.scrollControls&&o("nano-icon-button",{key:"fe8b6ee6f86a8d96a2ed8a79f2ebd292a6432e95",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}.onnav--has-indicator .onav--horizontal .onav__items::before{content:"";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%;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}.onnav--has-indicator .onav--vertical .onav__items::before{content:"";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,a as i,d as a}from"./index-DXvE-U_j.js";import{h as o}from"./renderer-BUaAsDso.js";import{g as s,a as e}from"./dom-Cb7FUtXp.js";import{d as n}from"./throttle-C93FMm2Z.js";import{s as r}from"./scroll-iCYjzh9N.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:"4f88bf0a4cd8f01c745685afe7b0c5f9fc9b26b2",dir:this.isRtl?"rtl":null,class:"nano-masked-overflow","has-scroll-controls":this.hasScrollControls},o("div",{key:"b7894467af4981a53bb0540998f9fdee3b5e4db7",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:"c12e39f98ea4750a0709c822f1827fd3a4580ca5",class:"onav__nav"},this.scrollControls&&o("nano-icon-button",{key:"9f45887d61630f41398e872bb7d3538f87fcc7c0",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:"1b6402869156bb7d6f3ddaf5b6b9e1ba80e94104",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:"1018eef93e68d13faf4c7898a69f6723e772ec3c",part:"items",ref:t=>this.itemContainer=t,class:"onav__items"},this.showIndicator&&o("div",{key:"ab21bd04d6bb661f716d835ee4bc0d111fed863f",part:"indicator",ref:t=>this.activeIndicator=t,class:"onav__active-indicator"}),o("slot",{key:"bb66cabd059551b392e5049eb8d18f83de8eb818",onSlotchange:this.slotChangeHandler}))),this.scrollControls&&o("nano-icon-button",{key:"bd48cb7171ee606a9c368a36090cefb3e61337bd",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 t,a as e,e as i,d as n}from"./index-CFYZ-ZOT.js";import{c as o}from"./dom-CF0Ycs9M.js";import{t as a,h as s}from"./renderer-LJzCFyMt.js";const r=class{constructor(e){t(this,e)}containerDiv;contentDiv;measureEle;globalNav;children=[];io;currHeight=window.innerHeight;get el(){return e(this)}reset=!1;widthOk=!0;heightOk=!0;isLoading=!0;hide=!1;open=!0;saveState=!0;hideWidth=576;hideHeight=!0;cancelNavItemEvents(t){t.detail.secondaryMenu&&t.stopPropagation()}openChange(){this.saveState&&localStorage.setItem("nanoMenuDrawerOpen",this.open.toString()),this.containerDiv&&i(this.open?()=>this.containerDiv.style.width=this.contentDiv.scrollWidth+"px":()=>this.containerDiv.style.width=null)}widthChange(){this.widthOk?this.moveItemsToDrawer():this.moveItemsToGlobalNav()}hideHeightChange(){this.hideHeight&&!this.io?this.attachIO():!this.hideHeight&&this.io&&(this.io.disconnect(),this.io=void 0)}moveItemsToGlobalNav(){this.el.querySelectorAll(a("nano-nav-item")).forEach((t=>{this.children.push({slot:t.getAttribute("slot"),element:t}),t.setAttribute("slot","overflow"),t.classList.add("nano-global-nav-menu"),this.globalNav.appendChild(t)})),this.hide=!0}moveItemsToDrawer(){this.children&&this.children.length&&(this.children.forEach((t=>{t.element.removeAttribute("slot"),t.element.classList.remove("nano-global-nav-menu"),t.slot&&t.slot.length&&t.element.setAttribute("slot",t.slot),this.el.appendChild(t.element)})),this.children=[],this.hide=!1,this.io||this.attachIO())}onWindowResize=()=>{this.widthOk=window.innerWidth>this.hideWidth;const t=.01*window.innerHeight;this.el.style.setProperty("--vh",`${t}px`),window.innerHeight>this.currHeight&&this.widthOk&&!this.heightOk&&this.moveItemsToDrawer(),this.currHeight=window.innerHeight};toggle=t=>{t.preventDefault(),this.open=!this.open};onToggleKeyDown=t=>{switch(t.key){case"Enter":case" ":this.open=!this.open}};attachIO(){this.hideHeight&&(this.io=new window.IntersectionObserver((t=>{this.heightOk=0!==t[0].intersectionRatio,this.heightOk||(this.moveItemsToGlobalNav(),this.io.disconnect(),this.io=void 0)}),{threshold:1})).observe(this.measureEle)}handleGlobalNavReady(t){t.target.tagName.toLowerCase()===a("nano-global-nav")&&setTimeout((()=>{this.attachIO(),this.openChange(),this.onWindowResize(),this.isLoading=!1}),500)}componentWillLoad(){if(this.globalNav=o(a("nano-global-nav"),this.el),this.widthOk=window.innerWidth>this.hideWidth,this.currHeight=window.innerHeight,this.saveState){const t=localStorage.getItem("nanoMenuDrawerOpen");this.open=t?"true"===t:this.open}}componentDidLoad(){window.addEventListener("resize",this.onWindowResize)}disconnectedCallback(){window.removeEventListener("resize",this.onWindowResize),this.io&&(this.io.disconnect(),this.io=null)}render(){return s(n,{key:"ce58d5db4ed3a23557189fbc3eb2cf0a0ad32edd",class:{open:this.open,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:"a68d7698be7747a6a191a44364b615c3866f8160",ref:t=>this.containerDiv=t,class:"container"},s("div",{key:"f6c92461b79e0b3e44f138736ef65089680101a8",class:"content-wrap"},s("nav",{key:"51ce192b7cbb38233baced954f4228e756052026",ref:t=>this.contentDiv=t,class:"content"},s("button",{key:"5662329d6320ef44d837afc823c09beb1563c0fe",onMouseDown:this.toggle,onKeyDown:this.onToggleKeyDown,class:"collapse-btn"},s("nano-icon",{key:"77d0e152d06593f3999072a1b557673a8ddc8a72",name:"light/right-to-line","aria-label":"collapse / expand"})),s("slot",{key:"8369d8882e41547e088ec41401cc2273efb2b59a"}),s("div",{key:"90c996a4d1debfd4965353e5e60548605418dfbd",class:"foot"},s("div",{key:"3ca7e34bde41f742d20edbef571400c875179858",class:"measure-ele",ref:t=>this.measureEle=t}),s("slot",{key:"1b5d32415c0e727788186bd9011de394cb7b5759",name:"foot"}))))))}static get watchers(){return{open:["openChange"],widthOk:["widthChange"],hideHeight:["hideHeightChange"]}}};r.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:12px;--padding-bottom:13px;--padding-start:12px;--icon-size:19px;--font-size:11px;--global-nav-height:79px;--bg-color:#001a21;--bg-color-hover:rgb(28 62 72 / 80%);--bg-color-selected:#274048;--bg-color-focus:rgb(28 62 72 / 80%);--focus-outline:none;--content-color:#fff;--secondary-bg-color:rgb(28 62 72);font-family:inherit;font-size:inherit;font-stretch:inherit;font-style:inherit;font-weight:inherit;letter-spacing:inherit;text-decoration:inherit;text-overflow:inherit;text-transform:inherit;text-align:inherit;white-space:inherit;color:inherit;display:block;z-index:1;background:var(--bg-color)}:host ::slotted(.nano-nav-item){--secondary-padding-top:var(--global-nav-height);--nano-icon-size:var(--icon-size);color:var(--content-color);font-size:var(--font-size);text-decoration:none;box-sizing:border-box}:host *,:host *::before,:host *::after{box-sizing:border-box}:host(.hide){display:none}:host(.has-global-nav) .content-wrap{padding-block-start:var(--global-nav-height);margin-block-start:calc(var(--global-nav-height) * -1)}.container{inset-inline-end:auto;flex:0 0 calc(var(--padding-end, 1em) * 2 + var(--icon-size));background:var(--bg-color);color:var(--content-color);z-index:1;inline-size:calc(var(--padding-end, 1em) * 2 + var(--icon-size));block-size:100%}:host(.open) .container{inline-size:auto}:host(:not(.loading)) .container{transition:inline-size 0.3s ease}.content-wrap{inset-inline-start:0;inset-block-start:0;inline-size:inherit;max-inline-size:inherit;background:var(--bg-color);color:#fff;position:sticky;font-size:var(--icon-size);line-height:1;display:flex;min-block-size:calc(100vh - 79px);min-block-size:calc(var(--vh, 1vh) * 100 - 79px);z-index:1}.content{inline-size:auto;display:flex;flex-direction:column;overflow:hidden;background:var(--bg-color);flex:1}.content::after{content:"";position:absolute;inset-block-start:0;inset-inline:0;background:var(--bg-color);z-index:-1;block-size:100vh}.collapse-btn{background:var(--bg-color-selected);border:none;color:inherit;font-size:var(--icon-size);margin-block:var(--padding-top) var(--padding-bottom);margin-inline:calc(var(--padding-start) / 2) 0;border-radius:4px;padding-block:6px;padding-inline:5px;display:flex;align-content:center;inline-size:30px;flex:0 0 auto}.collapse-btn .nano-icon{font-size:var(--icon-size);transition:0.2s transform ease-in-out;transform:translateZ(0) rotate(0deg)}:host(.open) .collapse-btn .nano-icon{transform:translateZ(0) rotate(180deg)}.foot{margin-block-start:auto}.measure-ele{block-size:1px}';export{r as nano_menu_drawer}
+import{r as t,a as e,e as i,d as n}from"./index-DXvE-U_j.js";import{c as o}from"./dom-Cb7FUtXp.js";import{t as a,h as s}from"./renderer-BUaAsDso.js";const r=class{constructor(e){t(this,e)}containerDiv;contentDiv;measureEle;globalNav;children=[];io;currHeight=window.innerHeight;get el(){return e(this)}reset=!1;widthOk=!0;heightOk=!0;isLoading=!0;hide=!1;open=!0;saveState=!0;hideWidth=576;hideHeight=!0;cancelNavItemEvents(t){t.detail.secondaryMenu&&t.stopPropagation()}openChange(){this.saveState&&localStorage.setItem("nanoMenuDrawerOpen",this.open.toString()),this.containerDiv&&i(this.open?()=>this.containerDiv.style.width=this.contentDiv.scrollWidth+"px":()=>this.containerDiv.style.width=null)}widthChange(){this.widthOk?this.moveItemsToDrawer():this.moveItemsToGlobalNav()}hideHeightChange(){this.hideHeight&&!this.io?this.attachIO():!this.hideHeight&&this.io&&(this.io.disconnect(),this.io=void 0)}moveItemsToGlobalNav(){this.el.querySelectorAll(a("nano-nav-item")).forEach((t=>{this.children.push({slot:t.getAttribute("slot"),element:t}),t.setAttribute("slot","overflow"),t.classList.add("nano-global-nav-menu"),this.globalNav.appendChild(t)})),this.hide=!0}moveItemsToDrawer(){this.children&&this.children.length&&(this.children.forEach((t=>{t.element.removeAttribute("slot"),t.element.classList.remove("nano-global-nav-menu"),t.slot&&t.slot.length&&t.element.setAttribute("slot",t.slot),this.el.appendChild(t.element)})),this.children=[],this.hide=!1,this.io||this.attachIO())}onWindowResize=()=>{this.widthOk=window.innerWidth>this.hideWidth;const t=.01*window.innerHeight;this.el.style.setProperty("--vh",`${t}px`),window.innerHeight>this.currHeight&&this.widthOk&&!this.heightOk&&this.moveItemsToDrawer(),this.currHeight=window.innerHeight};toggle=t=>{t.preventDefault(),this.open=!this.open};onToggleKeyDown=t=>{switch(t.key){case"Enter":case" ":this.open=!this.open}};attachIO(){this.hideHeight&&(this.io=new window.IntersectionObserver((t=>{this.heightOk=0!==t[0].intersectionRatio,this.heightOk||(this.moveItemsToGlobalNav(),this.io.disconnect(),this.io=void 0)}),{threshold:1})).observe(this.measureEle)}handleGlobalNavReady(t){t.target.tagName.toLowerCase()===a("nano-global-nav")&&setTimeout((()=>{this.attachIO(),this.openChange(),this.onWindowResize(),this.isLoading=!1}),500)}componentWillLoad(){if(this.globalNav=o(a("nano-global-nav"),this.el),this.widthOk=window.innerWidth>this.hideWidth,this.currHeight=window.innerHeight,this.saveState){const t=localStorage.getItem("nanoMenuDrawerOpen");this.open=t?"true"===t:this.open}}componentDidLoad(){window.addEventListener("resize",this.onWindowResize)}disconnectedCallback(){window.removeEventListener("resize",this.onWindowResize),this.io&&(this.io.disconnect(),this.io=null)}render(){return s(n,{key:"ce58d5db4ed3a23557189fbc3eb2cf0a0ad32edd",class:{open:this.open,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:"a68d7698be7747a6a191a44364b615c3866f8160",ref:t=>this.containerDiv=t,class:"container"},s("div",{key:"f6c92461b79e0b3e44f138736ef65089680101a8",class:"content-wrap"},s("nav",{key:"51ce192b7cbb38233baced954f4228e756052026",ref:t=>this.contentDiv=t,class:"content"},s("button",{key:"5662329d6320ef44d837afc823c09beb1563c0fe",onMouseDown:this.toggle,onKeyDown:this.onToggleKeyDown,class:"collapse-btn"},s("nano-icon",{key:"77d0e152d06593f3999072a1b557673a8ddc8a72",name:"light/right-to-line","aria-label":"collapse / expand"})),s("slot",{key:"8369d8882e41547e088ec41401cc2273efb2b59a"}),s("div",{key:"90c996a4d1debfd4965353e5e60548605418dfbd",class:"foot"},s("div",{key:"3ca7e34bde41f742d20edbef571400c875179858",class:"measure-ele",ref:t=>this.measureEle=t}),s("slot",{key:"1b5d32415c0e727788186bd9011de394cb7b5759",name:"foot"}))))))}static get watchers(){return{open:["openChange"],widthOk:["widthChange"],hideHeight:["hideHeightChange"]}}};r.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:12px;--padding-bottom:13px;--padding-start:12px;--icon-size:19px;--font-size:11px;--global-nav-height:79px;--bg-color:#001a21;--bg-color-hover:rgb(28 62 72 / 80%);--bg-color-selected:#274048;--bg-color-focus:rgb(28 62 72 / 80%);--focus-outline:none;--content-color:#fff;--secondary-bg-color:rgb(28 62 72);font-family:inherit;font-size:inherit;font-stretch:inherit;font-style:inherit;font-weight:inherit;letter-spacing:inherit;text-decoration:inherit;text-overflow:inherit;text-transform:inherit;text-align:inherit;white-space:inherit;color:inherit;display:block;z-index:1;background:var(--bg-color)}:host ::slotted(.nano-nav-item){--secondary-padding-top:var(--global-nav-height);--nano-icon-size:var(--icon-size);color:var(--content-color);font-size:var(--font-size);text-decoration:none;box-sizing:border-box}:host *,:host *::before,:host *::after{box-sizing:border-box}:host(.hide){display:none}:host(.has-global-nav) .content-wrap{padding-block-start:var(--global-nav-height);margin-block-start:calc(var(--global-nav-height) * -1)}.container{inset-inline-end:auto;flex:0 0 calc(var(--padding-end, 1em) * 2 + var(--icon-size));background:var(--bg-color);color:var(--content-color);z-index:1;inline-size:calc(var(--padding-end, 1em) * 2 + var(--icon-size));block-size:100%}:host(.open) .container{inline-size:auto}:host(:not(.loading)) .container{transition:inline-size 0.3s ease}.content-wrap{inset-inline-start:0;inset-block-start:0;inline-size:inherit;max-inline-size:inherit;background:var(--bg-color);color:#fff;position:sticky;font-size:var(--icon-size);line-height:1;display:flex;min-block-size:calc(100vh - 79px);min-block-size:calc(var(--vh, 1vh) * 100 - 79px);z-index:1}.content{inline-size:auto;display:flex;flex-direction:column;overflow:hidden;background:var(--bg-color);flex:1}.content::after{content:"";position:absolute;inset-block-start:0;inset-inline:0;background:var(--bg-color);z-index:-1;block-size:100vh}.collapse-btn{background:var(--bg-color-selected);border:none;color:inherit;font-size:var(--icon-size);margin-block:var(--padding-top) var(--padding-bottom);margin-inline:calc(var(--padding-start) / 2) 0;border-radius:4px;padding-block:6px;padding-inline:5px;display:flex;align-content:center;inline-size:30px;flex:0 0 auto}.collapse-btn .nano-icon{font-size:var(--icon-size);transition:0.2s transform ease-in-out;transform:translateZ(0) rotate(0deg)}:host(.open) .collapse-btn .nano-icon{transform:translateZ(0) rotate(180deg)}.foot{margin-block-start:auto}.measure-ele{block-size:1px}';export{r 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,a as e,d as s}from"./index-CFYZ-ZOT.js";import{h as n}from"./renderer-LJzCFyMt.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:"7f46f40188321a9cd630f92e0722c386f8f150cd",class:"nano-more-less"},n("slot",{key:"f0cb809863400df4431e6781c1f119563fea95b6",onSlotchange:()=>this.handleShowHideElements()}),this.children?.length>this.maxToShow&&[n("div",{key:"fccb42c61cbef50e41ca19ec572bceb4cb3257be",style:{display:this.show?"none":"contents"},class:"button-wrapper",part:"button-wrapper button-wrapper--less",onClick:t=>this.handleClick(t)},n("slot",{key:"ec04633371ae61f4a33131ab8bfe98a7e408150f",name:"less"},n("button",{key:"f7382a01305934711d7f6471369aa29523f99d9d",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 t,a as e,d as s}from"./index-DXvE-U_j.js";import{h as o}from"./renderer-BUaAsDso.js";const n=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 o(s,{key:"49834d5d379bcc71bfd228cbad3becf4343160ac",class:"nano-more-less"},o("slot",{key:"4cbea5f74ddd512cacfc2c65c35ce0cd9fbfee00",onSlotchange:()=>this.handleShowHideElements()}),this.children?.length>this.maxToShow&&[o("div",{key:"d8b9b8135f3789705f18793dd8262bcebb38f2cb",style:{display:this.show?"none":"contents"},class:"button-wrapper",part:"button-wrapper button-wrapper--less",onClick:t=>this.handleClick(t)},o("slot",{key:"564f67099d59d520fbf9a5c40f6f14e681346eff",name:"less"},o("button",{key:"a5aa9c0a0eda6b6dda1c72288b18668d4028eec5",part:"button button--less"},"Show more (+",this.children.length-this.maxToShow,")"))),this.noHideBtn?"":o("div",{style:{display:this.show?"contents":"none"},class:"button-wrapper",part:"button-wrapper button-wrapper--more",onClick:t=>this.handleClick(t)},o("slot",{name:"more"},o("button",{part:"button button--more"},"Show less (-",this.children.length-this.maxToShow,")")))])}static get watchers(){return{maxToShow:["handleShowHideElements"],show:["handleShowHideElements"],childrenSelector:["handleShowHideElements"]}}};n.style=":host { display: contents; }";export{n as nano_more_less}

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

@@ -1,4 +1,4 @@
 /*!
  * Custom elements for Nanopore-Digital Web applications
  */
-import{r as n,c as t,a as e,d as a}from"./index-CFYZ-ZOT.js";import{g as i}from"./dom-CF0Ycs9M.js";import{g as o}from"./tabbable-BpHwrUYt.js";import{t as s,h as r}from"./renderer-LJzCFyMt.js";import{H as d}from"./slot-DBzVpliZ.js";import{f as c}from"./active-element-C1pBwzyj.js";const l=(n,t)=>{const e={className:"",show:!0,showDisplay:"block",showProp:"classList",timeout:1e3,...t};return new Promise((t=>{const a=i=>{i.target!==n&&!i.composedPath().some((n=>n===i.target))||e.transitionProp&&!e.transitionProp.includes(i.propertyName)||(n.dataset.displayTransition="true",n.removeEventListener("transitionend",a),t("shown"))},i=a=>{a.target!==n&&!a.composedPath().some((n=>n===a.target))||e.transitionProp&&!e.transitionProp.includes(a.propertyName)||(n.style.display="none",n.dataset.displayTransition="false",n.removeEventListener("transitionend",i),t("hidden"))};e.show?(n.addEventListener("transitionend",a),n.style.display=e.showDisplay,setTimeout((()=>n[e.showProp].add(e.className)),50)):(n.addEventListener("transitionend",i),n[e.showProp].remove(e.className)),e.timeout&&setTimeout((()=>{e.show&&"true"!==n.dataset.displayTransition?(n.dataset.displayTransition="true",n.removeEventListener("transitionend",a),t("shown")):e.show||"false"===n.dataset.displayTransition||(n.style.display="none",n.dataset.displayTransition="false",n.removeEventListener("transitionend",i),t("hidden"))}),e.timeout)}))},h=class{constructor(e){n(this,e),this.nanoClose=t(this,"nanoClose",7),this.nanoOpen=t(this,"nanoOpen",7),this.nanoOpening=t(this,"nanoOpening",7),this.nanoClosing=t(this,"nanoClosing",7)}secondaryDiv;slotCtrl=new d(this,"secondary","close-button");controlElement;get host(){return e(this)}didOpen=!1;isInMenuDrawer=!1;href=null;target="_self";disabled=!1;open=!1;selected=!1;checkbox=!1;closeOnBlur=!0;notification=!1;nanoClose;nanoOpen;nanoOpening;nanoClosing;async setFocus(){this.controlElement&&this.controlElement.focus()}openChange(){this.slotCtrl.has("secondary")&&(this.open?this.openSecondary():this.closeSecondary())}didOpenChange(){if(!this.slotCtrl.has("secondary"))return;if(!this.didOpen)return c(this.host,this.controlElement)&&this.controlElement.focus({preventScroll:!0}),void this.nanoClose.emit({secondaryMenu:this.secondaryDiv});const n=new window.IntersectionObserver((t=>{t[0].boundingClientRect.top<0&&this.secondaryDiv.scrollIntoView({behavior:"smooth"}),n.disconnect()}),{threshold:1});n.observe(this.secondaryDiv),this.secondaryDiv.focus({preventScroll:!0});const t=o(this.secondaryDiv,!0);t[0]&&t[0].focus({preventScroll:!0}),this.nanoOpen.emit({secondaryMenu:this.secondaryDiv})}handleClose(n){this.didOpen&&this.slotCtrl.has("secondary")&&this.closeOnBlur&&(n.key&&"Escape"===n.key?this.closeSecondary():n.composedPath().some((n=>n===this.secondaryDiv))||this.closeSecondary())}closeSecondary=async()=>{this.slotCtrl.has("secondary")&&this.open&&(this.open=!1,await l(this.secondaryDiv,{className:"modal--open",showProp:"part",show:!1}),this.nanoClosing.emit({secondaryMenu:this.secondaryDiv}),this.didOpen=!1)};openSecondary=async()=>{this.slotCtrl.has("secondary")&&!this.open&&(this.open=!0,await l(this.secondaryDiv,{className:"modal--open",showProp:"part",show:!0}),this.nanoOpening.emit({secondaryMenu:this.secondaryDiv}),this.didOpen=!0)};toggleSecondary=()=>{this.slotCtrl.has("secondary")&&(this.didOpen?this.closeSecondary():this.openSecondary())};handleClick=()=>{this.disabled||(this.slotCtrl.has("secondary")?this.toggleSecondary():this.checkbox&&(this.selected=!this.selected))};handleDefaultSlotChange=()=>{const n=i(this.host,"a")[0];if(n){this.href=n.getAttribute("href");const t=document.createElement("span");n.childNodes.forEach((n=>{t.append(n)})),this.host.append(t),n.remove()}};connectedCallback(){this.handleDefaultSlotChange(),this.isInMenuDrawer=!!this.host.closest(s("nano-menu-drawer"))}componentDidLoad(){this.openChange()}render(){return r(a,{key:"7554eb7a4a66fc4f899b40b35265245a3be931f8",class:{"nano-menu-drawer":this.isInMenuDrawer,"nano-nav-item":!0,disabled:this.disabled},role:this.host.closest('[role="menu"]')?"menuitem":void 0,"aria-disabled":this.disabled?"true":void 0},r("div",{key:"4bf288ec9f9162bb746b70b085fde42b871f93fb",class:{navitem:!0,"navitem--open":this.open,"navitem--active":this.selected},part:"trigger-wrapper"},this.href&&!this.disabled&&r("a",{key:"a9bf5adf3da060452ed58e2c6e1eba45168815a3",part:"trigger trigger--anchor",target:this.target,ref:n=>this.controlElement=n,href:this.href,class:{navitem__trigger:!0,notification:this.notification}},r("slot",{key:"47cdd2e84dd51f236675351c599d8e9f9bf66ede",name:"icon-start"}),r("span",{key:"a15d804a252ed532501fb08536ed5ce8a3b42e47",class:"navitem__label",part:"label"},r("slot",{key:"ea37d813d0fd15bd457930b61d06cd97d64fce35",onSlotchange:this.handleDefaultSlotChange})),r("slot",{key:"384a3212fba3d0cc3d488974dcaf53c23c3942e1",name:"icon-end"})),(!this.href||this.disabled)&&r("button",{key:"698c4beb9cddb3b2037db40b5c9e33a276dad060",role:this.checkbox?"checkbox":void 0,"aria-checked":this.checkbox?this.selected.toString():void 0,part:"trigger trigger--button",ref:n=>this.controlElement=n,onClick:this.handleClick,disabled:this.disabled,class:{navitem__trigger:!0,notification:this.notification}},r("slot",{key:"c01a71dfaeb867d2792146110fdde1dd134b7f71",name:"icon-start"}),r("span",{key:"6a48071ba10f1407350e87958ed491f704714ea8",class:"navitem__label",part:"label"},r("slot",{key:"246f807c0a03a8805fea87023f48de2f5fa7a7a0",onSlotchange:this.handleDefaultSlotChange})),r("slot",{key:"6a246213800a4425464ac41aefe9362e327d412f",name:"icon-end"})),this.slotCtrl.has("secondary")&&!this.disabled&&r("div",{key:"8928988fd43de734785801c9fc7707fb7efa33c3",part:"modal",class:{navitem__modal:!0,"navitem__modal--open":this.didOpen},ref:n=>this.secondaryDiv=n,tabIndex:-1},r("div",{key:"eca197afa8cb297eeafc4b7a55ffb6fb288c498c",class:"navitem__modal-content",part:"modal-content "+(this.didOpen?"modal-content--open":"")},this.slotCtrl.has("close-button")&&r("div",{key:"5a774cf15677b3848f80c0cf5bee87da44e3ca04",part:"close-button",onClick:this.closeSecondary},r("slot",{key:"57a08ef1239b6c29241524e3c7ac977c78c910d5",name:"close-button"})),r("slot",{key:"6c35ed89b61461fcc294cddc022c57255558a63b",name:"secondary"})),r("div",{key:"163003649197f1ed341836e73e7acd50c7abc640",class:"navitem__modal-mask",onClick:this.closeSecondary,part:"modal-mask "+(this.didOpen?"modal-mask--open":"")}))))}static get watchers(){return{open:["openChange"],didOpen:["didOpenChange"]}}};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{display:contents}.navitem{background:inherit;color:inherit}a,button{all:unset;color:inherit;text-decoration:inherit;cursor:pointer;display:flex;align-items:center;justify-content:space-between;padding:var(--padding);gap:var(--nano-spacing-md);inline-size:100%;box-sizing:border-box;background:inherit}a:hover,a:focus,a:active,button:hover,button:focus,button:active{color:inherit}a:focus-visible,button:focus-visible{outline:var(--nano-focus-ring);outline-offset:var(--nano-focus-ring-offset)}a[disabled],button[disabled]{opacity:0.5;cursor:not-allowed}.navitem__label{margin-inline-end:auto}.navitem__modal{all:unset;display:none;position:absolute;color:initial;opacity:0;transition:var(--nano-transition-fast) ease}.navitem--open .navitem__modal{opacity:1}::slotted([slot=close-button]){all:unset}::slotted([slot=close-button]):focus-visible{outline:var(--nano-focus-ring);outline-offset:var(--nano-focus-ring-offset)}:host(.nano-menu-drawer) a,:host(.nano-menu-drawer) button{padding-block:calc(var(--padding-top) / 2) calc(var(--padding-bottom) / 2);padding-inline:var(--padding-start) 0;display:flex;justify-content:flex-start;flex-direction:row;align-items:center;color:currentcolor;text-decoration:inherit;white-space:normal;border:none;cursor:pointer;line-height:1.2;inline-size:100%}:host(.nano-menu-drawer) .navitem__label{padding-inline:0 var(--padding-end);text-align:start;flex:0 1 auto;min-inline-size:130px;inline-size:130px}:host(.nano-menu-drawer)::slotted(.nano-icon[slot=icon-start]),:host(.nano-menu-drawer) ::slotted(.nano-icon[slot=icon-start]){padding-inline:0 var(--padding-end);padding-block:0;font-size:var(--icon-size);inline-size:var(--icon-size);flex:0 0 var(--icon-size)}:host(.nano-menu-drawer)::slotted(.nano-icon[slot=icon-end]),:host(.nano-menu-drawer) ::slotted(.nano-icon[slot=icon-end]){padding:0 var(--padding-end) 0 0;font-size:10px;flex:0 0 20px;min-inline-size:20px}:host(.nano-menu-drawer) .navitem__modal{display:none;position:absolute;background-color:var(--secondary-bg-color);color:var(--secondary-color);block-size:100vh;inset-inline:auto 0;inset-block:0;transform:translateX(0);z-index:-1;transition:transform 0.3s ease, opacity 0.2s ease;overflow-y:auto;inline-size:var(--secondary-width, 400px);max-inline-size:62vw;opacity:1;padding-inline:var(--secondary-padding-start, var(--padding-start)) var(--secondary-padding-end, var(--padding-end));padding-block:var(--secondary-padding-top, var(--padding-top)) var(--secondary-padding-bottom, var(--padding-bottom))}:host(.nano-menu-drawer) .navitem__modal:focus{outline:none}.navitem--open :host(.nano-menu-drawer) .navitem__modal{transform:translateX(100%)}:host(.nano-menu-drawer) .notification{position:relative}:host(.nano-menu-drawer) .notification::after{content:"";display:block;position:absolute;inline-size:6px;block-size:6px;background-color:#ef4135;inset-inline-start:10px;inset-block-start:7px;border-radius:50%}@media (width >= 52em){:host(.nano-menu-drawer) .notification::after{inline-size:7px;block-size:7px;inset-inline-start:8px;inset-block-start:5px}}:host(.nano-menu-drawer[dir=rtl]) .navitem__modal{transform:translateX(0%)}.navitem--open :host(.nano-menu-drawer[dir=rtl]) .navitem__modal{transform:translateX(-100%);opacity:1}';export{h as nano_nav_item}
+import{r as n,c as t,a as e,d as a}from"./index-DXvE-U_j.js";import{g as i}from"./dom-Cb7FUtXp.js";import{g as o}from"./tabbable-C4l-rYq9.js";import{t as s,h as r}from"./renderer-BUaAsDso.js";import{H as d}from"./slot-DYFgWo5f.js";import{f as c}from"./active-element-C1pBwzyj.js";const l=(n,t)=>{const e={className:"",show:!0,showDisplay:"block",showProp:"classList",timeout:1e3,...t};return new Promise((t=>{const a=i=>{i.target!==n&&!i.composedPath().some((n=>n===i.target))||e.transitionProp&&!e.transitionProp.includes(i.propertyName)||(n.dataset.displayTransition="true",n.removeEventListener("transitionend",a),t("shown"))},i=a=>{a.target!==n&&!a.composedPath().some((n=>n===a.target))||e.transitionProp&&!e.transitionProp.includes(a.propertyName)||(n.style.display="none",n.dataset.displayTransition="false",n.removeEventListener("transitionend",i),t("hidden"))};e.show?(n.addEventListener("transitionend",a),n.style.display=e.showDisplay,setTimeout((()=>n[e.showProp].add(e.className)),50)):(n.addEventListener("transitionend",i),n[e.showProp].remove(e.className)),e.timeout&&setTimeout((()=>{e.show&&"true"!==n.dataset.displayTransition?(n.dataset.displayTransition="true",n.removeEventListener("transitionend",a),t("shown")):e.show||"false"===n.dataset.displayTransition||(n.style.display="none",n.dataset.displayTransition="false",n.removeEventListener("transitionend",i),t("hidden"))}),e.timeout)}))},h=class{constructor(e){n(this,e),this.nanoClose=t(this,"nanoClose",7),this.nanoOpen=t(this,"nanoOpen",7),this.nanoOpening=t(this,"nanoOpening",7),this.nanoClosing=t(this,"nanoClosing",7)}secondaryDiv;slotCtrl=new d(this,"secondary","close-button");controlElement;get host(){return e(this)}didOpen=!1;isInMenuDrawer=!1;href=null;target="_self";disabled=!1;open=!1;selected=!1;checkbox=!1;closeOnBlur=!0;notification=!1;nanoClose;nanoOpen;nanoOpening;nanoClosing;async setFocus(){this.controlElement&&this.controlElement.focus()}openChange(){this.slotCtrl.has("secondary")&&(this.open?this.openSecondary():this.closeSecondary())}didOpenChange(){if(!this.slotCtrl.has("secondary"))return;if(!this.didOpen)return c(this.host,this.controlElement)&&this.controlElement.focus({preventScroll:!0}),void this.nanoClose.emit({secondaryMenu:this.secondaryDiv});const n=new window.IntersectionObserver((t=>{t[0].boundingClientRect.top<0&&this.secondaryDiv.scrollIntoView({behavior:"smooth"}),n.disconnect()}),{threshold:1});n.observe(this.secondaryDiv),this.secondaryDiv.focus({preventScroll:!0});const t=o(this.secondaryDiv,!0);t[0]&&t[0].focus({preventScroll:!0}),this.nanoOpen.emit({secondaryMenu:this.secondaryDiv})}handleClose(n){this.didOpen&&this.slotCtrl.has("secondary")&&this.closeOnBlur&&(n.key&&"Escape"===n.key?this.closeSecondary():n.composedPath().some((n=>n===this.secondaryDiv))||this.closeSecondary())}closeSecondary=async()=>{this.slotCtrl.has("secondary")&&this.open&&(this.open=!1,await l(this.secondaryDiv,{className:"modal--open",showProp:"part",show:!1}),this.nanoClosing.emit({secondaryMenu:this.secondaryDiv}),this.didOpen=!1)};openSecondary=async()=>{this.slotCtrl.has("secondary")&&!this.open&&(this.open=!0,await l(this.secondaryDiv,{className:"modal--open",showProp:"part",show:!0}),this.nanoOpening.emit({secondaryMenu:this.secondaryDiv}),this.didOpen=!0)};toggleSecondary=()=>{this.slotCtrl.has("secondary")&&(this.didOpen?this.closeSecondary():this.openSecondary())};handleClick=()=>{this.disabled||(this.slotCtrl.has("secondary")?this.toggleSecondary():this.checkbox&&(this.selected=!this.selected))};handleDefaultSlotChange=()=>{const n=i(this.host,"a")[0];if(n){this.href=n.getAttribute("href");const t=document.createElement("span");n.childNodes.forEach((n=>{t.append(n)})),this.host.append(t),n.remove()}};connectedCallback(){this.handleDefaultSlotChange(),this.isInMenuDrawer=!!this.host.closest(s("nano-menu-drawer"))}componentDidLoad(){this.openChange()}render(){return r(a,{key:"7554eb7a4a66fc4f899b40b35265245a3be931f8",class:{"nano-menu-drawer":this.isInMenuDrawer,"nano-nav-item":!0,disabled:this.disabled},role:this.host.closest('[role="menu"]')?"menuitem":void 0,"aria-disabled":this.disabled?"true":void 0},r("div",{key:"4bf288ec9f9162bb746b70b085fde42b871f93fb",class:{navitem:!0,"navitem--open":this.open,"navitem--active":this.selected},part:"trigger-wrapper"},this.href&&!this.disabled&&r("a",{key:"a9bf5adf3da060452ed58e2c6e1eba45168815a3",part:"trigger trigger--anchor",target:this.target,ref:n=>this.controlElement=n,href:this.href,class:{navitem__trigger:!0,notification:this.notification}},r("slot",{key:"47cdd2e84dd51f236675351c599d8e9f9bf66ede",name:"icon-start"}),r("span",{key:"a15d804a252ed532501fb08536ed5ce8a3b42e47",class:"navitem__label",part:"label"},r("slot",{key:"ea37d813d0fd15bd457930b61d06cd97d64fce35",onSlotchange:this.handleDefaultSlotChange})),r("slot",{key:"384a3212fba3d0cc3d488974dcaf53c23c3942e1",name:"icon-end"})),(!this.href||this.disabled)&&r("button",{key:"698c4beb9cddb3b2037db40b5c9e33a276dad060",role:this.checkbox?"checkbox":void 0,"aria-checked":this.checkbox?this.selected.toString():void 0,part:"trigger trigger--button",ref:n=>this.controlElement=n,onClick:this.handleClick,disabled:this.disabled,class:{navitem__trigger:!0,notification:this.notification}},r("slot",{key:"c01a71dfaeb867d2792146110fdde1dd134b7f71",name:"icon-start"}),r("span",{key:"6a48071ba10f1407350e87958ed491f704714ea8",class:"navitem__label",part:"label"},r("slot",{key:"246f807c0a03a8805fea87023f48de2f5fa7a7a0",onSlotchange:this.handleDefaultSlotChange})),r("slot",{key:"6a246213800a4425464ac41aefe9362e327d412f",name:"icon-end"})),this.slotCtrl.has("secondary")&&!this.disabled&&r("div",{key:"8928988fd43de734785801c9fc7707fb7efa33c3",part:"modal",class:{navitem__modal:!0,"navitem__modal--open":this.didOpen},ref:n=>this.secondaryDiv=n,tabIndex:-1},r("div",{key:"eca197afa8cb297eeafc4b7a55ffb6fb288c498c",class:"navitem__modal-content",part:"modal-content "+(this.didOpen?"modal-content--open":"")},this.slotCtrl.has("close-button")&&r("div",{key:"5a774cf15677b3848f80c0cf5bee87da44e3ca04",part:"close-button",onClick:this.closeSecondary},r("slot",{key:"57a08ef1239b6c29241524e3c7ac977c78c910d5",name:"close-button"})),r("slot",{key:"6c35ed89b61461fcc294cddc022c57255558a63b",name:"secondary"})),r("div",{key:"163003649197f1ed341836e73e7acd50c7abc640",class:"navitem__modal-mask",onClick:this.closeSecondary,part:"modal-mask "+(this.didOpen?"modal-mask--open":"")}))))}static get watchers(){return{open:["openChange"],didOpen:["didOpenChange"]}}};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{display:contents}.navitem{background:inherit;color:inherit}a,button{all:unset;color:inherit;text-decoration:inherit;cursor:pointer;display:flex;align-items:center;justify-content:space-between;padding:var(--padding);gap:var(--nano-spacing-md);inline-size:100%;box-sizing:border-box;background:inherit}a:hover,a:focus,a:active,button:hover,button:focus,button:active{color:inherit}a:focus-visible,button:focus-visible{outline:var(--nano-focus-ring);outline-offset:var(--nano-focus-ring-offset)}a[disabled],button[disabled]{opacity:0.5;cursor:not-allowed}.navitem__label{margin-inline-end:auto}.navitem__modal{all:unset;display:none;position:absolute;color:initial;opacity:0;transition:var(--nano-transition-fast) ease}.navitem--open .navitem__modal{opacity:1}::slotted([slot=close-button]){all:unset}::slotted([slot=close-button]):focus-visible{outline:var(--nano-focus-ring);outline-offset:var(--nano-focus-ring-offset)}:host(.nano-menu-drawer) a,:host(.nano-menu-drawer) button{padding-block:calc(var(--padding-top) / 2) calc(var(--padding-bottom) / 2);padding-inline:var(--padding-start) 0;display:flex;justify-content:flex-start;flex-direction:row;align-items:center;color:currentcolor;text-decoration:inherit;white-space:normal;border:none;cursor:pointer;line-height:1.2;inline-size:100%}:host(.nano-menu-drawer) .navitem__label{padding-inline:0 var(--padding-end);text-align:start;flex:0 1 auto;min-inline-size:130px;inline-size:130px}:host(.nano-menu-drawer)::slotted(.nano-icon[slot=icon-start]),:host(.nano-menu-drawer) ::slotted(.nano-icon[slot=icon-start]){padding-inline:0 var(--padding-end);padding-block:0;font-size:var(--icon-size);inline-size:var(--icon-size);flex:0 0 var(--icon-size)}:host(.nano-menu-drawer)::slotted(.nano-icon[slot=icon-end]),:host(.nano-menu-drawer) ::slotted(.nano-icon[slot=icon-end]){padding:0 var(--padding-end) 0 0;font-size:10px;flex:0 0 20px;min-inline-size:20px}:host(.nano-menu-drawer) .navitem__modal{display:none;position:absolute;background-color:var(--secondary-bg-color);color:var(--secondary-color);block-size:100vh;inset-inline:auto 0;inset-block:0;transform:translateX(0);z-index:-1;transition:transform 0.3s ease, opacity 0.2s ease;overflow-y:auto;inline-size:var(--secondary-width, 400px);max-inline-size:62vw;opacity:1;padding-inline:var(--secondary-padding-start, var(--padding-start)) var(--secondary-padding-end, var(--padding-end));padding-block:var(--secondary-padding-top, var(--padding-top)) var(--secondary-padding-bottom, var(--padding-bottom))}:host(.nano-menu-drawer) .navitem__modal:focus{outline:none}.navitem--open :host(.nano-menu-drawer) .navitem__modal{transform:translateX(100%)}:host(.nano-menu-drawer) .notification{position:relative}:host(.nano-menu-drawer) .notification::after{content:"";display:block;position:absolute;inline-size:6px;block-size:6px;background-color:#ef4135;inset-inline-start:10px;inset-block-start:7px;border-radius:50%}@media (width >= 52em){:host(.nano-menu-drawer) .notification::after{inline-size:7px;block-size:7px;inset-inline-start:8px;inset-block-start:5px}}:host(.nano-menu-drawer[dir=rtl]) .navitem__modal{transform:translateX(0%)}.navitem--open :host(.nano-menu-drawer[dir=rtl]) .navitem__modal{transform:translateX(-100%);opacity:1}';export{h as nano_nav_item}

package/dist/nano-components/nano-progress-bar.entry.js

@@ -1,4 +1,4 @@
 /*!
  * Custom elements for Nanopore-Digital Web applications
  */
-import{r,a,d as e}from"./index-CFYZ-ZOT.js";import{h as o}from"./renderer-LJzCFyMt.js";const t=class{constructor(a){r(this,a)}get host(){return a(this)}value=0;indeterminate=!1;showPercent=!1;render(){return o(e,{key:"2d33cb1a93d9b155cef4ea64b1a36a275104ed5c",class:"nano-progress-bar"},o("div",{key:"1477b01e971f00541af5501df4f42c2d69cb87d4",part:"base",class:{"progress-bar":!0,"progress-bar--indeterminate":this.indeterminate},role:"progressbar",title:this.host.title||void 0,"aria-label":"Progress","aria-valuemin":"0","aria-valuemax":"100","aria-valuenow":this.indeterminate?null:this.value},o("div",{key:"dd80b47ed6627db8d93bf20a7ef096d44757ec56",part:"indicator",class:"progress-bar__indicator",style:{width:this.indeterminate?void 0:`${this.value}%`}},o("span",{key:"7b967332cff45da08a49008ac727f247750347ae",part:"label",class:"progress-bar__label"},o("slot",{key:"5d2c53909892f8c81e151ec64a337e656e7e4dae"},!this.indeterminate&&this.showPercent?`${this.value}%`:"")))))}};t.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{--height:1em;--track-color:rgb(var(--nano-track-rgb, 228 230 232) / 100%);--indicator-color:rgb(var(--nano-indicator-rgb, 84 140 175) / 100%);--label-color:var(--nano-color-white, white);display:block}.progress-bar{position:relative;background-color:var(--track-color);block-size:var(--height);border-radius:var(--nano-layer-border-radius, var(--nano-border-radius-medium, 4px));overflow:hidden}.progress-bar__indicator{block-size:100%;font-size:0.75em;background-color:var(--indicator-color);color:var(--label-color);text-align:center;white-space:nowrap;overflow:hidden;transition:0.4s width, 0.4s background-color;transform:translateZ(0);-webkit-user-select:none;user-select:none;transform-origin:left}.progress-bar--indeterminate .progress-bar__indicator{animation:indeterminate 2.5s infinite cubic-bezier(0.37, 0, 0.63, 1)}@keyframes indeterminate{0%{scale:1 1;transform:translateX(-100%) translateZ(0)}75%,100%{scale:1 1;transform:translateX(100%) translateZ(0)}}";export{t as nano_progress_bar}
+import{r,a,d as e}from"./index-DXvE-U_j.js";import{h as o}from"./renderer-BUaAsDso.js";const t=class{constructor(a){r(this,a)}get host(){return a(this)}value=0;indeterminate=!1;showPercent=!1;render(){return o(e,{key:"2d33cb1a93d9b155cef4ea64b1a36a275104ed5c",class:"nano-progress-bar"},o("div",{key:"1477b01e971f00541af5501df4f42c2d69cb87d4",part:"base",class:{"progress-bar":!0,"progress-bar--indeterminate":this.indeterminate},role:"progressbar",title:this.host.title||void 0,"aria-label":"Progress","aria-valuemin":"0","aria-valuemax":"100","aria-valuenow":this.indeterminate?null:this.value},o("div",{key:"dd80b47ed6627db8d93bf20a7ef096d44757ec56",part:"indicator",class:"progress-bar__indicator",style:{width:this.indeterminate?void 0:`${this.value}%`}},o("span",{key:"7b967332cff45da08a49008ac727f247750347ae",part:"label",class:"progress-bar__label"},o("slot",{key:"5d2c53909892f8c81e151ec64a337e656e7e4dae"},!this.indeterminate&&this.showPercent?`${this.value}%`:"")))))}};t.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{--height:1em;--track-color:rgb(var(--nano-track-rgb, 228 230 232) / 100%);--indicator-color:rgb(var(--nano-indicator-rgb, 84 140 175) / 100%);--label-color:var(--nano-color-white, white);display:block}.progress-bar{position:relative;background-color:var(--track-color);block-size:var(--height);border-radius:var(--nano-layer-border-radius, var(--nano-border-radius-medium, 4px));overflow:hidden}.progress-bar__indicator{block-size:100%;font-size:0.75em;background-color:var(--indicator-color);color:var(--label-color);text-align:center;white-space:nowrap;overflow:hidden;transition:0.4s width, 0.4s background-color;transform:translateZ(0);-webkit-user-select:none;user-select:none;transform-origin:left}.progress-bar--indeterminate .progress-bar__indicator{animation:indeterminate 2.5s infinite cubic-bezier(0.37, 0, 0.63, 1)}@keyframes indeterminate{0%{scale:1 1;transform:translateX(-100%) translateZ(0)}75%,100%{scale:1 1;transform:translateX(100%) translateZ(0)}}";export{t as nano_progress_bar}

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

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

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

@@ -1,4 +1,4 @@
 /*!
  * Custom elements for Nanopore-Digital Web applications
  */
-import{r as n,c as a,a as t,d as i}from"./index-CFYZ-ZOT.js";import{h as s}from"./renderer-LJzCFyMt.js";import{a as o}from"./math-BEqsTfVK.js";const r=class{constructor(t){n(this,t),this.nanoChange=a(this,"nanoChange",7),this.nanoBlur=a(this,"nanoBlur",7),this.nanoFocus=a(this,"nanoFocus",7)}rating;isRtl;indicator;get host(){return t(this)}hoverValue=0;isHovering=!1;value=0;max=5;precision=1;readonly=!1;disabled=!1;name="";symbolName="solid/star";symbol=()=>'<nano-icon name="'+this.symbolName+'"></nano-icon>';handleValueChange(){this.nanoChange.emit()}handleSymbolChange(){this.symbol||(this.symbol=()=>'<nano-icon name="'+this.symbolName+'"></nano-icon>')}nanoChange;nanoBlur;nanoFocus;async setFocus(){this.rating.focus()}async removeFocus(){this.rating.blur()}getValueFromMousePosition(n){const a=this.rating.getBoundingClientRect().left,t=this.rating.getBoundingClientRect().width;let i;return i=this.roundToPrecision((n.clientX-a)/t*this.max,this.precision),this.isRtl&&(i=this.max+this.precision-i),o(i,0,this.max)}roundToPrecision(n,a=.5){const t=1/a;return Math.ceil(n*t)/t}handleClick=n=>{if(this.disabled||this.readonly)return;const a=this.getValueFromMousePosition(n);this.value=a===this.value?0:a,this.isHovering=!1};handleKeyDown=n=>{this.disabled||this.readonly||("ArrowLeft"===n.key&&(this.value=this.roundToPrecision(Math.max(0,this.value-(n.shiftKey?1:this.precision))),n.preventDefault()),"ArrowRight"===n.key&&(this.value=this.roundToPrecision(Math.min(this.max,this.value+(n.shiftKey?1:this.precision))),n.preventDefault()),"Home"===n.key&&(this.value=0,n.preventDefault()),"End"===n.key&&(this.value=this.max,n.preventDefault()))};handleMouseEnter=()=>{this.isHovering=!0};handleMouseLeave=()=>{this.isHovering=!1};handleFocus=()=>{this.nanoFocus.emit()};handleBlur=()=>{this.nanoBlur.emit()};handleMouseMove=n=>{this.hoverValue=this.getValueFromMousePosition(n)};clip(n){if(!this.rating)return;const a=this.rating.getBoundingClientRect().width;return this.isRtl?`rect(0, ${a}px, 2em, ${a-a/100*(n/this.max*100)}px)`:`rect(0, ${a/100*(n/this.max*100)}px, 2em, 0)`}componentDidLoad(){setTimeout((()=>this.indicator.style.clip=this.clip(this.value)),20)}connectedCallback(){this.isRtl="rtl"===this.host.dir||"rtl"===this.host.ownerDocument.dir}render(){this.isRtl="rtl"===this.host.dir||"rtl"===this.host.ownerDocument.dir;const n=Array.from(Array(this.max).keys());let a=0;return a=this.disabled||this.readonly?this.value:this.isHovering?this.hoverValue:this.value,s(i,{key:"cecf5fdd43d5b48e55ddd4c69900e82c85c48bee",class:"nano-rating"},s("div",{key:"87803596623dfc08370dd7e6f0a59bfaed8fcf4f",class:"rating-wrap"},s("div",{key:"32da5e5a323bf552e5e04403e7594ecc57739b31",dir:this.isRtl?"rtl":null,ref:n=>this.rating=n,part:"base",class:{rating:!0,"rating--readonly":this.readonly,"rating--disabled":this.disabled},"aria-disabled":this.disabled?"true":"false","aria-readonly":this.readonly?"true":"false","aria-valuenow":this.value,"aria-valuemin":0,"aria-valuemax":this.max,tabIndex:this.disabled?-1:0,onClick:this.handleClick,onKeyDown:this.handleKeyDown,onMouseEnter:this.handleMouseEnter,onMouseLeave:this.handleMouseLeave,onMouseMove:this.handleMouseMove,onFocus:this.handleFocus,onBlur:this.handleBlur},s("span",{key:"cab05324ead1b6e539e6c162ab0a9f2488a3a801",class:"rating__symbols rating__symbols--inactive"},n.map((n=>s("span",{class:{rating__symbol:!0,"rating__symbol--hover":this.isHovering&&Math.ceil(a)===n+1},onMouseEnter:this.handleMouseEnter,innerHTML:this.symbol(n+1)})))),s("span",{key:"d369b4d296ba7c763777422a7885a78d0175e0c8",ref:n=>this.indicator=n,class:"rating__symbols rating__symbols--indicator",style:{clip:this.clip(a)}},n.map((n=>s("span",{class:{rating__symbol:!0,"rating__symbol--hover":this.isHovering&&Math.ceil(a)===n+1},innerHTML:this.symbol(n+1)})))),s("input",{key:"d1cfd5eeb33163a3c0f02cde0234bbf0ddbd2805",type:"hidden",name:this.name,value:this.value,disabled:this.disabled||this.readonly}))))}static get watchers(){return{value:["handleValueChange"],symbolName:["handleSymbolChange"]}}};r.style=".sc-nano-rating-h,*.sc-nano-rating,*.sc-nano-rating::before,*.sc-nano-rating::after{box-sizing:border-box}[hidden].sc-nano-rating{display:none !important}@media (prefers-reduced-motion: reduce){.sc-nano-rating-h,*.sc-nano-rating,*.sc-nano-rating::before,*.sc-nano-rating::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}.sc-nano-rating-h,*.sc-nano-rating,*.sc-nano-rating::before,*.sc-nano-rating::after{box-sizing:border-box}[hidden].sc-nano-rating{display:none !important}@media (prefers-reduced-motion: reduce){.sc-nano-rating-h,*.sc-nano-rating,*.sc-nano-rating::before,*.sc-nano-rating::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}.sc-nano-rating-h{--symbol-color:#b5aea7;--symbol-color-active:#f5cc49;--symbol-spacing:0.25rem;--focus-shadow:var(--nano-control-focus-shadow, 0 0 0 0.1875rem  var(--nano-control-focus-color, rgba(144, 198, 231, 0.8)));display:inline-block}.rating-wrap.sc-nano-rating{position:relative;margin-block:0;margin-inline:calc(var(--symbol-spacing) * -1)}.rating.sc-nano-rating{position:relative;border-radius:5px;vertical-align:middle;inline-size:100%;transition:box-shadow 0.15s ease}.rating.sc-nano-rating:focus{outline:none}.rating.sc-nano-rating:focus-visible:focus{box-shadow:var(--focus-shadow)}.rating__symbols.sc-nano-rating{display:flex;align-items:center;position:relative;font-size:var(--symbol-size);color:var(--symbol-color);white-space:nowrap;cursor:pointer;line-height:0;justify-content:space-between}.rating__symbols--inactive.sc-nano-rating .rating__symbol.sc-nano-rating>.sc-nano-rating:not(.nano-icon){background-color:currentcolor !important}.rating__symbols.sc-nano-rating>*.sc-nano-rating{margin:var(--symbol-spacing)}.rating__symbols--indicator.sc-nano-rating{position:absolute;inset-block-start:0;inset-inline-start:0;color:var(--symbol-color-active);pointer-events:none;inline-size:100%}.rating__symbol.sc-nano-rating{transition:0.2s transform;text-align:center}.rating__symbol--hover.sc-nano-rating{transform:scale(1.2)}.rating--disabled.sc-nano-rating .rating__symbols.sc-nano-rating,.rating--readonly.sc-nano-rating .rating__symbols.sc-nano-rating{cursor:default}.rating--disabled.sc-nano-rating .rating__symbol.sc-nano-rating,.rating--readonly.sc-nano-rating .rating__symbol.sc-nano-rating{transform:none !important}.rating--disabled.sc-nano-rating{opacity:0.5}.rating--disabled.sc-nano-rating .rating__symbols.sc-nano-rating{cursor:not-allowed}";export{r as nano_rating}
+import{r as n,c as a,a as i,d as t}from"./index-DXvE-U_j.js";import{h as s}from"./renderer-BUaAsDso.js";import{a as o}from"./math-BEqsTfVK.js";const r=class{constructor(i){n(this,i),this.nanoChange=a(this,"nanoChange",7),this.nanoBlur=a(this,"nanoBlur",7),this.nanoFocus=a(this,"nanoFocus",7)}rating;isRtl;indicator;get host(){return i(this)}hoverValue=0;isHovering=!1;value=0;max=5;precision=1;readonly=!1;disabled=!1;name="";symbolName="solid/star";symbol=()=>'<nano-icon name="'+this.symbolName+'"></nano-icon>';handleValueChange(){this.nanoChange.emit()}handleSymbolChange(){this.symbol||(this.symbol=()=>'<nano-icon name="'+this.symbolName+'"></nano-icon>')}nanoChange;nanoBlur;nanoFocus;async setFocus(){this.rating.focus()}async removeFocus(){this.rating.blur()}getValueFromMousePosition(n){const a=this.rating.getBoundingClientRect().left,i=this.rating.getBoundingClientRect().width;let t;return t=this.roundToPrecision((n.clientX-a)/i*this.max,this.precision),this.isRtl&&(t=this.max+this.precision-t),o(t,0,this.max)}roundToPrecision(n,a=.5){const i=1/a;return Math.ceil(n*i)/i}handleClick=n=>{if(this.disabled||this.readonly)return;const a=this.getValueFromMousePosition(n);this.value=a===this.value?0:a,this.isHovering=!1};handleKeyDown=n=>{this.disabled||this.readonly||("ArrowLeft"===n.key&&(this.value=this.roundToPrecision(Math.max(0,this.value-(n.shiftKey?1:this.precision))),n.preventDefault()),"ArrowRight"===n.key&&(this.value=this.roundToPrecision(Math.min(this.max,this.value+(n.shiftKey?1:this.precision))),n.preventDefault()),"Home"===n.key&&(this.value=0,n.preventDefault()),"End"===n.key&&(this.value=this.max,n.preventDefault()))};handleMouseEnter=()=>{this.isHovering=!0};handleMouseLeave=()=>{this.isHovering=!1};handleFocus=()=>{this.nanoFocus.emit()};handleBlur=()=>{this.nanoBlur.emit()};handleMouseMove=n=>{this.hoverValue=this.getValueFromMousePosition(n)};clip(n){if(!this.rating)return;const a=this.rating.getBoundingClientRect().width;return this.isRtl?`rect(0, ${a}px, 2em, ${a-a/100*(n/this.max*100)}px)`:`rect(0, ${a/100*(n/this.max*100)}px, 2em, 0)`}componentDidLoad(){setTimeout((()=>this.indicator.style.clip=this.clip(this.value)),20)}connectedCallback(){this.isRtl="rtl"===this.host.dir||"rtl"===this.host.ownerDocument.dir}render(){this.isRtl="rtl"===this.host.dir||"rtl"===this.host.ownerDocument.dir;const n=Array.from(Array(this.max).keys());let a=0;return a=this.disabled||this.readonly?this.value:this.isHovering?this.hoverValue:this.value,s(t,{key:"cecf5fdd43d5b48e55ddd4c69900e82c85c48bee",class:"nano-rating"},s("div",{key:"87803596623dfc08370dd7e6f0a59bfaed8fcf4f",class:"rating-wrap"},s("div",{key:"32da5e5a323bf552e5e04403e7594ecc57739b31",dir:this.isRtl?"rtl":null,ref:n=>this.rating=n,part:"base",class:{rating:!0,"rating--readonly":this.readonly,"rating--disabled":this.disabled},"aria-disabled":this.disabled?"true":"false","aria-readonly":this.readonly?"true":"false","aria-valuenow":this.value,"aria-valuemin":0,"aria-valuemax":this.max,tabIndex:this.disabled?-1:0,onClick:this.handleClick,onKeyDown:this.handleKeyDown,onMouseEnter:this.handleMouseEnter,onMouseLeave:this.handleMouseLeave,onMouseMove:this.handleMouseMove,onFocus:this.handleFocus,onBlur:this.handleBlur},s("span",{key:"cab05324ead1b6e539e6c162ab0a9f2488a3a801",class:"rating__symbols rating__symbols--inactive"},n.map((n=>s("span",{class:{rating__symbol:!0,"rating__symbol--hover":this.isHovering&&Math.ceil(a)===n+1},onMouseEnter:this.handleMouseEnter,innerHTML:this.symbol(n+1)})))),s("span",{key:"d369b4d296ba7c763777422a7885a78d0175e0c8",ref:n=>this.indicator=n,class:"rating__symbols rating__symbols--indicator",style:{clip:this.clip(a)}},n.map((n=>s("span",{class:{rating__symbol:!0,"rating__symbol--hover":this.isHovering&&Math.ceil(a)===n+1},innerHTML:this.symbol(n+1)})))),s("input",{key:"d1cfd5eeb33163a3c0f02cde0234bbf0ddbd2805",type:"hidden",name:this.name,value:this.value,disabled:this.disabled||this.readonly}))))}static get watchers(){return{value:["handleValueChange"],symbolName:["handleSymbolChange"]}}};r.style=".sc-nano-rating-h,*.sc-nano-rating,*.sc-nano-rating::before,*.sc-nano-rating::after{box-sizing:border-box}[hidden].sc-nano-rating{display:none !important}@media (prefers-reduced-motion: reduce){.sc-nano-rating-h,*.sc-nano-rating,*.sc-nano-rating::before,*.sc-nano-rating::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}.sc-nano-rating-h,*.sc-nano-rating,*.sc-nano-rating::before,*.sc-nano-rating::after{box-sizing:border-box}[hidden].sc-nano-rating{display:none !important}@media (prefers-reduced-motion: reduce){.sc-nano-rating-h,*.sc-nano-rating,*.sc-nano-rating::before,*.sc-nano-rating::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}.sc-nano-rating-h{--symbol-color:#b5aea7;--symbol-color-active:#f5cc49;--symbol-spacing:0.25rem;--focus-shadow:var(--nano-control-focus-shadow, 0 0 0 0.1875rem  var(--nano-control-focus-color, rgba(144, 198, 231, 0.8)));display:inline-block}.rating-wrap.sc-nano-rating{position:relative;margin-block:0;margin-inline:calc(var(--symbol-spacing) * -1)}.rating.sc-nano-rating{position:relative;border-radius:5px;vertical-align:middle;inline-size:100%;transition:box-shadow 0.15s ease}.rating.sc-nano-rating:focus{outline:none}.rating.sc-nano-rating:focus-visible:focus{box-shadow:var(--focus-shadow)}.rating__symbols.sc-nano-rating{display:flex;align-items:center;position:relative;font-size:var(--symbol-size);color:var(--symbol-color);white-space:nowrap;cursor:pointer;line-height:0;justify-content:space-between}.rating__symbols--inactive.sc-nano-rating .rating__symbol.sc-nano-rating>.sc-nano-rating:not(.nano-icon){background-color:currentcolor !important}.rating__symbols.sc-nano-rating>*.sc-nano-rating{margin:var(--symbol-spacing)}.rating__symbols--indicator.sc-nano-rating{position:absolute;inset-block-start:0;inset-inline-start:0;color:var(--symbol-color-active);pointer-events:none;inline-size:100%}.rating__symbol.sc-nano-rating{transition:0.2s transform;text-align:center}.rating__symbol--hover.sc-nano-rating{transform:scale(1.2)}.rating--disabled.sc-nano-rating .rating__symbols.sc-nano-rating,.rating--readonly.sc-nano-rating .rating__symbols.sc-nano-rating{cursor:default}.rating--disabled.sc-nano-rating .rating__symbol.sc-nano-rating,.rating--readonly.sc-nano-rating .rating__symbol.sc-nano-rating{transform:none !important}.rating--disabled.sc-nano-rating{opacity:0.5}.rating--disabled.sc-nano-rating .rating__symbols.sc-nano-rating{cursor:not-allowed}";export{r as nano_rating}

package/dist/nano-components/nano-resize-observe_2.entry.js

@@ -1,4 +1,4 @@
 /*!
  * Custom elements for Nanopore-Digital Web applications
  */
-import{r as t,c as i,a as e,f as s,d as n}from"./index-CFYZ-ZOT.js";import{h as a}from"./renderer-LJzCFyMt.js";const o=class{constructor(e){t(this,e),this.nanoResizeStateChange=i(this,"nanoResizeStateChange",7),this.nanoResizeObserverReady=i(this,"nanoResizeObserverReady",7),this.nanoResizeContentFitChange=i(this,"nanoResizeContentFitChange",7),this.nanoResize=i(this,"nanoResize",7)}ro;appliedStates;isReady=!1;get host(){return e(this)}currentWidth;currentHeight;classNames=[];contentFitX=null;contentFitY=null;classNameChange(){this.host.className=this.classNames.join(" "),!this.isReady&&this.classNames.includes("is-ready")&&(this.isReady=!0,this.nanoResizeObserverReady.emit())}notifyContentFit;states;newStatesProp(){this.statesChanged()}nanoResizeStateChange;nanoResizeObserverReady;nanoResizeContentFitChange;nanoResize;dimensionChanged(){this.assessChanges()}statesChanged(){if(!this.states)return;const t=t=>{const i=t.split(/(\d+)/).filter((t=>t.length));return{bp:parseInt(i[0]),dir:i[1]}};this.appliedStates={h:new Map,w:new Map},this.states.split(",").map((i=>{if((i=i.trim()).includes(" ")){const[e,...s]=i.split(" "),{bp:n,dir:a}=t(e);this.appliedStates[a].set(n,{states:s,applied:!1})}else{const{bp:e,dir:s}=t(i);this.appliedStates[s].set(e,{applied:!1})}}))}assesContentFit(){if(!this.notifyContentFit)return;let t=!1;const i=(t=>{if("contents"!==window.getComputedStyle(t).display)return t;const i=t=>Array.from(t.children).find((t=>{if("contents"!==window.getComputedStyle(t).display)return t;i(t)}));return i(t)})(this.host.firstElementChild);i&&(this.notifyContentFit&&this.notifyContentFit.includes("x")&&(this.currentWidth<i.scrollWidth&&!1!==this.contentFitX?(t=!0,this.contentFitX=!1):this.currentWidth>=i.scrollWidth&&!0!==this.contentFitX&&(t=!0,this.contentFitX=!0)),this.notifyContentFit&&this.notifyContentFit.includes("y")&&(this.currentHeight<i.scrollHeight&&!1!==this.contentFitY?(t=!0,this.contentFitY=!1):this.currentHeight>=i.scrollHeight&&!0!==this.contentFitY&&(t=!0,this.contentFitY=!0)),t&&this.nanoResizeContentFitChange.emit({x:this.contentFitX,y:this.contentFitY}))}assessChanges=()=>{if(!this.currentWidth&&!this.currentHeight)return;if(s((()=>this.assesContentFit())),!this.states||!this.appliedStates)return;const t={h:new Map,w:new Map};let i=!1;Object.keys(this.appliedStates).forEach((e=>{let s;s="h"===e?this.currentHeight:this.currentWidth,this.appliedStates[e].forEach(((n,a)=>{s>=a&&!1===n.applied?(n.applied=!0,t[e].set(a,n),i=!0):s<a&&!0===n.applied&&(n.applied=!1,t[e].set(a,n),i=!0)}))})),i?this.applyChanges(t):this.classNames.includes("is-ready")||(this.classNames=[...this.classNames,"is-ready"])};applyChanges(t){if(!this.states)return;let i=[...this.classNames];Object.keys(t).forEach((e=>{t[e].forEach((t=>{t.states&&t.states.map((e=>{t.applied?(i.push(e),i=i.filter((t=>t!=="not-"+e))):(i.push("not-"+e),i=i.filter((t=>t!==e)))}))}))})),this.classNames=["is-ready",...i],this.nanoResizeStateChange.emit(this.toSimpleObj(t))}toSimpleObj(t){const i={};return Object.keys(t).forEach((e=>{t[e].forEach(((t,s)=>{i[s+e]=t.applied}))})),i}attachRO(){window.ResizeObserver&&(this.ro=new ResizeObserver((t=>{const{width:i,height:e}=this.host.getBoundingClientRect();this.currentWidth=Math.ceil(i),this.currentHeight=Math.ceil(e),this.nanoResize.emit(t)})),this.ro.observe(this.host))}componentWillLoad(){this.classNames=Array.from(this.host.classList),this.statesChanged(),this.applyChanges(this.appliedStates),this.currentWidth||this.currentHeight?this.assessChanges():s((()=>{const{width:t,height:i}=this.host.getBoundingClientRect();this.currentWidth=Math.ceil(t),this.currentHeight=Math.ceil(i)}))}connectedCallback(){this.ro||this.attachRO()}disconnectedCallback(){this.ro&&this.ro.disconnect()}render(){return a(n,{key:"c18db95f590c660cc2c0e1dd1f2d2a0c66e63a54",class:"nano-resize-observe"},a("slot",{key:"25cd2b6762d1bb05d5182fd817b758256ce6750a"}),!!this.notifyContentFit&&(null!==this.contentFitX||null!==this.contentFitY)&&[a("slot",this.contentFitX?{name:"content-fit-x"}:{name:"content-nofit-x"}),a("slot",this.contentFitY?{name:"content-fit-y"}:{name:"content-nofit-y"})])}static get watchers(){return{classNames:["classNameChange"],states:["newStatesProp","statesChanged"],currentHeight:["dimensionChanged"],currentWidth:["dimensionChanged"]}}};o.style=":host { display: block }";const r=class{constructor(i){t(this,i)}animated=!0;render(){return a(n,{key:"fcfda9d2eb69c98089f410f30087a5cc773b4dd7",class:"nano-skeleton"},a("div",{key:"6f489367c6e9a366d8fc4290244141a8a0b1c4d8",class:{skeleton:!0,animate:this.animated}},a("div",{key:"d54f326dd7e8d181702d6ab16ca08c6c88c654e0",class:"skeleton__indicator"}," ")))}};r.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{--base-color-rgb:var(--nano-skeleton-rgb, 228 230 232);--color:var(--nano-skeleton-color, rgb(var(--base-color-rgb) / 100%));--tint:var(--nano-skeleton-tint, rgb(var(--base-color-rgb) / 50%));display:block;position:relative;border-radius:0.25rem;min-block-size:1em;line-height:inherit}.skeleton{display:flex;min-inline-size:100%;min-block-size:100%;border-radius:inherit;line-height:inherit}.skeleton__indicator{flex:1 1 auto;background:var(--color);border-radius:inherit;line-height:inherit}.skeleton.animate .skeleton__indicator{background:linear-gradient(270deg, var(--tint), var(--color), var(--color), var(--tint));background-size:400% 100%;animation:loader 6s ease-in-out infinite}@keyframes loader{0%{background-position:200% 0}100%{background-position:-200% 0}}";export{o as nano_resize_observe,r as nano_skeleton}
+import{r as t,c as i,a as e,f as s,d as n}from"./index-DXvE-U_j.js";import{h as a}from"./renderer-BUaAsDso.js";const o=class{constructor(e){t(this,e),this.nanoResizeStateChange=i(this,"nanoResizeStateChange",7),this.nanoResizeObserverReady=i(this,"nanoResizeObserverReady",7),this.nanoResizeContentFitChange=i(this,"nanoResizeContentFitChange",7),this.nanoResize=i(this,"nanoResize",7)}ro;appliedStates;isReady=!1;get host(){return e(this)}currentWidth;currentHeight;classNames=[];contentFitX=null;contentFitY=null;classNameChange(){this.host.className=this.classNames.join(" "),!this.isReady&&this.classNames.includes("is-ready")&&(this.isReady=!0,this.nanoResizeObserverReady.emit())}notifyContentFit;states;newStatesProp(){this.statesChanged()}nanoResizeStateChange;nanoResizeObserverReady;nanoResizeContentFitChange;nanoResize;dimensionChanged(){this.assessChanges()}statesChanged(){if(!this.states)return;const t=t=>{const i=t.split(/(\d+)/).filter((t=>t.length));return{bp:parseInt(i[0]),dir:i[1]}};this.appliedStates={h:new Map,w:new Map},this.states.split(",").map((i=>{if((i=i.trim()).includes(" ")){const[e,...s]=i.split(" "),{bp:n,dir:a}=t(e);this.appliedStates[a].set(n,{states:s,applied:!1})}else{const{bp:e,dir:s}=t(i);this.appliedStates[s].set(e,{applied:!1})}}))}assesContentFit(){if(!this.notifyContentFit)return;let t=!1;const i=(t=>{if("contents"!==window.getComputedStyle(t).display)return t;const i=t=>Array.from(t.children).find((t=>{if("contents"!==window.getComputedStyle(t).display)return t;i(t)}));return i(t)})(this.host.firstElementChild);i&&(this.notifyContentFit&&this.notifyContentFit.includes("x")&&(this.currentWidth<i.scrollWidth&&!1!==this.contentFitX?(t=!0,this.contentFitX=!1):this.currentWidth>=i.scrollWidth&&!0!==this.contentFitX&&(t=!0,this.contentFitX=!0)),this.notifyContentFit&&this.notifyContentFit.includes("y")&&(this.currentHeight<i.scrollHeight&&!1!==this.contentFitY?(t=!0,this.contentFitY=!1):this.currentHeight>=i.scrollHeight&&!0!==this.contentFitY&&(t=!0,this.contentFitY=!0)),t&&this.nanoResizeContentFitChange.emit({x:this.contentFitX,y:this.contentFitY}))}assessChanges=()=>{if(!this.currentWidth&&!this.currentHeight)return;if(s((()=>this.assesContentFit())),!this.states||!this.appliedStates)return;const t={h:new Map,w:new Map};let i=!1;Object.keys(this.appliedStates).forEach((e=>{let s;s="h"===e?this.currentHeight:this.currentWidth,this.appliedStates[e].forEach(((n,a)=>{s>=a&&!1===n.applied?(n.applied=!0,t[e].set(a,n),i=!0):s<a&&!0===n.applied&&(n.applied=!1,t[e].set(a,n),i=!0)}))})),i?this.applyChanges(t):this.classNames.includes("is-ready")||(this.classNames=[...this.classNames,"is-ready"])};applyChanges(t){if(!this.states)return;let i=[...this.classNames];Object.keys(t).forEach((e=>{t[e].forEach((t=>{t.states&&t.states.map((e=>{t.applied?(i.push(e),i=i.filter((t=>t!=="not-"+e))):(i.push("not-"+e),i=i.filter((t=>t!==e)))}))}))})),this.classNames=["is-ready",...i],this.nanoResizeStateChange.emit(this.toSimpleObj(t))}toSimpleObj(t){const i={};return Object.keys(t).forEach((e=>{t[e].forEach(((t,s)=>{i[s+e]=t.applied}))})),i}attachRO(){window.ResizeObserver&&(this.ro=new ResizeObserver((t=>{const{width:i,height:e}=this.host.getBoundingClientRect();this.currentWidth=Math.ceil(i),this.currentHeight=Math.ceil(e),this.nanoResize.emit(t)})),this.ro.observe(this.host))}componentWillLoad(){this.classNames=Array.from(this.host.classList),this.statesChanged(),this.applyChanges(this.appliedStates),this.currentWidth||this.currentHeight?this.assessChanges():s((()=>{const{width:t,height:i}=this.host.getBoundingClientRect();this.currentWidth=Math.ceil(t),this.currentHeight=Math.ceil(i)}))}connectedCallback(){this.ro||this.attachRO()}disconnectedCallback(){this.ro&&this.ro.disconnect()}render(){return a(n,{key:"c18db95f590c660cc2c0e1dd1f2d2a0c66e63a54",class:"nano-resize-observe"},a("slot",{key:"25cd2b6762d1bb05d5182fd817b758256ce6750a"}),!!this.notifyContentFit&&(null!==this.contentFitX||null!==this.contentFitY)&&[a("slot",this.contentFitX?{name:"content-fit-x"}:{name:"content-nofit-x"}),a("slot",this.contentFitY?{name:"content-fit-y"}:{name:"content-nofit-y"})])}static get watchers(){return{classNames:["classNameChange"],states:["newStatesProp","statesChanged"],currentHeight:["dimensionChanged"],currentWidth:["dimensionChanged"]}}};o.style=":host { display: block }";const r=class{constructor(i){t(this,i)}animated=!0;render(){return a(n,{key:"fcfda9d2eb69c98089f410f30087a5cc773b4dd7",class:"nano-skeleton"},a("div",{key:"6f489367c6e9a366d8fc4290244141a8a0b1c4d8",class:{skeleton:!0,animate:this.animated}},a("div",{key:"d54f326dd7e8d181702d6ab16ca08c6c88c654e0",class:"skeleton__indicator"}," ")))}};r.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{--base-color-rgb:var(--nano-skeleton-rgb, 228 230 232);--color:var(--nano-skeleton-color, rgb(var(--base-color-rgb) / 100%));--tint:var(--nano-skeleton-tint, rgb(var(--base-color-rgb) / 50%));display:block;position:relative;border-radius:0.25rem;min-block-size:1em;line-height:inherit}.skeleton{display:flex;min-inline-size:100%;min-block-size:100%;border-radius:inherit;line-height:inherit}.skeleton__indicator{flex:1 1 auto;background:var(--color);border-radius:inherit;line-height:inherit}.skeleton.animate .skeleton__indicator{background:linear-gradient(270deg, var(--tint), var(--color), var(--color), var(--tint));background-size:400% 100%;animation:loader 6s ease-in-out infinite}@keyframes loader{0%{background-position:200% 0}100%{background-position:-200% 0}}";export{o as nano_resize_observe,r as nano_skeleton}

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

@@ -1,4 +1,4 @@
 /*!
  * Custom elements for Nanopore-Digital Web applications
  */
-import{r as t,c as e,d as o}from"./index-CFYZ-ZOT.js";import{h as i}from"./renderer-LJzCFyMt.js";const n=class{constructor(o){t(this,o),this.nanoSlideReady=e(this,"nanoSlideReady",7)}nanoSlideReady;ready=null;readyChange(t,e){void 0!==e&&!1===e&&!0===t&&this.nanoSlideReady.emit()}componentDidLoad(){"boolean"!=typeof this.ready&&setTimeout((()=>{this.nanoSlideReady.emit(),this.ready=!0}))}render(){return i(o,{key:"6d319ed9290a227544d3a2ad2e8ad42be30c73a6",class:"nano-slide"},i("slot",{key:"d8670dbaab37a0c50b5991136271e6b9b6b79e34"}))}static get watchers(){return{ready:["readyChange"]}}};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:flex;align-items:center;justify-content:center;inline-size:100%;min-block-size:100%;font-size:18px;text-align:center;box-sizing:border-box;overflow:hidden;transition:opacity 0.2s;opacity:0;flex-direction:column}:host([ready]){opacity:1}:host(:not([ready])){flex:1 0 auto}";export{n as nano_slide}
+import{r as t,c as e,d as o}from"./index-DXvE-U_j.js";import{h as i}from"./renderer-BUaAsDso.js";const a=class{constructor(o){t(this,o),this.nanoSlideReady=e(this,"nanoSlideReady",7)}nanoSlideReady;ready=null;readyChange(t,e){void 0!==e&&!1===e&&!0===t&&this.nanoSlideReady.emit()}componentDidLoad(){"boolean"!=typeof this.ready&&setTimeout((()=>{this.nanoSlideReady.emit(),this.ready=!0}))}render(){return i(o,{key:"6d319ed9290a227544d3a2ad2e8ad42be30c73a6",class:"nano-slide"},i("slot",{key:"d8670dbaab37a0c50b5991136271e6b9b6b79e34"}))}static get watchers(){return{ready:["readyChange"]}}};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{display:flex;align-items:center;justify-content:center;inline-size:100%;min-block-size:100%;font-size:18px;text-align:center;box-sizing:border-box;overflow:hidden;transition:opacity 0.2s;opacity:0;flex-direction:column}:host([ready]){opacity:1}:host(:not([ready])){flex:1 0 auto}";export{a as nano_slide}