@solid-design-system/components 6.14.1 → 6.15.1

package/dist/solid-components.js

@@ -4,194 +4,198 @@ import {
 import "./chunks/chunk.HAL7R4WT.js";
 import {
   SdTextarea
-} from "./chunks/chunk.A3S43CBC.js";
+} from "./chunks/chunk.OXOO3KJR.js";
 import {
   SdThemeListener
-} from "./chunks/chunk.3GPQESPG.js";
+} from "./chunks/chunk.W232H3IB.js";
 import {
   SdVideo
-} from "./chunks/chunk.7NZW7WLQ.js";
+} from "./chunks/chunk.AFXQPWOT.js";
 import {
-  SdSkeleton
-} from "./chunks/chunk.LODUNUOS.js";
+  SdStepGroup
+} from "./chunks/chunk.W5AX2LUX.js";
 import {
   SdSwitch
-} from "./chunks/chunk.4WNXRUZH.js";
+} from "./chunks/chunk.2MAKCGJO.js";
 import {
-  SdTabPanel
-} from "./chunks/chunk.LLSWFCWE.js";
+  SdTab
+} from "./chunks/chunk.M5DERDHH.js";
 import {
   SdTabGroup
-} from "./chunks/chunk.DGUXEXPL.js";
+} from "./chunks/chunk.UF32T6VG.js";
 import {
-  SdTab
-} from "./chunks/chunk.ATPSUELO.js";
+  SdTabPanel
+} from "./chunks/chunk.3IATPYUU.js";
 import {
   SdTeaser
-} from "./chunks/chunk.F3XPCSXO.js";
+} from "./chunks/chunk.SVQ4W63O.js";
 import {
   SdTeaserMedia
-} from "./chunks/chunk.G3UJC544.js";
+} from "./chunks/chunk.BN5RGZ7X.js";
 import {
   SdRange
-} from "./chunks/chunk.PEJ2JW45.js";
+} from "./chunks/chunk.2EW7BYJZ.js";
 import {
   SdTooltip
-} from "./chunks/chunk.VEQRI72U.js";
+} from "./chunks/chunk.OYNQ7MZD.js";
 import "./chunks/chunk.D3YSIVTB.js";
 import {
   SdRangeTick
-} from "./chunks/chunk.52QW7ROK.js";
+} from "./chunks/chunk.B3QOYMWK.js";
 import {
   SdScrollable
-} from "./chunks/chunk.32TUDE3B.js";
+} from "./chunks/chunk.E6I6KKTK.js";
 import {
   SdSelect
-} from "./chunks/chunk.4K7KXABW.js";
+} from "./chunks/chunk.64ZBVBUO.js";
+import {
+  SdSkeleton
+} from "./chunks/chunk.3EWWVPVW.js";
 import {
   SdSpinner
-} from "./chunks/chunk.2RZOV7LP.js";
+} from "./chunks/chunk.4PVDPEDP.js";
 import {
   SdStep
-} from "./chunks/chunk.BWOOL6ZP.js";
-import {
-  SdStepGroup
-} from "./chunks/chunk.T5UKZTWN.js";
-import {
-  SdNavigationItem
-} from "./chunks/chunk.EJTQJNQR.js";
+} from "./chunks/chunk.4DD46TI2.js";
 import {
   SdNotification
-} from "./chunks/chunk.XHMAGNOW.js";
+} from "./chunks/chunk.RKZHGP4C.js";
+import {
+  SdOptgroup
+} from "./chunks/chunk.ZXTVK4F6.js";
 import {
   SdOption
-} from "./chunks/chunk.LDJ3KULX.js";
+} from "./chunks/chunk.7BBBC4LC.js";
 import {
   SdQuickfact
-} from "./chunks/chunk.HVSE7PTC.js";
+} from "./chunks/chunk.ZZYYNAHQ.js";
+import {
+  SdRadioButton
+} from "./chunks/chunk.SEB7UTAG.js";
 import {
   SdRadioGroup
-} from "./chunks/chunk.6D5WVMOB.js";
+} from "./chunks/chunk.63RKU7YA.js";
 import {
   SdRadio
-} from "./chunks/chunk.356O7DWM.js";
-import {
-  SdRadioButton
-} from "./chunks/chunk.XBXTDLFY.js";
+} from "./chunks/chunk.36LQO3TW.js";
 import {
   SdInput
-} from "./chunks/chunk.YBF7Q5H5.js";
+} from "./chunks/chunk.GGTTE3O5.js";
 import {
   SdMapMarker
-} from "./chunks/chunk.7WMPYF5W.js";
+} from "./chunks/chunk.ULAWTDWL.js";
 import {
   SdMenu
-} from "./chunks/chunk.C2RQLDNG.js";
+} from "./chunks/chunk.4OTHCSXL.js";
 import {
   SdMenuItem
-} from "./chunks/chunk.3ZQ52GF4.js";
+} from "./chunks/chunk.GYT2MOIG.js";
 import "./chunks/chunk.KEJFWGZI.js";
 import {
-  SdOptgroup
-} from "./chunks/chunk.H4LAYA43.js";
+  SdNavigationItem
+} from "./chunks/chunk.JTMX3R54.js";
 import {
   SdInclude
-} from "./chunks/chunk.CJJGSFYP.js";
+} from "./chunks/chunk.UUWLJUQT.js";
 import {
   SdDatepicker
-} from "./chunks/chunk.OIQGS2G7.js";
+} from "./chunks/chunk.UCXRXX5Z.js";
 import "./chunks/chunk.SMPFJ52B.js";
 import {
   SdDialog
-} from "./chunks/chunk.S3Z7E2XZ.js";
+} from "./chunks/chunk.2FVZOVKD.js";
 import {
   SdDivider
-} from "./chunks/chunk.ZIYRKF5E.js";
+} from "./chunks/chunk.NMCXKPQT.js";
 import {
   SdExpandable
-} from "./chunks/chunk.SDFRWZBX.js";
+} from "./chunks/chunk.OYGPRSLI.js";
 import {
   SdFlipcard
-} from "./chunks/chunk.KVMOK7TX.js";
+} from "./chunks/chunk.PIOYH3TM.js";
 import {
   SdHeader
-} from "./chunks/chunk.GWJE3EEL.js";
+} from "./chunks/chunk.LVXSD6QO.js";
 import {
   SdCheckbox
-} from "./chunks/chunk.RKBIK6DJ.js";
+} from "./chunks/chunk.7MRFW5WU.js";
 import {
   SdCheckboxGroup
-} from "./chunks/chunk.VLEOHES2.js";
+} from "./chunks/chunk.4UDWRELW.js";
 import {
   SdCombobox
-} from "./chunks/chunk.GTONH2LP.js";
+} from "./chunks/chunk.NJDWX5QK.js";
 import {
   SdTag
-} from "./chunks/chunk.PJQS5I6W.js";
+} from "./chunks/chunk.PZF3TKOL.js";
 import "./chunks/chunk.GI7VDIWX.js";
 import "./chunks/chunk.WBJBQ4QI.js";
 import "./chunks/chunk.UIQBHPD3.js";
 import {
   SdBadge
-} from "./chunks/chunk.32FFCLCJ.js";
+} from "./chunks/chunk.LQFP4TQA.js";
 import {
   SdBrandshape
-} from "./chunks/chunk.BB7TXOED.js";
+} from "./chunks/chunk.3CHCXOIV.js";
 import {
   SdBreadcrumb
-} from "./chunks/chunk.CYUGTWDW.js";
+} from "./chunks/chunk.R6MGPVBY.js";
 import {
   SdDropdown
-} from "./chunks/chunk.GCKEV5H2.js";
+} from "./chunks/chunk.TKDGBDMS.js";
 import {
   SdPopup
-} from "./chunks/chunk.QVI7EHWO.js";
+} from "./chunks/chunk.VASBQKR7.js";
 import {
   SdBreadcrumbItem
-} from "./chunks/chunk.SMHZXEFP.js";
+} from "./chunks/chunk.2LQUJBN6.js";
 import {
   SdLink
-} from "./chunks/chunk.KS27P673.js";
-import "./chunks/chunk.ENCWCZFA.js";
+} from "./chunks/chunk.QGQMA2DH.js";
+import "./chunks/chunk.TEYSL3L7.js";
 import {
   SdCarousel
-} from "./chunks/chunk.OGGB7MS4.js";
+} from "./chunks/chunk.FIJX3VUF.js";
 import "./chunks/chunk.W2YDXTG5.js";
 import "./chunks/chunk.6RE6UZ72.js";
 import "./chunks/chunk.UVI5HHLF.js";
 import {
   SdCarouselItem
-} from "./chunks/chunk.25M2JPPZ.js";
+} from "./chunks/chunk.YIT6KCWE.js";
 import "./chunks/chunk.F4VGSDIW.js";
 import {
   SdAccordionGroup
-} from "./chunks/chunk.OMDIDRUF.js";
+} from "./chunks/chunk.UX4SNJ4S.js";
 import {
   SdAccordion
-} from "./chunks/chunk.5S63GKYX.js";
+} from "./chunks/chunk.2KAT6BIE.js";
+import {
+  SdAnimation
+} from "./chunks/chunk.SP3UZWV2.js";
+import "./chunks/chunk.TJOP7HQP.js";
 import {
   SdAudio
-} from "./chunks/chunk.6526NKSA.js";
+} from "./chunks/chunk.MSAZP6MW.js";
 import {
   SdDrawer
-} from "./chunks/chunk.BL6NQ5XT.js";
+} from "./chunks/chunk.F4SSJ3OK.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.GIWXGCIF.js";
+} from "./chunks/chunk.XYVBMQYZ.js";
 import {
   SdLoader
-} from "./chunks/chunk.B5KFI4YW.js";
+} from "./chunks/chunk.K35ZY362.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.UOCG3QGS.js";
+} from "./chunks/chunk.PBISMPN4.js";
 import {
   registerIconLibrary,
   unregisterIconLibrary
@@ -205,15 +209,11 @@ import {
   LocalizeController
 } from "./chunks/chunk.X3FE7OHE.js";
 import "./chunks/chunk.GWKDETUD.js";
-import "./chunks/chunk.M6QWSNU3.js";
-import "./chunks/chunk.POFWU6ZT.js";
-import {
-  SdAnimation
-} from "./chunks/chunk.HJQMTSL4.js";
+import "./chunks/chunk.XWRZKAAC.js";
 import "./chunks/chunk.X2OQMWGY.js";
-import "./chunks/chunk.HKLHB7GS.js";
+import "./chunks/chunk.V7PNN6GB.js";
 import "./chunks/chunk.HQWAKJBV.js";
-import "./chunks/chunk.TJOP7HQP.js";
+import "./chunks/chunk.POFWU6ZT.js";
 import "./chunks/chunk.S3NI7NKU.js";
 export {
   LocalizeController,

package/dist/translations/en.js

@@ -1,6 +1,6 @@
 import {
   en_default
-} from "../chunks/chunk.M6QWSNU3.js";
+} from "../chunks/chunk.XWRZKAAC.js";
 import "../chunks/chunk.S3NI7NKU.js";
 export {
   en_default as default

package/dist/utilities/autocomplete-config.js

@@ -1,8 +1,8 @@
 import {
   setupAutocomplete
 } from "../chunks/chunk.JBLVT4GJ.js";
-import "../chunks/chunk.QVI7EHWO.js";
-import "../chunks/chunk.HKLHB7GS.js";
+import "../chunks/chunk.VASBQKR7.js";
+import "../chunks/chunk.V7PNN6GB.js";
 import "../chunks/chunk.HQWAKJBV.js";
 import "../chunks/chunk.S3NI7NKU.js";
 export {

package/dist/utilities/localize.js

@@ -2,7 +2,7 @@ import {
   LocalizeController
 } from "../chunks/chunk.X3FE7OHE.js";
 import "../chunks/chunk.GWKDETUD.js";
-import "../chunks/chunk.M6QWSNU3.js";
+import "../chunks/chunk.XWRZKAAC.js";
 import "../chunks/chunk.S3NI7NKU.js";
 export {
   LocalizeController

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

@@ -479,6 +479,33 @@
         }
       ]
     },
+    {
+      "name": "sd-button-group",
+      "description": "Button groups can be used to group related buttons into sections.\n---\n\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 - _default_ - One or more `<sd-button>` elements to display in the button group.\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.",
+      "attributes": [
+        {
+          "name": "label",
+          "description": "A label to use for the button group. This won't be displayed on the screen, but it will be announced by assistive\ndevices when interacting with the control and is strongly recommended.",
+          "values": []
+        },
+        {
+          "name": "dir",
+          "description": "The element's directionality.",
+          "values": [{ "name": "ltr" }, { "name": "rtl" }, { "name": "auto" }]
+        },
+        {
+          "name": "lang",
+          "description": "The element's language.",
+          "values": []
+        }
+      ],
+      "references": [
+        {
+          "name": "Documentation",
+          "url": "https://solid-design-system.fe.union-investment.de/docs/?path=/docs/components-sd-button-group--docs"
+        }
+      ]
+    },
     {
       "name": "sd-carousel",
       "description": "Carousels display an arbitrary number of content slides along a horizontal axis.\n---\n\n\n### **Events:**\n - **sd-slide-change** - Emitted when the active slide changes.\n\n### **Methods:**\n - **pause()** - Pause the autoplay.\n- **resume()** - Resume the autoplay\n- **previous(behavior: _ScrollBehavior_)** - Move the carousel backward by `slides-per-move` slides.\n- **next(behavior: _ScrollBehavior_)** - Move the carousel forward by `slides-per-move` slides.\n- **goToSlide(index: _number_, behavior: _ScrollBehavior_)** - Scrolls the carousel to the slide specified by `index`.\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 carousel's main content, one or more `<sd-carousel-item>` elements.\n- **next-icon** - Optional next icon to use instead of the default. Works best with `<sd-icon>`.\n- **previous-icon** - Optional previous icon to use instead of the default. Works best with `<sd-icon>`.\n- **autoplay-start** - Optional start icon to use instead of the default. Works best with `<sd-icon>`.\n- **autoplay-pause** - Optional pause icon to use instead of the default. Works best with `<sd-icon>`.\n\n### **CSS Properties:**\n - **--slide-gap** - The space between each slide. _(default: undefined)_\n- **--scroll-hint** - The amount of padding to apply to the scroll area, allowing adjacent slides to become partially visible as a scroll hint. _(default: undefined)_\n- **--sd-carousel__pager-dot-border-width** - The border width of the pager dots in the carousel. _(default: undefined)_\n- **--sd-carousel__pager-dot--inverted-background** - The background for the pager dots in the inverted carousel when active. _(default: undefined)_\n- **--sd-carousel__pager-dot--inverted--hovered-background** - The background for the pager dots in the inverted carousel when hovered. _(default: undefined)_\n- **--sd-carousel__pager-dot--inverted-border** - The border color for the pager dots in the inverted carousel. _(default: undefined)_\n- **--sd-carousel__pager-dot-background** - The background for the pager dots when active. _(default: undefined)_\n- **--sd-carousel--active-color-border** - The border color for the active pagination item. _(default: undefined)_\n- **--sd-carousel--active--inverted-color-border** - The border color for the active pagination item in inverted carousel. _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The carousel's internal wrapper.\n- **scroll-container** - The scroll container that wraps the slides.\n- **controls** - A wrapper for the navigation and autoplay controller buttons.\n- **pagination-dot** - The pagination indicator in dot format.\n- **pagination-number** - The pagination indicator in number format.\n- **pagination-item** - The pagination indicator.\n- **pagination-item--active** - Applied when the item is active.\n- **navigation** - The navigation wrapper.\n- **navigation-button** - The navigation button.\n- **navigation-button--previous** - Applied to the previous button.\n- **navigation-button--next** - Applied to the next button.\n- **autoplay-controls** - A wrapper for pause/start button.",
@@ -558,33 +585,6 @@
         }
       ]
     },
-    {
-      "name": "sd-button-group",
-      "description": "Button groups can be used to group related buttons into sections.\n---\n\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 - _default_ - One or more `<sd-button>` elements to display in the button group.\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.",
-      "attributes": [
-        {
-          "name": "label",
-          "description": "A label to use for the button group. This won't be displayed on the screen, but it will be announced by assistive\ndevices when interacting with the control and is strongly recommended.",
-          "values": []
-        },
-        {
-          "name": "dir",
-          "description": "The element's directionality.",
-          "values": [{ "name": "ltr" }, { "name": "rtl" }, { "name": "auto" }]
-        },
-        {
-          "name": "lang",
-          "description": "The element's language.",
-          "values": []
-        }
-      ],
-      "references": [
-        {
-          "name": "Documentation",
-          "url": "https://solid-design-system.fe.union-investment.de/docs/?path=/docs/components-sd-button-group--docs"
-        }
-      ]
-    },
     {
       "name": "sd-checkbox",
       "description": "Checkboxes allow the user to toggle an option on or off.\n---\n\n\n### **Events:**\n - **sd-blur** - Emitted when the checkbox loses focus.\n- **sd-change** - Emitted when the checked state changes.\n- **sd-focus** - Emitted when the checkbox gains focus.\n- **sd-input** - Emitted when the checkbox receives input.\n\n### **Methods:**\n - **click()** - Simulates a click on the checkbox.\n- **focus(options: _FocusOptions_)** - Sets focus on the checkbox.\n- **blur()** - Removes focus from the checkbox.\n- **checkValidity()** - Checks for validity but does not show a validation message. Returns true when valid and false when invalid.\n- **getForm(): _HTMLFormElement | null_** - Gets the associated form, if one exists.\n- **reportValidity()** - Checks for validity and shows a validation message if the control is invalid.\n- **setCustomValidity(message: _string_)** - Sets a custom validation message. The value provided will be shown to the user when the form is submitted. To clear\nthe custom validation message, call this method with an empty string.\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 checkbox's label.\n\n### **CSS Properties:**\n - **--sd-checkbox-border-width** - The border width of the checkbox. _(default: undefined)_\n- **--sd-form-control-color-border** - The color border for form controls. _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.\n- **control** - The square container that wraps the checkbox's checked state.\n- **control--checked** - Matches the control part when the checkbox is checked.\n- **control--indeterminate** - Matches the control part when the checkbox is indeterminate.\n- **checked-icon** - The checked icon, an `<sd-icon>` element.\n- **indeterminate-icon** - The indeterminate icon, an `<sd-icon>` element.\n- **label** - The container that wraps the checkbox's label.",
@@ -1000,17 +1000,22 @@
       ]
     },
     {
-      "name": "sd-divider",
-      "description": "Dividers are used to visually separate or group elements.\n---\n\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### **CSS Properties:**\n - **--sd-divider--inverted-color-border** - The border color for dividers in inverted state. _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.",
+      "name": "sd-dialog",
+      "description": "Dialogs, sometimes called \"modals\", appear above the page and require the user's immediate attention.\n---\n\n\n### **Events:**\n - **sd-show** - Emitted when the dialog opens.\n- **sd-after-show** - Emitted after the dialog opens and all animations are complete.\n- **sd-hide** - Emitted when the dialog closes.\n- **sd-after-hide** - Emitted after the dialog closes and all animations are complete.\n- **sd-initial-focus** - Emitted when the dialog 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 dialog by clicking the close button, clicking the overlay, or pressing escape. Calling `event.preventDefault()` will keep the dialog open. Avoid using this unless closing the dialog will result in destructive behavior such as data loss.\n\n### **Methods:**\n - **show()** - Shows the dialog.\n- **hide()** - Hides the dialog\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 dialog's main content.\n- **headline** - The dialog's headline. Alternatively, you can use the `headline` attribute.\n- **footer** - The dialog's footer, usually one or more buttons representing various options.\n- **close-button** - The dialog's close button. Works best with `<sd-button>` and `<sd-icon>`.\n\n### **CSS Properties:**\n - **--width** - The preferred width of the dialog. Note that the dialog will shrink to accommodate smaller screens. _(default: undefined)_\n- **--sd-panel-color-border** - The border color of the dialog panel. _(default: undefined)_\n- **--sd-overlay-color-background** - The background color of the dialog overlay. _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.\n- **overlay** - The overlay that covers the screen behind the dialog.\n- **panel** - The dialog's panel (where the dialog and its content are rendered).\n- **header** - The dialog's header. This element wraps the title and header actions.\n- **title** - The dialog's title.\n- **close-button** - The close button, an `<sd-button>`.\n- **body** - The dialog's body.\n- **footer** - The dialog's footer.",
       "attributes": [
         {
-          "name": "orientation",
-          "description": "Determines the orientation of the divider.",
-          "values": [{ "name": "horizontal" }, { "name": "vertical" }]
+          "name": "open",
+          "description": "Indicates whether or not the dialog is open. You can toggle this attribute to show and hide the dialog, or you can\nuse the `show()` and `hide()` methods and this attribute will reflect the dialog's open state.",
+          "values": []
         },
         {
-          "name": "inverted",
-          "description": "This inverts the divider.",
+          "name": "headline",
+          "description": "The dialog's headline as displayed in the header. If you need to display HTML, use the `headline` slot instead.",
+          "values": []
+        },
+        {
+          "name": "no-close-button",
+          "description": "This will remove the default close button. Please ensure you provide an easy, accessible way for users to dismiss the dialog.",
           "values": []
         },
         {
@@ -1027,27 +1032,22 @@
       "references": [
         {
           "name": "Documentation",
-          "url": "https://solid-design-system.fe.union-investment.de/docs/?path=/docs/components-sd-divider--docs"
+          "url": "https://solid-design-system.fe.union-investment.de/docs/?path=/docs/components-sd-dialog--docs"
         }
       ]
     },
     {
-      "name": "sd-dialog",
-      "description": "Dialogs, sometimes called \"modals\", appear above the page and require the user's immediate attention.\n---\n\n\n### **Events:**\n - **sd-show** - Emitted when the dialog opens.\n- **sd-after-show** - Emitted after the dialog opens and all animations are complete.\n- **sd-hide** - Emitted when the dialog closes.\n- **sd-after-hide** - Emitted after the dialog closes and all animations are complete.\n- **sd-initial-focus** - Emitted when the dialog 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 dialog by clicking the close button, clicking the overlay, or pressing escape. Calling `event.preventDefault()` will keep the dialog open. Avoid using this unless closing the dialog will result in destructive behavior such as data loss.\n\n### **Methods:**\n - **show()** - Shows the dialog.\n- **hide()** - Hides the dialog\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 dialog's main content.\n- **headline** - The dialog's headline. Alternatively, you can use the `headline` attribute.\n- **footer** - The dialog's footer, usually one or more buttons representing various options.\n- **close-button** - The dialog's close button. Works best with `<sd-button>` and `<sd-icon>`.\n\n### **CSS Properties:**\n - **--width** - The preferred width of the dialog. Note that the dialog will shrink to accommodate smaller screens. _(default: undefined)_\n- **--sd-panel-color-border** - The border color of the dialog panel. _(default: undefined)_\n- **--sd-overlay-color-background** - The background color of the dialog overlay. _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.\n- **overlay** - The overlay that covers the screen behind the dialog.\n- **panel** - The dialog's panel (where the dialog and its content are rendered).\n- **header** - The dialog's header. This element wraps the title and header actions.\n- **title** - The dialog's title.\n- **close-button** - The close button, an `<sd-button>`.\n- **body** - The dialog's body.\n- **footer** - The dialog's footer.",
+      "name": "sd-divider",
+      "description": "Dividers are used to visually separate or group elements.\n---\n\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### **CSS Properties:**\n - **--sd-divider--inverted-color-border** - The border color for dividers in inverted state. _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.",
       "attributes": [
         {
-          "name": "open",
-          "description": "Indicates whether or not the dialog is open. You can toggle this attribute to show and hide the dialog, or you can\nuse the `show()` and `hide()` methods and this attribute will reflect the dialog's open state.",
-          "values": []
-        },
-        {
-          "name": "headline",
-          "description": "The dialog's headline as displayed in the header. If you need to display HTML, use the `headline` slot instead.",
-          "values": []
+          "name": "orientation",
+          "description": "Determines the orientation of the divider.",
+          "values": [{ "name": "horizontal" }, { "name": "vertical" }]
         },
         {
-          "name": "no-close-button",
-          "description": "This will remove the default close button. Please ensure you provide an easy, accessible way for users to dismiss the dialog.",
+          "name": "inverted",
+          "description": "This inverts the divider.",
           "values": []
         },
         {
@@ -1064,7 +1064,7 @@
       "references": [
         {
           "name": "Documentation",
-          "url": "https://solid-design-system.fe.union-investment.de/docs/?path=/docs/components-sd-dialog--docs"
+          "url": "https://solid-design-system.fe.union-investment.de/docs/?path=/docs/components-sd-divider--docs"
         }
       ]
     },
@@ -2315,6 +2315,48 @@
         }
       ]
     },
+    {
+      "name": "sd-radio-button",
+      "description": "Radio buttons allow the user to select a single option from a group using a button-like control.\n---\n\n\n### **Events:**\n - **sd-blur** - Emitted when the button loses focus.\n- **sd-focus** - Emitted when the button gains focus.\n\n### **Methods:**\n - **focus(options: _FocusOptions_)** - Sets focus on the radio button.\n- **blur()** - Removes focus from the radio button.\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 radio button's label.\n- **icon** - A presentational icon.\n\n### **CSS Properties:**\n - **--sd-button--primary--default-color-background** - The background color of radio-button when checked. _(default: undefined)_\n- **--sd-button--primary--default-color-text** - The text color of radio-button when checked. _(default: undefined)_\n- **--sd-button--primary--hover-color-background** - The background color of radio-button on hover when checked. _(default: undefined)_\n- **--sd-radio-button-border-radius** - The border radius of the radio-button. _(default: undefined)_\n- **--sd-radio-button-color-text** - The text color of the radio-button. _(default: undefined)_\n- **--sd-radio-button--hover-color-background** - The background color of the radio-button on hover. _(default: undefined)_\n- **--sd-choice-control-font-weight** - The font weight for the radio button. _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.\n- **button** - The internal `<button>` element.\n- **button--checked** - The internal button element when the radio button is checked.\n- **icon** - The container that wraps the icon.\n- **label** - The container that wraps the radio button's label.",
+      "attributes": [
+        {
+          "name": "size",
+          "description": "The radio button's size.",
+          "values": [{ "name": "lg" }, { "name": "md" }, { "name": "sm" }]
+        },
+        {
+          "name": "disabled",
+          "description": "Disables the radio button.",
+          "values": []
+        },
+        {
+          "name": "visually-disabled",
+          "description": "Styles the radio-button as if it was disabled and enables aria-disabled",
+          "values": []
+        },
+        {
+          "name": "value",
+          "description": "The radio's value. When selected, the radio group will receive this value.",
+          "values": []
+        },
+        {
+          "name": "dir",
+          "description": "The element's directionality.",
+          "values": [{ "name": "ltr" }, { "name": "rtl" }, { "name": "auto" }]
+        },
+        {
+          "name": "lang",
+          "description": "The element's language.",
+          "values": []
+        }
+      ],
+      "references": [
+        {
+          "name": "Documentation",
+          "url": "https://solid-design-system.fe.union-investment.de/docs/?path=/docs/components-sd-radio-button--docs"
+        }
+      ]
+    },
     {
       "name": "sd-radio-group",
       "description": "Radio groups are used to group multiple [radios](/components/radio) or [radio buttons](/components/radio-button) so they function as a single form control.\n---\n\n\n### **Events:**\n - **sd-change** - Emitted when the radio group's selected value changes.\n- **sd-input** - Emitted when the radio group receives user input.\n- **sd-invalid** - Emitted when the form control has been checked for validity and its constraints aren't satisfied.\n\n### **Methods:**\n - **focus()** - Move focus to the checked radio (or the first one if none are checked)\n- **checkValidity()** - Checks for validity but does not show a validation message. Returns `true` when valid and `false` when invalid.\n- **getForm(): _HTMLFormElement | null_** - Gets the associated form, if one exists.\n- **reportValidity(): _boolean_** - Checks for validity and shows the browser's validation message if the control is invalid.\n- **setCustomValidity(message)** - 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 - _default_ - The default slot where `<sd-radio>` or `<sd-radio-button>` elements are placed.\n- **label** - The radio group's label. Required for proper accessibility. Alternatively, you can use the `label` attribute.\n- **help-text** - Text that describes how to use the input. Alternatively, you can use the `help-text` attribute.\n- **tooltip** - An optional tooltip that helps describe the radio-group. Use this slot with the `sd-tooltip` component.\n\n### **CSS Properties:**\n - **--sd-radio-button-group-border-radius** - The border radius for radio button groups. _(default: undefined)_\n- **--sd-radio-button-group-border-width** - The border width for radio button groups. _(default: undefined)_\n- **--sd-radio-button-group-padding** - The padding for radio button groups. _(default: undefined)_\n\n### **CSS Parts:**\n - **form-control** - The form control that wraps the label, input, and error text.\n- **form-control-label** - The label's wrapper.\n- **form-control-input** - The input's wrapper.\n- **button-group** - The button group that wraps radio buttons.\n- **button-group__base** - The button group's `base` part.",
@@ -2459,48 +2501,6 @@
         }
       ]
     },
-    {
-      "name": "sd-radio-button",
-      "description": "Radio buttons allow the user to select a single option from a group using a button-like control.\n---\n\n\n### **Events:**\n - **sd-blur** - Emitted when the button loses focus.\n- **sd-focus** - Emitted when the button gains focus.\n\n### **Methods:**\n - **focus(options: _FocusOptions_)** - Sets focus on the radio button.\n- **blur()** - Removes focus from the radio button.\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 radio button's label.\n- **icon** - A presentational icon.\n\n### **CSS Properties:**\n - **--sd-button--primary--default-color-background** - The background color of radio-button when checked. _(default: undefined)_\n- **--sd-button--primary--default-color-text** - The text color of radio-button when checked. _(default: undefined)_\n- **--sd-button--primary--hover-color-background** - The background color of radio-button on hover when checked. _(default: undefined)_\n- **--sd-radio-button-border-radius** - The border radius of the radio-button. _(default: undefined)_\n- **--sd-radio-button-color-text** - The text color of the radio-button. _(default: undefined)_\n- **--sd-radio-button--hover-color-background** - The background color of the radio-button on hover. _(default: undefined)_\n- **--sd-choice-control-font-weight** - The font weight for the radio button. _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.\n- **button** - The internal `<button>` element.\n- **button--checked** - The internal button element when the radio button is checked.\n- **icon** - The container that wraps the icon.\n- **label** - The container that wraps the radio button's label.",
-      "attributes": [
-        {
-          "name": "size",
-          "description": "The radio button's size.",
-          "values": [{ "name": "lg" }, { "name": "md" }, { "name": "sm" }]
-        },
-        {
-          "name": "disabled",
-          "description": "Disables the radio button.",
-          "values": []
-        },
-        {
-          "name": "visually-disabled",
-          "description": "Styles the radio-button as if it was disabled and enables aria-disabled",
-          "values": []
-        },
-        {
-          "name": "value",
-          "description": "The radio's value. When selected, the radio group will receive this value.",
-          "values": []
-        },
-        {
-          "name": "dir",
-          "description": "The element's directionality.",
-          "values": [{ "name": "ltr" }, { "name": "rtl" }, { "name": "auto" }]
-        },
-        {
-          "name": "lang",
-          "description": "The element's language.",
-          "values": []
-        }
-      ],
-      "references": [
-        {
-          "name": "Documentation",
-          "url": "https://solid-design-system.fe.union-investment.de/docs/?path=/docs/components-sd-radio-button--docs"
-        }
-      ]
-    },
     {
       "name": "sd-range-tick",
       "description": "Ticks visually improve positioning on range sliders.\n---\n\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 - _default_ - The tick's label\n\n### **CSS Properties:**\n - **--sd-range-scale-ticks-color-text** - The text color for range scale ticks. _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.\n- **label** - The component's label.\n- **line** - The component's tick line.",