@nanoporetech-digital/components 2.7.0 → 2.10.0

package/dist/nano-components/p-1a30dfdd.system.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["src/components/sticker/sticker.scss?tag=nano-sticker&encapsulation=shadow","src/components/sticker/sticker.tsx"],"names":["stickerCss","_getScrollTop","ele","Document","window","pageYOffset","scrollTop","_getOffset","parent","parentEle","document","documentElement","getOffset","Sticker","exports","class_1","hostRef","_this","this","isRtl","scrollPosCache","scrollPosThresholdCache","cacheOffset","pauseResizeWatcher","listenForScrollParent","positions","pauseHide","hasBootstrapped","isStuck","isRootSticker","hide","scrollHide","multiStickerHide","scrollingTo","quietModeIsOn","stuckCounter","stickerIndex","_offset","autoResize","isSticky","offset","position","quietMode","h","w","hideOnNewStickers","breakPointMax","breakPointMin","setupParentResizeListener","parentSizeObserver","disconnect","undefined","ResizeObserver","entries","_i","entries_1","length","entry","height","width","contentRect","sticker","style","host","scrollWidth","toWatch","scrollParent","observe","onStickToDisplayEvent","e","detail","stickToEle","type","moveTrigger","raf","minHeight","stickToEleInitSize","scrollHeight","v","setTriggerPos","getBoundingClientRect","onStickEvent","__awaiter","getTriggerPos","incomingTriggerPos","_a","sent","includes","triggerPos","top","onScroll","y","handleScrollTo","handleScrollAway","prototype","isHiding","isSticking","shouldStick","pauseHiding","pause","updateTriggerOffset","trigger","stickerResizeListener","contentSizeObserver","entries_2","content","quietModeChange","setOffset","setAttribute","_v","_h","_b","_c","_d","setPos","pos","u","match","setTriggetPos","browserCanUseCssVariables","setProperty","positionChange","split","stuckChange","hasShadowDom","children","slottedContent","Array","from","forEach","child","appendChild","querySelector","order","nanoStuck","emit","nanoUnstuck","attachScrollListeners","addEventListener","passive","capture","removeEventListener","handleParentEvents","_","oldParent","manageListenersOnParent","stickToEleChange","oldEle","stickToChange","stickTo","visibilityDecisionHandler","handleHideChange","nanoHide","nanoShow","setupIO","io","root","IntersectionObserver","slice","addEvents","console","error","currScroll","Math","abs","toInitial","parentNode","insertBefore","nextSibling","getScrollParent","regex","parents","_node","ps","concat","prop","getComputedStyle","getPropertyValue","overflow","scroll","test","docHeight","HTMLElement","find","data","scrollAmt","parentBounding","rootBounds","bootstrapGurantor","createElement","classList","add","querySelectorAll","filter","findIndex","debounce","connectedCallback","dir","ownerDocument","setTimeout","disconnectedCallback","render","Host","sticky","siblings","index","stuck","placed-bottom","placed-top","placed-end","placed-start","class","ref","div"],"mappings":";;;6WAAA,IAAMA,EAAa,2tECsBnB,SAASC,EAAcC,GACrB,OAAOA,aAAeC,SAAWC,OAAOC,YAAcH,EAAII,UAG5D,SAASC,EAAWL,EAAkBM,GACpC,IAAIC,EACFD,aAAkBL,SAAWO,SAASC,gBAAkBH,EAC1D,OAAOI,EAAUV,EAAKO,OAcXI,EAAOC,EAAA,eAAA,WALpB,SAAAC,EAAAC,GAAA,IAAAC,EAAAC,mKAMUA,KAAAC,MAAiB,MAMjBD,KAAAE,eAAiB,EACjBF,KAAAG,wBAA0B,EAC1BH,KAAAI,YAAiD,EAEjDJ,KAAAK,mBAAqB,MACrBL,KAAAM,sBAAwB,MAExBN,KAAAO,UAAyB,GACzBP,KAAAQ,UAAqB,MACrBR,KAAAS,gBAAkB,MAMjBT,KAAAU,QAAU,MACVV,KAAAW,cAAgB,KAChBX,KAAAY,KAAO,MACPZ,KAAAa,WAAa,MACbb,KAAAc,iBAAmB,MACnBd,KAAAe,YAAc,MACdf,KAAAgB,cAAgB,MAChBhB,KAAAiB,aAAe,EACfjB,KAAAkB,aAAe,EAIflB,KAAAmB,QAA6C,EAK9CnB,KAAAoB,WAAa,KAGIpB,KAAAqB,SAAW,KAGXrB,KAAAsB,OAA4C,EAG7DtB,KAAAuB,SAA6B,MAM7BvB,KAAAwB,UAAqD,CAC3DC,EAAG,IACHC,EAAG,KAIG1B,KAAA2B,kBAAoB,KAGpB3B,KAAA4B,cAA+B,KAG/B5B,KAAA6B,cAA+B,KAmS/B7B,KAAA8B,0BAA4B,WAClC,GAAI/B,EAAKgC,mBAAoB,CAC3BhC,EAAKgC,mBAAmBC,aACxBjC,EAAKgC,mBAAqBE,UAG5BlC,EAAKgC,mBAAqB,IAAIG,GAAe,SAACC,GAC5C,IAAoB,IAAAC,EAAA,EAAAC,EAAAF,EAAAC,EAAAC,EAAAC,OAAAF,IAAS,CAAxB,IAAMG,EAAKF,EAAAD,GACd,IAAII,OAAc,EAAEC,OAAa,EACjC,GAAIF,EAAMG,YAAYF,OAAQA,EAASD,EAAMG,YAAYF,OACzD,GAAID,EAAMG,YAAYD,MAAOA,EAAQF,EAAMG,YAAYD,MAEvD,UAAW1C,EAAKyB,YAAc,SAAU,CACtC,GAAIiB,EAAQ1C,EAAKyB,UAAUE,GAAKc,EAASzC,EAAKyB,UAAUC,EACtD1B,EAAKiB,cAAgB,UAClBjB,EAAKiB,cAAgB,MAG5B,GAAIjB,EAAK8B,cAAe,CACtB,GAAIY,EAAQ1C,EAAK8B,cAAe9B,EAAKsB,SAAW,UAC3CtB,EAAKsB,SAAW,MAGvB,GAAItB,EAAK6B,cAAe,CACtB,GAAIa,EAAQ1C,EAAK6B,cAAe7B,EAAKsB,SAAW,UAC3CtB,EAAKsB,SAAW,MAGvB,GAAItB,EAAKY,eAAiBZ,EAAK4C,SAAW5C,EAAKqB,WAC7CrB,EAAK4C,QAAQC,MAAMH,MAAQ1C,EAAK8C,KAAKC,YAAc,SAIzD,IAAIC,EACFhD,EAAKiD,wBAAwB/D,SACzBc,EAAKiD,aAAavD,gBAClBM,EAAKiD,aACX,GAAID,EAAShD,EAAKgC,mBAAmBkB,QAAQF,IAKvC/C,KAAAkD,sBAAwB,SAC9BC,GAEA,GAAIA,EAAEC,OAAOT,UAAY5C,EAAKsD,WAAY,OAE1C,OAAQF,EAAEG,MACR,IAAK,WACHvD,EAAKoB,QAAU,EACfpB,EAAKK,YAAcL,EAAKuB,OACxBvB,EAAKuB,OAAS,EAEd,IAAKvB,EAAKW,QAASX,EAAKwD,YAAY,OAIpC,IAAKxD,EAAKY,eAAiBZ,EAAKiB,cAAe,CAC7CwC,GAAI,WACFzD,EAAKsD,WAAWT,MAAMa,UACpB1D,EAAK2D,mBAAmBlB,QACvBzC,EAAK8C,KAAKc,qBACD5D,EAAKK,cAAgB,SACzBL,EAAKK,YAAYwD,EACjB7D,EAAKK,cACX,KACFL,EAAKsD,WAAWQ,cAAc9D,EAAK2D,mBAAmBlB,QAAU,MAGpE,MACF,IAAK,WACHzC,EAAKoB,QAAUpB,EAAK2D,mBAAmBlB,OACvCzC,EAAKuB,OAASvB,EAAKK,YACnBL,EAAKwD,YAAY,MAGjB,IAAKxD,EAAKY,eAAiBZ,EAAKiB,cAAe,CAC7CwC,GAAI,WACFzD,EAAKsD,WAAWT,MAAMa,UAAY,GAClC1D,EAAKsD,WAAWQ,cAAc,MAGlC,MACF,IAAK,YACH9D,EAAK2D,mBAAqB3D,EAAKsD,WAAWS,wBAC1C/D,EAAKoB,QAAUpB,EAAK2D,mBAAmBlB,OACvC,QAiCExC,KAAA+D,aAAe,SACrBZ,GAAmD,OAAAa,UAAAjE,OAAA,OAAA,GAAA,+EAE/C4C,EAAUQ,EAAEC,OAASD,EAAEC,OAAOT,QAAU,KAC5C,IAAKA,GAAWA,EAAQpB,WAAavB,KAAKuB,SAAU,MAAA,CAAA,GAEzB,MAAA,CAAA,EAAMoB,EAAQsB,wBAAnCC,EAAqBC,EAAAC,OAE3B,GACEjB,EAAEG,OAAS,aACXX,IAAY3C,KAAK6C,MACjBF,EAAQK,eAAiBhD,KAAK6C,KAAKG,aACnC,CACAhD,KAAKkB,eAEL,IAAKlB,KAAK2B,kBAAmB,MAAA,CAAA,GAE7B,GACG3B,KAAKO,UAAU8D,SAAS,QACvBrE,KAAKsE,WAAWC,IAAML,EAAmBK,KAC1CvE,KAAKO,UAAU8D,SAAS,WACvBrE,KAAKsE,WAAWC,IAAML,EAAmBK,IAC3C,CACAvE,KAAKc,iBAAmB,KACxBd,KAAKiB,gBAIT,GACEkC,EAAEG,OAAS,eACXX,IAAY3C,KAAK6C,MACjBF,EAAQK,eAAiBhD,KAAK6C,KAAKG,aACnC,CACAhD,KAAKkB,eAEL,IAAKlB,KAAK2B,kBAAmB,MAAA,CAAA,GAE7B,GACG3B,KAAKO,UAAU8D,SAAS,QACvBrE,KAAKsE,WAAWC,IAAML,EAAmBK,KAC1CvE,KAAKO,UAAU8D,SAAS,WACvBrE,KAAKsE,WAAWC,IAAML,EAAmBK,IAC3C,CACAvE,KAAKiB,eACL,GAAIjB,KAAKiB,aAAe,EAAGjB,KAAKc,iBAAmB,yBAOjDd,KAAAwE,SAAW,WACjB,IAAIC,EAAY1F,EAAcgB,EAAKiD,cAGnC,GAAIyB,EAAI1E,EAAKG,eAAgB,CAC3B,IAAKH,EAAKQ,UAAU8D,SAAS,UAAWtE,EAAK2E,sBACxC3E,EAAK4E,iBAAiBF,GAI7B,GAAIA,EAAI1E,EAAKG,eAAgB,CAC3B,IAAKH,EAAKQ,UAAU8D,SAAS,UAAWtE,EAAK4E,iBAAiBF,QACzD1E,EAAK2E,iBAEZ3E,EAAKG,eAAiBuE,GA5blB5E,EAAA+E,UAAAC,SAAN,gGACE,MAAA,CAAA,EAAO7E,KAAKY,aAQRf,EAAA+E,UAAAE,WAAN,gGACE9E,KAAK+E,cACL,MAAA,CAAA,EAAO/E,KAAKU,gBAKRb,EAAA+E,UAAAf,cAAN,SAAoBvC,wFAClB,MAAA,CAAA,EAAQtB,KAAKmB,QAAUG,UAKnBzB,EAAA+E,UAAAX,cAAN,gGACE,MAAA,CAAA,EAAOjE,KAAKsE,mBAKRzE,EAAA+E,UAAAI,YAAN,SAAkBC,wFAChB,MAAA,CAAA,EAAQjF,KAAKQ,UAAYyE,UAQ3BpF,EAAA+E,UAAAM,oBAAA,WACE,IAAKlF,KAAKmF,UAAYnF,KAAKgD,eAAiBhD,KAAKM,sBAC/C,OACFN,KAAKsE,WAAajF,EAAWW,KAAKmF,QAASnF,KAAKgD,eAMlDnD,EAAA+E,UAAAQ,sBAAA,WAAA,IAAArF,EAAAC,KACE,GAAIA,KAAKqF,oBAAqB,CAC5BrF,KAAKqF,oBAAoBrD,aACzBhC,KAAKqF,oBAAsBpD,UAG7BjC,KAAKqF,oBAAsB,IAAInD,GAAe,SAACC,GAC7C,IAAoB,IAAAC,EAAA,EAAAkD,EAAAnD,EAAAC,EAAAkD,EAAAhD,OAAAF,IAAS,CAAxB,IAAMG,EAAK+C,EAAAlD,GACd,GAAIrC,EAAKM,mBAAoB,OAE7B,GAAIkC,EAAMG,YAAYF,OAAQ,CAC5B,GAAIzC,EAAKwB,WAAa,MACpBxB,EAAK8C,KAAKD,MAAMJ,OAASD,EAAMG,YAAYF,OAAS,KACtD,GAAIzC,EAAKwB,WAAa,SACpBxB,EAAK8C,KAAKD,MAAMa,UAAYlB,EAAMG,YAAYF,OAAS,UAI/DxC,KAAKqF,oBAAoBpC,QAAQjD,KAAKuF,UAIxC1F,EAAA+E,UAAAY,gBAAA,WAAA,IAAAzF,EAAAC,KACE,GAAIA,KAAKwB,YAAc,KAAMgC,GAAI,WAAA,OAAOzD,EAAKiB,cAAgB,aACxD,GAAIhB,KAAKwB,YAAc,MAAOgC,GAAI,WAAA,OAAOzD,EAAKiB,cAAgB,UAMrEnB,EAAA+E,UAAAa,UAAA,uBAAA,IAAA1F,EAAAC,KACEA,KAAKmF,QAAQO,aAAa,QAAS,IACnC,IAAI9B,EAAWnC,EAAWkE,EAAYC,EACtC,IAAIjD,EACF3C,KAAKW,eAAiBX,KAAKqD,WAAarD,KAAK2C,QAAU3C,KAAK6C,KAE9D,IAAKF,EAAS,OAEd,UAAW3C,KAAKsB,SAAW,SAAW6C,EAAWnE,KAAKsB,OAAdsC,EAACO,EAAAP,EAAEnC,EAAC0C,EAAA1C,OACvCmC,EAAInC,EAAIzB,KAAKsB,OAElB,UAAWtB,KAAKmB,UAAY,SAAW0E,EAAqB7F,KAAKmB,QAAxB2E,EAAAD,EAAAjC,EAAAA,EAACkC,SAAA,EAAGH,EAAEG,EAAEC,EAAAF,EAAApE,EAAAA,EAACsE,SAAA,EAAGH,EAAEG,OAClDJ,EAAKC,EAAK5F,KAAKmB,QAEpB,IAAM6E,EAAS,SAACC,GACd,IAAIC,EAAID,EAAIE,MAAM,gBAAkBvC,EAAInC,EACxC2E,EAAcH,GACdtD,EAAQC,MAAMqD,GAAOC,EAAI,KACzB,IAAKG,IAA6B,OAClC,GAAIH,EACFnG,EAAK8C,KAAKD,MAAM0D,YACd,0BACA,WAAWJ,EAAC,YAEXnG,EAAK8C,KAAKD,MAAM0D,YAAY,0BAA2B,OAG9D,IAAMF,EAAgB,SAACH,GACrB,IAAIC,EAAID,EAAIE,MAAM,gBAAkBvC,EAAI+B,EAAKlE,EAAImE,EACjD7F,EAAKoF,QAAQvC,MAAMqD,GAAOC,GAAK,EAAI,KACnCnG,EAAKoF,QAAQvC,MAAMrB,SAAW,WAC9BxB,EAAKoF,QAAQvC,MAAMJ,OAAS,OAG9B,GACGxC,KAAKO,UAAU8D,SAAS,UAAYrE,KAAKC,OACzCD,KAAKO,UAAU8D,SAAS,SAAWrE,KAAKC,MAEzC+F,EAAO,SAET,GACGhG,KAAKO,UAAU8D,SAAS,QAAUrE,KAAKC,OACvCD,KAAKO,UAAU8D,SAAS,WAAarE,KAAKC,MAE3C+F,EAAO,QAET,GAAIhG,KAAKO,UAAU8D,SAAS,OAAQ2B,EAAO,OAC3C,GAAIhG,KAAKO,UAAU8D,SAAS,UAAW2B,EAAO,WAIhDnG,EAAA+E,UAAA2B,eAAA,WACEvG,KAAKO,UAAYP,KAAKuB,SAASiF,MAAM,KACrCxG,KAAKyF,aAMD5F,EAAA+E,UAAA6B,YAAN,iHACE,GAAIzG,KAAKU,QAAS,CAChB,GAAIV,KAAKqD,WAAY,CACfkC,EAAUmB,EAAa1G,KAAK6C,MAC5B7C,KAAK6C,KAAK8D,SACV3G,KAAKuF,QAAQoB,SACjB3G,KAAK4G,eAAiBC,MAAMC,KAAKvB,GAEjCvF,KAAK4G,eAAeG,SAAQ,SAACC,GAC3B,GAAIN,EAAa3G,EAAK8C,MAAO9C,EAAKsD,WAAW4D,YAAYD,QAEvDjH,EAAKsD,WACF6D,cAAc,oBACdD,YAAYD,GACjBA,EAAMpE,MAAMuE,MAAQpH,EAAKmB,aAAe,MAG1ClB,KAAKoH,UAAUC,KAAK,CAAE1E,QAAS3C,KAAKqD,kBAC/BrD,KAAKoH,UAAUC,KAAK,CAAE1E,QAAS3C,KAAK6C,WACtC,CACL7C,KAAKa,WAAa,MAElB,GAAIb,KAAKqD,WAAY,CACnBrD,KAAK4G,eAAeG,SAAQ,SAACC,GAC3BjH,EAAK8C,KAAKoE,YAAYD,GACtBA,EAAMpE,MAAMuE,MAAQ,MAEtBnH,KAAKsH,YAAYD,KAAK,CAAE1E,QAAS3C,KAAKqD,kBACjCrD,KAAKsH,YAAYD,KAAK,CAAE1E,QAAS3C,KAAK6C,wBAMjDhD,EAAA+E,UAAA2C,sBAAA,WACE,GAAIvH,KAAKgB,cACPhB,KAAKgD,aAAawE,iBAAiB,SAAUxH,KAAKwE,SAAU,CAC1DiD,QAAS,KACTC,QAAS,aAER,GAAI1H,KAAKgD,aAAc,CAC1BhD,KAAKgD,aAAa2E,oBAAoB,SAAU3H,KAAKwE,UACrDxE,KAAKuD,YAAY,QAOrB1D,EAAA+E,UAAAgD,mBAAA,SAAmBC,EAAGC,GAAA,GAAAA,SAAA,EAAA,CAAAA,EAAA,KACpB,IAAK9H,KAAKM,sBAAuB,OACjC,GAAIwH,EAAW9H,KAAK+H,wBAAwB,MAAOD,GACnD,GAAI9H,KAAKgD,aAAchD,KAAK+H,yBAAyB/H,KAAKqD,aAM5DxD,EAAA+E,UAAAoD,iBAAA,SAAiBH,EAAGI,GAClB,GAAIjI,KAAKqD,WAAY,CACnBrD,KAAKqD,WAAWmE,iBAAiB,WAAYxH,KAAKkD,uBAClDlD,KAAKqD,WAAWmE,iBAAiB,WAAYxH,KAAKkD,uBAClDlD,KAAKqD,WAAWmE,iBAAiB,YAAaxH,KAAKkD,uBACnDlD,KAAKqD,WAAWmE,iBACd,cACAxH,KAAKkD,uBAGT,GAAI+E,EAAQ,CACVA,EAAON,oBAAoB,WAAY3H,KAAKkD,uBAC5C+E,EAAON,oBAAoB,WAAY3H,KAAKkD,uBAC5C+E,EAAON,oBAAoB,YAAa3H,KAAKkD,uBAC7C+E,EAAON,oBAAoB,cAAe3H,KAAKkD,yBAMnDrD,EAAA+E,UAAAsD,cAAA,WACE,GAAIlI,KAAKmI,QACPnI,KAAKqD,WAAarD,KAAKgD,aAAakE,cAAclH,KAAKmI,cACpDnI,KAAKqD,WAAapB,WAMzBpC,EAAA+E,UAAAwD,0BAAA,WACE,GAAIpI,KAAKc,kBAAoBd,KAAKa,WAAYb,KAAKY,KAAO,UACrDZ,KAAKY,KAAO,OAInBf,EAAA+E,UAAAyD,iBAAA,WACE,GAAIrI,KAAKY,KAAMZ,KAAKsI,SAASjB,KAAK,CAAE1E,QAAS3C,KAAK6C,YAC7C7C,KAAKuI,SAASlB,KAAK,CAAE1E,QAAS3C,KAAK6C,QAI1ChD,EAAA+E,UAAA4D,QAAA,WAAA,IAAAzI,EAAAC,KACE,GAAIA,KAAKyI,GAAI,CACXzI,KAAKyI,GAAGzG,aACRhC,KAAKyI,GAAKxG,UAEZ,IAAKjC,KAAKgD,eAAiBhD,KAAKS,kBAAoBT,KAAKmF,QAAS,OAElEnF,KAAKW,cAAgBX,KAAKgD,wBAAwB/D,SAClD,IAAIyJ,EAAO1I,KAAKgD,aAChB,GAAIhD,KAAKgD,wBAAwB/D,SAAUyJ,EAAO,KAElD1I,KAAKyI,GAAK,IAAIvJ,OAAOyJ,sBACnB,SAACd,GACC,GAAI9H,EAAKM,qBAAuBN,EAAKsB,SAAU,OAC/CtB,EAAKgF,YAAY8C,EAAEe,OAAO,GAAG,MAE/B,CAAEF,KAAMA,IAGV1I,KAAKyI,GAAGxF,QAAQjD,KAAKmF,UAmGftF,EAAA+E,UAAAmD,wBAAA,SACNc,EACA7J,GAEA,IAAIgE,EAAehE,GAAOgB,KAAKgD,aAE/B,IAAKA,EAAc,OAEnB,IAAK6F,EAAW,CACd,IACE,GAAI7I,KAAKgB,cACPgC,EAAa2E,oBAAoB,SAAU3H,KAAKwE,UAClDxB,EAAa2E,oBAAoB,YAAa3H,KAAK+D,cACnDf,EAAa2E,oBAAoB,cAAe3H,KAAK+D,cACrD,MAAOZ,GACP2F,QAAQC,MAAM,kCAEX,CACL/F,EAAawE,iBAAiB,YAAaxH,KAAK+D,cAChDf,EAAawE,iBAAiB,cAAexH,KAAK+D,cAElD,GAAI/D,KAAKgB,cAAehB,KAAKuH,wBAE/BvH,KAAK8B,6BA0ECjC,EAAA+E,UAAAF,eAAA,WACN1E,KAAKG,wBAA0B,KAC/B,IAAKH,KAAKa,WAAY,OAEtB,GAAIb,KAAKe,cAAgB,KAAM,CAC7Bf,KAAKmB,QAAUnB,KAAKI,aAAeJ,KAAKmB,QAE1CnB,KAAKe,YAAc,KACnBf,KAAKa,WAAa,OAGZhB,EAAA+E,UAAAD,iBAAA,SAAiBqE,GACvB,GAAIhJ,KAAKa,WAAY,OAErB,IAAKb,KAAKU,QAAS,OAEnB,GAAIV,KAAKe,cAAgB,MAAO,CAC9Bf,KAAKI,YAAcJ,KAAKmB,QACxBnB,KAAKmB,QAAU,EAEjBnB,KAAKe,YAAc,MAEnB,IAAKf,KAAKG,wBACRH,KAAKG,wBAA0B6I,OAC5B,IACFhJ,KAAKQ,WACNyI,KAAKC,IAAIF,EAAahJ,KAAKG,yBAA2B,IAEtDH,KAAKa,WAAa,MAGdhB,EAAA+E,UAAArB,YAAA,SAAY4F,GAClB,GACGnJ,KAAKO,UAAU8D,SAAS,YAAc8E,IACrCnJ,KAAKO,UAAU8D,SAAS,WAAa8E,EACvC,CACAnJ,KAAK6C,KAAKuG,WAAWC,aAAarJ,KAAKmF,QAASnF,KAAK6C,WAErD7C,KAAK6C,KAAKuG,WAAWC,aAAarJ,KAAKmF,QAASnF,KAAK6C,KAAKyG,cAItDzJ,EAAA+E,UAAA2E,gBAAA,WACN,IAAMC,EAAQ,gBACd,IAAMC,EAAU,SAACC,EAAaC,GAC5B,GAAID,EAAMN,aAAe,KAAM,CAC7B,OAAOO,EAET,OAAOF,EAAQC,EAAMN,WAAYO,EAAGC,OAAO,CAACF,MAE9C,IAAM9G,EAAQ,SAAC8G,EAAOG,GACpB,OAAAC,iBAAiBJ,EAAO,MAAMK,iBAAiBF,IACjD,IAAMG,EAAW,SAACN,GAChB,OAAA9G,EAAM8G,EAAO,YACb9G,EAAM8G,EAAO,cACb9G,EAAM8G,EAAO,eACf,IAAMO,EAAS,SAACP,GAAU,OAAAF,EAAMU,KAAKF,EAASN,KAC9C,IAAMS,EAAY3K,SAASC,gBAAgBqE,wBAAwBtB,OAEnE,IAAMQ,EAAe,SAAC0G,GACpB,KAAMA,aAAiBU,aAAc,OAErC,IAAMT,EAAKF,EAAQC,EAAO,IAC1B,OACEC,EAAGU,MACD,SAACrL,GACC,OAAAiL,EAAOjL,IAAQA,EAAI8E,wBAAwBtB,SAAW2H,MACrD3K,UAIT,OAAOwD,EAAahD,KAAK6C,OAGnBhD,EAAA+E,UAAAG,YAAA,SAAYuF,GAClB,IAAIC,EAEJ,GAAIvK,KAAKO,UAAU8D,SAAS,OAAQ,CAClC,IAAKrE,KAAKW,cACR4J,EAAYlL,EAAWW,KAAKmF,QAASnF,KAAKgD,cAAcuB,SACrDgG,EAAYvK,KAAKmF,QAAQrB,wBAAwBS,IACtDvE,KAAKU,QAAU6J,GAAa,OACvB,GAAIvK,KAAKO,UAAU8D,SAAS,UAAW,CAC5CkG,EAAYvK,KAAKmF,QAAQrB,wBAAwBS,IACjD,IAAMiG,EACJF,GAAQA,EAAKG,WACTH,EAAKG,YACJzK,KAAKgD,wBAAwB/D,SAC1BO,SAASC,gBACTO,KAAKgD,cACPc,wBACR9D,KAAKU,QAAU6J,EAAYC,EAAehI,OAASgI,EAAejG,MAI9D1E,EAAA+E,UAAA8F,kBAAA,WAAA,IAAA3K,EAAAC,KACNA,KAAKS,gBAAkB,KAEvBT,KAAKgD,aAAehD,KAAKgD,cAAgBhD,KAAKuJ,kBAC9CvJ,KAAKW,cAAgBX,KAAKgD,wBAAwB/D,SAElDe,KAAKmF,QAAUnF,KAAKmF,SAAW3F,SAASmL,cAAc,OACtD3K,KAAKmF,QAAQyF,UAAUC,IAAI,mBAE3B7K,KAAKuG,iBACLvG,KAAKuD,YAAY,MACjBvD,KAAKwF,kBAELxF,KAAKM,sBAAwB,KAC7BN,KAAK4H,mBAAmB,MAExB5H,KAAKkB,aAAe2F,MAAMC,KACxB9G,KAAKgD,aAAa8H,iBAAiB,iBAElCC,QACC,SAACpI,GAAoC,OAAAA,EAAQpB,WAAaxB,EAAKwB,YAEhEyJ,WAAU,SAACrI,GAAY,OAAAA,IAAY5C,EAAK8C,QAE3C7C,KAAKyF,YACLzF,KAAKoF,wBACLpF,KAAK8B,4BAGL9B,KAAK4G,eAAiBC,MAAMC,KAAK9G,KAAK6C,KAAK8D,UAC3C3G,KAAK4G,eAAeG,SAAQ,SAACC,GAC3BA,EAAMpE,MAAMuE,MAAQpH,EAAKmB,aAAe,MAG1ClB,KAAKkF,sBACLlF,KAAKkI,gBACLlI,KAAKwI,UACLxI,KAAKkD,sBAAwB+H,EAASjL,KAAKkD,sBAAuB,KAKpErD,EAAA+E,UAAAsG,kBAAA,WAAA,IAAAnL,EAAAC,KACEA,KAAKC,MACHD,KAAK6C,KAAKsI,MAAQ,OACjBnL,KAAK6C,KAAKuI,cAA2BD,MAAQ,MAGhD3L,SAASC,gBAAgB+H,iBAAiB,uBAAuB,WAC/D6D,YAAW,SAACxD,GAAM,OAAA9H,EAAK2K,sBAAqB,QAE9CW,YAAW,SAACxD,GACV,IAAK9H,EAAKU,gBAAiBV,EAAK2K,sBAC/B,MAGL7K,EAAA+E,UAAA0G,qBAAA,WACE,GAAItL,KAAKyI,GAAI,CACXzI,KAAKyI,GAAGzG,aACRhC,KAAKyI,GAAKxG,UAGZ,GAAIjC,KAAK+B,mBAAoB,CAC3B/B,KAAK+B,mBAAmBC,aACxBhC,KAAK+B,mBAAqBE,UAG5BjC,KAAKgD,aAAe,KACpBhD,KAAKS,gBAAkB,OAGzBZ,EAAA+E,UAAA2G,OAAA,WAAA,IAAAxL,EAAAC,KACE,OACEyB,EAAC+J,EAAI,CACHC,QAASzL,KAAKW,gBAAkBX,KAAKqD,YAAcrD,KAAKqB,SACxDT,KAAMZ,KAAKY,MAAQZ,KAAKU,QACxBgL,SAAU1L,KAAKiB,aACf0K,MAAO3L,KAAKkB,aACZ0K,MAAO5L,KAAKU,SAAWV,KAAKqB,SAAQwK,gBACrB7L,KAAKO,UAAU8D,SAAS,UAASyH,aACpC9L,KAAKO,UAAU8D,SAAS,OAAM0H,aAC9B/L,KAAKO,UAAU8D,SAAS,OAAM2H,eAC5BhM,KAAKO,UAAU8D,SAAS,UAEtC5C,EAAA,MAAA,CACEwK,MAAO,CACLtJ,QAAS,KACT8I,OAAQzL,KAAKW,eAAiBX,KAAKqB,SACnCuK,MAAO5L,KAAKU,SAAWV,KAAKW,eAAiBX,KAAKqB,SAClDT,KAAMZ,KAAKW,eAAiBX,KAAKY,MAAQZ,KAAKU,SAEhDwL,IAAK,SAACC,GAAG,OAAMpM,EAAK4C,QAAUwJ,IAE9B1K,EAAA,MAAA,CAAKwK,MAAM,kBAAkBC,IAAK,SAACC,GAAG,OAAMpM,EAAKwF,QAAU4G,IACzD1K,EAAA,OAAA,osBA/tBQ","sourcesContent":["@import '../../global/style/nano-theme/layers';\n\n:host {\n  /**\n  * @prop --stuck-left: The left position when your sticker is stuck. This can be useful to force your sticker to fill the viewport for example. Defaults to initial\n  * @prop --stuck-right: The right position when your sticker is stuck. This can be useful to force your sticker to fill the viewport for example. Defaults to initial\n  * @prop --stuck-z-index: The z-index order to display your sticker. Can be useful when displaying multiple stickers simultaneously. Defaults to #{$layer-index-menubar};\n  @prop --top-hide: This is used for the hide transform animation (e.g. when quiet-mode is on). Defaults to translateY(-110%);\n  @prop --bottom-hide: This is used for the hide transform animation (e.g. when quiet-mode is on). Defaults to translateY(110%);\n  */\n\n  --stuck-left: initial;\n  --stuck-right: initial;\n  --stuck-z-index: #{$layer-index-menubar};\n  --top-hide: translateY(-110%);\n  --bottom-hide: translateY(110%);\n\n  display: block;\n  max-width: 100%;\n}\n\n:host([sticky]) {\n  position: sticky;\n  transition: 0.3s ease transform;\n  will-change: min-height;\n}\n\n:host([sticky][stuck]) {\n  left: var(--stuck-left);\n  right: var(--stuck-right);\n  z-index: var(--stuck-z-index) !important;\n}\n\n:host([sticky][hide][placed-top]) {\n  transform: var(--top-hide);\n}\n\n:host([sticky][hide][placed-bottom]) {\n  transform: var(--bottom-hide);\n}\n\n:host([sticky][index='1']) {\n  z-index: calc(var(--stuck-z-index) + 1);\n}\n\n:host([sticky][index='2']) {\n  z-index: calc(var(--stuck-z-index) + 2);\n}\n\n:host([sticky][index='3']) {\n  z-index: calc(var(--stuck-z-index) + 3);\n}\n\n:host([sticky][index='4']) {\n  z-index: calc(var(--stuck-z-index) + 4);\n}\n\n:host([sticky][index='5']) {\n  z-index: calc(var(--stuck-z-index) + 5);\n}\n\n.sticker {\n  display: inherit;\n  max-width: inherit;\n  width: 100%;\n\n  &:not(.stuck) {\n    width: auto !important;\n  }\n\n  &.sticky {\n    transition: 0.3s ease all;\n    position: relative;\n\n    :host([index='1']) & {\n      z-index: calc(var(--stuck-z-index) + 1);\n    }\n\n    :host([index='2']) & {\n      z-index: calc(var(--stuck-z-index) + 2);\n    }\n\n    :host([index='3']) & {\n      z-index: calc(var(--stuck-z-index) + 3);\n    }\n\n    :host([index='4']) & {\n      z-index: calc(var(--stuck-z-index) + 4);\n    }\n\n    :host([index='5']) & {\n      z-index: calc(var(--stuck-z-index) + 5);\n    }\n  }\n\n  &.stuck {\n    position: fixed;\n    left: var(--stuck-left);\n    right: var(--stuck-right);\n    z-index: var(--stuck-z-index);\n    transform: translateY(0);\n\n    :host([placed-top]) & {\n      top: 0;\n    }\n\n    :host([placed-bottom]) & {\n      bottom: 0;\n    }\n\n    &.hide {\n      :host([placed-top]) & {\n        transform: var(--top-hide);\n      }\n\n      :host([placed-bottom]) & {\n        transform: var(--bottom-hide);\n      }\n    }\n  }\n}\n\n.sticker-content {\n  display: flex;\n  flex-wrap: wrap;\n}\n","import {\n  Component,\n  ComponentInterface,\n  h,\n  Host,\n  Prop,\n  State,\n  Watch,\n  Element,\n  Event,\n  EventEmitter,\n  Method,\n} from '@stencil/core';\nimport ResizeObserver from 'resize-observer-polyfill';\nimport {\n  browserCanUseCssVariables,\n  debounce,\n  getOffset,\n  hasShadowDom,\n  raf,\n} from '../../utils';\n\nfunction _getScrollTop(ele: HTMLElement | Document) {\n  return ele instanceof Document ? window.pageYOffset : ele.scrollTop;\n}\n\nfunction _getOffset(ele: HTMLElement, parent: HTMLElement | Document) {\n  let parentEle =\n    parent instanceof Document ? document.documentElement : parent;\n  return getOffset(ele, parentEle);\n}\n\ntype Positions = 'top' | 'bottom' | 'start' | 'end';\n\n/**\n * The Sticker component is a toolbox for 'sticking' items to scrolling containers.\n *\n */\n@Component({\n  tag: 'nano-sticker',\n  styleUrl: 'sticker.scss',\n  shadow: true,\n})\nexport class Sticker implements ComponentInterface {\n  private isRtl: boolean = false;\n  private io: IntersectionObserver;\n  private contentSizeObserver: ResizeObserver;\n  private parentSizeObserver: ResizeObserver;\n  private sticker: HTMLDivElement;\n  private content: HTMLDivElement;\n  private scrollPosCache = 0;\n  private scrollPosThresholdCache = 0;\n  private cacheOffset: number | { v: number; h: number } = 0;\n  private slottedContent: Element[];\n  private pauseResizeWatcher = false;\n  private listenForScrollParent = false;\n  private stickToEleInitSize?: DOMRect;\n  private positions: Positions[] = [];\n  private pauseHide: boolean = false;\n  private hasBootstrapped = false;\n\n  @Element() host: HTMLNanoStickerElement;\n\n  // Internal State\n\n  @State() isStuck = false;\n  @State() isRootSticker = true;\n  @State() hide = false;\n  @State() scrollHide = false;\n  @State() multiStickerHide = false;\n  @State() scrollingTo = false;\n  @State() quietModeIsOn = false;\n  @State() stuckCounter = 0;\n  @State() stickerIndex = 0;\n  @State() stickToEle?: HTMLNanoStickerElement;\n  @State() triggerPos: { top: number; left: number };\n  @State() trigger: HTMLDivElement;\n  @State() _offset: number | { v: number; h: number } = 0;\n\n  // Public API\n\n  /** Only applicable to root stickers. When applied the sticker will grow or shrink to the scrollParent size */\n  @Prop() autoResize = true;\n\n  /** Manually enable / disabled sticky behaviour */\n  @Prop({ mutable: true }) isSticky = true;\n\n  /** Distance the item should be stuck from the sticky edge. */\n  @Prop({ mutable: true }) offset: number | { v: number; h: number } = 0;\n\n  /** The edge of the scroll-parent to stick to */\n  @Prop() position: 'top' | 'bottom' = 'top';\n  // other opts I'd like one day. 'start' | 'end' | 'top-start' | 'top-end' | 'bottom-start' | 'bottom-end'\n\n  /** When applied, the sticker will hide when the scroll-parent\n   * is scrolling away from the sticker's stuck position and show when scrolling toward it.\n   * By default this will apply when the parent is below either the h or w dimensions */\n  @Prop() quietMode: 'on' | 'off' | { h: number; w: number } = {\n    h: 600,\n    w: 600,\n  };\n\n  /** When applied stickers will hide upon new stickers being stuck to the same position */\n  @Prop() hideOnNewStickers = true;\n\n  /** The max width of the item to implement sticky behaviour. */\n  @Prop() breakPointMax: null | number = null;\n\n  /** The min width of the item to implement sticky behaviour. */\n  @Prop() breakPointMin: null | number = null;\n\n  /** Define which scroll element to listen & stick to.\n   * By default, it will find traverse the DOM to find the closest. */\n  @Prop({ mutable: true }) scrollParent?: HTMLElement | Document;\n\n  /** Upon being stuck, attach the sticker to another sticker element.\n   * A JS query selector that returns a <nano-sticker> */\n  @Prop() stickTo: string;\n\n  // Broadcasted Events\n\n  /** Emitted when a sticker is stuck */\n  @Event() nanoStuck!: EventEmitter<{ sticker: HTMLNanoStickerElement }>;\n\n  /** Emitted when a sticker is unstuck */\n  @Event() nanoUnstuck!: EventEmitter<{ sticker: HTMLNanoStickerElement }>;\n\n  /** Emitted when a sticker is hidden */\n  @Event() nanoHide!: EventEmitter<{ sticker: HTMLNanoStickerElement }>;\n\n  /** Emitted when a sticker is showing */\n  @Event() nanoShow!: EventEmitter<{ sticker: HTMLNanoStickerElement }>;\n\n  // Public methods\n\n  /**\n   * Method to return the visibility status of the sticker\n   * @returns boolean\n   */\n  @Method()\n  async isHiding() {\n    return this.hide;\n  }\n\n  /**\n   * Method to return the stuck status of the sticker\n   * @returns boolean\n   */\n  @Method()\n  async isSticking() {\n    this.shouldStick();\n    return this.isStuck;\n  }\n\n  /** @internal */\n  @Method()\n  async setTriggerPos(offset: number | { v: number; h: number }) {\n    return (this._offset = offset);\n  }\n\n  /** @internal */\n  @Method()\n  async getTriggerPos() {\n    return this.triggerPos;\n  }\n\n  /** @internal */\n  @Method()\n  async pauseHiding(pause: boolean) {\n    return (this.pauseHide = pause);\n  }\n\n  // Watchers\n\n  /** Keep a note of trigger position. Need this to track sticker order in the DOM */\n  @Watch('trigger')\n  @Watch('scrollParent')\n  updateTriggerOffset() {\n    if (!this.trigger || !this.scrollParent || !this.listenForScrollParent)\n      return;\n    this.triggerPos = _getOffset(this.trigger, this.scrollParent);\n  }\n\n  /** A root sticker is a fixed element Or this sticker is sticking to another.\n   * We need a content resize watcher to make sure we maintain a correct placeholder size in the body */\n  @Watch('position')\n  stickerResizeListener() {\n    if (this.contentSizeObserver) {\n      this.contentSizeObserver.disconnect();\n      this.contentSizeObserver = undefined;\n    }\n\n    this.contentSizeObserver = new ResizeObserver((entries) => {\n      for (const entry of entries) {\n        if (this.pauseResizeWatcher) return;\n\n        if (entry.contentRect.height) {\n          if (this.position === 'top')\n            this.host.style.height = entry.contentRect.height + 'px';\n          if (this.position === 'bottom')\n            this.host.style.minHeight = entry.contentRect.height + 'px';\n        }\n      }\n    });\n    this.contentSizeObserver.observe(this.content);\n  }\n\n  @Watch('quietMode')\n  quietModeChange() {\n    if (this.quietMode === 'on') raf(() => (this.quietModeIsOn = true));\n    else if (this.quietMode === 'off') raf(() => (this.quietModeIsOn = false));\n  }\n\n  /** offset is part of the public API but we also use it to manipulate trigger points */\n  @Watch('offset')\n  @Watch('_offset')\n  setOffset() {\n    this.trigger.setAttribute('style', '');\n    let v: number, h: number, _v: number, _h: number;\n    let sticker: HTMLElement =\n      this.isRootSticker || this.stickToEle ? this.sticker : this.host;\n\n    if (!sticker) return;\n\n    if (typeof this.offset === 'object') ({ v, h } = this.offset);\n    else v = h = this.offset;\n\n    if (typeof this._offset === 'object') ({ v = _v, h = _h } = this._offset);\n    else _v = _h = this._offset;\n\n    const setPos = (pos: 'top' | 'bottom' | 'left' | 'right') => {\n      let u = pos.match(/(top|bottom)/) ? v : h;\n      setTriggetPos(pos);\n      sticker.style[pos] = u + 'px';\n      if (!browserCanUseCssVariables()) return;\n      if (u)\n        this.host.style.setProperty(\n          '--hide-transform-amount',\n          `(110% + ${u}px)`\n        );\n      else this.host.style.setProperty('--hide-transform-amount', null);\n    };\n\n    const setTriggetPos = (pos: 'top' | 'bottom' | 'left' | 'right') => {\n      let u = pos.match(/(top|bottom)/) ? v + _v : h + _h;\n      this.trigger.style[pos] = u * -1 + 'px';\n      this.trigger.style.position = 'relative';\n      this.trigger.style.height = '1px';\n    };\n\n    if (\n      (this.positions.includes('start') && this.isRtl) ||\n      (this.positions.includes('end') && !this.isRtl)\n    )\n      setPos('right');\n\n    if (\n      (this.positions.includes('end') && this.isRtl) ||\n      (this.positions.includes('start') && !this.isRtl)\n    )\n      setPos('left');\n\n    if (this.positions.includes('top')) setPos('top');\n    if (this.positions.includes('bottom')) setPos('bottom');\n  }\n\n  @Watch('position')\n  positionChange() {\n    this.positions = this.position.split('-') as Positions[];\n    this.setOffset();\n  }\n\n  /** If this sticker is attached to a 'master' sticker (stickToEle),\n   * here we move the content of this sticker in and out accordingly */\n  @Watch('isStuck')\n  async stuckChange() {\n    if (this.isStuck) {\n      if (this.stickToEle) {\n        let content = hasShadowDom(this.host)\n          ? this.host.children\n          : this.content.children;\n        this.slottedContent = Array.from(content);\n\n        this.slottedContent.forEach((child: HTMLElement) => {\n          if (hasShadowDom(this.host)) this.stickToEle.appendChild(child);\n          else\n            this.stickToEle\n              .querySelector('.sticker-content')\n              .appendChild(child);\n          child.style.order = this.stickerIndex + '';\n        });\n\n        this.nanoStuck.emit({ sticker: this.stickToEle });\n      } else this.nanoStuck.emit({ sticker: this.host });\n    } else {\n      this.scrollHide = false;\n\n      if (this.stickToEle) {\n        this.slottedContent.forEach((child: HTMLElement) => {\n          this.host.appendChild(child);\n          child.style.order = '';\n        });\n        this.nanoUnstuck.emit({ sticker: this.stickToEle });\n      } else this.nanoUnstuck.emit({ sticker: this.host });\n    }\n  }\n\n  /** attach scroll listener. 'hides' stickers when scrolling away from trigger and 'shows' when scrolling toward */\n  @Watch('quietModeIsOn')\n  attachScrollListeners() {\n    if (this.quietModeIsOn)\n      this.scrollParent.addEventListener('scroll', this.onScroll, {\n        passive: true,\n        capture: false,\n      });\n    else if (this.scrollParent) {\n      this.scrollParent.removeEventListener('scroll', this.onScroll);\n      this.moveTrigger(true);\n    }\n  }\n\n  /** Add / remove parent scrolling listeners. If there's stickToEle we need to remove them */\n  @Watch('scrollParent')\n  @Watch('stickToEle')\n  handleParentEvents(_, oldParent: null | HTMLElement = null) {\n    if (!this.listenForScrollParent) return;\n    if (oldParent) this.manageListenersOnParent(false, oldParent);\n    if (this.scrollParent) this.manageListenersOnParent(!this.stickToEle);\n  }\n\n  /** Add remove specific listeners if we're sticking to a sticker.\n   * We need to adjust triggers according to the status of the 'master'  */\n  @Watch('stickToEle')\n  stickToEleChange(_, oldEle: null | HTMLNanoStickerElement) {\n    if (this.stickToEle) {\n      this.stickToEle.addEventListener('nanoHide', this.onStickToDisplayEvent);\n      this.stickToEle.addEventListener('nanoShow', this.onStickToDisplayEvent);\n      this.stickToEle.addEventListener('nanoStuck', this.onStickToDisplayEvent);\n      this.stickToEle.addEventListener(\n        'nanoUnstuck',\n        this.onStickToDisplayEvent\n      );\n    }\n    if (oldEle) {\n      oldEle.removeEventListener('nanoHide', this.onStickToDisplayEvent);\n      oldEle.removeEventListener('nanoShow', this.onStickToDisplayEvent);\n      oldEle.removeEventListener('nanoStuck', this.onStickToDisplayEvent);\n      oldEle.removeEventListener('nanoUnstuck', this.onStickToDisplayEvent);\n    }\n  }\n\n  /** Find and set the stickToEle from the public, selector string */\n  @Watch('stickTo')\n  stickToChange() {\n    if (this.stickTo)\n      this.stickToEle = this.scrollParent.querySelector(this.stickTo);\n    else this.stickToEle = undefined;\n  }\n\n  /** 2 potential criteria for hiding. Multi-stickers or quietmode. */\n  @Watch('multiStickerHide')\n  @Watch('scrollHide')\n  visibilityDecisionHandler() {\n    if (this.multiStickerHide || this.scrollHide) this.hide = true;\n    else this.hide = false;\n  }\n\n  @Watch('hide')\n  handleHideChange() {\n    if (this.hide) this.nanoHide.emit({ sticker: this.host });\n    else this.nanoShow.emit({ sticker: this.host });\n  }\n\n  @Watch('scrollParent')\n  setupIO() {\n    if (this.io) {\n      this.io.disconnect();\n      this.io = undefined;\n    }\n    if (!this.scrollParent || !this.hasBootstrapped || !this.trigger) return;\n\n    this.isRootSticker = this.scrollParent instanceof Document;\n    let root = this.scrollParent;\n    if (this.scrollParent instanceof Document) root = null;\n\n    this.io = new window.IntersectionObserver(\n      (_) => {\n        if (this.pauseResizeWatcher || !this.isSticky) return;\n        this.shouldStick(_.slice(-1)[0]);\n      },\n      { root: root as HTMLElement }\n    );\n\n    this.io.observe(this.trigger);\n  }\n\n  // Private methods / handlers\n\n  /** Assesses the public API quitemode and works out if it should be applied atm.\n   * If 'smallscreen', or there is a breakpointmax / min it will add a resizeobserver to conditionally add behaviour */\n  private setupParentResizeListener = () => {\n    if (this.parentSizeObserver) {\n      this.parentSizeObserver.disconnect();\n      this.parentSizeObserver = undefined;\n    }\n\n    this.parentSizeObserver = new ResizeObserver((entries) => {\n      for (const entry of entries) {\n        let height: number, width: number;\n        if (entry.contentRect.height) height = entry.contentRect.height;\n        if (entry.contentRect.width) width = entry.contentRect.width;\n\n        if (typeof this.quietMode === 'object') {\n          if (width < this.quietMode.w || height < this.quietMode.h)\n            this.quietModeIsOn = true;\n          else this.quietModeIsOn = false;\n        }\n\n        if (this.breakPointMin) {\n          if (width > this.breakPointMin) this.isSticky = true;\n          else this.isSticky = false;\n        }\n\n        if (this.breakPointMax) {\n          if (width < this.breakPointMax) this.isSticky = true;\n          else this.isSticky = false;\n        }\n\n        if (this.isRootSticker && this.sticker && this.autoResize)\n          this.sticker.style.width = this.host.scrollWidth + 'px';\n      }\n    });\n\n    let toWatch =\n      this.scrollParent instanceof Document\n        ? this.scrollParent.documentElement\n        : this.scrollParent;\n    if (toWatch) this.parentSizeObserver.observe(toWatch);\n  };\n\n  /** For stickTo stickers. We listen to the events from the 'master' sticker to ammend the hide/show trigger\n   * Main diffs from rootstickers / non is height being on 'master' */\n  private onStickToDisplayEvent = (\n    e: CustomEvent<{ sticker: HTMLNanoStickerElement }>\n  ) => {\n    if (e.detail.sticker !== this.stickToEle) return;\n\n    switch (e.type) {\n      case 'nanoHide':\n        this._offset = 0;\n        this.cacheOffset = this.offset;\n        this.offset = 0;\n        /** trigger moves down, underneath sticker if the main sticker hides */\n        if (!this.isStuck) this.moveTrigger(false);\n\n        /** If it's an actual 'position: sticky' element, we need to give the sticker an appropriate height.\n         * This minimises content jumping around as items are added */\n        if (!this.isRootSticker && this.quietModeIsOn) {\n          raf(() => {\n            this.stickToEle.style.minHeight =\n              this.stickToEleInitSize.height +\n              (this.host.scrollHeight +\n                (typeof this.cacheOffset === 'object'\n                  ? this.cacheOffset.v\n                  : this.cacheOffset)) +\n              'px';\n            this.stickToEle.setTriggerPos(this.stickToEleInitSize.height * -1);\n          });\n        }\n        break;\n      case 'nanoShow':\n        this._offset = this.stickToEleInitSize.height;\n        this.offset = this.cacheOffset;\n        this.moveTrigger(true);\n\n        /** reset master sticker size */\n        if (!this.isRootSticker && this.quietModeIsOn) {\n          raf(() => {\n            this.stickToEle.style.minHeight = '';\n            this.stickToEle.setTriggerPos(0);\n          });\n        }\n        break;\n      case 'nanoStuck':\n        this.stickToEleInitSize = this.stickToEle.getBoundingClientRect();\n        this._offset = this.stickToEleInitSize.height;\n        break;\n    }\n  };\n\n  /** Add or removes event listeners / observers on scrolling parent\n   * for when the scrolling parent changes, or, this sticker is sticking to another */\n  private manageListenersOnParent(\n    addEvents: boolean,\n    ele?: HTMLElement | Document\n  ) {\n    let scrollParent = ele || this.scrollParent;\n\n    if (!scrollParent) return;\n\n    if (!addEvents) {\n      try {\n        if (this.quietModeIsOn)\n          scrollParent.removeEventListener('scroll', this.onScroll);\n        scrollParent.removeEventListener('nanoStuck', this.onStickEvent);\n        scrollParent.removeEventListener('nanoUnstuck', this.onStickEvent);\n      } catch (e) {\n        console.error('Events haven`t been added');\n      }\n    } else {\n      scrollParent.addEventListener('nanoStuck', this.onStickEvent);\n      scrollParent.addEventListener('nanoUnstuck', this.onStickEvent);\n\n      if (this.quietModeIsOn) this.attachScrollListeners();\n    }\n    this.setupParentResizeListener();\n  }\n\n  /** Handler applied to scrolling parent. When 'hideOnNewStickers' is true, hide this sticker on subsequent stuck stickers.  */\n  private onStickEvent = async (\n    e: CustomEvent<{ sticker: HTMLNanoStickerElement }>\n  ) => {\n    let sticker = e.detail ? e.detail.sticker : null;\n    if (!sticker || sticker.position !== this.position) return;\n\n    const incomingTriggerPos = await sticker.getTriggerPos();\n\n    if (\n      e.type === 'nanoStuck' &&\n      sticker !== this.host &&\n      sticker.scrollParent === this.host.scrollParent\n    ) {\n      this.stickerIndex++;\n\n      if (!this.hideOnNewStickers) return;\n\n      if (\n        (this.positions.includes('top') &&\n          this.triggerPos.top < incomingTriggerPos.top) ||\n        (this.positions.includes('bottom') &&\n          this.triggerPos.top > incomingTriggerPos.top)\n      ) {\n        this.multiStickerHide = true;\n        this.stuckCounter++;\n      }\n    }\n\n    if (\n      e.type === 'nanoUnstuck' &&\n      sticker !== this.host &&\n      sticker.scrollParent === this.host.scrollParent\n    ) {\n      this.stickerIndex--;\n\n      if (!this.hideOnNewStickers) return;\n\n      if (\n        (this.positions.includes('top') &&\n          this.triggerPos.top < incomingTriggerPos.top) ||\n        (this.positions.includes('bottom') &&\n          this.triggerPos.top > incomingTriggerPos.top)\n      ) {\n        this.stuckCounter--;\n        if (this.stuckCounter < 1) this.multiStickerHide = false;\n      }\n    }\n  };\n\n  /** Scroll handler applied to scrolling parent. Only applied when quietmode is on.\n   * 'hides' stickers when scrolling over 100px away from trigger and 'shows' when scrolling toward */\n  private onScroll = () => {\n    let y: number = _getScrollTop(this.scrollParent);\n\n    // scrolling up\n    if (y < this.scrollPosCache) {\n      if (!this.positions.includes('bottom')) this.handleScrollTo();\n      else this.handleScrollAway(y);\n    }\n\n    // scrolling down\n    if (y > this.scrollPosCache) {\n      if (!this.positions.includes('bottom')) this.handleScrollAway(y);\n      else this.handleScrollTo();\n    }\n    this.scrollPosCache = y;\n  };\n\n  /** Watch for scroll direction. Only applies when quietmode is on.\n   * We need to addjust the position of the trigger when the sticker is hidden */\n  private handleScrollTo() {\n    this.scrollPosThresholdCache = null;\n    if (!this.scrollHide) return;\n\n    if (this.scrollingTo !== true) {\n      this._offset = this.cacheOffset || this._offset;\n    }\n    this.scrollingTo = true;\n    this.scrollHide = false;\n  }\n\n  private handleScrollAway(currScroll: number) {\n    if (this.scrollHide) return;\n\n    if (!this.isStuck) return;\n\n    if (this.scrollingTo !== false) {\n      this.cacheOffset = this._offset;\n      this._offset = 0;\n    }\n    this.scrollingTo = false;\n\n    if (!this.scrollPosThresholdCache)\n      this.scrollPosThresholdCache = currScroll;\n    else if (\n      !this.pauseHide &&\n      Math.abs(currScroll - this.scrollPosThresholdCache) > 100\n    )\n      this.scrollHide = true;\n  }\n\n  private moveTrigger(toInitial?: boolean) {\n    if (\n      (this.positions.includes('bottom') && !toInitial) ||\n      (!this.positions.includes('bottom') && toInitial)\n    ) {\n      this.host.parentNode.insertBefore(this.trigger, this.host);\n    } else\n      this.host.parentNode.insertBefore(this.trigger, this.host.nextSibling);\n  }\n\n  /** Gets the 'closest' scrolling parent */\n  private getScrollParent() {\n    const regex = /(auto|scroll)/;\n    const parents = (_node: Node, ps: Node[]) => {\n      if (_node.parentNode === null) {\n        return ps;\n      }\n      return parents(_node.parentNode, ps.concat([_node]));\n    };\n    const style = (_node, prop) =>\n      getComputedStyle(_node, null).getPropertyValue(prop);\n    const overflow = (_node) =>\n      style(_node, 'overflow') +\n      style(_node, 'overflow-y') +\n      style(_node, 'overflow-x');\n    const scroll = (_node) => regex.test(overflow(_node));\n    const docHeight = document.documentElement.getBoundingClientRect().height;\n\n    const scrollParent = (_node: HTMLElement) => {\n      if (!(_node instanceof HTMLElement)) return;\n\n      const ps = parents(_node, []);\n      return (\n        ps.find(\n          (ele) =>\n            scroll(ele) && ele.getBoundingClientRect().height !== docHeight\n        ) || document\n      );\n    };\n\n    return scrollParent(this.host);\n  }\n\n  private shouldStick(data?: IntersectionObserverEntry) {\n    let scrollAmt: number;\n\n    if (this.positions.includes('top')) {\n      if (!this.isRootSticker)\n        scrollAmt = _getOffset(this.trigger, this.scrollParent).top;\n      else scrollAmt = this.trigger.getBoundingClientRect().top;\n      this.isStuck = scrollAmt < -1;\n    } else if (this.positions.includes('bottom')) {\n      scrollAmt = this.trigger.getBoundingClientRect().top;\n      const parentBounding =\n        data && data.rootBounds\n          ? data.rootBounds\n          : (this.scrollParent instanceof Document\n              ? document.documentElement\n              : this.scrollParent\n            ).getBoundingClientRect();\n      this.isStuck = scrollAmt > parentBounding.height + parentBounding.top;\n    }\n  }\n\n  private bootstrapGurantor() {\n    this.hasBootstrapped = true;\n\n    this.scrollParent = this.scrollParent || this.getScrollParent();\n    this.isRootSticker = this.scrollParent instanceof Document;\n\n    this.trigger = this.trigger || document.createElement('div');\n    this.trigger.classList.add('sticker-trigger');\n\n    this.positionChange();\n    this.moveTrigger(true);\n    this.quietModeChange();\n\n    this.listenForScrollParent = true;\n    this.handleParentEvents(true);\n\n    this.stickerIndex = Array.from(\n      this.scrollParent.querySelectorAll('nano-sticker')\n    )\n      .filter(\n        (sticker: HTMLNanoStickerElement) => sticker.position === this.position\n      )\n      .findIndex((sticker) => sticker === this.host);\n\n    this.setOffset();\n    this.stickerResizeListener();\n    this.setupParentResizeListener();\n\n    // bit of a hack ... add default 'order'. Required for 'stickTo' elements.\n    this.slottedContent = Array.from(this.host.children);\n    this.slottedContent.forEach((child: HTMLElement) => {\n      child.style.order = this.stickerIndex + '';\n    });\n\n    this.updateTriggerOffset();\n    this.stickToChange();\n    this.setupIO();\n    this.onStickToDisplayEvent = debounce(this.onStickToDisplayEvent, 50);\n  }\n\n  // Stencil metthods\n\n  connectedCallback() {\n    this.isRtl =\n      this.host.dir === 'rtl' ||\n      (this.host.ownerDocument as Document).dir === 'rtl';\n\n    // this is all horrible.... shrug\n    document.documentElement.addEventListener('nanoComponentsReady', () => {\n      setTimeout((_) => this.bootstrapGurantor(), 200);\n    });\n    setTimeout((_) => {\n      if (!this.hasBootstrapped) this.bootstrapGurantor();\n    }, 1000);\n  }\n\n  disconnectedCallback() {\n    if (this.io) {\n      this.io.disconnect();\n      this.io = undefined;\n    }\n\n    if (this.parentSizeObserver) {\n      this.parentSizeObserver.disconnect();\n      this.parentSizeObserver = undefined;\n    }\n\n    this.scrollParent = null;\n    this.hasBootstrapped = false;\n  }\n\n  render() {\n    return (\n      <Host\n        sticky={!this.isRootSticker && !this.stickToEle && this.isSticky}\n        hide={this.hide && this.isStuck}\n        siblings={this.stuckCounter}\n        index={this.stickerIndex}\n        stuck={this.isStuck && this.isSticky}\n        placed-bottom={this.positions.includes('bottom')}\n        placed-top={this.positions.includes('top')}\n        placed-end={this.positions.includes('end')}\n        placed-start={this.positions.includes('start')}\n      >\n        <div\n          class={{\n            sticker: true,\n            sticky: this.isRootSticker && this.isSticky,\n            stuck: this.isStuck && this.isRootSticker && this.isSticky,\n            hide: this.isRootSticker && this.hide && this.isStuck,\n          }}\n          ref={(div) => (this.sticker = div)}\n        >\n          <div class=\"sticker-content\" ref={(div) => (this.content = div)}>\n            <slot />\n          </div>\n        </div>\n      </Host>\n    );\n  }\n}\n"]}

package/dist/nano-components/p-1b120f53.entry.js

@@ -0,0 +1,5 @@
+/*!
+ * Web Components for Nanopore digital Web Apps
+ */
+import{r as i,c as t,h as a,e as o,g as n}from"./p-b5c33aff.js";const e='.sc-nano-file-upload-h{-webkit-box-sizing:border-box;box-sizing:border-box}*.sc-nano-file-upload,*.sc-nano-file-upload::before,*.sc-nano-file-upload::after{-webkit-box-sizing:border-box;box-sizing:border-box}[hidden].sc-nano-file-upload{display:none !important}.sc-nano-file-upload-h{min-height:1rem;display:block;--invalid-msg-color:var(--nano-color-danger, #ef4135);--invalid-msg-font-size:var(--nano-input-help-font-size, 0.75em);--help-msg-color:var(--nano-input-help-color, #616d6e);--label-color:var(--nano-input-label-color, "currentColor");--label-font-size:var(--nano-input-label-color, 1em);--label-padding:var(--nano-input-padding-bottom, var(--nano-input-padding, 6px));--label-color--invalid:var(--nano-input-label-color-invalid, "currentColor");--drop-bg:#f2f7f9;--drop-text:#756f6a;--drop-height:3.5em;--drop-border-tint:var(--nano-color-primary-rgb, 0, 116, 149);--drop-border-width:2px;--drop-border-radius:5px;--drop-bg--invalid:var(--nano-input-background-color, white);--drop-border--invalid:var(--nano-color-danger-rgb, 239, 65, 53);--btn-bg:var(--nano-color-primary, #007495);--btn-text:var(--nano-color-primary-contrast, #fff);--btn-icon-size:var(--nano-btn-icon-size, 1.4em);--btn-padding-top:var(--nano-btn-padding-top, 0.5em);--btn-padding-bottom:var(--nano-btn-padding-bottom, 0.5em);--btn-padding-start:var(--nano-btn-padding-start, 1em);--btn-padding-end:var(--nano-btn-padding-end, 1em)}[disabled].sc-nano-file-upload-h:not([disabled=false]){opacity:0.7}[disabled].sc-nano-file-upload-h:not([disabled=false]) *.sc-nano-file-upload{pointer-events:none !important}.file-upload__label.sc-nano-file-upload{font-size:var(--label-font-size);padding:0 0 var(--label-padding);margin:0;line-height:1}[invalid].sc-nano-file-upload-h:not([invalid=false]) .file-upload__label.sc-nano-file-upload{color:var(--label-color--invalid)}.file-upload__input.sc-nano-file-upload{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}.file-upload__error.sc-nano-file-upload,.file-upload__help.sc-nano-file-upload,.file-upload__more.sc-nano-file-upload,.file-upload__label.sc-nano-file-upload{display:block;width:100%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.file-upload__more.sc-nano-file-upload{height:1em;margin-left:3px;margin-right:0;margin-top:calc(var(--label-padding) / 2);margin-bottom:var(--label-padding);position:relative}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){.file-upload__more.sc-nano-file-upload{margin-left:unset;margin-right:unset;-webkit-margin-start:3px;margin-inline-start:3px;-webkit-margin-end:0;margin-inline-end:0}}.file-upload__error.sc-nano-file-upload,.file-upload__help.sc-nano-file-upload{top:0;left:0;position:absolute;font-size:var(--invalid-msg-font-size);line-height:1.2;-webkit-transition:0.3s ease-out opacity;transition:0.3s ease-out opacity}.file-upload--invalid.sc-nano-file-upload .file-upload__error.sc-nano-file-upload,.file-upload--invalid.sc-nano-file-upload .file-upload__help.sc-nano-file-upload{opacity:1}.file-upload__error.sc-nano-file-upload{color:var(--invalid-msg-color);font-stretch:condensed;opacity:0}.file-upload--invalid.sc-nano-file-upload .file-upload__error.sc-nano-file-upload{opacity:1}.file-upload__help.sc-nano-file-upload{font-style:italic;opacity:1;color:var(--help-msg-color)}.file-upload--invalid.sc-nano-file-upload .file-upload__help.sc-nano-file-upload{opacity:0}.file-upload__drop.sc-nano-file-upload{position:relative;width:100%;display:inline-block}.file-upload__drop-area.sc-nano-file-upload{-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;background-color:var(--drop-bg);color:var(--drop-text);min-height:var(--drop-height);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;font-size:0.9em;position:relative;-webkit-transition:background-color 0.15s ease-in-out;transition:background-color 0.15s ease-in-out;padding:0.5rem}[disabled].sc-nano-file-upload-h:not([disabled=false]) .file-upload__drop-area.sc-nano-file-upload{opacity:0.7}.file-upload--invalid.sc-nano-file-upload .file-upload__drop-area.sc-nano-file-upload{background-color:var(--drop-bg--invalid)}.file-upload--dragging.sc-nano-file-upload .file-upload__drop-area.sc-nano-file-upload{background-color:#fff}.file-upload__drop-area.sc-nano-file-upload::after{content:"";position:absolute;border-radius:var(--drop-border-radius);border-width:var(--drop-border-width);border-color:rgba(var(--drop-border-tint), 0.5);border-style:dashed;top:0;bottom:0;left:0;right:0;-webkit-transition:top 0.1s ease-in-out, bottom 0.1s ease-in-out, left 0.1s ease-in-out, right 0.1s ease-in-out;transition:top 0.1s ease-in-out, bottom 0.1s ease-in-out, left 0.1s ease-in-out, right 0.1s ease-in-out}.file-upload--invalid.sc-nano-file-upload .file-upload__drop-area.sc-nano-file-upload::after{border-color:rgba(var(--drop-border--invalid), 1)}.file-upload--dragging.sc-nano-file-upload .file-upload__drop-area.sc-nano-file-upload::after{top:5px;bottom:5px;left:5px;right:5px}.file-upload__drop-area.sc-nano-file-upload span.sc-nano-file-upload{color:rgba(var(--drop-border-tint), 1);text-decoration:underline;border-radius:2px;z-index:1;cursor:pointer;position:relative}.file-upload--focus.sc-nano-file-upload .file-upload__drop-area.sc-nano-file-upload span.sc-nano-file-upload{-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)))}.file-upload__list.sc-nano-file-upload{list-style:none;margin:0;padding:0}.file-upload__list-wrap.sc-nano-file-upload{position:relative;top:-4px}.file-upload__list-item.sc-nano-file-upload{width:100%;margin:0 0 2px;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-transform:translateZ(0);transform:translateZ(0);-webkit-animation:hideListItem 0.3s ease-in-out forwards;animation:hideListItem 0.3s ease-in-out forwards}@-webkit-keyframes hideListItem{0%{opacity:1;-webkit-transform:translateY(0);transform:translateY(0);-webkit-transform:translateZ(0);transform:translateZ(0)}100%{opacity:0;-webkit-transform:translateY(10px);transform:translateY(10px);-webkit-transform:translateZ(0);transform:translateZ(0)}}@keyframes hideListItem{0%{opacity:1;-webkit-transform:translateY(0);transform:translateY(0);-webkit-transform:translateZ(0);transform:translateZ(0)}100%{opacity:0;-webkit-transform:translateY(10px);transform:translateY(10px);-webkit-transform:translateZ(0);transform:translateZ(0)}}.file-upload__list-item--active.sc-nano-file-upload{-webkit-animation:showListItem 0.3s ease-in-out forwards;animation:showListItem 0.3s ease-in-out forwards}@-webkit-keyframes showListItem{0%{opacity:0;-webkit-transform:translateY(10px);transform:translateY(10px);-webkit-transform:translateZ(0);transform:translateZ(0)}100%{opacity:1;-webkit-transform:translateY(0);transform:translateY(0);-webkit-transform:translateZ(0);transform:translateZ(0)}}@keyframes showListItem{0%{opacity:0;-webkit-transform:translateY(10px);transform:translateY(10px);-webkit-transform:translateZ(0);transform:translateZ(0)}100%{opacity:1;-webkit-transform:translateY(0);transform:translateY(0);-webkit-transform:translateZ(0);transform:translateZ(0)}}.file-upload__list.sc-nano-file-upload .list-title.sc-nano-file-upload{background:var(--nano-color-blue--faded);border-radius:5px;padding:5px 5px;margin-right:2px;display:block;width:100%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-size:0.9em;color:var(--help-msg-color)}.file-upload__list.sc-nano-file-upload .list-button.sc-nano-file-upload{background:var(--nano-color-blue--faded);border-radius:5px;margin:2px}.file-upload__list.sc-nano-file-upload .list-error.sc-nano-file-upload{--color:rgba(var(--drop-border--invalid), 1)}.file-upload__button.sc-nano-file-upload{margin:0;padding:0;border:none;background-color:transparent;font:inherit;-webkit-box-align:center;text-decoration:none;color:inherit;-webkit-transition:background-color 100ms ease-in-out, border-color 100ms ease-in-out, color 100ms ease-in-out, -webkit-box-shadow 100ms ease-in-out;transition:background-color 100ms ease-in-out, border-color 100ms ease-in-out, color 100ms ease-in-out, -webkit-box-shadow 100ms ease-in-out;transition:background-color 100ms ease-in-out, box-shadow 100ms ease-in-out, border-color 100ms ease-in-out, color 100ms ease-in-out;transition:background-color 100ms ease-in-out, box-shadow 100ms ease-in-out, border-color 100ms ease-in-out, color 100ms ease-in-out, -webkit-box-shadow 100ms ease-in-out;padding-left:var(--nano-btn-padding-start, 1rem);padding-right:var(--nano-btn-padding-end, 1rem);padding-top:var(--nano-btn-padding-top, 0.5rem);padding-bottom:var(--nano-btn-padding-bottom, 0.5rem);-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));display:inline-block;border-radius:var(--nano-btn-border-radius, 5px);line-height:var(--nano-btn-line-height, 1.5rem);font-weight:500;cursor:pointer;background:rgba(0, 0, 0, 0.02);background-color:var(--btn-bg);color:var(--btn-text);--nano-btn-icon-size:var(--btn-icon-size);--nano-btn-line-height:var(--btn-icon-size);--nano-btn-padding-top:var(--btn-padding-top);--nano-btn-padding-bottom:var(--btn-padding-bottom);--nano-btn-padding-start:var(--btn-padding-start);--nano-btn-padding-end:var(--btn-padding-end);max-width:100%;font-size:0.9em}.file-upload__button.sc-nano-file-upload::-moz-focus-inner{border:0;padding:0}.file-upload__button.sc-nano-file-upload:hover,.file-upload__button.sc-nano-file-upload:focus{text-decoration:none;color:inherit}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){.file-upload__button.sc-nano-file-upload{padding-left:unset;padding-right:unset;-webkit-padding-start:var(--nano-btn-padding-start, 1rem);padding-inline-start:var(--nano-btn-padding-start, 1rem);-webkit-padding-end:var(--nano-btn-padding-end, 1rem);padding-inline-end:var(--nano-btn-padding-end, 1rem)}}@media print{.file-upload__button.sc-nano-file-upload{display:none}}.file-upload__button.sc-nano-file-upload:focus,.file-upload__button.button--focus.sc-nano-file-upload{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)))}.file-upload__button.sc-nano-file-upload nano-icon.sc-nano-file-upload{margin-left:0.5rem;margin-right:0;font-size:var(--nano-btn-icon-size, 1rem);vertical-align:middle;margin-top:-0.188rem;display:inline-block}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){.file-upload__button.sc-nano-file-upload nano-icon.sc-nano-file-upload{margin-left:unset;margin-right:unset;-webkit-margin-start:0.5rem;margin-inline-start:0.5rem;-webkit-margin-end:0;margin-inline-end:0}}.file-upload__button.button--icon-start.sc-nano-file-upload nano-icon.sc-nano-file-upload{margin-left:0;margin-right:0.5rem}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){.file-upload__button.button--icon-start.sc-nano-file-upload nano-icon.sc-nano-file-upload{margin-left:unset;margin-right:unset;-webkit-margin-start:0;margin-inline-start:0;-webkit-margin-end:0.5rem;margin-inline-end:0.5rem}}.file-upload__button.sc-nano-file-upload:hover:not(.file-upload__button--disabled){-webkit-box-shadow:var(--nano-layer-shadow-large, 0 2px 8px rgba(0, 0, 0, 0.2));box-shadow:var(--nano-layer-shadow-large, 0 2px 8px rgba(0, 0, 0, 0.2))}.file-upload__button.sc-nano-file-upload:active:not(.button--disabled):not(:disabled){-webkit-box-shadow:none;box-shadow:none}.file-upload__button--disabled.sc-nano-file-upload,.file-upload__button.sc-nano-file-upload:disabled{opacity:0.6}.file-upload__button--disabled.sc-nano-file-upload:hover,.file-upload__button.sc-nano-file-upload:disabled:hover{cursor:default}.file-upload__button.sc-nano-file-upload:hover:not(.button--disabled):not(:disabled),.file-upload__button.button--active.sc-nano-file-upload{background-color:var(--nano-color-primary-shade, #00637f);color:var(--btn-text)}.file-upload__button.sc-nano-file-upload:hover:not(.button--disabled):not(:disabled).button--keyline,.file-upload__button.button--active.button--keyline.sc-nano-file-upload{background-color:var(--btn-bg);color:var(--btn-text)}.file-upload__button.sc-nano-file-upload:focus{color:var(--btn-text)}.file-upload__button.button--keyline.sc-nano-file-upload{background:transparent;border-style:var(--nano-btn-border-style, solid);border-width:var(--nano-btn-border-width, 2px);border-radius:var(--nano-btn-border-radius, 5px);color:var(--btn-bg);border-color:var(--btn-bg)}.file-upload__button.button--keyline.sc-nano-file-upload:hover:not(.button--disabled):not(:disabled),.file-upload__button.button--keyline.sc-nano-file-upload:not(.button--focus),.file-upload__button.button--keyline.button--active.sc-nano-file-upload{-webkit-box-shadow:none;box-shadow:none}[disabled].sc-nano-file-upload-h:not([disabled=false]) .file-upload__button.sc-nano-file-upload{opacity:0.4}.file-upload--dragging.sc-nano-file-upload .file-upload__button.sc-nano-file-upload{--nano-btn-border-style:dashed}.file-upload__button.sc-nano-file-upload .file-upload__clear-btn.sc-nano-file-upload{margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;font-size:inherit;padding:0;border:0;outline:none;background-color:transparent;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:stretch;-ms-flex-align:stretch;align-items:stretch;width:auto;color:var(--clear-btn-color)}.is-invalid.sc-nano-file-upload-h .file-upload__button.sc-nano-file-upload .file-upload__clear-btn.sc-nano-file-upload{color:var(--clear-btn-color--invalid)}.file-upload__button.sc-nano-file-upload .file-upload__clear-btn.sc-nano-file-upload nano-icon.sc-nano-file-upload{margin-left:0.4rem;margin-right:0;margin-top:0;margin-bottom:0}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){.file-upload__button.sc-nano-file-upload .file-upload__clear-btn.sc-nano-file-upload nano-icon.sc-nano-file-upload{margin-left:unset;margin-right:unset;-webkit-margin-start:0.4rem;margin-inline-start:0.4rem;-webkit-margin-end:0;margin-inline-end:0}}.file-upload__button.sc-nano-file-upload .file-upload__btn-content.sc-nano-file-upload{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.file-upload__button.sc-nano-file-upload .file-upload__btn-content.sc-nano-file-upload span.sc-nano-file-upload{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}';let l=0;let s=()=>new DataTransfer;try{s()}catch(d){try{s=()=>new ClipboardEvent("").clipboardData;s()}catch(p){s=null}}let r=class{constructor(o){i(this,o);this.nanoChange=t(this,"nanoChange",7);this.nanoFocus=t(this,"nanoFocus",7);this.nanoBlur=t(this,"nanoBlur",7);this.nanoValidate=t(this,"nanoValidate",7);this.fileInputId=`nano-file-upload-${l++}`;this.canChangeFileList=!!s;this.removeFiles=[];this.errorMessage="";this.isDragging=false;this.fileList=[];this.maxFileSize=1;this.maxFiles=1;this.placeholder="Choose a file...";this.hideLabel=false;this.required=false;this.disabled=false;this.clearInput=false;this.showInlineError=true;this.validateOn="submit";this._invalid=false;this.onClearClick=()=>{this.value=""};this.onBlur=()=>{this.hasFocus=false;this.validate();if(this.validateOn==="dirty")this.showInlineValidation();this.nanoBlur.emit()};this.onFocus=()=>{this.hasFocus=true;this.nanoFocus.emit()};this.validate=()=>{this.errorMessage="";this.inputEl.setCustomValidity("");let i;if(!this.inputEl.validity.valid){i=this.inputEl.validationMessage}else{this.fileList.forEach((t=>{i=null;if(!this.checkFileSize(t.file.size)){i="Maximum file size exceeded. Max file size is "+this.maxFileSize+"Mb"}else if(!this.checkFileType(t.file.type))i=`File type is not allowed (${this.accept})`;t.validationMessage=i;t.valid=!i}));if(this.fileList.length>this.maxFiles)i=`Maxinum number of files exceeded (${this.maxFiles})`}if(!!i)this.inputEl.setCustomValidity(i)};this.onInvalid=i=>{if(this.showInlineError)i.preventDefault();this.validate();this.showInlineValidation(i)};this.onFileChoose=i=>{const t=i.target.files;if(t&&t.length)this.addNewFiles(i.target.files)};this.onFileRemoveFileClick=(i,t)=>{if(!this.canChangeFileList)return;this.removeFiles.push(t);i.target.closest(".file-upload__list-item--active").classList.remove("file-upload__list-item--active")};this.onFileRemoveAnim=()=>{if(!this.canChangeFileList||!this.removeFiles.length)return;this.fileList=this.fileList.filter((i=>!this.removeFiles.find((t=>t===i))));this.removeFiles=[]};this.onInputChange=()=>{this.nanoChange.emit({value:this.value,files:this.files})};this.onDragStop=i=>{i.preventDefault();i.stopPropagation();this.isDragging=false};this.onDragStart=i=>{i.preventDefault();i.stopPropagation();this.isDragging=true};this.onDrop=i=>{this.onDragStop(i);if(i.dataTransfer.files&&i.dataTransfer.files.length)this.addNewFiles(i.dataTransfer.files)};this.FileUploadInput=(i,t)=>{const o=this.fileInputId+"-lbl";const n=this.showInlineError||this.hasHelperSlot?this.fileInputId+"-more":"";return[a("div",{class:"file-upload__"+i+"-wrap"},a("label",{class:`file-upload__`+i,htmlFor:this.fileInputId,id:o,onDrop:i=>{this.onDrop(i);this.onDragStop(i)},onDragEnd:this.onDragStop,onDragLeave:this.onDragStop,onDragEnter:this.onDragStart,onDragOver:this.onDragStart},(!!this.label||this.hasLabelSlot&&i!=="drop")&&a("div",{class:`file-upload__label ${this.hideLabel?"visually-hide":""}`},!!this.label&&!!this.label.length?this.label:"",!this.label&&this.hasLabelSlot&&i!=="drop"&&a("slot",{name:"label"})),i==="drop"&&a("div",{class:"file-upload__drop-area"},a("div",null,this.hasLabelSlot&&a("slot",{name:"label"})),a("div",null,"Drag and drop or ",a("span",null,"browse"))),i==="btn"&&a("div",{class:`file-upload__button button--keyline button--icon-start ${this.hasFocus?"button--focus":""}`},a("div",{class:`file-upload__btn-content`},a("nano-icon",{name:"regular/cloud-upload"}),a("span",null,!!this.fileList.length?this.fileList[0].file.name:this.placeholder),!!this.value&&this.clearInput&&!this.disabled&&a("button",{type:"button",class:"icon file-upload__clear-btn",tabindex:"-1",onClick:this.onClearClick},a("nano-icon",{name:"light/times"})))),a("input",{"aria-labelledby":o+" "+n+" "+t,type:"file",id:this.fileInputId,accept:this.accept,class:"file-upload__input",multiple:this.maxFiles>1,disabled:this.disabled,name:this.canChangeFileList?undefined:this.name,form:this.form,ref:i=>{if(this.canChangeFileList){this.publicInputEl=i;return}this.inputEl=i},onChange:this.onFileChoose,onFocus:this.onFocus,onReset:this.onInputChange})),a("input",{name:!this.canChangeFileList?undefined:this.name,form:this.form,ref:i=>{if(!this.canChangeFileList)return;this.inputEl=i},type:"file",id:this.fileInputId+"-hidden",tabIndex:-1,multiple:true,class:"file-upload__input",disabled:this.disabled,required:this.required,accept:this.accept,onInvalid:this.onInvalid,onChange:this.onInputChange})),this.showInlineError||this.hasHelperSlot?a("div",{class:"file-upload__more",id:n},this.showInlineError&&!!this.errorMessage.length?a("div",{class:"file-upload__error"},this.errorMessage):"",a("div",{class:"file-upload__help"},a("slot",{name:"helper"}))):""]};this.button=()=>this.FileUploadInput("btn");this.dropArea=()=>{const i=this.fileInputId+"-list";return[this.FileUploadInput("drop",i),a("output",{class:"file-upload__list-wrap",id:i},!!this.fileList&&this.fileList.length>0&&a("ul",{class:"file-upload__list list"},this.fileList.map((i=>a("li",{key:i.file.name,class:"file-upload__list-item file-upload__list-item--active list-item",onAnimationEnd:i=>this.onFileRemoveAnim()},a("span",{class:"list-title"},i.file.name),!i.valid&&a("nano-tooltip",{content:i.validationMessage,placement:"left"},a("nano-icon-button",{class:"list-button list-error",iconName:"light/exclamation-triangle",label:"File error"})),this.canChangeFileList&&a("nano-icon-button",{class:"list-button list-button--view",type:"button",iconName:"light/eye",label:"View file",target:"_blank",href:i.location}),this.canChangeFileList&&a("nano-icon-button",{onClick:t=>this.onFileRemoveFileClick(t,i),class:"list-button list-button--remove",iconName:"light/times",label:"Remove file"}))))))]}}fileListChange(){if(this.canChangeFileList){this.publicInputEl.value="";this.inputEl.files=this.arrToFileList(this.fileList.map((i=>i.file)));setTimeout((()=>{this.nanoChange.emit({value:this.value,files:this.files})}),20)}}shouldValidate(){if(!this.inputEl)return;this.validate();requestAnimationFrame((()=>{if(this.validateOn==="dirty")this.showInlineValidation()}))}get invalid(){return this._invalid}get validityMessage(){if(!this.inputEl)return"";return this.inputEl.validationMessage}get files(){return this.inputEl?Array.from(this.inputEl.files).map((i=>{i.objectURL=URL.createObjectURL(i);return i})):[]}get value(){return this.inputEl?this.inputEl.value:""}set value(i){if(i===""&&this.inputEl){this.fileList=[];this.inputEl.value=""}}async reportValidity(i){if(i){this.validate();this.showInlineValidation()}return{isValid:!this.invalid,errorMessage:this.inputEl.validationMessage}}async setFocus(){if(this.inputEl)this.inputEl.focus()}getInputElement(){return Promise.resolve(this.inputEl)}async showError(i){if(this.inputEl){this.inputEl.setCustomValidity(i);this.validate();this.showInlineValidation()}}globalClickHandler(i){if(!this.hasFocus)return;if(i.composedPath().every((i=>i!==this.host)))this.onBlur()}globalKeydownHandler(i){if(!this.hasFocus||i.key!=="Tab")return;if(i.target!==this.inputEl)this.onBlur()}onReset(i){const t=this.form?document.querySelector("#"+this.form):this.host.closest("form");if(!t||i.target!==this.host.closest("form"))return;this.value=""}arrToFileList(i){const t=s();for(var a=0,o=i.length;a<o;a++)t.items.add(i[a]);return t.files}checkFileSize(i){return i/1e6<=this.maxFileSize}checkFileType(i){if(!this.accept)return true;return this.accept.match(i)&&this.accept.match(i).length>0}showInlineValidation(i){if(this.validateOn==="submitThenDirty")this.validateOn="dirty";this._invalid=false;this.errorMessage="";if(!this.inputEl.validity.valid){this.errorMessage=this.inputEl.validationMessage;this._invalid=true}this.nanoValidate.emit({isValid:!this._invalid,errorMessage:this.inputEl.validationMessage,originalEvent:i})}slotChangeObserver(){if(this.mo)this.mo.disconnect();const i=this.mo=new MutationObserver((()=>this.processSlottedContent()));i.observe(this.host,{childList:true,subtree:true})}processSlottedContent(){this.hasLabelSlot=!!this.host.querySelectorAll('[slot="label"]');this.hasHelperSlot=!!this.host.querySelector('[slot="helper"]')}addNewFiles(i){const t=Array.from(i).map((i=>({file:i,location:URL.createObjectURL(i),valid:true,validationMessage:null})));if(this.canChangeFileList&&this.maxFiles>1){const i=t.filter((i=>!this.fileList.find((t=>t.file.name===i.file.name))));this.fileList=[...this.fileList,...i]}else this.fileList=t}disconnectedCallback(){if(this.mo)this.mo.disconnect()}componentDidLoad(){this.slotChangeObserver()}componentWillLoad(){this.processSlottedContent()}render(){return a(o,null,a("div",{class:{"file-upload":true,"file-upload--dragging":this.isDragging,"file-upload--focus":this.hasFocus,"file-upload--invalid":this._invalid}},this.maxFiles>1?a(this.dropArea,null):a(this.button,null)))}get host(){return n(this)}static get watchers(){return{fileList:["fileListChange","shouldValidate"],maxFiles:["shouldValidate"],maxFileSize:["shouldValidate"],capture:["shouldValidate"],accept:["shouldValidate"],required:["shouldValidate"],disabled:["shouldValidate"]}}};r.style=e;export{r as nano_file_upload};
+//# sourceMappingURL=p-1b120f53.entry.js.map

package/dist/nano-components/p-1b120f53.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["src/components/file-upload/file-upload.scss?tag=nano-file-upload&encapsulation=scoped","src/components/file-upload/file-upload.tsx"],"names":["fileUploadCss","fileInputIds","getDataTransfer","DataTransfer","_a","ClipboardEvent","clipboardData","_b","FileUpload","[object Object]","hostRef","this","fileInputId","canChangeFileList","removeFiles","errorMessage","isDragging","fileList","maxFileSize","maxFiles","placeholder","hideLabel","required","disabled","clearInput","showInlineError","validateOn","_invalid","onClearClick","value","onBlur","hasFocus","validate","showInlineValidation","nanoBlur","emit","onFocus","nanoFocus","inputEl","setCustomValidity","error","validity","valid","validationMessage","forEach","fileItem","checkFileSize","file","size","checkFileType","type","accept","length","onInvalid","ev","preventDefault","onFileChoose","e","files","target","addNewFiles","onFileRemoveFileClick","push","closest","classList","remove","onFileRemoveAnim","filter","find","rmFile","onInputChange","nanoChange","onDragStop","stopPropagation","onDragStart","onDrop","dataTransfer","FileUploadInput","eleType","listId","labelId","moreId","hasHelperSlot","h","class","htmlFor","id","onDragEnd","onDragLeave","onDragEnter","onDragOver","label","hasLabelSlot","name","tabindex","onClick","aria-labelledby","multiple","undefined","form","ref","input","publicInputEl","onChange","onReset","tabIndex","button","dropArea","map","key","onAnimationEnd","_","content","placement","iconName","href","location","arrToFileList","setTimeout","requestAnimationFrame","invalid","validityMessage","Array","from","objectURL","URL","createObjectURL","val","validateFirst","isValid","focus","Promise","resolve","message","composedPath","every","node","host","document","querySelector","i","len","items","add","match","nanoValidate","originalEvent","mo","disconnect","MutationObserver","processSlottedContent","observe","childList","subtree","querySelectorAll","newFiles","findFile","slotChangeObserver","Host","file-upload","file-upload--dragging","file-upload--focus","file-upload--invalid"],"mappings":"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","sourcesContent":["@use 'sass:map';\n@use 'sass:list';\n\n@import '../../global/style/utilities/globals';\n@import '../../global/style/nano-theme/form';\n@import '../../global/style/nano-theme/base';\n@import '../../global/style/nano-theme/button';\n\n:host {\n  /**\n   * @prop --invalid-msg-color: Default value #{nano-color(danger, base)};\n   * @prop --invalid-msg-font-size: Default value #{$input-help-font-size};\n\n   * @prop --help-msg-color: Default value #{$input-help-color};\n\n   * @prop --label-color: Default value #{$label-color};\n   * @prop --label-color--invalid: Default value #{$label-color-invalid};\n   * @prop --label-font-size: Default value #{$label-font-size};\n   * @prop --label-padding: Default value #{$input-padding-bottom};\n   * @prop --label-color--invalid: Default value #{$label-color-invalid};\n\n   * @prop --drop-bg: Default value #{map.get($colors, blue--faded)};\n   * @prop --drop-text: Default value #{map.get($colors, dimgrey)};\n   * @prop --drop-height: Default value 3.5em;\n   * @prop --drop-border-tint: Default value #{nano-color(primary, base, null, true)};\n   * @prop --drop-border-width: Default value 2px;\n   * @prop --drop-border-radius: Default value 5px;\n   * @prop --drop-bg--invalid: Default value #{$input-background-color--invalid};\n   * @prop --drop-border--invalid: Default value #{nano-color(danger, base, null, true)};\n\n   * @prop --btn-bg: Default value #{nano-color(primary, base)};\n   * @prop --btn-text: Default value #{nano-color(primary, contrast)};\n   * @prop --btn-icon-size: Default value var(--nano-btn-icon-size, 1.4em);\n   * @prop --btn-padding-top: Default value var(--nano-btn-padding-top, .5em);\n   * @prop --btn-padding-bottom: Default value var(--nano-btn-padding-bottom, .5em);\n   * @prop --btn-padding-start: Default value var(--nano-btn-padding-start, 1em);\n   * @prop --btn-padding-end: Default value var(--nano-btn-padding-end, 1em);\n   */\n\n  min-height: 1rem;\n  display: block;\n\n  --invalid-msg-color: #{nano-color(danger, base)};\n  --invalid-msg-font-size: #{$input-help-font-size};\n  --help-msg-color: #{$input-help-color};\n  --label-color: #{$label-color};\n  --label-font-size: #{$label-font-size};\n  --label-padding: #{$input-padding-bottom};\n  --label-color--invalid: #{$label-color-invalid};\n  --drop-bg: #{map.get($colors, blue--faded)};\n  --drop-text: #{darken(map.get($colors, dimgrey), 11%)};\n  --drop-height: 3.5em;\n  --drop-border-tint: #{nano-color(primary, base, null, true)};\n  --drop-border-width: 2px;\n  --drop-border-radius: 5px;\n  --drop-bg--invalid: #{$input-background-color--invalid};\n  --drop-border--invalid: #{nano-color(danger, base, null, true)};\n  --btn-bg: #{nano-color(primary, base)};\n  --btn-text: #{nano-color(primary, contrast)};\n  --btn-icon-size: var(--nano-btn-icon-size, 1.4em);\n  --btn-padding-top: var(--nano-btn-padding-top, 0.5em);\n  --btn-padding-bottom: var(--nano-btn-padding-bottom, 0.5em);\n  --btn-padding-start: var(--nano-btn-padding-start, 1em);\n  --btn-padding-end: var(--nano-btn-padding-end, 1em);\n}\n\n:host([disabled]:not([disabled='false'])) {\n  opacity: 0.7;\n\n  * {\n    pointer-events: none !important;\n  }\n}\n\n.file-upload {\n  $self: &;\n\n  /* Common */\n\n  &__label {\n    font-size: var(--label-font-size);\n    padding: 0 0 var(--label-padding);\n    margin: 0;\n    line-height: 1;\n\n    :host([invalid]:not([invalid='false'])) & {\n      color: var(--label-color--invalid);\n    }\n  }\n\n  &__input {\n    @include visually-hide();\n  }\n\n  &__error,\n  &__help,\n  &__more,\n  &__label {\n    display: block;\n    width: 100%;\n    overflow: hidden;\n    white-space: nowrap;\n    text-overflow: ellipsis;\n  }\n\n  &__more {\n    height: 1em;\n\n    @include margin(\n      calc(var(--label-padding) / 2),\n      0,\n      var(--label-padding),\n      3px\n    );\n\n    position: relative;\n  }\n\n  &__error,\n  &__help {\n    top: 0;\n    left: 0;\n    position: absolute;\n    font-size: var(--invalid-msg-font-size);\n    line-height: 1.2;\n    transition: 0.3s ease-out opacity;\n\n    .file-upload--invalid & {\n      opacity: 1;\n    }\n  }\n\n  &__error {\n    color: var(--invalid-msg-color);\n    font-stretch: condensed;\n    opacity: 0;\n\n    .file-upload--invalid & {\n      opacity: 1;\n    }\n  }\n\n  &__help {\n    font-style: italic;\n    opacity: 1;\n    color: var(--help-msg-color);\n\n    .file-upload--invalid & {\n      opacity: 0;\n    }\n  }\n\n  /* Drop area / Multi file upload */\n\n  &__drop {\n    position: relative;\n    width: 100%;\n    display: inline-block;\n  }\n\n  &__drop-area {\n    flex-direction: column;\n    background-color: var(--drop-bg);\n    color: var(--drop-text);\n    min-height: var(--drop-height);\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    font-size: 0.9em;\n    position: relative;\n    transition: background-color 0.15s ease-in-out;\n    padding: 0.5rem;\n\n    :host([disabled]:not([disabled='false'])) & {\n      opacity: 0.7;\n    }\n\n    .file-upload--invalid & {\n      background-color: var(--drop-bg--invalid);\n    }\n\n    .file-upload--dragging & {\n      background-color: #{map.get($colors, white)};\n    }\n\n    &::after {\n      content: '';\n      position: absolute;\n      border-radius: var(--drop-border-radius);\n      border-width: var(--drop-border-width);\n      border-color: rgba(var(--drop-border-tint), 0.5);\n      border-style: dashed;\n      top: 0;\n      bottom: 0;\n      left: 0;\n      right: 0;\n      transition:\n        top 0.1s ease-in-out,\n        bottom 0.1s ease-in-out,\n        left 0.1s ease-in-out,\n        right 0.1s ease-in-out;\n\n      .file-upload--invalid & {\n        border-color: rgba(var(--drop-border--invalid), 1);\n      }\n\n      .file-upload--dragging & {\n        top: 5px;\n        bottom: 5px;\n        left: 5px;\n        right: 5px;\n      }\n    }\n\n    span {\n      color: rgba(var(--drop-border-tint), 1);\n      text-decoration: underline;\n      border-radius: 2px;\n      z-index: 1;\n      cursor: pointer;\n      position: relative;\n\n      .file-upload--focus & {\n        box-shadow: #{$control-focus-style};\n      }\n    }\n  }\n\n  &__list {\n    list-style: none;\n    margin: 0;\n    padding: 0;\n\n    &-wrap {\n      position: relative;\n      top: -4px;\n    }\n\n    &-item {\n      width: 100%;\n      margin: 0 0 2px;\n      display: flex;\n      align-items: center;\n      transform: translateZ(0);\n      animation: hideListItem 0.3s ease-in-out forwards;\n\n      @keyframes hideListItem {\n        0% {\n          opacity: 1;\n          transform: translateY(0);\n          transform: translateZ(0);\n        }\n\n        100% {\n          opacity: 0;\n          transform: translateY(10px);\n          transform: translateZ(0);\n        }\n      }\n\n      &--active {\n        animation: showListItem 0.3s ease-in-out forwards;\n\n        @keyframes showListItem {\n          0% {\n            opacity: 0;\n            transform: translateY(10px);\n            transform: translateZ(0);\n          }\n\n          100% {\n            opacity: 1;\n            transform: translateY(0);\n            transform: translateZ(0);\n          }\n        }\n      }\n    }\n\n    .list-title {\n      background: var(--nano-color-blue--faded);\n      border-radius: 5px;\n      padding: 5px 5px;\n      margin-right: 2px;\n      display: block;\n      width: 100%;\n      overflow: hidden;\n      white-space: nowrap;\n      text-overflow: ellipsis;\n      font-size: 0.9em;\n      color: var(--help-msg-color);\n    }\n\n    .list-button {\n      background: var(--nano-color-blue--faded);\n      border-radius: 5px;\n      margin: 2px;\n    }\n\n    .list-error {\n      --color: rgba(var(--drop-border--invalid), 1);\n    }\n  }\n\n  /* Button display / Single file upload */\n\n  &__button {\n    @include button-base;\n    @include button-standard(\n      var(--btn-bg),\n      var(--btn-text),\n      #{nano-color(primary, shade)}\n    );\n\n    --nano-btn-icon-size: var(--btn-icon-size);\n    --nano-btn-line-height: var(--btn-icon-size);\n    --nano-btn-padding-top: var(--btn-padding-top);\n    --nano-btn-padding-bottom: var(--btn-padding-bottom);\n    --nano-btn-padding-start: var(--btn-padding-start);\n    --nano-btn-padding-end: var(--btn-padding-end);\n\n    max-width: 100%;\n    font-size: 0.9em;\n\n    :host([disabled]:not([disabled='false'])) & {\n      opacity: 0.4;\n    }\n\n    .file-upload--dragging & {\n      --nano-btn-border-style: dashed;\n    }\n    #{$self}__clear-btn {\n      @include margin(0);\n\n      font-size: inherit;\n      padding: 0;\n      border: 0;\n      outline: none;\n      background-color: transparent;\n      display: flex;\n      align-items: stretch;\n      width: auto;\n      color: var(--clear-btn-color);\n\n      :host(.is-invalid) & {\n        color: var(--clear-btn-color--invalid);\n      }\n\n      nano-icon {\n        @include margin(0, 0, 0, 0.4rem);\n      }\n    }\n    #{$self}__btn-content {\n      display: flex;\n      align-items: center;\n\n      span {\n        white-space: nowrap;\n        overflow: hidden;\n        text-overflow: ellipsis;\n        min-width: 0;\n      }\n    }\n  }\n}\n","import {\n  Component,\n  Prop,\n  h,\n  Host,\n  Element,\n  ComponentInterface,\n  State,\n  Event,\n  EventEmitter,\n  Watch,\n  VNode,\n  Method,\n  Listen,\n} from '@stencil/core';\nimport {\n  ControlValidity,\n  ControlValidityEventDetail,\n  FileInputChangeEventDetail,\n  FileWithUrl,\n} from '../../interface';\n\nlet fileInputIds = 0;\n\nlet getDataTransfer = () => new DataTransfer();\ntry {\n  getDataTransfer();\n} catch {\n  try {\n    getDataTransfer = () => new ClipboardEvent('').clipboardData;\n    getDataTransfer();\n  } catch {\n    getDataTransfer = null;\n  }\n}\n\ninterface FileValidation {\n  file: File;\n  valid: boolean;\n  validationMessage?: string;\n  location?: string;\n}\n/**\n * A better UI experience for `input type=\"file\"` form controls.\n *\n *   - Drag and Drop\n *   - Validation options\n *   - Preview and manage multiple files\n */\n@Component({\n  tag: 'nano-file-upload',\n  styleUrl: 'file-upload.scss',\n  scoped: true,\n})\nexport class FileUpload implements ComponentInterface {\n  private inputEl: HTMLInputElement;\n  private publicInputEl: HTMLInputElement;\n  private mo!: MutationObserver;\n  private fileInputId = `nano-file-upload-${fileInputIds++}`;\n  private canChangeFileList = !!getDataTransfer;\n  private removeFiles: FileValidation[] = [];\n\n  @State() hasHelperSlot: boolean;\n  @State() hasLabelSlot: boolean;\n  @State() errorMessage: string = '';\n  @State() isDragging = false;\n  @State() fileList: FileValidation[] = [];\n  @Watch('fileList')\n  fileListChange() {\n    if (this.canChangeFileList) {\n      this.publicInputEl.value = '';\n      this.inputEl.files = this.arrToFileList(\n        this.fileList.map((file) => file.file)\n      );\n      setTimeout(() => {\n        this.nanoChange.emit({ value: this.value, files: this.files });\n      }, 20);\n    }\n  }\n  @State() hasFocus: boolean;\n\n  @Element() host: HTMLNanoFileUploadElement;\n\n  // public props\n\n  /** Name of the form control. Submitted with the form as part of a name/value pair. */\n  @Prop() name!: string;\n\n  /** The accept attribute value is a string that defines the file types the file input should accept.\n   * E.g. for a MS Word file: `.doc, .docx,application/msword, application/vnd.openxmlformats-officedocument.wordprocessingml.document` */\n  @Prop() accept?: string;\n\n  /** Specifies which camera to use for capture of image or video data. `user` for the user-facing camera and/or microphone.\n   * `environment` specifies the the outward-facing camera and/or microphone. If the requested facing mode isn't available,\n   * the user agent may fall back to its preferred default mode. */\n  @Prop() capture?: 'user' | 'environment';\n\n  /** The maximum file size allowed per file (Megabytes) */\n  @Prop() maxFileSize: number = 1;\n\n  /** The maximum file size allowed per file (bytes).  */\n  @Prop() maxFiles: number = 1;\n\n  /** String to place within a label element. */\n  @Prop() label!: string;\n\n  /** Placeholder only used within single file uploads. */\n  @Prop() placeholder: string = 'Choose a file...';\n\n  /** Visually hide the label - but make it accessible. */\n  @Prop() hideLabel?: boolean = false;\n\n  /** If `true`, the user must select a file to upload before submitting a form. */\n  @Prop() required = false;\n\n  /** If `true`, the user cannot interact with the select. */\n  @Prop({ reflect: true }) disabled = false;\n\n  /** If `true`, a clear icon will appear in the input when there is a value.\n   * Clicking it clears the input. Only used within single file uploads. */\n  @Prop() clearInput = false;\n\n  /** Whether to show validation errors underneath input */\n  @Prop({ reflect: true }) showInlineError = true;\n\n  /** When should the field perform validation */\n  @Prop({ mutable: true }) validateOn?: 'dirty' | 'submit' | 'submitThenDirty' =\n    'submit';\n\n  /** The form element to associate with this input (its form owner). Must be the id of a form. */\n  @Prop() form?: string | null;\n\n  @Watch('maxFiles')\n  @Watch('maxFileSize')\n  @Watch('capture')\n  @Watch('accept')\n  @Watch('required')\n  @Watch('disabled')\n  @Watch('fileList')\n  protected shouldValidate() {\n    if (!this.inputEl) return;\n\n    this.validate();\n    requestAnimationFrame(() => {\n      if (this.validateOn === 'dirty') this.showInlineValidation();\n    });\n  }\n\n  @State() _invalid = false;\n  /** This will be true when the control is in an invalid state.\n   * Validity is determined by the `required` prop. Or if custom validity message is set. @readonly */\n  @Prop({ reflect: true })\n  get invalid() {\n    return this._invalid;\n  }\n\n  /**\n   * Current validation message - if any. @readonly\n   */\n  @Prop()\n  get validityMessage() {\n    if (!this.inputEl) return '';\n    return this.inputEl.validationMessage;\n  }\n\n  /** A File array that lists every selected file.\n   * Has an added `objectURL` property returning a `DOMString`\n   * containing an object URL that can be used to reference the contents of the specified source\n   * This list has no more than one member unless the multiple attribute is specified. @readonly */\n  @Prop()\n  get files(): FileWithUrl[] {\n    return this.inputEl\n      ? Array.from(this.inputEl.files).map((file: FileWithUrl) => {\n          file.objectURL = URL.createObjectURL(file);\n          return file;\n        })\n      : [];\n  }\n\n  /** A file input's value attribute contains a DOMString that represents the path to the selected file(s).\n   * If the user selected multiple files, the value represents the first file in the list of files they selected.\n   * You can reset the file-upload control by setting the value to an emptry string e.g. `var input.value = ''` */\n  @Prop()\n  get value() {\n    return this.inputEl ? this.inputEl.value : '';\n  }\n  set value(val: string) {\n    if (val === '' && this.inputEl) {\n      this.fileList = [];\n      this.inputEl.value = '';\n    }\n  }\n\n  // Events\n\n  /** Emitted when the value has changed. */\n  @Event() nanoChange!: EventEmitter<FileInputChangeEventDetail>;\n\n  /** Emited when the checkbox is focused */\n  @Event() nanoFocus: EventEmitter;\n\n  /** Emited when the checkbox is blurred */\n  @Event() nanoBlur: EventEmitter;\n\n  /** Called when validation is performed (which depends on `validateOn`).\n   * @returns event.detail: `{ isValid: boolean, errorMessage: string, originalEvent: Event }`. */\n  @Event() nanoValidate: EventEmitter<ControlValidityEventDetail>;\n\n  // Public methods\n\n  /** Get the current state of the control.\n   * @param validateFirst - perform validation first before reporting\n   * @returns `{ isValid: boolean, errorMessage: string }` */\n  @Method()\n  async reportValidity(validateFirst: boolean): Promise<ControlValidity> {\n    if (validateFirst) {\n      this.validate();\n      this.showInlineValidation();\n    }\n    return {\n      isValid: !this.invalid,\n      errorMessage: this.inputEl.validationMessage,\n    };\n  }\n\n  /** Sets focus on the specified `nano-input`. Use this method instead of the global\n   * `input.focus()`. */\n  @Method()\n  async setFocus() {\n    if (this.inputEl) this.inputEl.focus();\n  }\n\n  /** Returns the native `<input>` element used under the hood */\n  @Method()\n  getInputElement(): Promise<HTMLInputElement | HTMLTextAreaElement> {\n    return Promise.resolve(this.inputEl!);\n  }\n\n  /** Invalidate the field and show a custom error message. To clear the error you will need to re-call this method with an empty string.\n   * @param message */\n  @Method()\n  async showError(message: string) {\n    if (this.inputEl) {\n      this.inputEl.setCustomValidity(message);\n      this.validate();\n      this.showInlineValidation();\n    }\n  }\n\n  // Listeners\n\n  @Listen('click', { target: 'window' })\n  globalClickHandler(e: Event) {\n    if (!this.hasFocus) return;\n    if (e.composedPath().every((node) => node !== this.host)) this.onBlur();\n  }\n\n  @Listen('keydown', { target: 'window' })\n  globalKeydownHandler(e: KeyboardEvent) {\n    if (!this.hasFocus || e.key !== 'Tab') return;\n    if (e.target !== this.inputEl) this.onBlur();\n  }\n\n  @Listen('reset', { target: 'body' })\n  onReset(e) {\n    const form = this.form\n      ? document.querySelector('#' + this.form)\n      : this.host.closest('form');\n    if (!form || e.target !== this.host.closest('form')) return;\n\n    this.value = '';\n  }\n\n  // Private methods\n\n  private onClearClick = () => {\n    this.value = '';\n  };\n\n  private onBlur = () => {\n    this.hasFocus = false;\n    this.validate();\n    if (this.validateOn === 'dirty') this.showInlineValidation();\n    this.nanoBlur.emit();\n  };\n\n  private onFocus = () => {\n    this.hasFocus = true;\n    this.nanoFocus.emit();\n  };\n\n  private arrToFileList(files: File[]): FileList {\n    const fileList = getDataTransfer();\n    for (var i = 0, len = files.length; i < len; i++)\n      fileList.items.add(files[i]);\n    return fileList.files;\n  }\n\n  private checkFileSize(size: number): boolean {\n    return size / 1000000 <= this.maxFileSize;\n  }\n\n  private checkFileType(type: string): boolean {\n    if (!this.accept) return true;\n    return this.accept.match(type) && this.accept.match(type).length > 0;\n  }\n\n  private validate = () => {\n    this.errorMessage = '';\n    this.inputEl.setCustomValidity('');\n    let error: string;\n\n    if (!this.inputEl.validity.valid) {\n      error = this.inputEl.validationMessage;\n    } else {\n      this.fileList.forEach((fileItem) => {\n        error = null;\n        if (!this.checkFileSize(fileItem.file.size)) {\n          error =\n            'Maximum file size exceeded. Max file size is ' +\n            this.maxFileSize +\n            'Mb';\n        } else if (!this.checkFileType(fileItem.file.type))\n          error = `File type is not allowed (${this.accept})`;\n\n        fileItem.validationMessage = error;\n        fileItem.valid = !error;\n      });\n      if (this.fileList.length > this.maxFiles)\n        error = `Maxinum number of files exceeded (${this.maxFiles})`;\n    }\n\n    if (!!error) this.inputEl.setCustomValidity(error);\n  };\n\n  private showInlineValidation(ev?: Event) {\n    if (this.validateOn === 'submitThenDirty') this.validateOn = 'dirty';\n\n    this._invalid = false;\n    this.errorMessage = '';\n\n    if (!this.inputEl.validity.valid) {\n      this.errorMessage = this.inputEl.validationMessage;\n      this._invalid = true;\n    }\n\n    this.nanoValidate.emit({\n      isValid: !this._invalid,\n      errorMessage: this.inputEl.validationMessage,\n      originalEvent: ev,\n    });\n  }\n\n  private slotChangeObserver() {\n    if (this.mo) this.mo.disconnect();\n    const mo = (this.mo = new MutationObserver(() =>\n      this.processSlottedContent()\n    ));\n    mo.observe(this.host, { childList: true, subtree: true });\n  }\n\n  private processSlottedContent() {\n    // see if we have slot content\n    this.hasLabelSlot = !!this.host.querySelectorAll('[slot=\"label\"]');\n    this.hasHelperSlot = !!this.host.querySelector('[slot=\"helper\"]');\n  }\n\n  private addNewFiles(files: FileList) {\n    const fileList: FileValidation[] = Array.from(files).map((file) => {\n      return {\n        file: file,\n        location: URL.createObjectURL(file),\n        valid: true,\n        validationMessage: null,\n      };\n    });\n\n    // if we have a list and we're in a browser that can amend files\n    // append files to the list, otherwise replace\n    if (this.canChangeFileList && this.maxFiles > 1) {\n      const newFiles = fileList.filter(\n        (findFile) =>\n          !this.fileList.find((file) => file.file.name === findFile.file.name)\n      );\n      this.fileList = [...this.fileList, ...newFiles];\n    } else this.fileList = fileList;\n  }\n\n  // event handlers & hooks\n\n  private onInvalid = (ev: Event) => {\n    if (this.showInlineError) ev.preventDefault();\n    this.validate();\n    this.showInlineValidation(ev);\n  };\n\n  private onFileChoose = (e: Event) => {\n    const files = (e.target as HTMLInputElement).files;\n    if (files && files.length)\n      this.addNewFiles((e.target as HTMLInputElement).files);\n  };\n\n  private onFileRemoveFileClick = (e: Event, file: FileValidation) => {\n    if (!this.canChangeFileList) return;\n    this.removeFiles.push(file);\n\n    (e.target as HTMLElement)\n      .closest('.file-upload__list-item--active')\n      .classList.remove('file-upload__list-item--active');\n  };\n\n  private onFileRemoveAnim = () => {\n    if (!this.canChangeFileList || !this.removeFiles.length) return;\n    this.fileList = this.fileList.filter(\n      (fileItem) => !this.removeFiles.find((rmFile) => rmFile === fileItem)\n    );\n    this.removeFiles = [];\n  };\n\n  private onInputChange = () => {\n    this.nanoChange.emit({ value: this.value, files: this.files });\n  };\n\n  private onDragStop = (e: DragEvent) => {\n    e.preventDefault();\n    e.stopPropagation();\n    this.isDragging = false;\n  };\n\n  private onDragStart = (e: DragEvent) => {\n    e.preventDefault();\n    e.stopPropagation();\n    this.isDragging = true;\n  };\n\n  private onDrop = (e: DragEvent) => {\n    this.onDragStop(e);\n    if (e.dataTransfer.files && e.dataTransfer.files.length)\n      this.addNewFiles(e.dataTransfer.files);\n  };\n\n  // Component lifecycle\n\n  disconnectedCallback() {\n    if (this.mo) this.mo.disconnect();\n  }\n\n  componentDidLoad() {\n    this.slotChangeObserver();\n  }\n\n  componentWillLoad() {\n    this.processSlottedContent();\n  }\n\n  private FileUploadInput = (\n    eleType: 'drop' | 'btn',\n    listId?: string\n  ): VNode[] => {\n    const labelId = this.fileInputId + '-lbl';\n    const moreId =\n      this.showInlineError || this.hasHelperSlot\n        ? this.fileInputId + '-more'\n        : '';\n\n    return [\n      <div class={'file-upload__' + eleType + '-wrap'}>\n        <label\n          class={`file-upload__` + eleType}\n          htmlFor={this.fileInputId}\n          id={labelId}\n          onDrop={(e) => {\n            this.onDrop(e);\n            this.onDragStop(e);\n          }}\n          onDragEnd={this.onDragStop}\n          onDragLeave={this.onDragStop}\n          onDragEnter={this.onDragStart}\n          onDragOver={this.onDragStart}\n        >\n          {(!!this.label || (this.hasLabelSlot && eleType !== 'drop')) && (\n            <div\n              class={`file-upload__label ${\n                this.hideLabel ? 'visually-hide' : ''\n              }`}\n            >\n              {!!this.label && !!this.label.length ? this.label : ''}\n              {!this.label && this.hasLabelSlot && eleType !== 'drop' && (\n                <slot name=\"label\" />\n              )}\n            </div>\n          )}\n          {eleType === 'drop' && (\n            <div class=\"file-upload__drop-area\">\n              <div>{this.hasLabelSlot && <slot name=\"label\" />}</div>\n              <div>\n                Drag and drop or&nbsp;<span>browse</span>\n              </div>\n            </div>\n          )}\n          {eleType === 'btn' && (\n            <div\n              class={`file-upload__button button--keyline button--icon-start ${\n                this.hasFocus ? 'button--focus' : ''\n              }`}\n            >\n              <div class={`file-upload__btn-content`}>\n                <nano-icon name=\"regular/cloud-upload\" />\n                <span>\n                  {!!this.fileList.length\n                    ? this.fileList[0].file.name\n                    : this.placeholder}\n                </span>\n                {!!this.value && this.clearInput && !this.disabled && (\n                  <button\n                    type=\"button\"\n                    class=\"icon file-upload__clear-btn\"\n                    tabindex=\"-1\"\n                    onClick={this.onClearClick}\n                  >\n                    <nano-icon name=\"light/times\"></nano-icon>\n                  </button>\n                )}\n              </div>\n            </div>\n          )}\n          <input\n            aria-labelledby={labelId + ' ' + moreId + ' ' + listId}\n            type=\"file\"\n            id={this.fileInputId}\n            accept={this.accept}\n            class=\"file-upload__input\"\n            multiple={this.maxFiles > 1}\n            disabled={this.disabled}\n            name={this.canChangeFileList ? undefined : this.name}\n            form={this.form}\n            ref={(input) => {\n              if (this.canChangeFileList) {\n                this.publicInputEl = input;\n                return;\n              }\n              this.inputEl = input;\n            }}\n            onChange={this.onFileChoose}\n            onFocus={this.onFocus}\n            onReset={this.onInputChange}\n          />\n        </label>\n        <input\n          name={!this.canChangeFileList ? undefined : this.name}\n          form={this.form}\n          ref={(input) => {\n            if (!this.canChangeFileList) return;\n            this.inputEl = input;\n          }}\n          type=\"file\"\n          id={this.fileInputId + '-hidden'}\n          tabIndex={-1}\n          multiple={true}\n          class=\"file-upload__input\"\n          disabled={this.disabled}\n          required={this.required}\n          accept={this.accept}\n          onInvalid={this.onInvalid}\n          onChange={this.onInputChange}\n        />\n      </div>,\n      this.showInlineError || this.hasHelperSlot ? (\n        <div class=\"file-upload__more\" id={moreId}>\n          {this.showInlineError && !!this.errorMessage.length ? (\n            <div class=\"file-upload__error\">{this.errorMessage}</div>\n          ) : (\n            ''\n          )}\n          <div class=\"file-upload__help\">\n            <slot name=\"helper\" />\n          </div>\n        </div>\n      ) : (\n        ''\n      ),\n    ];\n  };\n\n  private button = (): VNode[] => {\n    return this.FileUploadInput('btn');\n  };\n\n  private dropArea = (): VNode[] => {\n    const listId = this.fileInputId + '-list';\n    return [\n      this.FileUploadInput('drop', listId),\n      <output class=\"file-upload__list-wrap\" id={listId}>\n        {!!this.fileList && this.fileList.length > 0 && (\n          <ul class=\"file-upload__list list\">\n            {this.fileList.map((file) => {\n              return (\n                <li\n                  key={file.file.name}\n                  class=\"file-upload__list-item file-upload__list-item--active list-item\"\n                  onAnimationEnd={(_) => this.onFileRemoveAnim()}\n                >\n                  <span class=\"list-title\">{file.file.name}</span>\n                  {!file.valid && (\n                    <nano-tooltip\n                      content={file.validationMessage}\n                      placement=\"left\"\n                    >\n                      <nano-icon-button\n                        class=\"list-button list-error\"\n                        iconName=\"light/exclamation-triangle\"\n                        label=\"File error\"\n                      />\n                    </nano-tooltip>\n                  )}\n                  {this.canChangeFileList && (\n                    <nano-icon-button\n                      class=\"list-button list-button--view\"\n                      type=\"button\"\n                      iconName=\"light/eye\"\n                      label=\"View file\"\n                      target=\"_blank\"\n                      href={file.location}\n                    />\n                  )}\n                  {this.canChangeFileList && (\n                    <nano-icon-button\n                      onClick={(e) => this.onFileRemoveFileClick(e, file)}\n                      class=\"list-button list-button--remove\"\n                      iconName=\"light/times\"\n                      label=\"Remove file\"\n                    />\n                  )}\n                </li>\n              );\n            })}\n          </ul>\n        )}\n      </output>,\n    ];\n  };\n\n  render() {\n    return (\n      <Host>\n        <div\n          class={{\n            'file-upload': true,\n            'file-upload--dragging': this.isDragging,\n            'file-upload--focus': this.hasFocus,\n            'file-upload--invalid': this._invalid,\n          }}\n        >\n          {this.maxFiles > 1 ? <this.dropArea /> : <this.button />}\n        </div>\n      </Host>\n    );\n  }\n}\n"]}

package/dist/nano-components/{p-7d351076.system.entry.js → p-21af2a5e.system.entry.js}

@@ -1,5 +1,5 @@
 var __awaiter=this&&this.__awaiter||function(e,t,i,n){function o(e){return e instanceof i?e:new i((function(t){t(e)}))}return new(i||(i=Promise))((function(i,r){function a(e){try{l(n.next(e))}catch(t){r(t)}}function s(e){try{l(n["throw"](e))}catch(t){r(t)}}function l(e){e.done?i(e.value):o(e.value).then(a,s)}l((n=n.apply(e,t||[])).next())}))};var __generator=this&&this.__generator||function(e,t){var i={label:0,sent:function(){if(r[0]&1)throw r[1];return r[1]},trys:[],ops:[]},n,o,r,a;return a={next:s(0),throw:s(1),return:s(2)},typeof Symbol==="function"&&(a[Symbol.iterator]=function(){return this}),a;function s(e){return function(t){return l([e,t])}}function l(a){if(n)throw new TypeError("Generator is already executing.");while(i)try{if(n=1,o&&(r=a[0]&2?o["return"]:a[0]?o["throw"]||((r=o["return"])&&r.call(o),0):o.next)&&!(r=r.call(o,a[1])).done)return r;if(o=0,r)a=[a[0]&2,r.value];switch(a[0]){case 0:case 1:r=a;break;case 4:i.label++;return{value:a[1],done:false};case 5:i.label++;o=a[1];a=[0];continue;case 7:a=i.ops.pop();i.trys.pop();continue;default:if(!(r=i.trys,r=r.length>0&&r[r.length-1])&&(a[0]===6||a[0]===2)){i=0;continue}if(a[0]===3&&(!r||a[1]>r[0]&&a[1]<r[3])){i.label=a[1];break}if(a[0]===6&&i.label<r[1]){i.label=r[1];r=a;break}if(r&&i.label<r[2]){i.label=r[2];i.ops.push(a);break}if(r[2])i.ops.pop();i.trys.pop();continue}a=t.call(e,i)}catch(s){a=[6,s];o=0}finally{n=r=0}if(a[0]&5)throw a[1];return{value:a[0]?a[1]:void 0,done:true}}};
 /*!
  * Web Components for Nanopore digital Web Apps
- */System.register(["./p-59b3d24b.system.js","./p-1c216ca4.system.js","./p-ef053a2f.system.js"],(function(e){"use strict";var t,i,n,o,r,a,s,l;return{setters:[function(e){t=e.r;i=e.c;n=e.h;o=e.e;r=e.g},function(e){a=e.c;s=e.r},function(e){l=e.d}],execute:function(){function d(e,t){function i(i){var n=e.getBoundingClientRect();var o=e.ownerDocument.defaultView;var r=n.left+o.pageXOffset;var a=n.top+o.pageYOffset;var s=i.pageX-r;var l=i.pageY-a;t(s,l)}function n(){document.removeEventListener("pointermove",i);document.removeEventListener("pointerup",n)}document.addEventListener("pointermove",i,{passive:true});document.addEventListener("pointerup",n)}var c=':host{-webkit-box-sizing:border-box;box-sizing:border-box}*,*::before,*::after{-webkit-box-sizing:border-box;box-sizing:border-box}[hidden]{display:none !important}:host{--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)}';var h=e("nano_split_pane",function(){function e(e){var n=this;t(this,e);this.nanoReposition=i(this,"nanoReposition",7);this.nanoDragging=i(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=function(e){if(n.disabled){return}e.preventDefault();d(n.host,(function(e,t){var i=n.vertical?t:e;n.nanoDragging.emit(i);if(n.primary==="end"){i=n.size-i}if(n.snap){var o=n.snap.split(" ");o.forEach((function(e){var t;if(e.endsWith("%")){t=n.size*(parseFloat(e)/100)}else{t=parseFloat(e)}if(i>=t-n.snapThreshold&&i<=t+n.snapThreshold){i=t}}))}n.shouldAnimate=false;n.position=a(n.pixelsToPercentage(i),0,100);s((function(){return n.shouldAnimate=true}))}))};this.handleKeyDown=function(e){if(n.disabled){return}if(["ArrowLeft","ArrowRight","ArrowUp","ArrowDown","Home","End"].includes(e.key)){var t=n.position;var i=(e.shiftKey?10:1)*(n.primary==="end"?-1:1);e.preventDefault();if(e.key==="ArrowLeft"&&!n.vertical||e.key==="ArrowUp"&&n.vertical){t-=i}if(e.key==="ArrowRight"&&!n.vertical||e.key==="ArrowDown"&&n.vertical){t+=i}if(e.key==="Home"){t=n.primary==="end"?100:0}if(e.key==="End"){t=n.primary==="end"?0:100}n.shouldAnimate=false;n.position=a(t,0,100);s((function(){return n.shouldAnimate=true}))}};this.handleResize=function(){if(!n.didLoad||n.isAnimating)return;if(n.primary){n.shouldAnimate=false;n.position=n.pixelsToPercentage(n.cachedPositionInPixels);s((function(){return n.shouldAnimate=true}))}};this.handlePositionChange=l(this.handlePositionChange.bind(this),100)}Object.defineProperty(e.prototype,"size",{get:function(){var e=this.host.getBoundingClientRect(),t=e.width,i=e.height;return this.vertical?i:t},enumerable:false,configurable:true});Object.defineProperty(e.prototype,"shouldAnimate",{get:function(){return this.didLoad&&this._shouldAnimate},set:function(e){this._shouldAnimate=e},enumerable:false,configurable:true});Object.defineProperty(e.prototype,"position",{get:function(){return this._position},set:function(e){e=Math.min(Math.max(e,0),100);if(isNaN(e)||e===this._position)return;if(this.shouldAnimate&&this.animationDuration>0&&!isNaN(this.position)){this.animatePosition(e);return}this._position=e},enumerable:false,configurable:true});e.prototype.handlePositionChange=function(){this.cachedPositionInPixels=this.percentageToPixels(this.position);this.positionInPixels=this.percentageToPixels(this.position);this.nanoReposition.emit()};e.prototype.handlePositionInPixelsChange=function(){this.position=this.pixelsToPercentage(this.positionInPixels)};e.prototype.getPercentageToPixels=function(e){return __awaiter(this,void 0,void 0,(function(){return __generator(this,(function(t){return[2,this.percentageToPixels(e)]}))}))};e.prototype.getPixelsToPercentage=function(e){return __awaiter(this,void 0,void 0,(function(){return __generator(this,(function(t){return[2,this.pixelsToPercentage(e)]}))}))};e.prototype.animatePosition=function(e){var t=this;if(this.isAnimating)return;var i=this.animationDuration;var n=60;var o=this.position;var r=e-o;var a=o;var l=0;function d(e,t,i,n){if((e/=n/2)<1)return i/2*e*e+t;else return-i/2*(--e*(e-2)-1)+t}var c=function(){l+=1/n;a=d(l,o,r,i);if(e>o&&a>=e||e<o&&a<=e){t.position=e;t.shouldAnimate=true;t.isAnimating=false;return}t.position=a;s(c)};this.shouldAnimate=false;this.isAnimating=true;s(c)};e.prototype.percentageToPixels=function(e){return this.size*(e/100)};e.prototype.pixelsToPercentage=function(e){return e/this.size*100};e.prototype.attachRO=function(){var e=this;this.detachRO();this.ro=new ResizeObserver((function(){return e.handleResize()}));this.ro.observe(this.host)};e.prototype.detachRO=function(){if(!this.ro)return;this.ro.unobserve(this.host);this.ro=undefined};e.prototype.componentDidLoad=function(){var e=this;if(this.positionInPixels)this.handlePositionInPixelsChange();setTimeout((function(){return e.didLoad=true}))};e.prototype.connectedCallback=function(){this.cachedPositionInPixels=this.percentageToPixels(this.position);this.attachRO()};e.prototype.disconnectedCallback=function(){this.detachRO()};e.prototype.componentDidRender=function(){var e=this;s((function(){if(typeof e.position==="undefined"){e.position=50}}))};e.prototype.render=function(){if(typeof this.position==="undefined")return;var e={};var t=this.vertical?"gridTemplateRows":"gridTemplateColumns";var i="\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    ";var r="auto";if(this.primary==="end"){e[t]=r+" var(--divider-width) "+i}else{e[t]=i+" var(--divider-width) "+r}return n(o,{style:e},n("div",{part:"panel start",class:"start"},n("slot",{name:"start"})),n("div",{part:"divider",class:"divider",tabindex:this.disabled?undefined:"0",role:"separator","aria-label":"Resize",onKeyDown:this.handleKeyDown,onMouseDown:this.handleDrag,onTouchStart:this.handleDrag},n("slot",{name:"handle"},!this.disabled&&this.vertical?n("nano-icon",{slot:"handle",name:"solid/grip-lines"}):n("nano-icon",{slot:"handle",name:"solid/grip-lines-vertical"}))),n("div",{part:"panel end",class:"end"},n("slot",{name:"end"})))};Object.defineProperty(e.prototype,"host",{get:function(){return r(this)},enumerable:false,configurable:true});Object.defineProperty(e,"watchers",{get:function(){return{position:["handlePositionChange"],positionInPixels:["handlePositionInPixelsChange"]}},enumerable:false,configurable:true});return e}());h.style=c}}}));
-//# sourceMappingURL=p-7d351076.system.entry.js.map
+ */System.register(["./p-f48be9f5.system.js","./p-1c216ca4.system.js","./p-ef053a2f.system.js"],(function(e){"use strict";var t,i,n,o,r,a,s,l;return{setters:[function(e){t=e.r;i=e.c;n=e.h;o=e.e;r=e.g},function(e){a=e.c;s=e.r},function(e){l=e.d}],execute:function(){function d(e,t){function i(i){var n=e.getBoundingClientRect();var o=e.ownerDocument.defaultView;var r=n.left+o.pageXOffset;var a=n.top+o.pageYOffset;var s=i.pageX-r;var l=i.pageY-a;t(s,l)}function n(){document.removeEventListener("pointermove",i);document.removeEventListener("pointerup",n)}document.addEventListener("pointermove",i,{passive:true});document.addEventListener("pointerup",n)}var c=':host{-webkit-box-sizing:border-box;box-sizing:border-box}*,*::before,*::after{-webkit-box-sizing:border-box;box-sizing:border-box}[hidden]{display:none !important}:host{--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)}';var h=e("nano_split_pane",function(){function e(e){var n=this;t(this,e);this.nanoReposition=i(this,"nanoReposition",7);this.nanoDragging=i(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=function(e){if(n.disabled){return}e.preventDefault();d(n.host,(function(e,t){var i=n.vertical?t:e;n.nanoDragging.emit(i);if(n.primary==="end"){i=n.size-i}if(n.snap){var o=n.snap.split(" ");o.forEach((function(e){var t;if(e.endsWith("%")){t=n.size*(parseFloat(e)/100)}else{t=parseFloat(e)}if(i>=t-n.snapThreshold&&i<=t+n.snapThreshold){i=t}}))}n.shouldAnimate=false;n.position=a(n.pixelsToPercentage(i),0,100);s((function(){return n.shouldAnimate=true}))}))};this.handleKeyDown=function(e){if(n.disabled){return}if(["ArrowLeft","ArrowRight","ArrowUp","ArrowDown","Home","End"].includes(e.key)){var t=n.position;var i=(e.shiftKey?10:1)*(n.primary==="end"?-1:1);e.preventDefault();if(e.key==="ArrowLeft"&&!n.vertical||e.key==="ArrowUp"&&n.vertical){t-=i}if(e.key==="ArrowRight"&&!n.vertical||e.key==="ArrowDown"&&n.vertical){t+=i}if(e.key==="Home"){t=n.primary==="end"?100:0}if(e.key==="End"){t=n.primary==="end"?0:100}n.shouldAnimate=false;n.position=a(t,0,100);s((function(){return n.shouldAnimate=true}))}};this.handleResize=function(){if(!n.didLoad||n.isAnimating)return;if(n.primary){n.shouldAnimate=false;n.position=n.pixelsToPercentage(n.cachedPositionInPixels);s((function(){return n.shouldAnimate=true}))}};this.handlePositionChange=l(this.handlePositionChange.bind(this),100)}Object.defineProperty(e.prototype,"size",{get:function(){var e=this.host.getBoundingClientRect(),t=e.width,i=e.height;return this.vertical?i:t},enumerable:false,configurable:true});Object.defineProperty(e.prototype,"shouldAnimate",{get:function(){return this.didLoad&&this._shouldAnimate},set:function(e){this._shouldAnimate=e},enumerable:false,configurable:true});Object.defineProperty(e.prototype,"position",{get:function(){return this._position},set:function(e){e=Math.min(Math.max(e,0),100);if(isNaN(e)||e===this._position)return;if(this.shouldAnimate&&this.animationDuration>0&&!isNaN(this.position)){this.animatePosition(e);return}this._position=e},enumerable:false,configurable:true});e.prototype.handlePositionChange=function(){this.cachedPositionInPixels=this.percentageToPixels(this.position);this.positionInPixels=this.percentageToPixels(this.position);this.nanoReposition.emit()};e.prototype.handlePositionInPixelsChange=function(){this.position=this.pixelsToPercentage(this.positionInPixels)};e.prototype.getPercentageToPixels=function(e){return __awaiter(this,void 0,void 0,(function(){return __generator(this,(function(t){return[2,this.percentageToPixels(e)]}))}))};e.prototype.getPixelsToPercentage=function(e){return __awaiter(this,void 0,void 0,(function(){return __generator(this,(function(t){return[2,this.pixelsToPercentage(e)]}))}))};e.prototype.animatePosition=function(e){var t=this;if(this.isAnimating)return;var i=this.animationDuration;var n=60;var o=this.position;var r=e-o;var a=o;var l=0;function d(e,t,i,n){if((e/=n/2)<1)return i/2*e*e+t;else return-i/2*(--e*(e-2)-1)+t}var c=function(){l+=1/n;a=d(l,o,r,i);if(e>o&&a>=e||e<o&&a<=e){t.position=e;t.shouldAnimate=true;t.isAnimating=false;return}t.position=a;s(c)};this.shouldAnimate=false;this.isAnimating=true;s(c)};e.prototype.percentageToPixels=function(e){return this.size*(e/100)};e.prototype.pixelsToPercentage=function(e){return e/this.size*100};e.prototype.attachRO=function(){var e=this;this.detachRO();this.ro=new ResizeObserver((function(){return e.handleResize()}));this.ro.observe(this.host)};e.prototype.detachRO=function(){if(!this.ro)return;this.ro.unobserve(this.host);this.ro=undefined};e.prototype.componentDidLoad=function(){var e=this;if(this.positionInPixels)this.handlePositionInPixelsChange();setTimeout((function(){return e.didLoad=true}))};e.prototype.connectedCallback=function(){this.cachedPositionInPixels=this.percentageToPixels(this.position);this.attachRO()};e.prototype.disconnectedCallback=function(){this.detachRO()};e.prototype.componentDidRender=function(){var e=this;s((function(){if(typeof e.position==="undefined"){e.position=50}}))};e.prototype.render=function(){if(typeof this.position==="undefined")return;var e={};var t=this.vertical?"gridTemplateRows":"gridTemplateColumns";var i="\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    ";var r="auto";if(this.primary==="end"){e[t]=r+" var(--divider-width) "+i}else{e[t]=i+" var(--divider-width) "+r}return n(o,{style:e},n("div",{part:"panel start",class:"start"},n("slot",{name:"start"})),n("div",{part:"divider",class:"divider",tabindex:this.disabled?undefined:"0",role:"separator","aria-label":"Resize",onKeyDown:this.handleKeyDown,onMouseDown:this.handleDrag,onTouchStart:this.handleDrag},n("slot",{name:"handle"},!this.disabled&&this.vertical?n("nano-icon",{slot:"handle",name:"solid/grip-lines"}):n("nano-icon",{slot:"handle",name:"solid/grip-lines-vertical"}))),n("div",{part:"panel end",class:"end"},n("slot",{name:"end"})))};Object.defineProperty(e.prototype,"host",{get:function(){return r(this)},enumerable:false,configurable:true});Object.defineProperty(e,"watchers",{get:function(){return{position:["handlePositionChange"],positionInPixels:["handlePositionInPixelsChange"]}},enumerable:false,configurable:true});return e}());h.style=c}}}));
+//# sourceMappingURL=p-21af2a5e.system.entry.js.map

package/dist/nano-components/{p-346588cc.entry.js → p-222d8095.entry.js}

@@ -1,5 +1,5 @@
 /*!
  * Web Components for Nanopore digital Web Apps
  */
-import{h as e,r as t,c as a,e as i,g as s}from"./p-ab5813a7.js";import{b as o,D as n,i as d,p as r,d as l,s as c,e as h,f as u,g as b,h as f,j as p,k as _,a as v}from"./p-f66958c1.js";import{c as x}from"./p-d99437a6.js";import{f as g}from"./p-f8f89998.js";var w;(function(e){e[e["Sunday"]=0]="Sunday";e[e["Monday"]=1]="Monday";e[e["Tuesday"]=2]="Tuesday";e[e["Wednesday"]=3]="Wednesday";e[e["Thursday"]=4]="Thursday";e[e["Friday"]=5]="Friday";e[e["Saturday"]=6]="Saturday"})(w||(w={}));function y(e,t){if(e==null||t==null){return false}return e.getFullYear()===t.getFullYear()&&e.getMonth()===t.getMonth()&&e.getDate()===t.getDate()}function m(e,t){var a=new Date(e);a.setDate(a.getDate()+t);return a}function k(e,t=w.Monday){var a=new Date(e);var i=a.getDay();var s=(i<t?7:0)+i-t;a.setDate(a.getDate()-s);return a}function D(e,t=w.Monday){var a=new Date(e);var i=a.getDay();var s=(i<t?-7:0)+6-(i-t);a.setDate(a.getDate()+s);return a}function z(e){return new Date(e.getFullYear(),e.getMonth(),1)}function M(e){return new Date(e.getFullYear(),e.getMonth()+1,0)}function S(e,t,a){return C(e,t,a)===e}function C(e,t,a){const i=e.getTime();if(t&&t instanceof Date&&i<t.getTime()){return t}if(a&&a instanceof Date&&i>a.getTime()){return a}return e}function N(e,t){const a=[];let i=e;while(!y(i,t)){a.push(i);i=m(i,1)}a.push(i);return a}function T(e,t=w.Monday){const a=k(z(e),t);const i=D(M(e),t);return N(a,i)}const F=({focusedDay:t,today:a,day:i,onDaySelect:s,onKeyboardNavigation:o,focusedDayRef:n,inRange:d,disabled:r,isSelected:l})=>{const c=y(i,a);const h=y(i,t);const u=i.getMonth()!==t.getMonth()||r;const b=!d;function f(e){s(e,i)}return e("button",{class:{"duet-date__day":true,"is-outside":b,"is-disabled":u,"is-today":c},tabIndex:h?0:-1,onClick:f,onKeyDown:o,disabled:b,type:"button","aria-pressed":l?"true":"false",ref:e=>{if(h&&e&&n){n(e)}}},e("span",{"aria-hidden":"true"},i.getDate()),e("span",{class:"duet-date__vhidden"},i.toLocaleDateString(undefined,{day:"numeric",month:"long"})))};function j(e,t){const a=[];for(let i=0;i<e.length;i+=t){a.push(e.slice(i,i+t))}return a}function L(e,t,a){return e.map(((i,s)=>{const o=(s+t)%e.length;return a(e[o])}))}const A=({selectedDate:t,focusedDate:a,labelledById:i,localization:s,firstDayOfWeek:o,min:n,max:d,onDateSelect:r,onKeyboardNavigation:l,focusedDayRef:c,onMouseDown:h,onFocusIn:u,isDateDisabled:b})=>{const f=new Date;const p=T(a,o);return e("table",{class:"duet-date__table",role:"grid","aria-labelledby":i,onFocusin:u,onMouseDown:h},e("thead",null,e("tr",null,L(s.dayNames,o,(t=>e("th",{class:"duet-date__table-header",scope:"col"},e("span",{"aria-hidden":"true"},t.substr(0,2)),e("span",{class:"duet-date__vhidden"},t)))))),e("tbody",null,j(p,7).map((i=>e("tr",{class:"duet-date__row"},i.map((i=>e("td",{class:"duet-date__cell",role:"gridcell","aria-selected":y(i,t)?"true":undefined},e(F,{day:i,today:f,focusedDay:a,inRange:S(i,n,d),onDaySelect:r,onKeyboardNavigation:l,focusedDayRef:c,disabled:b(i),isSelected:y(i,t)})))))))))};const Y={buttonLabel:"Choose date",placeholder:"YYYY-MM-DD",selectedDateMessage:"Selected date is",prevMonthLabel:"Previous month",nextMonthLabel:"Next month",monthSelectLabel:"Month",yearSelectLabel:"Year",closeLabel:"Close window",keyboardInstruction:"You can use arrow keys to navigate dates",calendarHeading:"Choose a date",dayNames:["Sunday","Monday","Tuesday","Wednesday","Thursday","Friday","Saturday"],monthNames:["January","February","March","April","May","June","July","August","September","October","November","December"],monthNamesShort:["Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec"]};const I=':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{--background:var(--nano-layer-bg, #fff);--active-color:var(--nano-color-base, var(--nano-color-primary, #007495));--active-text-color:var(\n      --nano-color-contrast,\n      var(--nano-color-primary-contrast, #fff)\n    );--focus-shadow:var(--nano-control-focus-shadow, 0 0 0 0.1875rem  var(--nano-control-focus-color, rgba(144, 198, 231, 0.8)));--inactive-color:var(--nano-button-color, #f0efed);display:block;font-size:16px}:host(.nano-color){--active-color:var(--nano-color-base, var(--nano-color-primary, #007495));--active-text-color:var(--nano-color-contrast);--focus-shadow:0 0 0 0.1875rem rgba(var(--nano-color-tint-rgb), 0.56)}.duet-date *,.duet-date *::before,.duet-date *::after{-webkit-box-sizing:border-box;box-sizing:border-box;margin:0}.duet-date{-webkit-box-sizing:border-box;box-sizing:border-box;color:currentColor;display:block;margin:0;position:relative;text-align:left;width:100%}.duet-date__dialog{display:-webkit-box;display:-ms-flexbox;display:flex;top:100%;max-width:100%;width:100%}.duet-date__dialog.is-left{left:auto;right:0;width:auto}.duet-date__dialog-content{background:var(--background);min-width:290px;padding:16px 16px 20px;position:relative;-webkit-transform:none;transform:none;max-width:100%;width:100%}.duet-date__table{border-collapse:collapse;border-spacing:0;font-size:1em;line-height:1.25;text-align:center;width:100%}.duet-date__table-header{font-size:0.75em;font-weight:600;letter-spacing:1px;line-height:1.25;padding-bottom:8px;text-decoration:none;text-transform:uppercase}.duet-date__cell{text-align:center}.duet-date__day{-moz-appearance:none;-webkit-appearance:none;appearance:none;background:transparent;border:0;border-radius:50%;cursor:pointer;display:inline-block;font-size:0.875em;font-variant-numeric:tabular-nums;line-height:1.25;position:relative;text-align:center;vertical-align:middle;z-index:1;-webkit-transition:0.15s ease all;transition:0.15s ease all;height:2.5em;width:2.5em}.duet-date__day.is-today{-webkit-box-shadow:0 0 0 1px var(--active-color);box-shadow:0 0 0 1px var(--active-color);position:relative}.duet-date__day:hover::before,.duet-date__day.is-today::before{content:"";background:var(--active-color);border-radius:50%;bottom:0;left:0;opacity:0.16;position:absolute;right:0;top:0}[aria-selected=true] .duet-date__day{background:var(--active-color);color:var(--active-text-color);-webkit-box-shadow:none;box-shadow:none;outline:0}.duet-date__day:active{background:var(--active-color);-webkit-box-shadow:var(--focus-shadow);box-shadow:var(--focus-shadow);color:var(--active-text-color)}.duet-date__day:focus{-webkit-box-shadow:var(--focus-shadow);box-shadow:var(--focus-shadow);outline:0}.duet-date__day.is-disabled{background:transparent;-webkit-box-shadow:none;box-shadow:none;cursor:default;opacity:0.5}.duet-date__day.is-disabled::before{display:none}.duet-date__day.is-outside{background:var(--inactive-color);-webkit-box-shadow:none;box-shadow:none;cursor:default;opacity:0.6;pointer-events:none}.duet-date__day.is-outside::before{display:none}.duet-date__header{-webkit-box-align:center;-ms-flex-align:center;align-items:center;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;margin-bottom:16px;width:100%}.duet-date__nav{white-space:nowrap}.duet-date__prev,.duet-date__next{background:var(--inactive-color);-moz-appearance:none;-webkit-appearance:none;-webkit-box-align:center;-ms-flex-align:center;align-items:center;appearance:none;border:0;border-radius:50%;cursor:pointer;display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;-ms-flex-pack:distribute;justify-content:space-around;margin-left:8px;padding:0;-webkit-transition:background-color 300ms ease;transition:background-color 300ms ease;font-size:0.9em;height:2.2em;width:2.2em}.duet-date__prev:focus,.duet-date__next:focus{-webkit-box-shadow:var(--focus-shadow);box-shadow:var(--focus-shadow);outline:0}.duet-date__prev:active:focus,.duet-date__next:active:focus{-webkit-box-shadow:none;box-shadow:none}.duet-date__prev:disabled,.duet-date__next:disabled{cursor:default;opacity:0.5}.duet-date__prev nano-icon,.duet-date__next nano-icon{margin:0 auto}.duet-date__select{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;margin-top:4px;position:relative}.duet-date__select span{margin-right:4px}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){.duet-date__select span{margin-right:unset;-webkit-margin-end:4px;margin-inline-end:4px}}.duet-date__select select{cursor:pointer;font-size:1em;height:100%;left:0;opacity:0;position:absolute;top:0;width:100%;z-index:2}.duet-date__select select.focus-visible:focus+.duet-date__select-label{-webkit-box-shadow:var(--focus-shadow);box-shadow:var(--focus-shadow)}.duet-date__select-label{-webkit-box-align:center;-ms-flex-align:center;align-items:center;border-radius:4px;display:-webkit-box;display:-ms-flexbox;display:flex;font-size:1.25em;font-weight:600;line-height:1.25;padding:0 4px 0 8px;pointer-events:none;position:relative;width:100%;z-index:1}.duet-date__select-label nano-icon{font-size:0.55em}.duet-date__vhidden{border:0;clip:rect(1px, 1px, 1px, 1px);height:1px;overflow:hidden;padding:0;position:absolute;top:0;width:1px}';function O(e,t){var a=[];for(var i=e;i<=t;i++){a.push(i)}return a}let R=class{constructor(e){t(this,e);this.nanoDatePicked=a(this,"nanoDatePicked",7);this.monthSelectId=o("NanoDateMonth");this.yearSelectId=o("NanoDateYear");this.dialogLabelId=o("NanoDateLabel");this.initialTouchX=null;this.initialTouchY=null;this.activeFocus=false;this.focusedDay=new Date;this.selectedDate="";this.min="";this.max="";this.firstDayOfWeek=n.Monday;this.localization=Y;this.isDateDisabled=()=>false;this.isModal=false;this.enableActiveFocus=()=>{this.activeFocus=true};this.disableActiveFocus=()=>{this.activeFocus=false};this.handleTouchStart=e=>{const t=e.changedTouches[0];this.initialTouchX=t.pageX;this.initialTouchY=t.pageY};this.handleTouchMove=e=>{e.preventDefault()};this.handleTouchEnd=e=>{const t=e.changedTouches[0];const a=t.pageX-this.initialTouchX;const i=t.pageY-this.initialTouchY;const s=70;const o=Math.abs(a)>=s&&Math.abs(i)<=s;if(o){this.addMonths(a<0?1:-1)}this.initialTouchY=null;this.initialTouchX=null};this.handleNextMonthClick=e=>{e.preventDefault();this.addMonths(1)};this.handlePreviousMonthClick=e=>{e.preventDefault();this.addMonths(-1)};this.handleKeyboardNavigation=e=>{if(e.key==="Tab"&&!e.shiftKey&&this.isModal){e.preventDefault();let t=this.firstFocusEle||this.firstFocusableElement;t.focus();return}var t=true;switch(e.key){case"ArrowRight":this.addDays(1);break;case"ArrowLeft":this.addDays(-1);break;case"ArrowDown":this.addDays(7);break;case"ArrowUp":this.addDays(-7);break;case"PageUp":if(e.shiftKey){this.addYears(-1)}else{this.addMonths(-1)}break;case"PageDown":if(e.shiftKey){this.addYears(1)}else{this.addMonths(1)}break;case"Home":this.startOfWeek();break;case"End":this.endOfWeek();break;default:t=false}if(t){e.preventDefault();this.enableActiveFocus()}};this.handleDaySelect=(e,t)=>{const a=!this.isDateDisabled(t);const i=d(t,r(this.min),r(this.max));if(!i||!a){return}if(t.getMonth()===this.focusedDay.getMonth()){this.setValue(t)}else{this.setFocusedDay(t)}};this.handleMonthSelect=e=>{this.setMonth(parseInt(e.target.value,10))};this.handleYearSelect=e=>{this.setYear(parseInt(e.target.value,10))};this.processFocusedDayNode=e=>{this.focusedDayNode=e;if(this.activeFocus){setTimeout((()=>e.focus()),0)}}}async setFocus(e=false,t=false){this.setFocusedDay(r(this.selectedDate)||new Date);if(e){setTimeout((e=>this.focusedDayNode.focus()),20);return}clearTimeout(this.focusTimeoutId);this.focusTimeoutId=setTimeout((()=>{if(t)g.force(this.monthSelectNode);this.monthSelectNode.focus()}),20)}handleSelectedDateChange(){this.setFocus(true)}addDays(e){this.setFocusedDay(l(this.focusedDay,e))}addMonths(e){this.setMonth(this.focusedDay.getMonth()+e)}addYears(e){this.setYear(this.focusedDay.getFullYear()+e)}startOfWeek(){this.setFocusedDay(c(this.focusedDay,this.firstDayOfWeek))}endOfWeek(){this.setFocusedDay(h(this.focusedDay,this.firstDayOfWeek))}setMonth(e){const t=u(b(this.focusedDay),e);const a=f(t);const i=u(this.focusedDay,e);this.setFocusedDay(p(i,t,a))}setYear(e){const t=_(b(this.focusedDay),e);const a=f(t);const i=_(this.focusedDay,e);this.setFocusedDay(p(i,t,a))}setFocusedDay(e){this.focusedDay=p(e,r(this.min),r(this.max))}setValue(e){this.selectedDate=v(e);this.nanoDatePicked.emit({value:this.selectedDate,valueAsDate:e})}connectedCallback(){if(this.yearSelectNode)g.observe(this.yearSelectNode);if(this.monthSelectNode)g.observe(this.monthSelectNode)}componentWillLoad(){this.handleSelectedDateChange()}componentDidLoad(){this.connectedCallback()}disconnectedCallback(){g.unobserve(this.yearSelectNode);g.unobserve(this.monthSelectNode)}render(){const t=r(this.selectedDate);const a=(t||this.focusedDay).getFullYear();const s=this.focusedDay.getMonth();const o=this.focusedDay.getFullYear();const n=r(this.min);const l=r(this.max);const c=n!=null&&n.getMonth()===s&&n.getFullYear()===o;const h=l!=null&&l.getMonth()===s&&l.getFullYear()===o;let u=a-10;let p=a+10;if(n)u=n.getFullYear();if(l)p=l.getFullYear();return e(i,{class:Object.assign({},x(this.color))},e("div",{class:"duet-date"},e("div",{class:{"duet-date__dialog":true,"is-active":true},onTouchMove:this.handleTouchMove,onTouchStart:this.handleTouchStart,onTouchEnd:this.handleTouchEnd},e("div",{class:"duet-date__dialog-content"},e("div",{class:"duet-date__vhidden duet-date__instructions","aria-live":"polite"},this.localization.keyboardInstruction),e("div",{class:"duet-date__header",onFocusin:this.disableActiveFocus},e("div",null,e("h2",{id:this.dialogLabelId,class:"duet-date__vhidden","aria-live":"polite"},this.localization.monthNames[s]," ",this.focusedDay.getFullYear()),e("label",{htmlFor:this.monthSelectId,class:"duet-date__vhidden"},this.localization.monthSelectLabel),e("div",{class:"duet-date__select"},e("select",{id:this.monthSelectId,class:"duet-date__select--month",ref:e=>this.firstFocusableElement=this.monthSelectNode=e,onChange:this.handleMonthSelect},this.localization.monthNames.map(((t,a)=>e("option",{key:t,value:a,selected:a===s,disabled:!d(new Date(o,a,1),n?b(n):null,l?f(l):null)},t)))),e("div",{class:"duet-date__select-label","aria-hidden":"true"},e("span",null,this.localization.monthNamesShort[s]),e("nano-icon",{name:"light/chevron-down"}))),e("label",{htmlFor:this.yearSelectId,class:"duet-date__vhidden"},this.localization.yearSelectLabel),e("div",{class:"duet-date__select"},e("select",{id:this.yearSelectId,class:"duet-date__select--year",onChange:this.handleYearSelect,ref:e=>this.yearSelectNode=e},O(u,p).map((t=>e("option",{key:t,selected:t===o},t)))),e("div",{class:"duet-date__select-label","aria-hidden":"true"},e("span",null,this.focusedDay.getFullYear()),e("nano-icon",{name:"light/chevron-down"})))),e("div",{class:"duet-date__nav"},e("button",{class:"duet-date__prev",onClick:this.handlePreviousMonthClick,disabled:c,type:"button"},e("nano-icon",{name:"light/chevron-left"}),e("span",{class:"duet-date__vhidden"},this.localization.prevMonthLabel)),e("button",{class:"duet-date__next",onClick:this.handleNextMonthClick,disabled:h,type:"button"},e("nano-icon",{name:"light/chevron-right"}),e("span",{class:"duet-date__vhidden"},this.localization.nextMonthLabel)))),e("div",null,e(A,{selectedDate:t,focusedDate:this.focusedDay,onDateSelect:this.handleDaySelect,onKeyboardNavigation:this.handleKeyboardNavigation,labelledById:this.dialogLabelId,localization:this.localization,firstDayOfWeek:this.firstDayOfWeek,focusedDayRef:this.processFocusedDayNode,min:n,max:l,isDateDisabled:this.isDateDisabled}))))))}get host(){return s(this)}static get watchers(){return{selectedDate:["handleSelectedDateChange"]}}};R.style=I;export{R as nano_date_picker};
-//# sourceMappingURL=p-346588cc.entry.js.map
+import{h as e,r as t,c as a,e as i,g as s}from"./p-b5c33aff.js";import{b as o,D as n,i as d,p as r,d as l,s as c,e as h,f as u,g as b,h as f,j as p,k as _,a as v}from"./p-f66958c1.js";import{c as x}from"./p-d99437a6.js";import{f as g}from"./p-f8f89998.js";var w;(function(e){e[e["Sunday"]=0]="Sunday";e[e["Monday"]=1]="Monday";e[e["Tuesday"]=2]="Tuesday";e[e["Wednesday"]=3]="Wednesday";e[e["Thursday"]=4]="Thursday";e[e["Friday"]=5]="Friday";e[e["Saturday"]=6]="Saturday"})(w||(w={}));function y(e,t){if(e==null||t==null){return false}return e.getFullYear()===t.getFullYear()&&e.getMonth()===t.getMonth()&&e.getDate()===t.getDate()}function m(e,t){var a=new Date(e);a.setDate(a.getDate()+t);return a}function k(e,t=w.Monday){var a=new Date(e);var i=a.getDay();var s=(i<t?7:0)+i-t;a.setDate(a.getDate()-s);return a}function D(e,t=w.Monday){var a=new Date(e);var i=a.getDay();var s=(i<t?-7:0)+6-(i-t);a.setDate(a.getDate()+s);return a}function z(e){return new Date(e.getFullYear(),e.getMonth(),1)}function M(e){return new Date(e.getFullYear(),e.getMonth()+1,0)}function S(e,t,a){return C(e,t,a)===e}function C(e,t,a){const i=e.getTime();if(t&&t instanceof Date&&i<t.getTime()){return t}if(a&&a instanceof Date&&i>a.getTime()){return a}return e}function N(e,t){const a=[];let i=e;while(!y(i,t)){a.push(i);i=m(i,1)}a.push(i);return a}function T(e,t=w.Monday){const a=k(z(e),t);const i=D(M(e),t);return N(a,i)}const F=({focusedDay:t,today:a,day:i,onDaySelect:s,onKeyboardNavigation:o,focusedDayRef:n,inRange:d,disabled:r,isSelected:l})=>{const c=y(i,a);const h=y(i,t);const u=i.getMonth()!==t.getMonth()||r;const b=!d;function f(e){s(e,i)}return e("button",{class:{"duet-date__day":true,"is-outside":b,"is-disabled":u,"is-today":c},tabIndex:h?0:-1,onClick:f,onKeyDown:o,disabled:b,type:"button","aria-pressed":l?"true":"false",ref:e=>{if(h&&e&&n){n(e)}}},e("span",{"aria-hidden":"true"},i.getDate()),e("span",{class:"duet-date__vhidden"},i.toLocaleDateString(undefined,{day:"numeric",month:"long"})))};function j(e,t){const a=[];for(let i=0;i<e.length;i+=t){a.push(e.slice(i,i+t))}return a}function L(e,t,a){return e.map(((i,s)=>{const o=(s+t)%e.length;return a(e[o])}))}const A=({selectedDate:t,focusedDate:a,labelledById:i,localization:s,firstDayOfWeek:o,min:n,max:d,onDateSelect:r,onKeyboardNavigation:l,focusedDayRef:c,onMouseDown:h,onFocusIn:u,isDateDisabled:b})=>{const f=new Date;const p=T(a,o);return e("table",{class:"duet-date__table",role:"grid","aria-labelledby":i,onFocusin:u,onMouseDown:h},e("thead",null,e("tr",null,L(s.dayNames,o,(t=>e("th",{class:"duet-date__table-header",scope:"col"},e("span",{"aria-hidden":"true"},t.substr(0,2)),e("span",{class:"duet-date__vhidden"},t)))))),e("tbody",null,j(p,7).map((i=>e("tr",{class:"duet-date__row"},i.map((i=>e("td",{class:"duet-date__cell",role:"gridcell","aria-selected":y(i,t)?"true":undefined},e(F,{day:i,today:f,focusedDay:a,inRange:S(i,n,d),onDaySelect:r,onKeyboardNavigation:l,focusedDayRef:c,disabled:b(i),isSelected:y(i,t)})))))))))};const Y={buttonLabel:"Choose date",placeholder:"YYYY-MM-DD",selectedDateMessage:"Selected date is",prevMonthLabel:"Previous month",nextMonthLabel:"Next month",monthSelectLabel:"Month",yearSelectLabel:"Year",closeLabel:"Close window",keyboardInstruction:"You can use arrow keys to navigate dates",calendarHeading:"Choose a date",dayNames:["Sunday","Monday","Tuesday","Wednesday","Thursday","Friday","Saturday"],monthNames:["January","February","March","April","May","June","July","August","September","October","November","December"],monthNamesShort:["Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec"]};const I=':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{--background:var(--nano-layer-bg, #fff);--active-color:var(--nano-color-base, var(--nano-color-primary, #007495));--active-text-color:var(\n      --nano-color-contrast,\n      var(--nano-color-primary-contrast, #fff)\n    );--focus-shadow:var(--nano-control-focus-shadow, 0 0 0 0.1875rem  var(--nano-control-focus-color, rgba(144, 198, 231, 0.8)));--inactive-color:var(--nano-button-color, #f0efed);display:block;font-size:16px}:host(.nano-color){--active-color:var(--nano-color-base, var(--nano-color-primary, #007495));--active-text-color:var(--nano-color-contrast);--focus-shadow:0 0 0 0.1875rem rgba(var(--nano-color-tint-rgb), 0.56)}.duet-date *,.duet-date *::before,.duet-date *::after{-webkit-box-sizing:border-box;box-sizing:border-box;margin:0}.duet-date{-webkit-box-sizing:border-box;box-sizing:border-box;color:currentColor;display:block;margin:0;position:relative;text-align:left;width:100%}.duet-date__dialog{display:-webkit-box;display:-ms-flexbox;display:flex;top:100%;max-width:100%;width:100%}.duet-date__dialog.is-left{left:auto;right:0;width:auto}.duet-date__dialog-content{background:var(--background);min-width:290px;padding:16px 16px 20px;position:relative;-webkit-transform:none;transform:none;max-width:100%;width:100%}.duet-date__table{border-collapse:collapse;border-spacing:0;font-size:1em;line-height:1.25;text-align:center;width:100%}.duet-date__table-header{font-size:0.75em;font-weight:600;letter-spacing:1px;line-height:1.25;padding-bottom:8px;text-decoration:none;text-transform:uppercase}.duet-date__cell{text-align:center}.duet-date__day{-moz-appearance:none;-webkit-appearance:none;appearance:none;background:transparent;border:0;border-radius:50%;cursor:pointer;display:inline-block;font-size:0.875em;font-variant-numeric:tabular-nums;line-height:1.25;position:relative;text-align:center;vertical-align:middle;z-index:1;-webkit-transition:0.15s ease all;transition:0.15s ease all;height:2.5em;width:2.5em}.duet-date__day.is-today{-webkit-box-shadow:0 0 0 1px var(--active-color);box-shadow:0 0 0 1px var(--active-color);position:relative}.duet-date__day:hover::before,.duet-date__day.is-today::before{content:"";background:var(--active-color);border-radius:50%;bottom:0;left:0;opacity:0.16;position:absolute;right:0;top:0}[aria-selected=true] .duet-date__day{background:var(--active-color);color:var(--active-text-color);-webkit-box-shadow:none;box-shadow:none;outline:0}.duet-date__day:active{background:var(--active-color);-webkit-box-shadow:var(--focus-shadow);box-shadow:var(--focus-shadow);color:var(--active-text-color)}.duet-date__day:focus{-webkit-box-shadow:var(--focus-shadow);box-shadow:var(--focus-shadow);outline:0}.duet-date__day.is-disabled{background:transparent;-webkit-box-shadow:none;box-shadow:none;cursor:default;opacity:0.5}.duet-date__day.is-disabled::before{display:none}.duet-date__day.is-outside{background:var(--inactive-color);-webkit-box-shadow:none;box-shadow:none;cursor:default;opacity:0.6;pointer-events:none}.duet-date__day.is-outside::before{display:none}.duet-date__header{-webkit-box-align:center;-ms-flex-align:center;align-items:center;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;margin-bottom:16px;width:100%}.duet-date__nav{white-space:nowrap}.duet-date__prev,.duet-date__next{background:var(--inactive-color);-moz-appearance:none;-webkit-appearance:none;-webkit-box-align:center;-ms-flex-align:center;align-items:center;appearance:none;border:0;border-radius:50%;cursor:pointer;display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;-ms-flex-pack:distribute;justify-content:space-around;margin-left:8px;padding:0;-webkit-transition:background-color 300ms ease;transition:background-color 300ms ease;font-size:0.9em;height:2.2em;width:2.2em}.duet-date__prev:focus,.duet-date__next:focus{-webkit-box-shadow:var(--focus-shadow);box-shadow:var(--focus-shadow);outline:0}.duet-date__prev:active:focus,.duet-date__next:active:focus{-webkit-box-shadow:none;box-shadow:none}.duet-date__prev:disabled,.duet-date__next:disabled{cursor:default;opacity:0.5}.duet-date__prev nano-icon,.duet-date__next nano-icon{margin:0 auto}.duet-date__select{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;margin-top:4px;position:relative}.duet-date__select span{margin-right:4px}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){.duet-date__select span{margin-right:unset;-webkit-margin-end:4px;margin-inline-end:4px}}.duet-date__select select{cursor:pointer;font-size:1em;height:100%;left:0;opacity:0;position:absolute;top:0;width:100%;z-index:2}.duet-date__select select.focus-visible:focus+.duet-date__select-label{-webkit-box-shadow:var(--focus-shadow);box-shadow:var(--focus-shadow)}.duet-date__select-label{-webkit-box-align:center;-ms-flex-align:center;align-items:center;border-radius:4px;display:-webkit-box;display:-ms-flexbox;display:flex;font-size:1.25em;font-weight:600;line-height:1.25;padding:0 4px 0 8px;pointer-events:none;position:relative;width:100%;z-index:1}.duet-date__select-label nano-icon{font-size:0.55em}.duet-date__vhidden{border:0;clip:rect(1px, 1px, 1px, 1px);height:1px;overflow:hidden;padding:0;position:absolute;top:0;width:1px}';function O(e,t){var a=[];for(var i=e;i<=t;i++){a.push(i)}return a}let R=class{constructor(e){t(this,e);this.nanoDatePicked=a(this,"nanoDatePicked",7);this.monthSelectId=o("NanoDateMonth");this.yearSelectId=o("NanoDateYear");this.dialogLabelId=o("NanoDateLabel");this.initialTouchX=null;this.initialTouchY=null;this.activeFocus=false;this.focusedDay=new Date;this.selectedDate="";this.min="";this.max="";this.firstDayOfWeek=n.Monday;this.localization=Y;this.isDateDisabled=()=>false;this.isModal=false;this.enableActiveFocus=()=>{this.activeFocus=true};this.disableActiveFocus=()=>{this.activeFocus=false};this.handleTouchStart=e=>{const t=e.changedTouches[0];this.initialTouchX=t.pageX;this.initialTouchY=t.pageY};this.handleTouchMove=e=>{e.preventDefault()};this.handleTouchEnd=e=>{const t=e.changedTouches[0];const a=t.pageX-this.initialTouchX;const i=t.pageY-this.initialTouchY;const s=70;const o=Math.abs(a)>=s&&Math.abs(i)<=s;if(o){this.addMonths(a<0?1:-1)}this.initialTouchY=null;this.initialTouchX=null};this.handleNextMonthClick=e=>{e.preventDefault();this.addMonths(1)};this.handlePreviousMonthClick=e=>{e.preventDefault();this.addMonths(-1)};this.handleKeyboardNavigation=e=>{if(e.key==="Tab"&&!e.shiftKey&&this.isModal){e.preventDefault();let t=this.firstFocusEle||this.firstFocusableElement;t.focus();return}var t=true;switch(e.key){case"ArrowRight":this.addDays(1);break;case"ArrowLeft":this.addDays(-1);break;case"ArrowDown":this.addDays(7);break;case"ArrowUp":this.addDays(-7);break;case"PageUp":if(e.shiftKey){this.addYears(-1)}else{this.addMonths(-1)}break;case"PageDown":if(e.shiftKey){this.addYears(1)}else{this.addMonths(1)}break;case"Home":this.startOfWeek();break;case"End":this.endOfWeek();break;default:t=false}if(t){e.preventDefault();this.enableActiveFocus()}};this.handleDaySelect=(e,t)=>{const a=!this.isDateDisabled(t);const i=d(t,r(this.min),r(this.max));if(!i||!a){return}if(t.getMonth()===this.focusedDay.getMonth()){this.setValue(t)}else{this.setFocusedDay(t)}};this.handleMonthSelect=e=>{this.setMonth(parseInt(e.target.value,10))};this.handleYearSelect=e=>{this.setYear(parseInt(e.target.value,10))};this.processFocusedDayNode=e=>{this.focusedDayNode=e;if(this.activeFocus){setTimeout((()=>e.focus()),0)}}}async setFocus(e=false,t=false){this.setFocusedDay(r(this.selectedDate)||new Date);if(e){setTimeout((e=>this.focusedDayNode.focus()),20);return}clearTimeout(this.focusTimeoutId);this.focusTimeoutId=setTimeout((()=>{if(t)g.force(this.monthSelectNode);this.monthSelectNode.focus()}),20)}handleSelectedDateChange(){this.setFocus(true)}addDays(e){this.setFocusedDay(l(this.focusedDay,e))}addMonths(e){this.setMonth(this.focusedDay.getMonth()+e)}addYears(e){this.setYear(this.focusedDay.getFullYear()+e)}startOfWeek(){this.setFocusedDay(c(this.focusedDay,this.firstDayOfWeek))}endOfWeek(){this.setFocusedDay(h(this.focusedDay,this.firstDayOfWeek))}setMonth(e){const t=u(b(this.focusedDay),e);const a=f(t);const i=u(this.focusedDay,e);this.setFocusedDay(p(i,t,a))}setYear(e){const t=_(b(this.focusedDay),e);const a=f(t);const i=_(this.focusedDay,e);this.setFocusedDay(p(i,t,a))}setFocusedDay(e){this.focusedDay=p(e,r(this.min),r(this.max))}setValue(e){this.selectedDate=v(e);this.nanoDatePicked.emit({value:this.selectedDate,valueAsDate:e})}connectedCallback(){if(this.yearSelectNode)g.observe(this.yearSelectNode);if(this.monthSelectNode)g.observe(this.monthSelectNode)}componentWillLoad(){this.handleSelectedDateChange()}componentDidLoad(){this.connectedCallback()}disconnectedCallback(){g.unobserve(this.yearSelectNode);g.unobserve(this.monthSelectNode)}render(){const t=r(this.selectedDate);const a=(t||this.focusedDay).getFullYear();const s=this.focusedDay.getMonth();const o=this.focusedDay.getFullYear();const n=r(this.min);const l=r(this.max);const c=n!=null&&n.getMonth()===s&&n.getFullYear()===o;const h=l!=null&&l.getMonth()===s&&l.getFullYear()===o;let u=a-10;let p=a+10;if(n)u=n.getFullYear();if(l)p=l.getFullYear();return e(i,{class:Object.assign({},x(this.color))},e("div",{class:"duet-date"},e("div",{class:{"duet-date__dialog":true,"is-active":true},onTouchMove:this.handleTouchMove,onTouchStart:this.handleTouchStart,onTouchEnd:this.handleTouchEnd},e("div",{class:"duet-date__dialog-content"},e("div",{class:"duet-date__vhidden duet-date__instructions","aria-live":"polite"},this.localization.keyboardInstruction),e("div",{class:"duet-date__header",onFocusin:this.disableActiveFocus},e("div",null,e("h2",{id:this.dialogLabelId,class:"duet-date__vhidden","aria-live":"polite"},this.localization.monthNames[s]," ",this.focusedDay.getFullYear()),e("label",{htmlFor:this.monthSelectId,class:"duet-date__vhidden"},this.localization.monthSelectLabel),e("div",{class:"duet-date__select"},e("select",{id:this.monthSelectId,class:"duet-date__select--month",ref:e=>this.firstFocusableElement=this.monthSelectNode=e,onChange:this.handleMonthSelect},this.localization.monthNames.map(((t,a)=>e("option",{key:t,value:a,selected:a===s,disabled:!d(new Date(o,a,1),n?b(n):null,l?f(l):null)},t)))),e("div",{class:"duet-date__select-label","aria-hidden":"true"},e("span",null,this.localization.monthNamesShort[s]),e("nano-icon",{name:"light/chevron-down"}))),e("label",{htmlFor:this.yearSelectId,class:"duet-date__vhidden"},this.localization.yearSelectLabel),e("div",{class:"duet-date__select"},e("select",{id:this.yearSelectId,class:"duet-date__select--year",onChange:this.handleYearSelect,ref:e=>this.yearSelectNode=e},O(u,p).map((t=>e("option",{key:t,selected:t===o},t)))),e("div",{class:"duet-date__select-label","aria-hidden":"true"},e("span",null,this.focusedDay.getFullYear()),e("nano-icon",{name:"light/chevron-down"})))),e("div",{class:"duet-date__nav"},e("button",{class:"duet-date__prev",onClick:this.handlePreviousMonthClick,disabled:c,type:"button"},e("nano-icon",{name:"light/chevron-left"}),e("span",{class:"duet-date__vhidden"},this.localization.prevMonthLabel)),e("button",{class:"duet-date__next",onClick:this.handleNextMonthClick,disabled:h,type:"button"},e("nano-icon",{name:"light/chevron-right"}),e("span",{class:"duet-date__vhidden"},this.localization.nextMonthLabel)))),e("div",null,e(A,{selectedDate:t,focusedDate:this.focusedDay,onDateSelect:this.handleDaySelect,onKeyboardNavigation:this.handleKeyboardNavigation,labelledById:this.dialogLabelId,localization:this.localization,firstDayOfWeek:this.firstDayOfWeek,focusedDayRef:this.processFocusedDayNode,min:n,max:l,isDateDisabled:this.isDateDisabled}))))))}get host(){return s(this)}static get watchers(){return{selectedDate:["handleSelectedDateChange"]}}};R.style=I;export{R as nano_date_picker};
+//# sourceMappingURL=p-222d8095.entry.js.map

package/dist/nano-components/p-241d90eb.system.entry.js

@@ -0,0 +1,5 @@
+var __spreadArray=this&&this.__spreadArray||function(t,e){for(var i=0,n=e.length,r=t.length;i<n;i++,r++)t[r]=e[i];return t};
+/*!
+ * Web Components for Nanopore digital Web Apps
+ */System.register(["./p-f48be9f5.system.js","./p-b430a9b6.system.js","./p-ef053a2f.system.js"],(function(t){"use strict";var e,i,n,r,s,a,o,c;return{setters:[function(t){e=t.r;i=t.c;n=t.i;r=t.h;s=t.e;a=t.g},function(t){o=t.i},function(t){c=t.d}],execute:function(){var l=t("nano_resize_observe",function(){function t(t){var n=this;e(this,t);this.nanoResizeStateChange=i(this,"nanoResizeStateChange",7);this.classNames=[];this.assessChanges=function(){if(!n.currentWidth&&!n.currentHeight)return;var t={h:new Map,w:new Map};var e=false;Object.keys(n.appliedStates).forEach((function(i){var r;if(i==="h")r=n.currentHeight;else r=n.currentWidth;n.appliedStates[i].forEach((function(n,s){if(r>=s&&n.applied===false){n.applied=true;t[i].set(s,n);e=true}else if(r<s&&n.applied===true){n.applied=false;t[i].set(s,n);e=true}}))}));if(e)n.applyChanges(t);else if(!n.classNames.includes("is-ready"))n.classNames=["is-ready"]}}t.prototype.dimensionChanged=function(){this.assessChanges()};t.prototype.statesChanged=function(){var t=this;if(!this.states)return;if(!this.ro)this.attachRO();var e=function(t){var e=t.split(/(\d+)/).filter((function(t){return t.length}));return{bp:parseInt(e[0]),dir:e[1]}};this.appliedStates={h:new Map,w:new Map};this.states.split(",").map((function(i){i=i.trim();if(i.includes(" ")){var n=i.split(" "),r=n[0],s=n.slice(1);var a=e(r),o=a.bp,c=a.dir;t.appliedStates[c].set(o,{states:s,applied:false})}else{var l=e(i),o=l.bp,c=l.dir;t.appliedStates[c].set(o,{applied:false})}}))};t.prototype.applyChanges=function(t){var e=__spreadArray([],this.classNames);Object.keys(t).forEach((function(i){t[i].forEach((function(t){if(!t.states)return;t.states.map((function(i){if(t.applied)e.push(i);else e=e.filter((function(t){return t!==i}))}))}))}));this.classNames=__spreadArray(["is-ready"],e);this.nanoResizeStateChange.emit(this.toSimpleObj(t))};t.prototype.toSimpleObj=function(t){var e={};Object.keys(t).forEach((function(i){t[i].forEach((function(t,n){e[n+i]=t.applied}))}));return e};t.prototype.attachRO=function(){var t=this;this.ro=new o((function(e){for(var i=0,n=e;i<n.length;i++){var r=n[i];t.currentWidth=r.contentRect.width;t.currentHeight=r.contentRect.height}}));this.ro.observe(this.host)};t.prototype.connectedCallback=function(){this.assessChanges=c(this.assessChanges,50)};t.prototype.componentDidLoad=function(){var t=this;if(!this.states)return;if(!this.currentWidth||!this.currentHeight){n((function(){var e=t.host.getBoundingClientRect(),i=e.width,n=e.height;t.currentWidth=i;t.currentHeight=n}))}this.statesChanged()};t.prototype.disconnectedCallback=function(){if(this.ro)this.ro.disconnect()};t.prototype.render=function(){var t;return r(s,{class:(t={},t[this.classNames.join(" ")]=true,t)},r("slot",null))};Object.defineProperty(t.prototype,"host",{get:function(){return a(this)},enumerable:false,configurable:true});Object.defineProperty(t,"watchers",{get:function(){return{currentHeight:["dimensionChanged"],currentWidth:["dimensionChanged"],states:["statesChanged"]}},enumerable:false,configurable:true});return t}());l.style=":host { display: inline-block } div { height: 100%; }";var 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{--base-color-rgb:var(--nano-skeleton-base-rgb, 228, 230, 232);--color:var(--nano-skeleton-color, rgba(var(--base-color-rgb), 1));--tint:var(--nano-skeleton-tint, rgba(var(--base-color-rgb), 0.5));display:block;position:relative;border-radius:0.25rem;height:1em}.skeleton{display:-webkit-box;display:-ms-flexbox;display:flex;width:100%;height:100%;border-radius:inherit}.skeleton__indicator{-webkit-box-flex:1;-ms-flex:1 1 auto;flex:1 1 auto;background:var(--color);border-radius:inherit}.skeleton.animate .skeleton__indicator{background:-webkit-gradient(linear, right top, left top, from(var(--tint)), color-stop(var(--color)), color-stop(var(--color)), to(var(--tint)));background:linear-gradient(270deg, var(--tint), var(--color), var(--color), var(--tint));background-size:400% 100%;-webkit-animation:loader 6s ease-in-out infinite;animation:loader 6s ease-in-out infinite}@-webkit-keyframes loader{0%{background-position:200% 0}to{background-position:-200% 0}}@keyframes loader{0%{background-position:200% 0}to{background-position:-200% 0}}";var u=t("nano_skeleton",function(){function t(t){e(this,t);this.animated=true}t.prototype.render=function(){return r("div",{class:{skeleton:true,animate:this.animated}},r("div",{class:"skeleton__indicator"}))};return t}());u.style=h}}}));
+//# sourceMappingURL=p-241d90eb.system.entry.js.map

package/dist/nano-components/p-241d90eb.system.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["src/components/resize-observe/resize-observe.tsx","src/components/skeleton/skeleton.scss?tag=nano-skeleton&encapsulation=shadow","src/components/skeleton/skeleton.tsx"],"names":["ResizeObserve","exports","class_1","hostRef","_this","this","classNames","assessChanges","currentWidth","currentHeight","changedStates","h","Map","w","hasChanged","Object","keys","appliedStates","forEach","dimType","dim","state","bp","applied","set","applyChanges","includes","prototype","dimensionChanged","statesChanged","states","ro","attachRO","toBpDir","bpDir","bpDirSpl","split","filter","bs","length","parseInt","dir","map","st","trim","_a","key","classes","slice","_b","_c","changes","__spreadArray","push","cl","nanoResizeStateChange","emit","toSimpleObj","stateMaps","retObj","ResizeObserver","entries","_i","entries_1","entry","contentRect","width","height","observe","host","connectedCallback","debounce","componentDidLoad","readTask","getBoundingClientRect","disconnectedCallback","disconnect","render","Host","class","join","skeletonCss","Skeleton","class_2","animated","skeleton","animate"],"mappings":"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","sourcesContent":["import {\n  Component,\n  h,\n  Prop,\n  Element,\n  Host,\n  State,\n  Watch,\n  ComponentInterface,\n  Event,\n  EventEmitter,\n  readTask,\n} from '@stencil/core';\nimport ResizeObserver from 'resize-observer-polyfill';\nimport { debounce } from '../../utils';\nimport type { ResizeStateChangeEventDetail } from '../../interface';\n\ntype ResizeObserverState = { states?: string[]; applied?: boolean };\ninterface StateMaps {\n  h: Map<number, ResizeObserverState>;\n  w: Map<number, ResizeObserverState>;\n}\n\n/**\n * A Resize-Observer utility component.\n * Takes a string list of sizes and optional class-names. Adds class-names and fires `nanoResizeStateChange` events when the component reaches those sizes.\n * @slot - Main slot for any content.\n */\n@Component({\n  tag: 'nano-resize-observe',\n  shadow: true,\n  styles: `:host { display: inline-block } div { height: 100%; }`,\n})\nexport class ResizeObserve implements ComponentInterface {\n  private ro: ResizeObserver;\n  private appliedStates: StateMaps;\n\n  @Element() host: HTMLNanoResizeObserveElement;\n  @State() currentWidth: number;\n  @State() currentHeight: number;\n  @State() classNames: string[] = [];\n\n  /** string list of sizes and optional class-names. Adds class-names and fires nanoResizeStateChange events. Upon hitting breakpoints.\n   * Format: `states=\"800w, 300h class1 class2\"` */\n  @Prop() states: string;\n\n  /** A resize break point is switched on or off */\n  @Event() nanoResizeStateChange!: EventEmitter<ResizeStateChangeEventDetail>;\n\n  @Watch('currentHeight')\n  @Watch('currentWidth')\n  dimensionChanged() {\n    this.assessChanges();\n  }\n\n  @Watch('states')\n  statesChanged() {\n    if (!this.states) return;\n    if (!this.ro) this.attachRO();\n\n    const toBpDir = (bpDir: string) => {\n      const bpDirSpl = bpDir.split(/(\\d+)/).filter((bs) => bs.length);\n      return { bp: parseInt(bpDirSpl[0]), dir: bpDirSpl[1] };\n    };\n    this.appliedStates = { h: new Map(), w: new Map() };\n\n    // parse state string\n    this.states.split(',').map((st) => {\n      st = st.trim();\n      if (st.includes(' ')) {\n        const [key, ...classes] = st.split(' ');\n        const { bp, dir } = toBpDir(key);\n        this.appliedStates[dir as keyof StateMaps].set(bp, {\n          states: classes,\n          applied: false,\n        });\n      } else {\n        const { bp, dir } = toBpDir(st);\n        this.appliedStates[dir as keyof StateMaps].set(bp, { applied: false });\n      }\n    });\n  }\n\n  private assessChanges = () => {\n    if (!this.currentWidth && !this.currentHeight) return;\n    const changedStates: StateMaps = { h: new Map(), w: new Map() };\n    let hasChanged = false;\n\n    Object.keys(this.appliedStates).forEach((dimType) => {\n      let dim: number;\n      if (dimType === 'h') dim = this.currentHeight;\n      else dim = this.currentWidth;\n\n      this.appliedStates[dimType].forEach(\n        (state: ResizeObserverState, bp: number) => {\n          if (dim >= bp && state.applied === false) {\n            state.applied = true;\n            changedStates[dimType].set(bp, state);\n            hasChanged = true;\n          } else if (dim < bp && state.applied === true) {\n            state.applied = false;\n            changedStates[dimType].set(bp, state);\n            hasChanged = true;\n          }\n        }\n      );\n    });\n    if (hasChanged) this.applyChanges(changedStates);\n    else if (!this.classNames.includes('is-ready'))\n      this.classNames = ['is-ready'];\n  };\n\n  private applyChanges(changes: StateMaps) {\n    let classNames = [...this.classNames];\n    Object.keys(changes).forEach((dimType: keyof StateMaps) => {\n      changes[dimType].forEach((state) => {\n        if (!state.states) return;\n        state.states.map((st) => {\n          if (state.applied) classNames.push(st);\n          else classNames = classNames.filter((cl) => cl !== st);\n        });\n      });\n    });\n    this.classNames = ['is-ready', ...classNames];\n    this.nanoResizeStateChange.emit(this.toSimpleObj(changes));\n  }\n\n  private toSimpleObj(stateMaps: StateMaps) {\n    const retObj = {};\n    Object.keys(stateMaps).forEach((dimType: keyof StateMaps) => {\n      stateMaps[dimType].forEach((state: ResizeObserverState, bp: number) => {\n        retObj[bp + dimType] = state.applied;\n      });\n    });\n    return retObj;\n  }\n\n  private attachRO() {\n    this.ro = new ResizeObserver((entries) => {\n      for (const entry of entries) {\n        this.currentWidth = entry.contentRect.width;\n        this.currentHeight = entry.contentRect.height;\n      }\n    });\n    this.ro.observe(this.host);\n  }\n\n  connectedCallback() {\n    this.assessChanges = debounce(this.assessChanges, 50);\n  }\n\n  componentDidLoad() {\n    if (!this.states) return;\n    if (!this.currentWidth || !this.currentHeight) {\n      readTask(() => {\n        const { width, height } = this.host.getBoundingClientRect();\n        this.currentWidth = width;\n        this.currentHeight = height;\n      });\n    }\n    this.statesChanged();\n  }\n\n  disconnectedCallback() {\n    if (this.ro) this.ro.disconnect();\n  }\n\n  render() {\n    return (\n      <Host\n        class={{\n          [this.classNames.join(' ')]: true,\n        }}\n      >\n        <slot />\n      </Host>\n    );\n  }\n}\n","@import '../../global/style/nano-theme/components';\n\n:host {\n  /**\n   * @prop --base-color-rgb: default #{$skeleton-color-rgb};\n   * @prop --color: default var(--nano-skeleton-color, rgba(var(--base-color-rgb), 1));\n   * @prop --tint: default var(--nano-skeleton-tint, rgba(var(--base-color-rgb), .3));\n   */\n\n  --base-color-rgb: #{$skeleton-color-rgb};\n  --color: var(--nano-skeleton-color, rgba(var(--base-color-rgb), 1));\n  --tint: var(--nano-skeleton-tint, rgba(var(--base-color-rgb), 0.5));\n\n  display: block;\n  position: relative;\n  border-radius: 0.25rem;\n  height: 1em;\n}\n\n.skeleton {\n  display: flex;\n  width: 100%;\n  height: 100%;\n  border-radius: inherit;\n}\n\n.skeleton__indicator {\n  flex: 1 1 auto;\n  background: var(--color);\n  border-radius: inherit;\n}\n\n.skeleton.animate .skeleton__indicator {\n  background:\n    linear-gradient(\n      270deg,\n      var(--tint),\n      var(--color),\n      var(--color),\n      var(--tint)\n    );\n  background-size: 400% 100%;\n  animation: loader 6s ease-in-out infinite;\n}\n\n@keyframes loader {\n  0% {\n    background-position: 200% 0;\n  }\n\n  to {\n    background-position: -200% 0;\n  }\n}\n","import { Component, Prop, h, ComponentInterface } from '@stencil/core';\n\n/**\n * Skeletons are used to show where content will eventually be drawn.\n * Simple containers for scaffolding layouts that mimic what users will see when content has finished loading.\n * Prevents large areas of empty space during asynchronous operations.\n */\n@Component({\n  tag: 'nano-skeleton',\n  styleUrl: 'skeleton.scss',\n  shadow: true,\n})\nexport class Skeleton implements ComponentInterface {\n  /** When `true`, the skeleton will animate. */\n  @Prop() animated = true;\n\n  render() {\n    return (\n      <div\n        class={{\n          skeleton: true,\n          animate: this.animated,\n        }}\n      >\n        <div class=\"skeleton__indicator\" />\n      </div>\n    );\n  }\n}\n"]}

package/dist/nano-components/{p-040b6cda.entry.js → p-2649fc8e.entry.js}

@@ -1,5 +1,5 @@
 /*!
  * Web Components for Nanopore digital Web Apps
  */
-import{r as n,h as a,g as t}from"./p-ab5813a7.js";const e=':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{display:inline-block;--base-color-rgb:var(--nano-spinner-base-rgb, 0, 116, 149);--indicator-color:var(\n      --nano-spinner-indicator-color,\n      rgba(var(--base-color-rgb), 1)\n    );--track-color:var(--nano-track-color, rgba(var(--base-color-rgb), 0.2));--overlay-color:var(--nano-layer-overlay-light, rgba(255, 255, 255, .7))}.spinner{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}:host([overlay]:not([overlay=false])) .spinner{position:absolute;top:0;left:0;right:0;bottom:0}:host([overlay]:not([overlay=false])) .spinner .spinner__loader,:host([overlay]:not([overlay=false])) .spinner .spinner__text{z-index:1}.spinner__overlay{background:var(--overlay-color);position:absolute;top:0;bottom:0;left:0;right:0;z-index:0;-webkit-backdrop-filter:blur(var(--nano-layer-overlay-blur, 3px));backdrop-filter:blur(var(--nano-layer-overlay-blur, 3px))}.spinner__loader{font-size:var(--spinner-scale, 1em)}.spinner__spin{display:block;margin:auto;width:1em;height:1em;border-radius:50%;border:solid 0.1em var(--track-color);border-top-color:var(--indicator-color);border-right-color:var(--indicator-color);border-left-color:var(--indicator-color);-webkit-animation:1s linear infinite spin;animation:1s linear infinite spin}.spinner__dna{font-size:0.2286em;display:-webkit-box;display:-ms-flexbox;display:flex}.spinner__dnatrack{position:relative;padding:0 0.625em;height:4.375em;width:0.625em;overflow:hidden}.spinner__dnatrack::before{content:"";position:absolute;top:1.875em;left:50%;-webkit-transform:translateX(-50%) translateZ(0);transform:translateX(-50%) translateZ(0);width:0.0625em;width:max(.0625em, 1px);height:0.625em;background:var(--track-color);-webkit-animation:flex 1.5s linear infinite;animation:flex 1.5s linear infinite;-webkit-transform-origin:center center;transform-origin:center center}.spinner__dnatrack--2::before{-webkit-animation:flex 1.5s -1.3s linear infinite;animation:flex 1.5s -1.3s linear infinite}.spinner__dnatrack--3::before{-webkit-animation:flex 1.5s -1.1s linear infinite;animation:flex 1.5s -1.1s linear infinite}.spinner__dnatrack--4::before{-webkit-animation:flex 1.5s -0.9s linear infinite;animation:flex 1.5s -0.9s linear infinite}.spinner__dnatrack--5::before{-webkit-animation:flex 1.5s -0.75s linear infinite;animation:flex 1.5s -0.75s linear infinite}.spinner__dnadot{position:absolute;width:0.5em;height:0.5em;border-radius:50% 50%;background:var(--indicator-color);-webkit-animation:rotate 1.5s linear infinite;animation:rotate 1.5s linear infinite;-webkit-transform-origin:center center;transform-origin:center center;left:50%;-webkit-transform:translateX(-50%) translateZ(0) translateY(0);transform:translateX(-50%) translateZ(0) translateY(0)}.spinner__dnadot--2{-webkit-animation:rotate 1.5s -0.75s linear infinite;animation:rotate 1.5s -0.75s linear infinite}.spinner__dnadot--3{-webkit-animation:rotate 1.5s -1.3s linear infinite;animation:rotate 1.5s -1.3s linear infinite}.spinner__dnadot--4{-webkit-animation:rotate 1.5s -0.55s linear infinite;animation:rotate 1.5s -0.55s linear infinite}.spinner__dnadot--5{-webkit-animation:rotate 1.5s -1.1s linear infinite;animation:rotate 1.5s -1.1s linear infinite}.spinner__dnadot--6{-webkit-animation:rotate 1.5s -0.35s linear infinite;animation:rotate 1.5s -0.35s linear infinite}.spinner__dnadot--7{-webkit-animation:rotate 1.5s -0.9s linear infinite;animation:rotate 1.5s -0.9s linear infinite}.spinner__dnadot--8{-webkit-animation:rotate 1.5s -0.15s linear infinite;animation:rotate 1.5s -0.15s linear infinite}.spinner__dnadot--9{-webkit-animation:rotate 1.5s -0.75s linear infinite;animation:rotate 1.5s -0.75s linear infinite}.spinner__dnadot--10{-webkit-animation:rotate 1.5s 0s linear infinite;animation:rotate 1.5s 0s linear infinite}.spinner__text{text-align:center;position:relative;margin-top:0.5em}@-webkit-keyframes spin{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}100%{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}@keyframes spin{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}100%{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}@-webkit-keyframes rotate{0%,100%{-webkit-transform:translateX(-50%) translateY(0) scale(1);transform:translateX(-50%) translateY(0) scale(1)}25%{-webkit-transform:translateX(-50%) translateY(1.875em) scale(2);transform:translateX(-50%) translateY(1.875em) scale(2)}50%{-webkit-transform:translateX(-50%) translateY(3.75em) scale(1);transform:translateX(-50%) translateY(3.75em) scale(1)}75%{-webkit-transform:translateX(-50%) translateY(1.875em) scale(0.3);transform:translateX(-50%) translateY(1.875em) scale(0.3)}}@keyframes rotate{0%,100%{-webkit-transform:translateX(-50%) translateY(0) scale(1);transform:translateX(-50%) translateY(0) scale(1)}25%{-webkit-transform:translateX(-50%) translateY(1.875em) scale(2);transform:translateX(-50%) translateY(1.875em) scale(2)}50%{-webkit-transform:translateX(-50%) translateY(3.75em) scale(1);transform:translateX(-50%) translateY(3.75em) scale(1)}75%{-webkit-transform:translateX(-50%) translateY(1.875em) scale(0.3);transform:translateX(-50%) translateY(1.875em) scale(0.3)}}@-webkit-keyframes flex{0%,100%{-webkit-transform:translateX(-50%) scaleY(5);transform:translateX(-50%) scaleY(5)}25%{-webkit-transform:translateX(-50%) scaleY(1);transform:translateX(-50%) scaleY(1)}50%{-webkit-transform:translateX(-50%) scaleY(5);transform:translateX(-50%) scaleY(5)}75%{-webkit-transform:translateX(-50%) scaleY(1);transform:translateX(-50%) scaleY(1)}}@keyframes flex{0%,100%{-webkit-transform:translateX(-50%) scaleY(5);transform:translateX(-50%) scaleY(5)}25%{-webkit-transform:translateX(-50%) scaleY(1);transform:translateX(-50%) scaleY(1)}50%{-webkit-transform:translateX(-50%) scaleY(5);transform:translateX(-50%) scaleY(5)}75%{-webkit-transform:translateX(-50%) scaleY(1);transform:translateX(-50%) scaleY(1)}}';let r=class{constructor(a){n(this,a);this.hasText=false;this.type="dna";this.overlay=false}componentWillLoad(){this.hasText=!!this.el.childNodes.length}render(){return a("div",{class:"spinner","aria-busy":"true","aria-live":"polite"},a("div",{class:"spinner__loader"},this.type==="dna"&&a("div",{class:"spinner__dna"},a("div",{class:"spinner__dnatrack spinner__dnatrack--1"},a("div",{class:"spinner__dnadot spinner__dnadot--1"}),a("div",{class:"spinner__dnadot spinner__dnadot--2"})),a("div",{class:"spinner__dnatrack spinner__dnatrack--2"},a("div",{class:"spinner__dnadot spinner__dnadot--3"}),a("div",{class:"spinner__dnadot spinner__dnadot--4"})),a("div",{class:"spinner__dnatrack spinner__dnatrack--3"},a("div",{class:"spinner__dnadot spinner__dnadot--5"}),a("div",{class:"spinner__dnadot spinner__dnadot--6"})),a("div",{class:"spinner__dnatrack spinner__dnatrack--4"},a("div",{class:"spinner__dnadot spinner__dnadot--7"}),a("div",{class:"spinner__dnadot spinner__dnadot--8"})),a("div",{class:"spinner__dnatrack spinner__dnatrack--5"},a("div",{class:"spinner__dnadot spinner__dnadot--9"}),a("div",{class:"spinner__dnadot spinner__dnadot--10"}))),this.type==="circle"&&a("span",{class:"spinner__spin"})),this.hasText&&a("div",{class:"spinner__text"},a("slot",null)),this.overlay&&a("div",{class:"spinner__overlay"}))}get el(){return t(this)}};r.style=e;export{r as nano_spinner};
-//# sourceMappingURL=p-040b6cda.entry.js.map
+import{r as n,h as a,g as t}from"./p-b5c33aff.js";const e=':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{display:inline-block;--base-color-rgb:var(--nano-spinner-base-rgb, 0, 116, 149);--indicator-color:var(\n      --nano-spinner-indicator-color,\n      rgba(var(--base-color-rgb), 1)\n    );--track-color:var(--nano-track-color, rgba(var(--base-color-rgb), 0.2));--overlay-color:var(--nano-layer-overlay-light, rgba(255, 255, 255, .7))}.spinner{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}:host([overlay]:not([overlay=false])) .spinner{position:absolute;top:0;left:0;right:0;bottom:0}:host([overlay]:not([overlay=false])) .spinner .spinner__loader,:host([overlay]:not([overlay=false])) .spinner .spinner__text{z-index:1}.spinner__overlay{background:var(--overlay-color);position:absolute;top:0;bottom:0;left:0;right:0;z-index:0;-webkit-backdrop-filter:blur(var(--nano-layer-overlay-blur, 3px));backdrop-filter:blur(var(--nano-layer-overlay-blur, 3px))}.spinner__loader{font-size:var(--spinner-scale, 1em)}.spinner__spin{display:block;margin:auto;width:1em;height:1em;border-radius:50%;border:solid 0.1em var(--track-color);border-top-color:var(--indicator-color);border-right-color:var(--indicator-color);border-left-color:var(--indicator-color);-webkit-animation:1s linear infinite spin;animation:1s linear infinite spin}.spinner__dna{font-size:0.2286em;display:-webkit-box;display:-ms-flexbox;display:flex}.spinner__dnatrack{position:relative;padding:0 0.625em;height:4.375em;width:0.625em;overflow:hidden}.spinner__dnatrack::before{content:"";position:absolute;top:1.875em;left:50%;-webkit-transform:translateX(-50%) translateZ(0);transform:translateX(-50%) translateZ(0);width:0.0625em;width:max(.0625em, 1px);height:0.625em;background:var(--track-color);-webkit-animation:flex 1.5s linear infinite;animation:flex 1.5s linear infinite;-webkit-transform-origin:center center;transform-origin:center center}.spinner__dnatrack--2::before{-webkit-animation:flex 1.5s -1.3s linear infinite;animation:flex 1.5s -1.3s linear infinite}.spinner__dnatrack--3::before{-webkit-animation:flex 1.5s -1.1s linear infinite;animation:flex 1.5s -1.1s linear infinite}.spinner__dnatrack--4::before{-webkit-animation:flex 1.5s -0.9s linear infinite;animation:flex 1.5s -0.9s linear infinite}.spinner__dnatrack--5::before{-webkit-animation:flex 1.5s -0.75s linear infinite;animation:flex 1.5s -0.75s linear infinite}.spinner__dnadot{position:absolute;width:0.5em;height:0.5em;border-radius:50% 50%;background:var(--indicator-color);-webkit-animation:rotate 1.5s linear infinite;animation:rotate 1.5s linear infinite;-webkit-transform-origin:center center;transform-origin:center center;left:50%;-webkit-transform:translateX(-50%) translateZ(0) translateY(0);transform:translateX(-50%) translateZ(0) translateY(0)}.spinner__dnadot--2{-webkit-animation:rotate 1.5s -0.75s linear infinite;animation:rotate 1.5s -0.75s linear infinite}.spinner__dnadot--3{-webkit-animation:rotate 1.5s -1.3s linear infinite;animation:rotate 1.5s -1.3s linear infinite}.spinner__dnadot--4{-webkit-animation:rotate 1.5s -0.55s linear infinite;animation:rotate 1.5s -0.55s linear infinite}.spinner__dnadot--5{-webkit-animation:rotate 1.5s -1.1s linear infinite;animation:rotate 1.5s -1.1s linear infinite}.spinner__dnadot--6{-webkit-animation:rotate 1.5s -0.35s linear infinite;animation:rotate 1.5s -0.35s linear infinite}.spinner__dnadot--7{-webkit-animation:rotate 1.5s -0.9s linear infinite;animation:rotate 1.5s -0.9s linear infinite}.spinner__dnadot--8{-webkit-animation:rotate 1.5s -0.15s linear infinite;animation:rotate 1.5s -0.15s linear infinite}.spinner__dnadot--9{-webkit-animation:rotate 1.5s -0.75s linear infinite;animation:rotate 1.5s -0.75s linear infinite}.spinner__dnadot--10{-webkit-animation:rotate 1.5s 0s linear infinite;animation:rotate 1.5s 0s linear infinite}.spinner__text{text-align:center;position:relative;margin-top:0.5em}@-webkit-keyframes spin{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}100%{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}@keyframes spin{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}100%{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}@-webkit-keyframes rotate{0%,100%{-webkit-transform:translateX(-50%) translateY(0) scale(1);transform:translateX(-50%) translateY(0) scale(1)}25%{-webkit-transform:translateX(-50%) translateY(1.875em) scale(2);transform:translateX(-50%) translateY(1.875em) scale(2)}50%{-webkit-transform:translateX(-50%) translateY(3.75em) scale(1);transform:translateX(-50%) translateY(3.75em) scale(1)}75%{-webkit-transform:translateX(-50%) translateY(1.875em) scale(0.3);transform:translateX(-50%) translateY(1.875em) scale(0.3)}}@keyframes rotate{0%,100%{-webkit-transform:translateX(-50%) translateY(0) scale(1);transform:translateX(-50%) translateY(0) scale(1)}25%{-webkit-transform:translateX(-50%) translateY(1.875em) scale(2);transform:translateX(-50%) translateY(1.875em) scale(2)}50%{-webkit-transform:translateX(-50%) translateY(3.75em) scale(1);transform:translateX(-50%) translateY(3.75em) scale(1)}75%{-webkit-transform:translateX(-50%) translateY(1.875em) scale(0.3);transform:translateX(-50%) translateY(1.875em) scale(0.3)}}@-webkit-keyframes flex{0%,100%{-webkit-transform:translateX(-50%) scaleY(5);transform:translateX(-50%) scaleY(5)}25%{-webkit-transform:translateX(-50%) scaleY(1);transform:translateX(-50%) scaleY(1)}50%{-webkit-transform:translateX(-50%) scaleY(5);transform:translateX(-50%) scaleY(5)}75%{-webkit-transform:translateX(-50%) scaleY(1);transform:translateX(-50%) scaleY(1)}}@keyframes flex{0%,100%{-webkit-transform:translateX(-50%) scaleY(5);transform:translateX(-50%) scaleY(5)}25%{-webkit-transform:translateX(-50%) scaleY(1);transform:translateX(-50%) scaleY(1)}50%{-webkit-transform:translateX(-50%) scaleY(5);transform:translateX(-50%) scaleY(5)}75%{-webkit-transform:translateX(-50%) scaleY(1);transform:translateX(-50%) scaleY(1)}}';let r=class{constructor(a){n(this,a);this.hasText=false;this.type="dna";this.overlay=false}componentWillLoad(){this.hasText=!!this.el.childNodes.length}render(){return a("div",{class:"spinner","aria-busy":"true","aria-live":"polite"},a("div",{class:"spinner__loader"},this.type==="dna"&&a("div",{class:"spinner__dna"},a("div",{class:"spinner__dnatrack spinner__dnatrack--1"},a("div",{class:"spinner__dnadot spinner__dnadot--1"}),a("div",{class:"spinner__dnadot spinner__dnadot--2"})),a("div",{class:"spinner__dnatrack spinner__dnatrack--2"},a("div",{class:"spinner__dnadot spinner__dnadot--3"}),a("div",{class:"spinner__dnadot spinner__dnadot--4"})),a("div",{class:"spinner__dnatrack spinner__dnatrack--3"},a("div",{class:"spinner__dnadot spinner__dnadot--5"}),a("div",{class:"spinner__dnadot spinner__dnadot--6"})),a("div",{class:"spinner__dnatrack spinner__dnatrack--4"},a("div",{class:"spinner__dnadot spinner__dnadot--7"}),a("div",{class:"spinner__dnadot spinner__dnadot--8"})),a("div",{class:"spinner__dnatrack spinner__dnatrack--5"},a("div",{class:"spinner__dnadot spinner__dnadot--9"}),a("div",{class:"spinner__dnadot spinner__dnadot--10"}))),this.type==="circle"&&a("span",{class:"spinner__spin"})),this.hasText&&a("div",{class:"spinner__text"},a("slot",null)),this.overlay&&a("div",{class:"spinner__overlay"}))}get el(){return t(this)}};r.style=e;export{r as nano_spinner};
+//# sourceMappingURL=p-2649fc8e.entry.js.map

package/dist/nano-components/{p-3456db01.entry.js → p-27efac97.entry.js}

@@ -1,5 +1,5 @@
 /*!
  * Web Components for Nanopore digital Web Apps
  */
-import{r as t,c as i,h as e,e as a,g as s}from"./p-ab5813a7.js";import{M as n}from"./p-cb79d1ec.js";import{r as o}from"./p-289aa03f.js";import{l as r,u as l}from"./p-1805d59a.js";import{c}from"./p-d99437a6.js";import"./p-9a385481.js";import"./p-b619500f.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));--border-color:var(--nano-layer-border-color, rgba(0, 0, 0, 0.1));--border-width:var(--nano-layer-border-width, 1px);--background:var(--nano-layer-bg, #fff);--tint-color:var(--nano-color-base, var(--nano-color-primary, #007495));--icon-size:2rem;--scrim-color:var(--nano-layer-overlay-dark, rgba(74, 74, 74, .5));--close-button-color:#b5aea7;display:block}:host(.nano-color){--tint-color:var(--nano-color-base, var(--nano-color-primary, #007495))}.alert{position:relative;background-color:var(--background);border:solid var(--border-width) var(--border-color);border-top-width:4px;border-top-color:var(--tint-color);border-radius:var(--border-radius);opacity:0;-webkit-transform:scale(0.9);transform:scale(0.9);-webkit-transition:var(--nano-transition-medium, 0.5s) opacity ease, var(--nano-transition-fast, 0.3s) transform ease;transition:var(--nano-transition-medium, 0.5s) opacity ease, var(--nano-transition-fast, 0.3s) transform ease}.alert:focus{outline:none}.alert:not(.alert--showing){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}.alert--open{opacity:1;-webkit-transform:none;transform:none}.alert--toasty,.alert--modal{-webkit-box-shadow:var(--nano-layer-shadow-large, 0 2px 8px rgba(0, 0, 0, 0.2));box-shadow:var(--nano-layer-shadow-large, 0 2px 8px rgba(0, 0, 0, 0.2));margin:var(--nano-spacing-medium, 16px)}.alert__content{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:stretch;-ms-flex-align:stretch;align-items:stretch}.alert__modal-wrap{position:fixed;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;top:0;right:0;bottom:0;left:0;z-index:var(--nano-layer-index-alert, 800)}.alert__message{-webkit-box-flex:1;-ms-flex:1 1 auto;flex:1 1 auto;padding:var(--nano-spacing-medium, 16px);overflow:hidden;line-height:1.6}.alert__close{-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:1.1em;padding-left:0;padding-right:var(--nano-spacing-medium, 16px);padding-top:0;padding-bottom:0;--color:var(--close-button-color)}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){.alert__close{padding-left:unset;padding-right:unset;-webkit-padding-start:0;padding-inline-start:0;-webkit-padding-end:var(--nano-spacing-medium, 16px);padding-inline-end:var(--nano-spacing-medium, 16px)}}.alert__footer{padding:0 var(--nano-spacing-small, 8px) 0;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;-ms-flex-pack:distribute;justify-content:space-around;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.alert__footer ::slotted(*),.alert__footer::slotted(*){-webkit-box-flex:1;-ms-flex:1;flex:1;margin:0 var(--nano-spacing-small, 8px) var(--nano-spacing-medium, 16px) !important}.alert__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;z-index:var(--nano-layer-index-alert, 800);-webkit-backdrop-filter:blur(var(--nano-layer-overlay-blur, 3px));backdrop-filter:blur(var(--nano-layer-overlay-blur, 3px))}.alert__overlay--open{opacity:1}.alert__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(--icon-size)}.alert__icon::slotted(*){color:var(--tint-color);margin-left:var(--nano-spacing-medium, 16px)}.alert__icon ::slotted(*){color:var(--tint-color);margin-left:var(--nano-spacing-medium, 16px);margin-right:0;margin-top:0;margin-bottom:0}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){.alert__icon ::slotted(*){margin-left:unset;margin-right:unset;-webkit-margin-start:var(--nano-spacing-medium, 16px);margin-inline-start:var(--nano-spacing-medium, 16px);-webkit-margin-end:0;margin-inline-end:0}}";const d=Object.assign(document.createElement("div"),{className:"nano-toast-stack nano-toast-stack--tr"});const b=Object.assign(document.createElement("div"),{className:"nano-toast-stack nano-toast-stack--tl"});const m=Object.assign(document.createElement("div"),{className:"nano-toast-stack nano-toast-stack--bl"});const p=Object.assign(document.createElement("div"),{className:"nano-toast-stack nano-toast-stack--br"});let f=class{constructor(a){t(this,a);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.addedTransEnd=false;this.goingToHide=false;this.goingToShow=false;this.isModal=false;this.isToast=false;this.isShowing=false;this.open=false;this.closable=false;this.duration=Infinity;this.handleMouseMove=()=>{this.restartAutoHide()};this.handleCloseClick=()=>{this.hide()};this.handleTransitionEnd=t=>{if(t.propertyName==="opacity"&&(t.target===this.panel||t.target===this.overlay)){this.host.hidden=!this.open;this.isShowing=this.open;this.open?this.nanoAfterShow.emit():this.nanoAfterHide.emit()}};this.handleButtonClick=t=>{if(t.defaultPrevented)return;if(t.target.tagName&&t.target.tagName.toLowerCase()==="button")this.hide()};this.restartAutoHide=()=>{clearTimeout(this.autoHideTimeout);if(this.open&&this.duration<Infinity){this.autoHideTimeout=setTimeout((()=>this.hide()),this.duration)}};this.Panel=()=>e("div",{ref:t=>this.panel=t,part:"panel",class:{alert:true,"alert--open":this.open,"alert--toasty":this.isToast,"alert--modal":!!this.isModal,"alert--showing":this.isShowing},role:!!this.isModal?"alertdialog":"alert","aria-live":"assertive","aria-atomic":"true","aria-hidden":this.open?"false":"true","aria-modal":!!this.isModal?"true":undefined,"aria-label":this.label?this.label:undefined,onMouseMove:this.handleMouseMove,tabIndex:!!this.isModal?0:undefined},e("div",{class:"alert__content"},e("div",{part:"icon",class:"alert__icon"},e("slot",{name:"icon"})),e("div",{part:"message",class:"alert__message"},e("slot",null)),this.closable&&e("div",{class:"alert__close"},e("nano-icon-button",{class:"alert__close",iconName:"light/times",label:"close menu",onClick:this.handleCloseClick}))),e("div",{class:"alert__footer"},e("slot",{name:"footer"})))}handleOpenChange(){this.open?this.show():this.hide()}handleDurationChange(){this.restartAutoHide()}async show(){if(this.goingToShow){return}const t=this.nanoShow.emit();if(t.defaultPrevented){this.open=false;return false}this.host.hidden=false;this.goingToShow=true;this.open=true;o((()=>{this.isShowing=true;this.goingToShow=false}));if(this.duration<Infinity){clearTimeout(this.autoHideTimeout);this.autoHideTimeout=setTimeout((()=>this.hide()),this.duration)}}async hide(){if(this.goingToHide){return}const t=this.nanoHide.emit();if(t.defaultPrevented){this.open=true;return false}this.goingToHide=true;this.open=false;o((()=>this.goingToHide=false));clearTimeout(this.autoHideTimeout)}async toast(t="tr"){this.isToast=true;return new Promise((i=>{let e;switch(t){case"tl":e=b;break;case"bl":e=m;break;case"br":e=p;break;default:e=d;break}if(!e.parentElement){document.body.appendChild(e)}e.appendChild(this.host);this.connectedCallback();this.show();const a=()=>{this.host.remove();this.isToast=false;i();if(!e.querySelector("nano-alert")){e.remove()}};this.host.addEventListener("nanoAfterHide",a,{once:true});this.host.addEventListener("nanoafterhide",a,{once:true})}))}async alert(t){this.isModal=true;this.label=t;return new Promise((t=>{if(!document.body.contains(this.host)){document.body.appendChild(this.host)}this.modal.activate();r(this.host);this.originalTrigger=document.activeElement;o((()=>{this.show()}));const i=()=>o((()=>this.panel.focus({preventScroll:true})));const e=()=>{this.modal.deactivate();this.host.remove();this.label=undefined;this.isModal=false;t();if(this.originalTrigger&&typeof this.originalTrigger.focus==="function"){setTimeout((()=>this.originalTrigger.focus()))}};this.host.addEventListener("nanoAfterShow",i,{once:true});this.host.addEventListener("nanoaftershow",i,{once:true});this.host.addEventListener("nanoAfterHide",e,{once:true});this.host.addEventListener("nanoafterhide",e,{once:true})}))}connectedCallback(){this.modal=new n(this.host);this.host.addEventListener("click",this.handleButtonClick);if(this.panel){this.addedTransEnd=true;this.panel.addEventListener("transitionend",this.handleTransitionEnd)}}disconnectedCallback(){l(this.host);this.host.removeEventListener("click",this.handleButtonClick);this.addedTransEnd=false;this.panel.removeEventListener("transitionend",this.handleTransitionEnd)}componentDidLoad(){if(this.open){this.show()}if(!this.addedTransEnd){this.panel.addEventListener("transitionend",this.handleTransitionEnd)}}render(){return e(a,{class:Object.assign({},c(this.color)),showing:this.isShowing},this.isModal&&[e("div",{part:"overlay",class:{alert__overlay:true,"alert__overlay--open":this.open},ref:t=>this.overlay=t}),e("div",{class:"alert__modal-wrap"},e(this.Panel,null))],!this.isModal&&e(this.Panel,null))}get host(){return s(this)}static get watchers(){return{open:["handleOpenChange"],duration:["handleDurationChange"]}}};f.style=h;export{f as nano_alert};
-//# sourceMappingURL=p-3456db01.entry.js.map
+import{r as t,c as i,h as e,e as a,g as s}from"./p-b5c33aff.js";import{M as n}from"./p-cb79d1ec.js";import{r as o}from"./p-289aa03f.js";import{l as r,u as l}from"./p-1805d59a.js";import{c}from"./p-d99437a6.js";import"./p-9a385481.js";import"./p-b619500f.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));--border-color:var(--nano-layer-border-color, rgba(0, 0, 0, 0.1));--border-width:var(--nano-layer-border-width, 1px);--background:var(--nano-layer-bg, #fff);--tint-color:var(--nano-color-base, var(--nano-color-primary, #007495));--icon-size:2rem;--scrim-color:var(--nano-layer-overlay-dark, rgba(74, 74, 74, .5));--close-button-color:#b5aea7;display:block}:host(.nano-color){--tint-color:var(--nano-color-base, var(--nano-color-primary, #007495))}.alert{position:relative;background-color:var(--background);border:solid var(--border-width) var(--border-color);border-top-width:4px;border-top-color:var(--tint-color);border-radius:var(--border-radius);opacity:0;-webkit-transform:scale(0.9);transform:scale(0.9);-webkit-transition:var(--nano-transition-medium, 0.5s) opacity ease, var(--nano-transition-fast, 0.3s) transform ease;transition:var(--nano-transition-medium, 0.5s) opacity ease, var(--nano-transition-fast, 0.3s) transform ease}.alert:focus{outline:none}.alert:not(.alert--showing){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}.alert--open{opacity:1;-webkit-transform:none;transform:none}.alert--toasty,.alert--modal{-webkit-box-shadow:var(--nano-layer-shadow-large, 0 2px 8px rgba(0, 0, 0, 0.2));box-shadow:var(--nano-layer-shadow-large, 0 2px 8px rgba(0, 0, 0, 0.2));margin:var(--nano-spacing-medium, 16px)}.alert__content{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:stretch;-ms-flex-align:stretch;align-items:stretch}.alert__modal-wrap{position:fixed;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;top:0;right:0;bottom:0;left:0;z-index:var(--nano-layer-index-alert, 800)}.alert__message{-webkit-box-flex:1;-ms-flex:1 1 auto;flex:1 1 auto;padding:var(--nano-spacing-medium, 16px);overflow:hidden;line-height:1.6}.alert__close{-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:1.1em;padding-left:0;padding-right:var(--nano-spacing-medium, 16px);padding-top:0;padding-bottom:0;--color:var(--close-button-color)}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){.alert__close{padding-left:unset;padding-right:unset;-webkit-padding-start:0;padding-inline-start:0;-webkit-padding-end:var(--nano-spacing-medium, 16px);padding-inline-end:var(--nano-spacing-medium, 16px)}}.alert__footer{padding:0 var(--nano-spacing-small, 8px) 0;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;-ms-flex-pack:distribute;justify-content:space-around;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.alert__footer ::slotted(*),.alert__footer::slotted(*){-webkit-box-flex:1;-ms-flex:1;flex:1;margin:0 var(--nano-spacing-small, 8px) var(--nano-spacing-medium, 16px) !important}.alert__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;z-index:var(--nano-layer-index-alert, 800);-webkit-backdrop-filter:blur(var(--nano-layer-overlay-blur, 3px));backdrop-filter:blur(var(--nano-layer-overlay-blur, 3px))}.alert__overlay--open{opacity:1}.alert__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(--icon-size)}.alert__icon::slotted(*){color:var(--tint-color);margin-left:var(--nano-spacing-medium, 16px)}.alert__icon ::slotted(*){color:var(--tint-color);margin-left:var(--nano-spacing-medium, 16px);margin-right:0;margin-top:0;margin-bottom:0}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){.alert__icon ::slotted(*){margin-left:unset;margin-right:unset;-webkit-margin-start:var(--nano-spacing-medium, 16px);margin-inline-start:var(--nano-spacing-medium, 16px);-webkit-margin-end:0;margin-inline-end:0}}";const d=Object.assign(document.createElement("div"),{className:"nano-toast-stack nano-toast-stack--tr"});const b=Object.assign(document.createElement("div"),{className:"nano-toast-stack nano-toast-stack--tl"});const m=Object.assign(document.createElement("div"),{className:"nano-toast-stack nano-toast-stack--bl"});const p=Object.assign(document.createElement("div"),{className:"nano-toast-stack nano-toast-stack--br"});let f=class{constructor(a){t(this,a);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.addedTransEnd=false;this.goingToHide=false;this.goingToShow=false;this.isModal=false;this.isToast=false;this.isShowing=false;this.open=false;this.closable=false;this.duration=Infinity;this.handleMouseMove=()=>{this.restartAutoHide()};this.handleCloseClick=()=>{this.hide()};this.handleTransitionEnd=t=>{if(t.propertyName==="opacity"&&(t.target===this.panel||t.target===this.overlay)){this.host.hidden=!this.open;this.isShowing=this.open;this.open?this.nanoAfterShow.emit():this.nanoAfterHide.emit()}};this.handleButtonClick=t=>{if(t.defaultPrevented)return;if(t.target.tagName&&t.target.tagName.toLowerCase()==="button")this.hide()};this.restartAutoHide=()=>{clearTimeout(this.autoHideTimeout);if(this.open&&this.duration<Infinity){this.autoHideTimeout=setTimeout((()=>this.hide()),this.duration)}};this.Panel=()=>e("div",{ref:t=>this.panel=t,part:"panel",class:{alert:true,"alert--open":this.open,"alert--toasty":this.isToast,"alert--modal":!!this.isModal,"alert--showing":this.isShowing},role:!!this.isModal?"alertdialog":"alert","aria-live":"assertive","aria-atomic":"true","aria-hidden":this.open?"false":"true","aria-modal":!!this.isModal?"true":undefined,"aria-label":this.label?this.label:undefined,onMouseMove:this.handleMouseMove,tabIndex:!!this.isModal?0:undefined},e("div",{class:"alert__content"},e("div",{part:"icon",class:"alert__icon"},e("slot",{name:"icon"})),e("div",{part:"message",class:"alert__message"},e("slot",null)),this.closable&&e("div",{class:"alert__close"},e("nano-icon-button",{class:"alert__close",iconName:"light/times",label:"close menu",onClick:this.handleCloseClick}))),e("div",{class:"alert__footer"},e("slot",{name:"footer"})))}handleOpenChange(){this.open?this.show():this.hide()}handleDurationChange(){this.restartAutoHide()}async show(){if(this.goingToShow){return}const t=this.nanoShow.emit();if(t.defaultPrevented){this.open=false;return false}this.host.hidden=false;this.goingToShow=true;this.open=true;o((()=>{this.isShowing=true;this.goingToShow=false}));if(this.duration<Infinity){clearTimeout(this.autoHideTimeout);this.autoHideTimeout=setTimeout((()=>this.hide()),this.duration)}}async hide(){if(this.goingToHide){return}const t=this.nanoHide.emit();if(t.defaultPrevented){this.open=true;return false}this.goingToHide=true;this.open=false;o((()=>this.goingToHide=false));clearTimeout(this.autoHideTimeout)}async toast(t="tr"){this.isToast=true;return new Promise((i=>{let e;switch(t){case"tl":e=b;break;case"bl":e=m;break;case"br":e=p;break;default:e=d;break}if(!e.parentElement){document.body.appendChild(e)}e.appendChild(this.host);this.connectedCallback();this.show();const a=()=>{this.host.remove();this.isToast=false;i();if(!e.querySelector("nano-alert")){e.remove()}};this.host.addEventListener("nanoAfterHide",a,{once:true});this.host.addEventListener("nanoafterhide",a,{once:true})}))}async alert(t){this.isModal=true;this.label=t;return new Promise((t=>{if(!document.body.contains(this.host)){document.body.appendChild(this.host)}this.modal.activate();r(this.host);this.originalTrigger=document.activeElement;o((()=>{this.show()}));const i=()=>o((()=>this.panel.focus({preventScroll:true})));const e=()=>{this.modal.deactivate();this.host.remove();this.label=undefined;this.isModal=false;t();if(this.originalTrigger&&typeof this.originalTrigger.focus==="function"){setTimeout((()=>this.originalTrigger.focus()))}};this.host.addEventListener("nanoAfterShow",i,{once:true});this.host.addEventListener("nanoaftershow",i,{once:true});this.host.addEventListener("nanoAfterHide",e,{once:true});this.host.addEventListener("nanoafterhide",e,{once:true})}))}connectedCallback(){this.modal=new n(this.host);this.host.addEventListener("click",this.handleButtonClick);if(this.panel){this.addedTransEnd=true;this.panel.addEventListener("transitionend",this.handleTransitionEnd)}}disconnectedCallback(){l(this.host);this.host.removeEventListener("click",this.handleButtonClick);this.addedTransEnd=false;this.panel.removeEventListener("transitionend",this.handleTransitionEnd)}componentDidLoad(){if(this.open){this.show()}if(!this.addedTransEnd){this.panel.addEventListener("transitionend",this.handleTransitionEnd)}}render(){return e(a,{class:Object.assign({},c(this.color)),showing:this.isShowing},this.isModal&&[e("div",{part:"overlay",class:{alert__overlay:true,"alert__overlay--open":this.open},ref:t=>this.overlay=t}),e("div",{class:"alert__modal-wrap"},e(this.Panel,null))],!this.isModal&&e(this.Panel,null))}get host(){return s(this)}static get watchers(){return{open:["handleOpenChange"],duration:["handleDurationChange"]}}};f.style=h;export{f as nano_alert};
+//# sourceMappingURL=p-27efac97.entry.js.map