npm - @nanoporetech-digital/components - Versions diffs - 2.9.0 → 2.10.0 - Mend

@nanoporetech-digital/components 2.9.0 → 2.10.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (473) hide show

package/dist/nano-components/{p-730f60ea.entry.js → p-6ddb51e4.entry.js} RENAMED Viewed

@@ -1,5 +1,5 @@
 /*!
  * Web Components for Nanopore digital Web Apps
  */
-import{r as o,c as a,h as i,e as t,g as e}from"./p-ab5813a7.js";import{l as s,u as r}from"./p-1805d59a.js";import{M as n}from"./p-cb79d1ec.js";import{h as l}from"./p-8971a867.js";import{C as d}from"./p-5a0095f9.js";import"./p-b619500f.js";import"./p-9a385481.js";import"./p-69a3e911.js";import"./p-1da5f8df.js";const h=":host{-webkit-box-sizing:border-box;box-sizing:border-box}*,*::before,*::after{-webkit-box-sizing:border-box;box-sizing:border-box}[hidden]{display:none !important}:host{--border-radius:var(--nano-layer-border-radius, var(--nano-border-radius-medium, 4px));--content-background:#fafafa;--footer-content:#e4e6e8;--scrim-color:var(--nano-layer-overlay-dark, rgba(74, 74, 74, .5));--box-shadow:var(--nano-layer-shadow-large, 0 2px 8px rgba(0, 0, 0, 0.2));--close-button-color:#b5aea7;--width:60rem;--tint-color:#00607b;--body-padding-v:var(--nano-spacing-large, 20px);--body-padding-h:var(--nano-spacing-large, 20px);--header-padding-v:var(--nano-spacing-medium, 16px);--header-padding-h:var(--nano-spacing-large, 20px);--footer-padding-v:var(--nano-spacing-medium, 16px);--footer-padding-h:var(--nano-spacing-large, 20px)}.dialog{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;position:fixed;top:0;right:0;bottom:0;left:0;z-index:var(--nano-layer-index-modal, 700)}.dialog:not(.dialog--visible){position:absolute;width:1px;height:1px;clip:rect(0 0 0 0);-webkit-clip-path:inset(50%);clip-path:inset(50%);overflow:hidden;pointer-events:none;visibility:hidden}.dialog__panel{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;z-index:2;width:var(--width);max-width:calc(100% - var(--nano-spacing-xlarge, 24px));max-height:calc(92% - var(--nano-spacing-xlarge, 24px));background-color:var(--content-background);border-radius:var(--border-radius);-webkit-box-shadow:var(--box-shadow);box-shadow:var(--box-shadow);opacity:0;-webkit-transform:scale(0.8);transform:scale(0.8);-webkit-transition:var(--nano-transition-fast, 0.3s) opacity, var(--nano-transition-fast, 0.3s) transform;transition:var(--nano-transition-fast, 0.3s) opacity, var(--nano-transition-fast, 0.3s) transform}.dialog__panel:focus{outline:none}.dialog--with-ribbon .dialog__panel{border-top:5px solid var(--tint-color)}.dialog--open .dialog__panel{display:-webkit-box;display:-ms-flexbox;display:flex;opacity:1;-webkit-transform:none;transform:none}.dialog--nodismiss .dialog__panel{-webkit-animation:cannotClose 0.25s ease-in-out 1;animation:cannotClose 0.25s ease-in-out 1}@-webkit-keyframes cannotClose{0%{-webkit-transform:scale(1);transform:scale(1)}50%{-webkit-transform:scale(1.08);transform:scale(1.08)}100%{-webkit-transform:scale(1);transform:scale(1)}}@keyframes cannotClose{0%{-webkit-transform:scale(1);transform:scale(1)}50%{-webkit-transform:scale(1.08);transform:scale(1.08)}100%{-webkit-transform:scale(1);transform:scale(1)}}.dialog__header{-webkit-box-flex:0;-ms-flex:0 0 auto;flex:0 0 auto;display:-webkit-box;display:-ms-flexbox;display:flex;min-width:var(--width);width:100%;background-color:var(--content-background);border-radius:var(--border-radius) var(--border-radius) 0 0;-webkit-transition:var(--nano-transition-fast, 0.1s) box-shadow;transition:var(--nano-transition-fast, 0.1s) box-shadow}.dialog--visible .dialog__header{min-width:auto}[stuck] .dialog__header{-webkit-box-shadow:var(--nano-layer-shadow-medium, 0 2px 4px rgba(0, 0, 0, 0.2));box-shadow:var(--nano-layer-shadow-medium, 0 2px 4px rgba(0, 0, 0, 0.2))}.dialog__title{-webkit-box-flex:1;-ms-flex:1 1 auto;flex:1 1 auto;font-size:var(--nano-fontsize-large, 1.25rem);line-height:1.6;padding:var(--header-padding-v) var(--header-padding-h)}.dialog .dialog__close-icon{-webkit-box-flex:0;-ms-flex:0 0 auto;flex:0 0 auto;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;font-size:var(--nano-fontsize-xlarge, 1.5rem);padding:0 var(--header-padding-h);--color:var(--close-button-color)}.dialog__body{padding:0 var(--body-padding-h) var(--body-padding-v)}.dialog:not(.dialog--has-header) .dialog__body{padding-top:var(--body-padding-v)}.dialog__body ::slotted(*){max-width:100%}.dialog__body-wrap{-webkit-box-flex:1;-ms-flex:1 1 auto;flex:1 1 auto;overflow:auto;-webkit-overflow-scrolling:touch;border-radius:var(--border-radius)}.dialog:not(.dialog--has-header) .dialog__body-wrap{border-radius:0 0 inherit inherit}.dialog:not(.dialog--has-footer) .dialog__body-wrap{border-radius:inherit inherit 0 0}.dialog__footer{width:100%;padding:var(--footer-padding-v) var(--footer-padding-h);background:var(--footer-content);border-radius:0 0 var(--border-radius) var(--border-radius);position:relative;top:1px}.dialog--visible .dialog__footer{min-width:auto}.dialog__footer ::slotted(button){margin-right:var(--nano-spacing-small, 8px) !important}.dialog:not(.dialog--has-footer) .dialog__footer{display:none}.dialog__close-txt{color:var(--tint-color);border:none;text-decoration:underline;margin:0;text-underline-offset:4px;background-color:transparent;font:inherit;-webkit-box-align:center;cursor:pointer;font-size:var(--nano-fontsize-small, 0.875rem);padding:0.5rem;border-radius:var(--nano-border-radius-small, 2px);-webkit-transition:-webkit-box-shadow 100ms ease-in-out;transition:-webkit-box-shadow 100ms ease-in-out;transition:box-shadow 100ms ease-in-out;transition:box-shadow 100ms ease-in-out, -webkit-box-shadow 100ms ease-in-out}.dialog__close-txt:focus{outline:none;-webkit-box-shadow:var(--nano-control-focus-shadow, 0 0 0 0.1875rem  var(--nano-control-focus-color, rgba(144, 198, 231, 0.8)));box-shadow:var(--nano-control-focus-shadow, 0 0 0 0.1875rem  var(--nano-control-focus-color, rgba(144, 198, 231, 0.8)))}.dialog__overlay{position:fixed;top:0;right:0;bottom:0;left:0;background-color:var(--scrim-color);opacity:0;-webkit-transition:var(--nano-transition-fast, 0.3s) opacity;transition:var(--nano-transition-fast, 0.3s) opacity;-webkit-backdrop-filter:blur(var(--nano-layer-overlay-blur, 3px));backdrop-filter:blur(var(--nano-layer-overlay-blur, 3px))}.dialog--open .dialog__overlay{opacity:1}";let b=0;let c=class{constructor(i){o(this,i);this.nanoShow=a(this,"nanoShow",7);this.nanoAfterShow=a(this,"nanoAfterShow",7);this.nanoHide=a(this,"nanoHide",7);this.nanoAfterHide=a(this,"nanoAfterHide",7);this.nanoInitialFocus=a(this,"nanoInitialFocus",7);this.nanoRequestClose=a(this,"nanoRequestClose",7);this.componentId=`dialog-${++b}`;this.willShow=false;this.willHide=false;this.addedTransEnd=false;this.isVisible=false;this.noDismiss=false;this.hasFooter=false;this.showRibbon=true;this.open=false;this.noHeader=false;this.noFooter=false;this.noUserDismiss=false;this.storeMethod="url-hash";this.handleKeyDown=o=>{if(o.key==="Escape"){this.requestClose()}};this.requestClose=()=>{const o=this.nanoRequestClose.emit();if(!o.defaultPrevented&&!this.noUserDismiss){this.hide()}else{this.noDismiss=true;setTimeout((o=>this.noDismiss=false),250)}};this.handleTransitionEnd=o=>{if(o.propertyName==="opacity"&&o.composedPath().find((o=>o===this.panel||o===this.overlay))){this.isVisible=this.open;this.willShow=false;this.willHide=false;this.open?this.nanoAfterShow.emit():this.nanoAfterHide.emit()}};this.handleSlotChange=()=>{this.hasFooter=l(this.host,"footer")}}handleOpenChange(){this.open?this.show():this.hide()}async show(){if(this.willShow){return}const o=this.nanoShow.emit();if(o.defaultPrevented){this.open=false;return}this.originalTrigger=document.activeElement;this.willShow=true;this.isVisible=true;this.open=true;this.modal.activate();s(this.host);if(this.open){this.host.addEventListener("nanoAfterShow",(()=>{const o=this.nanoInitialFocus.emit();if(!o.defaultPrevented){this.panel.focus({preventScroll:true})}}),{once:true})}}async hide(){if(this.willHide){return}const o=this.nanoHide.emit();if(o.defaultPrevented){this.open=true;return}this.willHide=true;this.open=false;this.modal.deactivate();r(this.host);this.stopVideos();const a=this.originalTrigger;if(a&&typeof a.focus==="function"){setTimeout((()=>a.focus()))}}stopVideos(){var o=Array.from(this.host.querySelectorAll("iframe,video"));o.forEach((o=>{if(o.tagName.toLowerCase()==="video")o.pause();else{const a=o.src;o.src=a}}))}connectedCallback(){this.modal=new n(this.host);if(this.panel){this.addedTransEnd=true;this.panel.addEventListener("transitionend",this.handleTransitionEnd)}}componentWillLoad(){this.handleSlotChange();if(this.open)this.show();if(this.storeId)d.init(this,["open"],this.storeMethod,this.storeId)}componentDidLoad(){if(!this.addedTransEnd){this.panel.addEventListener("transitionend",this.handleTransitionEnd)}}disconnectedCallback(){r(this.host);this.addedTransEnd=false;this.panel.removeEventListener("transitionend",this.handleTransitionEnd)}render(){return i(t,{showing:this.isVisible?true:undefined},i("div",{part:"base",class:{dialog:true,"dialog--open":this.open,"dialog--visible":this.isVisible,"dialog--has-footer":!this.noFooter,"dialog--has-header":!this.noHeader,"dialog--nodismiss":this.noDismiss,"dialog--with-ribbon":this.showRibbon},onKeyDown:this.handleKeyDown},i("div",{part:"overlay",class:"dialog__overlay",ref:o=>this.overlay=o,onClick:this.requestClose}),i("div",{ref:o=>this.panel=o,part:"panel",class:"dialog__panel",role:"dialog","aria-modal":"true","aria-hidden":this.open?"false":"true","aria-label":this.noHeader?this.label:null,"aria-labelledby":!this.noHeader?`${this.componentId}-title`:null,tabIndex:0},i("div",{class:"dialog__body-wrap"},!this.noHeader&&i("nano-sticker",null,i("header",{part:"header",class:"dialog__header"},i("span",{part:"title",class:"dialog__title",id:`${this.componentId}-title`},i("slot",{name:"label"},this.label||String.fromCharCode(65279))),!this.noUserDismiss&&i("nano-icon-button",{exportparts:"base:close-button",class:"dialog__close-icon",label:"close dialog",onClick:this.requestClose,iconName:"light/times"}))),i("div",{part:"body",class:"dialog__body"},i("slot",null)),!this.noFooter&&(this.hasFooter||!this.noUserDismiss)&&i("nano-sticker",{position:"bottom"},i("footer",{part:"footer",class:"dialog__footer"},i("slot",{name:"footer",onSlotchange:this.handleSlotChange}),!this.noUserDismiss&&i("button",{class:"dialog__close-txt",onClick:this.requestClose},"Close")))))))}get host(){return e(this)}static get watchers(){return{open:["handleOpenChange"]}}};c.style=h;export{c as nano_dialog};
-//# sourceMappingURL=p-730f60ea.entry.js.map
+import{r as i,c as o,h as a,e as t,g as e}from"./p-b5c33aff.js";import{l as s,u as r}from"./p-1805d59a.js";import{M as n}from"./p-cb79d1ec.js";import{h as l}from"./p-8971a867.js";import{C as d}from"./p-32f4516e.js";import"./p-b619500f.js";import"./p-9a385481.js";import"./p-69a3e911.js";import"./p-1da5f8df.js";const h=":host{-webkit-box-sizing:border-box;box-sizing:border-box}*,*::before,*::after{-webkit-box-sizing:border-box;box-sizing:border-box}[hidden]{display:none !important}:host{--border-radius:var(--nano-layer-border-radius, var(--nano-border-radius-medium, 4px));--content-background:#fafafa;--footer-content:#e4e6e8;--scrim-color:var(--nano-layer-overlay-dark, rgba(74, 74, 74, .5));--box-shadow:var(--nano-layer-shadow-large, 0 2px 8px rgba(0, 0, 0, 0.2));--close-button-color:#b5aea7;--width:60rem;--tint-color:#00607b;--body-padding-v:var(--nano-spacing-large, 20px);--body-padding-h:var(--nano-spacing-large, 20px);--header-padding-v:var(--nano-spacing-medium, 16px);--header-padding-h:var(--nano-spacing-large, 20px);--footer-padding-v:var(--nano-spacing-medium, 16px);--footer-padding-h:var(--nano-spacing-large, 20px)}.dialog{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;position:fixed;top:0;right:0;bottom:0;left:0;z-index:var(--nano-layer-index-modal, 700)}.dialog:not(.dialog--visible){position:absolute;width:1px;height:1px;clip:rect(0 0 0 0);-webkit-clip-path:inset(50%);clip-path:inset(50%);overflow:hidden;pointer-events:none;visibility:hidden}.dialog__panel{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;z-index:2;width:var(--width);max-width:calc(100% - var(--nano-spacing-xlarge, 24px));max-height:calc(92% - var(--nano-spacing-xlarge, 24px));background-color:var(--content-background);border-radius:var(--border-radius);-webkit-box-shadow:var(--box-shadow);box-shadow:var(--box-shadow);opacity:0;-webkit-transform:scale(0.8);transform:scale(0.8);-webkit-transition:var(--nano-transition-fast, 0.3s) opacity, var(--nano-transition-fast, 0.3s) transform;transition:var(--nano-transition-fast, 0.3s) opacity, var(--nano-transition-fast, 0.3s) transform}.dialog__panel:focus{outline:none}.dialog--with-ribbon .dialog__panel{border-top:5px solid var(--tint-color)}.dialog--open .dialog__panel{display:-webkit-box;display:-ms-flexbox;display:flex;opacity:1;-webkit-transform:none;transform:none}.dialog--nodismiss .dialog__panel{-webkit-animation:cannotClose 0.25s ease-in-out 1;animation:cannotClose 0.25s ease-in-out 1}@-webkit-keyframes cannotClose{0%{-webkit-transform:scale(1);transform:scale(1)}50%{-webkit-transform:scale(1.08);transform:scale(1.08)}100%{-webkit-transform:scale(1);transform:scale(1)}}@keyframes cannotClose{0%{-webkit-transform:scale(1);transform:scale(1)}50%{-webkit-transform:scale(1.08);transform:scale(1.08)}100%{-webkit-transform:scale(1);transform:scale(1)}}.dialog__header{-webkit-box-flex:0;-ms-flex:0 0 auto;flex:0 0 auto;display:-webkit-box;display:-ms-flexbox;display:flex;min-width:var(--width);width:100%;background-color:var(--content-background);border-radius:var(--border-radius) var(--border-radius) 0 0;-webkit-transition:var(--nano-transition-fast, 0.1s) box-shadow;transition:var(--nano-transition-fast, 0.1s) box-shadow}.dialog--visible .dialog__header{min-width:auto}[stuck] .dialog__header{-webkit-box-shadow:var(--nano-layer-shadow-medium, 0 2px 4px rgba(0, 0, 0, 0.2));box-shadow:var(--nano-layer-shadow-medium, 0 2px 4px rgba(0, 0, 0, 0.2))}.dialog__title{-webkit-box-flex:1;-ms-flex:1 1 auto;flex:1 1 auto;font-size:var(--nano-fontsize-large, 1.25rem);line-height:1.6;padding:var(--header-padding-v) var(--header-padding-h)}.dialog .dialog__close-icon{-webkit-box-flex:0;-ms-flex:0 0 auto;flex:0 0 auto;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;font-size:var(--nano-fontsize-xlarge, 1.5rem);padding:0 var(--header-padding-h);--color:var(--close-button-color)}.dialog__body{padding:0 var(--body-padding-h) var(--body-padding-v)}.dialog:not(.dialog--has-header) .dialog__body{padding-top:var(--body-padding-v)}.dialog__body ::slotted(*){max-width:100%}.dialog__body-wrap{-webkit-box-flex:1;-ms-flex:1 1 auto;flex:1 1 auto;overflow:auto;-webkit-overflow-scrolling:touch;border-radius:var(--border-radius)}.dialog:not(.dialog--has-header) .dialog__body-wrap{border-radius:0 0 inherit inherit}.dialog:not(.dialog--has-footer) .dialog__body-wrap{border-radius:inherit inherit 0 0}.dialog__footer{width:100%;padding:var(--footer-padding-v) var(--footer-padding-h);background:var(--footer-content);border-radius:0 0 var(--border-radius) var(--border-radius);position:relative;top:1px}.dialog--visible .dialog__footer{min-width:auto}.dialog__footer ::slotted(button){margin-right:var(--nano-spacing-small, 8px) !important}.dialog:not(.dialog--has-footer) .dialog__footer{display:none}.dialog__close-txt{color:var(--tint-color);border:none;text-decoration:underline;margin:0;text-underline-offset:4px;background-color:transparent;font:inherit;-webkit-box-align:center;cursor:pointer;font-size:var(--nano-fontsize-small, 0.875rem);padding:0.5rem;border-radius:var(--nano-border-radius-small, 2px);-webkit-transition:-webkit-box-shadow 100ms ease-in-out;transition:-webkit-box-shadow 100ms ease-in-out;transition:box-shadow 100ms ease-in-out;transition:box-shadow 100ms ease-in-out, -webkit-box-shadow 100ms ease-in-out}.dialog__close-txt:focus{outline:none;-webkit-box-shadow:var(--nano-control-focus-shadow, 0 0 0 0.1875rem  var(--nano-control-focus-color, rgba(144, 198, 231, 0.8)));box-shadow:var(--nano-control-focus-shadow, 0 0 0 0.1875rem  var(--nano-control-focus-color, rgba(144, 198, 231, 0.8)))}.dialog__overlay{position:fixed;top:0;right:0;bottom:0;left:0;background-color:var(--scrim-color);opacity:0;-webkit-transition:var(--nano-transition-fast, 0.3s) opacity;transition:var(--nano-transition-fast, 0.3s) opacity;-webkit-backdrop-filter:blur(var(--nano-layer-overlay-blur, 3px));backdrop-filter:blur(var(--nano-layer-overlay-blur, 3px))}.dialog--open .dialog__overlay{opacity:1}";let b=0;let c=class{constructor(a){i(this,a);this.nanoShow=o(this,"nanoShow",7);this.nanoAfterShow=o(this,"nanoAfterShow",7);this.nanoHide=o(this,"nanoHide",7);this.nanoAfterHide=o(this,"nanoAfterHide",7);this.nanoInitialFocus=o(this,"nanoInitialFocus",7);this.nanoRequestClose=o(this,"nanoRequestClose",7);this.componentId=`dialog-${++b}`;this.willShow=false;this.willHide=false;this.addedTransEnd=false;this.isVisible=false;this.noDismiss=false;this.hasFooter=false;this.showRibbon=true;this.open=false;this.noHeader=false;this.noFooter=false;this.noUserDismiss=false;this.storeMethod="url-hash";this.hoist=false;this.handleKeyDown=i=>{if(i.key==="Escape"){this.requestClose()}};this.requestClose=()=>{const i=this.nanoRequestClose.emit();if(!i.defaultPrevented&&!this.noUserDismiss){this.hide()}else{this.noDismiss=true;setTimeout((i=>this.noDismiss=false),250)}};this.handleTransitionEnd=i=>{if(i.propertyName==="opacity"&&i.composedPath().find((i=>i===this.panel||i===this.overlay))){this.isVisible=this.open;this.willShow=false;this.willHide=false;this.open?this.nanoAfterShow.emit():this.nanoAfterHide.emit()}};this.handleSlotChange=()=>{this.hasFooter=l(this.host,"footer")}}handleOpenChange(){this.open?this.show():this.hide()}handleHoistChange(){if(!this.hoist||document.body.children[0]===this.host)return;document.body.prepend(this.host)}async show(){if(this.willShow){return}const i=this.nanoShow.emit();if(i.defaultPrevented){this.open=false;return}this.originalTrigger=document.activeElement;this.willShow=true;this.isVisible=true;this.open=true;this.modal.activate();s(this.host);if(this.open){this.host.addEventListener("nanoAfterShow",(()=>{const i=this.nanoInitialFocus.emit();if(!i.defaultPrevented){this.panel.focus({preventScroll:true})}}),{once:true})}}async hide(){if(this.willHide){return}const i=this.nanoHide.emit();if(i.defaultPrevented){this.open=true;return}this.willHide=true;this.open=false;this.modal.deactivate();r(this.host);this.stopVideos();const o=this.originalTrigger;if(o&&typeof o.focus==="function"){setTimeout((()=>o.focus()))}}stopVideos(){var i=Array.from(this.host.querySelectorAll("iframe,video"));i.forEach((i=>{if(i.tagName.toLowerCase()==="video")i.pause();else{const o=i.src;i.src=o}}))}connectedCallback(){this.handleHoistChange();this.modal=new n(this.host);if(this.panel){this.addedTransEnd=true;this.panel.addEventListener("transitionend",this.handleTransitionEnd)}}componentWillLoad(){this.handleSlotChange();if(this.open)this.show();if(this.storeId)d.init(this,["open"],this.storeMethod,this.storeId)}componentDidLoad(){if(!this.addedTransEnd){this.panel.addEventListener("transitionend",this.handleTransitionEnd)}}disconnectedCallback(){if(!this.panel)return;r(this.host);this.addedTransEnd=false;this.panel.removeEventListener("transitionend",this.handleTransitionEnd)}render(){return a(t,{showing:this.isVisible?true:undefined},a("div",{part:"base",class:{dialog:true,"dialog--open":this.open,"dialog--visible":this.isVisible,"dialog--has-footer":!this.noFooter,"dialog--has-header":!this.noHeader,"dialog--nodismiss":this.noDismiss,"dialog--with-ribbon":this.showRibbon},onKeyDown:this.handleKeyDown},a("div",{part:"overlay",class:"dialog__overlay",ref:i=>this.overlay=i,onClick:this.requestClose}),a("div",{ref:i=>this.panel=i,part:"panel",class:"dialog__panel",role:"dialog","aria-modal":"true","aria-hidden":this.open?"false":"true","aria-label":this.noHeader?this.label:null,"aria-labelledby":!this.noHeader?`${this.componentId}-title`:null,tabIndex:0},a("div",{class:"dialog__body-wrap"},!this.noHeader&&a("nano-sticker",null,a("header",{part:"header",class:"dialog__header"},a("span",{part:"title",class:"dialog__title",id:`${this.componentId}-title`},a("slot",{name:"label"},this.label||String.fromCharCode(65279))),!this.noUserDismiss&&a("nano-icon-button",{exportparts:"base:close-button",class:"dialog__close-icon",label:"close dialog",onClick:this.requestClose,iconName:"light/times"}))),a("div",{part:"body",class:"dialog__body"},a("slot",null)),!this.noFooter&&(this.hasFooter||!this.noUserDismiss)&&a("nano-sticker",{position:"bottom"},a("footer",{part:"footer",class:"dialog__footer"},a("slot",{name:"footer",onSlotchange:this.handleSlotChange}),!this.noUserDismiss&&a("button",{class:"dialog__close-txt",onClick:this.requestClose},"Close")))))))}get host(){return e(this)}static get watchers(){return{open:["handleOpenChange"],hoist:["handleHoistChange"]}}};c.style=h;export{c as nano_dialog};
+//# sourceMappingURL=p-6ddb51e4.entry.js.map

package/dist/nano-components/p-6ddb51e4.entry.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"sources":["src/components/dialog/dialog.scss?tag=nano-dialog&encapsulation=shadow","src/components/dialog/dialog.tsx"],"names":["dialogCss","id","Dialog","[object Object]","hostRef","this","componentId","willShow","willHide","addedTransEnd","isVisible","noDismiss","hasFooter","showRibbon","open","noHeader","noFooter","noUserDismiss","storeMethod","hoist","handleKeyDown","event","key","requestClose","nanoOverlayDismiss","nanoRequestClose","emit","defaultPrevented","hide","setTimeout","_","handleTransitionEnd","propertyName","composedPath","find","node","panel","overlay","nanoAfterShow","nanoAfterHide","handleSlotChange","hasSlot","host","show","document","body","children","prepend","nanoShow","originalTrigger","activeElement","modal","activate","lockBodyScrolling","addEventListener","nanoInitialFocus","focus","preventScroll","once","nanoHide","deactivate","unlockBodyScrolling","stopVideos","trigger","videos","Array","from","querySelectorAll","forEach","video","tagName","toLowerCase","pause","src","handleHoistChange","Modal","storeId","ComponentStore","init","removeEventListener","h","Host","showing","undefined","part","class","dialog","dialog--open","dialog--visible","dialog--has-footer","dialog--has-header","dialog--nodismiss","dialog--with-ribbon","onKeyDown","ref","el","onClick","role","aria-modal","aria-hidden","aria-label","label","aria-labelledby","tabIndex","name","String","fromCharCode","exportparts","iconName","position","onSlotchange"],"mappings":"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","sourcesContent":["@use 'sass:map';\n@use 'sass:list';\n\n@import '../../global/style/nano-theme/base';\n@import '../../global/style/nano-theme/colours';\n@import '../../global/style/nano-theme/layers';\n@import '../../global/style/nano-theme/form';\n\n/**\n * @prop --width: The preferred width of the dialog. Note that the dialog will shrink to accommodate smaller screens.\n * @prop --border-radius: defaults to #{$layer-border-radius};\n * @prop --content-background: defaults to #{$layer-bg-color};\n * @prop --footer-background: defaults to #{map.get($colors, celsius)};\n * @prop --box-shadow: defaults to $layer-shadow-xlarge;\n * @prop --close-button-color: defaults to #{map.get($colors, mediumgrey)};\n * @prop --scrim-color: overlay colour of alert display. Defaults to #{$layer-overlay-dark};\n * @prop --tint-color: colour used to highlight items in the dialog - top ribbon, bottom close button. Default #{map.get($colors, blue)};\n * @prop --width: defaults to 31rem;\n */\n:host {\n --border-radius: #{$layer-border-radius};\n --content-background: #fafafa;\n --footer-content: #{map.get($colors, lightgrey)};\n --scrim-color: #{$layer-overlay-dark};\n --box-shadow: #{$layer-shadow-large};\n --close-button-color: #{map.get($colors, palegrey)};\n --width: 60rem;\n --tint-color: #{darken(map.get($colors, blue), 5%)};\n --body-padding-v: #{$spacing-large};\n --body-padding-h: #{$spacing-large};\n --header-padding-v: #{$spacing-medium};\n --header-padding-h: #{$spacing-large};\n --footer-padding-v: #{$spacing-medium};\n --footer-padding-h: #{$spacing-large};\n}\n\n.dialog {\n $self: &;\n\n display: flex;\n align-items: center;\n justify-content: center;\n position: fixed;\n top: 0;\n right: 0;\n bottom: 0;\n left: 0;\n z-index: #{$layer-index-modal};\n\n &:not(.dialog--visible) {\n @include hidden;\n }\n\n &__panel {\n display: flex;\n flex-direction: column;\n z-index: 2;\n width: var(--width);\n max-width: calc(100% - #{$spacing-xlarge});\n max-height: calc(92% - #{$spacing-xlarge});\n background-color: var(--content-background);\n border-radius: var(--border-radius);\n box-shadow: var(--box-shadow);\n opacity: 0;\n transform: scale(0.8);\n transition: #{$transition-fast} opacity, #{$transition-fast} transform;\n\n &:focus {\n outline: none;\n }\n\n .dialog--with-ribbon & {\n border-top: 5px solid var(--tint-color);\n }\n\n .dialog--open & {\n display: flex;\n opacity: 1;\n transform: none;\n }\n\n .dialog--nodismiss & {\n animation: cannotClose 0.25s ease-in-out 1;\n\n @keyframes cannotClose {\n 0% {\n transform: scale(1);\n }\n\n 50% {\n transform: scale(1.08);\n }\n\n 100% {\n transform: scale(1);\n }\n }\n }\n }\n\n &__header {\n flex: 0 0 auto;\n display: flex;\n min-width: var(--width);\n width: 100%;\n background-color: var(--content-background);\n border-radius: var(--border-radius) var(--border-radius) 0 0;\n transition: #{$transition-xfast} box-shadow;\n\n .dialog--visible & {\n min-width: auto;\n }\n\n [stuck] & {\n box-shadow: #{$layer-shadow-medium};\n }\n }\n\n &__title {\n flex: 1 1 auto;\n font-size: #{$fontsize-large};\n line-height: 1.6;\n padding: var(--header-padding-v) var(--header-padding-h);\n }\n\n & &__close-icon {\n flex: 0 0 auto;\n display: flex;\n align-items: center;\n font-size: #{$fontsize-xlarge};\n padding: 0 var(--header-padding-h);\n\n --color: var(--close-button-color);\n }\n\n &__body {\n padding: 0 var(--body-padding-h) var(--body-padding-v);\n\n .dialog:not(.dialog--has-header) & {\n padding-top: var(--body-padding-v);\n }\n\n & ::slotted(*) {\n max-width: 100%;\n }\n\n &-wrap {\n flex: 1 1 auto;\n overflow: auto;\n -webkit-overflow-scrolling: touch;\n border-radius: var(--border-radius);\n\n .dialog:not(.dialog--has-header) & {\n border-radius: 0 0 inherit inherit;\n }\n\n .dialog:not(.dialog--has-footer) & {\n border-radius: inherit inherit 0 0;\n }\n }\n }\n\n &__footer {\n width: 100%;\n padding: var(--footer-padding-v) var(--footer-padding-h);\n background: var(--footer-content);\n border-radius: 0 0 var(--border-radius) var(--border-radius);\n position: relative;\n top: 1px;\n\n .dialog--visible & {\n min-width: auto;\n }\n\n ::slotted(button) {\n margin-right: #{$spacing-small} !important;\n }\n\n .dialog:not(.dialog--has-footer) & {\n display: none;\n }\n }\n\n &__close-txt {\n color: var(--tint-color);\n border: none;\n text-decoration: underline;\n margin: 0;\n text-underline-offset: 4px;\n background-color: transparent;\n font: inherit;\n -webkit-box-align: center;\n cursor: pointer;\n font-size: #{$fontsize-small};\n padding: 0.5rem;\n border-radius: #{$border-radius-small};\n transition: box-shadow 100ms ease-in-out;\n\n &:focus {\n outline: none;\n box-shadow: #{$control-focus-style};\n }\n }\n\n &__overlay {\n position: fixed;\n top: 0;\n right: 0;\n bottom: 0;\n left: 0;\n background-color: var(--scrim-color);\n opacity: 0;\n transition: #{$transition-fast} opacity;\n backdrop-filter: blur(#{$layer-overlay-blur});\n\n .dialog--open & {\n opacity: 1;\n }\n }\n}\n","import {\n Component,\n Element,\n Event,\n EventEmitter,\n Method,\n Prop,\n State,\n Watch,\n h,\n Host,\n ComponentInterface,\n} from '@stencil/core';\nimport { lockBodyScrolling, unlockBodyScrolling } from '../../utils/scroll';\nimport Modal from '../../utils/modal';\nimport { hasSlot } from '../../utils';\nimport {\n ComponentStore,\n StorageMethods,\n} from '../../utils/store/component-store';\n\nlet id = 0;\n\n/**\n * Dialogs, sometimes called \"modals\", appear above the page and require the user's immediate attention.\n *\n * @slot - The dialog's content.\n * @slot label - The dialog's label. Alternatively, you can use the label prop.\n * @slot footer - The dialog's footer, usually one or more buttons representing various options.\n */\n@Component({\n tag: 'nano-dialog',\n styleUrl: 'dialog.scss',\n shadow: true,\n})\nexport class Dialog implements ComponentInterface {\n private componentId = `dialog-${++id}`;\n private modal: Modal;\n private panel: HTMLElement;\n private willShow = false;\n private willHide = false;\n private originalTrigger: HTMLElement | null;\n private overlay: HTMLElement;\n private addedTransEnd = false;\n\n @Element() host: HTMLNanoDialogElement;\n @State() isVisible = false;\n @State() noDismiss = false;\n @State() hasFooter = false;\n\n /** Show a colour ribbon at the top of the modal */\n @Prop() showRibbon = true;\n\n /** Indicates whether or not the dialog is open. You can use this in lieu of the show/hide methods. */\n @Prop({ mutable: true, reflect: true }) open = false;\n\n @Watch('open')\n handleOpenChange() {\n this.open ? this.show() : this.hide();\n }\n\n /** The dialog's label as displayed in the header. You should always include a relevant\n * label even when using `no-header`, as it is required for proper accessibility. */\n @Prop() label!: string;\n\n /** Set to true to disable the header. This will also remove the default close button,\n * so please ensure you provide an easy, accessible way for users to dismiss the dialog. */\n @Prop() noHeader = false;\n\n /** Set to true to disable the footer. This will also remove the footer close button,\n * so please ensure you provide an easy, accessible way for users to dismiss the dialog. */\n @Prop() noFooter = false;\n\n /** An alternative to `preventDefault()` on the `nanoRequestClose` event. This will hide the close button and disable clicks on the overlay or presses the `Escape` key */\n @Prop() noUserDismiss = false;\n\n /** Store search queries (against this ID) to the component store. Use in conjunction with storeMethod */\n @Prop() storeId?: string;\n\n /** The method of storage. Either session storage, url hash (after the '#') or url query (after the '?'). */\n @Prop() storeMethod: StorageMethods = 'url-hash';\n\n /** Relocate the dialog to the root of the DOM. Useful for elements bound via css `transform: ...` */\n @Prop() hoist = false;\n\n @Watch('hoist')\n handleHoistChange() {\n if (!this.hoist || document.body.children[0] === this.host) return;\n document.body.prepend(this.host);\n }\n\n /** Emitted when the dialog opens. Calling `event.preventDefault()` will prevent it from being opened. */\n @Event() nanoShow: EventEmitter;\n\n /** Emitted after the dialog opens and all transitions are complete. */\n @Event() nanoAfterShow: EventEmitter;\n\n /** Emitted when the dialog closes. Calling `event.preventDefault()` will prevent it from being closed. */\n @Event() nanoHide: EventEmitter;\n\n /** Emitted after the dialog closes and all transitions are complete. */\n @Event() nanoAfterHide: EventEmitter;\n\n /** Emitted when the dialog opens and the panel gains focus. Calling `event.preventDefault()` will prevent\n * focus and allow you to set it on a different element in the dialog, such as an input or button. */\n @Event() nanoInitialFocus: EventEmitter;\n\n /** Emitted when the user clicks the close button, clicks the overlay, or presses the `Escape` key. Calling `event.preventDefault()` will prevent the dialog from closing. */\n @Event() nanoRequestClose: EventEmitter;\n\n /** Shows the dialog */\n @Method()\n async show() {\n if (this.willShow) {\n return;\n }\n\n const nanoShow = this.nanoShow.emit();\n if (nanoShow.defaultPrevented) {\n this.open = false;\n return;\n }\n\n this.originalTrigger = document.activeElement as HTMLElement;\n this.willShow = true;\n this.isVisible = true;\n this.open = true;\n this.modal.activate();\n\n lockBodyScrolling(this.host);\n\n if (this.open) {\n // Wait for the next frame before setting initial focus so the dialog is technically visible\n this.host.addEventListener(\n 'nanoAfterShow',\n () => {\n const nanoInitialFocus = this.nanoInitialFocus.emit();\n if (!nanoInitialFocus.defaultPrevented) {\n this.panel.focus({ preventScroll: true });\n }\n },\n { once: true }\n );\n }\n }\n\n /** Hides the dialog */\n @Method()\n async hide() {\n if (this.willHide) {\n return;\n }\n\n const nanoHide = this.nanoHide.emit();\n if (nanoHide.defaultPrevented) {\n this.open = true;\n return;\n }\n\n this.willHide = true;\n this.open = false;\n this.modal.deactivate();\n unlockBodyScrolling(this.host);\n this.stopVideos();\n\n // Restore focus to the original trigger\n const trigger = this.originalTrigger;\n if (trigger && typeof trigger.focus === 'function') {\n setTimeout(() => trigger.focus());\n }\n }\n\n private handleKeyDown = (event: KeyboardEvent) => {\n if (event.key === 'Escape') {\n this.requestClose();\n }\n };\n\n private requestClose = () => {\n const nanoOverlayDismiss = this.nanoRequestClose.emit();\n\n if (!nanoOverlayDismiss.defaultPrevented && !this.noUserDismiss) {\n this.hide();\n } else {\n this.noDismiss = true;\n setTimeout((_) => (this.noDismiss = false), 250);\n }\n };\n\n private handleTransitionEnd = (event: TransitionEvent) => {\n if (\n event.propertyName === 'opacity' &&\n event\n .composedPath()\n .find((node) => node === this.panel || node === this.overlay)\n ) {\n // Ensure we only emit one event when the target element is no longer visible\n this.isVisible = this.open;\n this.willShow = false;\n this.willHide = false;\n this.open ? this.nanoAfterShow.emit() : this.nanoAfterHide.emit();\n }\n };\n\n private handleSlotChange = () => {\n this.hasFooter = hasSlot(this.host, 'footer');\n };\n\n private stopVideos() {\n var videos: (HTMLVideoElement | HTMLIFrameElement)[] = Array.from(\n this.host.querySelectorAll('iframe,video')\n );\n videos.forEach((video) => {\n if (video.tagName.toLowerCase() === 'video')\n (video as HTMLVideoElement).pause();\n else {\n const src = video.src;\n video.src = src;\n }\n });\n }\n\n connectedCallback() {\n this.handleHoistChange();\n this.modal = new Modal(this.host);\n if (this.panel) {\n this.addedTransEnd = true;\n this.panel.addEventListener('transitionend', this.handleTransitionEnd);\n }\n }\n\n componentWillLoad() {\n this.handleSlotChange();\n // Show on init if open\n if (this.open) this.show();\n if (this.storeId)\n ComponentStore.init(this, ['open'], this.storeMethod, this.storeId);\n }\n\n componentDidLoad() {\n if (!this.addedTransEnd) {\n this.panel.addEventListener('transitionend', this.handleTransitionEnd);\n }\n }\n\n disconnectedCallback() {\n if (!this.panel) return;\n unlockBodyScrolling(this.host);\n this.addedTransEnd = false;\n this.panel.removeEventListener('transitionend', this.handleTransitionEnd);\n }\n\n render() {\n return (\n <Host showing={this.isVisible ? true : undefined}>\n <div\n part=\"base\"\n class={{\n dialog: true,\n 'dialog--open': this.open,\n 'dialog--visible': this.isVisible,\n 'dialog--has-footer': !this.noFooter,\n 'dialog--has-header': !this.noHeader,\n 'dialog--nodismiss': this.noDismiss,\n 'dialog--with-ribbon': this.showRibbon,\n }}\n onKeyDown={this.handleKeyDown}\n >\n <div\n part=\"overlay\"\n class=\"dialog__overlay\"\n ref={(el) => (this.overlay = el)}\n onClick={this.requestClose}\n />\n\n <div\n ref={(el) => (this.panel = el)}\n part=\"panel\"\n class=\"dialog__panel\"\n role=\"dialog\"\n aria-modal=\"true\"\n aria-hidden={this.open ? 'false' : 'true'}\n aria-label={this.noHeader ? this.label : null}\n aria-labelledby={\n !this.noHeader ? `${this.componentId}-title` : null\n }\n tabIndex={0}\n >\n <div class=\"dialog__body-wrap\">\n {!this.noHeader && (\n <nano-sticker>\n <header part=\"header\" class=\"dialog__header\">\n <span\n part=\"title\"\n class=\"dialog__title\"\n id={`${this.componentId}-title`}\n >\n <slot name=\"label\">\n {/* If there's no label, use an invisible character to prevent the heading from collapsing */}\n {this.label || String.fromCharCode(65279)}\n </slot>\n </span>\n {!this.noUserDismiss && (\n <nano-icon-button\n exportparts=\"base:close-button\"\n class=\"dialog__close-icon\"\n label=\"close dialog\"\n onClick={this.requestClose}\n iconName=\"light/times\"\n />\n )}\n </header>\n </nano-sticker>\n )}\n <div part=\"body\" class=\"dialog__body\">\n <slot />\n </div>\n {!this.noFooter && (this.hasFooter || !this.noUserDismiss) && (\n <nano-sticker position=\"bottom\">\n <footer part=\"footer\" class=\"dialog__footer\">\n <slot name=\"footer\" onSlotchange={this.handleSlotChange} />\n {!this.noUserDismiss && (\n <button\n class=\"dialog__close-txt\"\n onClick={this.requestClose}\n >\n Close\n </button>\n )}\n </footer>\n </nano-sticker>\n )}\n </div>\n </div>\n </div>\n </Host>\n );\n }\n}\n"]}

package/dist/nano-components/p-71bbb7ba.entry.js ADDED Viewed

@@ -0,0 +1,5 @@
+/*!
+ * Web Components for Nanopore digital Web Apps
+ */
+import{k as t,j as s,r as i,c as e,h as n,e as r,g as h}from"./p-b5c33aff.js";const a=(t,s,i)=>{const e=t.get(s);if(!e){t.set(s,[i])}else if(!e.includes(i)){e.push(i)}};const o=(t,s)=>{let i;return(...e)=>{if(i){clearTimeout(i)}i=setTimeout((()=>{i=0;t(...e)}),s)}};const u=t=>!("isConnected"in t)||t.isConnected;const c=o((t=>{for(let s of t.keys()){t.set(s,t.get(s).filter(u))}}),2e3);const l=()=>{if(typeof t!=="function"){return{}}const i=new Map;return{dispose:()=>i.clear(),get:s=>{const e=t();if(e){a(i,s,e)}},set:t=>{const e=i.get(t);if(e){i.set(t,e.filter(s))}c(i)},reset:()=>{i.forEach((t=>t.forEach(s)));c(i)}}};const f=(t,s=((t,s)=>t!==s))=>{let i=new Map(Object.entries(t!==null&&t!==void 0?t:{}));const e={dispose:[],get:[],set:[],reset:[]};const n=()=>{i=new Map(Object.entries(t!==null&&t!==void 0?t:{}));e.reset.forEach((t=>t()))};const r=()=>{e.dispose.forEach((t=>t()));n()};const h=t=>{e.get.forEach((s=>s(t)));return i.get(t)};const a=(t,n)=>{const r=i.get(t);if(s(n,r,t)){i.set(t,n);e.set.forEach((s=>s(t,n,r)))}};const o=typeof Proxy==="undefined"?{}:new Proxy(t,{get(t,s){return h(s)},ownKeys(t){return Array.from(i.keys())},getOwnPropertyDescriptor(){return{enumerable:true,configurable:true}},has(t,s){return i.has(s)},set(t,s,i){a(s,i);return true}});const u=(t,s)=>{e[t].push(s);return()=>{d(e[t],s)}};const c=(s,i)=>{const e=u("set",((t,e)=>{if(t===s){i(e)}}));const n=u("reset",(()=>i(t[s])));return()=>{e();n()}};const l=(...t)=>{const s=t.reduce(((t,s)=>{if(s.set){t.push(u("set",s.set))}if(s.get){t.push(u("get",s.get))}if(s.reset){t.push(u("reset",s.reset))}if(s.dispose){t.push(u("dispose",s.dispose))}return t}),[]);return()=>s.forEach((t=>t()))};const f=t=>{const s=i.get(t);e.set.forEach((i=>i(t,s,s)))};return{state:o,get:h,set:a,on:u,onChange:c,use:l,dispose:r,reset:n,forceUpdate:f}};const d=(t,s)=>{const i=t.indexOf(s);if(i>=0){t[i]=t[t.length-1];t.length--}};const m=(t,s)=>{const i=f(t,s);i.use(l());return i};let b=class{constructor(t){i(this,t);this.nanoPayloadChange=e(this,"nanoPayloadChange",7);this.nanoSubmit=e(this,"nanoSubmit",7);this.nanoInvalid=e(this,"nanoInvalid",7);this.submitted=false;this.fields=[];this.internalValidate=false;this.validateOn="submitThenDirty";this.scrollToInvalid=true;this._dirty=false;this.handleStoreChange=async(t,s)=>{if(this.validateOn==="dirty"&&this.dirty){this.internalValidate=true;await this.validateAllFields();this._valid=this.activeForm.checkValidity();this.internalValidate=false}this.nanoPayloadChange.emit(this.store.state)};this.handleFieldChange=t=>{this._dirty=true;this.setFieldValue([t.target])};this.handleFormInvalid=async t=>{t.preventDefault();this._valid=false;if(this.internalValidate)return;if(this.validateOn==="submitThenDirty")this.validateOn="dirty";this.submitted=true;await this.validateAllFields();if(this.validateOn==="submit"){this.internalValidate=true;this._valid=this.activeForm.checkValidity();this.internalValidate=false;if(this._valid){this.submitForm();return}}this.scrollToFirstInvalid();this.nanoInvalid.emit()};this.handleSubmit=async t=>{t.preventDefault();if(this.validateOn==="submitThenDirty")this.validateOn="dirty";this.submitted=true;await this.validateAllFields();this.internalValidate=true;this._valid=this.activeForm.checkValidity();this.internalValidate=false;if(!this._valid){this.scrollToFirstInvalid();return}this.submitForm()}}userFormChange(){if(!!this.userForm)this.activeForm=this.userForm}get activeForm(){return this._activeForm}set activeForm(t){if(this._activeForm)this._activeForm.removeEventListener("invalid",this.handleFormInvalid,true);if(t)t.addEventListener("invalid",this.handleFormInvalid,true);this._activeForm=t}validateOnChange(){this.fields.forEach((t=>{if(t.tagName==="NANO-CHECKBOX"){const s=t.closest("nano-checkbox-group");if(s)s.validateOn=this.validateOn}else{t.validateOn=this.validateOn}}))}get dirty(){return this._dirty}get valid(){return this._valid}get payload(){return this.store.state}get showValidation(){return this.validateOn==="dirty"&&this.dirty||this.submitted}get validationState(){const t=[];this.fields.forEach((async s=>{const i=t.find((t=>t.name===s.name));if(i){i.validityMessage=s.validityMessage.length?s.validityMessage:i.validityMessage;if(!i.fields.find((t=>t===s)))i.fields.push(s);if(i.valid&&s.invalid)i.valid=false;return}t.push({fields:[s],name:s.name,valid:!s.invalid,value:this.store.state[s.name],dirty:false,validityMessage:s.validityMessage})}));return t}attachSlotObserver(){if(!!this.mo)return;const t=this.mo=new MutationObserver((t=>{const s=this.host.querySelector("form");if(s!==this.activeForm)this.activeForm=s;this.setupFields()}));t.observe(this.host,{childList:true,attributes:true,attributeFilter:["name"],subtree:true})}setupFields(){let t=Array.from(this.host.querySelectorAll(`\n        nano-input,\n        nano-select,\n        nano-file-upload,\n        nano-date-input,\n        nano-checkbox\n      `));t=t.filter((t=>!!t.name&&!!t.name.length));if(!t.filter((t=>!this.fields.includes(t))).length)return;this.fields=t;this.validateOnChange();this.setFieldValue(this.fields);this.nanoPayloadChange.emit(this.store.state)}setFieldValue(t){t.forEach((t=>{const s=t.name;if(!s.length)return;switch(t.tagName){case"NANO-CHECKBOX":let i=t;if(i.type==="radio"||i.type==="segment"||i.type==="segment-pill"){if(i.checked)this.store.state[s]=i.value;else if(!i.checked&&i.value===this.store.state[s])this.store.state[s]=""}else if(this.fields.filter((t=>t.name===s&&t.tagName==="NANO-CHECKBOX")).length>1){const t=Array.isArray(this.store.state[s])?this.store.state[s]:[];if(i.checked){if(!this.store.state[s].includes(i.value)){this.store.state[s]=[...t,i.value]}}else{this.store.state[s]=t.filter((t=>t!==i.value))}}else this.store.state[s]=i.value;break;case"NANO-FILE-UPLOAD":this.store.state[s]=t.files;break;default:this.store.state[s]=t.value;break}}))}async validate(t,s){if(!this.validation)return;const i=this.validation(t,s,this.store.state);if(!i)return;await Promise.all(Object.entries(i).map((async([t,s])=>{const i=this.fields.find((s=>s.name===t));let e=i;if(i.tagName==="NANO-CHECKBOX"){const t=i.closest("nano-checkbox-group");e=t||i}if(e.validityMessage===s.msg&&s.valid)await this.setFieldError(e,"");else if(!s.valid){await this.setFieldError(e,s.msg)}})))}async setFieldError(t,s){if(t["showError"])await t.showError(s);else await t.setError(s)}async validateAllFields(){await Object.entries(this.store.state).reduce((async(t,[s,i])=>{await t;await this.validate(s,i)}),undefined)}scrollToFirstInvalid(){if(!this.scrollToInvalid)return;setTimeout((()=>{const t=this.validationState.find((t=>!t.valid));if(!t)return;t.fields[0].scrollIntoView({behavior:"smooth",block:"nearest"})}),200)}submitForm(){const t=this.nanoSubmit.emit();if(t.defaultPrevented)return;this.activeForm.submit()}connectedCallback(){this.userForm=this.host.querySelector("form")}componentDidLoad(){requestAnimationFrame((()=>{this.store=m({});this.setupFields();this.attachSlotObserver();this.store.on("set",((t,s)=>this.handleStoreChange(t,s)));this.host.addEventListener("nanoChange",this.handleFieldChange);this.host.addEventListener("submit",this.handleSubmit)}))}disconnectedCallback(){if(this.mo)this.mo.disconnect();this.store.dispose();this.host.removeEventListener("nanoChange",this.handleFieldChange);this.host.removeEventListener("submit",this.handleSubmit);if(this.activeForm)this.activeForm.removeEventListener("invalid",this.handleFormInvalid,true)}render(){return n(r,null,this.userForm&&n("slot",null),!this.userForm&&n("form",{ref:t=>this.activeForm=t},n("slot",null)))}get host(){return h(this)}static get watchers(){return{userForm:["userFormChange"],validateOn:["validateOnChange"]}}};export{b as nano_field_validator};
+//# sourceMappingURL=p-71bbb7ba.entry.js.map

package/dist/nano-components/p-71bbb7ba.entry.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"sources":["node_modules/@stencil/store/dist/index.mjs","src/components/field-validator/field-validator.tsx"],"names":["appendToMap","map","propName","value","items","get","set","includes","push","debounce","fn","ms","timeoutId","args","clearTimeout","setTimeout","isConnected","maybeElement","cleanupElements","key","keys","filter","stencilSubscription","getRenderingRef","elmsToUpdate","Map","dispose","clear","elm","elements","forceUpdate","reset","forEach","elms","createObservableMap","defaultState","shouldUpdate","a","b","states","Object","entries","handlers","cb","oldValue","state","Proxy","[object Object]","_","Array","from","enumerable","configurable","has","on","eventName","callback","removeFromArray","onChange","unSet","newValue","unReset","use","subscriptions","unsubs","reduce","subscription","unsub","array","item","index","indexOf","length","createStore","FieldValidator","hostRef","this","submitted","fields","internalValidate","validateOn","scrollToInvalid","_dirty","handleStoreChange","async","_key","_newVal","dirty","validateAllFields","_valid","activeForm","checkValidity","nanoPayloadChange","emit","store","handleFieldChange","ev","setFieldValue","target","handleFormInvalid","preventDefault","submitForm","scrollToFirstInvalid","nanoInvalid","handleSubmit","e","userForm","_activeForm","form","removeEventListener","addEventListener","field","tagName","cbg","closest","valid","payload","showValidation","validationState","found","find","v","name","validityMessage","f","invalid","mo","MutationObserver","_entries","host","querySelector","setupFields","observe","childList","attributes","attributeFilter","subtree","querySelectorAll","validateOnChange","fieldName","type","checked","currentArr","isArray","files","newVal","validation","res","Promise","all","o","validityTarget","msg","setFieldError","showError","setError","memo","validate","undefined","invalidField","scrollIntoView","behavior","block","nanoSubmit","defaultPrevented","submit","requestAnimationFrame","attachSlotObserver","disconnect","h","Host","ref"],"mappings":"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","sourcesContent":["import { getRenderingRef, forceUpdate } from '@stencil/core';\n\nconst appendToMap = (map, propName, value) => {\n const items = map.get(propName);\n if (!items) {\n map.set(propName, [value]);\n }\n else if (!items.includes(value)) {\n items.push(value);\n }\n};\nconst debounce = (fn, ms) => {\n let timeoutId;\n return (...args) => {\n if (timeoutId) {\n clearTimeout(timeoutId);\n }\n timeoutId = setTimeout(() => {\n timeoutId = 0;\n fn(...args);\n }, ms);\n };\n};\n\n/**\n * Check if a possible element isConnected.\n * The property might not be there, so we check for it.\n *\n * We want it to return true if isConnected is not a property,\n * otherwise we would remove these elements and would not update.\n *\n * Better leak in Edge than to be useless.\n */\nconst isConnected = (maybeElement) => !('isConnected' in maybeElement) || maybeElement.isConnected;\nconst cleanupElements = debounce((map) => {\n for (let key of map.keys()) {\n map.set(key, map.get(key).filter(isConnected));\n }\n}, 2000);\nconst stencilSubscription = () => {\n if (typeof getRenderingRef !== 'function') {\n // If we are not in a stencil project, we do nothing.\n // This function is not really exported by @stencil/core.\n return {};\n }\n const elmsToUpdate = new Map();\n return {\n dispose: () => elmsToUpdate.clear(),\n get: (propName) => {\n const elm = getRenderingRef();\n if (elm) {\n appendToMap(elmsToUpdate, propName, elm);\n }\n },\n set: (propName) => {\n const elements = elmsToUpdate.get(propName);\n if (elements) {\n elmsToUpdate.set(propName, elements.filter(forceUpdate));\n }\n cleanupElements(elmsToUpdate);\n },\n reset: () => {\n elmsToUpdate.forEach((elms) => elms.forEach(forceUpdate));\n cleanupElements(elmsToUpdate);\n },\n };\n};\n\nconst createObservableMap = (defaultState, shouldUpdate = (a, b) => a !== b) => {\n let states = new Map(Object.entries(defaultState !== null && defaultState !== void 0 ? defaultState : {}));\n const handlers = {\n dispose: [],\n get: [],\n set: [],\n reset: [],\n };\n const reset = () => {\n states = new Map(Object.entries(defaultState !== null && defaultState !== void 0 ? defaultState : {}));\n handlers.reset.forEach((cb) => cb());\n };\n const dispose = () => {\n // Call first dispose as resetting the state would\n // cause less updates ;)\n handlers.dispose.forEach((cb) => cb());\n reset();\n };\n const get = (propName) => {\n handlers.get.forEach((cb) => cb(propName));\n return states.get(propName);\n };\n const set = (propName, value) => {\n const oldValue = states.get(propName);\n if (shouldUpdate(value, oldValue, propName)) {\n states.set(propName, value);\n handlers.set.forEach((cb) => cb(propName, value, oldValue));\n }\n };\n const state = (typeof Proxy === 'undefined'\n ? {}\n : new Proxy(defaultState, {\n get(_, propName) {\n return get(propName);\n },\n ownKeys(_) {\n return Array.from(states.keys());\n },\n getOwnPropertyDescriptor() {\n return {\n enumerable: true,\n configurable: true,\n };\n },\n has(_, propName) {\n return states.has(propName);\n },\n set(_, propName, value) {\n set(propName, value);\n return true;\n },\n }));\n const on = (eventName, callback) => {\n handlers[eventName].push(callback);\n return () => {\n removeFromArray(handlers[eventName], callback);\n };\n };\n const onChange = (propName, cb) => {\n const unSet = on('set', (key, newValue) => {\n if (key === propName) {\n cb(newValue);\n }\n });\n const unReset = on('reset', () => cb(defaultState[propName]));\n return () => {\n unSet();\n unReset();\n };\n };\n const use = (...subscriptions) => {\n const unsubs = subscriptions.reduce((unsubs, subscription) => {\n if (subscription.set) {\n unsubs.push(on('set', subscription.set));\n }\n if (subscription.get) {\n unsubs.push(on('get', subscription.get));\n }\n if (subscription.reset) {\n unsubs.push(on('reset', subscription.reset));\n }\n if (subscription.dispose) {\n unsubs.push(on('dispose', subscription.dispose));\n }\n return unsubs;\n }, []);\n return () => unsubs.forEach((unsub) => unsub());\n };\n const forceUpdate = (key) => {\n const oldValue = states.get(key);\n handlers.set.forEach((cb) => cb(key, oldValue, oldValue));\n };\n return {\n state,\n get,\n set,\n on,\n onChange,\n use,\n dispose,\n reset,\n forceUpdate,\n };\n};\nconst removeFromArray = (array, item) => {\n const index = array.indexOf(item);\n if (index >= 0) {\n array[index] = array[array.length - 1];\n array.length--;\n }\n};\n\nconst createStore = (defaultState, shouldUpdate) => {\n const map = createObservableMap(defaultState, shouldUpdate);\n map.use(stencilSubscription());\n return map;\n};\n\nexport { createObservableMap, createStore };\n","import {\n Component,\n Prop,\n h,\n Host,\n Element,\n ComponentInterface,\n State,\n Watch,\n Event,\n EventEmitter,\n} from '@stencil/core';\nimport { createStore, ObservableMap } from '@stencil/store';\n\ntype NanoFormEles =\n | HTMLNanoInputElement\n | HTMLNanoCheckboxElement\n | HTMLNanoSelectElement\n | HTMLNanoDateInputElement\n | HTMLNanoFileUploadElement;\ntype NanoEvent = CustomEvent & { target: NanoFormEles };\ninterface ValueStore {\n [key: string]: any;\n}\n\ninterface ValidationState {\n fields: NanoFormEles[];\n valid: boolean;\n validityMessage: string;\n dirty: boolean;\n name: string | number;\n value: any;\n}\n\n/**\n * A toolbox for `nano-...` form fields and form validation.\n *\n * - Easy to add validation accross field dependencies - e.g. \"When Field1 contains '123' Field2 must contain '456'\"\n * - Easy access to whole form and individual field validity states\n * - Easy access to form data payload\n * - Scroll to invalid field on submit\n */\n@Component({\n tag: 'nano-field-validator',\n})\nexport class FieldValidator implements ComponentInterface {\n // Internal State\n\n @Element() host: HTMLNanoFieldValidatorElement;\n @State() store: ObservableMap<ValueStore>;\n @State() userForm: HTMLFormElement;\n @State() submitted = false;\n @Watch('userForm')\n userFormChange() {\n if (!!this.userForm) this.activeForm = this.userForm;\n }\n\n private get activeForm() {\n return this._activeForm;\n }\n private set activeForm(form: HTMLFormElement) {\n if (this._activeForm)\n this._activeForm.removeEventListener(\n 'invalid',\n this.handleFormInvalid,\n true\n );\n if (form) form.addEventListener('invalid', this.handleFormInvalid, true);\n this._activeForm = form;\n }\n private _activeForm: HTMLFormElement;\n private mo: MutationObserver;\n private fields: NanoFormEles[] = [];\n // annoyingly, whenever we attempt to checkValidty it fires `invalid` events.\n // this is used to prevent infinite loops / multiple calls\n private internalValidate = false;\n\n // Public API\n\n /** When should the fields perform validation. Will override / sync all nested `nano-...` controls */\n @Prop({ mutable: true }) validateOn?: 'dirty' | 'submit' | 'submitThenDirty' =\n 'submitThenDirty';\n\n /** Sync up validateOn with all fields */\n @Watch('validateOn')\n validateOnChange() {\n this.fields.forEach((field) => {\n if (field.tagName === 'NANO-CHECKBOX') {\n const cbg = field.closest('nano-checkbox-group');\n if (cbg) cbg.validateOn = this.validateOn;\n } else {\n (field as Exclude<NanoFormEles, HTMLNanoCheckboxElement>).validateOn =\n this.validateOn;\n }\n });\n }\n\n /** Tries to scroll to the first invalid field on submit */\n @Prop() scrollToInvalid = true;\n\n /** Returns true if any nested fields have been changed @readonly */\n @Prop({ reflect: true })\n get dirty() {\n return this._dirty;\n }\n @State() _dirty = false;\n\n /** Returns true if all the nested fields are currently valid @readonly */\n @Prop({ reflect: true })\n get valid() {\n return this._valid;\n }\n @State() _valid: boolean;\n\n /** The current form payload as a reactive store. @readonly */\n @Prop()\n get payload() {\n return this.store.state;\n }\n\n /** Returns true if validation errors will be displayed to the user */\n @Prop()\n get showValidation() {\n return (this.validateOn === 'dirty' && this.dirty) || this.submitted;\n }\n\n /** Get the current validation state of all form fields. @readonly\n * ```\n {\n fields: NanoFormEles[];\n valid: boolean;\n validityMessage: string;\n dirty: boolean;\n name: string | number;\n value: any;\n }[]\n ```\n */\n @Prop() get validationState(): ValidationState[] {\n const validationState: ValidationState[] = [];\n\n this.fields.forEach(async (field) => {\n const found = validationState.find((v) => v.name === field.name);\n\n if (found) {\n found.validityMessage = field.validityMessage.length\n ? field.validityMessage\n : found.validityMessage;\n if (!found.fields.find((f) => f === field)) found.fields.push(field);\n if (found.valid && field.invalid) found.valid = false;\n return;\n }\n\n validationState.push({\n fields: [field],\n name: field.name,\n valid: !field.invalid,\n value: this.store.state[field.name],\n dirty: false,\n validityMessage: field.validityMessage,\n });\n });\n return validationState;\n }\n\n /** A validation callback method.\n * @param field - The field name currently being evaluated\n * @param value - The value of the field currently being evaluated\n * @param fields - an array of all currently observered form fields and values\n * @returns field names mapped to an object of status message and validity e.g.\n * ```js\n * {field1: {msg: `This is invalid!`}, field2: {msg: `This is valid!`, valid: true}}\n * ```\n */\n @Prop() validation: (\n field: string,\n value: string,\n fields: ValueStore\n ) => { [key: string]: { msg: string; valid?: boolean } };\n\n /** Fired whenever the payload changes */\n @Event() nanoPayloadChange: EventEmitter<ValueStore>;\n\n /**\n * Fired on valid form submission.\n * Note: if you wish to prevent a form from submitting, instead\n * of using / preventing the native `submit` event, use this event\n * ```js\n * ele.addEventListener('nanoSubmit', (e) => {\n * e.preventDefault()\n * })\n * ```\n */\n @Event() nanoSubmit: EventEmitter;\n\n /** Fire on invalid form submission attempt */\n @Event() nanoInvalid: EventEmitter;\n\n // private methods\n\n private attachSlotObserver() {\n if (!!this.mo) return;\n const mo = (this.mo = new MutationObserver((_entries) => {\n const form = this.host.querySelector('form');\n if (form !== this.activeForm) this.activeForm = form;\n this.setupFields();\n }));\n mo.observe(this.host, {\n childList: true,\n attributes: true,\n attributeFilter: ['name'],\n subtree: true,\n });\n }\n\n /** Checks for new `nano-...` fields and adds them to our watch array and value store */\n private setupFields() {\n let fields = Array.from(\n this.host.querySelectorAll<NanoFormEles>(`\n nano-input,\n nano-select,\n nano-file-upload,\n nano-date-input,\n nano-checkbox\n `)\n );\n fields = fields.filter((f) => !!f.name && !!f.name.length);\n\n // do we have any currently un-watched fields?\n if (!fields.filter((f) => !this.fields.includes(f)).length) return;\n\n // setup the initial store state / refresh on new fields\n this.fields = fields;\n this.validateOnChange();\n this.setFieldValue(this.fields);\n this.nanoPayloadChange.emit(this.store.state);\n }\n\n /** Loops through all `nano-...` fields and extracts their values into our store */\n private setFieldValue(fields: NanoFormEles[]) {\n fields.forEach((field) => {\n const fieldName = field.name;\n if (!fieldName.length) return;\n\n switch (field.tagName) {\n case 'NANO-CHECKBOX':\n let cb = field as HTMLNanoCheckboxElement;\n if (\n cb.type === 'radio' ||\n cb.type === 'segment' ||\n cb.type === 'segment-pill'\n ) {\n if (cb.checked) this.store.state[fieldName] = cb.value;\n else if (!cb.checked && cb.value === this.store.state[fieldName])\n this.store.state[fieldName] = '';\n } else if (\n this.fields.filter(\n (f) => f.name === fieldName && f.tagName === 'NANO-CHECKBOX'\n ).length > 1\n ) {\n const currentArr = Array.isArray(this.store.state[fieldName])\n ? this.store.state[fieldName]\n : [];\n if (cb.checked) {\n if (!this.store.state[fieldName].includes(cb.value)) {\n this.store.state[fieldName] = [...currentArr, cb.value];\n }\n } else {\n this.store.state[fieldName] = currentArr.filter(\n (v) => v !== cb.value\n );\n }\n } else this.store.state[fieldName] = cb.value;\n break;\n case 'NANO-FILE-UPLOAD':\n this.store.state[fieldName] = (\n field as HTMLNanoFileUploadElement\n ).files;\n break;\n default:\n this.store.state[fieldName] = field.value;\n break;\n }\n });\n }\n\n /** Checks for user defined validations */\n private async validate(key: string | number, newVal: any) {\n if (!this.validation) return;\n\n const res = this.validation(key as string, newVal, this.store.state);\n\n // no nothing - return\n if (!res) return;\n\n // stencil public methods are async\n // so we must to coerce our validation\n // collection loop into a promise\n await Promise.all(\n Object.entries(res).map(async ([key, o]) => {\n // switch on/off validation messages\n const field = this.fields.find((f) => f.name === key);\n let validityTarget: NanoFormEles | HTMLNanoCheckboxGroupElement = field;\n\n if (field.tagName === 'NANO-CHECKBOX') {\n const cbg = field.closest('nano-checkbox-group');\n validityTarget = cbg || field;\n }\n\n // status is now valid - clear the error\n if (validityTarget.validityMessage === o.msg && o.valid)\n await this.setFieldError(validityTarget, '');\n // status is invalid. Set the error\n else if (!o.valid) {\n await this.setFieldError(validityTarget, o.msg);\n }\n })\n );\n }\n\n /**\n * Utility to smooth out setting error messages\n * (it's a different method on `nano-checkbox` 'cos they don't show errors themselves)\n * @param field\n * @param msg\n */\n private async setFieldError(\n field: NanoFormEles | HTMLNanoCheckboxGroupElement,\n msg: string\n ) {\n if (field['showError'])\n await (field as Exclude<NanoFormEles, HTMLNanoCheckboxElement>).showError(\n msg\n );\n else await (field as HTMLNanoCheckboxElement).setError(msg);\n }\n\n /** Loops through all store entries and checks field validity */\n private async validateAllFields() {\n // This forces our loop to `await` and finish sequentially ... silly async stencil methods\n await Object.entries(this.store.state).reduce(\n async (memo, [key, value]) => {\n await memo;\n await this.validate(key, value);\n },\n undefined as any\n );\n }\n\n private scrollToFirstInvalid() {\n if (!this.scrollToInvalid) return;\n\n setTimeout(() => {\n const invalidField = this.validationState.find((f) => !f.valid);\n if (!invalidField) return;\n invalidField.fields[0].scrollIntoView({\n behavior: 'smooth',\n block: 'nearest',\n });\n }, 200);\n }\n\n private submitForm() {\n const nanoSubmit = this.nanoSubmit.emit();\n if (nanoSubmit.defaultPrevented) return;\n this.activeForm.submit();\n }\n\n // Event handlers\n\n /** Fired whenever store values change and potentially checks validity */\n private handleStoreChange = async (_key: string | number, _newVal: any) => {\n if (this.validateOn === 'dirty' && this.dirty) {\n this.internalValidate = true;\n await this.validateAllFields();\n this._valid = this.activeForm.checkValidity();\n this.internalValidate = false;\n }\n this.nanoPayloadChange.emit(this.store.state);\n };\n\n /** Handles field value changes and passes to store */\n private handleFieldChange = (ev: NanoEvent) => {\n this._dirty = true;\n this.setFieldValue([ev.target]);\n };\n\n /** Handles default field validation events */\n private handleFormInvalid = async (ev: Event) => {\n ev.preventDefault();\n this._valid = false;\n\n if (this.internalValidate) return;\n if (this.validateOn === 'submitThenDirty') this.validateOn = 'dirty';\n this.submitted = true;\n\n await this.validateAllFields();\n\n // kinda insane...but if we're only validating on submit, then if the form is currently\n // in an invalid state, when submitting, it will fire an invalid event and not\n // submit the form. So let's test to make sure it is really invalid, and submit if not\n if (this.validateOn === 'submit') {\n this.internalValidate = true;\n this._valid = this.activeForm.checkValidity();\n this.internalValidate = false;\n\n if (this._valid) {\n this.submitForm();\n return;\n }\n }\n\n this.scrollToFirstInvalid();\n this.nanoInvalid.emit();\n };\n\n /** stops default form submission, checks if valid, then submits manually */\n private handleSubmit = async (e: Event) => {\n e.preventDefault();\n if (this.validateOn === 'submitThenDirty') this.validateOn = 'dirty';\n this.submitted = true;\n await this.validateAllFields();\n\n this.internalValidate = true;\n this._valid = this.activeForm.checkValidity();\n this.internalValidate = false;\n\n if (!this._valid) {\n this.scrollToFirstInvalid();\n return;\n }\n this.submitForm();\n };\n\n connectedCallback(): void {\n this.userForm = this.host.querySelector('form');\n }\n\n componentDidLoad() {\n requestAnimationFrame(() => {\n this.store = createStore<ValueStore>({});\n\n this.setupFields();\n this.attachSlotObserver();\n\n this.store.on('set', (key, value) => this.handleStoreChange(key, value));\n this.host.addEventListener('nanoChange', this.handleFieldChange);\n this.host.addEventListener('submit', this.handleSubmit);\n });\n }\n\n disconnectedCallback() {\n if (this.mo) this.mo.disconnect();\n this.store.dispose();\n this.host.removeEventListener('nanoChange', this.handleFieldChange);\n this.host.removeEventListener('submit', this.handleSubmit);\n if (this.activeForm)\n this.activeForm.removeEventListener(\n 'invalid',\n this.handleFormInvalid,\n true\n );\n }\n\n render() {\n return (\n <Host>\n {this.userForm && <slot />}\n {!this.userForm && (\n <form ref={(f) => (this.activeForm = f)}>\n <slot />\n </form>\n )}\n </Host>\n );\n }\n}\n"]}

package/dist/nano-components/{p-a6c84740.js → p-71e9fa33.js} RENAMED Viewed

@@ -1,5 +1,5 @@
 /*!
  * Web Components for Nanopore digital Web Apps
  */
-import{h as l}from"./p-ab5813a7.js";const e=({label:e,hasLabelSlot:r,controlId:a,labelId:t,floatLabel:s,placeholder:o,hideLabel:n,hasValue:c,rtl:_,showCharCount:d,maxlength:m,charCount:i})=>{if(!e&&!r)return;if(s){return l("label",{class:"form-ctrl__float-label",htmlFor:a,id:t},e&&e,!e&&r&&l("slot",{name:"label"}),d&&l("span",{class:"form-ctrl__label-charcount"},m?` ${i}/${m}`:` ${i}`))}else{return l("label",{class:{"form-ctrl__label":true,"visually-hide":n},htmlFor:a,id:t},l("div",{class:"form-ctrl__label-wrap"},o&&c&&_&&l("span",{class:"form-ctrl__label-placeholder"},o," / "),l("span",{class:"form-ctrl__labeltext"},e&&e,!e&&r&&l("slot",{name:"label"})),o&&c&&!_&&l("span",{class:"form-ctrl__label-placeholder"}," / ",o)),d&&l("span",{class:"form-ctrl__label-charcount"},m?m-i+" left":i+" characters"))}};const r=(r,a)=>{const{rtl:t,floatLabel:s,label:o,moreId:n,helperEndId:c,type:_,hasHelperSlot:d,showInlineError:m,errorMessage:i,hasHelperEndSlot:h}=r;const f=h?"nano-resize-observe":"div";return l(f,{states:"350w has-enough-width",class:{"has-label":o!==null&&!s,"has-float-label":o!==null&&s,"has-helper-end":h,rtl:t,"form-ctrl":true}},l("div",{class:"form-ctrl__wrapper"},!s?e(Object.assign({},r)):"",l("div",{class:{"form-ctrl__input":true,"form-ctrl__textarea":_==="textarea"}},s&&e(Object.assign(Object.assign({},r),{rtl:t})),a),m||d?l("div",{class:"form-ctrl__more",id:n},!!m?l("div",{class:"form-ctrl__error","aria-live":"polite"},i):"",l("div",{class:"form-ctrl__helper"},l("slot",{name:"helper"}))):""),h?l("div",{class:"form-ctrl__helper-end",id:c},l("slot",{name:"helper-end"})):"")};const a=(e,r)=>{const{clearControl:a,onClearText:t,readonly:s,disabled:o,control:n,ref:c,endSlot:_,endValueSlot:d,startSlot:m}=e;const i=()=>{n.setFocus()};return l("div",{class:"form-ctrl__input-wrap",ref:l=>{if(c)c(l)}},l("span",{class:"form-ctrl__slot-start"},l("slot",{name:"start"}),m),r,a&&!s&&!o&&l("button",{type:"button",class:"icon form-ctrl__clear-btn",tabindex:"-1",onTouchStart:t,onMouseDown:t},l("nano-icon",{name:"light/times"})),l("span",{class:"form-ctrl__slot-value-end",onClick:i},l("slot",{name:"value-end"}),d),l("span",{class:"form-ctrl__slot-end"},l("slot",{name:"end"}),_))};export{r as F,a};
-//# sourceMappingURL=p-a6c84740.js.map
+import{h as l}from"./p-b5c33aff.js";const e=({label:e,hasLabelSlot:r,controlId:a,labelId:t,floatLabel:s,placeholder:o,hideLabel:c,hasValue:n,rtl:_,showCharCount:d,maxlength:m,charCount:i})=>{if(!e&&!r)return;if(s){return l("label",{class:"form-ctrl__float-label",htmlFor:a,id:t},e&&e,!e&&r&&l("slot",{name:"label"}),d&&l("span",{class:"form-ctrl__label-charcount"},m?` ${i}/${m}`:` ${i}`))}else{return l("label",{class:{"form-ctrl__label":true,"visually-hide":c},htmlFor:a,id:t},l("div",{class:"form-ctrl__label-wrap"},o&&n&&_&&l("span",{class:"form-ctrl__label-placeholder"},o," / "),l("span",{class:"form-ctrl__labeltext"},e&&e,!e&&r&&l("slot",{name:"label"})),o&&n&&!_&&l("span",{class:"form-ctrl__label-placeholder"}," / ",o)),d&&l("span",{class:"form-ctrl__label-charcount"},m?m-i+" left":i+" characters"))}};const r=(r,a)=>{const{rtl:t,floatLabel:s,label:o,moreId:c,helperEndId:n,type:_,hasHelperSlot:d,showInlineError:m,errorMessage:i,hasHelperEndSlot:f}=r;const h=f?"nano-resize-observe":"div";return l(h,{states:"350w has-enough-width",class:{"has-label":o!==null&&!s,"has-float-label":o!==null&&s,"has-helper-end":f,rtl:t,"form-ctrl":true}},l("div",{class:"form-ctrl__wrapper"},!s?e(Object.assign({},r)):"",l("div",{class:{"form-ctrl__input":true,"form-ctrl__textarea":_==="textarea"}},s&&e(Object.assign(Object.assign({},r),{rtl:t})),a),m||d?l("div",{class:"form-ctrl__more",id:c},!!m?l("div",{class:"form-ctrl__error","aria-live":"polite"},i):"",l("div",{class:"form-ctrl__helper"},l("slot",{name:"helper"}))):""),f?l("div",{class:"form-ctrl__helper-end",id:n},l("slot",{name:"helper-end"})):"")};const a=(e,r)=>{const{clearControl:a,onClearText:t,readonly:s,disabled:o,control:c,ref:n,endSlot:_,endValueSlot:d,startSlot:m}=e;const i=()=>{c.setFocus()};return l("div",{class:"form-ctrl__input-wrap",ref:l=>{if(n)n(l)}},l("span",{class:"form-ctrl__slot-start"},l("slot",{name:"start"}),m),r,a&&!s&&!o&&l("button",{type:"button",class:"icon form-ctrl__clear-btn",tabindex:"-1",onTouchStart:t,onMouseDown:t},l("nano-icon",{name:"light/times"})),l("span",{class:"form-ctrl__slot-value-end",onClick:i},l("slot",{name:"value-end"}),d),l("span",{class:"form-ctrl__slot-end"},l("slot",{name:"end"}),_))};export{r as F,a};
+//# sourceMappingURL=p-71e9fa33.js.map

package/dist/nano-components/{p-a6c84740.js.map → p-71e9fa33.js.map} RENAMED Viewed

File without changes

package/dist/nano-components/{p-39a5280e.system.entry.js → p-72ed603c.system.entry.js} RENAMED Viewed

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

package/dist/nano-components/{p-39a5280e.system.entry.js.map → p-72ed603c.system.entry.js.map} RENAMED Viewed

File without changes

package/dist/nano-components/{p-313970ff.entry.js → p-73985eda.entry.js} RENAMED Viewed

@@ -1,5 +1,5 @@
 /*!
  * Web Components for Nanopore digital Web Apps
  */
-import{r as t,c as i,h as s,g as e}from"./p-ab5813a7.js";import{P as o}from"./p-3de7735c.js";import{g as n}from"./p-74a7fc4f.js";import{a as r}from"./p-9a385481.js";import"./p-289aa03f.js";const a=":host{-webkit-box-sizing:border-box;box-sizing:border-box}*,*::before,*::after{-webkit-box-sizing:border-box;box-sizing:border-box}[hidden]{display:none !important}:host{--width:auto;--border:var(--nano-layer-border-style, 1px solid var(--nano-layer-border-color, rgba(0, 0, 0, 0.1)));--border-radius:var(--nano-layer-border-radius, var(--nano-border-radius-medium, 4px));--background:var(--nano-layer-bg, #fff);--padding:10px 0;--overflow:hidden;--dropdown-z-index:var(--nano-layer-index-dropdown, 300);--min-width:0;--box-shadow:var(--nano-layer-shadow-large, 0 2px 8px rgba(0, 0, 0, 0.2));display:-webkit-box;display:-ms-flexbox;display:flex}.dropdown{position:relative}.dropdown__trigger{display:block}.dropdown__positioner{position:absolute;z-index:var(--dropdown-z-index);min-width:var(--min-width)}@media (max-width: 35.9375em){.dropdown__positioner{z-index:100}}.dropdown__panel{padding:var(--padding);background:var(--background);min-width:var(--min-width);width:var(--width);border:var(--border);border-radius:var(--border-radius);color:currentColor;-webkit-box-shadow:var(--box-shadow);box-shadow:var(--box-shadow);opacity:0;-webkit-transition:0.2s ease opacity, 0.2s ease transform, 0.2s ease min-height;transition:0.2s ease opacity, 0.2s ease transform, 0.2s ease min-height;min-height:20px;overflow:var(--overflow);-webkit-box-sizing:content-box !important;box-sizing:content-box !important}.dropdown__panel.loading{overflow-y:hidden}.dropdown__panel.top{-webkit-transform:translateY(-20px) translateZ(0);transform:translateY(-20px) translateZ(0)}.dropdown__panel.bottom{-webkit-transform:translateY(20px) translateZ(0);transform:translateY(20px) translateZ(0)}.dropdown__positioner.popover-visible .dropdown__panel{opacity:1;-webkit-transform:translateY(0) translateZ(0);transform:translateY(0) translateZ(0)}.dropdown__panel ::slotted(nano-menu){max-height:50vh}.dropdown__accessible-title{clip:rect(1px, 1px, 1px, 1px);-webkit-clip-path:inset(50%);clip-path:inset(50%);height:1px;width:1px;margin:-1px;overflow:hidden;padding:0;position:absolute}";let h=0;let d=class{constructor(s){t(this,s);this.nanoShow=i(this,"nanoShow",7);this.nanoAfterShow=i(this,"nanoAfterShow",7);this.nanoHide=i(this,"nanoHide",7);this.nanoAfterHide=i(this,"nanoAfterHide",7);this.dropdownId=`dropdown-${h++}`;this.labelId=this.dropdownId+"-title";this.ignoreOpenWatcher=false;this.didLoad=false;this.autoOpen=true;this.open=false;this.closeOnSelect=true;this.tetherTo=null;this.placement="bottom-start";this.distance=2;this.skidding=0;this.hoist=false;this.togglePanel=()=>{if(!this.autoOpen)return;this.open?this.hide():this.show()};this.handleTriggerKeyDown=t=>{if(["ArrowDown","ArrowUp"," "].includes(t.key)){this.show();t.preventDefault();t.stopPropagation();if(this.menu)this.menu.setFocus()}};this.handleTriggerSlotChange=()=>{this.updateAccessibleTrigger()}}get menu(){return this.host.querySelector("nano-menu")}handleOpenChange(){if(this.ignoreOpenWatcher)return;this.open?this.show():this.hide();if(this.accessibleTrigger){this.accessibleTrigger.setAttribute("aria-expanded",this.open.toString());return}this.updateAccessibleTrigger()}handleTetherToChange(){this.createPopover();this.updateAccessibleTrigger()}handlePopoverOptionsChange(){this.popover.setOptions({strategy:this.hoist?"fixed":"absolute",placement:this.placement,skidding:this.skidding,distance:this.distance})}secondaryOpen(t){if(!t.detail.secondaryMenu)return;t.stopPropagation();this.panel.classList.add("loading");this.panel.addEventListener("transitionend",(()=>{this.panel.classList.remove("loading")}),{once:true});this.panel.style.minHeight=t.detail.secondaryMenu.scrollHeight+"px"}secondaryClose(t){if(!t.detail.secondaryMenu)return;t.stopPropagation();if(!t.target.parentElement)return;this.panel.style.minHeight=t.target.parentElement.scrollHeight+"px"}handlePanelSelect(t){const i=t.target;if(this.closeOnSelect&&i.tagName.toLowerCase()==="nano-menu")this.hide()}async show(){this.ignoreOpenWatcher=true;this.open=true;const t=this.nanoShow.emit();if(t.defaultPrevented){this.open=false;this.ignoreOpenWatcher=false;return}this.popover.show();this.ignoreOpenWatcher=false;document.addEventListener("mousedown",this.handleDocumentMouseDown);document.addEventListener("keydown",this.handleDocumentKeyDown)}async hide(){this.ignoreOpenWatcher=true;this.open=false;const t=this.nanoHide.emit();if(t.defaultPrevented){this.open=true;this.ignoreOpenWatcher=false;return}if(this.popover)this.popover.hide();this.ignoreOpenWatcher=false;document.removeEventListener("mousedown",this.handleDocumentMouseDown);document.removeEventListener("keydown",this.handleDocumentKeyDown);if(this.accessibleTrigger&&this.focusEleInDropDwn()){this.accessibleTrigger.focus()}}focusEleInDropDwn(t){var i;const s=n();if(t&&((i=t.composedPath())===null||i===void 0?void 0:i.length)){const i=t.composedPath().includes(this.containingElement);return!t.composedPath().includes(this.accessibleTrigger)&&i}return s&&s.closest(this.containingElement.tagName.toLowerCase())===this.containingElement&&s!==this.accessibleTrigger}updateAccessibleTrigger(){if(!this.didLoad)return;let t;this.accessibleTrigger=null;if(!this.tetherTo){const i=Array.from(this.host.querySelectorAll('[slot="trigger"]'));t=i.map(r)[0]}else{t=r(this.tetherTo)}if(t){t.setAttribute("aria-haspopup","true");t.setAttribute("aria-expanded",this.open?"true":"false");this.accessibleTrigger=t}}handleDocumentKeyDown(t){if(t.key==="Escape"){this.hide();return}if(t.key==="Tab"){setTimeout((()=>{if(document.activeElement&&document.activeElement.closest(this.containingElement.tagName.toLowerCase())!==this.containingElement){this.hide();return}}))}if(this.menu&&["ArrowDown","ArrowUp"].includes(t.key)){if(!this.open||this.focusEleInDropDwn(t))return;t.preventDefault();this.menu.setFocus();return}const i=t.composedPath();if(this.menu&&i.length&&!i.find((t=>t!==this.menu))){this.menu.dispatchEvent(new KeyboardEvent(t.type,t));return}}handleDocumentMouseDown(t){if(!this.focusEleInDropDwn(t)){this.hide();return}}createPopover(){if(this.popover){if(this.open)this.hide();this.popover.destroy();this.popover=null}this.popover=new o(this.tetherTo||this.trigger,this.positioner,{strategy:this.hoist?"fixed":"absolute",placement:this.placement,distance:this.distance,skidding:this.skidding,transitionElement:this.panel,onAfterHide:()=>this.nanoAfterHide.emit(),onAfterShow:()=>this.nanoAfterShow.emit(),onTransitionEnd:()=>{if(!this.open){this.panel.scrollTop=0}else if(this.menu){this.menu.showActiveElement()}}});if(this.open){this.show()}}connectedCallback(){this.handleDocumentKeyDown=this.handleDocumentKeyDown.bind(this);this.handleDocumentMouseDown=this.handleDocumentMouseDown.bind(this);if(!this.containingElement)this.containingElement=this.host}componentDidLoad(){this.didLoad=true;this.createPopover();setTimeout((()=>this.updateAccessibleTrigger()),100)}disconnectedCallback(){this.hide();if(this.popover)this.popover.destroy()}render(){return s("div",{part:"base",id:this.dropdownId,class:{dropdown:true,"dropdown--open":this.open}},s("span",{part:"trigger",class:"dropdown__trigger",ref:t=>this.trigger=t,onKeyDown:this.handleTriggerKeyDown,onClick:this.togglePanel},s("slot",{name:"trigger",onSlotchange:this.handleTriggerSlotChange})),s("div",{ref:t=>this.positioner=t,class:"dropdown__positioner"},s("div",{ref:t=>this.panel=t,part:"panel",class:`dropdown__panel ${this.placement.split("-").join(" ")}`,"aria-hidden":!this.open,role:"dialog","aria-modal":"true","aria-labelledby":this.dialogTitle?this.labelId:undefined},this.dialogTitle&&s("h2",{id:this.labelId,class:"dropdown__accessible-title","aria-live":"polite"},this.dialogTitle),s("slot",null))))}get host(){return e(this)}static get watchers(){return{open:["handleOpenChange"],tetherTo:["handleTetherToChange"],placement:["handlePopoverOptionsChange"],distance:["handlePopoverOptionsChange"],skidding:["handlePopoverOptionsChange"],hoist:["handlePopoverOptionsChange"]}}};d.style=a;export{d as nano_dropdown};
-//# sourceMappingURL=p-313970ff.entry.js.map
+import{r as t,c as i,h as s,g as e}from"./p-b5c33aff.js";import{P as o}from"./p-3de7735c.js";import{g as n}from"./p-74a7fc4f.js";import{a as r}from"./p-9a385481.js";import"./p-289aa03f.js";const a=":host{-webkit-box-sizing:border-box;box-sizing:border-box}*,*::before,*::after{-webkit-box-sizing:border-box;box-sizing:border-box}[hidden]{display:none !important}:host{--width:auto;--border:var(--nano-layer-border-style, 1px solid var(--nano-layer-border-color, rgba(0, 0, 0, 0.1)));--border-radius:var(--nano-layer-border-radius, var(--nano-border-radius-medium, 4px));--background:var(--nano-layer-bg, #fff);--padding:10px 0;--overflow:hidden;--dropdown-z-index:var(--nano-layer-index-dropdown, 300);--min-width:0;--box-shadow:var(--nano-layer-shadow-large, 0 2px 8px rgba(0, 0, 0, 0.2));display:-webkit-box;display:-ms-flexbox;display:flex}.dropdown{position:relative}.dropdown__trigger{display:block}.dropdown__positioner{position:absolute;z-index:var(--dropdown-z-index);min-width:var(--min-width)}@media (max-width: 35.9375em){.dropdown__positioner{z-index:100}}.dropdown__panel{padding:var(--padding);background:var(--background);min-width:var(--min-width);width:var(--width);border:var(--border);border-radius:var(--border-radius);color:currentColor;-webkit-box-shadow:var(--box-shadow);box-shadow:var(--box-shadow);opacity:0;-webkit-transition:0.2s ease opacity, 0.2s ease transform, 0.2s ease min-height;transition:0.2s ease opacity, 0.2s ease transform, 0.2s ease min-height;min-height:20px;overflow:var(--overflow);-webkit-box-sizing:content-box !important;box-sizing:content-box !important}.dropdown__panel.loading{overflow-y:hidden}.dropdown__panel.top{-webkit-transform:translateY(-20px) translateZ(0);transform:translateY(-20px) translateZ(0)}.dropdown__panel.bottom{-webkit-transform:translateY(20px) translateZ(0);transform:translateY(20px) translateZ(0)}.dropdown__positioner.popover-visible .dropdown__panel{opacity:1;-webkit-transform:translateY(0) translateZ(0);transform:translateY(0) translateZ(0)}.dropdown__panel ::slotted(nano-menu){max-height:50vh}.dropdown__accessible-title{clip:rect(1px, 1px, 1px, 1px);-webkit-clip-path:inset(50%);clip-path:inset(50%);height:1px;width:1px;margin:-1px;overflow:hidden;padding:0;position:absolute}";let h=0;let d=class{constructor(s){t(this,s);this.nanoShow=i(this,"nanoShow",7);this.nanoAfterShow=i(this,"nanoAfterShow",7);this.nanoHide=i(this,"nanoHide",7);this.nanoAfterHide=i(this,"nanoAfterHide",7);this.dropdownId=`dropdown-${h++}`;this.labelId=this.dropdownId+"-title";this.ignoreOpenWatcher=false;this.didLoad=false;this.autoOpen=true;this.open=false;this.closeOnSelect=true;this.tetherTo=null;this.placement="bottom-start";this.distance=2;this.skidding=0;this.hoist=false;this.togglePanel=()=>{if(!this.autoOpen)return;this.open?this.hide():this.show()};this.handleTriggerKeyDown=t=>{if(["ArrowDown","ArrowUp"," "].includes(t.key)){this.show();t.preventDefault();t.stopPropagation();if(this.menu)this.menu.setFocus()}};this.handleTriggerSlotChange=()=>{this.updateAccessibleTrigger()}}get menu(){return this.host.querySelector("nano-menu")}handleOpenChange(){if(this.ignoreOpenWatcher)return;this.open?this.show():this.hide();if(this.accessibleTrigger){this.accessibleTrigger.setAttribute("aria-expanded",this.open.toString());return}this.updateAccessibleTrigger()}handleTetherToChange(){this.createPopover();this.updateAccessibleTrigger()}handlePopoverOptionsChange(){this.popover.setOptions({strategy:this.hoist?"fixed":"absolute",placement:this.placement,skidding:this.skidding,distance:this.distance})}secondaryOpen(t){if(!t.detail.secondaryMenu)return;t.stopPropagation();this.panel.classList.add("loading");this.panel.addEventListener("transitionend",(()=>{this.panel.classList.remove("loading")}),{once:true});this.panel.style.minHeight=t.detail.secondaryMenu.scrollHeight+"px"}secondaryClose(t){if(!t.detail.secondaryMenu)return;t.stopPropagation();if(!t.target.parentElement)return;this.panel.style.minHeight=t.target.parentElement.scrollHeight+"px"}handlePanelSelect(t){const i=t.target;if(this.closeOnSelect&&i.tagName.toLowerCase()==="nano-menu")this.hide()}async show(){this.ignoreOpenWatcher=true;this.open=true;const t=this.nanoShow.emit();if(t.defaultPrevented){this.open=false;this.ignoreOpenWatcher=false;return}this.popover.show();this.ignoreOpenWatcher=false;document.addEventListener("mousedown",this.handleDocumentMouseDown);document.addEventListener("keydown",this.handleDocumentKeyDown)}async hide(){this.ignoreOpenWatcher=true;this.open=false;const t=this.nanoHide.emit();if(t.defaultPrevented){this.open=true;this.ignoreOpenWatcher=false;return}if(this.popover)this.popover.hide();this.ignoreOpenWatcher=false;document.removeEventListener("mousedown",this.handleDocumentMouseDown);document.removeEventListener("keydown",this.handleDocumentKeyDown);if(this.accessibleTrigger&&this.focusEleInDropDwn()){this.accessibleTrigger.focus()}}focusEleInDropDwn(t){var i;const s=n();if(t&&((i=t.composedPath())===null||i===void 0?void 0:i.length)){const i=t.composedPath().includes(this.containingElement);return!t.composedPath().includes(this.accessibleTrigger)&&i}return s&&s.closest(this.containingElement.tagName.toLowerCase())===this.containingElement&&s!==this.accessibleTrigger}updateAccessibleTrigger(){if(!this.didLoad)return;let t;this.accessibleTrigger=null;if(!this.tetherTo){const i=Array.from(this.host.querySelectorAll('[slot="trigger"]'));t=i.map(r)[0]}else{t=r(this.tetherTo)}if(t){t.setAttribute("aria-haspopup","true");t.setAttribute("aria-expanded",this.open?"true":"false");this.accessibleTrigger=t}}handleDocumentKeyDown(t){if(t.key==="Escape"){this.hide();return}if(t.key==="Tab"){setTimeout((()=>{if(document.activeElement&&document.activeElement.closest(this.containingElement.tagName.toLowerCase())!==this.containingElement){this.hide();return}}))}if(this.menu&&["ArrowDown","ArrowUp"].includes(t.key)){if(!this.open||this.focusEleInDropDwn(t))return;t.preventDefault();this.menu.setFocus();return}const i=t.composedPath();if(this.menu&&i.length&&!i.find((t=>t!==this.menu))){this.menu.dispatchEvent(new KeyboardEvent(t.type,t));return}}handleDocumentMouseDown(t){if(!this.focusEleInDropDwn(t)){this.hide();return}}createPopover(){if(this.popover){if(this.open)this.hide();this.popover.destroy();this.popover=null}this.popover=new o(this.tetherTo||this.trigger,this.positioner,{strategy:this.hoist?"fixed":"absolute",placement:this.placement,distance:this.distance,skidding:this.skidding,transitionElement:this.panel,onAfterHide:()=>this.nanoAfterHide.emit(),onAfterShow:()=>this.nanoAfterShow.emit(),onTransitionEnd:()=>{if(!this.open){this.panel.scrollTop=0}else if(this.menu){this.menu.showActiveElement()}}});if(this.open){this.show()}}connectedCallback(){this.handleDocumentKeyDown=this.handleDocumentKeyDown.bind(this);this.handleDocumentMouseDown=this.handleDocumentMouseDown.bind(this);if(!this.containingElement)this.containingElement=this.host}componentDidLoad(){this.didLoad=true;this.createPopover();setTimeout((()=>this.updateAccessibleTrigger()),100)}disconnectedCallback(){this.hide();if(this.popover)this.popover.destroy()}render(){return s("div",{part:"base",id:this.dropdownId,class:{dropdown:true,"dropdown--open":this.open}},s("span",{part:"trigger",class:"dropdown__trigger",ref:t=>this.trigger=t,onKeyDown:this.handleTriggerKeyDown,onClick:this.togglePanel},s("slot",{name:"trigger",onSlotchange:this.handleTriggerSlotChange})),s("div",{ref:t=>this.positioner=t,class:"dropdown__positioner"},s("div",{ref:t=>this.panel=t,part:"panel",class:`dropdown__panel ${this.placement.split("-").join(" ")}`,"aria-hidden":!this.open,role:"dialog","aria-modal":"true","aria-labelledby":this.dialogTitle?this.labelId:undefined},this.dialogTitle&&s("h2",{id:this.labelId,class:"dropdown__accessible-title","aria-live":"polite"},this.dialogTitle),s("slot",null))))}get host(){return e(this)}static get watchers(){return{open:["handleOpenChange"],tetherTo:["handleTetherToChange"],placement:["handlePopoverOptionsChange"],distance:["handlePopoverOptionsChange"],skidding:["handlePopoverOptionsChange"],hoist:["handlePopoverOptionsChange"]}}};d.style=a;export{d as nano_dropdown};
+//# sourceMappingURL=p-73985eda.entry.js.map

package/dist/nano-components/{p-313970ff.entry.js.map → p-73985eda.entry.js.map} RENAMED Viewed

File without changes

package/dist/nano-components/{p-58d7f10f.entry.js → p-76c903db.entry.js} RENAMED Viewed

@@ -1,5 +1,5 @@
 /*!
  * Web Components for Nanopore digital Web Apps
  */
-import{r as i,c as t,h as e,e as s,g as n}from"./p-ab5813a7.js";import{c as o,r}from"./p-289aa03f.js";import{d as h}from"./p-1da5f8df.js";function a(i,t){function e(e){const s=i.getBoundingClientRect();const n=i.ownerDocument.defaultView;const o=s.left+n.pageXOffset;const r=s.top+n.pageYOffset;const h=e.pageX-o;const a=e.pageY-r;t(h,a)}function s(){document.removeEventListener("pointermove",e);document.removeEventListener("pointerup",s)}document.addEventListener("pointermove",e,{passive:true});document.addEventListener("pointerup",s)}const d=':host{-webkit-box-sizing:border-box;box-sizing:border-box}*,*::before,*::after{-webkit-box-sizing:border-box;box-sizing:border-box}[hidden]{display:none !important}:host{--divider-width:12px;--divider-hit-area:14px;--min:0%;--max:100%;--background-color:#e4e6e8;--content-color:#918b86;display:-ms-grid;display:grid}.start,.end{overflow:hidden}.divider{-webkit-box-flex:0;-ms-flex:0 0 var(--divider-width);flex:0 0 var(--divider-width);display:-webkit-box;display:-ms-flexbox;display:flex;position:relative;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;background-color:var(--background-color);color:var(--content-color);z-index:1;font-size:0.8rem}.divider:focus{outline:none}:host(:not([disabled])) .divider:focus-visible{background-color:var(--nano-control-focus-color, rgba(144, 198, 231, 0.8))}:host([disabled]) .divider{cursor:not-allowed}:host(:not([vertical],[disabled])) .divider{cursor:col-resize}:host(:not([vertical])) .divider::after{display:-webkit-box;display:-ms-flexbox;display:flex;content:"";position:absolute;height:100%;left:calc(var(--divider-hit-area) / -2 + var(--divider-width) / 2);width:var(--divider-hit-area)}:host([vertical]){-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}:host([vertical]:not([disabled])) .divider{cursor:row-resize}:host([vertical]) .divider::after{content:"";position:absolute;width:100%;top:calc(var(--divider-hit-area) / -2 + var(--divider-width) / 2);height:var(--divider-hit-area)}';let l=class{constructor(e){i(this,e);this.nanoReposition=t(this,"nanoReposition",7);this.nanoDragging=t(this,"nanoDragging",7);this.isAnimating=false;this.didLoad=false;this._shouldAnimate=true;this.vertical=false;this.disabled=false;this.snapThreshold=12;this.animationDuration=.6;this.handleDrag=i=>{if(this.disabled){return}i.preventDefault();a(this.host,((i,t)=>{let e=this.vertical?t:i;this.nanoDragging.emit(e);if(this.primary==="end"){e=this.size-e}if(this.snap){const i=this.snap.split(" ");i.forEach((i=>{let t;if(i.endsWith("%")){t=this.size*(parseFloat(i)/100)}else{t=parseFloat(i)}if(e>=t-this.snapThreshold&&e<=t+this.snapThreshold){e=t}}))}this.shouldAnimate=false;this.position=o(this.pixelsToPercentage(e),0,100);r((()=>this.shouldAnimate=true))}))};this.handleKeyDown=i=>{if(this.disabled){return}if(["ArrowLeft","ArrowRight","ArrowUp","ArrowDown","Home","End"].includes(i.key)){let t=this.position;const e=(i.shiftKey?10:1)*(this.primary==="end"?-1:1);i.preventDefault();if(i.key==="ArrowLeft"&&!this.vertical||i.key==="ArrowUp"&&this.vertical){t-=e}if(i.key==="ArrowRight"&&!this.vertical||i.key==="ArrowDown"&&this.vertical){t+=e}if(i.key==="Home"){t=this.primary==="end"?100:0}if(i.key==="End"){t=this.primary==="end"?0:100}this.shouldAnimate=false;this.position=o(t,0,100);r((()=>this.shouldAnimate=true))}};this.handleResize=()=>{if(!this.didLoad||this.isAnimating)return;if(this.primary){this.shouldAnimate=false;this.position=this.pixelsToPercentage(this.cachedPositionInPixels);r((()=>this.shouldAnimate=true))}};this.handlePositionChange=h(this.handlePositionChange.bind(this),100)}get size(){const{width:i,height:t}=this.host.getBoundingClientRect();return this.vertical?t:i}get shouldAnimate(){return this.didLoad&&this._shouldAnimate}set shouldAnimate(i){this._shouldAnimate=i}get position(){return this._position}set position(i){i=Math.min(Math.max(i,0),100);if(isNaN(i)||i===this._position)return;if(this.shouldAnimate&&this.animationDuration>0&&!isNaN(this.position)){this.animatePosition(i);return}this._position=i}handlePositionChange(){this.cachedPositionInPixels=this.percentageToPixels(this.position);this.positionInPixels=this.percentageToPixels(this.position);this.nanoReposition.emit()}handlePositionInPixelsChange(){this.position=this.pixelsToPercentage(this.positionInPixels)}async getPercentageToPixels(i){return this.percentageToPixels(i)}async getPixelsToPercentage(i){return this.pixelsToPercentage(i)}animatePosition(i){if(this.isAnimating)return;const t=this.animationDuration;const e=60;const s=this.position;const n=i-s;let o=s;let h=0;function a(i,t,e,s){if((i/=s/2)<1)return e/2*i*i+t;else return-e/2*(--i*(i-2)-1)+t}const d=()=>{h+=1/e;o=a(h,s,n,t);if(i>s&&o>=i||i<s&&o<=i){this.position=i;this.shouldAnimate=true;this.isAnimating=false;return}this.position=o;r(d)};this.shouldAnimate=false;this.isAnimating=true;r(d)}percentageToPixels(i){return this.size*(i/100)}pixelsToPercentage(i){return i/this.size*100}attachRO(){this.detachRO();this.ro=new ResizeObserver((()=>this.handleResize()));this.ro.observe(this.host)}detachRO(){if(!this.ro)return;this.ro.unobserve(this.host);this.ro=undefined}componentDidLoad(){if(this.positionInPixels)this.handlePositionInPixelsChange();setTimeout((()=>this.didLoad=true))}connectedCallback(){this.cachedPositionInPixels=this.percentageToPixels(this.position);this.attachRO()}disconnectedCallback(){this.detachRO()}componentDidRender(){r((()=>{if(typeof this.position==="undefined"){this.position=50}}))}render(){if(typeof this.position==="undefined")return;const i={};const t=this.vertical?"gridTemplateRows":"gridTemplateColumns";const n=`\n      clamp(\n        0%,\n        clamp(\n          var(--min),\n          ${this.position}% - var(--divider-width) / 2,\n          var(--max)\n        ),\n        calc(100% - var(--divider-width))\n      )\n    `;const o="auto";if(this.primary==="end"){i[t]=`${o} var(--divider-width) ${n}`}else{i[t]=`${n} var(--divider-width) ${o}`}return e(s,{style:i},e("div",{part:"panel start",class:"start"},e("slot",{name:"start"})),e("div",{part:"divider",class:"divider",tabindex:this.disabled?undefined:"0",role:"separator","aria-label":"Resize",onKeyDown:this.handleKeyDown,onMouseDown:this.handleDrag,onTouchStart:this.handleDrag},e("slot",{name:"handle"},!this.disabled&&this.vertical?e("nano-icon",{slot:"handle",name:"solid/grip-lines"}):e("nano-icon",{slot:"handle",name:"solid/grip-lines-vertical"}))),e("div",{part:"panel end",class:"end"},e("slot",{name:"end"})))}get host(){return n(this)}static get watchers(){return{position:["handlePositionChange"],positionInPixels:["handlePositionInPixelsChange"]}}};l.style=d;export{l as nano_split_pane};
-//# sourceMappingURL=p-58d7f10f.entry.js.map
+import{r as i,c as t,h as e,e as s,g as n}from"./p-b5c33aff.js";import{c as o,r}from"./p-289aa03f.js";import{d as h}from"./p-1da5f8df.js";function a(i,t){function e(e){const s=i.getBoundingClientRect();const n=i.ownerDocument.defaultView;const o=s.left+n.pageXOffset;const r=s.top+n.pageYOffset;const h=e.pageX-o;const a=e.pageY-r;t(h,a)}function s(){document.removeEventListener("pointermove",e);document.removeEventListener("pointerup",s)}document.addEventListener("pointermove",e,{passive:true});document.addEventListener("pointerup",s)}const d=':host{-webkit-box-sizing:border-box;box-sizing:border-box}*,*::before,*::after{-webkit-box-sizing:border-box;box-sizing:border-box}[hidden]{display:none !important}:host{--divider-width:12px;--divider-hit-area:14px;--min:0%;--max:100%;--background-color:#e4e6e8;--content-color:#918b86;display:-ms-grid;display:grid}.start,.end{overflow:hidden}.divider{-webkit-box-flex:0;-ms-flex:0 0 var(--divider-width);flex:0 0 var(--divider-width);display:-webkit-box;display:-ms-flexbox;display:flex;position:relative;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;background-color:var(--background-color);color:var(--content-color);z-index:1;font-size:0.8rem}.divider:focus{outline:none}:host(:not([disabled])) .divider:focus-visible{background-color:var(--nano-control-focus-color, rgba(144, 198, 231, 0.8))}:host([disabled]) .divider{cursor:not-allowed}:host(:not([vertical],[disabled])) .divider{cursor:col-resize}:host(:not([vertical])) .divider::after{display:-webkit-box;display:-ms-flexbox;display:flex;content:"";position:absolute;height:100%;left:calc(var(--divider-hit-area) / -2 + var(--divider-width) / 2);width:var(--divider-hit-area)}:host([vertical]){-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}:host([vertical]:not([disabled])) .divider{cursor:row-resize}:host([vertical]) .divider::after{content:"";position:absolute;width:100%;top:calc(var(--divider-hit-area) / -2 + var(--divider-width) / 2);height:var(--divider-hit-area)}';let l=class{constructor(e){i(this,e);this.nanoReposition=t(this,"nanoReposition",7);this.nanoDragging=t(this,"nanoDragging",7);this.isAnimating=false;this.didLoad=false;this._shouldAnimate=true;this.vertical=false;this.disabled=false;this.snapThreshold=12;this.animationDuration=.6;this.handleDrag=i=>{if(this.disabled){return}i.preventDefault();a(this.host,((i,t)=>{let e=this.vertical?t:i;this.nanoDragging.emit(e);if(this.primary==="end"){e=this.size-e}if(this.snap){const i=this.snap.split(" ");i.forEach((i=>{let t;if(i.endsWith("%")){t=this.size*(parseFloat(i)/100)}else{t=parseFloat(i)}if(e>=t-this.snapThreshold&&e<=t+this.snapThreshold){e=t}}))}this.shouldAnimate=false;this.position=o(this.pixelsToPercentage(e),0,100);r((()=>this.shouldAnimate=true))}))};this.handleKeyDown=i=>{if(this.disabled){return}if(["ArrowLeft","ArrowRight","ArrowUp","ArrowDown","Home","End"].includes(i.key)){let t=this.position;const e=(i.shiftKey?10:1)*(this.primary==="end"?-1:1);i.preventDefault();if(i.key==="ArrowLeft"&&!this.vertical||i.key==="ArrowUp"&&this.vertical){t-=e}if(i.key==="ArrowRight"&&!this.vertical||i.key==="ArrowDown"&&this.vertical){t+=e}if(i.key==="Home"){t=this.primary==="end"?100:0}if(i.key==="End"){t=this.primary==="end"?0:100}this.shouldAnimate=false;this.position=o(t,0,100);r((()=>this.shouldAnimate=true))}};this.handleResize=()=>{if(!this.didLoad||this.isAnimating)return;if(this.primary){this.shouldAnimate=false;this.position=this.pixelsToPercentage(this.cachedPositionInPixels);r((()=>this.shouldAnimate=true))}};this.handlePositionChange=h(this.handlePositionChange.bind(this),100)}get size(){const{width:i,height:t}=this.host.getBoundingClientRect();return this.vertical?t:i}get shouldAnimate(){return this.didLoad&&this._shouldAnimate}set shouldAnimate(i){this._shouldAnimate=i}get position(){return this._position}set position(i){i=Math.min(Math.max(i,0),100);if(isNaN(i)||i===this._position)return;if(this.shouldAnimate&&this.animationDuration>0&&!isNaN(this.position)){this.animatePosition(i);return}this._position=i}handlePositionChange(){this.cachedPositionInPixels=this.percentageToPixels(this.position);this.positionInPixels=this.percentageToPixels(this.position);this.nanoReposition.emit()}handlePositionInPixelsChange(){this.position=this.pixelsToPercentage(this.positionInPixels)}async getPercentageToPixels(i){return this.percentageToPixels(i)}async getPixelsToPercentage(i){return this.pixelsToPercentage(i)}animatePosition(i){if(this.isAnimating)return;const t=this.animationDuration;const e=60;const s=this.position;const n=i-s;let o=s;let h=0;function a(i,t,e,s){if((i/=s/2)<1)return e/2*i*i+t;else return-e/2*(--i*(i-2)-1)+t}const d=()=>{h+=1/e;o=a(h,s,n,t);if(i>s&&o>=i||i<s&&o<=i){this.position=i;this.shouldAnimate=true;this.isAnimating=false;return}this.position=o;r(d)};this.shouldAnimate=false;this.isAnimating=true;r(d)}percentageToPixels(i){return this.size*(i/100)}pixelsToPercentage(i){return i/this.size*100}attachRO(){this.detachRO();this.ro=new ResizeObserver((()=>this.handleResize()));this.ro.observe(this.host)}detachRO(){if(!this.ro)return;this.ro.unobserve(this.host);this.ro=undefined}componentDidLoad(){if(this.positionInPixels)this.handlePositionInPixelsChange();setTimeout((()=>this.didLoad=true))}connectedCallback(){this.cachedPositionInPixels=this.percentageToPixels(this.position);this.attachRO()}disconnectedCallback(){this.detachRO()}componentDidRender(){r((()=>{if(typeof this.position==="undefined"){this.position=50}}))}render(){if(typeof this.position==="undefined")return;const i={};const t=this.vertical?"gridTemplateRows":"gridTemplateColumns";const n=`\n      clamp(\n        0%,\n        clamp(\n          var(--min),\n          ${this.position}% - var(--divider-width) / 2,\n          var(--max)\n        ),\n        calc(100% - var(--divider-width))\n      )\n    `;const o="auto";if(this.primary==="end"){i[t]=`${o} var(--divider-width) ${n}`}else{i[t]=`${n} var(--divider-width) ${o}`}return e(s,{style:i},e("div",{part:"panel start",class:"start"},e("slot",{name:"start"})),e("div",{part:"divider",class:"divider",tabindex:this.disabled?undefined:"0",role:"separator","aria-label":"Resize",onKeyDown:this.handleKeyDown,onMouseDown:this.handleDrag,onTouchStart:this.handleDrag},e("slot",{name:"handle"},!this.disabled&&this.vertical?e("nano-icon",{slot:"handle",name:"solid/grip-lines"}):e("nano-icon",{slot:"handle",name:"solid/grip-lines-vertical"}))),e("div",{part:"panel end",class:"end"},e("slot",{name:"end"})))}get host(){return n(this)}static get watchers(){return{position:["handlePositionChange"],positionInPixels:["handlePositionInPixelsChange"]}}};l.style=d;export{l as nano_split_pane};
+//# sourceMappingURL=p-76c903db.entry.js.map

package/dist/nano-components/{p-58d7f10f.entry.js.map → p-76c903db.entry.js.map} RENAMED Viewed

File without changes

package/dist/nano-components/{p-3aa1d07d.entry.js → p-76d9d1d4.entry.js} RENAMED Viewed

@@ -1,5 +1,5 @@
 /*!
  * Web Components for Nanopore digital Web Apps
  */
-import{r as t,c as i,h as s,e,g as h}from"./p-ab5813a7.js";import{i as n}from"./p-debd9efc.js";import{r as o,h as r,b as a}from"./p-289aa03f.js";import{a as c}from"./p-b619500f.js";import{d as l}from"./p-1da5f8df.js";const f=':host{-webkit-box-sizing:border-box;box-sizing:border-box}*,*::before,*::after{-webkit-box-sizing:border-box;box-sizing:border-box}[hidden]{display:none !important}:host{--stuck-left:initial;--stuck-right:initial;--stuck-z-index:var(--nano-layer-index-menubar, 10);--top-hide:translateY(-110%);--bottom-hide:translateY(110%);display:block;max-width:100%}:host([sticky]){position:-webkit-sticky;position:sticky;-webkit-transition:0.3s ease transform;transition:0.3s ease transform;will-change:min-height}:host([sticky][stuck]){left:var(--stuck-left);right:var(--stuck-right);z-index:var(--stuck-z-index) !important}:host([sticky][hide][placed-top]){-webkit-transform:var(--top-hide);transform:var(--top-hide)}:host([sticky][hide][placed-bottom]){-webkit-transform:var(--bottom-hide);transform:var(--bottom-hide)}:host([sticky][index="1"]){z-index:calc(var(--stuck-z-index) + 1)}:host([sticky][index="2"]){z-index:calc(var(--stuck-z-index) + 2)}:host([sticky][index="3"]){z-index:calc(var(--stuck-z-index) + 3)}:host([sticky][index="4"]){z-index:calc(var(--stuck-z-index) + 4)}:host([sticky][index="5"]){z-index:calc(var(--stuck-z-index) + 5)}.sticker{display:inherit;max-width:inherit;width:100%}.sticker:not(.stuck){width:auto !important}.sticker.sticky{-webkit-transition:0.3s ease all;transition:0.3s ease all;position:relative}:host([index="1"]) .sticker.sticky{z-index:calc(var(--stuck-z-index) + 1)}:host([index="2"]) .sticker.sticky{z-index:calc(var(--stuck-z-index) + 2)}:host([index="3"]) .sticker.sticky{z-index:calc(var(--stuck-z-index) + 3)}:host([index="4"]) .sticker.sticky{z-index:calc(var(--stuck-z-index) + 4)}:host([index="5"]) .sticker.sticky{z-index:calc(var(--stuck-z-index) + 5)}.sticker.stuck{position:fixed;left:var(--stuck-left);right:var(--stuck-right);z-index:var(--stuck-z-index);-webkit-transform:translateY(0);transform:translateY(0)}:host([placed-top]) .sticker.stuck{top:0}:host([placed-bottom]) .sticker.stuck{bottom:0}:host([placed-top]) .sticker.stuck.hide{-webkit-transform:var(--top-hide);transform:var(--top-hide)}:host([placed-bottom]) .sticker.stuck.hide{-webkit-transform:var(--bottom-hide);transform:var(--bottom-hide)}.sticker-content{display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap}';function d(t){return t instanceof Document?window.pageYOffset:t.scrollTop}function u(t,i){let s=i instanceof Document?document.documentElement:i;return c(t,s)}let k=class{constructor(s){t(this,s);this.nanoStuck=i(this,"nanoStuck",7);this.nanoUnstuck=i(this,"nanoUnstuck",7);this.nanoHide=i(this,"nanoHide",7);this.nanoShow=i(this,"nanoShow",7);this.isRtl=false;this.scrollPosCache=0;this.scrollPosThresholdCache=0;this.cacheOffset=0;this.pauseResizeWatcher=false;this.listenForScrollParent=false;this.positions=[];this.pauseHide=false;this.hasBootstrapped=false;this.isStuck=false;this.isRootSticker=true;this.hide=false;this.scrollHide=false;this.multiStickerHide=false;this.scrollingTo=false;this.quietModeIsOn=false;this.stuckCounter=0;this.stickerIndex=0;this._offset=0;this.autoResize=true;this.isSticky=true;this.offset=0;this.position="top";this.quietMode={h:600,w:600};this.hideOnNewStickers=true;this.breakPointMax=null;this.breakPointMin=null;this.setupParentResizeListener=()=>{if(this.parentSizeObserver){this.parentSizeObserver.disconnect();this.parentSizeObserver=undefined}this.parentSizeObserver=new n((t=>{for(const i of t){let t,s;if(i.contentRect.height)t=i.contentRect.height;if(i.contentRect.width)s=i.contentRect.width;if(typeof this.quietMode==="object"){if(s<this.quietMode.w||t<this.quietMode.h)this.quietModeIsOn=true;else this.quietModeIsOn=false}if(this.breakPointMin){if(s>this.breakPointMin)this.isSticky=true;else this.isSticky=false}if(this.breakPointMax){if(s<this.breakPointMax)this.isSticky=true;else this.isSticky=false}if(this.isRootSticker&&this.sticker&&this.autoResize)this.sticker.style.width=this.host.scrollWidth+"px"}}));let t=this.scrollParent instanceof Document?this.scrollParent.documentElement:this.scrollParent;if(t)this.parentSizeObserver.observe(t)};this.onStickToDisplayEvent=t=>{if(t.detail.sticker!==this.stickToEle)return;switch(t.type){case"nanoHide":this._offset=0;this.cacheOffset=this.offset;this.offset=0;if(!this.isStuck)this.moveTrigger(false);if(!this.isRootSticker&&this.quietModeIsOn){o((()=>{this.stickToEle.style.minHeight=this.stickToEleInitSize.height+(this.host.scrollHeight+(typeof this.cacheOffset==="object"?this.cacheOffset.v:this.cacheOffset))+"px";this.stickToEle.setTriggerPos(this.stickToEleInitSize.height*-1)}))}break;case"nanoShow":this._offset=this.stickToEleInitSize.height;this.offset=this.cacheOffset;this.moveTrigger(true);if(!this.isRootSticker&&this.quietModeIsOn){o((()=>{this.stickToEle.style.minHeight="";this.stickToEle.setTriggerPos(0)}))}break;case"nanoStuck":this.stickToEleInitSize=this.stickToEle.getBoundingClientRect();this._offset=this.stickToEleInitSize.height;break}};this.onStickEvent=async t=>{let i=t.detail?t.detail.sticker:null;if(!i||i.position!==this.position)return;const s=await i.getTriggerPos();if(t.type==="nanoStuck"&&i!==this.host&&i.scrollParent===this.host.scrollParent){this.stickerIndex++;if(!this.hideOnNewStickers)return;if(this.positions.includes("top")&&this.triggerPos.top<s.top||this.positions.includes("bottom")&&this.triggerPos.top>s.top){this.multiStickerHide=true;this.stuckCounter++}}if(t.type==="nanoUnstuck"&&i!==this.host&&i.scrollParent===this.host.scrollParent){this.stickerIndex--;if(!this.hideOnNewStickers)return;if(this.positions.includes("top")&&this.triggerPos.top<s.top||this.positions.includes("bottom")&&this.triggerPos.top>s.top){this.stuckCounter--;if(this.stuckCounter<1)this.multiStickerHide=false}}};this.onScroll=()=>{let t=d(this.scrollParent);if(t<this.scrollPosCache){if(!this.positions.includes("bottom"))this.handleScrollTo();else this.handleScrollAway(t)}if(t>this.scrollPosCache){if(!this.positions.includes("bottom"))this.handleScrollAway(t);else this.handleScrollTo()}this.scrollPosCache=t}}async isHiding(){return this.hide}async isSticking(){this.shouldStick();return this.isStuck}async setTriggerPos(t){return this._offset=t}async getTriggerPos(){return this.triggerPos}async pauseHiding(t){return this.pauseHide=t}updateTriggerOffset(){if(!this.trigger||!this.scrollParent||!this.listenForScrollParent)return;this.triggerPos=u(this.trigger,this.scrollParent)}stickerResizeListener(){if(this.contentSizeObserver){this.contentSizeObserver.disconnect();this.contentSizeObserver=undefined}this.contentSizeObserver=new n((t=>{for(const i of t){if(this.pauseResizeWatcher)return;if(i.contentRect.height){if(this.position==="top")this.host.style.height=i.contentRect.height+"px";if(this.position==="bottom")this.host.style.minHeight=i.contentRect.height+"px"}}}));this.contentSizeObserver.observe(this.content)}quietModeChange(){if(this.quietMode==="on")o((()=>this.quietModeIsOn=true));else if(this.quietMode==="off")o((()=>this.quietModeIsOn=false))}setOffset(){this.trigger.setAttribute("style","");let t,i,s,e;let h=this.isRootSticker||this.stickToEle?this.sticker:this.host;if(!h)return;if(typeof this.offset==="object")({v:t,h:i}=this.offset);else t=i=this.offset;if(typeof this._offset==="object")({v:t=s,h:i=e}=this._offset);else s=e=this._offset;const n=s=>{let e=s.match(/(top|bottom)/)?t:i;o(s);h.style[s]=e+"px";if(!a())return;if(e)this.host.style.setProperty("--hide-transform-amount",`(110% + ${e}px)`);else this.host.style.setProperty("--hide-transform-amount",null)};const o=h=>{let n=h.match(/(top|bottom)/)?t+s:i+e;this.trigger.style[h]=n*-1+"px";this.trigger.style.position="relative";this.trigger.style.height="1px"};if(this.positions.includes("start")&&this.isRtl||this.positions.includes("end")&&!this.isRtl)n("right");if(this.positions.includes("end")&&this.isRtl||this.positions.includes("start")&&!this.isRtl)n("left");if(this.positions.includes("top"))n("top");if(this.positions.includes("bottom"))n("bottom")}positionChange(){this.positions=this.position.split("-");this.setOffset()}async stuckChange(){if(this.isStuck){if(this.stickToEle){let t=r(this.host)?this.host.children:this.content.children;this.slottedContent=Array.from(t);this.slottedContent.forEach((t=>{if(r(this.host))this.stickToEle.appendChild(t);else this.stickToEle.querySelector(".sticker-content").appendChild(t);t.style.order=this.stickerIndex+""}));this.nanoStuck.emit({sticker:this.stickToEle})}else this.nanoStuck.emit({sticker:this.host})}else{this.scrollHide=false;if(this.stickToEle){this.slottedContent.forEach((t=>{this.host.appendChild(t);t.style.order=""}));this.nanoUnstuck.emit({sticker:this.stickToEle})}else this.nanoUnstuck.emit({sticker:this.host})}}attachScrollListeners(){if(this.quietModeIsOn)this.scrollParent.addEventListener("scroll",this.onScroll,{passive:true,capture:false});else{this.scrollParent.removeEventListener("scroll",this.onScroll);this.moveTrigger(true)}}handleParentEvents(t,i=null){if(!this.listenForScrollParent)return;if(i)this.manageListenersOnParent(false,i);if(this.scrollParent)this.manageListenersOnParent(!this.stickToEle)}stickToEleChange(t,i){if(this.stickToEle){this.stickToEle.addEventListener("nanoHide",this.onStickToDisplayEvent);this.stickToEle.addEventListener("nanoShow",this.onStickToDisplayEvent);this.stickToEle.addEventListener("nanoStuck",this.onStickToDisplayEvent);this.stickToEle.addEventListener("nanoUnstuck",this.onStickToDisplayEvent)}if(i){i.removeEventListener("nanoHide",this.onStickToDisplayEvent);i.removeEventListener("nanoShow",this.onStickToDisplayEvent);i.removeEventListener("nanoStuck",this.onStickToDisplayEvent);i.removeEventListener("nanoUnstuck",this.onStickToDisplayEvent)}}stickToChange(){if(this.stickTo)this.stickToEle=this.scrollParent.querySelector(this.stickTo);else this.stickToEle=undefined}visibilityDecisionHandler(){if(this.multiStickerHide||this.scrollHide)this.hide=true;else this.hide=false}handleHideChange(){if(this.hide)this.nanoHide.emit({sticker:this.host});else this.nanoShow.emit({sticker:this.host})}setupIO(){if(this.io){this.io.disconnect();this.io=undefined}if(!this.scrollParent||!this.hasBootstrapped||!this.trigger)return;this.isRootSticker=this.scrollParent instanceof Document;let t=this.scrollParent;if(this.scrollParent instanceof Document)t=null;this.io=new window.IntersectionObserver((t=>{if(this.pauseResizeWatcher||!this.isSticky)return;this.shouldStick(t.slice(-1)[0])}),{root:t});this.io.observe(this.trigger)}manageListenersOnParent(t,i){let s=i||this.scrollParent;if(!s)return;if(!t){try{if(this.quietModeIsOn)s.removeEventListener("scroll",this.onScroll);s.removeEventListener("nanoStuck",this.onStickEvent);s.removeEventListener("nanoUnstuck",this.onStickEvent)}catch(e){console.error("Events haven`t been added")}}else{s.addEventListener("nanoStuck",this.onStickEvent);s.addEventListener("nanoUnstuck",this.onStickEvent);if(this.quietModeIsOn)this.attachScrollListeners()}this.setupParentResizeListener()}handleScrollTo(){this.scrollPosThresholdCache=null;if(!this.scrollHide)return;if(this.scrollingTo!==true){this._offset=this.cacheOffset||this._offset}this.scrollingTo=true;this.scrollHide=false}handleScrollAway(t){if(this.scrollHide)return;if(!this.isStuck)return;if(this.scrollingTo!==false){this.cacheOffset=this._offset;this._offset=0}this.scrollingTo=false;if(!this.scrollPosThresholdCache)this.scrollPosThresholdCache=t;else if(!this.pauseHide&&Math.abs(t-this.scrollPosThresholdCache)>100)this.scrollHide=true}moveTrigger(t){if(this.positions.includes("bottom")&&!t||!this.positions.includes("bottom")&&t){this.host.parentNode.insertBefore(this.trigger,this.host)}else this.host.parentNode.insertBefore(this.trigger,this.host.nextSibling)}getScrollParent(){const t=/(auto|scroll)/;const i=(t,s)=>{if(t.parentNode===null){return s}return i(t.parentNode,s.concat([t]))};const s=(t,i)=>getComputedStyle(t,null).getPropertyValue(i);const e=t=>s(t,"overflow")+s(t,"overflow-y")+s(t,"overflow-x");const h=i=>t.test(e(i));const n=document.documentElement.getBoundingClientRect().height;const o=t=>{if(!(t instanceof HTMLElement))return;const s=i(t,[]);return s.find((t=>h(t)&&t.getBoundingClientRect().height!==n))||document};return o(this.host)}shouldStick(t){let i;if(this.positions.includes("top")){if(!this.isRootSticker)i=u(this.trigger,this.scrollParent).top;else i=this.trigger.getBoundingClientRect().top;this.isStuck=i<-1}else if(this.positions.includes("bottom")){i=this.trigger.getBoundingClientRect().top;const s=t&&t.rootBounds?t.rootBounds:(this.scrollParent instanceof Document?document.documentElement:this.scrollParent).getBoundingClientRect();this.isStuck=i>s.height+s.top}}bootstrapGurantor(){this.hasBootstrapped=true;this.scrollParent=this.scrollParent||this.getScrollParent();this.isRootSticker=this.scrollParent instanceof Document;this.trigger=this.trigger||document.createElement("div");this.trigger.classList.add("sticker-trigger");this.positionChange();this.moveTrigger(true);this.quietModeChange();this.listenForScrollParent=true;this.handleParentEvents(true);this.stickerIndex=Array.from(this.scrollParent.querySelectorAll("nano-sticker")).filter((t=>t.position===this.position)).findIndex((t=>t===this.host));this.setOffset();this.stickerResizeListener();this.setupParentResizeListener();this.slottedContent=Array.from(this.host.children);this.slottedContent.forEach((t=>{t.style.order=this.stickerIndex+""}));this.updateTriggerOffset();this.stickToChange();this.setupIO();this.onStickToDisplayEvent=l(this.onStickToDisplayEvent,50)}connectedCallback(){this.isRtl=this.host.dir==="rtl"||this.host.ownerDocument.dir==="rtl";document.documentElement.addEventListener("nanoComponentsReady",(()=>{setTimeout((t=>this.bootstrapGurantor()),200)}));setTimeout((t=>{if(!this.hasBootstrapped)this.bootstrapGurantor()}),1e3)}disconnectedCallback(){if(this.io){this.io.disconnect();this.io=undefined}if(this.parentSizeObserver){this.parentSizeObserver.disconnect();this.parentSizeObserver=undefined}this.quietMode="off";this.scrollParent=null}render(){return s(e,{sticky:!this.isRootSticker&&!this.stickToEle&&this.isSticky,hide:this.hide&&this.isStuck,siblings:this.stuckCounter,index:this.stickerIndex,stuck:this.isStuck&&this.isSticky,"placed-bottom":this.positions.includes("bottom"),"placed-top":this.positions.includes("top"),"placed-end":this.positions.includes("end"),"placed-start":this.positions.includes("start")},s("div",{class:{sticker:true,sticky:this.isRootSticker&&this.isSticky,stuck:this.isStuck&&this.isRootSticker&&this.isSticky,hide:this.isRootSticker&&this.hide&&this.isStuck},ref:t=>this.sticker=t},s("div",{class:"sticker-content",ref:t=>this.content=t},s("slot",null))))}get host(){return h(this)}static get watchers(){return{trigger:["updateTriggerOffset"],scrollParent:["updateTriggerOffset","handleParentEvents","setupIO"],position:["stickerResizeListener","positionChange"],quietMode:["quietModeChange"],offset:["setOffset"],_offset:["setOffset"],isStuck:["stuckChange"],quietModeIsOn:["attachScrollListeners"],stickToEle:["handleParentEvents","stickToEleChange"],stickTo:["stickToChange"],multiStickerHide:["visibilityDecisionHandler"],scrollHide:["visibilityDecisionHandler"],hide:["handleHideChange"]}}};k.style=f;export{k as nano_sticker};
-//# sourceMappingURL=p-3aa1d07d.entry.js.map
+import{r as t,c as i,h as s,e,g as h}from"./p-b5c33aff.js";import{i as n}from"./p-debd9efc.js";import{r as o,h as r,b as a}from"./p-289aa03f.js";import{a as c}from"./p-b619500f.js";import{d as f}from"./p-1da5f8df.js";const l=':host{-webkit-box-sizing:border-box;box-sizing:border-box}*,*::before,*::after{-webkit-box-sizing:border-box;box-sizing:border-box}[hidden]{display:none !important}:host{--stuck-left:initial;--stuck-right:initial;--stuck-z-index:var(--nano-layer-index-menubar, 10);--top-hide:translateY(-110%);--bottom-hide:translateY(110%);display:block;max-width:100%}:host([sticky]){position:-webkit-sticky;position:sticky;-webkit-transition:0.3s ease transform;transition:0.3s ease transform;will-change:min-height}:host([sticky][stuck]){left:var(--stuck-left);right:var(--stuck-right);z-index:var(--stuck-z-index) !important}:host([sticky][hide][placed-top]){-webkit-transform:var(--top-hide);transform:var(--top-hide)}:host([sticky][hide][placed-bottom]){-webkit-transform:var(--bottom-hide);transform:var(--bottom-hide)}:host([sticky][index="1"]){z-index:calc(var(--stuck-z-index) + 1)}:host([sticky][index="2"]){z-index:calc(var(--stuck-z-index) + 2)}:host([sticky][index="3"]){z-index:calc(var(--stuck-z-index) + 3)}:host([sticky][index="4"]){z-index:calc(var(--stuck-z-index) + 4)}:host([sticky][index="5"]){z-index:calc(var(--stuck-z-index) + 5)}.sticker{display:inherit;max-width:inherit;width:100%}.sticker:not(.stuck){width:auto !important}.sticker.sticky{-webkit-transition:0.3s ease all;transition:0.3s ease all;position:relative}:host([index="1"]) .sticker.sticky{z-index:calc(var(--stuck-z-index) + 1)}:host([index="2"]) .sticker.sticky{z-index:calc(var(--stuck-z-index) + 2)}:host([index="3"]) .sticker.sticky{z-index:calc(var(--stuck-z-index) + 3)}:host([index="4"]) .sticker.sticky{z-index:calc(var(--stuck-z-index) + 4)}:host([index="5"]) .sticker.sticky{z-index:calc(var(--stuck-z-index) + 5)}.sticker.stuck{position:fixed;left:var(--stuck-left);right:var(--stuck-right);z-index:var(--stuck-z-index);-webkit-transform:translateY(0);transform:translateY(0)}:host([placed-top]) .sticker.stuck{top:0}:host([placed-bottom]) .sticker.stuck{bottom:0}:host([placed-top]) .sticker.stuck.hide{-webkit-transform:var(--top-hide);transform:var(--top-hide)}:host([placed-bottom]) .sticker.stuck.hide{-webkit-transform:var(--bottom-hide);transform:var(--bottom-hide)}.sticker-content{display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap}';function d(t){return t instanceof Document?window.pageYOffset:t.scrollTop}function u(t,i){let s=i instanceof Document?document.documentElement:i;return c(t,s)}let k=class{constructor(s){t(this,s);this.nanoStuck=i(this,"nanoStuck",7);this.nanoUnstuck=i(this,"nanoUnstuck",7);this.nanoHide=i(this,"nanoHide",7);this.nanoShow=i(this,"nanoShow",7);this.isRtl=false;this.scrollPosCache=0;this.scrollPosThresholdCache=0;this.cacheOffset=0;this.pauseResizeWatcher=false;this.listenForScrollParent=false;this.positions=[];this.pauseHide=false;this.hasBootstrapped=false;this.isStuck=false;this.isRootSticker=true;this.hide=false;this.scrollHide=false;this.multiStickerHide=false;this.scrollingTo=false;this.quietModeIsOn=false;this.stuckCounter=0;this.stickerIndex=0;this._offset=0;this.autoResize=true;this.isSticky=true;this.offset=0;this.position="top";this.quietMode={h:600,w:600};this.hideOnNewStickers=true;this.breakPointMax=null;this.breakPointMin=null;this.setupParentResizeListener=()=>{if(this.parentSizeObserver){this.parentSizeObserver.disconnect();this.parentSizeObserver=undefined}this.parentSizeObserver=new n((t=>{for(const i of t){let t,s;if(i.contentRect.height)t=i.contentRect.height;if(i.contentRect.width)s=i.contentRect.width;if(typeof this.quietMode==="object"){if(s<this.quietMode.w||t<this.quietMode.h)this.quietModeIsOn=true;else this.quietModeIsOn=false}if(this.breakPointMin){if(s>this.breakPointMin)this.isSticky=true;else this.isSticky=false}if(this.breakPointMax){if(s<this.breakPointMax)this.isSticky=true;else this.isSticky=false}if(this.isRootSticker&&this.sticker&&this.autoResize)this.sticker.style.width=this.host.scrollWidth+"px"}}));let t=this.scrollParent instanceof Document?this.scrollParent.documentElement:this.scrollParent;if(t)this.parentSizeObserver.observe(t)};this.onStickToDisplayEvent=t=>{if(t.detail.sticker!==this.stickToEle)return;switch(t.type){case"nanoHide":this._offset=0;this.cacheOffset=this.offset;this.offset=0;if(!this.isStuck)this.moveTrigger(false);if(!this.isRootSticker&&this.quietModeIsOn){o((()=>{this.stickToEle.style.minHeight=this.stickToEleInitSize.height+(this.host.scrollHeight+(typeof this.cacheOffset==="object"?this.cacheOffset.v:this.cacheOffset))+"px";this.stickToEle.setTriggerPos(this.stickToEleInitSize.height*-1)}))}break;case"nanoShow":this._offset=this.stickToEleInitSize.height;this.offset=this.cacheOffset;this.moveTrigger(true);if(!this.isRootSticker&&this.quietModeIsOn){o((()=>{this.stickToEle.style.minHeight="";this.stickToEle.setTriggerPos(0)}))}break;case"nanoStuck":this.stickToEleInitSize=this.stickToEle.getBoundingClientRect();this._offset=this.stickToEleInitSize.height;break}};this.onStickEvent=async t=>{let i=t.detail?t.detail.sticker:null;if(!i||i.position!==this.position)return;const s=await i.getTriggerPos();if(t.type==="nanoStuck"&&i!==this.host&&i.scrollParent===this.host.scrollParent){this.stickerIndex++;if(!this.hideOnNewStickers)return;if(this.positions.includes("top")&&this.triggerPos.top<s.top||this.positions.includes("bottom")&&this.triggerPos.top>s.top){this.multiStickerHide=true;this.stuckCounter++}}if(t.type==="nanoUnstuck"&&i!==this.host&&i.scrollParent===this.host.scrollParent){this.stickerIndex--;if(!this.hideOnNewStickers)return;if(this.positions.includes("top")&&this.triggerPos.top<s.top||this.positions.includes("bottom")&&this.triggerPos.top>s.top){this.stuckCounter--;if(this.stuckCounter<1)this.multiStickerHide=false}}};this.onScroll=()=>{let t=d(this.scrollParent);if(t<this.scrollPosCache){if(!this.positions.includes("bottom"))this.handleScrollTo();else this.handleScrollAway(t)}if(t>this.scrollPosCache){if(!this.positions.includes("bottom"))this.handleScrollAway(t);else this.handleScrollTo()}this.scrollPosCache=t}}async isHiding(){return this.hide}async isSticking(){this.shouldStick();return this.isStuck}async setTriggerPos(t){return this._offset=t}async getTriggerPos(){return this.triggerPos}async pauseHiding(t){return this.pauseHide=t}updateTriggerOffset(){if(!this.trigger||!this.scrollParent||!this.listenForScrollParent)return;this.triggerPos=u(this.trigger,this.scrollParent)}stickerResizeListener(){if(this.contentSizeObserver){this.contentSizeObserver.disconnect();this.contentSizeObserver=undefined}this.contentSizeObserver=new n((t=>{for(const i of t){if(this.pauseResizeWatcher)return;if(i.contentRect.height){if(this.position==="top")this.host.style.height=i.contentRect.height+"px";if(this.position==="bottom")this.host.style.minHeight=i.contentRect.height+"px"}}}));this.contentSizeObserver.observe(this.content)}quietModeChange(){if(this.quietMode==="on")o((()=>this.quietModeIsOn=true));else if(this.quietMode==="off")o((()=>this.quietModeIsOn=false))}setOffset(){this.trigger.setAttribute("style","");let t,i,s,e;let h=this.isRootSticker||this.stickToEle?this.sticker:this.host;if(!h)return;if(typeof this.offset==="object")({v:t,h:i}=this.offset);else t=i=this.offset;if(typeof this._offset==="object")({v:t=s,h:i=e}=this._offset);else s=e=this._offset;const n=s=>{let e=s.match(/(top|bottom)/)?t:i;o(s);h.style[s]=e+"px";if(!a())return;if(e)this.host.style.setProperty("--hide-transform-amount",`(110% + ${e}px)`);else this.host.style.setProperty("--hide-transform-amount",null)};const o=h=>{let n=h.match(/(top|bottom)/)?t+s:i+e;this.trigger.style[h]=n*-1+"px";this.trigger.style.position="relative";this.trigger.style.height="1px"};if(this.positions.includes("start")&&this.isRtl||this.positions.includes("end")&&!this.isRtl)n("right");if(this.positions.includes("end")&&this.isRtl||this.positions.includes("start")&&!this.isRtl)n("left");if(this.positions.includes("top"))n("top");if(this.positions.includes("bottom"))n("bottom")}positionChange(){this.positions=this.position.split("-");this.setOffset()}async stuckChange(){if(this.isStuck){if(this.stickToEle){let t=r(this.host)?this.host.children:this.content.children;this.slottedContent=Array.from(t);this.slottedContent.forEach((t=>{if(r(this.host))this.stickToEle.appendChild(t);else this.stickToEle.querySelector(".sticker-content").appendChild(t);t.style.order=this.stickerIndex+""}));this.nanoStuck.emit({sticker:this.stickToEle})}else this.nanoStuck.emit({sticker:this.host})}else{this.scrollHide=false;if(this.stickToEle){this.slottedContent.forEach((t=>{this.host.appendChild(t);t.style.order=""}));this.nanoUnstuck.emit({sticker:this.stickToEle})}else this.nanoUnstuck.emit({sticker:this.host})}}attachScrollListeners(){if(this.quietModeIsOn)this.scrollParent.addEventListener("scroll",this.onScroll,{passive:true,capture:false});else if(this.scrollParent){this.scrollParent.removeEventListener("scroll",this.onScroll);this.moveTrigger(true)}}handleParentEvents(t,i=null){if(!this.listenForScrollParent)return;if(i)this.manageListenersOnParent(false,i);if(this.scrollParent)this.manageListenersOnParent(!this.stickToEle)}stickToEleChange(t,i){if(this.stickToEle){this.stickToEle.addEventListener("nanoHide",this.onStickToDisplayEvent);this.stickToEle.addEventListener("nanoShow",this.onStickToDisplayEvent);this.stickToEle.addEventListener("nanoStuck",this.onStickToDisplayEvent);this.stickToEle.addEventListener("nanoUnstuck",this.onStickToDisplayEvent)}if(i){i.removeEventListener("nanoHide",this.onStickToDisplayEvent);i.removeEventListener("nanoShow",this.onStickToDisplayEvent);i.removeEventListener("nanoStuck",this.onStickToDisplayEvent);i.removeEventListener("nanoUnstuck",this.onStickToDisplayEvent)}}stickToChange(){if(this.stickTo)this.stickToEle=this.scrollParent.querySelector(this.stickTo);else this.stickToEle=undefined}visibilityDecisionHandler(){if(this.multiStickerHide||this.scrollHide)this.hide=true;else this.hide=false}handleHideChange(){if(this.hide)this.nanoHide.emit({sticker:this.host});else this.nanoShow.emit({sticker:this.host})}setupIO(){if(this.io){this.io.disconnect();this.io=undefined}if(!this.scrollParent||!this.hasBootstrapped||!this.trigger)return;this.isRootSticker=this.scrollParent instanceof Document;let t=this.scrollParent;if(this.scrollParent instanceof Document)t=null;this.io=new window.IntersectionObserver((t=>{if(this.pauseResizeWatcher||!this.isSticky)return;this.shouldStick(t.slice(-1)[0])}),{root:t});this.io.observe(this.trigger)}manageListenersOnParent(t,i){let s=i||this.scrollParent;if(!s)return;if(!t){try{if(this.quietModeIsOn)s.removeEventListener("scroll",this.onScroll);s.removeEventListener("nanoStuck",this.onStickEvent);s.removeEventListener("nanoUnstuck",this.onStickEvent)}catch(e){console.error("Events haven`t been added")}}else{s.addEventListener("nanoStuck",this.onStickEvent);s.addEventListener("nanoUnstuck",this.onStickEvent);if(this.quietModeIsOn)this.attachScrollListeners()}this.setupParentResizeListener()}handleScrollTo(){this.scrollPosThresholdCache=null;if(!this.scrollHide)return;if(this.scrollingTo!==true){this._offset=this.cacheOffset||this._offset}this.scrollingTo=true;this.scrollHide=false}handleScrollAway(t){if(this.scrollHide)return;if(!this.isStuck)return;if(this.scrollingTo!==false){this.cacheOffset=this._offset;this._offset=0}this.scrollingTo=false;if(!this.scrollPosThresholdCache)this.scrollPosThresholdCache=t;else if(!this.pauseHide&&Math.abs(t-this.scrollPosThresholdCache)>100)this.scrollHide=true}moveTrigger(t){if(this.positions.includes("bottom")&&!t||!this.positions.includes("bottom")&&t){this.host.parentNode.insertBefore(this.trigger,this.host)}else this.host.parentNode.insertBefore(this.trigger,this.host.nextSibling)}getScrollParent(){const t=/(auto|scroll)/;const i=(t,s)=>{if(t.parentNode===null){return s}return i(t.parentNode,s.concat([t]))};const s=(t,i)=>getComputedStyle(t,null).getPropertyValue(i);const e=t=>s(t,"overflow")+s(t,"overflow-y")+s(t,"overflow-x");const h=i=>t.test(e(i));const n=document.documentElement.getBoundingClientRect().height;const o=t=>{if(!(t instanceof HTMLElement))return;const s=i(t,[]);return s.find((t=>h(t)&&t.getBoundingClientRect().height!==n))||document};return o(this.host)}shouldStick(t){let i;if(this.positions.includes("top")){if(!this.isRootSticker)i=u(this.trigger,this.scrollParent).top;else i=this.trigger.getBoundingClientRect().top;this.isStuck=i<-1}else if(this.positions.includes("bottom")){i=this.trigger.getBoundingClientRect().top;const s=t&&t.rootBounds?t.rootBounds:(this.scrollParent instanceof Document?document.documentElement:this.scrollParent).getBoundingClientRect();this.isStuck=i>s.height+s.top}}bootstrapGurantor(){this.hasBootstrapped=true;this.scrollParent=this.scrollParent||this.getScrollParent();this.isRootSticker=this.scrollParent instanceof Document;this.trigger=this.trigger||document.createElement("div");this.trigger.classList.add("sticker-trigger");this.positionChange();this.moveTrigger(true);this.quietModeChange();this.listenForScrollParent=true;this.handleParentEvents(true);this.stickerIndex=Array.from(this.scrollParent.querySelectorAll("nano-sticker")).filter((t=>t.position===this.position)).findIndex((t=>t===this.host));this.setOffset();this.stickerResizeListener();this.setupParentResizeListener();this.slottedContent=Array.from(this.host.children);this.slottedContent.forEach((t=>{t.style.order=this.stickerIndex+""}));this.updateTriggerOffset();this.stickToChange();this.setupIO();this.onStickToDisplayEvent=f(this.onStickToDisplayEvent,50)}connectedCallback(){this.isRtl=this.host.dir==="rtl"||this.host.ownerDocument.dir==="rtl";document.documentElement.addEventListener("nanoComponentsReady",(()=>{setTimeout((t=>this.bootstrapGurantor()),200)}));setTimeout((t=>{if(!this.hasBootstrapped)this.bootstrapGurantor()}),1e3)}disconnectedCallback(){if(this.io){this.io.disconnect();this.io=undefined}if(this.parentSizeObserver){this.parentSizeObserver.disconnect();this.parentSizeObserver=undefined}this.scrollParent=null;this.hasBootstrapped=false}render(){return s(e,{sticky:!this.isRootSticker&&!this.stickToEle&&this.isSticky,hide:this.hide&&this.isStuck,siblings:this.stuckCounter,index:this.stickerIndex,stuck:this.isStuck&&this.isSticky,"placed-bottom":this.positions.includes("bottom"),"placed-top":this.positions.includes("top"),"placed-end":this.positions.includes("end"),"placed-start":this.positions.includes("start")},s("div",{class:{sticker:true,sticky:this.isRootSticker&&this.isSticky,stuck:this.isStuck&&this.isRootSticker&&this.isSticky,hide:this.isRootSticker&&this.hide&&this.isStuck},ref:t=>this.sticker=t},s("div",{class:"sticker-content",ref:t=>this.content=t},s("slot",null))))}get host(){return h(this)}static get watchers(){return{trigger:["updateTriggerOffset"],scrollParent:["updateTriggerOffset","handleParentEvents","setupIO"],position:["stickerResizeListener","positionChange"],quietMode:["quietModeChange"],offset:["setOffset"],_offset:["setOffset"],isStuck:["stuckChange"],quietModeIsOn:["attachScrollListeners"],stickToEle:["handleParentEvents","stickToEleChange"],stickTo:["stickToChange"],multiStickerHide:["visibilityDecisionHandler"],scrollHide:["visibilityDecisionHandler"],hide:["handleHideChange"]}}};k.style=l;export{k as nano_sticker};
+//# sourceMappingURL=p-76d9d1d4.entry.js.map