@nanoporetech-digital/components 2.2.0 → 2.2.1

package/dist/nano-components/p-096682d9.system.js

@@ -1,5 +1,5 @@
 /*!
  * Web Components for Nanopore digital Web Apps
  */
-System.register(["./p-59b3d24b.system.js","./p-93880c28.system.js"],(function(e,a){"use strict";var n,o,t,s,i,r,l;return{setters:[function(e){n=e.p;o=e.w;t=e.d;s=e.N;i=e.a;r=e.H;l=e.b},function(){}],execute:function(){var e=function(e){return"__sc_import_"+e.replace(/\s|-/g,"_")};var d=function(){{n.$cssShim$=o.__cssshim}{h(r.prototype)}var e=Array.from(t.querySelectorAll("script")).find((function(e){return new RegExp("/"+s+"(\\.esm)?\\.js($|\\?|#)").test(e.src)||e.getAttribute("data-stencil-namespace")===s}));var l={};if("onbeforeload"in e&&!history.scrollRestoration){return{then:function(){}}}{l.resourcesUrl=new URL(".",new URL(e.getAttribute("data-resources-url")||e.src,o.location.href)).href;{c(l.resourcesUrl,e)}if(!o.customElements){return a.import("./p-5b6c304c.system.js").then((function(){return l}))}}return i(l)};var c=function(a,n){var i=e(s);try{o[i]=new Function("w","return import(w);//"+Math.random())}catch(l){var r=new Map;o[i]=function(e){var s=new URL(e,a).href;var l=r.get(s);if(!l){var d=t.createElement("script");d.type="module";d.crossOrigin=n.crossOrigin;d.src=URL.createObjectURL(new Blob(["import * as m from '"+s+"'; window."+i+".m = m;"],{type:"application/javascript"}));l=new Promise((function(e){d.onload=function(){e(o[i].m);d.remove()}}));r.set(s,l);t.head.appendChild(d)}return l}}};var h=function(e){var a=e.cloneNode;e.cloneNode=function(e){if(this.nodeName==="TEMPLATE"){return a.call(this,e)}var n=a.call(this,false);var o=this.childNodes;if(e){for(var t=0;t<o.length;t++){if(o[t].nodeType!==2){n.appendChild(o[t].cloneNode(true))}}}return n}};d().then((function(e){return l(JSON.parse('[["p-58419bed.system",[[1,"nano-global-nav",{"env":[1],"ssoRedirect":[1,"sso-redirect"],"getMyAccountData":[4,"get-my-account-data"],"activeMyAccountSections":[16],"showSearch":[4,"show-search"],"showLogo":[4,"show-logo"],"logoUrl":[1,"logo-url"],"searchIndeces":[16],"myAccountUser":[1040],"searchAppId":[1025,"search-app-id"],"searchApiKey":[1025,"search-api-key"],"searchValue":[1025,"search-value"],"searchIndex":[1025,"search-index"],"cartCount":[1026,"cart-count"],"msgCount":[1026,"msg-count"],"cartUrl":[1025,"cart-url"],"msgUrl":[1025,"msg-url"],"hasLoggedinSlot":[32],"hasSiteSlot":[32],"hasPromotionSlot":[32],"aboutSlotLen":[32],"iconSlotLen":[32],"mainSlotLen":[32],"overflowSlotLen":[32],"searchSlotLen":[32],"internalSearchIndeces":[32],"thresholdReady":[32],"remoteDataReady":[32],"ready":[32],"isResizing":[32],"intersectRatio":[32],"threshold":[32],"modalOpen":[32],"modalIsOpen":[32],"searchBarShown":[32],"scrollingUp":[32],"searchLoading":[32],"showAutocomplete":[32],"secondaryMenuOpen":[32],"userMenuOpen":[32],"menuFullScreen":[32],"searchValInternal":[32],"submitSearch":[64]},[[0,"nanoOpen","secondaryOpen"],[0,"nanoClose","secondaryClose"]]]]],["p-3ad1d5aa.system",[[1,"nano-hero",{"imgSrc":[1,"img-src"],"imgSrcSet":[1,"img-src-set"],"largeScreenBP":[2,"large-screen-b-p"],"theme":[1],"level":[1],"gridSizes":[32],"hasIconBox":[32],"hasScrim":[32],"hasSecondaryContent":[32],"hasQuote":[32],"hasBg":[32],"hasBackBtn":[32],"hasCtas":[32],"breadCrumbs":[32],"iconBoxItems":[32]}]]],["p-e15be516.system",[[6,"nano-date-input",{"invalid":[2564],"helperText":[4,"helper-text"],"helperTextFormat":[16],"floatLabel":[4,"float-label"],"name":[1],"readonly":[4],"size":[2],"form":[1],"firstDayOfWeek":[2,"first-day-of-week"],"localization":[16],"disabled":[4],"color":[1],"autofocus":[4],"clearInput":[4,"clear-input"],"label":[1],"placeholder":[1025],"value":[1537],"validateOn":[1,"validate-on"],"showInlineError":[516,"show-inline-error"],"dateOrder":[1,"date-order"],"required":[4],"min":[1],"max":[1],"hideLabel":[4,"hide-label"],"picker":[4],"initialPickerDate":[1,"initial-picker-date"],"pickerOpen":[1540,"picker-open"],"closeAfterPicked":[4,"close-after-picked"],"pattern":[32],"inputValue":[32],"_invalid":[32],"reportValidity":[64],"setFocus":[64],"getInputElement":[64],"showError":[64]}]]],["p-531d5275.system",[[1,"nano-dialog",{"showRibbon":[4,"show-ribbon"],"open":[1540],"label":[1],"noHeader":[4,"no-header"],"noFooter":[4,"no-footer"],"noUserDismiss":[4,"no-user-dismiss"],"storeId":[1,"store-id"],"storeMethod":[1,"store-method"],"isVisible":[32],"noDismiss":[32],"hasFooter":[32],"show":[64],"hide":[64]}]]],["p-ef4e0912.system",[[6,"nano-file-upload",{"name":[1],"accept":[1],"capture":[1],"maxFileSize":[2,"max-file-size"],"maxFiles":[2,"max-files"],"label":[1],"placeholder":[1],"hideLabel":[4,"hide-label"],"required":[4],"disabled":[516],"clearInput":[4,"clear-input"],"showInlineError":[516,"show-inline-error"],"validateOn":[1025,"validate-on"],"invalid":[2564],"files":[2064],"value":[6145],"hasHelperSlot":[32],"hasLabelSlot":[32],"errorMessage":[32],"isDragging":[32],"fileList":[32],"hasFocus":[32],"_invalid":[32],"reportValidity":[64],"setFocus":[64],"getInputElement":[64],"showError":[64]},[[8,"click","globalClickHandler"],[8,"keydown","globalKeydownHandler"]]]]],["p-4429caac.system",[[1,"nano-alert",{"open":[1540],"closable":[516],"color":[513],"duration":[2],"isModal":[32],"isToast":[32],"isShowing":[32],"label":[32],"show":[64],"hide":[64],"toast":[64],"alert":[64]}]]],["p-6afdb510.system",[[1,"nano-global-search-results",{"algoliaEle":[32],"currentWidth":[32],"apiKey":[32],"appId":[32],"index":[32]},[[16,"nanoSearchReset","handleGlobalNavReset"],[16,"nanoSearchResult","handleGlobalNavSearch"],[0,"nanoChange","handleReorder"],[0,"nanoResultsShown","attachListeners"],[16,"nanoNewResults","attachResultListeners"]]]]],["p-1238f0fc.system",[[1,"nano-tab",{"panel":[513],"active":[516],"disabled":[516],"closable":[4],"setFocus":[64],"removeFocus":[64]}]]],["p-090f22a9.system",[[1,"nano-menu-drawer",{"open":[4],"saveState":[4,"save-state"],"hideWidth":[2,"hide-width"],"hideHeight":[4,"hide-height"],"reset":[32],"widthOk":[32],"heightOk":[32],"isLoading":[32],"hide":[32]},[[0,"nanoOpen","cancelNavItemEvents"],[0,"nanoClose","cancelNavItemEvents"],[16,"nanoIsReady","handleGlobalNavReady"]]]]],["p-d87ebf95.system",[[1,"nano-split-pane",{"position":[6146],"positionInPixels":[1026,"position-in-pixels"],"vertical":[516],"disabled":[516],"primary":[1],"snap":[1],"snapThreshold":[2,"snap-threshold"],"animationDuration":[2,"animation-duration"],"isDragging":[2564,"is-dragging"]}]]],["p-3f736fa2.system",[[1,"nano-tab-group",{"placement":[1],"noScrollControls":[4,"no-scroll-controls"],"color":[1],"storeId":[1,"store-id"],"storeMethod":[1,"store-method"],"disableSwipe":[4,"disable-swipe"],"hasScrollControls":[32],"hideControlRight":[32],"hideControlLeft":[32],"isLegacy":[32],"tab":[32],"show":[64]},[[0,"nanoTabClose","handleTabClose"]]]]],["p-c9c1a345.system",[[1,"nano-accordion",{"color":[1],"itemOpened":[32]},[[0,"nanoOpened","onToggleHandler"],[0,"nanoClosed","onClosedHandler"]]]]],["p-8278c5d2.system",[[1,"nano-algolia-filter",{"filterName":[1,"filter-name"],"value":[1025],"operator":[1],"storeId":[1,"store-id"],"storeMethod":[1,"store-method"],"changeEvent":[32],"internalValue":[32],"showFilter":[32],"indexResults":[32],"filterChanged":[32],"facets":[32],"tplRenderFn":[32],"globalStoreMethod":[32]},[[0,"nanoChange","handleChangeEvent"],[0,"change","handleChangeEvent"]]]]],["p-a898bf92.system",[[1,"nano-algolia-input",{"appId":[1,"app-id"],"apiKey":[1,"api-key"],"searchIndex":[1040],"searchIndexName":[1,"search-index-name"],"minChars":[2,"min-chars"],"autoEmit":[4,"auto-emit"],"browseIndex":[1028,"browse-index"],"storeId":[1,"store-id"],"storeMethod":[1,"store-method"],"searchStr":[32],"algoliaIndex":[32],"currentResults":[32],"search":[64]},[[0,"nanoChange","searchSubmit"]]]]],["p-62ecd3a1.system",[[1,"nano-algolia-pagination",{"maxToShow":[2,"max-to-show"],"currentPage":[32],"canGoPrev":[32],"canGoNext":[32],"show":[32],"tplRenderFn":[32],"indexResults":[32],"infiniteScroll":[32],"nextPage":[64],"prevPage":[64],"goToPage":[64]}]]],["p-98222c39.system",[[1,"nano-algolia-results",{"infiniteScroll":[4,"infinite-scroll"],"appendPages":[4,"append-pages"],"showResults":[32],"tplRenderFn":[32],"results":[32],"indexResults":[32],"resultsPage":[32],"changeEvent":[32],"facets":[32],"isLoading":[32]}]]],["p-7232c046.system",[[1,"nano-aspect-ratio",{"aspectRatio":[1,"aspect-ratio"],"fit":[1]}]]],["p-93448bcd.system",[[6,"nano-checkbox",{"hasFocus":[1540,"has-focus"],"checked":[1540],"disabled":[516],"value":[1],"name":[1],"required":[4],"type":[513],"label":[1],"indeterminate":[1540],"invalid":[2564],"color":[1],"_invalid":[32],"inputType":[32],"getInputElement":[64],"reportValidity":[64],"setError":[64],"setFocus":[64],"removeFocus":[64]}]]],["p-820d9e23.system",[[6,"nano-checkbox-group",{"validateOn":[1025,"validate-on"],"showInlineError":[4,"show-inline-error"],"min":[2],"max":[2],"disabled":[516],"legend":[1],"invalid":[2564],"checkboxes":[32],"nativeCbs":[32],"errorMessage":[32],"showErrorMsg":[32],"hasHelperSlot":[32],"reportValidity":[64]},[[0,"nanoChange","handleCbChange"]]]]],["p-94593617.system",[[1,"nano-details",{"label":[1],"open":[1540],"noHandle":[4,"no-handle"],"iconRotation":[2,"icon-rotation"],"color":[1],"isLoading":[32]}]]],["p-593de29b.system",[[1,"nano-drawer",{"open":[1540],"label":[1],"placement":[1],"contained":[4],"noHeader":[4,"no-header"],"type":[1],"contentSelector":[1,"content-selector"],"hasFooter":[32],"isVisible":[32],"show":[64],"hide":[64]}]]],["p-5066e563.system",[[6,"nano-range",{"color":[1],"debounce":[2],"name":[1],"dualKnobs":[4,"dual-knobs"],"min":[2],"max":[2],"pin":[4],"snaps":[4],"step":[2],"ticks":[4],"disabled":[4],"value":[1026],"ratioA":[32],"ratioB":[32],"pressedKnob":[32]}]]],["p-8a8f893b.system",[[2,"nano-rating",{"value":[1538],"max":[2],"precision":[2],"readonly":[4],"disabled":[4],"name":[1],"symbolName":[1,"symbol-name"],"symbol":[16],"hoverValue":[32],"isHovering":[32],"setFocus":[64],"removeFocus":[64]}]]],["p-22884654.system",[[1,"nano-slide",{"ready":[1540]}]]],["p-033296c7.system",[[1,"nano-slides",{"options":[1040],"navbtns":[4],"pager":[4],"fullscreenbtn":[4],"fullscreen":[1540],"animation":[513],"currentSlide":[1538,"current-slide"],"autoplay":[8],"ready":[1540],"iCurrentSlide":[32],"slidesReady":[32],"didInit":[32],"update":[64],"updateAutoHeight":[64],"slideTo":[64],"slideNext":[64],"slidePrev":[64],"getActiveIndex":[64],"length":[64],"isEnd":[64],"isBeginning":[64],"startAutoplay":[64],"stopAutoplay":[64],"lockSwipes":[64],"getflickity":[64],"reload":[64]}]]],["p-20387cde.system",[[1,"nano-tab-content",{"name":[513],"active":[516]}]]],["p-3ef30ded.system",[[1,"nano-spinner",{"type":[1],"overlay":[516],"hasText":[32]}]]],["p-92f85aaf.system",[[1,"nano-algolia",{"showResults":[1028,"show-results"],"resultsPage":[1026,"results-page"],"appId":[1025,"app-id"],"apiKey":[1025,"api-key"],"searchIndex":[1040],"searchIndexName":[1025,"search-index-name"],"listenTo":[1,"listen-to"],"query":[1025],"operator":[1],"filters":[16],"tplEngine":[16],"tplRenderFn":[16],"replicaIndex":[1025,"replica-index"],"browseIndex":[1028,"browse-index"],"minChars":[2,"min-chars"],"storeId":[1,"store-id"],"storeMethod":[1,"store-method"],"_dynFacetFilters":[32],"inputField":[32],"algoliaIndex":[32],"indeces":[32],"resultsEmitterEle":[32],"indexResults":[32],"filterChanged":[32],"currentHits":[32],"changeEvent":[32],"isLoading":[32],"wormholeState":[32],"removeFilters":[64]},[[0,"nanoTplUpdated","onAllTplUpdate"],[0,"nanoPageChanged","onPageChange"],[0,"nanoFilterChanged","onFilterChange"],[16,"nanoChange","handleInputChange"],[16,"change","handleInputChange"]]]]],["p-69439aa1.system",[[1,"nano-date-picker",{"selectedDate":[1025,"selected-date"],"min":[1],"max":[1],"firstDayOfWeek":[2,"first-day-of-week"],"localization":[16],"color":[1],"isDateDisabled":[16],"isModal":[4,"is-modal"],"firstFocusEle":[16],"activeFocus":[32],"focusedDay":[32],"setFocus":[64]}]]],["p-ca466250.system",[[1,"nano-tooltip",{"content":[1],"placement":[1],"disabled":[4],"distance":[2],"open":[1540],"skidding":[2],"trigger":[1],"show":[64],"hide":[64]}]]],["p-5653961d.system",[[1,"nano-sticker",{"autoResize":[4,"auto-resize"],"isSticky":[1028,"is-sticky"],"offset":[1026],"position":[1],"quietMode":[1,"quiet-mode"],"hideOnNewStickers":[4,"hide-on-new-stickers"],"breakPointMax":[2,"break-point-max"],"breakPointMin":[2,"break-point-min"],"scrollParent":[1040],"stickTo":[1,"stick-to"],"isStuck":[32],"isRootSticker":[32],"hide":[32],"scrollHide":[32],"multiStickerHide":[32],"scrollingTo":[32],"quietModeIsOn":[32],"stuckCounter":[32],"stickerIndex":[32],"stickToEle":[32],"triggerPos":[32],"trigger":[32],"_offset":[32],"isHiding":[64],"isSticking":[64],"setTriggerPos":[64],"getTriggerPos":[64],"pauseHiding":[64]}]]],["p-f2e7d2f9.system",[[2,"nano-icon-button",{"iconName":[1,"icon-name"],"iconSrc":[1,"icon-src"],"type":[513],"name":[513],"value":[513],"label":[1],"disabled":[516],"href":[1],"target":[1]}]]],["p-173bae15.system",[[1,"nano-resize-observe",{"states":[1],"currentWidth":[32],"currentHeight":[32],"classNames":[32]}],[1,"nano-skeleton",{"animated":[4]}]]],["p-7fcbc27f.system",[[1,"nano-dropdown",{"autoOpen":[4,"auto-open"],"open":[1540],"closeOnSelect":[4,"close-on-select"],"containingElement":[1040],"tetherTo":[16],"placement":[1],"distance":[2],"skidding":[2],"hoist":[4],"dialogTitle":[1,"dialog-title"],"show":[64],"hide":[64]},[[0,"nanoOpen","secondaryOpen"],[0,"nanoClose","secondaryClose"],[0,"nanoSelect","handlePanelSelect"]]]]],["p-f53989c3.system",[[1,"nano-icon",{"color":[1],"ariaLabel":[1537,"aria-label"],"flipRtl":[4,"flip-rtl"],"name":[1],"src":[1],"icon":[8],"size":[1],"lazy":[4],"svgContent":[32],"isVisible":[32],"isLoading":[32]}]]],["p-5a476bba.system",[[1,"nano-datalist",{"selected":[1040],"dropDownConfig":[6160],"options":[16],"input":[1],"type":[1],"activeOptions":[2064],"open":[1028],"disableFilter":[4,"disable-filter"],"disabled":[4],"actvOptEles":[32],"connectedInput":[32],"inputLabel":[32],"hasNoResult":[32],"shouldOpen":[32],"canOpen":[32],"optionIds":[32]}],[1,"nano-option",{"value":[1537],"label":[1537],"selected":[516],"disabled":[516],"filterMeta":[1,"filter-meta"],"hasFocus":[32]},[[0,"keydown","handleKeyDown"]]],[1,"nano-menu",{"hasFocus":[2052,"has-focus"],"type":[1],"label":[1],"setFocus":[64],"removeFocus":[64],"showActiveElement":[64],"resetActiveItem":[64]},[[17,"mousedown","handleBlur"],[0,"keydown","handleBlur"]]]]],["p-b19e0775.system",[[6,"nano-select",{"invalid":[2564],"color":[1],"autofocus":[4],"disabled":[516],"validateOn":[1025,"validate-on"],"showInlineError":[516,"show-inline-error"],"label":[1],"hideLabel":[4,"hide-label"],"floatLabel":[4,"float-label"],"multiple":[4],"name":[1],"placeholder":[1],"readonly":[516],"required":[4],"size":[2],"max":[2],"min":[2],"form":[1],"allowCustomValues":[4,"allow-custom-values"],"value":[6145],"options":[6160],"clearSelect":[4,"clear-select"],"mask":[4],"debounce":[2],"dropDownConfig":[1040],"currInsertIndex":[32],"showErrorMsg":[32],"errorMessage":[32],"hasFocus":[32],"hasLabelSlot":[32],"hasHelperSlot":[32],"inputSearchVal":[32],"_eOptions":[32],"reportValidity":[64],"setFocus":[64],"getSelectElement":[64],"showError":[64]},[[17,"mousedown","handleBlur"],[0,"keydown","handleBlur"]]],[1,"nano-nav-item",{"href":[1025],"target":[1],"disabled":[4],"open":[1540],"selected":[516],"secondaryActiveWidth":[2,"secondary-active-width"],"secondaryFallback":[16],"closeOnBlur":[4,"close-on-blur"],"didOpen":[32],"isInGlobalNav":[32],"isInMenuDrawer":[32],"isInMenu":[32],"isLegacy":[32],"hasFocus":[32],"setFocus":[64]}]]],["p-3a13948a.system",[[6,"nano-input",{"invalid":[2564],"color":[1],"accept":[1],"autocapitalise":[1],"autocomplete":[1],"autocorrect":[1],"autofocus":[4],"clearInput":[4,"clear-input"],"clearOnEdit":[4,"clear-on-edit"],"debounce":[2],"disabled":[516],"inputmode":[1],"validateOn":[1025,"validate-on"],"showInlineError":[516,"show-inline-error"],"label":[1],"hideLabel":[4,"hide-label"],"floatLabel":[4,"float-label"],"max":[1],"maxlength":[2],"min":[1],"minlength":[2],"multiple":[4],"name":[1],"pattern":[1],"placeholder":[1],"readonly":[516],"required":[4],"spellcheck":[4],"step":[1],"size":[2],"type":[1],"form":[1],"value":[1025],"resize":[1],"rows":[2],"showCharCount":[4,"show-char-count"],"hasFocus":[32],"hasLabelSlot":[32],"hasHelperSlot":[32],"errorMessage":[32],"datalist":[32],"_invalid":[32],"reportValidity":[64],"setFocus":[64],"getInputElement":[64],"showError":[64]},[[16,"reset","onReset"],[17,"mousedown","handleBlur"],[0,"keydown","handleBlur"]]]]],["p-88f17c86.system",[[1,"nano-img",{"alt":[1],"src":[1],"srcSet":[1,"src-set"],"lazy":[4],"background":[4],"autoHeight":[1,"auto-height"],"loadSrc":[32],"loadError":[32],"hasLoaded":[32],"imgStates":[32],"_src":[32]}],[1,"nano-grid",{"sSize":[2,"s-size"],"mSize":[2,"m-size"],"lSize":[2,"l-size"],"xlSize":[2,"xl-size"],"sCols":[2,"s-cols"],"mCols":[2,"m-cols"],"lCols":[2,"l-cols"],"xlCols":[2,"xl-cols"],"xxlCols":[2,"xxl-cols"],"showHelper":[516,"show-helper"],"contentPanel":[516,"content-panel"],"fullHeight":[516,"full-height"],"ready":[32],"isSmall":[32],"isMedium":[32],"isLarge":[32],"isXL":[32],"isXXL":[32]}],[1,"nano-grid-item",{"gridStates":[1,"grid-states"],"changeBP":[64]}]]]]'),e)}))}}}));
+System.register(["./p-59b3d24b.system.js","./p-93880c28.system.js"],(function(e,a){"use strict";var n,o,t,s,i,l,r;return{setters:[function(e){n=e.p;o=e.w;t=e.d;s=e.N;i=e.a;l=e.H;r=e.b},function(){}],execute:function(){var e=function(e){return"__sc_import_"+e.replace(/\s|-/g,"_")};var c=function(){{n.$cssShim$=o.__cssshim}{h(l.prototype)}var e=Array.from(t.querySelectorAll("script")).find((function(e){return new RegExp("/"+s+"(\\.esm)?\\.js($|\\?|#)").test(e.src)||e.getAttribute("data-stencil-namespace")===s}));var r={};if("onbeforeload"in e&&!history.scrollRestoration){return{then:function(){}}}{r.resourcesUrl=new URL(".",new URL(e.getAttribute("data-resources-url")||e.src,o.location.href)).href;{d(r.resourcesUrl,e)}if(!o.customElements){return a.import("./p-5b6c304c.system.js").then((function(){return r}))}}return i(r)};var d=function(a,n){var i=e(s);try{o[i]=new Function("w","return import(w);//"+Math.random())}catch(r){var l=new Map;o[i]=function(e){var s=new URL(e,a).href;var r=l.get(s);if(!r){var c=t.createElement("script");c.type="module";c.crossOrigin=n.crossOrigin;c.src=URL.createObjectURL(new Blob(["import * as m from '"+s+"'; window."+i+".m = m;"],{type:"application/javascript"}));r=new Promise((function(e){c.onload=function(){e(o[i].m);c.remove()}}));l.set(s,r);t.head.appendChild(c)}return r}}};var h=function(e){var a=e.cloneNode;e.cloneNode=function(e){if(this.nodeName==="TEMPLATE"){return a.call(this,e)}var n=a.call(this,false);var o=this.childNodes;if(e){for(var t=0;t<o.length;t++){if(o[t].nodeType!==2){n.appendChild(o[t].cloneNode(true))}}}return n}};c().then((function(e){return r(JSON.parse('[["p-58419bed.system",[[1,"nano-global-nav",{"env":[1],"ssoRedirect":[1,"sso-redirect"],"getMyAccountData":[4,"get-my-account-data"],"activeMyAccountSections":[16],"showSearch":[4,"show-search"],"showLogo":[4,"show-logo"],"logoUrl":[1,"logo-url"],"searchIndeces":[16],"myAccountUser":[1040],"searchAppId":[1025,"search-app-id"],"searchApiKey":[1025,"search-api-key"],"searchValue":[1025,"search-value"],"searchIndex":[1025,"search-index"],"cartCount":[1026,"cart-count"],"msgCount":[1026,"msg-count"],"cartUrl":[1025,"cart-url"],"msgUrl":[1025,"msg-url"],"hasLoggedinSlot":[32],"hasSiteSlot":[32],"hasPromotionSlot":[32],"aboutSlotLen":[32],"iconSlotLen":[32],"mainSlotLen":[32],"overflowSlotLen":[32],"searchSlotLen":[32],"internalSearchIndeces":[32],"thresholdReady":[32],"remoteDataReady":[32],"ready":[32],"isResizing":[32],"intersectRatio":[32],"threshold":[32],"modalOpen":[32],"modalIsOpen":[32],"searchBarShown":[32],"scrollingUp":[32],"searchLoading":[32],"showAutocomplete":[32],"secondaryMenuOpen":[32],"userMenuOpen":[32],"menuFullScreen":[32],"searchValInternal":[32],"submitSearch":[64]},[[0,"nanoOpen","secondaryOpen"],[0,"nanoClose","secondaryClose"]]]]],["p-3ad1d5aa.system",[[1,"nano-hero",{"imgSrc":[1,"img-src"],"imgSrcSet":[1,"img-src-set"],"largeScreenBP":[2,"large-screen-b-p"],"theme":[1],"level":[1],"gridSizes":[32],"hasIconBox":[32],"hasScrim":[32],"hasSecondaryContent":[32],"hasQuote":[32],"hasBg":[32],"hasBackBtn":[32],"hasCtas":[32],"breadCrumbs":[32],"iconBoxItems":[32]}]]],["p-e15be516.system",[[6,"nano-date-input",{"invalid":[2564],"helperText":[4,"helper-text"],"helperTextFormat":[16],"floatLabel":[4,"float-label"],"name":[1],"readonly":[4],"size":[2],"form":[1],"firstDayOfWeek":[2,"first-day-of-week"],"localization":[16],"disabled":[4],"color":[1],"autofocus":[4],"clearInput":[4,"clear-input"],"label":[1],"placeholder":[1025],"value":[1537],"validateOn":[1,"validate-on"],"showInlineError":[516,"show-inline-error"],"dateOrder":[1,"date-order"],"required":[4],"min":[1],"max":[1],"hideLabel":[4,"hide-label"],"picker":[4],"initialPickerDate":[1,"initial-picker-date"],"pickerOpen":[1540,"picker-open"],"closeAfterPicked":[4,"close-after-picked"],"pattern":[32],"inputValue":[32],"_invalid":[32],"reportValidity":[64],"setFocus":[64],"getInputElement":[64],"showError":[64]}]]],["p-531d5275.system",[[1,"nano-dialog",{"showRibbon":[4,"show-ribbon"],"open":[1540],"label":[1],"noHeader":[4,"no-header"],"noFooter":[4,"no-footer"],"noUserDismiss":[4,"no-user-dismiss"],"storeId":[1,"store-id"],"storeMethod":[1,"store-method"],"isVisible":[32],"noDismiss":[32],"hasFooter":[32],"show":[64],"hide":[64]}]]],["p-ef4e0912.system",[[6,"nano-file-upload",{"name":[1],"accept":[1],"capture":[1],"maxFileSize":[2,"max-file-size"],"maxFiles":[2,"max-files"],"label":[1],"placeholder":[1],"hideLabel":[4,"hide-label"],"required":[4],"disabled":[516],"clearInput":[4,"clear-input"],"showInlineError":[516,"show-inline-error"],"validateOn":[1025,"validate-on"],"invalid":[2564],"files":[2064],"value":[6145],"hasHelperSlot":[32],"hasLabelSlot":[32],"errorMessage":[32],"isDragging":[32],"fileList":[32],"hasFocus":[32],"_invalid":[32],"reportValidity":[64],"setFocus":[64],"getInputElement":[64],"showError":[64]},[[8,"click","globalClickHandler"],[8,"keydown","globalKeydownHandler"]]]]],["p-4429caac.system",[[1,"nano-alert",{"open":[1540],"closable":[516],"color":[513],"duration":[2],"isModal":[32],"isToast":[32],"isShowing":[32],"label":[32],"show":[64],"hide":[64],"toast":[64],"alert":[64]}]]],["p-6afdb510.system",[[1,"nano-global-search-results",{"algoliaEle":[32],"currentWidth":[32],"apiKey":[32],"appId":[32],"index":[32]},[[16,"nanoSearchReset","handleGlobalNavReset"],[16,"nanoSearchResult","handleGlobalNavSearch"],[0,"nanoChange","handleReorder"],[0,"nanoResultsShown","attachListeners"],[16,"nanoNewResults","attachResultListeners"]]]]],["p-1238f0fc.system",[[1,"nano-tab",{"panel":[513],"active":[516],"disabled":[516],"closable":[4],"setFocus":[64],"removeFocus":[64]}]]],["p-090f22a9.system",[[1,"nano-menu-drawer",{"open":[4],"saveState":[4,"save-state"],"hideWidth":[2,"hide-width"],"hideHeight":[4,"hide-height"],"reset":[32],"widthOk":[32],"heightOk":[32],"isLoading":[32],"hide":[32]},[[0,"nanoOpen","cancelNavItemEvents"],[0,"nanoClose","cancelNavItemEvents"],[16,"nanoIsReady","handleGlobalNavReady"]]]]],["p-9ca5e023.system",[[1,"nano-split-pane",{"position":[6146],"positionInPixels":[1026,"position-in-pixels"],"vertical":[516],"disabled":[516],"primary":[1],"snap":[1],"snapThreshold":[2,"snap-threshold"],"animationDuration":[2,"animation-duration"]}]]],["p-3f736fa2.system",[[1,"nano-tab-group",{"placement":[1],"noScrollControls":[4,"no-scroll-controls"],"color":[1],"storeId":[1,"store-id"],"storeMethod":[1,"store-method"],"disableSwipe":[4,"disable-swipe"],"hasScrollControls":[32],"hideControlRight":[32],"hideControlLeft":[32],"isLegacy":[32],"tab":[32],"show":[64]},[[0,"nanoTabClose","handleTabClose"]]]]],["p-c9c1a345.system",[[1,"nano-accordion",{"color":[1],"itemOpened":[32]},[[0,"nanoOpened","onToggleHandler"],[0,"nanoClosed","onClosedHandler"]]]]],["p-8278c5d2.system",[[1,"nano-algolia-filter",{"filterName":[1,"filter-name"],"value":[1025],"operator":[1],"storeId":[1,"store-id"],"storeMethod":[1,"store-method"],"changeEvent":[32],"internalValue":[32],"showFilter":[32],"indexResults":[32],"filterChanged":[32],"facets":[32],"tplRenderFn":[32],"globalStoreMethod":[32]},[[0,"nanoChange","handleChangeEvent"],[0,"change","handleChangeEvent"]]]]],["p-a898bf92.system",[[1,"nano-algolia-input",{"appId":[1,"app-id"],"apiKey":[1,"api-key"],"searchIndex":[1040],"searchIndexName":[1,"search-index-name"],"minChars":[2,"min-chars"],"autoEmit":[4,"auto-emit"],"browseIndex":[1028,"browse-index"],"storeId":[1,"store-id"],"storeMethod":[1,"store-method"],"searchStr":[32],"algoliaIndex":[32],"currentResults":[32],"search":[64]},[[0,"nanoChange","searchSubmit"]]]]],["p-62ecd3a1.system",[[1,"nano-algolia-pagination",{"maxToShow":[2,"max-to-show"],"currentPage":[32],"canGoPrev":[32],"canGoNext":[32],"show":[32],"tplRenderFn":[32],"indexResults":[32],"infiniteScroll":[32],"nextPage":[64],"prevPage":[64],"goToPage":[64]}]]],["p-98222c39.system",[[1,"nano-algolia-results",{"infiniteScroll":[4,"infinite-scroll"],"appendPages":[4,"append-pages"],"showResults":[32],"tplRenderFn":[32],"results":[32],"indexResults":[32],"resultsPage":[32],"changeEvent":[32],"facets":[32],"isLoading":[32]}]]],["p-7232c046.system",[[1,"nano-aspect-ratio",{"aspectRatio":[1,"aspect-ratio"],"fit":[1]}]]],["p-93448bcd.system",[[6,"nano-checkbox",{"hasFocus":[1540,"has-focus"],"checked":[1540],"disabled":[516],"value":[1],"name":[1],"required":[4],"type":[513],"label":[1],"indeterminate":[1540],"invalid":[2564],"color":[1],"_invalid":[32],"inputType":[32],"getInputElement":[64],"reportValidity":[64],"setError":[64],"setFocus":[64],"removeFocus":[64]}]]],["p-820d9e23.system",[[6,"nano-checkbox-group",{"validateOn":[1025,"validate-on"],"showInlineError":[4,"show-inline-error"],"min":[2],"max":[2],"disabled":[516],"legend":[1],"invalid":[2564],"checkboxes":[32],"nativeCbs":[32],"errorMessage":[32],"showErrorMsg":[32],"hasHelperSlot":[32],"reportValidity":[64]},[[0,"nanoChange","handleCbChange"]]]]],["p-94593617.system",[[1,"nano-details",{"label":[1],"open":[1540],"noHandle":[4,"no-handle"],"iconRotation":[2,"icon-rotation"],"color":[1],"isLoading":[32]}]]],["p-593de29b.system",[[1,"nano-drawer",{"open":[1540],"label":[1],"placement":[1],"contained":[4],"noHeader":[4,"no-header"],"type":[1],"contentSelector":[1,"content-selector"],"hasFooter":[32],"isVisible":[32],"show":[64],"hide":[64]}]]],["p-5066e563.system",[[6,"nano-range",{"color":[1],"debounce":[2],"name":[1],"dualKnobs":[4,"dual-knobs"],"min":[2],"max":[2],"pin":[4],"snaps":[4],"step":[2],"ticks":[4],"disabled":[4],"value":[1026],"ratioA":[32],"ratioB":[32],"pressedKnob":[32]}]]],["p-8a8f893b.system",[[2,"nano-rating",{"value":[1538],"max":[2],"precision":[2],"readonly":[4],"disabled":[4],"name":[1],"symbolName":[1,"symbol-name"],"symbol":[16],"hoverValue":[32],"isHovering":[32],"setFocus":[64],"removeFocus":[64]}]]],["p-22884654.system",[[1,"nano-slide",{"ready":[1540]}]]],["p-033296c7.system",[[1,"nano-slides",{"options":[1040],"navbtns":[4],"pager":[4],"fullscreenbtn":[4],"fullscreen":[1540],"animation":[513],"currentSlide":[1538,"current-slide"],"autoplay":[8],"ready":[1540],"iCurrentSlide":[32],"slidesReady":[32],"didInit":[32],"update":[64],"updateAutoHeight":[64],"slideTo":[64],"slideNext":[64],"slidePrev":[64],"getActiveIndex":[64],"length":[64],"isEnd":[64],"isBeginning":[64],"startAutoplay":[64],"stopAutoplay":[64],"lockSwipes":[64],"getflickity":[64],"reload":[64]}]]],["p-20387cde.system",[[1,"nano-tab-content",{"name":[513],"active":[516]}]]],["p-3ef30ded.system",[[1,"nano-spinner",{"type":[1],"overlay":[516],"hasText":[32]}]]],["p-92f85aaf.system",[[1,"nano-algolia",{"showResults":[1028,"show-results"],"resultsPage":[1026,"results-page"],"appId":[1025,"app-id"],"apiKey":[1025,"api-key"],"searchIndex":[1040],"searchIndexName":[1025,"search-index-name"],"listenTo":[1,"listen-to"],"query":[1025],"operator":[1],"filters":[16],"tplEngine":[16],"tplRenderFn":[16],"replicaIndex":[1025,"replica-index"],"browseIndex":[1028,"browse-index"],"minChars":[2,"min-chars"],"storeId":[1,"store-id"],"storeMethod":[1,"store-method"],"_dynFacetFilters":[32],"inputField":[32],"algoliaIndex":[32],"indeces":[32],"resultsEmitterEle":[32],"indexResults":[32],"filterChanged":[32],"currentHits":[32],"changeEvent":[32],"isLoading":[32],"wormholeState":[32],"removeFilters":[64]},[[0,"nanoTplUpdated","onAllTplUpdate"],[0,"nanoPageChanged","onPageChange"],[0,"nanoFilterChanged","onFilterChange"],[16,"nanoChange","handleInputChange"],[16,"change","handleInputChange"]]]]],["p-69439aa1.system",[[1,"nano-date-picker",{"selectedDate":[1025,"selected-date"],"min":[1],"max":[1],"firstDayOfWeek":[2,"first-day-of-week"],"localization":[16],"color":[1],"isDateDisabled":[16],"isModal":[4,"is-modal"],"firstFocusEle":[16],"activeFocus":[32],"focusedDay":[32],"setFocus":[64]}]]],["p-ca466250.system",[[1,"nano-tooltip",{"content":[1],"placement":[1],"disabled":[4],"distance":[2],"open":[1540],"skidding":[2],"trigger":[1],"show":[64],"hide":[64]}]]],["p-5653961d.system",[[1,"nano-sticker",{"autoResize":[4,"auto-resize"],"isSticky":[1028,"is-sticky"],"offset":[1026],"position":[1],"quietMode":[1,"quiet-mode"],"hideOnNewStickers":[4,"hide-on-new-stickers"],"breakPointMax":[2,"break-point-max"],"breakPointMin":[2,"break-point-min"],"scrollParent":[1040],"stickTo":[1,"stick-to"],"isStuck":[32],"isRootSticker":[32],"hide":[32],"scrollHide":[32],"multiStickerHide":[32],"scrollingTo":[32],"quietModeIsOn":[32],"stuckCounter":[32],"stickerIndex":[32],"stickToEle":[32],"triggerPos":[32],"trigger":[32],"_offset":[32],"isHiding":[64],"isSticking":[64],"setTriggerPos":[64],"getTriggerPos":[64],"pauseHiding":[64]}]]],["p-f2e7d2f9.system",[[2,"nano-icon-button",{"iconName":[1,"icon-name"],"iconSrc":[1,"icon-src"],"type":[513],"name":[513],"value":[513],"label":[1],"disabled":[516],"href":[1],"target":[1]}]]],["p-173bae15.system",[[1,"nano-resize-observe",{"states":[1],"currentWidth":[32],"currentHeight":[32],"classNames":[32]}],[1,"nano-skeleton",{"animated":[4]}]]],["p-7fcbc27f.system",[[1,"nano-dropdown",{"autoOpen":[4,"auto-open"],"open":[1540],"closeOnSelect":[4,"close-on-select"],"containingElement":[1040],"tetherTo":[16],"placement":[1],"distance":[2],"skidding":[2],"hoist":[4],"dialogTitle":[1,"dialog-title"],"show":[64],"hide":[64]},[[0,"nanoOpen","secondaryOpen"],[0,"nanoClose","secondaryClose"],[0,"nanoSelect","handlePanelSelect"]]]]],["p-f53989c3.system",[[1,"nano-icon",{"color":[1],"ariaLabel":[1537,"aria-label"],"flipRtl":[4,"flip-rtl"],"name":[1],"src":[1],"icon":[8],"size":[1],"lazy":[4],"svgContent":[32],"isVisible":[32],"isLoading":[32]}]]],["p-5a476bba.system",[[1,"nano-datalist",{"selected":[1040],"dropDownConfig":[6160],"options":[16],"input":[1],"type":[1],"activeOptions":[2064],"open":[1028],"disableFilter":[4,"disable-filter"],"disabled":[4],"actvOptEles":[32],"connectedInput":[32],"inputLabel":[32],"hasNoResult":[32],"shouldOpen":[32],"canOpen":[32],"optionIds":[32]}],[1,"nano-option",{"value":[1537],"label":[1537],"selected":[516],"disabled":[516],"filterMeta":[1,"filter-meta"],"hasFocus":[32]},[[0,"keydown","handleKeyDown"]]],[1,"nano-menu",{"hasFocus":[2052,"has-focus"],"type":[1],"label":[1],"setFocus":[64],"removeFocus":[64],"showActiveElement":[64],"resetActiveItem":[64]},[[17,"mousedown","handleBlur"],[0,"keydown","handleBlur"]]]]],["p-b19e0775.system",[[6,"nano-select",{"invalid":[2564],"color":[1],"autofocus":[4],"disabled":[516],"validateOn":[1025,"validate-on"],"showInlineError":[516,"show-inline-error"],"label":[1],"hideLabel":[4,"hide-label"],"floatLabel":[4,"float-label"],"multiple":[4],"name":[1],"placeholder":[1],"readonly":[516],"required":[4],"size":[2],"max":[2],"min":[2],"form":[1],"allowCustomValues":[4,"allow-custom-values"],"value":[6145],"options":[6160],"clearSelect":[4,"clear-select"],"mask":[4],"debounce":[2],"dropDownConfig":[1040],"currInsertIndex":[32],"showErrorMsg":[32],"errorMessage":[32],"hasFocus":[32],"hasLabelSlot":[32],"hasHelperSlot":[32],"inputSearchVal":[32],"_eOptions":[32],"reportValidity":[64],"setFocus":[64],"getSelectElement":[64],"showError":[64]},[[17,"mousedown","handleBlur"],[0,"keydown","handleBlur"]]],[1,"nano-nav-item",{"href":[1025],"target":[1],"disabled":[4],"open":[1540],"selected":[516],"secondaryActiveWidth":[2,"secondary-active-width"],"secondaryFallback":[16],"closeOnBlur":[4,"close-on-blur"],"didOpen":[32],"isInGlobalNav":[32],"isInMenuDrawer":[32],"isInMenu":[32],"isLegacy":[32],"hasFocus":[32],"setFocus":[64]}]]],["p-3a13948a.system",[[6,"nano-input",{"invalid":[2564],"color":[1],"accept":[1],"autocapitalise":[1],"autocomplete":[1],"autocorrect":[1],"autofocus":[4],"clearInput":[4,"clear-input"],"clearOnEdit":[4,"clear-on-edit"],"debounce":[2],"disabled":[516],"inputmode":[1],"validateOn":[1025,"validate-on"],"showInlineError":[516,"show-inline-error"],"label":[1],"hideLabel":[4,"hide-label"],"floatLabel":[4,"float-label"],"max":[1],"maxlength":[2],"min":[1],"minlength":[2],"multiple":[4],"name":[1],"pattern":[1],"placeholder":[1],"readonly":[516],"required":[4],"spellcheck":[4],"step":[1],"size":[2],"type":[1],"form":[1],"value":[1025],"resize":[1],"rows":[2],"showCharCount":[4,"show-char-count"],"hasFocus":[32],"hasLabelSlot":[32],"hasHelperSlot":[32],"errorMessage":[32],"datalist":[32],"_invalid":[32],"reportValidity":[64],"setFocus":[64],"getInputElement":[64],"showError":[64]},[[16,"reset","onReset"],[17,"mousedown","handleBlur"],[0,"keydown","handleBlur"]]]]],["p-88f17c86.system",[[1,"nano-img",{"alt":[1],"src":[1],"srcSet":[1,"src-set"],"lazy":[4],"background":[4],"autoHeight":[1,"auto-height"],"loadSrc":[32],"loadError":[32],"hasLoaded":[32],"imgStates":[32],"_src":[32]}],[1,"nano-grid",{"sSize":[2,"s-size"],"mSize":[2,"m-size"],"lSize":[2,"l-size"],"xlSize":[2,"xl-size"],"sCols":[2,"s-cols"],"mCols":[2,"m-cols"],"lCols":[2,"l-cols"],"xlCols":[2,"xl-cols"],"xxlCols":[2,"xxl-cols"],"showHelper":[516,"show-helper"],"contentPanel":[516,"content-panel"],"fullHeight":[516,"full-height"],"ready":[32],"isSmall":[32],"isMedium":[32],"isLarge":[32],"isXL":[32],"isXXL":[32]}],[1,"nano-grid-item",{"gridStates":[1,"grid-states"],"changeBP":[64]}]]]]'),e)}))}}}));
 //# sourceMappingURL=p-096682d9.system.js.map

package/dist/nano-components/p-096682d9.system.js.map

@@ -1 +1 @@
-{"version":3,"sources":["node_modules/@stencil/core/internal/client/patch-browser.js","@lazy-browser-entrypoint?app-data=conditional"],"names":["getDynamicImportFunction","namespace","replace","patchBrowser","plt","$cssShim$","win","__cssshim","patchCloneNodeFix","H","prototype","scriptElm","Array","from","doc","querySelectorAll","find","s","RegExp","NAMESPACE","test","src","getAttribute","opts","history","scrollRestoration","then","resourcesUrl","URL","location","href","patchDynamicImport","customElements","module","import","promiseResolve","base","orgScriptElm","importFunctionName","Function","Math","random","e","moduleMap_1","Map","url","mod","get","script_1","createElement","type","crossOrigin","createObjectURL","Blob","Promise","resolve","onload","m","remove","set","head","appendChild","HTMLElementPrototype","nativeCloneNodeFn","cloneNode","deep","this","nodeName","call","clonedNode","srcChildNodes","childNodes","i","length","nodeType","options","bootstrapLazy","JSON","parse"],"mappings":";;;0NAKA,IAAMA,EAA2B,SAACC,GAAc,MAAA,eAAeA,EAAUC,QAAQ,QAAS,MAC1F,IAAMC,EAAe,WAKK,CAElBC,EAAIC,UAAYC,EAAIC,UAEA,CAEpBC,EAAkBC,EAAEC,WAUxB,IAAMC,EACAC,MAAMC,KAAKC,EAAIC,iBAAiB,WAAWC,MAAK,SAACC,GAAM,OAAA,IAAIC,OAAO,IAAKC,EAAS,2BAA2BC,KAAKH,EAAEI,MAChHJ,EAAEK,aAAa,4BAA8BH,KAGrD,IAAMI,EAA6D,GACnE,GAAsB,iBAAkBZ,IAAca,QAAQC,kBAAsC,CAQhG,MAAO,CACHC,KAAI,cAQwC,CAChDH,EAAKI,aAAe,IAAIC,IAAI,IAAK,IAAIA,IAAIjB,EAAUW,aAAa,uBAAyBX,EAAUU,IAAKf,EAAIuB,SAASC,OAAOA,KAC/F,CACzBC,EAAmBR,EAAKI,aAAchB,GAE1C,IAAgCL,EAAI0B,eAAgB,CAGhD,OAAOC,EAAAC,OAA+C,0BAAYR,MAAK,WAAM,OAAAH,MAGrF,OAAOY,EAAeZ,IAE1B,IAAMQ,EAAqB,SAACK,EAAMC,GAC9B,IAAMC,EAAqBtC,EAAyBmB,GACpD,IAKIb,EAAIgC,GAAsB,IAAIC,SAAS,IAAK,sBAAsBC,KAAKC,UAE3E,MAAOC,GAIH,IAAMC,EAAY,IAAIC,IACtBtC,EAAIgC,GAAsB,SAACjB,GACvB,IAAMwB,EAAM,IAAIjB,IAAIP,EAAKe,GAAMN,KAC/B,IAAIgB,EAAMH,EAAUI,IAAIF,GACxB,IAAKC,EAAK,CACN,IAAME,EAASlC,EAAImC,cAAc,UACjCD,EAAOE,KAAO,SACdF,EAAOG,YAAcd,EAAac,YAClCH,EAAO3B,IAAMO,IAAIwB,gBAAgB,IAAIC,KAAK,CAAC,uBAAuBR,EAAG,aAAaP,EAAkB,WAAY,CAC5GY,KAAM,4BAEVJ,EAAM,IAAIQ,SAAQ,SAACC,GACfP,EAAOQ,OAAS,WACZD,EAAQjD,EAAIgC,GAAoBmB,GAChCT,EAAOU,aAGff,EAAUgB,IAAId,EAAKC,GACnBhC,EAAI8C,KAAKC,YAAYb,GAEzB,OAAOF,KAInB,IAAMtC,EAAoB,SAACsD,GACvB,IAAMC,EAAoBD,EAAqBE,UAC/CF,EAAqBE,UAAY,SAAUC,GACvC,GAAIC,KAAKC,WAAa,WAAY,CAC9B,OAAOJ,EAAkBK,KAAKF,KAAMD,GAExC,IAAMI,EAAaN,EAAkBK,KAAKF,KAAM,OAChD,IAAMI,EAAgBJ,KAAKK,WAC3B,GAAIN,EAAM,CACN,IAAK,IAAIO,EAAI,EAAGA,EAAIF,EAAcG,OAAQD,IAAK,CAE3C,GAAIF,EAAcE,GAAGE,WAAa,EAAG,CACjCL,EAAWR,YAAYS,EAAcE,GAAGR,UAAU,SAI9D,OAAOK,ICjHflE,IAAeuB,MAAK,SAAAiD,GAElB,OAAOC,EAAcC,KAAAC,MAAA,ipeAAuCH","sourcesContent":["/*\n Stencil Client Patch Browser v2.12.2 | MIT Licensed | https://stenciljs.com\n */\nimport { BUILD, NAMESPACE } from '@stencil/core/internal/app-data';\nimport { consoleDevInfo, plt, win, doc, promiseResolve, H } from '@stencil/core';\nconst getDynamicImportFunction = (namespace) => `__sc_import_${namespace.replace(/\\s|-/g, '_')}`;\nconst patchBrowser = () => {\n    // NOTE!! This fn cannot use async/await!\n    if (BUILD.isDev && !BUILD.isTesting) {\n        consoleDevInfo('Running in development mode.');\n    }\n    if (BUILD.cssVarShim) {\n        // shim css vars\n        plt.$cssShim$ = win.__cssshim;\n    }\n    if (BUILD.cloneNodeFix) {\n        // opted-in to polyfill cloneNode() for slot polyfilled components\n        patchCloneNodeFix(H.prototype);\n    }\n    if (BUILD.profile && !performance.mark) {\n        // not all browsers support performance.mark/measure (Safari 10)\n        performance.mark = performance.measure = () => {\n            /*noop*/\n        };\n        performance.getEntriesByName = () => [];\n    }\n    // @ts-ignore\n    const scriptElm = BUILD.scriptDataOpts || BUILD.safari10 || BUILD.dynamicImportShim\n        ? Array.from(doc.querySelectorAll('script')).find((s) => new RegExp(`\\/${NAMESPACE}(\\\\.esm)?\\\\.js($|\\\\?|#)`).test(s.src) ||\n            s.getAttribute('data-stencil-namespace') === NAMESPACE)\n        : null;\n    const importMeta = import.meta.url;\n    const opts = BUILD.scriptDataOpts ? scriptElm['data-opts'] || {} : {};\n    if (BUILD.safari10 && 'onbeforeload' in scriptElm && !history.scrollRestoration /* IS_ESM_BUILD */) {\n        // Safari < v11 support: This IF is true if it's Safari below v11.\n        // This fn cannot use async/await since Safari didn't support it until v11,\n        // however, Safari 10 did support modules. Safari 10 also didn't support \"nomodule\",\n        // so both the ESM file and nomodule file would get downloaded. Only Safari\n        // has 'onbeforeload' in the script, and \"history.scrollRestoration\" was added\n        // to Safari in v11. Return a noop then() so the async/await ESM code doesn't continue.\n        // IS_ESM_BUILD is replaced at build time so this check doesn't happen in systemjs builds.\n        return {\n            then() {\n                /* promise noop */\n            },\n        };\n    }\n    if (!BUILD.safari10 && importMeta !== '') {\n        opts.resourcesUrl = new URL('.', importMeta).href;\n    }\n    else if (BUILD.dynamicImportShim || BUILD.safari10) {\n        opts.resourcesUrl = new URL('.', new URL(scriptElm.getAttribute('data-resources-url') || scriptElm.src, win.location.href)).href;\n        if (BUILD.dynamicImportShim) {\n            patchDynamicImport(opts.resourcesUrl, scriptElm);\n        }\n        if (BUILD.dynamicImportShim && !win.customElements) {\n            // module support, but no custom elements support (Old Edge)\n            // @ts-ignore\n            return import(/* webpackChunkName: \"polyfills-dom\" */ './dom.js').then(() => opts);\n        }\n    }\n    return promiseResolve(opts);\n};\nconst patchDynamicImport = (base, orgScriptElm) => {\n    const importFunctionName = getDynamicImportFunction(NAMESPACE);\n    try {\n        // test if this browser supports dynamic imports\n        // There is a caching issue in V8, that breaks using import() in Function\n        // By generating a random string, we can workaround it\n        // Check https://bugs.chromium.org/p/chromium/issues/detail?id=990810 for more info\n        win[importFunctionName] = new Function('w', `return import(w);//${Math.random()}`);\n    }\n    catch (e) {\n        // this shim is specifically for browsers that do support \"esm\" imports\n        // however, they do NOT support \"dynamic\" imports\n        // basically this code is for old Edge, v18 and below\n        const moduleMap = new Map();\n        win[importFunctionName] = (src) => {\n            const url = new URL(src, base).href;\n            let mod = moduleMap.get(url);\n            if (!mod) {\n                const script = doc.createElement('script');\n                script.type = 'module';\n                script.crossOrigin = orgScriptElm.crossOrigin;\n                script.src = URL.createObjectURL(new Blob([`import * as m from '${url}'; window.${importFunctionName}.m = m;`], {\n                    type: 'application/javascript',\n                }));\n                mod = new Promise((resolve) => {\n                    script.onload = () => {\n                        resolve(win[importFunctionName].m);\n                        script.remove();\n                    };\n                });\n                moduleMap.set(url, mod);\n                doc.head.appendChild(script);\n            }\n            return mod;\n        };\n    }\n};\nconst patchCloneNodeFix = (HTMLElementPrototype) => {\n    const nativeCloneNodeFn = HTMLElementPrototype.cloneNode;\n    HTMLElementPrototype.cloneNode = function (deep) {\n        if (this.nodeName === 'TEMPLATE') {\n            return nativeCloneNodeFn.call(this, deep);\n        }\n        const clonedNode = nativeCloneNodeFn.call(this, false);\n        const srcChildNodes = this.childNodes;\n        if (deep) {\n            for (let i = 0; i < srcChildNodes.length; i++) {\n                // Node.ATTRIBUTE_NODE === 2, and checking because IE11\n                if (srcChildNodes[i].nodeType !== 2) {\n                    clonedNode.appendChild(srcChildNodes[i].cloneNode(true));\n                }\n            }\n        }\n        return clonedNode;\n    };\n};\nexport { patchBrowser };\n","import { bootstrapLazy } from '@stencil/core';\nimport { patchBrowser } from '@stencil/core/internal/client/patch-browser';\nimport { globalScripts } from '@stencil/core/internal/app-globals';\npatchBrowser().then(options => {\n  globalScripts();\n  return bootstrapLazy([/*!__STENCIL_LAZY_DATA__*/], options);\n});\n"]}
+{"version":3,"sources":["node_modules/@stencil/core/internal/client/patch-browser.js","@lazy-browser-entrypoint?app-data=conditional"],"names":["getDynamicImportFunction","namespace","replace","patchBrowser","plt","$cssShim$","win","__cssshim","patchCloneNodeFix","H","prototype","scriptElm","Array","from","doc","querySelectorAll","find","s","RegExp","NAMESPACE","test","src","getAttribute","opts","history","scrollRestoration","then","resourcesUrl","URL","location","href","patchDynamicImport","customElements","module","import","promiseResolve","base","orgScriptElm","importFunctionName","Function","Math","random","e","moduleMap_1","Map","url","mod","get","script_1","createElement","type","crossOrigin","createObjectURL","Blob","Promise","resolve","onload","m","remove","set","head","appendChild","HTMLElementPrototype","nativeCloneNodeFn","cloneNode","deep","this","nodeName","call","clonedNode","srcChildNodes","childNodes","i","length","nodeType","options","bootstrapLazy","JSON","parse"],"mappings":";;;0NAKA,IAAMA,EAA2B,SAACC,GAAc,MAAA,eAAeA,EAAUC,QAAQ,QAAS,MAC1F,IAAMC,EAAe,WAKK,CAElBC,EAAIC,UAAYC,EAAIC,UAEA,CAEpBC,EAAkBC,EAAEC,WAUxB,IAAMC,EACAC,MAAMC,KAAKC,EAAIC,iBAAiB,WAAWC,MAAK,SAACC,GAAM,OAAA,IAAIC,OAAO,IAAKC,EAAS,2BAA2BC,KAAKH,EAAEI,MAChHJ,EAAEK,aAAa,4BAA8BH,KAGrD,IAAMI,EAA6D,GACnE,GAAsB,iBAAkBZ,IAAca,QAAQC,kBAAsC,CAQhG,MAAO,CACHC,KAAI,cAQwC,CAChDH,EAAKI,aAAe,IAAIC,IAAI,IAAK,IAAIA,IAAIjB,EAAUW,aAAa,uBAAyBX,EAAUU,IAAKf,EAAIuB,SAASC,OAAOA,KAC/F,CACzBC,EAAmBR,EAAKI,aAAchB,GAE1C,IAAgCL,EAAI0B,eAAgB,CAGhD,OAAOC,EAAAC,OAA+C,0BAAYR,MAAK,WAAM,OAAAH,MAGrF,OAAOY,EAAeZ,IAE1B,IAAMQ,EAAqB,SAACK,EAAMC,GAC9B,IAAMC,EAAqBtC,EAAyBmB,GACpD,IAKIb,EAAIgC,GAAsB,IAAIC,SAAS,IAAK,sBAAsBC,KAAKC,UAE3E,MAAOC,GAIH,IAAMC,EAAY,IAAIC,IACtBtC,EAAIgC,GAAsB,SAACjB,GACvB,IAAMwB,EAAM,IAAIjB,IAAIP,EAAKe,GAAMN,KAC/B,IAAIgB,EAAMH,EAAUI,IAAIF,GACxB,IAAKC,EAAK,CACN,IAAME,EAASlC,EAAImC,cAAc,UACjCD,EAAOE,KAAO,SACdF,EAAOG,YAAcd,EAAac,YAClCH,EAAO3B,IAAMO,IAAIwB,gBAAgB,IAAIC,KAAK,CAAC,uBAAuBR,EAAG,aAAaP,EAAkB,WAAY,CAC5GY,KAAM,4BAEVJ,EAAM,IAAIQ,SAAQ,SAACC,GACfP,EAAOQ,OAAS,WACZD,EAAQjD,EAAIgC,GAAoBmB,GAChCT,EAAOU,aAGff,EAAUgB,IAAId,EAAKC,GACnBhC,EAAI8C,KAAKC,YAAYb,GAEzB,OAAOF,KAInB,IAAMtC,EAAoB,SAACsD,GACvB,IAAMC,EAAoBD,EAAqBE,UAC/CF,EAAqBE,UAAY,SAAUC,GACvC,GAAIC,KAAKC,WAAa,WAAY,CAC9B,OAAOJ,EAAkBK,KAAKF,KAAMD,GAExC,IAAMI,EAAaN,EAAkBK,KAAKF,KAAM,OAChD,IAAMI,EAAgBJ,KAAKK,WAC3B,GAAIN,EAAM,CACN,IAAK,IAAIO,EAAI,EAAGA,EAAIF,EAAcG,OAAQD,IAAK,CAE3C,GAAIF,EAAcE,GAAGE,WAAa,EAAG,CACjCL,EAAWR,YAAYS,EAAcE,GAAGR,UAAU,SAI9D,OAAOK,ICjHflE,IAAeuB,MAAK,SAAAiD,GAElB,OAAOC,EAAcC,KAAAC,MAAA,+meAAuCH","sourcesContent":["/*\n Stencil Client Patch Browser v2.12.2 | MIT Licensed | https://stenciljs.com\n */\nimport { BUILD, NAMESPACE } from '@stencil/core/internal/app-data';\nimport { consoleDevInfo, plt, win, doc, promiseResolve, H } from '@stencil/core';\nconst getDynamicImportFunction = (namespace) => `__sc_import_${namespace.replace(/\\s|-/g, '_')}`;\nconst patchBrowser = () => {\n    // NOTE!! This fn cannot use async/await!\n    if (BUILD.isDev && !BUILD.isTesting) {\n        consoleDevInfo('Running in development mode.');\n    }\n    if (BUILD.cssVarShim) {\n        // shim css vars\n        plt.$cssShim$ = win.__cssshim;\n    }\n    if (BUILD.cloneNodeFix) {\n        // opted-in to polyfill cloneNode() for slot polyfilled components\n        patchCloneNodeFix(H.prototype);\n    }\n    if (BUILD.profile && !performance.mark) {\n        // not all browsers support performance.mark/measure (Safari 10)\n        performance.mark = performance.measure = () => {\n            /*noop*/\n        };\n        performance.getEntriesByName = () => [];\n    }\n    // @ts-ignore\n    const scriptElm = BUILD.scriptDataOpts || BUILD.safari10 || BUILD.dynamicImportShim\n        ? Array.from(doc.querySelectorAll('script')).find((s) => new RegExp(`\\/${NAMESPACE}(\\\\.esm)?\\\\.js($|\\\\?|#)`).test(s.src) ||\n            s.getAttribute('data-stencil-namespace') === NAMESPACE)\n        : null;\n    const importMeta = import.meta.url;\n    const opts = BUILD.scriptDataOpts ? scriptElm['data-opts'] || {} : {};\n    if (BUILD.safari10 && 'onbeforeload' in scriptElm && !history.scrollRestoration /* IS_ESM_BUILD */) {\n        // Safari < v11 support: This IF is true if it's Safari below v11.\n        // This fn cannot use async/await since Safari didn't support it until v11,\n        // however, Safari 10 did support modules. Safari 10 also didn't support \"nomodule\",\n        // so both the ESM file and nomodule file would get downloaded. Only Safari\n        // has 'onbeforeload' in the script, and \"history.scrollRestoration\" was added\n        // to Safari in v11. Return a noop then() so the async/await ESM code doesn't continue.\n        // IS_ESM_BUILD is replaced at build time so this check doesn't happen in systemjs builds.\n        return {\n            then() {\n                /* promise noop */\n            },\n        };\n    }\n    if (!BUILD.safari10 && importMeta !== '') {\n        opts.resourcesUrl = new URL('.', importMeta).href;\n    }\n    else if (BUILD.dynamicImportShim || BUILD.safari10) {\n        opts.resourcesUrl = new URL('.', new URL(scriptElm.getAttribute('data-resources-url') || scriptElm.src, win.location.href)).href;\n        if (BUILD.dynamicImportShim) {\n            patchDynamicImport(opts.resourcesUrl, scriptElm);\n        }\n        if (BUILD.dynamicImportShim && !win.customElements) {\n            // module support, but no custom elements support (Old Edge)\n            // @ts-ignore\n            return import(/* webpackChunkName: \"polyfills-dom\" */ './dom.js').then(() => opts);\n        }\n    }\n    return promiseResolve(opts);\n};\nconst patchDynamicImport = (base, orgScriptElm) => {\n    const importFunctionName = getDynamicImportFunction(NAMESPACE);\n    try {\n        // test if this browser supports dynamic imports\n        // There is a caching issue in V8, that breaks using import() in Function\n        // By generating a random string, we can workaround it\n        // Check https://bugs.chromium.org/p/chromium/issues/detail?id=990810 for more info\n        win[importFunctionName] = new Function('w', `return import(w);//${Math.random()}`);\n    }\n    catch (e) {\n        // this shim is specifically for browsers that do support \"esm\" imports\n        // however, they do NOT support \"dynamic\" imports\n        // basically this code is for old Edge, v18 and below\n        const moduleMap = new Map();\n        win[importFunctionName] = (src) => {\n            const url = new URL(src, base).href;\n            let mod = moduleMap.get(url);\n            if (!mod) {\n                const script = doc.createElement('script');\n                script.type = 'module';\n                script.crossOrigin = orgScriptElm.crossOrigin;\n                script.src = URL.createObjectURL(new Blob([`import * as m from '${url}'; window.${importFunctionName}.m = m;`], {\n                    type: 'application/javascript',\n                }));\n                mod = new Promise((resolve) => {\n                    script.onload = () => {\n                        resolve(win[importFunctionName].m);\n                        script.remove();\n                    };\n                });\n                moduleMap.set(url, mod);\n                doc.head.appendChild(script);\n            }\n            return mod;\n        };\n    }\n};\nconst patchCloneNodeFix = (HTMLElementPrototype) => {\n    const nativeCloneNodeFn = HTMLElementPrototype.cloneNode;\n    HTMLElementPrototype.cloneNode = function (deep) {\n        if (this.nodeName === 'TEMPLATE') {\n            return nativeCloneNodeFn.call(this, deep);\n        }\n        const clonedNode = nativeCloneNodeFn.call(this, false);\n        const srcChildNodes = this.childNodes;\n        if (deep) {\n            for (let i = 0; i < srcChildNodes.length; i++) {\n                // Node.ATTRIBUTE_NODE === 2, and checking because IE11\n                if (srcChildNodes[i].nodeType !== 2) {\n                    clonedNode.appendChild(srcChildNodes[i].cloneNode(true));\n                }\n            }\n        }\n        return clonedNode;\n    };\n};\nexport { patchBrowser };\n","import { bootstrapLazy } from '@stencil/core';\nimport { patchBrowser } from '@stencil/core/internal/client/patch-browser';\nimport { globalScripts } from '@stencil/core/internal/app-globals';\npatchBrowser().then(options => {\n  globalScripts();\n  return bootstrapLazy([/*!__STENCIL_LAZY_DATA__*/], options);\n});\n"]}

package/dist/nano-components/p-9ca5e023.system.entry.js

@@ -0,0 +1,5 @@
+/*!
+ * Web Components for Nanopore digital Web Apps
+ */
+System.register(["./p-59b3d24b.system.js","./p-1c216ca4.system.js","./p-ef053a2f.system.js"],(function(i){"use strict";var e,t,n,o,r,s,a,d;return{setters:[function(i){e=i.r;t=i.c;n=i.h;o=i.e;r=i.g},function(i){s=i.c;a=i.r},function(i){d=i.d}],execute:function(){function l(i,e){function t(t){var n=i.getBoundingClientRect();var o=i.ownerDocument.defaultView;var r=n.left+o.pageXOffset;var s=n.top+o.pageYOffset;var a=t.pageX-r;var d=t.pageY-s;e(a,d)}function n(){document.removeEventListener("pointermove",t);document.removeEventListener("pointerup",n)}document.addEventListener("pointermove",t,{passive:true});document.addEventListener("pointerup",n)}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{--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 c=i("nano_split_pane",function(){function i(i){var n=this;e(this,i);this.nanoReposition=t(this,"nanoReposition",7);this.nanoDragging=t(this,"nanoDragging",7);this.isAnimating=false;this.didLoad=false;this._shouldAnimate=true;this.vertical=false;this.disabled=false;this.snapThreshold=12;this.animationDuration=.6;this.handleDrag=function(i){if(n.disabled){return}i.preventDefault();l(n.host,(function(i,e){var t=n.vertical?e:i;n.nanoDragging.emit(t);if(n.primary==="end"){t=n.size-t}if(n.snap){var o=n.snap.split(" ");o.forEach((function(i){var e;if(i.endsWith("%")){e=n.size*(parseFloat(i)/100)}else{e=parseFloat(i)}if(t>=e-n.snapThreshold&&t<=e+n.snapThreshold){t=e}}))}n.shouldAnimate=false;n.position=s(n.pixelsToPercentage(t),0,100);a((function(){return n.shouldAnimate=true}))}))};this.handleKeyDown=function(i){if(n.disabled){return}if(["ArrowLeft","ArrowRight","ArrowUp","ArrowDown","Home","End"].includes(i.key)){var e=n.position;var t=(i.shiftKey?10:1)*(n.primary==="end"?-1:1);i.preventDefault();if(i.key==="ArrowLeft"&&!n.vertical||i.key==="ArrowUp"&&n.vertical){e-=t}if(i.key==="ArrowRight"&&!n.vertical||i.key==="ArrowDown"&&n.vertical){e+=t}if(i.key==="Home"){e=n.primary==="end"?100:0}if(i.key==="End"){e=n.primary==="end"?0:100}n.shouldAnimate=false;n.position=s(e,0,100);a((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);a((function(){return n.shouldAnimate=true}))}};this.handlePositionChange=d(this.handlePositionChange.bind(this),100)}Object.defineProperty(i.prototype,"size",{get:function(){var i=this.host.getBoundingClientRect(),e=i.width,t=i.height;return this.vertical?t:e},enumerable:false,configurable:true});Object.defineProperty(i.prototype,"shouldAnimate",{get:function(){return this.didLoad&&this._shouldAnimate},set:function(i){this._shouldAnimate=i},enumerable:false,configurable:true});Object.defineProperty(i.prototype,"position",{get:function(){return this._position},set:function(i){i=Math.min(Math.max(i,0),100);if(isNaN(i)||i===this._position)return;if(this.shouldAnimate&&this.animationDuration>0&&!isNaN(this.position)){this.animatePosition(i);return}this._position=i},enumerable:false,configurable:true});i.prototype.handlePositionChange=function(){this.cachedPositionInPixels=this.percentageToPixels(this.position);this.positionInPixels=this.percentageToPixels(this.position);this.nanoReposition.emit()};i.prototype.handlePositionInPixelsChange=function(){this.position=this.pixelsToPercentage(this.positionInPixels)};i.prototype.animatePosition=function(i){var e=this;if(this.isAnimating)return;var t=this.animationDuration;var n=60;var o=this.position;var r=i-o;var s=o;var d=0;function l(i,e,t,n){if((i/=n/2)<1)return t/2*i*i+e;else return-t/2*(--i*(i-2)-1)+e}var h=function(){d+=1/n;s=l(d,o,r,t);if(i>o&&s>=i||i<o&&s<=i){e.position=i;e.shouldAnimate=true;e.isAnimating=false;return}e.position=s;a(h)};this.shouldAnimate=false;this.isAnimating=true;a(h)};i.prototype.percentageToPixels=function(i){return this.size*(i/100)};i.prototype.pixelsToPercentage=function(i){return i/this.size*100};i.prototype.attachRO=function(){var i=this;this.detachRO();this.ro=new ResizeObserver((function(){return i.handleResize()}));this.ro.observe(this.host)};i.prototype.detachRO=function(){if(!this.ro)return;this.ro.unobserve(this.host);this.ro=undefined};i.prototype.componentDidLoad=function(){var i=this;if(this.positionInPixels)this.handlePositionInPixelsChange();setTimeout((function(){return i.didLoad=true}))};i.prototype.connectedCallback=function(){this.cachedPositionInPixels=this.percentageToPixels(this.position);this.attachRO()};i.prototype.disconnectedCallback=function(){this.detachRO()};i.prototype.componentDidRender=function(){var i=this;a((function(){if(typeof i.position==="undefined"){i.position=50}}))};i.prototype.render=function(){if(typeof this.position==="undefined")return;var i={};var e=this.vertical?"gridTemplateRows":"gridTemplateColumns";var t="\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"){i[e]=r+" var(--divider-width) "+t}else{i[e]=t+" var(--divider-width) "+r}return n(o,{style:i},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(i.prototype,"host",{get:function(){return r(this)},enumerable:false,configurable:true});Object.defineProperty(i,"watchers",{get:function(){return{position:["handlePositionChange"],positionInPixels:["handlePositionInPixelsChange"]}},enumerable:false,configurable:true});return i}());c.style=h}}}));
+//# sourceMappingURL=p-9ca5e023.system.entry.js.map

package/dist/nano-components/p-9ca5e023.system.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["src/utils/drag.ts","src/components/split-pane/split-pane.scss?tag=nano-split-pane&encapsulation=shadow","src/components/split-pane/split-pane.tsx"],"names":["drag","container","onMove","move","pointerEvent","dims","getBoundingClientRect","defaultView","ownerDocument","offsetX","left","pageXOffset","offsetY","top","pageYOffset","x","pageX","y","pageY","stop","document","removeEventListener","addEventListener","passive","splitPaneCss","SplitPane","exports","class_1","hostRef","_this","this","isAnimating","didLoad","_shouldAnimate","vertical","disabled","snapThreshold","animationDuration","handleDrag","e","preventDefault","host","newPositionInPixels","nanoDragging","emit","primary","size","snap","snaps","split","forEach","value","snapPoint","endsWith","parseFloat","shouldAnimate","position","clamp","pixelsToPercentage","raf","handleKeyDown","event","includes","key","newPosition","incr","shiftKey","handleResize","cachedPositionInPixels","handlePositionChange","debounce","bind","Object","defineProperty","prototype","_a","width","height","sa","_position","pos","Math","min","max","isNaN","animatePosition","percentageToPixels","positionInPixels","nanoReposition","handlePositionInPixelsChange","end","duration","fps","start","distance","time","easeInOutQuad","t","s","d","go","attachRO","detachRO","ro","ResizeObserver","observe","unobserve","undefined","componentDidLoad","setTimeout","connectedCallback","disconnectedCallback","componentDidRender","render","styles","gridTemplate","secondary","h","Host","style","part","class","name","tabindex","role","aria-label","onKeyDown","onMouseDown","onTouchStart","slot"],"mappings":"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","sourcesContent":["export function drag(\n  container: HTMLElement,\n  onMove: (x: number, y: number) => void\n) {\n  function move(pointerEvent: PointerEvent) {\n    const dims = container.getBoundingClientRect();\n    const defaultView = container.ownerDocument.defaultView!;\n    const offsetX = dims.left + defaultView.pageXOffset;\n    const offsetY = dims.top + defaultView.pageYOffset;\n    const x = pointerEvent.pageX - offsetX;\n    const y = pointerEvent.pageY - offsetY;\n\n    onMove(x, y);\n  }\n\n  function stop() {\n    document.removeEventListener('pointermove', move);\n    document.removeEventListener('pointerup', stop);\n  }\n\n  document.addEventListener('pointermove', move, { passive: true });\n  document.addEventListener('pointerup', stop);\n}\n","@use 'sass:map';\n@use 'sass:list';\n\n@import '../../global/style/nano-theme/components';\n@import '../../global/style/nano-theme/form';\n\n:host {\n  /**\n  * @prop --divider-width: The width of the visible divider. Default 4px.\n  * @prop --divider-hit-area: The invisible region around the divider where dragging can occur. This is\n  *  usually wider than the divider to facilitate easier dragging. Default 12px.\n  * @prop --min: The minimum allowed size of the primary panel. Default 0.\n  * @prop --max: The maximum allowed size of the primary panel. Default 100%.\n  * @prop --background-color: Handle background. Default #{map.get($colors, lightgrey)}.\n  * @prop --content-color: Handle color. Default #{map.get($colors, dimgrey)}.\n  */\n  --divider-width: 12px;\n  --divider-hit-area: 14px;\n  --min: 0%;\n  --max: 100%;\n  --background-color: #{map.get($colors, lightgrey)};\n  --content-color: #{map.get($colors, dimgrey)};\n\n  display: grid;\n}\n\n.start,\n.end {\n  overflow: hidden;\n}\n\n.divider {\n  flex: 0 0 var(--divider-width);\n  display: flex;\n  position: relative;\n  align-items: center;\n  justify-content: center;\n  background-color: var(--background-color);\n  color: var(--content-color);\n  z-index: 1;\n  font-size: 0.8rem;\n}\n\n.divider:focus {\n  outline: none;\n}\n\n:host(:not([disabled])) .divider:focus-visible {\n  background-color: #{$control-focus-color};\n}\n\n:host([disabled]) .divider {\n  cursor: not-allowed;\n}\n\n/* Horizontal */\n:host(:not([vertical], [disabled])) .divider {\n  cursor: col-resize;\n}\n\n:host(:not([vertical])) .divider::after {\n  display: flex;\n  content: '';\n  position: absolute;\n  height: 100%;\n  left: calc(var(--divider-hit-area) / -2 + var(--divider-width) / 2);\n  width: var(--divider-hit-area);\n}\n\n/* Vertical */\n:host([vertical]) {\n  flex-direction: column;\n}\n\n:host([vertical]:not([disabled])) .divider {\n  cursor: row-resize;\n}\n\n:host([vertical]) .divider::after {\n  content: '';\n  position: absolute;\n  width: 100%;\n  top: calc(var(--divider-hit-area) / -2 + var(--divider-width) / 2);\n  height: var(--divider-hit-area);\n}\n","import {\n  Prop,\n  Component,\n  Watch,\n  Event,\n  EventEmitter,\n  ComponentInterface,\n  Element,\n  Host,\n  h,\n} from '@stencil/core';\nimport { clamp, raf, debounce } from '../../utils';\nimport { drag } from '../../utils/drag';\n\n/**\n * Split panes display two adjacent panels, allowing the user to reposition them.\n *\n * @part start - The start panel.\n * @part end - The end panel.\n * @part panel - Targets both the start and end panels.\n * @part divider - The divider that separates the start and end panels.\n *\n * @slot start - The start panel.\n * @slot end - The end panel.\n * @slot handle - An optional handle to render at the center of the divider.\n */\n@Component({\n  tag: 'nano-split-pane',\n  styleUrl: 'split-pane.scss',\n  shadow: true,\n})\nexport class SplitPane implements ComponentInterface {\n  @Element() host: HTMLNanoSplitPaneElement;\n  private cachedPositionInPixels: number;\n  private ro: ResizeObserver;\n  private isAnimating = false;\n  private didLoad = false;\n\n  private get size() {\n    const { width, height } = this.host.getBoundingClientRect();\n    return this.vertical ? height : width;\n  }\n\n  private get shouldAnimate() {\n    return this.didLoad && this._shouldAnimate;\n  }\n  private set shouldAnimate(sa: boolean) {\n    this._shouldAnimate = sa;\n  }\n  private _shouldAnimate: boolean = true;\n\n  constructor() {\n    this.handlePositionChange = debounce(\n      this.handlePositionChange.bind(this),\n      100\n    );\n  }\n\n  /**\n   * The current position of the divider from the primary panel's edge as a percentage 0-100. Defaults to 50% of the\n   * container's initial size.\n   */\n  @Prop()\n  get position() {\n    return this._position;\n  }\n  set position(pos: number) {\n    // override too high / low\n    pos = Math.min(Math.max(pos, 0), 100);\n    if (isNaN(pos) || pos === this._position) return;\n\n    if (\n      this.shouldAnimate &&\n      this.animationDuration > 0 &&\n      !isNaN(this.position)\n    ) {\n      this.animatePosition(pos);\n      return;\n    }\n    this._position = pos;\n  }\n  private _position: number;\n\n  // eslint-disable-next-line @stencil/no-unused-watch\n  @Watch('position')\n  handlePositionChange() {\n    this.cachedPositionInPixels = this.percentageToPixels(this.position);\n    this.positionInPixels = this.percentageToPixels(this.position);\n    this.nanoReposition.emit();\n  }\n\n  /**\n   * The current position of the divider from the primary panel's edge in pixels.\n   */\n  @Prop({ mutable: true }) positionInPixels: number;\n\n  @Watch('positionInPixels')\n  handlePositionInPixelsChange() {\n    this.position = this.pixelsToPercentage(this.positionInPixels);\n  }\n\n  /** Draws the split panel in a vertical orientation with the start and end panels stacked. */\n  @Prop({ reflect: true }) vertical = false;\n\n  /** Disables resizing. Note that the position may still change as a result of resizing the host element. */\n  @Prop({ reflect: true }) disabled = false;\n\n  /**\n   * If no primary panel is designated, both panels will resize proportionally when the host element is resized. If a\n   * primary panel is designated, it will maintain its size and the other panel will grow or shrink as needed when the\n   * host element is resized.\n   */\n  @Prop() primary?: 'start' | 'end';\n\n  /**\n   * One or more space-separated values at which the divider should snap. Values can be in pixels or percentages, e.g.\n   * `\"100px 50%\"`.\n   */\n  @Prop() snap?: string;\n\n  /** How close the divider must be to a snap point until snapping occurs. */\n  @Prop() snapThreshold = 12;\n\n  /** When changing `position` via property, the pane will animate into position. Make `animationDuration` 0 to disable. */\n  @Prop() animationDuration = 0.6;\n\n  /** Emitted when the divider's position changes. */\n  @Event() nanoReposition: EventEmitter;\n\n  /** Emitted when the divider is being dragged. */\n  @Event() nanoDragging: EventEmitter<number>;\n\n  // Private logic\n\n  private animatePosition(end: number) {\n    if (this.isAnimating) return;\n\n    const duration = this.animationDuration; // seconds\n    const fps = 60;\n    const start = this.position;\n    const distance = end - start;\n\n    let position = start;\n    let time = 0;\n\n    function easeInOutQuad(t: number, s: number, e: number, d: number) {\n      if ((t /= d / 2) < 1) return (e / 2) * t * t + s;\n      else return (-e / 2) * (--t * (t - 2) - 1) + s;\n    }\n\n    const go = () => {\n      time += 1 / fps;\n      position = easeInOutQuad(time, start, distance, duration);\n\n      if (\n        (end > start && position >= end) ||\n        (end < start && position <= end)\n      ) {\n        this.position = end;\n        this.shouldAnimate = true;\n        this.isAnimating = false;\n        return;\n      }\n      this.position = position;\n      raf(go);\n    };\n\n    this.shouldAnimate = false;\n    this.isAnimating = true;\n    raf(go);\n  }\n\n  private percentageToPixels(value: number) {\n    return this.size * (value / 100);\n  }\n\n  private pixelsToPercentage(value: number) {\n    return (value / this.size) * 100;\n  }\n\n  private attachRO() {\n    this.detachRO();\n    this.ro = new ResizeObserver(() => this.handleResize());\n    this.ro.observe(this.host);\n  }\n\n  private detachRO() {\n    if (!this.ro) return;\n    this.ro.unobserve(this.host);\n    this.ro = undefined;\n  }\n\n  // Event handlers\n\n  private handleDrag = (e: Event) => {\n    if (this.disabled) {\n      return;\n    }\n\n    // Prevent text selection when dragging\n    e.preventDefault();\n\n    drag(this.host, (x, y) => {\n      let newPositionInPixels = this.vertical ? y : x;\n\n      this.nanoDragging.emit(newPositionInPixels);\n\n      // Flip for end panels\n      if (this.primary === 'end') {\n        newPositionInPixels = this.size - newPositionInPixels;\n      }\n\n      // Check snap points\n      if (this.snap) {\n        const snaps = this.snap.split(' ');\n\n        snaps.forEach((value) => {\n          let snapPoint: number;\n\n          if (value.endsWith('%')) {\n            snapPoint = this.size * (parseFloat(value) / 100);\n          } else {\n            snapPoint = parseFloat(value);\n          }\n\n          if (\n            newPositionInPixels >= snapPoint - this.snapThreshold &&\n            newPositionInPixels <= snapPoint + this.snapThreshold\n          ) {\n            newPositionInPixels = snapPoint;\n          }\n        });\n      }\n      this.shouldAnimate = false;\n      this.position = clamp(\n        this.pixelsToPercentage(newPositionInPixels),\n        0,\n        100\n      );\n      raf(() => (this.shouldAnimate = true));\n    });\n  };\n\n  private handleKeyDown = (event: KeyboardEvent) => {\n    if (this.disabled) {\n      return;\n    }\n\n    if (\n      [\n        'ArrowLeft',\n        'ArrowRight',\n        'ArrowUp',\n        'ArrowDown',\n        'Home',\n        'End',\n      ].includes(event.key)\n    ) {\n      let newPosition = this.position;\n      const incr =\n        (event.shiftKey ? 10 : 1) * (this.primary === 'end' ? -1 : 1);\n\n      event.preventDefault();\n\n      if (\n        (event.key === 'ArrowLeft' && !this.vertical) ||\n        (event.key === 'ArrowUp' && this.vertical)\n      ) {\n        newPosition -= incr;\n      }\n\n      if (\n        (event.key === 'ArrowRight' && !this.vertical) ||\n        (event.key === 'ArrowDown' && this.vertical)\n      ) {\n        newPosition += incr;\n      }\n\n      if (event.key === 'Home') {\n        newPosition = this.primary === 'end' ? 100 : 0;\n      }\n\n      if (event.key === 'End') {\n        newPosition = this.primary === 'end' ? 0 : 100;\n      }\n\n      this.shouldAnimate = false;\n\n      this.position = clamp(newPosition, 0, 100);\n      raf(() => (this.shouldAnimate = true));\n    }\n  };\n\n  private handleResize = () => {\n    if (!this.didLoad || this.isAnimating) return;\n\n    // Resize when a primary panel is set\n    if (this.primary) {\n      this.shouldAnimate = false;\n      this.position = this.pixelsToPercentage(this.cachedPositionInPixels);\n      raf(() => (this.shouldAnimate = true));\n    }\n  };\n\n  componentDidLoad(): void {\n    if (this.positionInPixels) this.handlePositionInPixelsChange();\n    setTimeout(() => (this.didLoad = true));\n  }\n\n  connectedCallback() {\n    this.cachedPositionInPixels = this.percentageToPixels(this.position);\n    this.attachRO();\n  }\n\n  disconnectedCallback() {\n    this.detachRO();\n  }\n\n  componentDidRender(): void {\n    // bit hacky ... because we use getter / setter for position, there's a render *before* `position` is passed in via attribute\n    // if we set a default position in the class, this causes the divider to jump (from default to user set position)\n    // so - wait a render, see if there's a position passed in via attribute, *then* set default if not\n    raf(() => {\n      if (typeof this.position === 'undefined') {\n        this.position = 50;\n      }\n    });\n  }\n\n  render() {\n    if (typeof this.position === 'undefined') return;\n    const styles: { gridTemplateRows?: string; gridTemplateColumns?: string } =\n      {};\n    const gridTemplate = this.vertical\n      ? 'gridTemplateRows'\n      : 'gridTemplateColumns';\n    const primary = `\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    `;\n    const secondary = 'auto';\n\n    if (this.primary === 'end') {\n      styles[gridTemplate] = `${secondary} var(--divider-width) ${primary}`;\n    } else {\n      styles[gridTemplate] = `${primary} var(--divider-width) ${secondary}`;\n    }\n\n    return (\n      <Host style={styles}>\n        <div part=\"panel start\" class=\"start\">\n          <slot name=\"start\"></slot>\n        </div>\n        <div\n          part=\"divider\"\n          class=\"divider\"\n          tabindex={this.disabled ? undefined : '0'}\n          role=\"separator\"\n          aria-label=\"Resize\"\n          onKeyDown={this.handleKeyDown}\n          onMouseDown={this.handleDrag}\n          onTouchStart={this.handleDrag}\n        >\n          <slot name=\"handle\">\n            {!this.disabled && this.vertical ? (\n              <nano-icon slot=\"handle\" name=\"solid/grip-lines\" />\n            ) : (\n              <nano-icon slot=\"handle\" name=\"solid/grip-lines-vertical\" />\n            )}\n          </slot>\n        </div>\n        <div part=\"panel end\" class=\"end\">\n          <slot name=\"end\"></slot>\n        </div>\n      </Host>\n    );\n  }\n}\n"]}

package/dist/nano-components/p-d9f2dda5.entry.js

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

package/dist/nano-components/p-d9f2dda5.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["src/utils/drag.ts","src/components/split-pane/split-pane.scss?tag=nano-split-pane&encapsulation=shadow","src/components/split-pane/split-pane.tsx"],"names":["drag","container","onMove","move","pointerEvent","dims","getBoundingClientRect","defaultView","ownerDocument","offsetX","left","pageXOffset","offsetY","top","pageYOffset","x","pageX","y","pageY","stop","document","removeEventListener","addEventListener","passive","splitPaneCss","SplitPane","[object Object]","hostRef","this","isAnimating","didLoad","_shouldAnimate","vertical","disabled","snapThreshold","animationDuration","handleDrag","e","preventDefault","host","newPositionInPixels","nanoDragging","emit","primary","size","snap","snaps","split","forEach","value","snapPoint","endsWith","parseFloat","shouldAnimate","position","clamp","pixelsToPercentage","raf","handleKeyDown","event","includes","key","newPosition","incr","shiftKey","handleResize","cachedPositionInPixels","handlePositionChange","debounce","bind","width","height","sa","_position","pos","Math","min","max","isNaN","animatePosition","percentageToPixels","positionInPixels","nanoReposition","end","duration","fps","start","distance","time","easeInOutQuad","t","s","d","go","detachRO","ro","ResizeObserver","observe","unobserve","undefined","handlePositionInPixelsChange","setTimeout","attachRO","styles","gridTemplate","secondary","h","Host","style","part","class","name","tabindex","role","aria-label","onKeyDown","onMouseDown","onTouchStart","slot"],"mappings":"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","sourcesContent":["export function drag(\n  container: HTMLElement,\n  onMove: (x: number, y: number) => void\n) {\n  function move(pointerEvent: PointerEvent) {\n    const dims = container.getBoundingClientRect();\n    const defaultView = container.ownerDocument.defaultView!;\n    const offsetX = dims.left + defaultView.pageXOffset;\n    const offsetY = dims.top + defaultView.pageYOffset;\n    const x = pointerEvent.pageX - offsetX;\n    const y = pointerEvent.pageY - offsetY;\n\n    onMove(x, y);\n  }\n\n  function stop() {\n    document.removeEventListener('pointermove', move);\n    document.removeEventListener('pointerup', stop);\n  }\n\n  document.addEventListener('pointermove', move, { passive: true });\n  document.addEventListener('pointerup', stop);\n}\n","@use 'sass:map';\n@use 'sass:list';\n\n@import '../../global/style/nano-theme/components';\n@import '../../global/style/nano-theme/form';\n\n:host {\n  /**\n  * @prop --divider-width: The width of the visible divider. Default 4px.\n  * @prop --divider-hit-area: The invisible region around the divider where dragging can occur. This is\n  *  usually wider than the divider to facilitate easier dragging. Default 12px.\n  * @prop --min: The minimum allowed size of the primary panel. Default 0.\n  * @prop --max: The maximum allowed size of the primary panel. Default 100%.\n  * @prop --background-color: Handle background. Default #{map.get($colors, lightgrey)}.\n  * @prop --content-color: Handle color. Default #{map.get($colors, dimgrey)}.\n  */\n  --divider-width: 12px;\n  --divider-hit-area: 14px;\n  --min: 0%;\n  --max: 100%;\n  --background-color: #{map.get($colors, lightgrey)};\n  --content-color: #{map.get($colors, dimgrey)};\n\n  display: grid;\n}\n\n.start,\n.end {\n  overflow: hidden;\n}\n\n.divider {\n  flex: 0 0 var(--divider-width);\n  display: flex;\n  position: relative;\n  align-items: center;\n  justify-content: center;\n  background-color: var(--background-color);\n  color: var(--content-color);\n  z-index: 1;\n  font-size: 0.8rem;\n}\n\n.divider:focus {\n  outline: none;\n}\n\n:host(:not([disabled])) .divider:focus-visible {\n  background-color: #{$control-focus-color};\n}\n\n:host([disabled]) .divider {\n  cursor: not-allowed;\n}\n\n/* Horizontal */\n:host(:not([vertical], [disabled])) .divider {\n  cursor: col-resize;\n}\n\n:host(:not([vertical])) .divider::after {\n  display: flex;\n  content: '';\n  position: absolute;\n  height: 100%;\n  left: calc(var(--divider-hit-area) / -2 + var(--divider-width) / 2);\n  width: var(--divider-hit-area);\n}\n\n/* Vertical */\n:host([vertical]) {\n  flex-direction: column;\n}\n\n:host([vertical]:not([disabled])) .divider {\n  cursor: row-resize;\n}\n\n:host([vertical]) .divider::after {\n  content: '';\n  position: absolute;\n  width: 100%;\n  top: calc(var(--divider-hit-area) / -2 + var(--divider-width) / 2);\n  height: var(--divider-hit-area);\n}\n","import {\n  Prop,\n  Component,\n  Watch,\n  Event,\n  EventEmitter,\n  ComponentInterface,\n  Element,\n  Host,\n  h,\n} from '@stencil/core';\nimport { clamp, raf, debounce } from '../../utils';\nimport { drag } from '../../utils/drag';\n\n/**\n * Split panes display two adjacent panels, allowing the user to reposition them.\n *\n * @part start - The start panel.\n * @part end - The end panel.\n * @part panel - Targets both the start and end panels.\n * @part divider - The divider that separates the start and end panels.\n *\n * @slot start - The start panel.\n * @slot end - The end panel.\n * @slot handle - An optional handle to render at the center of the divider.\n */\n@Component({\n  tag: 'nano-split-pane',\n  styleUrl: 'split-pane.scss',\n  shadow: true,\n})\nexport class SplitPane implements ComponentInterface {\n  @Element() host: HTMLNanoSplitPaneElement;\n  private cachedPositionInPixels: number;\n  private ro: ResizeObserver;\n  private isAnimating = false;\n  private didLoad = false;\n\n  private get size() {\n    const { width, height } = this.host.getBoundingClientRect();\n    return this.vertical ? height : width;\n  }\n\n  private get shouldAnimate() {\n    return this.didLoad && this._shouldAnimate;\n  }\n  private set shouldAnimate(sa: boolean) {\n    this._shouldAnimate = sa;\n  }\n  private _shouldAnimate: boolean = true;\n\n  constructor() {\n    this.handlePositionChange = debounce(\n      this.handlePositionChange.bind(this),\n      100\n    );\n  }\n\n  /**\n   * The current position of the divider from the primary panel's edge as a percentage 0-100. Defaults to 50% of the\n   * container's initial size.\n   */\n  @Prop()\n  get position() {\n    return this._position;\n  }\n  set position(pos: number) {\n    // override too high / low\n    pos = Math.min(Math.max(pos, 0), 100);\n    if (isNaN(pos) || pos === this._position) return;\n\n    if (\n      this.shouldAnimate &&\n      this.animationDuration > 0 &&\n      !isNaN(this.position)\n    ) {\n      this.animatePosition(pos);\n      return;\n    }\n    this._position = pos;\n  }\n  private _position: number;\n\n  // eslint-disable-next-line @stencil/no-unused-watch\n  @Watch('position')\n  handlePositionChange() {\n    this.cachedPositionInPixels = this.percentageToPixels(this.position);\n    this.positionInPixels = this.percentageToPixels(this.position);\n    this.nanoReposition.emit();\n  }\n\n  /**\n   * The current position of the divider from the primary panel's edge in pixels.\n   */\n  @Prop({ mutable: true }) positionInPixels: number;\n\n  @Watch('positionInPixels')\n  handlePositionInPixelsChange() {\n    this.position = this.pixelsToPercentage(this.positionInPixels);\n  }\n\n  /** Draws the split panel in a vertical orientation with the start and end panels stacked. */\n  @Prop({ reflect: true }) vertical = false;\n\n  /** Disables resizing. Note that the position may still change as a result of resizing the host element. */\n  @Prop({ reflect: true }) disabled = false;\n\n  /**\n   * If no primary panel is designated, both panels will resize proportionally when the host element is resized. If a\n   * primary panel is designated, it will maintain its size and the other panel will grow or shrink as needed when the\n   * host element is resized.\n   */\n  @Prop() primary?: 'start' | 'end';\n\n  /**\n   * One or more space-separated values at which the divider should snap. Values can be in pixels or percentages, e.g.\n   * `\"100px 50%\"`.\n   */\n  @Prop() snap?: string;\n\n  /** How close the divider must be to a snap point until snapping occurs. */\n  @Prop() snapThreshold = 12;\n\n  /** When changing `position` via property, the pane will animate into position. Make `animationDuration` 0 to disable. */\n  @Prop() animationDuration = 0.6;\n\n  /** Emitted when the divider's position changes. */\n  @Event() nanoReposition: EventEmitter;\n\n  /** Emitted when the divider is being dragged. */\n  @Event() nanoDragging: EventEmitter<number>;\n\n  // Private logic\n\n  private animatePosition(end: number) {\n    if (this.isAnimating) return;\n\n    const duration = this.animationDuration; // seconds\n    const fps = 60;\n    const start = this.position;\n    const distance = end - start;\n\n    let position = start;\n    let time = 0;\n\n    function easeInOutQuad(t: number, s: number, e: number, d: number) {\n      if ((t /= d / 2) < 1) return (e / 2) * t * t + s;\n      else return (-e / 2) * (--t * (t - 2) - 1) + s;\n    }\n\n    const go = () => {\n      time += 1 / fps;\n      position = easeInOutQuad(time, start, distance, duration);\n\n      if (\n        (end > start && position >= end) ||\n        (end < start && position <= end)\n      ) {\n        this.position = end;\n        this.shouldAnimate = true;\n        this.isAnimating = false;\n        return;\n      }\n      this.position = position;\n      raf(go);\n    };\n\n    this.shouldAnimate = false;\n    this.isAnimating = true;\n    raf(go);\n  }\n\n  private percentageToPixels(value: number) {\n    return this.size * (value / 100);\n  }\n\n  private pixelsToPercentage(value: number) {\n    return (value / this.size) * 100;\n  }\n\n  private attachRO() {\n    this.detachRO();\n    this.ro = new ResizeObserver(() => this.handleResize());\n    this.ro.observe(this.host);\n  }\n\n  private detachRO() {\n    if (!this.ro) return;\n    this.ro.unobserve(this.host);\n    this.ro = undefined;\n  }\n\n  // Event handlers\n\n  private handleDrag = (e: Event) => {\n    if (this.disabled) {\n      return;\n    }\n\n    // Prevent text selection when dragging\n    e.preventDefault();\n\n    drag(this.host, (x, y) => {\n      let newPositionInPixels = this.vertical ? y : x;\n\n      this.nanoDragging.emit(newPositionInPixels);\n\n      // Flip for end panels\n      if (this.primary === 'end') {\n        newPositionInPixels = this.size - newPositionInPixels;\n      }\n\n      // Check snap points\n      if (this.snap) {\n        const snaps = this.snap.split(' ');\n\n        snaps.forEach((value) => {\n          let snapPoint: number;\n\n          if (value.endsWith('%')) {\n            snapPoint = this.size * (parseFloat(value) / 100);\n          } else {\n            snapPoint = parseFloat(value);\n          }\n\n          if (\n            newPositionInPixels >= snapPoint - this.snapThreshold &&\n            newPositionInPixels <= snapPoint + this.snapThreshold\n          ) {\n            newPositionInPixels = snapPoint;\n          }\n        });\n      }\n      this.shouldAnimate = false;\n      this.position = clamp(\n        this.pixelsToPercentage(newPositionInPixels),\n        0,\n        100\n      );\n      raf(() => (this.shouldAnimate = true));\n    });\n  };\n\n  private handleKeyDown = (event: KeyboardEvent) => {\n    if (this.disabled) {\n      return;\n    }\n\n    if (\n      [\n        'ArrowLeft',\n        'ArrowRight',\n        'ArrowUp',\n        'ArrowDown',\n        'Home',\n        'End',\n      ].includes(event.key)\n    ) {\n      let newPosition = this.position;\n      const incr =\n        (event.shiftKey ? 10 : 1) * (this.primary === 'end' ? -1 : 1);\n\n      event.preventDefault();\n\n      if (\n        (event.key === 'ArrowLeft' && !this.vertical) ||\n        (event.key === 'ArrowUp' && this.vertical)\n      ) {\n        newPosition -= incr;\n      }\n\n      if (\n        (event.key === 'ArrowRight' && !this.vertical) ||\n        (event.key === 'ArrowDown' && this.vertical)\n      ) {\n        newPosition += incr;\n      }\n\n      if (event.key === 'Home') {\n        newPosition = this.primary === 'end' ? 100 : 0;\n      }\n\n      if (event.key === 'End') {\n        newPosition = this.primary === 'end' ? 0 : 100;\n      }\n\n      this.shouldAnimate = false;\n\n      this.position = clamp(newPosition, 0, 100);\n      raf(() => (this.shouldAnimate = true));\n    }\n  };\n\n  private handleResize = () => {\n    if (!this.didLoad || this.isAnimating) return;\n\n    // Resize when a primary panel is set\n    if (this.primary) {\n      this.shouldAnimate = false;\n      this.position = this.pixelsToPercentage(this.cachedPositionInPixels);\n      raf(() => (this.shouldAnimate = true));\n    }\n  };\n\n  componentDidLoad(): void {\n    if (this.positionInPixels) this.handlePositionInPixelsChange();\n    setTimeout(() => (this.didLoad = true));\n  }\n\n  connectedCallback() {\n    this.cachedPositionInPixels = this.percentageToPixels(this.position);\n    this.attachRO();\n  }\n\n  disconnectedCallback() {\n    this.detachRO();\n  }\n\n  componentDidRender(): void {\n    // bit hacky ... because we use getter / setter for position, there's a render *before* `position` is passed in via attribute\n    // if we set a default position in the class, this causes the divider to jump (from default to user set position)\n    // so - wait a render, see if there's a position passed in via attribute, *then* set default if not\n    raf(() => {\n      if (typeof this.position === 'undefined') {\n        this.position = 50;\n      }\n    });\n  }\n\n  render() {\n    if (typeof this.position === 'undefined') return;\n    const styles: { gridTemplateRows?: string; gridTemplateColumns?: string } =\n      {};\n    const gridTemplate = this.vertical\n      ? 'gridTemplateRows'\n      : 'gridTemplateColumns';\n    const primary = `\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    `;\n    const secondary = 'auto';\n\n    if (this.primary === 'end') {\n      styles[gridTemplate] = `${secondary} var(--divider-width) ${primary}`;\n    } else {\n      styles[gridTemplate] = `${primary} var(--divider-width) ${secondary}`;\n    }\n\n    return (\n      <Host style={styles}>\n        <div part=\"panel start\" class=\"start\">\n          <slot name=\"start\"></slot>\n        </div>\n        <div\n          part=\"divider\"\n          class=\"divider\"\n          tabindex={this.disabled ? undefined : '0'}\n          role=\"separator\"\n          aria-label=\"Resize\"\n          onKeyDown={this.handleKeyDown}\n          onMouseDown={this.handleDrag}\n          onTouchStart={this.handleDrag}\n        >\n          <slot name=\"handle\">\n            {!this.disabled && this.vertical ? (\n              <nano-icon slot=\"handle\" name=\"solid/grip-lines\" />\n            ) : (\n              <nano-icon slot=\"handle\" name=\"solid/grip-lines-vertical\" />\n            )}\n          </slot>\n        </div>\n        <div part=\"panel end\" class=\"end\">\n          <slot name=\"end\"></slot>\n        </div>\n      </Host>\n    );\n  }\n}\n"]}

package/dist/types/components/split-pane/split-pane.d.ts

@@ -54,17 +54,15 @@ export declare class SplitPane implements ComponentInterface {
   snapThreshold: number;
   /** When changing `position` via property, the pane will animate into position. Make `animationDuration` 0 to disable. */
   animationDuration: number;
-  /** @readonly - hook to know if the pane is currently being dragged */
-  get isDragging(): boolean;
-  private _isDragging;
   /** Emitted when the divider's position changes. */
   nanoReposition: EventEmitter;
+  /** Emitted when the divider is being dragged. */
+  nanoDragging: EventEmitter<number>;
   private animatePosition;
   private percentageToPixels;
   private pixelsToPercentage;
   private attachRO;
   private detachRO;
-  private handleIsDragging;
   private handleDrag;
   private handleKeyDown;
   private handleResize;

package/dist/types/components.d.ts

@@ -1693,10 +1693,6 @@ export namespace Components {
           * Disables resizing. Note that the position may still change as a result of resizing the host element.
          */
         "disabled": boolean;
-        /**
-          * @readonly - hook to know if the pane is currently being dragged
-         */
-        "isDragging": boolean;
         /**
           * The current position of the divider from the primary panel's edge as a percentage 0-100. Defaults to 50% of the container's initial size.
          */
@@ -4006,9 +4002,9 @@ declare namespace LocalJSX {
          */
         "disabled"?: boolean;
         /**
-          * @readonly - hook to know if the pane is currently being dragged
+          * Emitted when the divider is being dragged.
          */
-        "isDragging"?: boolean;
+        "onNanoDragging"?: (event: CustomEvent<number>) => void;
         /**
           * Emitted when the divider's position changes.
          */

package/docs-json.json

@@ -1,5 +1,5 @@
 {
-  "timestamp": "2022-05-06T15:07:19",
+  "timestamp": "2022-05-06T16:49:44",
   "compiler": {
     "name": "@stencil/core",
     "version": "2.12.2",
@@ -12314,30 +12314,6 @@
           "getter": false,
           "setter": false
         },
-        {
-          "name": "isDragging",
-          "type": "boolean",
-          "mutable": false,
-          "attr": "is-dragging",
-          "reflectToAttr": true,
-          "docs": "",
-          "docsTags": [
-            {
-              "name": "readonly",
-              "text": "- hook to know if the pane is currently being dragged"
-            }
-          ],
-          "default": "false",
-          "values": [
-            {
-              "type": "boolean"
-            }
-          ],
-          "optional": false,
-          "required": false,
-          "getter": true,
-          "setter": false
-        },
         {
           "name": "position",
           "type": "number",
@@ -12456,6 +12432,15 @@
       ],
       "methods": [],
       "events": [
+        {
+          "event": "nanoDragging",
+          "detail": "number",
+          "bubbles": true,
+          "cancelable": true,
+          "composed": true,
+          "docs": "Emitted when the divider is being dragged.",
+          "docsTags": []
+        },
         {
           "event": "nanoReposition",
           "detail": "any",

package/docs-vscode.json

@@ -2313,10 +2313,6 @@
           "name": "disabled",
           "description": "Disables resizing. Note that the position may still change as a result of resizing the host element."
         },
-        {
-          "name": "is-dragging",
-          "description": ""
-        },
         {
           "name": "position",
           "description": "The current position of the divider from the primary panel's edge as a percentage 0-100. Defaults to 50% of the\ncontainer's initial size."

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nanoporetech-digital/components",
-  "version": "2.2.0",
+  "version": "2.2.1",
   "repository": {
     "type": "git",
     "url": "https://git.oxfordnanolabs.local/Digital/nano-components"
@@ -126,5 +126,5 @@
   "peerDependencies": {
     "@stencil/core": "^2.5.0"
   },
-  "gitHead": "50db749d1d853728731a756c260450b50247e4cc"
+  "gitHead": "c53e8785f9b90074379cf31b2a22207350762cce"
 }

package/dist/nano-components/p-d628547b.entry.js

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

package/dist/nano-components/p-d628547b.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["src/utils/drag.ts","src/components/split-pane/split-pane.scss?tag=nano-split-pane&encapsulation=shadow","src/components/split-pane/split-pane.tsx"],"names":["drag","container","onMove","move","pointerEvent","dims","getBoundingClientRect","defaultView","ownerDocument","offsetX","left","pageXOffset","offsetY","top","pageYOffset","x","pageX","y","pageY","stop","document","removeEventListener","addEventListener","passive","splitPaneCss","SplitPane","[object Object]","hostRef","this","isAnimating","didLoad","_shouldAnimate","vertical","disabled","snapThreshold","animationDuration","_isDragging","handleIsDragging","dragging","handleDrag","e","preventDefault","host","newPositionInPixels","primary","size","snap","snaps","split","forEach","value","snapPoint","endsWith","parseFloat","shouldAnimate","position","clamp","pixelsToPercentage","raf","handleKeyDown","event","includes","key","newPosition","incr","shiftKey","handleResize","cachedPositionInPixels","handlePositionChange","debounce","bind","width","height","sa","_position","pos","Math","min","max","isNaN","animatePosition","percentageToPixels","positionInPixels","nanoReposition","emit","isDragging","end","duration","fps","start","distance","time","easeInOutQuad","t","s","d","go","detachRO","ro","ResizeObserver","observe","unobserve","undefined","handlePositionInPixelsChange","setTimeout","attachRO","styles","gridTemplate","secondary","h","Host","style","part","class","name","tabindex","role","aria-label","onKeyDown","onMouseDown","onTouchStart","slot"],"mappings":"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","sourcesContent":["export function drag(\n  container: HTMLElement,\n  onMove: (x: number, y: number) => void\n) {\n  function move(pointerEvent: PointerEvent) {\n    const dims = container.getBoundingClientRect();\n    const defaultView = container.ownerDocument.defaultView!;\n    const offsetX = dims.left + defaultView.pageXOffset;\n    const offsetY = dims.top + defaultView.pageYOffset;\n    const x = pointerEvent.pageX - offsetX;\n    const y = pointerEvent.pageY - offsetY;\n\n    onMove(x, y);\n  }\n\n  function stop() {\n    document.removeEventListener('pointermove', move);\n    document.removeEventListener('pointerup', stop);\n  }\n\n  document.addEventListener('pointermove', move, { passive: true });\n  document.addEventListener('pointerup', stop);\n}\n","@use 'sass:map';\n@use 'sass:list';\n\n@import '../../global/style/nano-theme/components';\n@import '../../global/style/nano-theme/form';\n\n:host {\n  /**\n  * @prop --divider-width: The width of the visible divider. Default 4px.\n  * @prop --divider-hit-area: The invisible region around the divider where dragging can occur. This is\n  *  usually wider than the divider to facilitate easier dragging. Default 12px.\n  * @prop --min: The minimum allowed size of the primary panel. Default 0.\n  * @prop --max: The maximum allowed size of the primary panel. Default 100%.\n  * @prop --background-color: Handle background. Default #{map.get($colors, lightgrey)}.\n  * @prop --content-color: Handle color. Default #{map.get($colors, dimgrey)}.\n  */\n  --divider-width: 12px;\n  --divider-hit-area: 14px;\n  --min: 0%;\n  --max: 100%;\n  --background-color: #{map.get($colors, lightgrey)};\n  --content-color: #{map.get($colors, dimgrey)};\n\n  display: grid;\n}\n\n.start,\n.end {\n  overflow: hidden;\n}\n\n.divider {\n  flex: 0 0 var(--divider-width);\n  display: flex;\n  position: relative;\n  align-items: center;\n  justify-content: center;\n  background-color: var(--background-color);\n  color: var(--content-color);\n  z-index: 1;\n  font-size: 0.8rem;\n}\n\n.divider:focus {\n  outline: none;\n}\n\n:host(:not([disabled])) .divider:focus-visible {\n  background-color: #{$control-focus-color};\n}\n\n:host([disabled]) .divider {\n  cursor: not-allowed;\n}\n\n/* Horizontal */\n:host(:not([vertical], [disabled])) .divider {\n  cursor: col-resize;\n}\n\n:host(:not([vertical])) .divider::after {\n  display: flex;\n  content: '';\n  position: absolute;\n  height: 100%;\n  left: calc(var(--divider-hit-area) / -2 + var(--divider-width) / 2);\n  width: var(--divider-hit-area);\n}\n\n/* Vertical */\n:host([vertical]) {\n  flex-direction: column;\n}\n\n:host([vertical]:not([disabled])) .divider {\n  cursor: row-resize;\n}\n\n:host([vertical]) .divider::after {\n  content: '';\n  position: absolute;\n  width: 100%;\n  top: calc(var(--divider-hit-area) / -2 + var(--divider-width) / 2);\n  height: var(--divider-hit-area);\n}\n","import {\n  Prop,\n  Component,\n  Watch,\n  Event,\n  EventEmitter,\n  ComponentInterface,\n  Element,\n  Host,\n  h,\n} from '@stencil/core';\nimport { clamp, raf, debounce } from '../../utils';\nimport { drag } from '../../utils/drag';\n\n/**\n * Split panes display two adjacent panels, allowing the user to reposition them.\n *\n * @part start - The start panel.\n * @part end - The end panel.\n * @part panel - Targets both the start and end panels.\n * @part divider - The divider that separates the start and end panels.\n *\n * @slot start - The start panel.\n * @slot end - The end panel.\n * @slot handle - An optional handle to render at the center of the divider.\n */\n@Component({\n  tag: 'nano-split-pane',\n  styleUrl: 'split-pane.scss',\n  shadow: true,\n})\nexport class SplitPane implements ComponentInterface {\n  @Element() host: HTMLNanoSplitPaneElement;\n  private cachedPositionInPixels: number;\n  private ro: ResizeObserver;\n  private isAnimating = false;\n  private didLoad = false;\n\n  private get size() {\n    const { width, height } = this.host.getBoundingClientRect();\n    return this.vertical ? height : width;\n  }\n\n  private get shouldAnimate() {\n    return this.didLoad && this._shouldAnimate;\n  }\n  private set shouldAnimate(sa: boolean) {\n    this._shouldAnimate = sa;\n  }\n  private _shouldAnimate: boolean = true;\n\n  constructor() {\n    this.handlePositionChange = debounce(\n      this.handlePositionChange.bind(this),\n      100\n    );\n    this.handleIsDragging = debounce(this.handleIsDragging, 200);\n  }\n\n  /**\n   * The current position of the divider from the primary panel's edge as a percentage 0-100. Defaults to 50% of the\n   * container's initial size.\n   */\n  @Prop()\n  get position() {\n    return this._position;\n  }\n  set position(pos: number) {\n    // override too high / low\n    pos = Math.min(Math.max(pos, 0), 100);\n    if (isNaN(pos) || pos === this._position) return;\n\n    if (this.shouldAnimate && this.animationDuration > 0) {\n      this.animatePosition(pos);\n      return;\n    }\n    this._position = pos;\n  }\n  private _position: number;\n\n  // eslint-disable-next-line @stencil/no-unused-watch\n  @Watch('position')\n  handlePositionChange() {\n    this.cachedPositionInPixels = this.percentageToPixels(this.position);\n    this.positionInPixels = this.percentageToPixels(this.position);\n    this.nanoReposition.emit();\n  }\n\n  /**\n   * The current position of the divider from the primary panel's edge in pixels.\n   */\n  @Prop({ mutable: true }) positionInPixels: number;\n\n  @Watch('positionInPixels')\n  handlePositionInPixelsChange() {\n    this.position = this.pixelsToPercentage(this.positionInPixels);\n  }\n\n  /** Draws the split panel in a vertical orientation with the start and end panels stacked. */\n  @Prop({ reflect: true }) vertical = false;\n\n  /** Disables resizing. Note that the position may still change as a result of resizing the host element. */\n  @Prop({ reflect: true }) disabled = false;\n\n  /**\n   * If no primary panel is designated, both panels will resize proportionally when the host element is resized. If a\n   * primary panel is designated, it will maintain its size and the other panel will grow or shrink as needed when the\n   * host element is resized.\n   */\n  @Prop() primary?: 'start' | 'end';\n\n  /**\n   * One or more space-separated values at which the divider should snap. Values can be in pixels or percentages, e.g.\n   * `\"100px 50%\"`.\n   */\n  @Prop() snap?: string;\n\n  /** How close the divider must be to a snap point until snapping occurs. */\n  @Prop() snapThreshold = 12;\n\n  /** When changing `position` via property, the pane will animate into position. Make `animationDuration` 0 to disable. */\n  @Prop() animationDuration = 0.6;\n\n  /** @readonly - hook to know if the pane is currently being dragged */\n  @Prop({ reflect: true }) get isDragging() {\n    return this._isDragging;\n  }\n  private _isDragging = false;\n\n  /** Emitted when the divider's position changes. */\n  @Event() nanoReposition: EventEmitter;\n\n  // Private logic\n\n  private animatePosition(end: number) {\n    if (this.isAnimating) return;\n\n    const duration = this.animationDuration; // seconds\n    const fps = 60;\n    const start = this.position;\n    const distance = end - start;\n\n    let position = start;\n    let time = 0;\n\n    function easeInOutQuad(t: number, s: number, e: number, d: number) {\n      if ((t /= d / 2) < 1) return (e / 2) * t * t + s;\n      else return (-e / 2) * (--t * (t - 2) - 1) + s;\n    }\n\n    const go = () => {\n      time += 1 / fps;\n      position = easeInOutQuad(time, start, distance, duration);\n\n      if (\n        (end > start && position >= end) ||\n        (end < start && position <= end)\n      ) {\n        this.position = end;\n        this.shouldAnimate = true;\n        this.isAnimating = false;\n        return;\n      }\n      this.position = position;\n      raf(go);\n    };\n\n    this.shouldAnimate = false;\n    this.isAnimating = true;\n    raf(go);\n  }\n\n  private percentageToPixels(value: number) {\n    return this.size * (value / 100);\n  }\n\n  private pixelsToPercentage(value: number) {\n    return (value / this.size) * 100;\n  }\n\n  private attachRO() {\n    this.detachRO();\n    this.ro = new ResizeObserver(() => this.handleResize());\n    this.ro.observe(this.host);\n  }\n\n  private detachRO() {\n    if (!this.ro) return;\n    this.ro.unobserve(this.host);\n    this.ro = undefined;\n  }\n\n  private handleIsDragging = (dragging?: boolean) => {\n    this._isDragging = dragging;\n  };\n\n  // Event handlers\n\n  private handleDrag = (e: Event) => {\n    if (this.disabled) {\n      return;\n    }\n\n    // Prevent text selection when dragging\n    e.preventDefault();\n\n    drag(this.host, (x, y) => {\n      this.handleIsDragging(true);\n      let newPositionInPixels = this.vertical ? y : x;\n\n      // Flip for end panels\n      if (this.primary === 'end') {\n        newPositionInPixels = this.size - newPositionInPixels;\n      }\n\n      // Check snap points\n      if (this.snap) {\n        const snaps = this.snap.split(' ');\n\n        snaps.forEach((value) => {\n          let snapPoint: number;\n\n          if (value.endsWith('%')) {\n            snapPoint = this.size * (parseFloat(value) / 100);\n          } else {\n            snapPoint = parseFloat(value);\n          }\n\n          if (\n            newPositionInPixels >= snapPoint - this.snapThreshold &&\n            newPositionInPixels <= snapPoint + this.snapThreshold\n          ) {\n            newPositionInPixels = snapPoint;\n          }\n        });\n      }\n      this.shouldAnimate = false;\n      this.position = clamp(\n        this.pixelsToPercentage(newPositionInPixels),\n        0,\n        100\n      );\n      raf(() => (this.shouldAnimate = true));\n      this.handleIsDragging(false);\n    });\n  };\n\n  private handleKeyDown = (event: KeyboardEvent) => {\n    if (this.disabled) {\n      return;\n    }\n\n    if (\n      [\n        'ArrowLeft',\n        'ArrowRight',\n        'ArrowUp',\n        'ArrowDown',\n        'Home',\n        'End',\n      ].includes(event.key)\n    ) {\n      let newPosition = this.position;\n      const incr =\n        (event.shiftKey ? 10 : 1) * (this.primary === 'end' ? -1 : 1);\n\n      event.preventDefault();\n\n      if (\n        (event.key === 'ArrowLeft' && !this.vertical) ||\n        (event.key === 'ArrowUp' && this.vertical)\n      ) {\n        newPosition -= incr;\n      }\n\n      if (\n        (event.key === 'ArrowRight' && !this.vertical) ||\n        (event.key === 'ArrowDown' && this.vertical)\n      ) {\n        newPosition += incr;\n      }\n\n      if (event.key === 'Home') {\n        newPosition = this.primary === 'end' ? 100 : 0;\n      }\n\n      if (event.key === 'End') {\n        newPosition = this.primary === 'end' ? 0 : 100;\n      }\n\n      this.shouldAnimate = false;\n\n      this.position = clamp(newPosition, 0, 100);\n      raf(() => (this.shouldAnimate = true));\n    }\n  };\n\n  private handleResize = () => {\n    if (!this.didLoad || this.isAnimating) return;\n\n    // Resize when a primary panel is set\n    if (this.primary) {\n      this.shouldAnimate = false;\n      this.position = this.pixelsToPercentage(this.cachedPositionInPixels);\n      raf(() => (this.shouldAnimate = true));\n    }\n  };\n\n  componentDidLoad(): void {\n    if (this.positionInPixels) this.handlePositionInPixelsChange();\n    setTimeout(() => (this.didLoad = true));\n  }\n\n  connectedCallback() {\n    this.cachedPositionInPixels = this.percentageToPixels(this.position);\n    this.attachRO();\n  }\n\n  disconnectedCallback() {\n    this.detachRO();\n  }\n\n  componentDidRender(): void {\n    // bit hacky ... because we use getter / setter for position, there's a render *before* `position` is passed in via attribute\n    // if we set a default position in the class, this causes the divider to jump (from default to user set position)\n    // so - wait a render, see if there's a position passed in via attribute, *then* set default if not\n    raf(() => {\n      if (this.position === undefined) this.position = 50;\n    });\n  }\n\n  render() {\n    if (!this.position) return;\n    const styles: { gridTemplateRows?: string; gridTemplateColumns?: string } =\n      {};\n    const gridTemplate = this.vertical\n      ? 'gridTemplateRows'\n      : 'gridTemplateColumns';\n    const primary = `\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    `;\n    const secondary = 'auto';\n\n    if (this.primary === 'end') {\n      styles[gridTemplate] = `${secondary} var(--divider-width) ${primary}`;\n    } else {\n      styles[gridTemplate] = `${primary} var(--divider-width) ${secondary}`;\n    }\n\n    return (\n      <Host style={styles}>\n        <div part=\"panel start\" class=\"start\">\n          <slot name=\"start\"></slot>\n        </div>\n        <div\n          part=\"divider\"\n          class=\"divider\"\n          tabindex={this.disabled ? undefined : '0'}\n          role=\"separator\"\n          aria-label=\"Resize\"\n          onKeyDown={this.handleKeyDown}\n          onMouseDown={this.handleDrag}\n          onTouchStart={this.handleDrag}\n        >\n          <slot name=\"handle\">\n            {!this.disabled && this.vertical ? (\n              <nano-icon slot=\"handle\" name=\"solid/grip-lines\" />\n            ) : (\n              <nano-icon slot=\"handle\" name=\"solid/grip-lines-vertical\" />\n            )}\n          </slot>\n        </div>\n        <div part=\"panel end\" class=\"end\">\n          <slot name=\"end\"></slot>\n        </div>\n      </Host>\n    );\n  }\n}\n"]}

package/dist/nano-components/p-d87ebf95.system.entry.js

@@ -1,5 +0,0 @@
-/*!
- * Web Components for Nanopore digital Web Apps
- */
-System.register(["./p-59b3d24b.system.js","./p-1c216ca4.system.js","./p-ef053a2f.system.js"],(function(i){"use strict";var e,t,n,o,r,s,a,d;return{setters:[function(i){e=i.r;t=i.c;n=i.h;o=i.e;r=i.g},function(i){s=i.c;a=i.r},function(i){d=i.d}],execute:function(){function l(i,e){function t(t){var n=i.getBoundingClientRect();var o=i.ownerDocument.defaultView;var r=n.left+o.pageXOffset;var s=n.top+o.pageYOffset;var a=t.pageX-r;var d=t.pageY-s;e(a,d)}function n(){document.removeEventListener("pointermove",t);document.removeEventListener("pointerup",n)}document.addEventListener("pointermove",t,{passive:true});document.addEventListener("pointerup",n)}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{--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 c=i("nano_split_pane",function(){function i(i){var n=this;e(this,i);this.nanoReposition=t(this,"nanoReposition",7);this.isAnimating=false;this.didLoad=false;this._shouldAnimate=true;this.vertical=false;this.disabled=false;this.snapThreshold=12;this.animationDuration=.6;this._isDragging=false;this.handleIsDragging=function(i){n._isDragging=i};this.handleDrag=function(i){if(n.disabled){return}i.preventDefault();l(n.host,(function(i,e){n.handleIsDragging(true);var t=n.vertical?e:i;if(n.primary==="end"){t=n.size-t}if(n.snap){var o=n.snap.split(" ");o.forEach((function(i){var e;if(i.endsWith("%")){e=n.size*(parseFloat(i)/100)}else{e=parseFloat(i)}if(t>=e-n.snapThreshold&&t<=e+n.snapThreshold){t=e}}))}n.shouldAnimate=false;n.position=s(n.pixelsToPercentage(t),0,100);a((function(){return n.shouldAnimate=true}));n.handleIsDragging(false)}))};this.handleKeyDown=function(i){if(n.disabled){return}if(["ArrowLeft","ArrowRight","ArrowUp","ArrowDown","Home","End"].includes(i.key)){var e=n.position;var t=(i.shiftKey?10:1)*(n.primary==="end"?-1:1);i.preventDefault();if(i.key==="ArrowLeft"&&!n.vertical||i.key==="ArrowUp"&&n.vertical){e-=t}if(i.key==="ArrowRight"&&!n.vertical||i.key==="ArrowDown"&&n.vertical){e+=t}if(i.key==="Home"){e=n.primary==="end"?100:0}if(i.key==="End"){e=n.primary==="end"?0:100}n.shouldAnimate=false;n.position=s(e,0,100);a((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);a((function(){return n.shouldAnimate=true}))}};this.handlePositionChange=d(this.handlePositionChange.bind(this),100);this.handleIsDragging=d(this.handleIsDragging,200)}Object.defineProperty(i.prototype,"size",{get:function(){var i=this.host.getBoundingClientRect(),e=i.width,t=i.height;return this.vertical?t:e},enumerable:false,configurable:true});Object.defineProperty(i.prototype,"shouldAnimate",{get:function(){return this.didLoad&&this._shouldAnimate},set:function(i){this._shouldAnimate=i},enumerable:false,configurable:true});Object.defineProperty(i.prototype,"position",{get:function(){return this._position},set:function(i){i=Math.min(Math.max(i,0),100);if(isNaN(i)||i===this._position)return;if(this.shouldAnimate&&this.animationDuration>0){this.animatePosition(i);return}this._position=i},enumerable:false,configurable:true});i.prototype.handlePositionChange=function(){this.cachedPositionInPixels=this.percentageToPixels(this.position);this.positionInPixels=this.percentageToPixels(this.position);this.nanoReposition.emit()};i.prototype.handlePositionInPixelsChange=function(){this.position=this.pixelsToPercentage(this.positionInPixels)};Object.defineProperty(i.prototype,"isDragging",{get:function(){return this._isDragging},enumerable:false,configurable:true});i.prototype.animatePosition=function(i){var e=this;if(this.isAnimating)return;var t=this.animationDuration;var n=60;var o=this.position;var r=i-o;var s=o;var d=0;function l(i,e,t,n){if((i/=n/2)<1)return t/2*i*i+e;else return-t/2*(--i*(i-2)-1)+e}var h=function(){d+=1/n;s=l(d,o,r,t);if(i>o&&s>=i||i<o&&s<=i){e.position=i;e.shouldAnimate=true;e.isAnimating=false;return}e.position=s;a(h)};this.shouldAnimate=false;this.isAnimating=true;a(h)};i.prototype.percentageToPixels=function(i){return this.size*(i/100)};i.prototype.pixelsToPercentage=function(i){return i/this.size*100};i.prototype.attachRO=function(){var i=this;this.detachRO();this.ro=new ResizeObserver((function(){return i.handleResize()}));this.ro.observe(this.host)};i.prototype.detachRO=function(){if(!this.ro)return;this.ro.unobserve(this.host);this.ro=undefined};i.prototype.componentDidLoad=function(){var i=this;if(this.positionInPixels)this.handlePositionInPixelsChange();setTimeout((function(){return i.didLoad=true}))};i.prototype.connectedCallback=function(){this.cachedPositionInPixels=this.percentageToPixels(this.position);this.attachRO()};i.prototype.disconnectedCallback=function(){this.detachRO()};i.prototype.componentDidRender=function(){var i=this;a((function(){if(i.position===undefined)i.position=50}))};i.prototype.render=function(){if(!this.position)return;var i={};var e=this.vertical?"gridTemplateRows":"gridTemplateColumns";var t="\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"){i[e]=r+" var(--divider-width) "+t}else{i[e]=t+" var(--divider-width) "+r}return n(o,{style:i},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(i.prototype,"host",{get:function(){return r(this)},enumerable:false,configurable:true});Object.defineProperty(i,"watchers",{get:function(){return{position:["handlePositionChange"],positionInPixels:["handlePositionInPixelsChange"]}},enumerable:false,configurable:true});return i}());c.style=h}}}));
-//# sourceMappingURL=p-d87ebf95.system.entry.js.map