npm - dap-design-system - Versions diffs - 0.56.0 → 0.56.2 - Mend

dap-design-system 0.56.0 → 0.56.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (14) hide show

package/dist/components/radio-button/radio-button.component.d.ts +8 -21
package/dist/{components-D2vYSZvx.js → components-DtNvQM0v.js} +1049 -1058
package/dist/components-DtNvQM0v.js.map +1 -0
package/dist/components.js +1 -1
package/dist/dds.js +1 -1
package/dist/manifest/types/vue/index.d.ts +190 -184
package/dist/manifest/vscode.html-custom-data.json +147 -137
package/dist/manifest/web-types.json +377 -356
package/dist/react/index.d.ts +6 -6
package/dist/react-types.ts +6 -6
package/dist/react.js +93 -93
package/dist/react.js.map +1 -1
package/package.json +1 -1
package/dist/components-D2vYSZvx.js.map +0 -1

package/dist/manifest/web-types.json CHANGED Viewed

@@ -6,6 +6,45 @@
   "contributions": {
     "html": {
       "elements": [
+        {
+          "name": "dap-ds-accordion-group",
+          "description": "An accordion group is a collection of accordion components.\n---\n\n\n### **Slots:**\n - _default_ - The content of the accordion group.\n\n### **CSS Properties:**\n - **--dds-accordion-group-spacing** - Controls the gap between accordion items (default: var(--dds-spacing-300)) _(default: undefined)_\n- **--dds-accordion-group-border-color** - Controls the border color (default: var(--dds-border-neutral-subtle)) _(default: undefined)_\n- **--dds-accordion-group-border-width** - Controls the border width (default: var(--dds-border-width-base)) _(default: undefined)_\n- **--dds-accordion-group-border-radius** - Controls the border radius (default: var(--dds-radius-base)) _(default: undefined)_\n- **--dds-accordion-group-background** - Controls the background color (default: transparent) _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The main accordion group container.",
+          "doc-url": "",
+          "attributes": [
+            {
+              "name": "autoClose",
+              "description": "Whether to close other accordions when one is opened.",
+              "value": { "type": "string", "default": "'true'" }
+            },
+            {
+              "name": "variant",
+              "description": "The variant of the accordion",
+              "value": {
+                "type": "'default' | 'collapsed' | 'clean' | 'clean-collapsed'",
+                "default": "'default'"
+              }
+            }
+          ],
+          "slots": [
+            { "name": "", "description": "The content of the accordion group." }
+          ],
+          "events": [],
+          "js": {
+            "properties": [
+              {
+                "name": "autoClose",
+                "description": "Whether to close other accordions when one is opened.",
+                "type": "string"
+              },
+              {
+                "name": "variant",
+                "description": "The variant of the accordion",
+                "type": "'default' | 'collapsed' | 'clean' | 'clean-collapsed'"
+              }
+            ],
+            "events": []
+          }
+        },
         {
           "name": "dap-ds-avatar",
           "description": "Avatar component can be used to display user profile images, initials, or icons.\n---\n\n\n### **Events:**\n - **dds-load** - Fired when the image loads successfully.\n- **dds-error** - Fired when the image fails to load.\n\n### **Slots:**\n - **icon** - The icon to display when variant is 'icon'.\n- **fallback** - Custom fallback content when image fails to load.\n\n### **CSS Properties:**\n - **--dds-avatar-border-radius** - The border radius of the avatar (default: 50%) _(default: undefined)_\n- **--dds-avatar-background-color** - The background color of the avatar (default: var(--dds-neutral-200)) _(default: undefined)_\n- **--dds-avatar-border-width** - The border width of the avatar (default: 0) _(default: undefined)_\n- **--dds-avatar-border-color** - The color of the avatar's border (default: transparent) _(default: undefined)_\n- **--dds-avatar-border-style** - The style of the avatar's border (default: solid) _(default: undefined)_\n- **--dds-avatar-transition** - The transition property for the avatar (default: all 0.2s ease-in-out) _(default: undefined)_\n- **--dds-avatar-text-color** - The text color for initials (default: var(--dds-text-neutral-strong)) _(default: undefined)_\n- **--dds-avatar-font-weight** - The font weight for initials (default: var(--dds-font-weight-bold)) _(default: undefined)_\n- **--dds-avatar-lg-size** - Size for large avatars (default: var(--dds-avatar-size-lg)) _(default: undefined)_\n- **--dds-avatar-md-size** - Size for medium avatars (default: var(--dds-avatar-size-md)) _(default: undefined)_\n- **--dds-avatar-sm-size** - Size for small avatars (default: var(--dds-avatar-size-sm)) _(default: undefined)_\n- **--dds-avatar-xs-size** - Size for extra small avatars (default: var(--dds-avatar-size-xs)) _(default: undefined)_\n- **--dds-avatar-xxs-size** - Size for extra extra small avatars (default: var(--dds-avatar-size-xxs)) _(default: undefined)_\n- **--dds-avatar-font-size-lg** - Font size for large avatars (default: var(--dds-font-2xl)) _(default: undefined)_\n- **--dds-avatar-font-size-md** - Font size for medium avatars (default: var(--dds-font-lg)) _(default: undefined)_\n- **--dds-avatar-font-size-sm** - Font size for small avatars (default: var(--dds-font-base)) _(default: undefined)_\n- **--dds-avatar-font-size-xs** - Font size for extra small avatars (default: var(--dds-font-sm)) _(default: undefined)_\n- **--dds-avatar-font-size-xxs** - Font size for extra extra small avatars (default: var(--dds-font-xs)) _(default: undefined)_\n- **--dds-avatar-hover-transform** - Transform applied on hover for interactive avatars (default: scale(1.05)) _(default: undefined)_\n- **--dds-avatar-active-transform** - Transform applied when active for interactive avatars (default: scale(0.95)) _(default: undefined)_\n- **--dds-avatar-focus-ring** - Focus ring style for interactive avatars (default: 0 0 0 2px var(--dds-focus-outer-ring)) _(default: undefined)_\n- **--dds-avatar-loading-background** - Background color when loading (default: var(--dds-neutral-100)) _(default: undefined)_\n- **--dds-avatar-error-background** - Background color when image fails to load (default: var(--dds-negative-100)) _(default: undefined)_\n- **--dds-avatar-error-color** - Text color when image fails to load (default: var(--dds-negative-600)) _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The main avatar container.\n- **img** - The avatar image.\n- **initials** - The initials container.\n- **icon** - The icon container.\n- **fallback** - The fallback content container.\n- **loading** - The loading indicator.",
@@ -163,105 +202,6 @@
             ]
           }
         },
-        {
-          "name": "dap-ds-avatar-group",
-          "description": "Avatar group component displays multiple avatars in an organized layout with overflow management.\n---\n\n\n### **Events:**\n - **dds-overflow-click** - Fired when the overflow indicator is clicked.\n\n### **Slots:**\n - _default_ - The avatars to display in the group.\n\n### **CSS Properties:**\n - **--dds-avatar-group-gap** - Gap between avatars in grid layout (default: 0) _(default: undefined)_\n- **--dds-avatar-group-overlap** - Overlap amount for stacked layout (default: -8px) _(default: undefined)_\n- **--dds-avatar-group-border-width** - Border width for avatars (default: var(--dds-border-width-base)) _(default: undefined)_\n- **--dds-avatar-group-border-color** - Border color for avatars (default: var(--dds-border-neutral-divider)) _(default: undefined)_\n- **--dds-avatar-group-overflow-bg** - Background color for overflow indicator (default: var(--dds-neutral-300)) _(default: undefined)_\n- **--dds-avatar-group-overflow-color** - Text color for overflow indicator (default: var(--dds-neutral-700)) _(default: undefined)_\n- **--dds-avatar-group-overflow-border** - Border for overflow indicator (default: var(--dds-avatar-group-border-width) solid var(--dds-avatar-group-border-color)) _(default: undefined)_\n- **--dds-avatar-group-size-lg** - Size for large avatars (default: var(--dds-spacing-2000)) _(default: undefined)_\n- **--dds-avatar-group-size-md** - Size for medium avatars (default: var(--dds-spacing-1600)) _(default: undefined)_\n- **--dds-avatar-group-size-sm** - Size for small avatars (default: var(--dds-spacing-1200)) _(default: undefined)_\n- **--dds-avatar-group-size-xs** - Size for extra small avatars (default: var(--dds-spacing-800)) _(default: undefined)_\n- **--dds-avatar-group-size-xxs** - Size for extra extra small avatars (default: var(--dds-spacing-400)) _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The main container of the avatar group.\n- **avatars** - The container for the visible avatars.\n- **overflow** - The overflow indicator element.",
-          "doc-url": "",
-          "attributes": [
-            {
-              "name": "layout",
-              "description": "Layout type for the avatar group",
-              "value": { "type": "'stack' | 'grid'", "default": "'stack'" }
-            },
-            {
-              "name": "max",
-              "description": "Maximum number of avatars to show before showing overflow",
-              "value": { "type": "number", "default": "3" }
-            },
-            {
-              "name": "show-total",
-              "description": "Whether to show the total count in overflow indicator",
-              "value": { "type": "boolean", "default": "false" }
-            },
-            {
-              "name": "interactive-overflow",
-              "description": "Interactive overflow indicator",
-              "value": { "type": "boolean", "default": "false" }
-            },
-            {
-              "name": "label",
-              "description": "Accessible label for the avatar group",
-              "value": { "type": "string" }
-            },
-            {
-              "name": "overflow-label",
-              "description": "Accessible label for the overflow indicator",
-              "value": { "type": "string" }
-            }
-          ],
-          "slots": [
-            {
-              "name": "",
-              "description": "The avatars to display in the group."
-            }
-          ],
-          "events": [
-            {
-              "name": "dds-overflow-click",
-              "description": "Fired when the overflow indicator is clicked."
-            }
-          ],
-          "js": {
-            "properties": [
-              {
-                "name": "layout",
-                "description": "Layout type for the avatar group",
-                "type": "'stack' | 'grid'"
-              },
-              {
-                "name": "max",
-                "description": "Maximum number of avatars to show before showing overflow",
-                "type": "number"
-              },
-              {
-                "name": "showTotal",
-                "description": "Whether to show the total count in overflow indicator",
-                "type": "boolean"
-              },
-              {
-                "name": "interactiveOverflow",
-                "description": "Interactive overflow indicator",
-                "type": "boolean"
-              },
-              {
-                "name": "label",
-                "description": "Accessible label for the avatar group",
-                "type": "string"
-              },
-              {
-                "name": "overflowLabel",
-                "description": "Accessible label for the overflow indicator",
-                "type": "string"
-              },
-              {
-                "name": "size",
-                "description": "The size of avatars in the group. Default is `md`. See SizedMixin.",
-                "type": "'xxs' | 'xs' | 'sm' | 'md' | 'lg'"
-              },
-              {
-                "name": "sizeMap",
-                "description": "Responsive size map (e.g. \"md:lg\"); see SizedMixin.",
-                "type": "string"
-              }
-            ],
-            "events": [
-              {
-                "name": "dds-overflow-click",
-                "description": "Fired when the overflow indicator is clicked."
-              }
-            ]
-          }
-        },
         {
           "name": "dap-ds-accordion",
           "description": "An accordion is a vertically stacked list of interactive items that can be expanded or collapsed to reveal or hide content.\n---\n\n\n### **Events:**\n - **dds-opened** - Event fired when the accordion is opened.\n- **dds-closed** - Event fired when the accordion is closed.\n\n### **Slots:**\n - **default** - The content of the accordion.\n- **heading** - The heading of the accordion.\n- **icon-opened** - The icon when the accordion is opened.\n- **icon-closed** - The icon when the accordion is closed.\n\n### **CSS Properties:**\n - **--dds-accordion-border-width** - The width of the accordion border (default: var(--dds-border-width-base)) _(default: undefined)_\n- **--dds-accordion-border-style** - The style of the accordion border (default: solid) _(default: undefined)_\n- **--dds-accordion-border-radius** - The border radius of the accordion (default: var(--dds-radius-base)) _(default: undefined)_\n- **--dds-accordion-border-color** - The color of the accordion border (default: var(--dds-border-neutral-divider)) _(default: undefined)_\n- **--dds-accordion-background-color** - The background color of the accordion (default: var(--dds-background-neutral-subtle)) _(default: undefined)_\n- **--dds-accordion-text-color** - The text color of the accordion (default: var(--dds-text-neutral-strong)) _(default: undefined)_\n- **--dds-accordion-hover-background** - The background color when hovering over the accordion (default: var(--dds-background-neutral-base)) _(default: undefined)_\n- **--dds-accordion-active-background** - The background color when the accordion is active (default: var(--dds-background-neutral-medium)) _(default: undefined)_\n- **--dds-accordion-icon-background** - The background color of the accordion icon (default: var(--dds-transparent-black-subtle)) _(default: undefined)_\n- **--dds-accordion-icon-color** - The color of the accordion icon (default: var(--dds-icon-neutral-base)) _(default: undefined)_\n- **--dds-accordion-icon-hover-background** - The background color of the accordion icon when hovered (default: var(--dds-transparent-black-base)) _(default: undefined)_\n- **--dds-accordion-icon-active-background** - The background color of the accordion icon when active (default: var(--dds-transparent-black-strong)) _(default: undefined)_\n- **--dds-accordion-icon-hover-color** - The color of the accordion icon when hovered (default: var(--dds-icon-neutral-strong)) _(default: undefined)_\n- **--dds-accordion-icon-active-color** - The color of the accordion icon when active (default: var(--dds-icon-neutral-strong)) _(default: undefined)_\n- **--dds-accordion-content-color** - The color of the accordion content (default: var(--dds-text-text-neutral)) _(default: undefined)_\n- **--dds-accordion-transition-duration** - The duration of the accordion transitions (default: var(--dds-transition-fast)) _(default: undefined)_\n- **--dds-accordion-transition-timing** - The timing function of the accordion transitions (default: var(--dds-easing-ease-in-out)) _(default: undefined)_\n- **--dds-accordion-divider-color** - The color of the divider between accordion items (default: var(--dds-border-neutral-divider)) _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The main accordion container.\n- **heading** - The heading of the accordion.\n- **button** - The button of the accordion.\n- **content** - The content of the accordion.\n- **content-container** - The container of the accordion content.\n- **icon-wrapper** - The icon wrapper of the accordion.\n- **open-icon** - The icon when the accordion is opened.\n- **open-icon-base** - The base of the icon when the accordion is opened.\n- **close-icon** - The icon when the accordion is closed.\n- **close-icon-base** - The base of the icon when the accordion is closed.",
@@ -429,33 +369,6 @@
             "events": []
           }
         },
-        {
-          "name": "dap-ds-anchor-heading",
-          "description": "Anchor heading is a heading with an anchor link.\n---\n\n\n### **CSS Properties:**\n - **--dds-anchor-link-color** - The color of the anchor link (default: var(--dds-color-primary)) _(default: undefined)_\n- **--dds-anchor-link-opacity** - The opacity of the anchor link when not hovered (default: 0) _(default: undefined)_\n- **--dds-anchor-link-hover-opacity** - The opacity of the anchor link when hovered (default: 1) _(default: undefined)_\n- **--dds-anchor-link-transition** - The transition property for the anchor link opacity (default: opacity 0.2s ease-in-out) _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The main anchor heading container.\n- **link** - The link of the anchor heading. dap-ds-link element.\n- **link-base** - The base of the link part.\n- **text** - The text of the anchor heading.",
-          "doc-url": "",
-          "attributes": [
-            {
-              "name": "variant",
-              "description": "The variant of the heading. Default is `h2`. Can be `h1`, `h2`, `h3`, `h4`, `h5`, or `h6`.",
-              "value": { "type": "HeadingVariant" }
-            },
-            {
-              "name": "label",
-              "description": "The label of the heading.",
-              "value": { "type": "string" }
-            }
-          ],
-          "events": [],
-          "js": {
-            "properties": [
-              { "name": "variant", "type": "HeadingVariant" },
-              { "name": "label", "type": "string" },
-              { "name": "elementId" },
-              { "name": "anchorTitle" }
-            ],
-            "events": []
-          }
-        },
         {
           "name": "dap-ds-banner",
           "description": "A banner is a message displayed at the top of the page to provide important information to the user.\n---\n\n\n### **Events:**\n - **dds-close** - Event fired when the banner is closed.\n\n### **Slots:**\n - _default_ - The content of the banner.\n- **actions** - Actions of banner\n- **icon** - The icon of the banner.\n\n### **CSS Properties:**\n - **--dds-banner-gap** - The gap between banner elements (default: var(--dds-spacing-200)) _(default: undefined)_\n- **--dds-banner-line-height** - The line height of the banner text (default: var(--dds-font-line-height-xlarge)) _(default: undefined)_\n- **--dds-banner-transition** - The transition property for the banner (default: all 0.2s ease-in-out) _(default: undefined)_\n- **--dds-banner-brand-background** - The background color of the brand banner (default: var(--dds-banner-background-brand)) _(default: undefined)_\n- **--dds-banner-brand-icon-color** - The color of the brand banner icon (default: var(--dds-banner-icon-brand)) _(default: undefined)_\n- **--dds-banner-brand-text-color** - The text color of the brand banner (default: var(--dds-banner-text-brand)) _(default: undefined)_\n- **--dds-banner-brand-action-color** - The color of the brand banner actions (default: var(--dds-banner-action-enabled)) _(default: undefined)_\n- **--dds-banner-info-background** - The background color of the info banner (default: var(--dds-banner-background-informative)) _(default: undefined)_\n- **--dds-banner-info-icon-color** - The color of the info banner icon (default: var(--dds-banner-icon-informative)) _(default: undefined)_\n- **--dds-banner-info-text-color** - The text color of the info banner (default: var(--dds-banner-text-informative)) _(default: undefined)_\n- **--dds-banner-info-action-color** - The color of the info banner actions (default: var(--dds-banner-action-enabled)) _(default: undefined)_\n- **--dds-banner-positive-background** - The background color of the positive banner (default: var(--dds-banner-background-positive)) _(default: undefined)_\n- **--dds-banner-positive-icon-color** - The color of the positive banner icon (default: var(--dds-banner-icon-positive)) _(default: undefined)_\n- **--dds-banner-positive-text-color** - The text color of the positive banner (default: var(--dds-banner-text-positive)) _(default: undefined)_\n- **--dds-banner-positive-action-color** - The color of the positive banner actions (default: var(--dds-banner-action-enabled)) _(default: undefined)_\n- **--dds-banner-warning-background** - The background color of the warning banner (default: var(--dds-banner-background-warning)) _(default: undefined)_\n- **--dds-banner-warning-icon-color** - The color of the warning banner icon (default: var(--dds-banner-icon-warning)) _(default: undefined)_\n- **--dds-banner-warning-text-color** - The text color of the warning banner (default: var(--dds-banner-text-warning)) _(default: undefined)_\n- **--dds-banner-warning-action-color** - The color of the warning banner actions (default: var(--dds-banner-action-inverted-enabled)) _(default: undefined)_\n- **--dds-banner-negative-background** - The background color of the negative banner (default: var(--dds-banner-background-negative)) _(default: undefined)_\n- **--dds-banner-negative-icon-color** - The color of the negative banner icon (default: var(--dds-banner-icon-negative)) _(default: undefined)_\n- **--dds-banner-negative-text-color** - The text color of the negative banner (default: var(--dds-banner-text-negative)) _(default: undefined)_\n- **--dds-banner-negative-action-color** - The color of the negative banner actions (default: var(--dds-banner-action-inverted-enabled)) _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The main banner container.\n- **card-base** - The wrapper card container.\n- **icon** - The icon of the banner.\n- **icon-element** - The icon element of the banner.\n- **icon-base** - The base of the icon.\n- **closebutton** - The close button of the banner.\n- **close-icon-element** - The icon element of the close button.\n- **close-icon-base** - The base of the close button icon.\n- **actions** - The actions of the banner.\n- **title** -  The title of the banner.",
@@ -585,42 +498,129 @@
           }
         },
         {
-          "name": "dap-ds-accordion-group",
-          "description": "An accordion group is a collection of accordion components.\n---\n\n\n### **Slots:**\n - _default_ - The content of the accordion group.\n\n### **CSS Properties:**\n - **--dds-accordion-group-spacing** - Controls the gap between accordion items (default: var(--dds-spacing-300)) _(default: undefined)_\n- **--dds-accordion-group-border-color** - Controls the border color (default: var(--dds-border-neutral-subtle)) _(default: undefined)_\n- **--dds-accordion-group-border-width** - Controls the border width (default: var(--dds-border-width-base)) _(default: undefined)_\n- **--dds-accordion-group-border-radius** - Controls the border radius (default: var(--dds-radius-base)) _(default: undefined)_\n- **--dds-accordion-group-background** - Controls the background color (default: transparent) _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The main accordion group container.",
+          "name": "dap-ds-anchor-heading",
+          "description": "Anchor heading is a heading with an anchor link.\n---\n\n\n### **CSS Properties:**\n - **--dds-anchor-link-color** - The color of the anchor link (default: var(--dds-color-primary)) _(default: undefined)_\n- **--dds-anchor-link-opacity** - The opacity of the anchor link when not hovered (default: 0) _(default: undefined)_\n- **--dds-anchor-link-hover-opacity** - The opacity of the anchor link when hovered (default: 1) _(default: undefined)_\n- **--dds-anchor-link-transition** - The transition property for the anchor link opacity (default: opacity 0.2s ease-in-out) _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The main anchor heading container.\n- **link** - The link of the anchor heading. dap-ds-link element.\n- **link-base** - The base of the link part.\n- **text** - The text of the anchor heading.",
           "doc-url": "",
           "attributes": [
             {
-              "name": "autoClose",
-              "description": "Whether to close other accordions when one is opened.",
-              "value": { "type": "string", "default": "'true'" }
+              "name": "variant",
+              "description": "The variant of the heading. Default is `h2`. Can be `h1`, `h2`, `h3`, `h4`, `h5`, or `h6`.",
+              "value": { "type": "HeadingVariant" }
             },
             {
-              "name": "variant",
-              "description": "The variant of the accordion",
-              "value": {
-                "type": "'default' | 'collapsed' | 'clean' | 'clean-collapsed'",
-                "default": "'default'"
-              }
+              "name": "label",
+              "description": "The label of the heading.",
+              "value": { "type": "string" }
+            }
+          ],
+          "events": [],
+          "js": {
+            "properties": [
+              { "name": "variant", "type": "HeadingVariant" },
+              { "name": "label", "type": "string" },
+              { "name": "elementId" },
+              { "name": "anchorTitle" }
+            ],
+            "events": []
+          }
+        },
+        {
+          "name": "dap-ds-avatar-group",
+          "description": "Avatar group component displays multiple avatars in an organized layout with overflow management.\n---\n\n\n### **Events:**\n - **dds-overflow-click** - Fired when the overflow indicator is clicked.\n\n### **Slots:**\n - _default_ - The avatars to display in the group.\n\n### **CSS Properties:**\n - **--dds-avatar-group-gap** - Gap between avatars in grid layout (default: 0) _(default: undefined)_\n- **--dds-avatar-group-overlap** - Overlap amount for stacked layout (default: -8px) _(default: undefined)_\n- **--dds-avatar-group-border-width** - Border width for avatars (default: var(--dds-border-width-base)) _(default: undefined)_\n- **--dds-avatar-group-border-color** - Border color for avatars (default: var(--dds-border-neutral-divider)) _(default: undefined)_\n- **--dds-avatar-group-overflow-bg** - Background color for overflow indicator (default: var(--dds-neutral-300)) _(default: undefined)_\n- **--dds-avatar-group-overflow-color** - Text color for overflow indicator (default: var(--dds-neutral-700)) _(default: undefined)_\n- **--dds-avatar-group-overflow-border** - Border for overflow indicator (default: var(--dds-avatar-group-border-width) solid var(--dds-avatar-group-border-color)) _(default: undefined)_\n- **--dds-avatar-group-size-lg** - Size for large avatars (default: var(--dds-spacing-2000)) _(default: undefined)_\n- **--dds-avatar-group-size-md** - Size for medium avatars (default: var(--dds-spacing-1600)) _(default: undefined)_\n- **--dds-avatar-group-size-sm** - Size for small avatars (default: var(--dds-spacing-1200)) _(default: undefined)_\n- **--dds-avatar-group-size-xs** - Size for extra small avatars (default: var(--dds-spacing-800)) _(default: undefined)_\n- **--dds-avatar-group-size-xxs** - Size for extra extra small avatars (default: var(--dds-spacing-400)) _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The main container of the avatar group.\n- **avatars** - The container for the visible avatars.\n- **overflow** - The overflow indicator element.",
+          "doc-url": "",
+          "attributes": [
+            {
+              "name": "layout",
+              "description": "Layout type for the avatar group",
+              "value": { "type": "'stack' | 'grid'", "default": "'stack'" }
+            },
+            {
+              "name": "max",
+              "description": "Maximum number of avatars to show before showing overflow",
+              "value": { "type": "number", "default": "3" }
+            },
+            {
+              "name": "show-total",
+              "description": "Whether to show the total count in overflow indicator",
+              "value": { "type": "boolean", "default": "false" }
+            },
+            {
+              "name": "interactive-overflow",
+              "description": "Interactive overflow indicator",
+              "value": { "type": "boolean", "default": "false" }
+            },
+            {
+              "name": "label",
+              "description": "Accessible label for the avatar group",
+              "value": { "type": "string" }
+            },
+            {
+              "name": "overflow-label",
+              "description": "Accessible label for the overflow indicator",
+              "value": { "type": "string" }
             }
           ],
           "slots": [
-            { "name": "", "description": "The content of the accordion group." }
+            {
+              "name": "",
+              "description": "The avatars to display in the group."
+            }
+          ],
+          "events": [
+            {
+              "name": "dds-overflow-click",
+              "description": "Fired when the overflow indicator is clicked."
+            }
           ],
-          "events": [],
           "js": {
             "properties": [
               {
-                "name": "autoClose",
-                "description": "Whether to close other accordions when one is opened.",
+                "name": "layout",
+                "description": "Layout type for the avatar group",
+                "type": "'stack' | 'grid'"
+              },
+              {
+                "name": "max",
+                "description": "Maximum number of avatars to show before showing overflow",
+                "type": "number"
+              },
+              {
+                "name": "showTotal",
+                "description": "Whether to show the total count in overflow indicator",
+                "type": "boolean"
+              },
+              {
+                "name": "interactiveOverflow",
+                "description": "Interactive overflow indicator",
+                "type": "boolean"
+              },
+              {
+                "name": "label",
+                "description": "Accessible label for the avatar group",
                 "type": "string"
               },
               {
-                "name": "variant",
-                "description": "The variant of the accordion",
-                "type": "'default' | 'collapsed' | 'clean' | 'clean-collapsed'"
+                "name": "overflowLabel",
+                "description": "Accessible label for the overflow indicator",
+                "type": "string"
+              },
+              {
+                "name": "size",
+                "description": "The size of avatars in the group. Default is `md`. See SizedMixin.",
+                "type": "'xxs' | 'xs' | 'sm' | 'md' | 'lg'"
+              },
+              {
+                "name": "sizeMap",
+                "description": "Responsive size map (e.g. \"md:lg\"); see SizedMixin.",
+                "type": "string"
               }
             ],
-            "events": []
+            "events": [
+              {
+                "name": "dds-overflow-click",
+                "description": "Fired when the overflow indicator is clicked."
+              }
+            ]
           }
         },
         {
@@ -1213,16 +1213,211 @@
                 "type": "string"
               },
               {
-                "name": "opened",
-                "description": "If the callout is opened",
+                "name": "opened",
+                "description": "If the callout is opened",
+                "type": "string"
+              }
+            ],
+            "events": [
+              {
+                "name": "dds-close",
+                "type": "{ void }",
+                "description": "Fired when the close button is clicked."
+              }
+            ]
+          }
+        },
+        {
+          "name": "dap-ds-checkbox",
+          "description": "A checkbox is a form element that allows the user to select one or more options from a set.\n---\n\n\n### **Events:**\n - **dds-change** - Fired when the checkbox is checked or unchecked.\n- **dds-blur** - Emitted when the checkbox loses focus.\n- **dds-focus** - Emitted when the checkbox gains focus.\n- **dds-input** - Emitted when the checkbox receives input.\n\n### **Methods:**\n - **focus(): _void_** - Programmatically focuses the checkbox input element.\n- **blur(): _void_** - Programmatically blurs the checkbox input element.\n\n### **CSS Properties:**\n - **--dds-checkbox-size** - The size of the checkbox. (default: var(--dds-spacing-500)) _(default: undefined)_\n- **--dds-checkbox-border-width** - The border width of the checkbox. (default: var(--dds-border-width-large)) _(default: undefined)_\n- **--dds-checkbox-border-radius** - The border radius of the checkbox. (default: var(--dds-radius-small)) _(default: undefined)_\n- **--dds-checkbox-border-color** - The border color of the checkbox. (default: var(--dds-border-neutral-base)) _(default: undefined)_\n- **--dds-checkbox-background-color** - The background color of the checkbox. (default: transparent) _(default: undefined)_\n- **--dds-checkbox-icon-color** - The color of the checkbox icon. (default: var(--dds-button-primary-icon-enabled)) _(default: undefined)_\n- **--dds-checkbox-hover-border-color** - The border color when hovering over the checkbox. (default: var(--dds-border-neutral-medium)) _(default: undefined)_\n- **--dds-checkbox-hover-background-color** - The background color when hovering over the checkbox. (default: var(--dds-background-neutral-medium)) _(default: undefined)_\n- **--dds-checkbox-active-border-color** - The border color when the checkbox is active. (default: var(--dds-border-neutral-strong)) _(default: undefined)_\n- **--dds-checkbox-active-background-color** - The background color when the checkbox is active. (default: var(--dds-background-neutral-strong)) _(default: undefined)_\n- **--dds-checkbox-checked-border-color** - The border color when the checkbox is checked. (default: var(--dds-background-brand-base-inverted)) _(default: undefined)_\n- **--dds-checkbox-checked-background-color** - The background color when the checkbox is checked. (default: var(--dds-background-brand-base-inverted)) _(default: undefined)_\n- **--dds-checkbox-checked-hover-border-color** - The border color when hovering over a checked checkbox. (default: var(--dds-background-brand-medium-inverted)) _(default: undefined)_\n- **--dds-checkbox-checked-hover-background-color** - The background color when hovering over a checked checkbox. (default: var(--dds-background-brand-medium-inverted)) _(default: undefined)_\n- **--dds-checkbox-checked-active-border-color** - The border color when a checked checkbox is active. (default: var(--dds-background-brand-strong-inverted)) _(default: undefined)_\n- **--dds-checkbox-checked-active-background-color** - The background color when a checked checkbox is active. (default: var(--dds-background-brand-strong-inverted)) _(default: undefined)_\n- **--dds-checkbox-invalid-border-color** - The border color when the checkbox is invalid. (default: var(--dds-border-negative-base)) _(default: undefined)_\n- **--dds-checkbox-invalid-background-color** - The background color when the checkbox is invalid. (default: var(--dds-background-negative-base)) _(default: undefined)_\n- **--dds-checkbox-invalid-hover-border-color** - The border color when hovering over an invalid checkbox. (default: var(--dds-border-negative-medium)) _(default: undefined)_\n- **--dds-checkbox-invalid-hover-background-color** - The background color when hovering over an invalid checkbox. (default: var(--dds-background-negative-medium)) _(default: undefined)_\n- **--dds-checkbox-invalid-active-border-color** - The border color when an invalid checkbox is active. (default: var(--dds-border-negative-strong)) _(default: undefined)_\n- **--dds-checkbox-invalid-active-background-color** - The background color when an invalid checkbox is active. (default: var(--dds-background-negative-strong)) _(default: undefined)_\n- **--dds-checkbox-disabled-border-color** - The border color when the checkbox is disabled. (default: var(--dds-button-primary-background-disabled)) _(default: undefined)_\n- **--dds-checkbox-disabled-background-color** - The background color when the checkbox is disabled. (default: var(--dds-button-primary-background-disabled)) _(default: undefined)_\n- **--dds-checkbox-disabled-icon-color** - The color of the checkbox icon when disabled. (default: var(--dds-button-primary-icon-disabled)) _(default: undefined)_\n- **--dds-checkbox-readonly-border-color** - The border color when the checkbox is readonly. (default: var(--dds-border-neutral-subtle)) _(default: undefined)_\n- **--dds-checkbox-readonly-background-color** - The background color when the checkbox is readonly. (default: var(--dds-background-neutral-subtle)) _(default: undefined)_\n- **--dds-checkbox-readonly-icon-color** - The color of the checkbox icon when readonly. (default: var(--dds-text-neutral-base)) _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The main checkbox container.\n- **label** - The label of the checkbox.\n- **input** - The input of the checkbox.\n- **control** - The control of the checkbox.\n- **icon** - The icon of the checkbox.\n- **icon-base** - The base icon container.\n- **label-container** - The label container of the checkbox.\n- **description** - The description of the checkbox.\n- **readonly** - The readonly state of the checkbox.",
+          "doc-url": "",
+          "attributes": [
+            {
+              "name": "indeterminate",
+              "description": "Whether the checkbox is indeterminate",
+              "value": { "type": "boolean", "default": "false" }
+            },
+            {
+              "name": "preventDefault",
+              "description": "Whether the checkbox should prevent the default action",
+              "value": { "type": "boolean", "default": "false" }
+            },
+            {
+              "name": "border",
+              "description": "This sets up border around the checkbox, when true.",
+              "value": { "type": "boolean", "default": "false" }
+            },
+            {
+              "name": "readonly",
+              "description": "Whether the checkbox is readonly (cannot be changed but value is submitted with form).",
+              "value": { "type": "boolean", "default": "false" }
+            },
+            {
+              "name": "type",
+              "description": "The type of the checkbox",
+              "value": {
+                "type": "'normal' | 'background'",
+                "default": "'normal'"
+              }
+            }
+          ],
+          "events": [
+            {
+              "name": "dds-change",
+              "type": "{ checked: boolean, indeterminate: boolean, value: string, disabled: boolean, readonly: boolean, type: 'checkbox' }",
+              "description": "Fired when the checkbox is checked or unchecked."
+            },
+            {
+              "name": "dds-blur",
+              "type": "{ void }",
+              "description": "Emitted when the checkbox loses focus."
+            },
+            {
+              "name": "dds-focus",
+              "type": "{ void }",
+              "description": "Emitted when the checkbox gains focus."
+            },
+            {
+              "name": "dds-input",
+              "type": "{ checked: boolean, indeterminate: boolean, value: string, disabled: boolean, readonly: boolean }",
+              "description": "Emitted when the checkbox receives input."
+            }
+          ],
+          "js": {
+            "properties": [
+              {
+                "name": "indeterminate",
+                "description": "Whether the checkbox is indeterminate",
+                "type": "boolean"
+              },
+              {
+                "name": "preventDefault",
+                "description": "Whether the checkbox should prevent the default action",
+                "type": "boolean"
+              },
+              {
+                "name": "border",
+                "description": "This sets up border around the checkbox, when true.",
+                "type": "boolean"
+              },
+              {
+                "name": "readonly",
+                "description": "Whether the checkbox is readonly (cannot be changed but value is submitted with form).",
+                "type": "boolean"
+              },
+              {
+                "name": "type",
+                "description": "The type of the checkbox",
+                "type": "'normal' | 'background'"
+              },
+              { "name": "focusElement", "type": "HTMLInputElement" },
+              { "name": "feedbackId" },
+              {
+                "name": "name",
+                "description": "The name of the checkbox.",
+                "type": "string"
+              },
+              {
+                "name": "value",
+                "description": "The value of the checkbox.",
+                "type": "string"
+              },
+              {
+                "name": "checked",
+                "description": "Whether the checkbox is checked.",
+                "type": "boolean"
+              },
+              {
+                "name": "label",
+                "description": "The label of the checkbox.",
+                "type": "string"
+              },
+              {
+                "name": "description",
+                "description": "The description of the checkbox.",
+                "type": "string"
+              },
+              {
+                "name": "disabled",
+                "description": "Whether the checkbox is disabled.",
+                "type": "boolean"
+              },
+              {
+                "name": "required",
+                "description": "Whether the checkbox is required.",
+                "type": "boolean"
+              },
+              {
+                "name": "size",
+                "description": "The size of the checkbox. Default is 'sm'.",
+                "type": "'xs' | 'sm' | 'lg'"
+              },
+              {
+                "name": "sizeMap",
+                "description": "Responsive size map (e.g. \"md:lg\").",
+                "type": "string"
+              },
+              {
+                "name": "labelPlacement",
+                "description": "The placement of the label.",
+                "type": "'left' | 'right'"
+              },
+              {
+                "name": "descriptionPlacement",
+                "description": "The placement of the description.",
+                "type": "'top' | 'bottom'"
+              },
+              {
+                "name": "subtle",
+                "description": "The weight of the label.",
+                "type": "boolean"
+              },
+              {
+                "name": "feedback",
+                "description": "The feedback of the checkbox.",
+                "type": "string"
+              },
+              {
+                "name": "feedbackType",
+                "description": "The feedback type of the checkbox.",
+                "type": "'negative' | 'positive' | 'warning'"
+              },
+              {
+                "name": "invalid",
+                "description": "The invalid state of the checkbox.",
+                "type": "boolean"
+              },
+              {
+                "name": "optional",
+                "description": "The optional state of the checkbox.",
+                "type": "boolean"
+              },
+              {
+                "name": "optionalLabel",
+                "description": "The optional label of the checkbox.",
                 "type": "string"
               }
             ],
             "events": [
               {
-                "name": "dds-close",
+                "name": "dds-change",
+                "type": "{ checked: boolean, indeterminate: boolean, value: string, disabled: boolean, readonly: boolean, type: 'checkbox' }",
+                "description": "Fired when the checkbox is checked or unchecked."
+              },
+              {
+                "name": "dds-blur",
                 "type": "{ void }",
-                "description": "Fired when the close button is clicked."
+                "description": "Emitted when the checkbox loses focus."
+              },
+              {
+                "name": "dds-focus",
+                "type": "{ void }",
+                "description": "Emitted when the checkbox gains focus."
+              },
+              {
+                "name": "dds-input",
+                "type": "{ checked: boolean, indeterminate: boolean, value: string, disabled: boolean, readonly: boolean }",
+                "description": "Emitted when the checkbox receives input."
               }
             ]
           }
@@ -1563,201 +1758,6 @@
             "events": []
           }
         },
-        {
-          "name": "dap-ds-checkbox",
-          "description": "A checkbox is a form element that allows the user to select one or more options from a set.\n---\n\n\n### **Events:**\n - **dds-change** - Fired when the checkbox is checked or unchecked.\n- **dds-blur** - Emitted when the checkbox loses focus.\n- **dds-focus** - Emitted when the checkbox gains focus.\n- **dds-input** - Emitted when the checkbox receives input.\n\n### **Methods:**\n - **focus(): _void_** - Programmatically focuses the checkbox input element.\n- **blur(): _void_** - Programmatically blurs the checkbox input element.\n\n### **CSS Properties:**\n - **--dds-checkbox-size** - The size of the checkbox. (default: var(--dds-spacing-500)) _(default: undefined)_\n- **--dds-checkbox-border-width** - The border width of the checkbox. (default: var(--dds-border-width-large)) _(default: undefined)_\n- **--dds-checkbox-border-radius** - The border radius of the checkbox. (default: var(--dds-radius-small)) _(default: undefined)_\n- **--dds-checkbox-border-color** - The border color of the checkbox. (default: var(--dds-border-neutral-base)) _(default: undefined)_\n- **--dds-checkbox-background-color** - The background color of the checkbox. (default: transparent) _(default: undefined)_\n- **--dds-checkbox-icon-color** - The color of the checkbox icon. (default: var(--dds-button-primary-icon-enabled)) _(default: undefined)_\n- **--dds-checkbox-hover-border-color** - The border color when hovering over the checkbox. (default: var(--dds-border-neutral-medium)) _(default: undefined)_\n- **--dds-checkbox-hover-background-color** - The background color when hovering over the checkbox. (default: var(--dds-background-neutral-medium)) _(default: undefined)_\n- **--dds-checkbox-active-border-color** - The border color when the checkbox is active. (default: var(--dds-border-neutral-strong)) _(default: undefined)_\n- **--dds-checkbox-active-background-color** - The background color when the checkbox is active. (default: var(--dds-background-neutral-strong)) _(default: undefined)_\n- **--dds-checkbox-checked-border-color** - The border color when the checkbox is checked. (default: var(--dds-background-brand-base-inverted)) _(default: undefined)_\n- **--dds-checkbox-checked-background-color** - The background color when the checkbox is checked. (default: var(--dds-background-brand-base-inverted)) _(default: undefined)_\n- **--dds-checkbox-checked-hover-border-color** - The border color when hovering over a checked checkbox. (default: var(--dds-background-brand-medium-inverted)) _(default: undefined)_\n- **--dds-checkbox-checked-hover-background-color** - The background color when hovering over a checked checkbox. (default: var(--dds-background-brand-medium-inverted)) _(default: undefined)_\n- **--dds-checkbox-checked-active-border-color** - The border color when a checked checkbox is active. (default: var(--dds-background-brand-strong-inverted)) _(default: undefined)_\n- **--dds-checkbox-checked-active-background-color** - The background color when a checked checkbox is active. (default: var(--dds-background-brand-strong-inverted)) _(default: undefined)_\n- **--dds-checkbox-invalid-border-color** - The border color when the checkbox is invalid. (default: var(--dds-border-negative-base)) _(default: undefined)_\n- **--dds-checkbox-invalid-background-color** - The background color when the checkbox is invalid. (default: var(--dds-background-negative-base)) _(default: undefined)_\n- **--dds-checkbox-invalid-hover-border-color** - The border color when hovering over an invalid checkbox. (default: var(--dds-border-negative-medium)) _(default: undefined)_\n- **--dds-checkbox-invalid-hover-background-color** - The background color when hovering over an invalid checkbox. (default: var(--dds-background-negative-medium)) _(default: undefined)_\n- **--dds-checkbox-invalid-active-border-color** - The border color when an invalid checkbox is active. (default: var(--dds-border-negative-strong)) _(default: undefined)_\n- **--dds-checkbox-invalid-active-background-color** - The background color when an invalid checkbox is active. (default: var(--dds-background-negative-strong)) _(default: undefined)_\n- **--dds-checkbox-disabled-border-color** - The border color when the checkbox is disabled. (default: var(--dds-button-primary-background-disabled)) _(default: undefined)_\n- **--dds-checkbox-disabled-background-color** - The background color when the checkbox is disabled. (default: var(--dds-button-primary-background-disabled)) _(default: undefined)_\n- **--dds-checkbox-disabled-icon-color** - The color of the checkbox icon when disabled. (default: var(--dds-button-primary-icon-disabled)) _(default: undefined)_\n- **--dds-checkbox-readonly-border-color** - The border color when the checkbox is readonly. (default: var(--dds-border-neutral-subtle)) _(default: undefined)_\n- **--dds-checkbox-readonly-background-color** - The background color when the checkbox is readonly. (default: var(--dds-background-neutral-subtle)) _(default: undefined)_\n- **--dds-checkbox-readonly-icon-color** - The color of the checkbox icon when readonly. (default: var(--dds-text-neutral-base)) _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The main checkbox container.\n- **label** - The label of the checkbox.\n- **input** - The input of the checkbox.\n- **control** - The control of the checkbox.\n- **icon** - The icon of the checkbox.\n- **icon-base** - The base icon container.\n- **label-container** - The label container of the checkbox.\n- **description** - The description of the checkbox.\n- **readonly** - The readonly state of the checkbox.",
-          "doc-url": "",
-          "attributes": [
-            {
-              "name": "indeterminate",
-              "description": "Whether the checkbox is indeterminate",
-              "value": { "type": "boolean", "default": "false" }
-            },
-            {
-              "name": "preventDefault",
-              "description": "Whether the checkbox should prevent the default action",
-              "value": { "type": "boolean", "default": "false" }
-            },
-            {
-              "name": "border",
-              "description": "This sets up border around the checkbox, when true.",
-              "value": { "type": "boolean", "default": "false" }
-            },
-            {
-              "name": "readonly",
-              "description": "Whether the checkbox is readonly (cannot be changed but value is submitted with form).",
-              "value": { "type": "boolean", "default": "false" }
-            },
-            {
-              "name": "type",
-              "description": "The type of the checkbox",
-              "value": {
-                "type": "'normal' | 'background'",
-                "default": "'normal'"
-              }
-            }
-          ],
-          "events": [
-            {
-              "name": "dds-change",
-              "type": "{ checked: boolean, indeterminate: boolean, value: string, disabled: boolean, readonly: boolean, type: 'checkbox' }",
-              "description": "Fired when the checkbox is checked or unchecked."
-            },
-            {
-              "name": "dds-blur",
-              "type": "{ void }",
-              "description": "Emitted when the checkbox loses focus."
-            },
-            {
-              "name": "dds-focus",
-              "type": "{ void }",
-              "description": "Emitted when the checkbox gains focus."
-            },
-            {
-              "name": "dds-input",
-              "type": "{ checked: boolean, indeterminate: boolean, value: string, disabled: boolean, readonly: boolean }",
-              "description": "Emitted when the checkbox receives input."
-            }
-          ],
-          "js": {
-            "properties": [
-              {
-                "name": "indeterminate",
-                "description": "Whether the checkbox is indeterminate",
-                "type": "boolean"
-              },
-              {
-                "name": "preventDefault",
-                "description": "Whether the checkbox should prevent the default action",
-                "type": "boolean"
-              },
-              {
-                "name": "border",
-                "description": "This sets up border around the checkbox, when true.",
-                "type": "boolean"
-              },
-              {
-                "name": "readonly",
-                "description": "Whether the checkbox is readonly (cannot be changed but value is submitted with form).",
-                "type": "boolean"
-              },
-              {
-                "name": "type",
-                "description": "The type of the checkbox",
-                "type": "'normal' | 'background'"
-              },
-              { "name": "focusElement", "type": "HTMLInputElement" },
-              { "name": "feedbackId" },
-              {
-                "name": "name",
-                "description": "The name of the checkbox.",
-                "type": "string"
-              },
-              {
-                "name": "value",
-                "description": "The value of the checkbox.",
-                "type": "string"
-              },
-              {
-                "name": "checked",
-                "description": "Whether the checkbox is checked.",
-                "type": "boolean"
-              },
-              {
-                "name": "label",
-                "description": "The label of the checkbox.",
-                "type": "string"
-              },
-              {
-                "name": "description",
-                "description": "The description of the checkbox.",
-                "type": "string"
-              },
-              {
-                "name": "disabled",
-                "description": "Whether the checkbox is disabled.",
-                "type": "boolean"
-              },
-              {
-                "name": "required",
-                "description": "Whether the checkbox is required.",
-                "type": "boolean"
-              },
-              {
-                "name": "size",
-                "description": "The size of the checkbox. Default is 'sm'.",
-                "type": "'xs' | 'sm' | 'lg'"
-              },
-              {
-                "name": "sizeMap",
-                "description": "Responsive size map (e.g. \"md:lg\").",
-                "type": "string"
-              },
-              {
-                "name": "labelPlacement",
-                "description": "The placement of the label.",
-                "type": "'left' | 'right'"
-              },
-              {
-                "name": "descriptionPlacement",
-                "description": "The placement of the description.",
-                "type": "'top' | 'bottom'"
-              },
-              {
-                "name": "subtle",
-                "description": "The weight of the label.",
-                "type": "boolean"
-              },
-              {
-                "name": "feedback",
-                "description": "The feedback of the checkbox.",
-                "type": "string"
-              },
-              {
-                "name": "feedbackType",
-                "description": "The feedback type of the checkbox.",
-                "type": "'negative' | 'positive' | 'warning'"
-              },
-              {
-                "name": "invalid",
-                "description": "The invalid state of the checkbox.",
-                "type": "boolean"
-              },
-              {
-                "name": "optional",
-                "description": "The optional state of the checkbox.",
-                "type": "boolean"
-              },
-              {
-                "name": "optionalLabel",
-                "description": "The optional label of the checkbox.",
-                "type": "string"
-              }
-            ],
-            "events": [
-              {
-                "name": "dds-change",
-                "type": "{ checked: boolean, indeterminate: boolean, value: string, disabled: boolean, readonly: boolean, type: 'checkbox' }",
-                "description": "Fired when the checkbox is checked or unchecked."
-              },
-              {
-                "name": "dds-blur",
-                "type": "{ void }",
-                "description": "Emitted when the checkbox loses focus."
-              },
-              {
-                "name": "dds-focus",
-                "type": "{ void }",
-                "description": "Emitted when the checkbox gains focus."
-              },
-              {
-                "name": "dds-input",
-                "type": "{ checked: boolean, indeterminate: boolean, value: string, disabled: boolean, readonly: boolean }",
-                "description": "Emitted when the checkbox receives input."
-              }
-            ]
-          }
-        },
         {
           "name": "dap-ds-chip",
           "description": "A chip is a small status descriptor for UI elements.\n---\n\n\n### **Events:**\n - **dds-remove** - Fired when the chip is removed\n- **dds-select** - Fired when the chip is selected\n\n### **CSS Properties:**\n - **--dds-chip-border** - Border of the chip (default: var(--dds-border-width-base) solid var(--dds-transparent-black-base)) _(default: undefined)_\n- **--dds-chip-border-radius** - Border radius of the chip (default: var(--dds-radius-small)) _(default: undefined)_\n- **--dds-chip-font-weight** - Font weight of the chip (default: var(--dds-font-weight-bold)) _(default: undefined)_\n- **--dds-chip-line-height** - Line height of the chip (default: 1.5) _(default: undefined)_\n- **--dds-chip-transition** - Transition timing for chip interactions (default: all 0.2s ease-in-out) _(default: undefined)_\n- **--dds-chip-padding-sm** - Padding for small chip size (default: var(--dds-spacing-100) var(--dds-spacing-200)) _(default: undefined)_\n- **--dds-chip-padding-lg** - Padding for large chip size (default: var(--dds-spacing-200) var(--dds-spacing-300)) _(default: undefined)_\n- **--dds-chip-font-size-sm** - Font size for small chip size (default: var(--dds-font-xs)) _(default: undefined)_\n- **--dds-chip-font-size-lg** - Font size for large chip size (default: var(--dds-font-xs)) _(default: undefined)_\n- **--dds-chip-background-color** - Background color of the chip (default: var(--dds-background-neutral-base)) _(default: undefined)_\n- **--dds-chip-text-color** - Text color of the chip (default: var(--dds-text-neutral-base)) _(default: undefined)_\n- **--dds-chip-hover-background-color** - Background color of the chip on hover (default: var(--dds-background-neutral-medium)) _(default: undefined)_\n- **--dds-chip-active-background-color** - Background color of the chip when active (default: var(--dds-background-neutral-strong)) _(default: undefined)_\n- **--dds-chip-selected-background-color** - Background color of the selected chip (default: var(--dds-background-brand-medium)) _(default: undefined)_\n- **--dds-chip-selected-text-color** - Text color of the selected chip (default: var(--dds-text-brand-subtle)) _(default: undefined)_\n- **--dds-chip-selected-border-color** - Border color of the selected chip (default: var(--dds-border-brand-base)) _(default: undefined)_\n- **--dds-chip-disabled-background-color** - Background color of the disabled chip (default: var(--dds-background-neutral-medium)) _(default: undefined)_\n- **--dds-chip-disabled-text-color** - Text color of the disabled chip (default: var(--dds-text-neutral-subtle)) _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The base part\n- **content-container** - The container for the content\n- **remove-button** - The remove button\n- **remove-icon** - The icon of the remove icon\n- **remove-icon-base** - The base of the remove icon\n- **remove-icon-base-base** - The base of the remove icon base",
@@ -7664,7 +7664,7 @@
         },
         {
           "name": "dap-ds-radio-button",
-          "description": "A radio button is a graphical control element that allows the user to choose only one of a predefined set of mutually exclusive options.\n---\n\n\n### **Events:**\n - **dds-change** - Fired when the radio button is checked.\n- **dds-blur** - Emitted when the radio button loses focus.\n- **dds-focus** - Emitted when the radio button gains focus.\n- **dds-input** - Emitted when the radio button receives input.\n\n### **Methods:**\n - **focus(): _void_** - Programmatically focuses the radio button input element.\n- **blur(): _void_** - Programmatically blurs the radio button input element.\n\n### **CSS Properties:**\n - **--dds-radio-size** - Sets the size of the radio button. (default: var(--dds-spacing-600)) _(default: undefined)_\n- **--dds-radio-border-width** - Sets the border width of the radio button. (default: var(--dds-border-width-large)) _(default: undefined)_\n- **--dds-radio-border-radius** - Sets the border radius of the radio button. (default: var(--dds-radius-rounded)) _(default: undefined)_\n- **--dds-radio-border-color** - Sets the border color of the radio button. (default: var(--dds-border-neutral-base)) _(default: undefined)_\n- **--dds-radio-background-color** - Sets the background color of the radio button. (default: var(--dds-background-neutral-base)) _(default: undefined)_\n- **--dds-radio-hover-border-color** - Sets the border color of the radio button on hover. (default: var(--dds-border-neutral-medium)) _(default: undefined)_\n- **--dds-radio-hover-background-color** - Sets the background color of the radio button on hover. (default: var(--dds-background-neutral-medium)) _(default: undefined)_\n- **--dds-radio-active-border-color** - Sets the border color of the radio button when active. (default: var(--dds-border-neutral-strong)) _(default: undefined)_\n- **--dds-radio-active-background-color** - Sets the background color of the radio button when active. (default: var(--dds-background-neutral-strong)) _(default: undefined)_\n- **--dds-radio-checked-background-color** - Sets the background color of the checked radio button. (default: var(--dds-background-brand-base-inverted)) _(default: undefined)_\n- **--dds-radio-checked-hover-background-color** - Sets the background color of the checked radio button on hover. (default: var(--dds-background-brand-medium-inverted)) _(default: undefined)_\n- **--dds-radio-checked-active-background-color** - Sets the background color of the checked radio button when active. (default: var(--dds-background-brand-strong-inverted)) _(default: undefined)_\n- **--dds-radio-disabled-background-color** - Sets the background color of the disabled radio button. (default: var(--dds-background-neutral-disabled)) _(default: undefined)_\n- **--dds-radio-icon-background-color** - Sets the background color of the radio button icon. (default: var(--dds-transparent-white-strong-static)) _(default: undefined)_\n- **--dds-radio-disabled-icon-background-color** - Sets the background color of the disabled radio button icon. (default: var(--dds-background-neutral-stronger)) _(default: undefined)_\n- **--dds-radio-invalid-border-color** - Sets the border color of the invalid radio button. (default: var(--dds-border-negative-base)) _(default: undefined)_\n- **--dds-radio-invalid-background-color** - Sets the background color of the invalid radio button. (default: var(--dds-background-negative-base)) _(default: undefined)_\n- **--dds-radio-invalid-hover-border-color** - Sets the border color of the invalid radio button on hover. (default: var(--dds-border-negative-medium)) _(default: undefined)_\n- **--dds-radio-invalid-hover-background-color** - Sets the background color of the invalid radio button on hover. (default: var(--dds-background-negative-medium)) _(default: undefined)_\n- **--dds-radio-invalid-active-border-color** - Sets the border color of the invalid radio button when active. (default: var(--dds-border-negative-strong)) _(default: undefined)_\n- **--dds-radio-invalid-active-background-color** - Sets the background color of the invalid radio button when active. (default: var(--dds-background-negative-strong)) _(default: undefined)_\n- **--dds-radio-invalid-checked-background-color** - Sets the background color of the invalid checked radio button. (default: var(--dds-background-negative-base-inverted)) _(default: undefined)_\n- **--dds-radio-invalid-checked-hover-background-color** - Sets the background color of the invalid checked radio button on hover. (default: var(--dds-background-negative-medium-inverted)) _(default: undefined)_\n- **--dds-radio-invalid-checked-active-background-color** - Sets the background color of the invalid checked radio button when active. (default: var(--dds-background-negative-strong-inverted)) _(default: undefined)_\n- **--dds-radio-icon-size** - Sets the size of the radio button icon. (default: var(--dds-spacing-300)) _(default: undefined)_\n- **--dds-radio-readonly-border-color** - Sets the border color when the radio button is readonly. (default: var(--dds-border-neutral-subtle)) _(default: undefined)_\n- **--dds-radio-readonly-background-color** - Sets the background color when the radio button is readonly. (default: var(--dds-background-neutral-subtle)) _(default: undefined)_\n- **--dds-radio-readonly-icon-color** - Sets the color of the radio button icon when readonly. (default: var(--dds-text-neutral-base)) _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The main radio button container.\n- **wrapper** - The wrapper of the radio button.\n- **base-label** - The main label container.\n- **label** - The label of the radio button.\n- **input** - The native input of the radio button.\n- **control** - The control of the radio button.\n- **label-container** - The label container of the radio button.\n- **description** - The description of the radio button.",
+          "description": "A radio button is a graphical control element that allows the user to choose only one of a predefined set of mutually exclusive options.\n---\n\n\n### **Events:**\n - **dds-change** - Fired when the radio button is checked.\n- **dds-blur** - Emitted when the radio button loses focus.\n- **dds-focus** - Emitted when the radio button gains focus.\n- **dds-input** - Emitted when the radio button receives input.\n\n### **CSS Properties:**\n - **--dds-radio-size** - Sets the size of the radio button. (default: var(--dds-spacing-600)) _(default: undefined)_\n- **--dds-radio-border-width** - Sets the border width of the radio button. (default: var(--dds-border-width-large)) _(default: undefined)_\n- **--dds-radio-border-radius** - Sets the border radius of the radio button. (default: var(--dds-radius-rounded)) _(default: undefined)_\n- **--dds-radio-border-color** - Sets the border color of the radio button. (default: var(--dds-border-neutral-base)) _(default: undefined)_\n- **--dds-radio-background-color** - Sets the background color of the radio button. (default: var(--dds-background-neutral-base)) _(default: undefined)_\n- **--dds-radio-hover-border-color** - Sets the border color of the radio button on hover. (default: var(--dds-border-neutral-medium)) _(default: undefined)_\n- **--dds-radio-hover-background-color** - Sets the background color of the radio button on hover. (default: var(--dds-background-neutral-medium)) _(default: undefined)_\n- **--dds-radio-active-border-color** - Sets the border color of the radio button when active. (default: var(--dds-border-neutral-strong)) _(default: undefined)_\n- **--dds-radio-active-background-color** - Sets the background color of the radio button when active. (default: var(--dds-background-neutral-strong)) _(default: undefined)_\n- **--dds-radio-checked-background-color** - Sets the background color of the checked radio button. (default: var(--dds-background-brand-base-inverted)) _(default: undefined)_\n- **--dds-radio-checked-hover-background-color** - Sets the background color of the checked radio button on hover. (default: var(--dds-background-brand-medium-inverted)) _(default: undefined)_\n- **--dds-radio-checked-active-background-color** - Sets the background color of the checked radio button when active. (default: var(--dds-background-brand-strong-inverted)) _(default: undefined)_\n- **--dds-radio-disabled-background-color** - Sets the background color of the disabled radio button. (default: var(--dds-background-neutral-disabled)) _(default: undefined)_\n- **--dds-radio-icon-background-color** - Sets the background color of the radio button icon. (default: var(--dds-transparent-white-strong-static)) _(default: undefined)_\n- **--dds-radio-disabled-icon-background-color** - Sets the background color of the disabled radio button icon. (default: var(--dds-background-neutral-stronger)) _(default: undefined)_\n- **--dds-radio-invalid-border-color** - Sets the border color of the invalid radio button. (default: var(--dds-border-negative-base)) _(default: undefined)_\n- **--dds-radio-invalid-background-color** - Sets the background color of the invalid radio button. (default: var(--dds-background-negative-base)) _(default: undefined)_\n- **--dds-radio-invalid-hover-border-color** - Sets the border color of the invalid radio button on hover. (default: var(--dds-border-negative-medium)) _(default: undefined)_\n- **--dds-radio-invalid-hover-background-color** - Sets the background color of the invalid radio button on hover. (default: var(--dds-background-negative-medium)) _(default: undefined)_\n- **--dds-radio-invalid-active-border-color** - Sets the border color of the invalid radio button when active. (default: var(--dds-border-negative-strong)) _(default: undefined)_\n- **--dds-radio-invalid-active-background-color** - Sets the background color of the invalid radio button when active. (default: var(--dds-background-negative-strong)) _(default: undefined)_\n- **--dds-radio-invalid-checked-background-color** - Sets the background color of the invalid checked radio button. (default: var(--dds-background-negative-base-inverted)) _(default: undefined)_\n- **--dds-radio-invalid-checked-hover-background-color** - Sets the background color of the invalid checked radio button on hover. (default: var(--dds-background-negative-medium-inverted)) _(default: undefined)_\n- **--dds-radio-invalid-checked-active-background-color** - Sets the background color of the invalid checked radio button when active. (default: var(--dds-background-negative-strong-inverted)) _(default: undefined)_\n- **--dds-radio-icon-size** - Sets the size of the radio button icon. (default: var(--dds-spacing-300)) _(default: undefined)_\n- **--dds-radio-readonly-border-color** - Sets the border color when the radio button is readonly. (default: var(--dds-border-neutral-subtle)) _(default: undefined)_\n- **--dds-radio-readonly-background-color** - Sets the background color when the radio button is readonly. (default: var(--dds-background-neutral-subtle)) _(default: undefined)_\n- **--dds-radio-readonly-icon-color** - Sets the color of the radio button icon when readonly. (default: var(--dds-text-neutral-base)) _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The main radio button container.\n- **wrapper** - The wrapper of the radio button.\n- **base-label** - The main label container.\n- **label** - The label of the radio button.\n- **input** - The native input of the radio button.\n- **control** - The control of the radio button.\n- **label-container** - The label container of the radio button.\n- **description** - The description of the radio button.",
           "doc-url": "",
           "attributes": [
             {
@@ -7672,6 +7672,16 @@
               "description": "Whether the radio button is focusable.",
               "value": { "type": "boolean", "default": "false" }
             },
+            {
+              "name": "posInSet",
+              "description": "Position in set — set by radio-group for correct screen reader counting",
+              "value": { "type": "number | undefined" }
+            },
+            {
+              "name": "setSize",
+              "description": "Set size — set by radio-group for correct screen reader counting",
+              "value": { "type": "number | undefined" }
+            },
             {
               "name": "preventDefault",
               "description": "Whether the radio button should prevent the default action.",
@@ -7725,6 +7735,16 @@
                 "description": "Whether the radio button is focusable.",
                 "type": "boolean"
               },
+              {
+                "name": "posInSet",
+                "description": "Position in set — set by radio-group for correct screen reader counting",
+                "type": "number | undefined"
+              },
+              {
+                "name": "setSize",
+                "description": "Set size — set by radio-group for correct screen reader counting",
+                "type": "number | undefined"
+              },
               {
                 "name": "preventDefault",
                 "description": "Whether the radio button should prevent the default action.",
@@ -7747,6 +7767,7 @@
               },
               { "name": "focusElement", "type": "HTMLInputElement" },
               { "name": "feedbackId" },
+              { "name": "role", "type": "string" },
               {
                 "name": "name",
                 "description": "The name of the radio button.",
@@ -12332,7 +12353,7 @@
           }
         },
         {
-          "name": "dap-ds-icon-clipboard-line",
+          "name": "dap-ds-icon-separator",
           "description": "An icon\n---\n\n\n### **CSS Parts:**\n - **base** - The main icon container.",
           "doc-url": "",
           "attributes": [
@@ -12385,7 +12406,7 @@
           }
         },
         {
-          "name": "dap-ds-icon-file-copy-line",
+          "name": "dap-ds-icon-clipboard-line",
           "description": "An icon\n---\n\n\n### **CSS Parts:**\n - **base** - The main icon container.",
           "doc-url": "",
           "attributes": [
@@ -12438,7 +12459,7 @@
           }
         },
         {
-          "name": "dap-ds-icon-file-image-line",
+          "name": "dap-ds-icon-file-copy-line",
           "description": "An icon\n---\n\n\n### **CSS Parts:**\n - **base** - The main icon container.",
           "doc-url": "",
           "attributes": [
@@ -12491,7 +12512,7 @@
           }
         },
         {
-          "name": "dap-ds-icon-file-music-line",
+          "name": "dap-ds-icon-file-image-line",
           "description": "An icon\n---\n\n\n### **CSS Parts:**\n - **base** - The main icon container.",
           "doc-url": "",
           "attributes": [
@@ -12544,7 +12565,7 @@
           }
         },
         {
-          "name": "dap-ds-icon-file-text-line",
+          "name": "dap-ds-icon-file-music-line",
           "description": "An icon\n---\n\n\n### **CSS Parts:**\n - **base** - The main icon container.",
           "doc-url": "",
           "attributes": [
@@ -12597,7 +12618,7 @@
           }
         },
         {
-          "name": "dap-ds-icon-file-video-line",
+          "name": "dap-ds-icon-file-text-line",
           "description": "An icon\n---\n\n\n### **CSS Parts:**\n - **base** - The main icon container.",
           "doc-url": "",
           "attributes": [
@@ -12650,7 +12671,7 @@
           }
         },
         {
-          "name": "dap-ds-icon-folder-line",
+          "name": "dap-ds-icon-file-video-line",
           "description": "An icon\n---\n\n\n### **CSS Parts:**\n - **base** - The main icon container.",
           "doc-url": "",
           "attributes": [
@@ -12703,7 +12724,7 @@
           }
         },
         {
-          "name": "dap-ds-icon-folder-open-line",
+          "name": "dap-ds-icon-folder-line",
           "description": "An icon\n---\n\n\n### **CSS Parts:**\n - **base** - The main icon container.",
           "doc-url": "",
           "attributes": [
@@ -12756,7 +12777,7 @@
           }
         },
         {
-          "name": "dap-ds-icon-separator",
+          "name": "dap-ds-icon-folder-open-line",
           "description": "An icon\n---\n\n\n### **CSS Parts:**\n - **base** - The main icon container.",
           "doc-url": "",
           "attributes": [
@@ -14134,7 +14155,7 @@
           }
         },
         {
-          "name": "dap-ds-icon-error-warning-line",
+          "name": "dap-ds-icon-external-link-line",
           "description": "An icon\n---\n\n\n### **CSS Parts:**\n - **base** - The main icon container.",
           "doc-url": "",
           "attributes": [
@@ -14187,7 +14208,7 @@
           }
         },
         {
-          "name": "dap-ds-icon-external-link-line",
+          "name": "dap-ds-icon-error-warning-line",
           "description": "An icon\n---\n\n\n### **CSS Parts:**\n - **base** - The main icon container.",
           "doc-url": "",
           "attributes": [