@nanoporetech-digital/components 7.9.0 → 7.9.2
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.
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/cjs/nano-checkbox.cjs.entry.js +8 -4
- package/dist/cjs/nano-checkbox.cjs.entry.js.map +1 -1
- package/dist/cjs/nano-components.cjs.js +1 -1
- package/dist/cjs/nano-datalist_3.cjs.entry.js +7 -6
- package/dist/cjs/nano-datalist_3.cjs.entry.js.map +1 -1
- package/dist/cjs/nano-global-nav-user-profile_3.cjs.entry.js +9 -9
- package/dist/cjs/nano-global-nav-user-profile_3.cjs.entry.js.map +1 -1
- package/dist/collection/components/checkbox/checkbox.js +8 -4
- package/dist/collection/components/checkbox/checkbox.js.map +1 -1
- package/dist/collection/components/datalist/datalist.js +9 -6
- package/dist/collection/components/datalist/datalist.js.map +1 -1
- package/dist/collection/components/select/select.js +9 -9
- package/dist/collection/components/select/select.js.map +1 -1
- package/dist/components/datalist.js +8 -6
- package/dist/components/datalist.js.map +1 -1
- package/dist/components/nano-checkbox.js +8 -4
- package/dist/components/nano-checkbox.js.map +1 -1
- package/dist/components/select.js +9 -9
- package/dist/components/select.js.map +1 -1
- package/dist/esm/loader.js +1 -1
- package/dist/esm/nano-checkbox.entry.js +8 -4
- package/dist/esm/nano-checkbox.entry.js.map +1 -1
- package/dist/esm/nano-components.js +1 -1
- package/dist/esm/nano-datalist_3.entry.js +7 -6
- package/dist/esm/nano-datalist_3.entry.js.map +1 -1
- package/dist/esm/nano-global-nav-user-profile_3.entry.js +9 -9
- package/dist/esm/nano-global-nav-user-profile_3.entry.js.map +1 -1
- package/dist/nano-components/nano-checkbox.entry.js +1 -1
- package/dist/nano-components/nano-checkbox.entry.js.map +1 -1
- package/dist/nano-components/nano-components.esm.js +1 -1
- package/dist/nano-components/nano-components.esm.js.map +1 -1
- package/dist/nano-components/nano-datalist_3.entry.js +1 -1
- package/dist/nano-components/nano-datalist_3.entry.js.map +1 -1
- package/dist/nano-components/nano-global-nav-user-profile_3.entry.js +1 -1
- package/dist/nano-components/nano-global-nav-user-profile_3.entry.js.map +1 -1
- package/docs-json.json +1 -1
- package/hydrate/index.js +24 -19
- package/hydrate/index.mjs +24 -19
- package/package.json +1 -1
package/dist/esm/loader.js
CHANGED
|
@@ -8,7 +8,7 @@ import { g as globalScripts } from './app-globals-f0120bbe.js';
|
|
|
8
8
|
const defineCustomElements = async (win, options) => {
|
|
9
9
|
if (typeof window === 'undefined') return undefined;
|
|
10
10
|
await globalScripts();
|
|
11
|
-
return bootstrapLazy(JSON.parse("[[\"nano-global-nav\",[[1,\"nano-global-nav\",{\"env\":[1],\"ssoDataUrl\":[1,\"sso-data-url\"],\"myAccountData\":[16],\"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\"],\"userProfileUrl\":[32],\"hasLoggedinSlot\":[32],\"hasSiteSlot\":[32],\"hasPromotionSlot\":[32],\"aboutSlotLen\":[32],\"iconSlotLen\":[32],\"mainSlotLen\":[32],\"overflowSlotLen\":[32],\"searchSlotLen\":[32],\"thresholdReady\":[32],\"remoteDataReady\":[32],\"ready\":[32],\"isResizing\":[32],\"threshold\":[32],\"modalOpen\":[32],\"modalIsOpen\":[32],\"searchBarShown\":[32],\"scrollingUp\":[32],\"showAutocomplete\":[32],\"secondaryMenuOpen\":[32],\"userMenuOpen\":[32],\"menuFullScreen\":[32],\"searchLoading\":[32],\"searchValInternal\":[32],\"internalSearchIndeces\":[32],\"submitSearch\":[64],\"toggleOverflowMenu\":[64]},[[0,\"nanoOpen\",\"secondaryOpen\"],[0,\"nanoClose\",\"secondaryClose\"],[16,\"click\",\"menuClose\"]],{\"myAccountData\":[\"handleMyAccountData\"],\"env\":[\"getMyAccData\"],\"ssoDataUrl\":[\"getMyAccData\"],\"searchIndex\":[\"currentSelectedIndex\"],\"searchValInternal\":[\"changeInternalSearchVal\"],\"searchApiKey\":[\"initAlgoliaClient\"],\"searchAppId\":[\"initAlgoliaClient\"],\"searchIndeces\":[\"addIndeces\"],\"internalSearchIndeces\":[\"addAlgoliaIndeces\"],\"threshold\":[\"thresholdChange\"],\"thresholdReady\":[\"assessReady\"],\"remoteDataReady\":[\"assessReady\"],\"showAutocomplete\":[\"setupAutocompleteBlur\",\"resetHitFocus\"],\"secondaryMenuOpen\":[\"closeSearchBar\"],\"aboutSlotLen\":[\"slotChange\"],\"iconSlotLen\":[\"slotChange\"],\"mainSlotLen\":[\"slotChange\"],\"overflowSlotLen\":[\"slotChange\"],\"searchSlotLen\":[\"slotChange\"],\"userMenuOpen\":[\"handleUserMenu\"]}]]],[\"nano-table\",[[4,\"nano-table\",{\"customRenderer\":[16],\"type\":[1],\"caption\":[1],\"showCaption\":[4,\"show-caption\"],\"loading\":[4],\"placeholderSize\":[2,\"placeholder-size\"],\"rows\":[16],\"columns\":[1040],\"headRender\":[16],\"rowRender\":[16],\"footRender\":[16],\"showFooter\":[4,\"show-footer\"],\"perBlock\":[2,\"per-block\"],\"blocksLength\":[2050,\"blocks-length\"],\"searchTerm\":[1,\"search-term\"],\"customFilterFn\":[16],\"customSortFn\":[16],\"defaultSort\":[4,\"default-sort\"],\"virtualTotalItems\":[2,\"virtual-total-items\"],\"appliedFilters\":[2064],\"internalLoading\":[32],\"blocks\":[32],\"activeBlocks\":[32],\"resetSorting\":[64],\"addSort\":[64],\"resetFilters\":[64],\"addFilters\":[64],\"removeFilters\":[64],\"updateRow\":[64]},null,{\"rows\":[\"handleRowsChange\"],\"columns\":[\"handleColsChange\"],\"searchTerm\":[\"handleSearchTermChange\"],\"virtualTotalItems\":[\"virtualTotalItemsChangeHandler\"]}]]],[\"nano-date-input\",[[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]},null,{\"value\":[\"handleValueChange\",\"testDateValidity\"],\"dateOrder\":[\"handleDateOrderChange\"],\"min\":[\"testDateValidity\"],\"max\":[\"testDateValidity\"],\"pickerOpen\":[\"handlePickerOpenChange\"]}]]],[\"nano-dialog\",[[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],\"noDismiss\":[32],\"hasFooter\":[32],\"hidden\":[32],\"show\":[64],\"hide\":[64]},null,{\"open\":[\"handleOpenChange\"],\"hoist\":[\"handleHoistChange\"]}]]],[\"nano-drawer\",[[1,\"nano-drawer\",{\"open\":[1540],\"label\":[513],\"placement\":[513],\"contained\":[516],\"noHeader\":[516,\"no-header\"],\"storeId\":[1,\"store-id\"],\"storeMethod\":[1,\"store-method\"],\"noUserDismiss\":[4,\"no-user-dismiss\"],\"hoist\":[4],\"noDismiss\":[32],\"hasFooter\":[32],\"show\":[64],\"hide\":[64]},null,{\"hoist\":[\"handleHoistChange\"],\"contained\":[\"handleNoModalChange\"],\"open\":[\"handleOpenChange\"]}]]],[\"nano-hero\",[[1,\"nano-hero\",{\"imgSrc\":[1,\"img-src\"],\"imgSrcSet\":[1,\"img-src-set\"],\"largeScreenBP\":[2,\"large-screen-b-p\"],\"theme\":[1],\"level\":[1],\"hasIconBox\":[32],\"hasScrim\":[32],\"hasSecondaryContent\":[32],\"hasQuote\":[32],\"hasBg\":[32],\"hasBackBtn\":[32],\"hasCtas\":[32],\"breadCrumbs\":[32],\"iconBoxItems\":[32]},null,{\"breadCrumbs\":[\"breadCrumbChange\"],\"iconBoxItems\":[\"iconBoxItemChange\"]}]]],[\"nano-alert\",[[1,\"nano-alert\",{\"open\":[1540],\"closable\":[516],\"color\":[513],\"duration\":[2],\"hoist\":[4],\"isModal\":[32],\"isToast\":[32],\"isShowing\":[32],\"label\":[32],\"noDismiss\":[32],\"show\":[64],\"hide\":[64],\"toast\":[64],\"alert\":[64]},null,{\"open\":[\"handleOpenChange\"],\"duration\":[\"handleDurationChange\"],\"hoist\":[\"handleHoistChange\"]}]]],[\"nano-file-upload\",[[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\"]],{\"fileList\":[\"fileListChange\",\"shouldValidate\"],\"maxFiles\":[\"shouldValidate\"],\"maxFileSize\":[\"shouldValidate\"],\"capture\":[\"shouldValidate\"],\"accept\":[\"shouldValidate\"],\"required\":[\"shouldValidate\"],\"disabled\":[\"shouldValidate\"]}]]],[\"nano-overflow-nav\",[[1,\"nano-overflow-nav\",{\"scrollControls\":[4,\"scroll-controls\"],\"orientation\":[513],\"activeHandler\":[16],\"inActiveHandler\":[16],\"isActiveHandler\":[16],\"instantReCalc\":[32],\"hasScrollControls\":[32],\"hideControlEnd\":[32],\"hideControlStart\":[32],\"syncActiveItem\":[64]},null,{\"isActiveHandler\":[\"watchIsActiveHandler\"],\"hasScrollControls\":[\"watchScrollControls\"],\"hideControlEnd\":[\"hideEndBtn\"],\"hideControlStart\":[\"hideStartBtn\"]}]]],[\"nano-tab\",[[1,\"nano-tab\",{\"panel\":[513],\"active\":[516],\"disabled\":[516],\"closable\":[4],\"setFocus\":[64],\"removeFocus\":[64]}]]],[\"nano-global-search-results\",[[1,\"nano-global-search-results\",{\"algoliaResults\":[32],\"algoliaEle\":[32],\"currentWidth\":[32],\"apiKey\":[32],\"appId\":[32],\"index\":[32],\"closeSearch\":[64]},[[16,\"nanoSearchReset\",\"handleGlobalNavReset\"],[16,\"nanoSearchResult\",\"handleGlobalNavSearch\"],[0,\"nanoChange\",\"handleReorder\"],[0,\"nanoResultsShown\",\"attachListeners\"],[16,\"nanoNewResults\",\"attachResultListeners\"]],{\"algoliaEle\":[\"handleAlgoliaCredsChange\",\"handleAlgoliaIndexChange\",\"handleAlgoliaEleChange\"],\"apiKey\":[\"handleAlgoliaCredsChange\"],\"appId\":[\"handleAlgoliaCredsChange\"],\"index\":[\"handleAlgoliaIndexChange\"],\"algoliaResults\":[\"handleAlgoliaEleChange\"]}]]],[\"nano-menu-drawer\",[[1,\"nano-menu-drawer\",{\"open\":[1028],\"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\"]],{\"open\":[\"openChange\"],\"widthOk\":[\"widthChange\"],\"hideHeight\":[\"hideHeightChange\"]}]]],[\"nano-split-pane\",[[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]},null,{\"position\":[\"handlePositionChange\"],\"positionInPixels\":[\"handlePositionInPixelsChange\"]}]]],[\"nano-tab-group\",[[1,\"nano-tab-group\",{\"placement\":[513],\"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],\"tab\":[32],\"show\":[64]},[[0,\"nanoTabClose\",\"handleTabClose\"]],{\"tab\":[\"handleTabNameChange\"],\"placement\":[\"handlePlacementChange\"],\"noScrollControls\":[\"handleNoScrollControlsChange\"],\"hideControlRight\":[\"hideRightBtn\"],\"hideControlLeft\":[\"hideLeftBtn\"],\"hasScrollControls\":[\"watchScrollControls\"]}]]],[\"nano-accordion\",[[1,\"nano-accordion\",{\"color\":[1],\"itemOpened\":[32]},[[0,\"nanoOpened\",\"onToggleHandler\"],[0,\"nanoClosed\",\"onClosedHandler\"]]]]],[\"nano-algolia-filter\",[[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\"]],{\"value\":[\"valueSet\"],\"internalValue\":[\"valueChanged\"],\"facets\":[\"appliedFilterChanged\"],\"tplRenderFn\":[\"tplUpdate\"],\"indexResults\":[\"handleFilterChange\"]}]]],[\"nano-algolia-pagination\",[[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]},null,{\"currentPage\":[\"currentPageChange\"],\"infiniteScroll\":[\"infiniteScrollChange\"]}]]],[\"nano-algolia-results\",[[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]},null,{\"results\":[\"addContentIndex\",\"resultsChange\"],\"tplRenderFn\":[\"resultsChange\"],\"facets\":[\"headerFooterChange\"],\"appendPages\":[\"appendChange\"],\"infiniteScroll\":[\"infiniteScrollChange\"],\"resultsPage\":[\"handlePageChage\"],\"isLoading\":[\"handleLoading\"]}]]],[\"nano-animation\",[[1,\"nano-animation\",{\"name\":[1],\"play\":[1540],\"delay\":[2],\"direction\":[1],\"duration\":[2],\"easing\":[1],\"endDelay\":[2,\"end-delay\"],\"fill\":[1],\"iterations\":[2],\"iterationStart\":[2,\"iteration-start\"],\"keyframes\":[16],\"playbackRate\":[2,\"playback-rate\"],\"currentTime\":[6146,\"current-time\"],\"defaultSlot\":[32],\"cancel\":[64],\"finish\":[64]},null,{\"defaultSlot\":[\"createAnimation\"],\"name\":[\"handleAnimationChange\"],\"delay\":[\"handleAnimationChange\"],\"direction\":[\"handleAnimationChange\"],\"duration\":[\"handleAnimationChange\"],\"easing\":[\"handleAnimationChange\"],\"endDelay\":[\"handleAnimationChange\"],\"fill\":[\"handleAnimationChange\"],\"iterations\":[\"handleAnimationChange\"],\"iterationStart\":[\"handleAnimationChange\"],\"keyframes\":[\"handleAnimationChange\"],\"play\":[\"handlePlayChange\"],\"playbackRate\":[\"handlePlaybackRateChange\"]}]]],[\"nano-checkbox\",[[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\"]],{\"checked\":[\"handleCheckedChange\"],\"type\":[\"typeChange\"],\"indeterminate\":[\"handleIndeterminateChange\"]}]]],[\"nano-checkbox-group\",[[6,\"nano-checkbox-group\",{\"validateOn\":[1025,\"validate-on\"],\"showInlineError\":[4,\"show-inline-error\"],\"min\":[2],\"max\":[2],\"disabled\":[516],\"legend\":[1],\"hideLegend\":[4,\"hide-legend\"],\"invalid\":[2564],\"validityMessage\":[2049,\"validity-message\"],\"value\":[1025],\"checkboxes\":[32],\"nativeCbs\":[32],\"errorMessage\":[32],\"showErrorMsg\":[32],\"hasHelperSlot\":[32],\"_invalid\":[32],\"reportValidity\":[64],\"showError\":[64]},[[0,\"nanoChange\",\"handleValueChange\"]],{\"value\":[\"handleValuePropChange\"],\"min\":[\"handleCbChange\"],\"max\":[\"handleCbChange\"],\"nativeCbs\":[\"customValidate\"],\"checkboxes\":[\"handleComponentChange\",\"handleDisabledChange\"],\"disabled\":[\"handleDisabledChange\"]}]]],[\"nano-details\",[[1,\"nano-details\",{\"label\":[1],\"open\":[1540],\"disabled\":[516],\"noHandle\":[4,\"no-handle\"],\"iconRotation\":[2,\"icon-rotation\"],\"useCacheHeight\":[4,\"use-cache-height\"]},null,{\"open\":[\"toggleClick\"]}]]],[\"nano-field-validator\",[[6,\"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],\"scrollToFirstInvalid\":[64]},[[0,\"nanoChange\",\"handleFieldChange\"],[0,\"input\",\"handlePlainFieldChange\"],[0,\"change\",\"handlePlainFieldChange\"],[0,\"submit\",\"handleSubmit\"]],{\"userForm\":[\"userFormChange\"],\"validateOn\":[\"validateOnChange\"],\"extraFieldSelector\":[\"attachSlotObserver\"]}]]],[\"nano-grid-item\",[[1,\"nano-grid-item\"]]],[\"nano-intersection-observe\",[[1,\"nano-intersection-observe\",{\"root\":[1],\"rootMargin\":[1,\"root-margin\"],\"threshold\":[1],\"defaultSlot\":[32]},null,{\"root\":[\"handleRootChange\"],\"threshold\":[\"handleThresholdChange\"],\"defaultSlot\":[\"addIO\"]}]]],[\"nano-more-less\",[[1,\"nano-more-less\",{\"show\":[1540],\"childrenSelector\":[1,\"children-selector\"],\"maxToShow\":[2,\"max-to-show\"],\"noHideBtn\":[4,\"no-hide-btn\"]},null,{\"maxToShow\":[\"handleShowHideElements\"],\"show\":[\"handleShowHideElements\"],\"childrenSelector\":[\"handleShowHideElements\"]}]]],[\"nano-range\",[[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]},null,{\"debounce\":[\"debounceChanged\"],\"min\":[\"minChanged\"],\"max\":[\"maxChanged\"],\"disabled\":[\"disabledChanged\"],\"value\":[\"valueChanged\"]}]]],[\"nano-rating\",[[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]},null,{\"value\":[\"handleValueChange\"],\"symbolName\":[\"handleSymbolChange\"]}]]],[\"nano-slide\",[[1,\"nano-slide\",{\"ready\":[1540]},null,{\"ready\":[\"readyChange\"]}]]],[\"nano-slides\",[[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],\"slideTo\":[64],\"slideNext\":[64],\"slidePrev\":[64],\"getActiveIndex\":[64],\"length\":[64],\"isEnd\":[64],\"isBeginning\":[64],\"startAutoplay\":[64],\"stopAutoplay\":[64],\"lockSwipes\":[64],\"getflickity\":[64],\"reload\":[64]},null,{\"options\":[\"optionsChanged\"],\"navbtns\":[\"navbtnsChanged\"],\"pager\":[\"pagerChanged\"],\"fullscreenbtn\":[\"fullscreenBtnChanged\"],\"fullscreen\":[\"fullscreenChanged\"],\"animation\":[\"animationChange\"],\"currentSlide\":[\"currentSlideChange\"],\"iCurrentSlide\":[\"internalSlideChange\"],\"autoplay\":[\"autoPlayChange\"]}]]],[\"nano-sortable\",[[1,\"nano-sortable\",{\"itemSelector\":[1,\"item-selector\"],\"handleSelector\":[1,\"handle-selector\"],\"dropzoneSelector\":[1,\"dropzone-selector\"],\"helperText\":[1,\"helper-text\"],\"itemDescriptor\":[16],\"grabbedHelperText\":[16],\"droppedHelperText\":[16],\"reorderHelperText\":[16],\"createKeyboardHandle\":[16],\"sortableHostElement\":[16],\"animationEnabled\":[4,\"animation-enabled\"],\"draggedClass\":[1,\"dragged-class\"],\"handleDraggedClass\":[1,\"handle-dragged-class\"],\"placeholderClass\":[1,\"placeholder-class\"],\"dropzoneActiveClass\":[1,\"dropzone-active-class\"],\"animationTiming\":[8,\"animation-timing\"],\"orientation\":[1],\"dragResize\":[4,\"drag-resize\"],\"keyboardSortActive\":[32],\"ariaTextList\":[32],\"refreshKeyboardHandles\":[64]},null,{\"itemSelector\":[\"handleItemSelectorChange\"],\"handleSelector\":[\"handleHandleSelectorChange\"],\"createKeyboardHandle\":[\"handleCreateKeyboardHandleChange\"],\"sortableHostElement\":[\"handleSortableHostElement\"]}]]],[\"nano-tab-content\",[[1,\"nano-tab-content\",{\"name\":[513],\"active\":[516],\"ready\":[32]}]]],[\"nano-algolia\",[[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],\"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],\"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\"]],{\"listenTo\":[\"handleListenToChange\"],\"_dynFacetFilters\":[\"dynFacetFiltersChange\"],\"browseIndex\":[\"browseIndexChange\"],\"inputField\":[\"inputFieldSet\"],\"query\":[\"queryChange\"],\"replicaIndex\":[\"internalIndexSwitch\"],\"resultsPage\":[\"pageChange\"],\"searchIndexName\":[\"searchIndexNameChange\"],\"apiKey\":[\"initAlgoliaClient\"],\"appId\":[\"initAlgoliaClient\"],\"searchIndex\":[\"initAlgoliaIndex\"],\"showResults\":[\"showResultsChange\"],\"filters\":[\"handleFilterpropChange\"]}]]],[\"nano-date-picker\",[[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]},null,{\"selectedDate\":[\"handleSelectedDateChange\"]}]]],[\"nano-progress-bar\",[[1,\"nano-progress-bar\",{\"value\":[2],\"indeterminate\":[4],\"showPercent\":[4,\"show-percent\"]}]]],[\"nano-grid_2\",[[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]},null,{\"_src\":[\"_srcChanged\"],\"src\":[\"srcChanged\"],\"srcSet\":[\"srcSetChanged\"],\"lazy\":[\"lazyChanged\"]}],[1,\"nano-grid\",{\"sSize\":[520,\"s-size\"],\"mSize\":[520,\"m-size\"],\"lSize\":[520,\"l-size\"],\"xlSize\":[520,\"xl-size\"],\"sCols\":[514,\"s-cols\"],\"mCols\":[514,\"m-cols\"],\"lCols\":[514,\"l-cols\"],\"xlCols\":[514,\"xl-cols\"],\"xxlCols\":[514,\"xxl-cols\"],\"sTpl\":[1,\"s-tpl\"],\"mTpl\":[1,\"m-tpl\"],\"lTpl\":[1,\"l-tpl\"],\"xlTpl\":[1,\"xl-tpl\"],\"xxlTpl\":[1,\"xxl-tpl\"],\"showHelper\":[516,\"show-helper\"],\"cacheKey\":[32]},null,{\"sTpl\":[\"constructSizeArray\"],\"mTpl\":[\"constructSizeArray\"],\"lTpl\":[\"constructSizeArray\"],\"xlTpl\":[\"constructSizeArray\"],\"xxlTpl\":[\"constructSizeArray\"],\"sSize\":[\"constructSizeArray\"],\"mSize\":[\"constructSizeArray\"],\"lSize\":[\"constructSizeArray\"],\"xlSize\":[\"constructSizeArray\"],\"sCols\":[\"constructSizeArray\"],\"mCols\":[\"constructSizeArray\"],\"lCols\":[\"constructSizeArray\"],\"xlCols\":[\"constructSizeArray\"],\"xxlCols\":[\"constructSizeArray\"],\"showHelper\":[\"constructSizeArray\"]}]]],[\"nano-input\",[[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\"]],{\"datalist\":[\"setDataListOpts\"],\"minlength\":[\"shouldValidate\"],\"maxlength\":[\"shouldValidate\"],\"min\":[\"shouldValidate\"],\"max\":[\"shouldValidate\"],\"required\":[\"shouldValidate\"],\"disabled\":[\"shouldValidate\"],\"readonly\":[\"shouldValidate\"],\"pattern\":[\"shouldValidate\"],\"inputmode\":[\"shouldValidate\"],\"value\":[\"valueChanged\"],\"debounce\":[\"debounceChanged\"]}]]],[\"nano-sticker\",[[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]},null,{\"trigger\":[\"updateTriggerOffset\"],\"scrollParent\":[\"updateTriggerOffset\",\"handleParentEvents\",\"setupIO\"],\"position\":[\"stickerResizeListener\",\"positionChange\"],\"quietMode\":[\"quietModeChange\"],\"offset\":[\"setOffset\"],\"_offset\":[\"setOffset\"],\"isStuck\":[\"stuckChange\"],\"quietModeIsOn\":[\"attachScrollListeners\"],\"stickToEle\":[\"handleParentEvents\",\"stickToEleChange\"],\"stickTo\":[\"stickToChange\"],\"multiStickerHide\":[\"visibilityDecisionHandler\"],\"scrollHide\":[\"visibilityDecisionHandler\"],\"hide\":[\"handleHideChange\"]}]]],[\"nano-spinner\",[[1,\"nano-spinner\",{\"type\":[1],\"overlay\":[516],\"hasText\":[32]}]]],[\"nano-dropdown\",[[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\":[1028],\"dialogTitle\":[1,\"dialog-title\"],\"eventType\":[16],\"show\":[64],\"hide\":[64]},[[0,\"nanoOpen\",\"secondaryOpen\"],[0,\"nanoClose\",\"secondaryClose\"],[0,\"nanoSelect\",\"handlePanelSelect\"]],{\"open\":[\"handleOpenChange\"],\"tetherTo\":[\"handleTetherToChange\"],\"placement\":[\"handlePopoverOptionsChange\"],\"distance\":[\"handlePopoverOptionsChange\"],\"skidding\":[\"handlePopoverOptionsChange\"],\"hoist\":[\"handlePopoverOptionsChange\"]}]]],[\"nano-resize-observe_2\",[[1,\"nano-resize-observe\",{\"notifyContentFit\":[1,\"notify-content-fit\"],\"states\":[1],\"currentWidth\":[32],\"currentHeight\":[32],\"classNames\":[32],\"contentFitX\":[32],\"contentFitY\":[32]},null,{\"classNames\":[\"classNameChange\"],\"states\":[\"newStatesProp\",\"statesChanged\"],\"currentHeight\":[\"dimensionChanged\"],\"currentWidth\":[\"dimensionChanged\"]}],[1,\"nano-skeleton\",{\"animated\":[4]}]]],[\"nano-icon\",[[1,\"nano-icon\",{\"color\":[1],\"role\":[1537],\"ariaLabel\":[1537,\"aria-label\"],\"flipRtl\":[4,\"flip-rtl\"],\"name\":[1],\"src\":[1],\"icon\":[8],\"size\":[1],\"lazy\":[4],\"svgContent\":[32],\"isVisible\":[32],\"isLoading\":[32]},null,{\"ariaLabel\":[\"udpateRole\"],\"role\":[\"setAriaLabel\"],\"name\":[\"loadIcon\"],\"src\":[\"loadIcon\"],\"icon\":[\"loadIcon\"]}]]],[\"nano-datalist_3\",[[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]},null,{\"open\":[\"openWatcher\"],\"input\":[\"watchInputChange\"],\"options\":[\"handleOptionsChange\"],\"type\":[\"watchTypeChange\"],\"connectedInput\":[\"watchTypeChange\",\"manageInputEvents\"],\"selected\":[\"watchActvOptChange\"],\"actvOptEles\":[\"watchActvOptChange\",\"manageCanOpen\",\"fireActiveOptsEvent\"],\"hasNoResult\":[\"manageCanOpen\"],\"shouldOpen\":[\"manageDropdownDisplay\"],\"canOpen\":[\"manageDropdownDisplay\"]}],[1,\"nano-option\",{\"value\":[1537],\"label\":[1537],\"selected\":[516],\"disabled\":[516],\"filterMeta\":[1,\"filter-meta\"],\"hasFocus\":[32]},[[0,\"keydown\",\"handleKeyDown\"]],{\"value\":[\"valueChanged\"],\"label\":[\"labelChanged\"]}],[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\"]]]]],[\"nano-global-nav-user-profile_3\",[[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],\"maxValuesVisible\":[8,\"max-values-visible\"],\"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\":[16],\"valueTagTemplate\":[16],\"currInsertIndex\":[32],\"showErrorMsg\":[32],\"errorMessage\":[32],\"hasFocus\":[32],\"hasLabelSlot\":[32],\"hasHelperSlot\":[32],\"hasHelperEndSlot\":[32],\"inputSearchVal\":[32],\"_invalid\":[32],\"_elementOptions\":[32],\"reportValidity\":[64],\"setFocus\":[64],\"getSelectElement\":[64],\"showError\":[64]},[[16,\"reset\",\"onReset\"],[17,\"mousedown\",\"handleBlur\"],[0,\"keydown\",\"handleBlur\"]],{\"maxValuesVisible\":[\"watchMaxValuesVisible\"],\"debounce\":[\"debounceChanged\"],\"required\":[\"shouldValidate\"],\"disabled\":[\"shouldValidate\"],\"min\":[\"shouldValidate\"],\"max\":[\"shouldValidate\"],\"readonly\":[\"shouldValidate\"],\"value\":[\"valueChanged\"],\"dropDownConfig\":[\"setDataListOpts\"]}],[0,\"nano-global-nav-user-profile\",{\"myAccountUser\":[16],\"userProfileUrl\":[1,\"user-profile-url\"]}],[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],\"hasAnchorEle\":[32],\"didOpen\":[32],\"isInGlobalNav\":[32],\"isInMenuDrawer\":[32],\"isInMenu\":[32],\"hasFocus\":[32],\"setFocus\":[64]},[[16,\"click\",\"handleClose\"],[16,\"keyup\",\"handleClose\"]],{\"open\":[\"openChange\"],\"didOpen\":[\"didOpenChange\"]}]]],[\"nano-icon-button_2\",[[1,\"nano-icon-button\",{\"iconName\":[1,\"icon-name\"],\"iconSrc\":[1,\"icon-src\"],\"type\":[513],\"name\":[513],\"value\":[513],\"label\":[1],\"showTooltip\":[4,\"show-tooltip\"],\"disabled\":[516],\"href\":[1],\"rel\":[1],\"target\":[1],\"form\":[1],\"setFocus\":[64]}],[1,\"nano-tooltip\",{\"content\":[1],\"placement\":[1],\"disabled\":[4],\"distance\":[2],\"open\":[1540],\"skidding\":[2],\"hoist\":[1028],\"trigger\":[1],\"show\":[64],\"hide\":[64]},null,{\"content\":[\"setLabel\"],\"open\":[\"handleOpenChange\"]}]]]]"), options);
|
|
11
|
+
return bootstrapLazy(JSON.parse("[[\"nano-global-nav\",[[1,\"nano-global-nav\",{\"env\":[1],\"ssoDataUrl\":[1,\"sso-data-url\"],\"myAccountData\":[16],\"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\"],\"userProfileUrl\":[32],\"hasLoggedinSlot\":[32],\"hasSiteSlot\":[32],\"hasPromotionSlot\":[32],\"aboutSlotLen\":[32],\"iconSlotLen\":[32],\"mainSlotLen\":[32],\"overflowSlotLen\":[32],\"searchSlotLen\":[32],\"thresholdReady\":[32],\"remoteDataReady\":[32],\"ready\":[32],\"isResizing\":[32],\"threshold\":[32],\"modalOpen\":[32],\"modalIsOpen\":[32],\"searchBarShown\":[32],\"scrollingUp\":[32],\"showAutocomplete\":[32],\"secondaryMenuOpen\":[32],\"userMenuOpen\":[32],\"menuFullScreen\":[32],\"searchLoading\":[32],\"searchValInternal\":[32],\"internalSearchIndeces\":[32],\"submitSearch\":[64],\"toggleOverflowMenu\":[64]},[[0,\"nanoOpen\",\"secondaryOpen\"],[0,\"nanoClose\",\"secondaryClose\"],[16,\"click\",\"menuClose\"]],{\"myAccountData\":[\"handleMyAccountData\"],\"env\":[\"getMyAccData\"],\"ssoDataUrl\":[\"getMyAccData\"],\"searchIndex\":[\"currentSelectedIndex\"],\"searchValInternal\":[\"changeInternalSearchVal\"],\"searchApiKey\":[\"initAlgoliaClient\"],\"searchAppId\":[\"initAlgoliaClient\"],\"searchIndeces\":[\"addIndeces\"],\"internalSearchIndeces\":[\"addAlgoliaIndeces\"],\"threshold\":[\"thresholdChange\"],\"thresholdReady\":[\"assessReady\"],\"remoteDataReady\":[\"assessReady\"],\"showAutocomplete\":[\"setupAutocompleteBlur\",\"resetHitFocus\"],\"secondaryMenuOpen\":[\"closeSearchBar\"],\"aboutSlotLen\":[\"slotChange\"],\"iconSlotLen\":[\"slotChange\"],\"mainSlotLen\":[\"slotChange\"],\"overflowSlotLen\":[\"slotChange\"],\"searchSlotLen\":[\"slotChange\"],\"userMenuOpen\":[\"handleUserMenu\"]}]]],[\"nano-table\",[[4,\"nano-table\",{\"customRenderer\":[16],\"type\":[1],\"caption\":[1],\"showCaption\":[4,\"show-caption\"],\"loading\":[4],\"placeholderSize\":[2,\"placeholder-size\"],\"rows\":[16],\"columns\":[1040],\"headRender\":[16],\"rowRender\":[16],\"footRender\":[16],\"showFooter\":[4,\"show-footer\"],\"perBlock\":[2,\"per-block\"],\"blocksLength\":[2050,\"blocks-length\"],\"searchTerm\":[1,\"search-term\"],\"customFilterFn\":[16],\"customSortFn\":[16],\"defaultSort\":[4,\"default-sort\"],\"virtualTotalItems\":[2,\"virtual-total-items\"],\"appliedFilters\":[2064],\"internalLoading\":[32],\"blocks\":[32],\"activeBlocks\":[32],\"resetSorting\":[64],\"addSort\":[64],\"resetFilters\":[64],\"addFilters\":[64],\"removeFilters\":[64],\"updateRow\":[64]},null,{\"rows\":[\"handleRowsChange\"],\"columns\":[\"handleColsChange\"],\"searchTerm\":[\"handleSearchTermChange\"],\"virtualTotalItems\":[\"virtualTotalItemsChangeHandler\"]}]]],[\"nano-date-input\",[[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]},null,{\"value\":[\"handleValueChange\",\"testDateValidity\"],\"dateOrder\":[\"handleDateOrderChange\"],\"min\":[\"testDateValidity\"],\"max\":[\"testDateValidity\"],\"pickerOpen\":[\"handlePickerOpenChange\"]}]]],[\"nano-dialog\",[[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],\"noDismiss\":[32],\"hasFooter\":[32],\"hidden\":[32],\"show\":[64],\"hide\":[64]},null,{\"open\":[\"handleOpenChange\"],\"hoist\":[\"handleHoistChange\"]}]]],[\"nano-drawer\",[[1,\"nano-drawer\",{\"open\":[1540],\"label\":[513],\"placement\":[513],\"contained\":[516],\"noHeader\":[516,\"no-header\"],\"storeId\":[1,\"store-id\"],\"storeMethod\":[1,\"store-method\"],\"noUserDismiss\":[4,\"no-user-dismiss\"],\"hoist\":[4],\"noDismiss\":[32],\"hasFooter\":[32],\"show\":[64],\"hide\":[64]},null,{\"hoist\":[\"handleHoistChange\"],\"contained\":[\"handleNoModalChange\"],\"open\":[\"handleOpenChange\"]}]]],[\"nano-hero\",[[1,\"nano-hero\",{\"imgSrc\":[1,\"img-src\"],\"imgSrcSet\":[1,\"img-src-set\"],\"largeScreenBP\":[2,\"large-screen-b-p\"],\"theme\":[1],\"level\":[1],\"hasIconBox\":[32],\"hasScrim\":[32],\"hasSecondaryContent\":[32],\"hasQuote\":[32],\"hasBg\":[32],\"hasBackBtn\":[32],\"hasCtas\":[32],\"breadCrumbs\":[32],\"iconBoxItems\":[32]},null,{\"breadCrumbs\":[\"breadCrumbChange\"],\"iconBoxItems\":[\"iconBoxItemChange\"]}]]],[\"nano-alert\",[[1,\"nano-alert\",{\"open\":[1540],\"closable\":[516],\"color\":[513],\"duration\":[2],\"hoist\":[4],\"isModal\":[32],\"isToast\":[32],\"isShowing\":[32],\"label\":[32],\"noDismiss\":[32],\"show\":[64],\"hide\":[64],\"toast\":[64],\"alert\":[64]},null,{\"open\":[\"handleOpenChange\"],\"duration\":[\"handleDurationChange\"],\"hoist\":[\"handleHoistChange\"]}]]],[\"nano-file-upload\",[[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\"]],{\"fileList\":[\"fileListChange\",\"shouldValidate\"],\"maxFiles\":[\"shouldValidate\"],\"maxFileSize\":[\"shouldValidate\"],\"capture\":[\"shouldValidate\"],\"accept\":[\"shouldValidate\"],\"required\":[\"shouldValidate\"],\"disabled\":[\"shouldValidate\"]}]]],[\"nano-overflow-nav\",[[1,\"nano-overflow-nav\",{\"scrollControls\":[4,\"scroll-controls\"],\"orientation\":[513],\"activeHandler\":[16],\"inActiveHandler\":[16],\"isActiveHandler\":[16],\"instantReCalc\":[32],\"hasScrollControls\":[32],\"hideControlEnd\":[32],\"hideControlStart\":[32],\"syncActiveItem\":[64]},null,{\"isActiveHandler\":[\"watchIsActiveHandler\"],\"hasScrollControls\":[\"watchScrollControls\"],\"hideControlEnd\":[\"hideEndBtn\"],\"hideControlStart\":[\"hideStartBtn\"]}]]],[\"nano-tab\",[[1,\"nano-tab\",{\"panel\":[513],\"active\":[516],\"disabled\":[516],\"closable\":[4],\"setFocus\":[64],\"removeFocus\":[64]}]]],[\"nano-global-search-results\",[[1,\"nano-global-search-results\",{\"algoliaResults\":[32],\"algoliaEle\":[32],\"currentWidth\":[32],\"apiKey\":[32],\"appId\":[32],\"index\":[32],\"closeSearch\":[64]},[[16,\"nanoSearchReset\",\"handleGlobalNavReset\"],[16,\"nanoSearchResult\",\"handleGlobalNavSearch\"],[0,\"nanoChange\",\"handleReorder\"],[0,\"nanoResultsShown\",\"attachListeners\"],[16,\"nanoNewResults\",\"attachResultListeners\"]],{\"algoliaEle\":[\"handleAlgoliaCredsChange\",\"handleAlgoliaIndexChange\",\"handleAlgoliaEleChange\"],\"apiKey\":[\"handleAlgoliaCredsChange\"],\"appId\":[\"handleAlgoliaCredsChange\"],\"index\":[\"handleAlgoliaIndexChange\"],\"algoliaResults\":[\"handleAlgoliaEleChange\"]}]]],[\"nano-menu-drawer\",[[1,\"nano-menu-drawer\",{\"open\":[1028],\"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\"]],{\"open\":[\"openChange\"],\"widthOk\":[\"widthChange\"],\"hideHeight\":[\"hideHeightChange\"]}]]],[\"nano-split-pane\",[[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]},null,{\"position\":[\"handlePositionChange\"],\"positionInPixels\":[\"handlePositionInPixelsChange\"]}]]],[\"nano-tab-group\",[[1,\"nano-tab-group\",{\"placement\":[513],\"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],\"tab\":[32],\"show\":[64]},[[0,\"nanoTabClose\",\"handleTabClose\"]],{\"tab\":[\"handleTabNameChange\"],\"placement\":[\"handlePlacementChange\"],\"noScrollControls\":[\"handleNoScrollControlsChange\"],\"hideControlRight\":[\"hideRightBtn\"],\"hideControlLeft\":[\"hideLeftBtn\"],\"hasScrollControls\":[\"watchScrollControls\"]}]]],[\"nano-accordion\",[[1,\"nano-accordion\",{\"color\":[1],\"itemOpened\":[32]},[[0,\"nanoOpened\",\"onToggleHandler\"],[0,\"nanoClosed\",\"onClosedHandler\"]]]]],[\"nano-algolia-filter\",[[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\"]],{\"value\":[\"valueSet\"],\"internalValue\":[\"valueChanged\"],\"facets\":[\"appliedFilterChanged\"],\"tplRenderFn\":[\"tplUpdate\"],\"indexResults\":[\"handleFilterChange\"]}]]],[\"nano-algolia-pagination\",[[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]},null,{\"currentPage\":[\"currentPageChange\"],\"infiniteScroll\":[\"infiniteScrollChange\"]}]]],[\"nano-algolia-results\",[[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]},null,{\"results\":[\"addContentIndex\",\"resultsChange\"],\"tplRenderFn\":[\"resultsChange\"],\"facets\":[\"headerFooterChange\"],\"appendPages\":[\"appendChange\"],\"infiniteScroll\":[\"infiniteScrollChange\"],\"resultsPage\":[\"handlePageChage\"],\"isLoading\":[\"handleLoading\"]}]]],[\"nano-animation\",[[1,\"nano-animation\",{\"name\":[1],\"play\":[1540],\"delay\":[2],\"direction\":[1],\"duration\":[2],\"easing\":[1],\"endDelay\":[2,\"end-delay\"],\"fill\":[1],\"iterations\":[2],\"iterationStart\":[2,\"iteration-start\"],\"keyframes\":[16],\"playbackRate\":[2,\"playback-rate\"],\"currentTime\":[6146,\"current-time\"],\"defaultSlot\":[32],\"cancel\":[64],\"finish\":[64]},null,{\"defaultSlot\":[\"createAnimation\"],\"name\":[\"handleAnimationChange\"],\"delay\":[\"handleAnimationChange\"],\"direction\":[\"handleAnimationChange\"],\"duration\":[\"handleAnimationChange\"],\"easing\":[\"handleAnimationChange\"],\"endDelay\":[\"handleAnimationChange\"],\"fill\":[\"handleAnimationChange\"],\"iterations\":[\"handleAnimationChange\"],\"iterationStart\":[\"handleAnimationChange\"],\"keyframes\":[\"handleAnimationChange\"],\"play\":[\"handlePlayChange\"],\"playbackRate\":[\"handlePlaybackRateChange\"]}]]],[\"nano-checkbox\",[[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\"]],{\"checked\":[\"handleCheckedChange\"],\"type\":[\"typeChange\"],\"indeterminate\":[\"handleIndeterminateChange\"]}]]],[\"nano-checkbox-group\",[[6,\"nano-checkbox-group\",{\"validateOn\":[1025,\"validate-on\"],\"showInlineError\":[4,\"show-inline-error\"],\"min\":[2],\"max\":[2],\"disabled\":[516],\"legend\":[1],\"hideLegend\":[4,\"hide-legend\"],\"invalid\":[2564],\"validityMessage\":[2049,\"validity-message\"],\"value\":[1025],\"checkboxes\":[32],\"nativeCbs\":[32],\"errorMessage\":[32],\"showErrorMsg\":[32],\"hasHelperSlot\":[32],\"_invalid\":[32],\"reportValidity\":[64],\"showError\":[64]},[[0,\"nanoChange\",\"handleValueChange\"]],{\"value\":[\"handleValuePropChange\"],\"min\":[\"handleCbChange\"],\"max\":[\"handleCbChange\"],\"nativeCbs\":[\"customValidate\"],\"checkboxes\":[\"handleComponentChange\",\"handleDisabledChange\"],\"disabled\":[\"handleDisabledChange\"]}]]],[\"nano-details\",[[1,\"nano-details\",{\"label\":[1],\"open\":[1540],\"disabled\":[516],\"noHandle\":[4,\"no-handle\"],\"iconRotation\":[2,\"icon-rotation\"],\"useCacheHeight\":[4,\"use-cache-height\"]},null,{\"open\":[\"toggleClick\"]}]]],[\"nano-field-validator\",[[6,\"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],\"scrollToFirstInvalid\":[64]},[[0,\"nanoChange\",\"handleFieldChange\"],[0,\"input\",\"handlePlainFieldChange\"],[0,\"change\",\"handlePlainFieldChange\"],[0,\"submit\",\"handleSubmit\"]],{\"userForm\":[\"userFormChange\"],\"validateOn\":[\"validateOnChange\"],\"extraFieldSelector\":[\"attachSlotObserver\"]}]]],[\"nano-grid-item\",[[1,\"nano-grid-item\"]]],[\"nano-intersection-observe\",[[1,\"nano-intersection-observe\",{\"root\":[1],\"rootMargin\":[1,\"root-margin\"],\"threshold\":[1],\"defaultSlot\":[32]},null,{\"root\":[\"handleRootChange\"],\"threshold\":[\"handleThresholdChange\"],\"defaultSlot\":[\"addIO\"]}]]],[\"nano-more-less\",[[1,\"nano-more-less\",{\"show\":[1540],\"childrenSelector\":[1,\"children-selector\"],\"maxToShow\":[2,\"max-to-show\"],\"noHideBtn\":[4,\"no-hide-btn\"]},null,{\"maxToShow\":[\"handleShowHideElements\"],\"show\":[\"handleShowHideElements\"],\"childrenSelector\":[\"handleShowHideElements\"]}]]],[\"nano-range\",[[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]},null,{\"debounce\":[\"debounceChanged\"],\"min\":[\"minChanged\"],\"max\":[\"maxChanged\"],\"disabled\":[\"disabledChanged\"],\"value\":[\"valueChanged\"]}]]],[\"nano-rating\",[[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]},null,{\"value\":[\"handleValueChange\"],\"symbolName\":[\"handleSymbolChange\"]}]]],[\"nano-slide\",[[1,\"nano-slide\",{\"ready\":[1540]},null,{\"ready\":[\"readyChange\"]}]]],[\"nano-slides\",[[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],\"slideTo\":[64],\"slideNext\":[64],\"slidePrev\":[64],\"getActiveIndex\":[64],\"length\":[64],\"isEnd\":[64],\"isBeginning\":[64],\"startAutoplay\":[64],\"stopAutoplay\":[64],\"lockSwipes\":[64],\"getflickity\":[64],\"reload\":[64]},null,{\"options\":[\"optionsChanged\"],\"navbtns\":[\"navbtnsChanged\"],\"pager\":[\"pagerChanged\"],\"fullscreenbtn\":[\"fullscreenBtnChanged\"],\"fullscreen\":[\"fullscreenChanged\"],\"animation\":[\"animationChange\"],\"currentSlide\":[\"currentSlideChange\"],\"iCurrentSlide\":[\"internalSlideChange\"],\"autoplay\":[\"autoPlayChange\"]}]]],[\"nano-sortable\",[[1,\"nano-sortable\",{\"itemSelector\":[1,\"item-selector\"],\"handleSelector\":[1,\"handle-selector\"],\"dropzoneSelector\":[1,\"dropzone-selector\"],\"helperText\":[1,\"helper-text\"],\"itemDescriptor\":[16],\"grabbedHelperText\":[16],\"droppedHelperText\":[16],\"reorderHelperText\":[16],\"createKeyboardHandle\":[16],\"sortableHostElement\":[16],\"animationEnabled\":[4,\"animation-enabled\"],\"draggedClass\":[1,\"dragged-class\"],\"handleDraggedClass\":[1,\"handle-dragged-class\"],\"placeholderClass\":[1,\"placeholder-class\"],\"dropzoneActiveClass\":[1,\"dropzone-active-class\"],\"animationTiming\":[8,\"animation-timing\"],\"orientation\":[1],\"dragResize\":[4,\"drag-resize\"],\"keyboardSortActive\":[32],\"ariaTextList\":[32],\"refreshKeyboardHandles\":[64]},null,{\"itemSelector\":[\"handleItemSelectorChange\"],\"handleSelector\":[\"handleHandleSelectorChange\"],\"createKeyboardHandle\":[\"handleCreateKeyboardHandleChange\"],\"sortableHostElement\":[\"handleSortableHostElement\"]}]]],[\"nano-tab-content\",[[1,\"nano-tab-content\",{\"name\":[513],\"active\":[516],\"ready\":[32]}]]],[\"nano-algolia\",[[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],\"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],\"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\"]],{\"listenTo\":[\"handleListenToChange\"],\"_dynFacetFilters\":[\"dynFacetFiltersChange\"],\"browseIndex\":[\"browseIndexChange\"],\"inputField\":[\"inputFieldSet\"],\"query\":[\"queryChange\"],\"replicaIndex\":[\"internalIndexSwitch\"],\"resultsPage\":[\"pageChange\"],\"searchIndexName\":[\"searchIndexNameChange\"],\"apiKey\":[\"initAlgoliaClient\"],\"appId\":[\"initAlgoliaClient\"],\"searchIndex\":[\"initAlgoliaIndex\"],\"showResults\":[\"showResultsChange\"],\"filters\":[\"handleFilterpropChange\"]}]]],[\"nano-date-picker\",[[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]},null,{\"selectedDate\":[\"handleSelectedDateChange\"]}]]],[\"nano-progress-bar\",[[1,\"nano-progress-bar\",{\"value\":[2],\"indeterminate\":[4],\"showPercent\":[4,\"show-percent\"]}]]],[\"nano-grid_2\",[[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]},null,{\"_src\":[\"_srcChanged\"],\"src\":[\"srcChanged\"],\"srcSet\":[\"srcSetChanged\"],\"lazy\":[\"lazyChanged\"]}],[1,\"nano-grid\",{\"sSize\":[520,\"s-size\"],\"mSize\":[520,\"m-size\"],\"lSize\":[520,\"l-size\"],\"xlSize\":[520,\"xl-size\"],\"sCols\":[514,\"s-cols\"],\"mCols\":[514,\"m-cols\"],\"lCols\":[514,\"l-cols\"],\"xlCols\":[514,\"xl-cols\"],\"xxlCols\":[514,\"xxl-cols\"],\"sTpl\":[1,\"s-tpl\"],\"mTpl\":[1,\"m-tpl\"],\"lTpl\":[1,\"l-tpl\"],\"xlTpl\":[1,\"xl-tpl\"],\"xxlTpl\":[1,\"xxl-tpl\"],\"showHelper\":[516,\"show-helper\"],\"cacheKey\":[32]},null,{\"sTpl\":[\"constructSizeArray\"],\"mTpl\":[\"constructSizeArray\"],\"lTpl\":[\"constructSizeArray\"],\"xlTpl\":[\"constructSizeArray\"],\"xxlTpl\":[\"constructSizeArray\"],\"sSize\":[\"constructSizeArray\"],\"mSize\":[\"constructSizeArray\"],\"lSize\":[\"constructSizeArray\"],\"xlSize\":[\"constructSizeArray\"],\"sCols\":[\"constructSizeArray\"],\"mCols\":[\"constructSizeArray\"],\"lCols\":[\"constructSizeArray\"],\"xlCols\":[\"constructSizeArray\"],\"xxlCols\":[\"constructSizeArray\"],\"showHelper\":[\"constructSizeArray\"]}]]],[\"nano-input\",[[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\"]],{\"datalist\":[\"setDataListOpts\"],\"minlength\":[\"shouldValidate\"],\"maxlength\":[\"shouldValidate\"],\"min\":[\"shouldValidate\"],\"max\":[\"shouldValidate\"],\"required\":[\"shouldValidate\"],\"disabled\":[\"shouldValidate\"],\"readonly\":[\"shouldValidate\"],\"pattern\":[\"shouldValidate\"],\"inputmode\":[\"shouldValidate\"],\"value\":[\"valueChanged\"],\"debounce\":[\"debounceChanged\"]}]]],[\"nano-sticker\",[[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]},null,{\"trigger\":[\"updateTriggerOffset\"],\"scrollParent\":[\"updateTriggerOffset\",\"handleParentEvents\",\"setupIO\"],\"position\":[\"stickerResizeListener\",\"positionChange\"],\"quietMode\":[\"quietModeChange\"],\"offset\":[\"setOffset\"],\"_offset\":[\"setOffset\"],\"isStuck\":[\"stuckChange\"],\"quietModeIsOn\":[\"attachScrollListeners\"],\"stickToEle\":[\"handleParentEvents\",\"stickToEleChange\"],\"stickTo\":[\"stickToChange\"],\"multiStickerHide\":[\"visibilityDecisionHandler\"],\"scrollHide\":[\"visibilityDecisionHandler\"],\"hide\":[\"handleHideChange\"]}]]],[\"nano-spinner\",[[1,\"nano-spinner\",{\"type\":[1],\"overlay\":[516],\"hasText\":[32]}]]],[\"nano-dropdown\",[[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\":[1028],\"dialogTitle\":[1,\"dialog-title\"],\"eventType\":[16],\"show\":[64],\"hide\":[64]},[[0,\"nanoOpen\",\"secondaryOpen\"],[0,\"nanoClose\",\"secondaryClose\"],[0,\"nanoSelect\",\"handlePanelSelect\"]],{\"open\":[\"handleOpenChange\"],\"tetherTo\":[\"handleTetherToChange\"],\"placement\":[\"handlePopoverOptionsChange\"],\"distance\":[\"handlePopoverOptionsChange\"],\"skidding\":[\"handlePopoverOptionsChange\"],\"hoist\":[\"handlePopoverOptionsChange\"]}]]],[\"nano-resize-observe_2\",[[1,\"nano-resize-observe\",{\"notifyContentFit\":[1,\"notify-content-fit\"],\"states\":[1],\"currentWidth\":[32],\"currentHeight\":[32],\"classNames\":[32],\"contentFitX\":[32],\"contentFitY\":[32]},null,{\"classNames\":[\"classNameChange\"],\"states\":[\"newStatesProp\",\"statesChanged\"],\"currentHeight\":[\"dimensionChanged\"],\"currentWidth\":[\"dimensionChanged\"]}],[1,\"nano-skeleton\",{\"animated\":[4]}]]],[\"nano-icon\",[[1,\"nano-icon\",{\"color\":[1],\"role\":[1537],\"ariaLabel\":[1537,\"aria-label\"],\"flipRtl\":[4,\"flip-rtl\"],\"name\":[1],\"src\":[1],\"icon\":[8],\"size\":[1],\"lazy\":[4],\"svgContent\":[32],\"isVisible\":[32],\"isLoading\":[32]},null,{\"ariaLabel\":[\"udpateRole\"],\"role\":[\"setAriaLabel\"],\"name\":[\"loadIcon\"],\"src\":[\"loadIcon\"],\"icon\":[\"loadIcon\"]}]]],[\"nano-datalist_3\",[[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]},null,{\"open\":[\"openWatcher\"],\"input\":[\"watchInputChange\"],\"options\":[\"handleOptionsChange\"],\"type\":[\"watchTypeChange\"],\"connectedInput\":[\"watchTypeChange\",\"manageInputEvents\"],\"disabled\":[\"watchTypeChange\"],\"selected\":[\"watchActvOptChange\"],\"actvOptEles\":[\"watchActvOptChange\",\"manageCanOpen\",\"fireActiveOptsEvent\"],\"hasNoResult\":[\"manageCanOpen\"],\"shouldOpen\":[\"manageDropdownDisplay\"],\"canOpen\":[\"manageDropdownDisplay\"]}],[1,\"nano-option\",{\"value\":[1537],\"label\":[1537],\"selected\":[516],\"disabled\":[516],\"filterMeta\":[1,\"filter-meta\"],\"hasFocus\":[32]},[[0,\"keydown\",\"handleKeyDown\"]],{\"value\":[\"valueChanged\"],\"label\":[\"labelChanged\"]}],[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\"]]]]],[\"nano-global-nav-user-profile_3\",[[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],\"maxValuesVisible\":[8,\"max-values-visible\"],\"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\":[16],\"valueTagTemplate\":[16],\"currInsertIndex\":[32],\"showErrorMsg\":[32],\"errorMessage\":[32],\"hasFocus\":[32],\"hasLabelSlot\":[32],\"hasHelperSlot\":[32],\"hasHelperEndSlot\":[32],\"inputSearchVal\":[32],\"_invalid\":[32],\"_elementOptions\":[32],\"reportValidity\":[64],\"setFocus\":[64],\"getSelectElement\":[64],\"showError\":[64]},[[16,\"reset\",\"onReset\"],[17,\"mousedown\",\"handleBlur\"],[0,\"keydown\",\"handleBlur\"]],{\"maxValuesVisible\":[\"watchMaxValuesVisible\"],\"debounce\":[\"debounceChanged\"],\"required\":[\"shouldValidate\"],\"disabled\":[\"shouldValidate\"],\"min\":[\"shouldValidate\"],\"max\":[\"shouldValidate\"],\"readonly\":[\"shouldValidate\"],\"value\":[\"valueChanged\"],\"dropDownConfig\":[\"setDataListOpts\"]}],[0,\"nano-global-nav-user-profile\",{\"myAccountUser\":[16],\"userProfileUrl\":[1,\"user-profile-url\"]}],[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],\"hasAnchorEle\":[32],\"didOpen\":[32],\"isInGlobalNav\":[32],\"isInMenuDrawer\":[32],\"isInMenu\":[32],\"hasFocus\":[32],\"setFocus\":[64]},[[16,\"click\",\"handleClose\"],[16,\"keyup\",\"handleClose\"]],{\"open\":[\"openChange\"],\"didOpen\":[\"didOpenChange\"]}]]],[\"nano-icon-button_2\",[[1,\"nano-icon-button\",{\"iconName\":[1,\"icon-name\"],\"iconSrc\":[1,\"icon-src\"],\"type\":[513],\"name\":[513],\"value\":[513],\"label\":[1],\"showTooltip\":[4,\"show-tooltip\"],\"disabled\":[516],\"href\":[1],\"rel\":[1],\"target\":[1],\"form\":[1],\"setFocus\":[64]}],[1,\"nano-tooltip\",{\"content\":[1],\"placement\":[1],\"disabled\":[4],\"distance\":[2],\"open\":[1540],\"skidding\":[2],\"hoist\":[1028],\"trigger\":[1],\"show\":[64],\"hide\":[64]},null,{\"content\":[\"setLabel\"],\"open\":[\"handleOpenChange\"]}]]]]"), options);
|
|
12
12
|
};
|
|
13
13
|
|
|
14
14
|
export { defineCustomElements };
|
|
@@ -31,14 +31,18 @@ const Checkbox = class {
|
|
|
31
31
|
if (!this.input)
|
|
32
32
|
return;
|
|
33
33
|
this.input.checked = this.checked;
|
|
34
|
-
if (this.inputType === 'radio' &&
|
|
34
|
+
if (this.inputType === 'radio' &&
|
|
35
|
+
this.name &&
|
|
36
|
+
this.checked &&
|
|
37
|
+
this.host.isConnected) {
|
|
35
38
|
const form = this.host.closest('form');
|
|
39
|
+
const root = this.host.getRootNode();
|
|
36
40
|
let ctrls;
|
|
37
41
|
if (form) {
|
|
38
42
|
ctrls = Array.from(form.querySelectorAll(`${transformTag('nano-checkbox')}[name="${this.name}"]`));
|
|
39
43
|
}
|
|
40
44
|
else {
|
|
41
|
-
ctrls = Array.from(
|
|
45
|
+
ctrls = Array.from(root.querySelectorAll(`${transformTag('nano-checkbox')}[name="${this.name}"]`))?.filter((radio) => !radio.closest('form'));
|
|
42
46
|
}
|
|
43
47
|
ctrls.map((el) => {
|
|
44
48
|
if (el !== this.host)
|
|
@@ -217,14 +221,14 @@ const Checkbox = class {
|
|
|
217
221
|
}
|
|
218
222
|
render() {
|
|
219
223
|
const labelId = this.inputId + '-lbl';
|
|
220
|
-
return (h(Host, { key: '
|
|
224
|
+
return (h(Host, { key: '92eaee0287da5164176c1893add5d48ff518153a', class: { ...createColorClasses(this.color), 'nano-checkbox': true } }, h("label", { key: '5082a3b8114162d5b52e9f24abe031f8796665e2', class: {
|
|
221
225
|
nanocb: true,
|
|
222
226
|
'nanocb--checked': this.checked,
|
|
223
227
|
'nanocb--invalid': this.invalid,
|
|
224
228
|
'nanocb--disabled': this.disabled,
|
|
225
229
|
'nanocb--focused': this.hasFocus,
|
|
226
230
|
'nanocb--indeterminate': this.indeterminate,
|
|
227
|
-
}, htmlFor: this.inputId }, h("input", { key: '
|
|
231
|
+
}, htmlFor: this.inputId }, h("input", { key: '2b91ea2ac18ac260710202040db3f7a4574a1922', type: this.inputType, name: this.name, form: this.form, required: this.required, checked: this.checked, disabled: this.disabled, value: this.value, "aria-labelledby": labelId, onBlur: this.handleBlur, onFocus: this.handleFocus, onChange: this.handleChange, ref: (input) => (this.input = input), id: this.inputId, onInvalid: this.handleInvalid }), h("span", { key: '0594a16034577181d4f3b1801b08d1761bd4cfe8', class: 'nanocb__input nanocb__input--' + this.type }), h("div", { key: '051e89cbd5aeabad7f6e70369a3f9316f86eb8f8', id: labelId, class: 'nanocb__label nanocb__label--' + this.type }, this.label && !!this.label.length && h("span", { key: 'ddb4067806f185c0d564a0a54c7642a57313e482' }, this.label), h("span", { key: '745cbff6863337008827893a7b451c4a31fb1e91', hidden: this.label && !!this.label.length }, h("slot", { key: '023db905814a76b115e2779d717932125c0bff4a' }))))));
|
|
228
232
|
}
|
|
229
233
|
static get watchers() { return {
|
|
230
234
|
"checked": ["handleCheckedChange"],
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"file":"nano-checkbox.entry.js","mappings":"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","names":[],"sources":["src/components/checkbox/checkbox.scss?tag=nano-checkbox&encapsulation=scoped","src/components/checkbox/checkbox.tsx"],"sourcesContent":["@use 'sass:map';\n@use '../../global/style/utilities' as mx;\n@use '../../global/style/nano-theme/tokens';\n\n:host {\n /**\n * @prop --control-invalid-style: Control box-shadow when invalid. Defaults to to #{tokens.$control-invalid-style};\n * @prop --focus-shadow: Control focus box-shadow. Defaults to to #{tokens.$control-focus-style};\n * @prop --padding: padding around radio and checkbox controls. Defaults to initial;\n * @prop --control-padding: padding around tag and segmented controls text. Various defaults.\n * @prop --check-bg-color: Initial Bg color of radio / checkbox controls. Changes for [checked] and [disabled] states. Defaults to #{map.get(tokens.$colors, white)};\n * @prop --check-border-color: initial border color. Defaults to #{map.get(tokens.$colors, palegrey)};\n * @prop --check-border-size: initial border size. Default to 1px;\n * @prop --check-border-style: Initial border style. Defaults to var(--check-border-size) solid var(--check-border-color);\n * @prop --check-checked-bg-color: Checked bg of controls (not tag). Defaults to #{map.get(tokens.$colors, darkgrey)};\n * @prop --check-checked-border-color: Checked border color of radio / checkbox controls. Defaults to #{map.get(tokens.$colors, darkgrey)};\n * @prop --check-checked-higlight-color: Checked forgrdound / icon color. Defaults to #{map.get(tokens.$colors, white)};\n * @prop --check-base-size: Relative scaling size for check controls. Defaults to to inherit;\n\n * @prop --cb-border-radius: Checkbox border radius. Defaults to to 2px and 5px on [has-focus];\n * @prop --radio-border-radius: Radio border radius. Defaults to to 50%;\n * @prop --tagbox-rgb: an rba list for tags which can be used to generate --tagbox-border-color and --tagbox-bg-color. Defaults to #{mx.color-to-rgb-list(map.get(tokens.$colors, lightblue))};\n * @prop --tagbox-border-color: Defaults to rgb(var(--tagbox-rgb) / 50%);\n * @prop --tagbox-bg-color: Defaults to rgb(var(--tagbox-rgb) / 10%);\n * @prop --segment-color: Segment, unselected text color. (selected color is --check-checked-higlight-color). Defaults to #{map.get(tokens.$colors, blue)};\n * @prop --segment-border-radius: Defaults to 3px;\n * @prop --segment-shadow: Defaults to 0 1px 4px rgb(0 0 0 / 20%);\n * @prop --switch-inactive-color: Defaults to rgb(#{mx.color-to-rgb-list(map.get(tokens.$colors, palegrey))} / 70%);\n * @prop --switch-active-color: Defaults to #{map.get(tokens.$colors, blue)};\n */\n\n --focus-shadow: #{tokens.$control-focus-style};\n --invalid-shadow: #{tokens.$control-focus-size + ' ' map.get(tokens.$colors, red)};\n --padding: initial;\n --check-bg-color: #{map.get(tokens.$colors, white)};\n --check-border-color: #{map.get(tokens.$colors, palegrey)};\n --check-border-size: 1px;\n --check-border-style: var(--check-border-size) solid var(--check-border-color);\n --check-checked-bg-color: #{map.get(tokens.$colors, darkgrey)};\n --check-checked-border-color: #{map.get(tokens.$colors, darkgrey)};\n --check-checked-higlight-color: #{map.get(tokens.$colors, white)};\n --check-base-size: inherit;\n --label-spacing: 10px 0;\n\n // type specific\n\n // tag\n --tagbox-rgb: #{mx.color-to-rgb-list(map.get(tokens.$colors, lightblue))};\n --tagbox-border-color: rgb(var(--tagbox-rgb) / 50%);\n --tagbox-bg-color: rgb(var(--tagbox-rgb) / 20%);\n --tagbox-border-radius: 0;\n\n // segment\n --segment-color: #{map.get(tokens.$colors, blue)};\n --segment-border-radius: 3px;\n --segment-shadow: 0 1px 4px rgb(0 0 0 / 20%);\n\n // cb / radio\n --cb-border-radius: 2px;\n --radio-border-radius: 50%;\n\n // switch\n --switch-inactive-color: rgb(#{mx.color-to-rgb-list(map.get(tokens.$colors, palegrey))} / 70%);\n --switch-active-color: #{map.get(tokens.$colors, blue)};\n\n display: inline-block;\n max-inline-size: 100%;\n\n * {\n box-sizing: inherit;\n }\n}\n\n:host([type='tag']) {\n text-transform: uppercase;\n\n --control-padding: 0.2rem 1rem;\n}\n\n:host([type='radio'][checked]):not([checked='false']) {\n --check-border-size: 0.3125em;\n}\n\n:host([type='segment']) {\n --check-border-style: none;\n --control-padding: 0.7em 1em 0.7em 1em;\n}\n\n:host([type='segment-pill']) {\n --check-border-color: #{rgba(map.get(tokens.$colors, palegrey), 0.5)};\n --segment-border-radius: 5px;\n --control-padding: 0.7em 1em 0.7em 1em;\n}\n\n:host(.nano-color) {\n --tagbox-rgb: var(--nano-color-base-rgb);\n --focus-shadow: #{tokens.$control-focus-size} var(--nano-color-shade);\n}\n\n:host([checked]:not([checked='false'])) {\n --tagbox-border-color: rgb(var(--tagbox-rgb) / 80%);\n --tagbox-bg-color: rgb(var(--tagbox-rgb) / 50%);\n}\n\n:host([has-focus]:not([has-focus='false'])) {\n --cb-border-radius: 5px;\n}\n\n:host([disabled]:not([disabled='false'])) {\n opacity: 0.7;\n\n --tagbox-rgb: #{mx.color-to-rgb-list(map.get(tokens.$colors, mediumgrey))};\n --check-bg-color: #{rgba(map.get(tokens.$colors, mediumgrey), 0.5)};\n --check-checked-bg-color: #{rgba(map.get(tokens.$colors, mediumgrey), 0.5)};\n --segment-color: #{map.get(tokens.$colors, darkgrey)};\n}\n\n.nanocb {\n padding: var(--padding);\n cursor: pointer;\n display: flex;\n align-items: center;\n line-height: 1.2;\n position: relative;\n\n // The mock, viewable 'input' control. Only relevant for controls where the label\n // is outside / separate from the UI control (e.g. checkbox, radio, switch).\n\n &__input {\n border-radius: var(--cb-border-radius, 3px);\n font-size: var(--check-base-size);\n position: relative;\n block-size: 1.5em;\n inline-size: 1.5em;\n min-inline-size: 1.5em;\n border: var(--check-border-style);\n box-shadow: 0 1px 4px rgb(0 0 0 / 20%);\n\n &::before {\n border-radius: var(--cb-border-radius);\n position: absolute;\n content: '';\n inset-inline-start: calc(0.725em - var(--check-border-size));\n inset-block-start: calc(0.725em - var(--check-border-size));\n inline-size: 0;\n block-size: 0;\n border: 2px solid var(--check-checked-higlight-color);\n transform: scale(0);\n }\n\n &--radio {\n border-radius: var(--radio-border-radius);\n background-color: var(--check-bg-color);\n }\n\n &--checkbox {\n background-color: var(--check-bg-color);\n\n &::after {\n border-radius: var(--cb-border-radius);\n position: absolute;\n content: '';\n inset-inline-start: calc(0.825em - var(--check-border-size));\n inset-block-start: calc(0.825em - var(--check-border-size));\n block-size: 0;\n inline-size: 0;\n border: solid var(--check-checked-higlight-color);\n border-width: 0 0.1875em 0.1875em 0;\n transform: rotate(0deg) scale(0);\n opacity: 1;\n transition: all 0.15s ease-out;\n\n .nanocb--indeterminate & {\n border-width: 0 0 0.1875em;\n }\n }\n }\n\n &--switch {\n border-radius: 1em !important;\n inline-size: 2.4em;\n block-size: 1.3em;\n background: var(--switch-inactive-color);\n\n :host([type=\"switch\"]:not([disabled])) & {\n &:hover::after {\n scale: 1.1 1;\n }\n }\n\n &::after {\n position: relative;\n content: '';\n display: block;\n border-radius: inherit;\n block-size: 80%;\n inline-size: 40%;\n background: var(--check-checked-higlight-color);\n transform-origin: left;\n inset-inline-start: 6%;\n inset-block-start: 10%;\n transition: .1s ease scale, .15s ease left;\n }\n }\n\n &--segment,\n &--segment-pill {\n @include mx.visually-hide();\n\n &::before {\n display: none;\n }\n }\n\n &--tag {\n @include mx.visually-hide();\n\n &::before {\n display: none;\n }\n }\n }\n\n &--invalid:not(.nanocb--focused) {\n .nanocb__input {\n box-shadow: 0 0 15px rgb(0 0 0 / 20%), var(--invalid-shadow);\n\n &--tag + .nanocb__label,\n &--segment + .nanocb__label,\n &--segment-pill + .nanocb__label {\n box-shadow: var(--invalid-shadow);\n z-index: 1;\n }\n }\n }\n\n // The 'real' input control which we hide but use it's state for display\n input {\n @include mx.visually-hide();\n\n &:focus ~ .nanocb__input {\n box-shadow: 0 0 15px rgb(0 0 0 / 20%), var(--focus-shadow);\n }\n\n &.focus-visible:focus ~ .nanocb__input {\n &--tag + .nanocb__label,\n &--segment + .nanocb__label,\n &--segment-pill + .nanocb__label {\n box-shadow: var(--focus-shadow);\n z-index: 1;\n }\n }\n\n &:checked ~ .nanocb__input {\n border-radius: var(--cb-border-radius);\n background-color: var(--check-checked-bg-color);\n transform: rotate(0deg) scale(1);\n opacity: 1;\n border-color: var(--check-checked-border-color);\n\n // segment / segment-pill active\n\n &--segment + .nanocb__label,\n &--segment-pill + .nanocb__label {\n color: var(--check-checked-higlight-color);\n background-color: var(--check-checked-bg-color);\n box-shadow: inset 0 3px 4px rgb(0 0 0 / 20%);\n }\n\n // radio active\n\n &--radio {\n border-radius: var(--radio-border-radius);\n background-color: var(--check-checked-higlight-color);\n\n &::after {\n border: solid var(--check-checked-border-color);\n border-width: 0 0.125em 0.125em 0;\n opacity: 0;\n }\n\n &::before {\n border-radius: var(--radio-border-radius);\n }\n }\n\n // checkbox active\n\n &--checkbox {\n &::after {\n transform: rotate(45deg) scale(1);\n opacity: 1;\n inset-inline-start: calc(0.575em - var(--check-border-size));\n inset-block-start: calc(0.2875em - var(--check-border-size));\n inline-size: 0.375em;\n block-size: 0.75em;\n border-radius: 0;\n }\n }\n\n // tag active\n\n &--tag + .nanocb__label::after {\n transform: rotate(45deg);\n }\n\n // switch active\n\n &--switch {\n background: var(--switch-active-color);\n\n &::after {\n inset-inline-start: 56%;\n transform-origin: right;\n }\n }\n }\n\n // indeterminate (only checkbox?)\n\n &:indeterminate ~ .nanocb__input--checkbox {\n border-radius: var(--input-border-radius, 5px);\n background-color: var(--check-checked-bg-color);\n transform: rotate(0deg) scale(1);\n opacity: 1;\n border: 0.125em solid var(--check-checked-bg-color);\n\n &::after {\n transform: scale(1);\n opacity: 1;\n inset-inline-start: 0.3125em;\n inset-block-start: 0;\n inline-size: 0.7em;\n block-size: 0.7em;\n border-radius: 0;\n }\n }\n }\n\n // The label\n &__label {\n padding-inline: var(--label-spacing);\n padding-block: 0;\n display: flex;\n align-items: center;\n line-height: 1;\n flex: 1;\n justify-content: space-between;\n\n &--segment,\n &--segment-pill {\n border: var(--check-border-style);\n border-radius: var(--segment-border-radius);\n box-shadow: var(--segment-shadow);\n display: inline-flex;\n padding: var(--control-padding);\n background: var(--check-bg-color);\n color: var(--segment-color);\n align-items: center;\n inline-size: 100%;\n }\n\n &--segment-pill {\n // first\n :host(:first-of-type) & {\n border-start-start-radius: var(--segment-border-radius);\n border-start-end-radius: 0;\n border-end-end-radius: 0;\n border-end-start-radius: var(--segment-border-radius);\n border-inline-end: none;\n }\n\n // middle\n :host(:not(:last-of-type):not(:first-of-type)) & {\n border-radius: 0;\n border-inline-end: none;\n }\n\n // last\n :host(:last-of-type) & {\n border-start-start-radius: 0;\n border-start-end-radius: var(--segment-border-radius);\n border-end-end-radius: var(--segment-border-radius);\n border-end-start-radius: 0;\n }\n\n // single\n :host(:first-of-type:last-of-type) & {\n border-radius: var(--segment-border-radius);\n border: var(--check-border-style);\n }\n }\n\n &--tag {\n letter-spacing: 2px;\n font-weight: 400;\n font-size: 0.65em;\n line-height: 1.4;\n padding: var(--control-padding);\n border: 2px solid #b5aea7;\n border-color: var(--tagbox-border-color);\n background-color: var(--tagbox-bg-color);\n transition: all 0.2s;\n border-radius: var(--cb-border-radius);\n inline-size: 100%;\n\n &::after {\n content: '+';\n margin-inline: 0.3125em 0;\n margin-block: 0;\n font-weight: 200;\n position: relative;\n font-family: inherit;\n font-size: 1.8em;\n display: inline-block;\n transform: rotate(0deg);\n transform-origin: center;\n }\n\n span {\n display: block;\n }\n }\n }\n}\n","import {\n Component,\n Prop,\n Event,\n EventEmitter,\n ComponentInterface,\n State,\n Watch,\n Method,\n Element,\n Host,\n Listen,\n} from '@stencil/core';\nimport { focusVisible } from '../../utils/focus-visible';\nimport { createColorClasses } from '../../utils/theme';\nimport { transformTag, h } from '../../utils/renderer';\nimport { CheckboxChangeEventDetail } from './checkbox-interface';\nimport type { ControlValidity, Color } from '../../types/shared';\n\nlet checkboxIds = 0;\n\n/**\n * `nano-checkbox` is used to let a user choose one or more options from a limited number of options.\n * They appear as checked when activated.\n * They can be checked by mouse, keyboard, touch or programmatically by setting the checked property.\n *\n * @slot - if you do not set a label attribute, you can use this slot for more complex markup\n */\n@Component({\n tag: 'nano-checkbox',\n styleUrl: 'checkbox.scss',\n scoped: true,\n})\nexport class Checkbox implements ComponentInterface {\n private inputId = `nano-cb-${checkboxIds++}`;\n private input: HTMLInputElement;\n\n @Element() private host: HTMLNanoCheckboxElement;\n @State() inputType: 'checkbox' | 'radio' = 'checkbox';\n\n /** @internal */\n @Prop({ mutable: true, reflect: true }) hasFocus = false;\n\n /**\n * checked property that can be used to get/set the value. accepts only boolean values\n */\n @Prop({ mutable: true, reflect: true }) checked: boolean = false;\n\n @Watch('checked')\n async handleCheckedChange() {\n if (!this.input) return;\n\n this.input.checked = this.checked;\n\n if (this.inputType === 'radio' && this.name && this.checked) {\n const form = this.host.closest('form');\n let ctrls: Element[];\n if (form) {\n ctrls = Array.from(\n form.querySelectorAll(\n `${transformTag('nano-checkbox')}[name=\"${this.name}\"]`\n )\n );\n } else {\n ctrls = Array.from(\n document.querySelectorAll(\n `${transformTag('nano-checkbox')}[name=\"${this.name}\"]`\n )\n )?.filter((radio) => !radio.closest('form'));\n }\n ctrls.map((el: HTMLNanoCheckboxElement) => {\n if (el !== this.host) el.checked = false;\n });\n }\n this.nanoChange.emit({ value: this.value, checked: this.checked });\n }\n\n /**\n * If `true`, the user cannot interact with the checkbox.\n */\n @Prop({ reflect: true }) disabled: boolean = false;\n\n /**\n * The value of a checkbox is analogous to the value of an `<input type='checkbox'>`,\n * it's only present when `checked` is true.\n */\n @Prop({ reflect: true }) value: string = 'on';\n\n /**\n * The name of the control, which is submitted with the form data.\n */\n @Prop({ reflect: true }) name: string;\n\n /**\n * Set to true to make the field required.\n */\n @Prop({ reflect: true }) required: boolean = false;\n\n /**\n * Controls the underlying field type and style.\n */\n @Prop({ reflect: true }) type:\n | 'radio'\n | 'checkbox'\n | 'tag'\n | 'segment'\n | 'switch'\n | 'segment-pill' = 'checkbox';\n\n @Watch('type')\n typeChange() {\n if (['checkbox', 'switch', 'tag'].includes(this.type))\n this.inputType = 'checkbox';\n else this.inputType = 'radio';\n }\n\n /**\n * label property that can be used to set the label text. Alternatively you may use a label slot.\n */\n @Prop() label?: string;\n\n /**\n * If `true`, the checkbox will visually appear as indeterminate (only relevant for type=\"checkbox\")\n */\n @Prop({ mutable: true, reflect: true }) indeterminate: boolean = false;\n\n @Watch('indeterminate')\n handleIndeterminateChange() {\n this.checked = false;\n this.input.indeterminate = this.indeterminate;\n }\n\n /**\n * This will be true when the control is in an invalid state.\n * Validity is determined by the `required` prop. Or if custom validity message is set. @readonly\n */\n @Prop({ reflect: true })\n get invalid() {\n return this._invalid;\n }\n @State() _invalid = false;\n\n /**\n * Current validation message - if any. @readonly\n */\n @Prop()\n get validityMessage() {\n if (!this.input) return '';\n return this.input.validationMessage;\n }\n\n /**\n * Color to use from your application's color palette.\n */\n @Prop() color?: Color;\n\n /**\n * The form element to associate the input with (its form owner). Must be the id of a form.\n */\n @Prop() form?: string | null;\n\n /**\n * Emited when the checkbox is toggled\n */\n @Event() nanoChange: EventEmitter<CheckboxChangeEventDetail>;\n\n /**\n * Emited when the checkbox is focused\n */\n @Event() nanoFocus: EventEmitter;\n\n /**\n * Emited when the checkbox is blurred\n */\n @Event() nanoBlur: EventEmitter;\n\n // public methods\n\n /**\n * Returns the native input control\n * @returns the native input control\n */\n @Method()\n async getInputElement() {\n if (this.input) return this.input;\n }\n\n /**\n * Get the current state of the control.\n * @param validateFirst - perform validation first before reporting\n * @returns `Promise<{ isValid: boolean, errorMessage: string }>`\n */\n @Method()\n async reportValidity(\n validateFirst: boolean = false\n ): Promise<ControlValidity> {\n if (validateFirst) this.input.reportValidity();\n this._invalid = !this.input.validity.valid;\n\n return {\n isValid: !this.invalid,\n errorMessage: this.input.validationMessage,\n };\n }\n\n /**\n * Sets a custom validation message.\n * If `message` is not empty, the field will be considered invalid. Use in conjunction with `nano-checkbox-group`\n */\n @Method()\n async setError(message: string, updateStatus = true) {\n if (!this.input) return;\n if (updateStatus) this._invalid = !!message.length;\n this.input.setCustomValidity(message);\n }\n\n /**\n * Sets focus on the checkbox.\n */\n @Method()\n async setFocus() {\n if (this.input) {\n this.input.focus();\n focusVisible.force(this.input);\n }\n }\n\n /**\n * Removes focus from the checkbox.\n */\n @Method()\n async removeFocus() {\n if (this.input) {\n this.input.blur();\n focusVisible.force(this.input, false);\n }\n }\n\n @Listen('reset', { target: 'body' })\n onReset(e) {\n const form = this.form\n ? document.querySelector('#' + this.form)\n : this.host.closest('form');\n if (!form || e.target !== this.host.closest('form')) return;\n\n this.checked = false;\n }\n\n // private handlers\n\n private handleInvalid = (ev: Event) => {\n this._invalid = !(ev.target as HTMLInputElement).validity.valid;\n };\n\n private handleChange = (ev: InputEvent) => {\n this.checked = (ev.target as HTMLInputElement).checked;\n this.indeterminate = false;\n };\n\n private handleFocus = () => {\n this.hasFocus = true;\n this.nanoFocus.emit();\n };\n\n private handleBlur = () => {\n this.hasFocus = false;\n this.nanoBlur.emit();\n };\n\n /* Although many radio components can be 'checked',\n the underlying control may not be. Check */\n private isRadioChecked() {\n requestAnimationFrame(() => (this.checked = this.input.checked));\n }\n\n // Stencil hooks\n\n componentWillLoad() {\n this.typeChange();\n }\n\n componentDidLoad() {\n this.input.indeterminate = this.indeterminate;\n this.isRadioChecked();\n focusVisible.observe(this.input);\n }\n\n disconnectedCallback() {\n focusVisible.unobserve(this.input);\n }\n\n render() {\n const labelId = this.inputId + '-lbl';\n\n return (\n <Host\n class={{ ...createColorClasses(this.color), 'nano-checkbox': true }}\n >\n <label\n class={{\n nanocb: true,\n 'nanocb--checked': this.checked,\n 'nanocb--invalid': this.invalid,\n 'nanocb--disabled': this.disabled,\n 'nanocb--focused': this.hasFocus,\n 'nanocb--indeterminate': this.indeterminate,\n }}\n htmlFor={this.inputId}\n >\n <input\n type={this.inputType}\n name={this.name}\n form={this.form}\n required={this.required}\n checked={this.checked}\n disabled={this.disabled}\n value={this.value}\n aria-labelledby={labelId}\n onBlur={this.handleBlur}\n onFocus={this.handleFocus}\n onChange={this.handleChange}\n ref={(input) => (this.input = input)}\n id={this.inputId}\n onInvalid={this.handleInvalid}\n />\n <span class={'nanocb__input nanocb__input--' + this.type}></span>\n\n <div id={labelId} class={'nanocb__label nanocb__label--' + this.type}>\n {this.label && !!this.label.length && <span>{this.label}</span>}\n <span hidden={this.label && !!this.label.length}>\n <slot />\n </span>\n </div>\n </label>\n </Host>\n );\n }\n}\n"],"version":3}
|
|
1
|
+
{"file":"nano-checkbox.entry.js","mappings":"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","names":[],"sources":["src/components/checkbox/checkbox.scss?tag=nano-checkbox&encapsulation=scoped","src/components/checkbox/checkbox.tsx"],"sourcesContent":["@use 'sass:map';\n@use '../../global/style/utilities' as mx;\n@use '../../global/style/nano-theme/tokens';\n\n:host {\n /**\n * @prop --control-invalid-style: Control box-shadow when invalid. Defaults to to #{tokens.$control-invalid-style};\n * @prop --focus-shadow: Control focus box-shadow. Defaults to to #{tokens.$control-focus-style};\n * @prop --padding: padding around radio and checkbox controls. Defaults to initial;\n * @prop --control-padding: padding around tag and segmented controls text. Various defaults.\n * @prop --check-bg-color: Initial Bg color of radio / checkbox controls. Changes for [checked] and [disabled] states. Defaults to #{map.get(tokens.$colors, white)};\n * @prop --check-border-color: initial border color. Defaults to #{map.get(tokens.$colors, palegrey)};\n * @prop --check-border-size: initial border size. Default to 1px;\n * @prop --check-border-style: Initial border style. Defaults to var(--check-border-size) solid var(--check-border-color);\n * @prop --check-checked-bg-color: Checked bg of controls (not tag). Defaults to #{map.get(tokens.$colors, darkgrey)};\n * @prop --check-checked-border-color: Checked border color of radio / checkbox controls. Defaults to #{map.get(tokens.$colors, darkgrey)};\n * @prop --check-checked-higlight-color: Checked forgrdound / icon color. Defaults to #{map.get(tokens.$colors, white)};\n * @prop --check-base-size: Relative scaling size for check controls. Defaults to to inherit;\n\n * @prop --cb-border-radius: Checkbox border radius. Defaults to to 2px and 5px on [has-focus];\n * @prop --radio-border-radius: Radio border radius. Defaults to to 50%;\n * @prop --tagbox-rgb: an rba list for tags which can be used to generate --tagbox-border-color and --tagbox-bg-color. Defaults to #{mx.color-to-rgb-list(map.get(tokens.$colors, lightblue))};\n * @prop --tagbox-border-color: Defaults to rgb(var(--tagbox-rgb) / 50%);\n * @prop --tagbox-bg-color: Defaults to rgb(var(--tagbox-rgb) / 10%);\n * @prop --segment-color: Segment, unselected text color. (selected color is --check-checked-higlight-color). Defaults to #{map.get(tokens.$colors, blue)};\n * @prop --segment-border-radius: Defaults to 3px;\n * @prop --segment-shadow: Defaults to 0 1px 4px rgb(0 0 0 / 20%);\n * @prop --switch-inactive-color: Defaults to rgb(#{mx.color-to-rgb-list(map.get(tokens.$colors, palegrey))} / 70%);\n * @prop --switch-active-color: Defaults to #{map.get(tokens.$colors, blue)};\n */\n\n --focus-shadow: #{tokens.$control-focus-style};\n --invalid-shadow: #{tokens.$control-focus-size + ' ' map.get(tokens.$colors, red)};\n --padding: initial;\n --check-bg-color: #{map.get(tokens.$colors, white)};\n --check-border-color: #{map.get(tokens.$colors, palegrey)};\n --check-border-size: 1px;\n --check-border-style: var(--check-border-size) solid var(--check-border-color);\n --check-checked-bg-color: #{map.get(tokens.$colors, darkgrey)};\n --check-checked-border-color: #{map.get(tokens.$colors, darkgrey)};\n --check-checked-higlight-color: #{map.get(tokens.$colors, white)};\n --check-base-size: inherit;\n --label-spacing: 10px 0;\n\n // type specific\n\n // tag\n --tagbox-rgb: #{mx.color-to-rgb-list(map.get(tokens.$colors, lightblue))};\n --tagbox-border-color: rgb(var(--tagbox-rgb) / 50%);\n --tagbox-bg-color: rgb(var(--tagbox-rgb) / 20%);\n --tagbox-border-radius: 0;\n\n // segment\n --segment-color: #{map.get(tokens.$colors, blue)};\n --segment-border-radius: 3px;\n --segment-shadow: 0 1px 4px rgb(0 0 0 / 20%);\n\n // cb / radio\n --cb-border-radius: 2px;\n --radio-border-radius: 50%;\n\n // switch\n --switch-inactive-color: rgb(#{mx.color-to-rgb-list(map.get(tokens.$colors, palegrey))} / 70%);\n --switch-active-color: #{map.get(tokens.$colors, blue)};\n\n display: inline-block;\n max-inline-size: 100%;\n\n * {\n box-sizing: inherit;\n }\n}\n\n:host([type='tag']) {\n text-transform: uppercase;\n\n --control-padding: 0.2rem 1rem;\n}\n\n:host([type='radio'][checked]):not([checked='false']) {\n --check-border-size: 0.3125em;\n}\n\n:host([type='segment']) {\n --check-border-style: none;\n --control-padding: 0.7em 1em 0.7em 1em;\n}\n\n:host([type='segment-pill']) {\n --check-border-color: #{rgba(map.get(tokens.$colors, palegrey), 0.5)};\n --segment-border-radius: 5px;\n --control-padding: 0.7em 1em 0.7em 1em;\n}\n\n:host(.nano-color) {\n --tagbox-rgb: var(--nano-color-base-rgb);\n --focus-shadow: #{tokens.$control-focus-size} var(--nano-color-shade);\n}\n\n:host([checked]:not([checked='false'])) {\n --tagbox-border-color: rgb(var(--tagbox-rgb) / 80%);\n --tagbox-bg-color: rgb(var(--tagbox-rgb) / 50%);\n}\n\n:host([has-focus]:not([has-focus='false'])) {\n --cb-border-radius: 5px;\n}\n\n:host([disabled]:not([disabled='false'])) {\n opacity: 0.7;\n\n --tagbox-rgb: #{mx.color-to-rgb-list(map.get(tokens.$colors, mediumgrey))};\n --check-bg-color: #{rgba(map.get(tokens.$colors, mediumgrey), 0.5)};\n --check-checked-bg-color: #{rgba(map.get(tokens.$colors, mediumgrey), 0.5)};\n --segment-color: #{map.get(tokens.$colors, darkgrey)};\n}\n\n.nanocb {\n padding: var(--padding);\n cursor: pointer;\n display: flex;\n align-items: center;\n line-height: 1.2;\n position: relative;\n\n // The mock, viewable 'input' control. Only relevant for controls where the label\n // is outside / separate from the UI control (e.g. checkbox, radio, switch).\n\n &__input {\n border-radius: var(--cb-border-radius, 3px);\n font-size: var(--check-base-size);\n position: relative;\n block-size: 1.5em;\n inline-size: 1.5em;\n min-inline-size: 1.5em;\n border: var(--check-border-style);\n box-shadow: 0 1px 4px rgb(0 0 0 / 20%);\n\n &::before {\n border-radius: var(--cb-border-radius);\n position: absolute;\n content: '';\n inset-inline-start: calc(0.725em - var(--check-border-size));\n inset-block-start: calc(0.725em - var(--check-border-size));\n inline-size: 0;\n block-size: 0;\n border: 2px solid var(--check-checked-higlight-color);\n transform: scale(0);\n }\n\n &--radio {\n border-radius: var(--radio-border-radius);\n background-color: var(--check-bg-color);\n }\n\n &--checkbox {\n background-color: var(--check-bg-color);\n\n &::after {\n border-radius: var(--cb-border-radius);\n position: absolute;\n content: '';\n inset-inline-start: calc(0.825em - var(--check-border-size));\n inset-block-start: calc(0.825em - var(--check-border-size));\n block-size: 0;\n inline-size: 0;\n border: solid var(--check-checked-higlight-color);\n border-width: 0 0.1875em 0.1875em 0;\n transform: rotate(0deg) scale(0);\n opacity: 1;\n transition: all 0.15s ease-out;\n\n .nanocb--indeterminate & {\n border-width: 0 0 0.1875em;\n }\n }\n }\n\n &--switch {\n border-radius: 1em !important;\n inline-size: 2.4em;\n block-size: 1.3em;\n background: var(--switch-inactive-color);\n\n :host([type=\"switch\"]:not([disabled])) & {\n &:hover::after {\n scale: 1.1 1;\n }\n }\n\n &::after {\n position: relative;\n content: '';\n display: block;\n border-radius: inherit;\n block-size: 80%;\n inline-size: 40%;\n background: var(--check-checked-higlight-color);\n transform-origin: left;\n inset-inline-start: 6%;\n inset-block-start: 10%;\n transition: .1s ease scale, .15s ease left;\n }\n }\n\n &--segment,\n &--segment-pill {\n @include mx.visually-hide();\n\n &::before {\n display: none;\n }\n }\n\n &--tag {\n @include mx.visually-hide();\n\n &::before {\n display: none;\n }\n }\n }\n\n &--invalid:not(.nanocb--focused) {\n .nanocb__input {\n box-shadow: 0 0 15px rgb(0 0 0 / 20%), var(--invalid-shadow);\n\n &--tag + .nanocb__label,\n &--segment + .nanocb__label,\n &--segment-pill + .nanocb__label {\n box-shadow: var(--invalid-shadow);\n z-index: 1;\n }\n }\n }\n\n // The 'real' input control which we hide but use it's state for display\n input {\n @include mx.visually-hide();\n\n &:focus ~ .nanocb__input {\n box-shadow: 0 0 15px rgb(0 0 0 / 20%), var(--focus-shadow);\n }\n\n &.focus-visible:focus ~ .nanocb__input {\n &--tag + .nanocb__label,\n &--segment + .nanocb__label,\n &--segment-pill + .nanocb__label {\n box-shadow: var(--focus-shadow);\n z-index: 1;\n }\n }\n\n &:checked ~ .nanocb__input {\n border-radius: var(--cb-border-radius);\n background-color: var(--check-checked-bg-color);\n transform: rotate(0deg) scale(1);\n opacity: 1;\n border-color: var(--check-checked-border-color);\n\n // segment / segment-pill active\n\n &--segment + .nanocb__label,\n &--segment-pill + .nanocb__label {\n color: var(--check-checked-higlight-color);\n background-color: var(--check-checked-bg-color);\n box-shadow: inset 0 3px 4px rgb(0 0 0 / 20%);\n }\n\n // radio active\n\n &--radio {\n border-radius: var(--radio-border-radius);\n background-color: var(--check-checked-higlight-color);\n\n &::after {\n border: solid var(--check-checked-border-color);\n border-width: 0 0.125em 0.125em 0;\n opacity: 0;\n }\n\n &::before {\n border-radius: var(--radio-border-radius);\n }\n }\n\n // checkbox active\n\n &--checkbox {\n &::after {\n transform: rotate(45deg) scale(1);\n opacity: 1;\n inset-inline-start: calc(0.575em - var(--check-border-size));\n inset-block-start: calc(0.2875em - var(--check-border-size));\n inline-size: 0.375em;\n block-size: 0.75em;\n border-radius: 0;\n }\n }\n\n // tag active\n\n &--tag + .nanocb__label::after {\n transform: rotate(45deg);\n }\n\n // switch active\n\n &--switch {\n background: var(--switch-active-color);\n\n &::after {\n inset-inline-start: 56%;\n transform-origin: right;\n }\n }\n }\n\n // indeterminate (only checkbox?)\n\n &:indeterminate ~ .nanocb__input--checkbox {\n border-radius: var(--input-border-radius, 5px);\n background-color: var(--check-checked-bg-color);\n transform: rotate(0deg) scale(1);\n opacity: 1;\n border: 0.125em solid var(--check-checked-bg-color);\n\n &::after {\n transform: scale(1);\n opacity: 1;\n inset-inline-start: 0.3125em;\n inset-block-start: 0;\n inline-size: 0.7em;\n block-size: 0.7em;\n border-radius: 0;\n }\n }\n }\n\n // The label\n &__label {\n padding-inline: var(--label-spacing);\n padding-block: 0;\n display: flex;\n align-items: center;\n line-height: 1;\n flex: 1;\n justify-content: space-between;\n\n &--segment,\n &--segment-pill {\n border: var(--check-border-style);\n border-radius: var(--segment-border-radius);\n box-shadow: var(--segment-shadow);\n display: inline-flex;\n padding: var(--control-padding);\n background: var(--check-bg-color);\n color: var(--segment-color);\n align-items: center;\n inline-size: 100%;\n }\n\n &--segment-pill {\n // first\n :host(:first-of-type) & {\n border-start-start-radius: var(--segment-border-radius);\n border-start-end-radius: 0;\n border-end-end-radius: 0;\n border-end-start-radius: var(--segment-border-radius);\n border-inline-end: none;\n }\n\n // middle\n :host(:not(:last-of-type):not(:first-of-type)) & {\n border-radius: 0;\n border-inline-end: none;\n }\n\n // last\n :host(:last-of-type) & {\n border-start-start-radius: 0;\n border-start-end-radius: var(--segment-border-radius);\n border-end-end-radius: var(--segment-border-radius);\n border-end-start-radius: 0;\n }\n\n // single\n :host(:first-of-type:last-of-type) & {\n border-radius: var(--segment-border-radius);\n border: var(--check-border-style);\n }\n }\n\n &--tag {\n letter-spacing: 2px;\n font-weight: 400;\n font-size: 0.65em;\n line-height: 1.4;\n padding: var(--control-padding);\n border: 2px solid #b5aea7;\n border-color: var(--tagbox-border-color);\n background-color: var(--tagbox-bg-color);\n transition: all 0.2s;\n border-radius: var(--cb-border-radius);\n inline-size: 100%;\n\n &::after {\n content: '+';\n margin-inline: 0.3125em 0;\n margin-block: 0;\n font-weight: 200;\n position: relative;\n font-family: inherit;\n font-size: 1.8em;\n display: inline-block;\n transform: rotate(0deg);\n transform-origin: center;\n }\n\n span {\n display: block;\n }\n }\n }\n}\n","import {\n Component,\n Prop,\n Event,\n EventEmitter,\n ComponentInterface,\n State,\n Watch,\n Method,\n Element,\n Host,\n Listen,\n} from '@stencil/core';\nimport { focusVisible } from '../../utils/focus-visible';\nimport { createColorClasses } from '../../utils/theme';\nimport { transformTag, h } from '../../utils/renderer';\nimport { CheckboxChangeEventDetail } from './checkbox-interface';\nimport type { ControlValidity, Color } from '../../types/shared';\n\nlet checkboxIds = 0;\n\n/**\n * `nano-checkbox` is used to let a user choose one or more options from a limited number of options.\n * They appear as checked when activated.\n * They can be checked by mouse, keyboard, touch or programmatically by setting the checked property.\n *\n * @slot - if you do not set a label attribute, you can use this slot for more complex markup\n */\n@Component({\n tag: 'nano-checkbox',\n styleUrl: 'checkbox.scss',\n scoped: true,\n})\nexport class Checkbox implements ComponentInterface {\n private inputId = `nano-cb-${checkboxIds++}`;\n private input: HTMLInputElement;\n\n @Element() private host: HTMLNanoCheckboxElement;\n @State() inputType: 'checkbox' | 'radio' = 'checkbox';\n\n /** @internal */\n @Prop({ mutable: true, reflect: true }) hasFocus = false;\n\n /**\n * checked property that can be used to get/set the value. accepts only boolean values\n */\n @Prop({ mutable: true, reflect: true }) checked: boolean = false;\n\n @Watch('checked')\n async handleCheckedChange() {\n if (!this.input) return;\n\n this.input.checked = this.checked;\n\n if (\n this.inputType === 'radio' &&\n this.name &&\n this.checked &&\n this.host.isConnected\n ) {\n const form = this.host.closest('form');\n const root = this.host.getRootNode() as ShadowRoot | Document;\n let ctrls: Element[];\n\n if (form) {\n ctrls = Array.from(\n form.querySelectorAll(\n `${transformTag('nano-checkbox')}[name=\"${this.name}\"]`\n )\n );\n } else {\n ctrls = Array.from(\n root.querySelectorAll(\n `${transformTag('nano-checkbox')}[name=\"${this.name}\"]`\n )\n )?.filter((radio) => !radio.closest('form'));\n }\n ctrls.map((el: HTMLNanoCheckboxElement) => {\n if (el !== this.host) el.checked = false;\n });\n }\n this.nanoChange.emit({ value: this.value, checked: this.checked });\n }\n\n /**\n * If `true`, the user cannot interact with the checkbox.\n */\n @Prop({ reflect: true }) disabled: boolean = false;\n\n /**\n * The value of a checkbox is analogous to the value of an `<input type='checkbox'>`,\n * it's only present when `checked` is true.\n */\n @Prop({ reflect: true }) value: string = 'on';\n\n /**\n * The name of the control, which is submitted with the form data.\n */\n @Prop({ reflect: true }) name: string;\n\n /**\n * Set to true to make the field required.\n */\n @Prop({ reflect: true }) required: boolean = false;\n\n /**\n * Controls the underlying field type and style.\n */\n @Prop({ reflect: true }) type:\n | 'radio'\n | 'checkbox'\n | 'tag'\n | 'segment'\n | 'switch'\n | 'segment-pill' = 'checkbox';\n\n @Watch('type')\n typeChange() {\n if (['checkbox', 'switch', 'tag'].includes(this.type))\n this.inputType = 'checkbox';\n else this.inputType = 'radio';\n }\n\n /**\n * label property that can be used to set the label text. Alternatively you may use a label slot.\n */\n @Prop() label?: string;\n\n /**\n * If `true`, the checkbox will visually appear as indeterminate (only relevant for type=\"checkbox\")\n */\n @Prop({ mutable: true, reflect: true }) indeterminate: boolean = false;\n\n @Watch('indeterminate')\n handleIndeterminateChange() {\n this.checked = false;\n this.input.indeterminate = this.indeterminate;\n }\n\n /**\n * This will be true when the control is in an invalid state.\n * Validity is determined by the `required` prop. Or if custom validity message is set. @readonly\n */\n @Prop({ reflect: true })\n get invalid() {\n return this._invalid;\n }\n @State() _invalid = false;\n\n /**\n * Current validation message - if any. @readonly\n */\n @Prop()\n get validityMessage() {\n if (!this.input) return '';\n return this.input.validationMessage;\n }\n\n /**\n * Color to use from your application's color palette.\n */\n @Prop() color?: Color;\n\n /**\n * The form element to associate the input with (its form owner). Must be the id of a form.\n */\n @Prop() form?: string | null;\n\n /**\n * Emited when the checkbox is toggled\n */\n @Event() nanoChange: EventEmitter<CheckboxChangeEventDetail>;\n\n /**\n * Emited when the checkbox is focused\n */\n @Event() nanoFocus: EventEmitter;\n\n /**\n * Emited when the checkbox is blurred\n */\n @Event() nanoBlur: EventEmitter;\n\n // public methods\n\n /**\n * Returns the native input control\n * @returns the native input control\n */\n @Method()\n async getInputElement() {\n if (this.input) return this.input;\n }\n\n /**\n * Get the current state of the control.\n * @param validateFirst - perform validation first before reporting\n * @returns `Promise<{ isValid: boolean, errorMessage: string }>`\n */\n @Method()\n async reportValidity(\n validateFirst: boolean = false\n ): Promise<ControlValidity> {\n if (validateFirst) this.input.reportValidity();\n this._invalid = !this.input.validity.valid;\n\n return {\n isValid: !this.invalid,\n errorMessage: this.input.validationMessage,\n };\n }\n\n /**\n * Sets a custom validation message.\n * If `message` is not empty, the field will be considered invalid. Use in conjunction with `nano-checkbox-group`\n */\n @Method()\n async setError(message: string, updateStatus = true) {\n if (!this.input) return;\n if (updateStatus) this._invalid = !!message.length;\n this.input.setCustomValidity(message);\n }\n\n /**\n * Sets focus on the checkbox.\n */\n @Method()\n async setFocus() {\n if (this.input) {\n this.input.focus();\n focusVisible.force(this.input);\n }\n }\n\n /**\n * Removes focus from the checkbox.\n */\n @Method()\n async removeFocus() {\n if (this.input) {\n this.input.blur();\n focusVisible.force(this.input, false);\n }\n }\n\n @Listen('reset', { target: 'body' })\n onReset(e) {\n const form = this.form\n ? document.querySelector('#' + this.form)\n : this.host.closest('form');\n if (!form || e.target !== this.host.closest('form')) return;\n\n this.checked = false;\n }\n\n // private handlers\n\n private handleInvalid = (ev: Event) => {\n this._invalid = !(ev.target as HTMLInputElement).validity.valid;\n };\n\n private handleChange = (ev: InputEvent) => {\n this.checked = (ev.target as HTMLInputElement).checked;\n this.indeterminate = false;\n };\n\n private handleFocus = () => {\n this.hasFocus = true;\n this.nanoFocus.emit();\n };\n\n private handleBlur = () => {\n this.hasFocus = false;\n this.nanoBlur.emit();\n };\n\n /* Although many radio components can be 'checked',\n the underlying control may not be. Check */\n private isRadioChecked() {\n requestAnimationFrame(() => (this.checked = this.input.checked));\n }\n\n // Stencil hooks\n\n componentWillLoad() {\n this.typeChange();\n }\n\n componentDidLoad() {\n this.input.indeterminate = this.indeterminate;\n this.isRadioChecked();\n focusVisible.observe(this.input);\n }\n\n disconnectedCallback() {\n focusVisible.unobserve(this.input);\n }\n\n render() {\n const labelId = this.inputId + '-lbl';\n\n return (\n <Host\n class={{ ...createColorClasses(this.color), 'nano-checkbox': true }}\n >\n <label\n class={{\n nanocb: true,\n 'nanocb--checked': this.checked,\n 'nanocb--invalid': this.invalid,\n 'nanocb--disabled': this.disabled,\n 'nanocb--focused': this.hasFocus,\n 'nanocb--indeterminate': this.indeterminate,\n }}\n htmlFor={this.inputId}\n >\n <input\n type={this.inputType}\n name={this.name}\n form={this.form}\n required={this.required}\n checked={this.checked}\n disabled={this.disabled}\n value={this.value}\n aria-labelledby={labelId}\n onBlur={this.handleBlur}\n onFocus={this.handleFocus}\n onChange={this.handleChange}\n ref={(input) => (this.input = input)}\n id={this.inputId}\n onInvalid={this.handleInvalid}\n />\n <span class={'nanocb__input nanocb__input--' + this.type}></span>\n\n <div id={labelId} class={'nanocb__label nanocb__label--' + this.type}>\n {this.label && !!this.label.length && <span>{this.label}</span>}\n <span hidden={this.label && !!this.label.length}>\n <slot />\n </span>\n </div>\n </label>\n </Host>\n );\n }\n}\n"],"version":3}
|