npm - @nanoporetech-digital/components - Versions diffs - 1.15.6 → 2.1.0 - Mend

@nanoporetech-digital/components 1.15.6 → 2.1.0

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

Files changed (981) hide show

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

@@ -0,0 +1 @@

+ {"version":3,"sources":["src/components/nav-item/nav-item.scss?tag=nano-nav-item&encapsulation=shadow","src/components/nav-item/nav-item.tsx","src/components/select/select.scss?tag=nano-select&encapsulation=scoped","src/components/select/select.tsx"],"names":["navItemCss","NavItem","exports","class_1","hostRef","_this","this","hasSecondarySlot","hasAnchorEle","didBlur","animating","didOpen","isInGlobalNav","isInMenuDrawer","isInMenu","isLegacy","document","head","attachShadow","hasFocus","href","target","disabled","open","selected","secondaryActiveWidth","secondaryFallback","closeOnBlur","closeSecondary","__awaiter","nanoClosing","emit","secondaryMenu","secondaryDiv","displayTransition","status","_b","sent","openSecondary","window","innerWidth","call","nanoOpening","toggleSecondary","handleFocus","nanoFocus","handleHostBlur","el","removeAttribute","nanoBlur","handleHostClick","ev","foundlink","closest","btn","click","handleMouseEnter","globalNavEle","classList","contains","timeToWait","getSiblings","length","clearTimeout","waitHide","fromHover","waitShow","setTimeout","__generator","handleMouseLeave","handleClick","_a","querySelector","blur","relatedTarget","foundThisNavEle","focus","preventScroll","removeEventListener","prototype","setFocus","openChange","didOpenChange","nanoClose","panelio_1","IntersectionObserver","data","boundingClientRect","top","scrollIntoView","behavior","disconnect","threshold","observe","addEventListener","tabIndex","nanoOpen","found","parentElement","componentWillLoad","secondaryEle","link","getDirectChildren","connectedCallback","render","h","Host","class","has-secondary","secondary-open","has-focus","nano-global-nav","nano-menu-drawer","nano-menu","legacy","onBlur","dir","ownerDocument","onMouseEnter","onMouseLeave","onClick","role","nav-item","ref","a","onFocus","name","div","tabindex","selectCss","selectIds","Select","class_2","valueItems","selectId","rtl","onInit","currInsertIndex","showErrorMsg","errorMessage","hasLabelSlot","hasHelperSlot","inputSearchVal","_invalid","autofocus","validateOn","showInlineError","hideLabel","floatLabel","multiple","readonly","required","allowCustomValues","_value","_options","_eOptions","clearSelect","mask","debounce","dropDownConfig","customValidate","nativeSelect","setCustomValidity","valArray","isValidValues","max","min","showInlineValidation","validity","valid","validationMessage","nanoValidate","isValid","invalid","originalEvent","handleInvalid","preventDefault","_","setValue","e","value","detail","inputCtrl","includes","__spreadArray","slice","removeValue","toFind","filter","val","setOptions","datalist","activeOptions","map","ao","label","filterMeta","handleDocumentKeyDown","rm","key","previousElementSibling","dataset","nextElementSibling","previousSibling","nextSibling","event","Event","dispatchEvent","clearSelectValue","stopPropagation","onDragStart","ele","dragVal","onDragEnd","onDragLeave","spanVal","to","indexOf","from","tmpArr","tmpVal","onMultiInput","trim","nanoSearchChange","Object","defineProperty","_selectWrap","setDataListOpts","_datalist","split","Array","isArray","opts","opt","debounceChanged","debounceEvent","shouldValidate","valueChanged","nanoChange","selectWrap","currDWConfig","assign","tetherTo","input","reportValidity","validateFirst","getSelectElement","Promise","resolve","showError","message","find","options","slotChangeObserver","mo","MutationObserver","processSlottedContent","childList","subtree","querySelectorAll","console","warn","getLabel","handleBlur","kev","raf","getActiveElement","closestElement","tagName","toLowerCase","CustomEvent","disconnectedCallback","componentDidLoad","labelId","moreId","compWrapOptions","placeholder","wrapOptions","hasValue","controlId","controlOptions","clearControl","type","aria-disabled","createColorClasses","color","has-value","is-invalid","has-label","has-float-label","has-multiple","has-clr-btn","masked","FormControlWrap","FormControl","onClearText","control","endValueSlot","slot","multipleValues","id","aria-labelledby","form","readOnly","onNanoOptionsUpdated","onNanoSelect","onNanoDeselect","undefined","select","onInvalid","autoFocus","autocomplete","onKeyDown","onInput","onTouchStart","onMouseDown","i","toReturn","onDragOver","draggable","data-value","span","push","onTouchEnd","onMouseUp"],"mappings":"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","sourcesContent":["@import '../../global/style/utilities/globals';\n@import '../../global/style/nano-theme/form';\n\n:host {\n // These can be overwritten, but are autatically set from context components\n\n // --padding-top: inherit;\n // --padding-bottom: inherit;\n // --padding-start: inherit;\n // --padding-end: inherit;\n // --margin: inherit;\n\n // --secondary-padding-top: inherit;\n // --secondary-padding-bottom: inherit;\n // --secondary-padding-start: inherit;\n // --secondary-padding-end: inherit;\n\n // --border-bottom: inherit;\n // --icon-size: inherit;\n\n // --color: inherit;\n // --color-hover: inherit;\n // --color-focus: inherit;\n // --color-selected: inherit;\n // --color-open: inherit;\n\n // --bg-color: inherit;\n // --bg-color-hover: inherit;\n // --bg-color-selected: inherit;\n // --bg-color-open: inherit;\n // --bg-color-focus: inherit;\n\n // --secondary-bg-color: inherit;\n // --secondary-color: inherit;\n\n opacity: inherit;\n display: block;\n color: var(--color) !important;\n margin: var(--margin);\n\n ::slotted(*),\n * {\n box-sizing: border-box;\n }\n\n ::slotted(button),\n button {\n background: none;\n border: none;\n }\n\n ::slotted(button),\n ::slotted(a),\n ::slotted(a:visited),\n button,\n a,\n a:visited {\n @include text-inherit();\n @include padding(\n var(--padding-top),\n var(--padding-end),\n var(--padding-bottom),\n var(--padding-start)\n );\n\n display: var(--display, block);\n white-space: nowrap;\n color: var(--color) !important;\n background-color: var(--bg-color);\n }\n\n ::slotted(nano-icon[slot='icon-start']) {\n @include padding(null, var(--padding-end), null, null);\n }\n\n ::slotted(nano-icon[slot='icon-end']) {\n @include padding(null, null, null, var(--padding-start));\n }\n\n .link {\n &::slotted(nano-icon[slot='icon-start']),\n ::slotted(nano-icon[slot='icon-start']) {\n @include padding(null, 0, null, var(--padding-start));\n }\n\n &::slotted(nano-icon[slot='icon-end']),\n ::slotted(nano-icon[slot='icon-end']) {\n @include padding(null, var(--padding-end), null, 0);\n }\n }\n\n .link,\n button,\n a {\n border-bottom: var(--border-bottom);\n display: flex;\n align-items: center;\n }\n\n .secondary-menu {\n display: none;\n }\n\n ::slotted(a:hover),\n ::slotted(button:hover),\n .link:hover,\n button:hover,\n a:hover {\n text-decoration: inherit !important;\n }\n\n button:focus,\n a:focus {\n color: var(--color-focus, var(--color-hover, var(--color))) !important;\n background-color:\n var(\n --bg-color-focus,\n var(--bg-color-hover, var(--bg-color))\n );\n outline: var(--focus-outline, none);\n }\n\n ::slotted(a:focus),\n ::slotted(button:focus) {\n color: var(--color-focus, var(--color-hover, var(--color))) !important;\n background-color:\n var(\n --bg-color-focus,\n var(--bg-color-hover, var(--bg-color))\n );\n outline: none;\n }\n}\n\n.nav-item {\n &.selected {\n .link,\n button,\n a {\n color: var(--color-selected, var(--color-open, var(--color))) !important;\n background-color:\n var(\n --bg-color-selected,\n var(--bg-color-open, var(--bg-color))\n );\n }\n }\n\n &.secondary-open {\n button,\n a {\n color: var(--color-open, var(--color-selected, var(--color))) !important;\n background-color:\n var(\n --bg-color-open,\n var(--secondary-bg-color, var(--bg-color-selected, var(--bg-color)))\n );\n }\n }\n\n &.disabled {\n opacity: 0.6;\n\n button,\n a {\n color: var(--color-disabled, var(--color)) !important;\n }\n }\n\n &:not(.nano-menu) {\n ::slotted(a:hover),\n ::slotted(button:hover),\n .link:hover,\n button:hover,\n a:hover {\n color: var(--color-hover, var(--color-hover, var(--color))) !important;\n background-color:\n var(\n --bg-color-hover,\n var(--bg-color-focus, var(--bg-color))\n );\n }\n }\n}\n\n:host(.has-focus) {\n .link {\n color: var(--color-focus, var(--color-hover, var(--color))) !important;\n background-color:\n var(\n --bg-color-focus,\n var(--bg-color-hover, var(--bg-color))\n );\n outline: var(--focus-outline, 5px auto -webkit-focus-ring-color);\n }\n}\n\n:host(.nano-global-nav-menu),\n:host(.nano-menu) {\n a,\n a:visited,\n button,\n .link {\n display: flex;\n justify-content: flex-start;\n flex-direction: row;\n align-items: center;\n color: 'currentColor';\n text-decoration: inherit;\n white-space: normal;\n cursor: pointer;\n line-height: 1.2;\n width: 100%;\n }\n\n .text {\n @include padding(null, var(--padding-end), null, 0);\n\n flex: 1;\n }\n\n ::slotted(a),\n ::slotted(button) {\n flex: 1;\n }\n\n ::slotted(a:focus),\n ::slotted(button:focus) {\n box-shadow: none;\n }\n\n .secondary-menu {\n display: none;\n position: absolute;\n color: var(--secondary-color, 'currentColor');\n min-height: 100%;\n top: 0;\n left: 0;\n width: 100%;\n z-index: 1;\n opacity: 0;\n transition: opacity 0.2s ease, transform 0.3s ease;\n background-color: var(--secondary-bg-color, white);\n transform: translateX(100%);\n\n &:focus {\n outline: none;\n }\n\n &.open {\n opacity: 1;\n transform: translateX(0);\n transition: opacity 0.3s ease, transform 0.2s ease;\n }\n }\n}\n\n:host(.nano-global-nav-menu) {\n ::slotted(nano-icon[slot='icon-start']) {\n @include padding(0, var(--padding-end), 0, 0);\n }\n\n ::slotted(nano-icon[slot='icon-end']) {\n @include padding(0, var(--padding-end), 0, 0);\n\n font-size: 10px;\n flex: 0 0 10px;\n pointer-events: none;\n }\n\n button,\n a {\n ::slotted(nano-icon[slot='icon-end']) {\n padding: 0;\n }\n }\n}\n\n:host(.nano-global-nav-menu[dir='rtl']),\n:host(.nano-menu[dir='rtl']) {\n .secondary-menu {\n left: auto;\n right: 0;\n transform: translateX(-100%);\n\n &.open {\n transform: translateX(0);\n }\n }\n}\n\n:host(.nano-menu) {\n .secondary-menu-content {\n @include padding(\n var(--secondary-padding-top),\n var(--secondary-padding-end),\n var(--secondary-padding-bottom),\n var(--secondary-padding-start)\n );\n }\n}\n\n// I'm sorry. Horrible IE fixes for collapsing stuff :/\n:host(.nano-global-nav-bar.legacy) {\n margin: 0 11px;\n\n ::slotted(a) {\n @include padding(7px, 6px, 7px, 6px);\n }\n}\n\n:host(.nano-global-nav-menu.legacy) {\n ::slotted(a) {\n @include padding(8px, 12px, 8px, 12px);\n }\n}\n\n:host(.nano-global-nav-bar) {\n .link,\n a,\n button {\n display: flex;\n align-items: center;\n cursor: pointer;\n }\n\n .text {\n flex: 1 0 auto;\n }\n\n ::slotted(nano-icon[slot='icon-end']) {\n @include margin(0, 0, 0, var(--padding-end));\n }\n\n ::slotted(nano-icon[slot='icon-start']) {\n @include margin(0, var(--padding-start), 0, 0);\n }\n}\n\n:host(.nano-global-nav-bar.has-secondary) {\n button {\n position: relative;\n\n &::before {\n content: '';\n background: rgb(134, 190, 226);\n height: 3px;\n left: 5px;\n bottom: -14px;\n right: 5px;\n position: absolute;\n transform: translateZ(0) scaleX(0);\n transform-origin: 0;\n transition: 0.2s ease transform;\n }\n }\n\n .selected button::before,\n .secondary-open button::before {\n transform: translateZ(0) scaleX(1);\n }\n\n .secondary-open button::before {\n opacity: 0.5;\n }\n\n .secondary-menu {\n display: none;\n transition: transform 0.3s ease;\n transform: translateY(-100%) translateZ(0);\n background-color: var(--secondary-bg-color, #196c82);\n color: var(--secondary-color);\n position: absolute;\n box-shadow: 0 1px 25px 0 rgba(0, 0, 0, 0.15);\n left: 0;\n right: 0;\n z-index: -2;\n outline: none;\n\n &.open {\n transform: translateY(12px) translateZ(0);\n }\n }\n}\n\n:host(.nano-menu-drawer) {\n .link,\n a,\n button {\n @include padding(\n calc(var(--padding-top) / 2),\n 0,\n calc(var(--padding-bottom) / 2),\n var(--padding-start)\n );\n\n display: flex;\n justify-content: flex-start;\n flex-direction: row;\n align-items: center;\n color: currentColor;\n text-decoration: inherit;\n white-space: normal;\n border: none;\n cursor: pointer;\n line-height: 1.2;\n width: 100%;\n }\n\n .text {\n @include padding(null, var(--padding-end), null, 0);\n\n text-align: left;\n flex: 0 1 auto;\n min-width: 130px;\n width: 130px;\n }\n\n ::slotted(nano-icon[slot='icon-start']) {\n @include padding(0, var(--padding-end), 0, 0);\n\n font-size: var(--icon-size);\n width: var(--icon-size);\n flex: 0 0 var(--icon-size);\n }\n\n ::slotted(nano-icon[slot='icon-end']) {\n @include padding(0, var(--padding-end), 0, 0);\n\n font-size: 10px;\n flex: 0 0 20px;\n min-width: 20px;\n }\n\n .secondary-menu {\n display: none;\n position: absolute;\n background-color: var(--secondary-bg-color);\n color: var(--secondary-color);\n height: 100vh;\n top: 0;\n right: 0;\n left: auto;\n bottom: 0;\n transform: translateX(0);\n z-index: -1;\n transition: transform 0.3s ease, opacity 0.2s ease;\n overflow-y: auto;\n width: var(--secondary-width, 400px);\n max-width: 62vw;\n opacity: 1;\n\n @include padding(\n var(--secondary-padding-top, var(--padding-top)),\n var(--secondary-padding-end, var(--padding-end)),\n var(--secondary-padding-bottom, var(--padding-bottom)),\n var(--secondary-padding-start, var(--padding-start))\n );\n\n &:focus {\n outline: none;\n }\n\n &.open {\n transform: translateX(100%);\n // opacity: 1;\n }\n }\n}\n\n:host(.nano-menu-drawer.legacy) {\n .link,\n a,\n button {\n width: auto;\n }\n\n ::slotted(nano-icon[slot='icon-end']) {\n @include padding(0, calc(var(--padding-end) * 2), 0, 0);\n\n font-size: 10px;\n flex: 0 0 20px;\n min-width: 20px;\n }\n}\n\n:host(.nano-menu-drawer[dir='rtl']) {\n .text {\n text-align: right;\n }\n\n .secondary-menu {\n right: auto;\n left: 0;\n transform: translateX(0%);\n\n &.open {\n transform: translateX(-100%);\n opacity: 1;\n }\n }\n}\n","import {\n Component,\n h,\n Host,\n Element,\n Prop,\n Watch,\n EventEmitter,\n Event,\n State,\n Method,\n ComponentInterface,\n} from '@stencil/core';\nimport { displayTransition, getDirectChildren, getSiblings } from '../../utils';\nimport { NavItemEventDetail } from '../../interface';\n\n/**\n * Nav items to be used with the various nav items.\n * [Globla-Nav](/story/compounds-global-nav)\n * [Menu-Drawer](/story/components-menu-drawer)\n * [Dropdown](/story/components-dropdown)\n */\n@Component({\n tag: 'nano-nav-item',\n styleUrl: 'nav-item.scss',\n shadow: true,\n})\nexport class NavItem implements ComponentInterface {\n private hasSecondarySlot: boolean = false;\n private hasAnchorEle: boolean = false;\n private secondaryDiv: HTMLDivElement;\n private btn: HTMLButtonElement | HTMLAnchorElement;\n private didBlur: boolean = false;\n private fromHover: boolean;\n private animating: boolean = false;\n private waitHide: number;\n private waitShow: number;\n private globalNavEle?: HTMLNanoGlobalNavElement;\n\n @State() didOpen: boolean = false;\n @State() isInGlobalNav: boolean = false;\n @State() isInMenuDrawer: boolean = false;\n @State() isInMenu: boolean = false;\n @State() isLegacy: boolean = !document.head.attachShadow;\n @State() hasFocus: boolean = false;\n @Element() private el: HTMLNanoNavItemElement;\n\n /**\n * Href to link to\n */\n @Prop({ mutable: true }) href: string = null;\n\n /**\n * Target to use for links\n */\n @Prop() target: '_self' | '_blank' | '_parent' | '_top' = '_self';\n\n /**\n * Disable the nav item\n */\n @Prop() disabled: boolean = false;\n\n /**\n * Whether a secondary menu should be or is currently open\n */\n @Prop({ mutable: true, reflect: true }) open: boolean = false;\n\n /**\n * Whether this menu item is currently 'selected'\n */\n @Prop({ reflect: true }) selected: boolean = false;\n\n /**\n * Screen pixel width to activate the secondary menu\n */\n @Prop() secondaryActiveWidth: number = 0;\n\n /**\n * Secondary fallback function for when the secondary menu is no longer active.\n */\n @Prop() secondaryFallback = () => {};\n\n /**\n * Whether secondary menus should close on blur\n */\n @Prop() closeOnBlur: boolean = true;\n\n /**\n * Emitted when the nav item closes it's secondary navigation.\n */\n @Event() nanoClose!: EventEmitter<NavItemEventDetail>;\n\n /**\n * Emitted when the nav item opens it's secondary navigation.\n */\n @Event() nanoOpen!: EventEmitter<NavItemEventDetail>;\n\n /**\n * Emitted when the nav item is about to open it's secondary navigation.\n */\n @Event() nanoOpening!: EventEmitter<NavItemEventDetail>;\n\n /**\n * Emitted when the nav item is about to close it's secondary navigation.\n */\n @Event() nanoClosing!: EventEmitter<NavItemEventDetail>;\n\n /**\n * Emitted when the nav item loses focus.\n */\n @Event() nanoBlur!: EventEmitter<void>;\n\n /**\n * Emitted when the nav item has focus.\n */\n @Event() nanoFocus!: EventEmitter<void>;\n\n /**\n * Sets focus on the first button or anchor present. Use this method instead of the global\n * `element.focus()`.\n */\n @Method()\n async setFocus() {\n if (!this.btn) return;\n this.btn.focus();\n }\n\n /**\n * Public open watcher\n */\n @Watch('open')\n openChange() {\n this.open ? this.openSecondary() : this.closeSecondary();\n }\n\n /**\n * Internal open watcher\n */\n @Watch('didOpen')\n didOpenChange() {\n if (!this.hasSecondarySlot) return;\n\n if (!this.didOpen) {\n /* the secondadry panel is not closing via hover,\n remove blur events, add focus back to originating button */\n if (!this.fromHover) {\n this.btn.removeEventListener('focusout', this.blur);\n this.secondaryDiv.removeEventListener('focusout', this.blur);\n }\n setTimeout(() => {\n if (!this.fromHover && !this.didBlur)\n this.btn.focus({ preventScroll: true });\n this.nanoClose.emit({ secondaryMenu: this.secondaryDiv });\n }, 50);\n } else {\n this.didBlur = false;\n\n /* the secondadry panel is not opening via hover,\n scroll content into view, focus on it and add blur events */\n if (!this.fromHover) {\n const panelio = new (window as any).IntersectionObserver(\n (data: IntersectionObserverEntry[]) => {\n if (data[0].boundingClientRect.top < 0) {\n this.secondaryDiv.scrollIntoView({\n behavior: 'smooth',\n });\n }\n panelio.disconnect();\n },\n { threshold: 1 }\n );\n panelio.observe(this.secondaryDiv);\n this.secondaryDiv.focus({ preventScroll: true });\n\n this.btn.addEventListener('focusout', this.blur);\n this.secondaryDiv.addEventListener('focusout', this.blur);\n window.addEventListener('blur', this.blur);\n\n this.el.tabIndex = -1;\n this.nanoOpen.emit({ secondaryMenu: this.secondaryDiv });\n }\n }\n }\n\n private closeSecondary = async () => {\n this.open = false;\n if (!this.hasSecondarySlot || !this.didOpen) return;\n\n this.nanoClosing.emit({ secondaryMenu: this.secondaryDiv });\n let status = await displayTransition(this.secondaryDiv, 'open', false);\n this.didOpen = status !== 'hidden';\n };\n\n private openSecondary = async () => {\n if (window.innerWidth < this.secondaryActiveWidth) {\n this.secondaryFallback.call(this);\n return;\n }\n this.open = true;\n if (!this.hasSecondarySlot || this.didOpen) return;\n\n this.nanoOpening.emit({ secondaryMenu: this.secondaryDiv });\n let status = await displayTransition(this.secondaryDiv, 'open', true);\n this.didOpen = status === 'shown';\n };\n\n private toggleSecondary = () => {\n if (!this.hasSecondarySlot) return;\n if (this.didOpen) this.closeSecondary();\n else this.openSecondary();\n };\n\n private handleFocus = () => {\n this.hasFocus = true;\n // opens secondary panel when activated via hover\n if (this.href && !this.animating && this.hasSecondarySlot)\n this.openSecondary();\n this.nanoFocus.emit();\n };\n\n private handleHostBlur = () => {\n if (this.animating) return;\n\n // tab index is added to host when secondary panel opens\n // to return focus after secondary panel closes. Remove now if it was added\n this.el.removeAttribute('tabindex');\n this.hasFocus = false;\n this.nanoBlur.emit();\n };\n\n // direct host clicks to internal button\n private handleHostClick = (ev: MouseEvent) => {\n if (!this.hasAnchorEle) return;\n let foundlink = (ev.target as HTMLElement).closest('a, button');\n if (!foundlink) this.btn.click();\n };\n\n // handles secondary menu hover behaviour.\n private handleMouseEnter = async () => {\n if (\n !this.href ||\n this.animating ||\n !this.hasSecondarySlot ||\n (this.globalNavEle && !this.globalNavEle.classList.contains('ready'))\n )\n return;\n\n // if there are sibling secondary panels currently open,\n // we need to wait before opening otherwise we get unwanted overlapping\n let timeToWait = 0;\n if (getSiblings(this.el, '.secondary-open.has-secondary').length)\n timeToWait = 300;\n\n clearTimeout(this.waitHide);\n this.fromHover = true;\n this.animating = true;\n this.waitShow = window.setTimeout(\n async () => await this.openSecondary(),\n timeToWait\n );\n this.animating = false;\n };\n\n // handles secondary menu hover-out behaviour.\n private handleMouseLeave = () => {\n if (!this.href) return;\n clearTimeout(this.waitShow);\n this.fromHover = true;\n this.animating = true;\n\n // prevent closing immediately - makes navigating to items within more forgiving\n this.waitHide = window.setTimeout(\n async () => await this.closeSecondary(),\n 300\n );\n this.animating = false;\n };\n\n private handleClick = () => {\n this.fromHover = false;\n if (this.hasSecondarySlot) this.toggleSecondary();\n else this.el.querySelector<HTMLElement>('*')?.click();\n };\n\n // utility to traverse up, to see if element is nested within current nav-item\n private foundThisNavEle(el: HTMLElement): boolean {\n let found = el.closest('nano-nav-item');\n found = found === el ? el.parentElement.closest('nano-nav-item') : found;\n\n if (!found) return false;\n if (found === this.el) return true;\n return this.foundThisNavEle(found);\n }\n\n private blur = (ev: FocusEvent) => {\n if (!this.didOpen || this.animating) return;\n if (!this.closeOnBlur) return;\n\n // if event is associated with this element don't close\n if (ev && ev.relatedTarget) {\n if (\n ev.relatedTarget === this.el ||\n ev.relatedTarget === this.btn ||\n this.foundThisNavEle(ev.relatedTarget as HTMLElement)\n ) {\n this.secondaryDiv.focus({ preventScroll: true });\n return;\n }\n }\n\n this.btn.removeEventListener('focusout', this.blur);\n this.secondaryDiv.removeEventListener('focusout', this.blur);\n window.removeEventListener('blur', this.blur);\n\n this.didBlur = true;\n\n this.open = false;\n if (!ev.relatedTarget)\n setTimeout(() => {\n this.el.focus({ preventScroll: true });\n }, 50);\n };\n\n componentWillLoad() {\n let secondaryEle = this.el.querySelector('[slot=\"secondary\"]');\n this.hasSecondarySlot = !!secondaryEle;\n\n let link = getDirectChildren(this.el, 'a, button')[0] as\n | HTMLAnchorElement\n | HTMLButtonElement;\n this.hasAnchorEle = !!link;\n\n if (link) {\n this.href = (link as HTMLAnchorElement).href\n ? (link as HTMLAnchorElement).href\n : null;\n this.btn = link;\n if (this.hasSecondarySlot)\n this.btn.addEventListener('click', this.toggleSecondary);\n\n this.btn.addEventListener('focus', this.handleFocus);\n this.btn.addEventListener('blur', this.handleHostBlur);\n }\n }\n\n connectedCallback() {\n this.isInGlobalNav = false;\n this.isInMenuDrawer = false;\n this.globalNavEle = this.el.closest('nano-global-nav');\n\n this.isInMenuDrawer = !!this.el.closest('nano-menu-drawer');\n this.isInMenu = !!this.el.closest('nano-menu');\n this.isInGlobalNav =\n this.el.parentElement === this.globalNavEle ||\n !!this.el.closest('.global-nav');\n }\n\n render() {\n return (\n <Host\n class={{\n 'has-secondary': this.hasSecondarySlot,\n 'secondary-open': this.open,\n selected: this.selected,\n 'has-focus': this.hasFocus,\n disabled: this.disabled,\n 'nano-global-nav': this.isInGlobalNav,\n 'nano-menu-drawer': this.isInMenuDrawer,\n 'nano-menu': this.isInMenu,\n legacy: this.isLegacy,\n }}\n onBlur={this.handleHostBlur}\n dir={(this.el.ownerDocument as Document).dir === 'rtl' ? 'rtl' : null}\n onMouseEnter={this.handleMouseEnter}\n onMouseLeave={this.handleMouseLeave}\n onClick={this.handleHostClick}\n role=\"menuitem\"\n >\n <div\n class={{\n 'nav-item': true,\n 'secondary-open': this.open,\n selected: this.selected,\n }}\n >\n {this.href && !this.hasAnchorEle && !this.disabled && (\n <a\n target={this.target}\n ref={(a) => (this.btn = a)}\n href={this.href}\n onFocus={this.handleFocus}\n >\n <slot name=\"icon-start\" />\n <span class=\"text\">\n <slot />\n </span>\n <slot name=\"icon-end\" />\n </a>\n )}\n {((!this.hasAnchorEle && !this.href) || this.disabled) && (\n <button\n ref={(btn) => (this.btn = btn)}\n onClick={this.handleClick}\n onFocus={this.handleFocus}\n disabled={this.disabled}\n >\n <slot name=\"icon-start\" />\n <span class=\"text\">\n <slot />\n </span>\n <slot name=\"icon-end\" />\n </button>\n )}\n {this.hasAnchorEle && !this.disabled && (\n <div class=\"link\">\n <slot name=\"icon-start\" />\n <slot />\n <slot name=\"icon-end\" />\n </div>\n )}\n {this.hasSecondarySlot && !this.disabled && (\n <div\n class=\"secondary-menu\"\n ref={(div) => (this.secondaryDiv = div)}\n tabindex=\"-1\"\n >\n <div class=\"secondary-menu-content\">\n <slot name=\"secondary\" />\n </div>\n <div\n class=\"secondary-menu-mask\"\n onClick={this.closeSecondary}\n ></div>\n </div>\n )}\n </div>\n </Host>\n );\n }\n}\n","@import '../../global/style/utilities/globals';\n@import '../../global/style/nano-theme/form';\n@import '../../global/style/nano-theme/layers';\n@import '../form-control/form-control';\n@import '../form-control/form-control-vars';\n\n:host {\n @include formControlVars;\n\n position: relative;\n width: 100%;\n padding: 0 !important;\n font-family: $font-family-base;\n display: inline-block;\n}\n\n:host(.nano-color) {\n --input-border-style--focus: #{$input-border-style} var(--nano-color-tint, #{nano-color(primary, tint)});\n --multi-input-value-bg: var(--nano-color-tint-rgb);\n --multi-input-value-border: var(--nano-color-shade);\n --multi-input-value-text-color: var(--nano-color-contrast);\n\n color: current-color(base);\n}\n\n:host-context(nano-item:not(.item-label)) {\n --padding-start: 0;\n}\n\n:host([disabled]:not([disabled='false'])) {\n opacity: 0.7;\n\n * {\n pointer-events: none !important;\n }\n}\n\nselect {\n display: none;\n}\n\n.native-input {\n @include border-radius(var(--input-border-radius));\n @include padding(0, var(--padding-end), 0, var(--padding-start));\n @include text-inherit();\n\n text-overflow: ellipsis;\n color: var(--input-text-color);\n display: inline-block;\n flex: 1;\n width: 100%;\n max-width: 100%;\n max-height: 100%;\n border: 0;\n outline: none;\n background: transparent;\n appearance: none;\n line-height: 2.5em;\n min-height: 2.5em;\n margin: 0;\n box-sizing: border-box;\n resize: none;\n overflow: hidden;\n cursor: default;\n\n &::selection {\n background: transparent;\n }\n\n &::-moz-selection {\n background: transparent;\n }\n\n &[disabled] {\n opacity: 0.4;\n }\n\n &::placeholder {\n color: var(--placeholder-color);\n font-family: inherit;\n font-style: var(--placeholder-font-style);\n font-weight: var(--placeholder-font-weight);\n opacity: var(--placeholder-opacity);\n line-height: 2.5em;\n min-height: 2.5em;\n // text-overflow: ellipsis;\n }\n\n &::-moz-placeholder {\n line-height: 2.8em;\n text-overflow: ellipsis;\n }\n\n &:-webkit-autofill {\n background-color: transparent;\n }\n\n &::-webkit-search-decoration,\n &::-webkit-search-cancel-button,\n &::-webkit-search-results-button,\n &::-webkit-search-results-decoration {\n appearance: none;\n }\n\n &:invalid {\n box-shadow: none;\n }\n\n &::-ms-clear,\n &::-ms-reveal {\n display: none;\n }\n\n &.resizable {\n resize: vertical;\n overflow: auto;\n }\n\n .textarea & {\n line-height: 1.5em;\n padding-top: var(--padding-top);\n padding-bottom: var(--padding-bottom);\n white-space: pre-wrap;\n\n &::placeholder {\n line-height: 1.5em;\n }\n }\n\n .has-float-label & {\n padding-top: 1.4em;\n }\n\n .has-float-label.textarea & {\n padding-top: 1.8em;\n }\n\n .legacy & {\n box-sizing: content-box;\n }\n\n :host(.masked) & {\n opacity: 0;\n position: absolute;\n left: 0;\n top: 0;\n }\n}\n\n.select-mask {\n @include border-radius(var(--input-border-radius));\n @include padding(0, var(--padding-end), 0, var(--padding-start));\n @include text-inherit();\n\n pointer-events: none;\n line-height: 2.5em;\n min-height: 2.5em;\n}\n\n// multi stuff\n\n.multi {\n &-wrap {\n @include padding(\n 0,\n 0,\n calc(var(--padding-bottom) / 2),\n 0\n );\n\n display: flex;\n flex: 1;\n flex-wrap: wrap;\n max-width: 100%;\n\n :host(.has-float-label) & {\n padding-top: 1.3em;\n }\n }\n\n &-input {\n @include text-inherit();\n @include padding(\n calc(var(--padding-top) / 2),\n var(--padding-end),\n 0,\n var(--padding-start)\n );\n\n min-width: 50px;\n max-width: 100%;\n max-height: 100%;\n appearance: none;\n border: 0;\n outline: none;\n display: inline-block;\n background: transparent;\n flex: 0;\n position: relative;\n min-height: calc(2.78em - var(--padding-top));\n box-sizing: border-box;\n\n :host(.legacy) & {\n box-sizing: content-box;\n }\n\n &:last-child {\n flex: 1;\n }\n }\n\n &-value {\n @include margin(4px, 0, 0, 4px);\n\n background: rgba(var(--multi-input-value-bg), 0.8);\n color: var(--multi-input-value-text-color);\n border: 1px solid;\n border-color: var(--multi-input-value-border);\n padding: 0.3em 0.5em;\n border-radius: 3px;\n line-height: 1;\n max-width: 100%;\n display: flex;\n align-items: center;\n font-size: var(--input-font-size);\n font-weight: 600;\n letter-spacing: 1px;\n\n span {\n text-overflow: ellipsis;\n white-space: nowrap;\n max-width: 100%;\n overflow: hidden;\n line-height: 1.4;\n }\n }\n\n &-value-remove {\n @include margin(0);\n @include background-position(center);\n @include padding(0, 0, 0, 0.5em);\n\n color: inherit;\n border: 0;\n outline: none;\n background-color: transparent;\n background-repeat: no-repeat;\n appearance: none;\n display: flex;\n align-items: center;\n top: 0;\n font-size: 1em;\n\n nano-icon {\n --color: var(--multi-input-value-text-color);\n }\n }\n}\n\n.placeholder-as-label {\n :host(.has-focus.has-multiple) & {\n transform: translateY(-120%);\n font-size: 0.9em;\n }\n}\n\n:host(.has-focus) select,\n:host(.has-focus) a,\n:host(.has-focus) button {\n pointer-events: auto;\n}\n","import {\n Build,\n Component,\n ComponentInterface,\n Element,\n Event,\n EventEmitter,\n Host,\n Method,\n Prop,\n State,\n Watch,\n h,\n VNode,\n Listen,\n} from '@stencil/core';\n\nimport {\n Color,\n SelectChangeEventDetail,\n InputChangeEventDetail,\n ControlValidityEventDetail,\n ControlValidity,\n} from '../../interface';\nimport {\n debounceEvent,\n createColorClasses,\n closestElement,\n raf,\n getActiveElement,\n} from '../../utils';\nimport type { Dropdown } from '../dropdown/dropdown';\nimport { FormControl, FormControlWrap } from '../form-control/form-control';\nimport { OptionInterface } from '../option/option-interface';\n\nlet selectIds = 0;\n\n/**\n * The select component is a wrapper to the HTML select element with custom styling and additional functionality.\n * It accepts most of the same properties as the HTML [select](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/select).\n * It's multi selection functionality is vastly improved from the native solution. It allows for the control of\n * value order through drag and drop or changing the insertion point with arrow keys. It also can allow for user defined values.\n *\n * @slot start - suitable for inline action buttons or icons that may add extra contextual information\n * @slot end - suitable for inline action buttons or icons that may add extra contextual information\n * @slot value-start - similar to 'start', however clicking elements using this slot will activate the input control. This would be suitable to show a secodary 'value' for context or to show a dropdown arrow if using a datalist\n * @slot value-end - similar to 'end', however clicking elements using this slot will activate the input control. This would be suitable to show a secodary 'value' for context or to show a dropdown arrow if using a datalist\n * @slot label - if you do not set a label attribute, you can use this slot for more complex markup\n * @slot helper - helper text to accompany the form field underneath.\n * @slot down-arrow - use this to replace the default down arrow\n * @slot - default slot; nest `nano-option` elements\n */\n@Component({\n tag: 'nano-select',\n styleUrl: 'select.scss',\n scoped: true,\n})\nexport class Select implements ComponentInterface {\n private nativeSelect?: HTMLSelectElement;\n private inputCtrl?: HTMLInputElement;\n private valueItems: Array<HTMLSpanElement> = [];\n private dragVal: string;\n private mo?: MutationObserver;\n private selectId = `nano-select-${selectIds++}`;\n private rtl: boolean = false;\n private onInit: boolean = true;\n private isLegacy: boolean = 'registerElement' in document;\n\n // we don't want these rendered eles decorated with @State\n // because that will cause re-renders. User get/set to set datalist options\n private _selectWrap: HTMLElement;\n private get selectWrap() {\n return this._selectWrap;\n }\n private set selectWrap(ele: HTMLElement) {\n if (this._selectWrap === ele) return;\n this._selectWrap = ele;\n this.setDataListOpts();\n }\n\n private _datalist: HTMLNanoDatalistElement;\n private get datalist() {\n return this._datalist;\n }\n private set datalist(ele: HTMLNanoDatalistElement) {\n if (this._datalist === ele) return;\n this._datalist = ele;\n this.setDataListOpts();\n }\n\n @State() currInsertIndex: number = -1;\n @State() showErrorMsg = false;\n @State() errorMessage: string = '';\n @State() hasFocus = false;\n @State() hasLabelSlot: boolean = false;\n @State() hasHelperSlot: boolean = false;\n @State() inputSearchVal: string = '';\n\n @Element() el!: HTMLNanoSelectElement;\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.\n */\n @Prop({ reflect: true })\n get invalid() {\n return this._invalid;\n }\n private _invalid = false;\n\n /**\n * The color to use from your application's color palette.\n * Default options are: `\"primary\"`, `\"secondary\"`, `\"tertiary\"`, `\"success\"`, `\"warning\"`, `\"danger\"`, `\"light\"`, `\"medium\"`, and `\"dark\"`.\n */\n @Prop() color?: Color;\n\n /**\n * This Boolean attribute lets you specify that a form control should have select focus when the page loads.\n */\n @Prop() autofocus = false;\n\n /**\n * If `true`, the user cannot interact with the select.\n */\n @Prop({ reflect: true }) disabled = false;\n\n /**\n * When should the field perform validation\n */\n @Prop({ mutable: true }) validateOn?: 'dirty' | 'submit' | 'submitThenDirty' =\n 'submit';\n\n /**\n * Whether to show validation errors underneath input\n */\n @Prop({ reflect: true }) showInlineError = true;\n\n /**\n * String to place within a label element. Alternatively use the 'label' slot\n */\n @Prop() label!: string;\n\n /**\n * Visually hide the label - but make it accessible.\n */\n @Prop() hideLabel?: boolean = false;\n\n /**\n * Enable floating label behaviour. Will disable placeholder if set.\n */\n @Prop() floatLabel: boolean = false;\n\n /**\n * If `true`, the user can enter more than one value. This attribute applies when the type attribute is set to `\"email\"` or `\"file\"`, otherwise it is ignored.\n */\n @Prop() multiple?: boolean = false;\n\n /**\n * The name of the control, which is submitted with the form data.\n */\n @Prop() name: string = this.selectId + '-name';\n\n /**\n * Instructional text that shows before the select has a value. Text set here will be placed inside the label when a value is set. If you don't want this behaviour just set the first option to have no value.\n */\n @Prop() placeholder?: string | null;\n\n /**\n * If `true`, the user cannot modify the value.\n */\n @Prop({ reflect: true }) readonly = false;\n\n /**\n * If `true`, the user must fill in a value before submitting a form.\n */\n @Prop() required = false;\n\n /**\n * The initial size of the control.\n */\n @Prop() size?: number;\n\n /**\n * Maximum number of options that can be selected when multiple is true\n */\n @Prop() max?: number;\n\n /**\n * Minimum number of options that can be selected when multiple is true\n */\n @Prop() min?: number;\n\n /**\n * The form element to associate the select with (its form owner). Must be the id of a form.\n */\n @Prop() form?: string | null;\n\n /**\n * in multiple mode, allow users to enter their own values\n */\n @Prop() allowCustomValues: boolean = false;\n\n /**\n * The value of the select.\n */\n @Prop()\n get value() {\n return this._value;\n }\n set value(val: string | string[]) {\n if (typeof val === 'string') {\n if (this.multiple) this._value = val.split(',');\n else this._value = val;\n } else if (Array.isArray(val)) {\n if (this.multiple) this._value = val;\n else this._value = val[0];\n }\n }\n private _value: Array<string> | string = this.multiple ? [] : '';\n\n /**\n * You can set options via js as an array of strings: `domElement.options = ['option 1', 'option 2']` or\n * objects `domElement.options = [{label: 'option 1', value: 'opt-1'}]`. See `nano-option` docs for all available properties.\n * Alternatively, you can nest `<nano-option>` elements within a `<nano-select>`\n * Regardless - reading `options` will return the current component options - slotted or otherwise\n */\n @Prop()\n get options(): Array<OptionInterface | string> {\n if (this._options.length) return this._options;\n\n if (!this.datalist || !this.datalist.activeOptions) return [];\n\n return this._eOptions.map((ao) => {\n const { value, selected, label, filterMeta } = ao;\n return { value, selected, label, filterMeta };\n });\n }\n set options(opts: Array<OptionInterface | string>) {\n this._options = opts.map((opt) => {\n if (typeof opt === 'string') return { value: opt, label: opt };\n else return opt;\n });\n }\n private _options: OptionInterface[] = [];\n @State() _eOptions: OptionInterface[] = [];\n\n /**\n * If `true`, a clear icon will appear in the select when there is a value. Clicking it clears the select.\n */\n @Prop() clearSelect = false;\n\n /**\n * Hide the native select element and cover with a value 'mask'.\n * Enables a fluid nano-select width upon value change (if required). Doesn't work with multiple=\"true\".\n */\n @Prop() mask = false;\n\n /**\n * Set the amount of time, in milliseconds, to wait to trigger the `nanoSearchChange` event after each keystroke.\n */\n @Prop() debounce = 0;\n\n @Watch('debounce')\n protected debounceChanged() {\n this.nanoSearchChange = debounceEvent(this.nanoSearchChange, this.debounce);\n }\n\n @Watch('required')\n @Watch('disabled')\n @Watch('min')\n @Watch('max')\n @Watch('validateOn')\n @Watch('readonly')\n protected shouldValidate() {\n if (this.onInit) return;\n if (this.invalid) this.showErrorMsg = this._invalid = false;\n\n this.customValidate();\n if (this.validateOn !== 'dirty') return;\n this.showInlineValidation();\n }\n\n /**\n * Update the native select element when the value changes\n */\n // eslint-disable-next-line @stencil/no-unused-watch\n @Watch('value')\n valueChanged() {\n if (this.onInit) {\n if (this.multiple) this.currInsertIndex = this.value.length - 1;\n return;\n }\n setTimeout((_) => this.shouldValidate(), 20);\n this.nanoChange.emit({ value: this.value });\n }\n\n /** nano-dropdown config options you can pass to the nested dropdown component */\n @Prop({ mutable: true }) dropDownConfig?: Partial<Dropdown> = {};\n\n @Watch('dropDownConfig')\n setDataListOpts() {\n if (!this.datalist || !this.selectWrap) return;\n const currDWConfig = this.datalist.dropDownConfig || {};\n this.datalist.dropDownConfig = {\n ...currDWConfig,\n ...this.dropDownConfig,\n tetherTo: this.selectWrap,\n };\n this.datalist.input = this.inputCtrl;\n }\n\n // Custom Events\n\n /**\n * Emitted when the value has changed.\n */\n @Event() nanoChange!: EventEmitter<SelectChangeEventDetail>;\n\n /**\n * Emitted when the select loses focus.\n */\n @Event() nanoBlur!: EventEmitter<void>;\n\n /**\n * Emitted when the select has focus.\n */\n @Event() nanoFocus!: EventEmitter<void>;\n\n /**\n * Emitted when the select has been created.\n * @internal\n */\n @Event() nanoDidLoad!: EventEmitter<void>;\n\n /**\n * Emitted when the select has been removed.\n * @internal\n */\n @Event() nanoDidUnload!: EventEmitter<void>;\n\n /**\n * Emitted when a keyboard input occurred on a multiple=\"true\" input\n */\n @Event() nanoSearchChange!: EventEmitter<InputChangeEventDetail>;\n\n /**\n * Called when validation is performed (which depends on `validateOn`).\n * @returns event.detail: `{ isValid: boolean, errorMessage: string, originalEvent: Event }`.\n */\n @Event() nanoValidate: EventEmitter<ControlValidityEventDetail>;\n\n // Public Methods\n\n /**\n * Get the current state of the control.\n * @param validateFirst - perform validation first before reporting\n * @returns `{ isValid: boolean, errorMessage: string }`\n */\n @Method()\n async reportValidity(validateFirst: boolean): Promise<ControlValidity> {\n if (validateFirst) this.showInlineValidation();\n return {\n isValid: !this.invalid,\n errorMessage: this.errorMessage,\n };\n }\n\n /**\n * Sets focus on the specified `nano-select`. Use this method instead of the global\n * `select.focus()`.\n */\n @Method()\n async setFocus() {\n this.inputCtrl.focus();\n setTimeout(() => this.inputCtrl.click(), 50);\n }\n\n /**\n * Returns the native `<select>` element used under the hood.\n */\n @Method()\n getSelectElement(): Promise<HTMLSelectElement> {\n return Promise.resolve(this.nativeSelect!);\n }\n\n /**\n * Invalidate the field and show a custom error message.\n * To clear the error you will need to re-call this method with an empty string.\n */\n @Method()\n async showError(message: string) {\n if (this.nativeSelect) {\n this.nativeSelect.setCustomValidity(message);\n this.showInlineValidation();\n }\n }\n\n /* Logic */\n\n private get valArray() {\n return typeof this.value === 'string'\n ? this.value.length\n ? [this.value]\n : []\n : this.value;\n }\n\n private isValidValues() {\n return this.valArray.find((val) =>\n (this.options as OptionInterface[]).find((opt) => opt.value === val)\n );\n }\n\n private customValidate = () => {\n this.nativeSelect.setCustomValidity('');\n\n // add custom validations 'cos html5 validations are a bit rubbish on selects\n if (this.required && !this.valArray.length) {\n this.nativeSelect.setCustomValidity('Please fill in this field.');\n return true;\n }\n if (\n this.valArray.length &&\n !this.allowCustomValues &&\n !this.isValidValues()\n ) {\n this.nativeSelect.setCustomValidity(\n 'Please choose an item from this field.'\n );\n return true;\n }\n if (this.max && this.valArray.length > this.max) {\n this.nativeSelect.setCustomValidity(\n `Only up to ${this.max} values are allowed.`\n );\n return true;\n }\n if (this.min && this.valArray.length < this.min) {\n this.nativeSelect.setCustomValidity(\n `You must select a minimum of ${this.min} values.`\n );\n return true;\n }\n return false;\n };\n\n private showInlineValidation = (ev?: Event) => {\n if (this.validateOn === 'submitThenDirty') this.validateOn = 'dirty';\n\n this._invalid = false;\n this.showErrorMsg = false;\n this.errorMessage = '';\n\n if (!this.nativeSelect.validity.valid) {\n this.errorMessage = this.nativeSelect.validationMessage;\n this._invalid = true;\n this.showErrorMsg = true;\n }\n this.nanoValidate.emit({\n isValid: !this.invalid,\n errorMessage: this.errorMessage,\n originalEvent: ev,\n });\n };\n\n private handleInvalid = (ev: Event) => {\n this._invalid = true;\n\n if (this.validateOn === 'submit')\n this._invalid = this.showErrorMsg = this.customValidate();\n if (this.showInlineError) ev.preventDefault();\n\n setTimeout((_) => this.showInlineValidation(ev), 20);\n };\n\n private setValue = (e: CustomEvent<HTMLNanoOptionElement>) => {\n e.preventDefault();\n\n if (!this.multiple) {\n this.value = e.detail.value;\n this.selectWrap.clientWidth; // force reflow\n this.inputCtrl.focus();\n return;\n }\n if (this.value && this.value.length && this.value.includes(e.detail.value))\n return;\n if (this.max && this.value.length === this.max) return;\n\n this.currInsertIndex++;\n this.value = [\n ...this.value.slice(0, this.currInsertIndex),\n e.detail.value,\n ...this.value.slice(this.currInsertIndex),\n ];\n this.inputSearchVal = '';\n // this.selectWrap.clientWidth; // force reflow\n };\n\n private removeValue = (toFind?: string) => {\n if (!this.multiple || !this.value.length) return;\n\n if (!toFind) toFind = this.value[this.value.length - 1];\n this.value = (this.value as Array<string>).filter((val) => val !== toFind);\n\n this.currInsertIndex--;\n // this.selectWrap.clientWidth; // force reflow\n this.setFocus();\n };\n\n private slotChangeObserver() {\n const mo = (this.mo = new MutationObserver(() =>\n this.processSlottedContent()\n ));\n mo.observe(this.el, { childList: true, subtree: true });\n }\n\n private processSlottedContent() {\n // see if we have label / helper content\n this.hasLabelSlot = !!this.el.querySelectorAll('[slot=\"label\"]').length;\n this.hasHelperSlot = !!this.el.querySelector('[slot=\"helper\"]');\n\n // breaking change introduced in v2. Rm in v3\n if (\n !!this.el.querySelector('select:not([class*=\"sc-nano-select\"]) option')\n ) {\n console.warn(\n 'nesting `<option>` elements was removed in v2. Please update your code to use `<nano-option>` elements instead.',\n this.el\n );\n }\n\n // breaking change introduced in v2. Rm in v3\n if (!!this.el.querySelector('[slot=\"legacy\"]')) {\n console.warn(\n 'The `legacy` slot has been removed. Please update your code',\n this.el\n );\n }\n }\n\n private getLabel(toFind: string) {\n let label = (this.options as OptionInterface[]).find((opt) => {\n return !opt.disabled && opt.value?.length && opt.value === toFind;\n });\n return label && label.label ? label.label : toFind;\n }\n\n /* Event handling */\n\n @Listen('mousedown', { target: 'body' })\n @Listen('keydown')\n handleBlur(e: KeyboardEvent | MouseEvent) {\n if (!this.hasFocus) return;\n\n const kev = e as KeyboardEvent;\n let target: Element;\n\n raf(() => {\n if (kev.key) {\n if (kev.key !== 'Tab') return;\n target = getActiveElement();\n } else target = e.target as Element;\n\n if (closestElement(this.el.tagName.toLowerCase(), target) !== this.el) {\n this.onBlur();\n }\n });\n }\n\n private setOptions = () => {\n if (\n !this.datalist ||\n !this.datalist.activeOptions ||\n !this.datalist.activeOptions.length\n )\n return;\n\n this._eOptions = this.datalist.activeOptions.map((ao) => {\n const { value, selected, label, filterMeta } = ao;\n return { value, selected, label, filterMeta };\n });\n };\n\n private handleDocumentKeyDown = (ev: KeyboardEvent) => {\n if (!this.multiple || !this.hasFocus) return;\n\n if (!this.inputSearchVal) {\n let rm: HTMLSpanElement;\n\n switch (ev.key) {\n case 'Backspace':\n if (this.inputCtrl.previousElementSibling)\n rm = this.inputCtrl.previousElementSibling as HTMLSpanElement;\n else break;\n\n this.removeValue(rm.dataset.value || null);\n break;\n\n case 'Delete':\n if (this.inputCtrl.nextElementSibling)\n rm = this.inputCtrl.nextElementSibling as HTMLSpanElement;\n else break;\n\n this.removeValue(rm.dataset.value || null);\n break;\n\n case 'ArrowLeft':\n case 'ArrowRight':\n if (!this.value.length) break;\n\n if (ev.key === 'ArrowLeft' && this.inputCtrl.previousSibling)\n this.currInsertIndex--;\n if (ev.key === 'ArrowRight' && this.inputCtrl.nextSibling)\n this.currInsertIndex++;\n\n setTimeout(() => {\n this.inputCtrl.focus();\n }, 20);\n ev.preventDefault();\n break;\n }\n }\n };\n\n private onBlur = () => {\n this.hasFocus = false;\n\n setTimeout(() => {\n if (this.validateOn === 'dirty' && !this.hasFocus)\n this.showInlineValidation();\n }, 20);\n this.nanoBlur.emit();\n\n if (!this.allowCustomValues && this.multiple) {\n this.inputSearchVal = '';\n const event = new window.Event('change');\n this.inputCtrl.dispatchEvent(event);\n }\n };\n\n private onFocus = () => {\n this.hasFocus = true;\n this.nanoFocus.emit();\n };\n\n private clearSelectValue = (ev?: Event) => {\n if (this.clearSelect && !this.readonly && !this.disabled && ev) {\n ev.preventDefault();\n ev.stopPropagation();\n }\n\n if (this.multiple) {\n this.value = [];\n this.currInsertIndex = -1;\n } else this.value = '';\n\n this.inputCtrl.value = '';\n const event = new window.Event('change');\n this.inputCtrl.dispatchEvent(event);\n };\n\n private onClick = () => {\n this.setFocus();\n };\n\n /* Multi event handlers */\n\n private onDragStart = (ev: MouseEvent) => {\n let ele = ev.target as HTMLSpanElement;\n this.dragVal = ele.dataset.value;\n };\n\n private onDragEnd = (ev) => {\n this.dragVal = null;\n ev.preventDefault();\n };\n\n private onDragLeave = (ev: MouseEvent) => {\n let ele = ev.target as HTMLSpanElement;\n let spanVal: string =\n ele.dataset && ele.dataset.value ? ele.dataset.value : null;\n\n if (\n !spanVal ||\n this.dragVal === spanVal ||\n !this.value.includes(this.dragVal)\n ) {\n ev.preventDefault();\n return;\n }\n\n let to = this.value.indexOf(spanVal);\n let from = this.value.indexOf(this.dragVal);\n let tmpArr = this.value as Array<string>;\n let tmpVal = tmpArr[to];\n\n tmpArr[to] = tmpArr[from];\n tmpArr[from] = tmpVal;\n this.value = [...tmpArr];\n };\n\n private onMultiInput = (ev) => {\n this.inputSearchVal = ev.target.value.trim();\n this.nanoSearchChange.emit({ value: ev.target.value.trim() });\n };\n\n /* Stencil Component lifecycle hooks */\n\n connectedCallback() {\n this.debounceChanged();\n\n if (!Build.isBrowser) return;\n\n this.el.dispatchEvent(\n new CustomEvent('nanoDidLoad', {\n detail: this.el,\n })\n );\n }\n\n disconnectedCallback() {\n document.dispatchEvent(\n new CustomEvent('nanoDidUnload', {\n detail: this.el,\n })\n );\n\n if (!Build.isBrowser) return;\n if (this.mo) this.mo.disconnect();\n }\n\n componentDidLoad() {\n this.slotChangeObserver();\n this.customValidate();\n this.setDataListOpts();\n raf(() => (this.onInit = false));\n }\n\n componentWillLoad() {\n this.processSlottedContent();\n }\n\n render() {\n const labelId = this.selectId + '-lbl';\n const moreId =\n this.showInlineError || this.hasHelperSlot\n ? this.selectId + '-moreId'\n : '';\n\n this.rtl = (this.el.ownerDocument as Document).dir === 'rtl';\n this.valueItems = [];\n\n const compWrapOptions = (({\n el,\n floatLabel,\n label,\n errorMessage,\n showInlineError,\n hasHelperSlot,\n hasLabelSlot,\n hideLabel,\n placeholder,\n rtl,\n }) => ({\n el,\n floatLabel,\n label,\n errorMessage,\n showInlineError,\n hasHelperSlot,\n hasLabelSlot,\n hideLabel,\n placeholder,\n rtl,\n }))(this);\n const wrapOptions = {\n ...compWrapOptions,\n labelId,\n moreId,\n hasValue: !!this.value.length || !!this.inputSearchVal.length,\n controlId: this.selectId,\n };\n\n const controlOptions = (({ readonly, disabled }) => ({\n readonly,\n disabled,\n clearControl: this.clearSelect,\n }))(this);\n\n return (\n <Host\n type={this.multiple ? 'select-multiple' : 'select-one'}\n aria-disabled={this.disabled ? 'true' : null}\n class={{\n ...createColorClasses(this.color),\n 'has-value': !!this.value.length || !!this.inputSearchVal.length,\n 'has-focus': this.hasFocus,\n 'is-invalid': this.invalid,\n 'has-label': this.label !== null && !this.floatLabel,\n 'has-float-label': this.label !== null && this.floatLabel,\n rtl: this.rtl,\n 'has-multiple': this.multiple,\n 'has-clr-btn': this.clearSelect,\n masked: this.mask,\n legacy: this.isLegacy,\n }}\n >\n <FormControlWrap {...wrapOptions}>\n <FormControl\n {...controlOptions}\n onClearText={this.clearSelectValue}\n control={this.el}\n ref={(el) => (this.selectWrap = el)}\n endValueSlot={\n <slot name=\"down-arrow\">\n <nano-icon slot=\"value-end\" name=\"light/chevron-down\" />\n </slot>\n }\n >\n {this.multiple && (\n <div class=\"multi-wrap\">\n {this.multipleValues(labelId, moreId)}\n </div>\n )}\n {!this.multiple && [\n this.mask && (\n <div class=\"select-mask\">\n {this.getLabel(this.value as string)}\n </div>\n ),\n <input\n id={this.selectId}\n class=\"native-input\"\n ref={(input) => (this.inputCtrl = input)}\n aria-labelledby={labelId + ' ' + moreId}\n disabled={this.disabled}\n form={this.form}\n placeholder={\n !this.floatLabel && this.placeholder ? this.placeholder : ''\n }\n readOnly={true}\n required={this.required}\n value={this.getLabel(this.value as string)}\n onFocus={this.onFocus}\n />,\n ]}\n </FormControl>\n </FormControlWrap>\n {!this.readonly && !this.disabled && (\n <nano-datalist\n onNanoOptionsUpdated={this.setOptions}\n ref={(el) => (this.datalist = el)}\n selected={this.valArray}\n type={this.multiple ? 'selctMulti' : 'select'}\n onNanoSelect={this.setValue}\n onNanoDeselect={(e) => {\n e.preventDefault();\n this.removeValue(e.detail.value);\n }}\n options={this._options.length ? this._options : undefined}\n >\n {this.allowCustomValues && this.multiple && !!this.inputSearchVal && (\n <nano-option\n slot=\"list-top\"\n value={this.inputSearchVal}\n selected={false}\n label={this.inputSearchVal}\n onNanoSelect={() => this.inputCtrl.focus()}\n >\n <span slot=\"check-icon\"></span>\n Add '{this.inputSearchVal}'\n </nano-option>\n )}\n <slot />\n </nano-datalist>\n )}\n\n <select\n id={this.selectId + '-hidden'}\n class=\"native-select\"\n ref={(select) => (this.nativeSelect = select)}\n aria-labelledby={labelId + ' ' + moreId}\n disabled={this.disabled}\n form={this.form}\n multiple={this.multiple}\n name={this.name}\n required={this.required}\n onInvalid={this.handleInvalid}\n >\n {this.allowCustomValues &&\n this.valArray.map((val) => {\n return (\n <option value={val} selected={true}>\n {val}\n </option>\n );\n })}\n {!this.allowCustomValues &&\n this.options.map((opt: OptionInterface) => {\n return (\n <option\n value={opt.value}\n selected={this.valArray.includes(opt.value)}\n disabled={opt.disabled}\n label={opt.label}\n >\n {this.valArray.includes(opt.value)}\n </option>\n );\n })}\n </select>\n </Host>\n );\n }\n\n private multipleValues(\n labelId: string,\n moreId: string\n ): VNode | (VNode | VNode[])[] {\n let input: VNode = (\n <input\n class=\"multi-input\"\n id={this.selectId}\n ref={(input) => (this.inputCtrl = input)}\n readOnly={this.readonly}\n disabled={this.disabled}\n autoFocus={this.autofocus}\n autocomplete=\"off\"\n onKeyDown={this.handleDocumentKeyDown}\n onInput={this.onMultiInput}\n value={this.inputSearchVal}\n onTouchStart={this.onClick}\n onMouseDown={this.onClick}\n onFocus={this.onFocus}\n placeholder={\n this.placeholder && !this.floatLabel && !this.value.length\n ? this.placeholder\n : ''\n }\n aria-labelledby={labelId + ' ' + moreId}\n />\n );\n if (!this.value.length) return input;\n\n return (this.value as Array<string>).map((val, i) => {\n let toReturn: VNode | VNode[] = (\n <span\n onDragStart={this.onDragStart}\n onDragLeave={this.onDragLeave}\n onDragEnd={this.onDragEnd}\n onDragOver={(e) => e.preventDefault()}\n draggable\n data-value={val}\n ref={(span) => this.valueItems.push(span)}\n class=\"multi-value\"\n >\n <span>{this.getLabel(val)}</span>\n <button\n class=\"multi-value-remove\"\n type=\"button\"\n tabindex=\"-1\"\n onTouchEnd={() => {\n this.removeValue(val);\n }}\n onMouseUp={() => {\n this.removeValue(val);\n }}\n >\n <nano-icon name=\"light/times\"></nano-icon>\n </button>\n </span>\n );\n if (i === 0 && this.currInsertIndex < 0)\n toReturn = [input, toReturn as VNode];\n else if (i === this.currInsertIndex)\n toReturn = [toReturn as VNode, input];\n return toReturn;\n });\n }\n}\n"]}

package/dist/nano-components/{p-18411914.system.js → p-b370e3ef.system.js} RENAMED Viewed

@@ -1,5 +1,5 @@
 /*!
  * Web Components for Nanopore digital Web Apps
  */
-System.register(["./p-4d62ec32.system.js"],(function(t){"use strict";var e;return{setters:[function(t){e=t.a}],execute:function(){t({l:i,s:r,u:l});var o=new Set;function i(t){o.add(t);document.body.classList.add("nano-scroll-lock")}function l(t){o.delete(t);if(o.size===0){document.body.classList.remove("nano-scroll-lock")}}function s(t,e,o){if(o===void 0){o=false}if(!o){try{t.scrollTo({left:e,behavior:"smooth"})}catch(i){t.scrollLeft=e}return}try{t.scrollTo({top:e,behavior:"smooth"})}catch(i){t.scrollTop=e}}function r(t,o,i,l){if(i===void 0){i="vertical"}if(l===void 0){l="start"}var r=e(t,o);var f=r.top+o.scrollTop;var c=r.left+o.scrollLeft;var n=o.scrollLeft;var a=o.scrollLeft+o.offsetWidth;var d=o.scrollTop;var h=o.scrollTop+o.offsetHeight;if(i==="horizontal"||i==="both"){if(l==="start"){if(c<n)s(o,c);else if(c+t.clientWidth>a)s(o,c-o.offsetWidth+t.clientWidth)}else s(o,o.scrollLeft+r.left-o.offsetWidth/2+t.offsetWidth/2)}if(i==="vertical"||i==="both"){if(f<d)s(o,f,true);else if(f+t.clientHeight>h){s(o,f-o.offsetHeight+t.clientHeight,true)}}}}}}));
-//# sourceMappingURL=p-18411914.system.js.map
+System.register(["./p-1d13dbdf.system.js"],(function(t){"use strict";var e;return{setters:[function(t){e=t.a}],execute:function(){t({l:i,s:r,u:l});var o=new Set;function i(t){o.add(t);document.body.classList.add("nano-scroll-lock")}function l(t){o.delete(t);if(o.size===0){document.body.classList.remove("nano-scroll-lock")}}function s(t,e,o){if(o===void 0){o=false}if(!o){try{t.scrollTo({left:e,behavior:"smooth"})}catch(i){t.scrollLeft=e}return}try{t.scrollTo({top:e,behavior:"smooth"})}catch(i){t.scrollTop=e}}function r(t,o,i,l){if(i===void 0){i="vertical"}if(l===void 0){l="start"}var r=e(t,o);var f=r.top+o.scrollTop;var c=r.left+o.scrollLeft;var n=o.scrollLeft;var a=o.scrollLeft+o.offsetWidth;var d=o.scrollTop;var h=o.scrollTop+o.offsetHeight;if(i==="horizontal"||i==="both"){if(l==="start"){if(c<n)s(o,c);else if(c+t.clientWidth>a)s(o,c-o.offsetWidth+t.clientWidth)}else s(o,o.scrollLeft+r.left-o.offsetWidth/2+t.offsetWidth/2)}if(i==="vertical"||i==="both"){if(f<d)s(o,f,true);else if(f+t.clientHeight>h){s(o,f-o.offsetHeight+t.clientHeight,true)}}}}}}));
+//# sourceMappingURL=p-b370e3ef.system.js.map

package/dist/nano-components/{p-18411914.system.js.map → p-b370e3ef.system.js.map} RENAMED Viewed

File without changes

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

@@ -0,0 +1,5 @@
+/*!
+ * Web Components for Nanopore digital Web Apps
+ */
+import{r as t,h as o,e,g as r}from"./p-ab5813a7.js";import{h as i}from"./p-289aa03f.js";const s=":host{-webkit-box-sizing:border-box;box-sizing:border-box}*,*::before,*::after{-webkit-box-sizing:border-box;box-sizing:border-box}[hidden]{display:none !important}:host{display:block;--nano-loader-base:#4a4a4a;--nano-loader-tint:#7d7d7d;--theme-color:#fff;--theme-tint-color:#90c6e7;--scrim-color:0, 0, 0;--scrim-direction:90deg;--scrim-opacity-from:0.25;--scrim-opacity-to:0.7;--padding:0;--quote-size:1.3rem;color:var(--theme-color)}:host(.is-xl){--quote-size:3rem}:host([theme=light]){--nano-loader-base:#fff;--nano-loader-tint:white;--theme-color:#4a4a4a;--scrim-color:255, 255, 255;--scrim-opacity-from:0.25;--scrim-opacity-to:1;--scrim-direction:270deg;color:var(--theme-color)}:host([theme=light]) .hero__primary-content{--color:#4a4a4a}.hero{position:relative}.hero--rtl{--scrim-direction:270deg}.hero--secondary:not(.hero--iconbox){--scrim-direction:0deg}.hero__bg-wrap{overflow:hidden}.hero__bg-slot{position:absolute;top:0;bottom:0;left:0;right:0}.hero__ctas{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:end;-ms-flex-pack:end;justify-content:flex-end;padding:32px 32px 0;margin-bottom:-64px;position:relative;z-index:1}@media (max-width: 52em){.hero__ctas{display:none}}@media (max-width: 58em){.hero__ctas{margin-bottom:-48px}}.hero__ctas ::slotted(a.button[slot=secondary-ctas]),.hero__ctas::slotted(a.button[slot=secondary-ctas]){padding:0.25rem 0.5rem !important;font-size:0.875rem !important;margin:0 0.25rem !important}.hero__img{display:block;--padding:inherit}.hero__breadcrumbs{display:none;margin:20px 14px 0;line-height:14px}.hero--breadcrumb .hero__breadcrumbs{display:block}.is-xl .hero__breadcrumbs{margin:0 50px;max-width:50%}.is-xxl .hero__breadcrumbs{margin:0 83px}.hero__breadcrumbs ::slotted(*[slot=breadcrumb]),.hero__breadcrumbs::slotted(*[slot=breadcrumb]){font-size:0.85rem;text-transform:uppercase;letter-spacing:1.5px;font-weight:600;font-stretch:125%;display:inline-block;margin-bottom:16px;position:relative;z-index:2}.hero--hasbg .hero__breadcrumbs ::slotted(*[slot=breadcrumb]),.hero--hasbg .hero__breadcrumbs::slotted(*[slot=breadcrumb]){text-shadow:1px 1px rgba(0, 0, 0, 0.15)}.hero__breadcrumbs ::slotted(a[slot=breadcrumb]),.hero__breadcrumbs::slotted(a[slot=breadcrumb]){color:var(--theme-tint-color) !important;cursor:pointer}.hero__breadcrumbs ::slotted(.slash[slot=breadcrumb]),.hero__breadcrumbs::slotted(.slash[slot=breadcrumb]){color:var(--theme-color);position:relative;margin:0 0.5rem;display:inline-block}.hero__scrim{position:absolute;left:0;right:0;bottom:0;top:0;z-index:0;background:-webkit-gradient(linear, left top, left bottom, from(var(--scrim-direction)), color-stop(0%, rgba(var(--scrim-color), var(--scrim-opacity-from))), to(rgba(var(--scrim-color), var(--scrim-opacity-to))));background:linear-gradient(var(--scrim-direction), rgba(var(--scrim-color), var(--scrim-opacity-from)) 0%, rgba(var(--scrim-color), var(--scrim-opacity-to)) 100%)}.hero--scrim .hero__scrim{background:none}.hero__content{max-width:1440px;--grid-row-gap:0;margin:0 auto;position:relative}.hero__content.is-xl{margin-top:50px;max-width:1540px}.hero__content.is-xxl{margin-top:83px;max-width:1606px}.hero__primary{margin:16px}.hero--breadcrumb .hero__primary{margin:0 16px}.hero--backbtn .hero__primary{margin-left:0}.hero__primary ::slotted(nano-icon-button[slot=back-btn]),.hero__primary::slotted(nano-icon-button[slot=back-btn]){font-size:2rem}.is-xl .hero__primary{margin:0 0 50px 50px}.is-xl .hero__primary ::slotted(nano-icon-button[slot=back-btn]),.is-xl .hero__primary::slotted(nano-icon-button[slot=back-btn]){margin-left:-3rem;margin-right:0;margin-top:0;margin-bottom:0}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){.is-xl .hero__primary ::slotted(nano-icon-button[slot=back-btn]),.is-xl .hero__primary::slotted(nano-icon-button[slot=back-btn]){margin-left:unset;margin-right:unset;-webkit-margin-start:-3rem;margin-inline-start:-3rem;-webkit-margin-end:0;margin-inline-end:0}}.is-xxl .hero__primary{margin:0 0 83px 83px}.hero__primary-content{max-width:45rem;--color:#fff;display:-webkit-box;display:-ms-flexbox;display:flex}.hero--backbtn .hero__primary-content>div{padding:10px 0 0 0}.hero__primary-content ::slotted(h1[slot=primary-content]),.hero__primary-content::slotted(h1[slot=primary-content]){line-height:26px !important;margin-top:0 !important;margin-bottom:18px !important;font-size:2rem !important}.is-xl .hero__primary-content ::slotted(h1[slot=primary-content]),.is-xl .hero__primary-content::slotted(h1[slot=primary-content]){line-height:31px !important;margin-bottom:30px !important}.is-xl .hero__primary-content ::slotted(.button[slot=primary-content]),.is-xl .hero__primary-content::slotted(.button[slot=primary-content]){margin-top:20px !important}.hero__secondary{display:none;height:100%;padding:0 14px 20px}.hero--secondary .hero__secondary{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.is-xl .hero__secondary{padding:0 50px 50px;-webkit-box-pack:end;-ms-flex-pack:end;justify-content:flex-end}.is-xxl .hero__secondary{padding:0 83px 83px}.hero__icon-box{background:rgba(0, 0, 0, 0.7);padding:24px;width:100%;margin-bottom:auto;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;color:white}.is-xl .hero__icon-box{max-width:410px;-webkit-box-flex:0;-ms-flex:0 1 410px;flex:0 1 410px}.hero__icon-box::slotted([slot=icon-box-item] nano-icon){color:var(--theme-tint-color);--nano-icon-size:32px;--nano-icon-margin-end:20px}.hero__icon-box ::slotted([slot=icon-box-item]){--nano-color-base:var(--theme-tint-color);--nano-icon-size:32px;--nano-icon-margin-end:20px;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;font-size:0.8125rem;margin-bottom:20px}.hero__icon-box ::slotted(.last[slot=icon-box-item]),.hero__icon-box::slotted(.last[slot=icon-box-item]){margin-bottom:0}.hero__quote-content{margin-top:auto;text-align:center;width:100%}.is-xl .hero__quote-content{max-width:500px;-webkit-box-flex:0;-ms-flex:0 1 500px;flex:0 1 500px;text-align:initial}.hero__quote::before,.hero__quote::after{content:'\"';font-size:var(--quote-size);font-weight:700;font-style:italic;line-height:0;color:#abb6b8;display:inline;position:relative}.hero__quote ::slotted([slot=quote]),.hero__quote::slotted([slot=quote]){font-size:var(--quote-size);font-weight:300;font-style:italic;display:inline}.hero__quote-author{text-align:right;text-align:end;font-size:1rem;opacity:0.8}.hero--sub .hero__content.is-xl{margin-top:40px}.hero--sub .hero__content.is-xl .hero__primary{margin:0 0 40px 50px}.hero--sub .hero__content.is-xl .hero__secondary{padding:0 50px 50px 40px}.hero--sub .hero__content.is-xl ::slotted(.button[slot=primary-content]),.hero--sub .hero__content.is-xl::slotted(.button[slot=primary-content]){margin-top:8px !important}.hero--sub .hero__content.is-xl ::slotted(h1[slot=primary-content]),.hero--sub .hero__content.is-xl::slotted(h1[slot=primary-content]){margin-bottom:18px !important}.hero--sub .hero__content.is-xxl .hero__primary{margin:0 0 40px 83px}.hero--sub .hero__content.is-xxl .hero__secondary{padding:0 83px 83px 40px}";let n=class{constructor(e){t(this,e);this.isLegacy=false;this.gridSizes=[];this.imgSrcSet=null;this.largeScreenBP=900;this.theme="dark";this.level="top";this.handleGridChange=t=>{this.gridSizes=t.detail};this.HeroContent=()=>[!this.hasIconBox&&this.hasCtas?o("div",{class:"hero__ctas"},o("slot",{name:"secondary-ctas"})):"",o("div",{class:"hero__scrim"},o("slot",{name:"scrim"})),o("nano-grid",{onNanoBpChange:this.handleGridChange,class:"hero__content",xlCols:2,xlSize:this.largeScreenBP},o("nano-grid-item",{gridStates:"xl-col-span-2"},o("div",{class:"hero__breadcrumbs"},o("slot",{name:"breadcrumb"}))),o("nano-grid-item",{gridStates:this.hasSecondaryContent?"xl-col-span-1 xl-col-start-1 xl-row-start-2":"xl-col-span-2 xl-col-start-1 xl-row-start-2"},o("div",{class:"hero__primary"},o("div",{class:"hero__primary-content"},o("slot",{name:"back-btn"}),o("div",null,o("slot",{name:"primary-content"}))))),this.hasSecondaryContent&&o("nano-grid-item",{gridStates:"xl-col-span-1 xl-col-start-2 xl-row-start-2"},o("div",{class:"hero__secondary"},o("slot",{name:"secondary-content"}),this.hasIconBox&&o("div",{class:"hero__icon-box"},o("slot",{name:"icon-box"}),o("slot",{name:"icon-box-item"})),this.hasQuote&&o("div",{class:"hero__quote-content"},o("span",{class:"hero__quote"},o("slot",{name:"quote"})),o("div",{class:"hero__quote-author"},o("slot",{name:"quote-author"}))))))]}breadCrumbChange(){this.breadCrumbs.filter((t=>t.tagName==="A"&&!t.nextElementSibling.classList.contains("slash"))).forEach((t=>{t.insertAdjacentHTML("afterend",'<span slot="breadcrumb" class="slash">/</span>')}))}iconBoxItemChange(){this.iconBoxItems.forEach((t=>t.classList.remove("last")));if(this.iconBoxItems[this.iconBoxItems.length-1]&&this.iconBoxItems[this.iconBoxItems.length-1].classList)this.iconBoxItems[this.iconBoxItems.length-1].classList.add("last")}slotChangeObserver(){if(this.mo)this.mo.disconnect();const t=this.mo=new MutationObserver((()=>this.processSlottedContent()));t.observe(this.host,{childList:true})}processSlottedContent(){this.hasCtas=!!this.host.querySelector('[slot="secondary-ctas"]');this.iconBoxItems=Array.from(this.host.querySelectorAll('[slot="icon-box-item"]'));this.hasIconBox=!!this.host.querySelector('[slot="icon-box"]')||!!this.iconBoxItems.length;this.hasScrim=!!this.host.querySelector('[slot="scrim"]');this.breadCrumbs=Array.from(this.host.querySelectorAll('[slot="breadcrumb"]'));this.hasSecondaryContent=!!this.host.querySelector('[slot="icon-box"]')||!!this.host.querySelector('[slot="quote"]')||!!this.host.querySelector('[slot="icon-box-item"]')||!!this.host.querySelector('[slot="secondary-content"]');this.hasBg=!!this.host.querySelector('[slot="background"]')||!!this.imgSrc;this.hasBackBtn=!!this.host.querySelector('[slot="back-btn"]');this.hasQuote=!!this.host.querySelector('[slot="quote"]')}connectedCallback(){this.isLegacy=!i(this.host)}disconnectedCallback(){if(this.mo)this.mo.disconnect()}componentDidLoad(){this.slotChangeObserver()}componentWillLoad(){this.processSlottedContent()}render(){const t=this.host.dir==="rtl"||this.host.ownerDocument.dir==="rtl";return o(e,{class:{[this.gridSizes.join(" ")]:true}},o("div",{class:{hero:true,"hero--light":this.theme==="light","hero--secondary":this.hasSecondaryContent,"hero--iconbox":this.hasIconBox,"hero--rtl":t,"hero--scrim":this.hasScrim,"hero--legacy":this.isLegacy,"hero--breadcrumb":!!this.breadCrumbs.length,"hero--hasbg":this.hasBg,"hero--backbtn":this.hasBackBtn,"hero--sub":this.level==="sub"}},o("div",{class:"hero__bg-wrap"},!!this.imgSrc&&o("nano-img",{class:"hero__img",lazy:false,background:true,srcSet:this.imgSrcSet,src:this.imgSrc},o(this.HeroContent,null)),!this.imgSrc&&[o("div",{class:"hero__bg-slot"},o("slot",{name:"background"})),o(this.HeroContent,null)])))}get host(){return r(this)}static get watchers(){return{breadCrumbs:["breadCrumbChange"],iconBoxItems:["iconBoxItemChange"]}}};n.style=s;export{n as nano_hero};
+//# sourceMappingURL=p-b59d2bd5.entry.js.map

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

@@ -0,0 +1 @@

+ {"version":3,"sources":["src/components/hero/hero.scss?tag=nano-hero&encapsulation=shadow","src/components/hero/hero.tsx"],"names":["heroCss","Hero","[object Object]","hostRef","this","isLegacy","gridSizes","imgSrcSet","largeScreenBP","theme","level","handleGridChange","e","detail","HeroContent","hasIconBox","hasCtas","h","class","name","onNanoBpChange","xlCols","xlSize","gridStates","hasSecondaryContent","hasQuote","breadCrumbs","filter","crumb","tagName","nextElementSibling","classList","contains","forEach","insertAdjacentHTML","iconBoxItems","item","remove","length","add","mo","disconnect","MutationObserver","processSlottedContent","observe","host","childList","querySelector","Array","from","querySelectorAll","hasScrim","hasBg","imgSrc","hasBackBtn","hasShadowDom","slotChangeObserver","rtl","dir","ownerDocument","Host","join","hero","hero--light","hero--secondary","hero--iconbox","hero--rtl","hero--scrim","hero--legacy","hero--breadcrumb","hero--hasbg","hero--backbtn","hero--sub","lazy","background","srcSet","src"],"mappings":"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","sourcesContent":["@import '../../global/style/utilities/globals';\n@import '../../global/style/nano-theme/colours';\n\n:host {\n /**\n * @prop --nano-loader-base: Base colour of nano-skeleton. Default depends on theme;\n * @prop --nano-loader-tint: Tint colour of nano-skeleton. Default depends on theme;\n * @prop --theme-color: Text color. Default depends on theme;\n * @prop --theme-tint-color: Color used for bread crumbs and icons. Defaults to #{$color-lightblue};\n * @prop --scrim-color: Color of the gradient covering the background. Default depends on theme;\n * @prop --scrim-direction: Direction of the gradient covering the background. Default what content slots are present;\n * @prop --scrim-opacity-from: Starting opactiy of the gradient covering the background. Default .25;\n * @prop --scrim-opacity-to: Final opactiy of the gradient covering the background. Default depends on `theme`;\n * @prop --quote-size: Font size of the quote. Defaults to 1.3em and grows to 3rem on the xl breakpoint;\n */\n\n display: block;\n\n --nano-loader-base: #{$color-black};\n --nano-loader-tint: #{lighten($color-black, 20%)};\n --theme-color: #{$color-white};\n --theme-tint-color: #{$color-lightblue};\n --scrim-color: 0, 0, 0;\n --scrim-direction: 90deg;\n --scrim-opacity-from: 0.25;\n --scrim-opacity-to: 0.7;\n --padding: 0;\n --quote-size: 1.3rem;\n\n color: var(--theme-color);\n}\n\n:host(.is-xl) {\n --quote-size: 3rem;\n}\n\n:host([theme='light']) {\n --nano-loader-base: #{$color-white};\n --nano-loader-tint: #{lighten($color-white, 20%)};\n --theme-color: #{$color-black};\n --scrim-color: 255, 255, 255;\n --scrim-opacity-from: 0.25;\n --scrim-opacity-to: 1;\n --scrim-direction: 270deg;\n\n color: var(--theme-color);\n\n .hero__primary-content {\n --color: #{$color-black};\n }\n}\n\n.hero {\n position: relative;\n\n &--rtl {\n --scrim-direction: 270deg;\n }\n\n &--secondary:not(.hero--iconbox) {\n --scrim-direction: 0deg;\n }\n\n &__bg-wrap {\n overflow: hidden;\n }\n\n &__bg-slot {\n position: absolute;\n top: 0;\n bottom: 0;\n left: 0;\n right: 0;\n }\n\n &__ctas {\n @media (max-width: 52em) {\n display: none;\n }\n\n @media (max-width: 58em) {\n margin-bottom: -48px;\n }\n\n display: flex;\n justify-content: flex-end;\n padding: 32px 32px 0;\n margin-bottom: -64px;\n position: relative;\n z-index: 1;\n\n ::slotted(a.button[slot='secondary-ctas']),\n &::slotted(a.button[slot='secondary-ctas']) {\n padding: 0.25rem 0.5rem !important;\n font-size: 0.875rem !important;\n margin: 0 0.25rem !important;\n }\n }\n\n &__img {\n display: block;\n\n --padding: inherit;\n }\n\n &__breadcrumbs {\n display: none;\n margin: 20px 14px 0;\n line-height: 14px;\n\n .hero--breadcrumb & {\n display: block;\n }\n\n .is-xl & {\n margin: 0 50px;\n max-width: 50%;\n }\n\n .is-xxl & {\n margin: 0 83px;\n }\n\n ::slotted(*[slot='breadcrumb']),\n &::slotted(*[slot='breadcrumb']) {\n font-size: 0.85rem;\n text-transform: uppercase;\n letter-spacing: 1.5px;\n font-weight: 600;\n font-stretch: 125%;\n display: inline-block;\n margin-bottom: 16px;\n position: relative;\n z-index: 2;\n\n .hero--hasbg & {\n text-shadow: 1px 1px rgb(0 0 0 / 15%);\n }\n }\n\n ::slotted(a[slot='breadcrumb']),\n &::slotted(a[slot='breadcrumb']) {\n color: var(--theme-tint-color) !important;\n cursor: pointer;\n }\n\n ::slotted(.slash[slot='breadcrumb']),\n &::slotted(.slash[slot='breadcrumb']) {\n color: var(--theme-color);\n position: relative;\n margin: 0 0.5rem;\n display: inline-block;\n }\n }\n\n &__scrim {\n position: absolute;\n left: 0;\n right: 0;\n bottom: 0;\n top: 0;\n z-index: 0;\n background:\n linear-gradient(\n var(--scrim-direction),\n rgba(var(--scrim-color), var(--scrim-opacity-from)) 0%,\n rgba(var(--scrim-color), var(--scrim-opacity-to)) 100%\n );\n\n .hero--scrim & {\n background: none;\n }\n }\n\n &__content {\n max-width: 1440px;\n\n --grid-row-gap: 0;\n\n margin: 0 auto;\n position: relative;\n\n &.is-xl {\n margin-top: 50px;\n max-width: 1540px;\n }\n\n &.is-xxl {\n margin-top: 83px;\n max-width: 1606px;\n }\n }\n\n &__primary {\n margin: 16px;\n\n .hero--breadcrumb & {\n margin: 0 16px;\n }\n\n .hero--backbtn & {\n margin-left: 0;\n }\n\n ::slotted(nano-icon-button[slot='back-btn']),\n &::slotted(nano-icon-button[slot='back-btn']) {\n font-size: 2rem;\n }\n\n .is-xl & {\n margin: 0 0 50px 50px;\n\n ::slotted(nano-icon-button[slot='back-btn']),\n &::slotted(nano-icon-button[slot='back-btn']) {\n @include margin(0, 0, 0, -3rem);\n }\n }\n\n .is-xxl & {\n margin: 0 0 83px 83px;\n }\n }\n\n &__primary-content {\n max-width: 45rem;\n\n --color: #fff;\n\n display: flex;\n\n .hero--backbtn & {\n > div {\n padding: 10px 0 0 0;\n }\n }\n\n ::slotted(h1[slot='primary-content']),\n &::slotted(h1[slot='primary-content']) {\n line-height: 26px !important;\n margin-top: 0 !important;\n margin-bottom: 18px !important;\n font-size: 2rem !important;\n }\n\n .is-xl & {\n ::slotted(h1[slot='primary-content']),\n &::slotted(h1[slot='primary-content']) {\n line-height: 31px !important;\n margin-bottom: 30px !important;\n }\n\n ::slotted(.button[slot='primary-content']),\n &::slotted(.button[slot='primary-content']) {\n margin-top: 20px !important;\n }\n }\n }\n\n &__secondary {\n display: none;\n height: 100%;\n padding: 0 14px 20px;\n\n .hero--secondary & {\n display: flex;\n align-items: center;\n }\n\n .is-xl & {\n padding: 0 50px 50px;\n justify-content: flex-end;\n }\n\n .is-xxl & {\n padding: 0 83px 83px;\n }\n }\n\n &__icon-box {\n background: rgba(0, 0, 0, 0.7);\n padding: 24px;\n width: 100%;\n margin-bottom: auto;\n display: flex;\n flex-direction: column;\n color: white;\n\n .is-xl & {\n max-width: 410px;\n flex: 0 1 410px;\n }\n\n // for silly IE\n &::slotted([slot='icon-box-item'] nano-icon) {\n color: var(--theme-tint-color);\n\n --nano-icon-size: 32px;\n --nano-icon-margin-end: 20px;\n }\n\n ::slotted([slot='icon-box-item']) {\n --nano-color-base: var(--theme-tint-color);\n --nano-icon-size: 32px;\n --nano-icon-margin-end: 20px;\n\n display: flex;\n align-items: center;\n font-size: 0.8125rem;\n margin-bottom: 20px;\n }\n\n ::slotted(.last[slot='icon-box-item']),\n &::slotted(.last[slot='icon-box-item']) {\n margin-bottom: 0;\n }\n }\n\n &__quote-content {\n margin-top: auto;\n text-align: center;\n width: 100%;\n\n .is-xl & {\n max-width: 500px;\n flex: 0 1 500px;\n text-align: initial;\n }\n }\n\n &__quote {\n &::before,\n &::after {\n content: '\"';\n font-size: var(--quote-size);\n font-weight: 700;\n font-style: italic;\n line-height: 0;\n color: #abb6b8;\n display: inline;\n position: relative;\n }\n\n ::slotted([slot='quote']),\n &::slotted([slot='quote']) {\n font-size: var(--quote-size);\n font-weight: 300;\n font-style: italic;\n display: inline;\n }\n }\n\n &__quote-author {\n text-align: right;\n text-align: end;\n font-size: 1rem;\n opacity: 0.8;\n }\n\n &--sub {\n .hero__content.is-xl {\n margin-top: 40px;\n\n .hero__primary {\n margin: 0 0 40px 50px;\n }\n\n .hero__secondary {\n padding: 0 50px 50px 40px;\n }\n\n ::slotted(.button[slot='primary-content']),\n &::slotted(.button[slot='primary-content']) {\n margin-top: 8px !important;\n }\n\n ::slotted(h1[slot='primary-content']),\n &::slotted(h1[slot='primary-content']) {\n margin-bottom: 18px !important;\n }\n }\n\n .hero__content.is-xxl {\n .hero__primary {\n margin: 0 0 40px 83px;\n }\n\n .hero__secondary {\n padding: 0 83px 83px 40px;\n }\n }\n }\n}\n","import {\n Component,\n Prop,\n h,\n ComponentInterface,\n VNode,\n State,\n Element,\n Watch,\n Host,\n} from '@stencil/core';\nimport { hasShadowDom } from '../../utils';\n\n/**\n * Hero components are designed to be used once per content page to add visual impact to the introductory section of a page.\n * @slot primary-content - title, leading paragraph and CTA\n * @slot breadcrumb - each individual bread crumb should be assigned seperately\n * @slot secondary-content - free form secondary content.\n * @slot icon-box - free form icon box container\n * @slot icon-box-item - seperate icon box items. Designed to contain 1 icon and 1 text element.\n * @slot secondary-ctas - CTAs. each individual button should be assigned seperately\n * @slot quote - quote content\n * @slot quote-author - quote author\n * @slot scrim - optional background overlay (e.g. faded colour or gradient)\n * @slot background - custom background. Only active when img-src is empty\n * @slot back-btn - a back button.\n */\n@Component({\n tag: 'nano-hero',\n styleUrl: 'hero.scss',\n shadow: true,\n})\nexport class Hero implements ComponentInterface {\n private mo?: MutationObserver;\n private isLegacy = false;\n\n @Element() host: HTMLNanoHeroElement;\n\n @State() gridSizes: string[] = [];\n @State() hasIconBox: boolean;\n @State() hasScrim: boolean;\n @State() hasSecondaryContent: boolean;\n @State() hasQuote: boolean;\n @State() hasBg: boolean;\n @State() hasBackBtn: boolean;\n @State() hasCtas: boolean;\n @State() breadCrumbs: Element[];\n @Watch('breadCrumbs')\n breadCrumbChange() {\n // safari doesn't support ::slotted()::after ... so this :/\n this.breadCrumbs\n .filter(\n (crumb) =>\n crumb.tagName === 'A' &&\n !crumb.nextElementSibling.classList.contains('slash')\n )\n .forEach((crumb) => {\n crumb.insertAdjacentHTML(\n 'afterend',\n '<span slot=\"breadcrumb\" class=\"slash\">/</span>'\n );\n });\n }\n @State() iconBoxItems: Element[];\n @Watch('iconBoxItems')\n iconBoxItemChange() {\n this.iconBoxItems.forEach((item) => item.classList.remove('last'));\n if (\n this.iconBoxItems[this.iconBoxItems.length - 1] &&\n this.iconBoxItems[this.iconBoxItems.length - 1].classList\n )\n this.iconBoxItems[this.iconBoxItems.length - 1].classList.add('last');\n }\n\n /** src for backgronund image. For more control use the `background` slot instead. */\n @Prop() imgSrc?: string;\n\n /** Optional list string providing media sizes with corresponding image srcs.\n * i.e. show img-x at 300px wide. Format `srcSet=\"200w src/imgSmall.jpg, 500h src/imgMed.png\"` */\n @Prop() imgSrcSet?: string = null;\n\n /** The Break Point width that the hero component will change to the large view. Defaults to the XL grid size (900px) */\n @Prop() largeScreenBP: number = 900;\n\n /** Base style for the hero. Either 'light' (white bg / dark text), or 'dark' (dark bg / white text) */\n @Prop() theme: 'dark' | 'light' = 'dark';\n\n /** Set the content structure level of the hero. Defaults to 'top' */\n @Prop() level: 'top' | 'sub' = 'top';\n\n private slotChangeObserver() {\n if (this.mo) this.mo.disconnect();\n const mo = (this.mo = new MutationObserver(() =>\n this.processSlottedContent()\n ));\n mo.observe(this.host, { childList: true });\n }\n\n // Event handlers\n\n private processSlottedContent() {\n this.hasCtas = !!this.host.querySelector('[slot=\"secondary-ctas\"]');\n this.iconBoxItems = Array.from(\n this.host.querySelectorAll('[slot=\"icon-box-item\"]')\n );\n this.hasIconBox =\n !!this.host.querySelector('[slot=\"icon-box\"]') ||\n !!this.iconBoxItems.length;\n this.hasScrim = !!this.host.querySelector('[slot=\"scrim\"]');\n this.breadCrumbs = Array.from(\n this.host.querySelectorAll('[slot=\"breadcrumb\"]')\n );\n this.hasSecondaryContent =\n !!this.host.querySelector('[slot=\"icon-box\"]') ||\n !!this.host.querySelector('[slot=\"quote\"]') ||\n !!this.host.querySelector('[slot=\"icon-box-item\"]') ||\n !!this.host.querySelector('[slot=\"secondary-content\"]');\n this.hasBg =\n !!this.host.querySelector('[slot=\"background\"]') || !!this.imgSrc;\n this.hasBackBtn = !!this.host.querySelector('[slot=\"back-btn\"]');\n this.hasQuote = !!this.host.querySelector('[slot=\"quote\"]');\n }\n\n private handleGridChange = (e: CustomEvent & { detail: string[] }) => {\n this.gridSizes = e.detail;\n };\n\n // Component lifecycle\n\n connectedCallback() {\n this.isLegacy = !hasShadowDom(this.host);\n }\n\n disconnectedCallback() {\n if (this.mo) this.mo.disconnect();\n }\n\n componentDidLoad() {\n this.slotChangeObserver();\n }\n\n componentWillLoad() {\n this.processSlottedContent();\n }\n\n private HeroContent = (): VNode[] => {\n return [\n !this.hasIconBox && this.hasCtas ? (\n <div class=\"hero__ctas\">\n <slot name=\"secondary-ctas\" />\n </div>\n ) : (\n ''\n ),\n <div class=\"hero__scrim\">\n <slot name=\"scrim\" />\n </div>,\n <nano-grid\n onNanoBpChange={this.handleGridChange}\n class=\"hero__content\"\n xlCols={2}\n xlSize={this.largeScreenBP}\n >\n <nano-grid-item gridStates=\"xl-col-span-2\">\n <div class=\"hero__breadcrumbs\">\n <slot name=\"breadcrumb\" />\n </div>\n </nano-grid-item>\n <nano-grid-item\n gridStates={\n this.hasSecondaryContent\n ? 'xl-col-span-1 xl-col-start-1 xl-row-start-2'\n : 'xl-col-span-2 xl-col-start-1 xl-row-start-2'\n }\n >\n <div class=\"hero__primary\">\n <div class=\"hero__primary-content\">\n <slot name=\"back-btn\" />\n <div>\n <slot name=\"primary-content\" />\n </div>\n </div>\n </div>\n </nano-grid-item>\n {this.hasSecondaryContent && (\n <nano-grid-item gridStates=\"xl-col-span-1 xl-col-start-2 xl-row-start-2\">\n <div class=\"hero__secondary\">\n <slot name=\"secondary-content\" />\n {this.hasIconBox && (\n <div class=\"hero__icon-box\">\n <slot name=\"icon-box\" />\n <slot name=\"icon-box-item\" />\n </div>\n )}\n {this.hasQuote && (\n <div class=\"hero__quote-content\">\n <span class=\"hero__quote\">\n <slot name=\"quote\" />\n </span>\n <div class=\"hero__quote-author\">\n <slot name=\"quote-author\" />\n </div>\n </div>\n )}\n </div>\n </nano-grid-item>\n )}\n </nano-grid>,\n ];\n };\n\n render() {\n const rtl =\n this.host.dir === 'rtl' ||\n (this.host.ownerDocument as Document).dir === 'rtl';\n\n return (\n <Host\n class={{\n [this.gridSizes.join(' ')]: true,\n }}\n >\n <div\n class={{\n hero: true,\n 'hero--light': this.theme === 'light',\n 'hero--secondary': this.hasSecondaryContent,\n 'hero--iconbox': this.hasIconBox,\n 'hero--rtl': rtl,\n 'hero--scrim': this.hasScrim,\n 'hero--legacy': this.isLegacy,\n 'hero--breadcrumb': !!this.breadCrumbs.length,\n 'hero--hasbg': this.hasBg,\n 'hero--backbtn': this.hasBackBtn,\n 'hero--sub': this.level === 'sub',\n }}\n >\n <div class=\"hero__bg-wrap\">\n {!!this.imgSrc && (\n <nano-img\n class=\"hero__img\"\n lazy={false}\n background\n srcSet={this.imgSrcSet}\n src={this.imgSrc}\n >\n <this.HeroContent />\n </nano-img>\n )}\n {!this.imgSrc && [\n <div class=\"hero__bg-slot\">\n <slot name=\"background\" />\n </div>,\n <this.HeroContent />,\n ]}\n </div>\n </div>\n </Host>\n );\n }\n}\n"]}

package/dist/nano-components/p-b619500f.js ADDED Viewed

@@ -0,0 +1,5 @@
+/*!
+ * Web Components for Nanopore digital Web Apps
+ */
+function e(e,t=this){function n(t){if(!t||t===document||t===window)return null;if(t.assignedSlot)t=t.assignedSlot;let r=t.closest(e);return r?r:n(t.getRootNode().host)}return n(t)}function t(e,t,n=true){if(n===true){try{t=":scope > "+t.split(",").join(", :scope >");return Array.from(e.querySelectorAll(t))}catch(l){console.log("an error sad")}}if(!Element.prototype.matches){Element.prototype.matches=Element.prototype.msMatchesSelector||Element.prototype.webkitMatchesSelector}let r=[];Array.from(e.childNodes).forEach((e=>{if(!!e.matches&&e.matches(t))r.push(e);else if(e.nodeName.toLowerCase()==="slot"){Array.from(e.assignedNodes()).forEach((e=>{if(e instanceof Element&&e.matches(t))r.push(e);else if(e instanceof Node&&!n)r.push(e)}))}else if(!n)r.push(e)}));return r}const n=(e,t)=>{if(!Element.prototype.matches){Element.prototype.matches=Element.prototype.msMatchesSelector||Element.prototype.webkitMatchesSelector}let n=[];let r=e.parentNode.firstElementChild;do{if(!t||r!==e&&r.matches(t))n.push(r)}while(r=r.nextElementSibling);return n};function r(e,t){if(!t||!e)return;return{top:e.getBoundingClientRect().top-t.getBoundingClientRect().top,left:e.getBoundingClientRect().left-t.getBoundingClientRect().left}}export{r as a,n as b,e as c,t as g};
+//# sourceMappingURL=p-b619500f.js.map

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

@@ -0,0 +1 @@

+ {"version":3,"sources":["src/utils/dom.ts"],"names":["closestElement","selector","base","this","__closestFrom","el","document","window","assignedSlot","found","closest","getRootNode","host","getDirectChildren","sel","elesOnly","split","join","Array","from","querySelectorAll","e","console","log","Element","prototype","matches","msMatchesSelector","webkitMatchesSelector","ret","childNodes","forEach","push","nodeName","toLowerCase","assignedNodes","slotEl","Node","getSiblings","siblings","firstChild","parentNode","firstElementChild","nextElementSibling","getOffset","element","parent","top","getBoundingClientRect","left"],"mappings":";;;SAAgBA,EAAeC,EAAkBC,EAAgBC,MAC/D,SAASC,EAAcC,GACrB,IAAKA,GAAMA,IAAOC,UAAYD,IAAOE,OAAQ,OAAO,KACpD,GAAKF,EAAuBG,aAC1BH,EAAMA,EAAuBG,aAC/B,IAAIC,EAASJ,EAAeK,QAAQT,GACpC,OAAOQ,EACHA,EACAL,EAAgBC,EAAeM,cAA6BC,MAElE,OAAOR,EAAcF,YAwBPW,EACdR,EACAS,EACAC,EAA6B,MAE7B,GAAIA,IAAa,KAAM,CACrB,IACED,EAAM,YAAcA,EAAIE,MAAM,KAAKC,KAAK,cACxC,OAAOC,MAAMC,KAAKd,EAAGe,iBAAiBN,IACtC,MAAOO,GACPC,QAAQC,IAAI,iBAGhB,IAAKC,QAAQC,UAAUC,QAAS,CAC9BF,QAAQC,UAAUC,QAChBF,QAAQC,UAAUE,mBAClBH,QAAQC,UAAUG,sBAGtB,IAAIC,EAAuB,GAC3BX,MAAMC,KAAKd,EAAGyB,YAAYC,SAASV,IACjC,KAAOA,EAAcK,SAAYL,EAAcK,QAAQZ,GAAMe,EAAIG,KAAKX,QACjE,GAAIA,EAAEY,SAASC,gBAAkB,OAAQ,CAC5ChB,MAAMC,KAAME,EAAsBc,iBAAiBJ,SAASK,IAC1D,GAAIA,aAAkBZ,SAAWY,EAAOV,QAAQZ,GAAMe,EAAIG,KAAKI,QAC1D,GAAIA,aAAkBC,OAAStB,EAAUc,EAAIG,KAAKI,WAEpD,IAAKrB,EAAUc,EAAIG,KAAKX,MAEjC,OAAOQ,QAGIS,EAAc,CAACjC,EAAaS,KACvC,IAAKU,QAAQC,UAAUC,QAAS,CAC9BF,QAAQC,UAAUC,QAChBF,QAAQC,UAAUE,mBAClBH,QAAQC,UAAUG,sBAEtB,IAAIW,EAAW,GACf,IAAIC,EAAanC,EAAGoC,WAAWC,kBAC/B,EAAG,CACD,IAAK5B,GAAQ0B,IAAenC,GAAMmC,EAAWd,QAAQZ,GACnDyB,EAASP,KAAKQ,SACRA,EAAaA,EAAWG,oBAClC,OAAOJ,YAGOK,EAAUC,EAAsBC,GAC9C,IAAKA,IAAWD,EAAS,OACzB,MAAO,CACLE,IACEF,EAAQG,wBAAwBD,IAAMD,EAAOE,wBAAwBD,IACvEE,KACEJ,EAAQG,wBAAwBC,KAChCH,EAAOE,wBAAwBC","sourcesContent":["export function closestElement(selector: string, base: Element = this) {\n function __closestFrom(el: Element | Window | Document): Element {\n if (!el || el === document || el === window) return null;\n if ((el as HTMLSlotElement).assignedSlot)\n el = (el as HTMLSlotElement).assignedSlot;\n let found = (el as Element).closest(selector);\n return found\n ? found\n : __closestFrom(((el as Element).getRootNode() as ShadowRoot).host);\n }\n return __closestFrom(base);\n}\n\n/**\n * Get direct child elements / nodes from from any element (for when querySelectorAll(':scope > .selector') fails)\n * @param el - a root element to query from\n * @param sel - a query selector string\n * @param elesOnly - return only Elements (no Nodes)\n */\nexport function getDirectChildren<T = HTMLElement>(\n el: Element,\n sel: string,\n elesOnly?: true\n): Array<T>;\nexport function getDirectChildren<T = HTMLElement>(\n el: Element,\n sel: string,\n elesOnly?: 'slot'\n): Array<T>;\nexport function getDirectChildren<T = HTMLElement>(\n el: Element,\n sel: string,\n elesOnly?: false\n): Array<T | Node>;\nexport function getDirectChildren<T = HTMLElement>(\n el: Element,\n sel: string,\n elesOnly: boolean | 'slot' = true\n) {\n if (elesOnly === true) {\n try {\n sel = ':scope > ' + sel.split(',').join(', :scope >');\n return Array.from(el.querySelectorAll(sel)) as unknown as Array<T>;\n } catch (e) {\n console.log('an error sad');\n }\n }\n if (!Element.prototype.matches) {\n Element.prototype.matches =\n Element.prototype.msMatchesSelector ||\n Element.prototype.webkitMatchesSelector;\n }\n\n let ret: Array<Node | T> = [];\n Array.from(el.childNodes).forEach((e) => {\n if (!!(e as Element).matches && (e as Element).matches(sel)) ret.push(e);\n else if (e.nodeName.toLowerCase() === 'slot') {\n Array.from((e as HTMLSlotElement).assignedNodes()).forEach((slotEl) => {\n if (slotEl instanceof Element && slotEl.matches(sel)) ret.push(slotEl);\n else if (slotEl instanceof Node && !elesOnly) ret.push(slotEl as Node);\n });\n } else if (!elesOnly) ret.push(e as Node);\n });\n return ret;\n}\n\nexport const getSiblings = (el: Element, sel?: string): Array<Element> => {\n if (!Element.prototype.matches) {\n Element.prototype.matches =\n Element.prototype.msMatchesSelector ||\n Element.prototype.webkitMatchesSelector;\n }\n let siblings = [];\n let firstChild = el.parentNode.firstElementChild;\n do {\n if (!sel || (firstChild !== el && firstChild.matches(sel)))\n siblings.push(firstChild);\n } while ((firstChild = firstChild.nextElementSibling));\n return siblings;\n};\n\nexport function getOffset(element: HTMLElement, parent: HTMLElement) {\n if (!parent || !element) return;\n return {\n top:\n element.getBoundingClientRect().top - parent.getBoundingClientRect().top,\n left:\n element.getBoundingClientRect().left -\n parent.getBoundingClientRect().left,\n };\n}\n"]}

package/dist/nano-components/{p-23f65b34.entry.js → p-ba13bb56.entry.js} RENAMED Viewed

@@ -19,5 +19,5 @@ import{r as t,c as i,h as s,e as n,g as h}from"./p-ab5813a7.js";import{i as e}fr
  * Draggable base class
  * MIT license
  */
-(function(i,s){if(t.exports){t.exports=s(i,S)}else{i.Unidragger=s(i,i.Unipointer)}})(window,(function t(i,s){function n(){}var h=n.prototype=Object.create(s.prototype);h.bindHandles=function(){this._bindHandles(true)};h.unbindHandles=function(){this._bindHandles(false)};h._bindHandles=function(t){t=t===undefined?true:t;var s=t?"addEventListener":"removeEventListener";var n=t?this._touchActionValue:"";for(var h=0;h<this.handles.length;h++){var e=this.handles[h];this._bindStartEvent(e,t);e[s]("click",this);if(i.PointerEvent){e.style.touchAction=n}}};h._touchActionValue="none";h.pointerDown=function(t,i){var s=this.okayPointerDown(t);if(!s){return}this.pointerDownPointer={pageX:i.pageX,pageY:i.pageY};t.preventDefault();this.pointerDownBlur();this._bindPostStartEvents(t);this.emitEvent("pointerDown",[t,i])};var e={TEXTAREA:true,INPUT:true,SELECT:true,OPTION:true};var r={radio:true,checkbox:true,button:true,submit:true,image:true,file:true};h.okayPointerDown=function(t){var i=e[t.target.nodeName];var s=r[t.target.type];var n=!i||s;if(!n){this._pointerReset()}return n};h.pointerDownBlur=function(){var t=document.activeElement;var i=t&&t.blur&&t!=document.body;if(i){t.blur()}};h.pointerMove=function(t,i){var s=this._dragPointerMove(t,i);this.emitEvent("pointerMove",[t,i,s]);this._dragMove(t,i,s)};h._dragPointerMove=function(t,i){var s={x:i.pageX-this.pointerDownPointer.pageX,y:i.pageY-this.pointerDownPointer.pageY};if(!this.isDragging&&this.hasDragStarted(s)){this._dragStart(t,i)}return s};h.hasDragStarted=function(t){return Math.abs(t.x)>3||Math.abs(t.y)>3};h.pointerUp=function(t,i){this.emitEvent("pointerUp",[t,i]);this._dragPointerUp(t,i)};h._dragPointerUp=function(t,i){if(this.isDragging){this._dragEnd(t,i)}else{this._staticClick(t,i)}};h._dragStart=function(t,i){this.isDragging=true;this.isPreventingClicks=true;this.dragStart(t,i)};h.dragStart=function(t,i){this.emitEvent("dragStart",[t,i])};h._dragMove=function(t,i,s){if(!this.isDragging){return}this.dragMove(t,i,s)};h.dragMove=function(t,i,s){t.preventDefault();this.emitEvent("dragMove",[t,i,s])};h._dragEnd=function(t,i){this.isDragging=false;setTimeout(function(){delete this.isPreventingClicks}.bind(this));this.dragEnd(t,i)};h.dragEnd=function(t,i){this.emitEvent("dragEnd",[t,i])};h.onclick=function(t){if(this.isPreventingClicks){t.preventDefault()}};h._staticClick=function(t,i){if(this.isIgnoringMouseUp&&t.type=="mouseup"){return}this.staticClick(t,i);if(t.type!="mouseup"){this.isIgnoringMouseUp=true;setTimeout(function(){delete this.isIgnoringMouseUp}.bind(this),400)}};h.staticClick=function(t,i){this.emitEvent("staticClick",[t,i])};n.getPointerPoint=s.getPointerPoint;return n}))}));c.extend(x.defaults,{draggable:">1",dragThreshold:3});x.createMethods.push("_createDrag");var L=x.prototype;c.extend(L,z.prototype);L._touchActionValue="pan-y";var T="createTouch"in document;var P=false;L._createDrag=function(){this.on("activate",this.onActivateDrag);this.on("uiChange",this._uiChangeDrag);this.on("deactivate",this.onDeactivateDrag);this.on("cellChange",this.updateDraggable);if(T&&!P){window.addEventListener("touchmove",(function(){}));P=true}};L.onActivateDrag=function(){this.handles=[this.viewport];this.bindHandles();this.updateDraggable()};L.onDeactivateDrag=function(){this.unbindHandles();this.element.classList.remove("is-draggable")};L.updateDraggable=function(){if(this.options.draggable==">1"){this.isDraggable=this.slides.length>1}else{this.isDraggable=this.options.draggable}if(this.isDraggable){this.element.classList.add("is-draggable")}else{this.element.classList.remove("is-draggable")}};L.bindDrag=function(){this.options.draggable=true;this.updateDraggable()};L.unbindDrag=function(){this.options.draggable=false;this.updateDraggable()};L._uiChangeDrag=function(){delete this.isFreeScrolling};L.pointerDown=function(t,i){if(!this.isDraggable){this._pointerDownDefault(t,i);return}var s=this.okayPointerDown(t);if(!s){return}this._pointerDownPreventDefault(t);this.pointerDownFocus(t);if(document.activeElement!=this.element){this.pointerDownBlur()}this.dragX=this.x;this.viewport.classList.add("is-pointer-down");this.pointerDownScroll=E();window.addEventListener("scroll",this);this._pointerDownDefault(t,i)};L._pointerDownDefault=function(t,i){this.pointerDownPointer={pageX:i.pageX,pageY:i.pageY};this._bindPostStartEvents(t);this.dispatchEvent("pointerDown",t,[i])};var A={INPUT:true,TEXTAREA:true,SELECT:true};L.pointerDownFocus=function(t){var i=A[t.target.nodeName];if(!i){this.focus()}};L._pointerDownPreventDefault=function(t){var i=t.type=="touchstart";var s=t.pointerType=="touch";var n=A[t.target.nodeName];if(!i&&!s&&!n){t.preventDefault()}};L.hasDragStarted=function(t){return Math.abs(t.x)>this.options.dragThreshold};L.pointerUp=function(t,i){delete this.isTouchScrolling;this.viewport.classList.remove("is-pointer-down");this.dispatchEvent("pointerUp",t,[i]);this._dragPointerUp(t,i)};L.pointerDone=function(){window.removeEventListener("scroll",this);delete this.pointerDownScroll};L.dragStart=function(t,i){if(!this.isDraggable){return}this.dragStartPosition=this.x;this.startAnimation();window.removeEventListener("scroll",this);this.dispatchEvent("dragStart",t,[i])};L.pointerMove=function(t,i){var s=this._dragPointerMove(t,i);this.dispatchEvent("pointerMove",t,[i,s]);this._dragMove(t,i,s)};L.dragMove=function(t,i,s){if(!this.isDraggable){return}t.preventDefault();this.previousDragX=this.dragX;var n=this.options.rightToLeft?-1:1;if(this.options.wrapAround){s.x=s.x%this.slideableWidth}var h=this.dragStartPosition+s.x*n;if(!this.options.wrapAround&&this.slides.length){var e=Math.max(-this.slides[0].target,this.dragStartPosition);h=h>e?(h+e)*.5:h;var r=Math.min(-this.getLastSlide().target,this.dragStartPosition);h=h<r?(h+r)*.5:h}this.dragX=h;this.dragMoveTime=new Date;this.dispatchEvent("dragMove",t,[i,s])};L.dragEnd=function(t,i){if(!this.isDraggable){return}if(this.options.freeScroll){this.isFreeScrolling=true}var s=this.dragEndRestingSelect();if(this.options.freeScroll&&!this.options.wrapAround){var n=this.getRestingPosition();this.isFreeScrolling=-n>this.slides[0].target&&-n<this.getLastSlide().target}else if(!this.options.freeScroll&&s==this.selectedIndex){s+=this.dragEndBoostSelect()}delete this.previousDragX;this.isDragSelect=this.options.wrapAround;this.select(s);delete this.isDragSelect;this.dispatchEvent("dragEnd",t,[i])};L.dragEndRestingSelect=function(){var t=this.getRestingPosition();var i=Math.abs(this.getSlideDistance(-t,this.selectedIndex));var s=this._getClosestResting(t,i,1);var n=this._getClosestResting(t,i,-1);var h=s.distance<n.distance?s.index:n.index;return h};L._getClosestResting=function(t,i,s){var n=this.selectedIndex;var h=Infinity;var e=this.options.contain&&!this.options.wrapAround?function(t,i){return t<=i}:function(t,i){return t<i};while(e(i,h)){n+=s;h=i;i=this.getSlideDistance(-t,n);if(i===null){break}i=Math.abs(i)}return{distance:h,index:n-s}};L.getSlideDistance=function(t,i){var s=this.slides.length;var n=this.options.wrapAround&&s>1;var h=n?c.modulo(i,s):i;var e=this.slides[h];if(!e){return null}var r=n?this.slideableWidth*Math.floor(i/s):0;return t-(e.target+r)};L.dragEndBoostSelect=function(){if(this.previousDragX===undefined||!this.dragMoveTime||new Date-this.dragMoveTime>100){return 0}var t=this.getSlideDistance(-this.dragX,this.selectedIndex);var i=this.previousDragX-this.dragX;if(t>0&&i>0){return 1}else if(t<0&&i<0){return-1}return 0};L.staticClick=function(t,i){var s=this.getParentCell(t.target);var n=s&&s.element;var h=s&&this.cells.indexOf(s);this.dispatchEvent("staticClick",t,[i,n,h])};L.onscroll=function(){var t=E();var i=this.pointerDownScroll.x-t.x;var s=this.pointerDownScroll.y-t.y;if(Math.abs(i)>3||Math.abs(s)>3){this._pointerDone()}};function E(){return{x:window.pageXOffset,y:window.pageYOffset}}var D="http://www.w3.org/2000/svg";function O(t,i){this.direction=t;this.parent=i;this.parentElement=this.parent.element.shadowRoot||this.parent.element;this._create()}O.prototype=Object.create(S.prototype);O.prototype._create=function(){this.isEnabled=true;this.isPrevious=this.direction==-1;var t=this.parent.options.rightToLeft?1:-1;this.isLeft=this.direction==t;var i=this.element=document.createElement("button");i.className="flickity-button flickity-prev-next-button";i.className+=this.isPrevious?" previous":" next";i.setAttribute("type","button");this.disable();i.setAttribute("aria-label",this.isPrevious?"Previous":"Next");var s=this.createSVG();i.appendChild(s);this.parent.on("select",this.update.bind(this));this.on("pointerDown",this.parent.childUIPointerDown.bind(this.parent))};O.prototype.activate=function(){this.bindStartEvent(this.element);this.element.addEventListener("click",this);this.parentElement.appendChild(this.element)};O.prototype.deactivate=function(){this.parentElement.removeChild(this.element);this.unbindStartEvent(this.element);this.element.removeEventListener("click",this)};O.prototype.createSVG=function(){var t=document.createElementNS(D,"svg");t.setAttribute("class","flickity-button-icon");t.setAttribute("viewBox","0 0 100 100");var i=document.createElementNS(D,"path");var s=j(this.parent.options.arrowShape);i.setAttribute("d",s);i.setAttribute("class","arrow");if(!this.isLeft){i.setAttribute("transform","translate(100, 100) rotate(180) ")}t.appendChild(i);return t};function j(t){if(typeof t=="string"){return t}return"M "+t.x0+",50"+" L "+t.x1+","+(t.y1+50)+" L "+t.x2+","+(t.y2+50)+" L "+t.x3+",50 "+" L "+t.x2+","+(50-t.y2)+" L "+t.x1+","+(50-t.y1)+" Z"}O.prototype.handleEvent=c.handleEvent;O.prototype.onclick=function(){if(!this.isEnabled){return}this.parent.uiChange();var t=this.isPrevious?"previous":"next";this.parent[t]()};O.prototype.enable=function(){if(this.isEnabled){return}this.element.disabled=false;this.isEnabled=true};O.prototype.disable=function(){if(!this.isEnabled){return}this.element.disabled=true;this.isEnabled=false};O.prototype.update=function(){var t=this.parent.slides;if(this.parent.options.wrapAround&&t.length>1){this.enable();return}var i=t.length?t.length-1:0;var s=this.isPrevious?0:i;var n=this.parent.selectedIndex==s?"disable":"enable";this[n]()};O.prototype.destroy=function(){this.deactivate();this.allOff()};c.extend(x.defaults,{prevNextButtons:true,arrowShape:{x0:10,x1:60,y1:50,x2:70,y2:40,x3:30}});x.createMethods.push("_createPrevNextButtons");var R=x.prototype;R._createPrevNextButtons=function(){if(!this.options.prevNextButtons){return}this.prevButton=new O(-1,this);this.nextButton=new O(1,this);this.on("activate",this.activatePrevNextButtons)};R.activatePrevNextButtons=function(){this.prevButton.activate();this.nextButton.activate();this.on("deactivate",this.deactivatePrevNextButtons)};R.deactivatePrevNextButtons=function(){this.prevButton.deactivate();this.nextButton.deactivate();this.off("deactivate",this.deactivatePrevNextButtons)};x.PrevNextButton=O;function N(t){this.parent=t;this.parentElement=this.parent.element.shadowRoot||this.parent.element;this._create()}N.prototype=Object.create(S.prototype);N.prototype._create=function(){this.holder=document.createElement("ol");this.holder.className="flickity-page-dots";this.dots=[];this.handleClick=this.onClick.bind(this);this.on("pointerDown",this.parent.childUIPointerDown.bind(this.parent))};N.prototype.activate=function(){this.setDots();this.holder.addEventListener("click",this.handleClick);this.bindStartEvent(this.holder);this.parentElement.appendChild(this.holder)};N.prototype.deactivate=function(){this.holder.removeEventListener("click",this.handleClick);this.unbindStartEvent(this.holder);this.parentElement.removeChild(this.holder)};N.prototype.setDots=function(){var t=this.parent.slides.length-this.dots.length;if(t>0){this.addDots(t)}else if(t<0){this.removeDots(-t)}};N.prototype.addDots=function(t){var i=document.createDocumentFragment();var s=[];var n=this.dots.length;var h=n+t;for(var e=n;e<h;e++){var r=document.createElement("li");r.classList.add("dot");r.setAttribute("aria-label","Page dot "+(e+1));i.appendChild(r);s.push(r)}this.holder.appendChild(i);this.dots=this.dots.concat(s)};N.prototype.removeDots=function(t){var i=this.dots.splice(this.dots.length-t,t);i.forEach((function(t){this.holder.removeChild(t)}),this)};N.prototype.updateSelected=function(){if(this.selectedDot){this.selectedDot.classList.remove("is-selected");this.selectedDot.removeAttribute("aria-current")}if(!this.dots.length){return}this.selectedDot=this.dots[this.parent.selectedIndex];this.selectedDot.classList.add("is-selected");this.selectedDot.setAttribute("aria-current","step")};N.prototype.onTap=N.prototype.onClick=function(t){var i=t.target;if(i.nodeName!="LI"){return}this.parent.uiChange();var s=this.dots.indexOf(i);this.parent.select(s)};N.prototype.destroy=function(){this.deactivate();this.allOff()};x.PageDots=N;c.extend(x.defaults,{pageDots:true});x.createMethods.push("_createPageDots");var I=x.prototype;I._createPageDots=function(){if(!this.options.pageDots){return}this.pageDots=new N(this);this.on("activate",this.activatePageDots);this.on("select",this.updateSelectedPageDots);this.on("cellChange",this.updatePageDots);this.on("resize",this.updatePageDots);this.on("deactivate",this.deactivatePageDots)};I.activatePageDots=function(){this.pageDots.activate()};I.updateSelectedPageDots=function(){this.pageDots.updateSelected()};I.updatePageDots=function(){this.pageDots.setDots()};I.deactivatePageDots=function(){this.pageDots.deactivate()};x.PageDots=N;function B(t){this.parent=t;this.state="stopped";this.onVisibilityChange=this.visibilityChange.bind(this);this.onVisibilityPlay=this.visibilityPlay.bind(this)}B.prototype=Object.create(o.prototype);B.prototype.play=function(){if(this.state=="playing"){return}var t=document.hidden;if(t){document.addEventListener("visibilitychange",this.onVisibilityPlay);return}this.state="playing";document.addEventListener("visibilitychange",this.onVisibilityChange);this.tick()};B.prototype.tick=function(){if(this.state!="playing"){return}var t=this.parent.options.autoPlay;t=typeof t=="number"?t:3e3;var i=this;this.clear();this.timeout=setTimeout((function(){i.parent.next(true);i.tick()}),t)};B.prototype.stop=function(){this.state="stopped";this.clear();document.removeEventListener("visibilitychange",this.onVisibilityChange)};B.prototype.clear=function(){clearTimeout(this.timeout)};B.prototype.pause=function(){if(this.state=="playing"){this.state="paused";this.clear()}};B.prototype.unpause=function(){if(this.state=="paused"){this.play()}};B.prototype.visibilityChange=function(){var t=document.hidden;this[t?"pause":"unpause"]()};B.prototype.visibilityPlay=function(){this.play();document.removeEventListener("visibilitychange",this.onVisibilityPlay)};c.extend(x.defaults,{pauseAutoPlayOnHover:true});x.createMethods.push("_createPlayer");var F=x.prototype;F._createPlayer=function(){this.player=new B(this);this.on("activate",this.activatePlayer);this.on("uiChange",this.stopPlayer);this.on("pointerDown",this.stopPlayer);this.on("deactivate",this.deactivatePlayer)};F.activatePlayer=function(){if(!this.options.autoPlay){return}this.player.play();this.element.addEventListener("mouseenter",this)};F.playPlayer=function(){this.player.play()};F.stopPlayer=function(){this.player.stop()};F.pausePlayer=function(){this.player.pause()};F.unpausePlayer=function(){this.player.unpause()};F.deactivatePlayer=function(){this.player.stop();this.element.removeEventListener("mouseenter",this)};F.onmouseenter=function(){if(!this.options.pauseAutoPlayOnHover){return}this.player.pause();this.element.addEventListener("mouseleave",this)};F.onmouseleave=function(){this.player.unpause();this.element.removeEventListener("mouseleave",this)};x.Player=B;function H(t){var i=document.createDocumentFragment();t.forEach((function(t){i.appendChild(t.element)}));return i}var _=x.prototype;_.insert=function(t,i){var s=this._makeCells(t);if(!s||!s.length){return}var n=this.cells.length;i=i===undefined?n:i;var h=H(s);var e=i==n;if(e){this.slider.appendChild(h)}else{var r=this.cells[i].element;this.slider.insertBefore(h,r)}if(i===0){this.cells=s.concat(this.cells)}else if(e){this.cells=this.cells.concat(s)}else{var a=this.cells.splice(i,n-i);this.cells=this.cells.concat(s).concat(a)}this._sizeCells(s);this.cellChange(i,true)};_.append=function(t){this.insert(t,this.cells.length)};_.prepend=function(t){this.insert(t,0)};_.remove=function(t){var i=this.getCells(t);if(!i||!i.length){return}var s=this.cells.length-1;i.forEach((function(t){t.remove();var i=this.cells.indexOf(t);s=Math.min(i,s);c.removeFrom(this.cells,t)}),this);this.cellChange(s,true)};_.cellSizeChange=function(t){var i=this.getCell(t);if(!i){return}i.getSize();var s=this.cells.indexOf(i);this.cellChange(s)};_.cellChange=function(t,i){var s=this.selectedElement;this._positionCells(t);this._getWrapShiftCells();this.setGallerySize();var n=this.getCell(s);if(n){this.selectedIndex=this.getCellSlideIndex(n)}this.selectedIndex=Math.min(this.slides.length-1,this.selectedIndex);this.emitEvent("cellChange",[t]);this.select(this.selectedIndex);if(i){this.positionSliderAtSelected()}};x.createMethods.push("_createLazyload");var W=x.prototype;W._createLazyload=function(){this.on("select",this.lazyLoad)};W.lazyLoad=function(){var t=this.options.lazyLoad;if(!t){return}var i=typeof t=="number"?t:0;var s=this.getAdjacentCellElements(i);var n=[];s.forEach((function(t){var i=V(t);n=n.concat(i)}));n.forEach((function(t){new X(t,this)}),this)};function V(t){if(t.nodeName=="IMG"){var i=t.getAttribute("data-flickity-lazyload");var s=t.getAttribute("data-flickity-lazyload-src");var n=t.getAttribute("data-flickity-lazyload-srcset");if(i||s||n){return[t]}}var h="img[data-flickity-lazyload], "+"img[data-flickity-lazyload-src], img[data-flickity-lazyload-srcset]";var e=t.querySelectorAll(h);return c.makeArray(e)}function X(t,i){this.img=t;this.flickity=i;this.load()}X.prototype.handleEvent=c.handleEvent;X.prototype.load=function(){this.img.addEventListener("load",this);this.img.addEventListener("error",this);var t=this.img.getAttribute("data-flickity-lazyload")||this.img.getAttribute("data-flickity-lazyload-src");var i=this.img.getAttribute("data-flickity-lazyload-srcset");this.img.src=t;if(i){this.img.setAttribute("srcset",i)}this.img.removeAttribute("data-flickity-lazyload");this.img.removeAttribute("data-flickity-lazyload-src");this.img.removeAttribute("data-flickity-lazyload-srcset")};X.prototype.onload=function(t){this.complete(t,"flickity-lazyloaded")};X.prototype.onerror=function(t){this.complete(t,"flickity-lazyerror")};X.prototype.complete=function(t,i){this.img.removeEventListener("load",this);this.img.removeEventListener("error",this);var s=this.flickity.getParentCell(this.img);var n=s&&s.element;this.flickity.cellSizeChange(n);this.img.classList.add(i);this.flickity.dispatchEvent("lazyLoad",t,n)};x.LazyLoader=X;x.createMethods.push("_createFullscreen");var Z=x.prototype;Z._createFullscreen=function(){this.isFullscreen=false;if(!this.options.fullscreen){return}this.viewFullscreenButton=new Y("view",this);this.exitFullscreenButton=new Y("exit",this);this.on("activate",this._changeFullscreenActive);this.on("deactivate",this._changeFullscreenActive)};Z._changeFullscreenActive=function(){var t=this.isActive?"appendChild":"removeChild";this.element[t](this.viewFullscreenButton.element);this.element[t](this.exitFullscreenButton.element);var i=this.isActive?"activate":"deactivate";this.viewFullscreenButton[i]();this.exitFullscreenButton[i]()};Z.viewFullscreen=function(){this._changeFullscreen(true);this.focus()};Z.exitFullscreen=function(){this._changeFullscreen(false)};Z._changeFullscreen=function(t){if(this.isFullscreen==t){return}this.isFullscreen=t;var i=t?"add":"remove";document.documentElement.classList[i]("is-flickity-fullscreen");this.element.classList[i]("is-fullscreen");this.resize();if(this.isFullscreen){this.reposition()}this.dispatchEvent("fullscreenChange",null,[t])};Z.toggleFullscreen=function(){this._changeFullscreen(!this.isFullscreen)};var U=Z.setGallerySize;Z.setGallerySize=function(){if(!this.options.setGallerySize){return}if(this.isFullscreen){this.viewport.style.height=""}else{U.call(this)}};x.keyboardHandlers[27]=function(){this.exitFullscreen()};function Y(t,i){this.name=t;this.createButton();this.createIcon();this.onClick=function(){i[t+"Fullscreen"]()};this.clickHandler=this.onClick.bind(this)}Y.prototype.createButton=function(){var t=this.element=document.createElement("button");t.className="flickity-button flickity-fullscreen-button "+"flickity-fullscreen-button-"+this.name;t.setAttribute("type","button");var i=G(this.name+" full-screen");t.setAttribute("aria-label",i);t.title=i};function G(t){return t[0].toUpperCase()+t.slice(1)}var J="http://www.w3.org/2000/svg";var q={view:"M15,20,7,28h5v4H0V20H4v5l8-8Zm5-5,8-8v5h4V0H20V4h5l-8,8Z",exit:"M32,3l-7,7h5v4H18V2h4V7l7-7ZM3,32l7-7v5h4V18H2v4H7L0,29Z"};Y.prototype.createIcon=function(){var t=document.createElementNS(J,"svg");t.setAttribute("class","flickity-button-icon");t.setAttribute("viewBox","0 0 32 32");var i=document.createElementNS(J,"path");var s=q[this.name];i.setAttribute("d",s);t.appendChild(i);this.element.appendChild(t)};Y.prototype.activate=function(){this.element.addEventListener("click",this.clickHandler)};Y.prototype.deactivate=function(){this.element.removeEventListener("click",this.clickHandler)};x.FullscreenButton=Y;var Q=x.Slide;var $=Q.prototype.updateTarget;Q.prototype.updateTarget=function(){$.apply(this,arguments);if(!this.parent.options.fade){return}var t=this.target-this.x;var i=this.cells[0].x;this.cells.forEach((function(s){var n=s.x-i-t;s.renderPosition(n)}))};Q.prototype.setOpacity=function(t){this.cells.forEach((function(i){i.element.style.opacity=t}))};var K=x.prototype;x.createMethods.push("_createFade");K._createFade=function(){this.fadeIndex=this.selectedIndex;this.prevSelectedIndex=this.selectedIndex;this.on("select",this.onSelectFade);this.on("dragEnd",this.onDragEndFade);this.on("settle",this.onSettleFade);this.on("activate",this.onActivateFade);this.on("deactivate",this.onDeactivateFade)};var tt=K.updateSlides;K.updateSlides=function(){tt.apply(this,arguments);if(!this.options.fade){return}this.slides.forEach((function(t,i){var s=i==this.selectedIndex?1:0;t.setOpacity(s)}),this)};K.onSelectFade=function(){this.fadeIndex=Math.min(this.prevSelectedIndex,this.slides.length-1);this.prevSelectedIndex=this.selectedIndex};K.onSettleFade=function(){delete this.didDragEnd;if(!this.options.fade){return}this.selectedSlide.setOpacity(1);var t=this.slides[this.fadeIndex];if(t&&this.fadeIndex!=this.selectedIndex){this.slides[this.fadeIndex].setOpacity(0)}};K.onDragEndFade=function(){this.didDragEnd=true};K.onActivateFade=function(){if(this.options.fade){this.element.classList.add("is-fade")}};K.onDeactivateFade=function(){if(!this.options.fade){return}this.element.classList.remove("is-fade");this.slides.forEach((function(t){t.setOpacity("")}))};var it=K.positionSlider;K.positionSlider=function(){if(!this.options.fade){it.apply(this,arguments);return}this.fadeSlides();this.dispatchScrollEvent()};var st=K.positionSliderAtSelected;K.positionSliderAtSelected=function(){if(this.options.fade){this.setTranslateX(0)}st.apply(this,arguments)};K.fadeSlides=function(){if(this.slides.length<2){return}var t=this.getFadeIndexes();var i=this.slides[t.a];var s=this.slides[t.b];var n=this.wrapDifference(i.target,s.target);var h=this.wrapDifference(i.target,-this.x);h=h/n;i.setOpacity(1-h);s.setOpacity(h);var e=t.a;if(this.isDragging){e=h>.5?t.a:t.b}var r=this.fadeHideIndex!=undefined&&this.fadeHideIndex!=e&&this.fadeHideIndex!=t.a&&this.fadeHideIndex!=t.b;if(r){this.slides[this.fadeHideIndex].setOpacity(0)}this.fadeHideIndex=e};K.getFadeIndexes=function(){if(!this.isDragging&&!this.didDragEnd){return{a:this.fadeIndex,b:this.selectedIndex}}if(this.options.wrapAround){return this.getFadeDragWrapIndexes()}else{return this.getFadeDragLimitIndexes()}};K.getFadeDragWrapIndexes=function(){var t=this.slides.map((function(t,i){return this.getSlideDistance(-this.x,i)}),this);var i=t.map((function(t){return Math.abs(t)}));var s=Math.min.apply(Math,i);var n=i.indexOf(s);var h=t[n];var e=this.slides.length;var r=h>=0?1:-1;return{a:n,b:c.modulo(n+r,e)}};K.getFadeDragLimitIndexes=function(){var t=0;for(var i=0;i<this.slides.length-1;i++){var s=this.slides[i];if(-this.x<s.target){break}t=i}return{a:t,b:t+1}};K.wrapDifference=function(t,i){var s=i-t;if(!this.options.wrapAround){return s}var n=s+this.slideableWidth;var h=s-this.slideableWidth;if(Math.abs(n)<Math.abs(s)){s=n}if(Math.abs(h)<Math.abs(s)){s=h}return s};var nt=K._getWrapShiftCells;K._getWrapShiftCells=function(){if(!this.options.fade){nt.apply(this,arguments)}};var ht=K.shiftWrapCells;K.shiftWrapCells=function(){if(!this.options.fade){ht.apply(this,arguments)}};const et=x;const rt=":host{-webkit-box-sizing:border-box;box-sizing:border-box}*,*::before,*::after{-webkit-box-sizing:border-box;box-sizing:border-box}:host{--dot-color:#ccc;--dot-color-active:var(--nano-color-primary, #007495);--navbtns-icon-color:var(--dot-color-active);--navbtns-bg-color:white;--navbtns-icon-color-disabled:var(--dot-color-active);--navbtns-bg-color-disabled:white;--fsbtn-icon-color:var(--dot-color-active);--fsbtn-bg-color:white;display:block;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;overflow:hidden;-webkit-transition:opacity 0.2s;transition:opacity 0.2s;opacity:0}:host([ready]){opacity:1}.slideshow{height:100%;position:relative}.flickity-container{height:0;opacity:0;-webkit-transition:opacity 0.2s;transition:opacity 0.2s}.flickity-container.slides-ready{height:100%}[hidden]{display:none !important}.ui-extras{pointer-events:none;position:absolute;height:100%;width:100%;top:0;left:0}.ui-extras *{pointer-events:all}/*! Flickity v2.2.1\nhttps://flickity.metafizzy.co\n---------------------------------------------- */.flickity-enabled{position:relative;opacity:1}.flickity-enabled:focus{outline:none}.flickity-viewport{overflow:hidden;position:relative;height:100% !important}.flickity-slider{position:absolute;width:100%;height:100%}.flickity-enabled.is-draggable{-webkit-tap-highlight-color:transparent;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.flickity-enabled.is-draggable .flickity-viewport{cursor:move;cursor:-webkit-grab;cursor:grab}.flickity-enabled.is-draggable .flickity-viewport.is-pointer-down{cursor:-webkit-grabbing;cursor:grabbing}.flickity-button{position:absolute;background:var(--navbtns-bg-color);border:none;color:#333;opacity:0.75}.flickity-button:hover{opacity:1;cursor:pointer}.flickity-button:focus{outline:none;-webkit-box-shadow:0 0 0 5px #19f;box-shadow:0 0 0 5px #19f}.flickity-button:active{opacity:0.6}.flickity-button:disabled{opacity:0.3;cursor:auto;pointer-events:none;background:var(--navbtns-bg-color-disabled)}.flickity-button-icon{fill:var(--navbtns-icon-color)}.flickity-button:disabled .flickity-button-icon{fill:var(--navbtns-icon-color-disabled)}.flickity-prev-next-button{top:50%;width:44px;height:44px;border-radius:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%)}.flickity-prev-next-button.previous{left:10px}.flickity-prev-next-button.next{right:10px}.flickity-rtl .flickity-prev-next-button.previous{left:auto;right:10px}.flickity-rtl .flickity-prev-next-button.next{right:auto;left:10px}.flickity-prev-next-button .flickity-button-icon{position:absolute;left:20%;top:20%;width:60%;height:60%}.flickity-page-dots{position:absolute;width:100%;bottom:10px;padding:0;margin:0;list-style:none;text-align:center;line-height:1;z-index:4}.flickity-rtl .flickity-page-dots{direction:rtl}.flickity-page-dots .dot{display:inline-block;width:10px;height:10px;margin:0 8px;border-radius:50%;cursor:pointer;background:var(--dot-color)}.flickity-page-dots .dot.is-selected{opacity:1;background:var(--dot-color-active)}.flickity-enabled.is-fullscreen{position:fixed;left:0;top:0;width:100%;height:100%;background:rgba(0, 0, 0, 0.9);padding-bottom:35px;z-index:100}.flickity-enabled.is-fullscreen .flickity-page-dots{bottom:45px}html.is-flickity-fullscreen{overflow:hidden}.flickity-fullscreen-button{display:block;right:10px;top:10px;width:24px;height:24px;border-radius:4px;background:var(--fsbtn-bg-color);fill:var(--fsbtn-icon-color)}.flickity-rtl .flickity-fullscreen-button{right:auto;left:10px}.flickity-fullscreen-button-exit{display:none}.flickity-enabled.is-fullscreen .flickity-fullscreen-button-exit{display:block}.flickity-enabled.is-fullscreen .flickity-fullscreen-button-view{display:none}.flickity-fullscreen-button .flickity-button-icon{position:absolute;width:16px;height:16px;left:4px;top:4px}.flickity-enabled.is-fade .flickity-slider>*{pointer-events:none;z-index:0}.flickity-enabled.is-fade .flickity-slider ::slotted(.is-selected){pointer-events:auto;z-index:1}";const at=!!document.head.attachShadow;let ot=class{constructor(s){t(this,s);this.nanoSlidesDidLoad=i(this,"nanoSlidesDidLoad",7);this.nanoSlidesReady=i(this,"nanoSlidesReady",7);this.nanoSlidesSelect=i(this,"nanoSlidesSelect",7);this.nanoSlidesChange=i(this,"nanoSlidesChange",7);this.nanoSlidesScroll=i(this,"nanoSlidesScroll",7);this.nanoSlidesTransitionEnd=i(this,"nanoSlidesTransitionEnd",7);this.nanoSlidesDragStart=i(this,"nanoSlidesDragStart",7);this.nanoSlidesDragMove=i(this,"nanoSlidesDragMove",7);this.nanoSlidesDragEnd=i(this,"nanoSlidesDragEnd",7);this.nanoSlidesTap=i(this,"nanoSlidesTap",7);this.nanoSlidesFullscreenChange=i(this,"nanoSlidesFullscreenChange",7);this.flickityReady=false;this.flickity=new Promise((t=>{this.readyflickity=t}));this.didInit=false;this.options={};this.navbtns=false;this.pager=false;this.fullscreenbtn=false;this.fullscreen=false;this.animation="scroll";this.currentSlide=0;this.autoplay=false;this.ready=false;this.parralax=async()=>{const t=await this.flickity;t.slides.forEach(((i,s)=>{let n=this.childrenEles[s];var h=(i.target+t.x)*-1/3;n.style["transform"]="translateX("+h+"px)"}))};this.handleFullscreen=t=>{this.fullscreen=t;this.nanoSlidesFullscreenChange.emit(t)};this.handleSlideSelect=t=>{this.iCurrentSlide=t;this.nanoSlidesSelect.emit(t)}}async optionsChanged(){if(this.flickityReady){const t=await this.getflickity();Object.assign(t.options,this.options);await this.update()}}async navbtnsChanged(){Array.from(this._getRoot().querySelectorAll(".flickity-prev-next-button")).forEach((t=>{t.hidden=!this.navbtns}))}async pagerChanged(){let t=this._getRoot().querySelector(".flickity-page-dots");t.hidden=!this.pager}async fullscreenBtnChanged(){let t=this._getRoot().querySelector(".flickity-fullscreen-button");t.hidden=!this.fullscreenbtn}async fullscreenChanged(t,i){const s=await this.getflickity();if(this.fullscreen)s.viewFullscreen();else if(typeof i!=="undefined")s.exitFullscreen()}async animationChange(t,i){const[s,n]=await Promise.all([this.getflickity(),ft(this.host)]);n.forEach((t=>{t.style["left"]=undefined}));if(i==="parallax"){s.off("scroll",this.parralax);n.forEach(((t,i)=>{if(this.childrenEles&&this.childrenEles[i])this.childrenEles[i].style["transform"]=undefined}));this.update()}switch(this.animation){case"fade":this.options={fade:true,percentPosition:true};break;case"parallax":this.options={fade:false,percentPosition:false};s.on("scroll",this.parralax);break;default:this.options={fade:false,percentPosition:true};break}}currentSlideChange(){if(this.currentSlide!==this.iCurrentSlide)this.slideTo(this.currentSlide)}internalSlideChange(){this.currentSlide=this.iCurrentSlide}async autoPlayChange(){await this.stopAutoplay();if(this.autoplay){if(typeof this.autoplay==="string")this.autoplay=parseInt(this.autoplay);if(this.autoplay>0)this.startAutoplay(this.autoplay)}}async update(){const[t]=await Promise.all([this.getflickity(),ft(this.host)]);this.childrenEles=this.host.querySelectorAll("nano-slide > *");t.reloadCells();t.resize();t.reposition()}async updateAutoHeight(t){const i=document.querySelector(".flickity-viewport");if(i)i.style.transition=t+"ms"}async slideTo(t,i){const s=await this.getflickity();s.select(t,i)}async slideNext(t,i){const s=await this.getflickity();s.next(i,t)}async slidePrev(t,i){const s=await this.getflickity();s.previous(t,i)}async getActiveIndex(){const t=await this.getflickity();return t.selectedIndex}async length(){const t=await this.getflickity();return t.slides.length}async isEnd(){const t=await this.getflickity();return t.selectedIndex===t.slides.length-1}async isBeginning(){const t=await this.getflickity();return t.selectedIndex===0}async startAutoplay(t){const i=await this.getflickity();if(t)this.options={autoPlay:t};setTimeout((()=>i.playPlayer()))}async stopAutoplay(){const t=await this.getflickity();t.stopPlayer()}async lockSwipes(t){const i=await this.getflickity();i.options.draggable=!t;i.updateDraggable()}async getflickity(){return this.flickity}async reload(){this.destroyflickity();setTimeout((()=>this.initflickity()),20)}_getRoot(){return this.host.shadowRoot?this.host.shadowRoot:this.host}_fixClassNames(){let t=this.slideShowEle.className.split(" ").filter((t=>t.match(/^sc-nano/)));let i=this._getRoot().querySelectorAll("*");if(!i)return;Array.from(i).map((i=>{t.map((t=>i.classList.add(t)))}))}destroyflickity(){const t=this.syncflickity;if(t!==undefined){t.destroy();this.flickity=new Promise((t=>{this.readyflickity=t}));this.flickityReady=false;this.syncflickity=undefined;this.ready=false}this.didInit=false}async initflickity(){const t=this.normalizeOptions();await ft(this.host);this.slidesReady=true;this.flickityEl=this.flickityEl||this._getRoot().querySelector(".flickity-container");if(this.flickityEl.classList.contains("flickity-enabled"))this.destroyflickity();setTimeout((()=>{let i=new et(this.flickityEl,t);this.flickityReady=true;if(!this.host.shadowRoot||!at)this._fixClassNames();this.syncflickity=i;this.animationChange();this.navbtnsChanged();this.pagerChanged();this.fullscreenChanged();this.fullscreenBtnChanged();this.readyflickity(i);this.ready=true;if(!this.host.getBoundingClientRect().height){const t=this.resizeO=new e((()=>{i.resize();this.resizeO.disconnect()}));t.observe(this.host)}}),100)}normalizeOptions(){const t={cellSelector:"nano-slide",contain:true,prevNextButtons:true,fullscreen:true,accessibility:true,imagesLoaded:true,pageDots:true};if(this.animation==="fade"){t.fade=true}if(this.currentSlide>0){t.initialIndex=this.currentSlide}if(this.autoplay){if(typeof this.autoplay==="string")this.autoplay=parseInt(this.autoplay);if(this.autoplay>0)t.autoPlay=this.autoplay}const i={ready:()=>{setTimeout((()=>{this.nanoSlidesReady.emit()}),20)},select:this.handleSlideSelect,change:this.nanoSlidesChange.emit,scroll:this.nanoSlidesScroll.emit,settle:this.nanoSlidesTransitionEnd.emit,dragStart:this.nanoSlidesDragStart.emit,dragMove:this.nanoSlidesDragMove.emit,dragEnd:this.nanoSlidesDragEnd.emit,staticClick:this.nanoSlidesTap.emit,fullscreenChange:this.handleFullscreen};const s=!!this.options&&!!this.options.on?this.options.on:{};const n={on:Object.assign(Object.assign({},s),i)};return Object.assign(Object.assign(Object.assign({},t),n),this.options)}componentDidLoad(){if(typeof window!=="undefined"&&window.MutationObserver){const t=this.mutationO=new MutationObserver((t=>{if(t[0].addedNodes[0]&&t[0].addedNodes[0].nodeName.toLowerCase()==="nano-slide"&&this.flickityReady){this.update()}}));t.observe(this.host,{childList:true,subtree:true})}}componentWillLoad(){this.nanoSlidesDidLoad.emit();if(!this.didInit){this.didInit=true;this.initflickity()}}disconnectedCallback(){if(this.mutationO){this.mutationO.disconnect();this.mutationO=undefined}if(this.resizeO)this.resizeO.disconnect();this.destroyflickity()}render(){return s(n,null,s("div",{class:"slideshow",ref:t=>this.slideShowEle=t},s("div",{ref:t=>this.flickityEl=t,class:{"flickity-container":true,"slides-ready":this.slidesReady,"slides-not-ready":!this.slidesReady}},s("slot",null)),s("div",{class:"ui-extras"},s("slot",{name:"ui"}))))}get host(){return h(this)}static get watchers(){return{options:["optionsChanged"],navbtns:["navbtnsChanged"],pager:["pagerChanged"],fullscreenbtn:["fullscreenBtnChanged"],fullscreen:["fullscreenChanged"],animation:["animationChange"],currentSlide:["currentSlideChange"],iCurrentSlide:["internalSlideChange"],autoplay:["autoPlayChange"]}}};const ft=t=>{const i=Array.from(t.querySelectorAll("nano-slide"));let s=i.filter((t=>!t.ready));if(!s.length)return Promise.resolve(i);return new Promise((n=>{const h=e=>{s=s.filter((t=>t!==e.target));if(!s.length){n(i);t.removeEventListener("nanoSlideReady",h)}};t.addEventListener("nanoSlideReady",h);t.addEventListener("nanoslideready",h)}))};ot.style=rt;export{ot as nano_slides};
-//# sourceMappingURL=p-23f65b34.entry.js.map
+(function(i,s){if(t.exports){t.exports=s(i,S)}else{i.Unidragger=s(i,i.Unipointer)}})(window,(function t(i,s){function n(){}var h=n.prototype=Object.create(s.prototype);h.bindHandles=function(){this._bindHandles(true)};h.unbindHandles=function(){this._bindHandles(false)};h._bindHandles=function(t){t=t===undefined?true:t;var s=t?"addEventListener":"removeEventListener";var n=t?this._touchActionValue:"";for(var h=0;h<this.handles.length;h++){var e=this.handles[h];this._bindStartEvent(e,t);e[s]("click",this);if(i.PointerEvent){e.style.touchAction=n}}};h._touchActionValue="none";h.pointerDown=function(t,i){var s=this.okayPointerDown(t);if(!s){return}this.pointerDownPointer={pageX:i.pageX,pageY:i.pageY};t.preventDefault();this.pointerDownBlur();this._bindPostStartEvents(t);this.emitEvent("pointerDown",[t,i])};var e={TEXTAREA:true,INPUT:true,SELECT:true,OPTION:true};var r={radio:true,checkbox:true,button:true,submit:true,image:true,file:true};h.okayPointerDown=function(t){var i=e[t.target.nodeName];var s=r[t.target.type];var n=!i||s;if(!n){this._pointerReset()}return n};h.pointerDownBlur=function(){var t=document.activeElement;var i=t&&t.blur&&t!=document.body;if(i){t.blur()}};h.pointerMove=function(t,i){var s=this._dragPointerMove(t,i);this.emitEvent("pointerMove",[t,i,s]);this._dragMove(t,i,s)};h._dragPointerMove=function(t,i){var s={x:i.pageX-this.pointerDownPointer.pageX,y:i.pageY-this.pointerDownPointer.pageY};if(!this.isDragging&&this.hasDragStarted(s)){this._dragStart(t,i)}return s};h.hasDragStarted=function(t){return Math.abs(t.x)>3||Math.abs(t.y)>3};h.pointerUp=function(t,i){this.emitEvent("pointerUp",[t,i]);this._dragPointerUp(t,i)};h._dragPointerUp=function(t,i){if(this.isDragging){this._dragEnd(t,i)}else{this._staticClick(t,i)}};h._dragStart=function(t,i){this.isDragging=true;this.isPreventingClicks=true;this.dragStart(t,i)};h.dragStart=function(t,i){this.emitEvent("dragStart",[t,i])};h._dragMove=function(t,i,s){if(!this.isDragging){return}this.dragMove(t,i,s)};h.dragMove=function(t,i,s){t.preventDefault();this.emitEvent("dragMove",[t,i,s])};h._dragEnd=function(t,i){this.isDragging=false;setTimeout(function(){delete this.isPreventingClicks}.bind(this));this.dragEnd(t,i)};h.dragEnd=function(t,i){this.emitEvent("dragEnd",[t,i])};h.onclick=function(t){if(this.isPreventingClicks){t.preventDefault()}};h._staticClick=function(t,i){if(this.isIgnoringMouseUp&&t.type=="mouseup"){return}this.staticClick(t,i);if(t.type!="mouseup"){this.isIgnoringMouseUp=true;setTimeout(function(){delete this.isIgnoringMouseUp}.bind(this),400)}};h.staticClick=function(t,i){this.emitEvent("staticClick",[t,i])};n.getPointerPoint=s.getPointerPoint;return n}))}));c.extend(x.defaults,{draggable:">1",dragThreshold:3});x.createMethods.push("_createDrag");var L=x.prototype;c.extend(L,z.prototype);L._touchActionValue="pan-y";var T="createTouch"in document;var P=false;L._createDrag=function(){this.on("activate",this.onActivateDrag);this.on("uiChange",this._uiChangeDrag);this.on("deactivate",this.onDeactivateDrag);this.on("cellChange",this.updateDraggable);if(T&&!P){window.addEventListener("touchmove",(function(){}));P=true}};L.onActivateDrag=function(){this.handles=[this.viewport];this.bindHandles();this.updateDraggable()};L.onDeactivateDrag=function(){this.unbindHandles();this.element.classList.remove("is-draggable")};L.updateDraggable=function(){if(this.options.draggable==">1"){this.isDraggable=this.slides.length>1}else{this.isDraggable=this.options.draggable}if(this.isDraggable){this.element.classList.add("is-draggable")}else{this.element.classList.remove("is-draggable")}};L.bindDrag=function(){this.options.draggable=true;this.updateDraggable()};L.unbindDrag=function(){this.options.draggable=false;this.updateDraggable()};L._uiChangeDrag=function(){delete this.isFreeScrolling};L.pointerDown=function(t,i){if(!this.isDraggable){this._pointerDownDefault(t,i);return}var s=this.okayPointerDown(t);if(!s){return}this._pointerDownPreventDefault(t);this.pointerDownFocus(t);if(document.activeElement!=this.element){this.pointerDownBlur()}this.dragX=this.x;this.viewport.classList.add("is-pointer-down");this.pointerDownScroll=E();window.addEventListener("scroll",this);this._pointerDownDefault(t,i)};L._pointerDownDefault=function(t,i){this.pointerDownPointer={pageX:i.pageX,pageY:i.pageY};this._bindPostStartEvents(t);this.dispatchEvent("pointerDown",t,[i])};var A={INPUT:true,TEXTAREA:true,SELECT:true};L.pointerDownFocus=function(t){var i=A[t.target.nodeName];if(!i){this.focus()}};L._pointerDownPreventDefault=function(t){var i=t.type=="touchstart";var s=t.pointerType=="touch";var n=A[t.target.nodeName];if(!i&&!s&&!n){t.preventDefault()}};L.hasDragStarted=function(t){return Math.abs(t.x)>this.options.dragThreshold};L.pointerUp=function(t,i){delete this.isTouchScrolling;this.viewport.classList.remove("is-pointer-down");this.dispatchEvent("pointerUp",t,[i]);this._dragPointerUp(t,i)};L.pointerDone=function(){window.removeEventListener("scroll",this);delete this.pointerDownScroll};L.dragStart=function(t,i){if(!this.isDraggable){return}this.dragStartPosition=this.x;this.startAnimation();window.removeEventListener("scroll",this);this.dispatchEvent("dragStart",t,[i])};L.pointerMove=function(t,i){var s=this._dragPointerMove(t,i);this.dispatchEvent("pointerMove",t,[i,s]);this._dragMove(t,i,s)};L.dragMove=function(t,i,s){if(!this.isDraggable){return}t.preventDefault();this.previousDragX=this.dragX;var n=this.options.rightToLeft?-1:1;if(this.options.wrapAround){s.x=s.x%this.slideableWidth}var h=this.dragStartPosition+s.x*n;if(!this.options.wrapAround&&this.slides.length){var e=Math.max(-this.slides[0].target,this.dragStartPosition);h=h>e?(h+e)*.5:h;var r=Math.min(-this.getLastSlide().target,this.dragStartPosition);h=h<r?(h+r)*.5:h}this.dragX=h;this.dragMoveTime=new Date;this.dispatchEvent("dragMove",t,[i,s])};L.dragEnd=function(t,i){if(!this.isDraggable){return}if(this.options.freeScroll){this.isFreeScrolling=true}var s=this.dragEndRestingSelect();if(this.options.freeScroll&&!this.options.wrapAround){var n=this.getRestingPosition();this.isFreeScrolling=-n>this.slides[0].target&&-n<this.getLastSlide().target}else if(!this.options.freeScroll&&s==this.selectedIndex){s+=this.dragEndBoostSelect()}delete this.previousDragX;this.isDragSelect=this.options.wrapAround;this.select(s);delete this.isDragSelect;this.dispatchEvent("dragEnd",t,[i])};L.dragEndRestingSelect=function(){var t=this.getRestingPosition();var i=Math.abs(this.getSlideDistance(-t,this.selectedIndex));var s=this._getClosestResting(t,i,1);var n=this._getClosestResting(t,i,-1);var h=s.distance<n.distance?s.index:n.index;return h};L._getClosestResting=function(t,i,s){var n=this.selectedIndex;var h=Infinity;var e=this.options.contain&&!this.options.wrapAround?function(t,i){return t<=i}:function(t,i){return t<i};while(e(i,h)){n+=s;h=i;i=this.getSlideDistance(-t,n);if(i===null){break}i=Math.abs(i)}return{distance:h,index:n-s}};L.getSlideDistance=function(t,i){var s=this.slides.length;var n=this.options.wrapAround&&s>1;var h=n?c.modulo(i,s):i;var e=this.slides[h];if(!e){return null}var r=n?this.slideableWidth*Math.floor(i/s):0;return t-(e.target+r)};L.dragEndBoostSelect=function(){if(this.previousDragX===undefined||!this.dragMoveTime||new Date-this.dragMoveTime>100){return 0}var t=this.getSlideDistance(-this.dragX,this.selectedIndex);var i=this.previousDragX-this.dragX;if(t>0&&i>0){return 1}else if(t<0&&i<0){return-1}return 0};L.staticClick=function(t,i){var s=this.getParentCell(t.target);var n=s&&s.element;var h=s&&this.cells.indexOf(s);this.dispatchEvent("staticClick",t,[i,n,h])};L.onscroll=function(){var t=E();var i=this.pointerDownScroll.x-t.x;var s=this.pointerDownScroll.y-t.y;if(Math.abs(i)>3||Math.abs(s)>3){this._pointerDone()}};function E(){return{x:window.pageXOffset,y:window.pageYOffset}}var D="http://www.w3.org/2000/svg";function O(t,i){this.direction=t;this.parent=i;this.parentElement=this.parent.element.shadowRoot||this.parent.element;this._create()}O.prototype=Object.create(S.prototype);O.prototype._create=function(){this.isEnabled=true;this.isPrevious=this.direction==-1;var t=this.parent.options.rightToLeft?1:-1;this.isLeft=this.direction==t;var i=this.element=document.createElement("button");i.className="flickity-button flickity-prev-next-button";i.className+=this.isPrevious?" previous":" next";i.setAttribute("type","button");this.disable();i.setAttribute("aria-label",this.isPrevious?"Previous":"Next");var s=this.createSVG();i.appendChild(s);this.parent.on("select",this.update.bind(this));this.on("pointerDown",this.parent.childUIPointerDown.bind(this.parent))};O.prototype.activate=function(){this.bindStartEvent(this.element);this.element.addEventListener("click",this);this.parentElement.appendChild(this.element)};O.prototype.deactivate=function(){this.parentElement.removeChild(this.element);this.unbindStartEvent(this.element);this.element.removeEventListener("click",this)};O.prototype.createSVG=function(){var t=document.createElementNS(D,"svg");t.setAttribute("class","flickity-button-icon");t.setAttribute("viewBox","0 0 100 100");var i=document.createElementNS(D,"path");var s=j(this.parent.options.arrowShape);i.setAttribute("d",s);i.setAttribute("class","arrow");if(!this.isLeft){i.setAttribute("transform","translate(100, 100) rotate(180) ")}t.appendChild(i);return t};function j(t){if(typeof t=="string"){return t}return"M "+t.x0+",50"+" L "+t.x1+","+(t.y1+50)+" L "+t.x2+","+(t.y2+50)+" L "+t.x3+",50 "+" L "+t.x2+","+(50-t.y2)+" L "+t.x1+","+(50-t.y1)+" Z"}O.prototype.handleEvent=c.handleEvent;O.prototype.onclick=function(){if(!this.isEnabled){return}this.parent.uiChange();var t=this.isPrevious?"previous":"next";this.parent[t]()};O.prototype.enable=function(){if(this.isEnabled){return}this.element.disabled=false;this.isEnabled=true};O.prototype.disable=function(){if(!this.isEnabled){return}this.element.disabled=true;this.isEnabled=false};O.prototype.update=function(){var t=this.parent.slides;if(this.parent.options.wrapAround&&t.length>1){this.enable();return}var i=t.length?t.length-1:0;var s=this.isPrevious?0:i;var n=this.parent.selectedIndex==s?"disable":"enable";this[n]()};O.prototype.destroy=function(){this.deactivate();this.allOff()};c.extend(x.defaults,{prevNextButtons:true,arrowShape:{x0:10,x1:60,y1:50,x2:70,y2:40,x3:30}});x.createMethods.push("_createPrevNextButtons");var R=x.prototype;R._createPrevNextButtons=function(){if(!this.options.prevNextButtons){return}this.prevButton=new O(-1,this);this.nextButton=new O(1,this);this.on("activate",this.activatePrevNextButtons)};R.activatePrevNextButtons=function(){this.prevButton.activate();this.nextButton.activate();this.on("deactivate",this.deactivatePrevNextButtons)};R.deactivatePrevNextButtons=function(){this.prevButton.deactivate();this.nextButton.deactivate();this.off("deactivate",this.deactivatePrevNextButtons)};x.PrevNextButton=O;function N(t){this.parent=t;this.parentElement=this.parent.element.shadowRoot||this.parent.element;this._create()}N.prototype=Object.create(S.prototype);N.prototype._create=function(){this.holder=document.createElement("ol");this.holder.className="flickity-page-dots";this.dots=[];this.handleClick=this.onClick.bind(this);this.on("pointerDown",this.parent.childUIPointerDown.bind(this.parent))};N.prototype.activate=function(){this.setDots();this.holder.addEventListener("click",this.handleClick);this.bindStartEvent(this.holder);this.parentElement.appendChild(this.holder)};N.prototype.deactivate=function(){this.holder.removeEventListener("click",this.handleClick);this.unbindStartEvent(this.holder);this.parentElement.removeChild(this.holder)};N.prototype.setDots=function(){var t=this.parent.slides.length-this.dots.length;if(t>0){this.addDots(t)}else if(t<0){this.removeDots(-t)}};N.prototype.addDots=function(t){var i=document.createDocumentFragment();var s=[];var n=this.dots.length;var h=n+t;for(var e=n;e<h;e++){var r=document.createElement("li");r.classList.add("dot");r.setAttribute("aria-label","Page dot "+(e+1));i.appendChild(r);s.push(r)}this.holder.appendChild(i);this.dots=this.dots.concat(s)};N.prototype.removeDots=function(t){var i=this.dots.splice(this.dots.length-t,t);i.forEach((function(t){this.holder.removeChild(t)}),this)};N.prototype.updateSelected=function(){if(this.selectedDot){this.selectedDot.classList.remove("is-selected");this.selectedDot.removeAttribute("aria-current")}if(!this.dots.length){return}this.selectedDot=this.dots[this.parent.selectedIndex];this.selectedDot.classList.add("is-selected");this.selectedDot.setAttribute("aria-current","step")};N.prototype.onTap=N.prototype.onClick=function(t){var i=t.target;if(i.nodeName!="LI"){return}this.parent.uiChange();var s=this.dots.indexOf(i);this.parent.select(s)};N.prototype.destroy=function(){this.deactivate();this.allOff()};x.PageDots=N;c.extend(x.defaults,{pageDots:true});x.createMethods.push("_createPageDots");var I=x.prototype;I._createPageDots=function(){if(!this.options.pageDots){return}this.pageDots=new N(this);this.on("activate",this.activatePageDots);this.on("select",this.updateSelectedPageDots);this.on("cellChange",this.updatePageDots);this.on("resize",this.updatePageDots);this.on("deactivate",this.deactivatePageDots)};I.activatePageDots=function(){this.pageDots.activate()};I.updateSelectedPageDots=function(){this.pageDots.updateSelected()};I.updatePageDots=function(){this.pageDots.setDots()};I.deactivatePageDots=function(){this.pageDots.deactivate()};x.PageDots=N;function B(t){this.parent=t;this.state="stopped";this.onVisibilityChange=this.visibilityChange.bind(this);this.onVisibilityPlay=this.visibilityPlay.bind(this)}B.prototype=Object.create(o.prototype);B.prototype.play=function(){if(this.state=="playing"){return}var t=document.hidden;if(t){document.addEventListener("visibilitychange",this.onVisibilityPlay);return}this.state="playing";document.addEventListener("visibilitychange",this.onVisibilityChange);this.tick()};B.prototype.tick=function(){if(this.state!="playing"){return}var t=this.parent.options.autoPlay;t=typeof t=="number"?t:3e3;var i=this;this.clear();this.timeout=setTimeout((function(){i.parent.next(true);i.tick()}),t)};B.prototype.stop=function(){this.state="stopped";this.clear();document.removeEventListener("visibilitychange",this.onVisibilityChange)};B.prototype.clear=function(){clearTimeout(this.timeout)};B.prototype.pause=function(){if(this.state=="playing"){this.state="paused";this.clear()}};B.prototype.unpause=function(){if(this.state=="paused"){this.play()}};B.prototype.visibilityChange=function(){var t=document.hidden;this[t?"pause":"unpause"]()};B.prototype.visibilityPlay=function(){this.play();document.removeEventListener("visibilitychange",this.onVisibilityPlay)};c.extend(x.defaults,{pauseAutoPlayOnHover:true});x.createMethods.push("_createPlayer");var F=x.prototype;F._createPlayer=function(){this.player=new B(this);this.on("activate",this.activatePlayer);this.on("uiChange",this.stopPlayer);this.on("pointerDown",this.stopPlayer);this.on("deactivate",this.deactivatePlayer)};F.activatePlayer=function(){if(!this.options.autoPlay){return}this.player.play();this.element.addEventListener("mouseenter",this)};F.playPlayer=function(){this.player.play()};F.stopPlayer=function(){this.player.stop()};F.pausePlayer=function(){this.player.pause()};F.unpausePlayer=function(){this.player.unpause()};F.deactivatePlayer=function(){this.player.stop();this.element.removeEventListener("mouseenter",this)};F.onmouseenter=function(){if(!this.options.pauseAutoPlayOnHover){return}this.player.pause();this.element.addEventListener("mouseleave",this)};F.onmouseleave=function(){this.player.unpause();this.element.removeEventListener("mouseleave",this)};x.Player=B;function H(t){var i=document.createDocumentFragment();t.forEach((function(t){i.appendChild(t.element)}));return i}var _=x.prototype;_.insert=function(t,i){var s=this._makeCells(t);if(!s||!s.length){return}var n=this.cells.length;i=i===undefined?n:i;var h=H(s);var e=i==n;if(e){this.slider.appendChild(h)}else{var r=this.cells[i].element;this.slider.insertBefore(h,r)}if(i===0){this.cells=s.concat(this.cells)}else if(e){this.cells=this.cells.concat(s)}else{var a=this.cells.splice(i,n-i);this.cells=this.cells.concat(s).concat(a)}this._sizeCells(s);this.cellChange(i,true)};_.append=function(t){this.insert(t,this.cells.length)};_.prepend=function(t){this.insert(t,0)};_.remove=function(t){var i=this.getCells(t);if(!i||!i.length){return}var s=this.cells.length-1;i.forEach((function(t){t.remove();var i=this.cells.indexOf(t);s=Math.min(i,s);c.removeFrom(this.cells,t)}),this);this.cellChange(s,true)};_.cellSizeChange=function(t){var i=this.getCell(t);if(!i){return}i.getSize();var s=this.cells.indexOf(i);this.cellChange(s)};_.cellChange=function(t,i){var s=this.selectedElement;this._positionCells(t);this._getWrapShiftCells();this.setGallerySize();var n=this.getCell(s);if(n){this.selectedIndex=this.getCellSlideIndex(n)}this.selectedIndex=Math.min(this.slides.length-1,this.selectedIndex);this.emitEvent("cellChange",[t]);this.select(this.selectedIndex);if(i){this.positionSliderAtSelected()}};x.createMethods.push("_createLazyload");var W=x.prototype;W._createLazyload=function(){this.on("select",this.lazyLoad)};W.lazyLoad=function(){var t=this.options.lazyLoad;if(!t){return}var i=typeof t=="number"?t:0;var s=this.getAdjacentCellElements(i);var n=[];s.forEach((function(t){var i=V(t);n=n.concat(i)}));n.forEach((function(t){new X(t,this)}),this)};function V(t){if(t.nodeName=="IMG"){var i=t.getAttribute("data-flickity-lazyload");var s=t.getAttribute("data-flickity-lazyload-src");var n=t.getAttribute("data-flickity-lazyload-srcset");if(i||s||n){return[t]}}var h="img[data-flickity-lazyload], "+"img[data-flickity-lazyload-src], img[data-flickity-lazyload-srcset]";var e=t.querySelectorAll(h);return c.makeArray(e)}function X(t,i){this.img=t;this.flickity=i;this.load()}X.prototype.handleEvent=c.handleEvent;X.prototype.load=function(){this.img.addEventListener("load",this);this.img.addEventListener("error",this);var t=this.img.getAttribute("data-flickity-lazyload")||this.img.getAttribute("data-flickity-lazyload-src");var i=this.img.getAttribute("data-flickity-lazyload-srcset");this.img.src=t;if(i){this.img.setAttribute("srcset",i)}this.img.removeAttribute("data-flickity-lazyload");this.img.removeAttribute("data-flickity-lazyload-src");this.img.removeAttribute("data-flickity-lazyload-srcset")};X.prototype.onload=function(t){this.complete(t,"flickity-lazyloaded")};X.prototype.onerror=function(t){this.complete(t,"flickity-lazyerror")};X.prototype.complete=function(t,i){this.img.removeEventListener("load",this);this.img.removeEventListener("error",this);var s=this.flickity.getParentCell(this.img);var n=s&&s.element;this.flickity.cellSizeChange(n);this.img.classList.add(i);this.flickity.dispatchEvent("lazyLoad",t,n)};x.LazyLoader=X;x.createMethods.push("_createFullscreen");var Z=x.prototype;Z._createFullscreen=function(){this.isFullscreen=false;if(!this.options.fullscreen){return}this.viewFullscreenButton=new Y("view",this);this.exitFullscreenButton=new Y("exit",this);this.on("activate",this._changeFullscreenActive);this.on("deactivate",this._changeFullscreenActive)};Z._changeFullscreenActive=function(){var t=this.isActive?"appendChild":"removeChild";this.element[t](this.viewFullscreenButton.element);this.element[t](this.exitFullscreenButton.element);var i=this.isActive?"activate":"deactivate";this.viewFullscreenButton[i]();this.exitFullscreenButton[i]()};Z.viewFullscreen=function(){this._changeFullscreen(true);this.focus()};Z.exitFullscreen=function(){this._changeFullscreen(false)};Z._changeFullscreen=function(t){if(this.isFullscreen==t){return}this.isFullscreen=t;var i=t?"add":"remove";document.documentElement.classList[i]("is-flickity-fullscreen");this.element.classList[i]("is-fullscreen");this.resize();if(this.isFullscreen){this.reposition()}this.dispatchEvent("fullscreenChange",null,[t])};Z.toggleFullscreen=function(){this._changeFullscreen(!this.isFullscreen)};var U=Z.setGallerySize;Z.setGallerySize=function(){if(!this.options.setGallerySize){return}if(this.isFullscreen){this.viewport.style.height=""}else{U.call(this)}};x.keyboardHandlers[27]=function(){this.exitFullscreen()};function Y(t,i){this.name=t;this.createButton();this.createIcon();this.onClick=function(){i[t+"Fullscreen"]()};this.clickHandler=this.onClick.bind(this)}Y.prototype.createButton=function(){var t=this.element=document.createElement("button");t.className="flickity-button flickity-fullscreen-button "+"flickity-fullscreen-button-"+this.name;t.setAttribute("type","button");var i=G(this.name+" full-screen");t.setAttribute("aria-label",i);t.title=i};function G(t){return t[0].toUpperCase()+t.slice(1)}var J="http://www.w3.org/2000/svg";var q={view:"M15,20,7,28h5v4H0V20H4v5l8-8Zm5-5,8-8v5h4V0H20V4h5l-8,8Z",exit:"M32,3l-7,7h5v4H18V2h4V7l7-7ZM3,32l7-7v5h4V18H2v4H7L0,29Z"};Y.prototype.createIcon=function(){var t=document.createElementNS(J,"svg");t.setAttribute("class","flickity-button-icon");t.setAttribute("viewBox","0 0 32 32");var i=document.createElementNS(J,"path");var s=q[this.name];i.setAttribute("d",s);t.appendChild(i);this.element.appendChild(t)};Y.prototype.activate=function(){this.element.addEventListener("click",this.clickHandler)};Y.prototype.deactivate=function(){this.element.removeEventListener("click",this.clickHandler)};x.FullscreenButton=Y;var Q=x.Slide;var $=Q.prototype.updateTarget;Q.prototype.updateTarget=function(){$.apply(this,arguments);if(!this.parent.options.fade){return}var t=this.target-this.x;var i=this.cells[0].x;this.cells.forEach((function(s){var n=s.x-i-t;s.renderPosition(n)}))};Q.prototype.setOpacity=function(t){this.cells.forEach((function(i){i.element.style.opacity=t}))};var K=x.prototype;x.createMethods.push("_createFade");K._createFade=function(){this.fadeIndex=this.selectedIndex;this.prevSelectedIndex=this.selectedIndex;this.on("select",this.onSelectFade);this.on("dragEnd",this.onDragEndFade);this.on("settle",this.onSettleFade);this.on("activate",this.onActivateFade);this.on("deactivate",this.onDeactivateFade)};var tt=K.updateSlides;K.updateSlides=function(){tt.apply(this,arguments);if(!this.options.fade){return}this.slides.forEach((function(t,i){var s=i==this.selectedIndex?1:0;t.setOpacity(s)}),this)};K.onSelectFade=function(){this.fadeIndex=Math.min(this.prevSelectedIndex,this.slides.length-1);this.prevSelectedIndex=this.selectedIndex};K.onSettleFade=function(){delete this.didDragEnd;if(!this.options.fade){return}this.selectedSlide.setOpacity(1);var t=this.slides[this.fadeIndex];if(t&&this.fadeIndex!=this.selectedIndex){this.slides[this.fadeIndex].setOpacity(0)}};K.onDragEndFade=function(){this.didDragEnd=true};K.onActivateFade=function(){if(this.options.fade){this.element.classList.add("is-fade")}};K.onDeactivateFade=function(){if(!this.options.fade){return}this.element.classList.remove("is-fade");this.slides.forEach((function(t){t.setOpacity("")}))};var it=K.positionSlider;K.positionSlider=function(){if(!this.options.fade){it.apply(this,arguments);return}this.fadeSlides();this.dispatchScrollEvent()};var st=K.positionSliderAtSelected;K.positionSliderAtSelected=function(){if(this.options.fade){this.setTranslateX(0)}st.apply(this,arguments)};K.fadeSlides=function(){if(this.slides.length<2){return}var t=this.getFadeIndexes();var i=this.slides[t.a];var s=this.slides[t.b];var n=this.wrapDifference(i.target,s.target);var h=this.wrapDifference(i.target,-this.x);h=h/n;i.setOpacity(1-h);s.setOpacity(h);var e=t.a;if(this.isDragging){e=h>.5?t.a:t.b}var r=this.fadeHideIndex!=undefined&&this.fadeHideIndex!=e&&this.fadeHideIndex!=t.a&&this.fadeHideIndex!=t.b;if(r){this.slides[this.fadeHideIndex].setOpacity(0)}this.fadeHideIndex=e};K.getFadeIndexes=function(){if(!this.isDragging&&!this.didDragEnd){return{a:this.fadeIndex,b:this.selectedIndex}}if(this.options.wrapAround){return this.getFadeDragWrapIndexes()}else{return this.getFadeDragLimitIndexes()}};K.getFadeDragWrapIndexes=function(){var t=this.slides.map((function(t,i){return this.getSlideDistance(-this.x,i)}),this);var i=t.map((function(t){return Math.abs(t)}));var s=Math.min.apply(Math,i);var n=i.indexOf(s);var h=t[n];var e=this.slides.length;var r=h>=0?1:-1;return{a:n,b:c.modulo(n+r,e)}};K.getFadeDragLimitIndexes=function(){var t=0;for(var i=0;i<this.slides.length-1;i++){var s=this.slides[i];if(-this.x<s.target){break}t=i}return{a:t,b:t+1}};K.wrapDifference=function(t,i){var s=i-t;if(!this.options.wrapAround){return s}var n=s+this.slideableWidth;var h=s-this.slideableWidth;if(Math.abs(n)<Math.abs(s)){s=n}if(Math.abs(h)<Math.abs(s)){s=h}return s};var nt=K._getWrapShiftCells;K._getWrapShiftCells=function(){if(!this.options.fade){nt.apply(this,arguments)}};var ht=K.shiftWrapCells;K.shiftWrapCells=function(){if(!this.options.fade){ht.apply(this,arguments)}};const et=x;const rt=":host{-webkit-box-sizing:border-box;box-sizing:border-box}*,*::before,*::after{-webkit-box-sizing:border-box;box-sizing:border-box}[hidden]{display:none !important}:host{--dot-color:#ccc;--dot-color-active:var(--nano-color-primary, #007495);--navbtns-icon-color:var(--dot-color-active);--navbtns-bg-color:white;--navbtns-icon-color-disabled:var(--dot-color-active);--navbtns-bg-color-disabled:white;--fsbtn-icon-color:var(--dot-color-active);--fsbtn-bg-color:white;display:block;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;overflow:hidden;-webkit-transition:opacity 0.2s;transition:opacity 0.2s;opacity:0}:host([ready]){opacity:1}.slideshow{height:100%;position:relative}.flickity-container{height:0;opacity:0;-webkit-transition:opacity 0.2s;transition:opacity 0.2s}.flickity-container.slides-ready{height:100%}[hidden]{display:none !important}.ui-extras{pointer-events:none;position:absolute;height:100%;width:100%;top:0;left:0}.ui-extras *{pointer-events:all}/*! Flickity v2.2.1\nhttps://flickity.metafizzy.co\n---------------------------------------------- */.flickity-enabled{position:relative;opacity:1}.flickity-enabled:focus{outline:none}.flickity-viewport{overflow:hidden;position:relative;height:100% !important}.flickity-slider{position:absolute;width:100%;height:100%}.flickity-enabled.is-draggable{-webkit-tap-highlight-color:transparent;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.flickity-enabled.is-draggable .flickity-viewport{cursor:move;cursor:-webkit-grab;cursor:grab}.flickity-enabled.is-draggable .flickity-viewport.is-pointer-down{cursor:-webkit-grabbing;cursor:grabbing}.flickity-button{position:absolute;background:var(--navbtns-bg-color);border:none;color:#333;opacity:0.75}.flickity-button:hover{opacity:1;cursor:pointer}.flickity-button:focus{outline:none;-webkit-box-shadow:0 0 0 5px #19f;box-shadow:0 0 0 5px #19f}.flickity-button:active{opacity:0.6}.flickity-button:disabled{opacity:0.3;cursor:auto;pointer-events:none;background:var(--navbtns-bg-color-disabled)}.flickity-button-icon{fill:var(--navbtns-icon-color)}.flickity-button:disabled .flickity-button-icon{fill:var(--navbtns-icon-color-disabled)}.flickity-prev-next-button{top:50%;width:44px;height:44px;border-radius:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%)}.flickity-prev-next-button.previous{left:10px}.flickity-prev-next-button.next{right:10px}.flickity-rtl .flickity-prev-next-button.previous{left:auto;right:10px}.flickity-rtl .flickity-prev-next-button.next{right:auto;left:10px}.flickity-prev-next-button .flickity-button-icon{position:absolute;left:20%;top:20%;width:60%;height:60%}.flickity-page-dots{position:absolute;width:100%;bottom:10px;padding:0;margin:0;list-style:none;text-align:center;line-height:1;z-index:4}.flickity-rtl .flickity-page-dots{direction:rtl}.flickity-page-dots .dot{display:inline-block;width:10px;height:10px;margin:0 8px;border-radius:50%;cursor:pointer;background:var(--dot-color)}.flickity-page-dots .dot.is-selected{opacity:1;background:var(--dot-color-active)}.flickity-enabled.is-fullscreen{position:fixed;left:0;top:0;width:100%;height:100%;background:rgba(0, 0, 0, 0.9);padding-bottom:35px;z-index:100}.flickity-enabled.is-fullscreen .flickity-page-dots{bottom:45px}html.is-flickity-fullscreen{overflow:hidden}.flickity-fullscreen-button{display:block;right:10px;top:10px;width:24px;height:24px;border-radius:4px;background:var(--fsbtn-bg-color);fill:var(--fsbtn-icon-color)}.flickity-rtl .flickity-fullscreen-button{right:auto;left:10px}.flickity-fullscreen-button-exit{display:none}.flickity-enabled.is-fullscreen .flickity-fullscreen-button-exit{display:block}.flickity-enabled.is-fullscreen .flickity-fullscreen-button-view{display:none}.flickity-fullscreen-button .flickity-button-icon{position:absolute;width:16px;height:16px;left:4px;top:4px}.flickity-enabled.is-fade .flickity-slider>*{pointer-events:none;z-index:0}.flickity-enabled.is-fade .flickity-slider ::slotted(.is-selected){pointer-events:auto;z-index:1}";const at=!!document.head.attachShadow;let ot=class{constructor(s){t(this,s);this.nanoSlidesDidLoad=i(this,"nanoSlidesDidLoad",7);this.nanoSlidesReady=i(this,"nanoSlidesReady",7);this.nanoSlidesSelect=i(this,"nanoSlidesSelect",7);this.nanoSlidesChange=i(this,"nanoSlidesChange",7);this.nanoSlidesScroll=i(this,"nanoSlidesScroll",7);this.nanoSlidesTransitionEnd=i(this,"nanoSlidesTransitionEnd",7);this.nanoSlidesDragStart=i(this,"nanoSlidesDragStart",7);this.nanoSlidesDragMove=i(this,"nanoSlidesDragMove",7);this.nanoSlidesDragEnd=i(this,"nanoSlidesDragEnd",7);this.nanoSlidesTap=i(this,"nanoSlidesTap",7);this.nanoSlidesFullscreenChange=i(this,"nanoSlidesFullscreenChange",7);this.flickityReady=false;this.flickity=new Promise((t=>{this.readyflickity=t}));this.didInit=false;this.options={};this.navbtns=false;this.pager=false;this.fullscreenbtn=false;this.fullscreen=false;this.animation="scroll";this.currentSlide=0;this.autoplay=false;this.ready=false;this.parralax=async()=>{const t=await this.flickity;t.slides.forEach(((i,s)=>{let n=this.childrenEles[s];var h=(i.target+t.x)*-1/3;n.style["transform"]="translateX("+h+"px)"}))};this.handleFullscreen=t=>{this.fullscreen=t;this.nanoSlidesFullscreenChange.emit(t)};this.handleSlideSelect=t=>{this.iCurrentSlide=t;this.nanoSlidesSelect.emit(t)}}async optionsChanged(){if(this.flickityReady){const t=await this.getflickity();Object.assign(t.options,this.options);await this.update()}}async navbtnsChanged(){Array.from(this._getRoot().querySelectorAll(".flickity-prev-next-button")).forEach((t=>{t.hidden=!this.navbtns}))}async pagerChanged(){let t=this._getRoot().querySelector(".flickity-page-dots");t.hidden=!this.pager}async fullscreenBtnChanged(){let t=this._getRoot().querySelector(".flickity-fullscreen-button");t.hidden=!this.fullscreenbtn}async fullscreenChanged(t,i){const s=await this.getflickity();if(this.fullscreen)s.viewFullscreen();else if(typeof i!=="undefined")s.exitFullscreen()}async animationChange(t,i){const[s,n]=await Promise.all([this.getflickity(),ft(this.host)]);n.forEach((t=>{t.style["left"]=undefined}));if(i==="parallax"){s.off("scroll",this.parralax);n.forEach(((t,i)=>{if(this.childrenEles&&this.childrenEles[i])this.childrenEles[i].style["transform"]=undefined}));this.update()}switch(this.animation){case"fade":this.options={fade:true,percentPosition:true};break;case"parallax":this.options={fade:false,percentPosition:false};s.on("scroll",this.parralax);break;default:this.options={fade:false,percentPosition:true};break}}currentSlideChange(){if(this.currentSlide!==this.iCurrentSlide)this.slideTo(this.currentSlide)}internalSlideChange(){this.currentSlide=this.iCurrentSlide}async autoPlayChange(){await this.stopAutoplay();if(this.autoplay){if(typeof this.autoplay==="string")this.autoplay=parseInt(this.autoplay);if(this.autoplay>0)this.startAutoplay(this.autoplay)}}async update(){const[t]=await Promise.all([this.getflickity(),ft(this.host)]);this.childrenEles=this.host.querySelectorAll("nano-slide > *");t.reloadCells();t.resize();t.reposition()}async updateAutoHeight(t){const i=document.querySelector(".flickity-viewport");if(i)i.style.transition=t+"ms"}async slideTo(t,i){const s=await this.getflickity();s.select(t,i)}async slideNext(t,i){const s=await this.getflickity();s.next(i,t)}async slidePrev(t,i){const s=await this.getflickity();s.previous(t,i)}async getActiveIndex(){const t=await this.getflickity();return t.selectedIndex}async length(){const t=await this.getflickity();return t.slides.length}async isEnd(){const t=await this.getflickity();return t.selectedIndex===t.slides.length-1}async isBeginning(){const t=await this.getflickity();return t.selectedIndex===0}async startAutoplay(t){const i=await this.getflickity();if(t)this.options={autoPlay:t};setTimeout((()=>i.playPlayer()))}async stopAutoplay(){const t=await this.getflickity();t.stopPlayer()}async lockSwipes(t){const i=await this.getflickity();i.options.draggable=!t;i.updateDraggable()}async getflickity(){return this.flickity}async reload(){this.destroyflickity();setTimeout((()=>this.initflickity()),20)}_getRoot(){return this.host.shadowRoot?this.host.shadowRoot:this.host}_fixClassNames(){let t=this.slideShowEle.className.split(" ").filter((t=>t.match(/^sc-nano/)));let i=this._getRoot().querySelectorAll("*");if(!i)return;Array.from(i).map((i=>{t.map((t=>i.classList.add(t)))}))}destroyflickity(){const t=this.syncflickity;if(t!==undefined){t.destroy();this.flickity=new Promise((t=>{this.readyflickity=t}));this.flickityReady=false;this.syncflickity=undefined;this.ready=false}this.didInit=false}async initflickity(){const t=this.normalizeOptions();await ft(this.host);this.slidesReady=true;this.flickityEl=this.flickityEl||this._getRoot().querySelector(".flickity-container");if(this.flickityEl.classList.contains("flickity-enabled"))this.destroyflickity();setTimeout((()=>{let i=new et(this.flickityEl,t);this.flickityReady=true;if(!this.host.shadowRoot||!at)this._fixClassNames();this.syncflickity=i;this.animationChange();this.navbtnsChanged();this.pagerChanged();this.fullscreenChanged();this.fullscreenBtnChanged();this.readyflickity(i);this.ready=true;if(!this.host.getBoundingClientRect().height){const t=this.resizeO=new e((()=>{i.resize();this.resizeO.disconnect()}));t.observe(this.host)}}),100)}normalizeOptions(){const t={cellSelector:"nano-slide",contain:true,prevNextButtons:true,fullscreen:true,accessibility:true,imagesLoaded:true,pageDots:true};if(this.animation==="fade"){t.fade=true}if(this.currentSlide>0){t.initialIndex=this.currentSlide}if(this.autoplay){if(typeof this.autoplay==="string")this.autoplay=parseInt(this.autoplay);if(this.autoplay>0)t.autoPlay=this.autoplay}const i={ready:()=>{setTimeout((()=>{this.nanoSlidesReady.emit()}),20)},select:this.handleSlideSelect,change:this.nanoSlidesChange.emit,scroll:this.nanoSlidesScroll.emit,settle:this.nanoSlidesTransitionEnd.emit,dragStart:this.nanoSlidesDragStart.emit,dragMove:this.nanoSlidesDragMove.emit,dragEnd:this.nanoSlidesDragEnd.emit,staticClick:this.nanoSlidesTap.emit,fullscreenChange:this.handleFullscreen};const s=!!this.options&&!!this.options.on?this.options.on:{};const n={on:Object.assign(Object.assign({},s),i)};return Object.assign(Object.assign(Object.assign({},t),n),this.options)}componentDidLoad(){if(typeof window!=="undefined"&&window.MutationObserver){const t=this.mutationO=new MutationObserver((t=>{if(t[0].addedNodes[0]&&t[0].addedNodes[0].nodeName.toLowerCase()==="nano-slide"&&this.flickityReady){this.update()}}));t.observe(this.host,{childList:true,subtree:true})}}componentWillLoad(){this.nanoSlidesDidLoad.emit();if(!this.didInit){this.didInit=true;this.initflickity()}}disconnectedCallback(){if(this.mutationO){this.mutationO.disconnect();this.mutationO=undefined}if(this.resizeO)this.resizeO.disconnect();this.destroyflickity()}render(){return s(n,null,s("div",{class:"slideshow",ref:t=>this.slideShowEle=t},s("div",{ref:t=>this.flickityEl=t,class:{"flickity-container":true,"slides-ready":this.slidesReady,"slides-not-ready":!this.slidesReady}},s("slot",null)),s("div",{class:"ui-extras"},s("slot",{name:"ui"}))))}get host(){return h(this)}static get watchers(){return{options:["optionsChanged"],navbtns:["navbtnsChanged"],pager:["pagerChanged"],fullscreenbtn:["fullscreenBtnChanged"],fullscreen:["fullscreenChanged"],animation:["animationChange"],currentSlide:["currentSlideChange"],iCurrentSlide:["internalSlideChange"],autoplay:["autoPlayChange"]}}};const ft=t=>{const i=Array.from(t.querySelectorAll("nano-slide"));let s=i.filter((t=>!t.ready));if(!s.length)return Promise.resolve(i);return new Promise((n=>{const h=e=>{s=s.filter((t=>t!==e.target));if(!s.length){n(i);t.removeEventListener("nanoSlideReady",h)}};t.addEventListener("nanoSlideReady",h);t.addEventListener("nanoslideready",h)}))};ot.style=rt;export{ot as nano_slides};
+//# sourceMappingURL=p-ba13bb56.entry.js.map