@solid-design-system/components 6.0.0-next.21 → 6.0.0-next.23

package/dist-versioned/chunks/{chunk.6CDLUXQ2.js → chunk.HSAMYW74.js}

@@ -13,7 +13,7 @@ import {
 import {
   SolidElement,
   customElement
-} from "./chunk.KXLUF5NH.js";
+} from "./chunk.H4SEXNBN.js";
 import {
   __decorateClass
 } from "./chunk.S3NI7NKU.js";
@@ -209,7 +209,7 @@ var SdTextarea = class extends SolidElement {
       textareaState === "disabled" || textareaState === "visuallyDisabled" ? "text-neutral-500" : "form-control-color-text",
       ["invalid", "activeInvalid"].includes(textareaState) && "form-control--invalid-color-background"
     )}"><textarea part="textarea" id="input" class="${cx(
-      "ps-4 flex-grow focus:outline-none bg-transparent placeholder:text-neutral-700 resize-none group-has-[sd-6-0-0-next-21-icon]:pe-8",
+      "ps-4 flex-grow focus:outline-none bg-transparent placeholder:text-neutral-700 resize-none group-has-[sd-6-0-0-next-23-icon]:pe-8",
       {
         sm: "py-1",
         md: "py-1",
@@ -217,7 +217,7 @@ var SdTextarea = class extends SolidElement {
       }[this.size],
       this.disabled && "cursor-not-allowed",
       textSize
-    )}" title="${this.title}" name="${ifDefined(this.name)}" .value="${live(this.value)}" ?disabled="${this.disabled}" ?readonly="${this.readonly}" ?required="${this.required}" ?visually-disabled="${this.visuallyDisabled}" placeholder="${ifDefined(this.placeholder)}" minlength="${ifDefined(this.minlength)}" maxlength="${ifDefined(this.maxlength)}" rows="${ifDefined(this.rows)}" autocapitalize="${ifDefined(this.autocapitalize)}" autocorrect="${ifDefined(this.autocorrect)}" ?autofocus="${this.autofocus}" spellcheck="${ifDefined(this.spellcheck)}" enterkeyhint="${ifDefined(this.enterkeyhint)}" inputmode="${ifDefined(this.inputmode)}" aria-describedby="help-text invalid-message" aria-invalid="${this.showInvalidStyle}" aria-disabled="${this.disabled || this.visuallyDisabled}" @change="${this.handleChange}" @input="${this.handleInput}" @invalid="${this.handleInvalid}" @focus="${this.handleFocus}" @blur="${this.handleBlur}"></textarea> ${this.showInvalidStyle ? html`<sd-6-0-0-next-21-icon class="${cx("text-error absolute right-4 pointer-events-none", iconSize)}" library="_internal" name="risk" part="invalid-icon"></sd-6-0-0-next-21-icon>` : ""} ${this.styleOnValid && this.showValidStyle ? html`<sd-6-0-0-next-21-icon class="${cx("text-success absolute right-4 pointer-events-none", iconSize)}" library="_internal" name="confirm-circle" part="valid-icon"></sd-6-0-0-next-21-icon>` : ""}</div></div><slot name="help-text" part="form-control-help-text" id="help-text" class="${cx("text-sm text-neutral-700 mt-1", hasHelpText && !this.showInvalidStyle ? "block" : "hidden")}" aria-hidden="${!hasHelpText || this.showInvalidStyle}">${this.helpText}</slot></div>${this.formControlController.renderInvalidMessage()}`;
+    )}" title="${this.title}" name="${ifDefined(this.name)}" .value="${live(this.value)}" ?disabled="${this.disabled}" ?readonly="${this.readonly}" ?required="${this.required}" ?visually-disabled="${this.visuallyDisabled}" placeholder="${ifDefined(this.placeholder)}" minlength="${ifDefined(this.minlength)}" maxlength="${ifDefined(this.maxlength)}" rows="${ifDefined(this.rows)}" autocapitalize="${ifDefined(this.autocapitalize)}" autocorrect="${ifDefined(this.autocorrect)}" ?autofocus="${this.autofocus}" spellcheck="${ifDefined(this.spellcheck)}" enterkeyhint="${ifDefined(this.enterkeyhint)}" inputmode="${ifDefined(this.inputmode)}" aria-describedby="help-text invalid-message" aria-invalid="${this.showInvalidStyle}" aria-disabled="${this.disabled || this.visuallyDisabled}" @change="${this.handleChange}" @input="${this.handleInput}" @invalid="${this.handleInvalid}" @focus="${this.handleFocus}" @blur="${this.handleBlur}"></textarea> ${this.showInvalidStyle ? html`<sd-6-0-0-next-23-icon class="${cx("text-error absolute right-4 pointer-events-none", iconSize)}" library="_internal" name="risk" part="invalid-icon"></sd-6-0-0-next-23-icon>` : ""} ${this.styleOnValid && this.showValidStyle ? html`<sd-6-0-0-next-23-icon class="${cx("text-success absolute right-4 pointer-events-none", iconSize)}" library="_internal" name="confirm-circle" part="valid-icon"></sd-6-0-0-next-23-icon>` : ""}</div></div><slot name="help-text" part="form-control-help-text" id="help-text" class="${cx("text-sm text-neutral-700 mt-1", hasHelpText && !this.showInvalidStyle ? "block" : "hidden")}" aria-hidden="${!hasHelpText || this.showInvalidStyle}">${this.helpText}</slot></div>${this.formControlController.renderInvalidMessage()}`;
   }
 };
 /**
@@ -332,7 +332,7 @@ __decorateClass([
   watch("value", { waitUntilFirstUpdate: true })
 ], SdTextarea.prototype, "handleValueChange", 1);
 SdTextarea = __decorateClass([
-  customElement("sd-6-0-0-next-21-textarea")
+  customElement("sd-6-0-0-next-23-textarea")
 ], SdTextarea);
 
 export {

package/dist-versioned/chunks/{chunk.JDH5QDD4.js → chunk.I2P23QTW.js}

@@ -10,7 +10,7 @@ import {
 import {
   SolidElement,
   customElement
-} from "./chunk.KXLUF5NH.js";
+} from "./chunk.H4SEXNBN.js";
 import {
   __decorateClass
 } from "./chunk.S3NI7NKU.js";
@@ -24,7 +24,7 @@ var SdTab = class extends SolidElement {
   constructor() {
     super(...arguments);
     this.attrId = ++id;
-    this.componentId = `sd-6-0-0-next-21-tab-${this.attrId}`;
+    this.componentId = `sd-6-0-0-next-23-tab-${this.attrId}`;
     this.hasSlotController = new HasSlotController(this, "left");
     this.localize = new LocalizeController(this);
     this.variant = "default";
@@ -73,7 +73,7 @@ var SdTab = class extends SolidElement {
     )}"></slot><slot class="${cx(this.disabled || this.visuallyDisabled ? "text-neutral-500" : "text-primary")}"></slot>${this.variant === "container" ? html`<div part="active-tab-indicator" class="${cx(
       "absolute bottom-0 h-1 bg-accent w-3/4 bottom-0 group-hover:w-[calc(100%-2px)] navigable__current-indicator-height navigable__current-indicator-border-radius"
     )}"></div>` : ""}<div part="hover-bottom-border" class="${cx(
-      !this.active && !this.disabled && "absolute bottom-0 left-0 w-full h-0.25 border-b sd-6-0-0-next-21-tab-color-border"
+      !this.active && !this.disabled && "absolute bottom-0 left-0 w-full h-0.25 border-b sd-6-0-0-next-23-tab-color-border"
     )}"></div></div></div>`;
   }
 };
@@ -110,7 +110,7 @@ __decorateClass([
   watch(["disabled", "visually-disabled"])
 ], SdTab.prototype, "handleDisabledChange", 1);
 SdTab = __decorateClass([
-  customElement("sd-6-0-0-next-21-tab")
+  customElement("sd-6-0-0-next-23-tab")
 ], SdTab);
 
 export {

package/dist-versioned/chunks/{chunk.O6OCDAKK.js → chunk.IAEDCKKK.js}

@@ -1,7 +1,7 @@
 import {
   SolidElement,
   customElement
-} from "./chunk.KXLUF5NH.js";
+} from "./chunk.H4SEXNBN.js";
 import {
   __decorateClass
 } from "./chunk.S3NI7NKU.js";
@@ -17,19 +17,19 @@ var SdButtonGroup = class extends SolidElement {
   }
   handleFocus(event) {
     const button = findButton(event.target);
-    button == null ? void 0 : button.classList.add("sd-6-0-0-next-21-button-group__button--focus");
+    button == null ? void 0 : button.classList.add("sd-6-0-0-next-23-button-group__button--focus");
   }
   handleBlur(event) {
     const button = findButton(event.target);
-    button == null ? void 0 : button.classList.remove("sd-6-0-0-next-21-button-group__button--focus");
+    button == null ? void 0 : button.classList.remove("sd-6-0-0-next-23-button-group__button--focus");
   }
   handleMouseOver(event) {
     const button = findButton(event.target);
-    button == null ? void 0 : button.classList.add("sd-6-0-0-next-21-button-group__button--hover");
+    button == null ? void 0 : button.classList.add("sd-6-0-0-next-23-button-group__button--hover");
   }
   handleMouseOut(event) {
     const button = findButton(event.target);
-    button == null ? void 0 : button.classList.remove("sd-6-0-0-next-21-button-group__button--hover");
+    button == null ? void 0 : button.classList.remove("sd-6-0-0-next-23-button-group__button--hover");
   }
   handleSlotChange() {
     const slottedElements = [...this.defaultSlot.assignedElements({ flatten: true })];
@@ -37,11 +37,11 @@ var SdButtonGroup = class extends SolidElement {
       const index = slottedElements.indexOf(el);
       const button = findButton(el);
       if (button !== null) {
-        button.classList.add("sd-6-0-0-next-21-button-group__button");
-        button.classList.toggle("sd-6-0-0-next-21-button-group__button--first", index === 0);
-        button.classList.toggle("sd-6-0-0-next-21-button-group__button--inner", index > 0 && index < slottedElements.length - 1);
-        button.classList.toggle("sd-6-0-0-next-21-button-group__button--last", index === slottedElements.length - 1);
-        button.classList.toggle("sd-6-0-0-next-21-button-group__button--radio", button.tagName.toLowerCase() === "sd-6-0-0-next-21-radio-button");
+        button.classList.add("sd-6-0-0-next-23-button-group__button");
+        button.classList.toggle("sd-6-0-0-next-23-button-group__button--first", index === 0);
+        button.classList.toggle("sd-6-0-0-next-23-button-group__button--inner", index > 0 && index < slottedElements.length - 1);
+        button.classList.toggle("sd-6-0-0-next-23-button-group__button--last", index === slottedElements.length - 1);
+        button.classList.toggle("sd-6-0-0-next-23-button-group__button--radio", button.tagName.toLowerCase() === "sd-6-0-0-next-23-radio-button");
       }
     });
   }
@@ -64,11 +64,11 @@ __decorateClass([
   property({ type: String, reflect: true })
 ], SdButtonGroup.prototype, "label", 2);
 SdButtonGroup = __decorateClass([
-  customElement("sd-6-0-0-next-21-button-group")
+  customElement("sd-6-0-0-next-23-button-group")
 ], SdButtonGroup);
 function findButton(el) {
   var _a;
-  const selector = "sd-6-0-0-next-21-button, sd-6-0-0-next-21-radio-button";
+  const selector = "sd-6-0-0-next-23-button, sd-6-0-0-next-23-radio-button";
   return (_a = el.closest(selector)) != null ? _a : el.querySelector(selector);
 }
 

package/dist-versioned/chunks/{chunk.ORYQ3FH3.js → chunk.IAEZIPFH.js}

@@ -4,7 +4,7 @@ import {
 import {
   SolidElement,
   customElement
-} from "./chunk.KXLUF5NH.js";
+} from "./chunk.H4SEXNBN.js";
 import {
   __decorateClass
 } from "./chunk.S3NI7NKU.js";
@@ -54,7 +54,7 @@ var SdHeader = class extends SolidElement {
     }
   }
   render() {
-    return html`<header class="w-full sd-6-0-0-next-21-header-color-background relative" role="banner"><div part="main" class="relative mx-auto my-0 box-border"><slot></slot></div></header>`;
+    return html`<header class="w-full sd-6-0-0-next-23-header-color-background relative" role="banner"><div part="main" class="relative mx-auto my-0 box-border"><slot></slot></div></header>`;
   }
 };
 SdHeader.styles = [
@@ -72,7 +72,7 @@ __decorateClass([
   debounce(100)
 ], SdHeader.prototype, "updateCalculatedHeight", 1);
 SdHeader = __decorateClass([
-  customElement("sd-6-0-0-next-21-header")
+  customElement("sd-6-0-0-next-23-header")
 ], SdHeader);
 
 export {

package/dist-versioned/chunks/{chunk.JCRS5M2Y.js → chunk.IL64EXT6.js}

@@ -1,7 +1,7 @@
 import {
   SolidElement,
   customElement
-} from "./chunk.KXLUF5NH.js";
+} from "./chunk.H4SEXNBN.js";
 import {
   __decorateClass
 } from "./chunk.S3NI7NKU.js";
@@ -22,9 +22,9 @@ var SdBadge = class extends SolidElement {
       "inline-flex items-center justify-center gap-x-[1px] text-center font-bold whitespace-nowrap border rounded-full select-none cursor-[inherit]",
       {
         /* variants */
-        blue: !this.inverted ? "text-white bg-primary-500 border-white" : "sd-6-0-0-next-21-badge--blue--inverted-color-text sd-6-0-0-next-21-badge--blue--inverted-color-background border-primary",
-        green: !this.inverted ? "text-white sd-6-0-0-next-21-badge--green-color-background border-white" : "sd-6-0-0-next-21-badge--green-color--inverted-text sd-6-0-0-next-21-badge--green-color--inverted-background border-primary",
-        red: !this.inverted ? "text-white sd-6-0-0-next-21-badge--red-color-background border-white" : "sd-6-0-0-next-21-badge--red--inverted-text sd-6-0-0-next-21-badge--red--inverted-background border-primary"
+        blue: !this.inverted ? "text-white bg-primary-500 border-white" : "sd-6-0-0-next-23-badge--blue--inverted-color-text sd-6-0-0-next-23-badge--blue--inverted-color-background sd-6-0-0-next-23-badge--inverted-color-border",
+        green: !this.inverted ? "text-white sd-6-0-0-next-23-badge--green-color-background border-white" : "sd-6-0-0-next-23-badge--green-color--inverted-text sd-6-0-0-next-23-badge--green-color--inverted-background sd-6-0-0-next-23-badge--inverted-color-border",
+        red: !this.inverted ? "text-white sd-6-0-0-next-23-badge--red-color-background border-white" : "sd-6-0-0-next-23-badge--red--inverted-text sd-6-0-0-next-23-badge--red--inverted-background sd-6-0-0-next-23-badge--inverted-color-border"
       }[this.variant]
     )}"><span id="content" part="content" class="${cx(this.size === "sm" && "sr-only")}"><slot></slot></span></span>`;
   }
@@ -44,7 +44,7 @@ __decorateClass([
   property({ type: Boolean, reflect: true })
 ], SdBadge.prototype, "inverted", 2);
 SdBadge = __decorateClass([
-  customElement("sd-6-0-0-next-21-badge")
+  customElement("sd-6-0-0-next-23-badge")
 ], SdBadge);
 
 export {

package/dist-versioned/chunks/{chunk.R7ITC7NT.js → chunk.JG3MCP7W.js}

@@ -17,7 +17,7 @@ import {
 import {
   SolidElement,
   customElement
-} from "./chunk.KXLUF5NH.js";
+} from "./chunk.H4SEXNBN.js";
 import {
   animateTo,
   parseDuration,
@@ -206,16 +206,16 @@ var SdTooltip = class extends SolidElement {
   render() {
     const isStart = this.placement.endsWith("-start");
     const isEnd = this.placement.endsWith("-end");
-    return html`<sd-6-0-0-next-21-popup part="base" exportparts="
+    return html`<sd-6-0-0-next-23-popup part="base" exportparts="
           popup:base__popup,
           arrow:base__arrow
-        " class="${cx(this.open && "tooltip--open")}" placement="${this.placement}" distance="10" skidding="${{ start: 2, end: -2, default: 0 }[isStart ? "start" : isEnd ? "end" : "default"] * (this.size === "sm" ? -1 : 1)}" strategy="${this.hoist ? "fixed" : "absolute"}" flip shift arrow auto-size="vertical" arrow-padding="0">${this.hasCustomTrigger ? html`<slot slot="anchor"></slot>` : html`<button slot="anchor" aria-describedby="tooltip" class="${cx("flex sd-interactive rounded-full", this.size === "lg" ? "text-xl" : "text-base")}" ?disabled="${this.disabled}" aria-expanded="${this.open}" aria-controls="tooltip"><sd-6-0-0-next-21-icon library="_internal" name="info-circle" label="Tooltip" class="${cx(this.disabled && "sd-interactive--disabled")}"></sd-6-0-0-next-21-icon></button>`}<slot name="content" part="body" id="tooltip" class="sd-6-0-0-next-21-tooltip-color-background sd-6-0-0-next-21-tooltip-color-text py-3 px-4 block rounded-none text-sm text-left" role="tooltip" aria-label="${this.content}" aria-live="${this.open ? "polite" : "off"}">${this.content}</slot></sd-6-0-0-next-21-popup>`;
+        " class="${cx(this.open && "tooltip--open")}" placement="${this.placement}" distance="10" skidding="${{ start: 2, end: -2, default: 0 }[isStart ? "start" : isEnd ? "end" : "default"] * (this.size === "sm" ? -1 : 1)}" strategy="${this.hoist ? "fixed" : "absolute"}" flip shift arrow auto-size="vertical" arrow-padding="0">${this.hasCustomTrigger ? html`<slot slot="anchor"></slot>` : html`<button slot="anchor" aria-describedby="tooltip" class="${cx("flex sd-interactive rounded-full", this.size === "lg" ? "text-xl" : "text-base")}" ?disabled="${this.disabled}" aria-expanded="${this.open}" aria-controls="tooltip"><sd-6-0-0-next-23-icon library="_internal" name="info-circle" label="Tooltip" class="${cx(this.disabled && "sd-interactive--disabled")}"></sd-6-0-0-next-23-icon></button>`}<slot name="content" part="body" id="tooltip" class="sd-6-0-0-next-23-tooltip-color-background sd-6-0-0-next-23-tooltip-color-text py-3 px-4 block rounded-none text-sm text-left" role="tooltip" aria-label="${this.content}" aria-live="${this.open ? "polite" : "off"}">${this.content}</slot></sd-6-0-0-next-23-popup>`;
   }
 };
 SdTooltip.styles = [
   ...SolidElement.styles,
   css`/*! tailwindcss v4.1.17 | MIT License | https://tailwindcss.com */@layer properties;@layer theme,base,components,utilities;
-:host{--hide-delay:0ms;--show-delay:150ms;display:contents}sd-6-0-0-next-21-popup{--arrow-color:rgba(var(--sd-tooltip-color-background));--arrow-size:10px}sd-6-0-0-next-21-popup::part(popup){pointer-events:none;z-index:10;--tw-shadow:var(--sd-shadow);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}sd-6-0-0-next-21-popup::part(arrow){--tw-shadow:var(--sd-shadow, 0px 1px 3px 0px rgb(81 81 81 / 75%));--tw-shadow-colored:0px 1px 3px 0px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}sd-6-0-0-next-21-popup[placement^=top]::part(popup){transform-origin:bottom}sd-6-0-0-next-21-popup[placement^=bottom]::part(popup){transform-origin:top}#tooltip{max-width:var(--max-width)}::slotted([slot=content]){overflow:auto;max-width:var(--auto-size-available-width)!important;max-height:var(--auto-size-available-height)!important}:host [slot=anchor]{color:rgba(var(--sd-form-control__tooltip-color-icon))}@property --tw-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-shadow-color{syntax:"*";inherits:false}@property --tw-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-inset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-shadow-color{syntax:"*";inherits:false}@property --tw-inset-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-ring-color{syntax:"*";inherits:false}@property --tw-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-ring-color{syntax:"*";inherits:false}@property --tw-inset-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-ring-inset{syntax:"*";inherits:false}@property --tw-ring-offset-width{syntax:"<length>";inherits:false;initial-value:0}@property --tw-ring-offset-color{syntax:"*";inherits:false;initial-value:#fff}@property --tw-ring-offset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}`
+:host{--hide-delay:0ms;--show-delay:150ms;display:contents}sd-6-0-0-next-23-popup{--arrow-color:rgba(var(--sd-tooltip-color-background));--arrow-size:10px}sd-6-0-0-next-23-popup::part(popup){pointer-events:none;z-index:10;--tw-shadow:var(--sd-shadow);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}sd-6-0-0-next-23-popup::part(arrow){--tw-shadow:var(--sd-shadow, 0px 1px 3px 0px rgb(81 81 81 / 75%));--tw-shadow-colored:0px 1px 3px 0px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}sd-6-0-0-next-23-popup[placement^=top]::part(popup){transform-origin:bottom}sd-6-0-0-next-23-popup[placement^=bottom]::part(popup){transform-origin:top}#tooltip{max-width:var(--max-width)}::slotted([slot=content]){overflow:auto;max-width:var(--auto-size-available-width)!important;max-height:var(--auto-size-available-height)!important}:host [slot=anchor]{color:rgba(var(--sd-form-control__tooltip-color-icon))}@property --tw-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-shadow-color{syntax:"*";inherits:false}@property --tw-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-inset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-shadow-color{syntax:"*";inherits:false}@property --tw-inset-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-ring-color{syntax:"*";inherits:false}@property --tw-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-ring-color{syntax:"*";inherits:false}@property --tw-inset-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-ring-inset{syntax:"*";inherits:false}@property --tw-ring-offset-width{syntax:"<length>";inherits:false;initial-value:0}@property --tw-ring-offset-color{syntax:"*";inherits:false;initial-value:#fff}@property --tw-ring-offset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}`
 ];
 __decorateClass([
   query("slot:not([name])")
@@ -224,7 +224,7 @@ __decorateClass([
   query("#tooltip")
 ], SdTooltip.prototype, "body", 2);
 __decorateClass([
-  query("sd-6-0-0-next-21-popup")
+  query("sd-6-0-0-next-23-popup")
 ], SdTooltip.prototype, "popup", 2);
 __decorateClass([
   property({ type: String, reflect: true })
@@ -257,7 +257,7 @@ __decorateClass([
   watch("disabled")
 ], SdTooltip.prototype, "handleDisabledChange", 1);
 SdTooltip = __decorateClass([
-  customElement("sd-6-0-0-next-21-tooltip")
+  customElement("sd-6-0-0-next-23-tooltip")
 ], SdTooltip);
 setDefaultAnimation("tooltip.show", {
   keyframes: [{ opacity: 0 }, { opacity: 1 }],

package/dist-versioned/chunks/{chunk.RGKPJPQL.js → chunk.K4Z3IEUN.js}

@@ -21,7 +21,7 @@ import {
 import {
   SolidElement,
   customElement
-} from "./chunk.KXLUF5NH.js";
+} from "./chunk.H4SEXNBN.js";
 import {
   animateTo,
   stopAnimations
@@ -97,7 +97,7 @@ var SdDropdown = class extends SolidElement {
    * within the slotted trigger. This could be the slotted element itself, a child of the slotted element,
    * or an element within the slotted elements shadow root.
    *
-   * e.g. the accessible trigger of an <sd-6-0-0-next-21-button> is a <button> located inside its shadow root.
+   * e.g. the accessible trigger of an <sd-6-0-0-next-23-button> is a <button> located inside its shadow root.
    *
    * To determine this, we assume the first tabbable element in the trigger slot is the "accessible trigger."
    * */
@@ -108,11 +108,11 @@ var SdDropdown = class extends SolidElement {
     if (accessibleTrigger) {
       switch (accessibleTrigger.tagName.toLowerCase()) {
         // Solid buttons have to update the internal button so it's announced correctly by screen readers
-        case "sd-6-0-0-next-21-button":
-        case "sd-6-0-0-next-21-icon-button":
+        case "sd-6-0-0-next-23-button":
+        case "sd-6-0-0-next-23-icon-button":
           target = accessibleTrigger.button;
           break;
-        case "sd-6-0-0-next-21-navigation-item":
+        case "sd-6-0-0-next-23-navigation-item":
           target = accessibleTrigger.button;
           break;
         default:
@@ -136,7 +136,7 @@ var SdDropdown = class extends SolidElement {
     }
   }
   getMenu() {
-    return this.panel.assignedElements({ flatten: true }).find((el) => el.tagName.toLowerCase() === "sd-6-0-0-next-21-menu");
+    return this.panel.assignedElements({ flatten: true }).find((el) => el.tagName.toLowerCase() === "sd-6-0-0-next-23-menu");
   }
   handleKeyDown(event) {
     if (this.open && event.key === "Escape") {
@@ -148,7 +148,7 @@ var SdDropdown = class extends SolidElement {
   handleDocumentKeyDown(event) {
     var _a;
     if (event.key === "Tab") {
-      if (this.open && ((_a = document.activeElement) == null ? void 0 : _a.tagName.toLowerCase()) === "sd-6-0-0-next-21-menu-item") {
+      if (this.open && ((_a = document.activeElement) == null ? void 0 : _a.tagName.toLowerCase()) === "sd-6-0-0-next-23-menu-item") {
         event.preventDefault();
         this.hide();
         this.focusOnTrigger();
@@ -174,7 +174,7 @@ var SdDropdown = class extends SolidElement {
   }
   handlePanelSelect(event) {
     const target = event.target;
-    if (!this.stayOpenOnSelect && target.tagName.toLowerCase() === "sd-6-0-0-next-21-menu") {
+    if (!this.stayOpenOnSelect && target.tagName.toLowerCase() === "sd-6-0-0-next-23-menu") {
       this.hide();
       this.focusOnTrigger();
     }
@@ -256,7 +256,7 @@ var SdDropdown = class extends SolidElement {
   }
   addOpenListeners() {
     this.panel.addEventListener("sd-activate", this.handleMenuItemActivate);
-    this.panel.addEventListener("sd-6-0-0-next-21-select", this.handlePanelSelect);
+    this.panel.addEventListener("sd-6-0-0-next-23-select", this.handlePanelSelect);
     this.panel.addEventListener("keydown", this.handleKeyDown);
     document.addEventListener("keydown", this.handleDocumentKeyDown);
     document.addEventListener("mousedown", this.handleDocumentMouseDown);
@@ -264,7 +264,7 @@ var SdDropdown = class extends SolidElement {
   removeOpenListeners() {
     if (this.panel) {
       this.panel.removeEventListener("sd-activate", this.handleMenuItemActivate);
-      this.panel.removeEventListener("sd-6-0-0-next-21-select", this.handlePanelSelect);
+      this.panel.removeEventListener("sd-6-0-0-next-23-select", this.handlePanelSelect);
       this.panel.removeEventListener("keydown", this.handleKeyDown);
     }
     document.removeEventListener("keydown", this.handleDocumentKeyDown);
@@ -297,13 +297,13 @@ var SdDropdown = class extends SolidElement {
     }
   }
   render() {
-    return html`<sd-6-0-0-next-21-popup part="base" id="dropdown" exportparts="
+    return html`<sd-6-0-0-next-23-popup part="base" id="dropdown" exportparts="
           popup:base__popup,
         " placement="${this.placement}" distance="${this.rounded && this.distance < 1 ? 1 : this.distance}" skidding="${this.skidding}" strategy="${this.hoist ? "fixed" : "absolute"}" ?flip="${!this.noFlip}" shift auto-size="vertical" auto-size-padding="10"><slot name="trigger" slot="anchor" part="trigger" class="block" @click="${this.handleTriggerClick}" @keydown="${this.handleTriggerKeyDown}" @keyup="${this.handleTriggerKeyUp}" @slotchange="${this.handleTriggerSlotChange}"></slot><slot part="panel" class="${cx(
       "panel-color-border border shadow bg-white block",
       this.open ? "pointer-events-auto" : "pointer-events-none",
       this.rounded && "rounded-md"
-    )}" aria-hidden="${this.open ? "false" : "true"}" aria-labelledby="dropdown"></slot></sd-6-0-0-next-21-popup>`;
+    )}" aria-hidden="${this.open ? "false" : "true"}" aria-labelledby="dropdown"></slot></sd-6-0-0-next-23-popup>`;
   }
 };
 SdDropdown.styles = [
@@ -357,7 +357,7 @@ __decorateClass([
   watch("open", { waitUntilFirstUpdate: true })
 ], SdDropdown.prototype, "handleOpenChange", 1);
 SdDropdown = __decorateClass([
-  customElement("sd-6-0-0-next-21-dropdown")
+  customElement("sd-6-0-0-next-23-dropdown")
 ], SdDropdown);
 setDefaultAnimation("dropdown.show", {
   keyframes: [{ opacity: 0 }, { opacity: 1 }],

package/dist-versioned/chunks/chunk.KEJFWGZI.js

@@ -48,7 +48,7 @@ var SubmenuController = class {
       if (event.target === this.host) {
         event.preventDefault();
         event.stopPropagation();
-      } else if (event.target instanceof Element && (event.target.tagName === "sd-6-0-0-next-21-menu-item" || ((_a = event.target.role) == null ? void 0 : _a.startsWith("menuitem")))) {
+      } else if (event.target instanceof Element && (event.target.tagName === "sd-6-0-0-next-23-menu-item" || ((_a = event.target.role) == null ? void 0 : _a.startsWith("menuitem")))) {
         const type = event.target.getAttribute("type");
         if (type !== "checkbox") {
           this.disableSubmenu();
@@ -69,7 +69,7 @@ var SubmenuController = class {
     // Set the safe triangle values for the submenu when the position changes
     this.handlePopupReposition = () => {
       const submenuSlot = this.host.renderRoot.querySelector("slot[name='submenu']");
-      const menu = submenuSlot == null ? void 0 : submenuSlot.assignedElements({ flatten: true }).filter((el) => el.localName === "sd-6-0-0-next-21-menu")[0];
+      const menu = submenuSlot == null ? void 0 : submenuSlot.assignedElements({ flatten: true }).filter((el) => el.localName === "sd-6-0-0-next-23-menu")[0];
       const isRtl = getComputedStyle(this.host).direction === "rtl";
       if (!menu) {
         return;
@@ -141,7 +141,7 @@ var SubmenuController = class {
     }
     let menuItems = null;
     for (const elt of submenuSlot.assignedElements()) {
-      menuItems = elt.querySelectorAll("sd-6-0-0-next-21-menu-item, [role^='menuitem']");
+      menuItems = elt.querySelectorAll("sd-6-0-0-next-23-menu-item, [role^='menuitem']");
       if (menuItems.length !== 0) {
         break;
       }
@@ -220,7 +220,7 @@ var SubmenuController = class {
     if (!this.isConnected) {
       return html`<slot name="submenu" hidden></slot>`;
     }
-    return html`<sd-6-0-0-next-21-popup ${ref(this.popupRef)} placement="${isRtl ? "left-start" : "right-start"}" anchor="anchor" flip flip-fallback-strategy="best-fit" skidding="${this.skidding}" strategy="fixed" auto-size="vertical" auto-size-padding="10"><slot name="submenu"></slot></sd-6-0-0-next-21-popup>`;
+    return html`<sd-6-0-0-next-23-popup ${ref(this.popupRef)} placement="${isRtl ? "left-start" : "right-start"}" anchor="anchor" flip flip-fallback-strategy="best-fit" skidding="${this.skidding}" strategy="fixed" auto-size="vertical" auto-size-padding="10"><slot name="submenu"></slot></sd-6-0-0-next-23-popup>`;
   }
 };
 

package/dist-versioned/chunks/{chunk.QCQ7A7DT.js → chunk.KZU2A6M6.js}

@@ -7,7 +7,7 @@ import {
 import {
   SolidElement,
   customElement
-} from "./chunk.KXLUF5NH.js";
+} from "./chunk.H4SEXNBN.js";
 import {
   Wave
 } from "./chunk.POFWU6ZT.js";
@@ -300,19 +300,19 @@ var SdAudio = class extends SolidElement {
     )}" part="audio-controls"><button class="${cx(
       "playback-speed justify-self-start text-base font-bold hover:cursor-pointer sd-interactive",
       this.inverted && "sd-interactive--inverted"
-    )}" aria-label="${this.localize.term("playbackSpeed")} (${this.speed}x)" @click="${this.togglePlaybackSpeed}" @keydown="${this.togglePlaybackSpeedKeydown}" part="playback-speed">${this.speed}x</button><sd-6-0-0-next-21-button ?inverted="${this.inverted ? true : false}" part="play-button" size="lg" @click="${!this.isPlaying ? this.playAudio : this.pauseAudio}" aria-label="${this.isPlaying ? this.localize.term("pauseAudio") : this.localize.term("playAudio")}" title="${this.isPlaying ? this.localize.term("pauseAudio") : this.localize.term("playAudio")}" class="mb-4">${this.isPlaying ? html`<slot name="pause-icon"><sd-6-0-0-next-21-icon class="text-xl" name="pause" library="_internal"></sd-6-0-0-next-21-icon></slot>` : html`<slot name="play-icon"><sd-6-0-0-next-21-icon class="text-xl" name="start" library="_internal"></sd-6-0-0-next-21-icon></slot>`}</sd-6-0-0-next-21-button><div class="flex items-center gap-6 justify-self-end">${this.hasSlotController.test("transcript") ? html`<button class="${cx("w-6 h-6 hover:cursor-pointer sd-interactive", this.inverted && "sd-interactive--inverted")}" aria-label="${this.isTranscriptOpen ? this.localize.term("transcriptIsOpen") : this.localize.term("openTranscript")}" @click="${this.showTranscript}" @keydown="${this.showTranscriptKeydown}" part="transcript"><sd-6-0-0-next-21-icon class="w-6 h-6" name="transcript" library="_internal"></sd-6-0-0-next-21-icon></button>` : null} <button class="${cx("w-6 h-6 hover:cursor-pointer sd-interactive", this.inverted && "sd-interactive--inverted")}" part="volume" aria-label="${!this.isMuted ? this.localize.term("mute") : this.localize.term("unmute")}" @click="${this.toggleMute}" @keydown="${this.toggleMuteKeydown}"><sd-6-0-0-next-21-icon class="w-6 h-6" name="${this.isMuted ? "mute" : "volume"}" library="_internal"></sd-6-0-0-next-21-icon></button></div></div>`;
+    )}" aria-label="${this.localize.term("playbackSpeed")} (${this.speed}x)" @click="${this.togglePlaybackSpeed}" @keydown="${this.togglePlaybackSpeedKeydown}" part="playback-speed">${this.speed}x</button><sd-6-0-0-next-23-button ?inverted="${this.inverted ? true : false}" part="play-button" size="lg" @click="${!this.isPlaying ? this.playAudio : this.pauseAudio}" aria-label="${this.isPlaying ? this.localize.term("pauseAudio") : this.localize.term("playAudio")}" title="${this.isPlaying ? this.localize.term("pauseAudio") : this.localize.term("playAudio")}" class="mb-4">${this.isPlaying ? html`<slot name="pause-icon"><sd-6-0-0-next-23-icon class="text-xl" name="pause" library="_internal"></sd-6-0-0-next-23-icon></slot>` : html`<slot name="play-icon"><sd-6-0-0-next-23-icon class="text-xl" name="start" library="_internal"></sd-6-0-0-next-23-icon></slot>`}</sd-6-0-0-next-23-button><div class="flex items-center gap-6 justify-self-end">${this.hasSlotController.test("transcript") ? html`<button class="${cx("w-6 h-6 hover:cursor-pointer sd-interactive", this.inverted && "sd-interactive--inverted")}" aria-label="${this.isTranscriptOpen ? this.localize.term("transcriptIsOpen") : this.localize.term("openTranscript")}" @click="${this.showTranscript}" @keydown="${this.showTranscriptKeydown}" part="transcript"><sd-6-0-0-next-23-icon class="w-6 h-6" name="transcript" library="_internal"></sd-6-0-0-next-23-icon></button>` : null} <button class="${cx("w-6 h-6 hover:cursor-pointer sd-interactive", this.inverted && "sd-interactive--inverted")}" part="volume" aria-label="${!this.isMuted ? this.localize.term("mute") : this.localize.term("unmute")}" @click="${this.toggleMute}" @keydown="${this.toggleMuteKeydown}"><sd-6-0-0-next-23-icon class="w-6 h-6" name="${this.isMuted ? "mute" : "volume"}" library="_internal"></sd-6-0-0-next-23-icon></button></div></div>`;
     const renderTimestamps = html`<div class="${cx(
       "w-full flex justify-between",
       this.reversedLayout ? "mb-0.5" : "mt-0.5",
       this.animated && this.reversedLayout && "absolute bottom-0 left-0 !mb-4"
-    )}" part="timestamps"><div class="${cx("current-time text-sm", this.inverted ? "text-primary-400" : "sd-6-0-0-next-21-audio__timestamp-color-text")}">${this.currentTime}</div><div class="${cx("current-time text-sm", this.inverted ? "text-primary-400" : "sd-6-0-0-next-21-audio__timestamp-color-text")}">${this.duration}</div></div>`;
-    return html`<div class="${cx("w-full flex relative", this.reversedLayout ? "flex-col-reverse" : "flex-col")}" aria-label="${this.localize.term("audioPlayer")}" part="audio-player"><slot @slotchange="${this.updateAudioDuration}"></slot>${!this.animated || this.animated && this.reversedLayout ? renderAudioControls : null}<div class="relative">${this.animated && !this.reversedLayout ? html`${renderAudioControls}` : null} ${this.animated ? html`<canvas class="w-full h-16 -mb-2"></canvas>` : null} ${!this.hideTimestamps && this.animated && this.reversedLayout ? renderTimestamps : null}<sd-6-0-0-next-21-range part="progress-slider" tooltip="hidden" min="0" max="100" step="0.001" label="${this.localize.term("seekBar")}" @mousedown="${this.handleThumbGrab}" @touchstart="${this.handleThumbGrab}" @mouseup="${this.handleThumbRelease}" @touchend="${this.handleThumbRelease}" @sd-6-0-0-next-21-input="${this.handleAudioProgress}" @keydown="${this.handleAudioProgressKeydown}"></sd-6-0-0-next-21-range></div>${this.hasSlotController.test("transcript") ? html`<sd-6-0-0-next-21-drawer><slot name="transcript"></slot></sd-6-0-0-next-21-drawer>` : null} ${!this.hideTimestamps && (!this.animated || !this.reversedLayout) ? renderTimestamps : null}</div><sd-6-0-0-next-21-theme-listener></sd-6-0-0-next-21-theme-listener>`;
+    )}" part="timestamps"><div class="${cx("current-time text-sm", this.inverted ? "text-primary-400" : "sd-6-0-0-next-23-audio__timestamp-color-text")}">${this.currentTime}</div><div class="${cx("current-time text-sm", this.inverted ? "text-primary-400" : "sd-6-0-0-next-23-audio__timestamp-color-text")}">${this.duration}</div></div>`;
+    return html`<div class="${cx("w-full flex relative", this.reversedLayout ? "flex-col-reverse" : "flex-col")}" aria-label="${this.localize.term("audioPlayer")}" part="audio-player"><slot @slotchange="${this.updateAudioDuration}"></slot>${!this.animated || this.animated && this.reversedLayout ? renderAudioControls : null}<div class="relative">${this.animated && !this.reversedLayout ? html`${renderAudioControls}` : null} ${this.animated ? html`<canvas class="w-full h-16 -mb-2"></canvas>` : null} ${!this.hideTimestamps && this.animated && this.reversedLayout ? renderTimestamps : null}<sd-6-0-0-next-23-range part="progress-slider" tooltip="hidden" min="0" max="100" step="0.001" label="${this.localize.term("seekBar")}" @mousedown="${this.handleThumbGrab}" @touchstart="${this.handleThumbGrab}" @mouseup="${this.handleThumbRelease}" @touchend="${this.handleThumbRelease}" @sd-6-0-0-next-23-input="${this.handleAudioProgress}" @keydown="${this.handleAudioProgressKeydown}"></sd-6-0-0-next-23-range></div>${this.hasSlotController.test("transcript") ? html`<sd-6-0-0-next-23-drawer><slot name="transcript"></slot></sd-6-0-0-next-23-drawer>` : null} ${!this.hideTimestamps && (!this.animated || !this.reversedLayout) ? renderTimestamps : null}</div><sd-6-0-0-next-23-theme-listener></sd-6-0-0-next-23-theme-listener>`;
   }
 };
 SdAudio.styles = [
   ...SolidElement.styles,
   css`/*! tailwindcss v4.1.17 | MIT License | https://tailwindcss.com */@layer theme,base,components,utilities;
-sd-6-0-0-next-21-button::part(base){display:flex;height:var(--sd-spacing-12);width:var(--sd-spacing-12);align-items:center;justify-content:center;border-radius:var(--sd-radius-full)}sd-6-0-0-next-21-button::part(motion-wrapper){border-radius:var(--sd-radius-full)}sd-6-0-0-next-21-button::part(label){display:flex;flex-grow:0;align-items:center}sd-6-0-0-next-21-range::part(form-control-label){display:none}:host([inverted]) sd-6-0-0-next-21-range::part(thumb){outline-color:var(--color-white,#fff);background-color:rgba(var(--sd-color-border-white,rgba(var(--sd-color-white))))}:host([animated]) sd-6-0-0-next-21-range::part(track){background-color:transparent}:host([inverted]:not([animated])) sd-6-0-0-next-21-range::part(track){background-color:rgba(var(--sd-color-border-primary-400,rgba(var(--sd-color-primary-400))))}:host([inverted]:not([animated])) sd-6-0-0-next-21-range::part(active-track){background-color:rgba(var(--sd-color-border-white,rgba(var(--sd-color-white))))}`
+sd-6-0-0-next-23-button::part(base){display:flex;height:var(--sd-spacing-12);width:var(--sd-spacing-12);align-items:center;justify-content:center;border-radius:var(--sd-radius-full)}sd-6-0-0-next-23-button::part(motion-wrapper){border-radius:var(--sd-radius-full)}sd-6-0-0-next-23-button::part(label){display:flex;flex-grow:0;align-items:center}sd-6-0-0-next-23-range::part(form-control-label){display:none}:host([inverted]) sd-6-0-0-next-23-range::part(thumb){outline-color:var(--color-white,#fff);background-color:rgba(var(--sd-color-border-white,rgba(var(--sd-color-white))))}:host([animated]) sd-6-0-0-next-23-range::part(track){background-color:transparent}:host([inverted]:not([animated])) sd-6-0-0-next-23-range::part(track){background-color:rgba(var(--sd-color-border-primary-400,rgba(var(--sd-color-primary-400))))}:host([inverted]:not([animated])) sd-6-0-0-next-23-range::part(active-track){background-color:rgba(var(--sd-color-border-white,rgba(var(--sd-color-white))))}`
 ];
 __decorateClass([
   property({ type: Boolean, reflect: true, attribute: "reversed-layout" })
@@ -354,13 +354,13 @@ __decorateClass([
   query('[part="audio-player"]')
 ], SdAudio.prototype, "audioPlayerContainer", 2);
 __decorateClass([
-  query("sd-6-0-0-next-21-drawer")
+  query("sd-6-0-0-next-23-drawer")
 ], SdAudio.prototype, "drawer", 2);
 __decorateClass([
   query("canvas")
 ], SdAudio.prototype, "canvas", 2);
 SdAudio = __decorateClass([
-  customElement("sd-6-0-0-next-21-audio")
+  customElement("sd-6-0-0-next-23-audio")
 ], SdAudio);
 
 export {

package/dist-versioned/chunks/{chunk.S2ESC563.js → chunk.LMWUXHPK.js}

@@ -7,7 +7,7 @@ import {
 import {
   SolidElement,
   customElement
-} from "./chunk.KXLUF5NH.js";
+} from "./chunk.H4SEXNBN.js";
 import {
   __decorateClass
 } from "./chunk.S3NI7NKU.js";
@@ -92,8 +92,8 @@ var SdOption = class extends SolidElement {
       !this.disabled && this.hasHover ? "h-full top-0" : "top-1"
     )}"></span> ${this.checkbox ? html`<span id="control" part="control ${this.selected ? " control--checked" : "control--unchecked"}" class="${cx(
       "relative flex flex-shrink-0 items-center justify-center border rounded-sm h-4 w-4 mr-2",
-      this.disabled ? "border-neutral-500" : this.selected ? "bg-accent border-accent" : "bg-white form-control-color-border"
-    )}">${this.selected ? html`<sd-6-0-0-next-21-icon part="checked-icon" class="text-white w-3 h-3" library="_internal" name="status-check"></sd-6-0-0-next-21-icon>` : ""}</span>` : ""} ${slots["left"] ? html`<slot name="left" part="left" class="inline-flex mr-2"></slot>` : ""}<slot part="label" class="inline-block flex-grow" @slotchange="${this.handleDefaultSlotChange}"></slot>${slots["right"] ? html`<slot name="right" part="right" class="inline-flex ml-2"></slot>` : ""}</div>`;
+      this.disabled ? "sd-6-0-0-next-23-option--disabled-color-border" : this.selected ? "bg-accent border-accent" : "bg-white form-control-color-border"
+    )}">${this.selected ? html`<sd-6-0-0-next-23-icon part="checked-icon" class="text-white w-3 h-3" library="_internal" name="status-check"></sd-6-0-0-next-23-icon>` : ""}</span>` : ""} ${slots["left"] ? html`<slot name="left" part="left" class="inline-flex mr-2"></slot>` : ""}<slot part="label" class="inline-block flex-grow" @slotchange="${this.handleDefaultSlotChange}"></slot>${slots["right"] ? html`<slot name="right" part="right" class="inline-flex ml-2"></slot>` : ""}</div>`;
   }
 };
 /**
@@ -141,7 +141,7 @@ __decorateClass([
   watch("value")
 ], SdOption.prototype, "handleValueChange", 1);
 SdOption = __decorateClass([
-  customElement("sd-6-0-0-next-21-option")
+  customElement("sd-6-0-0-next-23-option")
 ], SdOption);
 
 export {