npm - @nanoporetech-digital/components - Versions diffs - 9.0.0 → 9.1.0 - Mend

@nanoporetech-digital/components 9.0.0 → 9.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 (300) hide show

package/dist/nano-components/index-RXFO3HxS.js ADDED Viewed

@@ -0,0 +1,5 @@
+/*!
+ * Custom elements for Nanopore-Digital Web applications
+ */
+const n="nano-components",o=async()=>{};var a=Object.defineProperty,e={isServer:!1},t=(n=>(n.Undefined="undefined",n.Null="null",n.String="string",n.Number="number",n.SpecialNumber="number",n.Boolean="boolean",n.BigInt="bigint",n))(t||{}),r=(n=>(n.Array="array",n.Date="date",n.Map="map",n.Object="object",n.RegularExpression="regexp",n.Set="set",n.Channel="channel",n.Symbol="symbol",n))(r||{}),i="type",l="value",s="serialized:",c=(n,o)=>{var a;Object.entries(null!=(a=o.t.o)?a:{}).map((([a,[e]])=>{if(31&e||32&e){const e=n[a],t=Object.getOwnPropertyDescriptor(Object.getPrototypeOf(n),a);Object.defineProperty(n,a,{get(){return t.get.call(this)},set(n){t.set.call(this,n)},configurable:!0,enumerable:!0}),n[a]=o.i.has(a)?o.i.get(a):e}}))},d=n=>{if(n.__stencil__getHostRef)return n.__stencil__getHostRef()},p=(n,o)=>{n.__stencil__getHostRef=()=>o,o.l=n,c(n,o)},b=(n,o)=>o in n,u=(n,o)=>(0,console.error)(n,o),g=new Map,v=new Map,m="s-id",h="sty-id",f="c-id",y="slot-fb{display:contents}slot-fb[hidden]{display:none}",w="http://www.w3.org/1999/xlink",k="undefined"!=typeof window?window:{},x=k.HTMLElement||class{},z={p:0,u:"",jmp:n=>n(),raf:n=>requestAnimationFrame(n),ael:(n,o,a,e)=>n.addEventListener(o,a,e),rel:(n,o,a,e)=>n.removeEventListener(o,a,e),ce:(n,o)=>new CustomEvent(n,o)},$=n=>Promise.resolve(n),j=(()=>{try{return new CSSStyleSheet,"function"==typeof(new CSSStyleSheet).replaceSync}catch(n){}return!1})(),_=!!j&&(()=>!!k.document&&Object.getOwnPropertyDescriptor(k.document.adoptedStyleSheets,"length").writable)(),S=!1,O=[],N=[],L=(n,o)=>a=>{n.push(a),S||(S=!0,o&&4&z.p?M(E):z.raf(E))},C=n=>{for(let o=0;o<n.length;o++)try{n[o](performance.now())}catch(n){u(n)}n.length=0},E=()=>{C(O),C(N),(S=O.length>0)&&z.raf(E)},M=n=>$().then(n),R=L(O,!1),B=L(N,!0),T=n=>{const o=new URL(n,z.u);return o.origin!==k.location.origin?o.href:o.pathname},I=n=>"object"==(n=typeof n)||"function"===n;function A(n){var o,a,e;return null!=(e=null==(a=null==(o=n.head)?void 0:o.querySelector('meta[name="csp-nonce"]'))?void 0:a.getAttribute("content"))?e:void 0}var P=class n{static fromLocalValue(o){const a=o[i],e=l in o?o[l]:void 0;switch(a){case"string":case"boolean":return e;case"bigint":return BigInt(e);case"undefined":return;case"null":return null;case"number":return"NaN"===e?NaN:"-0"===e?-0:"Infinity"===e?1/0:"-Infinity"===e?-1/0:e;case"array":return e.map((o=>n.fromLocalValue(o)));case"date":return new Date(e);case"map":const o=new Map;for(const[a,t]of e){const e="object"==typeof a&&null!==a?n.fromLocalValue(a):a,r=n.fromLocalValue(t);o.set(e,r)}return o;case"object":const t={};for(const[o,a]of e)t[o]=n.fromLocalValue(a);return t;case"regexp":const{pattern:r,flags:i}=e;return RegExp(r,i);case"set":const l=new Set;for(const o of e)l.add(n.fromLocalValue(o));return l;case"symbol":return Symbol(e);default:throw Error("Unsupported type: "+a)}}static fromLocalValueArray(o){return o.map((o=>n.fromLocalValue(o)))}static isLocalValueObject(n){if("object"!=typeof n||null===n)return!1;if(!n.hasOwnProperty(i))return!1;const o=n[i];return!!Object.values({...t,...r}).includes(o)&&("null"===o||"undefined"===o||n.hasOwnProperty(l))}};((n,o)=>{for(var e in o)a(n,e,{get:o[e],enumerable:!0})})({},{err:()=>U,map:()=>D,ok:()=>F,unwrap:()=>q,unwrapErr:()=>V});var F=n=>({isOk:!0,isErr:!1,value:n}),U=n=>({isOk:!1,isErr:!0,value:n});function D(n,o){if(n.isOk){const a=o(n.value);return a instanceof Promise?a.then((n=>F(n))):F(a)}if(n.isErr)return U(n.value);throw"should never get here"}var W,q=n=>{if(n.isOk)return n.value;throw n.value},V=n=>{if(n.isErr)return n.value;throw n.value};function H(){var n;const o=this.attachShadow({mode:"open"});void 0===W&&(W=null!=(n=function(){if(!j)return;const n=new CSSStyleSheet;return n.replaceSync(':host,\n*,\n*::before,\n*::after {\n  box-sizing: border-box;\n}\n[hidden] {\n  display: none !important;\n}\n@media (prefers-reduced-motion: reduce) {\n    :host,\n    *,\n    *::before,\n    *::after {\n      animation-duration: 0.01ms !important;\n      animation-iteration-count: 1 !important;\n      transition-duration: 0.01ms !important;\n      scroll-behavior: auto !important;\n    }\n  }:host,\n*,\n*::before,\n*::after {\n  box-sizing: border-box;\n}\n[hidden] {\n  display: none !important;\n}\n@media (prefers-reduced-motion: reduce) {\n    :host,\n    *,\n    *::before,\n    *::after {\n      animation-duration: 0.01ms !important;\n      animation-iteration-count: 1 !important;\n      transition-duration: 0.01ms !important;\n      scroll-behavior: auto !important;\n    }\n  }@layer components {\n  :where(nano-footer, .nano-footer) h1,\n  :where(nano-footer, .nano-footer) h2,\n  :where(nano-footer, .nano-footer) h3,\n  :where(nano-footer, .nano-footer) h4,\n  :where(nano-footer, .nano-footer) h5,\n  :where(nano-footer, .nano-footer) h6 {\n    font-weight: var(--nano-font-weight-normal);\n    font-size: var(--nano-font-size-medium);\n    line-height: var(--nano-line-height-normal);\n    letter-spacing: var(--nano-letter-spacing-normal);\n    margin: var(--header-margin);\n  }\n  :where(nano-footer, .nano-footer) [slot=bottom-end] nano-option::part(start) {\n    margin-inline-end: var(--nano-spacing-sm);\n  }\n  :where(nano-footer, .nano-footer) [slot=middle-centre] a {\n    color: inherit;\n  }\n  :where(nano-footer, .nano-footer) [slot=middle-centre] a:hover {\n    color: var(--nano-color-text-link-hover);\n  }\n  :where(nano-footer, .nano-footer) [slot=middle-centre] a:focus-visible {\n    outline: var(--nano-focus-ring);\n    outline-offset: var(--nano-focus-ring-offset);\n  }\n  :where(nano-footer, .nano-footer) [slot=middle-centre] {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    gap: var(--icon-gap-md);\n    flex-wrap: nowrap;\n  }\n  @container footer-container (max-width: 912px) {\n    :where(nano-footer, .nano-footer) [slot=middle-centre] {\n      flex-wrap: wrap;\n      justify-content: center;\n    }\n  }\n}\n@layer components {\n  .nano-toast-stack {\n    position: fixed;\n    z-index: var(--nano-z-index-modal);\n    inline-size: 28rem;\n    max-inline-size: 100%;\n    max-block-size: 100%;\n  }\n  .nano-toast-stack--tr {\n    inset-block-start: 0;\n    inset-inline-end: 0;\n  }\n  .nano-toast-stack--tl {\n    inset-block-start: 0;\n    inset-inline-start: 0;\n  }\n  .nano-toast-stack--br {\n    inset-block-end: 0;\n    inset-inline-end: 0;\n  }\n  .nano-toast-stack--bl {\n    inset-block-end: 0;\n    inset-inline-start: 0;\n  }\n}\n@layer components {\n  .nano-sortable__placeholder {\n    opacity: 0;\n  }\n  .nano-sortable__dragged {\n    opacity: 0.6;\n    cursor: grabbing !important;\n    box-shadow: var(--nano-shadow-l2);\n    z-index: 1;\n    position: relative;\n  }\n  .nano-sortable__keyboard-handle {\n    background: var(--nano-color-background-default);\n  }\n  .nano-sortable__handle-dragged {\n    outline: var(--nano-focus-ring);\n    outline-offset: var(--nano-focus-ring-offset);\n  }\n}\n@layer components {\n  nano-cta {\n    --color: var(--nano-color-basic-white);\n    --bg: var(--nano-color-fill-primary);\n    --bg-hover: var(--nano-color-fill-primary-hover);\n    --bg-active: var(--nano-color-fill-primary-pressed);\n    --border: 1px solid var(--bg);\n    --icon-size: 1em;\n    --padding-v: 0.4375em;\n    --padding-h: 1.125em;\n    --spinner-size: 1em;\n    --font-size: var(--nano-font-size-small);\n    --line-height: var(--nano-line-height-normal);\n    --gap: var(--nano-spacing-sm);\n    --icon-display: none;\n    --loading-display: none;\n    --loading-opacity: 0;\n    --flip-icon-ltr: 0;\n    --flip-icon-rtl: 1;\n    display: contents;\n  }\n  nano-cta:has(.nano-internal-cta) {\n    display: inline-block;\n  }\n  nano-cta:dir(rtl) {\n    --flip-icon-ltr: 1;\n    --flip-icon-rtl: 0;\n  }\n  nano-cta[group=balanced] {\n    display: inline-grid;\n    grid-auto-flow: column;\n    grid-auto-columns: 1fr;\n    gap: var(--gap);\n  }\n  nano-cta[group=balanced] a,\n  nano-cta[group=balanced] button {\n    justify-content: space-evenly;\n  }\n  nano-cta[group=stacked] {\n    display: flex;\n    flex-direction: column;\n    gap: var(--gap);\n  }\n  nano-cta[secondary]:not([secondary=false]),\n  nano-cta :is([secondary]):not([secondary=false]) {\n    --color: var(--nano-color-text-link);\n    --bg: transparent;\n    --bg-hover: var(--nano-color-fill-secondary-hover);\n    --bg-active: var(--nano-color-fill-secondary-pressed);\n    --border: 1px solid var(--color);\n  }\n  nano-cta[theme=danger],\n  nano-cta :is([theme=danger]) {\n    --color: var(--nano-color-basic-white);\n    --bg: var(--nano-color-fill-danger);\n    --bg-hover: var(--nano-color-fill-danger-hover);\n    --bg-active: var(--nano-color-fill-danger-pressed);\n    --border: 1px solid var(--bg);\n  }\n  nano-cta[theme=danger][secondary]:not([secondary=false]),\n  nano-cta :is([theme=danger][secondary]):not([secondary=false]) {\n    --color: var(--nano-color-text-danger);\n    --bg: var(--nano-color-background-default);\n    --bg-hover: var(--nano-color-fill-danger-weak);\n    --bg-active: var(--nano-color-fill-danger-weak);\n    --border: 1px solid var(--color);\n  }\n  nano-cta[size=medium],\n  nano-cta :is([size=medium]) {\n    --font-size: var(--nano-font-size-xs);\n    --line-height: var(--nano-line-height-dense);\n    --gap: var(--nano-spacing-xs);\n  }\n  nano-cta[size=small],\n  nano-cta :is([size=small]) {\n    --font-size: var(--nano-font-size-2xs);\n    --line-height: var(--nano-line-height-denser);\n    --gap: var(--nano-spacing-xs);\n    --padding-h: 1em;\n    --padding-v: 0.5em;\n  }\n  nano-cta:is([loading], [loading=true]):not([loading=false]),\n  nano-cta :is([loading], [loading=true]):not([loading=false]) {\n    --text-color: transparent !important;\n    --loading-display: block;\n    --loading-opacity: 1;\n    --bg-hover: var(--bg);\n    --bg-active: var(--bg);\n    cursor: wait;\n  }\n  nano-cta:is([loading], [loading=true]):not([loading=false]) a,\n  nano-cta:is([loading], [loading=true]):not([loading=false]) button,\n  nano-cta :is([loading], [loading=true]):not([loading=false]) a,\n  nano-cta :is([loading], [loading=true]):not([loading=false]) button {\n    --text-color: transparent !important;\n    cursor: wait;\n  }\n  nano-cta :is([disabled], [disabled=true]):not([disabled=false]),\n  nano-cta a:not([href]) {\n    --color: var(--nano-color-text-disabled);\n    --text-color: var(--color);\n    --bg: var(--nano-color-fill-disabled);\n    --bg-hover: var(--bg);\n    --bg-active: var(--bg);\n    --border: 1px solid var(--color);\n    cursor: not-allowed;\n  }\n  nano-cta :is([disabled], [disabled=true]):not([disabled=false]) a,\n  nano-cta :is([disabled], [disabled=true]):not([disabled=false]) button,\n  nano-cta a:not([href]) a,\n  nano-cta a:not([href]) button {\n    cursor: not-allowed;\n  }\n  nano-cta :is(a, button, .button) {\n    --text-color: var(--color);\n    margin: 0;\n    appearance: none;\n    position: relative;\n    display: inline-flex;\n    align-items: center;\n    justify-content: space-between;\n    cursor: pointer;\n    white-space: nowrap;\n    vertical-align: middle;\n    background-color: var(--bg) !important;\n    color: var(--text-color) !important;\n    border-radius: var(--nano-border-radius-pill);\n    line-height: var(--line-height);\n    letter-spacing: var(--nano-letter-spacing-loose);\n    font-size: var(--font-size);\n    padding: var(--padding-v) var(--padding-h);\n    gap: var(--nano-spacing-sm);\n    border: var(--border) !important;\n    transition: color var(--nano-transition-fast) ease;\n    text-decoration: none !important;\n  }\n  nano-cta :is(a, button, .button):focus-visible {\n    outline: var(--nano-focus-ring);\n    outline-offset: var(--nano-focus-ring-offset);\n  }\n  nano-cta :is(a, button, .button):hover {\n    background-color: var(--bg-hover) !important;\n  }\n  nano-cta :is(a, button, .button):active {\n    background-color: var(--bg-active) !important;\n  }\n  nano-cta :is(a, button, .button)::before {\n    content: "";\n    display: var(--loading-display);\n    opacity: var(--loading-opacity);\n    position: absolute;\n    padding: 2.5px;\n    aspect-ratio: 1;\n    border-radius: 50%;\n    inline-size: var(--spinner-size);\n    background: var(--color);\n    inset: calc(50% - var(--spinner-size) / 2);\n    -webkit-mask: conic-gradient(rgba(0, 0, 0, 0), #000), conic-gradient(#000 0 0) content-box;\n    -webkit-mask-composite: source-out;\n            -webkit-mask: conic-gradient(rgba(0, 0, 0, 0), #000), conic-gradient(#000 0 0) content-box;\n            -webkit-mask-composite: source-out;\n                    mask: conic-gradient(rgba(0, 0, 0, 0), #000) subtract, conic-gradient(#000 0 0) content-box;\n    animation: load 1s linear infinite;\n    transition: all var(--nano-transition-fast) ease;\n    transition-behavior: allow-discrete;\n  }\n  @keyframes load {\n    to {\n      rotate: 1turn;\n    }\n  }\n  nano-cta :is(a, button, .button)::after {\n    content: "";\n    display: var(--icon-display);\n    background-size: cover;\n    inline-size: var(--icon-size);\n    block-size: var(--icon-size);\n    background-color: var(--text-color);\n    -webkit-mask-image: var(--icon-svg);\n            mask-image: var(--icon-svg);\n    transition: color var(--nano-transition-fast) ease;\n    -webkit-mask-repeat: no-repeat;\n            mask-repeat: no-repeat;\n    -webkit-mask-position: center;\n            mask-position: center;\n    transform-origin: center;\n    margin-inline-start: auto;\n    rotate: calc(180deg * var(--flip-icon-ltr));\n  }\n  nano-cta :is(a, button, .button) :where(nano-icon, .nano-icon),\n  nano-cta :is(a, button, .button) svg {\n    color: inherit;\n    inline-size: var(--icon-size);\n    margin: auto 0;\n  }\n  nano-cta:not([icon=false], :has(a nano-icon, a .nano-icon, a svg))[icon=forward] {\n    --icon-svg: var(--nano-component-icon-chevron);\n    --icon-display: block;\n  }\n  nano-cta:not([icon=false], :has(a nano-icon, a .nano-icon, a svg))[icon=forward] a,\n  nano-cta:not([icon=false], :has(a nano-icon, a .nano-icon, a svg))[icon=forward] button {\n    padding-inline-end: 0.8125em;\n  }\n  nano-cta:not([icon=false], :has(a nano-icon, a .nano-icon, a svg))[icon=forward] a::after,\n  nano-cta:not([icon=false], :has(a nano-icon, a .nano-icon, a svg))[icon=forward] button::after {\n    rotate: calc(180deg * var(--flip-icon-ltr));\n  }\n  nano-cta:not([icon=false], :has(a nano-icon, a .nano-icon, a svg))[icon=back] {\n    --icon-svg: var(--nano-component-icon-chevron);\n    --icon-display: block;\n  }\n  nano-cta:not([icon=false], :has(a nano-icon, a .nano-icon, a svg))[icon=back] a,\n  nano-cta:not([icon=false], :has(a nano-icon, a .nano-icon, a svg))[icon=back] button {\n    padding-inline-start: 0.8125em;\n  }\n  nano-cta:not([icon=false], :has(a nano-icon, a .nano-icon, a svg))[icon=back] a::after,\n  nano-cta:not([icon=false], :has(a nano-icon, a .nano-icon, a svg))[icon=back] button::after {\n    rotate: calc(180deg * var(--flip-icon-rtl));\n    order: -1;\n    margin-inline-start: unset;\n  }\n  nano-cta:not([icon=false], :has(a nano-icon, a .nano-icon, a svg))[icon=up] {\n    --icon-svg: var(--nano-component-icon-chevron);\n    --icon-display: block;\n    --flip-icon-ltr: 0;\n    --flip-icon-rtl: 0;\n  }\n  nano-cta:not([icon=false], :has(a nano-icon, a .nano-icon, a svg))[icon=up] a::after,\n  nano-cta:not([icon=false], :has(a nano-icon, a .nano-icon, a svg))[icon=up] button::after {\n    transform: rotate(270deg);\n  }\n  nano-cta:not([icon=false], :has(a nano-icon, a .nano-icon, a svg))[icon=down] {\n    --icon-svg: var(--nano-component-icon-chevron);\n    --icon-display: block;\n    --flip-icon-ltr: 0;\n    --flip-icon-rtl: 0;\n  }\n  nano-cta:not([icon=false], :has(a nano-icon, a .nano-icon, a svg))[icon=down] a::after,\n  nano-cta:not([icon=false], :has(a nano-icon, a .nano-icon, a svg))[icon=down] button::after {\n    transform: rotate(90deg);\n  }\n  nano-cta:not([icon=false], :has(a nano-icon, a .nano-icon, a svg))[icon=download] {\n    --icon-svg: var(--nano-component-icon-download);\n    --icon-display: block;\n    --flip-icon-ltr: 0;\n    --flip-icon-rtl: 0;\n  }\n  nano-cta:not([icon=false], :has(a nano-icon, a .nano-icon, a svg))[icon=open] {\n    --icon-svg: var(--nano-component-icon-open);\n    --icon-size: .9em;\n    --icon-display: block;\n    --flip-icon-ltr: 0;\n    --flip-icon-rtl: 0;\n  }\n  nano-cta:not([icon=false], :has(a nano-icon, a .nano-icon, a svg)):not([icon]) a[href]:not([href=""], [icon], [href^="#"]) {\n    --icon-svg: var(--nano-component-icon-chevron);\n    --icon-display: block;\n    padding-inline-end: 0.8125em;\n  }\n  nano-cta:not([icon=false], :has(a nano-icon, a .nano-icon, a svg)):not([icon]) a[href]:not([href=""], [icon], [href^="#"])[target=_blank] {\n    --icon-svg: var(--nano-component-icon-open);\n    --icon-display: block;\n    --flip-icon-ltr: 0;\n    --flip-icon-rtl: 0;\n    padding-inline-end: var(--padding-h);\n  }\n  nano-cta:not([icon=false], :has(a nano-icon, a .nano-icon, a svg)):not([icon]) a[href]:not([href=""], [icon], [href^="#"])[download], nano-cta:not([icon=false], :has(a nano-icon, a .nano-icon, a svg)):not([icon]) a[href]:not([href=""], [icon], [href^="#"]):is([href$=".txt"], [href$=".pdf"], [href$=".zip"], [href$=".doc"], [href$=".docx"], [href$=".xls"], [href$=".xlsx"], [href$=".ppt"], [href$=".pptx"]) {\n    --icon-svg: var(--nano-component-icon-download);\n    --icon-display: block;\n    --flip-icon-ltr: 0;\n    --flip-icon-rtl: 0;\n    padding-inline-end: var(--padding-h);\n  }\n}\n/** Typography */\n@layer components {\n  nano-card {\n    --color: currentColor;\n    --bg: transparent;\n    --gap: var(--nano-spacing-md);\n    --content-margin: 0;\n    --flip-icon-ltr: 0;\n    container-type: inline-size;\n    position: relative;\n    display: grid;\n    grid-template-columns: minmax(calc(197px - var(--gap)), 31%) auto;\n    grid-template-rows: repeat(calc(var(--row-count) - 1), min-content);\n    gap: var(--gap);\n    background-color: var(--bg);\n    color: var(--color);\n  }\n  nano-card:dir(rtl) {\n    --flip-icon-ltr: 1;\n  }\n  nano-card:has(> :last-child:nth-child(1), > article > :last-child:nth-child(1)) {\n    --row-count: 1;\n  }\n  nano-card:has(> :last-child:nth-child(2), > article > :last-child:nth-child(2)) {\n    --row-count: 2;\n  }\n  nano-card:has(> :last-child:nth-child(3), > article > :last-child:nth-child(3)) {\n    --row-count: 3;\n  }\n  nano-card:has(> :last-child:nth-child(4), > article > :last-child:nth-child(4)) {\n    --row-count: 4;\n  }\n  nano-card:has(> :last-child:nth-child(5), > article > :last-child:nth-child(5)) {\n    --row-count: 5;\n  }\n  nano-card:has(> :last-child:nth-child(6), > article > :last-child:nth-child(6)) {\n    --row-count: 6;\n  }\n  nano-card:has(> :last-child:nth-child(7), > article > :last-child:nth-child(7)) {\n    --row-count: 7;\n  }\n  nano-card * {\n    margin-block: unset;\n    margin-block-start: unset;\n    margin-block-end: unset;\n  }\n  nano-card > *:not([slot]) {\n    display: contents;\n  }\n  nano-card [slot] {\n    display: block;\n  }\n  nano-card [slot]:not([slot=img], [slot=category], ul) {\n    margin-inline: var(--content-margin);\n  }\n  nano-card [slot]:not([slot=img], [slot=category], ul):last-child {\n    margin-block-end: var(--content-margin);\n  }\n  nano-card:not(:has([slot=img])) [slot]:first-child {\n    margin-block-start: var(--content-margin);\n  }\n  nano-card [slot=img] {\n    order: 1;\n    inline-size: 100%;\n    max-inline-size: max-content;\n  }\n  nano-card div[slot=img] {\n    position: relative;\n    inline-size: fit-content;\n    block-size: fit-content;\n  }\n  nano-card [slot=category] {\n    position: absolute;\n    inset-block-end: 10px;\n    inset-inline-end: 10px;\n    background: var(--nano-color-background-default);\n  }\n  nano-card [slot=title] {\n    order: 2;\n  }\n  nano-card [slot=content] {\n    order: 3;\n  }\n  nano-card [slot=footer] {\n    order: 4;\n    display: inline-flex;\n    align-items: center;\n    gap: var(--gap);\n  }\n  nano-card [slot=footer]:has(nano-tag) {\n    flex-wrap: wrap;\n    gap: var(--nano-spacing-sm);\n  }\n  nano-card [slot=footer]:has(nano-tag):is(nano-more-less) > ul,\n  nano-card [slot=footer]:has(nano-tag) nano-more-less > ul {\n    display: contents;\n    list-style: none;\n  }\n  nano-card [slot=footer]:has(nano-tag):is(nano-more-less) > ul > li,\n  nano-card [slot=footer]:has(nano-tag) nano-more-less > ul > li {\n    display: contents;\n  }\n  nano-card nano-content-links {\n    --color-border: var(--nano-color-border-default);\n  }\n  nano-card address {\n    font-style: normal;\n  }\n  nano-card a[slot=title],\n  nano-card [slot=title] a {\n    color: var(--color);\n    text-decoration: none;\n  }\n  nano-card a[slot=title]:hover,\n  nano-card [slot=title] a:hover {\n    color: var(--nano-color-text-hover);\n    text-decoration: underline;\n  }\n  nano-card:has(a:only-of-type):not(:has(button, nano-icon-button, input), [disable-card-click]) a, nano-card:not([variant=product]):has(button:only-of-type):not(button[loading]:only-of-type,\n  :has(a, nano-icon-button, input, nano-cta[loading])) a {\n    color: var(--color);\n    text-decoration: none;\n  }\n  nano-card:has(a:only-of-type):not(:has(button, nano-icon-button, input), [disable-card-click]):hover [slot=title], nano-card:not([variant=product]):has(button:only-of-type):not(button[loading]:only-of-type,\n  :has(a, nano-icon-button, input, nano-cta[loading])):hover [slot=title] {\n    color: var(--nano-color-text-hover);\n    text-decoration: underline;\n  }\n  nano-card:has(a:only-of-type):not(:has(button, nano-icon-button, input), [disable-card-click]):hover:has([slot=title] > * ~ *) [slot=title], nano-card:not([variant=product]):has(button:only-of-type):not(button[loading]:only-of-type,\n  :has(a, nano-icon-button, input, nano-cta[loading])):hover:has([slot=title] > * ~ *) [slot=title] {\n    color: var(--color);\n    text-decoration: none;\n  }\n  nano-card:has(a:only-of-type):not(:has(button, nano-icon-button, input), [disable-card-click]):hover:has([slot=title] > * ~ *) [slot=title] > :first-child, nano-card:not([variant=product]):has(button:only-of-type):not(button[loading]:only-of-type,\n  :has(a, nano-icon-button, input, nano-cta[loading])):hover:has([slot=title] > * ~ *) [slot=title] > :first-child {\n    color: var(--nano-color-text-hover);\n    text-decoration: underline;\n  }\n  nano-card:has(a:only-of-type):not(:has(button, nano-icon-button, input), [disable-card-click]) button::before,\n  nano-card:has(a:only-of-type):not(:has(button, nano-icon-button, input), [disable-card-click]) a::before, nano-card:not([variant=product]):has(button:only-of-type):not(button[loading]:only-of-type,\n  :has(a, nano-icon-button, input, nano-cta[loading])) button::before,\n  nano-card:not([variant=product]):has(button:only-of-type):not(button[loading]:only-of-type,\n  :has(a, nano-icon-button, input, nano-cta[loading])) a::before {\n    content: "";\n    display: block;\n    position: absolute;\n    inset: 0;\n    touch-action: manipulation;\n    cursor: pointer;\n    inline-size: 100%;\n    block-size: 100%;\n    animation: none;\n    border-radius: 0;\n    z-index: var(--enable-card-click);\n  }\n  nano-card:has(a:only-of-type):not(:has(button, nano-icon-button, input), [disable-card-click]) nano-cta > *, nano-card:not([variant=product]):has(button:only-of-type):not(button[loading]:only-of-type,\n  :has(a, nano-icon-button, input, nano-cta[loading])) nano-cta > * {\n    position: static;\n  }\n  nano-card:has(a:only-of-type):not(:has(button, nano-icon-button, input), [disable-card-click])[variant^=promo]:hover, nano-card:not([variant=product]):has(button:only-of-type):not(button[loading]:only-of-type,\n  :has(a, nano-icon-button, input, nano-cta[loading]))[variant^=promo]:hover {\n    background-color: var(--bg-hover);\n  }\n  nano-card:has(a:only-of-type):not(:has(button, nano-icon-button, input), [disable-card-click]) nano-tooltip > *, nano-card:not([variant=product]):has(button:only-of-type):not(button[loading]:only-of-type,\n  :has(a, nano-icon-button, input, nano-cta[loading])) nano-tooltip > * {\n    position: relative;\n    z-index: 2;\n  }\n  nano-card:has(a[slot]):has([slot] a) {\n    --enable-card-click: -1;\n  }\n  nano-card:has([slot=content] a):has([slot=footer] a) {\n    --enable-card-click: -1;\n  }\n  nano-card[disable-card-click] {\n    --enable-card-click: -1;\n  }\n  nano-card:not([layout=landscape]) [slot] {\n    grid-column: 1/-1 !important;\n  }\n  nano-card[layout=landscape] [slot] {\n    grid-column: 2;\n  }\n  nano-card[layout=landscape] div:has([slot=img]),\n  nano-card[layout=landscape] [slot=img] {\n    grid-column: 1;\n    grid-row: 1/-1;\n  }\n  nano-card[layout=landscape]:has([slot=title], [slot=content], [slot=img]):not(nano-card[layout=landscape]:has([slot=footer])) {\n    grid-template-rows: min-content repeat(calc(var(--row-count) - 2), 1fr);\n  }\n  @container (width < 417px) {\n    nano-card[layout=landscape]:not([size=small]) [slot] {\n      grid-column: 1/-1 !important;\n    }\n    nano-card[layout=landscape]:not([size=small]) [slot=img] {\n      grid-column: 1/-1 !important;\n    }\n  }\n  @container (width < 320px) {\n    nano-card[layout=landscape][size=small] [slot] {\n      grid-column: 1/-1 !important;\n    }\n    nano-card[layout=landscape][size=small] [slot=img] {\n      grid-column: 1/-1 !important;\n    }\n  }\n  nano-card[variant=product] [slot=title] {\n    display: inline-flex;\n    gap: var(--gap);\n    align-items: center;\n    justify-content: space-between;\n  }\n  nano-card[variant=product] [slot=footer] {\n    justify-content: space-between;\n  }\n  nano-card [slot=title],\n  nano-card [slot=title] > :first-child {\n    font-weight: var(--nano-font-weight-normal);\n    font-size: var(--nano-font-size-lg);\n    line-height: var(--nano-line-height-dense);\n    text-wrap: balance;\n  }\n  nano-card [slot=content],\n  nano-card [slot=content] > * {\n    font-size: var(--nano-font-size-sm);\n    line-height: var(--nano-line-height-normal);\n    letter-spacing: var(--nano-letter-spacing-loose);\n  }\n  nano-card[size=small] {\n    grid-template-columns: minmax(calc(60px - var(--gap)), 31%) auto;\n  }\n  nano-card[size=small] [slot=title],\n  nano-card[size=small] [slot=title] > :first-child {\n    font-size: var(--nano-font-size-sm);\n    line-height: var(--nano-line-height-normal);\n    font-weight: var(--nano-font-weight-bold);\n  }\n  nano-card[size=small] [slot=content],\n  nano-card[size=small] [slot=content] > * {\n    font-size: var(--nano-font-size-xs);\n    line-height: var(--nano-line-height-normal);\n    letter-spacing: var(--nano-letter-spacing-loose);\n  }\n  nano-card[variant=product][size=small] {\n    --gap: var(--nano-spacing-sm);\n  }\n  nano-card[variant^=promo] {\n    --content-margin: var(--gap);\n    box-shadow: var(--nano-shadow-l1);\n  }\n  nano-card[variant^=promo] [slot=title],\n  nano-card[variant^=promo] [slot=title]:hover, nano-card[variant^=promo]:hover [slot=title] {\n    color: var(--color) !important;\n    text-decoration: none !important;\n  }\n  nano-card[variant^=promo] nano-cta > * {\n    inline-size: 100%;\n  }\n  nano-card[variant^=promo] [slot=title],\n  nano-card[variant^=promo] [slot=title] > :first-child {\n    font-weight: var(--nano-font-weight-normal);\n    font-size: var(--nano-font-size-md);\n    line-height: var(--nano-line-height-dense);\n    text-wrap: balance;\n  }\n  nano-card[variant^=promo] [slot=content],\n  nano-card[variant^=promo] [slot=content] > * {\n    font-size: var(--nano-font-size-xs);\n    line-height: var(--nano-line-height-normal);\n    letter-spacing: var(--nano-letter-spacing-loose);\n  }\n  nano-card[variant^=promo]:not(:has(nano-cta)):has(a[slot=title]) a[slot=title] {\n    display: inline-flex;\n    gap: var(--gap);\n  }\n  nano-card[variant^=promo]:not(:has(nano-cta)):has(a[slot=title]) a[slot=title]::after {\n    content: "";\n    display: block;\n    background-size: cover;\n    inline-size: 1em;\n    background-color: var(--color);\n    -webkit-mask-image: var(--nano-component-icon-chevron);\n            mask-image: var(--nano-component-icon-chevron);\n    -webkit-mask-repeat: no-repeat;\n            mask-repeat: no-repeat;\n    -webkit-mask-position: center;\n            mask-position: center;\n    transform-origin: center;\n    margin-inline-start: auto;\n    rotate: calc(180deg * var(--flip-icon-ltr));\n  }\n  nano-card[variant=promo-aero] {\n    --bg: var(--nano-color-surface-brand-feature);\n    --bg-hover: var(--nano-color-surface-brand-feature-hover);\n    --color: var(--nano-color-text-default);\n  }\n  nano-card[variant=promo-plain] {\n    --bg: var(--nano-color-surface-default);\n    --bg-hover: var(--nano-color-surface-default-hover);\n    --color: var(--nano-color-text-default);\n  }\n  nano-card[variant=promo-grey] {\n    --bg: var(--nano-color-surface-subtle);\n    --bg-hover: var(--nano-color-surface-subtle-hover);\n    --color: var(--nano-color-text-default);\n  }\n  nano-card[variant=promo-grey]:hover [slot=title] {\n    color: var(--nano-color-text-hover);\n  }\n  nano-card[variant=promo-grey] nano-cta {\n    --color: var(--nano-color-text-link);\n    --bg: var(--nano-color-surface-subtle);\n    --bg-hover: var(--nano-color-surface-subtle-hover);\n    --bg-active: var(--nano-color-surface-subtle-pressed);\n    --border: 1px solid var(--color);\n  }\n}\n@layer components {\n  nano-tag {\n    --background: var(--nano-color-surface-default);\n    --color: var(--nano-color-text-link);\n    --stroke: var(--nano-color-border-accent);\n    --color-non-interactive: var(--nano-color-text-default);\n    --padding: 0.125rem 0.375rem;\n    --font-size: 0.625rem;\n    --line-height: var(--nano-line-height-denser);\n    --letter-spacing: var(--nano-letter-spacing-denser);\n    --bg-color-hover: var(--nano-color-fill-secondary-hover);\n    --bg-color-active: var(--nano-color-fill-secondary-pressed);\n    display: inline-block;\n    block-size: fit-content;\n    inline-size: fit-content;\n    padding: var(--padding);\n    font-size: var(--font-size);\n    font-family: var(--font-family);\n    font-weight: var(--nano-font-weight-bold);\n    line-height: var(--line-height);\n    letter-spacing: var(--letter-spacing);\n    word-wrap: break-word;\n    text-align: center;\n    cursor: default;\n    color: var(--color-non-interactive);\n    background: var(--background);\n    border: 1px solid var(--color-non-interactive);\n  }\n  nano-tag[size=large] {\n    --padding: 0.25rem 0.5rem;\n    --font-size: var(--nano-font-size-2xs);\n    --letter-spacing: var(--nano-letter-spacing-loose);\n  }\n  nano-tag[closable] {\n    display: flex;\n    gap: 0.25rem;\n    justify-content: space-between;\n    align-items: center;\n    padding: var(--padding);\n  }\n  nano-tag[closable] nano-icon-button {\n    --padding: 0 !important;\n  }\n  nano-tag[closable][size=large] {\n    gap: 0.375rem;\n  }\n  nano-tag[closable]:not(:has(nano-icon-button, .nano-icon-button))::after {\n    content: "";\n    display: block;\n    min-inline-size: 0.625rem;\n  }\n  nano-tag:has(a), nano-tag:has(button) {\n    padding: 0;\n  }\n  nano-tag:has(a), nano-tag:has(button), nano-tag[closable] {\n    color: var(--color);\n    border-color: var(--stroke);\n    background: var(--background);\n  }\n  nano-tag:has(a:hover), nano-tag:has(button:hover) {\n    cursor: pointer;\n    background: var(--bg-color-hover);\n  }\n  nano-tag:has(a:active), nano-tag:has(button:active), nano-tag[selected] {\n    background: var(--bg-color-active);\n  }\n  nano-tag:has(a:focus-visible, button:focus-visible) {\n    outline: var(--nano-focus-ring);\n    outline-offset: var(--nano-focus-ring-offset);\n  }\n  nano-tag > a, nano-tag > button {\n    all: unset;\n    display: block;\n    padding: var(--padding) !important;\n  }\n  nano-tag > a:hover, nano-tag > button:hover {\n    text-decoration: none;\n  }\n}\n@layer components {\n  :where(nano-content-links, .nano-content-links) {\n    --text-color: var(--nano-color-text-default);\n    --color-disabled: var(--nano-color-text-disabled);\n    --color-border: var(--nano-color-border-default);\n    --color-active: var(--nano-color-fill-primary);\n    --padding: var(--nano-spacing-sm);\n    --icon-size: 1em;\n    --icon-color: var(--nano-color-icon-primary);\n    display: contents;\n    color: var(--text-color);\n    font-size: var(--nano-font-size-sm);\n    font-weight: var(--nano-font-weight-normal);\n    line-height: var(--nano-line-height-normal);\n    letter-spacing: var(--nano-letter-spacing-loose);\n    word-wrap: break-word;\n  }\n  :where(nano-content-links, .nano-content-links) > * {\n    all: unset;\n    inline-size: -webkit-fill-available;\n    inline-size: -moz-available;\n    inline-size: stretch;\n    block-size: fit-content;\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n    padding: var(--padding);\n    gap: var(--nano-spacing-md);\n    border-block-start: 1px solid var(--color-border);\n    border-block-end: 1px solid var(--color-border);\n    text-decoration: none !important;\n  }\n  :where(nano-content-links, .nano-content-links) > *::after {\n    content: "";\n    background-size: cover;\n    inline-size: var(--icon-size);\n    block-size: var(--icon-size);\n    -webkit-mask-image: var(--nano-component-icon-chevron);\n            mask-image: var(--nano-component-icon-chevron);\n    -webkit-mask-repeat: no-repeat;\n            mask-repeat: no-repeat;\n    -webkit-mask-position: center;\n            mask-position: center;\n    transform-origin: center;\n    margin-inline-start: auto;\n    min-inline-size: var(--icon-size);\n  }\n  :where(nano-content-links, .nano-content-links) > *:not(a) {\n    pointer-events: none;\n    cursor: default;\n    color: var(--color-disabled);\n    border-block-start: 1px solid var(--color-border);\n    border-block-end: 1px solid var(--color-border);\n  }\n  :where(nano-content-links, .nano-content-links) > *:not(a)::after {\n    background-color: var(--color-disabled);\n  }\n  :where(nano-content-links, .nano-content-links) > * + * {\n    border-block-start: none !important;\n  }\n  :where(nano-content-links, .nano-content-links) a {\n    pointer-events: auto;\n    cursor: pointer;\n    color: var(--text-color);\n  }\n  :where(nano-content-links, .nano-content-links) a::after {\n    background-color: var(--icon-color);\n  }\n  :where(nano-content-links, .nano-content-links) a[target=_blank]::after {\n    -webkit-mask-image: var(--nano-component-icon-open);\n            mask-image: var(--nano-component-icon-open);\n  }\n  :where(nano-content-links, .nano-content-links) a:hover, :where(nano-content-links, .nano-content-links) a:active {\n    --icon-color: var(--color-active);\n    color: var(--color-active);\n    -webkit-text-decoration: underline solid;\n            text-decoration: underline solid;\n  }\n  :where(nano-content-links, .nano-content-links) a:focus-visible {\n    outline: var(--nano-focus-ring);\n    outline-offset: var(--nano-focus-ring-offset);\n  }\n}\n@layer components {\n  nano-badge {\n    font-size: var(--nano-font-size-2xs);\n    line-height: var(--nano-line-height-normal);\n    letter-spacing: var(--nano-letter-spacing-loose);\n    background: var(--bg);\n    color: var(--color);\n    border-radius: var(--nano-border-radius-pill);\n    padding: 0.15em 0.65em !important;\n    display: inline-block;\n    max-block-size: fit-content;\n    --color: lch(from var(--bg) calc((50 - l) * infinity) 0 0);\n  }\n  nano-badge:empty {\n    padding: 0 !important;\n    block-size: 0.5em;\n    inline-size: 0.5em;\n    min-block-size: 0.5em;\n  }\n  nano-badge a, nano-badge button {\n    all: unset;\n    color: inherit;\n    border-radius: inherit;\n    cursor: pointer;\n  }\n  nano-badge a:is(a), nano-badge button:is(a) {\n    text-decoration: underline;\n  }\n  nano-badge a::after, nano-badge button::after {\n    content: "";\n    position: absolute;\n    inset: 0;\n    inline-size: 100%;\n    block-size: 100%;\n    border-radius: inherit;\n    background-color: transparent;\n  }\n  nano-badge a:focus-visible, nano-badge button:focus-visible {\n    outline: none;\n  }\n  nano-badge a:focus-visible::after, nano-badge button:focus-visible::after {\n    outline: var(--nano-focus-ring);\n    outline-offset: var(--nano-focus-ring-offset);\n  }\n  nano-badge:has(a, button) {\n    position: relative;\n  }\n  nano-badge:has(a, button):hover {\n    background-color: color-mix(in srgb, var(--bg), black 10%);\n  }\n  nano-badge:has(a, button):active {\n    background-color: color-mix(in srgb, var(--bg), black 20%);\n  }\n  nano-badge:not([theme]), nano-badge[theme=primary] {\n    --bg: var(--nano-color-fill-primary);\n  }\n  nano-badge[theme=neutral] {\n    --bg: var(--nano-color-fill-neutral);\n  }\n  nano-badge[theme=success] {\n    --bg: var(--nano-color-fill-success);\n  }\n  nano-badge[theme=warning] {\n    --bg: var(--nano-color-fill-warning);\n  }\n  nano-badge[theme=danger] {\n    --bg: var(--nano-color-fill-danger-hover);\n  }\n  nano-badge[pulse]:not([pulse=false]) {\n    animation: pulse-animation 2s infinite;\n  }\n  @keyframes pulse-animation {\n    0% {\n      box-shadow: 0 0 0 0 rgb(var(--nano-color-base-rgb-1000)/20%);\n    }\n    100% {\n      box-shadow: 0 0 0 1em rgb(var(--nano-color-base-rgb-1000)/0%);\n    }\n  }\n}\n@layer components {\n  :where(nano-card-carousel, .nano-card-carousel) > [slot=title] {\n    all: unset;\n    font-weight: var(--nano-font-weight-normal);\n    font-size: var(--nano-font-size-xl);\n    line-height: var(--nano-line-height-denser);\n    text-wrap: balance;\n    line-height: 1;\n  }\n  nano-card-carousel nano-card [slot] {\n    opacity: var(--text-opacity);\n  }\n  nano-card-carousel nano-card [slot=img] {\n    opacity: 1;\n  }\n}\n@layer components {\n  .nano-theme-dark nano-global-nav::part(logo),\n  .nano-theme-dark nano-global-nav [part~=logo],\n  nano-global-nav.nano-theme-dark::part(logo),\n  nano-global-nav.nano-theme-dark [part~=logo] {\n    filter: invert(100%);\n  }\n  nano-global-nav > a,\n  nano-global-nav nano-nav-item::part(label),\n  nano-global-nav nano-nav-item [part~=label] {\n    white-space: nowrap;\n  }\n  nano-global-nav nano-nav-item [slot=icon-start] {\n    position: relative;\n  }\n  nano-global-nav nano-nav-item [slot=icon-start] nano-badge {\n    position: absolute;\n    inset-block-start: 0;\n    inset-inline-end: 0;\n    translate: 100% -50%;\n  }\n  nano-global-nav:has(nano-menu-drawer)::part(site-wrapper),\n  nano-global-nav:has(nano-menu-drawer) [part~=site-wrapper] {\n    display: flex;\n  }\n  nano-global-nav.bar-menu::before {\n    content: "";\n    position: fixed;\n    inset: 0;\n    background: var(--nano-overlay-background-color);\n    z-index: var(--nano-z-index-menubar);\n    pointer-events: none;\n    opacity: 0;\n    transition: opacity var(--nano-transition-fast) ease var(--nano-transition-fast);\n  }\n  nano-global-nav.bar-menu:has(nano-nav-item[open])::before {\n    opacity: 1;\n    transition: opacity var(--nano-transition-fast) ease;\n  }\n  nano-global-nav.bar-menu > nano-nav-item,\n  nano-global-nav.bar-menu > a {\n    color: var(--main-menu-text-color);\n  }\n  nano-global-nav.bar-menu > nano-nav-item {\n    align-self: stretch;\n    display: flex;\n    align-items: center;\n    margin-block: calc(-1 * var(--nano-spacing-md));\n    padding-block: var(--nano-spacing-md);\n  }\n  nano-global-nav.bar-menu > nano-nav-item:hover,\n  nano-global-nav.bar-menu > a:hover {\n    color: var(--main-menu-hover-text-color);\n  }\n  nano-global-nav.bar-menu > nano-nav-item:active,\n  nano-global-nav.bar-menu > a:active {\n    color: var(--main-menu-active-text-color);\n  }\n  nano-global-nav.bar-menu > nano-nav-item::part(trigger),\n  nano-global-nav.bar-menu > nano-nav-item [part~=trigger] {\n    position: relative;\n  }\n  nano-global-nav.bar-menu > nano-nav-item::part(trigger)::before,\n  nano-global-nav.bar-menu > nano-nav-item [part~=trigger]::before {\n    content: "";\n    position: absolute;\n    background-color: var(--main-menu-active-border-color);\n    block-size: 4px;\n    inset-inline: 0;\n    inset-block-end: -1.5625rem;\n    transform: translateZ(0) scaleX(0);\n    transform-origin: 0 center;\n    transition: transform var(--nano-transition-x-fast) ease-in-out;\n  }\n  nano-global-nav.bar-menu > nano-nav-item[open] {\n    color: var(--main-menu-active-border-color) !important;\n  }\n  nano-global-nav.bar-menu > nano-nav-item[open]::part(trigger)::before, nano-global-nav.bar-menu > nano-nav-item[open] [part~=trigger]::before {\n    transform: translateZ(0) scaleX(1);\n  }\n  nano-global-nav.bar-menu > a.active,\n  nano-global-nav.bar-menu > nano-nav-item.active,\n  nano-global-nav.bar-menu > nano-nav-item[selected] {\n    color: var(--main-menu-active-text-color) !important;\n  }\n  nano-global-nav.bar-menu > nano-nav-item::part(modal) {\n    inset-block-start: -500%;\n    inline-size: 100%;\n    position: absolute;\n    z-index: -2;\n    inset-inline: 0;\n    transition: inset-block-start var(--nano-transition-fast) ease-in-out, opacity var(--nano-transition-x-fast) ease;\n  }\n  nano-global-nav.bar-menu > nano-nav-item::part(modal modal--open) {\n    inset-block-start: 100%;\n  }\n  nano-global-nav.bar-menu > nano-nav-item::part(modal-content) {\n    background: var(--nano-color-background-default);\n    color: var(--nano-color-surface-contrast);\n    padding: var(--nano-spacing-xl);\n    inline-size: 91.25rem;\n    max-inline-size: 100%;\n    margin: auto;\n    box-shadow: var(--nano-shadow-l2);\n  }\n  nano-global-nav.bar-menu > nano-nav-item::part(modal-mask),\n  nano-global-nav.bar-menu > nano-nav-item [part~=modal-mask] {\n    display: none;\n  }\n  nano-global-nav.bar-menu > nano-nav-item [slot=close-button] {\n    display: none;\n  }\n  nano-global-nav.bar-menu > nano-nav-item [slot=secondary] nano-accordion,\n  nano-global-nav.bar-menu > nano-nav-item [slot=secondary] nano-details {\n    display: none;\n  }\n  nano-global-nav.overflow-menu nano-nav-item, nano-global-nav.overflow-menu > a {\n    color: var(--overflow-text-color);\n  }\n  nano-global-nav.overflow-menu nano-nav-item:hover, nano-global-nav.overflow-menu > a:hover {\n    color: var(--overflowhover-text-color);\n  }\n  nano-global-nav.overflow-menu nano-nav-item:active, nano-global-nav.overflow-menu > a:active {\n    color: var(--overflow-active-text-color);\n  }\n  nano-global-nav.overflow-menu a.active,\n  nano-global-nav.overflow-menu nano-nav-item.active,\n  nano-global-nav.overflow-menu nano-nav-item[selected] {\n    color: var(--overflow-active-text-color) !important;\n  }\n  nano-global-nav.overflow-menu nano-nav-item::part(modal) {\n    background-color: var(--overflow-bg-color);\n    inline-size: 100%;\n    block-size: 100%;\n    position: absolute;\n    inset: 0;\n    z-index: 1;\n  }\n  nano-global-nav.overflow-menu nano-nav-item [slot=secondary] {\n    display: flex;\n    flex-direction: column;\n    gap: var(--nano-spacing-md);\n    padding-block-end: var(--nano-spacing-md);\n    color: var(--overflow-text-color);\n  }\n  nano-global-nav.overflow-menu nano-nav-item [slot=secondary] > div {\n    display: none;\n  }\n  nano-global-nav.overflow-menu nano-nav-item [slot=secondary] nano-accordion,\n  nano-global-nav.overflow-menu nano-nav-item [slot=secondary] nano-details {\n    display: block;\n  }\n  nano-global-nav.overflow-menu [slot=close-button] {\n    color: var(--overflow-text-color);\n    padding-block: var(--nano-spacing-md);\n    display: flex;\n    gap: var(--nano-spacing-sm);\n    align-items: center;\n    cursor: pointer;\n    inline-size: 100%;\n  }\n  nano-global-nav.overflow-menu [slot=close-button]:hover {\n    color: var(--nano-color-blue-cerulean-700);\n  }\n  nano-global-nav.overflow-menu [slot=close-button]::before {\n    content: "";\n    margin-inline-start: 0;\n    background-size: cover;\n    inline-size: 1em;\n    block-size: 1em;\n    -webkit-mask-image: var(--nano-component-icon-chevron);\n            mask-image: var(--nano-component-icon-chevron);\n    -webkit-mask-repeat: no-repeat;\n            mask-repeat: no-repeat;\n    -webkit-mask-position: center;\n            mask-position: center;\n    transform-origin: center;\n    rotate: 180deg;\n    background-color: var(--nano-color-blue-cerulean-700);\n  }\n}\n@layer components {\n  nano-avatar {\n    --size: 2.5rem;\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    position: relative;\n    inline-size: var(--size);\n    min-inline-size: var(--size);\n    block-size: var(--size);\n    background-color: var(--nano-color-fill-neutral-weak);\n    font-size: calc(var(--size) * 0.5);\n    font-weight: var(--nano-font-weight-normal);\n    color: var(--nano-color-text-inverse);\n    -webkit-user-select: none;\n            user-select: none;\n    vertical-align: middle;\n    border-radius: var(--nano-border-radius-circle);\n    overflow: hidden;\n  }\n  nano-avatar:empty::before {\n    content: attr(initials);\n    text-transform: uppercase;\n    line-height: 1;\n  }\n  nano-avatar img {\n    aspect-ratio: var(--nano-image-ratio-square);\n    object-fit: cover;\n  }\n}\n.nano-in-page-nav {\n  --color-bottom-border: var(--nano-color-border-default);\n  --color-text: var(--nano-color-text-default);\n  --color-primary: var(--nano-color-text-primary);\n  --color-text-hover: var(--nano-color-text-hover);\n  --color-border-active: var(--nano-color-border-accent);\n  --border-active: 3px solid var(--color-border-active);\n  --color-bg: var(--nano-color-surface-brand-feature);\n  --font-size: var(--nano-font-size-small);\n  --font-weight: var(--nano-font-weight-normal);\n  --font-weight-active: var(--nano-font-weight-bold);\n  --line-height: var(--nano-line-height-dense);\n  --letter-spacing: var(--nano-letter-spacing-loose);\n  --flip-icon-ltr: 1;\n  --list-gap: calc(var(--spacing-l2) / 1.25);\n  --spacing-l2: var(--nano-spacing-l2);\n  --spacing-l3: var(--nano-spacing-l3);\n}\n.nano-in-page-nav:dir(rtl) {\n  --flip-icon-ltr: 0;\n}\n.nano-in-page-nav a,\n.nano-in-page-nav ul,\n.nano-in-page-nav li {\n  all: unset;\n}\n.nano-in-page-nav ul {\n  display: flex;\n  flex-direction: column;\n  list-style: none;\n}\n.nano-in-page-nav ul:not(ul ul) {\n  padding: 0 var(--spacing-l2) 0 var(--spacing-l2);\n}\n.nano-in-page-nav a {\n  cursor: pointer;\n}\n.nano-in-page-nav a:hover {\n  text-decoration: underline;\n}\n.nano-in-page-nav a:focus-visible {\n  outline: var(--nano-focus-ring);\n  outline-offset: var(--nano-focus-ring-offset);\n}\n.nano-in-page-nav ul > li:not(ul > li li) {\n  margin: 0;\n  padding: var(--spacing-l2) 0;\n  display: flex;\n  flex-direction: column;\n  align-items: stretch;\n  justify-content: stretch;\n  inline-size: 100%;\n}\n.nano-in-page-nav ul > li:not(ul > li li):not(:last-of-type) {\n  border-block-end: 1px solid var(--color-bottom-border);\n}\n.nano-in-page-nav ul > li:not(ul > li li) span, .nano-in-page-nav ul > li:not(ul > li li) a {\n  color: var(--color-text);\n}\n.nano-in-page-nav ul > li:not(ul > li li) span.is-active, .nano-in-page-nav ul > li:not(ul > li li) a.is-active {\n  border-inline-start: var(--border-active);\n  padding-inline-start: 1rem;\n  display: block;\n}\n.nano-in-page-nav ul > li:not(ul > li li) span:hover, .nano-in-page-nav ul > li:not(ul > li li) a:hover {\n  color: var(--color-text-hover);\n}\n.nano-in-page-nav nano-details.is-active::part(header) {\n  border-inline-start: var(--border-active);\n  padding-inline-start: 1rem !important;\n  color: var(--color-primary);\n}\n.nano-in-page-nav ul > li > ul,\n.nano-in-page-nav ul > li > .nano-details ul {\n  padding: var(--list-gap) 0 0 var(--spacing-l2);\n  gap: var(--list-gap);\n}\n.nano-in-page-nav ul > li > ul a,\n.nano-in-page-nav ul > li > .nano-details ul a {\n  color: var(--color-primary) !important;\n}\n.nano-in-page-nav ul > li > ul > li > .nano-details > ul,\n.nano-in-page-nav ul > li > .nano-details ul > li > .nano-details ul {\n  padding: var(--list-gap) 0 0 var(--nano-spacing-xl);\n}\n.nano-in-page-nav .nano-details .nano-details:not(.nano-details .nano-details .nano-details) {\n  color: var(--color-text);\n}\n.nano-in-page-nav .nano-details {\n  --padding: 0;\n  --btn-bg-color: transparent;\n  --btn-bg-color--open: var(--nano-color-surface-brand-feature);\n  --btn-bg-color--hover: transparent;\n  border: none;\n  color: var(--color-primary);\n}\n.nano-in-page-nav .nano-details.is-active [part~=header],\n.nano-in-page-nav .nano-details .is-active::part(header) {\n  border-inline-start: var(--border-active);\n  padding-inline-start: 1rem !important;\n  color: var(--color-primary);\n}\n.nano-in-page-nav .nano-details[open] > [slot=icon-start] {\n  rotate: 90deg;\n}\n.nano-in-page-nav .nano-details::part(icon--start) {\n  margin-inline-end: var(--spacing-l3);\n}\n.nano-in-page-nav .nano-details [part~=header], .nano-in-page-nav .nano-details::part(header) {\n  font-size: var(--font-size);\n  line-height: var(--line-height);\n  font-weight: var(--font-weight);\n  letter-spacing: var(--letter-spacing);\n}\n.nano-in-page-nav .nano-details [part~=header]:hover, .nano-in-page-nav .nano-details::part(header):hover {\n  text-decoration: underline;\n}\n.nano-in-page-nav .nano-details:not(.nav-details) {\n  color: var(--color-primary);\n}\n.nano-in-page-nav.external-links {\n  --color-bg: var(--nano-color-background-default) !important;\n  --color-border-active: var(--nano-color-border-accent);\n}\n.nano-in-page-nav.external-links ul ul {\n  --border-active: 3px solid var(--nano-color-border-accent);\n}\n\n@layer components {\n  :where(nano-collapsible-comparison, .nano-collapsible-comparison) {\n    --color-bg: var(--nano-color-background-default);\n    --color-border: var(--nano-color-border-default);\n    --outer-spacing: var(--nano-spacing-l1-default);\n  }\n  :where(nano-collapsible-comparison, .nano-collapsible-comparison) h2 {\n    font-weight: var(--nano-font-weight-normal);\n    font-size: var(--nano-font-size-xl);\n    line-height: var(--nano-line-height-denser);\n    text-wrap: balance;\n  }\n  :where(nano-collapsible-comparison, .nano-collapsible-comparison) h2,\n  :where(nano-collapsible-comparison, .nano-collapsible-comparison) h4 {\n    margin: 0;\n  }\n  :where(nano-collapsible-comparison, .nano-collapsible-comparison) h3,\n  :where(nano-collapsible-comparison, .nano-collapsible-comparison) h4 {\n    font-size: var(--nano-font-size-sm);\n    line-height: var(--nano-line-height-normal);\n    font-weight: var(--nano-font-weight-bold);\n  }\n  :where(nano-collapsible-comparison, .nano-collapsible-comparison) h3 {\n    padding-block-end: var(--nano-spacing-md);\n    border-block-end: 1px solid var(--color-border);\n    margin-block: 0;\n  }\n  :where(nano-collapsible-comparison, .nano-collapsible-comparison) h4 {\n    font-weight: var(--nano-font-weight-normal);\n  }\n  :where(nano-collapsible-comparison, .nano-collapsible-comparison) ul {\n    padding: 0;\n    margin: 0;\n  }\n  :where(nano-collapsible-comparison, .nano-collapsible-comparison) ul[slot=content] {\n    list-style: none;\n  }\n  :where(nano-collapsible-comparison, .nano-collapsible-comparison) ul[slot=content] > li {\n    margin: 0;\n    padding-block-start: var(--nano-spacing-md);\n  }\n  :where(nano-collapsible-comparison, .nano-collapsible-comparison) [slot=label] {\n    display: flex;\n    align-items: center;\n  }\n  :where(nano-collapsible-comparison, .nano-collapsible-comparison) nano-details {\n    --btn-bg-color: transparent;\n    --btn-bg-color--active: transparent;\n    --btn-bg-color--hover: transparent;\n    --padding: 0;\n    border: none;\n  }\n  :where(nano-collapsible-comparison, .nano-collapsible-comparison) nano-details::part(header), :where(nano-collapsible-comparison, .nano-collapsible-comparison) nano-details [part~=header] {\n    color: var(--color-primary);\n  }\n  :where(nano-collapsible-comparison, .nano-collapsible-comparison) nano-details::part(label), :where(nano-collapsible-comparison, .nano-collapsible-comparison) nano-details [part~=label], :where(nano-collapsible-comparison, .nano-collapsible-comparison) nano-details::part(content), :where(nano-collapsible-comparison, .nano-collapsible-comparison) nano-details [part~=content] {\n    display: grid;\n    grid-template-columns: 1fr 1fr;\n    gap: var(--nano-spacing-l1-default);\n  }\n  :where(nano-collapsible-comparison, .nano-collapsible-comparison) nano-details::part(icon--end), :where(nano-collapsible-comparison, .nano-collapsible-comparison) nano-details [part~=icon--end] {\n    display: none;\n  }\n  :where(nano-collapsible-comparison, .nano-collapsible-comparison) nano-details::part(content), :where(nano-collapsible-comparison, .nano-collapsible-comparison) nano-details [part~=content] {\n    padding: var(--nano-spacing-md) 0;\n  }\n  :where(nano-collapsible-comparison, .nano-collapsible-comparison) nano-details::part(body), :where(nano-collapsible-comparison, .nano-collapsible-comparison) nano-details [part~=body] {\n    border-block-end: 1px solid var(--color-border);\n  }\n  :where(nano-collapsible-comparison, .nano-collapsible-comparison) nano-details ul {\n    list-style: disc;\n    padding-inline-start: var(--nano-spacing-md);\n  }\n  :where(nano-collapsible-comparison, .nano-collapsible-comparison) nano-details ul li {\n    font-size: var(--nano-font-size-xs);\n  }\n}\n@layer components {\n  :where(nano-menu, .nano-menu) :where(nano-nav-item, .nano-nav-item) {\n    --padding: inherit;\n    display: block;\n    border-block-start: 1px solid var(--nano-color-border-default);\n  }\n  :where(nano-menu, .nano-menu) :where(nano-nav-item, .nano-nav-item):not(:has(+ nano-nav-item), :has(+ nano-dropdown), :has(+ nano-content-links)) {\n    border-block-end: 1px solid var(--nano-color-border-default);\n  }\n  :where(nano-menu, .nano-menu) :where(nano-nav-item, .nano-nav-item)::part(trigger) {\n    font-size: var(--nano-font-size-sm);\n    line-height: var(--nano-line-height-normal);\n    letter-spacing: var(--nano-letter-spacing-loose);\n  }\n  :where(nano-menu, .nano-menu) :where(nano-nav-item, .nano-nav-item)[checkbox]::part(label)::before {\n    content: "";\n    display: inline-block;\n    vertical-align: middle;\n    background-size: cover;\n    -webkit-mask-repeat: no-repeat;\n            mask-repeat: no-repeat;\n    -webkit-mask-position: center;\n            mask-position: center;\n    inline-size: 0.8em;\n    block-size: 0.8em;\n    -webkit-mask-image: var(--nano-component-icon-check);\n            mask-image: var(--nano-component-icon-check);\n    background-color: var(--icon-color);\n    opacity: 0;\n    margin-inline-end: var(--nano-spacing-sm);\n    align-content: center;\n  }\n  :where(nano-menu, .nano-menu) :where(nano-nav-item, .nano-nav-item)[checkbox][selected]::part(label)::before {\n    opacity: 1;\n  }\n  :where(nano-menu, .nano-menu) a {\n    font-size: calc(var(--font-size) - 0.125rem);\n    color: var(--nano-color-text-link);\n  }\n  :where(nano-menu, .nano-menu) :where(nano-icon, .nano-icon) {\n    color: var(--icon-color);\n  }\n  :where(nano-menu, .nano-menu) :where(nano-nav-item, .nano-nav-item)::part(trigger-wrapper) {\n    flex: 1;\n  }\n  :where(nano-menu, .nano-menu) :where(nano-nav-item, .nano-nav-item)::part(trigger),\n  :where(nano-menu, .nano-menu) :where(nano-nav-item, .nano-nav-item) [slot=close-button],\n  :where(nano-menu, .nano-menu) nano-content-links a {\n    --icon-color: var(--nano-color-text-link);\n    color: var(--nano-color-text-default);\n    font-size: var(--font-size);\n  }\n  :where(nano-menu, .nano-menu) a:hover:not(:focus-visible),\n  :where(nano-menu, .nano-menu) :where(nano-nav-item, .nano-nav-item):not([disabled]) [slot=close-button]:hover:not(:focus-visible),\n  :where(nano-menu, .nano-menu) :where(nano-nav-item, .nano-nav-item):not([disabled])::part(trigger):hover:not(:focus-visible) {\n    --icon-color: var(--nano-color-icon-hover);\n    color: var(--nano-color-text-default);\n    background-color: var(--nano-color-surface-subtle-hover);\n  }\n  :where(nano-menu, .nano-menu) a:active:not(:focus-visible),\n  :where(nano-menu, .nano-menu) :where(nano-nav-item, .nano-nav-item):not([disabled]) [slot=close-button]:active:not(:focus-visible),\n  :where(nano-menu, .nano-menu) :where(nano-nav-item, .nano-nav-item):not([disabled])::part(trigger):active:not(:focus-visible) {\n    --icon-color: var(--nano-color-icon-primary);\n    color: var(--nano-color-text-default);\n    background-color: var(--nano-color-surface-subtle);\n  }\n  :where(nano-menu, .nano-menu) :where(nano-nav-item, .nano-nav-item) [slot=close-button]:focus-visible,\n  :where(nano-menu, .nano-menu) :where(nano-nav-item, .nano-nav-item)::part(trigger):focus-visible,\n  :where(nano-menu, .nano-menu) a:focus-visible {\n    --icon-color: var(--nano-color-icon-inverse);\n    outline: none;\n    background-color: var(--nano-color-fill-primary);\n    color: var(--nano-color-text-inverse);\n  }\n  :where(nano-menu, .nano-menu) :where(nano-nav-item, .nano-nav-item) [slot=close-button]:focus-visible:active,\n  :where(nano-menu, .nano-menu) :where(nano-nav-item, .nano-nav-item)::part(trigger):focus-visible:active,\n  :where(nano-menu, .nano-menu) a:focus-visible:active {\n    background-color: var(--nano-color-text-primary);\n  }\n  :where(nano-menu, .nano-menu) nano-content-links a::after {\n    background-color: var(--icon-color);\n  }\n  :where(nano-menu, .nano-menu) :where(nano-dropdown, .nano-dropdown) {\n    display: contents;\n  }\n  :where(nano-menu, .nano-menu) :where(nano-dropdown, .nano-dropdown) :where(nano-nav-item, .nano-nav-item) {\n    --padding: var(--nav-item-padding);\n  }\n  :where(nano-menu, .nano-menu) :where(nano-nav-item, .nano-nav-item)::part(modal) {\n    position: absolute;\n    min-block-size: 100%;\n    inset-block-start: 0;\n    inset-inline-start: 0;\n    inline-size: 100%;\n    z-index: 1;\n    opacity: 0;\n    transition: opacity var(--nano-transition-x-fast) ease, transform var(--nano-transition-fast) ease;\n    transform: translate3d(100%, 0, 0);\n    background: var(--background);\n  }\n  :where(nano-menu, .nano-menu) :where(nano-nav-item, .nano-nav-item)::part(modal modal--open) {\n    opacity: 1;\n    transform: translate3d(0, 0, 0);\n    transition: opacity var(--nano-transition-x-fast) ease, transform var(--nano-transition-fast) ease;\n  }\n  :where(nano-menu, .nano-menu) :where(nano-nav-item, .nano-nav-item) [slot=close-button] {\n    padding: var(--padding);\n    display: flex;\n    gap: var(--nano-spacing-md);\n    align-items: center;\n    cursor: pointer;\n    inline-size: 100%;\n    border-block-start: 1px solid var(--nano-color-border-default);\n  }\n  :where(nano-menu, .nano-menu) :where(nano-nav-item, .nano-nav-item) [slot=close-button]::before {\n    content: "";\n    margin-inline-start: 0;\n    background-size: cover;\n    inline-size: 1em;\n    block-size: 1em;\n    -webkit-mask-image: var(--nano-component-icon-caret);\n            mask-image: var(--nano-component-icon-caret);\n    -webkit-mask-repeat: no-repeat;\n            mask-repeat: no-repeat;\n    -webkit-mask-position: center;\n            mask-position: center;\n    transform-origin: center;\n    rotate: 180deg;\n    background-color: var(--icon-color);\n  }\n}\n@layer components {\n  nano-icon-item {\n    --icon-dims: var(--nano-pictogram-size-large);\n    display: grid;\n    grid-template-columns: 1fr;\n    justify-items: center;\n    inline-size: 100%;\n    gap: var(--nano-spacing-md);\n  }\n  nano-icon-item[size=large] {\n    --icon-dims: var(--nano-pictogram-size-x-large);\n  }\n  nano-icon-item nano-icon, nano-icon-item .nano-icon {\n    --icon-size: var(--icon-dims) !important;\n  }\n  nano-icon-item a:not(p > a),\n  nano-icon-item [slot=heading] {\n    all: unset;\n    font-weight: var(--nano-font-weight-normal);\n    font-size: var(--nano-font-size-md);\n    line-height: var(--nano-line-height-dense);\n    text-wrap: balance;\n    color: var(--nano-color-text-default);\n    text-align: center;\n  }\n  nano-icon-item p[slot=content] {\n    all: unset;\n    font-size: var(--nano-font-size-sm);\n    line-height: var(--nano-line-height-normal);\n    letter-spacing: var(--nano-letter-spacing-loose);\n    text-align: center;\n  }\n  nano-icon-item [slot=icon] {\n    color: var(--nano-color-icon-default);\n  }\n  nano-icon-item[landscape] {\n    justify-items: start;\n    grid-template-columns: min-content 1fr !important;\n    row-gap: var(--nano-spacing-sm);\n  }\n  nano-icon-item[landscape]:has([slot=icon]):has([slot=heading]) [slot=heading],\n  nano-icon-item[landscape]:has([slot=icon]):has([slot=heading]) p[slot=content], nano-icon-item[landscape]:has([slot=icon]):has([slot=content]) [slot=heading],\n  nano-icon-item[landscape]:has([slot=icon]):has([slot=content]) p[slot=content] {\n    grid-row: 1;\n    align-self: center;\n  }\n  nano-icon-item[landscape]:has([slot=icon]):has([slot=heading]):has([slot=content]) a,\n  nano-icon-item[landscape]:has([slot=icon]):has([slot=heading]):has([slot=content]) [slot=heading] {\n    grid-row: 1;\n  }\n  nano-icon-item[landscape]:has([slot=icon]):has([slot=heading]):has([slot=content]) p[slot=content] {\n    grid-row: 2;\n  }\n  nano-icon-item[landscape] nano-icon[slot=icon] {\n    grid-column: 1;\n  }\n  nano-icon-item[landscape] [slot=icon] {\n    grid-column: 1;\n    grid-row: 1/-1;\n  }\n  nano-icon-item[landscape] a,\n  nano-icon-item[landscape] [slot=heading] {\n    text-align: start;\n    align-self: center;\n    grid-row: 1;\n    grid-column: 2;\n  }\n  nano-icon-item[landscape] p[slot=content] {\n    text-align: start;\n    grid-row: 2;\n    grid-column: 2;\n  }\n  nano-icon-item a,\n  nano-icon-item a > [slot=heading] {\n    cursor: pointer;\n    text-decoration: underline;\n    color: var(--nano-color-text-link);\n  }\n  nano-icon-item a:hover {\n    color: var(--nano-color-text-hover);\n  }\n  nano-icon-item a:hover [slot=heading] {\n    color: var(--nano-color-text-hover);\n  }\n  nano-icon-item:has(a:hover) nano-icon {\n    color: var(--nano-color-text-hover);\n  }\n}\n@layer components {\n  :where(nano-tab-group, .nano-tab-group)[equal-tab-size] .nano-tab {\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    flex: 1;\n  }\n  :where(nano-tab-group, .nano-tab-group)[placement=start][equal-tab-size] .nano-tab {\n    justify-content: flex-end;\n  }\n  :where(nano-tab-group, .nano-tab-group)[placement=start] .nano-tab {\n    border-block-end: none;\n    border-inline-end: var(--border);\n  }\n  :where(nano-tab-group, .nano-tab-group)[placement=start] .nano-tab::part(base),\n  :where(nano-tab-group, .nano-tab-group)[placement=start] .nano-tab [part~=base] {\n    justify-content: end;\n  }\n  :where(nano-tab-group, .nano-tab-group)[placement=start] .nano-tab::part(label),\n  :where(nano-tab-group, .nano-tab-group)[placement=start] .nano-tab [part~=label] {\n    align-items: flex-end;\n  }\n  :where(nano-tab-group, .nano-tab-group)[placement=start] .nano-tab:not([disabled]):hover {\n    border-color: inherit;\n  }\n  :where(nano-tab-group, .nano-tab-group)[placement=start] .nano-tab:not([disabled])[active] {\n    border-color: inherit;\n  }\n  :where(nano-tab-group, .nano-tab-group)[placement=top][size=large]::part(tabs__wrapper), :where(nano-tab-group, .nano-tab-group)[placement=top][size=large] [part~=tabs__wrapper] {\n    --scroll-btn-size: 2rem;\n  }\n  :where(nano-tab-group, .nano-tab-group)[placement=top][size=large] .nano-tab {\n    font-weight: var(--nano-font-weight-normal);\n    font-size: var(--nano-font-size-lg);\n    line-height: var(--nano-line-height-dense);\n    text-wrap: balance;\n    --padding: 1.5625rem;\n  }\n}\n@layer components {\n  :where(nano-tooltip, .nano-tooltip) [slot=content], :where(nano-tooltip, .nano-tooltip) [slot=content] * {\n    font-size: var(--nano-font-size-2xs);\n  }\n  :where(nano-tooltip, .nano-tooltip) ul[slot=content] {\n    margin-block: 0;\n    padding-inline: 0;\n    margin-inline: var(--nano-spacing-md);\n  }\n  :where(nano-tooltip, .nano-tooltip) [slot=content] li {\n    margin-block-end: 0;\n  }\n}\n@layer components {\n  :where(nano-table, .nano-table) {\n    --table-padding: var(--nano-spacing-md);\n    --table-compact-padding: var(--nano-spacing-sm) calc(var(--nano-spacing-md) - (var(--nano-spacing-md) / 3));\n    --table-border-color: var(--nano-color-border-default);\n    --table-border-color-header: var(--nano-color-border-default);\n    --table-background: var(--nano-color-background-default);\n    --table-wrapper-max-height: 80vh;\n    --table-width: 100%;\n    --isLtR: 1;\n    overflow-y: clip;\n    display: block;\n    container-type: inline-size;\n  }\n  :where(nano-table, .nano-table):dir(rtl) {\n    --isLtR: -1;\n  }\n  :where(nano-table, .nano-table)[compact]:not([compact=false], [compact=auto]) {\n    --table-padding: var(--table-compact-padding);\n  }\n  @media (width <= 500px) {\n    :where(nano-table, .nano-table)[compact=auto] {\n      --table-padding: var(--table-compact-padding);\n    }\n  }\n  @container (width <= 500px) {\n    :where(nano-table, .nano-table)[compact=auto] .nano-table__overflow {\n      --table-padding: var(--table-compact-padding);\n    }\n  }\n  :where(nano-table, .nano-table):not([scrollable=false]) {\n    overflow-y: visible;\n  }\n  :where(nano-table, .nano-table):not([scrollable=false]) .nano-masked-overflow {\n    --fade-size: 30px;\n  }\n  :where(nano-table, .nano-table):not([scrollable=false]):has([sticky=start], [sticky=end]) .nano-masked-overflow {\n    --fade-size: 0;\n  }\n  :where(nano-table, .nano-table):not([scrollable=false]):not(.nano-table--props-ready) {\n    overflow: auto;\n    scrollbar-width: thin;\n    max-inline-size: var(--table-width);\n    max-block-size: var(--table-wrapper-max-height);\n  }\n  :where(nano-table, .nano-table):not([scrollable=false]) .nano-table__overflow-container {\n    inline-size: var(--table-width);\n  }\n  :where(nano-table, .nano-table):not([scrollable=false]) .nano-table__overflow {\n    max-inline-size: var(--table-width);\n    max-block-size: var(--table-wrapper-max-height);\n    position: relative;\n    flex: 1;\n  }\n  :where(nano-table, .nano-table) tr[clickable] {\n    cursor: pointer;\n  }\n  :where(nano-table, .nano-table) tr[clickable]:not([sticky]) {\n    position: relative;\n  }\n  :where(nano-table, .nano-table) tr[clickable]:focus-within {\n    --table-background: var(--nano-color-fill-secondary-hover);\n  }\n  :where(nano-table, .nano-table) tr[clickable]:hover {\n    --table-background: var(--nano-color-surface-brand-feature);\n  }\n  :where(nano-table, .nano-table) tr[clickable] input[type=checkbox]::after,\n  :where(nano-table, .nano-table) tr[clickable] nano-checkbox::after,\n  :where(nano-table, .nano-table) tr[clickable] a::after,\n  :where(nano-table, .nano-table) tr[clickable] button::after {\n    content: "";\n    position: absolute;\n    inset: 0;\n    pointer-events: none;\n  }\n  :where(nano-table, .nano-table) tr[sticky] {\n    position: sticky;\n    container-type: scroll-state;\n    inset-block-start: var(--sticky-top, 0);\n  }\n  :where(nano-table, .nano-table) tfoot tr[sticky] {\n    inset-block-end: 0;\n  }\n  :where(nano-table, .nano-table) tfoot tr[sticky],\n  :where(nano-table, .nano-table) thead tr[sticky] {\n    z-index: var(--nano-z-index-menubar);\n  }\n  :where(nano-table, .nano-table) tbody tr[sticky] {\n    z-index: var(--nano-z-index-raised);\n    overflow-y: clip;\n  }\n  @container scroll-state(stuck: top) {\n    :where(nano-table, .nano-table) tbody tr[sticky] td, :where(nano-table, .nano-table) tbody tr[sticky] th {\n      border-block-end: 1px solid var(--table-border-color-header);\n    }\n  }\n  @supports not (container-type: scroll-state) {\n    :where(nano-table, .nano-table) tbody tr[sticky] td, :where(nano-table, .nano-table) tbody tr[sticky] th {\n      border-block-end: 1px solid var(--table-border-color-header);\n    }\n  }\n  :where(nano-table, .nano-table) tbody tr[sticky] td[sticky],\n  :where(nano-table, .nano-table) tbody tr[sticky] th[sticky] {\n    overflow-y: clip;\n  }\n  :where(nano-table, .nano-table) tbody tr[sticky] td[sticky]::after,\n  :where(nano-table, .nano-table) tbody tr[sticky] th[sticky]::after {\n    content: "";\n    visibility: hidden;\n    inline-size: 10px;\n    inset-block-start: 0;\n    block-size: var(--section-height);\n    position: absolute;\n  }\n  @container scroll-state(stuck: left) {\n    :where(nano-table, .nano-table) tbody tr[sticky] td[sticky]::after,\n    :where(nano-table, .nano-table) tbody tr[sticky] th[sticky]::after {\n      visibility: visible;\n    }\n  }\n  @container scroll-state(stuck: right) {\n    :where(nano-table, .nano-table) tbody tr[sticky] td[sticky]::after,\n    :where(nano-table, .nano-table) tbody tr[sticky] th[sticky]::after {\n      visibility: visible;\n    }\n  }\n  :where(nano-table, .nano-table) tbody tr[sticky] [sticky=start]::after {\n    inset-inline-end: 0;\n    box-shadow: calc(4px * var(--isLtR)) -3px 4px -2px rgb(var(--nano-color-base-rgb-1000)/25%);\n  }\n  :where(nano-table, .nano-table) tbody tr[sticky] [sticky=end]::after {\n    inset-inline-start: 0;\n    box-shadow: calc(-4px * var(--isLtR)) -3px 4px -2px rgb(var(--nano-color-base-rgb-1000)/25%);\n  }\n  @container (width <= 500px) {\n    :where(nano-table, .nano-table) .nano-table__overflow td[sticky], :where(nano-table, .nano-table) .nano-table__overflow th[sticky] {\n      --sticky-start: 0px !important;\n      --sticky-end: 0px !important;\n    }\n    :where(nano-table, .nano-table) .nano-table__overflow td[sticky]:not(:first-of-type), :where(nano-table, .nano-table) .nano-table__overflow th[sticky]:not(:first-of-type) {\n      position: initial !important;\n      z-index: initial !important;\n    }\n  }\n  @media (width <= 500px) {\n    :where(nano-table, .nano-table) td[sticky], :where(nano-table, .nano-table) th[sticky] {\n      --sticky-start: 0px !important;\n      --sticky-end: 0px !important;\n    }\n    :where(nano-table, .nano-table) td[sticky]:not(:first-of-type), :where(nano-table, .nano-table) th[sticky]:not(:first-of-type) {\n      position: initial !important;\n      z-index: initial !important;\n    }\n  }\n  :where(nano-table, .nano-table) :where(thead, tbody) td[sticky], :where(nano-table, .nano-table) th[sticky] {\n    position: sticky;\n    container-type: scroll-state;\n    z-index: var(--nano-z-index);\n  }\n  @supports not (container-type: scroll-state) {\n    :where(nano-table, .nano-table) :where(thead, tbody) td[sticky]::after, :where(nano-table, .nano-table) th[sticky]::after {\n      content: "";\n      position: absolute;\n      box-shadow: 14px 0 14px 0 var(--table-background);\n      inset-inline: auto 0;\n      block-size: calc(100% - var(--nano-spacing-md));\n      inset-block-start: calc(var(--nano-spacing-md) / 2);\n      inline-size: var(--nano-spacing-md);\n    }\n    :where(nano-table, .nano-table) :where(thead, tbody) td[sticky]:is([sticky=end])::after, :where(nano-table, .nano-table) th[sticky]:is([sticky=end])::after {\n      box-shadow: -14px 0 14px 0 var(--table-background);\n      inset-inline: 0 auto;\n    }\n  }\n  :where(nano-table, .nano-table) td[sticky=start], :where(nano-table, .nano-table) th[sticky=start] {\n    inset-inline-start: var(--sticky-start, 0);\n  }\n  :where(nano-table, .nano-table) td[sticky=end], :where(nano-table, .nano-table) th[sticky=end] {\n    inset-inline-end: var(--sticky-end, 0);\n    z-index: calc(var(--nano-z-index) + 1);\n  }\n  @supports (container-type: scroll-state) {\n    :where(nano-table, .nano-table) :where(thead, tbody) tr:has([sticky=start], [sticky=end]):first-of-type [sticky=start]::after, :where(nano-table, .nano-table) :where(thead, tbody) tr:has([sticky=start], [sticky=end]):first-of-type [sticky=end]::after {\n      content: "";\n      visibility: hidden;\n      inline-size: 10px;\n      inset-block-start: 0;\n      block-size: var(--section-height);\n      position: absolute;\n    }\n    @container scroll-state(stuck: left) {\n      :where(nano-table, .nano-table) :where(thead, tbody) tr:has([sticky=start], [sticky=end]):first-of-type [sticky=start]::after, :where(nano-table, .nano-table) :where(thead, tbody) tr:has([sticky=start], [sticky=end]):first-of-type [sticky=end]::after {\n        visibility: visible;\n      }\n    }\n    @container scroll-state(stuck: right) {\n      :where(nano-table, .nano-table) :where(thead, tbody) tr:has([sticky=start], [sticky=end]):first-of-type [sticky=start]::after, :where(nano-table, .nano-table) :where(thead, tbody) tr:has([sticky=start], [sticky=end]):first-of-type [sticky=end]::after {\n        visibility: visible;\n      }\n    }\n    :where(nano-table, .nano-table) :where(thead, tbody) tr:has([sticky=start], [sticky=end]):first-of-type [sticky=start]::after {\n      inset-inline-end: 0;\n      box-shadow: calc(4px * var(--isLtR)) 0 4px -2px rgb(var(--nano-color-base-rgb-1000)/25%);\n    }\n    :where(nano-table, .nano-table) :where(thead, tbody) tr:has([sticky=start], [sticky=end]):first-of-type [sticky=end]::after {\n      inset-inline-start: 0;\n      box-shadow: calc(-4px * var(--isLtR)) 0 4px -2px rgb(var(--nano-color-base-rgb-1000)/25%);\n    }\n  }\n}\n@layer components {\n  nano-feature-box {\n    --color: var(--nano-color-basic-white);\n    --bg: var(--nano-color-surface-special);\n    container-type: inline-size;\n    display: grid;\n    grid-template-columns: calc(50% - var(--nano-spacing-l1-default)) 1fr;\n    gap: 0;\n    background-color: var(--bg);\n    color: var(--color);\n    overflow: clip;\n    position: relative;\n    min-block-size: 270px;\n  }\n  nano-feature-box [slot] {\n    grid-column: 2;\n    grid-row: 1/-1;\n  }\n  nano-feature-box::before {\n    content: "";\n    display: block;\n    grid-column: 1;\n  }\n  nano-feature-box [slot=img] {\n    grid-column: 1;\n    object-fit: cover;\n    position: absolute;\n    inline-size: calc(50% - var(--nano-spacing-l1-default));\n    block-size: 101% !important;\n    inset-block-start: 50%;\n    transform: translateY(-50%);\n  }\n  @container (width < 650px) {\n    nano-feature-box::before {\n      display: none;\n    }\n    nano-feature-box [slot] {\n      grid-column: 1/-1 !important;\n      grid-row: 2;\n    }\n    nano-feature-box [slot=img] {\n      grid-row: 1;\n      grid-column: 1/-1 !important;\n      position: static;\n      transform: none;\n      inset-block-start: 0;\n      inline-size: 100%;\n      block-size: auto !important;\n      min-block-size: 0;\n    }\n  }\n  nano-feature-box[img-position=end] {\n    grid-template-columns: 1fr calc(50% - var(--nano-spacing-l1-default));\n  }\n  nano-feature-box[img-position=end] [slot] {\n    grid-column: 1;\n  }\n  nano-feature-box[img-position=end] [slot=img] {\n    grid-column: 2;\n    min-inline-size: -webkit-fill-available;\n    min-inline-size: -moz-available;\n    min-inline-size: stretch;\n  }\n  nano-feature-box[img-position=end]::before {\n    grid-column: 2;\n  }\n  nano-feature-box [slot=content] {\n    padding: var(--nano-spacing-l1-default);\n    display: flex;\n    flex-direction: column;\n    gap: var(--nano-spacing-sm);\n  }\n  nano-feature-box [slot=content] h1, nano-feature-box [slot=content] h2, nano-feature-box [slot=content] h3, nano-feature-box [slot=content] h4, nano-feature-box [slot=content] h5, nano-feature-box [slot=content] h6 {\n    text-wrap: balance;\n  }\n  nano-feature-box [slot=content] a {\n    color: var(--nano-color-blue-cerulean-700);\n  }\n  nano-feature-box [slot=content] > * {\n    margin-block: unset;\n    margin-block-start: unset;\n    margin-block-end: unset;\n  }\n}\n@layer components {\n  nano-menu-drawer:not(.secondary-open) nano-nav-item:hover::part(trigger) {\n    box-shadow: -3px 0 2px inset rgba(0, 0, 0, 0.15);\n  }\n  nano-menu-drawer > nano-nav-item {\n    --padding: var(--padding-top) var(--nano-spacing-md) var(--padding-bottom) var(--padding-start);\n    color-scheme: dark;\n  }\n  nano-menu-drawer > nano-nav-item:hover {\n    background-color: var(--bg-color-hover);\n  }\n  nano-menu-drawer > nano-nav-item:active, nano-menu-drawer > nano-nav-item[selected] {\n    background-color: var(--bg-color-selected);\n  }\n  nano-menu-drawer > nano-nav-item[open] {\n    background-color: var(--bg-color-open);\n  }\n  nano-menu-drawer > nano-nav-item::part(trigger), nano-menu-drawer > nano-nav-item [part~=trigger] {\n    gap: 1rem;\n    border-block-end: var(--divider-color) 1px solid;\n    white-space: nowrap;\n    min-inline-size: fit-content;\n  }\n  nano-menu-drawer > nano-nav-item::part(trigger):focus-visible, nano-menu-drawer > nano-nav-item [part~=trigger]:focus-visible {\n    outline: var(--nano-focus-ring);\n    outline-offset: -3px;\n  }\n  nano-menu-drawer > nano-nav-item::part(modal) {\n    position: absolute;\n    inset: calc(var(--global-nav-height) * -1) 0 0 100%;\n    z-index: -1;\n    block-size: 100vh;\n    inline-size: calc(100vw - (var(--menu-width) + var(--scrollbar-width, 0px)));\n  }\n  nano-menu-drawer > nano-nav-item::part(modal-content) {\n    inline-size: 400px;\n    background: var(--bg-color);\n    block-size: 100vh;\n    overflow: auto;\n    scrollbar-width: thin;\n    inset-inline-start: -400px;\n    position: absolute;\n    transition: inset-inline-start var(--nano-transition-fast) ease;\n    padding: calc(var(--global-nav-height) + var(--nano-spacing-md)) var(--nano-spacing-md) var(--nano-spacing-md);\n    box-shadow: var(--nano-shadow-ls);\n  }\n  nano-menu-drawer > nano-nav-item::part(modal-content modal-content--open) {\n    inset-inline-start: 0;\n  }\n  nano-menu-drawer > nano-nav-item::part(modal-mask) {\n    position: absolute;\n    inset: 0;\n    z-index: -1;\n  }\n  nano-menu-drawer > nano-nav-item::part(close-button) {\n    display: flex;\n    justify-content: flex-end;\n    border-block-end: var(--divider-color) 1px solid;\n    padding-block-end: var(--nano-spacing-sm);\n    color: var(--nano-color-fill-primary);\n    text-decoration: underline;\n  }\n  nano-menu-drawer > nano-nav-item::part(close-button):hover {\n    color: var(--nano-color-fill-primary-hover);\n  }\n  nano-menu-drawer > nano-nav-item [slot=close-button] {\n    cursor: pointer;\n  }\n  nano-menu-drawer > nano-nav-item [slot=secondary] {\n    font-size: var(--nano-font-size-xs);\n    color: var(--content-color);\n  }\n  nano-menu-drawer > nano-nav-item nano-icon {\n    --icon-size: inherit;\n  }\n  nano-menu-drawer > nano-nav-item nano-icon[slot=icon-end] {\n    margin-inline-end: calc((var(--nano-spacing-md)) / 2 * -1);\n    color: var(--nano-color-fill-primary);\n    position: relative;\n  }\n  nano-menu-drawer > nano-nav-item [slot=icon-start] {\n    position: relative;\n  }\n  nano-menu-drawer > nano-nav-item [slot=icon-start] nano-badge {\n    position: absolute;\n    inset-block-start: 0;\n    inset-inline-end: 0;\n    translate: 100% -50%;\n  }\n  [slot=secondary] .md__list {\n    display: flex;\n    flex-direction: column;\n    margin: 0;\n    padding: 0;\n  }\n  [slot=secondary] .md__list > * {\n    all: unset;\n    border-block-end: var(--divider-color) 1px solid;\n    list-style: none;\n    margin: 0;\n    padding: var(--nano-spacing-sm) 0;\n    font-size: var(--nano-font-size-xs);\n    display: flex;\n    flex-direction: column;\n    gap: var(--nano-spacing-sm);\n  }\n  [slot=secondary] .md__list > *:is(button, a) {\n    cursor: pointer;\n    padding-inline: var(--nano-spacing-md);\n  }\n  [slot=secondary] .md__list > *:is(button, a):hover {\n    background-color: var(--bg-color-hover);\n  }\n  [slot=secondary] .md__list > *:is(button, a):active {\n    background-color: var(--bg-color-selected);\n  }\n  [slot=secondary] .md__list > *:is(button, a):focus-visible {\n    outline: var(--nano-focus-ring);\n    outline-offset: var(--nano-focus-ring-offset);\n  }\n  [slot=secondary] .md__list .md__list-head {\n    display: flex;\n    justify-content: space-between;\n    gap: inherit;\n    align-items: center;\n  }\n  [slot=secondary] .md__list .md__list-head :first-child {\n    flex: 1;\n  }\n}\nnano-increment input[type=number]::-webkit-inner-spin-button,\nnano-increment input[type=number]::-webkit-outer-spin-button, .nano-increment input[type=number]::-webkit-inner-spin-button,\n.nano-increment input[type=number]::-webkit-outer-spin-button {\n  appearance: none;\n  margin: 0;\n}\nnano-increment input[type=number], .nano-increment input[type=number] {\n  appearance: textfield;\n}\nnano-increment nano-input, .nano-increment nano-input {\n  display: grid;\n  grid-column: 1/span 3;\n  grid-row: 1/span 2;\n  grid-template-columns: subgrid;\n  grid-template-rows: subgrid;\n}\nnano-increment nano-input.has-focus, .nano-increment nano-input.has-focus {\n  z-index: 2;\n}\nnano-increment nano-input > div,\nnano-increment nano-input .form-ctrl,\nnano-increment nano-input .form-ctrl__wrapper, .nano-increment nano-input > div,\n.nano-increment nano-input .form-ctrl,\n.nano-increment nano-input .form-ctrl__wrapper {\n  display: grid;\n  grid-template-columns: subgrid;\n  grid-template-rows: subgrid;\n  grid-column: 1/span 3;\n  grid-row: 1/span 2;\n}\nnano-increment nano-input .form-ctrl__input, .nano-increment nano-input .form-ctrl__input {\n  grid-column: 2;\n  grid-row: 1;\n}\nnano-increment nano-input .form-ctrl__more, .nano-increment nano-input .form-ctrl__more {\n  grid-column: 1/span 3;\n  grid-row: 2;\n  justify-self: start;\n}\nnano-increment nano-input .form-ctrl__validation-icon, .nano-increment nano-input .form-ctrl__validation-icon {\n  display: none;\n}\n\n@layer components {\n  nano-option-box {\n    --spacing: var(--nano-spacing-md);\n    display: grid;\n    grid-template-columns: 200px auto;\n    grid-template-rows: auto auto 1fr auto;\n    gap: 0 var(--spacing);\n    align-items: start;\n    padding: var(--spacing);\n    box-shadow: var(--nano-shadow-l1);\n    container-type: inline-size;\n  }\n  nano-option-box [slot=header] {\n    grid-area: header;\n    font-size: var(--nano-font-size-lg);\n    display: flex;\n    justify-content: space-between;\n    padding-block-end: var(--spacing);\n    border-block-end: 2px solid var(--nano-color-border-accent);\n    flex-wrap: wrap;\n    grid-column: 1/-1;\n    grid-row: 1;\n    gap: 0 var(--spacing);\n    margin: unset;\n    font-weight: var(--nano-font-weight-normal);\n    font-size: var(--nano-font-size-lg);\n    line-height: var(--nano-line-height-dense);\n    text-wrap: balance;\n  }\n  nano-option-box [slot=header] > * {\n    margin: unset;\n    padding: unset;\n  }\n  nano-option-box [slot=img] {\n    align-self: start;\n    grid-area: img;\n    inline-size: 100%;\n    block-size: auto;\n    object-fit: cover;\n    grid-row: 2;\n    grid-column: 1;\n    padding-block-start: var(--spacing);\n  }\n  @container (width < 417px) {\n    nano-option-box [slot=img] {\n      grid-column: 1/-1;\n    }\n  }\n  nano-option-box [slot=content] {\n    align-self: start;\n    grid-area: content;\n    grid-row: 2;\n    grid-column: 2;\n    margin: unset;\n    padding: var(--spacing) 0 0 0;\n    font-size: var(--nano-font-size-sm);\n    line-height: var(--nano-line-height-normal);\n    letter-spacing: var(--nano-letter-spacing-loose);\n  }\n  @container (width < 417px) {\n    nano-option-box [slot=content] {\n      grid-column: 1/-1;\n      grid-row: 3;\n    }\n  }\n  nano-option-box [slot=content] > * {\n    margin: unset;\n    padding: unset;\n  }\n  nano-option-box [slot=content]:not(.config-list, :has(.config-list)) {\n    display: flex;\n    flex-direction: column;\n    gap: var(--nano-spacing-md);\n    padding-block-end: var(--spacing);\n  }\n  nano-option-box [slot=content] ul.config-list, nano-option-box [slot=content]:is(ul.config-list) {\n    align-self: start;\n    list-style: none;\n    display: grid;\n    grid-template-columns: min-content 1fr;\n  }\n  nano-option-box [slot=content] ul.config-list > li, nano-option-box [slot=content]:is(ul.config-list) > li {\n    font-size: var(--nano-font-size-sm);\n    line-height: var(--nano-line-height-normal);\n    letter-spacing: var(--nano-letter-spacing-loose);\n    border-block-start: 1px solid var(--nano-color-border-default);\n    padding: var(--nano-spacing-sm) 0;\n    display: grid;\n    grid-template-columns: subgrid;\n    gap: 0 var(--nano-spacing-md);\n    grid-column: 1/-1;\n  }\n  nano-option-box [slot=content] ul.config-list > li:first-of-type, nano-option-box [slot=content]:is(ul.config-list) > li:first-of-type {\n    border-block-start: none;\n  }\n  nano-option-box [slot=content] ul.config-list > li strong, nano-option-box [slot=content]:is(ul.config-list) > li strong {\n    font-size: var(--nano-font-size-sm);\n    line-height: var(--nano-line-height-normal);\n    font-weight: var(--nano-font-weight-bold);\n  }\n  nano-option-box [slot=content] ul.config-list > li:has(span) strong, nano-option-box [slot=content]:is(ul.config-list) > li:has(span) strong {\n    grid-column: 1;\n    grid-row: 1/-1;\n  }\n  nano-option-box [slot=content] ul.config-list > li:not(:has(span)), nano-option-box [slot=content]:is(ul.config-list) > li:not(:has(span)) {\n    border-block-start: none;\n  }\n  nano-option-box [slot=content] ul.config-list > li:not(:has(span)) + li, nano-option-box [slot=content]:is(ul.config-list) > li:not(:has(span)) + li {\n    border-block-start: none;\n  }\n  nano-option-box [slot=content] ul.config-list > li:not(:has(span)) strong, nano-option-box [slot=content]:is(ul.config-list) > li:not(:has(span)) strong {\n    grid-column: 2;\n  }\n  nano-option-box [slot=content] ul.config-list > li *:not(strong), nano-option-box [slot=content]:is(ul.config-list) > li *:not(strong) {\n    grid-column: 2;\n  }\n  nano-option-box [slot=content] ul.config-list > li .meta, nano-option-box [slot=content]:is(ul.config-list) > li .meta {\n    font-size: var(--nano-font-size-2xs);\n    line-height: var(--nano-line-height-normal);\n    letter-spacing: var(--nano-letter-spacing-loose);\n    color: var(--nano-color-text-neutral);\n  }\n  nano-option-box:not(:has([slot=img])) [slot=content] {\n    grid-column: 1/-1;\n  }\n  @container (width < 417px) {\n    nano-option-box:not(:has([slot=img])) [slot=content] {\n      grid-row: 2/span 2;\n    }\n  }\n  nano-option-box [slot=footer] {\n    grid-area: footer;\n    display: flex;\n    justify-content: flex-end;\n    align-items: center;\n    flex-wrap: wrap;\n    grid-column: 1/-1;\n    grid-row: 3/span 2;\n    margin: unset;\n    border-block-start: 1px solid var(--nano-color-border-default);\n    padding-block-start: var(--spacing);\n  }\n  @container (width < 417px) {\n    nano-option-box [slot=footer] {\n      grid-row: 4;\n    }\n  }\n  nano-option-box [slot=footer] > * {\n    margin: unset;\n    padding: unset;\n  }\n}\n@layer components {\n  nano-search-result {\n    display: contents;\n  }\n  nano-search-result article {\n    display: flex;\n    flex-direction: column;\n    gap: var(--nano-spacing-sm);\n  }\n  nano-search-result *:focus-visible {\n    outline: var(--nano-focus-ring);\n    outline-offset: var(--nano-focus-ring-offset);\n  }\n  nano-search-result .search__highlight, nano-search-result .highlight {\n    background: var(--nano-color-highlight);\n    font-style: normal;\n  }\n  nano-search-result [slot],\n  nano-search-result [slot] > * {\n    padding: 0;\n    margin: 0;\n  }\n  nano-search-result [slot]:is(a),\n  nano-search-result [slot] > *:is(a) {\n    text-decoration: none;\n  }\n  nano-search-result [slot=title],\n  nano-search-result [slot=title] > :first-child {\n    font-size: var(--nano-font-size-sm);\n    line-height: var(--nano-line-height-normal);\n    font-weight: var(--nano-font-weight-bold);\n    order: 0;\n  }\n  nano-search-result a[slot=title],\n  nano-search-result a[slot=title] > *,\n  nano-search-result [slot=title] a {\n    color: var(--nano-color-text-link);\n    text-decoration: underline;\n  }\n  nano-search-result [slot=content],\n  nano-search-result [slot=content] > * {\n    font-size: var(--nano-font-size-xs);\n    line-height: var(--nano-line-height-normal);\n    letter-spacing: var(--nano-letter-spacing-loose);\n    color: var(--nano-color-text-default);\n    order: 1;\n  }\n  nano-search-result [slot=meta],\n  nano-search-result [slot=meta] > * {\n    font-size: var(--nano-font-size-2xs);\n    line-height: var(--nano-line-height-normal);\n    letter-spacing: var(--nano-letter-spacing-loose);\n  }\n  nano-search-result [slot=meta] > *:not(:last-child)::after {\n    content: "|";\n    color: var(--nano-color-text-placeholder);\n    display: inline-block;\n    padding-inline-start: var(--nano-spacing-md);\n  }\n  nano-search-result [slot=meta] {\n    order: 2;\n    display: inline-flex;\n    flex-wrap: wrap;\n    gap: var(--nano-spacing-xs) var(--nano-spacing-md);\n  }\n  nano-search-result [slot=tags] {\n    order: 3;\n    display: inline-flex;\n    flex-wrap: wrap;\n    align-items: start;\n    gap: var(--nano-spacing-sm);\n  }\n  nano-search-result [slot=tags]:is(ul, ol) {\n    list-style: none;\n  }\n  nano-search-result [slot=tags]:is(ul, ol) li {\n    display: contents;\n  }\n  nano-search-result [slot=tags] ul, nano-search-result [slot=tags] ol {\n    list-style: none;\n    display: contents;\n  }\n  nano-search-result [slot=tags] ul li, nano-search-result [slot=tags] ol li {\n    display: contents;\n  }\n}\n@layer components {\n  :root {\n    --nano-component-icon-chevron: url("data:image/svg+xml;charset=utf-8,<svg%20viewBox=\'0%200%2016%2016\'%20xmlns=\'http://www.w3.org/2000/svg\'><g><path%20fill=\'white\'%20d=\'M4.18457%2015.8496C4.06179%2015.7374%204.00044%2015.584%204.00044%2015.43C4.00044%2015.291%204.05065%2015.1521%204.15221%2015.0421L10.6195%208.00301L4.15207%200.959231C3.9378%200.727093%203.9512%200.364958%204.18443%200.151748C4.41655%20-0.0625328%204.77688%20-0.0480332%204.99114%200.183555L11.8477%207.61197C12.0508%207.83182%2012.0508%208.16767%2011.8477%208.38766L4.99114%2015.8161C4.77594%2016.046%204.41669%2016.0639%204.18457%2015.8496Z\'/></g></svg>");\n    --nano-component-icon-download: url("data:image/svg+xml;charset=utf-8,<svg%20xmlns=\'http://www.w3.org/2000/svg\'%20viewBox=\'0%200%20512%20512\'><path%20fill=\'white\'%20d=\'M272%2016c0-8.8-7.2-16-16-16s-16%207.2-16%2016l0%20313.4L139.3%20228.7c-6.2-6.2-16.4-6.2-22.6%200s-6.2%2016.4%200%2022.6l128%20128c6.2%206.2%2016.4%206.2%2022.6%200l128-128c6.2-6.2%206.2-16.4%200-22.6s-16.4-6.2-22.6%200L272%20329.4%20272%2016zM140.1%20320L64%20320c-35.3%200-64%2028.7-64%2064l0%2064c0%2035.3%2028.7%2064%2064%2064l384%200c35.3%200%2064-28.7%2064-64l0-64c0-35.3-28.7-64-64-64l-76.1%200-32%2032L448%20352c17.7%200%2032%2014.3%2032%2032l0%2064c0%2017.7-14.3%2032-32%2032L64%20480c-17.7%200-32-14.3-32-32l0-64c0-17.7%2014.3-32%2032-32l108.1%200-32-32zM432%20416a24%2024%200%201%200%20-48%200%2024%2024%200%201%200%2048%200z\'/></svg>");\n    --nano-component-icon-open: url("data:image/svg+xml;charset=utf-8,<svg%20xmlns=\'http://www.w3.org/2000/svg\'%20viewBox=\'0%200%20512%20512\'><path%20fill=\'white\'%20d=\'M336%200c-8.8%200-16%207.2-16%2016s7.2%2016%2016%2016l121.4%200L212.7%20276.7c-6.2%206.2-6.2%2016.4%200%2022.6s16.4%206.2%2022.6%200L480%2054.6%20480%20176c0%208.8%207.2%2016%2016%2016s16-7.2%2016-16l0-160c0-8.8-7.2-16-16-16L336%200zM64%2032C28.7%2032%200%2060.7%200%2096L0%20448c0%2035.3%2028.7%2064%2064%2064l352%200c35.3%200%2064-28.7%2064-64l0-144c0-8.8-7.2-16-16-16s-16%207.2-16%2016l0%20144c0%2017.7-14.3%2032-32%2032L64%20480c-17.7%200-32-14.3-32-32L32%2096c0-17.7%2014.3-32%2032-32l144%200c8.8%200%2016-7.2%2016-16s-7.2-16-16-16L64%2032z\'/></svg>");\n    --nano-component-icon-check: url("data:image/svg+xml;charset=utf-8,<svg%20xmlns=\'http://www.w3.org/2000/svg\'%20viewBox=\'0%200%20448%20512\'><path%20d=\'M443.3%20100.7c6.2%206.2%206.2%2016.4%200%2022.6l-272%20272c-6.2%206.2-16.4%206.2-22.6%200l-144-144c-6.2-6.2-6.2-16.4%200-22.6s16.4-6.2%2022.6%200L160%20361.4%20420.7%20100.7c6.2-6.2%2016.4-6.2%2022.6%200z\'/></svg>");\n    --nano-component-icon-caret: url("data:image/svg+xml;charset=utf-8,<svg%20xmlns=\'http://www.w3.org/2000/svg\'%20viewBox=\'0%200%20256%20512\'><path%20d=\'M246.6%20278.6c12.5-12.5%2012.5-32.8%200-45.3l-128-128c-9.2-9.2-22.9-11.9-34.9-6.9s-19.8%2016.6-19.8%2029.6l0%20256c0%2012.9%207.8%2024.6%2019.8%2029.6s25.7%202.2%2034.9-6.9l128-128z\'/></svg>");\n    --nano-component-icon-arrow: url("data:image/svg+xml;charset=utf-8,<svg%20xmlns=\'http://www.w3.org/2000/svg\'%20viewBox=\'0%200%20448%20512\'><path%20d=\'M443.3%20267.3c6.2-6.2%206.2-16.4%200-22.6l-176-176c-6.2-6.2-16.4-6.2-22.6%200s-6.2%2016.4%200%2022.6L393.4%20240%2016%20240c-8.8%200-16%207.2-16%2016s7.2%2016%2016%2016l377.4%200L244.7%20420.7c-6.2%206.2-6.2%2016.4%200%2022.6s16.4%206.2%2022.6%200l176-176z\'/></svg>");\n  }\n  nano-intersection-observe,\n  nano-resize-observe,\n  nano-global-search-results,\n  nano-cta,\n  nano-card,\n  nano-tag,\n  nano-content-links,\n  nano-badge,\n  nano-avatar,\n  nano-icon-item,\n  nano-option-box,\n  nano-table,\n  nano-feature-box,\n  nano-search-result {\n    visibility: visible !important;\n  }\n  body:not(.nano-eager) nano-algolia-filter,\n  body:not(.nano-eager) nano-algolia-input,\n  body:not(.nano-eager) nano-algolia-pagination,\n  body:not(.nano-eager) nano-algolia-results,\n  body:not(.nano-eager) nano-details,\n  body:not(.nano-eager) nano-accordion,\n  body:not(.nano-eager) nano-grid-item,\n  body:not(.nano-eager) nano-menu,\n  body:not(.nano-eager) nano-masked-overflow,\n  body:not(.nano-eager) nano-range,\n  body:not(.nano-eager) nano-rating,\n  body:not(.nano-eager) nano-slide,\n  body:not(.nano-eager) nano-slides,\n  body:not(.nano-eager) nano-date-input,\n  body:not(.nano-eager) nano-global-nav,\n  body:not(.nano-eager) nano-menu-drawer,\n  body:not(.nano-eager) nano-checkbox,\n  body:not(.nano-eager) nano-checkbox-group,\n  body:not(.nano-eager) nano-grid,\n  body:not(.nano-eager) nano-option,\n  body:not(.nano-eager) nano-algolia,\n  body:not(.nano-eager) nano-date-picker,\n  body:not(.nano-eager) nano-select,\n  body:not(.nano-eager) nano-dropdown,\n  body:not(.nano-eager) nano-nav-item,\n  body:not(.nano-eager) nano-input,\n  body:not(.nano-eager) nano-icon,\n  body:not(.nano-eager) nano-tab-content,\n  body:not(.nano-eager) nano-tab,\n  body:not(.nano-eager) nano-hero,\n  body:not(.nano-eager) nano-img,\n  body:not(.nano-eager) nano-datalist,\n  body:not(.nano-eager) nano-split-pane,\n  body:not(.nano-eager) nano-file-upload,\n  body:not(.nano-eager) nano-data-table,\n  body:not(.nano-eager) nano-alert,\n  body:not(.nano-eager) nano-dialog,\n  body:not(.nano-eager) nano-drawer,\n  body:not(.nano-eager) nano-footer,\n  body:not(.nano-eager) nano-in-page-nav,\n  body:not(.nano-eager) nano-collapsible-comparison,\n  body:not(.nano-eager) nano-breadcrumb,\n  body:not(.nano-eager) nano-more-less,\n  body:not(.nano-eager) nano-card-carousel {\n    visibility: hidden;\n  }\n  body:not(.nano-eager) .hydrated {\n    visibility: inherit;\n  }\n  body:not(.nano-eager) nano-card-carousel {\n    opacity: 0;\n  }\n  body:not(.nano-eager) nano-card-carousel.hydrated {\n    opacity: inherit;\n  }\n  nano-alert:not(.hydrated, [open]),\n  nano-dialog:not(.hydrated),\n  nano-drawer:not(.hydrated) {\n    display: none;\n  }\n  nano-alert[open]:not(.hydrated) {\n    display: block;\n    min-block-size: calc(var(--nano-pictogram-size-large) + var(--nano-spacing-md) * 2);\n  }\n  nano-tooltip:not(.hydrated) [slot=content] {\n    display: none;\n  }\n  nano-animation {\n    visibility: inherit !important;\n  }\n  nano-dropdown {\n    visibility: inherit !important;\n  }\n  nano-dropdown:not(.hydrated) :not([slot=trigger]) {\n    display: none;\n  }\n  nano-slides:not([ready]) {\n    opacity: 0;\n  }\n  nano-progress-bar {\n    --height: 0.625rem;\n  }\n  nano-progress-bar[size=small] {\n    --height: 0.3125rem;\n  }\n  nano-progress-bar[size=large] {\n    --height: 0.9375rem;\n  }\n  nano-progress-bar progress {\n    block-size: var(--height);\n  }\n  @supports (scrollbar-gutter: stable) {\n    .nano-scroll-lock {\n      scrollbar-gutter: var(--nano-scroll-lock-gutter) !important;\n    }\n    .nano-scroll-lock body {\n      overflow: hidden !important;\n    }\n  }\n  /** This can go away once Safari has scrollbar-gutter support. */\n  @supports not (scrollbar-gutter: stable) {\n    .nano-scroll-lock body {\n      padding-inline-end: var(--nano-scroll-lock-size) !important;\n      overflow: hidden !important;\n    }\n  }\n}'),n}())?n:null),W&&(_?o.adoptedStyleSheets.push(W):o.adoptedStyleSheets=[...o.adoptedStyleSheets,W])}var Y=n=>{const o=$n(n,"childNodes");n.tagName&&n.tagName.includes("-")&&n["s-cr"]&&"SLOT-FB"!==n.tagName&&J(o,n.tagName).forEach((n=>{1===n.nodeType&&"SLOT-FB"===n.tagName&&(n.hidden=!!X(n,Q(n),!1).length)}));let a=0;for(a=0;a<o.length;a++){const n=o[a];1===n.nodeType&&$n(n,"childNodes").length&&Y(n)}},Z=n=>{const o=[];for(let a=0;a<n.length;a++){const e=n[a]["s-nr"]||void 0;e&&e.isConnected&&o.push(e)}return o};function J(n,o,a){let e,t=0,r=[];for(;t<n.length;t++){if(e=n[t],e["s-sr"]&&(!o||e["s-hn"]===o)&&(void 0===a||Q(e)===a)&&(r.push(e),void 0!==a))return r;r=[...r,...J(e.childNodes,o,a)]}return r}var X=(n,o,a=!0)=>{const e=[];(a&&n["s-sr"]||!n["s-sr"])&&e.push(n);let t=n;for(;t=t.nextSibling;)Q(t)!==o||!a&&t["s-sr"]||e.push(t);return e},G=(n,o)=>1===n.nodeType?null===n.getAttribute("slot")&&""===o||n.getAttribute("slot")===o:n["s-sn"]===o||""===o,K=(n,o,a,e)=>{if(n["s-ol"]&&n["s-ol"].isConnected)return;const t=document.createTextNode("");if(t["s-nr"]=n,!o["s-cr"]||!o["s-cr"].parentNode)return;const r=o["s-cr"].parentNode,i=$n(r,a?"prepend":"appendChild");if(void 0!==e){t["s-oo"]=e;const n=$n(r,"childNodes"),o=[t];n.forEach((n=>{n["s-nr"]&&o.push(n)})),o.sort(((n,o)=>!n["s-oo"]||n["s-oo"]<(o["s-oo"]||0)?-1:!o["s-oo"]||o["s-oo"]<n["s-oo"]?1:0)),o.forEach((n=>i.call(r,n)))}else i.call(r,t);n["s-ol"]=t,n["s-sh"]=o["s-hn"]},Q=n=>"string"==typeof n["s-sn"]?n["s-sn"]:1===n.nodeType&&n.getAttribute("slot")||void 0;function nn(n){if(n.assignedElements||n.assignedNodes||!n["s-sr"])return;const o=o=>function(n){const a=[],e=this["s-sn"];(null==n?void 0:n.flatten)&&console.error("\n          Flattening is not supported for Stencil non-shadow slots.\n          You can use `.childNodes` to nested slot fallback content.\n          If you have a particular use case, please open an issue on the Stencil repo.\n        ");const t=this["s-cr"].parentElement;return(t.__childNodes?t.childNodes:Z(t.childNodes)).forEach((n=>{e===Q(n)&&a.push(n)})),o?a.filter((n=>1===n.nodeType)):a}.bind(n);n.assignedElements=o(!0),n.assignedNodes=o(!1)}function on(n){n.dispatchEvent(new CustomEvent("slotchange",{bubbles:!1,cancelable:!1,composed:!1}))}function an(n,o){var a;if(!(o=o||(null==(a=n["s-ol"])?void 0:a.parentElement)))return{slotNode:null,slotName:""};const e=n["s-sn"]=Q(n)||"";return{slotNode:J($n(o,"childNodes"),o.tagName,e)[0],slotName:e}}var en=n=>{const o=n.cloneNode;n.cloneNode=function(n){const a=this.shadowRoot&&true,e=o.call(this,!!a&&n);if(!a&&n){let n,o,a=0;const t=["s-id","s-cr","s-lr","s-rc","s-sc","s-p","s-cn","s-sr","s-sn","s-hn","s-ol","s-nr","s-si","s-rf","s-scs"],r=this.__childNodes||this.childNodes;for(;a<r.length;a++)n=r[a]["s-nr"],o=t.every((n=>!r[a][n])),n&&(e.__appendChild?e.__appendChild(n.cloneNode(!0)):e.appendChild(n.cloneNode(!0))),o&&e.appendChild(r[a].cloneNode(!0))}return e}},tn=n=>{n.__appendChild=n.appendChild,n.appendChild=function(n){const{slotName:o,slotNode:a}=an(n,this);if(a){K(n,a);const e=X(a,o),t=e[e.length-1],r=$n(t,"parentNode"),i=$n(r,"insertBefore")(n,t.nextSibling);return on(a),Y(this),i}return this.__appendChild(n)}},rn=n=>{n.__removeChild=n.removeChild,n.removeChild=function(n){return n&&void 0!==n["s-sn"]&&J(this.__childNodes||this.childNodes,this.tagName,n["s-sn"])&&n.isConnected?(n.remove(),void Y(this)):this.__removeChild(n)}},ln=n=>{n.__prepend=n.prepend,n.prepend=function(...o){o.forEach((o=>{"string"==typeof o&&(o=this.ownerDocument.createTextNode(o));const a=(o["s-sn"]=Q(o))||"",e=J($n(this,"childNodes"),this.tagName,a)[0];if(e){K(o,e,!0);const n=X(e,a)[0],t=$n(n,"parentNode"),r=$n(t,"insertBefore")(o,$n(n,"nextSibling"));return on(e),r}return 1===o.nodeType&&o.getAttribute("slot")&&(o.hidden=!0),n.__prepend(o)}))}},sn=n=>{n.__append=n.append,n.append=function(...n){n.forEach((n=>{"string"==typeof n&&(n=this.ownerDocument.createTextNode(n)),this.appendChild(n)}))}},cn=n=>{const o=n.insertAdjacentHTML;n.insertAdjacentHTML=function(n,a){if("afterbegin"!==n&&"beforeend"!==n)return o.call(this,n,a);const e=this.ownerDocument.createElement("_");let t;if(e.innerHTML=a,"afterbegin"===n)for(;t=e.firstChild;)this.prepend(t);else if("beforeend"===n)for(;t=e.firstChild;)this.append(t)}},dn=n=>{n.insertAdjacentText=function(n,o){this.insertAdjacentHTML(n,o)}},pn=n=>{n.__insertBefore||(n.__insertBefore=n.insertBefore,n.insertBefore=function(n,o){const{slotName:a,slotNode:e}=an(n,this),t=this.__childNodes?this.childNodes:Z(this.childNodes);if(e){let r=!1;if(t.forEach((t=>{if(t!==o&&null!==o);else{if(r=!0,null===o||a!==o["s-sn"])return void this.appendChild(n);if(a===o["s-sn"]){K(n,e);const a=$n(o,"parentNode");$n(a,"insertBefore")(n,o),on(e)}}})),r)return n}const r=null==o?void 0:o.__parentNode;return r&&!this.isSameNode(r)?this.appendChild(n):this.__insertBefore(n,o)})},bn=n=>{const o=n.insertAdjacentElement;n.insertAdjacentElement=function(n,a){return"afterbegin"!==n&&"beforeend"!==n?o.call(this,n,a):"afterbegin"===n?(this.prepend(a),a):"beforeend"===n?(this.append(a),a):a}},un=n=>{zn("textContent",n),Object.defineProperty(n,"textContent",{get:function(){let n="";return(this.__childNodes?this.childNodes:Z(this.childNodes)).forEach((o=>n+=o.textContent||"")),n},set:function(n){(this.__childNodes?this.childNodes:Z(this.childNodes)).forEach((n=>{n["s-ol"]&&n["s-ol"].remove(),n.remove()})),this.insertAdjacentHTML("beforeend",n)}})},gn=n=>{class o extends Array{item(n){return this[n]}}zn("children",n),Object.defineProperty(n,"children",{get(){return this.childNodes.filter((n=>1===n.nodeType))}}),Object.defineProperty(n,"childElementCount",{get(){return this.children.length}}),zn("firstChild",n),Object.defineProperty(n,"firstChild",{get(){return this.childNodes[0]}}),zn("lastChild",n),Object.defineProperty(n,"lastChild",{get(){return this.childNodes[this.childNodes.length-1]}}),zn("childNodes",n),Object.defineProperty(n,"childNodes",{get(){const n=new o;return n.push(...Z(this.__childNodes)),n}})},vn=n=>{n&&void 0===n.__nextSibling&&globalThis.Node&&(mn(n),fn(n),wn(n),n.nodeType===Node.ELEMENT_NODE&&(hn(n),yn(n)))},mn=n=>{n&&!n.__nextSibling&&(zn("nextSibling",n),Object.defineProperty(n,"nextSibling",{get:function(){var n;const o=null==(n=this["s-ol"])?void 0:n.parentNode.childNodes,a=null==o?void 0:o.indexOf(this);return o&&a>-1?o[a+1]:this.__nextSibling}}))},hn=n=>{n&&!n.__nextElementSibling&&(zn("nextElementSibling",n),Object.defineProperty(n,"nextElementSibling",{get:function(){var n;const o=null==(n=this["s-ol"])?void 0:n.parentNode.children,a=null==o?void 0:o.indexOf(this);return o&&a>-1?o[a+1]:this.__nextElementSibling}}))},fn=n=>{n&&!n.__previousSibling&&(zn("previousSibling",n),Object.defineProperty(n,"previousSibling",{get:function(){var n;const o=null==(n=this["s-ol"])?void 0:n.parentNode.childNodes,a=null==o?void 0:o.indexOf(this);return o&&a>-1?o[a-1]:this.__previousSibling}}))},yn=n=>{n&&!n.__previousElementSibling&&(zn("previousElementSibling",n),Object.defineProperty(n,"previousElementSibling",{get:function(){var n;const o=null==(n=this["s-ol"])?void 0:n.parentNode.children,a=null==o?void 0:o.indexOf(this);return o&&a>-1?o[a-1]:this.__previousElementSibling}}))},wn=n=>{n&&!n.__parentNode&&(zn("parentNode",n),Object.defineProperty(n,"parentNode",{get:function(){var n;return(null==(n=this["s-ol"])?void 0:n.parentNode)||this.__parentNode},set:function(n){this.__parentNode=n}}))},kn=["children","nextElementSibling","previousElementSibling"],xn=["childNodes","firstChild","lastChild","nextSibling","previousSibling","textContent","parentNode"];function zn(n,o){if(!globalThis.Node||!globalThis.Element)return;let a;kn.includes(n)?a=Object.getOwnPropertyDescriptor(Element.prototype,n):xn.includes(n)&&(a=Object.getOwnPropertyDescriptor(Node.prototype,n)),a||(a=Object.getOwnPropertyDescriptor(o,n)),a&&Object.defineProperty(o,"__"+n,a)}function $n(n,o){if("__"+o in n){const a=n["__"+o];return"function"!=typeof a?a:a.bind(n)}return"function"!=typeof n[o]?n[o]:n[o].bind(n)}var jn=new WeakMap,_n=(n,o,a)=>{let e=v.get(n);j&&a?(e=e||new CSSStyleSheet,"string"==typeof e?e=o:e.replaceSync(o)):e=o,v.set(n,e)},Sn=(n,o)=>{var a;const e=On(o),t=v.get(e);if(!k.document)return e;if(n=11===n.nodeType?n:k.document,t)if("string"==typeof t){let r,i=jn.get(n=n.head||n);if(i||jn.set(n,i=new Set),!i.has(e)){if(n.host&&(r=n.querySelector(`[${h}="${e}"]`)))r.innerHTML=t;else{r=k.document.createElement("style"),r.innerHTML=t;const e=null!=(a=z.v)?a:A(k.document);if(null!=e&&r.setAttribute("nonce",e),!(1&o.p))if("HEAD"===n.nodeName){const o=n.querySelectorAll("link[rel=preconnect]"),a=o.length>0?o[o.length-1].nextSibling:n.querySelector("style");n.insertBefore(r,(null==a?void 0:a.parentNode)===n?a:null)}else if("host"in n)if(j){const o=new CSSStyleSheet;o.replaceSync(t),_?n.adoptedStyleSheets.unshift(o):n.adoptedStyleSheets=[o,...n.adoptedStyleSheets]}else{const o=n.querySelector("style");o?o.innerHTML=t+o.innerHTML:n.prepend(r)}else n.append(r);1&o.p&&n.insertBefore(r,null)}4&o.p&&(r.innerHTML+=y),i&&i.add(e)}}else n.adoptedStyleSheets.includes(t)||(_?n.adoptedStyleSheets.push(t):n.adoptedStyleSheets=[...n.adoptedStyleSheets,t]);return e},On=n=>"sc-"+n.m,Nn=n=>n.replace(/\/\*!@([^\/]+)\*\/[^\{]+\{/g,"$1{"),Ln=(n,o,...a)=>{let e=null,t=null,r=null,i=!1,l=!1;const s=[],c=o=>{for(let a=0;a<o.length;a++)e=o[a],Array.isArray(e)?c(e):null!=e&&"boolean"!=typeof e&&((i="function"!=typeof n&&!I(e))&&(e+=""),i&&l?s[s.length-1].h+=e:s.push(i?Cn(null,e):e),l=i)};if(c(a),o){o.key&&(t=o.key),o.name&&(r=o.name);{const n=o.className||o.class;n&&(o.class="object"!=typeof n?n:Object.keys(n).filter((o=>n[o])).join(" "))}}if("function"==typeof n)return n(null===o?{}:o,s,Mn);const d=Cn(n,null);return d.k=o,s.length>0&&(d.$=s),d.j=t,d._=r,d},Cn=(n,o)=>({p:0,S:n,h:o,O:null,$:null,k:null,j:null,_:null}),En={},Mn={forEach:(n,o)=>n.map(Rn).forEach(o),map:(n,o)=>n.map(Rn).map(o).map(Bn)},Rn=n=>({vattrs:n.k,vchildren:n.$,vkey:n.j,vname:n._,vtag:n.S,vtext:n.h}),Bn=n=>{if("function"==typeof n.vtag){const o={...n.vattrs};return n.vkey&&(o.key=n.vkey),n.vname&&(o.name=n.vname),Ln(n.vtag,o,...n.vchildren||[])}const o=Cn(n.vtag,n.vtext);return o.k=n.vattrs,o.$=n.vchildren,o.j=n.vkey,o._=n.vname,o},Tn=(n,o,a,e,t,r,i,l=[])=>{let s,c,d,p;const b=t["s-sc"];if(1===r.nodeType){if(s=r.getAttribute(f),s&&(c=s.split("."),c[0]===i||"0"===c[0])){d=An({p:0,N:c[0],L:c[1],C:c[2],M:c[3],S:r.tagName.toLowerCase(),O:r,k:{class:r.className||""}}),o.push(d),r.removeAttribute(f),n.$||(n.$=[]),b&&c[0]===i&&(r["s-si"]=b,d.k.class+=" "+b);const t=d.O.getAttribute("s-sn");"string"==typeof t&&("slot-fb"===d.S&&(Pn(t,c[2],d,r,n,o,a,e,l),b&&r.classList.add(b)),d.O["s-sn"]=t,d.O.removeAttribute("s-sn")),void 0!==d.M&&(n.$[d.M]=d),n=d,e&&"0"===d.C&&(e[d.M]=d.O)}if(r.shadowRoot)for(p=r.shadowRoot.childNodes.length-1;p>=0;p--)Tn(n,o,a,e,t,r.shadowRoot.childNodes[p],i,l);const u=r.__childNodes||r.childNodes;for(p=u.length-1;p>=0;p--)Tn(n,o,a,e,t,u[p],i,l)}else if(8===r.nodeType)c=r.nodeValue.split("."),(c[1]===i||"0"===c[1])&&(s=c[0],d=An({N:c[1],L:c[2],C:c[3],M:c[4]||"0",O:r,k:null,$:null,j:null,_:null,S:null,h:null}),"t"===s?(d.O=Un(r,3),d.O&&3===d.O.nodeType&&(d.h=d.O.textContent,o.push(d),r.remove(),i===d.N&&(n.$||(n.$=[]),n.$[d.M]=d),e&&"0"===d.C&&(e[d.M]=d.O))):"c"===s?(d.O=Un(r,8),d.O&&8===d.O.nodeType&&(o.push(d),r.remove())):d.N===i&&("s"===s?Pn(r["s-sn"]=c[5]||"",c[2],d,r,n,o,a,e,l):"r"===s&&(e?r.remove():(t["s-cr"]=r,r["s-cn"]=!0))));else if(n&&"style"===n.S){const o=Cn(null,r.textContent);o.O=r,o.M="0",n.$=[o]}else 3!==r.nodeType||r.wholeText.trim()||r["s-nr"]||r.remove();return n},In=(n,o)=>{if(1===n.nodeType){const a=n[m]||n.getAttribute(m);a&&o.set(a,n);let e=0;if(n.shadowRoot)for(;e<n.shadowRoot.childNodes.length;e++)In(n.shadowRoot.childNodes[e],o);const t=n.__childNodes||n.childNodes;for(e=0;e<t.length;e++)In(t[e],o)}else if(8===n.nodeType){const a=n.nodeValue.split(".");"o"===a[0]&&(o.set(a[1]+"."+a[2],n),n.nodeValue="",n["s-en"]=a[3])}},An=n=>({p:0,N:null,L:null,C:null,M:"0",O:null,k:null,$:null,j:null,_:null,S:null,h:null,...n});function Pn(n,o,a,e,t,r,i,l,s){e["s-sr"]=!0,a._=n||null,a.S="slot";const c=(null==t?void 0:t.O)?t.O["s-id"]||t.O.getAttribute("s-id"):"";if(l&&k.document){const r=a.O=k.document.createElement(a.S);a._&&a.O.setAttribute("name",n),t.O.shadowRoot&&c&&c!==a.N?$n(t.O,"insertBefore")(r,$n(t.O,"children")[0]):$n($n(e,"parentNode"),"insertBefore")(r,e),Fn(s,o,n,e,a.N),e.remove(),"0"===a.C&&(l[a.M]=a.O)}else{const r=a.O,i=c&&c!==a.N&&t.O.shadowRoot;Fn(s,o,n,e,i?c:a.N),nn(e),i&&t.O.insertBefore(r,t.O.children[0])}r.push(a),i.push(a),t.$||(t.$=[]),t.$[a.M]=a}var Fn=(n,o,a,e,t)=>{var r,i;let l=e.nextSibling;if(n[o]=n[o]||[],l&&!(null==(r=l.nodeValue)?void 0:r.startsWith("s.")))do{!l||(l.getAttribute&&l.getAttribute("slot")||l["s-sn"])!==a&&(""!==a||l["s-sn"]||l.getAttribute&&l.getAttribute("slot")||8!==l.nodeType&&3!==l.nodeType)||(l["s-sn"]=a,n[o].push({slot:e,node:l,hostId:t})),l=null==l?void 0:l.nextSibling}while(l&&!(null==(i=l.nodeValue)?void 0:i.startsWith("s.")))},Un=(n,o)=>{let a=n;do{a=a.nextSibling}while(a&&(a.nodeType!==o||!a.nodeValue));return a},Dn=n=>{const o=(n=>n.replace(/[.*+?^${}()|[\]\\]/g,"\\$&"))(n);return RegExp(`(^|[^@]|@(?!supports\\s+selector\\s*\\([^{]*?${o}))(${o}\\b)`,"g")};Dn("::slotted"),Dn(":host"),Dn(":host-context");var Wn,qn,Vn,Hn=(n,o)=>{if("string"==typeof n&&(n.startsWith("{")&&n.endsWith("}")||n.startsWith("[")&&n.endsWith("]")))try{return JSON.parse(n)}catch(n){}return"string"==typeof n&&n.startsWith(s)?n=function(n){return"string"==typeof n&&n.startsWith(s)?P.fromLocalValue(JSON.parse(atob(n.slice(11)))):n}(n):null==n||I(n)?n:4&o?"false"!==n&&(""===n||!!n):2&o?"string"==typeof n?parseFloat(n):"number"==typeof n?n:NaN:1&o?n+"":n},Yn=n=>{var o;return null==(o=d(n))?void 0:o.$hostElement$},Zn=(n,o,a)=>{const e=Yn(n);return{emit:n=>Jn(e,o,{bubbles:!!(4&a),composed:!!(2&a),cancelable:!!(1&a),detail:n})}},Jn=(n,o,a)=>{const e=z.ce(o,a);return n.dispatchEvent(e),e},Xn=(n,o,a,e,t,r,i)=>{if(a===e)return;let l=b(n,o),s=o.toLowerCase();if("class"===o){const o=n.classList,t=Kn(a);let r=Kn(e);if((n["s-si"]||n["s-sc"])&&i){const a=n["s-sc"]||n["s-si"];r.push(a),t.forEach((n=>{n.startsWith(a)&&r.push(n)})),r=[...new Set(r)].filter((n=>n)),o.add(...r)}else o.remove(...t.filter((n=>n&&!r.includes(n)))),o.add(...r.filter((n=>n&&!t.includes(n))))}else if("style"===o){for(const o in a)e&&null!=e[o]||(o.includes("-")?n.style.removeProperty(o):n.style[o]="");for(const o in e)a&&e[o]===a[o]||(o.includes("-")?n.style.setProperty(o,e[o]):n.style[o]=e[o])}else if("key"===o);else if("ref"===o)e&&e(n);else if(l||"o"!==o[0]||"n"!==o[1]){const i=I(e);if(l||i&&null!==e)try{if(n.tagName.includes("-"))n[o]!==e&&(n[o]=e);else{const t=null==e?"":e;"list"===o?l=!1:null!=a&&n[o]==t||("function"==typeof n.__lookupSetter__(o)?n[o]=t:n.setAttribute(o,t))}}catch(n){}let c=!1;s!==(s=s.replace(/^xlink\:?/,""))&&(o=s,c=!0),null==e||!1===e?!1===e&&""!==n.getAttribute(o)||(c?n.removeAttributeNS(w,o):n.removeAttribute(o)):(!l||4&r||t)&&!i&&1===n.nodeType&&(e=!0===e?"":e,c?n.setAttributeNS(w,o,e):n.setAttribute(o,e))}else if(o="-"===o[2]?o.slice(3):b(k,s)?s.slice(2):s[2]+o.slice(3),a||e){const t=o.endsWith(Qn);o=o.replace(no,""),a&&z.rel(n,o,a,t),e&&z.ael(n,o,e,t)}},Gn=/\s/,Kn=n=>("object"==typeof n&&n&&"baseVal"in n&&(n=n.baseVal),n&&"string"==typeof n?n.split(Gn):[]),Qn="Capture",no=RegExp(Qn+"$"),oo=(n,o,a,e)=>{const t=11===o.O.nodeType&&o.O.host?o.O.host:o.O,r=n&&n.k||{},i=o.k||{};for(const n of ao(Object.keys(r)))n in i||Xn(t,n,r[n],void 0,a,o.p,e);for(const n of ao(Object.keys(i)))Xn(t,n,r[n],i[n],a,o.p,e)};function ao(n){return n.includes("ref")?[...n.filter((n=>"ref"!==n)),"ref"]:n}var eo=!1,to=!1,ro=!1,io=!1,lo=(n,o,a)=>{var e;const t=o.$[a];let r,i,l,s=0;if(eo||(ro=!0,"slot"===t.S&&(t.p|=t.$?2:1)),null!==t.h)r=t.O=k.document.createTextNode(t.h);else if(1&t.p)r=t.O=k.document.createTextNode(""),oo(null,t,io);else{if(!k.document)throw Error("You are trying to render a Stencil component in an environment that doesn't support the DOM. Make sure to populate the [`window`](https://developer.mozilla.org/en-US/docs/Web/API/Window/window) object before rendering a component.");if(r=t.O=k.document.createElement(!eo&&2&t.p?"slot-fb":t.S),oo(null,t,io),null!=Wn&&void 0!==Wn&&r["s-si"]!==Wn&&r.classList.add(r["s-si"]=Wn),t.$)for(s=0;s<t.$.length;++s)i=lo(n,t,s),i&&r.appendChild(i)}return r["s-hn"]=Vn,3&t.p&&(r["s-sr"]=!0,r["s-cr"]=qn,r["s-sn"]=t._||"",r["s-rf"]=null==(e=t.k)?void 0:e.ref,nn(r),l=n&&n.$&&n.$[a],l&&l.S===t.S&&n.O&&so(n.O),wo(qn,r,o.O,null==n?void 0:n.O)),r},so=n=>{z.p|=1;const o=n.closest(Vn.toLowerCase());if(null!=o){const a=Array.from(o.__childNodes||o.childNodes).find((n=>n["s-cr"])),e=Array.from(n.__childNodes||n.childNodes);for(const n of a?e.reverse():e)null!=n["s-sh"]&&(yo(o,n,null!=a?a:null),n["s-sh"]=void 0,ro=!0)}z.p&=-2},co=(n,o)=>{z.p|=1;const a=Array.from(n.__childNodes||n.childNodes);if(n["s-sr"]){let o=n;for(;o=o.nextSibling;)o&&o["s-sn"]===n["s-sn"]&&o["s-sh"]===Vn&&a.push(o)}for(let n=a.length-1;n>=0;n--){const e=a[n];e["s-hn"]!==Vn&&e["s-ol"]&&(yo(go(e).parentNode,e,go(e)),e["s-ol"].remove(),e["s-ol"]=void 0,e["s-sh"]=void 0,ro=!0),o&&co(e,o)}z.p&=-2},po=(n,o,a,e,t,r)=>{let i,l=n["s-cr"]&&n["s-cr"].parentNode||n;for(l.shadowRoot&&l.tagName===Vn&&(l=l.shadowRoot);t<=r;++t)e[t]&&(i=lo(null,a,t),i&&(e[t].O=i,yo(l,i,go(o))))},bo=(n,o,a)=>{for(let e=o;e<=a;++e){const o=n[e];if(o){const n=o.O;fo(o),n&&(to=!0,n["s-ol"]?n["s-ol"].remove():co(n,!0),n.remove())}}},uo=(n,o,a=!1)=>n.S===o.S&&("slot"===n.S?n._===o._:a?(a&&!n.j&&o.j&&(n.j=o.j),!0):n.j===o.j),go=n=>n&&n["s-ol"]||n,vo=(n,o,a=!1)=>{const e=o.O=n.O,t=n.$,r=o.$,i=o.h;let l;null===i?("slot"!==o.S||eo||n._!==o._&&(o.O["s-sn"]=o._||"",so(o.O.parentElement)),oo(n,o,io,a),null!==t&&null!==r?((n,o,a,e,t=!1)=>{let r,i,l=0,s=0,c=0,d=0,p=o.length-1,b=o[0],u=o[p],g=e.length-1,v=e[0],m=e[g];for(;l<=p&&s<=g;)if(null==b)b=o[++l];else if(null==u)u=o[--p];else if(null==v)v=e[++s];else if(null==m)m=e[--g];else if(uo(b,v,t))vo(b,v,t),b=o[++l],v=e[++s];else if(uo(u,m,t))vo(u,m,t),u=o[--p],m=e[--g];else if(uo(b,m,t))"slot"!==b.S&&"slot"!==m.S||co(b.O.parentNode,!1),vo(b,m,t),yo(n,b.O,u.O.nextSibling),b=o[++l],m=e[--g];else if(uo(u,v,t))"slot"!==b.S&&"slot"!==m.S||co(u.O.parentNode,!1),vo(u,v,t),yo(n,u.O,b.O),u=o[--p],v=e[++s];else{for(c=-1,d=l;d<=p;++d)if(o[d]&&null!==o[d].j&&o[d].j===v.j){c=d;break}c>=0?(i=o[c],i.S!==v.S?r=lo(o&&o[s],a,c):(vo(i,v,t),o[c]=void 0,r=i.O),v=e[++s]):(r=lo(o&&o[s],a,s),v=e[++s]),r&&yo(go(b.O).parentNode,r,go(b.O))}l>p?po(n,null==e[g+1]?null:e[g+1].O,a,e,s,g):s>g&&bo(o,l,p)})(e,t,o,r,a):null!==r?(null!==n.h&&(e.textContent=""),po(e,null,o,r,0,r.length-1)):a||null===t?a&&null!==t&&null===r&&(o.$=t):bo(t,0,t.length-1)):(l=e["s-cr"])?l.parentNode.textContent=i:n.h!==i&&(e.data=i)},mo=[],ho=n=>{let o,a,e;const t=n.__childNodes||n.childNodes;for(const n of t){if(n["s-sr"]&&(o=n["s-cr"])&&o.parentNode){a=o.parentNode.__childNodes||o.parentNode.childNodes;const t=n["s-sn"];for(e=a.length-1;e>=0;e--)if(o=a[e],!(o["s-cn"]||o["s-nr"]||o["s-hn"]===n["s-hn"]||o["s-sh"]&&o["s-sh"]===n["s-hn"]))if(G(o,t)){let a=mo.find((n=>n.R===o));to=!0,o["s-sn"]=o["s-sn"]||t,a?(a.R["s-sh"]=n["s-hn"],a.B=n):(o["s-sh"]=n["s-hn"],mo.push({B:n,R:o})),o["s-sr"]&&mo.map((n=>{G(n.R,o["s-sn"])&&(a=mo.find((n=>n.R===o)),a&&!n.B&&(n.B=a.B))}))}else mo.some((n=>n.R===o))||mo.push({R:o})}1===n.nodeType&&ho(n)}},fo=n=>{n.k&&n.k.ref&&n.k.ref(null),n.$&&n.$.map(fo)},yo=(n,o,a)=>{if("string"==typeof o["s-sn"]&&o["s-sr"]&&o["s-cr"])wo(o["s-cr"],o,n,o.parentElement);else if("string"==typeof o["s-sn"]){11!==n.getRootNode().nodeType&&wn(o),n.insertBefore(o,a);const{slotNode:e}=an(o);return e&&on(e),o}return n.__insertBefore?n.__insertBefore(o,a):null==n?void 0:n.insertBefore(o,a)};function wo(n,o,a,e){var t,r;let i;if(n&&"string"==typeof o["s-sn"]&&o["s-sr"]&&n.parentNode&&n.parentNode["s-sc"]&&(i=o["s-si"]||n.parentNode["s-sc"])){const n=o["s-sn"],l=o["s-hn"];if(null==(t=a.classList)||t.add(i+"-s"),e&&(null==(r=e.classList)?void 0:r.contains(i+"-s"))){let o=(e.__childNodes||e.childNodes)[0],a=!1;for(;o;){if(o["s-sn"]!==n&&o["s-hn"]===l&&o["s-sr"]){a=!0;break}o=o.nextSibling}a||e.classList.remove(i+"-s")}}}var ko=(n,o)=>{if(o&&!n.T&&o["s-p"]){const a=o["s-p"].push(new Promise((e=>n.T=()=>{o["s-p"].splice(a-1,1),e()})))}},xo=(n,o)=>{if(n.p|=16,4&n.p)return void(n.p|=512);ko(n,n.I);const a=()=>zo(n,o);if(!o)return B(a);queueMicrotask((()=>{a()}))},zo=(n,o)=>{const a=n.$hostElement$,e=n.l;if(!e)throw Error(`Can't render component <${a.tagName.toLowerCase()} /> with invalid Stencil runtime! Make sure this imported component is compiled with a \`externalRuntime: true\` flag. For more information, please refer to https://stenciljs.com/docs/custom-elements#externalruntime`);let t;return o?(n.p|=256,n.A&&(n.A.map((([n,o])=>Mo(e,n,o,a))),n.A=void 0),t=Mo(e,"componentWillLoad",void 0,a)):t=Mo(e,"componentWillUpdate",void 0,a),t=$o(t,(()=>Mo(e,"componentWillRender",void 0,a))),$o(t,(()=>_o(n,e,o)))},$o=(n,o)=>jo(n)?n.then(o).catch((n=>{console.error(n),o()})):o(),jo=n=>n instanceof Promise||n&&n.then&&"function"==typeof n.then,_o=async(n,o,a)=>{var e;const t=n.$hostElement$,r=t["s-rc"];a&&(n=>{const o=n.t,a=n.$hostElement$,e=o.p,t=Sn(a.shadowRoot?a.shadowRoot:a.getRootNode(),o);10&e&&(a["s-sc"]=t,a.classList.add(t+"-h"))})(n);Oo(n,o,t,a),r&&(r.map((n=>n())),t["s-rc"]=void 0);{const o=null!=(e=t["s-p"])?e:[],a=()=>Lo(n);0===o.length?a():(Promise.all(o).then(a),n.p|=4,o.length=0)}},So=null,Oo=(n,o,a,e)=>{try{So=o,o=o.render&&o.render(),n.p&=-17,n.p|=2,((n,o,a=!1)=>{var e,t,r,i,l;const s=n.$hostElement$,c=n.t,d=n.P||Cn(null,null),p=(n=>n&&n.S===En)(o)?o:Ln(null,null,o);if(Vn=s.tagName,c.F&&(p.k=p.k||{},c.F.map((([n,o])=>p.k[o]=s[n]))),a&&p.k)for(const n of Object.keys(p.k))s.hasAttribute(n)&&!["key","ref","style","class"].includes(n)&&(p.k[n]=s[n]);if(p.S=null,p.p|=4,n.P=p,p.O=d.O=s.shadowRoot||s,Wn=s["s-sc"],eo=!(!(1&c.p)||128&c.p),qn=s["s-cr"],to=!1,vo(d,p,a),z.p|=1,ro){ho(p.O);for(const n of mo){const o=n.R;if(!o["s-ol"]&&k.document){const n=k.document.createTextNode("");n["s-nr"]=o,yo(o.parentNode,o["s-ol"]=n,o)}}for(const n of mo){const o=n.R,l=n.B;if(l){const n=l.parentNode;let a=l.nextSibling;if(a&&1===a.nodeType){let r=null==(e=o["s-ol"])?void 0:e.previousSibling;for(;r;){let e=null!=(t=r["s-nr"])?t:null;if(e&&e["s-sn"]===o["s-sn"]&&n===(e.__parentNode||e.parentNode)){for(e=e.nextSibling;e===o||(null==e?void 0:e["s-sr"]);)e=null==e?void 0:e.nextSibling;if(!e||!e["s-nr"]){a=e;break}}r=r.previousSibling}}(!a&&n!==(o.__parentNode||o.parentNode)||(o.__nextSibling||o.nextSibling)!==a)&&o!==a&&(yo(n,o,a),1===o.nodeType&&"SLOT-FB"!==o.tagName&&(o.hidden=null!=(r=o["s-ih"])&&r)),o&&"function"==typeof l["s-rf"]&&l["s-rf"](l)}else 1===o.nodeType&&(a&&(o["s-ih"]=null!=(i=o.hidden)&&i),o.hidden=!0)}}if(to&&Y(p.O),z.p&=-2,mo.length=0,2&c.p){const n=p.O.__childNodes||p.O.childNodes;for(const o of n)o["s-hn"]===Vn||o["s-sh"]||(a&&null==o["s-ih"]&&(o["s-ih"]=null!=(l=o.hidden)&&l),o.hidden=!0)}qn=void 0})(n,o,e)}catch(o){u(o,n.$hostElement$)}return So=null,null},No=()=>So,Lo=n=>{const o=n.$hostElement$,a=n.l,e=n.I;Mo(a,"componentDidRender",void 0,o),64&n.p?Mo(a,"componentDidUpdate",void 0,o):(n.p|=64,Ro(o),Mo(a,"componentDidLoad",void 0,o),n.U(o),e||Eo()),n.D(o),n.T&&(n.T(),n.T=void 0),512&n.p&&M((()=>xo(n,!1))),n.p&=-517},Co=n=>{var o;{const a=d(n),e=null==(o=null==a?void 0:a.$hostElement$)?void 0:o.isConnected;return e&&2==(18&a.p)&&xo(a,!1),e}},Eo=()=>{var o;M((()=>Jn(k,"appload",{detail:{namespace:n}}))),(null==(o=z.W)?void 0:o.size)&&z.W.clear()},Mo=(n,o,a,e)=>{if(n&&n[o])try{return n[o](a)}catch(n){u(n,e)}},Ro=n=>n.classList.add("hydrated"),Bo=(n,o,a,e)=>{const t=d(n);if(!t)return;if(!t)throw Error(`Couldn't find host element for "${e.m}" as it is unknown to this Stencil runtime. This usually happens when integrating a 3rd party Stencil component with another Stencil component or application. Please reach out to the maintainers of the 3rd party Stencil component or report this on the Stencil Discord server (https://chat.stenciljs.com) or comment on this similar [GitHub issue](https://github.com/stenciljs/core/issues/5457).`);const r=t.$hostElement$,i=t.i.get(o),l=t.p,s=t.l;if(a=Hn(a,e.o[o][0]),(!(8&l)||void 0===i)&&a!==i&&(!Number.isNaN(i)||!Number.isNaN(a))&&(t.i.set(o,a),s)){if(e.q&&128&l){const n=e.q[o];n&&n.map((n=>{try{s[n](a,i,o)}catch(n){u(n,r)}}))}if(2==(18&l)){if(s.componentShouldUpdate&&!1===s.componentShouldUpdate(a,i,o))return;xo(t,!1)}}},To=(n,o,a)=>{var e,t;const r=n.prototype;if(o.o||o.q||n.watchers){n.watchers&&!o.q&&(o.q=n.watchers);const i=Object.entries(null!=(e=o.o)?e:{});if(i.map((([n,[e]])=>{if(31&e||2&a&&32&e){const{get:t,set:i}=Object.getOwnPropertyDescriptor(r,n)||{};t&&(o.o[n][0]|=2048),i&&(o.o[n][0]|=4096),(1&a||!t)&&Object.defineProperty(r,n,{get(){{if(!(2048&o.o[n][0]))return((n,o)=>d(this).i.get(o))(0,n);const a=d(this),e=a?a.l:r;if(!e)return;return e[n]}},configurable:!0,enumerable:!0}),Object.defineProperty(r,n,{set(t){const r=d(this);if(r){if(i){const a=32&e?this[n]:r.$hostElement$[n];return void 0===a&&r.i.get(n)?t=r.i.get(n):!r.i.get(n)&&a&&r.i.set(n,a),i.call(this,Hn(t,e)),void Bo(this,n,t=32&e?this[n]:r.$hostElement$[n],o)}{if(!(1&a&&4096&o.o[n][0]))return Bo(this,n,t,o),void(1&a&&!r.l&&r.V.then((()=>{4096&o.o[n][0]&&r.l[n]!==r.i.get(n)&&(r.l[n]=t)})));const i=()=>{const a=r.l[n];!r.i.get(n)&&a&&r.i.set(n,a),r.l[n]=Hn(t,e),Bo(this,n,r.l[n],o)};r.l?i():r.V.then((()=>i()))}}}})}else 1&a&&64&e&&Object.defineProperty(r,n,{value(...o){var a;const e=d(this);return null==(a=null==e?void 0:e.H)?void 0:a.then((()=>{var a;return null==(a=e.l)?void 0:a[n](...o)}))}})})),1&a){const a=new Map;r.attributeChangedCallback=function(n,e,t){z.jmp((()=>{var i;const l=a.get(n);if(this.hasOwnProperty(l))t=this[l],delete this[l];else{if(r.hasOwnProperty(l)&&"number"==typeof this[l]&&this[l]==t)return;if(null==l){const a=d(this),r=null==a?void 0:a.p;if(a&&r&&!(8&r)&&128&r&&t!==e){const r=a.l,l=null==(i=o.q)?void 0:i[n];null==l||l.forEach((o=>{null!=r[o]&&r[o].call(r,t,e,n)}))}return}}const s=Object.getOwnPropertyDescriptor(r,l);(t=(null!==t||"boolean"!=typeof this[l])&&t)===this[l]||s.get&&!s.set||(this[l]=t)}))},n.observedAttributes=Array.from(new Set([...Object.keys(null!=(t=o.q)?t:{}),...i.filter((([n,o])=>15&o[0])).map((([n,e])=>{var t;const r=e[1]||n;return a.set(r,n),512&e[0]&&(null==(t=o.F)||t.push([n,r])),r}))]))}}return n},Io=(n,o)=>{Mo(n,"connectedCallback",void 0,o)},Ao=n=>{if(!(1&z.p)){const o=d(n);if(!o)return;const a=o.t,e=()=>{};if(1&o.p)Wo(n,o,a.Y),(null==o?void 0:o.l)?Io(o.l,n):(null==o?void 0:o.V)&&o.V.then((()=>Io(o.l,n)));else{let e;if(o.p|=1,e=n.getAttribute(m),e){if(1&a.p){const o=Sn(n.shadowRoot,a);n.classList.remove(o+"-h",o+"-s")}else if(2&a.p){const o=On(a);n["s-sc"]=o}((n,o,a,e)=>{var t,r,i;const l=n.shadowRoot,s=[],c=[],p=[],b=l?[]:null,u=Cn(o,null);let g;u.O=n,Object.entries((null==(t=e.t)?void 0:t.o)||{}).forEach((([o,[a,t]])=>{var r;if(!(31&a))return;const i=n.getAttribute(t||o);if(null!==i){const n=Hn(i,a);null==(r=null==e?void 0:e.i)||r.set(o,n)}}));{const o=e.t;o&&10&o.p&&n["s-sc"]?(g=n["s-sc"],n.classList.add(g+"-h")):n["s-sc"]&&delete n["s-sc"]}!k.document||z.W&&z.W.size||In(k.document.body,z.W=new Map),n[m]=a,n.removeAttribute(m),e.P=Tn(u,s,c,b,n,n,a,p);let v=0;const h=s.length;let f;for(;v<h;v++){f=s[v];const a=f.N+"."+f.L,e=z.W.get(a),t=f.O;if(l){if((null==(r=f.S)?void 0:(""+r).includes("-"))&&"slot-fb"!==f.S&&!f.O.shadowRoot){const o=d(f.O);if(o){const a=On(o.t),e=k.document.querySelector(`style[sty-id="${a}"]`);e&&n.shadowRoot.append(e.cloneNode(!0))}}}else t["s-hn"]=o.toUpperCase(),"slot"===f.S&&(t["s-cr"]=n["s-cr"]);"slot"===f.S&&(f._=f.O["s-sn"]||f.O.name||null,f.$?(f.p|=2,f.O.childNodes.length||f.$.forEach((n=>{f.O.appendChild(n.O)}))):f.p|=1),e&&e.isConnected&&(e.parentElement.shadowRoot&&""===e["s-en"]&&e.parentNode.insertBefore(t,e.nextSibling),e.parentNode.removeChild(e),l||(t["s-oo"]=parseInt(f.L))),e&&!e["s-id"]&&z.W.delete(a)}const y=[],w=p.length;let x,$,j,_,S=0;for(;S<w;S++)if(x=p[S],x&&x.length)for(j=x.length,$=0;$<j;$++){if(_=x[$],y[_.hostId]||(y[_.hostId]=z.W.get(_.hostId)),!y[_.hostId])continue;const n=y[_.hostId];n.shadowRoot&&_.node.parentElement!==n&&n.appendChild(_.node),n.shadowRoot&&l||(_.slot["s-cr"]||(_.slot["s-cr"]=n["s-cr"],_.slot["s-cr"]=!_.slot["s-cr"]&&n.shadowRoot?n:(n.__childNodes||n.childNodes)[0]),K(_.node,_.slot,!1,_.node["s-oo"]),(null==(i=_.node.parentElement)?void 0:i.shadowRoot)&&_.node.getAttribute&&_.node.getAttribute("slot")&&_.node.removeAttribute("slot"),vn(_.node))}if(g&&c.length&&c.forEach((n=>{n.O.parentElement.classList.add(g+"-s")})),l){let o=0;const a=b.length;if(a){for(;o<a;o++){const n=b[o];n&&l.appendChild(n)}Array.from(n.childNodes).forEach((n=>{"string"!=typeof n["s-en"]&&"string"!=typeof n["s-sn"]&&(1===n.nodeType&&n.slot&&n.hidden?n.removeAttribute("hidden"):(8===n.nodeType&&!n.nodeValue||3===n.nodeType&&!n.wholeText.trim())&&n.parentNode.removeChild(n))}))}}e.$hostElement$=n})(n,a.m,e,o)}e||12&a.p&&Po(n);{let a=n;for(;a=a.parentNode||a.host;)if(1===a.nodeType&&a.hasAttribute("s-id")&&a["s-p"]||a["s-p"]){ko(o,o.I=a);break}}a.o&&Object.entries(a.o).map((([o,[a]])=>{if(31&a&&n.hasOwnProperty(o)){const a=n[o];delete n[o],n[o]=a}})),(async(n,o,a)=>{let e;if(!(32&o.p)){if(o.p|=32,a.Z){const t=((n,o)=>{const a=n.m.replace(/-/g,"_"),e=n.Z;if(!e)return;const t=g.get(e);return t?t[a]:import(`./${e}.entry.js`).then((n=>(g.set(e,n),n[a])),(n=>{u(n,o.$hostElement$)}))
+/*!__STENCIL_STATIC_IMPORT_SWITCH__*/})(a,o);if(t&&"then"in t){const n=()=>{};e=await t,n()}else e=t;if(!e)throw Error(`Constructor for "${a.m}#${o.J}" was not found`);e.isProxied||(a.q=e.watchers,To(e,a,2),e.isProxied=!0);const r=()=>{};o.p|=8;try{new e(o)}catch(o){u(o,n)}o.p&=-9,o.p|=128,r(),Io(o.l,n)}else e=n.constructor,customElements.whenDefined(n.localName).then((()=>o.p|=128));if(e&&e.style){let n;"string"==typeof e.style&&(n=e.style);const o=On(a);if(!v.has(o)){const e=()=>{};_n(o,n,!!(1&a.p)),e()}}}const t=o.I,r=()=>xo(o,!0);t&&t["s-rc"]?t["s-rc"].push(r):r()})(n,o,a)}e()}},Po=n=>{if(!k.document)return;const o=n["s-cr"]=k.document.createComment("");o["s-cn"]=!0,yo(n,o,n.firstChild)},Fo=(n,o)=>{Mo(n,"disconnectedCallback",void 0,o||n)},Uo=(n,o={})=>{var a;if(!k.document)return void console.warn("Stencil: No document found. Skipping bootstrapping lazy components.");const e=[],t=o.exclude||[],r=k.customElements,i=k.document.head,l=i.querySelector("meta[charset]"),s=k.document.createElement("style"),c=[];let p,b=!0;Object.assign(z,o),z.u=new URL(o.resourcesUrl||"./",k.document.baseURI).href,z.p|=2,(()=>{if(!k.document)return;const n=k.document.querySelectorAll(`[${h}]`);let o=0;for(;o<n.length;o++)_n(n[o].getAttribute(h),Nn(n[o].innerHTML),!0)})();let u=!1;if(n.map((n=>{n[1].map((a=>{var i;const l={p:a[0],m:a[1],o:a[2],Y:a[3]};4&l.p&&(u=!0),l.o=a[2],l.Y=a[3],l.F=[],l.q=null!=(i=a[4])?i:{};const s=o.transformTagName?o.transformTagName(l.m):l.m,g=class extends HTMLElement{constructor(n){if(super(n),this.hasRegisteredEventListeners=!1,((n,o)=>{const a={p:0,$hostElement$:n,t:o,i:new Map};a.H=new Promise((n=>a.D=n)),a.V=new Promise((n=>a.U=n)),n["s-p"]=[],n["s-rc"]=[];const e=a;n.__stencil__getHostRef=()=>e})(n=this,l),1&l.p)if(n.shadowRoot){if("open"!==n.shadowRoot.mode)throw Error(`Unable to re-use existing shadow root for ${l.m}! Mode is set to ${n.shadowRoot.mode} but Stencil only supports open shadow roots.`)}else H.call(n,l)}connectedCallback(){const n=d(this);n&&(this.hasRegisteredEventListeners||(this.hasRegisteredEventListeners=!0,Wo(this,n,l.Y)),p&&(clearTimeout(p),p=null),b?c.push(this):z.jmp((()=>Ao(this))))}disconnectedCallback(){z.jmp((()=>(async n=>{if(!(1&z.p)){const o=d(n);(null==o?void 0:o.X)&&(o.X.map((n=>n())),o.X=void 0),(null==o?void 0:o.l)?Fo(o.l,n):(null==o?void 0:o.V)&&o.V.then((()=>Fo(o.l,n)))}jn.has(n)&&jn.delete(n),n.shadowRoot&&jn.has(n.shadowRoot)&&jn.delete(n.shadowRoot)})(this))),z.raf((()=>{var n;const o=d(this);if(!o)return;const a=c.findIndex((n=>n===this));a>-1&&c.splice(a,1),(null==(n=null==o?void 0:o.P)?void 0:n.O)instanceof Node&&!o.P.O.isConnected&&delete o.P.O}))}componentOnReady(){var n;return null==(n=d(this))?void 0:n.V}};!(1&l.p)&&256&l.p&&(n=>{en(n),tn(n),sn(n),ln(n),bn(n),cn(n),dn(n),pn(n),un(n),gn(n),rn(n)})(g.prototype),l.Z=n[0],t.includes(s)||r.get(s)||(e.push(s),r.define(s,To(g,l,1)))}))})),e.length>0&&(u&&(s.textContent+=y),s.textContent+=e.sort()+"{visibility:hidden}.hydrated{visibility:inherit}",s.innerHTML.length)){s.setAttribute("data-styles","");const n=null!=(a=z.v)?a:A(k.document);null!=n&&s.setAttribute("nonce",n),i.insertBefore(s,l?l.nextSibling:i.firstChild)}b=!1,c.length?c.map((n=>n.connectedCallback())):z.jmp((()=>p=setTimeout(Eo,30)))},Do=(n,o)=>o,Wo=(n,o,a)=>{a&&k.document&&a.map((([a,e,t])=>{const r=Vo(k.document,n,a),i=qo(o,t),l=Ho(a);z.ael(r,e,i,l),(o.X=o.X||[]).push((()=>z.rel(r,e,i,l)))}))},qo=(n,o)=>a=>{var e;try{256&n.p?null==(e=n.l)||e[o](a):(n.A=n.A||[]).push([o,a])}catch(o){u(o,n.$hostElement$)}},Vo=(n,o,a)=>4&a?n:8&a?k:16&a?n.body:o,Ho=n=>({passive:!!(1&n),capture:!!(2&n)}),Yo=n=>z.v=n;export{e as B,Do as F,x as H,n as N,Yn as a,Uo as b,Zn as c,En as d,B as e,R as f,o as g,Ln as h,u as i,No as j,Co as k,T as l,$ as p,p as r,Yo as s,k as w}

package/dist/nano-components/index.esm.js CHANGED Viewed

@@ -1,4 +1,4 @@
 /*!
  * Custom elements for Nanopore-Digital Web applications
  */
-import{N as n}from"./index-BM3Om9WE.js";import{t as o,s as e}from"./renderer-DpNDfhNy.js";export{g as getTagPrefix}from"./renderer-DpNDfhNy.js";export{d as nanoDebounce,t as nanoThrottle}from"./throttle-C93FMm2Z.js";export{g as nanoGetTabElements}from"./tabbable-BgopY-vd.js";const a=(n,o=[],t)=>`${n}\n    ${o.length?'<nano-cta group="balanced" slot="footer">'+o.map(((n,o)=>`<button \n                  data-btn="${o}" \n                  class="${n.classes}"\n                  theme="${n.theme||t}"\n                  secondary="${n.secondary?"true":"false"}"\n                >${n.content}</button>`)).join("")+"</nano-cta>":""}\n  `,r=(n,o=[])=>{o.length&&Array.from(n.querySelectorAll('nano-cta[slot="footer"] button')).map((n=>{const t=o.find(((o,t)=>n.dataset.btn===t.toString()));t&&t.handler&&n.addEventListener("click",t.handler)}))};async function c(n,t="tr",e,c,s=[]){const i={theme:"primary",duration:3e3,closable:!0,...c};e=e||"light/circle-info";const m=Object.assign(document.createElement(o("nano-alert")),{...i,open:!1,innerHTML:`\n        <nano-icon name="${e}" slot="icon"></nano-icon>\n        ${a(n,s,i.theme)}\n      `});return r(m,s),document.body.appendChild(m),new Promise((n=>{requestAnimationFrame((async()=>{await m.toast(t),n(m)}))}))}function s(n,t=[],e,c="light/circle-info",s={}){const i={theme:"primary",duration:1/0,closable:!1,...s};c=c||"light/circle-info";const m=Object.assign(document.createElement(o("nano-alert")),{...i,open:!1,innerHTML:`\n        ${c?`<nano-icon name="${c}" slot="icon"></nano-icon>`:""}\n        ${a(n,t,i.theme)}\n      `});return r(m,t),document.body.appendChild(m),new Promise((n=>{setTimeout((async()=>{await m.alert(e),n(m)}),100)}))}function i(n,t=[],e){const a={noUserDismiss:!1,label:"Dialog",...e},r=Object.assign(document.createElement(o("nano-dialog")),{...a,open:!1,innerHTML:`\n      ${n}\n      ${t.length?'<nano-cta group="balanced" slot="footer">'+t.map(((n,o)=>`<button \n                  data-btn="${o}" \n                  class="${n.classes}"\n                  theme="${n.theme}"\n                  secondary="${n.secondary?"true":"false"}"\n                >${n.content}</button>`)).join("")+"</nano-cta>":""}`});return t.length&&Array.from(r.querySelectorAll('nano-cta[slot="footer"] button')).map((n=>{const o=t.find(((o,t)=>n.dataset.btn===t.toString()));o&&o.handler&&n.addEventListener("click",o.handler)})),document.body.appendChild(r),new Promise((n=>{requestAnimationFrame((async()=>{await r.show(),n(r)}))}))}function m(o){if(!window||!document)return;const t=e(o),a=document.querySelector(`script[src$="/${n}.esm.js"]`);return a&&(a["data-opts"]={transformTagName:t}),t}const l=()=>{};export{m as componentPrefix,l as initialize,i as nanoCreateDialog,s as nanoShowAlert,c as nanoShowToast,o as transformTag}
+import{N as n}from"./index-RXFO3HxS.js";import{t as o,s as e}from"./renderer-B_wACs4w.js";export{g as getTagPrefix}from"./renderer-B_wACs4w.js";export{d as nanoDebounce,t as nanoThrottle}from"./throttle-C93FMm2Z.js";export{g as nanoGetTabElements}from"./tabbable-Dwh0pD2q.js";const a=(n,t=[],o)=>`${n}\n    ${t.length?'<nano-cta group="balanced" slot="footer">'+t.map(((n,t)=>`<button \n                  data-btn="${t}" \n                  class="${n.classes}"\n                  theme="${n.theme||o}"\n                  secondary="${n.secondary?"true":"false"}"\n                >${n.content}</button>`)).join("")+"</nano-cta>":""}\n  `,r=(n,t=[])=>{t.length&&Array.from(n.querySelectorAll('nano-cta[slot="footer"] button')).map((n=>{const o=t.find(((t,o)=>n.dataset.btn===o.toString()));o&&o.handler&&n.addEventListener("click",o.handler)}))};async function c(n,t="tr",e,c,s=[]){const i={theme:"primary",duration:3e3,closable:!0,...c};e=e||"light/circle-info";const m=Object.assign(document.createElement(o("nano-alert")),{...i,open:!1,innerHTML:`\n        <nano-icon name="${e}" slot="icon"></nano-icon>\n        ${a(n,s,i.theme)}\n      `});return r(m,s),document.body.appendChild(m),new Promise((n=>{requestAnimationFrame((async()=>{await m.toast(t),n(m)}))}))}function s(n,t=[],e,c="light/circle-info",s={}){const i={theme:"primary",duration:1/0,closable:!1,...s};c=c||"light/circle-info";const m=Object.assign(document.createElement(o("nano-alert")),{...i,open:!1,innerHTML:`\n        ${c?`<nano-icon name="${c}" slot="icon"></nano-icon>`:""}\n        ${a(n,t,i.theme)}\n      `});return r(m,t),document.body.appendChild(m),new Promise((n=>{setTimeout((async()=>{await m.alert(e),n(m)}),100)}))}function i(n,t=[],e){const a={noUserDismiss:!1,label:"Dialog",...e},r=Object.assign(document.createElement(o("nano-dialog")),{...a,open:!1,innerHTML:`\n      ${n}\n      ${t.length?'<nano-cta group="balanced" slot="footer">'+t.map(((n,t)=>`<button \n                  data-btn="${t}" \n                  class="${n.classes}"\n                  theme="${n.theme}"\n                  secondary="${n.secondary?"true":"false"}"\n                >${n.content}</button>`)).join("")+"</nano-cta>":""}`});return t.length&&Array.from(r.querySelectorAll('nano-cta[slot="footer"] button')).map((n=>{const o=t.find(((t,o)=>n.dataset.btn===o.toString()));o&&o.handler&&n.addEventListener("click",o.handler)})),document.body.appendChild(r),new Promise((n=>{requestAnimationFrame((async()=>{await r.show(),n(r)}))}))}function m(t){if(!window||!document)return;const o=e(t),a=document.querySelector(`script[src$="/${n}.esm.js"]`);return a&&(a["data-opts"]={transformTagName:o}),o}const l=()=>{};export{m as componentPrefix,l as initialize,i as nanoCreateDialog,s as nanoShowAlert,c as nanoShowToast,o as transformTag}

package/dist/nano-components/{lazyload-DN6DHpMi.js → lazyload-ClpqVun1.js} RENAMED Viewed

@@ -1,4 +1,4 @@
 /*!
  * Custom elements for Nanopore-Digital Web applications
  */
-import{F as t,u as i}from"./nano-slides-D0dTkk-b.js";import"./index-BM3Om9WE.js";import"./renderer-DpNDfhNy.js";t.createMethods.push("_createLazyload");const s=t.prototype;function a(t,i){this.img=t,this.flickity=i,this.load()}s._createLazyload=function(){this.on("select",this.lazyLoad)},s.lazyLoad=function(){const t=this.options.lazyLoad;if(!t)return;const s=this.getAdjacentCellElements("number"==typeof t?t:0);let l=[];s.forEach((function(t){const s=function(t){if("IMG"==t.nodeName){const i=t.getAttribute("data-flickity-lazyload"),s=t.getAttribute("data-flickity-lazyload-src"),a=t.getAttribute("data-flickity-lazyload-srcset");if(i||s||a)return[t]}const s=t.querySelectorAll("img[data-flickity-lazyload], img[data-flickity-lazyload-src], img[data-flickity-lazyload-srcset]");return i.makeArray(s)}(t);l=l.concat(s)})),l.forEach((function(t){new a(t,this)}),this)},a.prototype.handleEvent=i.handleEvent,a.prototype.load=function(){this.img.addEventListener("load",this),this.img.addEventListener("error",this);const t=this.img.getAttribute("data-flickity-lazyload")||this.img.getAttribute("data-flickity-lazyload-src"),i=this.img.getAttribute("data-flickity-lazyload-srcset");this.img.src=t,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")},a.prototype.onload=function(t){this.complete(t,"flickity-lazyloaded")},a.prototype.onerror=function(t){this.complete(t,"flickity-lazyerror")},a.prototype.complete=function(t,i){this.img.removeEventListener("load",this),this.img.removeEventListener("error",this);const s=this.flickity.getParentCell(this.img),a=s&&s.element;this.flickity.cellSizeChange(a),this.img.classList.add(i),this.flickity.dispatchEvent("lazyLoad",t,a)},t.LazyLoader=a;
+import{F as t,u as i}from"./nano-slides-WDFCFgZL.js";import"./index-RXFO3HxS.js";import"./renderer-B_wACs4w.js";t.createMethods.push("_createLazyload");const s=t.prototype;function a(t,i){this.img=t,this.flickity=i,this.load()}s._createLazyload=function(){this.on("select",this.lazyLoad)},s.lazyLoad=function(){const t=this.options.lazyLoad;if(!t)return;const s=this.getAdjacentCellElements("number"==typeof t?t:0);let l=[];s.forEach((function(t){const s=function(t){if("IMG"==t.nodeName){const i=t.getAttribute("data-flickity-lazyload"),s=t.getAttribute("data-flickity-lazyload-src"),a=t.getAttribute("data-flickity-lazyload-srcset");if(i||s||a)return[t]}const s=t.querySelectorAll("img[data-flickity-lazyload], img[data-flickity-lazyload-src], img[data-flickity-lazyload-srcset]");return i.makeArray(s)}(t);l=l.concat(s)})),l.forEach((function(t){new a(t,this)}),this)},a.prototype.handleEvent=i.handleEvent,a.prototype.load=function(){this.img.addEventListener("load",this),this.img.addEventListener("error",this);const t=this.img.getAttribute("data-flickity-lazyload")||this.img.getAttribute("data-flickity-lazyload-src"),i=this.img.getAttribute("data-flickity-lazyload-srcset");this.img.src=t,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")},a.prototype.onload=function(t){this.complete(t,"flickity-lazyloaded")},a.prototype.onerror=function(t){this.complete(t,"flickity-lazyerror")},a.prototype.complete=function(t,i){this.img.removeEventListener("load",this),this.img.removeEventListener("error",this);const s=this.flickity.getParentCell(this.img),a=s&&s.element;this.flickity.cellSizeChange(a),this.img.classList.add(i),this.flickity.dispatchEvent("lazyLoad",t,a)},t.LazyLoader=a;

package/dist/nano-components/{modal-CY_3_LJ7.js → modal-DFUZVWqg.js} RENAMED Viewed

@@ -1,4 +1,4 @@
 /*!
  * Custom elements for Nanopore-Digital Web applications
  */
-import{g as t}from"./tabbable-BgopY-vd.js";let s=[];class i{element;tabDirection="forward";constructor(t){this.element=t,this.handleFocusIn=this.handleFocusIn.bind(this),this.handleKeyDown=this.handleKeyDown.bind(this)}activate(){s.push(this.element),document.addEventListener("focusin",this.handleFocusIn),document.addEventListener("keydown",this.handleKeyDown)}deactivate(){s=s.filter((t=>t!==this.element)),document.removeEventListener("focusin",this.handleFocusIn),document.removeEventListener("keydown",this.handleKeyDown)}isActive(){return s[s.length-1]===this.element}handleFocusIn(s){const i=s.composedPath();if(this.isActive()&&!i.includes(this.element)){const s=t(this.element),i="backward"===this.tabDirection?s.length-1:0;s[i]?.focus({preventScroll:!0})}}handleKeyDown(t){"Tab"===t.key&&t.shiftKey&&(this.tabDirection="backward",setTimeout((()=>this.tabDirection="forward")))}}export{i as M}
+import{g as t}from"./tabbable-Dwh0pD2q.js";let s=[];class i{element;tabDirection="forward";constructor(t){this.element=t,this.handleFocusIn=this.handleFocusIn.bind(this),this.handleKeyDown=this.handleKeyDown.bind(this)}activate(){s.push(this.element),document.addEventListener("focusin",this.handleFocusIn),document.addEventListener("keydown",this.handleKeyDown)}deactivate(){s=s.filter((t=>t!==this.element)),document.removeEventListener("focusin",this.handleFocusIn),document.removeEventListener("keydown",this.handleKeyDown)}isActive(){return s[s.length-1]===this.element}handleFocusIn(s){const i=s.composedPath();if(this.isActive()&&!i.includes(this.element)){const s=t(this.element),i="backward"===this.tabDirection?s.length-1:0;s[i]?.focus({preventScroll:!0})}}handleKeyDown(t){"Tab"===t.key&&t.shiftKey&&(this.tabDirection="backward",setTimeout((()=>this.tabDirection="forward")))}}export{i as M}

package/dist/nano-components/nano-accordion.entry.js CHANGED Viewed

@@ -1,4 +1,4 @@
 /*!
  * Custom elements for Nanopore-Digital Web applications
  */
-import{r as t,c as o,g as e}from"./index-BM3Om9WE.js";import{t as n,h as i}from"./renderer-DpNDfhNy.js";import{g as r}from"./dom-dlicJTEJ.js";const a=class{constructor(e){t(this,e),this.nanoToggle=o(this,"nanoToggle",7)}indexOpened;elementOpened;get el(){return e(this)}alwaysOpen=!1;nanoToggle;onToggleHandler(t){"NANO-DETAILS"===t.target?.tagName&&(t.stopPropagation(),r(this.el,n("nano-details")).forEach(((o,e)=>{o!==t.target?o.open=!1:o===t.target&&(this.indexOpened=e)})),this.nanoToggle.emit({element:t.target,index:this.indexOpened}))}onClosedHandler(t){if(t.stopPropagation(),this.alwaysOpen){let o;if(r(this.el,n("nano-details")).forEach((e=>{e!==t.target&&e.open&&(o=!0)})),!o)return void t.preventDefault()}this.elementOpened===t.target&&(this.elementOpened=null,this.indexOpened=null,this.nanoToggle.emit())}render(){return i("slot",{key:"a16b340b9312672847ee022b2beb6767fc0dfb86"})}};a.style=":host,*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}@media (prefers-reduced-motion: reduce){:host,*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}:host,*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}@media (prefers-reduced-motion: reduce){:host,*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}:host{display:contents}";export{a as nano_accordion}
+import{r as t,c as o,a as e}from"./index-RXFO3HxS.js";import{t as n,h as i}from"./renderer-B_wACs4w.js";import{g as r}from"./dom-DiLhOqyz.js";const a=class{constructor(e){t(this,e),this.nanoToggle=o(this,"nanoToggle",7)}indexOpened;elementOpened;get el(){return e(this)}alwaysOpen=!1;nanoToggle;onToggleHandler(t){"NANO-DETAILS"===t.target?.tagName&&(t.stopPropagation(),r(this.el,n("nano-details")).forEach(((o,e)=>{o!==t.target?o.open=!1:o===t.target&&(this.indexOpened=e)})),this.nanoToggle.emit({element:t.target,index:this.indexOpened}))}onClosedHandler(t){if(t.stopPropagation(),this.alwaysOpen){let o;if(r(this.el,n("nano-details")).forEach((e=>{e!==t.target&&e.open&&(o=!0)})),!o)return void t.preventDefault()}this.elementOpened===t.target&&(this.elementOpened=null,this.indexOpened=null,this.nanoToggle.emit())}render(){return i("slot",{key:"a16b340b9312672847ee022b2beb6767fc0dfb86"})}};a.style=":host,*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}@media (prefers-reduced-motion: reduce){:host,*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}:host,*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}@media (prefers-reduced-motion: reduce){:host,*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}:host{display:contents}";export{a as nano_accordion}

package/dist/nano-components/nano-alert.entry.js CHANGED Viewed

@@ -1,4 +1,4 @@
 /*!
  * Custom elements for Nanopore-Digital Web applications
  */
-import{r as n,c as t,g as o,a}from"./index-BM3Om9WE.js";import{M as e}from"./modal-CY_3_LJ7.js";import{l as i,u as r}from"./scroll-1nFw8CNk.js";import{h as s,t as l}from"./renderer-DpNDfhNy.js";import{b as c}from"./active-element-CKJIkX0R.js";import{H as h}from"./slot-Crs4khNK.js";import"./tabbable-BgopY-vd.js";import"./dom-dlicJTEJ.js";let d,m,u,p;globalThis.document&&(d=Object.assign(document.createElement("div"),{className:"nano-toast-stack nano-toast-stack--tr"}),m=Object.assign(document.createElement("div"),{className:"nano-toast-stack nano-toast-stack--tl"}),u=Object.assign(document.createElement("div"),{className:"nano-toast-stack nano-toast-stack--bl"}),p=Object.assign(document.createElement("div"),{className:"nano-toast-stack nano-toast-stack--br"}));const f=class{constructor(o){n(this,o),this.nanoShow=t(this,"nanoShow",7),this.nanoAfterShow=t(this,"nanoAfterShow",7),this.nanoHide=t(this,"nanoHide",7),this.nanoAfterHide=t(this,"nanoAfterHide",7)}panel;overlay;modal;originalTrigger;goingToHide=!1;goingToShow=!1;autoHideTimeout;remainingTimeInterval;countdownAnimation;countdownElement;slotCtrl=new h(this,"[default]","heading","title","footer");isModal=!1;isToast=!1;isShowing=!1;label;noDismiss=!1;get host(){return o(this)}open=!1;handleOpenChange(){this.open?this.show():this.hide()}closable=!1;color;theme;duration=1/0;remainingTime=this.duration;handleDurationChange(){this.restartAutoHide()}hoist=!1;handleHoistChange(){this.hoist&&document.body.children[0]!==this.host&&document.body.prepend(this.host)}countdown=!0;nanoShow;nanoAfterShow;nanoHide;nanoAfterHide;async show(){if(!this.goingToShow)return this.nanoShow.emit().defaultPrevented?(this.open=!1,!1):(this.host.hidden=!1,this.goingToShow=!0,this.open=!0,requestAnimationFrame((()=>{this.isShowing=!0,this.goingToShow=!1})),void(this.duration<1/0&&this.restartAutoHide()))}async hide(){if(!this.goingToHide)return this.nanoHide.emit().defaultPrevented?(this.open=!0,!1):(this.goingToHide=!0,this.open=!1,c(this.host),requestAnimationFrame((()=>this.goingToHide=!1)),clearTimeout(this.autoHideTimeout),void clearInterval(this.remainingTimeInterval))}async toast(n="tr"){return this.isToast=!0,new Promise((t=>{let o;switch(this.handleCountdownChange(),n){case"tl":o=m;break;case"bl":o=u;break;case"br":o=p;break;default:o=d}o.isConnected||document.body.appendChild(o),o.appendChild(this.host),this.connectedCallback(),this.show();const a=()=>{this.host.remove(),this.isToast=!1,t(),o.querySelector(l("nano-alert"))||o.remove()};this.host.addEventListener("nanoAfterHide",a,{once:!0}),this.host.addEventListener("nano-after-hide",a,{once:!0})}))}async alert(n){return this.isModal=!0,this.label=n,new Promise((n=>{let t=!1;for(const n of document.body.children)"NANO-ALERT"===n.tagName&&n===this.host&&(t=!0);t||document.body.append(this.host),this.modal.activate(),i(this.host),this.originalTrigger=document.activeElement,requestAnimationFrame((()=>{this.show()}));const o=()=>requestAnimationFrame((()=>this.panel.focus({preventScroll:!0}))),a=()=>{this.modal.deactivate(),this.host.remove(),this.label=void 0,this.isModal=!1,n(),this.originalTrigger&&"function"==typeof this.originalTrigger.focus&&setTimeout((()=>this.originalTrigger.focus()))};this.host.addEventListener("nanoAfterShow",o,{once:!0}),this.host.addEventListener("nano-after-show",o,{once:!0}),this.host.addEventListener("nanoAfterHide",a,{once:!0}),this.host.addEventListener("nano-after-hide",a,{once:!0})}))}handleCountdownChange(){if(this.open&&this.duration<1/0&&this.countdown){const n="100%",t="0";requestAnimationFrame((()=>{this.countdownElement&&(this.countdownAnimation=this.countdownElement.animate([{width:n},{width:t}],{duration:this.duration,easing:"linear"}))}))}}restartAutoHide(){this.handleCountdownChange(),clearTimeout(this.autoHideTimeout),clearInterval(this.remainingTimeInterval),this.open&&this.duration<1/0&&(this.autoHideTimeout=window.setTimeout((()=>this.hide()),this.duration),this.remainingTime=this.duration,this.remainingTimeInterval=window.setInterval((()=>{this.remainingTime-=100}),100))}handleMouseEnter=()=>{this.countdownAnimation?.pause(),clearTimeout(this.autoHideTimeout),clearInterval(this.remainingTimeInterval)};handleMouseLeave=()=>{this.duration<1/0&&(this.autoHideTimeout=window.setTimeout((()=>this.hide()),this.remainingTime),this.remainingTimeInterval=window.setInterval((()=>{this.remainingTime-=100}),100),this.countdownAnimation?.play())};handleCloseClick=()=>{this.hide()};handleTransitionEnd=n=>{"opacity"!==n.propertyName||n.target!==this.panel&&n.target!==this.overlay||(this.host.hidden=!this.open,this.isShowing=this.open,this.open?this.nanoAfterShow.emit():this.nanoAfterHide.emit())};handleButtonClick=n=>{n.defaultPrevented||n.target.tagName&&"button"===n.target.tagName.toLowerCase()&&this.hide()};connectedCallback(){this.modal=new e(this.host),this.handleHoistChange(),this.host.addEventListener("click",this.handleButtonClick),this.isShowing="string"==typeof this.host.getAttribute("showing")}disconnectedCallback(){r(this.host),this.host.removeEventListener("click",this.handleButtonClick)}componentDidLoad(){this.open&&!this.isShowing&&this.show()}Panel=()=>s("div",{ref:n=>this.panel=n,part:"panel",class:{alert:!0,"alert--open":this.open,"alert--toasty":this.isToast,"alert--modal":!!this.isModal,"alert--showing":this.isShowing,"alert--nodismiss":this.noDismiss},tabIndex:this.isModal?0:void 0,role:this.isModal?"alertdialog":"alert","aria-atomic":"true","aria-hidden":this.isShowing?"false":"true","aria-modal":this.isModal?"true":void 0,"aria-label":this.label?this.label:void 0,onMouseEnter:this.handleMouseEnter,onMouseLeave:this.handleMouseLeave,onTransitionEnd:this.handleTransitionEnd},s("div",{class:"alert__main",part:"main"},s("div",{part:"icon",class:"alert__icon"},s("slot",{name:"icon"})),s("div",{part:"content",class:"alert__content","aria-live":this.isModal?"assertive":"polite"},this.slotCtrl.has("heading")&&s("div",{class:"alert__heading"},s("slot",{name:"heading"})),this.slotCtrl.has("title")&&s("div",{class:"alert__title"},s("slot",{name:"title"})),this.slotCtrl.has("[default]")&&s("div",{class:"alert__body"},s("slot",null)),this.slotCtrl.has("footer")&&s("div",{part:"footer",class:"alert__footer"},s("slot",{name:"footer"}))),this.closable&&s("div",{class:"alert__close",part:"close"},s("nano-icon-button",{iconName:"light/xmark",label:"close menu",onClick:this.handleCloseClick}))),this.duration<1/0&&[s("div",{role:"timer",class:"alert__timer"},this.remainingTime),this.countdown?s("div",{class:"alert__countdown"},s("div",{ref:n=>this.countdownElement=n,class:"alert__countdown-elapsed"})):""]);render(){return s(a,{key:"026fe28d4b8aed79d75734f67de6192813be44a5",class:{"nano-alert":!0},showing:this.isShowing},this.isModal&&[s("div",{key:"ac596b1e2b216ee591e2f9b85adf86dbbe27fce1",part:"overlay",class:{alert__overlay:!0,"alert__overlay--open":this.open},ref:n=>this.overlay=n}),s("div",{key:"825f8cf0d80d9bfa7bff7710ef349c234c155d53",class:"alert__modal-wrap",onClick:n=>{n.target.classList.contains("alert__modal-wrap")&&(this.noDismiss=!0,setTimeout((()=>this.noDismiss=!1),250))}},s(this.Panel,{key:"7343702088055d21dc6d5252aa108c19c315a20a"}))],!this.isModal&&s(this.Panel,{key:"c3cd08198bb5a87fcc38bea5130d5615608cb1ff"}))}static get watchers(){return{open:["handleOpenChange"],duration:["handleDurationChange"],hoist:["handleHoistChange"]}}};f.style=":host,\n*,\n*::before,\n*::after {\n  box-sizing: border-box;\n}\n[hidden] {\n  display: none !important;\n}\n@media (prefers-reduced-motion: reduce) {\n    :host,\n    *,\n    *::before,\n    *::after {\n      animation-duration: 0.01ms !important;\n      animation-iteration-count: 1 !important;\n      transition-duration: 0.01ms !important;\n      scroll-behavior: auto !important;\n    }\n  }:host,\n*,\n*::before,\n*::after {\n  box-sizing: border-box;\n}\n[hidden] {\n  display: none !important;\n}\n@media (prefers-reduced-motion: reduce) {\n    :host,\n    *,\n    *::before,\n    *::after {\n      animation-duration: 0.01ms !important;\n      animation-iteration-count: 1 !important;\n      transition-duration: 0.01ms !important;\n      scroll-behavior: auto !important;\n    }\n  }/** Typography */\n:host {\n  /**\n   * @prop --border-radius: Defaults to var(--nano-layer-border-radius);\n   * @prop --border-color: Defaults to var(--nano-layer-border-color);\n   * @prop --border-width: Defaults to var(--nano-layer-border-width);\n   * @prop --background: Defaults to var(--nano-layer-background-color);\n   * @prop --tint-color: The highlight colour (border-start, icon and heading text). Defaults to var(--nano-color-fill-primary-hover);\n   * @prop --icon-size: Defaults to var(--nano-pictogram-size-large);\n   * @prop --scrim-color: overlay colour of alert display. Defaults to var(--nano-color-overlay-scrim);\n   * @prop --close-button-color: Defaults to var(--nano-color-fill-neutral-weak);\n   */\n  --border-radius: var(--nano-layer-border-radius);\n  --border-color: var(--nano-layer-border-color);\n  --border-width: var(--nano-layer-border-width);\n  --icon-size: var(--nano-pictogram-size-large);\n  --scrim-color: var(--nano-color-overlay-scrim);\n  --close-button-color: var(--nano-color-fill-neutral);\n  --tint-color: var(--nano-color-text-info);\n  --background: var(--nano-color-surface-info);\n  display: block;\n  container-type: inline-size;\n}\n\n:host([color=neutral]), :host([theme=neutral]) {\n  --tint-color: var(--nano-color-text-neutral);\n  --background: var(--nano-color-surface-neutral);\n}\n\n:host([color=success]), :host([theme=success]) {\n  --tint-color: var(--nano-color-text-success);\n  --background: var(--nano-color-surface-success);\n}\n\n:host([color=warning]), :host([theme=warning]) {\n  --tint-color: var(--nano-color-text-warning);\n  --background: var(--nano-color-surface-warning);\n}\n\n:host([color=danger]), :host([theme=danger]) {\n  --tint-color: var(--nano-color-text-danger);\n  --background: var(--nano-color-surface-danger);\n}\n\n.alert {\n  position: relative;\n  background-color: var(--background);\n  border: solid var(--border-width) var(--border-color);\n  border-inline-start: solid 4px var(--tint-color);\n  border-radius: var(--border-radius);\n  opacity: 0;\n  transform: scale(0.9);\n  transition: var(--nano-transition-medium) opacity ease, var(--nano-transition-fast) transform ease;\n}\n.alert:focus {\n  outline: none;\n}\n.alert:not(.alert--showing) {\n  position: absolute;\n  inline-size: 1px;\n  block-size: 1px;\n  clip-path: inset(50%);\n  overflow: hidden;\n  pointer-events: none;\n  visibility: hidden;\n}\n.alert--open {\n  opacity: 1;\n  transform: none;\n}\n.alert--toasty, .alert--modal {\n  box-shadow: var(--nano-shadow-l2);\n  margin: var(--nano-spacing-md);\n}\n.alert--modal.alert--nodismiss {\n  animation: cannotClose 0.25s ease-in-out 1;\n}\n@keyframes cannotClose {\n  0% {\n    transform: scale(1);\n  }\n  50% {\n    transform: scale(1.08);\n  }\n  100% {\n    transform: scale(1);\n  }\n}\n\n.alert__main {\n  display: flex;\n  align-items: stretch;\n}\n\n.alert__content {\n  font-size: var(--nano-font-size-sm);\n  line-height: var(--nano-line-height-normal);\n  letter-spacing: var(--nano-letter-spacing-loose);\n  flex: 1 1 auto;\n  padding: var(--nano-spacing-md);\n  overflow: hidden;\n  display: flex;\n  flex-direction: column;\n  gap: var(--nano-spacing-sm);\n}\n\n.alert__modal-wrap {\n  position: fixed;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  inset: 0;\n  z-index: var(--nano-z-index-alert);\n}\n\n.alert__heading {\n  font-size: var(--nano-font-size-sm);\n  line-height: var(--nano-line-height-normal);\n  font-weight: var(--nano-font-weight-bold);\n  color: var(--tint-color);\n}\n\n.alert__title {\n  font-weight: var(--nano-font-weight-normal);\n  font-size: var(--nano-font-size-md);\n  line-height: var(--nano-line-height-dense);\n  text-wrap: balance;\n}\n\n.alert__close {\n  --color: var(--close-button-color);\n  flex: 0 0 auto;\n  display: flex;\n  align-items: center;\n  font-size: 1.1em;\n  padding-inline: 0 var(--nano-spacing-md);\n  padding-block: 0;\n}\n\n.alert__overlay {\n  position: fixed;\n  inset: 0;\n  background-color: var(--scrim-color);\n  opacity: 0;\n  transition: var(--nano-transition-fast) opacity;\n  z-index: var(--nano-z-index-alert);\n  pointer-events: all;\n}\n.alert__overlay--open {\n  opacity: 1;\n}\n\n.alert__icon {\n  flex: 0 0 auto;\n  display: flex;\n  align-items: start;\n  font-size: var(--icon-size);\n  padding-block: var(--nano-spacing-md);\n}\n.alert__icon ::slotted(*), .alert__icon::slotted(*) {\n  color: var(--tint-color);\n  margin-inline-start: var(--nano-spacing-md);\n}\n@container (width < 280px) {\n  .alert__icon {\n    display: none !important;\n  }\n}\n\n.alert__countdown {\n  position: absolute;\n  inset-block-end: 0;\n  inset-inline-start: 0;\n  inline-size: 100%;\n  block-size: 4px;\n  background-color: var(--nano-layer-border-color);\n  display: flex;\n  justify-content: flex-end;\n}\n\n.alert__countdown .alert__countdown-elapsed {\n  block-size: 100%;\n  inline-size: 0;\n}\n\n.alert__timer {\n  clip-path: inset(50%);\n  block-size: 1px;\n  overflow: hidden;\n  position: absolute;\n  white-space: nowrap;\n  inline-size: 1px;\n}\n\n.alert__countdown-elapsed {\n  background-color: var(--tint-color);\n}";export{f as nano_alert}
+import{r as n,c as t,a as o,d as a}from"./index-RXFO3HxS.js";import{M as e}from"./modal-DFUZVWqg.js";import{l as i,u as r}from"./scroll-CFCUiakV.js";import{h as s,t as l}from"./renderer-B_wACs4w.js";import{b as c}from"./active-element-CKJIkX0R.js";import{H as h}from"./slot-Cj55s-OG.js";import"./tabbable-Dwh0pD2q.js";import"./dom-DiLhOqyz.js";let d,m,u,p;globalThis.document&&(d=Object.assign(document.createElement("div"),{className:"nano-toast-stack nano-toast-stack--tr"}),m=Object.assign(document.createElement("div"),{className:"nano-toast-stack nano-toast-stack--tl"}),u=Object.assign(document.createElement("div"),{className:"nano-toast-stack nano-toast-stack--bl"}),p=Object.assign(document.createElement("div"),{className:"nano-toast-stack nano-toast-stack--br"}));const f=class{constructor(o){n(this,o),this.nanoShow=t(this,"nanoShow",7),this.nanoAfterShow=t(this,"nanoAfterShow",7),this.nanoHide=t(this,"nanoHide",7),this.nanoAfterHide=t(this,"nanoAfterHide",7)}panel;overlay;modal;originalTrigger;goingToHide=!1;goingToShow=!1;autoHideTimeout;remainingTimeInterval;countdownAnimation;countdownElement;slotCtrl=new h(this,"[default]","heading","title","footer");isModal=!1;isToast=!1;isShowing=!1;label;noDismiss=!1;get host(){return o(this)}open=!1;handleOpenChange(){this.open?this.show():this.hide()}closable=!1;color;theme;duration=1/0;remainingTime=this.duration;handleDurationChange(){this.restartAutoHide()}hoist=!1;handleHoistChange(){this.hoist&&document.body.children[0]!==this.host&&document.body.prepend(this.host)}countdown=!0;nanoShow;nanoAfterShow;nanoHide;nanoAfterHide;async show(){if(!this.goingToShow)return this.nanoShow.emit().defaultPrevented?(this.open=!1,!1):(this.host.hidden=!1,this.goingToShow=!0,this.open=!0,requestAnimationFrame((()=>{this.isShowing=!0,this.goingToShow=!1})),void(this.duration<1/0&&this.restartAutoHide()))}async hide(){if(!this.goingToHide)return this.nanoHide.emit().defaultPrevented?(this.open=!0,!1):(this.goingToHide=!0,this.open=!1,c(this.host),requestAnimationFrame((()=>this.goingToHide=!1)),clearTimeout(this.autoHideTimeout),void clearInterval(this.remainingTimeInterval))}async toast(n="tr"){return this.isToast=!0,new Promise((t=>{let o;switch(this.handleCountdownChange(),n){case"tl":o=m;break;case"bl":o=u;break;case"br":o=p;break;default:o=d}o.isConnected||document.body.appendChild(o),o.appendChild(this.host),this.connectedCallback(),this.show();const a=()=>{this.host.remove(),this.isToast=!1,t(),o.querySelector(l("nano-alert"))||o.remove()};this.host.addEventListener("nanoAfterHide",a,{once:!0}),this.host.addEventListener("nano-after-hide",a,{once:!0})}))}async alert(n){return this.isModal=!0,this.label=n,new Promise((n=>{let t=!1;for(const n of document.body.children)"NANO-ALERT"===n.tagName&&n===this.host&&(t=!0);t||document.body.append(this.host),this.modal.activate(),i(this.host),this.originalTrigger=document.activeElement,requestAnimationFrame((()=>{this.show()}));const o=()=>requestAnimationFrame((()=>this.panel.focus({preventScroll:!0}))),a=()=>{this.modal.deactivate(),this.host.remove(),this.label=void 0,this.isModal=!1,n(),this.originalTrigger&&"function"==typeof this.originalTrigger.focus&&setTimeout((()=>this.originalTrigger.focus()))};this.host.addEventListener("nanoAfterShow",o,{once:!0}),this.host.addEventListener("nano-after-show",o,{once:!0}),this.host.addEventListener("nanoAfterHide",a,{once:!0}),this.host.addEventListener("nano-after-hide",a,{once:!0})}))}handleCountdownChange(){if(this.open&&this.duration<1/0&&this.countdown){const n="100%",t="0";requestAnimationFrame((()=>{this.countdownElement&&(this.countdownAnimation=this.countdownElement.animate([{width:n},{width:t}],{duration:this.duration,easing:"linear"}))}))}}restartAutoHide(){this.handleCountdownChange(),clearTimeout(this.autoHideTimeout),clearInterval(this.remainingTimeInterval),this.open&&this.duration<1/0&&(this.autoHideTimeout=window.setTimeout((()=>this.hide()),this.duration),this.remainingTime=this.duration,this.remainingTimeInterval=window.setInterval((()=>{this.remainingTime-=100}),100))}handleMouseEnter=()=>{this.countdownAnimation?.pause(),clearTimeout(this.autoHideTimeout),clearInterval(this.remainingTimeInterval)};handleMouseLeave=()=>{this.duration<1/0&&(this.autoHideTimeout=window.setTimeout((()=>this.hide()),this.remainingTime),this.remainingTimeInterval=window.setInterval((()=>{this.remainingTime-=100}),100),this.countdownAnimation?.play())};handleCloseClick=()=>{this.hide()};handleTransitionEnd=n=>{"opacity"!==n.propertyName||n.target!==this.panel&&n.target!==this.overlay||(this.host.hidden=!this.open,this.isShowing=this.open,this.open?this.nanoAfterShow.emit():this.nanoAfterHide.emit())};handleButtonClick=n=>{n.defaultPrevented||n.target.tagName&&"button"===n.target.tagName.toLowerCase()&&this.hide()};connectedCallback(){this.modal=new e(this.host),this.handleHoistChange(),this.host.addEventListener("click",this.handleButtonClick),this.isShowing="string"==typeof this.host.getAttribute("showing")}disconnectedCallback(){r(this.host),this.host.removeEventListener("click",this.handleButtonClick)}componentDidLoad(){this.open&&!this.isShowing&&this.show()}Panel=()=>s("div",{ref:n=>this.panel=n,part:"panel",class:{alert:!0,"alert--open":this.open,"alert--toasty":this.isToast,"alert--modal":!!this.isModal,"alert--showing":this.isShowing,"alert--nodismiss":this.noDismiss},tabIndex:this.isModal?0:void 0,role:this.isModal?"alertdialog":"alert","aria-atomic":"true","aria-hidden":this.isShowing?"false":"true","aria-modal":this.isModal?"true":void 0,"aria-label":this.label?this.label:void 0,onMouseEnter:this.handleMouseEnter,onMouseLeave:this.handleMouseLeave,onTransitionEnd:this.handleTransitionEnd},s("div",{class:"alert__main",part:"main"},s("div",{part:"icon",class:"alert__icon"},s("slot",{name:"icon"})),s("div",{part:"content",class:"alert__content","aria-live":this.isModal?"assertive":"polite"},this.slotCtrl.has("heading")&&s("div",{class:"alert__heading"},s("slot",{name:"heading"})),this.slotCtrl.has("title")&&s("div",{class:"alert__title"},s("slot",{name:"title"})),this.slotCtrl.has("[default]")&&s("div",{class:"alert__body"},s("slot",null)),this.slotCtrl.has("footer")&&s("div",{part:"footer",class:"alert__footer"},s("slot",{name:"footer"}))),this.closable&&s("div",{class:"alert__close",part:"close"},s("nano-icon-button",{iconName:"light/xmark",label:"close menu",onClick:this.handleCloseClick}))),this.duration<1/0&&[s("div",{role:"timer",class:"alert__timer"},this.remainingTime),this.countdown?s("div",{class:"alert__countdown"},s("div",{ref:n=>this.countdownElement=n,class:"alert__countdown-elapsed"})):""]);render(){return s(a,{key:"026fe28d4b8aed79d75734f67de6192813be44a5",class:{"nano-alert":!0},showing:this.isShowing},this.isModal&&[s("div",{key:"ac596b1e2b216ee591e2f9b85adf86dbbe27fce1",part:"overlay",class:{alert__overlay:!0,"alert__overlay--open":this.open},ref:n=>this.overlay=n}),s("div",{key:"825f8cf0d80d9bfa7bff7710ef349c234c155d53",class:"alert__modal-wrap",onClick:n=>{n.target.classList.contains("alert__modal-wrap")&&(this.noDismiss=!0,setTimeout((()=>this.noDismiss=!1),250))}},s(this.Panel,{key:"7343702088055d21dc6d5252aa108c19c315a20a"}))],!this.isModal&&s(this.Panel,{key:"c3cd08198bb5a87fcc38bea5130d5615608cb1ff"}))}static get watchers(){return{open:["handleOpenChange"],duration:["handleDurationChange"],hoist:["handleHoistChange"]}}};f.style=":host,\n*,\n*::before,\n*::after {\n  box-sizing: border-box;\n}\n[hidden] {\n  display: none !important;\n}\n@media (prefers-reduced-motion: reduce) {\n    :host,\n    *,\n    *::before,\n    *::after {\n      animation-duration: 0.01ms !important;\n      animation-iteration-count: 1 !important;\n      transition-duration: 0.01ms !important;\n      scroll-behavior: auto !important;\n    }\n  }:host,\n*,\n*::before,\n*::after {\n  box-sizing: border-box;\n}\n[hidden] {\n  display: none !important;\n}\n@media (prefers-reduced-motion: reduce) {\n    :host,\n    *,\n    *::before,\n    *::after {\n      animation-duration: 0.01ms !important;\n      animation-iteration-count: 1 !important;\n      transition-duration: 0.01ms !important;\n      scroll-behavior: auto !important;\n    }\n  }/** Typography */\n:host {\n  /**\n   * @prop --border-radius: Defaults to var(--nano-layer-border-radius);\n   * @prop --border-color: Defaults to var(--nano-layer-border-color);\n   * @prop --border-width: Defaults to var(--nano-layer-border-width);\n   * @prop --background: Defaults to var(--nano-layer-background-color);\n   * @prop --tint-color: The highlight colour (border-start, icon and heading text). Defaults to var(--nano-color-fill-primary-hover);\n   * @prop --icon-size: Defaults to var(--nano-pictogram-size-large);\n   * @prop --scrim-color: overlay colour of alert display. Defaults to var(--nano-color-overlay-scrim);\n   * @prop --close-button-color: Defaults to var(--nano-color-fill-neutral-weak);\n   */\n  --border-radius: var(--nano-layer-border-radius);\n  --border-color: var(--nano-layer-border-color);\n  --border-width: var(--nano-layer-border-width);\n  --icon-size: var(--nano-pictogram-size-large);\n  --scrim-color: var(--nano-color-overlay-scrim);\n  --close-button-color: var(--nano-color-fill-neutral);\n  --tint-color: var(--nano-color-text-info);\n  --background: var(--nano-color-surface-info);\n  display: block;\n  container-type: inline-size;\n}\n\n:host([color=neutral]), :host([theme=neutral]) {\n  --tint-color: var(--nano-color-text-neutral);\n  --background: var(--nano-color-surface-neutral);\n}\n\n:host([color=success]), :host([theme=success]) {\n  --tint-color: var(--nano-color-text-success);\n  --background: var(--nano-color-surface-success);\n}\n\n:host([color=warning]), :host([theme=warning]) {\n  --tint-color: var(--nano-color-text-warning);\n  --background: var(--nano-color-surface-warning);\n}\n\n:host([color=danger]), :host([theme=danger]) {\n  --tint-color: var(--nano-color-text-danger);\n  --background: var(--nano-color-surface-danger);\n}\n\n.alert {\n  position: relative;\n  background-color: var(--background);\n  border: solid var(--border-width) var(--border-color);\n  border-inline-start: solid 4px var(--tint-color);\n  border-radius: var(--border-radius);\n  opacity: 0;\n  transform: scale(0.9);\n  transition: var(--nano-transition-medium) opacity ease, var(--nano-transition-fast) transform ease;\n}\n.alert:focus {\n  outline: none;\n}\n.alert:not(.alert--showing) {\n  position: absolute;\n  inline-size: 1px;\n  block-size: 1px;\n  clip-path: inset(50%);\n  overflow: hidden;\n  pointer-events: none;\n  visibility: hidden;\n}\n.alert--open {\n  opacity: 1;\n  transform: none;\n}\n.alert--toasty, .alert--modal {\n  box-shadow: var(--nano-shadow-l2);\n  margin: var(--nano-spacing-md);\n}\n.alert--modal.alert--nodismiss {\n  animation: cannotClose 0.25s ease-in-out 1;\n}\n@keyframes cannotClose {\n  0% {\n    transform: scale(1);\n  }\n  50% {\n    transform: scale(1.08);\n  }\n  100% {\n    transform: scale(1);\n  }\n}\n\n.alert__main {\n  display: flex;\n  align-items: stretch;\n}\n\n.alert__content {\n  font-size: var(--nano-font-size-sm);\n  line-height: var(--nano-line-height-normal);\n  letter-spacing: var(--nano-letter-spacing-loose);\n  flex: 1 1 auto;\n  padding: var(--nano-spacing-md);\n  overflow: hidden;\n  display: flex;\n  flex-direction: column;\n  gap: var(--nano-spacing-sm);\n}\n\n.alert__modal-wrap {\n  position: fixed;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  inset: 0;\n  z-index: var(--nano-z-index-alert);\n}\n\n.alert__heading {\n  font-size: var(--nano-font-size-sm);\n  line-height: var(--nano-line-height-normal);\n  font-weight: var(--nano-font-weight-bold);\n  color: var(--tint-color);\n}\n\n.alert__title {\n  font-weight: var(--nano-font-weight-normal);\n  font-size: var(--nano-font-size-md);\n  line-height: var(--nano-line-height-dense);\n  text-wrap: balance;\n}\n\n.alert__close {\n  --color: var(--close-button-color);\n  flex: 0 0 auto;\n  display: flex;\n  align-items: center;\n  font-size: 1.1em;\n  padding-inline: 0 var(--nano-spacing-md);\n  padding-block: 0;\n}\n\n.alert__overlay {\n  position: fixed;\n  inset: 0;\n  background-color: var(--scrim-color);\n  opacity: 0;\n  transition: var(--nano-transition-fast) opacity;\n  z-index: var(--nano-z-index-alert);\n  pointer-events: all;\n}\n.alert__overlay--open {\n  opacity: 1;\n}\n\n.alert__icon {\n  flex: 0 0 auto;\n  display: flex;\n  align-items: start;\n  font-size: var(--icon-size);\n  padding-block: var(--nano-spacing-md);\n}\n.alert__icon ::slotted(*), .alert__icon::slotted(*) {\n  color: var(--tint-color);\n  margin-inline-start: var(--nano-spacing-md);\n}\n@container (width < 280px) {\n  .alert__icon {\n    display: none !important;\n  }\n}\n\n.alert__countdown {\n  position: absolute;\n  inset-block-end: 0;\n  inset-inline-start: 0;\n  inline-size: 100%;\n  block-size: 4px;\n  background-color: var(--nano-layer-border-color);\n  display: flex;\n  justify-content: flex-end;\n}\n\n.alert__countdown .alert__countdown-elapsed {\n  block-size: 100%;\n  inline-size: 0;\n}\n\n.alert__timer {\n  clip-path: inset(50%);\n  block-size: 1px;\n  overflow: hidden;\n  position: absolute;\n  white-space: nowrap;\n  inline-size: 1px;\n}\n\n.alert__countdown-elapsed {\n  background-color: var(--tint-color);\n}";export{f as nano_alert}

package/dist/nano-components/nano-algolia-filter.entry.js CHANGED Viewed

@@ -1,4 +1,4 @@
 /*!
  * Custom elements for Nanopore-Digital Web applications
  */
-import{r as t,c as e,g as i,d as s,a as h}from"./index-BM3Om9WE.js";import{C as n}from"./component-store-JYVuxwvK.js";import{h as o}from"./renderer-DpNDfhNy.js";import{W as a}from"./algolia-data-Kh0vPn3V.js";import"./throttle-C93FMm2Z.js";const r=class{constructor(i){t(this,i),this.nanoFilterChanged=e(this,"nanoFilterChanged",7),this.nanoTplUpdated=e(this,"nanoTplUpdated",7)}get el(){return i(this)}templateStr;templateSlot;outputSlot;outputEle;filterId=null;tplDidRnder;tplWillRnder=new Promise((t=>{this.tplDidRnder=t}));changeEvent;internalValue=[void 0];showFilter=!1;indexResults=null;filterChanged=null;facets;tplRenderFn;globalStoreMethod;filterName=null;value="";operator="or";storeId;storeMethod="session";nanoFilterChanged;nanoTplUpdated;valueSet(){const t=this.value;let e;if(e="string"==typeof t?t.length?t.split("|"):[]:this.value,this.didValueChange(e)){const t=this.setFieldValues(e);t&&t.length?this.internalValue=e:this.tplWillRnder.then((()=>{this.setFieldValues(e),this.internalValue=e}))}}valueChanged(){this.value=this.internalValue,this.nanoFilterChanged.emit({filterId:this.filterId,facetName:this.filterName,value:this.internalValue,operator:this.operator})}appliedFilterChanged(){this.filterName&&this.filterChanged&&(this.filterChanged!==this.filterId||"and"===this.operator)&&this.updateContent()}tplUpdate(){this.updateContent()}handleFilterChange(){if(this.indexResults&&this.indexResults.appliedFilters){const t=this.indexResults.appliedFilters.find((t=>t.name===this.filterName));if(!t)return;this.tplWillRnder.then((()=>{const e=this.setFieldValues(t.values);e&&e.length&&(this.value=e)}))}this.updateContent()}handleChangeEvent(){const t=this.getFieldValues();return!!this.didValueChange(t)&&(this.internalValue=t,!0)}updateContent(){const t=this.outputSlot||this.outputEle;this.el&&(this.templateStr?this.filterName&&t&&(!this.templateStr||this.indexResults&&this.indexResults.origFilters[this.filterName])||(this.showFilter=!1):this.showFilter=!0,t&&(this.indexResults?s((()=>{t.innerHTML=this.tplRenderFn(this.templateStr,{orig:{...this.indexResults.origFilters[this.filterName]},dyn:{...this.indexResults.dynFilters[this.filterName]},selected:this.internalValue&&this.internalValue.length?this.internalValue:this.value}),this.tplDidRnder(),this.setFieldValues(),this.showFilter||(this.showFilter=!0),this.nanoTplUpdated.emit(this.el)})):this.templateStr?s((()=>{t.innerHTML=this.tplRenderFn(this.templateStr,{orig:{},dyn:{},selected:this.internalValue&&this.internalValue.length?this.internalValue:this.value}),this.value&&this.value.length||this.handleChangeEvent()})):this.value&&this.value.length||this.handleChangeEvent()))}getFieldValues(){const t=[],e=this.outputSlot.querySelectorAll('input[type="checkbox"], input[type="radio"], select');for(let i=0;i<e.length;i++){const s=e[i];if("select-multiple"===s.type){const e=s;for(let i=0;i<e.options.length;i++)e.options[i].selected&&e.options[i].value.length&&t.push(e.options[i].value)}else("checkbox"!==s.type&&"radio"!==s.type||s.checked&&s.value.length)&&t.push(s.value)}return t}setFieldValues(t){if(!(t=t||this.internalValue))return;const e=[],i=this.outputSlot.querySelectorAll('input[type="checkbox"], input[type="radio"], select, nano-select, nano-checkbox');for(let s=0;s<i.length;s++){const h=i[s];if(!h.disabled&&"file"!==h.type&&"reset"!==h.type&&"submit"!==h.type&&"button"!==h.type)if("select-multiple"===h.type||"select-one"===h.type){const i=h;for(let s=0;s<i.options.length;s++)t.includes(i.options[s].value)?(e.push(i.value),i.options[s].selected=!0,"select-one"===h.type&&(i.value=i.options[s].value)):i.options[s].selected=!1}else["checkbox","radio","tag","segment","segment-pill"].includes(h.type)&&(t.includes(h.value)?(e.push(h.value),h.checked=!0):h.checked=!t.length&&!h.value.length)}return e}didValueChange(t){if(this.internalValue&&!t)return!0;if(!this.internalValue&&!t)return!1;if(this.internalValue&&t.length!==this.internalValue.length)return!0;let e=!1;for(let i=0;i<t.length;i++)e||this.internalValue&&this.internalValue.includes(t[i])||(e=!0);return e}connectedCallback(){this.templateSlot=this.el.querySelector('[slot="filter-template"]'),this.outputSlot=this.el.querySelector('[slot="output"]'),this.filterId=this.filterName+"_"+l++,this.templateSlot&&(this.templateStr=this.templateSlot.innerHTML,this.templateStr=this.templateStr.replace(/=&gt;/gm,"=>"))}componentWillLoad(){this.storeId&&n.init(this,["value"],this.storeMethod||this.globalStoreMethod,this.storeId)}componentDidLoad(){this.updateContent(),this.templateStr&&this.filterName&&this.indexResults&&this.indexResults.origFilters[this.filterName]&&(this.showFilter=!0)}render(){return o(h,{key:"c1d229a764c08c92c4f25093d98bf51e1b4f6bcf",class:{"show-filter":this.showFilter,"nano-filter":!0}},o("div",{key:"21f66d2dcd03e19aa46face1220459dce136ccd1",ref:t=>this.outputEle=t},o("slot",{key:"3ec8e00ee477c651e48e96db7888f0a751573a3e",name:"output"})))}static get watchers(){return{value:["valueSet"],internalValue:["valueChanged"],facets:["appliedFilterChanged"],tplRenderFn:["tplUpdate"],indexResults:["handleFilterChange"]}}};a(r,["globalStoreMethod","indexResults","filterChanged","facets","tplRenderFn","changeEvent"]);let l=0;r.style=":host,*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}@media (prefers-reduced-motion: reduce){:host,*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}:host,*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}@media (prefers-reduced-motion: reduce){:host,*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}:host{display:none}:host ::slotted([slot=filter-template]){display:none !important}:host(.show-filter){display:block}";export{r as nano_algolia_filter}
+import{r as t,c as e,a as i,e as s,d as h}from"./index-RXFO3HxS.js";import{C as n}from"./component-store-DCcnMDT0.js";import{h as o}from"./renderer-B_wACs4w.js";import{W as a}from"./algolia-data-D4SY17hw.js";import"./throttle-C93FMm2Z.js";const r=class{constructor(i){t(this,i),this.nanoFilterChanged=e(this,"nanoFilterChanged",7),this.nanoTplUpdated=e(this,"nanoTplUpdated",7)}get el(){return i(this)}templateStr;templateSlot;outputSlot;outputEle;filterId=null;tplDidRnder;tplWillRnder=new Promise((t=>{this.tplDidRnder=t}));changeEvent;internalValue=[void 0];showFilter=!1;indexResults=null;filterChanged=null;facets;tplRenderFn;globalStoreMethod;filterName=null;value="";operator="or";storeId;storeMethod="session";nanoFilterChanged;nanoTplUpdated;valueSet(){const t=this.value;let e;if(e="string"==typeof t?t.length?t.split("|"):[]:this.value,this.didValueChange(e)){const t=this.setFieldValues(e);t&&t.length?this.internalValue=e:this.tplWillRnder.then((()=>{this.setFieldValues(e),this.internalValue=e}))}}valueChanged(){this.value=this.internalValue,this.nanoFilterChanged.emit({filterId:this.filterId,facetName:this.filterName,value:this.internalValue,operator:this.operator})}appliedFilterChanged(){this.filterName&&this.filterChanged&&(this.filterChanged!==this.filterId||"and"===this.operator)&&this.updateContent()}tplUpdate(){this.updateContent()}handleFilterChange(){if(this.indexResults&&this.indexResults.appliedFilters){const t=this.indexResults.appliedFilters.find((t=>t.name===this.filterName));if(!t)return;this.tplWillRnder.then((()=>{const e=this.setFieldValues(t.values);e&&e.length&&(this.value=e)}))}this.updateContent()}handleChangeEvent(){const t=this.getFieldValues();return!!this.didValueChange(t)&&(this.internalValue=t,!0)}updateContent(){const t=this.outputSlot||this.outputEle;this.el&&(this.templateStr?this.filterName&&t&&(!this.templateStr||this.indexResults&&this.indexResults.origFilters[this.filterName])||(this.showFilter=!1):this.showFilter=!0,t&&(this.indexResults?s((()=>{t.innerHTML=this.tplRenderFn(this.templateStr,{orig:{...this.indexResults.origFilters[this.filterName]},dyn:{...this.indexResults.dynFilters[this.filterName]},selected:this.internalValue&&this.internalValue.length?this.internalValue:this.value}),this.tplDidRnder(),this.setFieldValues(),this.showFilter||(this.showFilter=!0),this.nanoTplUpdated.emit(this.el)})):this.templateStr?s((()=>{t.innerHTML=this.tplRenderFn(this.templateStr,{orig:{},dyn:{},selected:this.internalValue&&this.internalValue.length?this.internalValue:this.value}),this.value&&this.value.length||this.handleChangeEvent()})):this.value&&this.value.length||this.handleChangeEvent()))}getFieldValues(){const t=[],e=this.outputSlot.querySelectorAll('input[type="checkbox"], input[type="radio"], select');for(let i=0;i<e.length;i++){const s=e[i];if("select-multiple"===s.type){const e=s;for(let i=0;i<e.options.length;i++)e.options[i].selected&&e.options[i].value.length&&t.push(e.options[i].value)}else("checkbox"!==s.type&&"radio"!==s.type||s.checked&&s.value.length)&&t.push(s.value)}return t}setFieldValues(t){if(!(t=t||this.internalValue))return;const e=[],i=this.outputSlot.querySelectorAll('input[type="checkbox"], input[type="radio"], select, nano-select, nano-checkbox');for(let s=0;s<i.length;s++){const h=i[s];if(!h.disabled&&"file"!==h.type&&"reset"!==h.type&&"submit"!==h.type&&"button"!==h.type)if("select-multiple"===h.type||"select-one"===h.type){const i=h;for(let s=0;s<i.options.length;s++)t.includes(i.options[s].value)?(e.push(i.value),i.options[s].selected=!0,"select-one"===h.type&&(i.value=i.options[s].value)):i.options[s].selected=!1}else["checkbox","radio","tag","segment","segment-pill"].includes(h.type)&&(t.includes(h.value)?(e.push(h.value),h.checked=!0):h.checked=!t.length&&!h.value.length)}return e}didValueChange(t){if(this.internalValue&&!t)return!0;if(!this.internalValue&&!t)return!1;if(this.internalValue&&t.length!==this.internalValue.length)return!0;let e=!1;for(let i=0;i<t.length;i++)e||this.internalValue&&this.internalValue.includes(t[i])||(e=!0);return e}connectedCallback(){this.templateSlot=this.el.querySelector('[slot="filter-template"]'),this.outputSlot=this.el.querySelector('[slot="output"]'),this.filterId=this.filterName+"_"+l++,this.templateSlot&&(this.templateStr=this.templateSlot.innerHTML,this.templateStr=this.templateStr.replace(/=&gt;/gm,"=>"))}componentWillLoad(){this.storeId&&n.init(this,["value"],this.storeMethod||this.globalStoreMethod,this.storeId)}componentDidLoad(){this.updateContent(),this.templateStr&&this.filterName&&this.indexResults&&this.indexResults.origFilters[this.filterName]&&(this.showFilter=!0)}render(){return o(h,{key:"c1d229a764c08c92c4f25093d98bf51e1b4f6bcf",class:{"show-filter":this.showFilter,"nano-filter":!0}},o("div",{key:"21f66d2dcd03e19aa46face1220459dce136ccd1",ref:t=>this.outputEle=t},o("slot",{key:"3ec8e00ee477c651e48e96db7888f0a751573a3e",name:"output"})))}static get watchers(){return{value:["valueSet"],internalValue:["valueChanged"],facets:["appliedFilterChanged"],tplRenderFn:["tplUpdate"],indexResults:["handleFilterChange"]}}};a(r,["globalStoreMethod","indexResults","filterChanged","facets","tplRenderFn","changeEvent"]);let l=0;r.style=":host,*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}@media (prefers-reduced-motion: reduce){:host,*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}:host,*,*::before,*::after{box-sizing:border-box}[hidden]{display:none !important}@media (prefers-reduced-motion: reduce){:host,*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}:host{display:none}:host ::slotted([slot=filter-template]){display:none !important}:host(.show-filter){display:block}";export{r as nano_algolia_filter}

package/dist/nano-components/nano-algolia-pagination.entry.js CHANGED Viewed

@@ -1,4 +1,4 @@
 /*!
  * Custom elements for Nanopore-Digital Web applications
  */
-import{r as t,c as e,g as n,h as a,a as i}from"./index-BM3Om9WE.js";import{W as s}from"./algolia-data-Kh0vPn3V.js";const o=class{constructor(n){t(this,n),this.nanoPageChanged=e(this,"nanoPageChanged",7)}get el(){return n(this)}outputEle;outputSlot;outputTo;templateStr;templateSlot;currentPage=null;canGoPrev=!1;canGoNext=!1;show=!0;tplRenderFn;indexResults=null;infiniteScroll=!1;maxToShow=null;nanoPageChanged;currentPageChange(){}infiniteScrollChange(){this.show=!this.infiniteScroll}async nextPage(){}async prevPage(){}async goToPage(t){console.info(t)}updateContent(){this.outputTo=this.outputSlot||this.outputEle,this.templateStr&&this.outputTo&&this.indexResults||(this.show=!1)}componentWillLoad(){this.templateSlot=this.el.querySelector('[slot="filter-template"]'),this.outputSlot=this.el.querySelector('[slot="output"]'),this.templateSlot&&(this.templateStr=this.templateSlot.innerHTML)}componentDidLoad(){this.updateContent()}render(){return a(i,{key:"488332e371953208f90e754ebdceff321795177c",class:{"show-pagination":this.show}},a("div",{key:"9f24519df07b4f022297a5e6f1ace601efc71e2b",ref:t=>this.outputEle=t},a("slot",{key:"363d87eb251ba2db6e6c3346e32f5dcb8b8d3a0c",name:"output"})))}static get watchers(){return{currentPage:["currentPageChange"],infiniteScroll:["infiniteScrollChange"]}}};s(o,["indexResults","filterChanged","tplRenderFn"]);export{o as nano_algolia_pagination}
+import{r as t,c as e,a as n,h as a,d as i}from"./index-RXFO3HxS.js";import{W as s}from"./algolia-data-D4SY17hw.js";const o=class{constructor(n){t(this,n),this.nanoPageChanged=e(this,"nanoPageChanged",7)}get el(){return n(this)}outputEle;outputSlot;outputTo;templateStr;templateSlot;currentPage=null;canGoPrev=!1;canGoNext=!1;show=!0;tplRenderFn;indexResults=null;infiniteScroll=!1;maxToShow=null;nanoPageChanged;currentPageChange(){}infiniteScrollChange(){this.show=!this.infiniteScroll}async nextPage(){}async prevPage(){}async goToPage(t){console.info(t)}updateContent(){this.outputTo=this.outputSlot||this.outputEle,this.templateStr&&this.outputTo&&this.indexResults||(this.show=!1)}componentWillLoad(){this.templateSlot=this.el.querySelector('[slot="filter-template"]'),this.outputSlot=this.el.querySelector('[slot="output"]'),this.templateSlot&&(this.templateStr=this.templateSlot.innerHTML)}componentDidLoad(){this.updateContent()}render(){return a(i,{key:"488332e371953208f90e754ebdceff321795177c",class:{"show-pagination":this.show}},a("div",{key:"9f24519df07b4f022297a5e6f1ace601efc71e2b",ref:t=>this.outputEle=t},a("slot",{key:"363d87eb251ba2db6e6c3346e32f5dcb8b8d3a0c",name:"output"})))}static get watchers(){return{currentPage:["currentPageChange"],infiniteScroll:["infiniteScrollChange"]}}};s(o,["indexResults","filterChanged","tplRenderFn"]);export{o as nano_algolia_pagination}

package/dist/nano-components/nano-algolia-results.entry.js CHANGED Viewed

@@ -1,4 +1,4 @@
 /*!
  * Custom elements for Nanopore-Digital Web applications
  */
-import{r as t,c as s,g as e,a as i}from"./index-BM3Om9WE.js";import{h}from"./renderer-DpNDfhNy.js";import{W as a,S as n}from"./algolia-data-Kh0vPn3V.js";const d=class{constructor(e){t(this,e),this.nanoPageChanged=s(this,"nanoPageChanged",7),this.nanoTplUpdated=s(this,"nanoTplUpdated",7)}get el(){return e(this)}resultTpl;resultTplSlot;startTpl;startTplSlot;endTpl;endTplSlot;outputSlot;outputEle;outputTo;startOutputSlot;endOutputSlot;io;infiniteScrollBar;append=!1;shouldClear=!0;currHitNum=0;showResults=!1;tplRenderFn;results=null;indexResults=null;resultsPage=0;changeEvent=n.Init;facets;isLoading=!0;infiniteScroll=!1;appendPages=!1;nanoPageChanged;nanoTplUpdated;addContentIndex(){this.shouldPageClear(),(this.shouldClear||0===this.resultsPage)&&(this.currHitNum=0),this.indexResults&&this.indexResults.results&&this.indexResults.results.map((t=>{t._uIndex=this.currHitNum++}))}resultsChange(){this.shouldPageClear(),this.updateResultContent(),this.infiniteScrollChange()}headerFooterChange(){this.updateStartEndContent()}appendChange(){this.append=!!this.infiniteScroll||this.appendPages}infiniteScrollChange(){this.append=!!this.infiniteScroll||this.appendPages,this.infiniteScroll?this.attachIO():this.detachIO()}handlePageChage(){this.infiniteScroll?this.attachIO():this.detachIO()}handleLoading(){this.isLoading||this.infiniteScrollChange()}shouldPageClear(){this.shouldClear=this.changeEvent!==n.Page||!this.append}nextPage(){this.shouldClear=!this.append,this.nanoPageChanged.emit({page:this.resultsPage+1})}attachIO(){this.infiniteScrollBar&&this.infiniteScroll&&!this.io&&"undefined"!=typeof window&&window.IntersectionObserver&&(this.io=new window.IntersectionObserver((async t=>{(t[0].isIntersecting||t[1]&&t[1].isIntersecting)&&(this.nextPage(),this.detachIO())}),{document,rootMargin:"100px",threshold:1}),this.io.observe(this.infiniteScrollBar))}detachIO(){this.io&&(this.io.disconnect(),this.io=null)}updateStartEndContent(){this.startTpl&&this.startOutputSlot&&(this.startOutputSlot.innerHTML=this.tplRenderFn(this.startTpl,this.indexResults)),this.endOutputSlot&&this.endTpl&&(this.endOutputSlot.innerHTML=this.tplRenderFn(this.endTpl,this.indexResults)),this.nanoTplUpdated.emit(this.el)}updateResultContent(){if(this.outputTo=this.outputSlot||this.outputEle,!this.resultTpl||!this.indexResults)return;if(this.shouldClear&&(this.outputTo.innerHTML=""),!this.tplRenderFn)return;const t=document.createElement("div");t.innerHTML=this.tplRenderFn(this.resultTpl,this.indexResults),Array.from(t.children).forEach((t=>{this.outputTo.appendChild(t)})),this.shouldClear=!0,this.nanoTplUpdated.emit(this.el)}connectedCallback(){this.startTplSlot=this.el.querySelector('[slot="start-template"]'),this.startOutputSlot=this.el.querySelector('[slot="start-output"]'),this.startTplSlot&&(this.startTpl=this.startTplSlot.innerHTML,this.startTpl=this.startTpl.replace(/=&gt;/gm,"=>")),this.resultTplSlot=this.el.querySelector('[slot="result-template"]'),this.outputSlot=this.el.querySelector('[slot="result-output"]'),this.resultTplSlot&&(this.resultTpl=this.resultTplSlot.innerHTML,this.resultTpl=this.resultTpl.replace(/=&gt;/gm,"=>")),this.endTplSlot=this.el.querySelector('[slot="end-template"]'),this.endOutputSlot=this.el.querySelector('[slot="end-output"]'),this.endTplSlot&&(this.endTpl=this.endTplSlot.innerHTML,this.endTpl=this.endTpl.replace(/=&gt;/gm,"=>")),this.indexResults&&(this.addContentIndex(),this.updateResultContent())}componentDidLoad(){this.updateStartEndContent()}disconnectedCallback(){this.io&&(this.io.disconnect(),this.io=void 0)}render(){return h(i,{key:"857784ead2b9536559ef2220bff26d508061781c",class:{"show-results":this.showResults,"nano-results":!0}},h("div",{key:"be165b02c4ec5d2358e15dadfd4695fd5901f0b0",class:"default"},h("slot",{key:"1ab64bb71c75531e8f6b0c65833de7d2dc1ee0ca"})),h("div",{key:"cee981cead8b921e29fd4223e4985c3615e0e063",ref:t=>this.outputEle=t},h("slot",{key:"cff96070ca2acf18f7b8165444b28f433ca3601d",name:"start-output"}),h("slot",{key:"76833dd55d415baf083527ed5580049f90c36b40",name:"result-output"}),h("div",{key:"dac7a9081d1a65b4e17dec60044467e17575568e",ref:t=>this.infiniteScrollBar=t}),h("slot",{key:"07c82d60a58c11bcc50807ab95d63cf3fd59d768",name:"end-output"})))}static get watchers(){return{results:["addContentIndex","resultsChange"],tplRenderFn:["resultsChange"],facets:["headerFooterChange"],appendPages:["appendChange"],infiniteScroll:["infiniteScrollChange"],resultsPage:["handlePageChage"],isLoading:["handleLoading"]}}};a(d,["indexResults","results","tplRenderFn","resultsPage","changeEvent","facets","isLoading"]);export{d as nano_algolia_results}
+import{r as t,c as s,a as e,d as i}from"./index-RXFO3HxS.js";import{h}from"./renderer-B_wACs4w.js";import{W as a,S as n}from"./algolia-data-D4SY17hw.js";const d=class{constructor(e){t(this,e),this.nanoPageChanged=s(this,"nanoPageChanged",7),this.nanoTplUpdated=s(this,"nanoTplUpdated",7)}get el(){return e(this)}resultTpl;resultTplSlot;startTpl;startTplSlot;endTpl;endTplSlot;outputSlot;outputEle;outputTo;startOutputSlot;endOutputSlot;io;infiniteScrollBar;append=!1;shouldClear=!0;currHitNum=0;showResults=!1;tplRenderFn;results=null;indexResults=null;resultsPage=0;changeEvent=n.Init;facets;isLoading=!0;infiniteScroll=!1;appendPages=!1;nanoPageChanged;nanoTplUpdated;addContentIndex(){this.shouldPageClear(),(this.shouldClear||0===this.resultsPage)&&(this.currHitNum=0),this.indexResults&&this.indexResults.results&&this.indexResults.results.map((t=>{t._uIndex=this.currHitNum++}))}resultsChange(){this.shouldPageClear(),this.updateResultContent(),this.infiniteScrollChange()}headerFooterChange(){this.updateStartEndContent()}appendChange(){this.append=!!this.infiniteScroll||this.appendPages}infiniteScrollChange(){this.append=!!this.infiniteScroll||this.appendPages,this.infiniteScroll?this.attachIO():this.detachIO()}handlePageChage(){this.infiniteScroll?this.attachIO():this.detachIO()}handleLoading(){this.isLoading||this.infiniteScrollChange()}shouldPageClear(){this.shouldClear=this.changeEvent!==n.Page||!this.append}nextPage(){this.shouldClear=!this.append,this.nanoPageChanged.emit({page:this.resultsPage+1})}attachIO(){this.infiniteScrollBar&&this.infiniteScroll&&!this.io&&"undefined"!=typeof window&&window.IntersectionObserver&&(this.io=new window.IntersectionObserver((async t=>{(t[0].isIntersecting||t[1]&&t[1].isIntersecting)&&(this.nextPage(),this.detachIO())}),{document,rootMargin:"100px",threshold:1}),this.io.observe(this.infiniteScrollBar))}detachIO(){this.io&&(this.io.disconnect(),this.io=null)}updateStartEndContent(){this.startTpl&&this.startOutputSlot&&(this.startOutputSlot.innerHTML=this.tplRenderFn(this.startTpl,this.indexResults)),this.endOutputSlot&&this.endTpl&&(this.endOutputSlot.innerHTML=this.tplRenderFn(this.endTpl,this.indexResults)),this.nanoTplUpdated.emit(this.el)}updateResultContent(){if(this.outputTo=this.outputSlot||this.outputEle,!this.resultTpl||!this.indexResults)return;if(this.shouldClear&&(this.outputTo.innerHTML=""),!this.tplRenderFn)return;const t=document.createElement("div");t.innerHTML=this.tplRenderFn(this.resultTpl,this.indexResults),Array.from(t.children).forEach((t=>{this.outputTo.appendChild(t)})),this.shouldClear=!0,this.nanoTplUpdated.emit(this.el)}connectedCallback(){this.startTplSlot=this.el.querySelector('[slot="start-template"]'),this.startOutputSlot=this.el.querySelector('[slot="start-output"]'),this.startTplSlot&&(this.startTpl=this.startTplSlot.innerHTML,this.startTpl=this.startTpl.replace(/=&gt;/gm,"=>")),this.resultTplSlot=this.el.querySelector('[slot="result-template"]'),this.outputSlot=this.el.querySelector('[slot="result-output"]'),this.resultTplSlot&&(this.resultTpl=this.resultTplSlot.innerHTML,this.resultTpl=this.resultTpl.replace(/=&gt;/gm,"=>")),this.endTplSlot=this.el.querySelector('[slot="end-template"]'),this.endOutputSlot=this.el.querySelector('[slot="end-output"]'),this.endTplSlot&&(this.endTpl=this.endTplSlot.innerHTML,this.endTpl=this.endTpl.replace(/=&gt;/gm,"=>")),this.indexResults&&(this.addContentIndex(),this.updateResultContent())}componentDidLoad(){this.updateStartEndContent()}disconnectedCallback(){this.io&&(this.io.disconnect(),this.io=void 0)}render(){return h(i,{key:"857784ead2b9536559ef2220bff26d508061781c",class:{"show-results":this.showResults,"nano-results":!0}},h("div",{key:"be165b02c4ec5d2358e15dadfd4695fd5901f0b0",class:"default"},h("slot",{key:"1ab64bb71c75531e8f6b0c65833de7d2dc1ee0ca"})),h("div",{key:"cee981cead8b921e29fd4223e4985c3615e0e063",ref:t=>this.outputEle=t},h("slot",{key:"cff96070ca2acf18f7b8165444b28f433ca3601d",name:"start-output"}),h("slot",{key:"76833dd55d415baf083527ed5580049f90c36b40",name:"result-output"}),h("div",{key:"dac7a9081d1a65b4e17dec60044467e17575568e",ref:t=>this.infiniteScrollBar=t}),h("slot",{key:"07c82d60a58c11bcc50807ab95d63cf3fd59d768",name:"end-output"})))}static get watchers(){return{results:["addContentIndex","resultsChange"],tplRenderFn:["resultsChange"],facets:["headerFooterChange"],appendPages:["appendChange"],infiniteScroll:["infiniteScrollChange"],resultsPage:["handlePageChage"],isLoading:["handleLoading"]}}};a(d,["indexResults","results","tplRenderFn","resultsPage","changeEvent","facets","isLoading"]);export{d as nano_algolia_results}