@solid-design-system/components 6.16.0 → 6.16.2

package/dist-versioned/chunks/{chunk.4UDWRELW.js → chunk.MU4ARXB6.js}

@@ -7,7 +7,7 @@ import {
 import {
   SolidElement,
   customElement
-} from "./chunk.V7PNN6GB.js";
+} from "./chunk.V2SCLPWH.js";
 import {
   __decorateClass
 } from "./chunk.S3NI7NKU.js";
@@ -26,7 +26,7 @@ var SdCheckboxGroup = class extends SolidElement {
     this.helpText = "";
   }
   getAllCheckboxes() {
-    return [...this.querySelectorAll("sd-6-16-0-checkbox")];
+    return [...this.querySelectorAll("sd-6-16-2-checkbox")];
   }
   async syncCheckboxElements() {
     const checkboxes = this.getAllCheckboxes();
@@ -39,10 +39,10 @@ var SdCheckboxGroup = class extends SolidElement {
     );
   }
   syncCheckboxes() {
-    if (customElements.get("sd-6-16-0-checkbox")) {
+    if (customElements.get("sd-6-16-2-checkbox")) {
       this.syncCheckboxElements();
     } else {
-      customElements.whenDefined("sd-6-16-0-checkbox").then(() => this.syncCheckboxes());
+      customElements.whenDefined("sd-6-16-2-checkbox").then(() => this.syncCheckboxes());
     }
   }
   handleSizeChange() {
@@ -80,7 +80,7 @@ var SdCheckboxGroup = class extends SolidElement {
 SdCheckboxGroup.styles = [
   ...SolidElement.styles,
   css`/*! tailwindcss v4.2.1 | MIT License | https://tailwindcss.com */@layer theme,base,components,utilities;
-:host{display:block}:host([orientation=vertical]) ::slotted(sd-6-16-0-checkbox){margin-bottom:var(--sd-spacing-2);display:flex}:host([orientation=vertical]) ::slotted(sd-6-16-0-checkbox:last-of-type){margin-bottom:calc(var(--sd-spacing-1) * 0)}:host([orientation=horizontal]) ::slotted(sd-6-16-0-checkbox){margin-right:var(--sd-spacing-6)}:host([orientation=horizontal]) ::slotted(sd-6-16-0-checkbox:last-of-type){margin-right:calc(var(--sd-spacing-1) * 0)}:host([orientation=horizontal]):host([size=sm]) ::slotted(sd-6-16-0-checkbox){margin-right:var(--sd-spacing-4)}:host([orientation=horizontal]):host([size=sm]) ::slotted(sd-6-16-0-checkbox:last-of-type){margin-right:calc(var(--sd-spacing-1) * 0)}`
+:host{display:block}:host([orientation=vertical]) ::slotted(sd-6-16-2-checkbox){margin-bottom:var(--sd-spacing-2);display:flex}:host([orientation=vertical]) ::slotted(sd-6-16-2-checkbox:last-of-type){margin-bottom:calc(var(--sd-spacing-1) * 0)}:host([orientation=horizontal]) ::slotted(sd-6-16-2-checkbox){margin-right:var(--sd-spacing-6)}:host([orientation=horizontal]) ::slotted(sd-6-16-2-checkbox:last-of-type){margin-right:calc(var(--sd-spacing-1) * 0)}:host([orientation=horizontal]):host([size=sm]) ::slotted(sd-6-16-2-checkbox){margin-right:var(--sd-spacing-4)}:host([orientation=horizontal]):host([size=sm]) ::slotted(sd-6-16-2-checkbox:last-of-type){margin-right:calc(var(--sd-spacing-1) * 0)}`
 ];
 __decorateClass([
   property({ type: String, reflect: true })
@@ -101,7 +101,7 @@ __decorateClass([
   watch("invalid", { waitUntilFirstUpdate: true })
 ], SdCheckboxGroup.prototype, "handleInvalid", 1);
 SdCheckboxGroup = __decorateClass([
-  customElement("sd-6-16-0-checkbox-group")
+  customElement("sd-6-16-2-checkbox-group")
 ], SdCheckboxGroup);
 
 export {

package/dist-versioned/chunks/{chunk.AFXQPWOT.js → chunk.N74J2PD2.js}

@@ -7,7 +7,7 @@ import {
 import {
   SolidElement,
   customElement
-} from "./chunk.V7PNN6GB.js";
+} from "./chunk.V2SCLPWH.js";
 import {
   __decorateClass
 } from "./chunk.S3NI7NKU.js";
@@ -98,7 +98,7 @@ var SdVideo = class extends SolidElement {
       this.playing ? "opacity-0" : "opacity-100",
       this.isBelowBreakpoint ? "w-[48px] h-[48px]" : "w-[96px] h-[96px]",
       "absolute left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2 p-4 bg-white/75 rounded-full play-pause-transition group-focus-visible:outline-2 group-focus-visible:outline-offset-2"
-    )}"><slot name="play-icon" part="play-icon" class="${cx(this.isBelowBreakpoint ? "text-[2rem]" : "text-[4rem]")}"><sd-6-16-0-icon id="default-play-icon" library="_internal" name="start"></sd-6-16-0-icon></slot></div></button> ${this.hasSlotController.test("poster") ? html`<div part="poster-wrapper" class="absolute left-0 top-0 w-full z-10 overflow-hidden"><slot name="poster" role="presentation"></slot></div>` : null}<slot></slot></div>`;
+    )}"><slot name="play-icon" part="play-icon" class="${cx(this.isBelowBreakpoint ? "text-[2rem]" : "text-[4rem]")}"><sd-6-16-2-icon id="default-play-icon" library="_internal" name="start"></sd-6-16-2-icon></slot></div></button> ${this.hasSlotController.test("poster") ? html`<div part="poster-wrapper" class="absolute left-0 top-0 w-full z-10 overflow-hidden"><slot name="poster" role="presentation"></slot></div>` : null}<slot></slot></div>`;
   }
 };
 SdVideo.styles = [
@@ -116,7 +116,7 @@ __decorateClass([
   property({ type: Boolean })
 ], SdVideo.prototype, "isBelowBreakpoint", 2);
 SdVideo = __decorateClass([
-  customElement("sd-6-16-0-video")
+  customElement("sd-6-16-2-video")
 ], SdVideo);
 
 export {

package/dist-versioned/chunks/{chunk.PBISMPN4.js → chunk.NAPTGGU6.js}

@@ -12,7 +12,7 @@ import {
 import {
   SolidElement,
   customElement
-} from "./chunk.V7PNN6GB.js";
+} from "./chunk.V2SCLPWH.js";
 import {
   __decorateClass
 } from "./chunk.S3NI7NKU.js";
@@ -100,7 +100,7 @@ var SdIcon = class extends SolidElement {
     }
   }
   render() {
-    return html`<sd-6-16-0-theme-listener></sd-6-16-0-theme-listener>${unsafeSVG(this.svg)}`;
+    return html`<sd-6-16-2-theme-listener></sd-6-16-2-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-16-0-icon")
+  customElement("sd-6-16-2-icon")
 ], SdIcon);
 
 export {

package/dist-versioned/chunks/{chunk.PIOYH3TM.js → chunk.NNLMYT4Y.js}

@@ -1,7 +1,7 @@
 import {
   SolidElement,
   customElement
-} from "./chunk.V7PNN6GB.js";
+} from "./chunk.V2SCLPWH.js";
 import {
   __decorateClass
 } from "./chunk.S3NI7NKU.js";
@@ -87,7 +87,7 @@ var SdFlipcard = class extends SolidElement {
         "gradient-light": this.placement === "top" ? "bg-gradient-to-b from-white/60 to-white/0 mb-auto" : "bg-gradient-to-t from-white/60 to-white/0 mt-auto",
         "gradient-dark": this.placement === "bottom" ? "bg-gradient-to-t from-primary-800/60 to-primary-800/0 mt-auto" : "bg-gradient-to-b from-primary-800/60 to-primary-800/0 mb-auto"
       }[this.frontVariant]
-    )}"></div><sd-6-16-0-button part="front-button" size="md" variant="${{
+    )}"></div><sd-6-16-2-button part="front-button" size="md" variant="${{
       primary: "tertiary",
       "primary-100": "tertiary",
       "gradient-light": "primary",
@@ -97,7 +97,7 @@ var SdFlipcard = class extends SolidElement {
       "primary-100": false,
       "gradient-light": true,
       "gradient-dark": true
-    }[this.frontVariant]}" class="${cx("absolute right-0 p-2 flex-shrink-0", this.placement === "top" ? "bottom-0" : "top-0")}" @click="${this.flipFront}" @keydown="${this.handleFrontKeydown}"><sd-6-16-0-icon library="_internal" name="reload" label="Flip to Back"></sd-6-16-0-icon></sd-6-16-0-button></div><div part="back" tabindex="0" aria-hidden="${this.activeSide === "front"}" inert="${ifDefined(this.activeSide === "front" || void 0)}" class="${cx(
+    }[this.frontVariant]}" class="${cx("absolute right-0 p-2 flex-shrink-0", this.placement === "top" ? "bottom-0" : "top-0")}" @click="${this.flipFront}" @keydown="${this.handleFrontKeydown}"><sd-6-16-2-icon library="_internal" name="reload" label="Flip to Back"></sd-6-16-2-icon></sd-6-16-2-button></div><div part="back" tabindex="0" aria-hidden="${this.activeSide === "front"}" inert="${ifDefined(this.activeSide === "front" || void 0)}" class="${cx(
       "flip-card__side flip-card__side--back overflow-hidden transition-transform duration-1000 ease-in-out",
       "flex focus-visible:focus-outline",
       "absolute top-0 left-0 w-full h-full justify-end text-left",
@@ -130,7 +130,7 @@ var SdFlipcard = class extends SolidElement {
         "gradient-light": this.placement === "top" ? "bg-gradient-to-b from-white/60 to-white/0 mb-auto" : "bg-gradient-to-t from-white/60 to-white/0 mt-auto",
         "gradient-dark": this.placement === "bottom" ? "bg-gradient-to-t from-primary-800/60 to-primary-800/0 mt-auto" : "bg-gradient-to-b from-primary-800/60 to-primary-800/0 mb-auto"
       }[this.backVariant]
-    )}"></div><sd-6-16-0-button size="md" part="back-button" variant="${{
+    )}"></div><sd-6-16-2-button size="md" part="back-button" variant="${{
       primary: "tertiary",
       "primary-100": "tertiary",
       "gradient-light": "primary",
@@ -140,7 +140,7 @@ var SdFlipcard = class extends SolidElement {
       "primary-100": false,
       "gradient-light": true,
       "gradient-dark": true
-    }[this.backVariant]}" class="${cx("absolute right-0 p-2 flex-shrink-0", this.placement === "top" ? "bottom-0" : "top-0")}" @click="${this.flipBack}" @keydown="${this.handleBackKeydown}"><sd-6-16-0-icon library="_internal" name="reload" label="Flip to Front"></sd-6-16-0-icon></sd-6-16-0-button></div></div>`;
+    }[this.backVariant]}" class="${cx("absolute right-0 p-2 flex-shrink-0", this.placement === "top" ? "bottom-0" : "top-0")}" @click="${this.flipBack}" @keydown="${this.handleBackKeydown}"><sd-6-16-2-icon library="_internal" name="reload" label="Flip to Front"></sd-6-16-2-icon></sd-6-16-2-button></div></div>`;
   }
 };
 /**
@@ -176,7 +176,7 @@ __decorateClass([
   state()
 ], SdFlipcard.prototype, "activeSide", 2);
 SdFlipcard = __decorateClass([
-  customElement("sd-6-16-0-flipcard")
+  customElement("sd-6-16-2-flipcard")
 ], SdFlipcard);
 
 export {

package/dist-versioned/chunks/{chunk.SP3UZWV2.js → chunk.NVSTD2DO.js}

@@ -7,7 +7,7 @@ import {
 import {
   SolidElement,
   customElement
-} from "./chunk.V7PNN6GB.js";
+} from "./chunk.V2SCLPWH.js";
 import {
   __decorateClass
 } from "./chunk.S3NI7NKU.js";
@@ -209,7 +209,7 @@ __decorateClass([
   watch("playbackRate")
 ], SdAnimation.prototype, "handlePlaybackRateChange", 1);
 SdAnimation = __decorateClass([
-  customElement("sd-6-16-0-animation")
+  customElement("sd-6-16-2-animation")
 ], SdAnimation);
 
 export {

package/dist-versioned/chunks/{chunk.VASBQKR7.js → chunk.O5LCY7TO.js}

@@ -1,7 +1,7 @@
 import {
   SolidElement,
   customElement
-} from "./chunk.V7PNN6GB.js";
+} from "./chunk.V2SCLPWH.js";
 import {
   __decorateClass
 } from "./chunk.S3NI7NKU.js";
@@ -324,7 +324,7 @@ __decorateClass([
   property({ attribute: "auto-size-padding", type: Number })
 ], SdPopup.prototype, "autoSizePadding", 2);
 SdPopup = __decorateClass([
-  customElement("sd-6-16-0-popup")
+  customElement("sd-6-16-2-popup")
 ], SdPopup);
 
 export {

package/dist-versioned/chunks/{chunk.R6MGPVBY.js → chunk.ONQ4DNCZ.js}

@@ -4,7 +4,7 @@ import {
 import {
   SolidElement,
   customElement
-} from "./chunk.V7PNN6GB.js";
+} from "./chunk.V2SCLPWH.js";
 import {
   __decorateClass
 } from "./chunk.S3NI7NKU.js";
@@ -22,7 +22,7 @@ var SdBreadcrumb = class extends SolidElement {
     this.isTruncated = false;
   }
   get items() {
-    return this.querySelectorAll("sd-6-16-0-breadcrumb-item");
+    return this.querySelectorAll("sd-6-16-2-breadcrumb-item");
   }
   cacheItemPositions() {
     this.items.forEach((item) => {
@@ -67,12 +67,12 @@ var SdBreadcrumb = class extends SolidElement {
   }
   handleMobileChevron() {
     var _a, _b, _c;
-    const icon = document.createElement("sd-6-16-0-icon");
+    const icon = document.createElement("sd-6-16-2-icon");
     icon.setAttribute("slot", "icon-left");
     icon.setAttribute("library", "_internal");
     icon.setAttribute("name", "chevron-left");
     icon.setAttribute("class", "text-base me-1 lg:hidden");
-    (_c = (_b = (_a = Array.from(this.items).at(-2)) == null ? void 0 : _a.shadowRoot) == null ? void 0 : _b.querySelector("sd-6-16-0-link")) == null ? void 0 : _c.appendChild(icon);
+    (_c = (_b = (_a = Array.from(this.items).at(-2)) == null ? void 0 : _a.shadowRoot) == null ? void 0 : _b.querySelector("sd-6-16-2-link")) == null ? void 0 : _c.appendChild(icon);
   }
   handleSlotChange() {
     this.handleMobileChevron();
@@ -87,13 +87,13 @@ var SdBreadcrumb = class extends SolidElement {
     this.resizeObserver.unobserve(this);
   }
   render() {
-    return html`<nav part="base" class="flex items-center pb-1" aria-label="${this.label}"><sd-6-16-0-dropdown part="truncated" class="${cx(!this.isTruncated && "absolute opacity-0 pointer-events-none")}"><button slot="trigger" tabindex="${this.isTruncated ? "0" : "-1"}" aria-label="${this.localize.term("truncatedBreadcrumbs")}" aria-expanded="false" aria-haspopup="true" class="flex sd-interactive">[...]</button><ol part="truncated-dropdown" class="flex flex-col gap-4 px-2 py-3 min-w-40"></ol></sd-6-16-0-dropdown><ol part="list" class="flex items-center"><slot @slotchange="${this.handleSlotChange}"></slot></ol></nav>`;
+    return html`<nav part="base" class="flex items-center pb-1" aria-label="${this.label}"><sd-6-16-2-dropdown part="truncated" class="${cx(!this.isTruncated && "absolute opacity-0 pointer-events-none")}"><button slot="trigger" tabindex="${this.isTruncated ? "0" : "-1"}" aria-label="${this.localize.term("truncatedBreadcrumbs")}" aria-expanded="false" aria-haspopup="true" class="flex sd-interactive">[...]</button><ol part="truncated-dropdown" class="flex flex-col gap-4 px-2 py-3 min-w-40"></ol></sd-6-16-2-dropdown><ol part="list" class="flex items-center"><slot @slotchange="${this.handleSlotChange}"></slot></ol></nav>`;
   }
 };
 SdBreadcrumb.styles = [
   ...SolidElement.styles,
   css`/*! tailwindcss v4.2.1 | MIT License | https://tailwindcss.com */@layer properties;@layer theme,base,components,utilities;
-:host{position:relative;display:block}::slotted(sd-6-16-0-breadcrumb-item:not(:last-of-type))::after,sd-6-16-0-dropdown::after{margin-inline:var(--sd-spacing-2);display:none;height:var(--sd-spacing-1);width:var(--sd-spacing-1);border-radius:var(--sd-radius-full);background-color:rgba(var(--sd-breadcrumb__separator-color,rgba(var(--sd-color-neutral-400))));--tw-content:'';content:var(--tw-content)}@media (width >= 64rem){::slotted(sd-6-16-0-breadcrumb-item:not(:last-of-type))::after,sd-6-16-0-dropdown::after{display:inline-block}}::slotted(sd-6-16-0-breadcrumb-item:nth-last-child(2)){display:flex}@media (width >= 64rem){::slotted(sd-6-16-0-breadcrumb-item:nth-last-child(2))::after{background-color:rgba(var(--sd-breadcrumb__separator--current-color,rgba(var(--sd-color-accent))))}}::slotted(sd-6-16-0-breadcrumb-item),sd-6-16-0-dropdown{display:none;align-items:center;font-size:var(--sd-text-sm);line-height:var(--tw-leading,var(--text-sm--line-height,calc(1.25 / .875)))}@media (width >= 64rem){::slotted(sd-6-16-0-breadcrumb-item),sd-6-16-0-dropdown{display:flex}}@property --tw-content{syntax:"*";inherits:false;initial-value:""}`
+:host{position:relative;display:block}::slotted(sd-6-16-2-breadcrumb-item:not(:last-of-type))::after,sd-6-16-2-dropdown::after{margin-inline:var(--sd-spacing-2);display:none;height:var(--sd-spacing-1);width:var(--sd-spacing-1);border-radius:var(--sd-radius-full);background-color:rgba(var(--sd-breadcrumb__separator-color,rgba(var(--sd-color-neutral-400))));--tw-content:'';content:var(--tw-content)}@media (width >= 64rem){::slotted(sd-6-16-2-breadcrumb-item:not(:last-of-type))::after,sd-6-16-2-dropdown::after{display:inline-block}}::slotted(sd-6-16-2-breadcrumb-item:nth-last-child(2)){display:flex}@media (width >= 64rem){::slotted(sd-6-16-2-breadcrumb-item:nth-last-child(2))::after{background-color:rgba(var(--sd-breadcrumb__separator--current-color,rgba(var(--sd-color-accent))))}}::slotted(sd-6-16-2-breadcrumb-item),sd-6-16-2-dropdown{display:none;align-items:center;font-size:var(--sd-text-sm);line-height:var(--tw-leading,var(--text-sm--line-height,calc(1.25 / .875)))}@media (width >= 64rem){::slotted(sd-6-16-2-breadcrumb-item),sd-6-16-2-dropdown{display:flex}}@property --tw-content{syntax:"*";inherits:false;initial-value:""}`
 ];
 __decorateClass([
   query('[part="base"]')
@@ -117,7 +117,7 @@ __decorateClass([
   state()
 ], SdBreadcrumb.prototype, "isTruncated", 2);
 SdBreadcrumb = __decorateClass([
-  customElement("sd-6-16-0-breadcrumb")
+  customElement("sd-6-16-2-breadcrumb")
 ], SdBreadcrumb);
 
 export {

package/dist-versioned/chunks/{chunk.GYT2MOIG.js → chunk.PAAXLQEE.js}

@@ -11,7 +11,7 @@ import {
 import {
   SolidElement,
   customElement
-} from "./chunk.V7PNN6GB.js";
+} from "./chunk.V2SCLPWH.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-16-0-menu--disabled-color-text hover:bg-transparent" : "cursor-pointer sd-6-16-0-menu-color-text hover:bg-neutral-200",
+      this.disabled ? "outline-none cursor-not-allowed sd-6-16-2-menu--disabled-color-text hover:bg-transparent" : "cursor-pointer sd-6-16-2-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-16-0-icon name="status-check" library="sd-status-assets" aria-hidden="true"></sd-6-16-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-16-0-icon name="chevron-right" library="_internal" aria-hidden="true" class="h-6 w-6"></sd-6-16-0-icon></span>` : ""} ${this.submenuController.renderSubmenu()}</div>`;
+    )}"><sd-6-16-2-icon name="status-check" library="sd-status-assets" aria-hidden="true"></sd-6-16-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-16-2-icon name="chevron-right" library="_internal" aria-hidden="true" class="h-6 w-6"></sd-6-16-2-icon></span>` : ""} ${this.submenuController.renderSubmenu()}</div>`;
   }
 };
 SdMenuItem.styles = [
   ...SolidElement.styles,
   css`/*! tailwindcss v4.2.1 | 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-16-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:rgba(var(--outline-color-primary));outline-offset:-2px}:host(.menu-item-focus) [part=base]{outline-style:solid;outline-offset:2px;outline-width:2px;outline-color:rgba(var(--outline-color-primary));outline-offset:-2px}:host(:hover) [part=base]{--tw-outline-style:none;outline-style:none}//TODO clean up sd-6-16-0-menu-color-icon variable replacing with sd-6-16-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-16-0-menu--disabled-color-icon variable replacing with sd-6-16-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-16-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-16-0-menu){max-width:var(--auto-size-available-width)!important;max-height:var(--auto-size-available-height)!important}.sd-6-16-0-menu-color-text{color:rgba(var(--sd-menu-color-text,var(--sd-menu-item-color-text)))}.sd-6-16-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:""}`
+:host{--submenu-offset:-6px;display:block}:host(:focus-visible){--tw-outline-style:none;outline-style:none}::slotted(sd-6-16-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:rgba(var(--outline-color-primary));outline-offset:-2px}:host(.menu-item-focus) [part=base]{outline-style:solid;outline-offset:2px;outline-width:2px;outline-color:rgba(var(--outline-color-primary));outline-offset:-2px}:host(:hover) [part=base]{--tw-outline-style:none;outline-style:none}//TODO clean up sd-6-16-2-menu-color-icon variable replacing with sd-6-16-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-16-2-menu--disabled-color-icon variable replacing with sd-6-16-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-16-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-16-2-menu){max-width:var(--auto-size-available-width)!important;max-height:var(--auto-size-available-height)!important}.sd-6-16-2-menu-color-text{color:rgba(var(--sd-menu-color-text,var(--sd-menu-item-color-text)))}.sd-6-16-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:""}`
 ];
 __decorateClass([
   query("slot:not([name])")
@@ -146,7 +146,7 @@ __decorateClass([
   watch("type")
 ], SdMenuItem.prototype, "handleTypeChange", 1);
 SdMenuItem = __decorateClass([
-  customElement("sd-6-16-0-menu-item")
+  customElement("sd-6-16-2-menu-item")
 ], SdMenuItem);
 
 export {

package/dist-versioned/chunks/{chunk.SVQ4W63O.js → chunk.PDVDXT7L.js}

@@ -4,7 +4,7 @@ import {
 import {
   SolidElement,
   customElement
-} from "./chunk.V7PNN6GB.js";
+} from "./chunk.V2SCLPWH.js";
 import {
   __decorateClass
 } from "./chunk.S3NI7NKU.js";
@@ -57,13 +57,13 @@ var SdTeaser = class extends SolidElement {
       "teaser-has-headline": this.hasSlotController.test("headline")
     };
     return html`<div class="${cx(
-      "flex sd-6-16-0-teaser-border-radius",
+      "flex sd-6-16-2-teaser-border-radius",
       {
         white: "bg-white",
-        "white border-neutral-400": "bg-white border sd-6-16-0-teaser--neutral-400-color-border",
-        "neutral-100": "sd-6-16-0-teaser--neutral-100-color-background",
+        "white border-neutral-400": "bg-white border sd-6-16-2-teaser--neutral-400-color-border",
+        "neutral-100": "sd-6-16-2-teaser--neutral-100-color-background",
         primary: "bg-primary text-white",
-        "primary-100": "sd-6-16-0-teaser--primary-100-color-background"
+        "primary-100": "sd-6-16-2-teaser--primary-100-color-background"
       }[this.variant],
       this._orientation === "vertical" && "flex-col",
       this._orientation === "horizontal" && "flex-row gap-8",
@@ -105,7 +105,7 @@ __decorateClass([
   state()
 ], SdTeaser.prototype, "_orientation", 2);
 SdTeaser = __decorateClass([
-  customElement("sd-6-16-0-teaser")
+  customElement("sd-6-16-2-teaser")
 ], SdTeaser);
 
 export {

package/dist-versioned/chunks/{chunk.3IATPYUU.js → chunk.Q2LD7K7G.js}

@@ -4,7 +4,7 @@ import {
 import {
   SolidElement,
   customElement
-} from "./chunk.V7PNN6GB.js";
+} from "./chunk.V2SCLPWH.js";
 import {
   __decorateClass
 } from "./chunk.S3NI7NKU.js";
@@ -18,7 +18,7 @@ var SdTabPanel = class extends SolidElement {
   constructor() {
     super(...arguments);
     this.attrId = ++id;
-    this.componentId = `sd-6-16-0-tab-panel-${this.attrId}`;
+    this.componentId = `sd-6-16-2-tab-panel-${this.attrId}`;
     this.name = "";
     this.active = false;
   }
@@ -49,7 +49,7 @@ __decorateClass([
   watch("active")
 ], SdTabPanel.prototype, "handleActiveChange", 1);
 SdTabPanel = __decorateClass([
-  customElement("sd-6-16-0-tab-panel")
+  customElement("sd-6-16-2-tab-panel")
 ], SdTabPanel);
 
 export {

package/dist-versioned/chunks/{chunk.GGTTE3O5.js → chunk.REB4VPRZ.js}

@@ -16,7 +16,7 @@ import {
 import {
   SolidElement,
   customElement
-} from "./chunk.V7PNN6GB.js";
+} from "./chunk.V2SCLPWH.js";
 import {
   __decorateClass,
   __spreadValues
@@ -414,14 +414,14 @@ var SdInput = class extends SolidElement {
       !isFloatingLabelActive || !hasValue && (this.readonly || this.visuallyDisabled) ? textSize : "text-xs",
       (this.visuallyDisabled || this.disabled) && "text-neutral-500",
       isFloatingLabelActive && !this.visuallyDisabled && !this.disabled && "form-control--filled__floating-label-color-text"
-    )}">${this.label}</span></label>` : null} ${hasClearIcon ? html`<button part="clear-button" class="${cx("flex justify-center", iconMarginLeft)}" type="button" aria-label="${this.localize.term("clearEntry")}" @click="${this.handleClearClick}" tabindex="-1"><slot name="clear-icon"><sd-6-16-0-icon class="${cx(
+    )}">${this.label}</span></label>` : null} ${hasClearIcon ? html`<button part="clear-button" class="${cx("flex justify-center", iconMarginLeft)}" type="button" aria-label="${this.localize.term("clearEntry")}" @click="${this.handleClearClick}" tabindex="-1"><slot name="clear-icon"><sd-6-16-2-icon class="${cx(
       this.disabled || this.visuallyDisabled ? "text-neutral-500" : "text-neutral-700",
       iconSize
-    )}" library="_internal" name="closing-round"></sd-6-16-0-icon></slot></button>` : ""} ${this.passwordToggle && this.type === "password" ? html`<button aria-label="${this.localize.term(this.passwordVisible ? "hidePassword" : "showPassword")}" part="password-toggle-button" class="${cx(
+    )}" library="_internal" name="closing-round"></sd-6-16-2-icon></slot></button>` : ""} ${this.passwordToggle && this.type === "password" ? html`<button aria-label="${this.localize.term(this.passwordVisible ? "hidePassword" : "showPassword")}" part="password-toggle-button" class="${cx(
       "flex items-center sd-interactive",
       iconMarginLeft,
       this.floatingLabel && !isFloatingLabelActive && "hide-password-toggle"
-    )}" type="button" @click="${this.handlePasswordToggle}" @mousedown="${this.handleClickableIconFocusIn}" @focus="${() => this.handleClickableIconFocusIn()}" @blur="${this.handleClickableIconFocusOut}">${this.passwordVisible ? html`<slot name="show-password-icon"><sd-6-16-0-icon class="${cx(iconColor, iconSize)}" library="_internal" name="eye"></sd-6-16-0-icon></slot>` : html`<slot name="hide-password-icon"><sd-6-16-0-icon class="${cx(iconColor, iconSize)}" library="_internal" name="eye-crossed-out"></sd-6-16-0-icon></slot>`}</button>` : ""} ${(this.type === "date" || this.type === "datetime-local") && !isFirefox ? html`<sd-6-16-0-icon class="${cx(iconColor, iconMarginLeft, iconSize)}" library="_internal" name="calendar"></sd-6-16-0-icon>` : ""} ${this.type === "time" ? html`<sd-6-16-0-icon class="${cx(iconColor, iconMarginLeft, iconSize)}" library="_internal" name="clock"></sd-6-16-0-icon>` : ""} ${this.type === "search" ? html`<button class="${cx("flex items-center sd-interactive", iconMarginLeft)}" type="button" @click="${this.handleSearchClick}"><sd-6-16-0-icon class="${cx(iconColor, iconSize)}" library="_internal" name="magnifying-glass" label="${this.localize.term("search")}"></sd-6-16-0-icon></button>` : ""} ${this.showInvalidStyle ? html`<sd-6-16-0-icon part="invalid-icon" class="${cx("text-error", iconMarginLeft, iconSize)}" library="_internal" name="risk"></sd-6-16-0-icon>` : ""} ${this.showValidStyle && this.styleOnValid ? html`<sd-6-16-0-icon class="${cx("text-success flex-shrink-0", iconMarginLeft, iconSize)}" library="_internal" name="confirm-circle" part="valid-icon"></sd-6-16-0-icon>` : ""} ${slots["right"] ? html`<slot name="right" part="right" class="${cx("inline-flex", iconColor, iconMarginLeft, iconSize)}"></slot>` : ""} ${this.type === "number" && this.spinButtons ? html`<div part="stepper" class="flex items-center"><button part="decrement-number-stepper" class="stepper-button flex" type="button" ?disabled="${this.isDecrementDisabled()}" aria-hidden="true" ${longPress({ start: () => this.handleStepDown(), end: () => this.handleChange() })} tabindex="-1" @mousedown="${this.handleClickableIconFocusIn}" @focus="${() => this.handleClickableIconFocusIn()}" @blur="${this.handleClickableIconFocusOut}"><slot name="decrement-number-stepper"><sd-6-16-0-icon library="_internal" name="minus-circle" label="Decrease value" class="${cx(iconColor, iconMarginLeft, iconSize)}"></sd-6-16-0-icon></slot></button> <button part="increment-number-stepper" class="stepper-button flex" type="button" ?disabled="${this.isIncrementDisabled()}" aria-hidden="true" ${longPress({ start: () => this.handleStepUp(), end: () => this.handleChange() })} tabindex="-1"><slot name="increment-number-stepper"><sd-6-16-0-icon library="_internal" name="plus-circle" label="Decrease value" class="${cx(iconColor, iconMarginLeft, iconSize)}"></sd-6-16-0-icon></slot></button></div>` : ""}</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(this.size)}`;
+    )}" type="button" @click="${this.handlePasswordToggle}" @mousedown="${this.handleClickableIconFocusIn}" @focus="${() => this.handleClickableIconFocusIn()}" @blur="${this.handleClickableIconFocusOut}">${this.passwordVisible ? html`<slot name="show-password-icon"><sd-6-16-2-icon class="${cx(iconColor, iconSize)}" library="_internal" name="eye"></sd-6-16-2-icon></slot>` : html`<slot name="hide-password-icon"><sd-6-16-2-icon class="${cx(iconColor, iconSize)}" library="_internal" name="eye-crossed-out"></sd-6-16-2-icon></slot>`}</button>` : ""} ${(this.type === "date" || this.type === "datetime-local") && !isFirefox ? html`<sd-6-16-2-icon class="${cx(iconColor, iconMarginLeft, iconSize)}" library="_internal" name="calendar"></sd-6-16-2-icon>` : ""} ${this.type === "time" ? html`<sd-6-16-2-icon class="${cx(iconColor, iconMarginLeft, iconSize)}" library="_internal" name="clock"></sd-6-16-2-icon>` : ""} ${this.type === "search" ? html`<button class="${cx("flex items-center sd-interactive", iconMarginLeft)}" type="button" @click="${this.handleSearchClick}"><sd-6-16-2-icon class="${cx(iconColor, iconSize)}" library="_internal" name="magnifying-glass" label="${this.localize.term("search")}"></sd-6-16-2-icon></button>` : ""} ${this.showInvalidStyle ? html`<sd-6-16-2-icon part="invalid-icon" class="${cx("text-error", iconMarginLeft, iconSize)}" library="_internal" name="risk"></sd-6-16-2-icon>` : ""} ${this.showValidStyle && this.styleOnValid ? html`<sd-6-16-2-icon class="${cx("text-success flex-shrink-0", iconMarginLeft, iconSize)}" library="_internal" name="confirm-circle" part="valid-icon"></sd-6-16-2-icon>` : ""} ${slots["right"] ? html`<slot name="right" part="right" class="${cx("inline-flex", iconColor, iconMarginLeft, iconSize)}"></slot>` : ""} ${this.type === "number" && this.spinButtons ? html`<div part="stepper" class="flex items-center"><button part="decrement-number-stepper" class="stepper-button flex" type="button" ?disabled="${this.isDecrementDisabled()}" aria-hidden="true" ${longPress({ start: () => this.handleStepDown(), end: () => this.handleChange() })} tabindex="-1" @mousedown="${this.handleClickableIconFocusIn}" @focus="${() => this.handleClickableIconFocusIn()}" @blur="${this.handleClickableIconFocusOut}"><slot name="decrement-number-stepper"><sd-6-16-2-icon library="_internal" name="minus-circle" label="Decrease value" class="${cx(iconColor, iconMarginLeft, iconSize)}"></sd-6-16-2-icon></slot></button> <button part="increment-number-stepper" class="stepper-button flex" type="button" ?disabled="${this.isIncrementDisabled()}" aria-hidden="true" ${longPress({ start: () => this.handleStepUp(), end: () => this.handleChange() })} tabindex="-1"><slot name="increment-number-stepper"><sd-6-16-2-icon library="_internal" name="plus-circle" label="Decrease value" class="${cx(iconColor, iconMarginLeft, iconSize)}"></sd-6-16-2-icon></slot></button></div>` : ""}</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(this.size)}`;
   }
 };
 /**
@@ -430,7 +430,7 @@ var SdInput = class extends SolidElement {
 SdInput.styles = [
   ...SolidElement.styles,
   css`/*! tailwindcss v4.2.1 | MIT License | https://tailwindcss.com */@layer theme,base,components,utilities;
-:host{position:relative;box-sizing:border-box;display:inline-block;width:100%;text-align:left}:host([vertical]){display:block}:host([required]) :is(#label,#floating-label)::after{content:' *'}:host([visually-disabled]) input{caret-color:transparent}details summary::-webkit-details-marker{display:none}input::-webkit-inner-spin-button,input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}input[type=number]{-moz-appearance:textfield}input[type=time]::-webkit-calendar-picker-indicator{background:0 0;display:none;-webkit-appearance:none}details summary::-webkit-details-marker,input[type=date]::-webkit-calendar-picker-indicator,input[type=datetime-local]::-webkit-calendar-picker-indicator,input[type=search]::-webkit-search-cancel-button,input[type=search]::-webkit-search-decoration,input[type=search]::-webkit-search-results-button,input[type=search]::-webkit-search-results-decoration{display:none}.stepper-button[disabled] sd-6-16-0-icon{color:rgba(var(--sd-color-text-neutral-500))}.hide-password-toggle{display:none}.has-floating-label input[type=date]:not(.has-value),.has-floating-label input[type=datetime-local]:not(.has-value),.has-floating-label input[type=time]:not(.has-value){color:transparent}.has-floating-label input[type=date]:focus,.has-floating-label input[type=datetime-local]:focus,.has-floating-label input[type=time]:focus{color:inherit}.icon-color{color:rgb(var(--sd-color-icon-fill-primary))}`
+:host{position:relative;box-sizing:border-box;display:inline-block;width:100%;text-align:left}:host([vertical]){display:block}:host([required]) :is(#label,#floating-label)::after{content:' *'}:host([visually-disabled]) input{caret-color:transparent}details summary::-webkit-details-marker{display:none}input::-webkit-inner-spin-button,input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}input[type=number]{-moz-appearance:textfield}input[type=time]::-webkit-calendar-picker-indicator{background:0 0;display:none;-webkit-appearance:none}details summary::-webkit-details-marker,input[type=date]::-webkit-calendar-picker-indicator,input[type=datetime-local]::-webkit-calendar-picker-indicator,input[type=search]::-webkit-search-cancel-button,input[type=search]::-webkit-search-decoration,input[type=search]::-webkit-search-results-button,input[type=search]::-webkit-search-results-decoration{display:none}.stepper-button[disabled] sd-6-16-2-icon{color:rgba(var(--sd-color-text-neutral-500))}.hide-password-toggle{display:none}.has-floating-label input[type=date]:not(.has-value),.has-floating-label input[type=datetime-local]:not(.has-value),.has-floating-label input[type=time]:not(.has-value){color:transparent}.has-floating-label input[type=date]:focus,.has-floating-label input[type=datetime-local]:focus,.has-floating-label input[type=time]:focus{color:inherit}.icon-color{color:rgb(var(--sd-color-icon-fill-primary))}`
 ];
 __decorateClass([
   query("#input")
@@ -569,7 +569,7 @@ __decorateClass([
   watch(["size", "floatingLabel"])
 ], SdInput.prototype, "handleSizeChange", 1);
 SdInput = __decorateClass([
-  customElement("sd-6-16-0-input")
+  customElement("sd-6-16-2-input")
 ], SdInput);
 
 export {

package/dist-versioned/chunks/{chunk.OXOO3KJR.js → chunk.RMCQYKQU.js}

@@ -13,7 +13,7 @@ import {
 import {
   SolidElement,
   customElement
-} from "./chunk.V7PNN6GB.js";
+} from "./chunk.V2SCLPWH.js";
 import {
   __decorateClass
 } from "./chunk.S3NI7NKU.js";
@@ -224,7 +224,7 @@ var SdTextarea = class extends SolidElement {
       textareaState === "disabled" || textareaState === "visuallyDisabled" ? "text-neutral-500" : "text-black",
       ["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-16-0-icon]:pe-8",
+      "ps-4 flex-grow focus:outline-none bg-transparent placeholder:text-neutral-700 resize-none group-has-[sd-6-16-2-icon]:pe-8",
       {
         sm: isFloatingLabelActive ? "pb-1" : "py-2",
         md: isFloatingLabelActive ? "pb-1" : "py-2",
@@ -232,7 +232,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="${!this.floatingLabel || isFloatingLabelActive ? 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-16-0-icon class="${cx("text-error absolute right-4 pointer-events-none", iconSize)}" library="_internal" name="risk" part="invalid-icon"></sd-6-16-0-icon>` : ""} ${this.styleOnValid && this.showValidStyle ? html`<sd-6-16-0-icon class="${cx("text-success absolute right-4 pointer-events-none", iconSize)}" library="_internal" name="confirm-circle" part="valid-icon"></sd-6-16-0-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(this.size)}`;
+    )}" 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="${!this.floatingLabel || isFloatingLabelActive ? 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-16-2-icon class="${cx("text-error absolute right-4 pointer-events-none", iconSize)}" library="_internal" name="risk" part="invalid-icon"></sd-6-16-2-icon>` : ""} ${this.styleOnValid && this.showValidStyle ? html`<sd-6-16-2-icon class="${cx("text-success absolute right-4 pointer-events-none", iconSize)}" library="_internal" name="confirm-circle" part="valid-icon"></sd-6-16-2-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(this.size)}`;
   }
 };
 /**
@@ -353,7 +353,7 @@ __decorateClass([
   watch(["size", "floatingLabel"])
 ], SdTextarea.prototype, "handleSizeChange", 1);
 SdTextarea = __decorateClass([
-  customElement("sd-6-16-0-textarea")
+  customElement("sd-6-16-2-textarea")
 ], SdTextarea);
 
 export {

package/dist-versioned/chunks/{chunk.UUWLJUQT.js → chunk.ROVOABKA.js}

@@ -7,7 +7,7 @@ import {
 import {
   SolidElement,
   customElement
-} from "./chunk.V7PNN6GB.js";
+} from "./chunk.V2SCLPWH.js";
 import {
   __decorateClass
 } from "./chunk.S3NI7NKU.js";
@@ -69,7 +69,7 @@ __decorateClass([
   watch("src")
 ], SdInclude.prototype, "handleSrcChange", 1);
 SdInclude = __decorateClass([
-  customElement("sd-6-16-0-include")
+  customElement("sd-6-16-2-include")
 ], SdInclude);
 
 export {

package/dist-versioned/chunks/{chunk.UF32T6VG.js → chunk.RRKI42AI.js}

@@ -10,7 +10,7 @@ import {
 import {
   SolidElement,
   customElement
-} from "./chunk.V7PNN6GB.js";
+} from "./chunk.V2SCLPWH.js";
 import {
   __decorateClass,
   __spreadValues
@@ -37,8 +37,8 @@ var SdTabGroup = class extends SolidElement {
   }
   connectedCallback() {
     const whenAllDefined = Promise.all([
-      customElements.whenDefined("sd-6-16-0-tab"),
-      customElements.whenDefined("sd-6-16-0-tab-panel")
+      customElements.whenDefined("sd-6-16-2-tab"),
+      customElements.whenDefined("sd-6-16-2-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-16-0-tab" ? el : el.querySelector("sd-6-16-0-tab")).filter((el) => {
-      return el && options.includeDisabled ? el.tagName.toLowerCase() === "sd-6-16-0-tab" : el.tagName.toLowerCase() === "sd-6-16-0-tab" && !el.disabled;
+    return Array.from(slot.assignedElements()).map((el) => el.tagName.toLocaleLowerCase() === "sd-6-16-2-tab" ? el : el.querySelector("sd-6-16-2-tab")).filter((el) => {
+      return el && options.includeDisabled ? el.tagName.toLowerCase() === "sd-6-16-2-tab" : el.tagName.toLowerCase() === "sd-6-16-2-tab" && !el.disabled;
     });
   }
   getAllPanels() {
-    return [...this.body.assignedElements()].filter((el) => el.tagName.toLowerCase() === "sd-6-16-0-tab-panel");
+    return [...this.body.assignedElements()].filter((el) => el.tagName.toLowerCase() === "sd-6-16-2-tab-panel");
   }
   getActiveTab() {
     return this.tabs.find((t) => t.matches(":focus"));
   }
   handleClick(event) {
     const target = event.target;
-    const tab = target.closest("sd-6-16-0-tab");
-    const tabGroup = tab == null ? void 0 : tab.closest("sd-6-16-0-tab-group");
+    const tab = target.closest("sd-6-16-2-tab");
+    const tabGroup = tab == null ? void 0 : tab.closest("sd-6-16-2-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-16-0-tab");
-    const tabGroup = tab == null ? void 0 : tab.closest("sd-6-16-0-tab-group");
+    const tab = target.closest("sd-6-16-2-tab");
+    const tabGroup = tab == null ? void 0 : tab.closest("sd-6-16-2-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-16-0-tab") {
+      if ((activeEl == null ? void 0 : activeEl.tagName.toLowerCase()) === "sd-6-16-2-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-16-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-16-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(
+    )}" @click="${this.handleScrollToStart}"><sd-6-16-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-16-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(
       "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-16-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-16-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>`;
+    )}" @click="${this.handleScrollToEnd}"><sd-6-16-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-16-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>`;
   }
 };
 SdTabGroup.styles = [
   ...SolidElement.styles,
   css`/*! tailwindcss v4.2.1 | 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-16-0-tab-panel){--padding:1rem 0}::slotted(sd-6-16-0-tab-panel:focus-visible){outline-style:solid;outline-offset:2px;outline-width:2px;outline-color:rgba(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-16-2-tab-panel){--padding:1rem 0}::slotted(sd-6-16-2-tab-panel:focus-visible){outline-style:solid;outline-offset:2px;outline-width:2px;outline-color:rgba(var(--outline-color-primary))}`
 ];
 __decorateClass([
   query("[part=base]")
@@ -300,7 +300,7 @@ __decorateClass([
   debounce(20)
 ], SdTabGroup.prototype, "handleScroll", 1);
 SdTabGroup = __decorateClass([
-  customElement("sd-6-16-0-tab-group")
+  customElement("sd-6-16-2-tab-group")
 ], SdTabGroup);
 
 export {