@solid-design-system/components 6.29.1 → 6.30.0

package/dist/web-types.json

@@ -1,7 +1,7 @@
 {
   "$schema": "https://raw.githubusercontent.com/JetBrains/web-types/master/schema/web-types.json",
   "name": "@solid-design-system/components",
-  "version": "6.29.1",
+  "version": "6.30.0",
   "description-markup": "markdown",
   "contributions": {
     "html": {
@@ -2994,6 +2994,294 @@
             ]
           }
         },
+        {
+          "name": "sd-file-selector",
+          "description": "Used to select a file by clicking or dragging a file into a drop-area.\n---\n\n\n### **Events:**\n - **sd-blur** - Emitted when the control loses focus.\n- **sd-change** - Emitted when an alteration to the control's value is committed by the user.\n- **sd-error** - Emitted when multiple files are selected via drag and drop, without the `multiple` property being set.\n- **sd-focus** - Emitted when the control gains focus.\n- **sd-input** - Emitted when the control receives input.\n\n### **Methods:**\n - **checkValidity()** - Checks for validity but does not show a validation message. Returns `true` when valid and `false` when invalid.\n- **reportValidity()** - Checks for validity and shows the browser's validation message if the control is invalid.\n- **setCustomValidity(message: _string_)** - Sets a custom validation message. Pass an empty string to restore validity.\n- **emit(name: _string_, options: _CustomEventInit_)** - Emits a custom event with more convenient defaults.\n- **token(name: _string_, fallback: _T_): _T_** - Retrieves the value of a css variable token.\n\n### **Slots:**\n - **label** - The file selector's label. Alternatively, you can use the `label` attribute.\n- **help-text** - Text that describes how to use the file selector. Alternatively, you can use the `help-text` attribute.\n\n### **CSS Properties:**\n - **--sd-form-control-border-radius** - The border radius of the file selector. _(default: undefined)_\n- **--sd-form-control-color-border** - The border color of the file selector. _(default: undefined)_\n\n### **CSS Parts:**\n - **form-control** - The form control that wraps the label, input, and help text.\n- **form-control-label** - The label's wrapper.\n- **form-control-input** - The input's wrapper.\n- **form-control-help-text** - The help text's wrapper.\n- **button-wrapper** - The wrapper around the button and text value.\n- **button** - The sd-button acting as a file input trigger.\n- **value** - The chosen files or placeholder text for the file input.\n- **droparea** - The element wrapping the drop zone.\n- **droparea-background** - The background of the drop zone.\n- **droparea-icon** - The container that wraps the icon for the drop zone.\n- **droparea-value** - The text for the drop zone.\n- **invalid-icon-message** - The container that wraps the invalid icon and message.\n- **invalid-icon** - The invalid icon.\n- **invalid-message** - The invalid message.",
+          "doc-url": "",
+          "attributes": [
+            {
+              "name": "files",
+              "description": "The selected files as a `FileList` object. The `FileList` behaves like an array, so you can get the number of\nselected files via its `length` property.",
+              "value": { "type": "string" }
+            },
+            {
+              "name": "name",
+              "description": "The name of the file selector, submitted as a name/value pair with form data.",
+              "value": { "type": "string", "default": "''" }
+            },
+            {
+              "name": "title",
+              "description": "The `title` attribute specifies extra information about an element most often as a default browser tooltip text when the mouse moves over the element.",
+              "value": { "type": "string", "default": "''" }
+            },
+            {
+              "name": "value",
+              "description": "The value of the file selector contains a string that represents the path of the selected file. If multiple\nfiles are selected, the value represents the first file in the list. The only valid value when setting a file\ninput is an empty string.",
+              "value": { "type": "string" }
+            },
+            {
+              "name": "size",
+              "description": "The file selector's size.",
+              "value": { "type": "'sm' | 'md' | 'lg'", "default": "'lg'" }
+            },
+            {
+              "name": "label",
+              "description": "The file selector's label, this field is required to ensure accessibility. It is visually hidden by default, use the `showLabel` property to display it.",
+              "value": { "type": "string", "default": "''" }
+            },
+            {
+              "name": "show-label",
+              "description": "Visually displays the file selector's label.",
+              "value": { "type": "boolean", "default": "false" }
+            },
+            {
+              "name": "help-text",
+              "description": "The file selector's help text. If you need to display HTML, use the `help-text` slot instead.",
+              "value": { "type": "string", "default": "''" }
+            },
+            {
+              "name": "disabled",
+              "description": "Disables the file selector.",
+              "value": { "type": "boolean", "default": "false" }
+            },
+            {
+              "name": "visually-disabled",
+              "description": "Styles the input as if it was disabled and enables aria-disabled",
+              "value": { "type": "boolean", "default": "false" }
+            },
+            {
+              "name": "drop-area",
+              "description": "Draw the file selector as a drop area.",
+              "value": { "type": "boolean", "default": "false" }
+            },
+            {
+              "name": "accept",
+              "description": "Comma-separated list of supported file types (e.g. `.jpg,.png,image/*`).",
+              "value": { "type": "string", "default": "''" }
+            },
+            {
+              "name": "style-on-valid",
+              "description": "Shows success styles if the validity of the input is valid.",
+              "value": { "type": "boolean", "default": "false" }
+            },
+            {
+              "name": "capture",
+              "description": "Specifies which camera to use for capture of image or video data. Works only when not using a droparea.",
+              "value": { "type": "'user' | 'environment'" }
+            },
+            {
+              "name": "multiple",
+              "description": "Indicates whether the user can select more than one file. Has no effect if `webkitdirectory` is set.",
+              "value": { "type": "boolean", "default": "false" }
+            },
+            {
+              "name": "webkitdirectory",
+              "description": "Indicates that the file selector should let the user select directories instead of files. Non-standard, but\nsupported by all major browsers.",
+              "value": { "type": "boolean", "default": "false" }
+            },
+            {
+              "name": "form",
+              "description": "By default, form controls are associated with the nearest containing `<form>` element. This attribute allows you\nto place the form control outside of a form and associate it with the form that has this `id`. The form must be in\nthe same document or shadow root for this to work.",
+              "value": { "type": "string", "default": "''" }
+            },
+            {
+              "name": "required",
+              "description": "Makes the input a required field.",
+              "value": { "type": "boolean", "default": "false" }
+            },
+            {
+              "name": "hide-value",
+              "description": "Suppresses the value from being displayed in the file selector.",
+              "value": { "type": "boolean", "default": "false" }
+            },
+            {
+              "name": "dir",
+              "description": "The element's directionality.",
+              "value": { "type": "'ltr' | 'rtl' | 'auto'" }
+            },
+            {
+              "name": "lang",
+              "description": "The element's language.",
+              "value": { "type": "string" }
+            }
+          ],
+          "slots": [
+            {
+              "name": "label",
+              "description": "The file selector's label. Alternatively, you can use the `label` attribute."
+            },
+            {
+              "name": "help-text",
+              "description": "Text that describes how to use the file selector. Alternatively, you can use the `help-text` attribute."
+            }
+          ],
+          "events": [
+            {
+              "name": "sd-blur",
+              "description": "Emitted when the control loses focus."
+            },
+            {
+              "name": "sd-change",
+              "description": "Emitted when an alteration to the control's value is committed by the user."
+            },
+            {
+              "name": "sd-error",
+              "description": "Emitted when multiple files are selected via drag and drop, without the `multiple` property being set."
+            },
+            {
+              "name": "sd-focus",
+              "description": "Emitted when the control gains focus."
+            },
+            {
+              "name": "sd-input",
+              "description": "Emitted when the control receives input."
+            }
+          ],
+          "js": {
+            "properties": [
+              { "name": "localize" },
+              {
+                "name": "files",
+                "description": "The selected files as a `FileList` object. The `FileList` behaves like an array, so you can get the number of\nselected files via its `length` property."
+              },
+              {
+                "name": "name",
+                "description": "The name of the file selector, submitted as a name/value pair with form data.",
+                "type": "string"
+              },
+              {
+                "name": "title",
+                "description": "The `title` attribute specifies extra information about an element most often as a default browser tooltip text when the mouse moves over the element.",
+                "type": "string"
+              },
+              {
+                "name": "value",
+                "description": "The value of the file selector contains a string that represents the path of the selected file. If multiple\nfiles are selected, the value represents the first file in the list. The only valid value when setting a file\ninput is an empty string."
+              },
+              {
+                "name": "defaultValue",
+                "description": "The default value of the form control. Primarily used for resetting the form control.",
+                "type": "string"
+              },
+              {
+                "name": "size",
+                "description": "The file selector's size.",
+                "type": "'sm' | 'md' | 'lg'"
+              },
+              {
+                "name": "label",
+                "description": "The file selector's label, this field is required to ensure accessibility. It is visually hidden by default, use the `showLabel` property to display it.",
+                "type": "string"
+              },
+              {
+                "name": "showLabel",
+                "description": "Visually displays the file selector's label.",
+                "type": "boolean"
+              },
+              {
+                "name": "helpText",
+                "description": "The file selector's help text. If you need to display HTML, use the `help-text` slot instead.",
+                "type": "string"
+              },
+              {
+                "name": "disabled",
+                "description": "Disables the file selector.",
+                "type": "boolean"
+              },
+              {
+                "name": "visuallyDisabled",
+                "description": "Styles the input as if it was disabled and enables aria-disabled",
+                "type": "boolean"
+              },
+              {
+                "name": "droparea",
+                "description": "Draw the file selector as a drop area.",
+                "type": "boolean"
+              },
+              {
+                "name": "accept",
+                "description": "Comma-separated list of supported file types (e.g. `.jpg,.png,image/*`).",
+                "type": "string"
+              },
+              {
+                "name": "styleOnValid",
+                "description": "Shows success styles if the validity of the input is valid.",
+                "type": "boolean"
+              },
+              {
+                "name": "capture",
+                "description": "Specifies which camera to use for capture of image or video data. Works only when not using a droparea.",
+                "type": "'user' | 'environment'"
+              },
+              {
+                "name": "multiple",
+                "description": "Indicates whether the user can select more than one file. Has no effect if `webkitdirectory` is set.",
+                "type": "boolean"
+              },
+              {
+                "name": "webkitdirectory",
+                "description": "Indicates that the file selector should let the user select directories instead of files. Non-standard, but\nsupported by all major browsers.",
+                "type": "boolean"
+              },
+              {
+                "name": "form",
+                "description": "By default, form controls are associated with the nearest containing `<form>` element. This attribute allows you\nto place the form control outside of a form and associate it with the form that has this `id`. The form must be in\nthe same document or shadow root for this to work.",
+                "type": "string"
+              },
+              {
+                "name": "required",
+                "description": "Makes the input a required field.",
+                "type": "boolean"
+              },
+              {
+                "name": "hideValue",
+                "description": "Suppresses the value from being displayed in the file selector.",
+                "type": "boolean"
+              },
+              { "name": "button", "type": "SdButton" },
+              {
+                "name": "validity",
+                "description": "Gets the validity state object."
+              },
+              {
+                "name": "validationMessage",
+                "description": "Gets the validation message."
+              },
+              {
+                "name": "dir",
+                "description": "The element's directionality.",
+                "type": "'ltr' | 'rtl' | 'auto'"
+              },
+              {
+                "name": "lang",
+                "description": "The element's language.",
+                "type": "string"
+              }
+            ],
+            "events": [
+              {
+                "name": "sd-blur",
+                "description": "Emitted when the control loses focus."
+              },
+              {
+                "name": "sd-change",
+                "description": "Emitted when an alteration to the control's value is committed by the user."
+              },
+              {
+                "name": "sd-error",
+                "description": "Emitted when multiple files are selected via drag and drop, without the `multiple` property being set."
+              },
+              {
+                "name": "sd-focus",
+                "description": "Emitted when the control gains focus."
+              },
+              {
+                "name": "sd-input",
+                "description": "Emitted when the control receives input."
+              }
+            ]
+          }
+        },
         {
           "name": "sd-flipcard",
           "description": "Used to display content on both sides of a card by presenting information on one side and revealing additional information when flipped.\n---\n\n\n### **Events:**\n - **sd-flip-front** - Emmited when the front face of the flipcard is clicked.\n- **sd-flip-back** - Emmited when the back face of the flipcard is clicked.\n\n### **Methods:**\n - **emit(name: _string_, options: _CustomEventInit_)** - Emits a custom event with more convenient defaults.\n- **token(name: _string_, fallback: _T_): _T_** - Retrieves the value of a css variable token.\n\n### **Slots:**\n - **front** - The front face of the flipcard.\n- **back** - The back face of the flipcard.\n- **media-front** - An optional media slot which can be as a background. Dependent from gradient variant.\n- **media-back** - An optional media slot which can be as a background. Dependent from gradient variant.\n\n### **CSS Properties:**\n - **--name** - Description of the flipcard. _(default: undefined)_\n- **--height** - Use this property to set the height of the flipcard. _(default: undefined)_\n- **--sd-informational-gradient--primary-800-color-background** - The color used in the gradient of the flipcard when the `gradient-dark` variant is used. By default, it uses the `--sd-color-primary-800` color. _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.\n- **front** - The container that wraps the front-side of the flipcard.\n- **back** - The container that wraps the back-side of the flipcard.\n- **front-button** - The button that flips the flipcard to the back.\n- **back-button** - The button that flips the flipcard to the front.\n- **front-interactive-container** - The container that wraps the front side and the flip button.\n- **back-interactive-container** - The container that wraps the back side and the flip button.\n- **front-slot-container** - The container that wraps the front slot.\n- **back-slot-container** - The container that wraps the back slot.\n- **media-front** - The container that wraps the media-front slot.\n- **media-back** - The container that wraps the media-back slot.\n- **front-secondary-gradient** - The container that wraps the secondary gradient of the front side.\n- **back-secondary-gradient** - The container that wraps the secondary gradient of the back side.",

package/dist-versioned/chunks/{chunk.L3QZLYWI.js → chunk.2DGYIFDJ.js}

@@ -7,7 +7,7 @@ import {
 import {
   SolidElement,
   customElement
-} from "./chunk.T73O2TL3.js";
+} from "./chunk.RT3GEKSF.js";
 import {
   __decorateClass
 } from "./chunk.S3NI7NKU.js";
@@ -91,14 +91,14 @@ var SdOption = class extends SolidElement {
       this.disabled && "border-neutral-500 top-1",
       !this.disabled && this.hasHover ? "h-full top-0" : "top-1"
     )}"></span> ${this.checkbox ? html`<span id="control" part="control ${this.selected ? " control--checked" : "control--unchecked"}" class="${cx(
-      "relative flex flex-shrink-0 items-center justify-center border sd-6-29-1-checkbox-border-width rounded-sm h-4 w-4 mr-2",
+      "relative flex flex-shrink-0 items-center justify-center border sd-6-30-0-checkbox-border-width rounded-sm h-4 w-4 mr-2",
       {
         sm: "mt-0.5",
         md: "mt-1",
         lg: "mt-1"
       }[this.size],
-      this.disabled ? "sd-6-29-1-option--disabled-color-border" : this.selected ? "bg-accent border-accent" : "bg-white form-control-color-border"
-    )}">${this.selected ? html`<sd-6-29-1-icon part="checked-icon" class="text-white w-3 h-3" library="_internal" name="status-check"></sd-6-29-1-icon>` : ""}</span>` : ""} ${slots["left"] ? html`<slot name="left" part="left" class="inline-flex mr-2"></slot>` : ""}<slot part="label" class="inline-block flex-grow" @slotchange="${this.handleDefaultSlotChange}"></slot>${slots["right"] ? html`<slot name="right" part="right" class="inline-flex ml-2"></slot>` : ""}</div>`;
+      this.disabled ? "sd-6-30-0-option--disabled-color-border" : this.selected ? "bg-accent border-accent" : "bg-white form-control-color-border"
+    )}">${this.selected ? html`<sd-6-30-0-icon part="checked-icon" class="text-white w-3 h-3" library="_internal" name="status-check"></sd-6-30-0-icon>` : ""}</span>` : ""} ${slots["left"] ? html`<slot name="left" part="left" class="inline-flex mr-2"></slot>` : ""}<slot part="label" class="inline-block flex-grow" @slotchange="${this.handleDefaultSlotChange}"></slot>${slots["right"] ? html`<slot name="right" part="right" class="inline-flex ml-2"></slot>` : ""}</div>`;
   }
 };
 /**
@@ -107,7 +107,7 @@ var SdOption = class extends SolidElement {
 SdOption.styles = [
   ...SolidElement.styles,
   css`/*! tailwindcss v4.3.2 | MIT License | https://tailwindcss.com */@layer theme,base,components,utilities;
-:host{position:relative;display:block;width:100%;--tw-outline-style:none!important;outline-style:none!important}.focus-outline-offset{outline-offset:-2px}.sd-6-29-1-option--disabled-color-border{border-color:rgb(var(--sd-option--disabled-color-border))}`
+:host{position:relative;display:block;width:100%;--tw-outline-style:none!important;outline-style:none!important}.focus-outline-offset{outline-offset:-2px}.sd-6-30-0-option--disabled-color-border{border-color:rgb(var(--sd-option--disabled-color-border))}`
 ];
 __decorateClass([
   query('[part="base"]')
@@ -146,7 +146,7 @@ __decorateClass([
   watch("value")
 ], SdOption.prototype, "handleValueChange", 1);
 SdOption = __decorateClass([
-  customElement("sd-6-29-1-option")
+  customElement("sd-6-30-0-option")
 ], SdOption);
 
 export {

package/dist-versioned/chunks/{chunk.67F53YIT.js → chunk.2FO74NMB.js}

@@ -13,7 +13,7 @@ import {
 import {
   SolidElement,
   customElement
-} from "./chunk.T73O2TL3.js";
+} from "./chunk.RT3GEKSF.js";
 import {
   __decorateClass
 } from "./chunk.S3NI7NKU.js";
@@ -228,7 +228,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-29-1-icon]:pe-8",
+      "ps-4 flex-grow focus:outline-none bg-transparent placeholder:text-neutral-700 resize-none group-has-[sd-6-30-0-icon]:pe-8",
       {
         sm: isFloatingLabelActive ? "pb-1" : "py-2",
         md: isFloatingLabelActive ? "pb-1" : "py-2",
@@ -236,7 +236,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-29-1-icon class="${cx("text-error absolute right-4 pointer-events-none", iconSize)}" library="_internal" name="risk" part="invalid-icon"></sd-6-29-1-icon>` : ""} ${this.styleOnValid && this.showValidStyle ? html`<sd-6-29-1-icon class="${cx("text-success absolute right-4 pointer-events-none", iconSize)}" library="_internal" name="confirm-circle" part="valid-icon"></sd-6-29-1-icon>` : ""}</div></div><slot name="help-text" part="form-control-help-text" id="help-text" class="${cx(
+    )}" 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-30-0-icon class="${cx("text-error absolute right-4 pointer-events-none", iconSize)}" library="_internal" name="risk" part="invalid-icon"></sd-6-30-0-icon>` : ""} ${this.styleOnValid && this.showValidStyle ? html`<sd-6-30-0-icon class="${cx("text-success absolute right-4 pointer-events-none", iconSize)}" library="_internal" name="confirm-circle" part="valid-icon"></sd-6-30-0-icon>` : ""}</div></div><slot name="help-text" part="form-control-help-text" id="help-text" class="${cx(
       "text-sm mt-1",
       hasHelpText && !this.showInvalidStyle ? "block" : "hidden",
       this.visuallyDisabled || this.disabled ? "text-neutral-500" : "text-neutral-700"
@@ -361,7 +361,7 @@ __decorateClass([
   watch(["size", "floatingLabel"])
 ], SdTextarea.prototype, "handleSizeChange", 1);
 SdTextarea = __decorateClass([
-  customElement("sd-6-29-1-textarea")
+  customElement("sd-6-30-0-textarea")
 ], SdTextarea);
 
 export {

package/dist-versioned/chunks/{chunk.ZJE7OCFV.js → chunk.2UHCCORM.js}

@@ -7,7 +7,7 @@ import {
 import {
   SolidElement,
   customElement
-} from "./chunk.T73O2TL3.js";
+} from "./chunk.RT3GEKSF.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-29-1-icon id="default-play-icon" library="_internal" name="start"></sd-6-29-1-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-30-0-icon id="default-play-icon" library="_internal" name="start"></sd-6-30-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>`;
   }
 };
 SdVideo.styles = [
@@ -116,7 +116,7 @@ __decorateClass([
   property({ type: Boolean })
 ], SdVideo.prototype, "isBelowBreakpoint", 2);
 SdVideo = __decorateClass([
-  customElement("sd-6-29-1-video")
+  customElement("sd-6-30-0-video")
 ], SdVideo);
 
 export {

package/dist-versioned/chunks/{chunk.NZOLXA5P.js → chunk.47DEDQQK.js}

@@ -7,7 +7,7 @@ import {
 import {
   SolidElement,
   customElement
-} from "./chunk.T73O2TL3.js";
+} from "./chunk.RT3GEKSF.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-29-1-options when it is triggered
+   * Syncs the disabled prop for all slotted sd-6-30-0-options when it is triggered
    */
   handleDisableOptions() {
     const { disabled } = this;
-    this.defaultSlot.assignedElements().filter((opt) => opt.tagName.toLowerCase() === "sd-6-29-1-option").forEach((opt) => {
+    this.defaultSlot.assignedElements().filter((opt) => opt.tagName.toLowerCase() === "sd-6-30-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-29-1-divider id="divider" class="pt-2 pb-4" part="divider"></sd-6-29-1-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-30-0-divider id="divider" class="pt-2 pb-4" part="divider"></sd-6-30-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-29-1-optgroup")
+  customElement("sd-6-30-0-optgroup")
 ], SdOptgroup);
 
 export {

package/dist-versioned/chunks/{chunk.G3YXVIXP.js → chunk.4QH36I7J.js}

@@ -13,7 +13,7 @@ import {
 import {
   SolidElement,
   customElement
-} from "./chunk.T73O2TL3.js";
+} from "./chunk.RT3GEKSF.js";
 import {
   __decorateClass
 } from "./chunk.S3NI7NKU.js";
@@ -112,14 +112,14 @@ var SdSwitch = class extends SolidElement {
       "group flex items-center text-base leading-normal text-black cursor-pointer",
       this.disabled && "hover:cursor-not-allowed"
     )}"><input id="input" class="peer absolute opacity-0 p-0 m-0 pointer-events-none" type="checkbox" role="switch" title="${this.title}" name="${this.name}" value="${ifDefined(this.value)}" .checked="${live(this.checked)}" .disabled="${this.disabled}" .required="${this.required}" aria-checked="${this.checked ? "true" : "false"}" aria-invalid="${this.showInvalidStyle}" aria-describedby="invalid-message" @click="${this.handleClick}" @input="${this.handleInput}" @invalid="${this.handleInvalid}" @blur="${this.handleBlur}" @focus="${this.handleFocus}"> <span id="control" part="control ${this.checked ? " control--checked" : "control--unchecked"}" class="${cx(
-      `relative flex flex-initial items-center justify-center sd-6-29-1-switch-border-width rounded-full h-4 w-8 transition-colors ease duration-100
+      `relative flex flex-initial items-center justify-center sd-6-30-0-switch-border-width rounded-full h-4 w-8 transition-colors ease duration-100
             peer-focus-visible:outline peer-focus-visible:outline-2 peer-focus-visible:outline-offset-2
             peer-focus-visible:outline-primary outline-transparent transition-colors ease-in-out duration-medium hover:duration-fast`,
-      this.disabled && this.checked ? "bg-neutral-500" : this.disabled ? "border-neutral-500" : this.showInvalidStyle ? this.checked ? "border-error bg-error hover:bg-error-400 hover:border-error-400 group-hover:border-error-400 group-hover:bg-error-400" : "border-error bg-white hover:border-error-400 hover:bg-white group-hover:border-error-400 group-hover:bg-white" : this.checked ? "border-accent hover:sd-6-29-1-switch--checked--hover-color-background bg-accent hover:border-accent-550 group-hover:border-accent-550 group-hover:sd-6-29-1-switch--checked--hover-color-background" : "sd-6-29-1-switch--unchecked-color-border bg-white hover:sd-6-29-1-switch--unchecked--hover-color-background group-hover:sd-6-29-1-switch--unchecked--hover-color-background"
+      this.disabled && this.checked ? "bg-neutral-500" : this.disabled ? "border-neutral-500" : this.showInvalidStyle ? this.checked ? "border-error bg-error hover:bg-error-400 hover:border-error-400 group-hover:border-error-400 group-hover:bg-error-400" : "border-error bg-white hover:border-error-400 hover:bg-white group-hover:border-error-400 group-hover:bg-white" : this.checked ? "border-accent hover:sd-6-30-0-switch--checked--hover-color-background bg-accent hover:border-accent-550 group-hover:border-accent-550 group-hover:sd-6-30-0-switch--checked--hover-color-background" : "sd-6-30-0-switch--unchecked-color-border bg-white hover:sd-6-30-0-switch--unchecked--hover-color-background group-hover:sd-6-30-0-switch--unchecked--hover-color-background"
     )}"><span id="thumb" part="thumb" class="${cx(
       "w-2.5 h-2.5 rounded-full transition[transform,colors] ease-in-out duration-medium",
-      this.disabled && this.checked ? "translate-x-2" : this.disabled ? "-translate-x-2" : this.showInvalidStyle ? this.checked ? "translate-x-2" : "bg-error -translate-x-2 hover:bg-error-400 hover:border-error-400 group-hover:border-error-400 group-hover:bg-error-400" : this.checked ? "translate-x-2" : "-translate-x-2 sd-6-29-1-switch--unchecked__icon-color-background"
-    )}"></span> </span><span part="label" id="label" class="${cx("select-none inline-block ml-2", this.disabled ? "text-neutral-500" : "sd-6-29-1-switch-color-text")}"><slot></slot></span></label> ${this.hasSlotController.test("tooltip") ? html`<slot name="tooltip"></slot>` : null}</div><div part="invalid-icon-message" class="flex items-center gap-2 mt-2">${this.showInvalidStyle ? html`<sd-6-29-1-icon part="invalid-icon" class="${cx("text-error")}" library="_internal" name="risk"></sd-6-29-1-icon>` : ""} ${this.formControlController.renderInvalidMessage("lg")}</div>`;
+      this.disabled && this.checked ? "translate-x-2" : this.disabled ? "-translate-x-2" : this.showInvalidStyle ? this.checked ? "translate-x-2" : "bg-error -translate-x-2 hover:bg-error-400 hover:border-error-400 group-hover:border-error-400 group-hover:bg-error-400" : this.checked ? "translate-x-2" : "-translate-x-2 sd-6-30-0-switch--unchecked__icon-color-background"
+    )}"></span> </span><span part="label" id="label" class="${cx("select-none inline-block ml-2", this.disabled ? "text-neutral-500" : "sd-6-30-0-switch-color-text")}"><slot></slot></span></label> ${this.hasSlotController.test("tooltip") ? html`<slot name="tooltip"></slot>` : null}</div><div part="invalid-icon-message" class="flex items-center gap-2 mt-2">${this.showInvalidStyle ? html`<sd-6-30-0-icon part="invalid-icon" class="${cx("text-error")}" library="_internal" name="risk"></sd-6-30-0-icon>` : ""} ${this.formControlController.renderInvalidMessage("lg")}</div>`;
   }
 };
 /**
@@ -170,7 +170,7 @@ __decorateClass([
   watch(["checked"], { waitUntilFirstUpdate: true })
 ], SdSwitch.prototype, "handleStateChange", 1);
 SdSwitch = __decorateClass([
-  customElement("sd-6-29-1-switch")
+  customElement("sd-6-30-0-switch")
 ], SdSwitch);
 
 export {

package/dist-versioned/chunks/{chunk.QP6NYUMR.js → chunk.5XZQBMKD.js}

@@ -1,7 +1,7 @@
 import {
   SolidElement,
   customElement
-} from "./chunk.T73O2TL3.js";
+} from "./chunk.RT3GEKSF.js";
 import {
   __decorateClass
 } from "./chunk.S3NI7NKU.js";
@@ -42,16 +42,16 @@ var SdAccordionGroup = class extends SolidElement {
 SdAccordionGroup.styles = [
   ...SolidElement.styles,
   css`/*! tailwindcss v4.3.2 | MIT License | https://tailwindcss.com */@layer theme,base,components,utilities;
-:host{display:block}::slotted(sd-6-29-1-accordion:not(:first-of-type)){margin-top:calc(-1 * var(--sd-accordion-border-width))!important}`
+:host{display:block}::slotted(sd-6-30-0-accordion:not(:first-of-type)){margin-top:calc(-1 * var(--sd-accordion-border-width))!important}`
 ];
 __decorateClass([
-  queryAssignedElements({ selector: "sd-6-29-1-accordion" })
+  queryAssignedElements({ selector: "sd-6-30-0-accordion" })
 ], SdAccordionGroup.prototype, "_accordionsInDefaultSlot", 2);
 __decorateClass([
   property({ attribute: "close-others", type: Boolean, reflect: true })
 ], SdAccordionGroup.prototype, "closeOthers", 2);
 SdAccordionGroup = __decorateClass([
-  customElement("sd-6-29-1-accordion-group")
+  customElement("sd-6-30-0-accordion-group")
 ], SdAccordionGroup);
 
 export {