dap-design-system 0.60.0 → 0.60.2

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

@@ -239,16 +239,16 @@ export interface DapDSButtonEvents {
   onDdsLoadingTimeout?: (event: CustomEvent) => void
 }
 
-export interface DapDSCalendarEvents {
-  /** Fired when the calendar value changes. */
-  onDdsChange?: (event: CustomEvent<{ value: Dayjs }>) => void
-}
-
 export interface DapDSCalloutEvents {
   /** Fired when the close button is clicked. */
   onDdsClose?: (event: CustomEvent) => void
 }
 
+export interface DapDSCalendarEvents {
+  /** Fired when the calendar value changes. */
+  onDdsChange?: (event: CustomEvent<{ value: Dayjs }>) => void
+}
+
 export interface DapDSCheckboxEvents {
   /** Fired when the checkbox is checked or unchecked. */
   onDdsChange?: (event: CustomEvent<{ checked: boolean, indeterminate: boolean, value: string, disabled: boolean, readonly: boolean, type: 'checkbox' }>) => void
@@ -604,6 +604,11 @@ export interface DapDSTextareaEvents {
   onDdsSelect?: (event: CustomEvent<{ value: string }>) => void
 }
 
+export interface DapDSTOCEvents {
+  /** Event that is triggered when the anchor changes. */
+  onDdsAnchorChange?: (event: CustomEvent<{ selectedItem: HTMLAnchorElement, anchorElement: IntersectionObserverEntry | HTMLElement }>) => void
+}
+
 export interface DapDSTimeGridEvents {
   /** Fired when time selection changes. */
   onDdsChange?: (event: CustomEvent<{ detail: TimeSelection }>) => void
@@ -628,11 +633,6 @@ export interface DapDSTimePickerEvents {
   onDdsBlur?: (event: CustomEvent) => void
 }
 
-export interface DapDSTOCEvents {
-  /** Event that is triggered when the anchor changes. */
-  onDdsAnchorChange?: (event: CustomEvent<{ selectedItem: HTMLAnchorElement, anchorElement: IntersectionObserverEntry | HTMLElement }>) => void
-}
-
 export interface DapDSTrayEvents {
   /** Fires before the tray opens. */
   onDdsBeforeOpen?: (event: CustomEvent) => void
@@ -673,6 +673,11 @@ export interface DapDSAvatarSlots {
   'fallback'?: () => any
 }
 
+export interface DapDSAccordionGroupSlots {
+  /** The content of the accordion group. */
+  default?: () => any
+}
+
 export interface DapDSAvatarGroupSlots {
   /** The avatars to display in the group. */
   default?: () => any
@@ -694,11 +699,6 @@ export interface DapDSBannerSlots {
   'icon'?: () => any
 }
 
-export interface DapDSAccordionGroupSlots {
-  /** The content of the accordion group. */
-  default?: () => any
-}
-
 export interface DapDSBreadcrumbSlots {
   /** The content of the breadcrumb. */
   default?: () => any
@@ -718,16 +718,6 @@ export interface DapDSButtonSlots {
   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
@@ -771,6 +761,16 @@ export interface DapDSCardSlots {
   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 DapDSCodePuncherSlots {
   /** Slot for code-puncher-group, code-puncher-slot, and code-puncher-separator elements. */
   default?: () => any
@@ -919,11 +919,6 @@ export interface DapDSNavigationMenuSlots {
   default?: () => any
 }
 
-export interface DapDSNotificationBadgeSlots {
-  /** The content of the notification badge. */
-  default?: () => any
-}
-
 export interface DapDSNumberInputSlots {
   /** The custom icon of the feedback. */
   'feedback-icon'?: () => any
@@ -945,6 +940,11 @@ export interface DapDSOptionGroupSlots {
   default?: () => any
 }
 
+export interface DapDSNotificationBadgeSlots {
+  /** The content of the notification badge. */
+  default?: () => any
+}
+
 export interface DapDSOptionItemSlots {
   /** The prefix of the option item. */
   'prefix'?: () => any
@@ -1175,6 +1175,24 @@ 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"]
+}
+
+export type DapDSAnchorHeadingProps = {
+  /** The variant of the heading. Default is `h2`. Can be `h1`, `h2`, `h3`, `h4`, `h5`, or `h6`. */
+  variant?: DapDSAnchorHeading["variant"]
+  /** The label of the heading. */
+  label?: DapDSAnchorHeading["label"]
+  /**  */
+  elementId?: DapDSAnchorHeading["elementId"]
+  /**  */
+  anchorTitle?: DapDSAnchorHeading["anchorTitle"]
+}
+
 export type DapDSAvatarGroupProps = {
   /** Layout type for the avatar group */
   layout?: DapDSAvatarGroup["layout"]
@@ -1222,24 +1240,6 @@ export type DapDSBannerProps = {
   icon?: DapDSBanner["icon"]
 }
 
-export type DapDSAccordionGroupProps = {
-  /** Whether to close other accordions when one is opened. */
-  autoClose?: DapDSAccordionGroup["autoClose"]
-  /** The variant of the accordion */
-  variant?: DapDSAccordionGroup["variant"]
-}
-
-export type DapDSAnchorHeadingProps = {
-  /** The variant of the heading. Default is `h2`. Can be `h1`, `h2`, `h3`, `h4`, `h5`, or `h6`. */
-  variant?: DapDSAnchorHeading["variant"]
-  /** The label of the heading. */
-  label?: DapDSAnchorHeading["label"]
-  /**  */
-  elementId?: DapDSAnchorHeading["elementId"]
-  /**  */
-  anchorTitle?: DapDSAnchorHeading["anchorTitle"]
-}
-
 export type DapDSBreadcrumbProps = {
   /**  */
   variant?: DapDSBreadcrumb["variant"]
@@ -1293,68 +1293,6 @@ export type DapDSButtonProps = {
   sizeMap?: DapDSButton["sizeMap"]
 }
 
-export type DapDSCalendarCellProps = {
-  /** Whether the calendar cell is selected. */
-  selected?: DapDSCalendarCell["selected"]
-  /** Whether the calendar cell is disabled. */
-  disabledDay?: DapDSCalendarCell["disabledDay"]
-  /** Whether the calendar cell is today. */
-  today?: DapDSCalendarCell["today"]
-  /** Whether the calendar cell is out of range. */
-  outOfRange?: DapDSCalendarCell["outOfRange"]
-  /** Whether the calendar cell is a date header. */
-  header?: DapDSCalendarCell["header"]
-  /** Whether the calendar cell is focused. */
-  focused?: DapDSCalendarCell["focused"]
-  /** Whether the calendar cell is the start of a range. */
-  rangestart?: DapDSCalendarCell["rangestart"]
-  /** Whether the calendar cell is the end of a range. */
-  rangeend?: DapDSCalendarCell["rangeend"]
-  /** Whether the calendar cell is in the middle of a range. */
-  inrange?: DapDSCalendarCell["inrange"]
-  /** The locale of the calendar cell. */
-  locale?: DapDSCalendarCell["locale"]
-  /** The value of the calendar cell. */
-  value?: DapDSCalendarCell["value"]
-  /**  */
-  label?: DapDSCalendarCell["label"]
-  /**  */
-  focusElement?: DapDSCalendarCell["focusElement"]
-}
-
-export type DapDSCalendarProps = {
-  /** The mode of the calendar - single date or range selection. */
-  mode?: DapDSCalendar["mode"]
-  /** Whether to hide dates from adjacent months (previous/next) in the calendar grid. When not explicitly set, defaults to false for single mode and true for range mode. */
-  hideAdjacentMonths?: DapDSCalendar["hideAdjacentMonths"]
-  /** The locale of the calendar. */
-  locale?: DapDSCalendar["locale"]
-  /** `data-testid` for the previous-month button. */
-  prevButtonTestId?: DapDSCalendar["prevButtonTestId"]
-  /** `data-testid` for the next-month button. */
-  nextButtonTestId?: DapDSCalendar["nextButtonTestId"]
-  /** The value of the calendar. */
-  value?: DapDSCalendar["value"]
-  /** The start date of the range selection (only used in range mode). */
-  rangeStart?: DapDSCalendar["rangeStart"]
-  /** The end date of the range selection (only used in range mode). */
-  rangeEnd?: DapDSCalendar["rangeEnd"]
-  /** The current visible date of the calendar. Only the month and year are considered. */
-  currentDate?: DapDSCalendar["currentDate"]
-  /** The minimum date of the calendar. Only the month and year are considered. */
-  minDate?: DapDSCalendar["minDate"]
-  /** The maximum date of the calendar. Only the month and year are considered. */
-  maxDate?: DapDSCalendar["maxDate"]
-  /** The function to determine if the date is disabled. */
-  disabledDate?: DapDSCalendar["disabledDate"]
-  /**  */
-  startDate?: DapDSCalendar["startDate"]
-  /**  */
-  endDate?: DapDSCalendar["endDate"]
-  /**  */
-  shouldHideAdjacentMonths?: DapDSCalendar["shouldHideAdjacentMonths"]
-}
-
 export type DapDSCalloutProps = {
   /** The variant of the callout */
   variant?: DapDSCallout["variant"]
@@ -1462,6 +1400,68 @@ export type DapDSCardProps = {
   sizeMap?: DapDSCard["sizeMap"]
 }
 
+export type DapDSCalendarCellProps = {
+  /** Whether the calendar cell is selected. */
+  selected?: DapDSCalendarCell["selected"]
+  /** Whether the calendar cell is disabled. */
+  disabledDay?: DapDSCalendarCell["disabledDay"]
+  /** Whether the calendar cell is today. */
+  today?: DapDSCalendarCell["today"]
+  /** Whether the calendar cell is out of range. */
+  outOfRange?: DapDSCalendarCell["outOfRange"]
+  /** Whether the calendar cell is a date header. */
+  header?: DapDSCalendarCell["header"]
+  /** Whether the calendar cell is focused. */
+  focused?: DapDSCalendarCell["focused"]
+  /** Whether the calendar cell is the start of a range. */
+  rangestart?: DapDSCalendarCell["rangestart"]
+  /** Whether the calendar cell is the end of a range. */
+  rangeend?: DapDSCalendarCell["rangeend"]
+  /** Whether the calendar cell is in the middle of a range. */
+  inrange?: DapDSCalendarCell["inrange"]
+  /** The locale of the calendar cell. */
+  locale?: DapDSCalendarCell["locale"]
+  /** The value of the calendar cell. */
+  value?: DapDSCalendarCell["value"]
+  /**  */
+  label?: DapDSCalendarCell["label"]
+  /**  */
+  focusElement?: DapDSCalendarCell["focusElement"]
+}
+
+export type DapDSCalendarProps = {
+  /** The mode of the calendar - single date or range selection. */
+  mode?: DapDSCalendar["mode"]
+  /** Whether to hide dates from adjacent months (previous/next) in the calendar grid. When not explicitly set, defaults to false for single mode and true for range mode. */
+  hideAdjacentMonths?: DapDSCalendar["hideAdjacentMonths"]
+  /** The locale of the calendar. */
+  locale?: DapDSCalendar["locale"]
+  /** `data-testid` for the previous-month button. */
+  prevButtonTestId?: DapDSCalendar["prevButtonTestId"]
+  /** `data-testid` for the next-month button. */
+  nextButtonTestId?: DapDSCalendar["nextButtonTestId"]
+  /** The value of the calendar. */
+  value?: DapDSCalendar["value"]
+  /** The start date of the range selection (only used in range mode). */
+  rangeStart?: DapDSCalendar["rangeStart"]
+  /** The end date of the range selection (only used in range mode). */
+  rangeEnd?: DapDSCalendar["rangeEnd"]
+  /** The current visible date of the calendar. Only the month and year are considered. */
+  currentDate?: DapDSCalendar["currentDate"]
+  /** The minimum date of the calendar. Only the month and year are considered. */
+  minDate?: DapDSCalendar["minDate"]
+  /** The maximum date of the calendar. Only the month and year are considered. */
+  maxDate?: DapDSCalendar["maxDate"]
+  /** The function to determine if the date is disabled. */
+  disabledDate?: DapDSCalendar["disabledDate"]
+  /**  */
+  startDate?: DapDSCalendar["startDate"]
+  /**  */
+  endDate?: DapDSCalendar["endDate"]
+  /**  */
+  shouldHideAdjacentMonths?: DapDSCalendar["shouldHideAdjacentMonths"]
+}
+
 export type DapDSCheckboxProps = {
   /** Whether the checkbox is indeterminate */
   indeterminate?: DapDSCheckbox["indeterminate"]
@@ -2520,27 +2520,6 @@ export type DapDSNavigationMenuProps = {
   tabMode?: DapDSNavigationMenu["tabMode"]
 }
 
-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"]
-  /** This switch decides the visibility of the badge. This property overrides the badge content visibility. Use it for explicit control. */
-  visible?: DapDSNotificationBadge["visible"]
-  /** This switch decides whether to show a zero value or not. */
-  showZero?: DapDSNotificationBadge["showZero"]
-  /** The color scheme of the badge */
-  type?: DapDSNotificationBadge["type"]
-  /** The variant of the badge. */
-  variant?: DapDSNotificationBadge["variant"]
-  /** The cap value of badge content, if the badge content is greater than the max value, it will be displayed as `[number]+`. Zero means no cap. */
-  max?: DapDSNotificationBadge["max"]
-  /** The position of the badge content around the slot content. */
-  placement?: DapDSNotificationBadge["placement"]
-  /** Whether to automatically detect circular elements and adjust positioning accordingly */
-  "circular-auto"?: DapDSNotificationBadge["circularAuto"]
-  /** Override circular positioning detection - forces circular positioning calculation */
-  "force-circular"?: DapDSNotificationBadge["forceCircular"]
-}
-
 export type DapDSNumberInputProps = {
   /** The thousand separator of the input. */
   thousandSeparator?: DapDSNumberInput["thousandSeparator"]
@@ -2642,6 +2621,27 @@ export type DapDSOptionGroupProps = {
   disabled?: DapDSOptionGroup["disabled"]
 }
 
+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"]
+  /** This switch decides the visibility of the badge. This property overrides the badge content visibility. Use it for explicit control. */
+  visible?: DapDSNotificationBadge["visible"]
+  /** This switch decides whether to show a zero value or not. */
+  showZero?: DapDSNotificationBadge["showZero"]
+  /** The color scheme of the badge */
+  type?: DapDSNotificationBadge["type"]
+  /** The variant of the badge. */
+  variant?: DapDSNotificationBadge["variant"]
+  /** The cap value of badge content, if the badge content is greater than the max value, it will be displayed as `[number]+`. Zero means no cap. */
+  max?: DapDSNotificationBadge["max"]
+  /** The position of the badge content around the slot content. */
+  placement?: DapDSNotificationBadge["placement"]
+  /** Whether to automatically detect circular elements and adjust positioning accordingly */
+  "circular-auto"?: DapDSNotificationBadge["circularAuto"]
+  /** Override circular positioning detection - forces circular positioning calculation */
+  "force-circular"?: DapDSNotificationBadge["forceCircular"]
+}
+
 export type DapDSOptionItemProps = {
   /** The selected state of the option item */
   selected?: DapDSOptionItem["selected"]
@@ -2986,6 +2986,8 @@ export type DapDSSearchProps = {
   searchForText?: DapDSSearch["searchForText"]
   /** The aria label of the search button. */
   searchButtonAriaLabel?: DapDSSearch["searchButtonAriaLabel"]
+  /** When true, the search button is automatically disabled while the input is empty and re-enabled once the user types. Default is false. */
+  disableSearchWhenEmpty?: DapDSSearch["disableSearchWhenEmpty"]
   /** Whether the search should open on empty results. */
   openOnEmpty?: DapDSSearch["openOnEmpty"]
   /** Subtle color version */
@@ -3356,6 +3358,35 @@ export type DapDSTimelineProps = {
 
 }
 
+export type DapDSTOCProps = {
+  /** The root element to observe [`IntersectionObserver`](https://developer.mozilla.org/en-US/docs/Web/API/Intersection_Observer_API#root) */
+  root?: DapDSTOC["root"]
+  /** The margin around the root element to observe [`IntersectionObserver`](https://developer.mozilla.org/en-US/docs/Web/API/Intersection_Observer_API#rootmargin) */
+  rootMargin?: DapDSTOC["rootMargin"]
+  /** The margin around the last anchor to observe [`IntersectionObserver`](https://developer.mozilla.org/en-US/docs/Web/API/Intersection_Observer_API#rootmargin) */
+  lastAnchorRootMargin?: DapDSTOC["lastAnchorRootMargin"]
+  /** The threshold to trigger [`IntersectionObserver`](https://developer.mozilla.org/en-US/docs/Web/API/Intersection_Observer_API#threshold) */
+  threshold?: DapDSTOC["threshold"]
+  /** The minimum heading level to include in the TOC. The default value is `2`. */
+  minHeadingLevel?: DapDSTOC["minHeadingLevel"]
+  /** The maximum heading level to include in the TOC. The default value is `3`. */
+  maxHeadingLevel?: DapDSTOC["maxHeadingLevel"]
+  /** Whether to indent the TOC items. */
+  noIndent?: DapDSTOC["noIndent"]
+  /** The header of the TOC. */
+  header?: DapDSTOC["header"]
+  /**  */
+  activeAnchor?: DapDSTOC["activeAnchor"]
+  /**  */
+  anchors?: DapDSTOC["anchors"]
+  /**  */
+  items?: DapDSTOC["items"]
+  /** The size of the TOC. Default is `lg. */
+  size?: DapDSTOC["size"]
+  /** Responsive size map (e.g. "md:lg"). */
+  sizeMap?: DapDSTOC["sizeMap"]
+}
+
 export type DapDSTimeGridProps = {
   /** The currently selected hour (0-23). */
   selectedHour?: DapDSTimeGrid["selectedHour"]
@@ -3482,35 +3513,6 @@ export type DapDSTimePickerProps = {
   autocomplete?: DapDSTimePicker["autocomplete"]
 }
 
-export type DapDSTOCProps = {
-  /** The root element to observe [`IntersectionObserver`](https://developer.mozilla.org/en-US/docs/Web/API/Intersection_Observer_API#root) */
-  root?: DapDSTOC["root"]
-  /** The margin around the root element to observe [`IntersectionObserver`](https://developer.mozilla.org/en-US/docs/Web/API/Intersection_Observer_API#rootmargin) */
-  rootMargin?: DapDSTOC["rootMargin"]
-  /** The margin around the last anchor to observe [`IntersectionObserver`](https://developer.mozilla.org/en-US/docs/Web/API/Intersection_Observer_API#rootmargin) */
-  lastAnchorRootMargin?: DapDSTOC["lastAnchorRootMargin"]
-  /** The threshold to trigger [`IntersectionObserver`](https://developer.mozilla.org/en-US/docs/Web/API/Intersection_Observer_API#threshold) */
-  threshold?: DapDSTOC["threshold"]
-  /** The minimum heading level to include in the TOC. The default value is `2`. */
-  minHeadingLevel?: DapDSTOC["minHeadingLevel"]
-  /** The maximum heading level to include in the TOC. The default value is `3`. */
-  maxHeadingLevel?: DapDSTOC["maxHeadingLevel"]
-  /** Whether to indent the TOC items. */
-  noIndent?: DapDSTOC["noIndent"]
-  /** The header of the TOC. */
-  header?: DapDSTOC["header"]
-  /**  */
-  activeAnchor?: DapDSTOC["activeAnchor"]
-  /**  */
-  anchors?: DapDSTOC["anchors"]
-  /**  */
-  items?: DapDSTOC["items"]
-  /** The size of the TOC. Default is `lg. */
-  size?: DapDSTOC["size"]
-  /** Responsive size map (e.g. "md:lg"). */
-  sizeMap?: DapDSTOC["sizeMap"]
-}
-
 export type DapDSToggleButtonProps = {
   /** Whether the button is active. */
   active?: DapDSToggleButton["active"]
@@ -4084,6 +4086,50 @@ export type OthersCookieLineProps = {
   focusable?: OthersCookieLine["focusable"]
 }
 
+export type UserAccountCircleFillProps = {
+  /** (optional) The width and height in pixels */
+  size?: UserAccountCircleFill["size"]
+  /** (optional) Sets the icon color via the `fill` attribute */
+  selected?: UserAccountCircleFill["selected"]
+  /** (optional) When using the icon standalone, make it meaningful for accessibility */
+  accessibilityTitle?: UserAccountCircleFill["accessibilityTitle"]
+  /** (optional) If `true` the icon can receive focus */
+  focusable?: UserAccountCircleFill["focusable"]
+}
+
+export type UserAccountCircleLineProps = {
+  /** (optional) The width and height in pixels */
+  size?: UserAccountCircleLine["size"]
+  /** (optional) Sets the icon color via the `fill` attribute */
+  selected?: UserAccountCircleLine["selected"]
+  /** (optional) When using the icon standalone, make it meaningful for accessibility */
+  accessibilityTitle?: UserAccountCircleLine["accessibilityTitle"]
+  /** (optional) If `true` the icon can receive focus */
+  focusable?: UserAccountCircleLine["focusable"]
+}
+
+export type UserUserFillProps = {
+  /** (optional) The width and height in pixels */
+  size?: UserUserFill["size"]
+  /** (optional) Sets the icon color via the `fill` attribute */
+  selected?: UserUserFill["selected"]
+  /** (optional) When using the icon standalone, make it meaningful for accessibility */
+  accessibilityTitle?: UserUserFill["accessibilityTitle"]
+  /** (optional) If `true` the icon can receive focus */
+  focusable?: UserUserFill["focusable"]
+}
+
+export type UserUserLineProps = {
+  /** (optional) The width and height in pixels */
+  size?: UserUserLine["size"]
+  /** (optional) Sets the icon color via the `fill` attribute */
+  selected?: UserUserLine["selected"]
+  /** (optional) When using the icon standalone, make it meaningful for accessibility */
+  accessibilityTitle?: UserUserLine["accessibilityTitle"]
+  /** (optional) If `true` the icon can receive focus */
+  focusable?: UserUserLine["focusable"]
+}
+
 export type SystemAddLineProps = {
   /** (optional) The width and height in pixels */
   size?: SystemAddLine["size"]
@@ -4576,84 +4622,40 @@ export type SystemUpload2LineProps = {
   /** (optional) When using the icon standalone, make it meaningful for accessibility */
   accessibilityTitle?: SystemUpload2Line["accessibilityTitle"]
   /** (optional) If `true` the icon can receive focus */
-  focusable?: SystemUpload2Line["focusable"]
-}
-
-export type SystemUploadLineProps = {
-  /** (optional) The width and height in pixels */
-  size?: SystemUploadLine["size"]
-  /** (optional) Sets the icon color via the `fill` attribute */
-  selected?: SystemUploadLine["selected"]
-  /** (optional) When using the icon standalone, make it meaningful for accessibility */
-  accessibilityTitle?: SystemUploadLine["accessibilityTitle"]
-  /** (optional) If `true` the icon can receive focus */
-  focusable?: SystemUploadLine["focusable"]
-}
-
-export type SystemZoomInLineProps = {
-  /** (optional) The width and height in pixels */
-  size?: SystemZoomInLine["size"]
-  /** (optional) Sets the icon color via the `fill` attribute */
-  selected?: SystemZoomInLine["selected"]
-  /** (optional) When using the icon standalone, make it meaningful for accessibility */
-  accessibilityTitle?: SystemZoomInLine["accessibilityTitle"]
-  /** (optional) If `true` the icon can receive focus */
-  focusable?: SystemZoomInLine["focusable"]
-}
-
-export type SystemZoomOutLineProps = {
-  /** (optional) The width and height in pixels */
-  size?: SystemZoomOutLine["size"]
-  /** (optional) Sets the icon color via the `fill` attribute */
-  selected?: SystemZoomOutLine["selected"]
-  /** (optional) When using the icon standalone, make it meaningful for accessibility */
-  accessibilityTitle?: SystemZoomOutLine["accessibilityTitle"]
-  /** (optional) If `true` the icon can receive focus */
-  focusable?: SystemZoomOutLine["focusable"]
-}
-
-export type UserAccountCircleFillProps = {
-  /** (optional) The width and height in pixels */
-  size?: UserAccountCircleFill["size"]
-  /** (optional) Sets the icon color via the `fill` attribute */
-  selected?: UserAccountCircleFill["selected"]
-  /** (optional) When using the icon standalone, make it meaningful for accessibility */
-  accessibilityTitle?: UserAccountCircleFill["accessibilityTitle"]
-  /** (optional) If `true` the icon can receive focus */
-  focusable?: UserAccountCircleFill["focusable"]
+  focusable?: SystemUpload2Line["focusable"]
 }
 
-export type UserAccountCircleLineProps = {
+export type SystemUploadLineProps = {
   /** (optional) The width and height in pixels */
-  size?: UserAccountCircleLine["size"]
+  size?: SystemUploadLine["size"]
   /** (optional) Sets the icon color via the `fill` attribute */
-  selected?: UserAccountCircleLine["selected"]
+  selected?: SystemUploadLine["selected"]
   /** (optional) When using the icon standalone, make it meaningful for accessibility */
-  accessibilityTitle?: UserAccountCircleLine["accessibilityTitle"]
+  accessibilityTitle?: SystemUploadLine["accessibilityTitle"]
   /** (optional) If `true` the icon can receive focus */
-  focusable?: UserAccountCircleLine["focusable"]
+  focusable?: SystemUploadLine["focusable"]
 }
 
-export type UserUserFillProps = {
+export type SystemZoomInLineProps = {
   /** (optional) The width and height in pixels */
-  size?: UserUserFill["size"]
+  size?: SystemZoomInLine["size"]
   /** (optional) Sets the icon color via the `fill` attribute */
-  selected?: UserUserFill["selected"]
+  selected?: SystemZoomInLine["selected"]
   /** (optional) When using the icon standalone, make it meaningful for accessibility */
-  accessibilityTitle?: UserUserFill["accessibilityTitle"]
+  accessibilityTitle?: SystemZoomInLine["accessibilityTitle"]
   /** (optional) If `true` the icon can receive focus */
-  focusable?: UserUserFill["focusable"]
+  focusable?: SystemZoomInLine["focusable"]
 }
 
-export type UserUserLineProps = {
+export type SystemZoomOutLineProps = {
   /** (optional) The width and height in pixels */
-  size?: UserUserLine["size"]
+  size?: SystemZoomOutLine["size"]
   /** (optional) Sets the icon color via the `fill` attribute */
-  selected?: UserUserLine["selected"]
+  selected?: SystemZoomOutLine["selected"]
   /** (optional) When using the icon standalone, make it meaningful for accessibility */
-  accessibilityTitle?: UserUserLine["accessibilityTitle"]
+  accessibilityTitle?: SystemZoomOutLine["accessibilityTitle"]
   /** (optional) If `true` the icon can receive focus */
-  focusable?: UserUserLine["focusable"]
+  focusable?: SystemZoomOutLine["focusable"]
 }
 
 // Augment Vue's GlobalComponents interface
@@ -4705,6 +4707,26 @@ 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, {}>
+    /**
+     * Anchor heading is a heading with an anchor link.
+     *
+     * ### 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.
+     */
+         'dap-ds-anchor-heading': DefineCustomElement<DapDSAnchorHeading, DapDSAnchorHeadingProps, {}>
     /**
      * Avatar group component displays multiple avatars in an organized layout with overflow management.
      *
@@ -4758,26 +4780,6 @@ declare module 'vue' {
      * - **title** -  The title of the banner.
      */
          'dap-ds-banner': DefineCustomElement<DapDSBanner, DapDSBannerProps, DapDSBannerEvents>
-    /**
-     * 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, {}>
-    /**
-     * Anchor heading is a heading with an anchor link.
-     *
-     * ### 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.
-     */
-         'dap-ds-anchor-heading': DefineCustomElement<DapDSAnchorHeading, DapDSAnchorHeadingProps, {}>
     /**
      * A breadcrumb is a secondary navigation scheme that reveals the user's location in a website or Web application.
      *
@@ -4820,39 +4822,6 @@ declare module 'vue' {
      * - **content** - The content wrapper inside the button.
      */
          'dap-ds-button': DefineCustomElement<DapDSButton, DapDSButtonProps, DapDSButtonEvents>
-    /**
-     * Calendar cell represents a single cell in the calendar.
-     *
-     * ### Slots:
-     * - **default** - The content of the calendar cell.
-     *
-     * ### CSS Parts:
-     * - **base** - The main calendar cell container.
-     * - **today-mark** - The today mark of the calendar cell.
-     */
-         'dap-ds-calendar-cell': DefineCustomElement<DapDSCalendarCell, DapDSCalendarCellProps, {}>
-    /**
-     * A calendar is a visual representation of dates. It allows users to select a date.
-     *
-     * ### Events:
-     * - **dds-change** - Fired when the calendar value changes.
-     *
-     * ### Slots:
-     * - **default** - The content of the calendar.
-     *
-     * ### CSS Parts:
-     * - **base** - The main calendar container.
-     * - **calendar-header** - The header of the calendar.
-     * - **body** - The body of the calendar.
-     * - **calendar-grid-header** - The header of the calendar grid.
-     * - **calendar-grid-header-cell** - The header cell of the calendar grid.
-     * - **calendar-grid-cell** - The cell of the calendar grid.
-     * - **calendar-header-button-prev** - The previous month button of the calendar header.
-     * - **calendar-header-button-next** - The next month button of the calendar header.
-     * - **calendar-header-year-select** - The year select of the calendar header.
-     * - **calendar-header-month-select** - The month select of the calendar header.
-     */
-         'dap-ds-calendar': DefineCustomElement<DapDSCalendar, DapDSCalendarProps, DapDSCalendarEvents>
     /**
      * 
      *
@@ -4937,6 +4906,39 @@ declare module 'vue' {
      * - **base** - The main card container.
      */
          'dap-ds-card': DefineCustomElement<DapDSCard, DapDSCardProps, {}>
+    /**
+     * Calendar cell represents a single cell in the calendar.
+     *
+     * ### Slots:
+     * - **default** - The content of the calendar cell.
+     *
+     * ### CSS Parts:
+     * - **base** - The main calendar cell container.
+     * - **today-mark** - The today mark of the calendar cell.
+     */
+         'dap-ds-calendar-cell': DefineCustomElement<DapDSCalendarCell, DapDSCalendarCellProps, {}>
+    /**
+     * A calendar is a visual representation of dates. It allows users to select a date.
+     *
+     * ### Events:
+     * - **dds-change** - Fired when the calendar value changes.
+     *
+     * ### Slots:
+     * - **default** - The content of the calendar.
+     *
+     * ### CSS Parts:
+     * - **base** - The main calendar container.
+     * - **calendar-header** - The header of the calendar.
+     * - **body** - The body of the calendar.
+     * - **calendar-grid-header** - The header of the calendar grid.
+     * - **calendar-grid-header-cell** - The header cell of the calendar grid.
+     * - **calendar-grid-cell** - The cell of the calendar grid.
+     * - **calendar-header-button-prev** - The previous month button of the calendar header.
+     * - **calendar-header-button-next** - The next month button of the calendar header.
+     * - **calendar-header-year-select** - The year select of the calendar header.
+     * - **calendar-header-month-select** - The month select of the calendar header.
+     */
+         'dap-ds-calendar': DefineCustomElement<DapDSCalendar, DapDSCalendarProps, DapDSCalendarEvents>
     /**
      * A checkbox is a form element that allows the user to select one or more options from a set.
      *
@@ -5481,17 +5483,6 @@ Uses semantic HTML (`<nav>`) and proper navigation ARIA attributes.
      * - **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.
-     *
-     * ### Slots:
-     * - **default** - The content of the notification badge.
-     *
-     * ### CSS Parts:
-     * - **base** - The main container of the notification badge.
-     * - **noty** - The notification badge container.
-     */
-         'dap-ds-notification-badge': DefineCustomElement<DapDSNotificationBadge, DapDSNotificationBadgeProps, {}>
     /**
      * A number input component.
      *
@@ -5562,6 +5553,17 @@ Used with dap-ds-select to create grouped options that render as native optgroup
      * - **label** - The label of the option group.
      */
          'dap-ds-option-group': DefineCustomElement<DapDSOptionGroup, DapDSOptionGroupProps, {}>
+    /**
+     * 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.
+     *
+     * ### Slots:
+     * - **default** - The content of the notification badge.
+     *
+     * ### CSS Parts:
+     * - **base** - The main container of the notification badge.
+     * - **noty** - The notification badge container.
+     */
+         'dap-ds-notification-badge': DefineCustomElement<DapDSNotificationBadge, DapDSNotificationBadgeProps, {}>
     /**
      * An option item is a selectable item in a list of options.
      *
@@ -5775,6 +5777,7 @@ Used with dap-ds-select to create grouped options that render as native optgroup
      * ### CSS Parts:
      * - **base** - The main search container.
      * - **trigger** - The trigger button of the search.
+     * - **search-button** - The trailing search icon button.
      * - **label** - The label of the search.
      * - **description** - The description of the search.
      * - **feedback** - The feedback of the search.
@@ -6060,6 +6063,16 @@ Used with dap-ds-select to create grouped options that render as native optgroup
      * - **base** - The main timeline container.
      */
          'dap-ds-timeline': DefineCustomElement<DapDSTimeline, DapDSTimelineProps, {}>
+    /**
+     * A table of contents (TOC) is a list of links that allows users to quickly navigate to sections within a document.
+     *
+     * ### Events:
+     * - **dds-anchor-change** - Event that is triggered when the anchor changes.
+     *
+     * ### CSS Parts:
+     * - **base** - The main container of the toc.
+     */
+         'dap-ds-toc': DefineCustomElement<DapDSTOC, DapDSTOCProps, DapDSTOCEvents>
     /**
      * A time grid component that allows users to select hours and minutes in two side-by-side scrollable columns.
      *
@@ -6103,16 +6116,6 @@ Used with dap-ds-select to create grouped options that render as native optgroup
      * - **clear-button** - The clear button of the timepicker.
      */
          'dap-ds-timepicker': DefineCustomElement<DapDSTimePicker, DapDSTimePickerProps, DapDSTimePickerEvents>
-    /**
-     * A table of contents (TOC) is a list of links that allows users to quickly navigate to sections within a document.
-     *
-     * ### Events:
-     * - **dds-anchor-change** - Event that is triggered when the anchor changes.
-     *
-     * ### CSS Parts:
-     * - **base** - The main container of the toc.
-     */
-         'dap-ds-toc': DefineCustomElement<DapDSTOC, DapDSTOCProps, DapDSTOCEvents>
     /**
      * A toggle button is a button that can be toggled on (active) or off (inactive).
      *
@@ -6467,6 +6470,34 @@ Used with dap-ds-select to create grouped options that render as native optgroup
      * - **base** - The main icon container.
      */
          'dap-ds-icon-cookie-line': DefineCustomElement<OthersCookieLine, OthersCookieLineProps, {}>
+    /**
+     * An icon
+     *
+     * ### CSS Parts:
+     * - **base** - The main icon container.
+     */
+         'dap-ds-icon-account-circle-fill': DefineCustomElement<UserAccountCircleFill, UserAccountCircleFillProps, {}>
+    /**
+     * An icon
+     *
+     * ### CSS Parts:
+     * - **base** - The main icon container.
+     */
+         'dap-ds-icon-account-circle-line': DefineCustomElement<UserAccountCircleLine, UserAccountCircleLineProps, {}>
+    /**
+     * An icon
+     *
+     * ### CSS Parts:
+     * - **base** - The main icon container.
+     */
+         'dap-ds-icon-user-fill': DefineCustomElement<UserUserFill, UserUserFillProps, {}>
+    /**
+     * An icon
+     *
+     * ### CSS Parts:
+     * - **base** - The main icon container.
+     */
+         'dap-ds-icon-user-line': DefineCustomElement<UserUserLine, UserUserLineProps, {}>
     /**
      * An icon
      *
@@ -6803,34 +6834,6 @@ Used with dap-ds-select to create grouped options that render as native optgroup
      * - **base** - The main icon container.
      */
          'dap-ds-icon-zoom-out-line': DefineCustomElement<SystemZoomOutLine, SystemZoomOutLineProps, {}>
-    /**
-     * An icon
-     *
-     * ### CSS Parts:
-     * - **base** - The main icon container.
-     */
-         'dap-ds-icon-account-circle-fill': DefineCustomElement<UserAccountCircleFill, UserAccountCircleFillProps, {}>
-    /**
-     * An icon
-     *
-     * ### CSS Parts:
-     * - **base** - The main icon container.
-     */
-         'dap-ds-icon-account-circle-line': DefineCustomElement<UserAccountCircleLine, UserAccountCircleLineProps, {}>
-    /**
-     * An icon
-     *
-     * ### CSS Parts:
-     * - **base** - The main icon container.
-     */
-         'dap-ds-icon-user-fill': DefineCustomElement<UserUserFill, UserUserFillProps, {}>
-    /**
-     * An icon
-     *
-     * ### CSS Parts:
-     * - **base** - The main icon container.
-     */
-         'dap-ds-icon-user-line': DefineCustomElement<UserUserLine, UserUserLineProps, {}>
   }
 }
 
@@ -6840,16 +6843,14 @@ declare global {
     interface IntrinsicElements {
       'dap-ds-accordion': DapDSAccordionProps & DapDSAccordionEvents & DapDSAccordionSlots
       'dap-ds-avatar': DapDSAvatarProps & DapDSAvatarEvents & DapDSAvatarSlots
+      'dap-ds-accordion-group': DapDSAccordionGroupProps & DapDSAccordionGroupSlots
+      'dap-ds-anchor-heading': DapDSAnchorHeadingProps
       'dap-ds-avatar-group': DapDSAvatarGroupProps & DapDSAvatarGroupEvents & DapDSAvatarGroupSlots
       'dap-ds-badge': DapDSBadgeProps & DapDSBadgeSlots
       'dap-ds-banner': DapDSBannerProps & DapDSBannerEvents & DapDSBannerSlots
-      'dap-ds-accordion-group': DapDSAccordionGroupProps & DapDSAccordionGroupSlots
-      'dap-ds-anchor-heading': DapDSAnchorHeadingProps
       'dap-ds-breadcrumb': DapDSBreadcrumbProps & DapDSBreadcrumbSlots
       '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-callout': DapDSCalloutProps & DapDSCalloutEvents & DapDSCalloutSlots
       'dap-ds-card-actions': DapDSCardActionsProps & DapDSCardActionsSlots
       'dap-ds-card-content': DapDSCardContentProps & DapDSCardContentSlots
@@ -6857,6 +6858,8 @@ declare global {
       'dap-ds-card-subtitle': DapDSCardSubtitleProps & DapDSCardSubtitleSlots
       'dap-ds-card-title': DapDSCardTitleProps & DapDSCardTitleSlots
       'dap-ds-card': DapDSCardProps & DapDSCardSlots
+      'dap-ds-calendar-cell': DapDSCalendarCellProps & DapDSCalendarCellSlots
+      'dap-ds-calendar': DapDSCalendarProps & DapDSCalendarEvents & DapDSCalendarSlots
       'dap-ds-checkbox': DapDSCheckboxProps & DapDSCheckboxEvents
       'dap-ds-chip': DapDSChipProps & DapDSChipEvents
       'dap-ds-code-puncher-slot': DapDSCodePuncherSlotProps
@@ -6886,10 +6889,10 @@ declare global {
       '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-option-group': DapDSOptionGroupProps & DapDSOptionGroupSlots
+      'dap-ds-notification-badge': DapDSNotificationBadgeProps & DapDSNotificationBadgeSlots
       'dap-ds-option-item': DapDSOptionItemProps & DapDSOptionItemSlots
       'dap-ds-option-list': DapDSOptionListProps & DapDSOptionListEvents & DapDSOptionListSlots
       'dap-ds-overlay': DapDSOverlayProps & DapDSOverlayEvents & DapDSOverlaySlots
@@ -6922,9 +6925,9 @@ declare global {
       'dap-ds-textarea': DapDSTextareaProps & DapDSTextareaEvents & DapDSTextareaSlots
       'dap-ds-timeline-item': DapDSTimelineItemProps & DapDSTimelineItemSlots
       'dap-ds-timeline': DapDSTimelineProps & DapDSTimelineSlots
+      'dap-ds-toc': DapDSTOCProps & DapDSTOCEvents
       '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-tray': DapDSTrayProps & DapDSTrayEvents & DapDSTraySlots
@@ -6968,6 +6971,10 @@ declare global {
       'dap-ds-icon-heart-fill': HealthHeartFillProps
       'dap-ds-icon-heart-line': HealthHeartLineProps
       'dap-ds-icon-cookie-line': OthersCookieLineProps
+      'dap-ds-icon-account-circle-fill': UserAccountCircleFillProps
+      'dap-ds-icon-account-circle-line': UserAccountCircleLineProps
+      'dap-ds-icon-user-fill': UserUserFillProps
+      'dap-ds-icon-user-line': UserUserLineProps
       'dap-ds-icon-add-line': SystemAddLineProps
       'dap-ds-icon-alert-fill': SystemAlertFillProps
       'dap-ds-icon-alert-line': SystemAlertLineProps
@@ -7016,10 +7023,6 @@ declare global {
       'dap-ds-icon-upload-line': SystemUploadLineProps
       'dap-ds-icon-zoom-in-line': SystemZoomInLineProps
       'dap-ds-icon-zoom-out-line': SystemZoomOutLineProps
-      'dap-ds-icon-account-circle-fill': UserAccountCircleFillProps
-      'dap-ds-icon-account-circle-line': UserAccountCircleLineProps
-      'dap-ds-icon-user-fill': UserUserFillProps
-      'dap-ds-icon-user-line': UserUserLineProps
     }
   }
 }