@solid-design-system/components 6.22.2 → 6.24.0

package/dist-versioned/chunks/chunk.344DLODX.js

@@ -0,0 +1,66 @@
+// src/components/icon/library.multi-theming.ts
+var themeMap = {
+  "ui-light": "union-investment",
+  "ui-dark": "union-investment",
+  vb: "vb",
+  bb: "bbbank",
+  kid: "kidstarter"
+};
+function getTheme(element) {
+  if (element) {
+    const cssTheme = getComputedStyle(element).getPropertyValue("--sd-theme").trim().replace(/['"]/g, "");
+    return themeMap[cssTheme];
+  }
+  return null;
+}
+var multiThemingLibrary = {
+  name: "sd-multi-theming",
+  resolver: (name, element) => {
+    const theme = getTheme(element);
+    if (!theme) return "";
+    const path = name.split("/");
+    const finalPath = `${theme}/${name}`;
+    if (path[0] === "content" || path[0] === "system") {
+      name = finalPath;
+    }
+    return `https://celum-icons.fe.union-investment.de/${name}.svg`;
+  },
+  mutator: (svg) => {
+    const recoloredElements = {
+      currentColorFills: [],
+      currentColorStrokes: [],
+      greenFills: [],
+      greenStrokes: []
+    };
+    const currentColors = ["#00358e", "#002d67", "#005ca9", "#051530"];
+    const greenColor = ["#2d9d00", "#f35e01"];
+    recoloredElements["currentColorFills"] = svg.querySelectorAll(
+      currentColors.map((color) => `[fill="${color}" i]`).join(", ")
+    );
+    recoloredElements["currentColorStrokes"] = svg.querySelectorAll(
+      currentColors.map((color) => `[stroke="${color}" i]`).join(", ")
+    );
+    recoloredElements["greenFills"] = svg.querySelectorAll(greenColor.map((color) => `[fill="${color}" i]`).join(", "));
+    recoloredElements["greenStrokes"] = svg.querySelectorAll(
+      greenColor.map((color) => `[stroke="${color}" i]`).join(", ")
+    );
+    recoloredElements.currentColorFills.forEach((filledElement) => {
+      filledElement.setAttribute("fill", "currentColor");
+    });
+    recoloredElements.currentColorStrokes.forEach((strokedElement) => {
+      strokedElement.setAttribute("stroke", "currentColor");
+    });
+    recoloredElements.greenFills.forEach((filledElement) => {
+      filledElement.setAttribute("fill", "rgb(var(--sd-color-icon-fill-accent, 45 157 0))");
+    });
+    recoloredElements.greenStrokes.forEach((strokedElement) => {
+      strokedElement.setAttribute("stroke", "rgb(var(--sd-color-icon-fill-accent, 45 157 0))");
+    });
+    return svg;
+  }
+};
+var library_multi_theming_default = multiThemingLibrary;
+
+export {
+  library_multi_theming_default
+};

package/dist-versioned/chunks/{chunk.7IP6W4VD.js → chunk.4F4N3QQ6.js}

@@ -1,7 +1,7 @@
 import {
   SolidElement,
   customElement
-} from "./chunk.BSWNMA5L.js";
+} from "./chunk.BVWAKEFC.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  sd-6-22-2-badge--blue-color-background border-white" : "sd-6-22-2-badge--blue--inverted-color-text sd-6-22-2-badge--blue--inverted-color-background sd-6-22-2-badge--inverted-color-border",
-        green: !this.inverted ? "text-white sd-6-22-2-badge--green-color-background border-white" : "sd-6-22-2-badge--green-color--inverted-text sd-6-22-2-badge--green-color--inverted-background sd-6-22-2-badge--inverted-color-border",
-        red: !this.inverted ? "text-white sd-6-22-2-badge--red-color-background border-white" : "sd-6-22-2-badge--red--inverted-text sd-6-22-2-badge--red--inverted-background sd-6-22-2-badge--inverted-color-border"
+        blue: !this.inverted ? "text-white  sd-6-24-0-badge--blue-color-background border-white" : "sd-6-24-0-badge--blue--inverted-color-text sd-6-24-0-badge--blue--inverted-color-background sd-6-24-0-badge--inverted-color-border",
+        green: !this.inverted ? "text-white sd-6-24-0-badge--green-color-background border-white" : "sd-6-24-0-badge--green-color--inverted-text sd-6-24-0-badge--green-color--inverted-background sd-6-24-0-badge--inverted-color-border",
+        red: !this.inverted ? "text-white sd-6-24-0-badge--red-color-background border-white" : "sd-6-24-0-badge--red--inverted-text sd-6-24-0-badge--red--inverted-background sd-6-24-0-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-22-2-badge")
+  customElement("sd-6-24-0-badge")
 ], SdBadge);
 
 export {

package/dist-versioned/chunks/{chunk.V24CSPXQ.js → chunk.4QZT4Y6W.js}

@@ -4,7 +4,7 @@ import {
 import {
   SolidElement,
   customElement
-} from "./chunk.BSWNMA5L.js";
+} from "./chunk.BVWAKEFC.js";
 import {
   __decorateClass
 } from "./chunk.S3NI7NKU.js";
@@ -113,7 +113,7 @@ var SdMenu = class extends SolidElement {
   }
   isMenuItem(item) {
     var _a;
-    return item.tagName.toLowerCase() === "sd-6-22-2-menu-item" || ["menuitem", "menuitemcheckbox", "menuitemradio"].includes((_a = item.getAttribute("role")) != null ? _a : "");
+    return item.tagName.toLowerCase() === "sd-6-24-0-menu-item" || ["menuitem", "menuitemcheckbox", "menuitemradio"].includes((_a = item.getAttribute("role")) != null ? _a : "");
   }
   /** @internal Gets all slotted menu items, ignoring dividers, headers, and other elements. */
   getAllItems() {
@@ -148,13 +148,13 @@ var SdMenu = class extends SolidElement {
 SdMenu.styles = [
   ...SolidElement.styles,
   css`/*! tailwindcss v4.3.0 | MIT License | https://tailwindcss.com */@layer properties;@layer theme,base,components,utilities;
-:host{position:relative;display:block;overflow:auto;overscroll-behavior:auto;border-radius:var(--sd-radius-md);padding-inline:var(--sd-spacing-2);padding-block:var(--sd-spacing-3);--tw-shadow:var(--sd-shadow)!important;box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)!important}::slotted(sd-6-22-2-divider){padding-block:var(--sd-spacing-3)}@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{position:relative;display:block;overflow:auto;overscroll-behavior:auto;border-radius:var(--sd-radius-md);padding-inline:var(--sd-spacing-2);padding-block:var(--sd-spacing-3);--tw-shadow:var(--sd-shadow)!important;box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)!important}::slotted(sd-6-24-0-divider){padding-block:var(--sd-spacing-3)}@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")
 ], SdMenu.prototype, "defaultSlot", 2);
 SdMenu = __decorateClass([
-  customElement("sd-6-22-2-menu")
+  customElement("sd-6-24-0-menu")
 ], SdMenu);
 
 export {

package/dist-versioned/chunks/{chunk.YEVNQB6X.js → chunk.4SNDWIKF.js}

@@ -2,7 +2,7 @@ import {
   getIconLibrary,
   unwatchIcon,
   watchIcon
-} from "./chunk.2S2PIDCO.js";
+} from "./chunk.CGVEBTVR.js";
 import {
   requestIcon
 } from "./chunk.P52GZVKG.js";
@@ -12,7 +12,7 @@ import {
 import {
   SolidElement,
   customElement
-} from "./chunk.BSWNMA5L.js";
+} from "./chunk.BVWAKEFC.js";
 import {
   __decorateClass
 } from "./chunk.S3NI7NKU.js";
@@ -47,7 +47,7 @@ var SdIcon = class extends SolidElement {
   getUrl() {
     const library = getIconLibrary(this.library);
     if (this.name && library) {
-      if (library.name === "_internal") {
+      if (library.name === "_internal" || library.name === "sd-multi-theming") {
         return library.resolver(this.name, this);
       }
       return library.resolver(this.name);
@@ -100,7 +100,7 @@ var SdIcon = class extends SolidElement {
     }
   }
   render() {
-    return html`<sd-6-22-2-theme-listener></sd-6-22-2-theme-listener>${unsafeSVG(this.svg)}`;
+    return html`<sd-6-24-0-theme-listener></sd-6-24-0-theme-listener>${unsafeSVG(this.svg)}`;
   }
 };
 SdIcon.styles = [
@@ -133,7 +133,7 @@ __decorateClass([
   watch(["name", "src", "library"])
 ], SdIcon.prototype, "setIcon", 1);
 SdIcon = __decorateClass([
-  customElement("sd-6-22-2-icon")
+  customElement("sd-6-24-0-icon")
 ], SdIcon);
 
 export {

package/dist-versioned/chunks/{chunk.6VQYIPKX.js → chunk.5OP2MB2L.js}

@@ -1,6 +1,6 @@
 import {
   SdRadio
-} from "./chunk.QQO73GC3.js";
+} from "./chunk.JB2XZ4FY.js";
 import {
   FormControlController,
   customErrorValidityState,
@@ -16,7 +16,7 @@ import {
 import {
   SolidElement,
   customElement
-} from "./chunk.BSWNMA5L.js";
+} from "./chunk.BVWAKEFC.js";
 import {
   __decorateClass
 } from "./chunk.S3NI7NKU.js";
@@ -88,14 +88,14 @@ var SdRadioGroup = class extends SolidElement {
     }
   }
   getAllRadios() {
-    const radios = [...this.querySelectorAll("sd-6-22-2-radio, sd-6-22-2-radio-button")];
+    const radios = [...this.querySelectorAll("sd-6-24-0-radio, sd-6-24-0-radio-button")];
     if (radios.length === 0) {
       console.warn("No radios found in the radio group.");
     }
     return radios;
   }
   handleRadioClick(event) {
-    const target = event.target.closest("sd-6-22-2-radio, sd-6-22-2-radio-button");
+    const target = event.target.closest("sd-6-24-0-radio, sd-6-24-0-radio-button");
     const oldValue = this.value;
     const radios = this.getAllRadios();
     if (radios.length === 0) {
@@ -185,7 +185,7 @@ var SdRadioGroup = class extends SolidElement {
         }
       })
     );
-    this.hasButtonGroup = radios.some((radio) => radio.tagName.toLowerCase() === "sd-6-22-2-radio-button");
+    this.hasButtonGroup = radios.some((radio) => radio.tagName.toLowerCase() === "sd-6-24-0-radio-button");
     if (!radios.some((radio) => radio.checked)) {
       if (this.hasButtonGroup) {
         const buttonRadio = (_a = radios[0].shadowRoot) == null ? void 0 : _a.querySelector("button");
@@ -197,26 +197,26 @@ var SdRadioGroup = class extends SolidElement {
       }
     }
     if (this.hasButtonGroup) {
-      const buttonGroup = (_b = this.shadowRoot) == null ? void 0 : _b.querySelector("sd-6-22-2-button-group");
+      const buttonGroup = (_b = this.shadowRoot) == null ? void 0 : _b.querySelector("sd-6-24-0-button-group");
       if (buttonGroup) {
         buttonGroup.disableRole = true;
       }
     }
   }
   syncRadios() {
-    if (customElements.get("sd-6-22-2-radio") && customElements.get("sd-6-22-2-radio-button")) {
+    if (customElements.get("sd-6-24-0-radio") && customElements.get("sd-6-24-0-radio-button")) {
       this.syncRadioElements();
       return;
     }
-    if (customElements.get("sd-6-22-2-radio")) {
+    if (customElements.get("sd-6-24-0-radio")) {
       this.syncRadioElements();
     } else {
-      customElements.whenDefined("sd-6-22-2-radio").then(() => this.syncRadios());
+      customElements.whenDefined("sd-6-24-0-radio").then(() => this.syncRadios());
     }
-    if (customElements.get("sd-6-22-2-radio-button")) {
+    if (customElements.get("sd-6-24-0-radio-button")) {
       this.syncRadioElements();
     } else {
-      customElements.whenDefined("sd-6-22-2-radio-button").then(() => this.syncRadios());
+      customElements.whenDefined("sd-6-24-0-radio-button").then(() => this.syncRadios());
     }
   }
   updateCheckedRadio() {
@@ -294,7 +294,7 @@ var SdRadioGroup = class extends SolidElement {
         vertical: "flex-col",
         horizontal: "flex-row"
       }[this.orientation]
-    )}"><div class="sr-only"><label><input id="validation-input" type="text" ?required="${this.required}" aria-labelledby="label" tabindex="-1" hidden @invalid="${this.handleInvalid}"></label></div>${this.hasButtonGroup ? html`<sd-6-22-2-button-group class="border border-primary sd-6-22-2-radio-button-group-border-radius sd-6-22-2-radio-button-group-border-width sd-6-22-2-radio-button-group-padding" part="button-group" exportparts="base:button-group__base" role="presentation">${defaultSlot}</sd-6-22-2-button-group>` : defaultSlot}</div></fieldset><slot name="help-text" part="form-control-help-text" id="help-text" class="${cx("text-sm text-neutral-700 mt-2", hasHelpText ? "block" : "hidden")}" aria-hidden="${!hasHelpText}">${this.helpText}</slot><div part="invalid-icon-message" class="flex items-center gap-2 mt-2">${this.showInvalidStyle ? html`<sd-6-22-2-icon part="invalid-icon" class="${cx("text-error")}" library="_internal" name="risk"></sd-6-22-2-icon>` : ""} ${this.formControlController.renderInvalidMessage(this.size)}</div>`;
+    )}"><div class="sr-only"><label><input id="validation-input" type="text" ?required="${this.required}" aria-labelledby="label" tabindex="-1" hidden @invalid="${this.handleInvalid}"></label></div>${this.hasButtonGroup ? html`<sd-6-24-0-button-group class="border border-primary sd-6-24-0-radio-button-group-border-radius sd-6-24-0-radio-button-group-border-width sd-6-24-0-radio-button-group-padding" part="button-group" exportparts="base:button-group__base" role="presentation">${defaultSlot}</sd-6-24-0-button-group>` : defaultSlot}</div></fieldset><slot name="help-text" part="form-control-help-text" id="help-text" class="${cx("text-sm text-neutral-700 mt-2", hasHelpText ? "block" : "hidden")}" aria-hidden="${!hasHelpText}">${this.helpText}</slot><div part="invalid-icon-message" class="flex items-center gap-2 mt-2">${this.showInvalidStyle ? html`<sd-6-24-0-icon part="invalid-icon" class="${cx("text-error")}" library="_internal" name="risk"></sd-6-24-0-icon>` : ""} ${this.formControlController.renderInvalidMessage(this.size)}</div>`;
   }
 };
 /**
@@ -303,7 +303,7 @@ var SdRadioGroup = class extends SolidElement {
 SdRadioGroup.styles = [
   ...SolidElement.styles,
   css`/*! tailwindcss v4.3.0 | MIT License | https://tailwindcss.com */@layer theme,base,components,utilities;
-:host{display:block}:host([orientation=vertical]) ::slotted(sd-6-22-2-radio){margin-bottom:var(--sd-spacing-2);display:flex}:host([orientation=vertical]) ::slotted(sd-6-22-2-radio:last-of-type){margin-bottom:calc(var(--sd-spacing-1) * 0)}:host([orientation=horizontal]) ::slotted(sd-6-22-2-radio){margin-right:var(--sd-spacing-6)}:host([orientation=horizontal]) ::slotted(sd-6-22-2-radio:last-of-type){margin-right:calc(var(--sd-spacing-1) * 0)}:host([orientation=horizontal]):host([size=sm]) ::slotted(sd-6-22-2-radio){margin-right:var(--sd-spacing-4)}:host([orientation=horizontal]):host([size=sm]) ::slotted(sd-6-22-2-radio:last-of-type){margin-right:calc(var(--sd-spacing-1) * 0)}:host([required]) #label::after{content:' *'}:host:has(sd-6-22-2-button-group){display:inline-flex}`
+:host{display:block}:host([orientation=vertical]) ::slotted(sd-6-24-0-radio){margin-bottom:var(--sd-spacing-2);display:flex}:host([orientation=vertical]) ::slotted(sd-6-24-0-radio:last-of-type){margin-bottom:calc(var(--sd-spacing-1) * 0)}:host([orientation=horizontal]) ::slotted(sd-6-24-0-radio){margin-right:var(--sd-spacing-6)}:host([orientation=horizontal]) ::slotted(sd-6-24-0-radio:last-of-type){margin-right:calc(var(--sd-spacing-1) * 0)}:host([orientation=horizontal]):host([size=sm]) ::slotted(sd-6-24-0-radio){margin-right:var(--sd-spacing-4)}:host([orientation=horizontal]):host([size=sm]) ::slotted(sd-6-24-0-radio:last-of-type){margin-right:calc(var(--sd-spacing-1) * 0)}:host([required]) #label::after{content:' *'}:host:has(sd-6-24-0-button-group){display:inline-flex}`
 ];
 __decorateClass([
   query("slot:not([name])")
@@ -357,7 +357,7 @@ __decorateClass([
   watch("value")
 ], SdRadioGroup.prototype, "handleValueChange", 1);
 SdRadioGroup = __decorateClass([
-  customElement("sd-6-22-2-radio-group")
+  customElement("sd-6-24-0-radio-group")
 ], SdRadioGroup);
 
 export {

package/dist-versioned/chunks/{chunk.TSMFJY5S.js → chunk.5XP6OIKT.js}

@@ -1,13 +1,13 @@
 import {
   SdAccordion
-} from "./chunk.MF5HKQBF.js";
+} from "./chunk.TEHKQWUZ.js";
 import {
   setDefaultAnimation
 } from "./chunk.N4LHE3QK.js";
 import {
   SolidElement,
   customElement
-} from "./chunk.BSWNMA5L.js";
+} from "./chunk.BVWAKEFC.js";
 import {
   __decorateClass
 } from "./chunk.S3NI7NKU.js";
@@ -31,12 +31,12 @@ var SdQuickfact = class extends SdAccordion {
       this.expandable && "cursor-pointer select-none"
     )}" role="${ifDefined(this.expandable ? "button" : void 0)}" aria-expanded="${ifDefined(this.expandable ? this.open ? "true" : "false" : void 0)}" aria-controls="${ifDefined(this.expandable ? "content" : void 0)}" tabindex="${this.expandable ? "0" : "-1"}" @click="${this.expandable ? this.handleSummaryClick : null}" @keydown="${this.expandable ? this.handleSummaryKeyDown : null}"><div part="icon" class="${cx("flex flex-grow-0 flex-shrink-0 flex-auto items-center", !this.expandable && "cursor-default")}"><slot name="icon"></slot></div><slot name="summary" part="summary" class="${cx(
       "flex flex-auto items-start text-left text-base leading-normal font-normal sm:leading-tight sm:text-3xl sm:text-center",
-      this.expandable ? "sd-6-22-2-quickfact--expandable-color-text" : "text-black cursor-default"
+      this.expandable ? "sd-6-24-0-quickfact--expandable-color-text" : "text-black cursor-default"
     )}">${this.summary}</slot><span part="summary-icon" class="${cx(
       "flex flex-grow-0 flex-shrink-0 flex-auto self-start sm:self-center transition-transform ease-in-out duration-medium text-xl sm:mt-2",
       this.open && "rotate-180",
       !this.expandable && "hidden"
-    )}"><slot name="expand-icon" class="${cx(this.open && "hidden")}"><sd-6-22-2-icon library="_internal" name="chevron-down" class="group-hover:text-primary-500 transition-colors ease-in-out duration-medium"></sd-6-22-2-icon></slot><slot name="collapse-icon" class="${cx(!this.open && "hidden")}"><sd-6-22-2-icon library="_internal" name="chevron-down" class="group-hover:text-primary-500 transition-colors ease-in-out duration-medium"></sd-6-22-2-icon></slot></span></${header}><div part="content" id="content" class="${cx("overflow-hidden", !this.expandable && "hidden")}"><slot part="content__slot" class="block" role="region" aria-labelledby="header"></slot></div></${base}>`;
+    )}"><slot name="expand-icon" class="${cx(this.open && "hidden")}"><sd-6-24-0-icon library="_internal" name="chevron-down" class="group-hover:text-primary-500 transition-colors ease-in-out duration-medium"></sd-6-24-0-icon></slot><slot name="collapse-icon" class="${cx(!this.open && "hidden")}"><sd-6-24-0-icon library="_internal" name="chevron-down" class="group-hover:text-primary-500 transition-colors ease-in-out duration-medium"></sd-6-24-0-icon></slot></span></${header}><div part="content" id="content" class="${cx("overflow-hidden", !this.expandable && "hidden")}"><slot part="content__slot" class="block" role="region" aria-labelledby="header"></slot></div></${base}>`;
   }
 };
 SdQuickfact.styles = [
@@ -48,7 +48,7 @@ __decorateClass([
   property({ type: Boolean, reflect: true })
 ], SdQuickfact.prototype, "expandable", 2);
 SdQuickfact = __decorateClass([
-  customElement("sd-6-22-2-quickfact")
+  customElement("sd-6-24-0-quickfact")
 ], SdQuickfact);
 setDefaultAnimation("quickfact.show", {
   keyframes: [{ height: "0" }, { height: "auto" }],

package/dist-versioned/chunks/{chunk.6PLFHNPQ.js → chunk.6DDIBH76.js}

@@ -10,7 +10,7 @@ import {
 import {
   SolidElement,
   customElement
-} from "./chunk.BSWNMA5L.js";
+} from "./chunk.BVWAKEFC.js";
 import {
   __decorateClass,
   __spreadValues
@@ -37,8 +37,8 @@ var SdTabGroup = class extends SolidElement {
   }
   connectedCallback() {
     const whenAllDefined = Promise.all([
-      customElements.whenDefined("sd-6-22-2-tab"),
-      customElements.whenDefined("sd-6-22-2-tab-panel")
+      customElements.whenDefined("sd-6-24-0-tab"),
+      customElements.whenDefined("sd-6-24-0-tab-panel")
     ]);
     super.connectedCallback();
     this.resizeObserver = new ResizeObserver(() => {
@@ -86,20 +86,20 @@ var SdTabGroup = class extends SolidElement {
   }
   getAllTabs(options = { includeDisabled: true }) {
     const slot = this.shadowRoot.querySelector('slot[name="nav"]');
-    return Array.from(slot.assignedElements()).map((el) => el.tagName.toLocaleLowerCase() === "sd-6-22-2-tab" ? el : el.querySelector("sd-6-22-2-tab")).filter((el) => {
-      return el && options.includeDisabled ? el.tagName.toLowerCase() === "sd-6-22-2-tab" : el.tagName.toLowerCase() === "sd-6-22-2-tab" && !el.disabled;
+    return Array.from(slot.assignedElements()).map((el) => el.tagName.toLocaleLowerCase() === "sd-6-24-0-tab" ? el : el.querySelector("sd-6-24-0-tab")).filter((el) => {
+      return el && options.includeDisabled ? el.tagName.toLowerCase() === "sd-6-24-0-tab" : el.tagName.toLowerCase() === "sd-6-24-0-tab" && !el.disabled;
     });
   }
   getAllPanels() {
-    return [...this.body.assignedElements()].filter((el) => el.tagName.toLowerCase() === "sd-6-22-2-tab-panel");
+    return [...this.body.assignedElements()].filter((el) => el.tagName.toLowerCase() === "sd-6-24-0-tab-panel");
   }
   getActiveTab() {
     return this.tabs.find((t) => t.matches(":focus"));
   }
   handleClick(event) {
     const target = event.target;
-    const tab = target.closest("sd-6-22-2-tab");
-    const tabGroup = tab == null ? void 0 : tab.closest("sd-6-22-2-tab-group");
+    const tab = target.closest("sd-6-24-0-tab");
+    const tabGroup = tab == null ? void 0 : tab.closest("sd-6-24-0-tab-group");
     if (tabGroup !== this) {
       return;
     }
@@ -109,8 +109,8 @@ var SdTabGroup = class extends SolidElement {
   }
   handleKeyDown(event) {
     const target = event.target;
-    const tab = target.closest("sd-6-22-2-tab");
-    const tabGroup = tab == null ? void 0 : tab.closest("sd-6-22-2-tab-group");
+    const tab = target.closest("sd-6-24-0-tab");
+    const tabGroup = tab == null ? void 0 : tab.closest("sd-6-24-0-tab-group");
     if (tabGroup !== this) {
       return;
     }
@@ -137,7 +137,7 @@ var SdTabGroup = class extends SolidElement {
     if (["ArrowLeft", "ArrowRight", "ArrowUp", "ArrowDown", "Home", "End"].includes(event.key)) {
       const activeEl = this.tabs.find((t) => t.matches(":focus"));
       const isRtl = this.localize.dir() === "rtl";
-      if ((activeEl == null ? void 0 : activeEl.tagName.toLowerCase()) === "sd-6-22-2-tab") {
+      if ((activeEl == null ? void 0 : activeEl.tagName.toLowerCase()) === "sd-6-24-0-tab") {
         let index = this.tabs.indexOf(activeEl);
         if (event.key === "Home") {
           index = 0;
@@ -258,16 +258,16 @@ var SdTabGroup = class extends SolidElement {
     return html`<div part="base" class="${cx("flex flex-col rounded-none")}" @click="${this.handleClick}" @keydown="${this.handleKeyDown}"><div part="nav" class="${cx(this.hasScrollControls && "relative py-0 px-12")}">${this.hasScrollControls ? html`<button part="scroll-button--start" exportparts="base:scroll-button__base" tabindex="-1" aria-hidden="true" disabled="${ifDefined(!this.canScroll.left || void 0)}" class="${cx(
       "sd-interactive flex items-center justify-center absolute top-0 bottom-0 left-0 !outline-offset-0 border-b border-neutral-400 z-10",
       this.localize.dir() === "rtl" && "left-auto right-0"
-    )}" @click="${this.handleScrollToStart}"><sd-6-22-2-icon library="_internal" name="${isRtl ? "chevron-up" : "chevron-down"}" label="previous" class="${cx("h-6 w-12 rotate-90 grid place-items-center")}"></sd-6-22-2-icon></button>` : ""}<div part="scroll-container" class="flex overflow-x-auto focus-visible:focus-outline !outline-offset-0"><div part="tabs" class="${cx("flex flex-auto relative flex-row")}" role="tablist">${((_a = this.activeTab) == null ? void 0 : _a.variant) !== "container" ? html`<div part="active-tab-indicator" id="indicator" class="absolute h-1 bg-accent bottom-0 transition-[transform,width] duration-medium ease-in-out z-30 navigable__current-indicator-height navigable__current-indicator-border-radius"></div>` : ""}<div part="separation" class="border-neutral-400 absolute w-full h-0.25 bottom-0 border-b z-10"></div><slot name="nav" @slotchange="${this.syncTabsAndPanels}"></slot></div></div>${this.hasScrollControls ? html`<button part="scroll-button--end" exportparts="base:scroll-button__base" tabindex="-1" aria-hidden="true" disabled="${ifDefined(!this.canScroll.right || void 0)}" class="${cx(
+    )}" @click="${this.handleScrollToStart}"><sd-6-24-0-icon library="_internal" name="${isRtl ? "chevron-up" : "chevron-down"}" label="previous" class="${cx("h-6 w-12 rotate-90 grid place-items-center")}"></sd-6-24-0-icon></button>` : ""}<div part="scroll-container" class="flex overflow-x-auto focus-visible:focus-outline !outline-offset-0"><div part="tabs" class="${cx("flex flex-auto relative flex-row")}" role="tablist">${((_a = this.activeTab) == null ? void 0 : _a.variant) !== "container" ? html`<div part="active-tab-indicator" id="indicator" class="absolute h-1 bg-accent bottom-0 transition-[transform,width] duration-medium ease-in-out z-30 navigable__current-indicator-height navigable__current-indicator-border-radius"></div>` : ""}<div part="separation" class="border-neutral-400 absolute w-full h-0.25 bottom-0 border-b z-10"></div><slot name="nav" @slotchange="${this.syncTabsAndPanels}"></slot></div></div>${this.hasScrollControls ? html`<button part="scroll-button--end" exportparts="base:scroll-button__base" tabindex="-1" aria-hidden="true" disabled="${ifDefined(!this.canScroll.right || void 0)}" class="${cx(
       "sd-interactive flex items-center justify-center absolute top-0 bottom-0 right-0 !outline-offset-0 border-b border-neutral-400 z-10",
       this.localize.dir() === "rtl" && "right-auto left-0"
-    )}" @click="${this.handleScrollToEnd}"><sd-6-22-2-icon library="_internal" name="${isRtl ? "chevron-down" : "chevron-up"}" label="next" class="${cx("h-6 w-12 rotate-90 grid place-items-center")}"></sd-6-22-2-icon></button>` : ""}</div><slot part="body" class="${cx("block auto py-8 px-6", this.variant === "container" && "border border-neutral-400 border-t-0")}" @slotchange="${this.syncTabsAndPanels}"></slot></div>`;
+    )}" @click="${this.handleScrollToEnd}"><sd-6-24-0-icon library="_internal" name="${isRtl ? "chevron-down" : "chevron-up"}" label="next" class="${cx("h-6 w-12 rotate-90 grid place-items-center")}"></sd-6-24-0-icon></button>` : ""}</div><slot part="body" class="${cx("block auto py-8 px-6", this.variant === "container" && "border border-neutral-400 border-t-0")}" @slotchange="${this.syncTabsAndPanels}"></slot></div>`;
   }
 };
 SdTabGroup.styles = [
   ...SolidElement.styles,
   css`/*! tailwindcss v4.3.0 | MIT License | https://tailwindcss.com */@layer theme,base,components,utilities;
-:host{box-sizing:border-box;display:block}[part=scroll-container]{scrollbar-width:none}[part=scroll-container]::-webkit-scrollbar{height:calc(var(--sd-spacing-1) * 0);width:calc(var(--sd-spacing-1) * 0)}::slotted(sd-6-22-2-tab-panel){--padding:1rem 0}::slotted(sd-6-22-2-tab-panel:focus-visible){outline-style:solid;outline-offset:2px;outline-width:2px;outline-color:var(--outline-color-primary)}`
+:host{box-sizing:border-box;display:block}[part=scroll-container]{scrollbar-width:none}[part=scroll-container]::-webkit-scrollbar{height:calc(var(--sd-spacing-1) * 0);width:calc(var(--sd-spacing-1) * 0)}::slotted(sd-6-24-0-tab-panel){--padding:1rem 0}::slotted(sd-6-24-0-tab-panel:focus-visible){outline-style:solid;outline-offset:2px;outline-width:2px;outline-color:var(--outline-color-primary)}`
 ];
 __decorateClass([
   query("[part=base]")
@@ -300,7 +300,7 @@ __decorateClass([
   debounce(20)
 ], SdTabGroup.prototype, "handleScroll", 1);
 SdTabGroup = __decorateClass([
-  customElement("sd-6-22-2-tab-group")
+  customElement("sd-6-24-0-tab-group")
 ], SdTabGroup);
 
 export {

package/dist-versioned/chunks/{chunk.YPHYPOLZ.js → chunk.6MMNEOUE.js}

@@ -4,7 +4,7 @@ import {
 import {
   SolidElement,
   customElement
-} from "./chunk.BSWNMA5L.js";
+} from "./chunk.BVWAKEFC.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-22-2-header-color-background sd-6-22-2-header-padding-bottom 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-24-0-header-color-background sd-6-24-0-header-padding-bottom 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-22-2-header")
+  customElement("sd-6-24-0-header")
 ], SdHeader);
 
 export {

package/dist-versioned/chunks/{chunk.ZM6NVRGV.js → chunk.6V7SKGRY.js}

@@ -7,7 +7,7 @@ import {
 import {
   SolidElement,
   customElement
-} from "./chunk.BSWNMA5L.js";
+} from "./chunk.BVWAKEFC.js";
 import {
   __decorateClass
 } from "./chunk.S3NI7NKU.js";
@@ -25,11 +25,11 @@ var SdOptgroup = class extends SolidElement {
     this.label = "";
   }
   /**
-   * Syncs the disabled prop for all slotted sd-6-22-2-options when it is triggered
+   * Syncs the disabled prop for all slotted sd-6-24-0-options when it is triggered
    */
   handleDisableOptions() {
     const { disabled } = this;
-    this.defaultSlot.assignedElements().filter((opt) => opt.tagName.toLowerCase() === "sd-6-22-2-option").forEach((opt) => {
+    this.defaultSlot.assignedElements().filter((opt) => opt.tagName.toLowerCase() === "sd-6-24-0-option").forEach((opt) => {
       opt.disabled = disabled;
     });
   }
@@ -38,7 +38,7 @@ var SdOptgroup = class extends SolidElement {
   }
   render() {
     const { disabled } = this;
-    return html`<div role="${disabled ? "presentation" : "group"}" class="${cx(this.disabled ? "text-neutral-500" : "")}" part="base" aria-labelledby="group-label"><sd-6-22-2-divider id="divider" class="pt-2 pb-4" part="divider"></sd-6-22-2-divider><div part="label-container" class="${cx(this.disabled ? "text-neutral-500" : "text-black")} px-4 font-bold text-left" role="presentation" id="group-label"><slot name="label"><span>${this.label}</span></slot></div><div role="listbox" part="options" aria-label="${this.localize.term("optionGroup")}"><slot @slotchange="${this.handleDisableOptions}"></slot></div></div>`;
+    return html`<div role="${disabled ? "presentation" : "group"}" class="${cx(this.disabled ? "text-neutral-500" : "")}" part="base" aria-labelledby="group-label"><sd-6-24-0-divider id="divider" class="pt-2 pb-4" part="divider"></sd-6-24-0-divider><div part="label-container" class="${cx(this.disabled ? "text-neutral-500" : "text-black")} px-4 font-bold text-left" role="presentation" id="group-label"><slot name="label"><span>${this.label}</span></slot></div><div role="listbox" part="options" aria-label="${this.localize.term("optionGroup")}"><slot @slotchange="${this.handleDisableOptions}"></slot></div></div>`;
   }
 };
 SdOptgroup.styles = [
@@ -59,7 +59,7 @@ __decorateClass([
   watch("disabled", { waitUntilFirstUpdate: true })
 ], SdOptgroup.prototype, "handleDisabledChange", 1);
 SdOptgroup = __decorateClass([
-  customElement("sd-6-22-2-optgroup")
+  customElement("sd-6-24-0-optgroup")
 ], SdOptgroup);
 
 export {

package/dist-versioned/chunks/{chunk.DN2GTRKZ.js → chunk.AIG5N2FZ.js}

@@ -4,7 +4,7 @@ import {
 import {
   SolidElement,
   customElement
-} from "./chunk.BSWNMA5L.js";
+} from "./chunk.BVWAKEFC.js";
 import {
   __decorateClass
 } from "./chunk.S3NI7NKU.js";
@@ -42,7 +42,7 @@ __decorateClass([
   property({ type: String, reflect: true })
 ], SdSpinner.prototype, "color", 2);
 SdSpinner = __decorateClass([
-  customElement("sd-6-22-2-spinner")
+  customElement("sd-6-24-0-spinner")
 ], SdSpinner);
 
 export {

package/dist-versioned/chunks/{chunk.YXKB3TBZ.js → chunk.AXZSMHWW.js}

@@ -11,7 +11,7 @@ import {
 import {
   SolidElement,
   customElement
-} from "./chunk.BSWNMA5L.js";
+} from "./chunk.BVWAKEFC.js";
 import {
   __decorateClass
 } from "./chunk.S3NI7NKU.js";
@@ -102,18 +102,18 @@ var SdMenuItem = class extends SolidElement {
     };
     return html`<div id="anchor" part="base" class="${cx(
       "relative flex items-stretch whitespace-nowrap py-3 px-4 no-wrap !navigable-border-radius",
-      this.disabled ? "outline-none cursor-not-allowed sd-6-22-2-menu--disabled-color-text hover:bg-transparent" : "cursor-pointer sd-6-22-2-menu-color-text hover:bg-neutral-200",
+      this.disabled ? "outline-none cursor-not-allowed sd-6-24-0-menu--disabled-color-text hover:bg-transparent" : "cursor-pointer sd-6-24-0-menu-color-text hover:bg-neutral-200",
       this.isSubmenu() && isSubmenuExpanded && "submenu-expanded"
     )}" .disabled="${this.disabled}" ?aria-haspopup="${this.isSubmenu()}" ?aria-expanded="${isSubmenuExpanded ? true : false}">${this.type === "checkbox" ? html`<span part="checked-icon" class="${cx(
       "flex items-center justify-center grow-0 shrink-0 basis-auto",
       this.checked ? "visible" : "invisible"
-    )}"><sd-6-22-2-icon name="status-check" library="sd-status-assets" aria-hidden="true"></sd-6-22-2-icon></span>` : ""} ${slots.iconIndent ? html`<slot name="icon-indent" part="icon-indent" class="flex items-center grow-0 shrink-0 basis-auto mr-2"></slot>` : ""}<slot part="label" class="inline-flex grow shrink basis-auto text-ellipsis overflow-hidden" @slotchange="${this.handleDefaultSlotChange}"></slot>${this.chevron || this.isSubmenu() ? html`<span part="submenu-icon" class="flex items-center justify-center grow-0 shrink-0 basis-auto ml-3"><sd-6-22-2-icon name="chevron-right" library="_internal" aria-hidden="true" class="h-6 w-6"></sd-6-22-2-icon></span>` : ""} ${this.submenuController.renderSubmenu()}</div>`;
+    )}"><sd-6-24-0-icon name="status-check" library="sd-status-assets" aria-hidden="true"></sd-6-24-0-icon></span>` : ""} ${slots.iconIndent ? html`<slot name="icon-indent" part="icon-indent" class="flex items-center grow-0 shrink-0 basis-auto mr-2"></slot>` : ""}<slot part="label" class="inline-flex grow shrink basis-auto text-ellipsis overflow-hidden" @slotchange="${this.handleDefaultSlotChange}"></slot>${this.chevron || this.isSubmenu() ? html`<span part="submenu-icon" class="flex items-center justify-center grow-0 shrink-0 basis-auto ml-3"><sd-6-24-0-icon name="chevron-right" library="_internal" aria-hidden="true" class="h-6 w-6"></sd-6-24-0-icon></span>` : ""} ${this.submenuController.renderSubmenu()}</div>`;
   }
 };
 SdMenuItem.styles = [
   ...SolidElement.styles,
   css`/*! tailwindcss v4.3.0 | MIT License | https://tailwindcss.com */@layer properties;@layer theme,base,components,utilities;
-:host{--submenu-offset:-6px;display:block}:host(:focus-visible){--tw-outline-style:none;outline-style:none}::slotted(sd-6-22-2-icon){height:var(--sd-spacing-6);width:var(--sd-spacing-6)}[part=checked-icon]{margin-right:var(--sd-spacing-3)}.submenu-expanded::after{position:fixed;top:calc(var(--sd-spacing-1) * 0);right:calc(var(--sd-spacing-1) * 0);bottom:calc(var(--sd-spacing-1) * 0);left:calc(var(--sd-spacing-1) * 0);z-index:calc(var(z-dropdown) - 1);--tw-content:'';content:var(--tw-content);clip-path:polygon(var(--safe-triangle-cursor-x,0) var(--safe-triangle-cursor-y,0),var(--safe-triangle-submenu-start-x,0) var(--safe-triangle-submenu-start-y,0),var(--safe-triangle-submenu-end-x,0) var(--safe-triangle-submenu-end-y,0))}:host(:hover:not([aria-disabled=true],:focus-visible)) [part=base]{background-color:rgba(var(--sd-color-background-neutral-200));--tw-outline-style:none;outline-style:none}:host(:focus-visible:not([aria-disabled=true])) [part=base]{outline-style:solid;outline-offset:2px;outline-width:2px;outline-color:var(--outline-color-primary);outline-offset:-2px}:host(.menu-item-focus) [part=base]{outline-style:solid;outline-offset:2px;outline-width:2px;outline-color:var(--outline-color-primary);outline-offset:-2px}:host(:hover) [part=base]{--tw-outline-style:none;outline-style:none}//TODO clean up sd-6-22-2-menu-color-icon variable replacing with sd-6-22-2-menu-item-color-icon-fill (breakingchange) :host [part=icon-indent],:host [part=checked-icon],:host [part=submenu-icon]{color:rgba(var(--sd-menu-color-icon,var(--sd-menu-item-color-icon-fill)))}//TODO clean up sd-6-22-2-menu--disabled-color-icon variable replacing with sd-6-22-2-menu-item--disabled-color-icon-fill (breakingchange) :host([aria-disabled=true]) [part=icon-indent]{color:rgba(var(--sd-menu--disabled-color-icon,var(--sd-menu-item--disabled-color-icon-fill)))}sd-6-22-2-popup::part(popup){z-index:var(--sd-z-index-dropdown,900);background-color:rgba(var(--sd-color-background-white));margin-left:var(--submenu-offset)}::slotted(sd-6-22-2-menu){max-width:var(--auto-size-available-width)!important;max-height:var(--auto-size-available-height)!important}.sd-6-22-2-menu-color-text{color:rgba(var(--sd-menu-color-text,var(--sd-menu-item-color-text)))}.sd-6-22-2-menu--disabled-color-text{color:rgba(var(--sd-menu--disabled-color-text,var(--sd-menu-item--disabled-color-text)))}@property --tw-content{syntax:"*";inherits:false;initial-value:""}`
+:host{--submenu-offset:-6px;display:block}:host(:focus-visible){--tw-outline-style:none;outline-style:none}::slotted(sd-6-24-0-icon){height:var(--sd-spacing-6);width:var(--sd-spacing-6)}[part=checked-icon]{margin-right:var(--sd-spacing-3)}.submenu-expanded::after{position:fixed;top:calc(var(--sd-spacing-1) * 0);right:calc(var(--sd-spacing-1) * 0);bottom:calc(var(--sd-spacing-1) * 0);left:calc(var(--sd-spacing-1) * 0);z-index:calc(var(z-dropdown) - 1);--tw-content:'';content:var(--tw-content);clip-path:polygon(var(--safe-triangle-cursor-x,0) var(--safe-triangle-cursor-y,0),var(--safe-triangle-submenu-start-x,0) var(--safe-triangle-submenu-start-y,0),var(--safe-triangle-submenu-end-x,0) var(--safe-triangle-submenu-end-y,0))}:host(:hover:not([aria-disabled=true],:focus-visible)) [part=base]{background-color:rgba(var(--sd-color-background-neutral-200));--tw-outline-style:none;outline-style:none}:host(:focus-visible:not([aria-disabled=true])) [part=base]{outline-style:solid;outline-offset:2px;outline-width:2px;outline-color:var(--outline-color-primary);outline-offset:-2px}:host(.menu-item-focus) [part=base]{outline-style:solid;outline-offset:2px;outline-width:2px;outline-color:var(--outline-color-primary);outline-offset:-2px}:host(:hover) [part=base]{--tw-outline-style:none;outline-style:none}//TODO clean up sd-6-24-0-menu-color-icon variable replacing with sd-6-24-0-menu-item-color-icon-fill (breakingchange) :host [part=icon-indent],:host [part=checked-icon],:host [part=submenu-icon]{color:rgba(var(--sd-menu-color-icon,var(--sd-menu-item-color-icon-fill)))}//TODO clean up sd-6-24-0-menu--disabled-color-icon variable replacing with sd-6-24-0-menu-item--disabled-color-icon-fill (breakingchange) :host([aria-disabled=true]) [part=icon-indent]{color:rgba(var(--sd-menu--disabled-color-icon,var(--sd-menu-item--disabled-color-icon-fill)))}sd-6-24-0-popup::part(popup){z-index:var(--sd-z-index-dropdown,900);background-color:rgba(var(--sd-color-background-white));margin-left:var(--submenu-offset)}::slotted(sd-6-24-0-menu){max-width:var(--auto-size-available-width)!important;max-height:var(--auto-size-available-height)!important}.sd-6-24-0-menu-color-text{color:rgba(var(--sd-menu-color-text,var(--sd-menu-item-color-text)))}.sd-6-24-0-menu--disabled-color-text{color:rgba(var(--sd-menu--disabled-color-text,var(--sd-menu-item--disabled-color-text)))}@property --tw-content{syntax:"*";inherits:false;initial-value:""}`
 ];
 __decorateClass([
   query("slot:not([name])")
@@ -146,7 +146,7 @@ __decorateClass([
   watch("type")
 ], SdMenuItem.prototype, "handleTypeChange", 1);
 SdMenuItem = __decorateClass([
-  customElement("sd-6-22-2-menu-item")
+  customElement("sd-6-24-0-menu-item")
 ], SdMenuItem);
 
 export {

package/dist-versioned/chunks/{chunk.TXWQGRBO.js → chunk.BCZIRWVM.js}

@@ -1,7 +1,7 @@
 import {
   SolidElement,
   customElement
-} from "./chunk.BSWNMA5L.js";
+} from "./chunk.BVWAKEFC.js";
 import {
   __decorateClass
 } from "./chunk.S3NI7NKU.js";
@@ -22,7 +22,7 @@ var SdDivider = class extends SolidElement {
   }
   render() {
     return html`<hr part="main" aria-orientation="${this.orientation}" class="${cx(
-      this.inverted ? "sd-6-22-2-divider--inverted-color-border" : "border-neutral-400",
+      this.inverted ? "sd-6-24-0-divider--inverted-color-border" : "border-neutral-400",
       this.orientation === "horizontal" ? "border-t w-full" : " border-l h-full"
     )}">`;
   }
@@ -33,7 +33,7 @@ var SdDivider = class extends SolidElement {
 SdDivider.styles = [
   ...SolidElement.styles,
   css`/*! tailwindcss v4.3.0 | MIT License | https://tailwindcss.com */@layer theme,base,components,utilities;
-:host{margin:calc(var(--sd-spacing-1) * 0)}:host(sd-6-22-2-divider[orientation=horizontal]){display:block}:host(sd-6-22-2-divider[orientation=vertical]){display:inline-block}`
+:host{margin:calc(var(--sd-spacing-1) * 0)}:host(sd-6-24-0-divider[orientation=horizontal]){display:block}:host(sd-6-24-0-divider[orientation=vertical]){display:inline-block}`
 ];
 __decorateClass([
   property({ type: String, reflect: true })
@@ -42,7 +42,7 @@ __decorateClass([
   property({ type: Boolean, reflect: true })
 ], SdDivider.prototype, "inverted", 2);
 SdDivider = __decorateClass([
-  customElement("sd-6-22-2-divider")
+  customElement("sd-6-24-0-divider")
 ], SdDivider);
 
 export {