@solid-design-system/components 7.0.0-next.4 → 7.0.0-next.5

package/dist/solid-components.js

@@ -4,199 +4,197 @@ import {
 import "./chunks/chunk.HAL7R4WT.js";
 import {
   SdTeaser
-} from "./chunks/chunk.55JRGHYZ.js";
+} from "./chunks/chunk.RSD5I5OR.js";
 import {
   SdTeaserMedia
-} from "./chunks/chunk.R7AKCNLH.js";
+} from "./chunks/chunk.P6YU4LMU.js";
 import {
   SdTextarea
-} from "./chunks/chunk.2MPKSDFV.js";
+} from "./chunks/chunk.UKTYKIVT.js";
 import {
   SdVideo
-} from "./chunks/chunk.IUE6LRBW.js";
+} from "./chunks/chunk.5UYXIS2U.js";
 import {
   SdSkeleton
-} from "./chunks/chunk.JRWHGSFU.js";
+} from "./chunks/chunk.7EWDTJLW.js";
 import {
   SdStep
-} from "./chunks/chunk.I2RFDBMV.js";
+} from "./chunks/chunk.TKBGSMUY.js";
 import {
   SdStepGroup
-} from "./chunks/chunk.J5LGPQPF.js";
+} from "./chunks/chunk.4RYOOAMJ.js";
 import {
   SdSwitch
-} from "./chunks/chunk.QUBMQHBS.js";
+} from "./chunks/chunk.OTLW445M.js";
 import {
   SdTab
-} from "./chunks/chunk.5LCAXSSU.js";
+} from "./chunks/chunk.NOJRZ6MM.js";
 import {
   SdTabGroup
-} from "./chunks/chunk.FUTFHFME.js";
+} from "./chunks/chunk.TIEOFZYQ.js";
 import {
   SdTabPanel
-} from "./chunks/chunk.KRQXRRDJ.js";
+} from "./chunks/chunk.B7QQBC4A.js";
 import {
   SdRadioButton
-} from "./chunks/chunk.YPXPF4CW.js";
+} from "./chunks/chunk.32OX3VGB.js";
 import {
   SdRadioGroup
-} from "./chunks/chunk.JZOKETCG.js";
+} from "./chunks/chunk.AH2NSGQE.js";
 import {
   SdRadio
-} from "./chunks/chunk.TIURA3CR.js";
+} from "./chunks/chunk.6CESNAQW.js";
 import {
   SdRange
-} from "./chunks/chunk.EPA3ZMZ6.js";
+} from "./chunks/chunk.3LN66WKN.js";
 import {
   SdTooltip
-} from "./chunks/chunk.MEDGQUDQ.js";
+} from "./chunks/chunk.BTR7H5XJ.js";
 import "./chunks/chunk.D3YSIVTB.js";
 import {
   SdRangeTick
-} from "./chunks/chunk.CEAD7GE5.js";
+} from "./chunks/chunk.HT4CXANK.js";
 import {
   SdScrollable
-} from "./chunks/chunk.UQW2D27E.js";
+} from "./chunks/chunk.67R42AVH.js";
 import {
   SdSelect
-} from "./chunks/chunk.JO3VO5XL.js";
+} from "./chunks/chunk.EWMWCZTD.js";
 import {
   SdNavigationItem
-} from "./chunks/chunk.IFK35LWT.js";
+} from "./chunks/chunk.L2UTLZMO.js";
 import {
   SdNotification
-} from "./chunks/chunk.XLRNOFGT.js";
+} from "./chunks/chunk.N4J4DBP3.js";
 import {
   SdOptgroup
-} from "./chunks/chunk.D333WSUU.js";
+} from "./chunks/chunk.DLZAEQ2O.js";
 import {
   SdOption
-} from "./chunks/chunk.2A2XLAZ6.js";
+} from "./chunks/chunk.QQPQLZHK.js";
 import {
   SdProgressBar
-} from "./chunks/chunk.MCRDVATU.js";
+} from "./chunks/chunk.TOYRWMA7.js";
 import {
   SdQuickfact
-} from "./chunks/chunk.5MKROBU2.js";
+} from "./chunks/chunk.NGQVZR65.js";
 import {
   SdInclude
-} from "./chunks/chunk.Z7YV6XJB.js";
+} from "./chunks/chunk.SICWGHUQ.js";
 import {
   SdInput
-} from "./chunks/chunk.VVGDAH3Y.js";
+} from "./chunks/chunk.VSYHG5GU.js";
 import {
   SdMapMarker
-} from "./chunks/chunk.FHZBC7YI.js";
+} from "./chunks/chunk.UH5VKHLA.js";
 import {
   SdMenu
-} from "./chunks/chunk.JL5JAIKK.js";
+} from "./chunks/chunk.WHUUNX46.js";
 import {
   SdMenuItem
-} from "./chunks/chunk.5R6X3OUC.js";
+} from "./chunks/chunk.KAHMCI5G.js";
 import "./chunks/chunk.KEJFWGZI.js";
 import {
   SdHeader
-} from "./chunks/chunk.SYN6Y7B2.js";
+} from "./chunks/chunk.EAIVAETN.js";
 import {
   SdDatepicker
-} from "./chunks/chunk.PZYEO6JX.js";
+} from "./chunks/chunk.GT7FZLGE.js";
 import "./chunks/chunk.A4LR62QO.js";
 import "./chunks/chunk.TJ2FFWLY.js";
 import {
   SdDialog
-} from "./chunks/chunk.NHGPTJYA.js";
+} from "./chunks/chunk.JASUQLAD.js";
 import {
   SdDivider
-} from "./chunks/chunk.JBF2NX2O.js";
+} from "./chunks/chunk.MRILLKXL.js";
 import {
   SdExpandable
-} from "./chunks/chunk.QE5IYB7Q.js";
+} from "./chunks/chunk.JTMMFUZB.js";
 import {
   SdFlipcard
-} from "./chunks/chunk.RBFDHNCA.js";
+} from "./chunks/chunk.FINTCURG.js";
 import {
   SdCheckbox
-} from "./chunks/chunk.6V4BBUOB.js";
+} from "./chunks/chunk.OLFMBF36.js";
 import {
   SdCheckboxGroup
-} from "./chunks/chunk.CST7TW6Q.js";
+} from "./chunks/chunk.S5SH4NHT.js";
 import {
   SdCombobox
-} from "./chunks/chunk.PHDXES2E.js";
+} from "./chunks/chunk.53FS6JNC.js";
 import {
   SdTag
-} from "./chunks/chunk.MACUA7LR.js";
+} from "./chunks/chunk.PEL5LYB5.js";
 import "./chunks/chunk.GI7VDIWX.js";
 import "./chunks/chunk.WBJBQ4QI.js";
 import "./chunks/chunk.UIQBHPD3.js";
 import {
   SdBadge
-} from "./chunks/chunk.CRTYDXIZ.js";
+} from "./chunks/chunk.BNPZJWJE.js";
 import {
   SdBrandshape
-} from "./chunks/chunk.HKGKJSNK.js";
+} from "./chunks/chunk.HHEFJRDJ.js";
 import {
   SdBreadcrumb
-} from "./chunks/chunk.V3OXFXTL.js";
+} from "./chunks/chunk.B6PFRZJR.js";
 import {
   SdDropdown
-} from "./chunks/chunk.VUBZTPBJ.js";
+} from "./chunks/chunk.4NXRXHFJ.js";
+import "./chunks/chunk.LTZVVIB2.js";
 import {
   SdPopup
-} from "./chunks/chunk.5N723KVX.js";
+} from "./chunks/chunk.6VJCUBYA.js";
 import {
   SdBreadcrumbItem
-} from "./chunks/chunk.AKFD4POM.js";
+} from "./chunks/chunk.PJ6U5FXI.js";
 import {
   SdLink
-} from "./chunks/chunk.6A4V3BDD.js";
-import "./chunks/chunk.XO2EYEOQ.js";
+} from "./chunks/chunk.BBE2NXFL.js";
+import "./chunks/chunk.D55CZ6ZH.js";
 import {
   SdCarousel
-} from "./chunks/chunk.T227KIHC.js";
+} from "./chunks/chunk.Y43SJPR7.js";
 import "./chunks/chunk.W2YDXTG5.js";
 import "./chunks/chunk.6RE6UZ72.js";
 import "./chunks/chunk.UVI5HHLF.js";
 import {
   SdCarouselItem
-} from "./chunks/chunk.FKT27XGY.js";
+} from "./chunks/chunk.JA4XDN7F.js";
 import "./chunks/chunk.F4VGSDIW.js";
 import {
   SdAccordionGroup
-} from "./chunks/chunk.AHYFAMPB.js";
+} from "./chunks/chunk.JUTMQBRS.js";
 import {
   SdAccordion
-} from "./chunks/chunk.DEBCAM5G.js";
+} from "./chunks/chunk.F4HCPBUG.js";
 import {
   SdAnimation
-} from "./chunks/chunk.AF7LVJ42.js";
+} from "./chunks/chunk.5UMZRILA.js";
 import "./chunks/chunk.TJOP7HQP.js";
 import {
   SdAudio
-} from "./chunks/chunk.M2JKMFD5.js";
+} from "./chunks/chunk.YDZWM7S4.js";
 import {
   SdDrawer
-} from "./chunks/chunk.5Q7N5BFG.js";
+} from "./chunks/chunk.R2BSLQAY.js";
 import "./chunks/chunk.SF6AUNJF.js";
-import "./chunks/chunk.EDMG7C5H.js";
-import "./chunks/chunk.UMIKFOMI.js";
-import "./chunks/chunk.WDWV53JP.js";
 import {
   SdButton
-} from "./chunks/chunk.L4AFCWKB.js";
+} from "./chunks/chunk.USNOEKSJ.js";
 import {
   SdThemeListener
-} from "./chunks/chunk.2WRG4JLD.js";
+} from "./chunks/chunk.IPKJYONP.js";
 import {
   SdLoader
-} from "./chunks/chunk.CQ6DFCND.js";
+} from "./chunks/chunk.OUQ5M3MT.js";
 import "./chunks/chunk.C3WIBDGG.js";
 import "./chunks/chunk.IVMQWO2L.js";
 import "./chunks/chunk.N4LHE3QK.js";
 import "./chunks/chunk.B4BZKR24.js";
 import {
   SdIcon
-} from "./chunks/chunk.JSWS6X3U.js";
+} from "./chunks/chunk.FQ4HNT4C.js";
 import {
   registerIconLibrary,
   unregisterIconLibrary
@@ -213,7 +211,7 @@ import {
 import "./chunks/chunk.X4IYFUX6.js";
 import "./chunks/chunk.BT6SAX2H.js";
 import "./chunks/chunk.X2OQMWGY.js";
-import "./chunks/chunk.ZZYKQTZB.js";
+import "./chunks/chunk.NQYRZUCX.js";
 import "./chunks/chunk.HQWAKJBV.js";
 import "./chunks/chunk.POFWU6ZT.js";
 import "./chunks/chunk.S3NI7NKU.js";

package/dist/utilities/autocomplete-config.js

@@ -1,8 +1,8 @@
 import {
   setupAutocomplete
 } from "../chunks/chunk.QGERTGJH.js";
-import "../chunks/chunk.5N723KVX.js";
-import "../chunks/chunk.ZZYKQTZB.js";
+import "../chunks/chunk.6VJCUBYA.js";
+import "../chunks/chunk.NQYRZUCX.js";
 import "../chunks/chunk.HQWAKJBV.js";
 import "../chunks/chunk.S3NI7NKU.js";
 export {

package/dist/vscode.html-custom-data.json

@@ -1074,7 +1074,7 @@
     },
     {
       "name": "sd-drawer",
-      "description": "Used as a panel that slides out from the side of the screen which contains a set of information or actions.\n---\n\n\n### **Events:**\n - **sd-show** - Emitted when the drawer opens.\n- **sd-after-show** - Emitted after the drawer opens and all animations are complete.\n- **sd-hide** - Emitted when the drawer closes.\n- **sd-after-hide** - Emitted after the drawer closes and all animations are complete.\n- **sd-initial-focus** - Emitted when the drawer opens and is ready to receive focus. Calling `event.preventDefault()` will prevent focusing and allow you to set it on a different element, such as an input.\n- **sd-request-close** - Emitted when the user attempts to close the drawer by clicking the close button, clicking the overlay, or pressing escape. Calling `event.preventDefault()` will keep the drawer open. Avoid using this unless closing the drawer will result in destructive behavior such as data loss.\n\n### **Methods:**\n - **show()** - Shows the drawer.\n- **hide()** - Hides the drawer\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 - _default_ - The drawer's main content.\n- **header** - The drawer's header, usually a title.\n- **footer** - The drawer's footer, usually one or more buttons representing various options.\n\n### **CSS Properties:**\n - **--width** - The preferred width of the drawer. depending on its `placement`. Note that the drawer will shrink to accommodate smaller screens. _(default: undefined)_\n- **--sd-panel-color-border** - The border color of the drawer panel. _(default: undefined)_\n- **--sd-overlay-color-background** - The background color of the drawer overlay. _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.\n- **overlay** - The overlay that covers the screen behind the drawer.\n- **panel** - The drawer's panel (where the drawer and its content are rendered).\n- **header** - The drawer's header. This element wraps the title and the close-button.\n- **title** - The drawer's title.\n- **close-button** - The close button, an `<sd-button>`.\n- **body** - The drawer's body.\n- **footer** - The drawer's footer.",
+      "description": "Used as a panel that slides out from the side of the screen which contains a set of information or actions.\n---\n\n\n### **Events:**\n - **sd-show** - Emitted when the drawer opens.\n- **sd-after-show** - Emitted after the drawer opens and all animations are complete.\n- **sd-hide** - Emitted when the drawer closes.\n- **sd-after-hide** - Emitted after the drawer closes and all animations are complete.\n- **sd-initial-focus** - Emitted when the drawer opens and is ready to receive focus. Calling `event.preventDefault()` will prevent focusing and allow you to set it on a different element, such as an input.\n- **sd-request-close** - Emitted when the user attempts to close the drawer by clicking the close button, clicking the overlay, or pressing escape. Calling `event.preventDefault()` will keep the drawer open. Avoid using this unless closing the drawer will result in destructive behavior such as data loss.\n\n### **Methods:**\n - **show()** - Shows the drawer.\n- **hide()** - Hides the drawer\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 - _default_ - The drawer's main content.\n- **header** - The drawer's header, usually a title.\n- **footer** - The drawer's footer, usually one or more buttons representing various options.\n\n### **CSS Properties:**\n - **--width** - The preferred width of the drawer. depending on its `placement`. Note that the drawer will shrink to accommodate smaller screens. _(default: undefined)_\n- **--sd-panel-color-border** - The border color of the drawer panel. _(default: undefined)_\n- **--sd-overlay-color-background** - The background color of the drawer overlay. _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.\n- **panel** - The drawer's panel (where the drawer and its content are rendered).\n- **header** - The drawer's header. This element wraps the title and the close-button.\n- **title** - The drawer's title.\n- **close-button** - The close button, an `<sd-button>`.\n- **body** - The drawer's body.\n- **footer** - The drawer's footer.\n- **overlay** - The overlay that covers the screen behind the drawer.",
       "attributes": [
         {
           "name": "open",
@@ -1091,11 +1091,6 @@
           "description": "The direction from which the drawer will open.",
           "values": [{ "name": "end" }, { "name": "start" }]
         },
-        {
-          "name": "contained",
-          "description": "By default, the drawer slides out of its containing block (the viewport). Contained is a hidden feature used only for testing purposes. Please do not use it in production as it will likely change.",
-          "values": []
-        },
         {
           "name": "no-header",
           "description": "Removes the header. This will also remove the default close button, so please ensure you provide an easy, accessible way for users to dismiss the drawer.",

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": "7.0.0-next.4",
+  "version": "7.0.0-next.5",
   "description-markup": "markdown",
   "contributions": {
     "html": {
@@ -2558,7 +2558,7 @@
         },
         {
           "name": "sd-drawer",
-          "description": "Used as a panel that slides out from the side of the screen which contains a set of information or actions.\n---\n\n\n### **Events:**\n - **sd-show** - Emitted when the drawer opens.\n- **sd-after-show** - Emitted after the drawer opens and all animations are complete.\n- **sd-hide** - Emitted when the drawer closes.\n- **sd-after-hide** - Emitted after the drawer closes and all animations are complete.\n- **sd-initial-focus** - Emitted when the drawer opens and is ready to receive focus. Calling `event.preventDefault()` will prevent focusing and allow you to set it on a different element, such as an input.\n- **sd-request-close** - Emitted when the user attempts to close the drawer by clicking the close button, clicking the overlay, or pressing escape. Calling `event.preventDefault()` will keep the drawer open. Avoid using this unless closing the drawer will result in destructive behavior such as data loss.\n\n### **Methods:**\n - **show()** - Shows the drawer.\n- **hide()** - Hides the drawer\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 - _default_ - The drawer's main content.\n- **header** - The drawer's header, usually a title.\n- **footer** - The drawer's footer, usually one or more buttons representing various options.\n\n### **CSS Properties:**\n - **--width** - The preferred width of the drawer. depending on its `placement`. Note that the drawer will shrink to accommodate smaller screens. _(default: undefined)_\n- **--sd-panel-color-border** - The border color of the drawer panel. _(default: undefined)_\n- **--sd-overlay-color-background** - The background color of the drawer overlay. _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.\n- **overlay** - The overlay that covers the screen behind the drawer.\n- **panel** - The drawer's panel (where the drawer and its content are rendered).\n- **header** - The drawer's header. This element wraps the title and the close-button.\n- **title** - The drawer's title.\n- **close-button** - The close button, an `<sd-button>`.\n- **body** - The drawer's body.\n- **footer** - The drawer's footer.",
+          "description": "Used as a panel that slides out from the side of the screen which contains a set of information or actions.\n---\n\n\n### **Events:**\n - **sd-show** - Emitted when the drawer opens.\n- **sd-after-show** - Emitted after the drawer opens and all animations are complete.\n- **sd-hide** - Emitted when the drawer closes.\n- **sd-after-hide** - Emitted after the drawer closes and all animations are complete.\n- **sd-initial-focus** - Emitted when the drawer opens and is ready to receive focus. Calling `event.preventDefault()` will prevent focusing and allow you to set it on a different element, such as an input.\n- **sd-request-close** - Emitted when the user attempts to close the drawer by clicking the close button, clicking the overlay, or pressing escape. Calling `event.preventDefault()` will keep the drawer open. Avoid using this unless closing the drawer will result in destructive behavior such as data loss.\n\n### **Methods:**\n - **show()** - Shows the drawer.\n- **hide()** - Hides the drawer\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 - _default_ - The drawer's main content.\n- **header** - The drawer's header, usually a title.\n- **footer** - The drawer's footer, usually one or more buttons representing various options.\n\n### **CSS Properties:**\n - **--width** - The preferred width of the drawer. depending on its `placement`. Note that the drawer will shrink to accommodate smaller screens. _(default: undefined)_\n- **--sd-panel-color-border** - The border color of the drawer panel. _(default: undefined)_\n- **--sd-overlay-color-background** - The background color of the drawer overlay. _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.\n- **panel** - The drawer's panel (where the drawer and its content are rendered).\n- **header** - The drawer's header. This element wraps the title and the close-button.\n- **title** - The drawer's title.\n- **close-button** - The close button, an `<sd-button>`.\n- **body** - The drawer's body.\n- **footer** - The drawer's footer.\n- **overlay** - The overlay that covers the screen behind the drawer.",
           "doc-url": "",
           "attributes": [
             {
@@ -2576,11 +2576,6 @@
               "description": "The direction from which the drawer will open.",
               "value": { "type": "'end' | 'start'", "default": "'end'" }
             },
-            {
-              "name": "contained",
-              "description": "By default, the drawer slides out of its containing block (the viewport). Contained is a hidden feature used only for testing purposes. Please do not use it in production as it will likely change.",
-              "value": { "type": "boolean", "default": "false" }
-            },
             {
               "name": "no-header",
               "description": "Removes the header. This will also remove the default close button, so please ensure you provide an easy, accessible way for users to dismiss the drawer.",
@@ -2653,11 +2648,6 @@
                 "description": "The direction from which the drawer will open.",
                 "type": "'end' | 'start'"
               },
-              {
-                "name": "contained",
-                "description": "By default, the drawer slides out of its containing block (the viewport). Contained is a hidden feature used only for testing purposes. Please do not use it in production as it will likely change.",
-                "type": "boolean"
-              },
               {
                 "name": "noHeader",
                 "description": "Removes the header. This will also remove the default close button, so please ensure you provide an easy, accessible way for users to dismiss the drawer.",

package/dist-versioned/chunks/{chunk.YPXPF4CW.js → chunk.32OX3VGB.js}

@@ -7,7 +7,7 @@ import {
 import {
   SolidElement,
   customElement
-} from "./chunk.ZZYKQTZB.js";
+} from "./chunk.NQYRZUCX.js";
 import {
   __decorateClass
 } from "./chunk.S3NI7NKU.js";
@@ -64,9 +64,9 @@ var SdRadioButton = class extends SolidElement {
     const hasIconSlot = this.hasSlotController.test("icon");
     const buttonSizeClass = `${this.size}-${hasDefaultSlot ? "label" : "no-label"}`;
     return html`<div part="base" role="presentation" class="relative"><button part="${`button${this.checked ? " button--checked" : ""}`}" role="radio" aria-checked="${this.checked}" class="${cx(
-      "relative text-center sd-7-0-0-next-4-radio-button-border-radius transition-all ease-in-out duration-100 items-center justify-center focus-visible:focus-outline choice-control-font-weight",
+      "relative text-center sd-7-0-0-next-5-radio-button-border-radius transition-all ease-in-out duration-100 items-center justify-center focus-visible:focus-outline choice-control-font-weight",
       this.size === "sm" ? "text-sm" : "text-base",
-      this.checked && !this.disabled && !this.visuallyDisabled ? "sd-7-0-0-next-4-button--primary--default-color-background sd-7-0-0-next-4-button--primary--default-color-text hover:sd-7-0-0-next-4-button--primary--hover-color-background hover:text-primary-100" : !this.checked && (this.disabled || this.visuallyDisabled) ? "text-neutral-500 hover:cursor-not-allowed" : this.checked && (this.disabled || this.visuallyDisabled) ? "bg-neutral-400 text-white hover:cursor-not-allowed " : "bg-transparent sd-7-0-0-next-4-radio-button-color-text border-primary cursor-pointer hover:sd-7-0-0-next-4-radio-button--hover-color-background hover:sd-7-0-0-next-4-radio-button--hover-color-text",
+      this.checked && !this.disabled && !this.visuallyDisabled ? "sd-7-0-0-next-5-button--primary--default-color-background sd-7-0-0-next-5-button--primary--default-color-text hover:sd-7-0-0-next-5-button--primary--hover-color-background hover:text-primary-100" : !this.checked && (this.disabled || this.visuallyDisabled) ? "text-neutral-500 hover:cursor-not-allowed" : this.checked && (this.disabled || this.visuallyDisabled) ? "bg-neutral-400 text-white hover:cursor-not-allowed " : "bg-transparent sd-7-0-0-next-5-radio-button-color-text border-primary cursor-pointer hover:sd-7-0-0-next-5-radio-button--hover-color-background hover:sd-7-0-0-next-5-radio-button--hover-color-text",
       hasDefaultSlot && {
         sm: "px-3",
         md: "px-4",
@@ -89,7 +89,7 @@ var SdRadioButton = class extends SolidElement {
 SdRadioButton.styles = [
   ...SolidElement.styles,
   css`/*! tailwindcss v4.3.2 | MIT License | https://tailwindcss.com */@layer properties;@layer theme,base,components,utilities;
-:host{display:block;width:-moz-min-content;width:min-content}.hidden-input{all:unset;position:absolute;inset:0;z-index:calc(10 * -1);opacity:var(--sd-opacity-0);outline-style:var(--tw-outline-style);outline-width:1px;outline-color:rgba(var(--sd-color-border-error,var(--sd-color-error)));--tw-outline-style:dotted;outline-style:dotted}.lg-label{height:46px}.lg-no-label{height:46px;padding-inline:calc(var(--sd-spacing-1) * 5)}.md-label{height:38px}.md-no-label{height:38px;padding-inline:var(--sd-spacing-4)}.sm-label{height:30px}.sm-no-label{height:30px;padding-inline:var(--sd-spacing-3)}:host([size=lg].sd-7-0-0-next-4-button-group__button:not(.sd-7-0-0-next-4-button-group__button--first)){margin-inline-start:calc(var(--sd-spacing-3) * -1)}:host([size=md].sd-7-0-0-next-4-button-group__button:not(.sd-7-0-0-next-4-button-group__button--first)){margin-inline-start:calc(var(--sd-spacing-2) * -1)}:host([size=sm].sd-7-0-0-next-4-button-group__button:not(.sd-7-0-0-next-4-button-group__button--first)){margin-inline-start:calc(var(--sd-spacing-1) * -1)}:host(.sd-7-0-0-next-4-button-group__button--hover){z-index:20}:host(.sd-7-0-0-next-4-button-group__button--focus){z-index:30}:host(.sd-7-0-0-next-4-button-group__button[checked]){z-index:40}@property --tw-outline-style{syntax:"*";inherits:false;initial-value:solid}`
+:host{display:block;width:-moz-min-content;width:min-content}.hidden-input{all:unset;position:absolute;inset:0;z-index:calc(10 * -1);opacity:var(--sd-opacity-0);outline-style:var(--tw-outline-style);outline-width:1px;outline-color:rgba(var(--sd-color-border-error,var(--sd-color-error)));--tw-outline-style:dotted;outline-style:dotted}.lg-label{height:46px}.lg-no-label{height:46px;padding-inline:calc(var(--sd-spacing-1) * 5)}.md-label{height:38px}.md-no-label{height:38px;padding-inline:var(--sd-spacing-4)}.sm-label{height:30px}.sm-no-label{height:30px;padding-inline:var(--sd-spacing-3)}:host([size=lg].sd-7-0-0-next-5-button-group__button:not(.sd-7-0-0-next-5-button-group__button--first)){margin-inline-start:calc(var(--sd-spacing-3) * -1)}:host([size=md].sd-7-0-0-next-5-button-group__button:not(.sd-7-0-0-next-5-button-group__button--first)){margin-inline-start:calc(var(--sd-spacing-2) * -1)}:host([size=sm].sd-7-0-0-next-5-button-group__button:not(.sd-7-0-0-next-5-button-group__button--first)){margin-inline-start:calc(var(--sd-spacing-1) * -1)}:host(.sd-7-0-0-next-5-button-group__button--hover){z-index:20}:host(.sd-7-0-0-next-5-button-group__button--focus){z-index:30}:host(.sd-7-0-0-next-5-button-group__button[checked]){z-index:40}@property --tw-outline-style{syntax:"*";inherits:false;initial-value:solid}`
 ];
 __decorateClass([
   query(".button")
@@ -119,7 +119,7 @@ __decorateClass([
   watch(["disabled", "visually-disabled"], { waitUntilFirstUpdate: true })
 ], SdRadioButton.prototype, "handleDisabledChange", 1);
 SdRadioButton = __decorateClass([
-  customElement("sd-7-0-0-next-4-radio-button")
+  customElement("sd-7-0-0-next-5-radio-button")
 ], SdRadioButton);
 
 export {

package/dist-versioned/chunks/{chunk.EPA3ZMZ6.js → chunk.3LN66WKN.js}

@@ -18,7 +18,7 @@ import {
 import {
   SolidElement,
   customElement
-} from "./chunk.ZZYKQTZB.js";
+} from "./chunk.NQYRZUCX.js";
 import {
   __decorateClass
 } from "./chunk.S3NI7NKU.js";
@@ -84,7 +84,7 @@ var SdRange = class extends SolidElement {
       var _a, _b;
       const tooltip = thumb.parentElement;
       await tooltip.updateComplete;
-      (_b = (_a = tooltip.shadowRoot) == null ? void 0 : _a.querySelector("sd-7-0-0-next-4-popup")) == null ? void 0 : _b.setAttribute("distance", "14");
+      (_b = (_a = tooltip.shadowRoot) == null ? void 0 : _a.querySelector("sd-7-0-0-next-5-popup")) == null ? void 0 : _b.setAttribute("distance", "14");
     });
   }
   willUpdate(changedProperties) {
@@ -260,7 +260,7 @@ var SdRange = class extends SolidElement {
   _preventTextSelection() {
     if (!this._dragStyleElement) {
       const style = document.createElement("style");
-      style.setAttribute("data-sd-7-0-0-next-4-range-drag", "");
+      style.setAttribute("data-sd-7-0-0-next-5-range-drag", "");
       style.textContent = "*, *::before, *::after { user-select: none !important; -webkit-user-select: none !important; }";
       document.head.appendChild(style);
       this._dragStyleElement = style;
@@ -445,10 +445,10 @@ var SdRange = class extends SolidElement {
           ariaLabel = this.tooltipFormatter(value);
         }
       }
-      return html`<sd-7-0-0-next-4-tooltip trigger="${this.tooltip === "on-interaction" ? "focus" : "manual"}" disabled="${ifDefined(this.disabled || this.visuallyDisabled || this.tooltip === "hidden" ? true : void 0)}"><div id="${id}" part="thumb" role="slider" tabindex="${this.disabled || this.visuallyDisabled ? -1 : 0}" aria-disabled="${ifDefined(this.disabled || this.visuallyDisabled ? "true" : void 0)}" aria-labelledby="${ariaLabeledBy}" aria-label="${ariaLabel}" aria-valuemax="${this.max}" aria-valuemin="${this.min}" aria-valuenow="${value}" aria-valuetext="${this.tooltipFormatter(value)}" data-range-id="${rangeId}" data-disabled="${ifDefined(this.disabled || this.visuallyDisabled || void 0)}" @pointerdown="${this.onClickThumb}" @pointermove="${this.onDragThumb}" @pointerup="${this.onReleaseThumb}" @pointercancel="${this.onReleaseThumb}" @keydown="${this.onKeyPress}" @focus="${this.onFocusThumb}" class="${cx(
+      return html`<sd-7-0-0-next-5-tooltip trigger="${this.tooltip === "on-interaction" ? "focus" : "manual"}" disabled="${ifDefined(this.disabled || this.visuallyDisabled || this.tooltip === "hidden" ? true : void 0)}"><div id="${id}" part="thumb" role="slider" tabindex="${this.disabled || this.visuallyDisabled ? -1 : 0}" aria-disabled="${ifDefined(this.disabled || this.visuallyDisabled ? "true" : void 0)}" aria-labelledby="${ariaLabeledBy}" aria-label="${ariaLabel}" aria-valuemax="${this.max}" aria-valuemin="${this.min}" aria-valuenow="${value}" aria-valuetext="${this.tooltipFormatter(value)}" data-range-id="${rangeId}" data-disabled="${ifDefined(this.disabled || this.visuallyDisabled || void 0)}" @pointerdown="${this.onClickThumb}" @pointermove="${this.onDragThumb}" @pointerup="${this.onReleaseThumb}" @pointercancel="${this.onReleaseThumb}" @keydown="${this.onKeyPress}" @focus="${this.onFocusThumb}" class="${cx(
         "rounded-full absolute top-0 size-4 hover:cursor-grab after:-inset-2",
         this.disabled || this.visuallyDisabled ? "outline-none" : "cursor-pointer focus-visible:focus-outline"
-      )}"></div></sd-7-0-0-next-4-tooltip>`;
+      )}"></div></sd-7-0-0-next-5-tooltip>`;
     });
   }
   render() {
@@ -518,7 +518,7 @@ __decorateClass([
   property({ type: String })
 ], SdRange.prototype, "value", 1);
 SdRange = __decorateClass([
-  customElement("sd-7-0-0-next-4-range")
+  customElement("sd-7-0-0-next-5-range")
 ], SdRange);
 
 export {

package/dist-versioned/chunks/{chunk.VUBZTPBJ.js → chunk.4NXRXHFJ.js}

@@ -1,10 +1,6 @@
-import {
-  getDeepActiveElement,
-  getTabbableBoundary
-} from "./chunk.UMIKFOMI.js";
 import {
   scrollIntoView
-} from "./chunk.WDWV53JP.js";
+} from "./chunk.LTZVVIB2.js";
 import {
   getAnimation,
   setDefaultAnimation
@@ -21,7 +17,7 @@ import {
 import {
   SolidElement,
   customElement
-} from "./chunk.ZZYKQTZB.js";
+} from "./chunk.NQYRZUCX.js";
 import {
   animateTo,
   stopAnimations
@@ -51,6 +47,67 @@ function deepClosestElement(element, selector) {
   return null;
 }
 
+// src/internal/deep-active-element.ts
+function getDeepActiveElement(element = document.activeElement) {
+  if (element == null ? void 0 : element.shadowRoot) {
+    const shadowActiveElement = element.shadowRoot.activeElement;
+    if (shadowActiveElement) {
+      return getDeepActiveElement(shadowActiveElement);
+    }
+  }
+  return element;
+}
+
+// src/internal/tabbable.ts
+function isTabbable(el) {
+  const tag = el.tagName.toLowerCase();
+  if (el.getAttribute("tabindex") === "-1") {
+    return false;
+  }
+  if (el.hasAttribute("disabled")) {
+    return false;
+  }
+  if (el.hasAttribute("aria-disabled") && el.getAttribute("aria-disabled") !== "false") {
+    return false;
+  }
+  if (tag === "input" && el.getAttribute("type") === "radio" && !el.hasAttribute("checked")) {
+    return false;
+  }
+  if (el.offsetParent === null && !(el.getRootNode() instanceof ShadowRoot)) {
+    return false;
+  }
+  if (window.getComputedStyle(el).visibility === "hidden") {
+    return false;
+  }
+  if ((tag === "audio" || tag === "video") && el.hasAttribute("controls")) {
+    return true;
+  }
+  if (el.hasAttribute("tabindex")) {
+    return true;
+  }
+  if (el.hasAttribute("contenteditable") && el.getAttribute("contenteditable") !== "false") {
+    return true;
+  }
+  return ["button", "input", "select", "textarea", "a", "audio", "video", "summary"].includes(tag);
+}
+function getTabbableBoundary(root) {
+  var _a, _b;
+  const allElements = [];
+  function walk(el) {
+    if (el instanceof HTMLElement) {
+      allElements.push(el);
+      if (el.shadowRoot !== null && el.shadowRoot.mode === "open") {
+        walk(el.shadowRoot);
+      }
+    }
+    [...el.children].forEach((e) => walk(e));
+  }
+  walk(root);
+  const start = (_a = allElements.find((el) => isTabbable(el))) != null ? _a : null;
+  const end = (_b = allElements.reverse().find((el) => isTabbable(el))) != null ? _b : null;
+  return { start, end };
+}
+
 // src/components/dropdown/dropdown.ts
 import { property, query } from "lit/decorators.js";
 import cx from "classix";
@@ -97,7 +154,7 @@ var SdDropdown = class extends SolidElement {
    * within the slotted trigger. This could be the slotted element itself, a child of the slotted element,
    * or an element within the slotted elements shadow root.
    *
-   * e.g. the accessible trigger of an <sd-7-0-0-next-4-button> is a <button> located inside its shadow root.
+   * e.g. the accessible trigger of an <sd-7-0-0-next-5-button> is a <button> located inside its shadow root.
    *
    * To determine this, we assume the first tabbable element in the trigger slot is the "accessible trigger."
    * */
@@ -108,11 +165,11 @@ var SdDropdown = class extends SolidElement {
     if (accessibleTrigger) {
       switch (accessibleTrigger.tagName.toLowerCase()) {
         // Solid buttons have to update the internal button so it's announced correctly by screen readers
-        case "sd-7-0-0-next-4-button":
-        case "sd-7-0-0-next-4-icon-button":
+        case "sd-7-0-0-next-5-button":
+        case "sd-7-0-0-next-5-icon-button":
           target = accessibleTrigger.button;
           break;
-        case "sd-7-0-0-next-4-navigation-item":
+        case "sd-7-0-0-next-5-navigation-item":
           target = accessibleTrigger.button;
           break;
         default:
@@ -136,7 +193,7 @@ var SdDropdown = class extends SolidElement {
     }
   }
   getMenu() {
-    return this.panel.assignedElements({ flatten: true }).find((el) => el.tagName.toLowerCase() === "sd-7-0-0-next-4-menu");
+    return this.panel.assignedElements({ flatten: true }).find((el) => el.tagName.toLowerCase() === "sd-7-0-0-next-5-menu");
   }
   handleKeyDown(event) {
     if (this.open && event.key === "Escape") {
@@ -148,7 +205,7 @@ var SdDropdown = class extends SolidElement {
   handleDocumentKeyDown(event) {
     var _a;
     if (event.key === "Tab") {
-      if (this.open && ((_a = document.activeElement) == null ? void 0 : _a.tagName.toLowerCase()) === "sd-7-0-0-next-4-menu-item") {
+      if (this.open && ((_a = document.activeElement) == null ? void 0 : _a.tagName.toLowerCase()) === "sd-7-0-0-next-5-menu-item") {
         event.preventDefault();
         this.hide();
         this.focusOnTrigger();
@@ -174,7 +231,7 @@ var SdDropdown = class extends SolidElement {
   }
   handlePanelSelect(event) {
     const target = event.target;
-    if (!this.stayOpenOnSelect && target.tagName.toLowerCase() === "sd-7-0-0-next-4-menu") {
+    if (!this.stayOpenOnSelect && target.tagName.toLowerCase() === "sd-7-0-0-next-5-menu") {
       this.hide();
       this.focusOnTrigger();
     }
@@ -263,7 +320,7 @@ var SdDropdown = class extends SolidElement {
   }
   addOpenListeners() {
     this.panel.addEventListener("sd-activate", this.handleMenuItemActivate);
-    this.panel.addEventListener("sd-7-0-0-next-4-select", this.handlePanelSelect);
+    this.panel.addEventListener("sd-7-0-0-next-5-select", this.handlePanelSelect);
     this.panel.addEventListener("keydown", this.handleKeyDown);
     document.addEventListener("keydown", this.handleDocumentKeyDown);
     document.addEventListener("mousedown", this.handleDocumentMouseDown);
@@ -271,7 +328,7 @@ var SdDropdown = class extends SolidElement {
   removeOpenListeners() {
     if (this.panel) {
       this.panel.removeEventListener("sd-activate", this.handleMenuItemActivate);
-      this.panel.removeEventListener("sd-7-0-0-next-4-select", this.handlePanelSelect);
+      this.panel.removeEventListener("sd-7-0-0-next-5-select", this.handlePanelSelect);
       this.panel.removeEventListener("keydown", this.handleKeyDown);
     }
     document.removeEventListener("keydown", this.handleDocumentKeyDown);
@@ -304,13 +361,13 @@ var SdDropdown = class extends SolidElement {
     }
   }
   render() {
-    return html`<sd-7-0-0-next-4-popup part="base" id="dropdown" exportparts="
+    return html`<sd-7-0-0-next-5-popup part="base" id="dropdown" exportparts="
           popup:base__popup,
         " placement="${this.placement}" distance="${this.rounded && this.distance < 1 ? 1 : this.distance}" skidding="${this.skidding}" strategy="${this.hoist ? "fixed" : "absolute"}" ?flip="${!this.noFlip}" shift auto-size="vertical" auto-size-padding="10"><slot name="trigger" slot="anchor" part="trigger" class="block" @click="${this.handleTriggerClick}" @keydown="${this.handleTriggerKeyDown}" @keyup="${this.handleTriggerKeyUp}" @slotchange="${this.handleTriggerSlotChange}"></slot><slot part="panel" class="${cx(
-      "panel-color-border border shadow sd-7-0-0-next-4-dropdown-color-background block",
+      "panel-color-border border shadow sd-7-0-0-next-5-dropdown-color-background block",
       this.open ? "pointer-events-auto" : "pointer-events-none",
       this.rounded && "rounded-md"
-    )}" aria-hidden="${this.open ? "false" : "true"}" aria-labelledby="dropdown"></slot></sd-7-0-0-next-4-popup>`;
+    )}" aria-hidden="${this.open ? "false" : "true"}" aria-labelledby="dropdown"></slot></sd-7-0-0-next-5-popup>`;
   }
 };
 SdDropdown.styles = [
@@ -364,7 +421,7 @@ __decorateClass([
   watch("open", { waitUntilFirstUpdate: true })
 ], SdDropdown.prototype, "handleOpenChange", 1);
 SdDropdown = __decorateClass([
-  customElement("sd-7-0-0-next-4-dropdown")
+  customElement("sd-7-0-0-next-5-dropdown")
 ], SdDropdown);
 setDefaultAnimation("dropdown.show", {
   keyframes: [{ opacity: 0 }, { opacity: 1 }],