@nanoporetech-digital/components 8.23.11 → 9.0.0

package/dist/cjs/{nano-slides-DcXrQQgs.js → nano-slides-D-ELnUF-.js}

@@ -2468,7 +2468,7 @@ drag();
 nowNext();
 player();
 
-const slidesCss = ":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{--dot-color:var(--nano-color-neutral-400);--dot-color-active:var(--nano-color-primary-1000);--navbtns-icon-color:var(--nano-color-neutral-700);--navbtns-icon-color-hover:var(--nano-color-primary-1000);--navbtns-bg-color:transparent;--navbtns-icon-color-disabled:var(--dot-color-active);--navbtns-bg-color-disabled:transparent;--navbtns-width:1.5rem;--navbtns-height:1rem;--fsbtn-icon-color:var(--dot-color-active);--fsbtn-bg-color:transparent;--flip-icon-ltr:0;--flip-icon-rtl:1;display:block;-webkit-user-select:none;user-select:none;transition:opacity 0.2s;opacity:0;max-inline-size:100vw}:host:dir(rtl){--flip-icon-ltr:1;--flip-icon-rtl:0}:host([ready]){opacity:1}.slideshow{max-block-size:100%;min-block-size:inherit;block-size:inherit;position:relative}.slideshow.not-ready{inline-size:100%;overflow:hidden}.flickity-container{opacity:0;transition:opacity 0.2s;display:flex;block-size:fit-content}.not-ready .flickity-container{block-size:fit-content}.flickity-container.slides-ready{min-block-size:inherit;max-block-size:inherit;block-size:inherit;inline-size:auto}[hidden]{display:none !important}.ui-extras{pointer-events:none;position:absolute;block-size:100%;inline-size:100%;inset-block-start:0;inset-inline-start:0}.ui-extras *{pointer-events:all}/*! Flickity v2.2.1\nhttps://flickity.metafizzy.co\n---------------------------------------------- */.flickity-enabled{position:relative;opacity:1}.flickity-enabled:focus{outline:none}.flickity-viewport{overflow:hidden;position:relative;min-block-size:100%;flex:1}.flickity-slider{position:absolute;inline-size:100%;block-size:100%}.flickity-enabled.is-draggable{-webkit-tap-highlight-color:transparent;-webkit-user-select:none;user-select:none}.flickity-enabled.is-draggable .flickity-viewport{cursor:move;cursor:grab;cursor:grab}.flickity-enabled.is-draggable .flickity-viewport.is-pointer-down{cursor:grabbing}.pagination{display:flex}.flickity-button{background:var(--navbtns-bg-color);border:none;color:#333;opacity:1}.flickity-button:hover{opacity:1;cursor:pointer;--navbtns-icon-color:var(--navbtns-icon-color-hover)}.flickity-button:focus-visible{outline:var(--nano-focus-ring);outline-offset:var(--nano-focus-ring-offset)}.flickity-button:active{opacity:0.6}.flickity-button:disabled{opacity:0.3;cursor:auto;pointer-events:none;background:var(--navbtns-bg-color-disabled)}.button-icon{display:block}.button-icon::after{content:\"\";display:block;background-size:cover;inline-size:var(--navbtns-width);block-size:var(--navbtns-height);background-color:var(--navbtns-icon-color);-webkit-mask-image:var(--nano-component-icon-arrow);mask-image:var(--nano-component-icon-arrow);transition:color var(--nano-transition-fast) ease;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center;transform-origin:center;margin-inline-start:auto;rotate:calc(180deg * var(--flip-icon-ltr));-webkit-mask-size:cover;mask-size:cover}.button-icon--previous::after{rotate:calc(180deg * var(--flip-icon-rtl))}.flickity-button:disabled .button-icon::after{background-color:var(--navbtns-icon-color-disabled)}.flickity-prev-next-button.next{margin-inline-start:auto}.flickity-rtl .flickity-prev-next-button.previous{inset-inline:auto 10px}.flickity-rtl .flickity-prev-next-button.next{inset-inline:10px auto}.flickity-prev-next-button .flickity-button-icon{position:absolute;inset-inline-start:20%;inset-block-start:20%;inline-size:60%;block-size:60%}.flickity-page-dots{inline-size:100%;padding:0;margin:0;text-align:center;line-height:1;z-index:4;display:inline-flex;justify-content:center;inset-block-end:0}.flickity-rtl .flickity-page-dots{direction:rtl}.flickity-page-dots .dot{all:unset;text-indent:200%;white-space:nowrap;overflow:hidden;display:inline-block;display:inline-block;position:relative;inline-size:1.25rem;block-size:0.375rem;margin-block:0;cursor:pointer;padding:calc(var(--nano-spacing-md) / 2)}.flickity-page-dots .dot::after{content:\"\";position:absolute;inset:0;background:currentcolor;background:var(--dot-color);margin:calc(var(--nano-spacing-md) / 2)}.flickity-page-dots .dot:focus-visible{outline:var(--nano-focus-ring);outline-offset:var(--nano-focus-ring-offset);z-index:1}.flickity-page-dots .dot.is-selected::after{background:var(--dot-color-active)}.flickity-enabled.is-fullscreen{position:fixed;inset-inline-start:0;inset-block-start:0;inline-size:100%;block-size:100%;background:hsla(0, 0%, 0%, 0.9);padding-block-end:35px;z-index:100}.flickity-enabled.is-fullscreen .flickity-page-dots{inset-block-end:45px}html.is-flickity-fullscreen{overflow:hidden}.flickity-fullscreen-button{display:block;inset-inline-end:10px;inset-block-start:10px;inline-size:24px;block-size:24px;border-radius:4px;background:var(--fsbtn-bg-color);fill:var(--fsbtn-icon-color)}.flickity-rtl .flickity-fullscreen-button{inset-inline:10px auto}.flickity-fullscreen-button-exit{display:none}.flickity-enabled.is-fullscreen .flickity-fullscreen-button-exit{display:block}.flickity-enabled.is-fullscreen .flickity-fullscreen-button-view{display:none}.flickity-fullscreen-button .flickity-button-icon{position:absolute;inline-size:16px;block-size:16px;inset-inline-start:4px;inset-block-start:4px}.flickity-enabled.is-fade .flickity-slider>*{pointer-events:none;z-index:0}.flickity-enabled.is-fade .flickity-slider ::slotted(.is-selected){pointer-events:auto;z-index:1}";
+const slidesCss = ":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{--dot-color:var(--nano-color-fill-neutral-weak);--dot-color-active:var(--nano-color-fill-primary);--navbtns-icon-color:var(--nano-color-icon-default);--navbtns-icon-color-hover:var(--nano-color-icon-hover);--navbtns-bg-color:transparent;--navbtns-icon-color-disabled:var(--nano-color-icon-disabled);--navbtns-bg-color-disabled:transparent;--navbtns-width:1.5rem;--navbtns-height:1rem;--fsbtn-icon-color:var(--dot-color-active);--fsbtn-bg-color:transparent;--flip-icon-ltr:0;--flip-icon-rtl:1;display:block;-webkit-user-select:none;user-select:none;transition:opacity 0.2s;opacity:0;max-inline-size:100vw}:host:dir(rtl){--flip-icon-ltr:1;--flip-icon-rtl:0}:host([ready]){opacity:1}.slideshow{max-block-size:100%;min-block-size:inherit;block-size:inherit;position:relative}.slideshow.not-ready{inline-size:100%;overflow:hidden}.flickity-container{opacity:0;transition:opacity 0.2s;display:flex;block-size:fit-content}.not-ready .flickity-container{block-size:fit-content}.flickity-container.slides-ready{min-block-size:inherit;max-block-size:inherit;block-size:inherit;inline-size:auto}[hidden]{display:none !important}.ui-extras{pointer-events:none;position:absolute;block-size:100%;inline-size:100%;inset-block-start:0;inset-inline-start:0}.ui-extras *{pointer-events:all}/*! Flickity v2.2.1\nhttps://flickity.metafizzy.co\n---------------------------------------------- */.flickity-enabled{position:relative;opacity:1}.flickity-enabled:focus{outline:none}.flickity-viewport{overflow:hidden;position:relative;min-block-size:100%;flex:1}.flickity-slider{position:absolute;inline-size:100%;block-size:100%}.flickity-enabled.is-draggable{-webkit-tap-highlight-color:transparent;-webkit-user-select:none;user-select:none}.flickity-enabled.is-draggable .flickity-viewport{cursor:move;cursor:grab;cursor:grab}.flickity-enabled.is-draggable .flickity-viewport.is-pointer-down{cursor:grabbing}.pagination{display:flex}.flickity-button{background:var(--navbtns-bg-color);border:none;color:#333;opacity:1}.flickity-button:hover{opacity:1;cursor:pointer;--navbtns-icon-color:var(--navbtns-icon-color-hover)}.flickity-button:focus-visible{outline:var(--nano-focus-ring);outline-offset:var(--nano-focus-ring-offset)}.flickity-button:active{opacity:0.6}.flickity-button:disabled{opacity:0.3;cursor:auto;pointer-events:none;background:var(--navbtns-bg-color-disabled)}.button-icon{display:block}.button-icon::after{content:\"\";display:block;background-size:cover;inline-size:var(--navbtns-width);block-size:var(--navbtns-height);background-color:var(--navbtns-icon-color);-webkit-mask-image:var(--nano-component-icon-arrow);mask-image:var(--nano-component-icon-arrow);transition:color var(--nano-transition-fast) ease;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center;transform-origin:center;margin-inline-start:auto;rotate:calc(180deg * var(--flip-icon-ltr));-webkit-mask-size:cover;mask-size:cover}.button-icon--previous::after{rotate:calc(180deg * var(--flip-icon-rtl))}.flickity-button:disabled .button-icon::after{background-color:var(--navbtns-icon-color-disabled)}.flickity-prev-next-button.next{margin-inline-start:auto}.flickity-rtl .flickity-prev-next-button.previous{inset-inline:auto 10px}.flickity-rtl .flickity-prev-next-button.next{inset-inline:10px auto}.flickity-prev-next-button .flickity-button-icon{position:absolute;inset-inline-start:20%;inset-block-start:20%;inline-size:60%;block-size:60%}.flickity-page-dots{inline-size:100%;padding:0;margin:0;text-align:center;line-height:1;z-index:4;display:inline-flex;justify-content:center;inset-block-end:0}.flickity-rtl .flickity-page-dots{direction:rtl}.flickity-page-dots .dot{all:unset;text-indent:200%;white-space:nowrap;overflow:hidden;display:inline-block;display:inline-block;position:relative;inline-size:1.25rem;block-size:0.375rem;margin-block:0;cursor:pointer;padding:calc(var(--nano-spacing-md) / 2)}.flickity-page-dots .dot::after{content:\"\";position:absolute;inset:0;background:currentcolor;background:var(--dot-color);margin:calc(var(--nano-spacing-md) / 2)}.flickity-page-dots .dot:focus-visible{outline:var(--nano-focus-ring);outline-offset:var(--nano-focus-ring-offset);z-index:1}.flickity-page-dots .dot.is-selected::after{background:var(--dot-color-active)}.flickity-enabled.is-fullscreen{position:fixed;inset-inline-start:0;inset-block-start:0;inline-size:100%;block-size:100%;background:hsla(0, 0%, 0%, 0.9);padding-block-end:35px;z-index:100}.flickity-enabled.is-fullscreen .flickity-page-dots{inset-block-end:45px}html.is-flickity-fullscreen{overflow:hidden}.flickity-fullscreen-button{display:block;inset-inline-end:10px;inset-block-start:10px;inline-size:24px;block-size:24px;border-radius:4px;background:var(--fsbtn-bg-color);fill:var(--fsbtn-icon-color)}.flickity-rtl .flickity-fullscreen-button{inset-inline:10px auto}.flickity-fullscreen-button-exit{display:none}.flickity-enabled.is-fullscreen .flickity-fullscreen-button-exit{display:block}.flickity-enabled.is-fullscreen .flickity-fullscreen-button-view{display:none}.flickity-fullscreen-button .flickity-button-icon{position:absolute;inline-size:16px;block-size:16px;inset-inline-start:4px;inset-block-start:4px}.flickity-enabled.is-fade .flickity-slider>*{pointer-events:none;z-index:0}.flickity-enabled.is-fade .flickity-slider ::slotted(.is-selected){pointer-events:auto;z-index:1}";
 
 const modulo = (num, div) => {
     return ((num % div) + div) % div;
@@ -2812,15 +2812,15 @@ const Slides = class {
     }
     async loadFlickityModules(opts) {
         if (!this.hasFullScreenModule && opts.fullscreen) {
-            await Promise.resolve().then(function () { return require('./fullscreen-Cuh4s9g3.js'); });
+            await Promise.resolve().then(function () { return require('./fullscreen-CiU1Fy55.js'); });
             this.hasFullScreenModule = true;
         }
         if (!this.hasLazyLoadModule && opts.lazyLoad) {
-            await Promise.resolve().then(function () { return require('./lazyload-tvpXnTYY.js'); });
+            await Promise.resolve().then(function () { return require('./lazyload-vgYlCqUh.js'); });
             this.hasLazyLoadModule = true;
         }
         if (!this.hasFadeModule && opts.fade) {
-            await Promise.resolve().then(function () { return require('./fade-kpIGI6CJ.js'); });
+            await Promise.resolve().then(function () { return require('./fade-Cgz_uvea.js'); });
             this.hasFadeModule = true;
         }
     }

package/dist/cjs/nano-slides.cjs.entry.js

@@ -3,7 +3,7 @@
  */
 'use strict';
 
-var nanoSlides_entry = require('./nano-slides-DcXrQQgs.js');
+var nanoSlides_entry = require('./nano-slides-D-ELnUF-.js');
 require('./index-DGttnXif.js');
 require('./renderer-jVpDRMfV.js');
 

package/dist/cjs/nano-spinner.cjs.entry.js

@@ -5,7 +5,7 @@
 
 var index = require('./index-DGttnXif.js');
 
-const spinnerCss = ":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}}:where(nano-spinner,.nano-spinner){display:inline-block;--track-size:.1em;--indicator-color:var(--nano-color-primary-1000);--track-color:var(--nano-color-neutral-300);--overlay-color:rgb(var(--nano-color-base-rgb-0) / 88%);display:inline-flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--nano-spacing-xs)}:where(nano-spinner,.nano-spinner)::after{content:\"\";order:-1;font-size:1em;display:block;inline-size:1em;block-size:1em;border-radius:50%;border:solid var(--track-size) var(--track-color);border-block-start-color:var(--indicator-color);border-inline-end-color:var(--indicator-color);border-inline-start-color:var(--indicator-color);animation:1s linear infinite loading-spin}:where(nano-spinner,.nano-spinner)>:not([slot=label]){display:none}:where(nano-spinner,.nano-spinner) [slot=label]{font-size:var(--nano-font-size-sm);color:var(--nano-color-neutral-1200);display:block;text-align:center;position:relative;z-index:1}:where(nano-spinner,.nano-spinner)[overlay]:not([overlay=false]){position:absolute;inset:0;display:grid;grid-template-rows:auto auto;z-index:var(--nano-z-index-mask);justify-items:center}:where(nano-spinner,.nano-spinner)[overlay]:not([overlay=false])::before{content:\"\";order:-2;position:absolute;inset:0;background:var(--overlay-color);z-index:-1}:where(nano-spinner,.nano-spinner)[overlay]:not([overlay=false]) [slot=label]{align-self:start;grid-row:2}:where(nano-spinner,.nano-spinner)[overlay]:not([overlay=false])::after{align-self:end;grid-row:1;position:relative}@keyframes loading-spin{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}";
+const spinnerCss = ":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}}:where(nano-spinner,.nano-spinner){display:inline-block;--track-size:.1em;--indicator-color:var(--nano-color-fill-primary);--track-color:var(--nano-color-fill-neutral-weak);--overlay-color:rgb(var(--nano-color-base-rgb-0) / 88%);display:inline-flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--nano-spacing-xs)}:where(nano-spinner,.nano-spinner)::after{content:\"\";order:-1;font-size:1em;display:block;inline-size:1em;block-size:1em;border-radius:50%;border:solid var(--track-size) var(--track-color);border-block-start-color:var(--indicator-color);border-inline-end-color:var(--indicator-color);border-inline-start-color:var(--indicator-color);animation:1s linear infinite loading-spin}:where(nano-spinner,.nano-spinner)>:not([slot=label]){display:none}:where(nano-spinner,.nano-spinner) [slot=label]{font-size:var(--nano-font-size-sm);color:var(--nano-color-fill-neutral);display:block;text-align:center;position:relative;z-index:1}:where(nano-spinner,.nano-spinner)[overlay]:not([overlay=false]){position:absolute;inset:0;display:grid;grid-template-rows:auto auto;z-index:var(--nano-z-index-mask);justify-items:center}:where(nano-spinner,.nano-spinner)[overlay]:not([overlay=false])::before{content:\"\";order:-2;position:absolute;inset:0;background:var(--overlay-color);z-index:-1}:where(nano-spinner,.nano-spinner)[overlay]:not([overlay=false]) [slot=label]{align-self:start;grid-row:2}:where(nano-spinner,.nano-spinner)[overlay]:not([overlay=false])::after{align-self:end;grid-row:1;position:relative}@keyframes loading-spin{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}";
 
 const Spinner = class {
     constructor(hostRef) {

package/dist/cjs/nano-split-pane.cjs.entry.js

@@ -9,7 +9,7 @@ var drag = require('./drag-B5XXLJW9.js');
 var math = require('./math-DIjJ3V87.js');
 var throttle = require('./throttle-CrRDOkln.js');
 
-const splitPaneCss = ":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{--divider-width:4px;--divider-hit-area:14px;--min:0%;--max:100%;--background-color:var(--nano-color-neutral-300);--content-color:var(--nano-color-neutral-1000);display:grid}.start,.end{overflow:hidden}.divider{flex:0 0 var(--divider-width);display:flex;position:relative;align-items:center;justify-content:center;background-color:var(--background-color);color:var(--content-color);z-index:1;font-size:0.8rem}.divider:focus{outline:none}:host(:not([disabled])) .divider:focus-visible{background-color:var(--nano-focus-ring-color)}:host([disabled]) .divider{cursor:not-allowed}:host(:not([vertical],[disabled])) .divider{cursor:col-resize}:host(:not([vertical])) .divider::after{display:flex;content:\"\";position:absolute;block-size:100%;inset-inline-start:calc(var(--divider-hit-area) / -2 + var(--divider-width) / 2);inline-size:var(--divider-hit-area)}:host([vertical]){flex-direction:column}:host([vertical]:not([disabled])) .divider{cursor:row-resize}:host([vertical]) .divider::after{content:\"\";position:absolute;inline-size:100%;inset-block-start:calc(var(--divider-hit-area) / -2 + var(--divider-width) / 2);block-size:var(--divider-hit-area)}";
+const splitPaneCss = ":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{--divider-width:4px;--divider-hit-area:14px;--min:0%;--max:100%;--background-color:var(--nano-color-fill-neutral-weak);--content-color:var(--nano-color-fill-neutral);display:grid}.start,.end{overflow:hidden}.divider{flex:0 0 var(--divider-width);display:flex;position:relative;align-items:center;justify-content:center;background-color:var(--background-color);color:var(--content-color);z-index:1;font-size:0.8rem}.divider:focus{outline:none}:host(:not([disabled])) .divider:focus-visible{background-color:var(--nano-focus-ring-color)}:host([disabled]) .divider{cursor:not-allowed}:host(:not([vertical],[disabled])) .divider{cursor:col-resize}:host(:not([vertical])) .divider::after{display:flex;content:\"\";position:absolute;block-size:100%;inset-inline-start:calc(var(--divider-hit-area) / -2 + var(--divider-width) / 2);inline-size:var(--divider-hit-area)}:host([vertical]){flex-direction:column}:host([vertical]:not([disabled])) .divider{cursor:row-resize}:host([vertical]) .divider::after{content:\"\";position:absolute;inline-size:100%;inset-block-start:calc(var(--divider-hit-area) / -2 + var(--divider-width) / 2);block-size:var(--divider-hit-area)}";
 
 const SplitPane = class {
     get host() { return index.getElement(this); }

package/dist/cjs/nano-step-accordion.cjs.entry.js

@@ -6,7 +6,7 @@
 var index = require('./index-DGttnXif.js');
 var renderer = require('./renderer-jVpDRMfV.js');
 
-const stepAccordionCss = ":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:block}.nano-details{--padding:0;--btn-bg-color--hover:transparent;--btn-bg-color--active:transparent;border:none;margin-block-end:var(--nano-spacing-sm)}.nano-details::part(base){display:grid;grid-template-rows:auto auto;grid-template-columns:auto 1fr;gap:var(--nano-spacing-sm) 1.625rem}.nano-details.step--grid-working::part(base)::before{content:\"\";display:block;grid-column:1;grid-row:2;inline-size:1rem;min-block-size:1rem;border-inline-end:2px solid var(--nano-color-neutral-300)}.nano-details.step--grid-working::part(base)::after{content:\"\";grid-column:1;grid-row:2;inline-size:0.4rem;block-size:0.4rem;place-self:end end;translate:-50% 0;inset-inline-start:calc(50% - 2.5px);position:relative;border-inline-end:2px solid var(--nano-color-neutral-300);border-block-end:2px solid var(--nano-color-neutral-300);rotate:45deg}.nano-details:last-of-type::part(base)::before{min-block-size:0}.nano-details:last-of-type::part(base)::after{display:none}.nano-details::part(header){grid-column:1/-1;grid-row:1;display:inline-flex;gap:var(--nano-spacing-sm)}.nano-details::part(body){grid-column:2;grid-row:2}.nano-details::part(content-wrapper){padding:1px}.nano-details.step--grid-not-working::part(header){padding-block-end:var(--nano-spacing-sm)}.nano-details.step--grid-not-working::part(body){padding:0 0 0 2.5625rem}.step .step-header{display:inline-flex;gap:var(--nano-spacing-sm);align-items:center}.step .step-icon{display:inline-flex;align-items:center;justify-content:center;inline-size:2rem;block-size:2rem;border-radius:var(--nano-border-radius-circle);background-color:transparent;color:var(--nano-color-neutral-1400);border:1px solid var(--nano-color-neutral-300)}.step.step--complete .step-icon{background-color:var(--nano-color-success-1000);color:var(--nano-color-base-0);border:none}.step[open] .step-icon{background-color:var(--nano-color-primary-1000);color:var(--nano-color-base-0);border:none}.step .step-change{font-size:var(--nano-font-size-xs);line-height:var(--nano-line-height-normal);letter-spacing:var(--nano-letter-spacing-loose);text-decoration:underline;color:var(--nano-color-primary-1200)}";
+const stepAccordionCss = ":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:block}.nano-details{--padding:0;--btn-bg-color--hover:transparent;--btn-bg-color--active:transparent;border:none;margin-block-end:var(--nano-spacing-sm)}.nano-details::part(base){display:grid;grid-template-rows:auto auto;grid-template-columns:auto 1fr;gap:var(--nano-spacing-sm) 1.625rem}.nano-details.step--grid-working::part(base)::before{content:\"\";display:block;grid-column:1;grid-row:2;inline-size:1rem;min-block-size:1rem;border-inline-end:2px solid var(--nano-color-border-default)}.nano-details.step--grid-working::part(base)::after{content:\"\";grid-column:1;grid-row:2;inline-size:0.4rem;block-size:0.4rem;place-self:end end;translate:-50% 0;inset-inline-start:calc(50% - 2.5px);position:relative;border-inline-end:2px solid var(--nano-color-border-default);border-block-end:2px solid var(--nano-color-border-default);rotate:45deg}.nano-details:last-of-type::part(base)::before{min-block-size:0}.nano-details:last-of-type::part(base)::after{display:none}.nano-details::part(header){grid-column:1/-1;grid-row:1;display:inline-flex;gap:var(--nano-spacing-sm)}.nano-details::part(body){grid-column:2;grid-row:2}.nano-details::part(content-wrapper){padding:1px}.nano-details.step--grid-not-working::part(header){padding-block-end:var(--nano-spacing-sm)}.nano-details.step--grid-not-working::part(body){padding:0 0 0 2.5625rem}.step .step-header{display:inline-flex;gap:var(--nano-spacing-sm);align-items:center}.step .step-icon{display:inline-flex;align-items:center;justify-content:center;inline-size:2rem;block-size:2rem;border-radius:var(--nano-border-radius-circle);background-color:transparent;color:var(--nano-color-text-default);border:1px solid var(--nano-color-border-default)}.step.step--complete .step-icon{background-color:var(--nano-color-fill-success);color:var(--nano-color-basic-white);border:none}.step[open] .step-icon{background-color:var(--nano-color-fill-primary);color:var(--nano-color-basic-white);border:none}.step .step-change{font-size:var(--nano-font-size-xs);line-height:var(--nano-line-height-normal);letter-spacing:var(--nano-letter-spacing-loose);text-decoration:underline;color:var(--nano-color-text-link)}";
 
 const NanoStepAccordion = class {
     constructor(hostRef) {

package/dist/cjs/nano-step-breadcrumb.cjs.entry.js

@@ -8,7 +8,7 @@ var renderer = require('./renderer-jVpDRMfV.js');
 var constructibleStyle = require('./constructible-style-BsHBb9au.js');
 var style = require('./style-Du-L-qMa.js');
 
-const stepBreadcrumbCss = ":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:block;--background:var(--nano-color-base-0)}.step-wrapper{container-type:inline-size}.step-list.desktop{display:flex;flex-direction:row;align-items:center;justify-content:space-between;list-style:none;padding:0;margin:0;position:relative;z-index:1}.step-list.desktop::before{content:\"\";display:block;flex-grow:1;block-size:1px;background-color:var(--nano-color-neutral-300);position:absolute;inset-block-start:50%;z-index:-1;inset-inline-start:0;inline-size:100%}.step-item-wrapper{flex:0 1 auto;display:inline-flex;align-items:center;cursor:pointer}.step-item-wrapper:last-of-type{flex:0 1 auto}.step-item-wrapper:last-of-type .step-item{padding-inline-end:0}.step-item-wrapper:first-of-type::before{display:none}.step-item-wrapper:first-of-type .step-item{padding-inline-start:0}.step-item-wrapper::before{content:\"\";grid-column:2;grid-row:1;inline-size:0.4rem;block-size:0.4rem;place-self:center end;inset-block-start:0.5px;position:relative;border-inline-end:1px solid var(--nano-color-neutral-300);border-block-end:1px solid var(--nano-color-neutral-300);rotate:-45deg}:dir(rtl) .step-item-wrapper::after{rotate:45deg}.step-item{all:unset;display:inline-flex;align-items:center;gap:var(--nano-spacing-sm);background-color:var(--background);padding:0 var(--nano-spacing-sm);position:relative}.step-item:focus-visible{outline:var(--nano-focus-ring);outline-offset:var(--nano-focus-ring-offset);z-index:1}.step-item.step-item--disabled{cursor:not-allowed}.step-item.step-item--disabled>*{opacity:0.5}.step-item-icon{font-size:var(--nano-font-size-xs);line-height:var(--nano-line-height-normal);letter-spacing:var(--nano-letter-spacing-loose);display:inline-flex;align-items:center;justify-content:center;inline-size:1.5rem;block-size:1.5rem;border-radius:var(--nano-border-radius-circle);background-color:transparent;color:var(--nano-color-neutral-1400);border:1px solid var(--nano-color-neutral-300)}.step-item--complete .step-item-icon{background-color:var(--nano-color-success-1000);color:var(--nano-color-base-0);border:none}.step-item--active .step-item-icon{background-color:var(--nano-color-primary-1000);color:var(--nano-color-base-0);border:none}.step-dropdown{inline-size:100%;min-inline-size:300px}.step-trigger{all:unset;display:inline-flex;gap:var(--nano-spacing-md);align-items:center;inline-size:100%;cursor:pointer}.step-trigger-text{display:flex;flex-direction:column}.step-trigger-now{font-weight:var(--nano-font-weight-normal);font-size:var(--nano-font-size-xl);line-height:var(--nano-line-height-denser);text-wrap:balance;color:var(--nano-color-neutral-1400)}.step-trigger-next{font-size:var(--nano-font-size-2xs);line-height:var(--nano-line-height-normal);letter-spacing:var(--nano-letter-spacing-loose);color:var(--nano-color-neutral-1000)}.step-trigger-icon{margin-inline-start:auto;color:var(--nano-color-primary-1000);transition:var(--nano-transition-x-fast) rotate}[open] .step-trigger-icon{rotate:180deg}.step-progress-circle{--size:64px;--thickness:4px;inline-size:var(--size);min-inline-size:var(--size);aspect-ratio:1/1;border-radius:50%;display:grid;place-items:center;position:relative}.step-progress-circle::before{content:\"\";position:absolute;inset:0;border-radius:50%;background:conic-gradient(var(--nano-color-success-1000) calc(var(--value) / var(--max) * 360deg), var(--nano-color-neutral-100) 0);-webkit-mask:radial-gradient(farthest-side, transparent calc(100% - var(--thickness)), black 90%);mask:radial-gradient(farthest-side, transparent calc(100% - var(--thickness)), black 90%)}.step-progress-title{font-size:var(--nano-font-size-sm);line-height:var(--nano-line-height-normal);font-weight:var(--nano-font-weight-bold);white-space:nowrap;color:var(--nano-color-neutral-1000)}.step-progress-title strong{color:var(--nano-color-neutral-1400)}";
+const stepBreadcrumbCss = ":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:block;--background:var(--nano-color-background-default)}.step-wrapper{container-type:inline-size}.step-list.desktop{display:flex;flex-direction:row;align-items:center;justify-content:space-between;list-style:none;padding:0;margin:0;position:relative;z-index:1}.step-list.desktop::before{content:\"\";display:block;flex-grow:1;block-size:1px;background-color:var(--nano-color-fill-neutral-weak);position:absolute;inset-block-start:50%;z-index:-1;inset-inline-start:0;inline-size:100%}.step-item-wrapper{flex:0 1 auto;display:inline-flex;align-items:center;cursor:pointer}.step-item-wrapper:last-of-type{flex:0 1 auto}.step-item-wrapper:last-of-type .step-item{padding-inline-end:0}.step-item-wrapper:first-of-type::before{display:none}.step-item-wrapper:first-of-type .step-item{padding-inline-start:0}.step-item-wrapper::before{content:\"\";grid-column:2;grid-row:1;inline-size:0.4rem;block-size:0.4rem;place-self:center end;inset-block-start:0.5px;position:relative;border-inline-end:1px solid var(--nano-color-fill-neutral-weak);border-block-end:1px solid var(--nano-color-fill-neutral-weak);rotate:-45deg}:dir(rtl) .step-item-wrapper::after{rotate:45deg}.step-item{all:unset;display:inline-flex;align-items:center;gap:var(--nano-spacing-sm);background-color:var(--background);padding:0 var(--nano-spacing-sm);position:relative}.step-item:focus-visible{outline:var(--nano-focus-ring);outline-offset:var(--nano-focus-ring-offset);z-index:1}.step-item.step-item--disabled{cursor:not-allowed}.step-item.step-item--disabled>*{opacity:0.5}.step-item-icon{font-size:var(--nano-font-size-xs);line-height:var(--nano-line-height-normal);letter-spacing:var(--nano-letter-spacing-loose);display:inline-flex;align-items:center;justify-content:center;inline-size:1.5rem;block-size:1.5rem;border-radius:var(--nano-border-radius-circle);background-color:transparent;color:var(--nano-color-text-default);border:1px solid var(--nano-color-fill-neutral-weak)}.step-item--complete .step-item-icon{background-color:var(--nano-color-fill-success);color:var(--nano-color-basic-white);border:none}.step-item--active .step-item-icon{background-color:var(--nano-color-fill-primary);color:var(--nano-color-basic-white);border:none}.step-dropdown{inline-size:100%;min-inline-size:300px}.step-trigger{all:unset;display:inline-flex;gap:var(--nano-spacing-md);align-items:center;inline-size:100%;cursor:pointer}.step-trigger-text{display:flex;flex-direction:column}.step-trigger-now{font-weight:var(--nano-font-weight-normal);font-size:var(--nano-font-size-xl);line-height:var(--nano-line-height-denser);text-wrap:balance;color:var(--nano-color-text-default)}.step-trigger-next{font-size:var(--nano-font-size-2xs);line-height:var(--nano-line-height-normal);letter-spacing:var(--nano-letter-spacing-loose);color:var(--nano-color-fill-neutral)}.step-trigger-icon{margin-inline-start:auto;color:var(--nano-color-fill-primary);transition:var(--nano-transition-x-fast) rotate}[open] .step-trigger-icon{rotate:180deg}.step-progress-circle{--size:64px;--thickness:4px;inline-size:var(--size);min-inline-size:var(--size);aspect-ratio:1/1;border-radius:50%;display:grid;place-items:center;position:relative}.step-progress-circle::before{content:\"\";position:absolute;inset:0;border-radius:50%;background:conic-gradient(var(--nano-color-fill-success) calc(var(--value) / var(--max) * 360deg), var(--nano-color-surface-neutral) 0);-webkit-mask:radial-gradient(farthest-side, transparent calc(100% - var(--thickness)), black 90%);mask:radial-gradient(farthest-side, transparent calc(100% - var(--thickness)), black 90%)}.step-progress-title{font-size:var(--nano-font-size-sm);line-height:var(--nano-line-height-normal);font-weight:var(--nano-font-weight-bold);white-space:nowrap;color:var(--nano-color-fill-neutral)}.step-progress-title strong{color:var(--nano-color-text-default)}";
 
 var __decorate = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
     var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;

package/dist/cjs/nano-tab-group.cjs.entry.js

@@ -9,7 +9,7 @@ var componentStore = require('./component-store-C5eBOK0w.js');
 var renderer = require('./renderer-jVpDRMfV.js');
 require('./throttle-CrRDOkln.js');
 
-const tabGroupCss = ":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{--border:2px solid var(--nano-color-neutral-300);--indicator-transition:var(--nano-transition-fast);--indicator-color:var(--nano-color-primary-1000);--indicator-track-color:var(--nano-color-neutral-300);--indicator-size:0;--tab-spacing:var(--nano-spacing-md);--content-spacing:var(--nano-spacing-l1-default);display:block;position:relative;z-index:var(--nano-z-index-raised)}.group{display:flex;border-radius:0;inline-size:100%;flex:inherit}:host([equal-tab-size]) .group__tabs-border,.group__tabs[has-scroll-controls] .group__tabs-border{display:none}.group__tabs::part(items){gap:var(--tab-spacing)}.group--top{flex-direction:column}.group--top .group__tabs{--fade-size:100px}.group--top .group__tabs::part(items){align-items:flex-end}.group--top .group__tabs-border{flex:1;border-block-end:var(--border)}.group--top .group__body{order:2;position:relative;flex:1 1 auto;border-block-end:var(--border);padding-block:var(--content-spacing)}.group--start{flex-direction:row}:host([equal-tab-size]) .group--start .group__tabs::part(items){display:grid;grid-auto-rows:1fr}.group--start .group__tabs-border{flex:1;border-inline-end:var(--border)}.group--start .group__body{flex:1 1 auto;order:2;overflow:hidden;padding-inline-start:var(--content-spacing)}";
+const tabGroupCss = ":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{--border:2px solid var(--nano-color-border-default);--indicator-transition:var(--nano-transition-fast);--indicator-color:var(--nano-color-border-accent);--indicator-track-color:var(--nano-color-border-default);--indicator-size:0;--tab-spacing:var(--nano-spacing-md);--content-spacing:var(--nano-spacing-l1-default);display:block;position:relative;z-index:var(--nano-z-index-raised)}.group{display:flex;border-radius:0;inline-size:100%;flex:inherit}:host([equal-tab-size]) .group__tabs-border,.group__tabs[has-scroll-controls] .group__tabs-border{display:none}.group__tabs::part(items){gap:var(--tab-spacing)}.group--top{flex-direction:column}.group--top .group__tabs{--fade-size:100px}.group--top .group__tabs::part(items){align-items:flex-end}.group--top .group__tabs-border{flex:1;border-block-end:var(--border)}.group--top .group__body{order:2;position:relative;flex:1 1 auto;border-block-end:var(--border);padding-block:var(--content-spacing)}.group--start{flex-direction:row}:host([equal-tab-size]) .group--start .group__tabs::part(items){display:grid;grid-auto-rows:1fr}.group--start .group__tabs-border{flex:1;border-inline-end:var(--border)}.group--start .group__body{flex:1 1 auto;order:2;overflow:hidden;padding-inline-start:var(--content-spacing)}";
 
 let id = 0;
 const NanoTabGroup = class {

package/dist/cjs/nano-tab.cjs.entry.js

@@ -6,7 +6,7 @@
 var index = require('./index-DGttnXif.js');
 var renderer = require('./renderer-jVpDRMfV.js');
 
-const tabCss = ":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{--border:2px solid var(--nano-color-neutral-300);--border-hover-color:var(--nano-color-primary-700);--border-active-color:var(--nano-color-primary-1000);--text-hover-color:var(--nano-color-primary-1000);--text-active-color:var(--nano-color-primary-1100);--padding:var(--nano-spacing-md);font-size:var(--nano-font-size-sm);line-height:var(--nano-line-height-normal);letter-spacing:var(--nano-letter-spacing-loose);display:inline-block;cursor:pointer;color:var(--nano-color-neutral-1400);border:var(--border);border-inline-end-width:0;border-inline-start-width:0;border-block-start-width:0;border-block-end:var(--border)}:host(:not([disabled]):hover){border-color:var(--border-hover-color);color:var(--text-hover-color)}:host(:not([disabled]):active),:host([active]){border-color:var(--border-active-color);color:var(--text-active-color)}:host(.nano-sortable__dragged){background:var(--nano-color-base-0);opacity:0.9 !important;box-shadow:var(--nano-shadow-l0) !important}.tab{all:unset;padding:var(--padding);display:flex;white-space:nowrap;align-items:center;position:relative;gap:var(--nano-spacing-sm);justify-content:center}.tab[href]:focus{outline:var(--nano-focus-ring);outline-offset:-3px}.tab.tab--disabled{opacity:0.5;cursor:not-allowed}.tab.tab--closable{padding-inline-end:calc(var(--padding) - var(--nano-spacing-sm))}.tab ::slotted(*),.tab::slotted(*){display:flex;align-items:center}.tab ::slotted(.nano-sortable__keyboard-handle){position:absolute;inset-inline-end:-1em;z-index:1}.tab:not(.tab--disabled):has(.tab__label:focus-visible){outline:var(--nano-focus-ring);outline-offset:-3px}.tab__label{display:flex;flex-direction:column;gap:var(--nano-spacing-sm);align-items:center}.tab__label:focus{outline:none}.tab__close-button{color:var(--nano-color-primary-1200);--hover-color:var(--nano-color-primary-700)}";
+const tabCss = ":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{--border:2px solid var(--nano-color-border-default);--border-hover-color:var(--nano-color-border-accent-hover);--border-active-color:var(--nano-color-border-accent);--text-hover-color:var(--nano-color-text-hover);--text-active-color:var(--nano-color-text-primary);--padding:var(--nano-spacing-md);font-size:var(--nano-font-size-sm);line-height:var(--nano-line-height-normal);letter-spacing:var(--nano-letter-spacing-loose);display:inline-block;cursor:pointer;color:var(--nano-color-text-default);border:var(--border);border-inline-end-width:0;border-inline-start-width:0;border-block-start-width:0;border-block-end:var(--border)}:host(:not([disabled]):hover){border-color:var(--border-hover-color);color:var(--text-hover-color)}:host(:not([disabled]):active),:host([active]){border-color:var(--border-active-color);color:var(--text-active-color)}:host(.nano-sortable__dragged){background:var(--nano-color-background-default);opacity:0.9 !important;box-shadow:var(--nano-shadow-l0) !important}.tab{all:unset;padding:var(--padding);display:flex;white-space:nowrap;align-items:center;position:relative;gap:var(--nano-spacing-sm);justify-content:center}.tab[href]:focus{outline:var(--nano-focus-ring);outline-offset:-3px}.tab.tab--disabled{opacity:0.5;cursor:not-allowed;border-color:var(--nano-color-border-disabled)}.tab.tab--closable{padding-inline-end:calc(var(--padding) - var(--nano-spacing-sm))}.tab ::slotted(*),.tab::slotted(*){display:flex;align-items:center}.tab ::slotted(.nano-sortable__keyboard-handle){position:absolute;inset-inline-end:-1em;z-index:1}.tab:not(.tab--disabled):has(.tab__label:focus-visible){outline:var(--nano-focus-ring);outline-offset:-3px}.tab__label{display:flex;flex-direction:column;gap:var(--nano-spacing-sm);align-items:center}.tab__label:focus{outline:none}.tab__close-button{color:var(--nano-color-icon-default);--hover-color:var(--nano-color-icon-hover)}";
 
 let id = 0;
 const NanoTab = class {

package/dist/cjs/{table.worker-BXs-g6xI.js → table.worker-B-rQpQoz.js}

@@ -3,7 +3,7 @@
  */
 'use strict';
 
-var nanoDataTable_entry = require('./nano-data-table-BC1htsdm.js');
+var nanoDataTable_entry = require('./nano-data-table-UXM5xpCO.js');
 require('./index-DGttnXif.js');
 require('./renderer-jVpDRMfV.js');
 require('./math-DIjJ3V87.js');

package/dist/collection/components/alert/alert.css

@@ -43,41 +43,41 @@
    * @prop --border-color: Defaults to var(--nano-layer-border-color);
    * @prop --border-width: Defaults to var(--nano-layer-border-width);
    * @prop --background: Defaults to var(--nano-layer-background-color);
-   * @prop --tint-color: The highlight colour (border-start, icon and heading text). Defaults to var(--nano-color-primary-1100);
+   * @prop --tint-color: The highlight colour (border-start, icon and heading text). Defaults to var(--nano-color-fill-primary-hover);
    * @prop --icon-size: Defaults to var(--nano-pictogram-size-large);
-   * @prop --scrim-color: overlay colour of alert display. Defaults to var(--nano-overlay-background-color);
-   * @prop --close-button-color: Defaults to var(--nano-color-neutral-400);
+   * @prop --scrim-color: overlay colour of alert display. Defaults to var(--nano-color-overlay-scrim);
+   * @prop --close-button-color: Defaults to var(--nano-color-fill-neutral-weak);
    */
   --border-radius: var(--nano-layer-border-radius);
   --border-color: var(--nano-layer-border-color);
   --border-width: var(--nano-layer-border-width);
   --icon-size: var(--nano-pictogram-size-large);
-  --scrim-color: var(--nano-overlay-background-color);
-  --close-button-color: var(--nano-color-neutral-800);
-  --tint-color: var(--nano-color-primary-1100);
-  --background: var(--nano-color-primary-50);
+  --scrim-color: var(--nano-color-overlay-scrim);
+  --close-button-color: var(--nano-color-fill-neutral);
+  --tint-color: var(--nano-color-text-info);
+  --background: var(--nano-color-surface-info);
   display: block;
   container-type: inline-size;
 }
 
 :host([color=neutral]), :host([theme=neutral]) {
-  --tint-color: var(--nano-color-neutral-1200);
-  --background: var(--nano-color-neutral-75);
+  --tint-color: var(--nano-color-text-neutral);
+  --background: var(--nano-color-surface-neutral);
 }
 
 :host([color=success]), :host([theme=success]) {
-  --tint-color: var(--nano-color-success-1100);
-  --background: var(--nano-color-success-50);
+  --tint-color: var(--nano-color-text-success);
+  --background: var(--nano-color-surface-success);
 }
 
 :host([color=warning]), :host([theme=warning]) {
-  --tint-color: var(--nano-color-warning-1100);
-  --background: var(--nano-color-warning-75);
+  --tint-color: var(--nano-color-text-warning);
+  --background: var(--nano-color-surface-warning);
 }
 
 :host([color=danger]), :host([theme=danger]) {
-  --tint-color: var(--nano-color-danger-1100);
-  --background: var(--nano-color-danger-100);
+  --tint-color: var(--nano-color-text-danger);
+  --background: var(--nano-color-surface-danger);
 }
 
 .alert {

package/dist/collection/components/badge/badge.js

@@ -9,8 +9,6 @@
 export class NanoBadge {
     /** The semantic theme of the button. Defaults to primary / brand blue  */
     theme;
-    /** The strength / vibrancy of the theme. Defaults to `3` */
-    strength;
     /** Use pulse to draw attention to the badge with an animation */
     pulse;
     static get is() { return "nano-badge"; }
@@ -51,25 +49,6 @@ export class NanoBadge {
                 "setter": false,
                 "reflect": true
             },
-            "strength": {
-                "type": "string",
-                "attribute": "strength",
-                "mutable": false,
-                "complexType": {
-                    "original": "'1' | '2' | '3' | '4'",
-                    "resolved": "\"1\" | \"2\" | \"3\" | \"4\"",
-                    "references": {}
-                },
-                "required": false,
-                "optional": true,
-                "docs": {
-                    "tags": [],
-                    "text": "The strength / vibrancy of the theme. Defaults to `3`"
-                },
-                "getter": false,
-                "setter": false,
-                "reflect": true
-            },
             "pulse": {
                 "type": "boolean",
                 "attribute": "pulse",

package/dist/collection/components/breadcrumb/breadcrumb.css

@@ -37,20 +37,20 @@
       scroll-behavior: auto !important;
     }
   }/**
-  * @prop {string} --text-color - The base color of the text. Defaults to var(--nano-color-primary-1100).
-  * @prop {string} --text-color-hover - The hover colour of the text. Defaults to var(--nano-color-primary-1200).
-  * @prop {string} --text-color-secondary - The secondary colour (& inactive colour) of the text. Defaults to var(--nano-color-neutral-1400).
-  * @prop {string} --text-color-disabled - The disabled colour of the text. Defaults to var(--nano-color-neutral-1000).
-  * @prop {string} --border-color - The colour of the border & divider. Defaults to var(--nano-color-neutral-400).
-  * @prop {string} --trigger-bg-color - The background colour of the trigger button. Defaults to var(--nano-color-base-0).
+  * @prop {string} --text-color - The base color of the text. Defaults to var(--nano-color-fill-primary-hover).
+  * @prop {string} --text-color-hover - The hover colour of the text. Defaults to var(--nano-color-fill-primary-pressed).
+  * @prop {string} --text-color-secondary - The secondary colour (& inactive colour) of the text. Defaults to var(--nano-color-text-default).
+  * @prop {string} --text-color-disabled - The disabled colour of the text. Defaults to var(--nano-color-fill-neutral).
+  * @prop {string} --border-color - The colour of the border & divider. Defaults to var(--nano-color-fill-neutral-weak).
+  * @prop {string} --trigger-bg-color - The background colour of the trigger button. Defaults to var(--nano-color-background-default).
   */
 :host {
-  --text-color: var(--nano-color-primary-1100);
-  --text-color-hover: var(--nano-color-primary-1200);
-  --text-color-secondary: var(--nano-color-neutral-1400);
-  --text-color-disabled: var(--nano-color-neutral-1000);
-  --border-color: var(--nano-color-neutral-400);
-  --trigger-bg-color: var(--nano-color-base-0);
+  --text-color: var(--nano-color-text-link);
+  --text-color-hover: var(--nano-color-text-hover);
+  --text-color-secondary: var(--nano-color-text-default);
+  --text-color-disabled: var(--nano-color-text-disabled);
+  --border-color: var(--nano-color-border-default);
+  --trigger-bg-color: var(--nano-color-background-default);
   display: block;
 }
 

package/dist/collection/components/breadcrumb/breadcrumb.js

@@ -89,7 +89,7 @@ export class NanoBreadcrumb {
                     "references": {
                         "Breadcrumb": {
                             "location": "local",
-                            "path": "/builds/sN_eAsgS/0/Digital/nano-components/packages/components/src/components/breadcrumb/breadcrumb.tsx",
+                            "path": "/builds/zUbCqThW/0/Digital/nano-components/packages/components/src/components/breadcrumb/breadcrumb.tsx",
                             "id": "src/components/breadcrumb/breadcrumb.tsx::Breadcrumb"
                         }
                     }

package/dist/collection/components/card-carousel/card-carousel.css

@@ -42,14 +42,14 @@
    * @prop --bleed: A portion of the Image of the next card is displayed outside the parent width boundary. 
    * Generally should be the parent's `padding-inline-end` (or `padding-right`). Defaults to 0px;
    * @prop --gap: gap between the slides. Defaults to var(--nano-spacing-xl) on large screens, var(--nano-spacing-md) on small screens;
-   * @prop --pagination-button-color: The color of the pagination button. Defaults to var(--nano-color-neutral-400);
-   * @prop --pagination-button-active: Active color of the pagination button. Defaults to var(--nano-color-primary-1000);
+   * @prop --pagination-button-color: The color of the pagination button. Defaults to var(--nano-color-fill-neutral-weak);
+   * @prop --pagination-button-active: Active color of the pagination button. Defaults to var(--nano-color-fill-primary);
    */
   --bleed: 0px;
   --gap: var(--nano-spacing-xl);
-  --pagination-button-color: var(--nano-color-neutral-400);
-  --pagination-button-hover: var(--nano-color-primary-700);
-  --pagination-button-active: var(--nano-color-primary-1000);
+  --pagination-button-color: var(--nano-color-fill-neutral-weak);
+  --pagination-button-hover: var(--nano-color-border-accent-hover);
+  --pagination-button-active: var(--nano-color-fill-primary);
   --peek: calc(var(--bleed) / 2);
   --slide-width: calc((50% + (var(--gap) / 2)) - var(--peek));
   display: block;

package/dist/collection/components/checkbox/checkbox-group.css

@@ -39,17 +39,17 @@
   }/** Typography */
 :host {
   /**
-   * @prop --label-color: The color of the label text. Defaults to var(--nano-color-base-1000).
+   * @prop --label-color: The color of the label text. Defaults to var(--nano-color-surface-contrast).
    * @prop --label-font-size: The font size of the label text. Defaults to var(--nano-font-size-xs).
-   * @prop --invalid-msg-color: The color of the error message. Defaults to var(--nano-color-danger-1100).
-   * @prop --help-msg-color: The color of the help message. Defaults to var(--nano-color-base-1000).
+   * @prop --invalid-msg-color: The color of the error message. Defaults to var(--nano-color-fill-danger-hover).
+   * @prop --help-msg-color: The color of the help message. Defaults to var(--nano-color-surface-contrast).
    * @prop --more-font-size: The font size of the more information text (either help or error messaging). Defaults to var(--nano-font-size-2xs).
     * @prop --gap: The gap between checkboxes. Defaults to var(--nano-spacing-md).
    */
-  --label-color: var(--nano-color-base-1000);
+  --label-color: var(--nano-color-surface-contrast);
   --label-font-size: var(--nano-font-size-xs);
-  --invalid-msg-color: var(--nano-color-danger-1100);
-  --help-msg-color: var(--nano-color-base-1000);
+  --invalid-msg-color: var(--nano-color-fill-danger-hover);
+  --help-msg-color: var(--nano-color-surface-contrast);
   --more-font-size: var(--nano-font-size-2xs);
   --gap: var(--nano-spacing-md);
   display: block;

package/dist/collection/components/checkbox/checkbox.css

@@ -39,27 +39,27 @@
   }/** Typography */
 :host {
   /**
-   * @prop --border-color: Default control border color. Default var(--nano-color-primary-1000);
-   * @prop --label-color: Default label color. Default var(--nano-color-base-1000);
+   * @prop --border-color: Default control border color. Default var(--nano-color-fill-primary);
+   * @prop --label-color: Default label color. Default var(--nano-color-surface-contrast);
    * @prop --spacing: Spacing between label and control. Default var(--nano-spacing-sm);
-   * @prop --active-background: Control background when active. Default var(--nano-color-primary-1000);
+   * @prop --active-background: Control background when active. Default var(--nano-color-fill-primary);
    * @prop --active-foreground: Control foreground when active. Default var(--nano-color-basic-white);
-   * @prop --error-color: Error color. Default var(--nano-color-danger-1100);
-   * @prop --disabled-label-color: Label color when disabled. Default var(--nano-color-neutral-1000);
-   * @prop --disabled-background: Background color when disabled. Default var(--nano-color-neutral-300);
-   * @prop --disabled-foreground: Foreground color when disabled. Default var(--nano-color-neutral-700);
-   * @prop --disabled-border-color: Border color when disabled. Default var(--nano-color-neutral-1000);
+   * @prop --error-color: Error color. Default var(--nano-color-fill-danger-hover);
+   * @prop --disabled-label-color: Label color when disabled. Default var(--nano-color-fill-neutral);
+   * @prop --disabled-background: Background color when disabled. Default var(--nano-color-fill-neutral-weak);
+   * @prop --disabled-foreground: Foreground color when disabled. Default var(--nano-color-fill-neutral);
+   * @prop --disabled-border-color: Border color when disabled. Default var(--nano-color-fill-neutral);
    */
-  --border-color: var(--nano-color-primary-1000);
-  --label-color: var(--nano-color-base-1000);
+  --border-color: var(--nano-color-border-accent);
+  --label-color: var(--nano-color-text-default);
   --spacing: var(--nano-spacing-sm);
-  --active-background: var(--nano-color-primary-1000);
+  --active-background: var(--nano-color-fill-primary);
   --active-foreground: var(--nano-color-basic-white);
-  --error-color: var(--nano-color-danger-1100);
-  --disabled-label-color: var(--nano-color-neutral-1000);
-  --disabled-background: var(--nano-color-neutral-300);
-  --disabled-foreground: var(--nano-color-neutral-700);
-  --disabled-border-color: var(--nano-color-neutral-1000);
+  --error-color: var(--nano-color-fill-danger);
+  --disabled-label-color: var(--nano-color-text-disabled);
+  --disabled-background: var(--nano-color-fill-disabled);
+  --disabled-foreground: var(--nano-color-fill-neutral);
+  --disabled-border-color: var(--nano-color-border-disabled);
   display: inline-block;
   max-inline-size: 100%;
 }
@@ -260,13 +260,13 @@
   border: 1px solid var(--active-background);
 }
 :host(:first-of-type) .nanocb__segment .nanocb__label {
-  border-inline-end: 1px solid var(--nano-color-neutral-300);
+  border-inline-end: 1px solid var(--nano-color-fill-neutral-weak);
   border-start-start-radius: var(--nano-border-radius-pill);
   border-end-start-radius: var(--nano-border-radius-pill);
 }
 :host(:not(:last-of-type, :first-of-type)) .nanocb__segment .nanocb__label {
   border-inline-start: none;
-  border-inline-end: 1px solid var(--nano-color-neutral-300);
+  border-inline-end: 1px solid var(--nano-color-fill-neutral-weak);
 }
 :host(:last-of-type) .nanocb__segment .nanocb__label {
   border-inline-start: none;
@@ -306,16 +306,16 @@
   gap: 6px;
   padding: 8px;
   border: 1px solid var(--active-background);
-  color: var(--nano-color-primary-1100);
+  color: var(--nano-color-text-link);
   font-size: var(--nano-font-size-2xs);
   font-weight: bold;
   transition: background-color var(--nano-transition-x-fast) ease-out;
 }
 .nanocb__tag:hover {
-  background-color: var(--nano-color-primary-100);
+  background-color: var(--nano-color-fill-secondary-hover);
 }
 .nanocb__tag:has(input:checked) {
-  background-color: var(--nano-color-primary-300);
+  background-color: var(--nano-color-fill-secondary-pressed);
 }
 .nanocb__tag:has(input:focus-visible:focus) {
   outline: var(--nano-focus-ring);

package/dist/collection/components/collapsible-comparison/collapsible-comparison.css

@@ -38,14 +38,14 @@
     }
   }:host {
   /**
-  * @prop --color-bg - Background color of the component. Defaults to var(--nano-color-base-0).
-  * @prop --color-border - Border color of the component. Defaults to var(--nano-color-neutral-200).
+  * @prop --color-bg - Background color of the component. Defaults to var(--nano-color-background-default).
+  * @prop --color-border - Border color of the component. Defaults to var(--nano-color-surface-sunken).
   * @prop --outer-spacing - Horizontal padding of the component. Defaults to var(--nano-spacing-l1-default).
   */
 }
 :host .collapsible-comparison {
   background-color: var(--color-bg);
-  color: var(--nano-color-neutral-1400);
+  color: var(--nano-color-text-default);
   padding: var(--outer-spacing) 0;
   container-type: inline-size;
 }
@@ -68,7 +68,7 @@
     display: none;
   }
   :host nano-icon-button {
-    --color: var(--nano-color-primary-1100);
+    --color: var(--nano-color-icon-primary);
     display: block;
     margin-inline-start: auto;
     font-size: var(--nano-font-size-xl);

package/dist/collection/components/content-links/content-links.css

@@ -37,10 +37,10 @@
       scroll-behavior: auto !important;
     }
   }/**
-* @prop --text-color: The primary text and chevron colour. defaults to var(--nano-color-neutral-1400)
-* @prop --color-disabled: The disabled text and chevron colour. defaults to var(--nano-color-neutral-800)
-* @prop --color-border: The border colour. defaults to var(--nano-color-neutral-200)
-* @prop --color-active: The active text and chevron colour. defaults to var(--nano-color-primary-1000)
+* @prop --text-color: The primary text and chevron colour. defaults to var(--nano-color-text-default)
+* @prop --color-disabled: The disabled text and chevron colour. defaults to var(--nano-color-fill-neutral)
+* @prop --color-border: The border colour. defaults to var(--nano-color-surface-sunken)
+* @prop --color-active: The active text and chevron colour. defaults to var(--nano-color-fill-primary)
 * @prop --padding: The padding around the content link. defaults to var(--nano-spacing-sm)
 * @prop --icon-size: The size of the chevron icon. defaults to 1em
 */

package/dist/collection/components/cta/cta.js

@@ -48,13 +48,17 @@ export class NanoCta {
     static get properties() {
         return {
             "theme": {
-                "type": "string",
+                "type": "unknown",
                 "attribute": "theme",
                 "mutable": false,
                 "complexType": {
-                    "original": "Color",
-                    "resolved": "\"danger\" | \"neutral\" | \"primary\" | \"success\" | \"warning\"",
+                    "original": "Omit<'success' | 'warning', Color>",
+                    "resolved": "{ readonly [x: number]: string; [Symbol.iterator]: () => IterableIterator<string>; search: { (regexp: string | RegExp): number; (searcher: { [Symbol.search](string: string): number; }): number; }; replace: { (searchValue: string | RegExp, replaceValue: string): string; (searchValue: string | RegExp, replacer: (substring: string, ...args: any[]) => string): string; (searchValue: { [Symbol.replace](string: string, replaceValue: string): string; }, replaceValue: string): string; (searchValue: { [Symbol.replace](string: string, replacer: (substring: string, ...args: any[]) => string): string; }, replacer: (substring: string, ...args: any[]) => string): string; }; link: (url: string) => string; small: () => string; sub: () => string; sup: () => string; big: () => string; blink: () => string; strike: () => string; charAt: (pos: number) => string; charCodeAt: (index: number) => number; concat: (...strings: string[]) => string; indexOf: (searchString: string, position?: number) => number; lastIndexOf: (searchString: string, position?: number) => number; localeCompare: { (that: string): number; (that: string, locales?: string | string[], options?: CollatorOptions): number; (that: string, locales?: LocalesArgument, options?: CollatorOptions): number; }; match: { (regexp: string | RegExp): RegExpMatchArray; (matcher: { [Symbol.match](string: string): RegExpMatchArray; }): RegExpMatchArray; }; slice: (start?: number, end?: number) => string; split: { (separator: string | RegExp, limit?: number): string[]; (splitter: { [Symbol.split](string: string, limit?: number): string[]; }, limit?: number): string[]; }; substring: (start: number, end?: number) => string; toLowerCase: () => string; toLocaleLowerCase: { (locales?: string | string[]): string; (locales?: LocalesArgument): string; }; toUpperCase: () => string; toLocaleUpperCase: { (locales?: string | string[]): string; (locales?: LocalesArgument): string; }; trim: () => string; readonly length: number; substr: (from: number, length?: number) => string; codePointAt: (pos: number) => number; includes: (searchString: string, position?: number) => boolean; endsWith: (searchString: string, endPosition?: number) => boolean; normalize: { (form: \"NFC\" | \"NFD\" | \"NFKC\" | \"NFKD\"): string; (form?: string): string; }; repeat: (count: number) => string; startsWith: (searchString: string, position?: number) => boolean; anchor: (name: string) => string; bold: () => string; fixed: () => string; fontcolor: (color: string) => string; fontsize: { (size: number): string; (size: string): string; }; italics: () => string; padStart: (maxLength: number, fillString?: string) => string; padEnd: (maxLength: number, fillString?: string) => string; trimEnd: () => string; trimStart: () => string; trimLeft: () => string; trimRight: () => string; matchAll: (regexp: RegExp) => IterableIterator<RegExpExecArray>; replaceAll: { (searchValue: string | RegExp, replaceValue: string): string; (searchValue: string | RegExp, replacer: (substring: string, ...args: any[]) => string): string; }; at: (index: number) => string; toString: () => string; valueOf: () => string; }",
                     "references": {
+                        "Omit": {
+                            "location": "global",
+                            "id": "global::Omit"
+                        },
                         "Color": {
                             "location": "import",
                             "path": "../../types/shared",
@@ -69,8 +73,7 @@ export class NanoCta {
                     "text": "The semantic theme of the button. Defaults to primary / brand blue"
                 },
                 "getter": false,
-                "setter": false,
-                "reflect": true
+                "setter": false
             },
             "secondary": {
                 "type": "boolean",

package/dist/collection/components/data-table/table.css

@@ -39,25 +39,25 @@
   }.nano-data-table {
   /**
    * @prop --table-padding. The padding of the table cells. Defaults to `var(--table-compact-padding)`
-   * @prop --table-border-color. The border color of the table cells. Defaults to `var(--nano-color-neutral-200)`
-   * @prop --table-border-color-header. The border color of the table header and footer cells. Defaults to `var(--nano-color-primary-1000)`
-   * @prop --table-background. The background color of the table cells. Defaults to `var(--nano-color-base-0)`
+   * @prop --table-border-color. The border color of the table cells. Defaults to `var(--nano-color-surface-sunken)`
+   * @prop --table-border-color-header. The border color of the table header and footer cells. Defaults to `var(--nano-color-fill-primary)`
+   * @prop --table-background. The background color of the table cells. Defaults to `var(--nano-color-background-default)`
    * @prop --table-max-col-width. The maximum width of the table columns. Defaults to `clamp(200px, 500px, 50vw)`
-   * @prop --table-ordered-bg. The background color of the ordered table rows. Defaults to `var(--nano-color-neutral-100)`
+   * @prop --table-ordered-bg. The background color of the ordered table rows. Defaults to `var(--nano-color-surface-neutral)`
    * @prop --table-wrapper-max-height: maximum height of the table when table is scrollable. Defaults to 80vh;
    * @prop --table-wrapper-max-width: maximum width of the table when table is scrollable. Defaults to 100%;
    */
   --table-padding: var(--nano-spacing-sm) calc(var(--nano-spacing-md) - (var(--nano-spacing-md) / 3));
-  --table-border-color: var(--nano-color-neutral-200);
-  --table-border-color-header: var(--nano-color-primary-1000);
-  --table-background: var(--nano-color-base-0);
+  --table-border-color: var(--nano-color-border-default);
+  --table-border-color-header: var(--nano-color-border-default);
+  --table-background: var(--nano-color-background-default);
   --table-max-col-width: clamp(200px, 500px, 50vw);
-  --table-ordered-bg: var(--nano-color-neutral-100);
+  --table-ordered-bg: var(--nano-color-surface-subtle);
   --table-wrapper-max-height: 80vh;
   --table-wrapper-max-width: 100%;
   display: block;
   inline-size: 100%;
-  color: var(--nano-color-neutral-1400);
+  color: var(--nano-color-text-default);
   container-type: inline-size;
   --isLtR: 1;
 }
@@ -65,7 +65,7 @@
   --isLtR: -1;
 }
 .nano-data-table .nano-sortable__dragged {
-  background: var(--nano-color-base-0);
+  background: var(--nano-color-background-default);
   opacity: 0.9;
   box-shadow: var(--nano-shadow-l0);
   z-index: 10 !important;
@@ -113,7 +113,7 @@
 }
 .nano-tbl__ordered {
   background-color: var(--table-ordered-bg);
-  --table-border-color: var(--nano-color-neutral-300);
+  --table-border-color: var(--nano-color-border-default-strong);
 }
 .nano-tbl__order-btn {
   padding: 0;
@@ -171,7 +171,7 @@ thead .nano-tbl__td .nano-sortable__keyboard-handle, thead .nano-tbl__th .nano-s
 }
 .nano-tbl__td.nano-tbl__ordered, .nano-tbl__th.nano-tbl__ordered {
   background-color: var(--table-ordered-bg) !important;
-  --table-border-color: var(--nano-color-neutral-300);
+  --table-border-color: var(--nano-color-border-default-strong);
 }
 .nano-tbl__cell-content {
   overflow: hidden;