dap-design-system 0.60.2 → 0.61.0

package/dist/react/dap-ds-timepicker/index.js

@@ -0,0 +1,23 @@
+import { createComponent as e } from "@lit/react";
+import * as d from "react";
+import "../../components/timepicker/timepicker.js";
+import s from "../../components/timepicker/timepicker.component.js";
+const a = "dap-ds-timepicker", r = e({
+  tagName: a,
+  elementClass: s,
+  react: d,
+  events: {
+    onDdsChange: "dds-change",
+    onDdsInput: "dds-input",
+    onDdsValidTime: "dds-valid-time",
+    onDdsInvalidTime: "dds-invalid-time",
+    onDdsClear: "dds-clear",
+    onDdsFocus: "dds-focus",
+    onDdsBlur: "dds-blur"
+  },
+  displayName: "DapDSTimePicker"
+});
+export {
+  r as default
+};
+//# sourceMappingURL=index.js.map

package/dist/react/dap-ds-timepicker/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":["../../../src/react/dap-ds-timepicker/index.ts"],"sourcesContent":["\n      import { createComponent } from '@lit/react'\n      import { type EventName } from '@lit/react'\n      import * as React from 'react'\n\n      import Component from '../../components/timepicker/timepicker.js'\n      import type { DdsChangeEvent } from '../../events/events'\nimport type { DdsInputEvent } from '../../events/events'\nimport type { DdsValidTimeEvent } from '../../events/events'\nimport type { DdsInvalidTimeEvent } from '../../events/events'\nimport type { DdsClearEvent } from '../../events/events'\nimport type { DdsFocusEvent } from '../../events/events'\nimport type { DdsBlurEvent } from '../../events/events'\n      export type { DdsChangeEvent } from '../../events/events'\nexport type { DdsInputEvent } from '../../events/events'\nexport type { DdsValidTimeEvent } from '../../events/events'\nexport type { DdsInvalidTimeEvent } from '../../events/events'\nexport type { DdsClearEvent } from '../../events/events'\nexport type { DdsFocusEvent } from '../../events/events'\nexport type { DdsBlurEvent } from '../../events/events'\n\n      const tagName = 'dap-ds-timepicker'\n\n      /**\n * `dap-ds-timepicker`\n * @summary A timepicker is a graphical user interface widget that allows the user to select a time from a time range.\n * @element dap-ds-timepicker\n * @title - Timepicker\n *\n * @property {Dayjs | string} value - The value of the timepicker. Can be a Dayjs object or a string in 'HH:mm' format.\n * @property {string} label - The label of the timepicker.\n * @property {boolean} hideLabel - Visually hides the label while keeping it available to assistive technology. (default: false)\n * @property {string} description - The description of the timepicker.\n * @property {'xs' | 'sm' | 'lg'} size - The size of the timepicker.\n * @property {boolean} disabled - The disabled state of the timepicker.\n * @property {boolean} required - The required state of the timepicker.\n * @property {boolean} readonly - The readonly state of the timepicker.\n * @property {boolean} autofocus - The autofocus state of the timepicker.\n * @property {string} tooltip - The tooltip of the timepicker.\n * @property {'top' | 'right' | 'bottom' | 'left'} tooltipPlacement - The tooltip placement of the timepicker.\n * @property {string} feedback - The feedback of the timepicker.\n * @property {'negative' | 'positive' | 'warning'} feedbackType - The feedback type of the timepicker.\n * @property {boolean} optional - The optional state of the timepicker.\n * @property {string} optionalLabel - The optional label of the timepicker.\n * @property {string} requiredLabel - The required indicator of the timepicker. (default: '*')\n * @property {boolean} subtle - The weight of the label. Default is `false`\n * @property {string} autocomplete - The autocomplete of the timepicker.\n * @property {string} placeholder - The placeholder of the timepicker.\n * @property {boolean} loading - The loading state of the timepicker.\n * @property {string} format - The format of the timepicker. Defaults to 'HH:mm'.\n * @property {string} minTime - The minimum time of the timepicker. Format: 'HH:mm'.\n * @property {string} maxTime - The maximum time of the timepicker. Format: 'HH:mm'.\n * @property {number} step - The step interval in minutes. Defaults to 15.\n * @property {boolean} openTimeOnInput - Whether the time picker should open on typing.\n * @property {boolean} sendEmptyEventOnInput - Whether the time picker should send an empty event on typing.\n * @property {string} clearButton - Whether the clear button should be shown. Defaults to 'true'.\n * @property {string} clearButtonAriaLabel - The aria label of the clear button.\n * @property {string} placement - The placement of the dropdown of the timepicker.\n * @property {FloatingStrategy} floatingStrategy - The floating strategy of the timepicker.\n * @property {string} locale - The locale of the timepicker.\n * @property {boolean} closeOnSelection - Whether the dropdown should close when a time is selected.\n * @property {boolean} showSeconds - Whether to show the seconds column in the time picker.\n * @property {number} secondsStep - The step interval in seconds. Defaults to 1.\n * @property {function} disabledTime - Callback to determine if a time should be disabled.\n * @property {boolean} hideDisabledTimes - Whether to hide disabled times or show them as disabled.\n * @property {TimePreset[]} presets - Array of preset time slots for quick selection.\n *\n * @event {{ value: Dayjs | string, hour: number, minute: number, second?: number }} dds-change - Fired when the timepicker value changes.\n * @event {{ value: string }} dds-input - Fired when the timepicker input value changes.\n * @event {{ value: Dayjs | string, hour: number, minute: number, second?: number }} dds-valid-time - Fired when the timepicker input value is valid. Happens on manual input typing.\n * @event {{ value: Dayjs | string, hour: number, minute: number, second?: number, type: 'invalid' | 'out-of-range' }} dds-invalid-time - Fired when the timepicker input value is invalid. Happens on manual input typing.\n * @event {{ void }} dds-clear - Fired when the timepicker is cleared.\n * @event {{ void }} dds-focus - Emitted when the timepicker gains focus.\n * @event {{ void }} dds-blur - Emitted when the timepicker loses focus.\n *\n * @csspart base - The main timepicker container.\n * @csspart trigger - The trigger button of the timepicker.\n * @csspart label - The label of the timepicker.\n * @csspart description - The description of the timepicker.\n * @csspart feedback - The feedback of the timepicker.\n * @csspart tooltip - The tooltip of the timepicker.\n * @csspart input - The input of the timepicker.\n * @csspart clear-button - The clear button of the timepicker.\n *\n * @cssproperty --dds-timepicker-background - The background color of the timepicker. (default: var(--dds-fields-background-default))\n * @cssproperty --dds-timepicker-border-color - The border color of the timepicker. (default: var(--dds-border-neutral-base))\n * @cssproperty --dds-timepicker-border-width - The border width of the timepicker. (default: var(--dds-border-width-base, 1px))\n * @cssproperty --dds-timepicker-border-radius - The border radius of the timepicker. (default: var(--dds-radius-base))\n * @cssproperty --dds-timepicker-text-color - The text color of the timepicker. (default: var(--dds-text-neutral-base))\n * @cssproperty --dds-timepicker-placeholder-color - The placeholder text color. (default: var(--dds-text-neutral-subtle))\n * @cssproperty --dds-timepicker-disabled-background - The background color when disabled. (default: var(--dds-background-neutral-stronger))\n * @cssproperty --dds-timepicker-disabled-text - The text color when disabled. (default: var(--dds-text-neutral-disabled))\n * @cssproperty --dds-timepicker-error-border - The border color for error state. (default: var(--dds-border-negative-base))\n * @cssproperty --dds-timepicker-success-border - The border color for success state. (default: var(--dds-border-positive-base))\n * @cssproperty --dds-timepicker-icon-color - The color of the icons. (default: var(--dds-text-icon-neutral-subtle))\n * @cssproperty --dds-timepicker-clear-icon-color - The color of the clear icon. (default: var(--dds-button-subtle-icon-neutral-enabled))\n * @cssproperty --dds-timepicker-popup-background - The background color of the popup. (default: var(--dds-background-neutral-subtle))\n * @cssproperty --dds-timepicker-popup-shadow - The box shadow of the popup. (default: 0 4px 6px -1px rgb(0 0 0 / 8%), 0 2px 4px -1px rgb(0 0 0 / 6%))\n *\n * @cssproperty --dds-timepicker-padding-xs - The padding for extra small size. (default: var(--dds-spacing-200))\n * @cssproperty --dds-timepicker-padding-sm - The padding for small size. (default: var(--dds-spacing-200))\n * @cssproperty --dds-timepicker-padding-lg - The padding for large size. (default: var(--dds-spacing-300))\n * @cssproperty --dds-timepicker-padding-horizontal - The horizontal padding. (default: var(--dds-spacing-300))\n * @cssproperty --dds-timepicker-padding-vertical - The vertical padding. (default: var(--dds-spacing-200))\n * @cssproperty --dds-timepicker-gap - The gap between elements. (default: var(--dds-spacing-100))\n * @cssproperty --dds-timepicker-icon-gap - The gap between icons. (default: var(--dds-spacing-200))\n * @cssproperty --dds-timepicker-action-gap - The gap between action elements. (default: var(--dds-spacing-200))\n * @cssproperty --dds-timepicker-action-padding - The padding for action elements. (default: var(--dds-spacing-300))\n * @cssproperty --dds-timepicker-clear-icon-width - The width of the clear icon. (default: var(--dds-spacing-800))\n * @cssproperty --dds-timepicker-dropdown-icon-right - The right position of the dropdown icon. (default: var(--dds-spacing-600))\n * @cssproperty --dds-timepicker-min-width - The minimum width of the timepicker. (default: 7.5rem)\n *\n */\n      const reactWrapper = createComponent({\n        tagName,\n        elementClass: Component,\n        react: React,\n        events: {\n          onDdsChange: 'dds-change' as EventName<DdsChangeEvent>,\nonDdsInput: 'dds-input' as EventName<DdsInputEvent>,\nonDdsValidTime: 'dds-valid-time' as EventName<DdsValidTimeEvent>,\nonDdsInvalidTime: 'dds-invalid-time' as EventName<DdsInvalidTimeEvent>,\nonDdsClear: 'dds-clear' as EventName<DdsClearEvent>,\nonDdsFocus: 'dds-focus' as EventName<DdsFocusEvent>,\nonDdsBlur: 'dds-blur' as EventName<DdsBlurEvent>\n        },\n        displayName: \"DapDSTimePicker\"\n      })\n\n      export default reactWrapper\n    "],"names":["tagName","reactWrapper","createComponent","Component","React"],"mappings":";;;;AAqBM,MAAMA,IAAU,qBA4FVC,IAAeC,EAAgB;AAAA,EACnC,SAAAF;AAAA,EACA,cAAcG;AAAAA,EACd,OAAOC;AAAA,EACP,QAAQ;AAAA,IACN,aAAa;AAAA,IACvB,YAAY;AAAA,IACZ,gBAAgB;AAAA,IAChB,kBAAkB;AAAA,IAClB,YAAY;AAAA,IACZ,YAAY;AAAA,IACZ,WAAW;AAAA,EACH;AAAA,EACA,aAAa;AACf,CAAC;"}

package/dist/react/dap-ds-toc/index.d.ts

@@ -1,5 +1,5 @@
 import { EventName } from '@lit/react';
-import { default as Component } from '../../components/toc/toc.component.js';
+import { default as Component } from '../../components/toc/toc.js';
 import { DdsAnchorChangeEvent } from '../../events/events';
 export type { DdsAnchorChangeEvent } from '../../events/events';
 /**

package/dist/react/dap-ds-toc/index.js

@@ -0,0 +1,17 @@
+import { createComponent as a } from "@lit/react";
+import * as e from "react";
+import "../../components/toc/toc.js";
+import t from "../../components/toc/toc.component.js";
+const o = "dap-ds-toc", n = a({
+  tagName: o,
+  elementClass: t,
+  react: e,
+  events: {
+    onDdsAnchorChange: "dds-anchor-change"
+  },
+  displayName: "DapDSTOC"
+});
+export {
+  n as default
+};
+//# sourceMappingURL=index.js.map

package/dist/react/dap-ds-toc/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":["../../../src/react/dap-ds-toc/index.ts"],"sourcesContent":["\n      import { createComponent } from '@lit/react'\n      import { type EventName } from '@lit/react'\n      import * as React from 'react'\n\n      import Component from '../../components/toc/toc.js'\n      import type { DdsAnchorChangeEvent } from '../../events/events'\n      export type { DdsAnchorChangeEvent } from '../../events/events'\n\n      const tagName = 'dap-ds-toc'\n\n      /**\n * `dap-ds-toc`\n * @summary A table of contents (TOC) is a list of links that allows users to quickly navigate to sections within a document.\n * @element dap-ds-toc\n * @title - toc\n *\n * @property { 'xs' | 'sm' | 'md' | 'lg' } size - The size of the TOC. Default is `lg.\n * @property {string} sizeMap - Responsive size map (e.g. \"md:lg\").\n *\n * @event {{ selectedItem: HTMLAnchorElement, anchorElement: IntersectionObserverEntry | HTMLElement }} dds-anchor-change - Event that is triggered when the anchor changes.\n *\n * @csspart base - The main container of the toc.\n *\n * @cssproperty --dds-toc-border-width - Width of the TOC border. (default: var(--dds-border-width-base))\n * @cssproperty --dds-toc-border-color - Color of the TOC border. (default: var(--dds-border-neutral-divider))\n * @cssproperty --dds-toc-title-color - Color of the TOC title. (default: var(--dds-text-neutral-strong))\n * @cssproperty --dds-toc-title-font-size - Font size of the TOC title. (default: var(--dds-font-base))\n * @cssproperty --dds-toc-title-font-weight - Font weight of the TOC title. (default: var(--dds-font-weight-bold))\n * @cssproperty --dds-toc-title-line-height - Line height of the TOC title. (default: 1.25)\n * @cssproperty --dds-toc-link-color - Color of the TOC links. (default: var(--dds-button-subtle-text-neutral-enabled))\n * @cssproperty --dds-toc-link-active-color - Color of the active TOC link. (default: var(--dds-button-subtle-text-enabled))\n * @cssproperty --dds-toc-link-border-color - Border color of the active TOC link. (default: var(--dds-border-brand-base))\n * @cssproperty --dds-toc-link-line-height - Line height of the TOC links. (default: 1.2)\n * @cssproperty --dds-toc-link-padding - Padding of the TOC links. (default: var(--dds-spacing-200))\n * @cssproperty --dds-toc-indent-level-0 - Indent level of the TOC items. (default: var(--dds-spacing-400))\n * @cssproperty --dds-toc-indent-level-1 - Indent level of the TOC items. (default: var(--dds-spacing-800))\n * @cssproperty --dds-toc-indent-level-2 - Indent level of the TOC items. (default: var(--dds-spacing-1200))\n * @cssproperty --dds-toc-indent-level-3 - Indent level of the TOC items. (default: var(--dds-spacing-1600))\n * @cssproperty --dds-toc-indent-level-4 - Indent level of the TOC items. (default: var(--dds-spacing-2000))\n * @cssproperty --dds-toc-indent-level-5 - Indent level of the TOC items. (default: var(--dds-spacing-2400))\n */\n      const reactWrapper = createComponent({\n        tagName,\n        elementClass: Component,\n        react: React,\n        events: {\n          onDdsAnchorChange: 'dds-anchor-change' as EventName<DdsAnchorChangeEvent>\n        },\n        displayName: \"DapDSTOC\"\n      })\n\n      export default reactWrapper\n    "],"names":["tagName","reactWrapper","createComponent","Component","React"],"mappings":";;;;AASM,MAAMA,IAAU,cAiCVC,IAAeC,EAAgB;AAAA,EACnC,SAAAF;AAAA,EACA,cAAcG;AAAAA,EACd,OAAOC;AAAA,EACP,QAAQ;AAAA,IACN,mBAAmB;AAAA,EACrB;AAAA,EACA,aAAa;AACf,CAAC;"}

package/dist/react/dap-ds-toggle-button/index.d.ts

@@ -1,4 +1,4 @@
-import { default as Component } from '../../components/toggle-button/toggle-button.component.js';
+import { default as Component } from '../../components/toggle-button/toggle-button.js';
 /**
  * `dap-ds-toggle-button` is a custom toggle button component.
  * @element dap-ds-toggle-button

package/dist/react/dap-ds-toggle-button/index.js

@@ -0,0 +1,15 @@
+import { createComponent as t } from "@lit/react";
+import * as e from "react";
+import "../../components/toggle-button/toggle-button.js";
+import o from "../../components/toggle-button/toggle-button.component.js";
+const a = "dap-ds-toggle-button", n = t({
+  tagName: a,
+  elementClass: o,
+  react: e,
+  events: {},
+  displayName: "DapDSToggleButton"
+});
+export {
+  n as default
+};
+//# sourceMappingURL=index.js.map

package/dist/react/dap-ds-toggle-button/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":["../../../src/react/dap-ds-toggle-button/index.ts"],"sourcesContent":["import { createComponent } from '@lit/react'\nimport * as React from 'react'\n\nimport Component from '../../components/toggle-button/toggle-button.js'\n\nconst tagName = 'dap-ds-toggle-button'\n\n/**\n * `dap-ds-toggle-button` is a custom toggle button component.\n * @element dap-ds-toggle-button\n * @summary A toggle button is a button that can be toggled on (active) or off (inactive).\n * @title - Toggle button\n *\n * @property { 'xs' | 'sm' | 'md' | 'lg' } size - The size of the toggle button. Default is `md`\n * @property {string} sizeMap - Responsive size map (e.g. \"md:lg\")\n *\n * @slot - The content of the toggle button.\n *\n * @csspart base - The main button container.\n * @csspart high-contrast - The high contrast part of the button.\n *\n * @cssproperty --dds-toggle-button-min-width-lg - Minimum width of the large toggle button (default: var(--dds-spacing-2400))\n * @cssproperty --dds-toggle-button-min-width-md - Minimum width of the medium toggle button (default: var(--dds-spacing-2000))\n * @cssproperty --dds-toggle-button-min-width-sm - Minimum width of the small toggle button (default: var(--dds-spacing-1200))\n * @cssproperty --dds-toggle-button-min-width-xs - Minimum width of the extra small toggle button (default: var(--dds-spacing-1200))\n * @cssproperty --dds-toggle-button-height-lg - Height of the large toggle button (default: var(--dds-spacing-1200))\n * @cssproperty --dds-toggle-button-height-md - Height of the medium toggle button (default: var(--dds-spacing-1000))\n * @cssproperty --dds-toggle-button-height-sm - Height of the small toggle button (default: var(--dds-spacing-800))\n * @cssproperty --dds-toggle-button-height-xs - Height of the extra small toggle button (default: var(--dds-spacing-600))\n * @cssproperty --dds-toggle-button-padding-lg - Padding of the large toggle button (default: var(--dds-spacing-300) var(--dds-spacing-400))\n * @cssproperty --dds-toggle-button-padding-md - Padding of the medium toggle button (default: var(--dds-spacing-300))\n * @cssproperty --dds-toggle-button-padding-sm - Padding of the small toggle button (default: var(--dds-spacing-200))\n * @cssproperty --dds-toggle-button-padding-xs - Padding of the extra small toggle button (default: var(--dds-spacing-150) var(--dds-spacing-200))\n * @cssproperty --dds-toggle-button-font-size-lg - Font size of the large toggle button (default: 1.125rem)\n * @cssproperty --dds-toggle-button-font-size-md - Font size of the medium toggle button (default: 1rem)\n * @cssproperty --dds-toggle-button-font-size-sm - Font size of the small toggle button (default: 0.875rem)\n * @cssproperty --dds-toggle-button-font-size-xs - Font size of the extra small toggle button (default: var(--dds-font-xs))\n * @cssproperty --dds-toggle-button-border-enabled - Border color in enabled state (default: var(--dds-button-toggle-border-enabled))\n * @cssproperty --dds-toggle-button-background-enabled - Background color in enabled state (default: var(--dds-button-toggle-background-enabled))\n * @cssproperty --dds-toggle-button-content-enabled - Content/text color in enabled state (default: var(--dds-button-toggle-content-enabled))\n * @cssproperty --dds-toggle-button-border-hover - Border color in hover state (default: var(--dds-button-toggle-border-hover))\n * @cssproperty --dds-toggle-button-background-hover - Background color in hover state (default: var(--dds-button-toggle-background-hover))\n * @cssproperty --dds-toggle-button-border-pressed - Border color in pressed state (default: var(--dds-button-toggle-border-pressed))\n * @cssproperty --dds-toggle-button-background-pressed - Background color in pressed state (default: var(--dds-button-toggle-background-pressed))\n * @cssproperty --dds-toggle-button-background-selected-enabled - Background color in selected enabled state (default: var(--dds-button-toggle-background-selected-enabled))\n * @cssproperty --dds-toggle-button-content-selected-enabled - Content/text color in selected enabled state (default: var(--dds-button-toggle-content-selected-enabled))\n * @cssproperty --dds-toggle-button-background-selected-hover - Background color in selected hover state (default: var(--dds-button-toggle-background-selected-hover))\n * @cssproperty --dds-toggle-button-background-selected-pressed - Background color in selected pressed state (default: var(--dds-button-toggle-background-selected-pressed))\n * @cssproperty --dds-toggle-button-border-disabled - Border color in disabled state (default: var(--dds-button-toggle-border-disabled))\n * @cssproperty --dds-toggle-button-background-disabled - Background color in disabled state (default: var(--dds-button-toggle-background-disabled))\n * @cssproperty --dds-toggle-button-content-disabled - Content/text color in disabled state (default: var(--dds-button-toggle-content-disabled))\n * @cssproperty --dds-toggle-button-highcontrast-border - High contrast border color (default: var(--dds-button-toggle-highcontrast-border))\n * @cssproperty --dds-toggle-button-highcontrast-border-hover - High contrast border color on hover (default: var(--dds-button-toggle-highcontrast-border-hover))\n *\n */\nconst reactWrapper = createComponent({\n  tagName,\n  elementClass: Component,\n  react: React,\n  events: {},\n  displayName: 'DapDSToggleButton',\n})\n\nexport default reactWrapper\n"],"names":["tagName","reactWrapper","createComponent","Component","React"],"mappings":";;;;AAKA,MAAMA,IAAU,wBAkDVC,IAAeC,EAAgB;AAAA,EACnC,SAAAF;AAAA,EACA,cAAcG;AAAAA,EACd,OAAOC;AAAA,EACP,QAAQ,CAAC;AAAA,EACT,aAAa;AACf,CAAC;"}

package/dist/react/dap-ds-tooltip/index.d.ts

@@ -1,4 +1,4 @@
-import { default as Component } from '../../components/tooltip/tooltip.component.js';
+import { default as Component } from '../../components/tooltip/tooltip.js';
 /**
  * `dap-ds-tooltip`
  * @summary A tooltip is a container for tooltip content.

package/dist/react/dap-ds-tooltip/index.js

@@ -0,0 +1,15 @@
+import { createComponent as t } from "@lit/react";
+import * as o from "react";
+import "../../components/tooltip/tooltip.js";
+import a from "../../components/tooltip/tooltip.component.js";
+const e = "dap-ds-tooltip", s = t({
+  tagName: e,
+  elementClass: a,
+  react: o,
+  events: {},
+  displayName: "DapDSTooltip"
+});
+export {
+  s as default
+};
+//# sourceMappingURL=index.js.map

package/dist/react/dap-ds-tooltip/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":["../../../src/react/dap-ds-tooltip/index.ts"],"sourcesContent":["import { createComponent } from '@lit/react'\nimport * as React from 'react'\n\nimport Component from '../../components/tooltip/tooltip.js'\n\nconst tagName = 'dap-ds-tooltip'\n\n/**\n * `dap-ds-tooltip`\n * @summary A tooltip is a container for tooltip content.\n * @element dap-ds-tooltip\n * @title - Tooltip\n *\n * @slot - The content of the tooltip.\n * @slot trigger - The trigger element of the tooltip.\n *\n * @csspart base - The main tooltip container.\n * @csspart trigger - The trigger element of the tooltip.\n * @csspart popup - The popup of the tooltip.\n * @csspart arrow - The arrow of the tooltip.\n *\n * @cssproperty --dds-tooltip-max-width - The maximum width of the tooltip before its content will wrap (default: 14rem)\n * @cssproperty --dds-tooltip-padding - The padding inside the tooltip (default: var(--dds-spacing-400))\n * @cssproperty --dds-tooltip-border-color - The border color of the tooltip (default: var(--dds-border-neutral-subtle))\n * @cssproperty --dds-tooltip-bg-color - The background color of the tooltip (default: var(--dds-background-neutral-base))\n * @cssproperty --dds-tooltip-text-color - The text color of the tooltip (default: var(--dds-text-neutral-base))\n * @cssproperty --dds-tooltip-font-size - The font size of the tooltip text (default: var(--dds-font-sm))\n * @cssproperty --dds-tooltip-box-shadow - The box shadow of the tooltip (default: 0 8px 12px -2px rgb(0 0 0 / 8%), 0 2px 6px -2px rgb(0 0 0 / 6%))\n */\nconst reactWrapper = createComponent({\n  tagName,\n  elementClass: Component,\n  react: React,\n  events: {},\n  displayName: 'DapDSTooltip',\n})\n\nexport default reactWrapper\n"],"names":["tagName","reactWrapper","createComponent","Component","React"],"mappings":";;;;AAKA,MAAMA,IAAU,kBAwBVC,IAAeC,EAAgB;AAAA,EACnC,SAAAF;AAAA,EACA,cAAcG;AAAAA,EACd,OAAOC;AAAA,EACP,QAAQ,CAAC;AAAA,EACT,aAAa;AACf,CAAC;"}

package/dist/react/dap-ds-tray/index.d.ts

@@ -1,5 +1,5 @@
 import { EventName } from '@lit/react';
-import { default as Component } from '../../components/tray/tray.component.js';
+import { default as Component } from '../../components/tray/tray.js';
 import { DdsBeforeOpenEvent, DdsOpenedEvent, DdsBeforeCloseEvent, DdsClosedEvent, DdsCloseEvent } from '../../events/events';
 export type { DdsBeforeOpenEvent } from '../../events/events';
 export type { DdsOpenedEvent } from '../../events/events';

package/dist/react/dap-ds-tray/index.js

@@ -0,0 +1,21 @@
+import { createComponent as e } from "@lit/react";
+import * as o from "react";
+import "../../components/tray/tray.js";
+import s from "../../components/tray/tray.component.js";
+const d = "dap-ds-tray", p = e({
+  tagName: d,
+  elementClass: s,
+  react: o,
+  events: {
+    onDdsBeforeOpen: "dds-before-open",
+    onDdsOpened: "dds-opened",
+    onDdsBeforeClose: "dds-before-close",
+    onDdsClosed: "dds-closed",
+    onDdsClose: "dds-close"
+  },
+  displayName: "DapDSTray"
+});
+export {
+  p as default
+};
+//# sourceMappingURL=index.js.map

package/dist/react/dap-ds-tray/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":["../../../src/react/dap-ds-tray/index.ts"],"sourcesContent":["\n      import { createComponent } from '@lit/react'\n      import { type EventName } from '@lit/react'\n      import * as React from 'react'\n\n      import Component from '../../components/tray/tray.js'\n      import type { DdsBeforeOpenEvent } from '../../events/events'\nimport type { DdsOpenedEvent } from '../../events/events'\nimport type { DdsBeforeCloseEvent } from '../../events/events'\nimport type { DdsClosedEvent } from '../../events/events'\nimport type { DdsCloseEvent } from '../../events/events'\n      export type { DdsBeforeOpenEvent } from '../../events/events'\nexport type { DdsOpenedEvent } from '../../events/events'\nexport type { DdsBeforeCloseEvent } from '../../events/events'\nexport type { DdsClosedEvent } from '../../events/events'\nexport type { DdsCloseEvent } from '../../events/events'\n\n      const tagName = 'dap-ds-tray'\n\n      /**\n * `dap-ds-tray`\n * @summary A tray is a container for slide in content.\n * @element dap-ds-tray\n * @title - Tray\n *\n * @property {boolean} open - The open state of the tray.\n * @property {boolean} noModal - Whether the tray should have a modal overlay. Default is false. If true the tray will use the .show() method, if false the tray will use the .showModal() method.\n * @property {boolean} closeOnEsc - Whether the tray should close on pressing the escape key. Default is true.\n * @property {boolean} closeOnOverlayClick - Whether the tray should close on clicking the overlay. Default is true.\n * @property {string} closeButton - Whether the tray should have a close button. Default is true.\n * @property {string} title - The title of the tray.\n * @property {string} description - The description of the tray.\n * @property {string} okButtonLabel - The label of the OK button.\n * @property {string} cancelButtonLabel - The label of the Cancel button.\n * @property { 'sm' | 'lg' } size - The size of the tray. Default is 'sm'.\n * @property {string} footer - Whether the tray should have a footer. Default is false.\n * @property {string} header - Whether the tray should have a header. Default is false.\n *\n * @event {{ void }} dds-before-open - Fires before the tray opens.\n * @event {{ void }} dds-opened - Fires after the tray opens.\n * @event {{ void }} dds-before-close - Fires before the tray closes.\n * @event {{ void }} dds-closed - Fires after the tray closed.\n * @event {{ void }} dds-close - Fires when the tray is closes. You can prevent the tray from closing by calling `event.preventDefault()`.\n *\n * @slot - The content of the tray.\n * @slot header - The header of the tray.\n * @slot footer - The footer of the tray.\n *\n * @cssproperty --dds-modal-max-block-size - Maximum height of the modal. (default: 80vh)\n * @cssproperty --dds-modal-max-inline-size - Maximum width of the modal. (default: 600px)\n * @cssproperty --dds-modal-padding-sm - Padding inside the modal. (default: var(--dds-spacing-600))\n * @cssproperty --dds-modal-padding-lg - Padding inside the modal. (default: var(--dds-spacing-1200))\n * @cssproperty --dds-modal-transform-amount - Amount to transform for entrance animation. (default: 2rem)\n * @cssproperty --dds-modal-transition-speed - Speed of transition animations. (default: var(--dds-transition-fast))\n * @cssproperty --dds-modal-transition-timing - Timing function for transitions. (default: var(--dds-easing-ease-in-out))\n * @cssproperty --dds-modal-border-width - Border width of the modal. (default: var(--dds-border-width-base))\n * @cssproperty --dds-modal-border-color - Border color of the modal. (default: var(--dds-border-neutral-divider))\n * @cssproperty --dds-modal-border-radius - Border radius of the modal. (default: var(--dds-radius-large, 16px))\n * @cssproperty --dds-modal-background - Background color of the modal. (default: var(--dds-background-neutral-subtle))\n * @cssproperty --dds-modal-header-margin-sm - Margin below the header. (default: var(--dds-spacing-400))\n * @cssproperty --dds-modal-header-margin-lg - Margin below the header. (default: var(--dds-spacing-600))\n * @cssproperty --dds-modal-footer-margin-sm - Margin above the footer. (default: var(--dds-spacing-400))\n * @cssproperty --dds-modal-footer-margin-lg - Margin above the footer. (default: var(--dds-spacing-600))\n * @cssproperty --dds-modal-footer-gap - Gap between footer elements. (default: var(--dds-spacing-400))\n * @cssproperty --dds-modal-close-margin - Margin for the close button. (default: var(--dds-spacing-300))\n * @cssproperty --dds-tray-width-side - Width of the side (left/right) trays. (default: 250px)\n * @cssproperty --dds-tray-min-width-horizontal - Minimum width of the horizontal (top/bottom) trays. (default: 400px)\n * @cssproperty --dds-tray-min-height-horizontal - Minimum height of the horizontal (top/bottom) trays. (default: 300px)\n * @cssproperty --dds-tray-min-height-vertical - Minimum height of the vertical (left/right) trays. (default: 100%)\n * @cssproperty --dds-tray-transform-duration - Duration of the transform animation. (default: 0.3s)\n * @cssproperty --dds-tray-transform-timing - Timing function for the transform animation. (default: ease-in-out)\n *\n * @csspart base - The main tray container.\n * @csspart panel - The panel of the tray.\n * @csspart header - The header of the tray.\n * @csspart footer - The footer of the tray.\n * @csspart content - The content of the tray.\n * @csspart body - The body of the tray.\n *\n */\n      const reactWrapper = createComponent({\n        tagName,\n        elementClass: Component,\n        react: React,\n        events: {\n          onDdsBeforeOpen: 'dds-before-open' as EventName<DdsBeforeOpenEvent>,\nonDdsOpened: 'dds-opened' as EventName<DdsOpenedEvent>,\nonDdsBeforeClose: 'dds-before-close' as EventName<DdsBeforeCloseEvent>,\nonDdsClosed: 'dds-closed' as EventName<DdsClosedEvent>,\nonDdsClose: 'dds-close' as EventName<DdsCloseEvent>\n        },\n        displayName: \"DapDSTray\"\n      })\n\n      export default reactWrapper\n    "],"names":["tagName","reactWrapper","createComponent","Component","React"],"mappings":";;;;AAiBM,MAAMA,IAAU,eA+DVC,IAAeC,EAAgB;AAAA,EACnC,SAAAF;AAAA,EACA,cAAcG;AAAAA,EACd,OAAOC;AAAA,EACP,QAAQ;AAAA,IACN,iBAAiB;AAAA,IAC3B,aAAa;AAAA,IACb,kBAAkB;AAAA,IAClB,aAAa;AAAA,IACb,YAAY;AAAA,EACJ;AAAA,EACA,aAAa;AACf,CAAC;"}

package/dist/react/dap-ds-typography/index.d.ts

@@ -1,4 +1,4 @@
-import { default as Component } from '../../components/typography/typography.component.js';
+import { default as Component } from '../../components/typography/typography.js';
 /**
  * @element dap-ds-typography
  * @summary Typography is used to display text in different styles.

package/dist/react/dap-ds-typography/index.js

@@ -0,0 +1,15 @@
+import { createComponent as a } from "@lit/react";
+import * as p from "react";
+import "../../components/typography/typography.js";
+import t from "../../components/typography/typography.component.js";
+const e = "dap-ds-typography", s = a({
+  tagName: e,
+  elementClass: t,
+  react: p,
+  events: {},
+  displayName: "DapDSTypography"
+});
+export {
+  s as default
+};
+//# sourceMappingURL=index.js.map

package/dist/react/dap-ds-typography/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":["../../../src/react/dap-ds-typography/index.ts"],"sourcesContent":["import { createComponent } from '@lit/react'\nimport * as React from 'react'\n\nimport Component from '../../components/typography/typography.js'\n\nconst tagName = 'dap-ds-typography'\n\n/**\n * @element dap-ds-typography\n * @summary Typography is used to display text in different styles.\n * @title - Typography\n *\n * @slot default - The content of the typography.\n *\n * @csspart base - The main typography container.\n *\n * @cssproperty --dds-text-color - The color of the typography. (default: var(--dds-text-neutral-base))\n * @cssproperty --dds-text-color-inverted - The color of the typography in inverted mode. (default: var(--dds-text-neutral-on-inverted))\n * @cssproperty --dds-text-heading-color - The color of the heading typography. (default: var(--dds-text-neutral-strong))\n * @cssproperty --dds-text-heading-color-inverted - The color of the heading typography in inverted mode. (default: var(--dds-text-neutral-on-inverted))\n * @cssproperty --dds-text-description-color - The color of the subtle typography. (default: var(--dds-text-neutral-subtle))\n * @cssproperty --dds-text-description-color-inverted - The color of the subtle typography in inverted mode. (default: var(--dds-text-neutral-on-inverted))\n * @cssproperty --dds-text-font-family - The font family of the typography. (default: var(--font-family))\n * @cssproperty --dds-text-font-weight-medium - The font weight of the medium typography. (default: var(--dds-font-weight-medium))\n * @cssproperty --dds-text-font-weight-bold - The font weight of the bold typography. (default: var(--dds-font-weight-bold))\n * @cssproperty --dds-text-font-size-h1 - The font size of the h1 typography. (default: var(--dds-font-7xl))\n * @cssproperty --dds-text-font-size-h2 - The font size of the h2 typography. (default: var(--dds-font-4xl))\n * @cssproperty --dds-text-font-size-h3 - The font size of the h3 typography. (default: var(--dds-font-2xl))\n * @cssproperty --dds-text-font-size-h4 - The font size of the h4 typography. (default: var(--dds-font-xl))\n * @cssproperty --dds-text-font-size-h5 - The font size of the h5 typography. (default: var(--dds-font-lg))\n * @cssproperty --dds-text-font-size-h6 - The font size of the h6 typography. (default: var(--dds-font-base))\n * @cssproperty --dds-text-font-size-body - The font size of the body typography. (default: var(--dds-font-base))\n * @cssproperty --dds-text-font-size-caption - The font size of the caption typography. (default: var(--dds-font-xs))\n * @cssproperty --dds-text-font-size-description - The font size of the description typography. (default: var(--dds-font-base))\n * @cssproperty --dds-text-font-size-description-lg - The font size of the description lg typography. (default: var(--dds-font-base))\n * @cssproperty --dds-text-font-size-description-sm - The font size of the description sm typography. (default: var(--dds-font-sm))\n * @cssproperty --dds-text-font-size-lg - The font size of the lg typography. (default: var(--dds-font-lg))\n * @cssproperty --dds-text-font-size-md - The font size of the md typography. (default: var(--dds-font-base))\n * @cssproperty --dds-text-font-size-sm - The font size of the sm typography. (default: var(--dds-font-sm))\n * @cssproperty --dds-text-font-size-xs - The font size of the xs typography. (default: var(--dds-font-xs))\n */\nconst reactWrapper = createComponent({\n  tagName,\n  elementClass: Component,\n  react: React,\n  events: {},\n  displayName: 'DapDSTypography',\n})\n\nexport default reactWrapper\n"],"names":["tagName","reactWrapper","createComponent","Component","React"],"mappings":";;;;AAKA,MAAMA,IAAU,qBAoCVC,IAAeC,EAAgB;AAAA,EACnC,SAAAF;AAAA,EACA,cAAcG;AAAAA,EACd,OAAOC;AAAA,EACP,QAAQ,CAAC;AAAA,EACT,aAAa;AACf,CAAC;"}

package/dist/react/index.d.ts

@@ -1,7 +1,7 @@
 export { default as DapDSAccordionReact } from './dap-ds-accordion/index.js';
 export { default as DapDSAvatarReact } from './dap-ds-avatar/index.js';
-export { default as DapDSAccordionGroupReact } from './dap-ds-accordion-group/index.js';
 export { default as DapDSAnchorHeadingReact } from './dap-ds-anchor-heading/index.js';
+export { default as DapDSAccordionGroupReact } from './dap-ds-accordion-group/index.js';
 export { default as DapDSAvatarGroupReact } from './dap-ds-avatar-group/index.js';
 export { default as DapDSBadgeReact } from './dap-ds-badge/index.js';
 export { default as DapDSBannerReact } from './dap-ds-banner/index.js';
@@ -9,14 +9,14 @@ export { default as DapDSBreadcrumbReact } from './dap-ds-breadcrumb/index.js';
 export { default as DapDSBreadcrumbItemReact } from './dap-ds-breadcrumb-item/index.js';
 export { default as DapDSButtonReact } from './dap-ds-button/index.js';
 export { default as DapDSCalloutReact } from './dap-ds-callout/index.js';
+export { default as DapDSCalendarCellReact } from './dap-ds-calendar-cell/index.js';
+export { default as DapDSCalendarReact } from './dap-ds-calendar/index.js';
 export { default as DapDSCardActionsReact } from './dap-ds-card-actions/index.js';
 export { default as DapDSCardContentReact } from './dap-ds-card-content/index.js';
 export { default as DapDSCardImageReact } from './dap-ds-card-image/index.js';
 export { default as DapDSCardSubtitleReact } from './dap-ds-card-subtitle/index.js';
 export { default as DapDSCardTitleReact } from './dap-ds-card-title/index.js';
 export { default as DapDSCardReact } from './dap-ds-card/index.js';
-export { default as DapDSCalendarCellReact } from './dap-ds-calendar-cell/index.js';
-export { default as DapDSCalendarReact } from './dap-ds-calendar/index.js';
 export { default as DapDSCheckboxReact } from './dap-ds-checkbox/index.js';
 export { default as DapDSChipReact } from './dap-ds-chip/index.js';
 export { default as DapDSCodePuncherSlotReact } from './dap-ds-code-puncher-slot/index.js';
@@ -46,10 +46,10 @@ export { default as DapDSListItemReact } from './dap-ds-list-item/index.js';
 export { default as DapDSModalReact } from './dap-ds-modal/index.js';
 export { default as DapDSNavigationMenuItemReact } from './dap-ds-navigation-menu-item/index.js';
 export { default as DapDSNavigationMenuReact } from './dap-ds-navigation-menu/index.js';
+export { default as DapDSNotificationBadgeReact } from './dap-ds-notification-badge/index.js';
 export { default as DapDSNumberInputReact } from './dap-ds-number-input/index.js';
 export { default as DapDSOfficialWebsiteBannerReact } from './dap-ds-official-website-banner/index.js';
 export { default as DapDSOptionGroupReact } from './dap-ds-option-group/index.js';
-export { default as DapDSNotificationBadgeReact } from './dap-ds-notification-badge/index.js';
 export { default as DapDSOptionItemReact } from './dap-ds-option-item/index.js';
 export { default as DapDSOptionListReact } from './dap-ds-option-list/index.js';
 export { default as DapDSOverlayReact } from './dap-ds-overlay/index.js';
@@ -82,9 +82,9 @@ export { default as DapDSTableReact } from './dap-ds-table/index.js';
 export { default as DapDSTextareaReact } from './dap-ds-textarea/index.js';
 export { default as DapDSTimelineItemReact } from './dap-ds-timeline-item/index.js';
 export { default as DapDSTimelineReact } from './dap-ds-timeline/index.js';
-export { default as DapDSTOCReact } from './dap-ds-toc/index.js';
 export { default as DapDSTimeGridReact } from './dap-ds-time-grid/index.js';
 export { default as DapDSTimePickerReact } from './dap-ds-timepicker/index.js';
+export { default as DapDSTOCReact } from './dap-ds-toc/index.js';
 export { default as DapDSToggleButtonReact } from './dap-ds-toggle-button/index.js';
 export { default as DapDSTooltipReact } from './dap-ds-tooltip/index.js';
 export { default as DapDSTrayReact } from './dap-ds-tray/index.js';
@@ -125,18 +125,14 @@ export { default as DocumentFileVideoLineReact } from './dap-ds-icon-file-video-
 export { default as DocumentFolderLineReact } from './dap-ds-icon-folder-line/index.js';
 export { default as DocumentFolderOpenLineReact } from './dap-ds-icon-folder-open-line/index.js';
 export { default as EditorSeparatorReact } from './dap-ds-icon-separator/index.js';
-export { default as HealthHeartFillReact } from './dap-ds-icon-heart-fill/index.js';
 export { default as HealthHeartLineReact } from './dap-ds-icon-heart-line/index.js';
+export { default as HealthHeartFillReact } from './dap-ds-icon-heart-fill/index.js';
 export { default as OthersCookieLineReact } from './dap-ds-icon-cookie-line/index.js';
-export { default as UserAccountCircleFillReact } from './dap-ds-icon-account-circle-fill/index.js';
-export { default as UserAccountCircleLineReact } from './dap-ds-icon-account-circle-line/index.js';
-export { default as UserUserFillReact } from './dap-ds-icon-user-fill/index.js';
-export { default as UserUserLineReact } from './dap-ds-icon-user-line/index.js';
 export { default as SystemAddLineReact } from './dap-ds-icon-add-line/index.js';
 export { default as SystemAlertFillReact } from './dap-ds-icon-alert-fill/index.js';
-export { default as SystemAlertLineReact } from './dap-ds-icon-alert-line/index.js';
 export { default as SystemCheckLineReact } from './dap-ds-icon-check-line/index.js';
 export { default as SystemCheckLine2React } from './dap-ds-icon-check-line2/index.js';
+export { default as SystemAlertLineReact } from './dap-ds-icon-alert-line/index.js';
 export { default as SystemCheckboxBlankCircleFillReact } from './dap-ds-icon-checkbox-blank-circle-fill/index.js';
 export { default as SystemCheckboxBlankCircleFillCheckReact } from './dap-ds-icon-checkbox-blank-circle-fill-check/index.js';
 export { default as SystemCheckboxBlankCircleLineReact } from './dap-ds-icon-checkbox-blank-circle-line/index.js';
@@ -180,3 +176,7 @@ export { default as SystemUpload2LineReact } from './dap-ds-icon-upload-2-line/i
 export { default as SystemUploadLineReact } from './dap-ds-icon-upload-line/index.js';
 export { default as SystemZoomInLineReact } from './dap-ds-icon-zoom-in-line/index.js';
 export { default as SystemZoomOutLineReact } from './dap-ds-icon-zoom-out-line/index.js';
+export { default as UserAccountCircleFillReact } from './dap-ds-icon-account-circle-fill/index.js';
+export { default as UserAccountCircleLineReact } from './dap-ds-icon-account-circle-line/index.js';
+export { default as UserUserFillReact } from './dap-ds-icon-user-fill/index.js';
+export { default as UserUserLineReact } from './dap-ds-icon-user-line/index.js';

package/dist/react-types.ts

@@ -5,8 +5,8 @@ type HtmlType = { children?: React.ReactNode | Element, class?: string, ref?: Re
   
 export type DapDSAccordionType = HtmlType & Partial<Omit<DDS.DapDSAccordion, 'children' | 'style'>> & { "ondds-opened"?: (e: DdsOpenedEvent) => void, "ondds-closed"?: (e: DdsClosedEvent) => void }
 export type DapDSAvatarType = HtmlType & Partial<Omit<DDS.DapDSAvatar, 'children' | 'style'>> & { "ondds-load"?: (e: DdsLoadEvent) => void, "ondds-error"?: (e: DdsErrorEvent) => void }
-export type DapDSAccordionGroupType = HtmlType & Partial<Omit<DDS.DapDSAccordionGroup, 'children' | 'style'>>
 export type DapDSAnchorHeadingType = HtmlType & Partial<Omit<DDS.DapDSAnchorHeading, 'children' | 'style'>>
+export type DapDSAccordionGroupType = HtmlType & Partial<Omit<DDS.DapDSAccordionGroup, 'children' | 'style'>>
 export type DapDSAvatarGroupType = HtmlType & Partial<Omit<DDS.DapDSAvatarGroup, 'children' | 'style'>> & { "ondds-overflow-click"?: (e: DdsOverflowClickEvent) => void }
 export type DapDSBadgeType = HtmlType & Partial<Omit<DDS.DapDSBadge, 'children' | 'style'>>
 export type DapDSBannerType = HtmlType & Partial<Omit<DDS.DapDSBanner, 'children' | 'style'>> & { "ondds-close"?: (e: DdsCloseEvent) => void }
@@ -14,14 +14,14 @@ export type DapDSBreadcrumbType = HtmlType & Partial<Omit<DDS.DapDSBreadcrumb, '
 export type DapDSBreadcrumbItemType = HtmlType & Partial<Omit<DDS.DapDSBreadcrumbItem, 'children' | 'style'>>
 export type DapDSButtonType = HtmlType & Partial<Omit<DDS.DapDSButton, 'children' | 'style'>> & { "ondds-loading-timeout"?: (e: DdsLoadingTimeoutEvent) => void }
 export type DapDSCalloutType = HtmlType & Partial<Omit<DDS.DapDSCallout, 'children' | 'style'>> & { "ondds-close"?: (e: DdsCloseEvent) => void }
+export type DapDSCalendarCellType = HtmlType & Partial<Omit<DDS.DapDSCalendarCell, 'children' | 'style'>>
+export type DapDSCalendarType = HtmlType & Partial<Omit<DDS.DapDSCalendar, 'children' | 'style'>> & { "ondds-change"?: (e: DdsChangeEvent) => void }
 export type DapDSCardActionsType = HtmlType & Partial<Omit<DDS.DapDSCardActions, 'children' | 'style'>>
 export type DapDSCardContentType = HtmlType & Partial<Omit<DDS.DapDSCardContent, 'children' | 'style'>>
 export type DapDSCardImageType = HtmlType & Partial<Omit<DDS.DapDSCardImage, 'children' | 'style'>>
 export type DapDSCardSubtitleType = HtmlType & Partial<Omit<DDS.DapDSCardSubtitle, 'children' | 'style'>>
 export type DapDSCardTitleType = HtmlType & Partial<Omit<DDS.DapDSCardTitle, 'children' | 'style'>>
 export type DapDSCardType = HtmlType & Partial<Omit<DDS.DapDSCard, 'children' | 'style'>>
-export type DapDSCalendarCellType = HtmlType & Partial<Omit<DDS.DapDSCalendarCell, 'children' | 'style'>>
-export type DapDSCalendarType = HtmlType & Partial<Omit<DDS.DapDSCalendar, 'children' | 'style'>> & { "ondds-change"?: (e: DdsChangeEvent) => void }
 export type DapDSCheckboxType = HtmlType & Partial<Omit<DDS.DapDSCheckbox, 'children' | 'style'>> & { "ondds-change"?: (e: DdsChangeEvent) => void, "ondds-blur"?: (e: DdsBlurEvent) => void, "ondds-focus"?: (e: DdsFocusEvent) => void, "ondds-input"?: (e: DdsInputEvent) => void }
 export type DapDSChipType = HtmlType & Partial<Omit<DDS.DapDSChip, 'children' | 'style'>> & { "ondds-remove"?: (e: DdsRemoveEvent) => void, "ondds-select"?: (e: DdsSelectEvent) => void }
 export type DapDSCodePuncherSlotType = HtmlType & Partial<Omit<DDS.DapDSCodePuncherSlot, 'children' | 'style'>>
@@ -51,10 +51,10 @@ export type DapDSListItemType = HtmlType & Partial<Omit<DDS.DapDSListItem, 'chil
 export type DapDSModalType = HtmlType & Partial<Omit<DDS.DapDSModal, 'children' | 'style'>> & { "ondds-before-open"?: (e: DdsBeforeOpenEvent) => void, "ondds-opened"?: (e: DdsOpenedEvent) => void, "ondds-before-close"?: (e: DdsBeforeCloseEvent) => void, "ondds-closed"?: (e: DdsClosedEvent) => void, "ondds-close"?: (e: DdsCloseEvent) => void, "ondds-ok"?: (e: DdsOkEvent) => void, "ondds-cancel"?: (e: DdsCancelEvent) => void }
 export type DapDSNavigationMenuItemType = HtmlType & Partial<Omit<DDS.DapDSNavigationMenuItem, 'children' | 'style'>> & { "ondds-navigation-item-click"?: (e: DdsNavigationItemClickEvent) => void, "ondds-navigation-dropdown-open"?: (e: DdsNavigationDropdownOpenEvent) => void }
 export type DapDSNavigationMenuType = HtmlType & Partial<Omit<DDS.DapDSNavigationMenu, 'children' | 'style'>> & { "ondds-navigation-item-click"?: (e: DdsNavigationItemClickEvent) => void }
+export type DapDSNotificationBadgeType = HtmlType & Partial<Omit<DDS.DapDSNotificationBadge, 'children' | 'style'>>
 export type DapDSNumberInputType = HtmlType & Partial<Omit<DDS.DapDSNumberInput, 'children' | 'style'>> & { "ondds-change"?: (e: DdsChangeEvent) => void, "ondds-input"?: (e: DdsInputEvent) => void, "ondds-keydown"?: (e: DdsKeydownEvent) => void, "ondds-blur"?: (e: DdsBlurEvent) => void, "ondds-focus"?: (e: DdsFocusEvent) => void }
 export type DapDSOfficialWebsiteBannerType = HtmlType & Partial<Omit<DDS.DapDSOfficialWebsiteBanner, 'children' | 'style'>> & { "ondds-opened"?: (e: DdsOpenedEvent) => void, "ondds-closed"?: (e: DdsClosedEvent) => void }
 export type DapDSOptionGroupType = HtmlType & Partial<Omit<DDS.DapDSOptionGroup, 'children' | 'style'>>
-export type DapDSNotificationBadgeType = HtmlType & Partial<Omit<DDS.DapDSNotificationBadge, 'children' | 'style'>>
 export type DapDSOptionItemType = HtmlType & Partial<Omit<DDS.DapDSOptionItem, 'children' | 'style'>>
 export type DapDSOptionListType = HtmlType & Partial<Omit<DDS.DapDSOptionList, 'children' | 'style'>> & { "ondds-cancel"?: (e: DdsCancelEvent) => void, "ondds-option-change"?: (e: DdsOptionChangeEvent) => void, "ondds-keydown"?: (e: DdsKeydownEvent) => void, "ondds-list-changed"?: (e: DdsListChangedEvent) => void }
 export type DapDSOverlayType = HtmlType & Partial<Omit<DDS.DapDSOverlay, 'children' | 'style'>> & { "ondds-before-open"?: (e: DdsBeforeOpenEvent) => void, "ondds-opened"?: (e: DdsOpenedEvent) => void, "ondds-before-close"?: (e: DdsBeforeCloseEvent) => void, "ondds-closed"?: (e: DdsClosedEvent) => void }
@@ -87,9 +87,9 @@ export type DapDSTableType = HtmlType & Partial<Omit<DDS.DapDSTable, 'children'
 export type DapDSTextareaType = HtmlType & Partial<Omit<DDS.DapDSTextarea, 'children' | 'style'>> & { "ondds-count-change"?: (e: DdsCountChangeEvent) => void, "ondds-change"?: (e: DdsChangeEvent) => void, "ondds-input"?: (e: DdsInputEvent) => void, "ondds-keydown"?: (e: DdsKeydownEvent) => void, "ondds-blur"?: (e: DdsBlurEvent) => void, "ondds-focus"?: (e: DdsFocusEvent) => void, "ondds-select"?: (e: DdsSelectEvent) => void }
 export type DapDSTimelineItemType = HtmlType & Partial<Omit<DDS.DapDSTimelineItem, 'children' | 'style'>>
 export type DapDSTimelineType = HtmlType & Partial<Omit<DDS.DapDSTimeline, 'children' | 'style'>>
-export type DapDSTOCType = HtmlType & Partial<Omit<DDS.DapDSTOC, 'children' | 'style'>> & { "ondds-anchor-change"?: (e: DdsAnchorChangeEvent) => void }
 export type DapDSTimeGridType = HtmlType & Partial<Omit<DDS.DapDSTimeGrid, 'children' | 'style'>> & { "ondds-change"?: (e: DdsChangeEvent) => void, "ondds-close"?: (e: DdsCloseEvent) => void }
 export type DapDSTimePickerType = HtmlType & Partial<Omit<DDS.DapDSTimePicker, 'children' | 'style'>> & { "ondds-change"?: (e: DdsChangeEvent) => void, "ondds-input"?: (e: DdsInputEvent) => void, "ondds-valid-time"?: (e: DdsValidTimeEvent) => void, "ondds-invalid-time"?: (e: DdsInvalidTimeEvent) => void, "ondds-clear"?: (e: DdsClearEvent) => void, "ondds-focus"?: (e: DdsFocusEvent) => void, "ondds-blur"?: (e: DdsBlurEvent) => void }
+export type DapDSTOCType = HtmlType & Partial<Omit<DDS.DapDSTOC, 'children' | 'style'>> & { "ondds-anchor-change"?: (e: DdsAnchorChangeEvent) => void }
 export type DapDSToggleButtonType = HtmlType & Partial<Omit<DDS.DapDSToggleButton, 'children' | 'style'>>
 export type DapDSTooltipType = HtmlType & Partial<Omit<DDS.DapDSTooltip, 'children' | 'style'>>
 export type DapDSTrayType = HtmlType & Partial<Omit<DDS.DapDSTray, 'children' | 'style'>> & { "ondds-before-open"?: (e: DdsBeforeOpenEvent) => void, "ondds-opened"?: (e: DdsOpenedEvent) => void, "ondds-before-close"?: (e: DdsBeforeCloseEvent) => void, "ondds-closed"?: (e: DdsClosedEvent) => void, "ondds-close"?: (e: DdsCloseEvent) => void }
@@ -130,18 +130,14 @@ export type DocumentFileVideoLineType = HtmlType & Partial<Omit<DDS.DocumentFile
 export type DocumentFolderLineType = HtmlType & Partial<Omit<DDS.DocumentFolderLine, 'children' | 'style'>>
 export type DocumentFolderOpenLineType = HtmlType & Partial<Omit<DDS.DocumentFolderOpenLine, 'children' | 'style'>>
 export type EditorSeparatorType = HtmlType & Partial<Omit<DDS.EditorSeparator, 'children' | 'style'>>
-export type HealthHeartFillType = HtmlType & Partial<Omit<DDS.HealthHeartFill, 'children' | 'style'>>
 export type HealthHeartLineType = HtmlType & Partial<Omit<DDS.HealthHeartLine, 'children' | 'style'>>
+export type HealthHeartFillType = HtmlType & Partial<Omit<DDS.HealthHeartFill, 'children' | 'style'>>
 export type OthersCookieLineType = HtmlType & Partial<Omit<DDS.OthersCookieLine, 'children' | 'style'>>
-export type UserAccountCircleFillType = HtmlType & Partial<Omit<DDS.UserAccountCircleFill, 'children' | 'style'>>
-export type UserAccountCircleLineType = HtmlType & Partial<Omit<DDS.UserAccountCircleLine, 'children' | 'style'>>
-export type UserUserFillType = HtmlType & Partial<Omit<DDS.UserUserFill, 'children' | 'style'>>
-export type UserUserLineType = HtmlType & Partial<Omit<DDS.UserUserLine, 'children' | 'style'>>
 export type SystemAddLineType = HtmlType & Partial<Omit<DDS.SystemAddLine, 'children' | 'style'>>
 export type SystemAlertFillType = HtmlType & Partial<Omit<DDS.SystemAlertFill, 'children' | 'style'>>
-export type SystemAlertLineType = HtmlType & Partial<Omit<DDS.SystemAlertLine, 'children' | 'style'>>
 export type SystemCheckLineType = HtmlType & Partial<Omit<DDS.SystemCheckLine, 'children' | 'style'>>
 export type SystemCheckLine2Type = HtmlType & Partial<Omit<DDS.SystemCheckLine2, 'children' | 'style'>>
+export type SystemAlertLineType = HtmlType & Partial<Omit<DDS.SystemAlertLine, 'children' | 'style'>>
 export type SystemCheckboxBlankCircleFillType = HtmlType & Partial<Omit<DDS.SystemCheckboxBlankCircleFill, 'children' | 'style'>>
 export type SystemCheckboxBlankCircleFillCheckType = HtmlType & Partial<Omit<DDS.SystemCheckboxBlankCircleFillCheck, 'children' | 'style'>>
 export type SystemCheckboxBlankCircleLineType = HtmlType & Partial<Omit<DDS.SystemCheckboxBlankCircleLine, 'children' | 'style'>>
@@ -184,4 +180,8 @@ export type SystemUpload2FillType = HtmlType & Partial<Omit<DDS.SystemUpload2Fil
 export type SystemUpload2LineType = HtmlType & Partial<Omit<DDS.SystemUpload2Line, 'children' | 'style'>>
 export type SystemUploadLineType = HtmlType & Partial<Omit<DDS.SystemUploadLine, 'children' | 'style'>>
 export type SystemZoomInLineType = HtmlType & Partial<Omit<DDS.SystemZoomInLine, 'children' | 'style'>>
-export type SystemZoomOutLineType = HtmlType & Partial<Omit<DDS.SystemZoomOutLine, 'children' | 'style'>>
+export type SystemZoomOutLineType = HtmlType & Partial<Omit<DDS.SystemZoomOutLine, 'children' | 'style'>>
+export type UserAccountCircleFillType = HtmlType & Partial<Omit<DDS.UserAccountCircleFill, 'children' | 'style'>>
+export type UserAccountCircleLineType = HtmlType & Partial<Omit<DDS.UserAccountCircleLine, 'children' | 'style'>>
+export type UserUserFillType = HtmlType & Partial<Omit<DDS.UserUserFill, 'children' | 'style'>>
+export type UserUserLineType = HtmlType & Partial<Omit<DDS.UserUserLine, 'children' | 'style'>>