dap-design-system 0.63.0 → 1.0.0-beta.2

package/dist/manifest/types/vue/index.d.ts

@@ -232,16 +232,16 @@ export interface DapDSBannerEvents {
   onDdsClose?: (event: CustomEvent) => void
 }
 
-export interface DapDSAvatarGroupEvents {
-  /** Fired when the overflow indicator is clicked. */
-  onDdsOverflowClick?: (event: CustomEvent) => void
-}
-
 export interface DapDSButtonEvents {
   /** Emitted when the loading timeout is reached */
   onDdsLoadingTimeout?: (event: CustomEvent) => void
 }
 
+export interface DapDSAvatarGroupEvents {
+  /** Fired when the overflow indicator is clicked. */
+  onDdsOverflowClick?: (event: CustomEvent) => void
+}
+
 export interface DapDSCalendarEvents {
   /** Fired when the calendar value changes. */
   onDdsChange?: (event: CustomEvent<{ value: Dayjs }>) => void
@@ -314,11 +314,6 @@ export interface DapDSCommandEvents {
   onDdsClose?: (event: CustomEvent) => void
 }
 
-export interface DapDSContentSwitcherEvents {
-  /** Fired when the content switcher is changed. */
-  onDdsChange?: (event: CustomEvent<{ value: string, selected: boolean }>) => void
-}
-
 export interface DapDSCopyBoxInputEvents {
   /** Fired when the user clicks on the copy button. */
   onDdsCopy?: (event: CustomEvent<{ value: string }>) => void
@@ -336,6 +331,11 @@ export interface DapDSCopyBoxInputEvents {
   onDdsNotAllowed?: (event: CustomEvent) => void
 }
 
+export interface DapDSContentSwitcherEvents {
+  /** Fired when the content switcher is changed. */
+  onDdsChange?: (event: CustomEvent<{ value: string, selected: boolean }>) => void
+}
+
 export interface DapDSDataTableEvents<T> {
   /** Fired when the sorting of the table changes. */
   onDdsSortingChange?: (event: CustomEvent<{ sorting: SortingState }>) => void
@@ -441,18 +441,6 @@ export interface DapDSModalEvents {
   onDdsCancel?: (event: CustomEvent) => void
 }
 
-export interface DapDSNavigationMenuItemEvents {
-  /** Fired when a navigation item is clicked. */
-  onDdsNavigationItemClick?: (event: CustomEvent<{ href: string, event: Event }>) => void
-  /** Fired when a navigation dropdown is opened. */
-  onDdsNavigationDropdownOpen?: (event: CustomEvent<{ item: DapDSNavigationMenuItem }>) => void
-}
-
-export interface DapDSNavigationMenuEvents {
-  /** Fired when a navigation item is clicked. */
-  onDdsNavigationItemClick?: (event: CustomEvent<{ href: string, event: Event }>) => void
-}
-
 export interface DapDSNumberInputEvents {
   /** Fired when the input value changes. */
   onDdsChange?: (event: CustomEvent<{ value: string }>) => void
@@ -473,6 +461,18 @@ export interface DapDSOfficialWebsiteBannerEvents {
   onDdsClosed?: (event: CustomEvent) => void
 }
 
+export interface DapDSNavigationMenuItemEvents {
+  /** Fired when a navigation item is clicked. */
+  onDdsNavigationItemClick?: (event: CustomEvent<{ href: string, event: Event }>) => void
+  /** Fired when a navigation dropdown is opened. */
+  onDdsNavigationDropdownOpen?: (event: CustomEvent<{ item: DapDSNavigationMenuItem }>) => void
+}
+
+export interface DapDSNavigationMenuEvents {
+  /** Fired when a navigation item is clicked. */
+  onDdsNavigationItemClick?: (event: CustomEvent<{ href: string, event: Event }>) => void
+}
+
 export interface DapDSOptionListEvents {
   /** Fired when the escape key is pressed. */
   onDdsCancel?: (event: CustomEvent) => void
@@ -484,6 +484,11 @@ export interface DapDSOptionListEvents {
   onDdsListChanged?: (event: CustomEvent<{ elements: DapDSOptionItem[] }>) => void
 }
 
+export interface DapDSPagerEvents {
+  /** Event fired when the pagination changes */
+  onDdsPaginationChange?: (event: CustomEvent<{ action: string, pagination: { pageIndex: number, pageSize: number } }>) => void
+}
+
 export interface DapDSOverlayEvents {
   /** Fires before the overlay opens. */
   onDdsBeforeOpen?: (event: CustomEvent<CustomEvent>) => void
@@ -495,11 +500,6 @@ export interface DapDSOverlayEvents {
   onDdsClosed?: (event: CustomEvent<CustomEvent>) => void
 }
 
-export interface DapDSPagerEvents {
-  /** Event fired when the pagination changes */
-  onDdsPaginationChange?: (event: CustomEvent<{ action: string, pagination: { pageIndex: number, pageSize: number } }>) => void
-}
-
 export interface DapDSPasswordInputEvents {
   /** Fired when the input value changes. */
   onDdsChange?: (event: CustomEvent<{ value: string }>) => void
@@ -592,23 +592,6 @@ export interface DapDSTabGroupEvents {
   onDdsTabSelect?: (event: CustomEvent) => void
 }
 
-export interface DapDSTextareaEvents {
-  /** Fires when the count of the textarea changes. */
-  onDdsCountChange?: (event: CustomEvent<{ value: number }>) => void
-  /** Fired when the textarea value changes. */
-  onDdsChange?: (event: CustomEvent<{ value: string }>) => void
-  /** Fired when the textarea value changes. */
-  onDdsInput?: (event: CustomEvent<{ value: string }>) => void
-  /** Fired when a key is pressed down. */
-  onDdsKeydown?: (event: CustomEvent<{ value: string, originalEvent: Event }>) => void
-  /** Fired when the textarea loses focus. */
-  onDdsBlur?: (event: CustomEvent) => void
-  /** Emitted when the textarea gains focus. */
-  onDdsFocus?: (event: CustomEvent) => void
-  /** Emitted when select text in textarea. */
-  onDdsSelect?: (event: CustomEvent<{ value: string }>) => void
-}
-
 export interface DapDSTimeGridEvents {
   /** Fired when time selection changes. */
   onDdsChange?: (event: CustomEvent<{ detail: TimeSelection }>) => void
@@ -651,6 +634,23 @@ export interface DapDSTrayEvents {
   onDdsClose?: (event: CustomEvent) => void
 }
 
+export interface DapDSTextareaEvents {
+  /** Fires when the count of the textarea changes. */
+  onDdsCountChange?: (event: CustomEvent<{ value: number }>) => void
+  /** Fired when the textarea value changes. */
+  onDdsChange?: (event: CustomEvent<{ value: string }>) => void
+  /** Fired when the textarea value changes. */
+  onDdsInput?: (event: CustomEvent<{ value: string }>) => void
+  /** Fired when a key is pressed down. */
+  onDdsKeydown?: (event: CustomEvent<{ value: string, originalEvent: Event }>) => void
+  /** Fired when the textarea loses focus. */
+  onDdsBlur?: (event: CustomEvent) => void
+  /** Emitted when the textarea gains focus. */
+  onDdsFocus?: (event: CustomEvent) => void
+  /** Emitted when select text in textarea. */
+  onDdsSelect?: (event: CustomEvent<{ value: string }>) => void
+}
+
 export interface DapDSRadioGroupEvents {
   /** Fired when the radio group is checked. */
   onDdsChange?: (event: CustomEvent) => void
@@ -671,11 +671,9 @@ export interface DapDSAccordionSlots {
   'icon-closed'?: () => any
 }
 
-export interface DapDSBadgeSlots {
-  /** The content of the badge. */
+export interface DapDSAccordionGroupSlots {
+  /** The content of the accordion group. */
   default?: () => any
-  /** The icon of the badge. */
-  'icon'?: () => any
 }
 
 export interface DapDSAvatarSlots {
@@ -685,11 +683,6 @@ export interface DapDSAvatarSlots {
   'fallback'?: () => any
 }
 
-export interface DapDSAccordionGroupSlots {
-  /** The content of the accordion group. */
-  default?: () => any
-}
-
 export interface DapDSBannerSlots {
   /** The content of the banner. */
   default?: () => any
@@ -706,9 +699,11 @@ export interface DapDSBreadcrumbSlots {
   'separator'?: () => any
 }
 
-export interface DapDSAvatarGroupSlots {
-  /** The avatars to display in the group. */
+export interface DapDSBadgeSlots {
+  /** The content of the badge. */
   default?: () => any
+  /** The icon of the badge. */
+  'icon'?: () => any
 }
 
 export interface DapDSBreadcrumbItemSlots {
@@ -723,13 +718,8 @@ export interface DapDSButtonSlots {
   default?: () => any
 }
 
-export interface DapDSCalendarCellSlots {
-  /** The content of the calendar cell. */
-  default?: () => any
-}
-
-export interface DapDSCalendarSlots {
-  /** The content of the calendar. */
+export interface DapDSAvatarGroupSlots {
+  /** The avatars to display in the group. */
   default?: () => any
 }
 
@@ -743,6 +733,16 @@ export interface DapDSButtonGroupSlots {
   default?: () => any
 }
 
+export interface DapDSCalendarCellSlots {
+  /** The content of the calendar cell. */
+  default?: () => any
+}
+
+export interface DapDSCalendarSlots {
+  /** The content of the calendar. */
+  default?: () => any
+}
+
 export interface DapDSCalloutSlots {
   /** The content of the callout. */
   default?: () => any
@@ -916,24 +916,6 @@ export interface DapDSModalSlots {
   'footer'?: () => any
 }
 
-export interface DapDSNavigationMenuItemSlots {
-  /** The trigger element (link, button, etc.) for this navigation item. */
-  'trigger'?: () => any
-  /** The title of the navigation item. */
-  'title'?: () => any
-  /** The expand indicator icon (defaults to arrow icon based on orientation and level). */
-  'indicator'?: () => any
-  /** A router link element (e.g. Next.js Link) used for SPA navigation. Rendered outside the popup so it is always accessible to programmatic clicks. */
-  'link'?: () => any
-  /** The dropdown content (can contain nested dap-ds-navigation-menu-item elements). */
-  default?: () => any
-}
-
-export interface DapDSNavigationMenuSlots {
-  /** The navigation menu list and items. */
-  default?: () => any
-}
-
 export interface DapDSNotificationBadgeSlots {
   /** The content of the notification badge. */
   default?: () => any
@@ -955,6 +937,24 @@ export interface DapDSOfficialWebsiteBannerSlots {
   'icon-closed'?: () => any
 }
 
+export interface DapDSNavigationMenuItemSlots {
+  /** The trigger element (link, button, etc.) for this navigation item. */
+  'trigger'?: () => any
+  /** The title of the navigation item. */
+  'title'?: () => any
+  /** The expand indicator icon (defaults to arrow icon based on orientation and level). */
+  'indicator'?: () => any
+  /** A router link element (e.g. Next.js Link) used for SPA navigation. Rendered outside the popup so it is always accessible to programmatic clicks. */
+  'link'?: () => any
+  /** The dropdown content (can contain nested dap-ds-navigation-menu-item elements). */
+  default?: () => any
+}
+
+export interface DapDSNavigationMenuSlots {
+  /** The navigation menu list and items. */
+  default?: () => any
+}
+
 export interface DapDSOptionGroupSlots {
   /** The option items in this group. */
   default?: () => any
@@ -1039,28 +1039,16 @@ export interface DapDSSnackbarMessageSlots {
   default?: () => any
 }
 
-export interface DapDSSpinnerSlots {
-  /** The loading text content. */
-  default?: () => any
-  /** The loading icon content. */
-  'icon'?: () => any
-}
-
 export interface DapDSStackSlots {
   /** The content of the stack. */
   default?: () => any
 }
 
-export interface DapDSTabGroupSlots {
-  /** The tab items. */
-  default?: () => any
-}
-
-export interface DapDSTabSlots {
-  /** The tab title template. */
+export interface DapDSSpinnerSlots {
+  /** The loading text content. */
   default?: () => any
-  /** The tab content. */
-  'content'?: () => any
+  /** The loading icon content. */
+  'icon'?: () => any
 }
 
 export interface DapDSTableCellSlots {
@@ -1083,9 +1071,16 @@ export interface DapDSTableSlots {
   default?: () => any
 }
 
-export interface DapDSTextareaSlots {
-  /** The custom icon of the feedback. */
-  'feedback-icon'?: () => any
+export interface DapDSTabGroupSlots {
+  /** The tab items. */
+  default?: () => any
+}
+
+export interface DapDSTabSlots {
+  /** The tab title template. */
+  default?: () => any
+  /** The tab content. */
+  'content'?: () => any
 }
 
 export interface DapDSTimelineItemSlots {
@@ -1098,11 +1093,6 @@ export interface DapDSTimelineSlots {
   default?: () => any
 }
 
-export interface DapDSToggleButtonSlots {
-  /** The content of the toggle button. */
-  default?: () => any
-}
-
 export interface DapDSTooltipSlots {
   /** The content of the tooltip. */
   default?: () => any
@@ -1110,6 +1100,11 @@ export interface DapDSTooltipSlots {
   'trigger'?: () => any
 }
 
+export interface DapDSToggleButtonSlots {
+  /** The content of the toggle button. */
+  default?: () => any
+}
+
 export interface DapDSTraySlots {
   /** The content of the tray. */
   default?: () => any
@@ -1119,6 +1114,11 @@ export interface DapDSTraySlots {
   'footer'?: () => any
 }
 
+export interface DapDSTextareaSlots {
+  /** The custom icon of the feedback. */
+  'feedback-icon'?: () => any
+}
+
 export interface DapDSTypographySlots {
   /** The content of the typography. */
   default?: () => any
@@ -1165,6 +1165,15 @@ export type DapDSAccordionProps = {
   loading?: DapDSAccordion["loading"]
 }
 
+export type DapDSAccordionGroupProps = {
+  /** Whether to close other accordions when one is opened. */
+  autoClose?: DapDSAccordionGroup["autoClose"]
+  /** The variant of the accordion */
+  variant?: DapDSAccordionGroup["variant"]
+  /**  */
+  tagName?: DapDSAccordionGroup["tagName"]
+}
+
 export type DapDSAnchorHeadingProps = {
   /** The variant of the heading. Default is `h2`. Can be `h1`, `h2`, `h3`, `h4`, `h5`, or `h6`. */
   variant?: DapDSAnchorHeading["variant"]
@@ -1180,23 +1189,6 @@ export type DapDSAnchorHeadingProps = {
   anchorTitle?: DapDSAnchorHeading["anchorTitle"]
 }
 
-export type DapDSBadgeProps = {
-  /** The type of the badge */
-  type?: DapDSBadge["type"]
-  /** The icon of the badge, this is a name of a built in icon */
-  icon?: DapDSBadge["icon"]
-  /** Whether the badge represents dynamic content that should announce changes */
-  live?: DapDSBadge["live"]
-  /**  */
-  tagName?: DapDSBadge["tagName"]
-  /**  */
-  dependencies?: DapDSBadge["dependencies"]
-  /** The size of the badge. Default is `sm`. */
-  size?: DapDSBadge["size"]
-  /** Responsive size map (e.g. "md:lg"). */
-  sizeMap?: DapDSBadge["sizeMap"]
-}
-
 export type DapDSAvatarProps = {
   /** The shape of the avatar */
   shape?: DapDSAvatar["shape"]
@@ -1228,15 +1220,6 @@ export type DapDSAvatarProps = {
   sizeMap?: DapDSAvatar["sizeMap"]
 }
 
-export type DapDSAccordionGroupProps = {
-  /** Whether to close other accordions when one is opened. */
-  autoClose?: DapDSAccordionGroup["autoClose"]
-  /** The variant of the accordion */
-  variant?: DapDSAccordionGroup["variant"]
-  /**  */
-  tagName?: DapDSAccordionGroup["tagName"]
-}
-
 export type DapDSBannerProps = {
   /** The variant of the banner */
   variant?: DapDSBanner["variant"]
@@ -1267,25 +1250,21 @@ export type DapDSBreadcrumbProps = {
   tagName?: DapDSBreadcrumb["tagName"]
 }
 
-export type DapDSAvatarGroupProps = {
-  /** Layout type for the avatar group */
-  layout?: DapDSAvatarGroup["layout"]
-  /** Maximum number of avatars to show before showing overflow */
-  max?: DapDSAvatarGroup["max"]
-  /** Whether to show the total count in overflow indicator */
-  "show-total"?: DapDSAvatarGroup["showTotal"]
-  /** Interactive overflow indicator */
-  "interactive-overflow"?: DapDSAvatarGroup["interactiveOverflow"]
-  /** Accessible label for the avatar group */
-  label?: DapDSAvatarGroup["label"]
-  /** Accessible label for the overflow indicator */
-  "overflow-label"?: DapDSAvatarGroup["overflowLabel"]
+export type DapDSBadgeProps = {
+  /** The type of the badge */
+  type?: DapDSBadge["type"]
+  /** The icon of the badge, this is a name of a built in icon */
+  icon?: DapDSBadge["icon"]
+  /** Whether the badge represents dynamic content that should announce changes */
+  live?: DapDSBadge["live"]
   /**  */
-  tagName?: DapDSAvatarGroup["tagName"]
-  /** The size of avatars in the group. Default is `md`. See SizedMixin. */
-  size?: DapDSAvatarGroup["size"]
-  /** Responsive size map (e.g. "md:lg"); see SizedMixin. */
-  sizeMap?: DapDSAvatarGroup["sizeMap"]
+  tagName?: DapDSBadge["tagName"]
+  /**  */
+  dependencies?: DapDSBadge["dependencies"]
+  /** The size of the badge. Default is `sm`. */
+  size?: DapDSBadge["size"]
+  /** Responsive size map (e.g. "md:lg"). */
+  sizeMap?: DapDSBadge["sizeMap"]
 }
 
 export type DapDSBreadcrumbItemProps = {
@@ -1340,6 +1319,44 @@ export type DapDSButtonProps = {
   sizeMap?: DapDSButton["sizeMap"]
 }
 
+export type DapDSAvatarGroupProps = {
+  /** Layout type for the avatar group */
+  layout?: DapDSAvatarGroup["layout"]
+  /** Maximum number of avatars to show before showing overflow */
+  max?: DapDSAvatarGroup["max"]
+  /** Whether to show the total count in overflow indicator */
+  "show-total"?: DapDSAvatarGroup["showTotal"]
+  /** Interactive overflow indicator */
+  "interactive-overflow"?: DapDSAvatarGroup["interactiveOverflow"]
+  /** Accessible label for the avatar group */
+  label?: DapDSAvatarGroup["label"]
+  /** Accessible label for the overflow indicator */
+  "overflow-label"?: DapDSAvatarGroup["overflowLabel"]
+  /**  */
+  tagName?: DapDSAvatarGroup["tagName"]
+  /** The size of avatars in the group. Default is `md`. See SizedMixin. */
+  size?: DapDSAvatarGroup["size"]
+  /** Responsive size map (e.g. "md:lg"); see SizedMixin. */
+  sizeMap?: DapDSAvatarGroup["sizeMap"]
+}
+
+export type DapDSButtonGroupSeparatorProps = {
+  /**  */
+  tagName?: DapDSButtonGroupSeparator["tagName"]
+}
+
+export type DapDSButtonGroupTextProps = {
+  /**  */
+  tagName?: DapDSButtonGroupText["tagName"]
+}
+
+export type DapDSButtonGroupProps = {
+  /** The layout direction of the group */
+  orientation?: DapDSButtonGroup["orientation"]
+  /**  */
+  tagName?: DapDSButtonGroup["tagName"]
+}
+
 export type DapDSCalendarCellProps = {
   /** Whether the calendar cell is selected. */
   selected?: DapDSCalendarCell["selected"]
@@ -1408,23 +1425,6 @@ export type DapDSCalendarProps = {
   shouldHideAdjacentMonths?: DapDSCalendar["shouldHideAdjacentMonths"]
 }
 
-export type DapDSButtonGroupSeparatorProps = {
-  /**  */
-  tagName?: DapDSButtonGroupSeparator["tagName"]
-}
-
-export type DapDSButtonGroupTextProps = {
-  /**  */
-  tagName?: DapDSButtonGroupText["tagName"]
-}
-
-export type DapDSButtonGroupProps = {
-  /** The layout direction of the group */
-  orientation?: DapDSButtonGroup["orientation"]
-  /**  */
-  tagName?: DapDSButtonGroup["tagName"]
-}
-
 export type DapDSCalloutProps = {
   /** The variant of the callout */
   variant?: DapDSCallout["variant"]
@@ -1822,28 +1822,6 @@ export type DapDSCommandProps = {
   disableViewportAutoClose?: DapDSCommand["disableViewportAutoClose"]
 }
 
-export type DapDSContentSwitcherItemProps = {
-  /** The value of the segmented control item. */
-  value?: DapDSContentSwitcherItem["value"]
-  /** The checked state of the segmented control item. */
-  checked?: DapDSContentSwitcherItem["checked"]
-  /** The disabled state of the segmented control item. */
-  disabled?: DapDSContentSwitcherItem["disabled"]
-  /** The name of the segmented control item. */
-  name?: DapDSContentSwitcherItem["name"]
-  /**  */
-  tagName?: DapDSContentSwitcherItem["tagName"]
-}
-
-export type DapDSContentSwitcherProps = {
-  /** Whether the content switcher allows multiple selections. */
-  multiSelect?: DapDSContentSwitcher["multiSelect"]
-  /** The value of the content switcher. A comma-separated list if `multiSelect` is `true`. */
-  value?: DapDSContentSwitcher["value"]
-  /**  */
-  tagName?: DapDSContentSwitcher["tagName"]
-}
-
 export type DapDSCopyBoxInputProps = {
   /** The aria label of the copy button. */
   copyButtonAriaLabel?: DapDSCopyBoxInput["copyButtonAriaLabel"]
@@ -1897,6 +1875,28 @@ export type DapDSCopyBoxInputProps = {
   subtle?: DapDSCopyBoxInput["subtle"]
 }
 
+export type DapDSContentSwitcherItemProps = {
+  /** The value of the segmented control item. */
+  value?: DapDSContentSwitcherItem["value"]
+  /** The checked state of the segmented control item. */
+  checked?: DapDSContentSwitcherItem["checked"]
+  /** The disabled state of the segmented control item. */
+  disabled?: DapDSContentSwitcherItem["disabled"]
+  /** The name of the segmented control item. */
+  name?: DapDSContentSwitcherItem["name"]
+  /**  */
+  tagName?: DapDSContentSwitcherItem["tagName"]
+}
+
+export type DapDSContentSwitcherProps = {
+  /** Whether the content switcher allows multiple selections. */
+  multiSelect?: DapDSContentSwitcher["multiSelect"]
+  /** The value of the content switcher. A comma-separated list if `multiSelect` is `true`. */
+  value?: DapDSContentSwitcher["value"]
+  /**  */
+  tagName?: DapDSContentSwitcher["tagName"]
+}
+
 export type DapDSDAPBadgeProps = {
   /** The variant of the DÁP badge */
   variant?: DapDSDAPBadge["variant"]
@@ -1996,7 +1996,7 @@ in its definition; `minSize` / `maxSize` bound the width. Read the result from
   /** Column sizing state of the table: column id -> width in pixels. Overrides the
 column definition's `size`; columns missing from it keep their defined width. */
   columnSizing?: DapDSDataTable<T>["columnSizing"]
-  /** ID of element labeling the table */
+  /** Accessible name of the table (its `aria-label`). Defaults to a translated table description. */
   ariaLabel?: DapDSDataTable<T>["ariaLabel"]
   /**  */
   tagName?: DapDSDataTable<T>["tagName"]
@@ -2628,95 +2628,6 @@ export type DapDSModalProps = {
   useNativeFocus?: DapDSModal["useNativeFocus"]
 }
 
-export type DapDSNavigationMenuItemProps = {
-  /** The disabled state of the popup. Default is false. */
-  disabled?: DapDSNavigationMenuItem["disabled"]
-  /** The open state of the popup. Default is false. */
-  opened?: DapDSNavigationMenuItem["opened"]
-  /** The placement of the popup (automatically adjusted based on nesting level). Default is 'bottom-start'. */
-  placement?: DapDSNavigationMenuItem["placement"]
-  /** The floating strategy of the popup. Default is 'fixed'. */
-  floatingStrategy?: DapDSNavigationMenuItem["floatingStrategy"]
-  /** The offset of the popup. Default is 0. */
-  offset?: DapDSNavigationMenuItem["offset"]
-  /** Whether the popup should sync its width with the trigger. Default is false. */
-  sync?: DapDSNavigationMenuItem["sync"]
-  /** The maximum height of the popup. Default is 250. */
-  maxHeight?: DapDSNavigationMenuItem["maxHeight"]
-  /** The maximum width of the popup. Default is 'auto'. */
-  maxWidth?: DapDSNavigationMenuItem["maxWidth"]
-  /** Whether the popup has an arrow. Default is false. */
-  hasArrow?: DapDSNavigationMenuItem["hasArrow"]
-  /** Whether the popup should overflow. Default is true. */
-  overflow?: DapDSNavigationMenuItem["overflow"]
-  /** Whether the popup should take full width of the screen. Default is false. */
-  fullWidth?: DapDSNavigationMenuItem["fullWidth"]
-  /** The name of the icon to display in the trigger. */
-  icon?: DapDSNavigationMenuItem["icon"]
-  /** The name of the element that labels the navigation dropdown. */
-  "aria-labelledby"?: DapDSNavigationMenuItem["ariaLabelledBy"]
-  /** The href of the navigation item that is active (receives aria-current="page"). */
-  activeHref?: DapDSNavigationMenuItem["activeHref"]
-  /** The href of the navigation item. If provided, the navigation item will be active if the href is a substring of the activeHref. */
-  baseHref?: DapDSNavigationMenuItem["baseHref"]
-  /** Whether the navigation item should be active if the href is exactly the same as the activeHref. Default is false. */
-  exactHref?: DapDSNavigationMenuItem["exactHref"]
-  /** The href URL for the navigation item link. When provided, the default trigger renders as a link. */
-  href?: DapDSNavigationMenuItem["href"]
-  /** The target attribute for link navigation. */
-  target?: DapDSNavigationMenuItem["target"]
-  /** The rel attribute for link security and behavior. */
-  rel?: DapDSNavigationMenuItem["rel"]
-  /** The label text for the navigation item. This will be displayed in the title slot if no custom title slot content is provided. */
-  label?: DapDSNavigationMenuItem["label"]
-  /** The nesting level of this navigation item (0 = top-level, automatically set for nested items). Default is 0. */
-  level?: DapDSNavigationMenuItem["level"]
-  /** The orientation of the parent navigation menu (automatically inherited). Default is 'horizontal'. */
-  orientation?: DapDSNavigationMenuItem["orientation"]
-  /** Controls how Tab key navigates through top-level items. Default is 'group'. */
-  tabMode?: DapDSNavigationMenuItem["tabMode"]
-  /** `data-testid` for the default menu trigger button. */
-  triggerButtonTestId?: DapDSNavigationMenuItem["triggerButtonTestId"]
-  /**  */
-  tagName?: DapDSNavigationMenuItem["tagName"]
-  /**  */
-  dependencies?: DapDSNavigationMenuItem["dependencies"]
-  /**  */
-  submenuController?: DapDSNavigationMenuItem["submenuController"]
-  /**  */
-  hasContent?: DapDSNavigationMenuItem["hasContent"]
-  /** Computed property to detect if this item contains nested navigation menu items.
-
-Backed by state (populated in `_updateNestedItems`) rather than a live
-`querySelectorAll` so it is SSR-safe: the `@lit-labs/ssr` element shim has no
-`querySelectorAll`, and reading it from `render()` would both throw on the
-server and structurally diverge from the client hydration render (the expand
-indicator span). Starts `false` (matching `hasContent`) so server and client
-hydration renders agree; the real value is resolved in `firstUpdated`. */
-  hasNestedItems?: DapDSNavigationMenuItem["hasNestedItems"]
-  /** The element keyboard activation should act on: the element slotted into
-`trigger` when one is provided, otherwise the default trigger button
-rendered in the shadow root. */
-  activationTrigger?: DapDSNavigationMenuItem["activationTrigger"]
-  /** The size of the popup. Default is 'sm'. */
-  size?: DapDSNavigationMenuItem["size"]
-}
-
-export type DapDSNavigationMenuProps = {
-  /** The currently active href for highlighting active navigation items with aria-current="page". Defaults to window.location.pathname if not provided. */
-  activeHref?: DapDSNavigationMenu["activeHref"]
-  /** The orientation of the navigation menu. Default is 'horizontal'. */
-  orientation?: DapDSNavigationMenu["orientation"]
-  /** Whether the navigation menu should take full width of the screen. Default is false. */
-  fullWidth?: DapDSNavigationMenu["fullWidth"]
-  /** Whether multiple dropdown branches can stay open simultaneously (accordion mode). Default is true. */
-  allowMultipleOpen?: DapDSNavigationMenu["allowMultipleOpen"]
-  /** Controls how Tab key navigates through top-level items. Default is 'group'. Group mode will have the first item in the tab order, and items mode will have all items in the tab order. */
-  tabMode?: DapDSNavigationMenu["tabMode"]
-  /**  */
-  tagName?: DapDSNavigationMenu["tagName"]
-}
-
 export type DapDSNotificationBadgeProps = {
   /** The content of the badge, it can be a number or a string. Content tried to be parsed as a number, if it's not a number, it will be displayed as a string. */
   badgeContent?: DapDSNotificationBadge["badgeContent"]
@@ -2842,55 +2753,144 @@ export type DapDSOfficialWebsiteBannerProps = {
   lastItem?: DapDSOfficialWebsiteBanner["lastItem"]
 }
 
-export type DapDSOptionGroupProps = {
-  /** The label of the option group (displayed in native optgroup). */
-  label?: DapDSOptionGroup["label"]
-  /** Whether all options in the group are disabled. */
-  disabled?: DapDSOptionGroup["disabled"]
-  /**  */
-  tagName?: DapDSOptionGroup["tagName"]
-}
-
-export type DapDSOptionItemProps = {
-  /** The selected state of the option item */
-  selected?: DapDSOptionItem["selected"]
-  /** Wheteher the item is selectable, whether it shows the selected icon */
-  selectable?: DapDSOptionItem["selectable"]
-  /** The position of the selected icon */
-  selectedIconPosition?: DapDSOptionItem["selectedIconPosition"]
-  /** The value of the option item */
-  value?: DapDSOptionItem["value"]
-  /** The disabled state of the option item */
-  disabled?: DapDSOptionItem["disabled"]
-  /** The focused state of the option item */
-  focused?: DapDSOptionItem["focused"]
-  /** The label of the option item, it can be a simplier version of an item */
-  label?: DapDSOptionItem["label"]
-  /**  */
-  tagName?: DapDSOptionItem["tagName"]
-  /**  */
-  dependencies?: DapDSOptionItem["dependencies"]
-  /**  */
-  optionText?: DapDSOptionItem["optionText"]
-}
-
-export type DapDSOptionListProps = {
-  /** The filter text of the option list */
-  filterText?: DapDSOptionList["filterText"]
-  /** The value of the option list */
-  value?: DapDSOptionList["value"]
-  /** The focused state of the option list. */
-  focused?: DapDSOptionList["focused"]
-  /** Whether the option list is searchable */
-  search?: DapDSOptionList["search"]
-  /** The search mode of the option list. Default is `none` */
-  searchMode?: DapDSOptionList["searchMode"]
-  /** Whether the option list items are selectable, whether it shows the selected icon */
-  selectable?: DapDSOptionList["selectable"]
-  /** The options as data, instead of `dap-ds-option-item` children. When set, child options are ignored. Also accepted as a JSON attribute. */
-  items?: DapDSOptionList["items"]
-  /** Whether multiple options can be selected; exposed as aria-multiselectable on the listbox. */
-  multiselectable?: DapDSOptionList["multiselectable"]
+export type DapDSNavigationMenuItemProps = {
+  /** The disabled state of the popup. Default is false. */
+  disabled?: DapDSNavigationMenuItem["disabled"]
+  /** The open state of the popup. Default is false. */
+  opened?: DapDSNavigationMenuItem["opened"]
+  /** The placement of the popup (automatically adjusted based on nesting level). Default is 'bottom-start'. */
+  placement?: DapDSNavigationMenuItem["placement"]
+  /** The floating strategy of the popup. Default is 'fixed'. */
+  floatingStrategy?: DapDSNavigationMenuItem["floatingStrategy"]
+  /** The offset of the popup. Default is 0. */
+  offset?: DapDSNavigationMenuItem["offset"]
+  /** Whether the popup should sync its width with the trigger. Default is false. */
+  sync?: DapDSNavigationMenuItem["sync"]
+  /** The maximum height of the popup. Default is 250. */
+  maxHeight?: DapDSNavigationMenuItem["maxHeight"]
+  /** The maximum width of the popup. Default is 'auto'. */
+  maxWidth?: DapDSNavigationMenuItem["maxWidth"]
+  /** Whether the popup has an arrow. Default is false. */
+  hasArrow?: DapDSNavigationMenuItem["hasArrow"]
+  /** Whether the popup should overflow. Default is true. */
+  overflow?: DapDSNavigationMenuItem["overflow"]
+  /** Whether the popup should take full width of the screen. Default is false. */
+  fullWidth?: DapDSNavigationMenuItem["fullWidth"]
+  /** The name of the icon to display in the trigger. */
+  icon?: DapDSNavigationMenuItem["icon"]
+  /** The name of the element that labels the navigation dropdown. */
+  "aria-labelledby"?: DapDSNavigationMenuItem["ariaLabelledBy"]
+  /** The href of the navigation item that is active (receives aria-current="page"). */
+  activeHref?: DapDSNavigationMenuItem["activeHref"]
+  /** The href of the navigation item. If provided, the navigation item will be active if the href is a substring of the activeHref. */
+  baseHref?: DapDSNavigationMenuItem["baseHref"]
+  /** Whether the navigation item should be active if the href is exactly the same as the activeHref. Default is false. */
+  exactHref?: DapDSNavigationMenuItem["exactHref"]
+  /** The href URL for the navigation item link. When provided, the default trigger renders as a link. */
+  href?: DapDSNavigationMenuItem["href"]
+  /** The target attribute for link navigation. */
+  target?: DapDSNavigationMenuItem["target"]
+  /** The rel attribute for link security and behavior. */
+  rel?: DapDSNavigationMenuItem["rel"]
+  /** The label text for the navigation item. This will be displayed in the title slot if no custom title slot content is provided. */
+  label?: DapDSNavigationMenuItem["label"]
+  /** The nesting level of this navigation item (0 = top-level, automatically set for nested items). Default is 0. */
+  level?: DapDSNavigationMenuItem["level"]
+  /** The orientation of the parent navigation menu (automatically inherited). Default is 'horizontal'. */
+  orientation?: DapDSNavigationMenuItem["orientation"]
+  /** Controls how Tab key navigates through top-level items. Default is 'group'. */
+  tabMode?: DapDSNavigationMenuItem["tabMode"]
+  /** `data-testid` for the default menu trigger button. */
+  triggerButtonTestId?: DapDSNavigationMenuItem["triggerButtonTestId"]
+  /**  */
+  tagName?: DapDSNavigationMenuItem["tagName"]
+  /**  */
+  dependencies?: DapDSNavigationMenuItem["dependencies"]
+  /**  */
+  submenuController?: DapDSNavigationMenuItem["submenuController"]
+  /**  */
+  hasContent?: DapDSNavigationMenuItem["hasContent"]
+  /** Computed property to detect if this item contains nested navigation menu items.
+
+Backed by state (populated in `_updateNestedItems`) rather than a live
+`querySelectorAll` so it is SSR-safe: the `@lit-labs/ssr` element shim has no
+`querySelectorAll`, and reading it from `render()` would both throw on the
+server and structurally diverge from the client hydration render (the expand
+indicator span). Starts `false` (matching `hasContent`) so server and client
+hydration renders agree; the real value is resolved in `firstUpdated`. */
+  hasNestedItems?: DapDSNavigationMenuItem["hasNestedItems"]
+  /** The element keyboard activation should act on: the element slotted into
+`trigger` when one is provided, otherwise the default trigger button
+rendered in the shadow root. */
+  activationTrigger?: DapDSNavigationMenuItem["activationTrigger"]
+  /** The size of the popup. Default is 'sm'. */
+  size?: DapDSNavigationMenuItem["size"]
+}
+
+export type DapDSNavigationMenuProps = {
+  /** The currently active href for highlighting active navigation items with aria-current="page". Defaults to window.location.pathname if not provided. */
+  activeHref?: DapDSNavigationMenu["activeHref"]
+  /** The orientation of the navigation menu. Default is 'horizontal'. */
+  orientation?: DapDSNavigationMenu["orientation"]
+  /** Whether the navigation menu should take full width of the screen. Default is false. */
+  fullWidth?: DapDSNavigationMenu["fullWidth"]
+  /** Whether multiple dropdown branches can stay open simultaneously (accordion mode). Default is true. */
+  allowMultipleOpen?: DapDSNavigationMenu["allowMultipleOpen"]
+  /** Controls how Tab key navigates through top-level items. Default is 'group'. Group mode will have the first item in the tab order, and items mode will have all items in the tab order. */
+  tabMode?: DapDSNavigationMenu["tabMode"]
+  /**  */
+  tagName?: DapDSNavigationMenu["tagName"]
+}
+
+export type DapDSOptionGroupProps = {
+  /** The label of the option group (displayed in native optgroup). */
+  label?: DapDSOptionGroup["label"]
+  /** Whether all options in the group are disabled. */
+  disabled?: DapDSOptionGroup["disabled"]
+  /**  */
+  tagName?: DapDSOptionGroup["tagName"]
+}
+
+export type DapDSOptionItemProps = {
+  /** The selected state of the option item */
+  selected?: DapDSOptionItem["selected"]
+  /** Wheteher the item is selectable, whether it shows the selected icon */
+  selectable?: DapDSOptionItem["selectable"]
+  /** The position of the selected icon */
+  selectedIconPosition?: DapDSOptionItem["selectedIconPosition"]
+  /** The value of the option item */
+  value?: DapDSOptionItem["value"]
+  /** The disabled state of the option item */
+  disabled?: DapDSOptionItem["disabled"]
+  /** The focused state of the option item */
+  focused?: DapDSOptionItem["focused"]
+  /** The label of the option item, it can be a simplier version of an item */
+  label?: DapDSOptionItem["label"]
+  /**  */
+  tagName?: DapDSOptionItem["tagName"]
+  /**  */
+  dependencies?: DapDSOptionItem["dependencies"]
+  /**  */
+  optionText?: DapDSOptionItem["optionText"]
+}
+
+export type DapDSOptionListProps = {
+  /** The filter text of the option list */
+  filterText?: DapDSOptionList["filterText"]
+  /** The value of the option list */
+  value?: DapDSOptionList["value"]
+  /** The focused state of the option list. */
+  focused?: DapDSOptionList["focused"]
+  /** Whether the option list is searchable */
+  search?: DapDSOptionList["search"]
+  /** The search mode of the option list. Default is `none` */
+  searchMode?: DapDSOptionList["searchMode"]
+  /** Whether the option list items are selectable, whether it shows the selected icon */
+  selectable?: DapDSOptionList["selectable"]
+  /** The options as data, instead of `dap-ds-option-item` children. When set, child options are ignored. Also accepted as a JSON attribute. */
+  items?: DapDSOptionList["items"]
+  /** Whether multiple options can be selected; exposed as aria-multiselectable on the listbox. */
+  multiselectable?: DapDSOptionList["multiselectable"]
   /**  */
   tagName?: DapDSOptionList["tagName"]
   /**  */
@@ -2913,13 +2913,6 @@ export type DapDSOptionListProps = {
   buildQueryString?: DapDSOptionList["buildQueryString"]
 }
 
-export type DapDSOverlayProps = {
-  /** The open state of the overlay. */
-  open?: DapDSOverlay["open"]
-  /**  */
-  tagName?: DapDSOverlay["tagName"]
-}
-
 export type DapDSPagerProps = {
   /** Whether the pager is disabled. */
   disabled?: DapDSPager["disabled"]
@@ -2969,6 +2962,13 @@ export type DapDSPagerProps = {
   pageStateText?: DapDSPager["pageStateText"]
 }
 
+export type DapDSOverlayProps = {
+  /** The open state of the overlay. */
+  open?: DapDSOverlay["open"]
+  /**  */
+  tagName?: DapDSOverlay["tagName"]
+}
+
 export type DapDSPasswordInputProps = {
   /** `data-testid` for the show/hide toggle button. */
   toggleButtonTestId?: DapDSPasswordInput["toggleButtonTestId"]
@@ -3053,6 +3053,31 @@ export type DapDSPopupProps = {
   disableViewportAutoClose?: DapDSPopup["disableViewportAutoClose"]
 }
 
+export type DapDSProgressProps = {
+  /** The variant of the progress indicator. */
+  variant?: DapDSProgress["variant"]
+  /** The color variant of the progress indicator. */
+  color?: DapDSProgress["color"]
+  /** Current progress value (0-100 for percentage, or 0-max). */
+  value?: DapDSProgress["value"]
+  /** Maximum value for the progress indicator. */
+  max?: DapDSProgress["max"]
+  /** Whether to show the progress as indeterminate (loading animation). */
+  indeterminate?: DapDSProgress["indeterminate"]
+  /** Whether to show percentage text in the center (circular variant only). */
+  showPercentage?: DapDSProgress["showPercentage"]
+  /** Label text for the progress indicator. */
+  label?: DapDSProgress["label"]
+  /** The aria-live politeness level for screen readers. */
+  "aria-live"?: DapDSProgress["ariaLive"]
+  /**  */
+  tagName?: DapDSProgress["tagName"]
+  /** The size of the progress indicator. Default is `sm`. See SizedMixin. */
+  size?: DapDSProgress["size"]
+  /** Responsive size map (e.g. "md:lg"); see SizedMixin. */
+  sizeMap?: DapDSProgress["sizeMap"]
+}
+
 export type DapDSRadioButtonProps = {
   /** Whether the radio button is focusable. */
   focusable?: DapDSRadioButton["focusable"]
@@ -3116,31 +3141,6 @@ export type DapDSRadioButtonProps = {
   requiredLabel?: DapDSRadioButton["requiredLabel"]
 }
 
-export type DapDSProgressProps = {
-  /** The variant of the progress indicator. */
-  variant?: DapDSProgress["variant"]
-  /** The color variant of the progress indicator. */
-  color?: DapDSProgress["color"]
-  /** Current progress value (0-100 for percentage, or 0-max). */
-  value?: DapDSProgress["value"]
-  /** Maximum value for the progress indicator. */
-  max?: DapDSProgress["max"]
-  /** Whether to show the progress as indeterminate (loading animation). */
-  indeterminate?: DapDSProgress["indeterminate"]
-  /** Whether to show percentage text in the center (circular variant only). */
-  showPercentage?: DapDSProgress["showPercentage"]
-  /** Label text for the progress indicator. */
-  label?: DapDSProgress["label"]
-  /** The aria-live politeness level for screen readers. */
-  "aria-live"?: DapDSProgress["ariaLive"]
-  /**  */
-  tagName?: DapDSProgress["tagName"]
-  /** The size of the progress indicator. Default is `sm`. See SizedMixin. */
-  size?: DapDSProgress["size"]
-  /** Responsive size map (e.g. "md:lg"); see SizedMixin. */
-  sizeMap?: DapDSProgress["sizeMap"]
-}
-
 export type DapDSRatingProps = {
   /** The label of the rating */
   label?: DapDSRating["label"]
@@ -3459,6 +3459,21 @@ export type DapDSSnackbarProps = {
   dependencies?: DapDSSnackbar["dependencies"]
 }
 
+export type DapDSStackProps = {
+  /** The direction of the stack. */
+  direction?: DapDSStack["direction"]
+  /** Adds margin to the end of the stack. */
+  endMargin?: DapDSStack["endMargin"]
+  /** Adds margin to the start of the stack. */
+  startMargin?: DapDSStack["startMargin"]
+  /** Disables wrapping of the stack items onto multiple lines. */
+  nowrap?: DapDSStack["nowrap"]
+  /** The spacing of the stack. Uses the system spacing scale (100, 200, 300...etc) */
+  spacing?: DapDSStack["spacing"]
+  /**  */
+  tagName?: DapDSStack["tagName"]
+}
+
 export type DapDSSpinnerProps = {
   /** The variant of the spinner. */
   variant?: DapDSSpinner["variant"]
@@ -3485,21 +3500,6 @@ Prevents flash for quick operations. */
   sizeMap?: DapDSSpinner["sizeMap"]
 }
 
-export type DapDSStackProps = {
-  /** The direction of the stack. */
-  direction?: DapDSStack["direction"]
-  /** Adds margin to the end of the stack. */
-  endMargin?: DapDSStack["endMargin"]
-  /** Adds margin to the start of the stack. */
-  startMargin?: DapDSStack["startMargin"]
-  /** Disables wrapping of the stack items onto multiple lines. */
-  nowrap?: DapDSStack["nowrap"]
-  /** The spacing of the stack. Uses the system spacing scale (100, 200, 300...etc) */
-  spacing?: DapDSStack["spacing"]
-  /**  */
-  tagName?: DapDSStack["tagName"]
-}
-
 export type DapDSSwitchProps = {
   /** This sets up border around the switch, when true. */
   border?: DapDSSwitch["border"]
@@ -3551,26 +3551,6 @@ export type DapDSSwitchProps = {
   requiredLabel?: DapDSSwitch["requiredLabel"]
 }
 
-export type DapDSTabGroupProps = {
-  /** The selected tab id. */
-  selectedTabId?: DapDSTabGroup["selectedTabId"]
-  /** The size of the tab buttons. Default is `sm`. Can be `sm` or `lg`. */
-  size?: DapDSTabGroup["size"]
-  /** If true, the tab group will be displayed in mobile mode. */
-  mobile?: DapDSTabGroup["mobile"]
-  /**  */
-  tagName?: DapDSTabGroup["tagName"]
-}
-
-export type DapDSTabProps = {
-  /** The tab id. Required */
-  tabId?: DapDSTab["tabId"]
-  /** The disabled state of the tab. */
-  disabled?: DapDSTab["disabled"]
-  /**  */
-  tagName?: DapDSTab["tagName"]
-}
-
 export type DapDSTableCellProps = {
   /** If the cell is the last one. */
   last?: DapDSTableCell["last"]
@@ -3610,66 +3590,25 @@ export type DapDSTableProps = {
   /**  */
   tagName?: DapDSTable["tagName"]
 }
-
-export type DapDSTextareaProps = {
-  /** Hide character counter. */
-  hideCounter?: DapDSTextarea["hideCounter"]
-  /** The minimum length of the textarea. */
-  minlength?: DapDSTextarea["minlength"]
-  /** The maximum length of the textarea. */
-  maxlength?: DapDSTextarea["maxlength"]
-  /** The number of rows in the textarea. */
-  rows?: DapDSTextarea["rows"]
-  /** The number of columns in the textarea. */
-  cols?: DapDSTextarea["cols"]
-  /** The placeholder of the textarea. */
-  placeholder?: DapDSTextarea["placeholder"]
-  /** Indicates how the control should wrap the value for form submission. */
-  wrap?: DapDSTextarea["wrap"]
-  /**  */
-  tagName?: DapDSTextarea["tagName"]
-  /**  */
-  dependencies?: DapDSTextarea["dependencies"]
-  /**  */
-  focusElement?: DapDSTextarea["focusElement"]
-  /**  */
-  feedbackId?: DapDSTextarea["feedbackId"]
-  /** The size of the textarea. Default is `md`. */
-  size?: DapDSTextarea["size"]
-  /** The disabled state of the textarea. */
-  disabled?: DapDSTextarea["disabled"]
-  /** The value of the textarea. */
-  value?: DapDSTextarea["value"]
-  /** The tooltip of the textarea. */
-  tooltip?: DapDSTextarea["tooltip"]
-  /** The tooltip placement of the textarea. */
-  tooltipPlacement?: DapDSTextarea["tooltipPlacement"]
-  /** The status of the textarea. Can be `success` or `error`. */
-  status?: DapDSTextarea["status"]
-  /** The readonly state of the textarea. */
-  readonly?: DapDSTextarea["readonly"]
-  /** The required state of the textarea. */
-  required?: DapDSTextarea["required"]
-  /** The label of the textarea. */
-  label?: DapDSTextarea["label"]
-  /** Visually hides the label while keeping it available to assistive technology. (default: false) */
-  hideLabel?: DapDSTextarea["hideLabel"]
-  /** The description of the textarea. */
-  description?: DapDSTextarea["description"]
-  /** The feedback of the textarea. */
-  feedback?: DapDSTextarea["feedback"]
-  /** The feedback type of the textarea. Can be `negative`, `positive`, or `warning`. */
-  feedbackType?: DapDSTextarea["feedbackType"]
-  /** The optional state of the textarea. */
-  optional?: DapDSTextarea["optional"]
-  /** The optional label of the textarea. */
-  optionalLabel?: DapDSTextarea["optionalLabel"]
-  /** The required indicator of the textarea. (default: '*') */
-  requiredLabel?: DapDSTextarea["requiredLabel"]
-  /** The weight of the label. Default is `false` */
-  subtle?: DapDSTextarea["subtle"]
-  /** The autofocus state of the textarea. */
-  autofocus?: DapDSTextarea["autofocus"]
+
+export type DapDSTabGroupProps = {
+  /** The selected tab id. */
+  selectedTabId?: DapDSTabGroup["selectedTabId"]
+  /** The size of the tab buttons. Default is `sm`. Can be `sm` or `lg`. */
+  size?: DapDSTabGroup["size"]
+  /** If true, the tab group will be displayed in mobile mode. */
+  mobile?: DapDSTabGroup["mobile"]
+  /**  */
+  tagName?: DapDSTabGroup["tagName"]
+}
+
+export type DapDSTabProps = {
+  /** The tab id. Required */
+  tabId?: DapDSTab["tabId"]
+  /** The disabled state of the tab. */
+  disabled?: DapDSTab["disabled"]
+  /**  */
+  tagName?: DapDSTab["tagName"]
 }
 
 export type DapDSTimelineItemProps = {
@@ -3847,23 +3786,6 @@ export type DapDSTOCProps = {
   sizeMap?: DapDSTOC["sizeMap"]
 }
 
-export type DapDSToggleButtonProps = {
-  /** Whether the button is active. */
-  active?: DapDSToggleButton["active"]
-  /** The shape of the button */
-  shape?: DapDSToggleButton["shape"]
-  /**  */
-  sizeChildren?: DapDSToggleButton["sizeChildren"]
-  /**  */
-  tagName?: DapDSToggleButton["tagName"]
-  /**  */
-  focusElement?: DapDSToggleButton["focusElement"]
-  /** The size of the toggle button. Default is `md` */
-  size?: DapDSToggleButton["size"]
-  /** Responsive size map (e.g. "md:lg") */
-  sizeMap?: DapDSToggleButton["sizeMap"]
-}
-
 export type DapDSTooltipProps = {
   /** The content of the tooltip, supporting text only. */
   content?: DapDSTooltip["content"]
@@ -3887,6 +3809,23 @@ export type DapDSTooltipProps = {
   dependencies?: DapDSTooltip["dependencies"]
 }
 
+export type DapDSToggleButtonProps = {
+  /** Whether the button is active. */
+  active?: DapDSToggleButton["active"]
+  /** The shape of the button */
+  shape?: DapDSToggleButton["shape"]
+  /**  */
+  sizeChildren?: DapDSToggleButton["sizeChildren"]
+  /**  */
+  tagName?: DapDSToggleButton["tagName"]
+  /**  */
+  focusElement?: DapDSToggleButton["focusElement"]
+  /** The size of the toggle button. Default is `md` */
+  size?: DapDSToggleButton["size"]
+  /** Responsive size map (e.g. "md:lg") */
+  sizeMap?: DapDSToggleButton["sizeMap"]
+}
+
 export type DapDSTrayProps = {
   /** The placement of the tray. */
   placement?: DapDSTray["placement"]
@@ -3918,6 +3857,67 @@ export type DapDSTrayProps = {
   size?: DapDSTray["size"]
 }
 
+export type DapDSTextareaProps = {
+  /** Hide character counter. */
+  hideCounter?: DapDSTextarea["hideCounter"]
+  /** The minimum length of the textarea. */
+  minlength?: DapDSTextarea["minlength"]
+  /** The maximum length of the textarea. */
+  maxlength?: DapDSTextarea["maxlength"]
+  /** The number of rows in the textarea. */
+  rows?: DapDSTextarea["rows"]
+  /** The number of columns in the textarea. */
+  cols?: DapDSTextarea["cols"]
+  /** The placeholder of the textarea. */
+  placeholder?: DapDSTextarea["placeholder"]
+  /** Indicates how the control should wrap the value for form submission. */
+  wrap?: DapDSTextarea["wrap"]
+  /**  */
+  tagName?: DapDSTextarea["tagName"]
+  /**  */
+  dependencies?: DapDSTextarea["dependencies"]
+  /**  */
+  focusElement?: DapDSTextarea["focusElement"]
+  /**  */
+  feedbackId?: DapDSTextarea["feedbackId"]
+  /** The size of the textarea. Default is `md`. */
+  size?: DapDSTextarea["size"]
+  /** The disabled state of the textarea. */
+  disabled?: DapDSTextarea["disabled"]
+  /** The value of the textarea. */
+  value?: DapDSTextarea["value"]
+  /** The tooltip of the textarea. */
+  tooltip?: DapDSTextarea["tooltip"]
+  /** The tooltip placement of the textarea. */
+  tooltipPlacement?: DapDSTextarea["tooltipPlacement"]
+  /** The status of the textarea. Can be `success` or `error`. */
+  status?: DapDSTextarea["status"]
+  /** The readonly state of the textarea. */
+  readonly?: DapDSTextarea["readonly"]
+  /** The required state of the textarea. */
+  required?: DapDSTextarea["required"]
+  /** The label of the textarea. */
+  label?: DapDSTextarea["label"]
+  /** Visually hides the label while keeping it available to assistive technology. (default: false) */
+  hideLabel?: DapDSTextarea["hideLabel"]
+  /** The description of the textarea. */
+  description?: DapDSTextarea["description"]
+  /** The feedback of the textarea. */
+  feedback?: DapDSTextarea["feedback"]
+  /** The feedback type of the textarea. Can be `negative`, `positive`, or `warning`. */
+  feedbackType?: DapDSTextarea["feedbackType"]
+  /** The optional state of the textarea. */
+  optional?: DapDSTextarea["optional"]
+  /** The optional label of the textarea. */
+  optionalLabel?: DapDSTextarea["optionalLabel"]
+  /** The required indicator of the textarea. (default: '*') */
+  requiredLabel?: DapDSTextarea["requiredLabel"]
+  /** The weight of the label. Default is `false` */
+  subtle?: DapDSTextarea["subtle"]
+  /** The autofocus state of the textarea. */
+  autofocus?: DapDSTextarea["autofocus"]
+}
+
 export type DapDSTypographyProps = {
   /** The variant of the typography. */
   variant?: DapDSTypography["variant"]
@@ -4083,19 +4083,6 @@ export type ArrowsArrowDownSLineProps = {
   tagName?: ArrowsArrowDownSLine["tagName"]
 }
 
-export type ArrowsArrowLeftDownLineProps = {
-  /** (optional) The width and height in pixels */
-  size?: ArrowsArrowLeftDownLine["size"]
-  /** (optional) Sets the icon color via the `fill` attribute */
-  selected?: ArrowsArrowLeftDownLine["selected"]
-  /** (optional) When using the icon standalone, make it meaningful for accessibility */
-  accessibilityTitle?: ArrowsArrowLeftDownLine["accessibilityTitle"]
-  /** (optional) If `true` the icon can receive focus */
-  focusable?: ArrowsArrowLeftDownLine["focusable"]
-  /**  */
-  tagName?: ArrowsArrowLeftDownLine["tagName"]
-}
-
 export type ArrowsArrowLeftLLineProps = {
   /** (optional) The width and height in pixels */
   size?: ArrowsArrowLeftLLine["size"]
@@ -4122,6 +4109,19 @@ export type ArrowsArrowLeftLineProps = {
   tagName?: ArrowsArrowLeftLine["tagName"]
 }
 
+export type ArrowsArrowLeftDownLineProps = {
+  /** (optional) The width and height in pixels */
+  size?: ArrowsArrowLeftDownLine["size"]
+  /** (optional) Sets the icon color via the `fill` attribute */
+  selected?: ArrowsArrowLeftDownLine["selected"]
+  /** (optional) When using the icon standalone, make it meaningful for accessibility */
+  accessibilityTitle?: ArrowsArrowLeftDownLine["accessibilityTitle"]
+  /** (optional) If `true` the icon can receive focus */
+  focusable?: ArrowsArrowLeftDownLine["focusable"]
+  /**  */
+  tagName?: ArrowsArrowLeftDownLine["tagName"]
+}
+
 export type ArrowsArrowLeftSFillProps = {
   /** (optional) The width and height in pixels */
   size?: ArrowsArrowLeftSFill["size"]
@@ -4291,6 +4291,19 @@ export type ArrowsExpandUpDownFillProps = {
   tagName?: ArrowsExpandUpDownFill["tagName"]
 }
 
+export type BuildingsHome6LineProps = {
+  /** (optional) The width and height in pixels */
+  size?: BuildingsHome6Line["size"]
+  /** (optional) Sets the icon color via the `fill` attribute */
+  selected?: BuildingsHome6Line["selected"]
+  /** (optional) When using the icon standalone, make it meaningful for accessibility */
+  accessibilityTitle?: BuildingsHome6Line["accessibilityTitle"]
+  /** (optional) If `true` the icon can receive focus */
+  focusable?: BuildingsHome6Line["focusable"]
+  /**  */
+  tagName?: BuildingsHome6Line["tagName"]
+}
+
 export type BusinessCalendarLineProps = {
   /** (optional) The width and height in pixels */
   size?: BusinessCalendarLine["size"]
@@ -4330,19 +4343,6 @@ export type DesignToolsLineProps = {
   tagName?: DesignToolsLine["tagName"]
 }
 
-export type BuildingsHome6LineProps = {
-  /** (optional) The width and height in pixels */
-  size?: BuildingsHome6Line["size"]
-  /** (optional) Sets the icon color via the `fill` attribute */
-  selected?: BuildingsHome6Line["selected"]
-  /** (optional) When using the icon standalone, make it meaningful for accessibility */
-  accessibilityTitle?: BuildingsHome6Line["accessibilityTitle"]
-  /** (optional) If `true` the icon can receive focus */
-  focusable?: BuildingsHome6Line["focusable"]
-  /**  */
-  tagName?: BuildingsHome6Line["tagName"]
-}
-
 export type DeviceComputerLineProps = {
   /** (optional) The width and height in pixels */
   size?: DeviceComputerLine["size"]
@@ -4603,30 +4603,30 @@ export type SystemAlertLineProps = {
   tagName?: SystemAlertLine["tagName"]
 }
 
-export type SystemCheckLineProps = {
+export type SystemCheckLine2Props = {
   /** (optional) The width and height in pixels */
-  size?: SystemCheckLine["size"]
+  size?: SystemCheckLine2["size"]
   /** (optional) Sets the icon color via the `fill` attribute */
-  selected?: SystemCheckLine["selected"]
+  selected?: SystemCheckLine2["selected"]
   /** (optional) When using the icon standalone, make it meaningful for accessibility */
-  accessibilityTitle?: SystemCheckLine["accessibilityTitle"]
+  accessibilityTitle?: SystemCheckLine2["accessibilityTitle"]
   /** (optional) If `true` the icon can receive focus */
-  focusable?: SystemCheckLine["focusable"]
+  focusable?: SystemCheckLine2["focusable"]
   /**  */
-  tagName?: SystemCheckLine["tagName"]
+  tagName?: SystemCheckLine2["tagName"]
 }
 
-export type SystemCheckLine2Props = {
+export type SystemCheckLineProps = {
   /** (optional) The width and height in pixels */
-  size?: SystemCheckLine2["size"]
+  size?: SystemCheckLine["size"]
   /** (optional) Sets the icon color via the `fill` attribute */
-  selected?: SystemCheckLine2["selected"]
+  selected?: SystemCheckLine["selected"]
   /** (optional) When using the icon standalone, make it meaningful for accessibility */
-  accessibilityTitle?: SystemCheckLine2["accessibilityTitle"]
+  accessibilityTitle?: SystemCheckLine["accessibilityTitle"]
   /** (optional) If `true` the icon can receive focus */
-  focusable?: SystemCheckLine2["focusable"]
+  focusable?: SystemCheckLine["focusable"]
   /**  */
-  tagName?: SystemCheckLine2["tagName"]
+  tagName?: SystemCheckLine["tagName"]
 }
 
 export type SystemCheckboxBlankCircleFillProps = {
@@ -4668,30 +4668,30 @@ export type SystemCheckboxBlankCircleLineProps = {
   tagName?: SystemCheckboxBlankCircleLine["tagName"]
 }
 
-export type SystemCheckboxCircleFillProps = {
+export type SystemCheckboxCircleLineProps = {
   /** (optional) The width and height in pixels */
-  size?: SystemCheckboxCircleFill["size"]
+  size?: SystemCheckboxCircleLine["size"]
   /** (optional) Sets the icon color via the `fill` attribute */
-  selected?: SystemCheckboxCircleFill["selected"]
+  selected?: SystemCheckboxCircleLine["selected"]
   /** (optional) When using the icon standalone, make it meaningful for accessibility */
-  accessibilityTitle?: SystemCheckboxCircleFill["accessibilityTitle"]
+  accessibilityTitle?: SystemCheckboxCircleLine["accessibilityTitle"]
   /** (optional) If `true` the icon can receive focus */
-  focusable?: SystemCheckboxCircleFill["focusable"]
+  focusable?: SystemCheckboxCircleLine["focusable"]
   /**  */
-  tagName?: SystemCheckboxCircleFill["tagName"]
+  tagName?: SystemCheckboxCircleLine["tagName"]
 }
 
-export type SystemCheckboxCircleLineProps = {
+export type SystemCheckboxCircleFillProps = {
   /** (optional) The width and height in pixels */
-  size?: SystemCheckboxCircleLine["size"]
+  size?: SystemCheckboxCircleFill["size"]
   /** (optional) Sets the icon color via the `fill` attribute */
-  selected?: SystemCheckboxCircleLine["selected"]
+  selected?: SystemCheckboxCircleFill["selected"]
   /** (optional) When using the icon standalone, make it meaningful for accessibility */
-  accessibilityTitle?: SystemCheckboxCircleLine["accessibilityTitle"]
+  accessibilityTitle?: SystemCheckboxCircleFill["accessibilityTitle"]
   /** (optional) If `true` the icon can receive focus */
-  focusable?: SystemCheckboxCircleLine["focusable"]
+  focusable?: SystemCheckboxCircleFill["focusable"]
   /**  */
-  tagName?: SystemCheckboxCircleLine["tagName"]
+  tagName?: SystemCheckboxCircleFill["tagName"]
 }
 
 export type SystemCloseCircleFillProps = {
@@ -4928,30 +4928,30 @@ export type SystemLoadingSpinnerProps = {
   tagName?: SystemLoadingSpinner["tagName"]
 }
 
-export type SystemLockLineProps = {
+export type SystemLockFillProps = {
   /** (optional) The width and height in pixels */
-  size?: SystemLockLine["size"]
+  size?: SystemLockFill["size"]
   /** (optional) Sets the icon color via the `fill` attribute */
-  selected?: SystemLockLine["selected"]
+  selected?: SystemLockFill["selected"]
   /** (optional) When using the icon standalone, make it meaningful for accessibility */
-  accessibilityTitle?: SystemLockLine["accessibilityTitle"]
+  accessibilityTitle?: SystemLockFill["accessibilityTitle"]
   /** (optional) If `true` the icon can receive focus */
-  focusable?: SystemLockLine["focusable"]
+  focusable?: SystemLockFill["focusable"]
   /**  */
-  tagName?: SystemLockLine["tagName"]
+  tagName?: SystemLockFill["tagName"]
 }
 
-export type SystemLockFillProps = {
+export type SystemLockLineProps = {
   /** (optional) The width and height in pixels */
-  size?: SystemLockFill["size"]
+  size?: SystemLockLine["size"]
   /** (optional) Sets the icon color via the `fill` attribute */
-  selected?: SystemLockFill["selected"]
+  selected?: SystemLockLine["selected"]
   /** (optional) When using the icon standalone, make it meaningful for accessibility */
-  accessibilityTitle?: SystemLockFill["accessibilityTitle"]
+  accessibilityTitle?: SystemLockLine["accessibilityTitle"]
   /** (optional) If `true` the icon can receive focus */
-  focusable?: SystemLockFill["focusable"]
+  focusable?: SystemLockLine["focusable"]
   /**  */
-  tagName?: SystemLockFill["tagName"]
+  tagName?: SystemLockLine["tagName"]
 }
 
 export type SystemMenuLineProps = {
@@ -5219,30 +5219,26 @@ declare module 'vue' {
      */
          'dap-ds-accordion': DefineCustomElement<DapDSAccordion, DapDSAccordionProps, DapDSAccordionEvents>
     /**
-     * Anchor heading is a heading with an anchor link.
+     * An accordion group is a collection of accordion components.
+     *
+     * ### Slots:
+     * - **default** - The content of the accordion group.
      *
      * ### CSS Parts:
-     * - **base** - The main anchor heading container.
-     * - **link** - The link of the anchor heading. dap-ds-link element.
-     * - **link-base** - The base of the link part.
-     * - **text** - The text of the anchor heading.
-     * - **link-text** - Alias of the text part.
+     * - **base** - The main accordion group container.
      */
-         'dap-ds-anchor-heading': DefineCustomElement<DapDSAnchorHeading, DapDSAnchorHeadingProps, {}>
+         'dap-ds-accordion-group': DefineCustomElement<DapDSAccordionGroup, DapDSAccordionGroupProps, {}>
     /**
-     * A badge is a small status descriptor for UI elements.
-     *
-     * ### Slots:
-     * - **default** - The content of the badge.
-     * - **icon** - The icon of the badge.
+     * Anchor heading is a heading with an anchor link.
      *
      * ### CSS Parts:
-     * - **base** - The main container of the badge.
-     * - **icon** - The icon of the badge.
-     * - **content** - The content of the badge.
-     * - **icon-base** - The base of the icon.
+     * - **base** - The main anchor heading container.
+     * - **link** - The link of the anchor heading. dap-ds-link element.
+     * - **link-base** - The base of the link part.
+     * - **text** - The text of the anchor heading.
+     * - **link-text** - Alias of the text part.
      */
-         'dap-ds-badge': DefineCustomElement<DapDSBadge, DapDSBadgeProps, {}>
+         'dap-ds-anchor-heading': DefineCustomElement<DapDSAnchorHeading, DapDSAnchorHeadingProps, {}>
     /**
      * Avatar component can be used to display user profile images, initials, or icons.
      *
@@ -5263,16 +5259,6 @@ declare module 'vue' {
      * - **loading** - The loading indicator.
      */
          'dap-ds-avatar': DefineCustomElement<DapDSAvatar, DapDSAvatarProps, DapDSAvatarEvents>
-    /**
-     * An accordion group is a collection of accordion components.
-     *
-     * ### Slots:
-     * - **default** - The content of the accordion group.
-     *
-     * ### CSS Parts:
-     * - **base** - The main accordion group container.
-     */
-         'dap-ds-accordion-group': DefineCustomElement<DapDSAccordionGroup, DapDSAccordionGroupProps, {}>
     /**
      * A banner is a message displayed at the top of the page to provide important information to the user.
      *
@@ -5310,20 +5296,19 @@ declare module 'vue' {
      */
          'dap-ds-breadcrumb': DefineCustomElement<DapDSBreadcrumb, DapDSBreadcrumbProps, {}>
     /**
-     * Avatar group component displays multiple avatars in an organized layout with overflow management.
-     *
-     * ### Events:
-     * - **dds-overflow-click** - Fired when the overflow indicator is clicked.
+     * A badge is a small status descriptor for UI elements.
      *
      * ### Slots:
-     * - **default** - The avatars to display in the group.
+     * - **default** - The content of the badge.
+     * - **icon** - The icon of the badge.
      *
      * ### CSS Parts:
-     * - **base** - The main container of the avatar group.
-     * - **avatars** - The container for the visible avatars.
-     * - **overflow** - The overflow indicator element.
+     * - **base** - The main container of the badge.
+     * - **icon** - The icon of the badge.
+     * - **content** - The content of the badge.
+     * - **icon-base** - The base of the icon.
      */
-         'dap-ds-avatar-group': DefineCustomElement<DapDSAvatarGroup, DapDSAvatarGroupProps, DapDSAvatarGroupEvents>
+         'dap-ds-badge': DefineCustomElement<DapDSBadge, DapDSBadgeProps, {}>
     /**
      * A breadcrumb item is a secondary navigation scheme that reveals the user's location in a website or Web application.
      *
@@ -5354,6 +5339,42 @@ declare module 'vue' {
      * - **content** - The content wrapper inside the button.
      */
          'dap-ds-button': DefineCustomElement<DapDSButton, DapDSButtonProps, DapDSButtonEvents>
+    /**
+     * Avatar group component displays multiple avatars in an organized layout with overflow management.
+     *
+     * ### Events:
+     * - **dds-overflow-click** - Fired when the overflow indicator is clicked.
+     *
+     * ### Slots:
+     * - **default** - The avatars to display in the group.
+     *
+     * ### CSS Parts:
+     * - **base** - The main container of the avatar group.
+     * - **avatars** - The container for the visible avatars.
+     * - **overflow** - The overflow indicator element.
+     */
+         'dap-ds-avatar-group': DefineCustomElement<DapDSAvatarGroup, DapDSAvatarGroupProps, DapDSAvatarGroupEvents>
+    /**
+     * A visual divider between items in a button group.
+     */
+         'dap-ds-button-group-separator': DefineCustomElement<DapDSButtonGroupSeparator, DapDSButtonGroupSeparatorProps, {}>
+    /**
+     * Non-interactive text displayed inside a button group.
+     *
+     * ### Slots:
+     * - **default** - The text content. Can also hold an icon or a `<label>` for a grouped input.
+     *
+     * ### CSS Parts:
+     * - **base** - The text container.
+     */
+         'dap-ds-button-group-text': DefineCustomElement<DapDSButtonGroupText, DapDSButtonGroupTextProps, {}>
+    /**
+     * A container that groups related buttons with consistent, connected styling.
+     *
+     * ### Slots:
+     * - **default** - The grouped items: `dap-ds-button`, `dap-ds-icon-button`, `dap-ds-button-group-text`, `dap-ds-button-group-separator` or nested `dap-ds-button-group` elements.
+     */
+         'dap-ds-button-group': DefineCustomElement<DapDSButtonGroup, DapDSButtonGroupProps, {}>
     /**
      * Calendar cell represents a single cell in the calendar.
      *
@@ -5390,27 +5411,6 @@ declare module 'vue' {
      * - **calendar-grid-cell-today-mark** - The today mark of the calendar grid cell.
      */
          'dap-ds-calendar': DefineCustomElement<DapDSCalendar, DapDSCalendarProps, DapDSCalendarEvents>
-    /**
-     * A visual divider between items in a button group.
-     */
-         'dap-ds-button-group-separator': DefineCustomElement<DapDSButtonGroupSeparator, DapDSButtonGroupSeparatorProps, {}>
-    /**
-     * Non-interactive text displayed inside a button group.
-     *
-     * ### Slots:
-     * - **default** - The text content. Can also hold an icon or a `<label>` for a grouped input.
-     *
-     * ### CSS Parts:
-     * - **base** - The text container.
-     */
-         'dap-ds-button-group-text': DefineCustomElement<DapDSButtonGroupText, DapDSButtonGroupTextProps, {}>
-    /**
-     * A container that groups related buttons with consistent, connected styling.
-     *
-     * ### Slots:
-     * - **default** - The grouped items: `dap-ds-button`, `dap-ds-icon-button`, `dap-ds-button-group-text`, `dap-ds-button-group-separator` or nested `dap-ds-button-group` elements.
-     */
-         'dap-ds-button-group': DefineCustomElement<DapDSButtonGroup, DapDSButtonGroupProps, {}>
     /**
      * 
      *
@@ -5652,29 +5652,6 @@ declare module 'vue' {
      * - **arrow** - The arrow of the popup.
      */
          'dap-ds-command': DefineCustomElement<DapDSCommand, DapDSCommandProps, DapDSCommandEvents>
-    /**
-     * Segmented control item component for the segmented control.
-     *
-     * ### Slots:
-     * - **iconcontent** - The icon content of the segmented control item.
-     *
-     * ### CSS Parts:
-     * - **input** - The input of the segmented control item.
-     */
-         'dap-ds-content-switcher-item': DefineCustomElement<DapDSContentSwitcherItem, DapDSContentSwitcherItemProps, {}>
-    /**
-     * A content switcher is a set of two or more segments, each of which functions as a mutually exclusive button.
-     *
-     * ### Events:
-     * - **dds-change** - Fired when the content switcher is changed.
-     *
-     * ### Slots:
-     * - **default** - The content switcher items.
-     *
-     * ### CSS Parts:
-     * - **base** - The main content switcher container.
-     */
-         'dap-ds-content-switcher': DefineCustomElement<DapDSContentSwitcher, DapDSContentSwitcherProps, DapDSContentSwitcherEvents>
     /**
      * A copybox input is a field for copying an input value.
      *
@@ -5708,6 +5685,29 @@ declare module 'vue' {
      * - **label-optional** - The optional indicator of the label.
      */
          'dap-ds-copybox-input': DefineCustomElement<DapDSCopyBoxInput, DapDSCopyBoxInputProps, DapDSCopyBoxInputEvents>
+    /**
+     * Segmented control item component for the segmented control.
+     *
+     * ### Slots:
+     * - **iconcontent** - The icon content of the segmented control item.
+     *
+     * ### CSS Parts:
+     * - **input** - The input of the segmented control item.
+     */
+         'dap-ds-content-switcher-item': DefineCustomElement<DapDSContentSwitcherItem, DapDSContentSwitcherItemProps, {}>
+    /**
+     * A content switcher is a set of two or more segments, each of which functions as a mutually exclusive button.
+     *
+     * ### Events:
+     * - **dds-change** - Fired when the content switcher is changed.
+     *
+     * ### Slots:
+     * - **default** - The content switcher items.
+     *
+     * ### CSS Parts:
+     * - **base** - The main content switcher container.
+     */
+         'dap-ds-content-switcher': DefineCustomElement<DapDSContentSwitcher, DapDSContentSwitcherProps, DapDSContentSwitcherEvents>
     /**
      * A DÁP badge is a brand element showing the use of this system design library.
      *
@@ -6056,54 +6056,6 @@ declare module 'vue' {
      * - **closebutton** - The close button of the modal.
      */
          'dap-ds-modal': DefineCustomElement<DapDSModal, DapDSModalProps, DapDSModalEvents>
-    /**
-     * A navigation menu item that can contain either a simple link or dropdown content.
-Supports nested items with cascading flyout behavior. Part of the navigation menu system.
-This is for NAVIGATION (website menus), not application menus.
-     *
-     * ### Events:
-     * - **dds-navigation-item-click** - Fired when a navigation item is clicked.
-     * - **dds-navigation-dropdown-open** - Fired when a navigation dropdown is opened.
-     *
-     * ### Slots:
-     * - **trigger** - The trigger element (link, button, etc.) for this navigation item.
-     * - **title** - The title of the navigation item.
-     * - **indicator** - The expand indicator icon (defaults to arrow icon based on orientation and level).
-     * - **link** - A router link element (e.g. Next.js Link) used for SPA navigation. Rendered outside the popup so it is always accessible to programmatic clicks.
-     * - **default** - The dropdown content (can contain nested dap-ds-navigation-menu-item elements).
-     *
-     * ### CSS Parts:
-     * - **base** - The base part of the navigation item.
-     * - **trigger** - The trigger element part.
-     * - **trigger-base** - The base part of the trigger button (from dap-ds-button).
-     * - **trigger-content** - The content part of the trigger button (from dap-ds-button).
-     * - **trigger-high-contrast** - The high contrast part of the trigger button (from dap-ds-button).
-     * - **trigger-stack-base** - The base part of the trigger stack (from dap-ds-stack).
-     * - **title** - The title slot wrapper.
-     * - **indicator** - The expand indicator container.
-     * - **indicator-icon** - The expand indicator icon part.
-     * - **indicator-icon-base** - The base part of the indicator icon (from dap-ds-icon).
-     * - **indicator-icon-icon** - The icon part of the indicator icon (from dap-ds-icon).
-     * - **popup** - The dropdown popup container.
-     * - **content** - The dropdown content wrapper (default slot).
-     * - **arrow** - The dropdown arrow part.
-     */
-         'dap-ds-navigation-menu-item': DefineCustomElement<DapDSNavigationMenuItem, DapDSNavigationMenuItemProps, DapDSNavigationMenuItemEvents>
-    /**
-     * A navigation menu for website/application navigation. Supports nested dropdowns with unlimited depth.
-This is a NAVIGATION component, not an application menu (like dropdowns or context menus).
-Uses semantic HTML (`<nav>`) and proper navigation ARIA attributes.
-     *
-     * ### Events:
-     * - **dds-navigation-item-click** - Fired when a navigation item is clicked.
-     *
-     * ### Slots:
-     * - **default** - The navigation menu list and items.
-     *
-     * ### CSS Parts:
-     * - **base** - The main navigation menu container (nav element).
-     */
-         'dap-ds-navigation-menu': DefineCustomElement<DapDSNavigationMenu, DapDSNavigationMenuProps, DapDSNavigationMenuEvents>
     /**
      * A notification badge component is a user interface element that visually indicates the presence of new information or updates, often displaying a numeric count of unread notifications, messages, or items requiring attention.
      *
@@ -6181,6 +6133,54 @@ Uses semantic HTML (`<nav>`) and proper navigation ARIA attributes.
      * - **heading-text** - The text of the heading.
      */
          'dap-ds-official-website-banner': DefineCustomElement<DapDSOfficialWebsiteBanner, DapDSOfficialWebsiteBannerProps, DapDSOfficialWebsiteBannerEvents>
+    /**
+     * A navigation menu item that can contain either a simple link or dropdown content.
+Supports nested items with cascading flyout behavior. Part of the navigation menu system.
+This is for NAVIGATION (website menus), not application menus.
+     *
+     * ### Events:
+     * - **dds-navigation-item-click** - Fired when a navigation item is clicked.
+     * - **dds-navigation-dropdown-open** - Fired when a navigation dropdown is opened.
+     *
+     * ### Slots:
+     * - **trigger** - The trigger element (link, button, etc.) for this navigation item.
+     * - **title** - The title of the navigation item.
+     * - **indicator** - The expand indicator icon (defaults to arrow icon based on orientation and level).
+     * - **link** - A router link element (e.g. Next.js Link) used for SPA navigation. Rendered outside the popup so it is always accessible to programmatic clicks.
+     * - **default** - The dropdown content (can contain nested dap-ds-navigation-menu-item elements).
+     *
+     * ### CSS Parts:
+     * - **base** - The base part of the navigation item.
+     * - **trigger** - The trigger element part.
+     * - **trigger-base** - The base part of the trigger button (from dap-ds-button).
+     * - **trigger-content** - The content part of the trigger button (from dap-ds-button).
+     * - **trigger-high-contrast** - The high contrast part of the trigger button (from dap-ds-button).
+     * - **trigger-stack-base** - The base part of the trigger stack (from dap-ds-stack).
+     * - **title** - The title slot wrapper.
+     * - **indicator** - The expand indicator container.
+     * - **indicator-icon** - The expand indicator icon part.
+     * - **indicator-icon-base** - The base part of the indicator icon (from dap-ds-icon).
+     * - **indicator-icon-icon** - The icon part of the indicator icon (from dap-ds-icon).
+     * - **popup** - The dropdown popup container.
+     * - **content** - The dropdown content wrapper (default slot).
+     * - **arrow** - The dropdown arrow part.
+     */
+         'dap-ds-navigation-menu-item': DefineCustomElement<DapDSNavigationMenuItem, DapDSNavigationMenuItemProps, DapDSNavigationMenuItemEvents>
+    /**
+     * A navigation menu for website/application navigation. Supports nested dropdowns with unlimited depth.
+This is a NAVIGATION component, not an application menu (like dropdowns or context menus).
+Uses semantic HTML (`<nav>`) and proper navigation ARIA attributes.
+     *
+     * ### Events:
+     * - **dds-navigation-item-click** - Fired when a navigation item is clicked.
+     *
+     * ### Slots:
+     * - **default** - The navigation menu list and items.
+     *
+     * ### CSS Parts:
+     * - **base** - The main navigation menu container (nav element).
+     */
+         'dap-ds-navigation-menu': DefineCustomElement<DapDSNavigationMenu, DapDSNavigationMenuProps, DapDSNavigationMenuEvents>
     /**
      * An option group is a container for grouping related option items.
 Used with dap-ds-select to create grouped options that render as native optgroup elements.
@@ -6227,26 +6227,10 @@ Used with dap-ds-select to create grouped options that render as native optgroup
      * - **popup-base** - The base of the popup.
      * - **option-item-base** - The base of the option item.
      * - **option-item-label** - The label of the option item.
-     * - **option-item-prefix** - The prefix of the option item.
-     * - **option-item-suffix** - The suffix of the option item.
-     */
-         'dap-ds-option-list': DefineCustomElement<DapDSOptionList, DapDSOptionListProps, DapDSOptionListEvents>
-    /**
-     * An overlay is a container for overlay content.
-     *
-     * ### Events:
-     * - **dds-before-open** - Fires before the overlay opens.
-     * - **dds-opened** - Fires after the overlay opens.
-     * - **dds-before-close** - Fires before the overlay closes.
-     * - **dds-closed** - Fires after the overlay closes.
-     *
-     * ### Slots:
-     * - **default** - The content of the overlay.
-     *
-     * ### CSS Parts:
-     * - **base** - The overlay element
+     * - **option-item-prefix** - The prefix of the option item.
+     * - **option-item-suffix** - The suffix of the option item.
      */
-         'dap-ds-overlay': DefineCustomElement<DapDSOverlay, DapDSOverlayProps, DapDSOverlayEvents>
+         'dap-ds-option-list': DefineCustomElement<DapDSOptionList, DapDSOptionListProps, DapDSOptionListEvents>
     /**
      * A pager is a component that displays pagination controls.
      *
@@ -6278,6 +6262,22 @@ Used with dap-ds-select to create grouped options that render as native optgroup
      * - **page-info** - The page info / total count text.
      */
          'dap-ds-pager': DefineCustomElement<DapDSPager, DapDSPagerProps, DapDSPagerEvents>
+    /**
+     * An overlay is a container for overlay content.
+     *
+     * ### Events:
+     * - **dds-before-open** - Fires before the overlay opens.
+     * - **dds-opened** - Fires after the overlay opens.
+     * - **dds-before-close** - Fires before the overlay closes.
+     * - **dds-closed** - Fires after the overlay closes.
+     *
+     * ### Slots:
+     * - **default** - The content of the overlay.
+     *
+     * ### CSS Parts:
+     * - **base** - The overlay element
+     */
+         'dap-ds-overlay': DefineCustomElement<DapDSOverlay, DapDSOverlayProps, DapDSOverlayEvents>
     /**
      * A password input a field for entering a password.
      *
@@ -6328,6 +6328,21 @@ Used with dap-ds-select to create grouped options that render as native optgroup
      * - **arrow** - The arrow of the popup.
      */
          'dap-ds-popup': DefineCustomElement<DapDSPopup, DapDSPopupProps, DapDSPopupEvents>
+    /**
+     * Progress indicator component with linear and circular variants.
+     *
+     * ### Slots:
+     * - **label** - Custom label content for the progress indicator.
+     *
+     * ### CSS Parts:
+     * - **base** - The main progress container.
+     * - **track** - The progress track (background).
+     * - **fill** - The progress fill (bar for linear, circle for circular).
+     * - **label** - The progress label text.
+     * - **percentage** - The percentage text (circular variant only).
+     * - **background** - The background circle (circular variant only).
+     */
+         'dap-ds-progress': DefineCustomElement<DapDSProgress, DapDSProgressProps, {}>
     /**
      * A radio button is a graphical control element that allows the user to choose only one of a predefined set of mutually exclusive options.
      *
@@ -6353,21 +6368,6 @@ Used with dap-ds-select to create grouped options that render as native optgroup
      * - **label-optional** - The optional indicator of the label.
      */
          'dap-ds-radio-button': DefineCustomElement<DapDSRadioButton, DapDSRadioButtonProps, DapDSRadioButtonEvents>
-    /**
-     * Progress indicator component with linear and circular variants.
-     *
-     * ### Slots:
-     * - **label** - Custom label content for the progress indicator.
-     *
-     * ### CSS Parts:
-     * - **base** - The main progress container.
-     * - **track** - The progress track (background).
-     * - **fill** - The progress fill (bar for linear, circle for circular).
-     * - **label** - The progress label text.
-     * - **percentage** - The percentage text (circular variant only).
-     * - **background** - The background circle (circular variant only).
-     */
-         'dap-ds-progress': DefineCustomElement<DapDSProgress, DapDSProgressProps, {}>
     /**
      * Rating is a component that allows users to rate a product or service.
      *
@@ -6567,6 +6567,17 @@ Used with dap-ds-select to create grouped options that render as native optgroup
      * - **message-actions** - The actions part of the message
      */
          'dap-ds-snackbar': DefineCustomElement<DapDSSnackbar, DapDSSnackbarProps, {}>
+    /**
+     * A stack is a container for stacked content.
+     *
+     * ### Slots:
+     * - **default** - The content of the stack.
+     *
+     * ### CSS Parts:
+     * - **stack** - Alias of the base part.
+     * - **base** - The main stack container.
+     */
+         'dap-ds-stack': DefineCustomElement<DapDSStack, DapDSStackProps, {}>
     /**
      * Loading spinner component.
      *
@@ -6582,17 +6593,6 @@ Used with dap-ds-select to create grouped options that render as native optgroup
      * - **text** - The loading text element.
      */
          'dap-ds-spinner': DefineCustomElement<DapDSSpinner, DapDSSpinnerProps, {}>
-    /**
-     * A stack is a container for stacked content.
-     *
-     * ### Slots:
-     * - **default** - The content of the stack.
-     *
-     * ### CSS Parts:
-     * - **stack** - Alias of the base part.
-     * - **base** - The main stack container.
-     */
-         'dap-ds-stack': DefineCustomElement<DapDSStack, DapDSStackProps, {}>
     /**
      * A switch is a graphical control element that allows the user to toggle between two states.
      *
@@ -6617,34 +6617,6 @@ Used with dap-ds-select to create grouped options that render as native optgroup
      * - **label-optional** - The optional indicator of the label.
      */
          'dap-ds-switch': DefineCustomElement<DapDSSwitch, DapDSSwitchProps, DapDSSwitchEvents>
-    /**
-     * A tab group component. It is used with dap-ds-tab component to create a tab group.
-     *
-     * ### Events:
-     * - **dds-tab-select** - Fired when select a new tab.
-     *
-     * ### Slots:
-     * - **default** - The tab items.
-     *
-     * ### CSS Parts:
-     * - **base** - The main container.
-     * - **tab-list** - The tab list container (role="tablist") holding the tab buttons.
-     * - **tab-nav** - The individual tab buttons.
-     * - **high-contrast** - The high contrast indicator inside the tab buttons.
-     * - **tab-group-content** - The tab content container.
-     */
-         'dap-ds-tab-group': DefineCustomElement<DapDSTabGroup, DapDSTabGroupProps, DapDSTabGroupEvents>
-    /**
-     * A tab item component. It is used in dap-ds-tab-group component slot to create a tab item.
-     *
-     * ### Slots:
-     * - **default** - The tab title template.
-     * - **content** - The tab content.
-     *
-     * ### CSS Parts:
-     * - **base** - The main tab content container.
-     */
-         'dap-ds-tab': DefineCustomElement<DapDSTab, DapDSTabProps, {}>
     /**
      * 
      *
@@ -6680,33 +6652,33 @@ Used with dap-ds-select to create grouped options that render as native optgroup
      */
          'dap-ds-table': DefineCustomElement<DapDSTable, DapDSTableProps, {}>
     /**
-     * A textarea is a multi-line text input field.
+     * A tab group component. It is used with dap-ds-tab component to create a tab group.
      *
      * ### Events:
-     * - **dds-count-change** - Fires when the count of the textarea changes.
-     * - **dds-change** - Fired when the textarea value changes.
-     * - **dds-input** - Fired when the textarea value changes.
-     * - **dds-keydown** - Fired when a key is pressed down.
-     * - **dds-blur** - Fired when the textarea loses focus.
-     * - **dds-focus** - Emitted when the textarea gains focus.
-     * - **dds-select** - Emitted when select text in textarea.
+     * - **dds-tab-select** - Fired when select a new tab.
      *
      * ### Slots:
-     * - **feedback-icon** - The custom icon of the feedback.
+     * - **default** - The tab items.
      *
      * ### CSS Parts:
-     * - **base** - The main textarea container.
-     * - **input** - The native input of the textarea.
-     * - **counter** - The counter of the textarea.
-     * - **counter-base** - The base of the counter.
-     * - **feedback** - The feedback of the textarea.
-     * - **feedback-base** - The base of the feedback.
-     * - **feedback-text** - The text of the feedback.
-     * - **feedback-icon** - The icon of the feedback.
-     * - **footer** - The footer of the textarea holding the feedback and counter.
-     * - **counter-container** - The container of the counter.
+     * - **base** - The main container.
+     * - **tab-list** - The tab list container (role="tablist") holding the tab buttons.
+     * - **tab-nav** - The individual tab buttons.
+     * - **high-contrast** - The high contrast indicator inside the tab buttons.
+     * - **tab-group-content** - The tab content container.
      */
-         'dap-ds-textarea': DefineCustomElement<DapDSTextarea, DapDSTextareaProps, DapDSTextareaEvents>
+         'dap-ds-tab-group': DefineCustomElement<DapDSTabGroup, DapDSTabGroupProps, DapDSTabGroupEvents>
+    /**
+     * A tab item component. It is used in dap-ds-tab-group component slot to create a tab item.
+     *
+     * ### Slots:
+     * - **default** - The tab title template.
+     * - **content** - The tab content.
+     *
+     * ### CSS Parts:
+     * - **base** - The main tab content container.
+     */
+         'dap-ds-tab': DefineCustomElement<DapDSTab, DapDSTabProps, {}>
     /**
      * A timeline is a graphical representation of a series of events.
      *
@@ -6792,17 +6764,6 @@ Used with dap-ds-select to create grouped options that render as native optgroup
      * - **nav** - The navigation element holding the links.
      */
          'dap-ds-toc': DefineCustomElement<DapDSTOC, DapDSTOCProps, DapDSTOCEvents>
-    /**
-     * A toggle button is a button that can be toggled on (active) or off (inactive).
-     *
-     * ### Slots:
-     * - **default** - The content of the toggle button.
-     *
-     * ### CSS Parts:
-     * - **base** - The main button container.
-     * - **high-contrast** - The high contrast part of the button.
-     */
-         'dap-ds-toggle-button': DefineCustomElement<DapDSToggleButton, DapDSToggleButtonProps, {}>
     /**
      * A tooltip is a container for tooltip content.
      *
@@ -6819,6 +6780,17 @@ Used with dap-ds-select to create grouped options that render as native optgroup
      * - **base__arrow** - Alias of the arrow part.
      */
          'dap-ds-tooltip': DefineCustomElement<DapDSTooltip, DapDSTooltipProps, {}>
+    /**
+     * A toggle button is a button that can be toggled on (active) or off (inactive).
+     *
+     * ### Slots:
+     * - **default** - The content of the toggle button.
+     *
+     * ### CSS Parts:
+     * - **base** - The main button container.
+     * - **high-contrast** - The high contrast part of the button.
+     */
+         'dap-ds-toggle-button': DefineCustomElement<DapDSToggleButton, DapDSToggleButtonProps, {}>
     /**
      * A tray is a container for slide in content.
      *
@@ -6846,6 +6818,34 @@ Used with dap-ds-select to create grouped options that render as native optgroup
      * - **closebutton** - The close button of the tray.
      */
          'dap-ds-tray': DefineCustomElement<DapDSTray, DapDSTrayProps, DapDSTrayEvents>
+    /**
+     * A textarea is a multi-line text input field.
+     *
+     * ### Events:
+     * - **dds-count-change** - Fires when the count of the textarea changes.
+     * - **dds-change** - Fired when the textarea value changes.
+     * - **dds-input** - Fired when the textarea value changes.
+     * - **dds-keydown** - Fired when a key is pressed down.
+     * - **dds-blur** - Fired when the textarea loses focus.
+     * - **dds-focus** - Emitted when the textarea gains focus.
+     * - **dds-select** - Emitted when select text in textarea.
+     *
+     * ### Slots:
+     * - **feedback-icon** - The custom icon of the feedback.
+     *
+     * ### CSS Parts:
+     * - **base** - The main textarea container.
+     * - **input** - The native input of the textarea.
+     * - **counter** - The counter of the textarea.
+     * - **counter-base** - The base of the counter.
+     * - **feedback** - The feedback of the textarea.
+     * - **feedback-base** - The base of the feedback.
+     * - **feedback-text** - The text of the feedback.
+     * - **feedback-icon** - The icon of the feedback.
+     * - **footer** - The footer of the textarea holding the feedback and counter.
+     * - **counter-container** - The container of the counter.
+     */
+         'dap-ds-textarea': DefineCustomElement<DapDSTextarea, DapDSTextareaProps, DapDSTextareaEvents>
     /**
      * Typography is used to display text in different styles.
      *
@@ -6935,21 +6935,21 @@ Used with dap-ds-select to create grouped options that render as native optgroup
      * ### CSS Parts:
      * - **base** - The main icon container.
      */
-         'dap-ds-icon-arrow-left-down-line': DefineCustomElement<ArrowsArrowLeftDownLine, ArrowsArrowLeftDownLineProps, {}>
+         'dap-ds-icon-arrow-left-l-line': DefineCustomElement<ArrowsArrowLeftLLine, ArrowsArrowLeftLLineProps, {}>
     /**
      * An icon
      *
      * ### CSS Parts:
      * - **base** - The main icon container.
      */
-         'dap-ds-icon-arrow-left-l-line': DefineCustomElement<ArrowsArrowLeftLLine, ArrowsArrowLeftLLineProps, {}>
+         'dap-ds-icon-arrow-left-line': DefineCustomElement<ArrowsArrowLeftLine, ArrowsArrowLeftLineProps, {}>
     /**
      * An icon
      *
      * ### CSS Parts:
      * - **base** - The main icon container.
      */
-         'dap-ds-icon-arrow-left-line': DefineCustomElement<ArrowsArrowLeftLine, ArrowsArrowLeftLineProps, {}>
+         'dap-ds-icon-arrow-left-down-line': DefineCustomElement<ArrowsArrowLeftDownLine, ArrowsArrowLeftDownLineProps, {}>
     /**
      * An icon
      *
@@ -7047,28 +7047,28 @@ Used with dap-ds-select to create grouped options that render as native optgroup
      * ### CSS Parts:
      * - **base** - The main icon container.
      */
-         'dap-ds-icon-calendar-line': DefineCustomElement<BusinessCalendarLine, BusinessCalendarLineProps, {}>
+         'dap-ds-icon-home-6-line': DefineCustomElement<BuildingsHome6Line, BuildingsHome6LineProps, {}>
     /**
      * An icon
      *
      * ### CSS Parts:
      * - **base** - The main icon container.
      */
-         'dap-ds-icon-edit-line': DefineCustomElement<DesignEditLine, DesignEditLineProps, {}>
+         'dap-ds-icon-calendar-line': DefineCustomElement<BusinessCalendarLine, BusinessCalendarLineProps, {}>
     /**
      * An icon
      *
      * ### CSS Parts:
      * - **base** - The main icon container.
      */
-         'dap-ds-icon-tools-line': DefineCustomElement<DesignToolsLine, DesignToolsLineProps, {}>
+         'dap-ds-icon-edit-line': DefineCustomElement<DesignEditLine, DesignEditLineProps, {}>
     /**
      * An icon
      *
      * ### CSS Parts:
      * - **base** - The main icon container.
      */
-         'dap-ds-icon-home-6-line': DefineCustomElement<BuildingsHome6Line, BuildingsHome6LineProps, {}>
+         'dap-ds-icon-tools-line': DefineCustomElement<DesignToolsLine, DesignToolsLineProps, {}>
     /**
      * An icon
      *
@@ -7215,14 +7215,14 @@ Used with dap-ds-select to create grouped options that render as native optgroup
      * ### CSS Parts:
      * - **base** - The main icon container.
      */
-         'dap-ds-icon-check-line': DefineCustomElement<SystemCheckLine, SystemCheckLineProps, {}>
+         'dap-ds-icon-check-line2': DefineCustomElement<SystemCheckLine2, SystemCheckLine2Props, {}>
     /**
      * An icon
      *
      * ### CSS Parts:
      * - **base** - The main icon container.
      */
-         'dap-ds-icon-check-line2': DefineCustomElement<SystemCheckLine2, SystemCheckLine2Props, {}>
+         'dap-ds-icon-check-line': DefineCustomElement<SystemCheckLine, SystemCheckLineProps, {}>
     /**
      * An icon
      *
@@ -7250,14 +7250,14 @@ Used with dap-ds-select to create grouped options that render as native optgroup
      * ### CSS Parts:
      * - **base** - The main icon container.
      */
-         'dap-ds-icon-checkbox-circle-fill': DefineCustomElement<SystemCheckboxCircleFill, SystemCheckboxCircleFillProps, {}>
+         'dap-ds-icon-checkbox-circle-line': DefineCustomElement<SystemCheckboxCircleLine, SystemCheckboxCircleLineProps, {}>
     /**
      * An icon
      *
      * ### CSS Parts:
      * - **base** - The main icon container.
      */
-         'dap-ds-icon-checkbox-circle-line': DefineCustomElement<SystemCheckboxCircleLine, SystemCheckboxCircleLineProps, {}>
+         'dap-ds-icon-checkbox-circle-fill': DefineCustomElement<SystemCheckboxCircleFill, SystemCheckboxCircleFillProps, {}>
     /**
      * An icon
      *
@@ -7390,14 +7390,14 @@ Used with dap-ds-select to create grouped options that render as native optgroup
      * ### CSS Parts:
      * - **base** - The main icon container.
      */
-         'dap-ds-icon-lock-line': DefineCustomElement<SystemLockLine, SystemLockLineProps, {}>
+         'dap-ds-icon-lock-fill': DefineCustomElement<SystemLockFill, SystemLockFillProps, {}>
     /**
      * An icon
      *
      * ### CSS Parts:
      * - **base** - The main icon container.
      */
-         'dap-ds-icon-lock-fill': DefineCustomElement<SystemLockFill, SystemLockFillProps, {}>
+         'dap-ds-icon-lock-line': DefineCustomElement<SystemLockLine, SystemLockLineProps, {}>
     /**
      * An icon
      *
@@ -7532,20 +7532,20 @@ declare global {
   namespace JSX {
     interface IntrinsicElements {
       'dap-ds-accordion': DapDSAccordionProps & DapDSAccordionEvents & DapDSAccordionSlots
+      'dap-ds-accordion-group': DapDSAccordionGroupProps & DapDSAccordionGroupSlots
       'dap-ds-anchor-heading': DapDSAnchorHeadingProps
-      'dap-ds-badge': DapDSBadgeProps & DapDSBadgeSlots
       'dap-ds-avatar': DapDSAvatarProps & DapDSAvatarEvents & DapDSAvatarSlots
-      'dap-ds-accordion-group': DapDSAccordionGroupProps & DapDSAccordionGroupSlots
       'dap-ds-banner': DapDSBannerProps & DapDSBannerEvents & DapDSBannerSlots
       'dap-ds-breadcrumb': DapDSBreadcrumbProps & DapDSBreadcrumbSlots
-      'dap-ds-avatar-group': DapDSAvatarGroupProps & DapDSAvatarGroupEvents & DapDSAvatarGroupSlots
+      'dap-ds-badge': DapDSBadgeProps & DapDSBadgeSlots
       'dap-ds-breadcrumb-item': DapDSBreadcrumbItemProps & DapDSBreadcrumbItemSlots
       'dap-ds-button': DapDSButtonProps & DapDSButtonEvents & DapDSButtonSlots
-      'dap-ds-calendar-cell': DapDSCalendarCellProps & DapDSCalendarCellSlots
-      'dap-ds-calendar': DapDSCalendarProps & DapDSCalendarEvents & DapDSCalendarSlots
+      'dap-ds-avatar-group': DapDSAvatarGroupProps & DapDSAvatarGroupEvents & DapDSAvatarGroupSlots
       'dap-ds-button-group-separator': DapDSButtonGroupSeparatorProps
       'dap-ds-button-group-text': DapDSButtonGroupTextProps & DapDSButtonGroupTextSlots
       'dap-ds-button-group': DapDSButtonGroupProps & DapDSButtonGroupSlots
+      'dap-ds-calendar-cell': DapDSCalendarCellProps & DapDSCalendarCellSlots
+      'dap-ds-calendar': DapDSCalendarProps & DapDSCalendarEvents & DapDSCalendarSlots
       'dap-ds-callout': DapDSCalloutProps & DapDSCalloutEvents & DapDSCalloutSlots
       'dap-ds-card-actions': DapDSCardActionsProps & DapDSCardActionsSlots
       'dap-ds-card-content': DapDSCardContentProps & DapDSCardContentSlots
@@ -7561,9 +7561,9 @@ declare global {
       'dap-ds-command-group': DapDSCommandGroupProps & DapDSCommandGroupSlots
       'dap-ds-command-item': DapDSCommandItemProps & DapDSCommandItemEvents & DapDSCommandItemSlots
       'dap-ds-command': DapDSCommandProps & DapDSCommandEvents & DapDSCommandSlots
+      'dap-ds-copybox-input': DapDSCopyBoxInputProps & DapDSCopyBoxInputEvents
       'dap-ds-content-switcher-item': DapDSContentSwitcherItemProps & DapDSContentSwitcherItemSlots
       'dap-ds-content-switcher': DapDSContentSwitcherProps & DapDSContentSwitcherEvents & DapDSContentSwitcherSlots
-      'dap-ds-copybox-input': DapDSCopyBoxInputProps & DapDSCopyBoxInputEvents
       'dap-ds-dap-badge': DapDSDAPBadgeProps & DapDSDAPBadgeSlots
       'dap-ds-datatable': <T = any>(props: DapDSDataTableProps<T> & DapDSDataTableEvents<T> & DapDSDataTableSlots) => JSX.Element
       'dap-ds-datepicker': DapDSDatePickerProps & DapDSDatePickerEvents
@@ -7580,20 +7580,20 @@ declare global {
       'dap-ds-link': DapDSLinkProps & DapDSLinkEvents & DapDSLinkSlots
       'dap-ds-list-item': DapDSListItemProps & DapDSListItemSlots
       'dap-ds-modal': DapDSModalProps & DapDSModalEvents & DapDSModalSlots
-      'dap-ds-navigation-menu-item': DapDSNavigationMenuItemProps & DapDSNavigationMenuItemEvents & DapDSNavigationMenuItemSlots
-      'dap-ds-navigation-menu': DapDSNavigationMenuProps & DapDSNavigationMenuEvents & DapDSNavigationMenuSlots
       'dap-ds-notification-badge': DapDSNotificationBadgeProps & DapDSNotificationBadgeSlots
       'dap-ds-number-input': DapDSNumberInputProps & DapDSNumberInputEvents & DapDSNumberInputSlots
       'dap-ds-official-website-banner': DapDSOfficialWebsiteBannerProps & DapDSOfficialWebsiteBannerEvents & DapDSOfficialWebsiteBannerSlots
+      'dap-ds-navigation-menu-item': DapDSNavigationMenuItemProps & DapDSNavigationMenuItemEvents & DapDSNavigationMenuItemSlots
+      'dap-ds-navigation-menu': DapDSNavigationMenuProps & DapDSNavigationMenuEvents & DapDSNavigationMenuSlots
       'dap-ds-option-group': DapDSOptionGroupProps & DapDSOptionGroupSlots
       'dap-ds-option-item': DapDSOptionItemProps & DapDSOptionItemSlots
       'dap-ds-option-list': DapDSOptionListProps & DapDSOptionListEvents & DapDSOptionListSlots
-      'dap-ds-overlay': DapDSOverlayProps & DapDSOverlayEvents & DapDSOverlaySlots
       'dap-ds-pager': DapDSPagerProps & DapDSPagerEvents
+      'dap-ds-overlay': DapDSOverlayProps & DapDSOverlayEvents & DapDSOverlaySlots
       'dap-ds-password-input': DapDSPasswordInputProps & DapDSPasswordInputEvents
       'dap-ds-popup': DapDSPopupProps & DapDSPopupEvents & DapDSPopupSlots
-      'dap-ds-radio-button': DapDSRadioButtonProps & DapDSRadioButtonEvents
       'dap-ds-progress': DapDSProgressProps & DapDSProgressSlots
+      'dap-ds-radio-button': DapDSRadioButtonProps & DapDSRadioButtonEvents
       'dap-ds-rating': DapDSRatingProps & DapDSRatingEvents
       'dap-ds-scroll-area': DapDSScrollAreaProps & DapDSScrollAreaSlots
       'dap-ds-scroll-progress': DapDSScrollProgressProps
@@ -7606,24 +7606,24 @@ declare global {
       'dap-ds-skip-link': DapDSSkipLinkProps & DapDSSkipLinkSlots
       'dap-ds-snackbar-message': DapDSSnackbarMessageProps & DapDSSnackbarMessageEvents & DapDSSnackbarMessageSlots
       'dap-ds-snackbar': DapDSSnackbarProps
-      'dap-ds-spinner': DapDSSpinnerProps & DapDSSpinnerSlots
       'dap-ds-stack': DapDSStackProps & DapDSStackSlots
+      'dap-ds-spinner': DapDSSpinnerProps & DapDSSpinnerSlots
       'dap-ds-switch': DapDSSwitchProps & DapDSSwitchEvents
-      'dap-ds-tab-group': DapDSTabGroupProps & DapDSTabGroupEvents & DapDSTabGroupSlots
-      'dap-ds-tab': DapDSTabProps & DapDSTabSlots
       'dap-ds-table-cell': DapDSTableCellProps & DapDSTableCellSlots
       'dap-ds-table-header': DapDSTableHeaderProps & DapDSTableHeaderSlots
       'dap-ds-table-row': DapDSTableRowProps & DapDSTableRowSlots
       'dap-ds-table': DapDSTableProps & DapDSTableSlots
-      'dap-ds-textarea': DapDSTextareaProps & DapDSTextareaEvents & DapDSTextareaSlots
+      'dap-ds-tab-group': DapDSTabGroupProps & DapDSTabGroupEvents & DapDSTabGroupSlots
+      'dap-ds-tab': DapDSTabProps & DapDSTabSlots
       'dap-ds-timeline-item': DapDSTimelineItemProps & DapDSTimelineItemSlots
       'dap-ds-timeline': DapDSTimelineProps & DapDSTimelineSlots
       'dap-ds-time-grid': DapDSTimeGridProps & DapDSTimeGridEvents
       'dap-ds-timepicker': DapDSTimePickerProps & DapDSTimePickerEvents
       'dap-ds-toc': DapDSTOCProps & DapDSTOCEvents
-      'dap-ds-toggle-button': DapDSToggleButtonProps & DapDSToggleButtonSlots
       'dap-ds-tooltip': DapDSTooltipProps & DapDSTooltipSlots
+      'dap-ds-toggle-button': DapDSToggleButtonProps & DapDSToggleButtonSlots
       'dap-ds-tray': DapDSTrayProps & DapDSTrayEvents & DapDSTraySlots
+      'dap-ds-textarea': DapDSTextareaProps & DapDSTextareaEvents & DapDSTextareaSlots
       'dap-ds-typography': DapDSTypographyProps & DapDSTypographySlots
       'dap-ds-form-label': DapDSFormLabelProps
       'dap-ds-input-group': DapDSInputGroupProps & DapDSInputGroupSlots
@@ -7631,9 +7631,9 @@ declare global {
       'dap-ds-icon-arrow-down-line': ArrowsArrowDownLineProps
       'dap-ds-icon-arrow-down-s-fill': ArrowsArrowDownSFillProps
       'dap-ds-icon-arrow-down-s-line': ArrowsArrowDownSLineProps
-      'dap-ds-icon-arrow-left-down-line': ArrowsArrowLeftDownLineProps
       'dap-ds-icon-arrow-left-l-line': ArrowsArrowLeftLLineProps
       'dap-ds-icon-arrow-left-line': ArrowsArrowLeftLineProps
+      'dap-ds-icon-arrow-left-down-line': ArrowsArrowLeftDownLineProps
       'dap-ds-icon-arrow-left-s-fill': ArrowsArrowLeftSFillProps
       'dap-ds-icon-arrow-left-s-line': ArrowsArrowLeftSLineProps
       'dap-ds-icon-arrow-left-up-line': ArrowsArrowLeftUpLineProps
@@ -7647,10 +7647,10 @@ declare global {
       'dap-ds-icon-arrow-up-s-fill': ArrowsArrowUpSFillProps
       'dap-ds-icon-arrow-up-s-line': ArrowsArrowUpSLineProps
       'dap-ds-icon-expand-up-down-fill': ArrowsExpandUpDownFillProps
+      'dap-ds-icon-home-6-line': BuildingsHome6LineProps
       'dap-ds-icon-calendar-line': BusinessCalendarLineProps
       'dap-ds-icon-edit-line': DesignEditLineProps
       'dap-ds-icon-tools-line': DesignToolsLineProps
-      'dap-ds-icon-home-6-line': BuildingsHome6LineProps
       'dap-ds-icon-computer-line': DeviceComputerLineProps
       'dap-ds-icon-clipboard-line': DocumentClipboardLineProps
       'dap-ds-icon-file-copy-line': DocumentFileCopyLineProps
@@ -7671,13 +7671,13 @@ declare global {
       'dap-ds-icon-add-line': SystemAddLineProps
       'dap-ds-icon-alert-fill': SystemAlertFillProps
       'dap-ds-icon-alert-line': SystemAlertLineProps
-      'dap-ds-icon-check-line': SystemCheckLineProps
       'dap-ds-icon-check-line2': SystemCheckLine2Props
+      'dap-ds-icon-check-line': SystemCheckLineProps
       'dap-ds-icon-checkbox-blank-circle-fill': SystemCheckboxBlankCircleFillProps
       'dap-ds-icon-checkbox-blank-circle-fill-check': SystemCheckboxBlankCircleFillCheckProps
       'dap-ds-icon-checkbox-blank-circle-line': SystemCheckboxBlankCircleLineProps
-      'dap-ds-icon-checkbox-circle-fill': SystemCheckboxCircleFillProps
       'dap-ds-icon-checkbox-circle-line': SystemCheckboxCircleLineProps
+      'dap-ds-icon-checkbox-circle-fill': SystemCheckboxCircleFillProps
       'dap-ds-icon-close-circle-fill': SystemCloseCircleFillProps
       'dap-ds-icon-close-circle-line': SystemCloseCircleLineProps
       'dap-ds-icon-close-fill': SystemCloseFillProps
@@ -7696,8 +7696,8 @@ declare global {
       'dap-ds-icon-information-line': SystemInformationLineProps
       'dap-ds-icon-lightbulb-fill': SystemLightbulbFillProps
       'dap-ds-icon-loading-spinner': SystemLoadingSpinnerProps
-      'dap-ds-icon-lock-line': SystemLockLineProps
       'dap-ds-icon-lock-fill': SystemLockFillProps
+      'dap-ds-icon-lock-line': SystemLockLineProps
       'dap-ds-icon-menu-line': SystemMenuLineProps
       'dap-ds-icon-menu-line-s': SystemMenuLineSProps
       'dap-ds-icon-more-2-line': SystemMore2LineProps