npm - @nanoporetech-digital/components - Versions diffs - 2.13.2 → 2.14.1 - Mend

@nanoporetech-digital/components 2.13.2 → 2.14.1

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

Files changed (83) hide show

package/dist/nano-components/p-53957ec6.system.js CHANGED Viewed

@@ -1,5 +1,5 @@
 /*!
  * Web Components for Nanopore digital Web Apps
  */
-System.register(["./p-f48be9f5.system.js","./p-82e28afd.system.js"],(function(e,a){"use strict";var t,o,n,s,i,l,r;return{setters:[function(e){t=e.p;o=e.w;n=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 d=function(){{t.$cssShim$=o.__cssshim}{h(l.prototype)}var e=Array.from(n.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;{c(r.resourcesUrl,e)}if(!o.customElements){return a.import("./p-5b6c304c.system.js").then((function(){return r}))}}return i(r)};var c=function(a,t){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 d=n.createElement("script");d.type="module";d.crossOrigin=t.crossOrigin;d.src=URL.createObjectURL(new Blob(["import * as m from '"+s+"'; window."+i+".m = m;"],{type:"application/javascript"}));r=new Promise((function(e){d.onload=function(){e(o[i].m);d.remove()}}));l.set(s,r);n.head.appendChild(d)}return r}}};var h=function(e){var a=e.cloneNode;e.cloneNode=function(e){if(this.nodeName==="TEMPLATE"){return a.call(this,e)}var t=a.call(this,false);var o=this.childNodes;if(e){for(var n=0;n<o.length;n++){if(o[n].nodeType!==2){t.appendChild(o[n].cloneNode(true))}}}return t}};d().then((function(e){return r(JSON.parse('[["p-5b66bb8f.system",[[1,"nano-global-nav",{"env":[1],"ssoDataUrl":[1,"sso-data-url"],"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-39d36fd1.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-596c1711.system",[[6,"nano-date-input",{"invalid":[2564],"validityMessage":[2049,"validity-message"],"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"],"dropDownConfig":[6160],"dateValue":[2064],"isDateDisabled":[16],"pattern":[32],"inputValue":[32],"_invalid":[32],"reportValidity":[64],"setFocus":[64],"getInputElement":[64],"showError":[64]}]]],["p-7ad4a27a.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"],"hoist":[4],"isVisible":[32],"noDismiss":[32],"hasFooter":[32],"show":[64],"hide":[64]}]]],["p-a07cf44c.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"],"form":[1],"invalid":[2564],"validityMessage":[2049,"validity-message"],"files":[6160],"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"],[16,"reset","onReset"]]]]],["p-0c6c2141.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-6a949280.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-93596c3d.system",[[1,"nano-tab",{"panel":[513],"active":[516],"disabled":[516],"closable":[4],"setFocus":[64],"removeFocus":[64]}]]],["p-5100ae70.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-21af2a5e.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"],"getPercentageToPixels":[64],"getPixelsToPercentage":[64]}]]],["p-561500f0.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-a02cc654.system",[[1,"nano-accordion",{"color":[1],"itemOpened":[32]},[[0,"nanoOpened","onToggleHandler"],[0,"nanoClosed","onClosedHandler"]]]]],["p-56f86047.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-379e21d9.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-7f1374b6.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-ab07c1fa.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-0d0dfc06.system",[[1,"nano-aspect-ratio",{"aspectRatio":[1,"aspect-ratio"],"fit":[1]}]]],["p-c070ffd3.system",[[6,"nano-checkbox",{"hasFocus":[1540,"has-focus"],"checked":[1540],"disabled":[516],"value":[513],"name":[513],"required":[516],"type":[513],"label":[1],"indeterminate":[1540],"invalid":[2564],"validityMessage":[2049,"validity-message"],"color":[1],"form":[1],"inputType":[32],"_invalid":[32],"getInputElement":[64],"reportValidity":[64],"setError":[64],"setFocus":[64],"removeFocus":[64]},[[16,"reset","onReset"]]]]],["p-85c8b070.system",[[6,"nano-checkbox-group",{"validateOn":[1025,"validate-on"],"showInlineError":[4,"show-inline-error"],"min":[2],"max":[2],"disabled":[516],"legend":[1],"invalid":[2564],"validityMessage":[2049,"validity-message"],"checkboxes":[32],"nativeCbs":[32],"errorMessage":[32],"showErrorMsg":[32],"hasHelperSlot":[32],"_invalid":[32],"reportValidity":[64],"showError":[64]},[[0,"nanoChange","handleCbChange"]]]]],["p-41899a31.system",[[1,"nano-details",{"label":[1],"open":[1540],"noHandle":[4,"no-handle"],"iconRotation":[2,"icon-rotation"],"color":[1],"isLoading":[32]}]]],["p-52769304.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-3f5de726.system",[[4,"nano-field-validator",{"validateOn":[1025,"validate-on"],"scrollToInvalid":[4,"scroll-to-invalid"],"dirty":[2564],"valid":[2564],"store":[2064],"payload":[2064],"showValidation":[2052,"show-validation"],"validationState":[2064],"extraFieldSelector":[1,"extra-field-selector"],"validation":[16],"submitted":[32],"userForm":[32],"_dirty":[32],"_valid":[32],"_store":[32],"setStore":[64],"setCustomValidity":[64],"resetValidity":[64]}]]],["p-6dad332b.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-316f83a9.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-eacf5b5b.system",[[1,"nano-slide",{"ready":[1540]}]]],["p-371aebe7.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-6b4dd158.system",[[1,"nano-tab-content",{"name":[513],"active":[516]}]]],["p-6af10533.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-b85cf493.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-ff026352.system",[[1,"nano-tooltip",{"content":[1],"placement":[1],"disabled":[4],"distance":[2],"open":[1540],"skidding":[2],"trigger":[1],"show":[64],"hide":[64]}]]],["p-48874481.system",[[1,"nano-spinner",{"type":[1],"overlay":[516],"hasText":[32]}]]],["p-ac5e3775.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-8df4f125.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],"setFocus":[64]}]]],["p-faba2fc1.system",[[1,"nano-resize-observe",{"states":[1],"currentWidth":[32],"currentHeight":[32],"classNames":[32]}],[1,"nano-skeleton",{"animated":[4]}]]],["p-7e55b214.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-7aa7425d.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-aa84c727.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-cb512cff.system",[[6,"nano-select",{"invalid":[2564],"validityMessage":[2049,"validity-message"],"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],"hasHelperEndSlot":[32],"inputSearchVal":[32],"_invalid":[32],"_eOptions":[32],"reportValidity":[64],"setFocus":[64],"getSelectElement":[64],"showError":[64]},[[16,"reset","onReset"],[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"],"notification":[4],"didOpen":[32],"isInGlobalNav":[32],"isInMenuDrawer":[32],"isInMenu":[32],"isLegacy":[32],"hasFocus":[32],"setFocus":[64]}]]],["p-c2bbf0fb.system",[[6,"nano-input",{"invalid":[2564],"validityMessage":[2049,"validity-message"],"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":[513],"form":[1],"value":[1025],"resize":[1],"rows":[2],"showCharCount":[4,"show-char-count"],"hasFocus":[32],"hasLabelSlot":[32],"hasHelperSlot":[32],"hasHelperEndSlot":[32],"errorMessage":[32],"datalist":[32],"_invalid":[32],"reportValidity":[64],"setFocus":[64],"select":[64],"getInputElement":[64],"showError":[64]},[[16,"reset","onReset"],[17,"mousedown","handleBlur"],[0,"keydown","handleBlur"]]]]],["p-e8a913ac.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-f48be9f5.system.js","./p-82e28afd.system.js"],(function(e,a){"use strict";var t,o,n,s,i,l,r;return{setters:[function(e){t=e.p;o=e.w;n=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 d=function(){{t.$cssShim$=o.__cssshim}{h(l.prototype)}var e=Array.from(n.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;{c(r.resourcesUrl,e)}if(!o.customElements){return a.import("./p-5b6c304c.system.js").then((function(){return r}))}}return i(r)};var c=function(a,t){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 d=n.createElement("script");d.type="module";d.crossOrigin=t.crossOrigin;d.src=URL.createObjectURL(new Blob(["import * as m from '"+s+"'; window."+i+".m = m;"],{type:"application/javascript"}));r=new Promise((function(e){d.onload=function(){e(o[i].m);d.remove()}}));l.set(s,r);n.head.appendChild(d)}return r}}};var h=function(e){var a=e.cloneNode;e.cloneNode=function(e){if(this.nodeName==="TEMPLATE"){return a.call(this,e)}var t=a.call(this,false);var o=this.childNodes;if(e){for(var n=0;n<o.length;n++){if(o[n].nodeType!==2){t.appendChild(o[n].cloneNode(true))}}}return t}};d().then((function(e){return r(JSON.parse('[["p-5b66bb8f.system",[[1,"nano-global-nav",{"env":[1],"ssoDataUrl":[1,"sso-data-url"],"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-39d36fd1.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-596c1711.system",[[6,"nano-date-input",{"invalid":[2564],"validityMessage":[2049,"validity-message"],"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"],"dropDownConfig":[6160],"dateValue":[2064],"isDateDisabled":[16],"pattern":[32],"inputValue":[32],"_invalid":[32],"reportValidity":[64],"setFocus":[64],"getInputElement":[64],"showError":[64]}]]],["p-7ad4a27a.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"],"hoist":[4],"isVisible":[32],"noDismiss":[32],"hasFooter":[32],"show":[64],"hide":[64]}]]],["p-a07cf44c.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"],"form":[1],"invalid":[2564],"validityMessage":[2049,"validity-message"],"files":[6160],"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"],[16,"reset","onReset"]]]]],["p-0c6c2141.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-6a949280.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-93596c3d.system",[[1,"nano-tab",{"panel":[513],"active":[516],"disabled":[516],"closable":[4],"setFocus":[64],"removeFocus":[64]}]]],["p-5100ae70.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-21af2a5e.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"],"getPercentageToPixels":[64],"getPixelsToPercentage":[64]}]]],["p-561500f0.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-a02cc654.system",[[1,"nano-accordion",{"color":[1],"itemOpened":[32]},[[0,"nanoOpened","onToggleHandler"],[0,"nanoClosed","onClosedHandler"]]]]],["p-56f86047.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-379e21d9.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-7f1374b6.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-ab07c1fa.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-0d0dfc06.system",[[1,"nano-aspect-ratio",{"aspectRatio":[1,"aspect-ratio"],"fit":[1]}]]],["p-c070ffd3.system",[[6,"nano-checkbox",{"hasFocus":[1540,"has-focus"],"checked":[1540],"disabled":[516],"value":[513],"name":[513],"required":[516],"type":[513],"label":[1],"indeterminate":[1540],"invalid":[2564],"validityMessage":[2049,"validity-message"],"color":[1],"form":[1],"inputType":[32],"_invalid":[32],"getInputElement":[64],"reportValidity":[64],"setError":[64],"setFocus":[64],"removeFocus":[64]},[[16,"reset","onReset"]]]]],["p-85c8b070.system",[[6,"nano-checkbox-group",{"validateOn":[1025,"validate-on"],"showInlineError":[4,"show-inline-error"],"min":[2],"max":[2],"disabled":[516],"legend":[1],"invalid":[2564],"validityMessage":[2049,"validity-message"],"checkboxes":[32],"nativeCbs":[32],"errorMessage":[32],"showErrorMsg":[32],"hasHelperSlot":[32],"_invalid":[32],"reportValidity":[64],"showError":[64]},[[0,"nanoChange","handleCbChange"]]]]],["p-41899a31.system",[[1,"nano-details",{"label":[1],"open":[1540],"noHandle":[4,"no-handle"],"iconRotation":[2,"icon-rotation"],"color":[1],"isLoading":[32]}]]],["p-52769304.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-bc34955f.system",[[4,"nano-field-validator",{"validateOn":[1025,"validate-on"],"scrollToInvalid":[4,"scroll-to-invalid"],"dirty":[2564],"valid":[2564],"store":[2064],"payload":[2064],"showValidation":[2052,"show-validation"],"validationState":[2064],"extraFieldSelector":[1,"extra-field-selector"],"validation":[16],"submitted":[32],"userForm":[32],"_dirty":[32],"_valid":[32],"_store":[32],"setStore":[64],"setCustomValidity":[64],"resetValidity":[64]}]]],["p-6dad332b.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-316f83a9.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-eacf5b5b.system",[[1,"nano-slide",{"ready":[1540]}]]],["p-371aebe7.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-6b4dd158.system",[[1,"nano-tab-content",{"name":[513],"active":[516]}]]],["p-6af10533.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-b85cf493.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-ff026352.system",[[1,"nano-tooltip",{"content":[1],"placement":[1],"disabled":[4],"distance":[2],"open":[1540],"skidding":[2],"trigger":[1],"show":[64],"hide":[64]}]]],["p-48874481.system",[[1,"nano-spinner",{"type":[1],"overlay":[516],"hasText":[32]}]]],["p-ac5e3775.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-8df4f125.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],"setFocus":[64]}]]],["p-faba2fc1.system",[[1,"nano-resize-observe",{"states":[1],"currentWidth":[32],"currentHeight":[32],"classNames":[32]}],[1,"nano-skeleton",{"animated":[4]}]]],["p-7e55b214.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-7aa7425d.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-6ce533f1.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-e7628969.system",[[6,"nano-select",{"invalid":[2564],"validityMessage":[2049,"validity-message"],"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],"hasHelperEndSlot":[32],"inputSearchVal":[32],"_invalid":[32],"_eOptions":[32],"reportValidity":[64],"setFocus":[64],"getSelectElement":[64],"showError":[64]},[[16,"reset","onReset"],[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"],"notification":[4],"didOpen":[32],"isInGlobalNav":[32],"isInMenuDrawer":[32],"isInMenu":[32],"isLegacy":[32],"hasFocus":[32],"setFocus":[64]}]]],["p-c2bbf0fb.system",[[6,"nano-input",{"invalid":[2564],"validityMessage":[2049,"validity-message"],"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":[513],"form":[1],"value":[1025],"resize":[1],"rows":[2],"showCharCount":[4,"show-char-count"],"hasFocus":[32],"hasLabelSlot":[32],"hasHelperSlot":[32],"hasHelperEndSlot":[32],"errorMessage":[32],"datalist":[32],"_invalid":[32],"reportValidity":[64],"setFocus":[64],"select":[64],"getInputElement":[64],"showError":[64]},[[16,"reset","onReset"],[17,"mousedown","handleBlur"],[0,"keydown","handleBlur"]]]]],["p-e8a913ac.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-53957ec6.system.js.map

package/dist/nano-components/p-6ce533f1.system.entry.js ADDED Viewed

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

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

@@ -0,0 +1 @@

+ {"version":3,"sources":["src/components/datalist/datalist.scss?tag=nano-datalist&encapsulation=shadow","src/components/datalist/datalist.tsx","src/components/menu/menu.scss?tag=nano-menu&encapsulation=shadow","src/components/menu/menu.tsx","src/components/option/option.scss?tag=nano-option&encapsulation=shadow","src/components/option/option.tsx"],"names":["datalistCss","findLabel","formCtrl","foundLabel","id","document","querySelector","closest","listIds","DataList","exports","class_1","hostRef","_this","this","isNanoInput","typeToSelect","listId","isFiltered","shouldFocus","_allOptEles","actvOptEles","canOpen","optionIds","selected","_dropDownConfig","skidding","options","type","open","disableFilter","disabled","optSelected","e","stopPropagation","changeInputValue","detail","raf","inputChange","shouldOpen","handleShow","__awaiter","listBox","setFocus","showActiveElement","handleHide","activeElement","getActiveElement","body","host","tagName","toLowerCase","connectedInput","focus","inputClick","manageDropdownDisplay","inputKeydown","ignoreKeys","includes","key","typeToSelectTimeout","test","clearTimeout","window","setTimeout","setOptStartsWith","preventDefault","optionKeyDown","deleteKeys","exactMatch","debounce","bind","Object","defineProperty","prototype","opts","_a","value","forEach","opt","ddc","assign","allOptEles","openWatcher","writeTask","nanoDropdown","setAttribute","toString","watchInputChange","nanoInput","_b","getInputElement","_c","sent","input","HTMLElement","manageSlotChangeListener","length","mo","MutationObserver","processSlottedContent","observe","childList","subtree","disconnect","undefined","flatMap","option","i","label","createElement","ariaPosinset","ariaSetsize","textContent","slot","append","__spreadArray","watchTypeChange","dwConfig","closeOnSelect","autocompleteType","readonly","placement","tetherTo","dropDownConfig","readOnly","manageInputEvents","newInput","oldInput","removeEventListener","inputLabel","removeAttribute","addEventListener","labels","item","watchActvOptChange","c","val","optIds","hidden","isSelected","push","manageCanOpen","hasNoResult","fireActiveOptsEvent","nanoOptionsUpdated","emit","find","nanoSelected","filter","nanoDeselect","nanoSelect","defaultPrevented","event","Event","dispatchEvent","attrFind","toFind","substring","foundEle","trim","filterMeta","Array","from","querySelectorAll","valStr","activeEles","indexOf","connectedCallback","componentDidLoad","componentDidRender","console","warn","render","h","Host","role","aria-owns","join","aria-label","ref","el","dialogTitle","class","dlist__dropdown","dlist--isfiltered","onNanoAfterShow","onNanoAfterHide","dlist__menu","dlist__menu--open","dropwdownOpen","tabIndex","onNanoSelect","onKeyDown","name","aria-live","menuCss","CANSHADOW","head","attachShadow","Menu","class_2","ignoreMouseEvents","_hasFocus","handleFocus","setActiveFocusItem","selectedItem","getItems","nanoFocus","handleClick","target","handleKeyDown","ignoreMouseTimeout","activeItem","click","items","index","scrollIntoView","block","_i","items_1","shadowRoot","getTextContent","handleMouseOver","menu","preventScroll","removeFocus","blur","resetActiveItem","map","opened","ctx","getDirectChildren","getAttribute","classList","contains","handleBlur","hasFocus","kev","found","composedPath","nanoBlur","legacy","onClick","onMouseOver","onFocus","part","optionCss","Option","class_3","optId","valueChanged","labelContent","labelChanged","componentWillLoad","aria-selected","aria-disabled","onMouseDown","option--selected","option--disabled","option--novalue","aria-hidden"],"mappings":"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","sourcesContent":["@use 'sass:map';\n@use 'sass:list';\n\n@import '../../global/style/utilities/globals';\n@import '../../global/style/nano-theme/form';\n@import '../../global/style/nano-theme/base';\n@import '../../global/style/nano-theme/layers';\n\n:host {\n /**\n * @prop --padding-top: for all nested `nano-option` elements. Defaults to #{$spacing-small};\n * @prop --padding-bottom: for all nested `nano-option` elements. Defaults to #{$spacing-small};\n * @prop --padding-start: for all nested `nano-option` elements. Defaults to #{$spacing-xlarge};\n * @prop --padding-end: for all nested `nano-option` elements. Defaults to #{$spacing-xlarge};\n * @prop --font-size: for all nested `nano-option` elements. Defaults to .8em;\n * @prop --color: default text color of content other than `nano-option`. Defaults to #{map.get($colors, palegrey)};\n */\n\n --padding-top: #{$spacing-small};\n --padding-bottom: #{$spacing-small};\n --padding-start: #{$spacing-xlarge};\n --padding-end: #{$spacing-xlarge};\n --font-size: 0.8em;\n --color: #{map.get($colors, palegrey)};\n\n color: var(--color);\n}\n\n.dlist {\n &--isfiltered {\n ::slotted(*:not(nano-option):not([slot='no-result']):not([slot='list-top']):not([slot='list-bottom'])) {\n display: none !important;\n }\n }\n\n &__dropdown {\n --min-width: 100%;\n --overflow: auto;\n }\n\n &__status {\n @include visually-hide();\n }\n\n &__menu {\n --padding-top: inherit;\n --padding-bottom: inherit;\n --padding-start: inherit;\n --padding-end: inherit;\n --font-size: inherit;\n }\n}\n","import {\n Component,\n ComponentInterface,\n h,\n Host,\n Element,\n State,\n Watch,\n Prop,\n Event,\n EventEmitter,\n writeTask,\n Build,\n} from '@stencil/core';\nimport { debounce, getActiveElement, raf } from '../../utils';\nimport type { Dropdown } from '../dropdown/dropdown';\nimport type { OptionInterface } from '../../interface';\n\nfunction findLabel(formCtrl: Element) {\n let foundLabel: HTMLLabelElement;\n\n if (formCtrl.id) {\n foundLabel = document.querySelector(`label[for='${formCtrl.id}']`);\n }\n if (!foundLabel) {\n foundLabel = formCtrl.closest('label');\n }\n return foundLabel;\n}\n\nlet listIds = 0;\n\n/**\n * `nano-datalist` a visually consistent and more flexible replacement for a native\n * [datalist](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/datalist). Can be nested within a `nano-input`\n * or linked to any input control via the `input` prop. Is used internally within `nano-select`.\n * Options can be defined declaratively by nesting `<nano-option>` elements or imperatively using the `options` prop\n *\n * @slot - use `<nano-option>` elements for more complex html. Alternatively use the `options` prop\n * @slot list-top - shows at the top of the list when there are options present\n * @slot list-bottom - shows at the bottom of the list when there are options present\n * @slot no-result - shown when there are no results otherwise nothing will be shown\n */\n@Component({\n tag: 'nano-datalist',\n styleUrl: 'datalist.scss',\n shadow: true,\n})\nexport class DataList implements ComponentInterface {\n // Private State\n\n private isNanoInput = false;\n private typeToSelect = '';\n private typeToSelectTimeout: number;\n private nanoDropdown: HTMLNanoDropdownElement;\n private listBox: HTMLNanoMenuElement;\n private mo?: MutationObserver;\n private listId = `nano-datalist-${listIds++}`;\n private isFiltered = false;\n private shouldFocus = false;\n // all potential option eles. Set via slot or `options` prop.\n // Some may get hidden due to filtering\n private get allOptEles() {\n return this._allOptEles;\n }\n private set allOptEles(opts) {\n // when allOptEles are initially set (on slot change / options) -\n // add options to 'selected' and fire selected event *if*\n // value isn't set on the input\n this._allOptEles = opts;\n if (this.connectedInput?.value) return;\n\n opts.forEach((opt) => {\n if (opt.selected && !this.selected.includes(opt.value)) {\n this.changeInputValue(opt);\n }\n });\n }\n private _allOptEles: HTMLNanoOptionElement[] = [];\n\n @Element() host: HTMLNanoDatalistElement;\n\n // active option eles that are not hidden.\n @State() actvOptEles: HTMLNanoOptionElement[] = [];\n @State() connectedInput: HTMLInputElement | HTMLTextAreaElement;\n @State() inputLabel: HTMLLabelElement;\n @State() hasNoResult: boolean;\n @State() shouldOpen: boolean;\n @State() canOpen: boolean = true;\n @State() optionIds: string[] = [];\n\n constructor() {\n this.inputChange = debounce(this.inputChange.bind(this), 50);\n }\n\n // Public API\n\n /** By default, items in the list will appear 'selected' when the value in the linked input control matches.\n * However you can add other selected options via the the selected prop. */\n @Prop({ mutable: true }) selected: string[] = [];\n\n /** nano-dropdown config options you can pass to the nested dropdown component */\n @Prop()\n get dropDownConfig() {\n return this._dropDownConfig;\n }\n set dropDownConfig(ddc: Partial<Dropdown>) {\n this._dropDownConfig = { ...this._dropDownConfig, ...ddc };\n }\n private _dropDownConfig: Partial<Dropdown> = {\n skidding: -1,\n };\n\n /** Provide an option list.\n * Options can be defined declaratively by nesting `<nano-option>` elements or imperatively using this prop */\n @Prop() options?: OptionInterface[] = [];\n\n /** A selector to a HTMLInputElement */\n @Prop() input?: string | HTMLInputElement;\n\n /** Tweaks the datalist behaviour and linked control semantics and behaviour.\n * e.g. 'select' will make the linked input control `readonly`.\n */\n @Prop() type: 'select' | 'selctMulti' | 'input' = 'input';\n\n /** return all the active options currently within the datalist. Can be useful for validation */\n @Prop()\n get activeOptions() {\n return this.allOptEles;\n }\n\n /** Force datalist open */\n @Prop({ mutable: true }) open: boolean = false;\n\n @Watch('open')\n openWatcher() {\n writeTask(() => {\n this.nanoDropdown.open = this.open;\n this.connectedInput.setAttribute('aria-expanded', this.open.toString());\n });\n }\n\n /** Use this option to disable to default filtering. This is useful if filtering happens\n * externally via another method (e.g. via ajax)\n */\n @Prop() disableFilter = false;\n\n /** Activate / deactivate the datalist control */\n @Prop() disabled = false;\n\n // State change watchers\n\n @Watch('input')\n async watchInputChange() {\n let nanoInput;\n if ((nanoInput = this.host.closest('nano-input'))) {\n this.isNanoInput = true;\n this.connectedInput = await nanoInput.getInputElement();\n } else if (\n this.input &&\n typeof this.input === 'string' &&\n (nanoInput = document.querySelector(this.input))\n ) {\n this.isNanoInput = false;\n this.connectedInput = nanoInput;\n } else if (this.input instanceof HTMLElement) {\n this.connectedInput = this.input;\n }\n }\n\n @Watch('options')\n manageSlotChangeListener() {\n if (!this.host) return;\n\n // we're not using `options` - setup new MO\n if ((!this.options || !this.options.length) && !this.mo) {\n if (Build.isBrowser) {\n const mo = (this.mo = new MutationObserver(() =>\n this.processSlottedContent()\n ));\n mo.observe(this.host, { childList: true, subtree: true });\n }\n this.processSlottedContent();\n return;\n }\n\n // we're using `options` - trash current MO\n if (this.options?.length) {\n if (!!this.mo) {\n this.mo.disconnect();\n this.mo = undefined;\n }\n\n // add imperative `options`\n writeTask(() => {\n this.allOptEles = this.options.flatMap((option, i) => {\n if (option.value || option.label) {\n const opt = Object.assign(document.createElement('nano-option'), {\n label: option.label,\n value: option.value,\n ariaPosinset: i,\n ariaSetsize: this.options.length,\n selected: option.selected,\n id: this.listId + '-option-' + i,\n textContent: option.label ? option.label : option.value,\n slot: 'internal-opts',\n });\n this.host.append(opt);\n return opt;\n }\n });\n\n if (this.connectedInput?.value.length && this.type !== 'select') {\n this.inputChange();\n } else this.actvOptEles = [...this.allOptEles];\n });\n }\n // forceUpdate(this.host);\n }\n\n @Watch('type')\n @Watch('connectedInput')\n watchTypeChange() {\n if (!this.connectedInput) return;\n\n let dwConfig: Partial<Dropdown> = { closeOnSelect: false };\n let autocompleteType: 'list' | 'both' = 'both';\n let readonly = false;\n\n switch (this.type) {\n case 'input':\n dwConfig = { closeOnSelect: true };\n break;\n case 'select':\n autocompleteType = 'list';\n readonly = true;\n dwConfig = { closeOnSelect: true, placement: 'center' };\n break;\n }\n\n if (!this.isNanoInput) {\n dwConfig.tetherTo = this.connectedInput;\n }\n\n this.dropDownConfig = { ...this.dropDownConfig, ...dwConfig };\n this.connectedInput.setAttribute('aria-autocomplete', autocompleteType);\n this.connectedInput.readOnly = readonly;\n }\n\n @Watch('connectedInput')\n manageInputEvents(newInput?: HTMLInputElement, oldInput?: HTMLInputElement) {\n if (!!oldInput) {\n const nanoInput = oldInput.closest('nano-input');\n if (nanoInput) {\n nanoInput.removeEventListener('nanoChange', this.inputChange);\n }\n oldInput.removeEventListener('change', this.inputChange);\n oldInput.removeEventListener('click', this.inputClick);\n oldInput.removeEventListener('keydown', this.inputKeydown);\n oldInput.removeEventListener('input', this.inputChange);\n\n this.inputLabel = null;\n\n writeTask(() => {\n oldInput.removeAttribute('role');\n oldInput.removeAttribute('aria-expanded');\n oldInput.removeAttribute('aria-controls');\n oldInput.removeAttribute('aria-owns');\n oldInput.removeAttribute('aria-haspopup');\n oldInput.removeAttribute('aria-autocomplete');\n oldInput.removeAttribute('autocomplete');\n });\n }\n if (!!newInput) {\n const nanoInput = newInput.closest('nano-input');\n if (nanoInput) {\n nanoInput.addEventListener('nanoChange', this.inputChange);\n }\n newInput.addEventListener('change', this.inputChange);\n newInput.addEventListener('click', this.inputClick);\n newInput.addEventListener('keydown', this.inputKeydown);\n newInput.addEventListener('input', this.inputChange);\n this.listId = this.host.id || this.listId;\n\n this.inputLabel = newInput?.labels?.item(0) || findLabel(newInput);\n\n writeTask(() => {\n this.host.id = this.listId;\n newInput.setAttribute('role', 'combobox');\n newInput.setAttribute('aria-expanded', 'false');\n newInput.setAttribute('aria-controls', this.listId);\n newInput.setAttribute('aria-owns', this.listId);\n newInput.setAttribute('aria-haspopup', 'listbox');\n newInput.setAttribute('autocomplete', 'off');\n });\n }\n }\n\n @Watch('selected')\n @Watch('actvOptEles')\n watchActvOptChange() {\n let c = 0;\n const val = this.connectedInput?.value || '';\n const optIds = [];\n\n writeTask(() => {\n this.allOptEles.forEach((opt, i) => {\n if (this.actvOptEles.includes(opt)) {\n c++;\n opt.setAttribute('aria-posinset', c + '');\n opt.setAttribute('aria-setsize', this.actvOptEles.length + '');\n opt.hidden = false;\n this.isSelected(opt, val);\n } else {\n opt.removeAttribute('aria-posinset');\n opt.removeAttribute('aria-setsize');\n opt.hidden = true;\n opt.selected = false;\n }\n opt.id = this.listId + '-option-' + i;\n optIds.push(opt.id);\n });\n this.optionIds = optIds;\n });\n }\n\n @Watch('actvOptEles')\n @Watch('hasNoResult')\n manageCanOpen() {\n if (this.actvOptEles.length || this.hasNoResult) this.canOpen = true;\n else this.canOpen = false;\n }\n\n /**\n * Opens the dropdown if it can, it should and there are items to display.\n */\n @Watch('shouldOpen')\n @Watch('canOpen')\n manageDropdownDisplay() {\n if (this.shouldOpen && this.canOpen && !this.disabled) this.open = true;\n if (!this.shouldOpen || !this.canOpen) this.open = false;\n this.openWatcher();\n }\n\n @Watch('actvOptEles')\n fireActiveOptsEvent() {\n this.nanoOptionsUpdated.emit(this.actvOptEles);\n }\n\n // Events\n\n /** Fired when an item is selected. */\n @Event() nanoSelect: EventEmitter<HTMLNanoOptionElement>;\n\n /** Fired when a currently selected item is reselected. */\n @Event() nanoDeselect: EventEmitter<HTMLNanoOptionElement>;\n\n /** Fired when active options change */\n @Event() nanoOptionsUpdated: EventEmitter<HTMLNanoOptionElement[]>;\n\n // Private logic\n\n private isSelected(opt: HTMLNanoOptionElement, val: string) {\n if (val === opt.value || this.selected.includes(opt.value)) {\n opt.selected = true;\n } else opt.selected = false;\n }\n\n private get dropwdownOpen() {\n if (!this.nanoDropdown || !this.open) return false;\n return true;\n }\n\n private get exactMatch() {\n return this.allOptEles.find(\n (opt) => this.connectedInput.value === opt.value\n );\n }\n\n /** reflect value back to the connected input unless the event is cancelled */\n private changeInputValue(opt: HTMLNanoOptionElement) {\n let nanoSelected;\n\n if (this.selected.includes(opt.value)) {\n // deselect option\n this.selected = this.selected.filter((val) => val !== opt.value);\n nanoSelected = this.nanoDeselect.emit(opt);\n } else {\n // select new option\n this.selected = [...this.selected];\n nanoSelected = this.nanoSelect.emit(opt);\n }\n\n if (!nanoSelected.defaultPrevented) {\n if (this.connectedInput) this.connectedInput.value = opt.value;\n\n const event = new window.Event('change');\n this.connectedInput?.dispatchEvent(event);\n }\n }\n\n // a new option has been picked\n private optSelected = (e: CustomEvent<HTMLNanoOptionElement>) => {\n e.stopPropagation();\n this.changeInputValue(e.detail);\n raf(() => this.inputChange());\n\n if (this.type !== 'selctMulti') this.shouldOpen = false;\n };\n\n // this is for type=\"select\" only.\n // Filter options that start with text - aggregates letters (as opposed to getting the value from input)\n private setOptStartsWith() {\n const attrFind = (toFind: string) =>\n toFind.toLowerCase().substring(0, this.typeToSelect.length) ===\n this.typeToSelect;\n\n const foundEle = this.allOptEles.find(\n (opt) =>\n opt.value.trim().length > 0 &&\n !opt.disabled &&\n (attrFind(opt.textContent) ||\n attrFind(opt.value) ||\n attrFind(opt.label) ||\n attrFind(opt.filterMeta))\n );\n if (foundEle) this.changeInputValue(foundEle);\n }\n\n // Event handlers\n\n private processSlottedContent() {\n raf(() => {\n this.allOptEles = Array.from(this.host.querySelectorAll('nano-option'));\n this.hasNoResult = !!this.host.querySelector('[slot=\"no-result\"]');\n\n if (this.connectedInput?.value.length && this.type !== 'select') {\n this.inputChange();\n } else this.actvOptEles = this.allOptEles;\n });\n }\n\n // sets focus immediately on open when 'select' - mirroring native behaviour\n private handleShow = async () => {\n if (this.shouldFocus) {\n this.shouldFocus = false;\n this.listBox.setFocus();\n } else if (this.type === 'select') this.listBox.showActiveElement();\n };\n\n private handleHide = () => {\n this.open = false;\n const activeElement = getActiveElement();\n if (\n activeElement === document.body ||\n activeElement.closest(this.host.tagName.toLowerCase())\n ) {\n this.connectedInput.focus();\n }\n };\n\n // any changes to the connected input value will filter the list of active options\n private inputChange() {\n if (this.disableFilter) {\n this.actvOptEles = this.allOptEles;\n return;\n }\n\n const val = this.connectedInput.value;\n const valStr = val.trim().toLowerCase();\n\n let exactMatch = false;\n const activeEles = [];\n const attrFind = (toFind: string) =>\n toFind.toLowerCase().indexOf(valStr) > -1;\n\n this.allOptEles.forEach((opt) => {\n if (\n (val === opt.value || val === opt.label) &&\n this.type !== 'selctMulti'\n ) {\n opt.selected = true;\n exactMatch = true;\n } else this.isSelected(opt, val);\n });\n\n this.allOptEles.forEach((opt) => {\n if (!valStr.length || exactMatch) {\n activeEles.push(opt);\n } else if (\n opt.value.trim().length > 0 &&\n !opt.disabled &&\n (attrFind(opt.textContent) ||\n attrFind(opt.value) ||\n attrFind(opt.label) ||\n attrFind(opt.filterMeta))\n ) {\n activeEles.push(opt);\n }\n });\n\n this.isFiltered = valStr.length && !exactMatch;\n this.actvOptEles = activeEles;\n }\n\n private inputClick = () => {\n this.shouldOpen = true;\n // open dropdown if possible\n this.manageDropdownDisplay();\n };\n\n private inputKeydown = (e: KeyboardEvent) => {\n const ignoreKeys = [\n 'Shift',\n 'ArrowRight',\n 'ArrowLeft',\n 'Escape',\n 'Enter',\n 'Tab',\n ];\n if (ignoreKeys.includes(e.key)) {\n if (e.key === 'Tab') this.shouldOpen = false;\n return;\n }\n\n // When select, mirror native select behaviour. Search on closed list\n if (\n this.type === 'select' &&\n !['ArrowDown', 'ArrowUp'].includes(e.key) &&\n (e.key !== ' ' || this.typeToSelectTimeout)\n ) {\n if (e.key === ' ' || /^[a-z0-9]+$/i.test(e.key)) {\n clearTimeout(this.typeToSelectTimeout);\n this.typeToSelectTimeout = window.setTimeout(() => {\n this.typeToSelect = '';\n this.typeToSelectTimeout = 0;\n }, 750);\n this.typeToSelect += e.key;\n this.setOptStartsWith();\n }\n return;\n }\n\n this.shouldOpen = true;\n // open dropdown if possible\n this.manageDropdownDisplay();\n if (['ArrowDown', 'ArrowUp'].includes(e.key)) {\n e.preventDefault();\n this.shouldFocus = true;\n }\n };\n\n // handles key down on options. Either 'picks'\n // an option or passes event back to input for search / filter\n private optionKeyDown = (\n e: KeyboardEvent & { target: HTMLNanoOptionElement }\n ) => {\n const ignoreKeys = [\n 'Shift',\n 'ArrowUp',\n 'ArrowDown',\n 'Escape',\n 'Enter',\n 'Tab',\n 'Space',\n 'PageUp',\n 'PageDown',\n 'Home',\n 'End',\n ' ',\n ];\n if (ignoreKeys.includes(e.key)) {\n if (e.key === 'Escape') this.connectedInput.focus();\n return;\n }\n\n const deleteKeys = ['Delete', 'Backspace'];\n // this passes whatever's typed back to our input control\n if (\n this.type !== 'select' &&\n (!this.exactMatch || deleteKeys.includes(e.key))\n ) {\n this.connectedInput.focus();\n }\n };\n\n // Component lifecycle\n\n connectedCallback() {\n this.watchInputChange();\n }\n\n componentDidLoad() {\n this.manageSlotChangeListener();\n this.openWatcher();\n }\n\n componentDidRender(): void {\n setTimeout(() => {\n if (!this.connectedInput)\n console.warn(\n 'no `nano-input` found. `nano-datalist` should be nested within an `nano-input` or linked via `input` prop',\n this.host\n );\n }, 500);\n }\n\n render() {\n return (\n <Host\n role=\"listbox\"\n aria-owns={this.optionIds.join(' ')}\n aria-label=\"Select options from the list below\"\n >\n <nano-dropdown\n {...this.dropDownConfig}\n ref={(el) => (this.nanoDropdown = el)}\n dialogTitle=\"Select options from the list below\"\n class={{\n dlist__dropdown: true,\n 'dlist--isfiltered': this.isFiltered,\n }}\n onNanoAfterShow={this.handleShow}\n onNanoAfterHide={this.handleHide}\n >\n <nano-menu\n hidden={!this.actvOptEles.length}\n type=\"listbox\"\n label={this.inputLabel ? this.inputLabel.textContent : undefined}\n class={{\n dlist__menu: true,\n 'dlist__menu--open': this.dropwdownOpen,\n }}\n tabIndex={-1}\n onNanoSelect={this.optSelected}\n onKeyDown={this.optionKeyDown}\n ref={(el) => (this.listBox = el)}\n >\n <slot name=\"list-top\" />\n {!this.options.length && <slot />}\n {!!this.options.length && <slot name=\"internal-opts\" />}\n <slot name=\"list-bottom\" />\n </nano-menu>\n <nano-menu\n type=\"listbox\"\n label=\"No results found\"\n hidden={!!this.actvOptEles.length}\n class={{\n dlist__menu: true,\n 'dlist__menu--open': this.dropwdownOpen,\n }}\n >\n <slot name=\"no-result\" />\n </nano-menu>\n {!!this.actvOptEles && (\n <div aria-live=\"polite\" role=\"status\" class=\"dlist__status\">\n {this.actvOptEles.length} result\n {this.actvOptEles.length > 1 ? 's' : ''} available.\n </div>\n )}\n </nano-dropdown>\n </Host>\n );\n }\n}\n","@use 'sass:map';\n@use 'sass:list';\n\n@import '../../global/style/utilities/globals';\n@import '../../global/style/nano-theme/colours';\n@import '../../global/style/nano-theme/layers';\n\n:host {\n /**\n * @prop --padding-start: padding at the start of nav-items (left r2l / right l2r). Defaults to '10px'\n * @prop --padding-end: padding at the end of nav-items (right r2l / left l2r). Defaults to '10px'\n * @prop --padding-top: padding at the top of nav-items. Defaults to '10px'\n * @prop --padding-bottom: padding at the bottom of nav-items. Defaults to '10px'\n\n * @prop --secondary-padding-top: padding at the top of nested nav-items. Defaults to 0\n * @prop --secondary-padding-bottom: padding at the bottom of nested nav-items. Defaults to 0\n\n * @prop --bg-color-hover: bg hover color of nav-items. Defaults to #{map.get($colors, blue--faded)};\n * @prop --bg-color-focus: bg focus color of nav-items. Defaults to #{map.get($colors, blue--faded)};\n * @prop --bg-color-selected: bg selected color of nav-items. Defaults to #{map.get($colors, blue--faded)};\n\n * @prop --color-hover: text hover color of nav-items. Defaults to #{map.get($colors, blue)}\n * @prop --color-selected: text selected color of nav-items. Defaults to #{map.get($colors, blue)}\n * @prop --color-focus: text focus color of nav-items. Defaults to #{map.get($colors, blue)}\n\n * @prop --focus-outline: the focus style of nav-items. Defaults to 'none'\n * @prop --font-size: default font-size for all items. Defaults .9em;\n */\n\n --padding-start: #{$spacing-medium};\n --padding-end: #{$spacing-medium};\n --padding-top: #{$spacing-small};\n --padding-bottom: #{$spacing-small};\n --secondary-padding-top: 0;\n --secondary-padding-bottom: 0;\n --bg-color-hover: #{map.get($colors, blue--faded)};\n --bg-color-focus: #{map.get($colors, blue--faded)};\n --bg-color-selected: #{map.get($colors, blue--faded)};\n --color-hover: #{map.get($colors, blue)};\n --color-selected: #{map.get($colors, blue)};\n --color-focus: #{map.get($colors, blue)};\n --focus-outline: none;\n --font-size: 0.9em;\n\n display: block;\n}\n\n.menu {\n font-size: var(--font-size, 0.9em);\n overscroll-behavior: none;\n min-width: var(--width);\n position: relative;\n\n &:focus {\n outline: none;\n }\n}\n\n::slotted(*:not(nano-nav-item):not(nano-option):not(hr):not(slot)) {\n @include padding(\n var(--padding-top),\n var(--padding-end),\n var(--padding-bottom),\n var(--padding-start)\n );\n\n display: block;\n}\n","import {\n Component,\n Event,\n EventEmitter,\n Method,\n h,\n Host,\n Element,\n Prop,\n Listen,\n} from '@stencil/core';\nimport {\n getTextContent,\n getDirectChildren,\n getActiveElement,\n} from '../../utils';\n\nconst CANSHADOW = !!document.head.attachShadow;\n\ntype ValidElement = HTMLNanoNavItemElement | HTMLNanoOptionElement;\ntype NNI = HTMLNanoNavItemElement;\n\n/**\n * Menu element. Commonly wrapped by `nano-dropdown` with `nano-option` and `nano-nav-item` elements nested.\n * Manages focus state / active.\n * @slot - The menu's content; `nano-option`, `nano-nav-item` elements as well as <hr> and more.\n */\n@Component({\n tag: 'nano-menu',\n styleUrl: 'menu.scss',\n shadow: true,\n})\nexport class Menu {\n private ignoreMouseEvents = false;\n private ignoreMouseTimeout: any;\n private menu: HTMLElement;\n private typeToSelect = '';\n private typeToSelectTimeout: any;\n\n @Element() private el: HTMLNanoMenuElement;\n\n // Public API\n\n /** get the focus state of the menu @readonly */\n @Prop()\n get hasFocus() {\n return this._hasFocus;\n }\n private _hasFocus = false;\n\n /** changes the role of the underlying control - sometimes required for semantics */\n @Prop() type: 'menu' | 'listbox' = 'menu';\n\n /** an accessible label */\n @Prop() label: string;\n\n // Events\n\n /** Emitted when the menu gains focus. */\n @Event() nanoFocus: EventEmitter;\n\n /** Emitted when the menu loses focus. */\n @Event() nanoBlur: EventEmitter;\n\n /** Emitted when a menu item is selected. */\n @Event() nanoSelect: EventEmitter<\n HTMLNanoOptionElement | HTMLNanoNavItemElement\n >;\n\n // Public Methods\n\n /** Sets focus on the menu. */\n @Method()\n async setFocus() {\n if (this.menu?.focus) this.menu.focus({ preventScroll: true });\n }\n\n /** Removes focus from the menu. */\n @Method()\n async removeFocus() {\n if (this.menu?.blur) this.menu.blur();\n }\n\n /** Sets the current active item */\n @Method()\n async showActiveElement() {\n if (this.selectedItem)\n this.selectedItem.scrollIntoView({ block: 'nearest' });\n }\n\n /** Removes any active item's state */\n @Method()\n async resetActiveItem() {\n this.getItems\n .filter((i) => i.tagName.toLowerCase() === 'nano-option')\n .map((i) => i.setAttribute('tabindex', '-1'));\n }\n\n // Private methods\n\n get getItems() {\n let items: ValidElement[];\n let opened = this.el.querySelectorAll('nano-nav-item.secondary-open');\n if (opened.length) {\n const ctx = opened[opened.length - 1] as HTMLNanoNavItemElement;\n items = Array.from(ctx.querySelectorAll('nano-nav-item, nano-option'));\n } else {\n items = getDirectChildren(\n this.el,\n 'nano-nav-item, nano-option',\n 'slot'\n ) as ValidElement[];\n }\n return items.filter((el) => !el.disabled && !el.hidden);\n }\n\n get activeItem() {\n const activeElement = getActiveElement();\n return this.getItems.find(\n (i) =>\n i.getAttribute('tabindex') === '0' ||\n i === activeElement ||\n i.classList.contains('has-focus')\n );\n }\n\n get selectedItem() {\n return this.getItems.find((i) => i.selected);\n }\n\n private async setActiveFocusItem(item?: ValidElement, focus = true) {\n const items = this.getItems;\n let activeItem =\n !item || item.disabled ? items.find((i) => i.selected) || items[0] : item;\n\n items\n .filter((i) => i.tagName.toLowerCase() === 'nano-option')\n .map((i: HTMLNanoOptionElement) =>\n i.setAttribute('tabindex', i === activeItem ? '0' : '-1')\n );\n\n if (!focus) return;\n\n if (activeItem) {\n (activeItem as NNI).setFocus\n ? (activeItem as NNI).setFocus()\n : activeItem.focus();\n } else this.menu.focus();\n }\n\n // Event Handlers\n\n @Listen('mousedown', { target: 'body' })\n @Listen('keydown')\n handleBlur(e: KeyboardEvent | MouseEvent) {\n if (!this.hasFocus) return;\n\n const kev = e as KeyboardEvent;\n let found: boolean;\n\n if (kev.key) {\n if (kev.key !== 'Tab') return;\n found =\n getActiveElement() &&\n getActiveElement().closest(this.el.tagName.toLowerCase()) === this.el;\n } else found = !!e.composedPath().find((el) => el === this.el);\n\n if (!found) {\n this.resetActiveItem();\n this._hasFocus = false;\n this.nanoBlur.emit();\n }\n }\n\n private handleFocus = () => {\n this.setActiveFocusItem(this.selectedItem || this.getItems[0]);\n\n this._hasFocus = true;\n this.nanoFocus.emit();\n };\n\n private handleClick = (event: MouseEvent) => {\n const target = event.target as HTMLElement;\n const item = target.closest('nano-nav-item');\n\n if (item && !item.disabled) {\n this.nanoSelect.emit(item);\n }\n };\n\n private handleKeyDown = (event: KeyboardEvent) => {\n // When keying through the menu, if the mouse happens to be hovering over a menu item and the menu scrolls, the\n // mouseout/mouseover event will fire causing the selection to be different than what the user expects. This gives\n // us a way to temporarily ignore mouse events while the user is interacting with a keyboard.\n clearTimeout(this.ignoreMouseTimeout);\n this.ignoreMouseTimeout = setTimeout(\n () => (this.ignoreMouseEvents = false),\n 500\n );\n this.ignoreMouseEvents = true;\n\n // Make a selection when pressing enter\n switch (event.key) {\n case ' ':\n if (this.activeItem) this.activeItem.click();\n break;\n case 'ArrowDown':\n case 'ArrowUp':\n case 'PageDown':\n case 'PageUp':\n case 'Home':\n case 'End':\n const items = this.getItems;\n const selectedItem = this.activeItem;\n let index = items.indexOf(selectedItem);\n\n if (items.length) {\n event.preventDefault();\n\n if (event.key === 'ArrowDown') {\n index++;\n } else if (event.key === 'ArrowUp') {\n index--;\n } else if (event.key === 'Home' || event.key === 'PageUp') {\n index = 0;\n } else if (event.key === 'End' || event.key === 'PageDown') {\n index = items.length - 1;\n }\n\n if (index < 0) index = items.length - 1;\n if (index > items.length - 1) index = 0;\n\n this.setActiveFocusItem(items[index]);\n if (items[index]) items[index].scrollIntoView({ block: 'nearest' });\n return;\n }\n break;\n }\n\n // Handle type-to-search behavior when non-control characters are entered\n if (event.key === ' ' || /^[a-z0-9]+$/i.test(event.key)) {\n clearTimeout(this.typeToSelectTimeout);\n this.typeToSelectTimeout = setTimeout(\n () => (this.typeToSelect = ''),\n 750\n );\n this.typeToSelect += event.key;\n\n const items = this.getItems;\n for (const item of items) {\n const slot = item.shadowRoot.querySelector(\n 'slot:not([name])'\n ) as HTMLSlotElement;\n const label = getTextContent(slot).toLowerCase().trim();\n if (\n label.substring(0, this.typeToSelect.length) === this.typeToSelect\n ) {\n this.setActiveFocusItem(item);\n break;\n }\n }\n }\n };\n\n private handleMouseOver = (event: MouseEvent) => {\n const target = event.target as HTMLElement;\n const item =\n target.closest('nano-nav-item') || target.closest('nano-option');\n\n if (item && !this.ignoreMouseEvents) {\n this.setActiveFocusItem(item);\n }\n };\n\n // Component Lifecycle\n\n render() {\n return (\n <Host\n class={{\n legacy: !CANSHADOW,\n }}\n >\n <div\n onClick={this.handleClick}\n onKeyDown={this.handleKeyDown}\n onMouseOver={this.handleMouseOver}\n onFocus={this.handleFocus}\n aria-label={this.label ? this.label : undefined}\n role={this.type}\n ref={(el) => (this.menu = el)}\n part=\"base\"\n class={{\n menu: true,\n ['menu--' + this.type]: true,\n 'menu--has-focus': this.hasFocus,\n }}\n tabIndex={-1}\n >\n <slot />\n </div>\n </Host>\n );\n }\n}\n","@use 'sass:map';\n@use 'sass:list';\n\n@import '../../global/style/utilities/globals';\n@import '../../global/style/nano-theme/form';\n@import '../../global/style/nano-theme/base';\n@import '../../global/style/nano-theme/layers';\n\n:host {\n /**\n * @prop --padding-top: Defaults to #{$spacing-small};\n * @prop --padding-bottom: Defaults to #{$spacing-small};\n * @prop --padding-start: Defaults to #{$spacing-small};\n * @prop --padding-end: Defaults to #{$spacing-small};\n\n * @prop --bg: default background. Defaults to none;\n * @prop --bg-selected: background when selected. Defaults to #{$select-opt-selected};\n * @prop --bg-focus: background when focused. Defaults to var(--nano-color-base, #{nano-color(primary, tint)});\n * @prop --bg-disabled: background when disabled. Defaults to none;\n\n * @prop --color: default text color. Defaults to var(--input-text-color, #{$input-text-color});\n * @prop --color-selected: text color when selected. Defaults to var(--nano-color-base, #{nano-color(primary, base)});\n * @prop --color-focus: text color when focused. Defaults to var(--nano-color-base, #{nano-color(primary, contrast)});\n * @prop --color-disabled: text color when disabled. Defaults to #{map.get($colors, palegrey)};\n\n * @prop --opt-icon-size: Sizes all icons within the option. Defaults to 1.4em;\n */\n\n --bg: none;\n --bg-selected: #{$select-opt-selected};\n --bg-focus: var(--nano-color-base, #{nano-color(primary, tint)});\n --bg-disabled: none;\n --color: var(--input-text-color, #{$input-text-color});\n --color-selected: var(--nano-color-base, #{nano-color(primary, base)});\n --color-focus: var(--nano-color-contrast, #{nano-color(primary, contrast)});\n --color-disabled: #{map.get($colors, palegrey)};\n --opt-icon-size: 1.6em;\n\n display: block;\n color: var(--color);\n overflow: hidden;\n font-size: 14px;\n font-size: #{'clamp(12px, .9em, 16px)'};\n}\n\n:host(:focus) {\n outline: none;\n}\n\n.option {\n $self: &;\n\n position: relative;\n user-select: none;\n cursor: pointer;\n display: flex;\n align-items: stretch;\n width: 100%;\n background: var(--bg);\n\n @include padding(\n var(--padding-top),\n var(--padding-end),\n var(--padding-bottom),\n var(--padding-start)\n );\n\n // focus\n :host(:focus) &:not(.option--disabled),\n :host &.option--selected {\n outline: none;\n background: var(--bg-selected);\n color: var(--color-selected);\n }\n\n :host(:focus) &:not(.option--disabled) {\n background: var(--bg-focus);\n color: var(--color-focus);\n }\n\n // disabled\n &.option--disabled {\n outline: none;\n color: var(--color-disabled);\n cursor: not-allowed;\n background: var(--bg-disabled);\n }\n\n // no value\n &.option--novalue {\n font-style: italic;\n opacity: 0.7;\n }\n\n &__label {\n flex: 1 1 auto;\n display: flex;\n align-items: center;\n }\n\n &__start {\n flex: 0 0 auto;\n display: flex;\n align-items: center;\n\n ::slotted(nano-icon) {\n font-size: var(--opt-icon-size);\n }\n\n ::slotted(:last-child) {\n @include margin(null, 0.5em, null, null);\n }\n }\n\n &__end {\n flex: 0 0 auto;\n display: flex;\n align-items: center;\n\n ::slotted(nano-icon) {\n font-size: var(--opt-icon-size);\n }\n\n ::slotted(:first-child) {\n @include margin(null, null, null, 0.5em);\n }\n }\n\n &__check {\n visibility: hidden;\n display: flex;\n position: absolute;\n left: 0.6em;\n top: calc(50% - 0.6em);\n align-items: center;\n font-size: 0.9em;\n\n #{$self}--selected:not(#{$self}--novalue) & {\n visibility: visible;\n }\n }\n}\n","import {\n Component,\n Prop,\n h,\n Host,\n State,\n Watch,\n Element,\n Listen,\n Event,\n EventEmitter,\n} from '@stencil/core';\nimport { OptionInterface } from '../../interface';\nimport { debounce, getDirectChildren } from '../../utils';\n\nlet optIds = 0;\n\n/**\n * Select options to be used with [nano-select](/story/nano-components-select) or [nano-datalist](/story/nano-components-select)\n *\n * @slot - main label. Defaults to `label` or `value` prop\n * @slot checked-icon - icon to indicated checked / selected state. Defaults to fontawesome light/check\n * @slot start - suitable for an icon or content displayed at the start of the main label\n * @slot end - suitable for an icon or content displayed at the end of the main label\n */\n@Component({\n tag: 'nano-option',\n styleUrl: 'option.scss',\n shadow: true,\n})\nexport class Option implements OptionInterface {\n private optId = `nano-option-${optIds++}`;\n @Element() host: HTMLNanoOptionElement;\n @State() hasFocus = false;\n\n constructor() {\n this.handleClick = debounce(this.handleClick.bind(this), 5);\n }\n\n // Public API\n\n /**\n * Value of the option\n */\n @Prop({ mutable: true, reflect: true }) value: string = '';\n\n @Watch('value')\n valueChanged() {\n if (!this.value || !this.value.length) this.value = this.labelContent;\n }\n\n /**\n * Label of the option\n */\n @Prop({ mutable: true, reflect: true }) label: string = '';\n\n @Watch('label')\n labelChanged() {\n if (!this.label || !this.label.length)\n this.label = this.labelContent.length ? this.labelContent : this.value;\n }\n\n /**\n * Whether this option is selected\n */\n @Prop({ reflect: true }) selected: boolean = false;\n\n /**\n * Whether this option should be disabled\n */\n @Prop({ reflect: true }) disabled: boolean = false;\n\n /** You can add extra meta for this option. When displayed in a list, users\n * search / filter via extra related terms. Another usecase is 'endonyms'\n */\n @Prop() filterMeta: string = '';\n\n /** Fired when an option is selected */\n @Event() nanoSelect!: EventEmitter<HTMLNanoOptionElement>;\n\n // Event handlers\n\n // stop scrolling on select\n @Listen('keydown')\n handleKeyDown(e: KeyboardEvent) {\n if (e.key !== ' ' && e.key !== 'Enter') return;\n e.preventDefault();\n this.nanoSelect.emit(this.host);\n }\n\n private handleClick() {\n if (this.disabled) return;\n this.nanoSelect.emit(this.host);\n }\n\n // Private logic\n\n private get labelContent() {\n return getDirectChildren(this.host, '*:not([slot])', false)\n .map((el) => el.textContent)\n .join(' ')\n .trim();\n }\n\n // Component lifecycle\n\n componentWillLoad() {\n this.valueChanged();\n this.labelChanged();\n }\n\n render() {\n return (\n <Host\n role=\"option\"\n aria-selected={this.selected ? 'true' : 'false'}\n aria-disabled={this.disabled ? 'true' : 'false'}\n >\n <div\n onMouseDown={this.handleClick}\n id={this.optId}\n class={{\n option: true,\n 'option--selected': this.selected,\n 'option--disabled': this.disabled,\n 'option--novalue': !this.value,\n }}\n >\n <div part=\"check-icon\" class=\"option__check\">\n <slot name=\"check-icon\">\n <nano-icon name=\"light/check\" aria-hidden=\"true\" />\n </slot>\n </div>\n <div part=\"start\" class=\"option__start\">\n <slot name=\"start\"></slot>\n </div>\n <div part=\"label\" class=\"option__label\">\n <slot>{this.label || this.value}</slot>\n </div>\n <div part=\"end\" class=\"option__end\">\n <slot name=\"end\"></slot>\n </div>\n </div>\n </Host>\n );\n }\n}\n"]}

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

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

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

@@ -0,0 +1 @@

+ {"version":3,"sources":["node_modules/@stencil/store/dist/index.mjs","src/components/field-validator/field-validator.tsx"],"names":["appendToMap","map","propName","value","items","get","set","includes","push","debounce","fn","ms","timeoutId","args","clearTimeout","setTimeout","isConnected","maybeElement","cleanupElements","key","keys","filter","stencilSubscription","getRenderingRef","elmsToUpdate","Map","dispose","clear","elm","elements","forceUpdate","reset","forEach","elms","createObservableMap","defaultState","shouldUpdate","a","b","states","Object","entries","handlers","cb","oldValue","state","Proxy","[object Object]","_","Array","from","enumerable","configurable","has","on","eventName","callback","removeFromArray","onChange","unSet","newValue","unReset","use","subscriptions","unsubs","reduce","subscription","unsub","array","item","index","indexOf","length","createStore","FieldValidator","hostRef","this","submitted","allFields","nanoFieldSelector","internalValidate","validateOn","scrollToInvalid","_dirty","extraFieldSelector","handleStoreChange","async","newVal","found","find","field","getName","tagName","fileStateEqual","storeToFields","dirty","validateAllFields","_valid","activeForm","checkValidity","nanoPayloadChange","emit","_store","handleFieldChange","ev","nanoFields","target","fieldsToStore","handlePlainFieldChange","plainFields","handleFormInvalid","preventDefault","submitForm","scrollToFirstInvalid","nanoInvalid","handleSubmit","e","userForm","_activeForm","form","removeEventListener","addEventListener","cbg","closest","valid","store","payload","showValidation","validationState","v","name","pf","nf","validationMessage","validityMessage","invalid","fields","f","val","validity","Promise","all","err","setFieldError","mo","MutationObserver","_entries","host","querySelector","setupFields","observe","childList","attributes","attributeFilter","subtree","getAttribute","querySelectorAll","validateOnChange","fieldName","type","checked","isArray","ff","_a","files","currentArr","JSON","stringify","validation","res","o","validityTarget","msg","memo","validate","undefined","showError","setError","setCustomValidity","invalidField","scrollIntoView","behavior","block","nanoSubmit","defaultPrevented","submit","requestAnimationFrame","attachSlotObserver","disconnect","h","Host","ref"],"mappings":"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","sourcesContent":["import { getRenderingRef, forceUpdate } from '@stencil/core';\n\nconst appendToMap = (map, propName, value) => {\n const items = map.get(propName);\n if (!items) {\n map.set(propName, [value]);\n }\n else if (!items.includes(value)) {\n items.push(value);\n }\n};\nconst debounce = (fn, ms) => {\n let timeoutId;\n return (...args) => {\n if (timeoutId) {\n clearTimeout(timeoutId);\n }\n timeoutId = setTimeout(() => {\n timeoutId = 0;\n fn(...args);\n }, ms);\n };\n};\n\n/**\n * Check if a possible element isConnected.\n * The property might not be there, so we check for it.\n *\n * We want it to return true if isConnected is not a property,\n * otherwise we would remove these elements and would not update.\n *\n * Better leak in Edge than to be useless.\n */\nconst isConnected = (maybeElement) => !('isConnected' in maybeElement) || maybeElement.isConnected;\nconst cleanupElements = debounce((map) => {\n for (let key of map.keys()) {\n map.set(key, map.get(key).filter(isConnected));\n }\n}, 2000);\nconst stencilSubscription = () => {\n if (typeof getRenderingRef !== 'function') {\n // If we are not in a stencil project, we do nothing.\n // This function is not really exported by @stencil/core.\n return {};\n }\n const elmsToUpdate = new Map();\n return {\n dispose: () => elmsToUpdate.clear(),\n get: (propName) => {\n const elm = getRenderingRef();\n if (elm) {\n appendToMap(elmsToUpdate, propName, elm);\n }\n },\n set: (propName) => {\n const elements = elmsToUpdate.get(propName);\n if (elements) {\n elmsToUpdate.set(propName, elements.filter(forceUpdate));\n }\n cleanupElements(elmsToUpdate);\n },\n reset: () => {\n elmsToUpdate.forEach((elms) => elms.forEach(forceUpdate));\n cleanupElements(elmsToUpdate);\n },\n };\n};\n\nconst createObservableMap = (defaultState, shouldUpdate = (a, b) => a !== b) => {\n let states = new Map(Object.entries(defaultState !== null && defaultState !== void 0 ? defaultState : {}));\n const handlers = {\n dispose: [],\n get: [],\n set: [],\n reset: [],\n };\n const reset = () => {\n states = new Map(Object.entries(defaultState !== null && defaultState !== void 0 ? defaultState : {}));\n handlers.reset.forEach((cb) => cb());\n };\n const dispose = () => {\n // Call first dispose as resetting the state would\n // cause less updates ;)\n handlers.dispose.forEach((cb) => cb());\n reset();\n };\n const get = (propName) => {\n handlers.get.forEach((cb) => cb(propName));\n return states.get(propName);\n };\n const set = (propName, value) => {\n const oldValue = states.get(propName);\n if (shouldUpdate(value, oldValue, propName)) {\n states.set(propName, value);\n handlers.set.forEach((cb) => cb(propName, value, oldValue));\n }\n };\n const state = (typeof Proxy === 'undefined'\n ? {}\n : new Proxy(defaultState, {\n get(_, propName) {\n return get(propName);\n },\n ownKeys(_) {\n return Array.from(states.keys());\n },\n getOwnPropertyDescriptor() {\n return {\n enumerable: true,\n configurable: true,\n };\n },\n has(_, propName) {\n return states.has(propName);\n },\n set(_, propName, value) {\n set(propName, value);\n return true;\n },\n }));\n const on = (eventName, callback) => {\n handlers[eventName].push(callback);\n return () => {\n removeFromArray(handlers[eventName], callback);\n };\n };\n const onChange = (propName, cb) => {\n const unSet = on('set', (key, newValue) => {\n if (key === propName) {\n cb(newValue);\n }\n });\n const unReset = on('reset', () => cb(defaultState[propName]));\n return () => {\n unSet();\n unReset();\n };\n };\n const use = (...subscriptions) => {\n const unsubs = subscriptions.reduce((unsubs, subscription) => {\n if (subscription.set) {\n unsubs.push(on('set', subscription.set));\n }\n if (subscription.get) {\n unsubs.push(on('get', subscription.get));\n }\n if (subscription.reset) {\n unsubs.push(on('reset', subscription.reset));\n }\n if (subscription.dispose) {\n unsubs.push(on('dispose', subscription.dispose));\n }\n return unsubs;\n }, []);\n return () => unsubs.forEach((unsub) => unsub());\n };\n const forceUpdate = (key) => {\n const oldValue = states.get(key);\n handlers.set.forEach((cb) => cb(key, oldValue, oldValue));\n };\n return {\n state,\n get,\n set,\n on,\n onChange,\n use,\n dispose,\n reset,\n forceUpdate,\n };\n};\nconst removeFromArray = (array, item) => {\n const index = array.indexOf(item);\n if (index >= 0) {\n array[index] = array[array.length - 1];\n array.length--;\n }\n};\n\nconst createStore = (defaultState, shouldUpdate) => {\n const map = createObservableMap(defaultState, shouldUpdate);\n map.use(stencilSubscription());\n return map;\n};\n\nexport { createObservableMap, createStore };\n","import {\n Component,\n Prop,\n h,\n Host,\n Element,\n ComponentInterface,\n State,\n Watch,\n Event,\n EventEmitter,\n Method,\n} from '@stencil/core';\nimport { createStore, ObservableMap } from '@stencil/store';\nimport {\n NanoFormEles,\n PlainFormEles,\n NanoFormEvent,\n ValidationState,\n ValidatorValueStore,\n PlainFormEvent,\n} from '../../interface';\n\n/**\n * A toolbox for `nano-...` form fields and form validation.\n * - Easy to add validation accross field dependencies - e.g. \"When Field1 contains '123' Field2 must contain '456'\"\n * - Easy access to whole form and individual field validity states\n * - Easy access to form data payload\n * = Access to 2-way, data bound reactive store\n * - Scroll to invalid field on submit\n */\n@Component({\n tag: 'nano-field-validator',\n})\nexport class FieldValidator implements ComponentInterface {\n // Internal State\n\n @Element() host: HTMLNanoFieldValidatorElement;\n @State() submitted = false;\n @State() userForm: HTMLFormElement;\n @Watch('userForm')\n userFormChange() {\n if (!!this.userForm) this.activeForm = this.userForm;\n }\n\n private get activeForm() {\n return this._activeForm;\n }\n private set activeForm(form: HTMLFormElement) {\n // manages event listners on whatever form is used (slotted on created here)\n if (!form) return;\n\n if (this._activeForm) {\n this._activeForm.removeEventListener(\n 'invalid',\n this.handleFormInvalid,\n true\n );\n }\n form.addEventListener('invalid', this.handleFormInvalid, true);\n this._activeForm = form;\n }\n private _activeForm: HTMLFormElement;\n private mo: MutationObserver;\n private allFields: Array<NanoFormEles | PlainFormEles> = [];\n private nanoFields: NanoFormEles[];\n private plainFields: PlainFormEles[];\n private nanoFieldSelector = `\n nano-input,\n nano-select,\n nano-file-upload,\n nano-date-input,\n nano-checkbox\n `;\n\n // annoyingly, whenever we attempt to `checkValidty()` it fires `invalid` events.\n // this is used to prevent infinite loops / multiple calls\n private internalValidate = false;\n\n // Public API\n\n /** When should the fields perform validation. Will override / sync all nested `nano-...` controls */\n @Prop({ mutable: true }) validateOn?: 'dirty' | 'submit' | 'submitThenDirty' =\n 'submitThenDirty';\n\n /** Sync up validateOn with all fields */\n @Watch('validateOn')\n validateOnChange() {\n this.nanoFields.forEach((field) => {\n if (field.tagName === 'NANO-CHECKBOX') {\n const cbg = field.closest('nano-checkbox-group');\n if (cbg) cbg.validateOn = this.validateOn;\n } else {\n (field as Exclude<NanoFormEles, HTMLNanoCheckboxElement>).validateOn =\n this.validateOn;\n }\n });\n }\n\n /** Tries to scroll to the first invalid field on submit */\n @Prop() scrollToInvalid = true;\n\n /** Returns true if any nested fields have been changed @readonly */\n @Prop({ reflect: true })\n get dirty() {\n return this._dirty;\n }\n @State() _dirty = false;\n\n /** Returns true if all the nested fields are currently valid @readonly */\n @Prop({ reflect: true })\n get valid() {\n return this._valid;\n }\n @State() _valid: boolean;\n\n /** The current form state as a stencil store. */\n @Prop() get store() {\n return this._store;\n }\n @State() _store: ObservableMap<ValidatorValueStore>;\n\n /** The current form payload as a reactive proxy. @readonly */\n @Prop()\n get payload() {\n return this._store.state;\n }\n\n /** Returns true if validation errors will be displayed to the user. @readonly */\n @Prop()\n get showValidation() {\n return (this.validateOn === 'dirty' && this.dirty) || this.submitted;\n }\n\n /** Get the current validation state of all form fields. @readonly\n * ```\n {\n fields: NanoFormEles[];\n valid: boolean;\n validityMessage: string;\n dirty: boolean;\n name: string | number;\n value: any;\n }[]\n ```\n */\n @Prop()\n get validationState(): ValidationState[] {\n // TODO - migrate nano-fields away from using proprietary methods in a bid to be closer to the spec\n\n // this is big and ugly.\n // why? Cos' it must unify checking validity state for both\n // `nano-...` and plain form fields.\n const validationState: ValidationState[] = [];\n\n this.allFields.forEach(async (field) => {\n const found = validationState.find((v) => v.name === this.getName(field));\n let pf: PlainFormEles;\n let nf: NanoFormEles;\n\n if (found) {\n if ((field as PlainFormEles).validationMessage) {\n pf = field as PlainFormEles;\n found.validityMessage = pf.validationMessage.length\n ? pf.validationMessage\n : found.validityMessage;\n this.internalValidate = true;\n if (found.valid && !pf.checkValidity()) found.valid = false;\n this.internalValidate = false;\n } else if ((field as NanoFormEles).validityMessage) {\n nf = field as NanoFormEles;\n found.validityMessage = nf.validityMessage.length\n ? nf.validityMessage\n : nf.validityMessage;\n if (found.valid && nf.invalid) found.valid = false;\n }\n if (!found.fields.find((f) => f === field)) found.fields.push(field);\n }\n\n let valid: boolean;\n let validityMessage: string;\n\n if ((field as PlainFormEles).checkValidity) {\n pf = field as PlainFormEles;\n this.internalValidate = true;\n valid = pf.checkValidity();\n this.internalValidate = false;\n validityMessage = pf.validationMessage;\n } else {\n nf = field as NanoFormEles;\n valid = !nf.invalid;\n validityMessage = nf.validityMessage;\n }\n\n validationState.push({\n fields: [field],\n name: this.getName(field),\n value: this._store.state[this.getName(field)],\n dirty: false,\n valid,\n validityMessage,\n });\n });\n\n return validationState;\n }\n\n /** By default, `nano-field-validator` will also track all native form field elements.\n * You can add extra web-component form fields to listen to\n * (as long as they match the standard form field spec) by using the `fieldSelector` prop.\n */\n @Prop() extraFieldSelector: string = 'input, select, textarea';\n\n /** A validation callback method.\n * @param field - The field name currently being evaluated\n * @param value - The value of the field currently being evaluated\n * @param fields - an array of all currently observered form fields and values\n * @returns field names mapped to an object of status message and validity e.g.\n * ```js\n * {field1: {msg: `This is invalid!`}, field2: {msg: `This is valid!`, valid: true}}\n * ```\n */\n @Prop() validation: (\n field: string,\n value: string,\n fields: ValidatorValueStore\n ) => { [key: string]: { msg: string; valid?: boolean } };\n\n /**\n * Sets the state of the form using an object of key / value pairs.\n * @param state - the state to load in the store\n */\n @Method()\n async setStore(state: ValidatorValueStore) {\n Object.entries(state).forEach(([key, val]) => {\n this.store.state[key] = val;\n });\n }\n\n /**\n * Sets custom validity for all / some form fields.\n * @param validity - a validity object of `{fieldName: errorString}` pairs. Set as an empty string to clear the error.\n */\n @Method()\n async setCustomValidity(validity: { [key: string]: string }) {\n return await Promise.all(\n Object.entries(validity).map(async ([key, err]) => {\n const field = this.allFields.find((f) => this.getName(f) === key);\n if (!!field) await this.setFieldError(field, err);\n })\n );\n }\n\n /**\n * Clear all custom validation.\n * @param validity\n */\n @Method()\n async resetValidity() {\n return await Promise.all(\n this.allFields.map(async (field) => await this.setFieldError(field, ''))\n );\n }\n\n /** Fired whenever the payload changes */\n @Event() nanoPayloadChange: EventEmitter<ValidatorValueStore>;\n\n /**\n * Fired on valid form submission.\n * Note: if you wish to prevent a form from submitting, instead\n * of using / preventing the native `submit` event, use this event\n * ```js\n * ele.addEventListener('nanoSubmit', (e) => {\n * e.preventDefault()\n * })\n * ```\n */\n @Event() nanoSubmit: EventEmitter;\n\n /** Fire on invalid form submission attempt */\n @Event() nanoInvalid: EventEmitter;\n\n // private methods\n\n @Watch('extraFieldSelector')\n attachSlotObserver() {\n if (!!this.mo) return;\n const mo = (this.mo = new MutationObserver((_entries) => {\n const form = this.host.querySelector('form');\n if (form && form !== this.activeForm) this.activeForm = form;\n this.setupFields();\n }));\n mo.observe(this.host, {\n childList: true,\n attributes: true,\n attributeFilter: ['name'],\n subtree: true,\n });\n }\n\n /**\n * During spec tests, mockelement props aren't set - only attributes.\n * This irons out that kink\n * @param field\n * @returns\n */\n private getName(field: PlainFormEles | NanoFormEles) {\n return field.name || field.getAttribute('name');\n }\n\n /** Checks for new `nano-...` fields and adds them to our watch array and value store */\n private setupFields() {\n let nanoFields = Array.from(\n this.host.querySelectorAll<NanoFormEles>(this.nanoFieldSelector)\n );\n\n let plainFields = Array.from(\n this.host.querySelectorAll<PlainFormEles>(this.extraFieldSelector)\n ).filter((e) => !e.closest(this.nanoFieldSelector));\n\n nanoFields = nanoFields.filter(\n (f) => !!this.getName(f) && !!this.getName(f).length\n );\n plainFields = plainFields.filter(\n (f) => !!this.getName(f) && !!this.getName(f).length\n );\n\n // do we have any currently un-watched fields?\n if (\n ![...nanoFields, ...plainFields].filter(\n (f) => !this.allFields.includes(f)\n ).length\n )\n return;\n\n // setup the initial store state / refresh on new fields\n this.nanoFields = nanoFields;\n this.plainFields = plainFields;\n this.allFields = [...nanoFields, ...plainFields];\n\n this.storeToFields(this.allFields);\n\n this.validateOnChange();\n this.fieldsToStore(this.allFields);\n this.nanoPayloadChange.emit(this._store.state);\n }\n\n private storeToFields(fields: Array<NanoFormEles | PlainFormEles>) {\n fields.forEach((field) => {\n const fieldName = this.getName(field);\n if (\n !fieldName.length ||\n typeof this._store.state[fieldName] === 'undefined'\n )\n return;\n\n if (\n field.tagName === 'NANO-CHECKBOX' ||\n ['radio', 'checkbox'].includes((field as HTMLInputElement).type)\n ) {\n let cb = field as HTMLNanoCheckboxElement;\n if (\n cb.type === 'radio' ||\n cb.type === 'segment' ||\n cb.type === 'segment-pill'\n ) {\n // single radio type control\n if (this._store.state[fieldName] === cb.value) cb.checked = true;\n else cb.checked = false;\n } else if (Array.isArray(this._store.state[fieldName])) {\n // multiple checkbox like controls\n if (this._store.state[fieldName].includes(cb.value))\n cb.checked = true;\n else cb.checked = false;\n } else {\n // single checkbox like control\n if (this._store.state[fieldName] === cb.value) cb.checked = true;\n else cb.checked = false;\n }\n return;\n }\n\n if (field.tagName === 'NANO-FILE-UPLOAD') {\n const ff = field as HTMLNanoFileUploadElement;\n // this can only work if the field is empty rn... a one-time deal\n if (!ff.files?.length) ff.files = this._store.state[fieldName];\n return;\n }\n\n // default\n field.value = this._store.state[fieldName];\n });\n }\n\n /** Loops through all `nano-...` fields and extracts their values into our store */\n private fieldsToStore(fields: Array<NanoFormEles | PlainFormEles>) {\n fields.forEach((field) => {\n const fieldName = this.getName(field);\n if (!fieldName.length) return;\n\n if (\n field.tagName === 'NANO-CHECKBOX' ||\n ['radio', 'checkbox'].includes((field as HTMLInputElement).type)\n ) {\n let cb = field as HTMLNanoCheckboxElement;\n\n if (\n cb.type === 'radio' ||\n cb.type === 'segment' ||\n cb.type === 'segment-pill'\n ) {\n // radio type control - only one can be checked\n if (cb.checked) this._store.state[fieldName] = cb.value;\n } else if (\n this.allFields.filter(\n (f) =>\n this.getName(f) === fieldName &&\n (f.tagName === 'NANO-CHECKBOX' ||\n (f as HTMLInputElement).type === 'checkbox')\n ).length > 1\n ) {\n // multiple checkbox type control\n const currentArr = Array.isArray(this._store.state[fieldName])\n ? this._store.state[fieldName]\n : [];\n if (cb.checked) {\n // checked\n if (!this._store.state[fieldName].includes(cb.value)) {\n this._store.state[fieldName] = [...currentArr, cb.value];\n }\n } else {\n // unchecked\n this._store.state[fieldName] = currentArr.filter(\n (v) => v !== cb.value\n );\n }\n } else {\n // single checkbox - on or off\n if (cb.checked) this._store.state[fieldName] = cb.value;\n else this._store.state[fieldName] = '';\n }\n return;\n }\n\n if (field.tagName === 'NANO-FILE-UPLOAD') {\n const ff = field as HTMLNanoFileUploadElement;\n if (!this.fileStateEqual(fieldName, ff))\n this._store.state[fieldName] = ff.files;\n\n return;\n }\n\n // default\n this._store.state[fieldName] = field.value;\n });\n }\n\n /**\n * Tries to ascertain whether the current model\n * value is the same as the `nano-file-upload` value\n * @param fieldName - the key to access from the data store\n * @param field - the nano-file-upload field to assess against\n * @returns true for equal, false for not equal\n */\n private fileStateEqual(\n fieldName: string | number,\n field: HTMLNanoFileUploadElement\n ) {\n return (\n JSON.stringify(this._store.state[fieldName]) ===\n JSON.stringify(field.files) ||\n this._store.state[fieldName] == field.files\n );\n }\n\n /**\n * Checks for user defined validations\n * @param key - current key of the data model to validate\n * @param newVal - the newly set, incoming value to validate\n */\n private async validate(key: string | number, newVal: any) {\n if (!this.validation) return;\n\n const res = this.validation(key as string, newVal, this._store.state);\n\n // no nothing - return\n if (!res) return;\n\n // stencil public methods are async\n // so we must coerce our validation\n // collection loop into a promise\n await Promise.all(\n Object.entries(res).map(async ([key, o]) => {\n // switch on/off validation messages\n const field = this.allFields.find((f) => this.getName(f) === key);\n let validityTarget:\n | PlainFormEles\n | NanoFormEles\n | HTMLNanoCheckboxGroupElement = field;\n\n if (field.tagName === 'NANO-CHECKBOX') {\n // if we have a checkbox-group, set the validation message there\n const cbg = field.closest('nano-checkbox-group');\n validityTarget = cbg || field;\n }\n\n if (\n ((validityTarget as NanoFormEles).validityMessage ||\n (validityTarget as PlainFormEles).validationMessage) === o.msg &&\n o.valid\n ) {\n // status is now valid - clear the error\n await this.setFieldError(validityTarget, '');\n } else if (!o.valid) {\n // status is invalid. Set the error\n await this.setFieldError(validityTarget, o.msg);\n }\n })\n );\n }\n\n /** Loops through all store entries and checks custom validation */\n private async validateAllFields() {\n // This forces our loop to `await` and finish sequentially ... silly async stencil methods\n await Object.entries(this._store.state).reduce(\n async (memo, [key, value]) => {\n await memo;\n await this.validate(key, value);\n },\n undefined as any\n );\n }\n\n /**\n * Utility to smooth out setting error messages\n * (it's a different method on `nano-checkbox` 'cos they don't show errors themselves)\n * @param field\n * @param msg\n */\n private async setFieldError(\n field: NanoFormEles | HTMLNanoCheckboxGroupElement | PlainFormEles,\n msg: string\n ) {\n if (field['showError']) {\n await (field as Exclude<NanoFormEles, HTMLNanoCheckboxElement>).showError(\n msg\n );\n } else if (field['setError'])\n await (field as HTMLNanoCheckboxElement).setError(msg);\n else (field as PlainFormEles).setCustomValidity(msg);\n }\n\n private scrollToFirstInvalid() {\n if (!this.scrollToInvalid) return;\n\n setTimeout(() => {\n const invalidField = this.validationState.find((f) => !f.valid);\n if (!invalidField) return;\n invalidField.fields[0].scrollIntoView({\n behavior: 'smooth',\n block: 'nearest',\n });\n }, 200);\n }\n\n private submitForm() {\n const nanoSubmit = this.nanoSubmit.emit();\n if (nanoSubmit.defaultPrevented) return;\n this.activeForm.submit();\n }\n\n // Event handlers\n\n /**\n * Fired whenever store values change and potentially checks validity\n * @param key - the key of the store that's just changed\n * @param newVal - the incoming, new value\n */\n private handleStoreChange = async (key: string | number, newVal: any) => {\n const found = this.allFields.find((field) => this.getName(field) === key);\n\n // field update has come programmatically (not from ui),\n // so let's update the underlying ui field\n if (\n found &&\n ((found.tagName === 'NANO-FILE-UPLOAD' &&\n !this.fileStateEqual(key, found as HTMLNanoFileUploadElement)) ||\n (found.tagName !== 'NANO-FILE-UPLOAD' && found.value !== newVal))\n ) {\n this.storeToFields([found]);\n }\n\n if (this.validateOn === 'dirty' && this.dirty) {\n this.internalValidate = true;\n await this.validateAllFields();\n this._valid = this.activeForm.checkValidity();\n this.internalValidate = false;\n }\n this.nanoPayloadChange.emit(this._store.state);\n };\n\n /**\n * Handles nano field value changes and passes to store\n * @param ev - the incoming change event\n */\n private handleFieldChange = (ev: NanoFormEvent) => {\n if (!this.nanoFields.includes(ev.target)) return;\n this._dirty = true;\n this.fieldsToStore([ev.target]);\n };\n\n /**\n * Handles non-nano field value changes and passes to store\n * @param ev - the incoming change event\n */\n private handlePlainFieldChange = (ev: PlainFormEvent) => {\n if (!this.plainFields.includes(ev.target)) return;\n this.fieldsToStore([ev.target]);\n };\n\n /**\n * Handles default field validation events\n * @param ev - the invalid event\n */\n private handleFormInvalid = async (ev: Event & { target: PlainFormEles }) => {\n // if it's a non-nano field, we'll let default html5 validation do it's thing\n if (!this.plainFields.includes(ev.target)) {\n ev.preventDefault();\n }\n\n this._valid = false;\n\n // whenever `checkValidity` is called, this handler is in-turn called.\n // this flag is used to stop infinite loops\n if (this.internalValidate) return;\n\n // a submit must have happened to if 'submitThenDirty' turn on 'dirty' checking now\n if (this.validateOn === 'submitThenDirty') this.validateOn = 'dirty';\n this.submitted = true;\n\n await this.validateAllFields();\n this.internalValidate = true;\n this._valid = this.activeForm.checkValidity();\n this.internalValidate = false;\n\n // kinda insane...but if we're only validating on submit, then if the form is currently\n // in an invalid state, when submitting, it will fire an invalid event and not\n // submit the form. So let's test to make sure it is really invalid, and submit if not\n if (this.validateOn === 'submit') {\n if (this._valid) {\n this.submitForm();\n return;\n }\n }\n\n this.scrollToFirstInvalid();\n this.nanoInvalid.emit();\n };\n\n /**\n * stops default form submission, checks if valid, then submits manually\n * @param e - a submit event from the nested form element\n */\n private handleSubmit = async (e: Event) => {\n e.preventDefault();\n if (this.validateOn === 'submitThenDirty') this.validateOn = 'dirty';\n this.submitted = true;\n await this.validateAllFields();\n\n this.internalValidate = true;\n this._valid = this.activeForm.checkValidity();\n this.internalValidate = false;\n\n if (!this._valid) {\n this.scrollToFirstInvalid();\n return;\n }\n this.submitForm();\n };\n\n connectedCallback(): void {\n this.userForm = this.host.querySelector('form');\n this._store = createStore<ValidatorValueStore>({});\n }\n\n componentDidLoad() {\n requestAnimationFrame(() => {\n this.setupFields();\n this.attachSlotObserver();\n\n this.host.addEventListener('nanoChange', this.handleFieldChange);\n this.host.addEventListener('input', this.handlePlainFieldChange);\n this.host.addEventListener('change', this.handlePlainFieldChange);\n this.host.addEventListener('submit', this.handleSubmit);\n this._store.on('set', this.handleStoreChange);\n });\n }\n\n disconnectedCallback() {\n if (this.mo) this.mo.disconnect();\n\n this.host.removeEventListener('nanoChange', this.handleFieldChange);\n this.host.removeEventListener('input', this.handlePlainFieldChange);\n this.host.removeEventListener('change', this.handlePlainFieldChange);\n this.host.removeEventListener('submit', this.handleSubmit);\n this._store.reset();\n\n if (this.activeForm)\n this.activeForm.removeEventListener(\n 'invalid',\n this.handleFormInvalid,\n true\n );\n }\n\n render() {\n return (\n <Host>\n {this.userForm && <slot />}\n {!this.userForm && (\n <form ref={(f) => (this.activeForm = f)}>\n <slot />\n </form>\n )}\n </Host>\n );\n }\n}\n"]}

package/dist/nano-components/p-bc34955f.system.entry.js ADDED Viewed

@@ -0,0 +1,5 @@
+var __awaiter=this&&this.__awaiter||function(e,t,r,i){function n(e){return e instanceof r?e:new r((function(t){t(e)}))}return new(r||(r=Promise))((function(r,a){function s(e){try{l(i.next(e))}catch(t){a(t)}}function o(e){try{l(i["throw"](e))}catch(t){a(t)}}function l(e){e.done?r(e.value):n(e.value).then(s,o)}l((i=i.apply(e,t||[])).next())}))};var __generator=this&&this.__generator||function(e,t){var r={label:0,sent:function(){if(a[0]&1)throw a[1];return a[1]},trys:[],ops:[]},i,n,a,s;return s={next:o(0),throw:o(1),return:o(2)},typeof Symbol==="function"&&(s[Symbol.iterator]=function(){return this}),s;function o(e){return function(t){return l([e,t])}}function l(s){if(i)throw new TypeError("Generator is already executing.");while(r)try{if(i=1,n&&(a=s[0]&2?n["return"]:s[0]?n["throw"]||((a=n["return"])&&a.call(n),0):n.next)&&!(a=a.call(n,s[1])).done)return a;if(n=0,a)s=[s[0]&2,a.value];switch(s[0]){case 0:case 1:a=s;break;case 4:r.label++;return{value:s[1],done:false};case 5:r.label++;n=s[1];s=[0];continue;case 7:s=r.ops.pop();r.trys.pop();continue;default:if(!(a=r.trys,a=a.length>0&&a[a.length-1])&&(s[0]===6||s[0]===2)){r=0;continue}if(s[0]===3&&(!a||s[1]>a[0]&&s[1]<a[3])){r.label=s[1];break}if(s[0]===6&&r.label<a[1]){r.label=a[1];a=s;break}if(a&&r.label<a[2]){r.label=a[2];r.ops.push(s);break}if(a[2])r.ops.pop();r.trys.pop();continue}s=t.call(e,r)}catch(o){s=[6,o];n=0}finally{i=a=0}if(s[0]&5)throw s[1];return{value:s[0]?s[1]:void 0,done:true}}};var __spreadArray=this&&this.__spreadArray||function(e,t){for(var r=0,i=t.length,n=e.length;r<i;r++,n++)e[n]=t[r];return e};
+/*!
+ * Web Components for Nanopore digital Web Apps
+ */System.register(["./p-f48be9f5.system.js"],(function(e){"use strict";var t,r,i,n,a,s,o;return{setters:[function(e){t=e.k;r=e.j;i=e.r;n=e.c;a=e.h;s=e.e;o=e.g}],execute:function(){var l=function(e,t,r){var i=e.get(t);if(!i){e.set(t,[r])}else if(!i.includes(r)){i.push(r)}};var u=function(e,t){var r;return function(){var i=[];for(var n=0;n<arguments.length;n++){i[n]=arguments[n]}if(r){clearTimeout(r)}r=setTimeout((function(){r=0;e.apply(void 0,i)}),t)}};var c=function(e){return!("isConnected"in e)||e.isConnected};var f=u((function(e){for(var t=0,r=e.keys();t<r.length;t++){var i=r[t];e.set(i,e.get(i).filter(c))}}),2e3);var h=function(){if(typeof t!=="function"){return{}}var e=new Map;return{dispose:function(){return e.clear()},get:function(r){var i=t();if(i){l(e,r,i)}},set:function(t){var i=e.get(t);if(i){e.set(t,i.filter(r))}f(e)},reset:function(){e.forEach((function(e){return e.forEach(r)}));f(e)}}};var d=function(e,t){if(t===void 0){t=function(e,t){return e!==t}}var r=new Map(Object.entries(e!==null&&e!==void 0?e:{}));var i={dispose:[],get:[],set:[],reset:[]};var n=function(){r=new Map(Object.entries(e!==null&&e!==void 0?e:{}));i.reset.forEach((function(e){return e()}))};var a=function(){i.dispose.forEach((function(e){return e()}));n()};var s=function(e){i.get.forEach((function(t){return t(e)}));return r.get(e)};var o=function(e,n){var a=r.get(e);if(t(n,a,e)){r.set(e,n);i.set.forEach((function(t){return t(e,n,a)}))}};var l=typeof Proxy==="undefined"?{}:new Proxy(e,{get:function(e,t){return s(t)},ownKeys:function(e){return Array.from(r.keys())},getOwnPropertyDescriptor:function(){return{enumerable:true,configurable:true}},has:function(e,t){return r.has(t)},set:function(e,t,r){o(t,r);return true}});var u=function(e,t){i[e].push(t);return function(){v(i[e],t)}};var c=function(t,r){var i=u("set",(function(e,i){if(e===t){r(i)}}));var n=u("reset",(function(){return r(e[t])}));return function(){i();n()}};var f=function(){var e=[];for(var t=0;t<arguments.length;t++){e[t]=arguments[t]}var r=e.reduce((function(e,t){if(t.set){e.push(u("set",t.set))}if(t.get){e.push(u("get",t.get))}if(t.reset){e.push(u("reset",t.reset))}if(t.dispose){e.push(u("dispose",t.dispose))}return e}),[]);return function(){return r.forEach((function(e){return e()}))}};var h=function(e){var t=r.get(e);i.set.forEach((function(r){return r(e,t,t)}))};return{state:l,get:s,set:o,on:u,onChange:c,use:f,dispose:a,reset:n,forceUpdate:h}};var v=function(e,t){var r=e.indexOf(t);if(r>=0){e[r]=e[e.length-1];e.length--}};var g=function(e,t){var r=d(e,t);r.use(h());return r};var p=e("nano_field_validator",function(){function e(e){var t=this;i(this,e);this.nanoPayloadChange=n(this,"nanoPayloadChange",7);this.nanoSubmit=n(this,"nanoSubmit",7);this.nanoInvalid=n(this,"nanoInvalid",7);this.submitted=false;this.allFields=[];this.nanoFieldSelector="\n    nano-input,\n    nano-select,\n    nano-file-upload,\n    nano-date-input,\n    nano-checkbox\n  ";this.internalValidate=false;this.validateOn="submitThenDirty";this.scrollToInvalid=true;this._dirty=false;this.extraFieldSelector="input, select, textarea";this.handleStoreChange=function(e,r){return __awaiter(t,void 0,void 0,(function(){var t;var i=this;return __generator(this,(function(n){switch(n.label){case 0:t=this.allFields.find((function(t){return i.getName(t)===e}));if(t&&(t.tagName==="NANO-FILE-UPLOAD"&&!this.fileStateEqual(e,t)||t.tagName!=="NANO-FILE-UPLOAD"&&t.value!==r)){this.storeToFields([t])}if(!(this.validateOn==="dirty"&&this.dirty))return[3,2];this.internalValidate=true;return[4,this.validateAllFields()];case 1:n.sent();this._valid=this.activeForm.checkValidity();this.internalValidate=false;n.label=2;case 2:this.nanoPayloadChange.emit(this._store.state);return[2]}}))}))};this.handleFieldChange=function(e){if(!t.nanoFields.includes(e.target))return;t._dirty=true;t.fieldsToStore([e.target])};this.handlePlainFieldChange=function(e){if(!t.plainFields.includes(e.target))return;t.fieldsToStore([e.target])};this.handleFormInvalid=function(e){return __awaiter(t,void 0,void 0,(function(){return __generator(this,(function(t){switch(t.label){case 0:if(!this.plainFields.includes(e.target)){e.preventDefault()}this._valid=false;if(this.internalValidate)return[2];if(this.validateOn==="submitThenDirty")this.validateOn="dirty";this.submitted=true;return[4,this.validateAllFields()];case 1:t.sent();this.internalValidate=true;this._valid=this.activeForm.checkValidity();this.internalValidate=false;if(this.validateOn==="submit"){if(this._valid){this.submitForm();return[2]}}this.scrollToFirstInvalid();this.nanoInvalid.emit();return[2]}}))}))};this.handleSubmit=function(e){return __awaiter(t,void 0,void 0,(function(){return __generator(this,(function(t){switch(t.label){case 0:e.preventDefault();if(this.validateOn==="submitThenDirty")this.validateOn="dirty";this.submitted=true;return[4,this.validateAllFields()];case 1:t.sent();this.internalValidate=true;this._valid=this.activeForm.checkValidity();this.internalValidate=false;if(!this._valid){this.scrollToFirstInvalid();return[2]}this.submitForm();return[2]}}))}))}}e.prototype.userFormChange=function(){if(!!this.userForm)this.activeForm=this.userForm};Object.defineProperty(e.prototype,"activeForm",{get:function(){return this._activeForm},set:function(e){if(!e)return;if(this._activeForm){this._activeForm.removeEventListener("invalid",this.handleFormInvalid,true)}e.addEventListener("invalid",this.handleFormInvalid,true);this._activeForm=e},enumerable:false,configurable:true});e.prototype.validateOnChange=function(){var e=this;this.nanoFields.forEach((function(t){if(t.tagName==="NANO-CHECKBOX"){var r=t.closest("nano-checkbox-group");if(r)r.validateOn=e.validateOn}else{t.validateOn=e.validateOn}}))};Object.defineProperty(e.prototype,"dirty",{get:function(){return this._dirty},enumerable:false,configurable:true});Object.defineProperty(e.prototype,"valid",{get:function(){return this._valid},enumerable:false,configurable:true});Object.defineProperty(e.prototype,"store",{get:function(){return this._store},enumerable:false,configurable:true});Object.defineProperty(e.prototype,"payload",{get:function(){return this._store.state},enumerable:false,configurable:true});Object.defineProperty(e.prototype,"showValidation",{get:function(){return this.validateOn==="dirty"&&this.dirty||this.submitted},enumerable:false,configurable:true});Object.defineProperty(e.prototype,"validationState",{get:function(){var e=this;var t=[];this.allFields.forEach((function(r){return __awaiter(e,void 0,void 0,(function(){var e,i,n,a,s;var o=this;return __generator(this,(function(l){e=t.find((function(e){return e.name===o.getName(r)}));if(e){if(r.validationMessage){i=r;e.validityMessage=i.validationMessage.length?i.validationMessage:e.validityMessage;this.internalValidate=true;if(e.valid&&!i.checkValidity())e.valid=false;this.internalValidate=false}else if(r.validityMessage){n=r;e.validityMessage=n.validityMessage.length?n.validityMessage:n.validityMessage;if(e.valid&&n.invalid)e.valid=false}if(!e.fields.find((function(e){return e===r})))e.fields.push(r)}if(r.checkValidity){i=r;this.internalValidate=true;a=i.checkValidity();this.internalValidate=false;s=i.validationMessage}else{n=r;a=!n.invalid;s=n.validityMessage}t.push({fields:[r],name:this.getName(r),value:this._store.state[this.getName(r)],dirty:false,valid:a,validityMessage:s});return[2]}))}))}));return t},enumerable:false,configurable:true});e.prototype.setStore=function(e){return __awaiter(this,void 0,void 0,(function(){var t=this;return __generator(this,(function(r){Object.entries(e).forEach((function(e){var r=e[0],i=e[1];t.store.state[r]=i}));return[2]}))}))};e.prototype.setCustomValidity=function(e){return __awaiter(this,void 0,void 0,(function(){var t=this;return __generator(this,(function(r){switch(r.label){case 0:return[4,Promise.all(Object.entries(e).map((function(e){var r=e[0],i=e[1];return __awaiter(t,void 0,void 0,(function(){var e;var t=this;return __generator(this,(function(n){switch(n.label){case 0:e=this.allFields.find((function(e){return t.getName(e)===r}));if(!!!e)return[3,2];return[4,this.setFieldError(e,i)];case 1:n.sent();n.label=2;case 2:return[2]}}))}))})))];case 1:return[2,r.sent()]}}))}))};e.prototype.resetValidity=function(){return __awaiter(this,void 0,void 0,(function(){var e=this;return __generator(this,(function(t){switch(t.label){case 0:return[4,Promise.all(this.allFields.map((function(t){return __awaiter(e,void 0,void 0,(function(){return __generator(this,(function(e){switch(e.label){case 0:return[4,this.setFieldError(t,"")];case 1:return[2,e.sent()]}}))}))})))];case 1:return[2,t.sent()]}}))}))};e.prototype.attachSlotObserver=function(){var e=this;if(!!this.mo)return;var t=this.mo=new MutationObserver((function(t){var r=e.host.querySelector("form");if(r&&r!==e.activeForm)e.activeForm=r;e.setupFields()}));t.observe(this.host,{childList:true,attributes:true,attributeFilter:["name"],subtree:true})};e.prototype.getName=function(e){return e.name||e.getAttribute("name")};e.prototype.setupFields=function(){var e=this;var t=Array.from(this.host.querySelectorAll(this.nanoFieldSelector));var r=Array.from(this.host.querySelectorAll(this.extraFieldSelector)).filter((function(t){return!t.closest(e.nanoFieldSelector)}));t=t.filter((function(t){return!!e.getName(t)&&!!e.getName(t).length}));r=r.filter((function(t){return!!e.getName(t)&&!!e.getName(t).length}));if(!__spreadArray(__spreadArray([],t),r).filter((function(t){return!e.allFields.includes(t)})).length)return;this.nanoFields=t;this.plainFields=r;this.allFields=__spreadArray(__spreadArray([],t),r);this.storeToFields(this.allFields);this.validateOnChange();this.fieldsToStore(this.allFields);this.nanoPayloadChange.emit(this._store.state)};e.prototype.storeToFields=function(e){var t=this;e.forEach((function(e){var r;var i=t.getName(e);if(!i.length||typeof t._store.state[i]==="undefined")return;if(e.tagName==="NANO-CHECKBOX"||["radio","checkbox"].includes(e.type)){var n=e;if(n.type==="radio"||n.type==="segment"||n.type==="segment-pill"){if(t._store.state[i]===n.value)n.checked=true;else n.checked=false}else if(Array.isArray(t._store.state[i])){if(t._store.state[i].includes(n.value))n.checked=true;else n.checked=false}else{if(t._store.state[i]===n.value)n.checked=true;else n.checked=false}return}if(e.tagName==="NANO-FILE-UPLOAD"){var a=e;if(!((r=a.files)===null||r===void 0?void 0:r.length))a.files=t._store.state[i];return}e.value=t._store.state[i]}))};e.prototype.fieldsToStore=function(e){var t=this;e.forEach((function(e){var r=t.getName(e);if(!r.length)return;if(e.tagName==="NANO-CHECKBOX"||["radio","checkbox"].includes(e.type)){var i=e;if(i.type==="radio"||i.type==="segment"||i.type==="segment-pill"){if(i.checked)t._store.state[r]=i.value}else if(t.allFields.filter((function(e){return t.getName(e)===r&&(e.tagName==="NANO-CHECKBOX"||e.type==="checkbox")})).length>1){var n=Array.isArray(t._store.state[r])?t._store.state[r]:[];if(i.checked){if(!t._store.state[r].includes(i.value)){t._store.state[r]=__spreadArray(__spreadArray([],n),[i.value])}}else{t._store.state[r]=n.filter((function(e){return e!==i.value}))}}else{if(i.checked)t._store.state[r]=i.value;else t._store.state[r]=""}return}if(e.tagName==="NANO-FILE-UPLOAD"){var a=e;if(!t.fileStateEqual(r,a))t._store.state[r]=a.files;return}t._store.state[r]=e.value}))};e.prototype.fileStateEqual=function(e,t){return JSON.stringify(this._store.state[e])===JSON.stringify(t.files)||this._store.state[e]==t.files};e.prototype.validate=function(e,t){return __awaiter(this,void 0,void 0,(function(){var r;var i=this;return __generator(this,(function(n){switch(n.label){case 0:if(!this.validation)return[2];r=this.validation(e,t,this._store.state);if(!r)return[2];return[4,Promise.all(Object.entries(r).map((function(e){var t=e[0],r=e[1];return __awaiter(i,void 0,void 0,(function(){var e,i,n;var a=this;return __generator(this,(function(s){switch(s.label){case 0:e=this.allFields.find((function(e){return a.getName(e)===t}));i=e;if(e.tagName==="NANO-CHECKBOX"){n=e.closest("nano-checkbox-group");i=n||e}if(!((i.validityMessage||i.validationMessage)===r.msg&&r.valid))return[3,2];return[4,this.setFieldError(i,"")];case 1:s.sent();return[3,4];case 2:if(!!r.valid)return[3,4];return[4,this.setFieldError(i,r.msg)];case 3:s.sent();s.label=4;case 4:return[2]}}))}))})))];case 1:n.sent();return[2]}}))}))};e.prototype.validateAllFields=function(){return __awaiter(this,void 0,void 0,(function(){var e=this;return __generator(this,(function(t){switch(t.label){case 0:return[4,Object.entries(this._store.state).reduce((function(t,r){var i=r[0],n=r[1];return __awaiter(e,void 0,void 0,(function(){return __generator(this,(function(e){switch(e.label){case 0:return[4,t];case 1:e.sent();return[4,this.validate(i,n)];case 2:e.sent();return[2]}}))}))}),undefined)];case 1:t.sent();return[2]}}))}))};e.prototype.setFieldError=function(e,t){return __awaiter(this,void 0,void 0,(function(){return __generator(this,(function(r){switch(r.label){case 0:if(!e["showError"])return[3,2];return[4,e.showError(t)];case 1:r.sent();return[3,5];case 2:if(!e["setError"])return[3,4];return[4,e.setError(t)];case 3:r.sent();return[3,5];case 4:e.setCustomValidity(t);r.label=5;case 5:return[2]}}))}))};e.prototype.scrollToFirstInvalid=function(){var e=this;if(!this.scrollToInvalid)return;setTimeout((function(){var t=e.validationState.find((function(e){return!e.valid}));if(!t)return;t.fields[0].scrollIntoView({behavior:"smooth",block:"nearest"})}),200)};e.prototype.submitForm=function(){var e=this.nanoSubmit.emit();if(e.defaultPrevented)return;this.activeForm.submit()};e.prototype.connectedCallback=function(){this.userForm=this.host.querySelector("form");this._store=g({})};e.prototype.componentDidLoad=function(){var e=this;requestAnimationFrame((function(){e.setupFields();e.attachSlotObserver();e.host.addEventListener("nanoChange",e.handleFieldChange);e.host.addEventListener("input",e.handlePlainFieldChange);e.host.addEventListener("change",e.handlePlainFieldChange);e.host.addEventListener("submit",e.handleSubmit);e._store.on("set",e.handleStoreChange)}))};e.prototype.disconnectedCallback=function(){if(this.mo)this.mo.disconnect();this.host.removeEventListener("nanoChange",this.handleFieldChange);this.host.removeEventListener("input",this.handlePlainFieldChange);this.host.removeEventListener("change",this.handlePlainFieldChange);this.host.removeEventListener("submit",this.handleSubmit);this._store.reset();if(this.activeForm)this.activeForm.removeEventListener("invalid",this.handleFormInvalid,true)};e.prototype.render=function(){var e=this;return a(s,null,this.userForm&&a("slot",null),!this.userForm&&a("form",{ref:function(t){return e.activeForm=t}},a("slot",null)))};Object.defineProperty(e.prototype,"host",{get:function(){return o(this)},enumerable:false,configurable:true});Object.defineProperty(e,"watchers",{get:function(){return{userForm:["userFormChange"],validateOn:["validateOnChange"],extraFieldSelector:["attachSlotObserver"]}},enumerable:false,configurable:true});return e}())}}}));
+//# sourceMappingURL=p-bc34955f.system.entry.js.map