@solid-design-system/components 5.16.1 → 5.16.2-next.0

package/dist/chunks/{chunk.DKBTK7VW.js → chunk.UG7ABG7Q.js}

@@ -1,7 +1,7 @@
 import {
   SolidElement,
   customElement
-} from "./chunk.PJJCHCFO.js";
+} from "./chunk.KPOYD3HP.js";
 import {
   __decorateClass
 } from "./chunk.S3NI7NKU.js";
@@ -51,7 +51,8 @@ var SdButtonGroup = class extends SolidElement {
 };
 SdButtonGroup.styles = [
   ...SolidElement.styles,
-  css`:host{display:inline-block}[part=base]{display:flex;flex-wrap:nowrap}`
+  css`/*! tailwindcss v4.1.14 | MIT License | https://tailwindcss.com */@layer theme,base,components,utilities;
+:host{display:inline-block}[part=base]{display:flex;flex-wrap:nowrap}`
 ];
 __decorateClass([
   query("slot")

package/dist/chunks/{chunk.RRDLKLEV.js → chunk.X5DOMMVJ.js}

@@ -27,7 +27,7 @@ import {
 import {
   SolidElement,
   customElement
-} from "./chunk.PJJCHCFO.js";
+} from "./chunk.KPOYD3HP.js";
 import {
   animateTo,
   stopAnimations
@@ -180,15 +180,16 @@ var SdDialog = class extends SolidElement {
     return html`<div part="base" class="${cx(
       "flex items-center justify-center fixed inset-0 z-dialog",
       this.hasSlotController.test("footer") && "dialog--has-footer"
-    )}"><div part="overlay" class="fixed inset-0 bg-primary-800 opacity-90" @click="${() => this.requestClose("overlay")}" tabindex="-1"></div><div part="panel" class="${cx(
-      "flex flex-col z-20 bg-white py-4 sm:py-8 relative gap-6 focus-visible:focus-outline-inverted overflow-y-auto",
+    )}"><div part="overlay" class="fixed inset-0 overlay-color-background opacity-90" @click="${() => this.requestClose("overlay")}" tabindex="-1"></div><div part="panel" class="${cx(
+      "panel-color-border border flex flex-col z-20 bg-white py-4 sm:py-8 relative gap-6 focus-visible:focus-outline-inverted overflow-y-auto",
       this.open && "flex opacity-100"
     )}" role="dialog" aria-modal="true" aria-hidden="${this.open ? "false" : "true"}" aria-label="${ifDefined(this.headline ? this.headline : void 0)}" aria-labelledby="${ifDefined(!this.headline ? "title" : void 0)}" tabindex="0"><header part="header" class="flex flex-grow-0 flex-shrink-0 basis-auto px-6 sm:px-10"><h2 part="title" class="flex-auto m-0" id="title">${this.headline.length > 0 ? html`<span class="sd-headline sd-headline--size-3xl leading-tight">${this.headline}</span>` : html`<slot name="headline"></slot>`}</h2>${!this.noCloseButton ? html`<sd-button part="close-button" variant="tertiary" exportparts="base:close-button__base" class="${cx("absolute top-2 right-2")}" name="x-lg" @click="${() => this.requestClose("close-button")}" type="button"><sd-icon label="${this.localize.term("close")}" name="close" library="_internal" color="currentColor"></sd-icon></sd-button>` : ""}</header><main part="body" class="flex flex-auto overflow-auto w-full px-6 sm:px-10"><slot></slot></main><footer part="footer" class="flex flex-grow-0 flex-shrink-0 basis-auto ml-auto gap-4 px-6 sm:px-10"><slot name="footer"></slot></footer></div></div>`;
   }
 };
 SdDialog.styles = [
   ...SolidElement.styles,
-  css`:host{--width:662px}[part=panel]{max-height:80vh;width:var(--width)}[part=body]{-webkit-overflow-scrolling:touch}@media (max-width:414px){:host{--width:335px}[part=body]{min-height:50px}[part=footer]{width:100%}}`
+  css`/*! tailwindcss v4.1.14 | MIT License | https://tailwindcss.com */@layer theme,base,components,utilities;
+:host{--width:662px}[part=panel]{width:var(--width);max-height:80vh}[part=body]{-webkit-overflow-scrolling:touch}@media (max-width:414px){:host{--width:335px}[part=body]{min-height:50px}[part=footer]{width:100%}}`
 ];
 __decorateClass([
   query('[part="base"]')

package/dist/chunks/{chunk.O7O2LFXK.js → chunk.X5F5FYN6.js}

@@ -16,7 +16,7 @@ import {
 import {
   SolidElement,
   customElement
-} from "./chunk.PJJCHCFO.js";
+} from "./chunk.KPOYD3HP.js";
 import {
   __decorateClass,
   __spreadValues
@@ -349,13 +349,13 @@ var SdInput = class extends SolidElement {
     const borderColor = {
       disabled: "border-neutral-500",
       visuallyDisabled: "border-neutral-500",
-      readonly: "border-neutral-800",
+      readonly: "form-control-color-border",
       activeInvalid: "border-error border-2",
       activeValid: "border-success border-2",
       active: "border-primary border-2",
       invalid: "border-error",
       valid: "border-success",
-      default: "border-neutral-800"
+      default: "form-control-color-border"
     }[inputState];
     const iconColor = this.disabled || this.visuallyDisabled ? "text-neutral-500" : "text-primary";
     const iconMarginLeft = { sm: "ml-1", md: "ml-2", lg: "ml-2" }[this.size];
@@ -381,11 +381,11 @@ var SdInput = class extends SolidElement {
       inputState === "disabled" || inputState === "visuallyDisabled" ? "text-neutral-500" : "text-black"
     )}">${slots["left"] ? html`<slot name="left" part="left" class="${cx("inline-flex", this.size === "sm" ? "mr-1" : "mr-2", iconColor, iconSize)}"></slot>` : ""} <input part="input" id="input" class="${cx(
       "min-w-0 flex-grow focus:outline-none bg-transparent",
-      this.visuallyDisabled || this.disabled ? "placeholder-neutral-500 cursor-not-allowed" : "placeholder-neutral-700",
+      this.visuallyDisabled || this.disabled ? "placeholder:text-neutral-500 cursor-not-allowed" : "placeholder:text-neutral-700",
       this.size === "sm" ? "h-6" : "h-8",
       textSize
     )}" type="${this.type === "password" && this.passwordVisible ? "text" : this.type}" title="${this.title}" name="${ifDefined(this.name)}" ?disabled="${this.disabled}" ?readonly="${this.readonly}" ?required="${this.required}" placeholder="${ifDefined(this.placeholder)}" minlength="${ifDefined(this.minlength)}" maxlength="${ifDefined(this.maxlength)}" min="${ifDefined(this.min)}" max="${ifDefined(this.max)}" step="${ifDefined(this.step)}" .value="${live(this.value)}" autocapitalize="${ifDefined(this.type === "password" ? "off" : this.autocapitalize)}" autocomplete="${// eslint-disable-next-line @typescript-eslint/no-explicit-any
-    ifDefined(this.autocomplete)}" autocorrect="${ifDefined(this.type === "password" ? "off" : this.autocorrect)}" ?autofocus="${this.autofocus}" spellcheck="${this.spellcheck}" pattern="${ifDefined(this.pattern)}" enterkeyhint="${ifDefined(this.enterkeyhint)}" inputmode="${ifDefined(this.inputmode)}" aria-describedby="help-text invalid-message" aria-disabled="${this.visuallyDisabled || this.disabled ? "true" : "false"}" aria-invalid="${this.showInvalidStyle}" @change="${this.handleChange}" @input="${this.handleInput}" @invalid="${this.handleInvalid}" @keydown="${this.handleKeyDown}" @focus="${this.handleFocus}" @blur="${this.handleBlur}"> ${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-icon class="${cx("text-neutral-700", iconSize)}" library="_internal" name="closing-round"></sd-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)}" type="button" @click="${this.handlePasswordToggle}">${this.passwordVisible ? html`<slot name="show-password-icon"><sd-icon class="${cx(iconColor, iconSize)}" library="_internal" name="eye"></sd-icon></slot>` : html`<slot name="hide-password-icon"><sd-icon class="${cx(iconColor, iconSize)}" library="_internal" name="eye-crossed-out"></sd-icon></slot>`}</button>` : ""} ${(this.type === "date" || this.type === "datetime-local") && !isFirefox ? html`<sd-icon class="${cx(iconColor, iconMarginLeft, iconSize)}" library="_internal" name="calendar"></sd-icon>` : ""} ${this.type === "time" ? html`<sd-icon class="${cx(iconColor, iconMarginLeft, iconSize)}" library="_internal" name="clock"></sd-icon>` : ""} ${this.type === "search" ? html`<button class="${cx("flex items-center sd-interactive", iconMarginLeft)}" type="button" @click="${this.handleSearchClick}"><sd-icon class="${cx(iconColor, iconSize)}" library="_internal" name="magnifying-glass" label="${this.localize.term("search")}"></sd-icon></button>` : ""} ${this.showInvalidStyle ? html`<sd-icon part="invalid-icon" class="${cx("text-error", iconMarginLeft, iconSize)}" library="_internal" name="risk"></sd-icon>` : ""} ${this.showValidStyle && this.styleOnValid ? html`<sd-icon class="${cx("text-success flex-shrink-0", iconMarginLeft, iconSize)}" library="_internal" name="confirm-circle" part="valid-icon"></sd-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"><slot name="decrement-number-stepper"><sd-icon name="system/minus-circle" label="Decrease value" class="${cx(iconColor, iconMarginLeft, iconSize)}"></sd-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-icon name="system/plus-circle" label="Decrease value" class="${cx(iconColor, iconMarginLeft, iconSize)}"></sd-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 ? "block" : "hidden")}" aria-hidden="${!hasHelpText}">${this.helpText}</slot></div>${this.formControlController.renderInvalidMessage()}`;
+    ifDefined(this.autocomplete)}" autocorrect="${ifDefined(this.type === "password" ? "off" : this.autocorrect)}" ?autofocus="${this.autofocus}" spellcheck="${this.spellcheck}" pattern="${ifDefined(this.pattern)}" enterkeyhint="${ifDefined(this.enterkeyhint)}" inputmode="${ifDefined(this.inputmode)}" aria-describedby="help-text invalid-message" aria-disabled="${this.visuallyDisabled || this.disabled ? "true" : "false"}" aria-invalid="${this.showInvalidStyle}" @change="${this.handleChange}" @input="${this.handleInput}" @invalid="${this.handleInvalid}" @keydown="${this.handleKeyDown}" @focus="${this.handleFocus}" @blur="${this.handleBlur}"> ${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-icon class="${cx("text-neutral-700", iconSize)}" library="_internal" name="closing-round"></sd-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)}" type="button" @click="${this.handlePasswordToggle}">${this.passwordVisible ? html`<slot name="show-password-icon"><sd-icon class="${cx(iconColor, iconSize)}" library="_internal" name="eye"></sd-icon></slot>` : html`<slot name="hide-password-icon"><sd-icon class="${cx(iconColor, iconSize)}" library="_internal" name="eye-crossed-out"></sd-icon></slot>`}</button>` : ""} ${(this.type === "date" || this.type === "datetime-local") && !isFirefox ? html`<sd-icon class="${cx(iconColor, iconMarginLeft, iconSize)}" library="_internal" name="calendar"></sd-icon>` : ""} ${this.type === "time" ? html`<sd-icon class="${cx(iconColor, iconMarginLeft, iconSize)}" library="_internal" name="clock"></sd-icon>` : ""} ${this.type === "search" ? html`<button class="${cx("flex items-center sd-interactive", iconMarginLeft)}" type="button" @click="${this.handleSearchClick}"><sd-icon class="${cx(iconColor, iconSize)}" library="_internal" name="magnifying-glass" label="${this.localize.term("search")}"></sd-icon></button>` : ""} ${this.showInvalidStyle ? html`<sd-icon part="invalid-icon" class="${cx("text-error", iconMarginLeft, iconSize)}" library="_internal" name="risk"></sd-icon>` : ""} ${this.showValidStyle && this.styleOnValid ? html`<sd-icon class="${cx("text-success flex-shrink-0", iconMarginLeft, iconSize)}" library="_internal" name="confirm-circle" part="valid-icon"></sd-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"><slot name="decrement-number-stepper"><sd-icon library="_internal" name="minus-circle" label="Decrease value" class="${cx(iconColor, iconMarginLeft, iconSize)}"></sd-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-icon library="_internal" name="plus-circle" label="Decrease value" class="${cx(iconColor, iconMarginLeft, iconSize)}"></sd-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 ? "block" : "hidden")}" aria-hidden="${!hasHelpText}">${this.helpText}</slot></div>${this.formControlController.renderInvalidMessage()}`;
   }
 };
 /**
@@ -393,7 +393,8 @@ var SdInput = class extends SolidElement {
  */
 SdInput.styles = [
   ...SolidElement.styles,
-  css`:host{box-sizing:border-box;display:inline-block;position:relative;text-align:left;width:100%}:host([vertical]){display:block}:host([required]) #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}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-icon{--tw-text-opacity:1;color:rgb(var(--sd-color-neutral-500,174 174 174)/var(--tw-text-opacity,1))}`
+  css`/*! tailwindcss v4.1.14 | 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]) #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}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-icon{color:var(--sd-color-text-neutral-500)}`
 ];
 __decorateClass([
   query("#input")

package/dist/chunks/{chunk.2SR73L2N.js → chunk.XE2RRGVH.js}

@@ -1,7 +1,7 @@
 import {
   SolidElement,
   customElement
-} from "./chunk.PJJCHCFO.js";
+} from "./chunk.KPOYD3HP.js";
 import {
   __decorateClass
 } from "./chunk.S3NI7NKU.js";
@@ -83,7 +83,8 @@ var SdMapMarker = class extends SolidElement {
  */
 SdMapMarker.styles = [
   ...SolidElement.styles,
-  css`:host{display:block}#motion-wrapper{mask-position:center;-webkit-mask-position:center;mask-repeat:no-repeat;-webkit-mask-repeat:no-repeat;mask-size:contain;-webkit-mask-size:contain}:host([variant=cluster]) [part=base],svg{width:calc(var(--sd-spacing-12,3rem)*var(--map-marker-scaling,1))}:host([variant=cluster]) [part=base]{height:calc(var(--sd-spacing-12,3rem)*var(--map-marker-scaling,1))}:host(:not([variant=cluster])) [part=base]{height:calc(var(--sd-spacing-16,4rem)*var(--map-marker-scaling,1))}:host([variant=cluster]) [part=content]{font-size:calc(var(--sd-font-size-sm,.875rem)*var(--map-marker-scaling,1))}:host([variant=place]) [part=content]{font-size:calc(var(--sd-font-size-3xl,2rem)*var(--map-marker-scaling,1));margin-top:calc(var(--sd-spacing-2,.5rem)*-1)}:host([variant=main]) [part=marker],:host([variant=place]) [part=marker]{--tw-drop-shadow:drop-shadow(var(--sd-shadow,0px 1px 3px #515151));filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}:host([variant=main]) #marker-circle{height:calc(var(--sd-spacing-4,1rem)*var(--map-marker-scaling,1));left:calc(var(--sd-spacing-4,1rem)*var(--map-marker-scaling,1));right:calc(var(--sd-spacing-4,1rem)*var(--map-marker-scaling,1));top:calc(var(--sd-spacing-4,1rem)*var(--map-marker-scaling,1));width:calc(var(--sd-spacing-4,1rem)*var(--map-marker-scaling,1))}`
+  css`/*! tailwindcss v4.1.14 | MIT License | https://tailwindcss.com */@layer properties;@layer theme,base,components,utilities;
+:host{display:block}#motion-wrapper{mask-repeat:no-repeat;-webkit-mask-repeat:no-repeat;mask-position:center;-webkit-mask-position:center;mask-size:contain;-webkit-mask-size:contain}:host([variant=cluster]) [part=base],svg{width:calc(var(--sd-spacing-12,3rem) * var(--map-marker-scaling,1))}:host([variant=cluster]) [part=base]{height:calc(var(--sd-spacing-12,3rem) * var(--map-marker-scaling,1))}:host(:not([variant=cluster])) [part=base]{height:calc(var(--sd-spacing-16,4rem) * var(--map-marker-scaling,1))}:host([variant=cluster]) [part=content]{font-size:calc(var(--sd-font-size-sm,.875rem) * var(--map-marker-scaling,1))}:host([variant=place]) [part=content]{margin-top:calc(var(--sd-spacing-2) * -1);font-size:calc(var(--sd-font-size-3xl,2rem) * var(--map-marker-scaling,1))}:host([variant=main]) [part=marker],:host([variant=place]) [part=marker]{--tw-drop-shadow-size:drop-shadow(var(--sd-drop-shadow));--tw-drop-shadow:drop-shadow(var(--sd-drop-shadow));filter:var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,)}:host([variant=main]) #marker-circle{width:calc(var(--sd-spacing-4,1rem) * var(--map-marker-scaling,1));height:calc(var(--sd-spacing-4,1rem) * var(--map-marker-scaling,1));left:calc(var(--sd-spacing-4,1rem) * var(--map-marker-scaling,1));right:calc(var(--sd-spacing-4,1rem) * var(--map-marker-scaling,1));top:calc(var(--sd-spacing-4,1rem) * var(--map-marker-scaling,1))}@property --tw-blur{syntax:"*";inherits:false}@property --tw-brightness{syntax:"*";inherits:false}@property --tw-contrast{syntax:"*";inherits:false}@property --tw-grayscale{syntax:"*";inherits:false}@property --tw-hue-rotate{syntax:"*";inherits:false}@property --tw-invert{syntax:"*";inherits:false}@property --tw-opacity{syntax:"*";inherits:false}@property --tw-saturate{syntax:"*";inherits:false}@property --tw-sepia{syntax:"*";inherits:false}@property --tw-drop-shadow{syntax:"*";inherits:false}@property --tw-drop-shadow-color{syntax:"*";inherits:false}@property --tw-drop-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-drop-shadow-size{syntax:"*";inherits:false}`
 ];
 __decorateClass([
   property({ type: String, reflect: true })

package/dist/chunks/{chunk.WV4BVBH5.js → chunk.Y4AVD2WJ.js}

@@ -4,7 +4,7 @@ import {
 import {
   SolidElement,
   customElement
-} from "./chunk.PJJCHCFO.js";
+} from "./chunk.KPOYD3HP.js";
 import {
   __decorateClass
 } from "./chunk.S3NI7NKU.js";
@@ -36,7 +36,8 @@ var SdTabPanel = class extends SolidElement {
 };
 SdTabPanel.styles = [
   ...SolidElement.styles,
-  css`:host{--padding:0;display:none}:host([active]){display:block}::part(base){padding:var(--padding)}`
+  css`/*! tailwindcss v4.1.14 | MIT License | https://tailwindcss.com */@layer theme,base,components,utilities;
+:host{--padding:0;display:none}:host([active]){display:block}::part(base){padding:var(--padding)}`
 ];
 __decorateClass([
   property({ type: String, reflect: true })

package/dist/chunks/{chunk.VCV7HS44.js → chunk.ZDLONKYZ.js}

@@ -4,7 +4,7 @@ import {
 import {
   SolidElement,
   customElement
-} from "./chunk.PJJCHCFO.js";
+} from "./chunk.KPOYD3HP.js";
 import {
   __decorateClass
 } from "./chunk.S3NI7NKU.js";
@@ -71,7 +71,7 @@ var SdRadio = class extends SolidElement {
   }
   render() {
     return html`<span part="base" class="${cx(
-      "sd-radio group inline-flex items-start items-center text-base leading-normal text-black cursor-pointer align-middle",
+      "sd-radio group flex items-center text-base leading-normal text-black cursor-pointer",
       (this.disabled || this.visuallyDisabled) && "hover:cursor-not-allowed",
       {
         /* sizes, fonts */
@@ -81,7 +81,7 @@ var SdRadio = class extends SolidElement {
       }[this.size]
     )}"><span part="${`${this.checked ? "control--checked" : "control--unchecked"}`}" class="${cx(
       "flex-initial shrink-0 relative inline-flex items-center justify-center border rounded-full bg-white h-4 w-4 duration-fast ease-in-out",
-      this.disabled || this.visuallyDisabled ? "border-neutral-500" : this.invalid ? "border-error hover:border-error-400 group-hover:border-error-400" : this.checked ? "border-accent hover:border-accent-550 group-hover:border-accent-550" : "border-neutral-800 hover:bg-neutral-200 group-hover:bg-neutral-200"
+      this.disabled || this.visuallyDisabled ? "border-neutral-500" : this.invalid ? "border-error hover:border-error-400 group-hover:border-error-400" : this.checked ? "border-accent hover:border-accent-550 group-hover:border-accent-550" : "form-control-color-border hover:bg-neutral-200 group-hover:bg-neutral-200"
     )}"><span part="checked" class="${cx(
       "rounded-full inline-flex text-white bg-accent h-2.5 w-2.5 transition-[transform, colors] duration-medium ease-in-out",
       this.checked ? "scale-100" : "scale-0",
@@ -97,7 +97,8 @@ var SdRadio = class extends SolidElement {
  */
 SdRadio.styles = [
   ...SolidElement.styles,
-  css`:host{display:block;width:-moz-max-content;width:max-content}:host(:focus-visible){outline:2px solid transparent;outline-offset:2px}:host(:focus-visible) [part=control--checked],:host(:focus-visible) [part=control--unchecked]{outline-color:rgb(var(--sd-color-primary,0 53 142)/1);outline-offset:2px;outline-style:solid;outline-width:2px}`
+  css`/*! tailwindcss v4.1.14 | MIT License | https://tailwindcss.com */@layer properties;@layer theme,base,components,utilities;
+:host{display:block;width:-moz-max-content;width:max-content}:host(:focus-visible){--tw-outline-style:none;outline-style:none}:host(:focus-visible) [part=control--checked],:host(:focus-visible) [part=control--unchecked]{outline-width:1px;outline-style:var(--tw-outline-style);outline-width:2px;outline-offset:2px;outline-color:var(--sd-border-color-primary,var(--sd-color-primary))}@property --tw-outline-style{syntax:"*";inherits:false;initial-value:solid}`
 ];
 __decorateClass([
   state()

package/dist/chunks/{chunk.4DHEQEYR.js → chunk.ZHMLJZFU.js}

@@ -7,7 +7,7 @@ import {
 import {
   SolidElement,
   customElement
-} from "./chunk.PJJCHCFO.js";
+} from "./chunk.KPOYD3HP.js";
 import {
   __decorateClass
 } from "./chunk.S3NI7NKU.js";
@@ -43,7 +43,8 @@ var SdBreadcrumbItem = class extends SolidElement {
 };
 SdBreadcrumbItem.styles = [
   ...SolidElement.styles,
-  css`:host{align-items:center;display:inline-flex}sd-link::part(base){align-items:center}sd-link::part(icon-left){display:inline-flex;margin-right:var(--sd-spacing-0,0)}sd-link sd-icon{margin:var(--sd-spacing-0,0)}:host([current]) sd-link::part(base){--tw-text-opacity:1;color:rgb(var(--sd-color-neutral-700,104 104 104)/var(--tw-text-opacity,1))}:host([current]) sd-link::part(label){text-decoration-line:none}`
+  css`/*! tailwindcss v4.1.14 | MIT License | https://tailwindcss.com */@layer theme,base,components,utilities;
+:host{display:inline-flex;align-items:center}sd-link::part(base){align-items:center}sd-link::part(icon-left){margin-right:calc(var(--sd-spacing-1) * 0);display:inline-flex}:host([current]) sd-link::part(base){color:var(--sd-color-text-neutral-700)}:host([current]) sd-link::part(label){text-decoration-line:none}`
 ];
 __decorateClass([
   query('[part="base"]')

package/dist/components/accordion/accordion.js

@@ -1,12 +1,12 @@
 import {
   SdAccordion
-} from "../../chunks/chunk.AQI2R5GT.js";
+} from "../../chunks/chunk.4VWYFR7Q.js";
 import "../../chunks/chunk.N4LHE3QK.js";
 import "../../chunks/chunk.B4BZKR24.js";
-import "../../chunks/chunk.QVBR2RUV.js";
-import "../../chunks/chunk.UVOGBJGP.js";
-import "../../chunks/chunk.7VPFFNHR.js";
-import "../../chunks/chunk.QSQRQKYT.js";
+import "../../chunks/chunk.B2V3A3FX.js";
+import "../../chunks/chunk.GYXMDYGY.js";
+import "../../chunks/chunk.KPAQRMCC.js";
+import "../../chunks/chunk.O6MXNSO7.js";
 import "../../chunks/chunk.4TPOL3LB.js";
 import "../../chunks/chunk.P52GZVKG.js";
 import "../../chunks/chunk.RPB53XXV.js";
@@ -14,7 +14,7 @@ import "../../chunks/chunk.X3FE7OHE.js";
 import "../../chunks/chunk.ID6DABAJ.js";
 import "../../chunks/chunk.3S7EW72P.js";
 import "../../chunks/chunk.X2OQMWGY.js";
-import "../../chunks/chunk.PJJCHCFO.js";
+import "../../chunks/chunk.KPOYD3HP.js";
 import "../../chunks/chunk.HQWAKJBV.js";
 import "../../chunks/chunk.S3NI7NKU.js";
 export {

package/dist/components/accordion-group/accordion-group.js

@@ -1,13 +1,13 @@
 import {
   SdAccordionGroup
-} from "../../chunks/chunk.44BJS2SJ.js";
-import "../../chunks/chunk.AQI2R5GT.js";
+} from "../../chunks/chunk.TCIKEWTO.js";
+import "../../chunks/chunk.4VWYFR7Q.js";
 import "../../chunks/chunk.N4LHE3QK.js";
 import "../../chunks/chunk.B4BZKR24.js";
-import "../../chunks/chunk.QVBR2RUV.js";
-import "../../chunks/chunk.UVOGBJGP.js";
-import "../../chunks/chunk.7VPFFNHR.js";
-import "../../chunks/chunk.QSQRQKYT.js";
+import "../../chunks/chunk.B2V3A3FX.js";
+import "../../chunks/chunk.GYXMDYGY.js";
+import "../../chunks/chunk.KPAQRMCC.js";
+import "../../chunks/chunk.O6MXNSO7.js";
 import "../../chunks/chunk.4TPOL3LB.js";
 import "../../chunks/chunk.P52GZVKG.js";
 import "../../chunks/chunk.RPB53XXV.js";
@@ -15,7 +15,7 @@ import "../../chunks/chunk.X3FE7OHE.js";
 import "../../chunks/chunk.ID6DABAJ.js";
 import "../../chunks/chunk.3S7EW72P.js";
 import "../../chunks/chunk.X2OQMWGY.js";
-import "../../chunks/chunk.PJJCHCFO.js";
+import "../../chunks/chunk.KPOYD3HP.js";
 import "../../chunks/chunk.HQWAKJBV.js";
 import "../../chunks/chunk.S3NI7NKU.js";
 export {

package/dist/components/animation/animation.js

@@ -1,9 +1,9 @@
 import {
   SdAnimation
-} from "../../chunks/chunk.PB672B5H.js";
+} from "../../chunks/chunk.CSGRFVC4.js";
 import "../../chunks/chunk.TJOP7HQP.js";
 import "../../chunks/chunk.X2OQMWGY.js";
-import "../../chunks/chunk.PJJCHCFO.js";
+import "../../chunks/chunk.KPOYD3HP.js";
 import "../../chunks/chunk.HQWAKJBV.js";
 import "../../chunks/chunk.S3NI7NKU.js";
 export {

package/dist/components/audio/audio.d.ts

@@ -47,6 +47,7 @@ export default class SdAudio extends SolidElement {
     private showTranscript;
     private showTranscriptKeydown;
     private rgbToHex;
+    onThemeChange(): void;
     private initAnimation;
     private drawStillWaves;
     private stopAnimation;

package/dist/components/audio/audio.js

@@ -1,21 +1,21 @@
 import {
   SdAudio
-} from "../../chunks/chunk.QV5WLO4L.js";
-import "../../chunks/chunk.G4FXGRRH.js";
+} from "../../chunks/chunk.CNC35623.js";
+import "../../chunks/chunk.B2OI7BBP.js";
 import "../../chunks/chunk.SF6AUNJF.js";
 import "../../chunks/chunk.EDMG7C5H.js";
 import "../../chunks/chunk.UMIKFOMI.js";
 import "../../chunks/chunk.WDWV53JP.js";
-import "../../chunks/chunk.AXFVYO5L.js";
-import "../../chunks/chunk.4VTG7PRD.js";
+import "../../chunks/chunk.4VCWVPDC.js";
+import "../../chunks/chunk.QXA4KBMD.js";
 import "../../chunks/chunk.XCQC3F3H.js";
 import "../../chunks/chunk.IVMQWO2L.js";
 import "../../chunks/chunk.N4LHE3QK.js";
 import "../../chunks/chunk.B4BZKR24.js";
-import "../../chunks/chunk.QVBR2RUV.js";
-import "../../chunks/chunk.UVOGBJGP.js";
-import "../../chunks/chunk.7VPFFNHR.js";
-import "../../chunks/chunk.QSQRQKYT.js";
+import "../../chunks/chunk.B2V3A3FX.js";
+import "../../chunks/chunk.GYXMDYGY.js";
+import "../../chunks/chunk.KPAQRMCC.js";
+import "../../chunks/chunk.O6MXNSO7.js";
 import "../../chunks/chunk.4TPOL3LB.js";
 import "../../chunks/chunk.P52GZVKG.js";
 import "../../chunks/chunk.RPB53XXV.js";
@@ -23,7 +23,7 @@ import "../../chunks/chunk.X3FE7OHE.js";
 import "../../chunks/chunk.ID6DABAJ.js";
 import "../../chunks/chunk.3S7EW72P.js";
 import "../../chunks/chunk.X2OQMWGY.js";
-import "../../chunks/chunk.PJJCHCFO.js";
+import "../../chunks/chunk.KPOYD3HP.js";
 import "../../chunks/chunk.HQWAKJBV.js";
 import "../../chunks/chunk.POFWU6ZT.js";
 import "../../chunks/chunk.S3NI7NKU.js";

package/dist/components/badge/badge.js

@@ -1,7 +1,7 @@
 import {
   SdBadge
-} from "../../chunks/chunk.7YENJBA2.js";
-import "../../chunks/chunk.PJJCHCFO.js";
+} from "../../chunks/chunk.GY73LR3S.js";
+import "../../chunks/chunk.KPOYD3HP.js";
 import "../../chunks/chunk.HQWAKJBV.js";
 import "../../chunks/chunk.S3NI7NKU.js";
 export {

package/dist/components/brandshape/brandshape.js

@@ -1,7 +1,7 @@
 import {
   SdBrandshape
-} from "../../chunks/chunk.72VNUTTV.js";
-import "../../chunks/chunk.PJJCHCFO.js";
+} from "../../chunks/chunk.LQJSNWYP.js";
+import "../../chunks/chunk.KPOYD3HP.js";
 import "../../chunks/chunk.HQWAKJBV.js";
 import "../../chunks/chunk.S3NI7NKU.js";
 export {

package/dist/components/breadcrumb/breadcrumb.js

@@ -1,10 +1,10 @@
 import {
   SdBreadcrumb
-} from "../../chunks/chunk.XU2JEV5G.js";
+} from "../../chunks/chunk.GXJOE2HU.js";
 import "../../chunks/chunk.X3FE7OHE.js";
 import "../../chunks/chunk.ID6DABAJ.js";
 import "../../chunks/chunk.3S7EW72P.js";
-import "../../chunks/chunk.PJJCHCFO.js";
+import "../../chunks/chunk.KPOYD3HP.js";
 import "../../chunks/chunk.HQWAKJBV.js";
 import "../../chunks/chunk.S3NI7NKU.js";
 export {

package/dist/components/breadcrumb-item/breadcrumb-item.js

@@ -1,11 +1,11 @@
 import {
   SdBreadcrumbItem
-} from "../../chunks/chunk.4DHEQEYR.js";
+} from "../../chunks/chunk.ZHMLJZFU.js";
 import "../../chunks/chunk.X3FE7OHE.js";
 import "../../chunks/chunk.ID6DABAJ.js";
 import "../../chunks/chunk.3S7EW72P.js";
 import "../../chunks/chunk.X2OQMWGY.js";
-import "../../chunks/chunk.PJJCHCFO.js";
+import "../../chunks/chunk.KPOYD3HP.js";
 import "../../chunks/chunk.HQWAKJBV.js";
 import "../../chunks/chunk.S3NI7NKU.js";
 export {

package/dist/components/button/button.js

@@ -1,14 +1,14 @@
 import {
   SdButton
-} from "../../chunks/chunk.AXFVYO5L.js";
-import "../../chunks/chunk.4VTG7PRD.js";
+} from "../../chunks/chunk.4VCWVPDC.js";
+import "../../chunks/chunk.QXA4KBMD.js";
 import "../../chunks/chunk.XCQC3F3H.js";
 import "../../chunks/chunk.IVMQWO2L.js";
 import "../../chunks/chunk.X3FE7OHE.js";
 import "../../chunks/chunk.ID6DABAJ.js";
 import "../../chunks/chunk.3S7EW72P.js";
 import "../../chunks/chunk.X2OQMWGY.js";
-import "../../chunks/chunk.PJJCHCFO.js";
+import "../../chunks/chunk.KPOYD3HP.js";
 import "../../chunks/chunk.HQWAKJBV.js";
 import "../../chunks/chunk.S3NI7NKU.js";
 export {

package/dist/components/button-group/button-group.js

@@ -1,7 +1,7 @@
 import {
   SdButtonGroup
-} from "../../chunks/chunk.DKBTK7VW.js";
-import "../../chunks/chunk.PJJCHCFO.js";
+} from "../../chunks/chunk.UG7ABG7Q.js";
+import "../../chunks/chunk.KPOYD3HP.js";
 import "../../chunks/chunk.HQWAKJBV.js";
 import "../../chunks/chunk.S3NI7NKU.js";
 export {

package/dist/components/carousel/carousel.js

@@ -1,16 +1,16 @@
 import {
   SdCarousel
-} from "../../chunks/chunk.7MXI26GR.js";
+} from "../../chunks/chunk.JY6FHQV4.js";
 import "../../chunks/chunk.W2YDXTG5.js";
 import "../../chunks/chunk.FNYEXUNK.js";
 import "../../chunks/chunk.NOWCQZBS.js";
-import "../../chunks/chunk.GUZQ4ADZ.js";
+import "../../chunks/chunk.TBWF2AZD.js";
 import "../../chunks/chunk.F4VGSDIW.js";
 import "../../chunks/chunk.B4BZKR24.js";
-import "../../chunks/chunk.QVBR2RUV.js";
-import "../../chunks/chunk.UVOGBJGP.js";
-import "../../chunks/chunk.7VPFFNHR.js";
-import "../../chunks/chunk.QSQRQKYT.js";
+import "../../chunks/chunk.B2V3A3FX.js";
+import "../../chunks/chunk.GYXMDYGY.js";
+import "../../chunks/chunk.KPAQRMCC.js";
+import "../../chunks/chunk.O6MXNSO7.js";
 import "../../chunks/chunk.4TPOL3LB.js";
 import "../../chunks/chunk.P52GZVKG.js";
 import "../../chunks/chunk.RPB53XXV.js";
@@ -18,7 +18,7 @@ import "../../chunks/chunk.X3FE7OHE.js";
 import "../../chunks/chunk.ID6DABAJ.js";
 import "../../chunks/chunk.3S7EW72P.js";
 import "../../chunks/chunk.X2OQMWGY.js";
-import "../../chunks/chunk.PJJCHCFO.js";
+import "../../chunks/chunk.KPOYD3HP.js";
 import "../../chunks/chunk.HQWAKJBV.js";
 import "../../chunks/chunk.S3NI7NKU.js";
 export {

package/dist/components/carousel-item/carousel-item.js

@@ -1,7 +1,7 @@
 import {
   SdCarouselItem
-} from "../../chunks/chunk.GUZQ4ADZ.js";
-import "../../chunks/chunk.PJJCHCFO.js";
+} from "../../chunks/chunk.TBWF2AZD.js";
+import "../../chunks/chunk.KPOYD3HP.js";
 import "../../chunks/chunk.HQWAKJBV.js";
 import "../../chunks/chunk.S3NI7NKU.js";
 export {

package/dist/components/checkbox/checkbox.js

@@ -1,17 +1,17 @@
 import {
   SdCheckbox
-} from "../../chunks/chunk.QL6JHFGU.js";
+} from "../../chunks/chunk.DPUEJBCS.js";
 import "../../chunks/chunk.GI7VDIWX.js";
 import "../../chunks/chunk.XCQC3F3H.js";
-import "../../chunks/chunk.QVBR2RUV.js";
-import "../../chunks/chunk.UVOGBJGP.js";
-import "../../chunks/chunk.7VPFFNHR.js";
-import "../../chunks/chunk.QSQRQKYT.js";
+import "../../chunks/chunk.B2V3A3FX.js";
+import "../../chunks/chunk.GYXMDYGY.js";
+import "../../chunks/chunk.KPAQRMCC.js";
+import "../../chunks/chunk.O6MXNSO7.js";
 import "../../chunks/chunk.4TPOL3LB.js";
 import "../../chunks/chunk.P52GZVKG.js";
 import "../../chunks/chunk.RPB53XXV.js";
 import "../../chunks/chunk.X2OQMWGY.js";
-import "../../chunks/chunk.PJJCHCFO.js";
+import "../../chunks/chunk.KPOYD3HP.js";
 import "../../chunks/chunk.HQWAKJBV.js";
 import "../../chunks/chunk.S3NI7NKU.js";
 export {

package/dist/components/checkbox-group/checkbox-group.js

@@ -1,16 +1,16 @@
 import {
   SdCheckboxGroup
-} from "../../chunks/chunk.UKB75H6A.js";
+} from "../../chunks/chunk.N6SDJ5F4.js";
 import "../../chunks/chunk.IVMQWO2L.js";
-import "../../chunks/chunk.QVBR2RUV.js";
-import "../../chunks/chunk.UVOGBJGP.js";
-import "../../chunks/chunk.7VPFFNHR.js";
-import "../../chunks/chunk.QSQRQKYT.js";
+import "../../chunks/chunk.B2V3A3FX.js";
+import "../../chunks/chunk.GYXMDYGY.js";
+import "../../chunks/chunk.KPAQRMCC.js";
+import "../../chunks/chunk.O6MXNSO7.js";
 import "../../chunks/chunk.4TPOL3LB.js";
 import "../../chunks/chunk.P52GZVKG.js";
 import "../../chunks/chunk.RPB53XXV.js";
 import "../../chunks/chunk.X2OQMWGY.js";
-import "../../chunks/chunk.PJJCHCFO.js";
+import "../../chunks/chunk.KPOYD3HP.js";
 import "../../chunks/chunk.HQWAKJBV.js";
 import "../../chunks/chunk.S3NI7NKU.js";
 export {

package/dist/components/combobox/combobox.js

@@ -1,8 +1,8 @@
 import {
   SdCombobox
-} from "../../chunks/chunk.ZSD3BEVL.js";
-import "../../chunks/chunk.VZBVZB3D.js";
-import "../../chunks/chunk.2CAP3Q56.js";
+} from "../../chunks/chunk.5TXUJJY7.js";
+import "../../chunks/chunk.MFEFWNU4.js";
+import "../../chunks/chunk.JFYEW3KW.js";
 import "../../chunks/chunk.GI7VDIWX.js";
 import "../../chunks/chunk.WBJBQ4QI.js";
 import "../../chunks/chunk.UIQBHPD3.js";
@@ -11,10 +11,10 @@ import "../../chunks/chunk.XCQC3F3H.js";
 import "../../chunks/chunk.IVMQWO2L.js";
 import "../../chunks/chunk.N4LHE3QK.js";
 import "../../chunks/chunk.B4BZKR24.js";
-import "../../chunks/chunk.QVBR2RUV.js";
-import "../../chunks/chunk.UVOGBJGP.js";
-import "../../chunks/chunk.7VPFFNHR.js";
-import "../../chunks/chunk.QSQRQKYT.js";
+import "../../chunks/chunk.B2V3A3FX.js";
+import "../../chunks/chunk.GYXMDYGY.js";
+import "../../chunks/chunk.KPAQRMCC.js";
+import "../../chunks/chunk.O6MXNSO7.js";
 import "../../chunks/chunk.4TPOL3LB.js";
 import "../../chunks/chunk.P52GZVKG.js";
 import "../../chunks/chunk.RPB53XXV.js";
@@ -22,7 +22,7 @@ import "../../chunks/chunk.X3FE7OHE.js";
 import "../../chunks/chunk.ID6DABAJ.js";
 import "../../chunks/chunk.3S7EW72P.js";
 import "../../chunks/chunk.X2OQMWGY.js";
-import "../../chunks/chunk.PJJCHCFO.js";
+import "../../chunks/chunk.KPOYD3HP.js";
 import "../../chunks/chunk.HQWAKJBV.js";
 import "../../chunks/chunk.S3NI7NKU.js";
 export {

package/dist/components/datepicker/datepicker.d.ts

@@ -84,7 +84,7 @@ export default class SdDatepicker extends SolidElement implements SolidFormContr
     private digitIndexToDmyCaretPos;
     private countDigitsBeforeCaret;
     private handleOutsideClick;
-    show(): void;
+    show(): undefined;
     hide(): void;
     private onFocusIn;
     private handleMouseDown;

package/dist/components/datepicker/datepicker.js

@@ -1,6 +1,6 @@
 import {
   SdDatepicker
-} from "../../chunks/chunk.GTISTGG6.js";
+} from "../../chunks/chunk.35CDD4AI.js";
 import "../../chunks/chunk.CDM2I6O2.js";
 import "../../chunks/chunk.XCQC3F3H.js";
 import "../../chunks/chunk.IVMQWO2L.js";
@@ -8,7 +8,7 @@ import "../../chunks/chunk.X3FE7OHE.js";
 import "../../chunks/chunk.ID6DABAJ.js";
 import "../../chunks/chunk.3S7EW72P.js";
 import "../../chunks/chunk.X2OQMWGY.js";
-import "../../chunks/chunk.PJJCHCFO.js";
+import "../../chunks/chunk.KPOYD3HP.js";
 import "../../chunks/chunk.HQWAKJBV.js";
 import "../../chunks/chunk.S3NI7NKU.js";
 export {