npm - dap-design-system - Versions diffs - 0.35.21 → 0.35.22 - Mend

dap-design-system 0.35.21 → 0.35.22

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

Files changed (11) hide show

package/dist/dds.d.ts +105 -107
package/dist/dds.js +261 -270
package/dist/dds.js.map +1 -1
package/dist/manifest/types/vue/index.d.ts +521 -517
package/dist/manifest/vscode.html-custom-data.json +173 -173
package/dist/manifest/web-types.json +617 -415
package/dist/react-types.ts +17 -17
package/dist/react.d.ts +211 -217
package/dist/react.js +161 -163
package/dist/react.js.map +1 -1
package/package.json +1 -1

package/dist/react.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"react.js","sources":["../src/react/dap-ds-accordion/index.ts","../src/react/dap-ds-accordion-group/index.ts","../src/react/dap-ds-badge/index.ts","../src/react/dap-ds-banner/index.ts","../src/react/dap-ds-anchor-heading/index.ts","../src/react/dap-ds-breadcrumb/index.ts","../src/react/dap-ds-avatar/index.ts","../src/react/dap-ds-breadcrumb-item/index.ts","../src/react/dap-ds-button/index.ts","../src/react/dap-ds-calendar-cell/index.ts","../src/react/dap-ds-calendar/index.ts","../src/react/dap-ds-callout/index.ts","../src/react/dap-ds-card-actions/index.ts","../src/react/dap-ds-card-content/index.ts","../src/react/dap-ds-card-image/index.ts","../src/react/dap-ds-card-subtitle/index.ts","../src/react/dap-ds-card-title/index.ts","../src/react/dap-ds-card/index.ts","../src/react/dap-ds-checkbox/index.ts","../src/react/dap-ds-combobox/index.ts","../src/react/dap-ds-command-group/index.ts","../src/react/dap-ds-command-item/index.ts","../src/react/dap-ds-command/index.ts","../src/react/dap-ds-content-switcher-item/index.ts","../src/react/dap-ds-content-switcher/index.ts","../src/react/dap-ds-copybox-input/index.ts","../src/react/dap-ds-dap-badge/index.ts","../src/react/dap-ds-datatable/index.ts","../src/react/dap-ds-datepicker/index.ts","../src/react/dap-ds-divider/index.ts","../src/react/dap-ds-feedback/index.ts","../src/react/dap-ds-file-input-list-item/index.ts","../src/react/dap-ds-file-input-list/index.ts","../src/react/dap-ds-file-input/index.ts","../src/react/dap-ds-icon/index.ts","../src/react/dap-ds-icon-button/index.ts","../src/react/dap-ds-input/index.ts","../src/react/dap-ds-label/index.ts","../src/react/dap-ds-link/index.ts","../src/react/dap-ds-list-item/index.ts","../src/react/dap-ds-modal/index.ts","../src/react/dap-ds-notification-badge/index.ts","../src/react/dap-ds-number-input/index.ts","../src/react/dap-ds-official-website-banner/index.ts","../src/react/dap-ds-option-item/index.ts","../src/react/dap-ds-option-list/index.ts","../src/react/dap-ds-overlay/index.ts","../src/react/dap-ds-pager/index.ts","../src/react/dap-ds-password-input/index.ts","../src/react/dap-ds-popup/index.ts","../src/react/dap-ds-radio-button/index.ts","../src/react/dap-ds-rating/index.ts","../src/react/dap-ds-scroll-area/index.ts","../src/react/dap-ds-search/index.ts","../src/react/dap-ds-select/index.ts","../src/react/dap-ds-sidenav-group/index.ts","../src/react/dap-ds-sidenav-item/index.ts","../src/react/dap-ds-sidenav/index.ts","../src/react/dap-ds-skip-link/index.ts","../src/react/dap-ds-snackbar-message/index.ts","../src/react/dap-ds-snackbar/index.ts","../src/react/dap-ds-spinner/index.ts","../src/react/dap-ds-stack/index.ts","../src/react/dap-ds-switch/index.ts","../src/react/dap-ds-tab-group/index.ts","../src/react/dap-ds-tab/index.ts","../src/react/dap-ds-table-cell/index.ts","../src/react/dap-ds-table-header/index.ts","../src/react/dap-ds-table-row/index.ts","../src/react/dap-ds-table/index.ts","../src/react/dap-ds-textarea/index.ts","../src/react/dap-ds-timeline-item/index.ts","../src/react/dap-ds-timeline/index.ts","../src/react/dap-ds-toc/index.ts","../src/react/dap-ds-toggle-button/index.ts","../src/react/dap-ds-tooltip/index.ts","../src/react/dap-ds-tray/index.ts","../src/react/dap-ds-typography/index.ts","../src/react/dap-ds-form-label/index.ts","../src/react/dap-ds-input-group/index.ts","../src/react/dap-ds-radio-group/index.ts","../src/react/dap-ds-icon-arrow-down-line/index.ts","../src/react/dap-ds-icon-arrow-down-s-fill/index.ts","../src/react/dap-ds-icon-arrow-down-s-line/index.ts","../src/react/dap-ds-icon-arrow-left-down-line/index.ts","../src/react/dap-ds-icon-arrow-left-l-line/index.ts","../src/react/dap-ds-icon-arrow-left-line/index.ts","../src/react/dap-ds-icon-arrow-left-s-fill/index.ts","../src/react/dap-ds-icon-arrow-left-s-line/index.ts","../src/react/dap-ds-icon-arrow-left-up-line/index.ts","../src/react/dap-ds-icon-arrow-right-down-line/index.ts","../src/react/dap-ds-icon-arrow-right-l-line/index.ts","../src/react/dap-ds-icon-arrow-right-line/index.ts","../src/react/dap-ds-icon-arrow-right-s-fill/index.ts","../src/react/dap-ds-icon-arrow-right-s-line/index.ts","../src/react/dap-ds-icon-arrow-right-up-line/index.ts","../src/react/dap-ds-icon-arrow-up-line/index.ts","../src/react/dap-ds-icon-arrow-up-s-fill/index.ts","../src/react/dap-ds-icon-arrow-up-s-line/index.ts","../src/react/dap-ds-icon-expand-up-down-fill/index.ts","../src/react/dap-ds-icon-home-6-line/index.ts","../src/react/dap-ds-icon-calendar-line/index.ts","../src/react/dap-ds-icon-clipboard-line/index.ts","../src/react/dap-ds-icon-file-copy-line/index.ts","../src/react/dap-ds-icon-cookie-line/index.ts","../src/react/dap-ds-icon-add-line/index.ts","../src/react/dap-ds-icon-alert-fill/index.ts","../src/react/dap-ds-icon-alert-line/index.ts","../src/react/dap-ds-icon-check-line/index.ts","../src/react/dap-ds-icon-check-line2/index.ts","../src/react/dap-ds-icon-checkbox-blank-circle-fill/index.ts","../src/react/dap-ds-icon-checkbox-blank-circle-fill-check/index.ts","../src/react/dap-ds-icon-checkbox-blank-circle-line/index.ts","../src/react/dap-ds-icon-checkbox-circle-fill/index.ts","../src/react/dap-ds-icon-checkbox-circle-line/index.ts","../src/react/dap-ds-icon-close-circle-fill/index.ts","../src/react/dap-ds-icon-close-circle-line/index.ts","../src/react/dap-ds-icon-close-fill/index.ts","../src/react/dap-ds-icon-close-line/index.ts","../src/react/dap-ds-icon-download-line/index.ts","../src/react/dap-ds-icon-error-warning-fill/index.ts","../src/react/dap-ds-icon-error-warning-line/index.ts","../src/react/dap-ds-icon-external-link-line/index.ts","../src/react/dap-ds-icon-eye-line/index.ts","../src/react/dap-ds-icon-eye-off-line/index.ts","../src/react/dap-ds-icon-forbid-fill/index.ts","../src/react/dap-ds-icon-information-2-fill/index.ts","../src/react/dap-ds-icon-information-fill/index.ts","../src/react/dap-ds-icon-information-line/index.ts","../src/react/dap-ds-icon-lightbulb-fill/index.ts","../src/react/dap-ds-icon-loading-spinner/index.ts","../src/react/dap-ds-icon-lock-fill/index.ts","../src/react/dap-ds-icon-lock-line/index.ts","../src/react/dap-ds-icon-menu-line/index.ts","../src/react/dap-ds-icon-menu-line-s/index.ts","../src/react/dap-ds-icon-search-line/index.ts","../src/react/dap-ds-icon-shield-check-fill/index.ts","../src/react/dap-ds-icon-shield-check-line/index.ts","../src/react/dap-ds-icon-star-fill/index.ts","../src/react/dap-ds-icon-subtract-line/index.ts","../src/react/dap-ds-icon-subtract-line2/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/accordion/accordion.component.js'\n import type { DdsOpenedEvent } from '../../events/events'\nimport type { DdsClosedEvent } from '../../events/events'\n export type { DdsOpenedEvent } from '../../events/events'\nexport type { DdsClosedEvent } from '../../events/events'\n\n const tagName = 'dap-ds-accordion'\n\n /*\n `dap-ds-accordion` is a custom accordion component.\n * @element dap-ds-accordion\n * @summary An accordion is a vertically stacked list of interactive items that can be expanded or collapsed to reveal or hide content.\n * @title - Accordion\n \n @property { 'sm' \| 'lg' } size - The size of the accordion. Default is `sm`.\n * @property { 1 \| 2 \| 3 \| 4 \| 5 \| 6 } headingLevel - The heading level of the accordion. Default is `4`.\n * @property {boolean} opened - Whether the accordion is opened. Default is `false`.\n * @property { 'left' \| 'right' } iconLocation - The location of the icon. Default is `right`.\n * @property { 'default' \| 'collapsed' \| 'clean' \| 'clean-collapsed' } variant - The variant of the accordion.\n * @property {boolean} lastItem - Whether the accordion is the last item.\n \n @event dds-opened - Event fired when the accordion is opened.\n * @event dds-closed - Event fired when the accordion is closed.\n \n @slot default - The content of the accordion.\n * @slot heading - The heading of the accordion.\n * @slot icon-opened - The icon when the accordion is opened.\n * @slot icon-closed - The icon when the accordion is closed.\n \n @csspart base - The main accordion container.\n * @csspart heading - The heading of the accordion.\n * @csspart button - The button of the accordion.\n * @csspart content - The content of the accordion.\n * @csspart content-container - The container of the accordion content.\n * @csspart icon-wrapper - The icon wrapper of the accordion.\n * @csspart open-icon - The icon when the accordion is opened.\n * @csspart open-icon-base - The base of the icon when the accordion is opened.\n * @csspart close-icon - The icon when the accordion is closed.\n * @csspart close-icon-base - The base of the icon when the accordion is closed.\n \n @cssproperty --dds-accordion-border-width - The width of the accordion border (default: var(--dds-border-width-base))\n * @cssproperty --dds-accordion-border-style - The style of the accordion border (default: solid)\n * @cssproperty --dds-accordion-border-radius - The border radius of the accordion (default: var(--dds-radius-base))\n * @cssproperty --dds-accordion-border-color - The color of the accordion border (default: var(--dds-border-neutral-divider))\n * @cssproperty --dds-accordion-background-color - The background color of the accordion (default: var(--dds-background-neutral-subtle))\n * @cssproperty --dds-accordion-text-color - The text color of the accordion (default: var(--dds-text-neutral-strong))\n * @cssproperty --dds-accordion-hover-background - The background color when hovering over the accordion (default: var(--dds-background-neutral-base))\n * @cssproperty --dds-accordion-active-background - The background color when the accordion is active (default: var(--dds-background-neutral-medium))\n * @cssproperty --dds-accordion-icon-background - The background color of the accordion icon (default: var(--dds-transparent-black-subtle))\n * @cssproperty --dds-accordion-icon-color - The color of the accordion icon (default: var(--dds-icon-neutral-base))\n * @cssproperty --dds-accordion-icon-hover-background - The background color of the accordion icon when hovered (default: var(--dds-transparent-black-base))\n * @cssproperty --dds-accordion-icon-active-background - The background color of the accordion icon when active (default: var(--dds-transparent-black-strong))\n * @cssproperty --dds-accordion-icon-hover-color - The color of the accordion icon when hovered (default: var(--dds-icon-neutral-strong))\n * @cssproperty --dds-accordion-icon-active-color - The color of the accordion icon when active (default: var(--dds-icon-neutral-strong))\n * @cssproperty --dds-accordion-content-color - The color of the accordion content (default: var(--dds-text-text-neutral))\n * @cssproperty --dds-accordion-transition-duration - The duration of the accordion transitions (default: var(--dds-transition-fast))\n * @cssproperty --dds-accordion-transition-timing - The timing function of the accordion transitions (default: var(--dds-easing-ease-in-out))\n * @cssproperty --dds-accordion-divider-color - The color of the divider between accordion items (default: var(--dds-border-neutral-divider))\n /\n const reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {\n onDdsOpened: 'dds-opened' as EventName<DdsOpenedEvent>,\nonDdsClosed: 'dds-closed' as EventName<DdsClosedEvent>\n },\n displayName: \"DapDSAccordion\"\n })\n\n export default reactWrapper\n ","\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/accordion-group/accordion-group.component.js'\n import type { DdsChangeEvent } from '../../events/events'\n export type { DdsChangeEvent } from '../../events/events'\n\n const tagName = 'dap-ds-accordion-group'\n\n /*\n `dap-ds-accordion-group` is a custom accordion group component.\n * @element dap-ds-accordion-group\n * @summary An accordion group is a collection of accordion components.\n * @title - Accordion group\n * @group accordion\n * \n @event dds-change - Event fired when an accordion is opened or closed.\n \n @slot - The content of the accordion group.\n \n @csspart base - The main accordion group container.\n \n @cssproperty --dds-accordion-group-spacing - Controls the gap between accordion items (default: var(--dds-spacing-300))\n * @cssproperty --dds-accordion-group-border-color - Controls the border color (default: var(--dds-border-neutral-subtle))\n * @cssproperty --dds-accordion-group-border-width - Controls the border width (default: var(--dds-border-width-base))\n * @cssproperty --dds-accordion-group-border-radius - Controls the border radius (default: var(--dds-radius-base))\n * @cssproperty --dds-accordion-group-background - Controls the background color (default: transparent)\n /\n const reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {\n onDdsChange: 'dds-change' as EventName<DdsChangeEvent>\n },\n displayName: \"DapDSAccordionGroup\"\n })\n\n export default reactWrapper\n ","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/badge/badge.component.js'\n\nconst tagName = 'dap-ds-badge'\n\n/*\n `dap-ds-badge`\n * @summary A badge is a small status descriptor for UI elements.\n * @element dap-ds-badge\n * @title - Badge\n \n @slot - The content of the badge.\n * @slot icon - The icon of the badge.\n \n @csspart base - The main container of the badge.\n * @csspart icon - The icon of the badge.\n * @csspart content - The content of the badge.\n * @csspart icon-base - The base of the icon.\n \n @cssproperty --dds-badge-border-width - The width of the badge's border. Default is the design system's base border width.\n * @cssproperty --dds-badge-border-style - The style of the badge's border. Default is solid.\n * @cssproperty --dds-badge-border-radius - The border radius of the badge. Default is the design system's base radius.\n * @cssproperty --dds-badge-font-weight - The font weight of the badge text. Default is bold.\n * @cssproperty --dds-badge-line-height - The line height of the badge text. Default is 1.2.\n * @cssproperty --dds-badge-transition - The transition property for the badge. Default is 'all 0.2s ease-in-out'.\n \n @cssproperty --dds-badge-padding-sm - The padding of the small badge. Default is the design system's spacing-100 and spacing-200.\n * @cssproperty --dds-badge-padding-lg - The padding of the large badge. Default is the design system's spacing-100 and spacing-300.\n * @cssproperty --dds-badge-font-size-sm - The font size of the small badge. Default is the design system's font-xs.\n * @cssproperty --dds-badge-font-size-lg - The font size of the large badge. Default is the design system's font-sm.\n \n @cssproperty --dds-badge-neutral-border-color - The border color of the neutral badge. Default is the design system's border-neutral-base.\n * @cssproperty --dds-badge-neutral-background - The background color of the neutral badge. Default is the design system's background-neutral-medium.\n * @cssproperty --dds-badge-neutral-color - The text color of the neutral badge. Default is the design system's text-neutral-subtle.\n \n @cssproperty --dds-badge-brand-border-color - The border color of the brand badge. Default is the design system's border-brand-base.\n * @cssproperty --dds-badge-brand-background - The background color of the brand badge. Default is the design system's background-brand-medium.\n * @cssproperty --dds-badge-brand-color - The text color of the brand badge. Default is the design system's text-brand-subtle.\n \n @cssproperty --dds-badge-info-border-color - The border color of the info badge. Default is the design system's border-informative-base.\n * @cssproperty --dds-badge-info-background - The background color of the info badge. Default is the design system's background-informative-medium.\n * @cssproperty --dds-badge-info-color - The text color of the info badge. Default is the design system's text-informative-subtle.\n \n @cssproperty --dds-badge-positive-border-color - The border color of the positive badge. Default is the design system's border-positive-base.\n * @cssproperty --dds-badge-positive-background - The background color of the positive badge. Default is the design system's background-positive-medium.\n * @cssproperty --dds-badge-positive-color - The text color of the positive badge. Default is the design system's text-positive-subtle.\n \n @cssproperty --dds-badge-warning-border-color - The border color of the warning badge. Default is the design system's border-warning-subtle.\n * @cssproperty --dds-badge-warning-background - The background color of the warning badge. Default is the design system's background-warning-medium.\n * @cssproperty --dds-badge-warning-color - The text color of the warning badge. Default is the design system's text-warning-subtle.\n \n @cssproperty --dds-badge-negative-border-color - The border color of the negative badge. Default is the design system's border-negative-base.\n * @cssproperty --dds-badge-negative-background - The background color of the negative badge. Default is the design system's background-negative-medium.\n * @cssproperty --dds-badge-negative-color - The text color of the negative badge. Default is the design system's text-negative-subtle.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'DapDSBadge',\n})\n\nexport default reactWrapper\n","\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/banner/banner.component.js'\n import type { DdsCloseEvent } from '../../events/events'\n export type { DdsCloseEvent } from '../../events/events'\n\n const tagName = 'dap-ds-banner'\n\n /*\n `dap-ds-banner` is a custom banner component.\n * @element dap-ds-banner\n * @summary A banner is a message displayed at the top of the page to provide important information to the user.\n * @title - Banner\n \n @event dds-close - Event fired when the banner is closed.\n \n @slot - The content of the banner.\n * @slot actions - Actions of banner\n * @slot icon - The icon of the banner.\n \n @csspart base - The main banner container.\n * @csspart card-base - The wrapper card container.\n * @csspart icon - The icon of the banner.\n * @csspart icon-element - The icon element of the banner.\n * @csspart icon-base - The base of the icon.\n * @csspart closebutton - The close button of the banner.\n * @csspart close-icon-element - The icon element of the close button.\n * @csspart close-icon-base - The base of the close button icon.\n * @csspart actions - The actions of the banner.\n * @csspart title - The title of the banner.\n \n @cssproperty --dds-banner-gap - The gap between banner elements. Default is the design system's spacing-200.\n * @cssproperty --dds-banner-line-height - The line height of the banner text. Default is the design system's font-line-height-xlarge.\n * @cssproperty --dds-banner-transition - The transition property for the banner. Default is 'all 0.2s ease-in-out'.\n \n @cssproperty --dds-banner-brand-background - The background color of the brand banner. Default is the design system's banner-background-brand.\n * @cssproperty --dds-banner-brand-icon-color - The color of the brand banner icon. Default is the design system's banner-icon-brand.\n * @cssproperty --dds-banner-brand-text-color - The text color of the brand banner. Default is the design system's banner-text-brand.\n * @cssproperty --dds-banner-brand-action-color - The color of the brand banner actions. Default is the design system's banner-action-enabled.\n \n @cssproperty --dds-banner-info-background - The background color of the info banner. Default is the design system's banner-background-informative.\n * @cssproperty --dds-banner-info-icon-color - The color of the info banner icon. Default is the design system's banner-icon-informative.\n * @cssproperty --dds-banner-info-text-color - The text color of the info banner. Default is the design system's banner-text-informative.\n * @cssproperty --dds-banner-info-action-color - The color of the info banner actions. Default is the design system's banner-action-enabled.\n \n @cssproperty --dds-banner-positive-background - The background color of the positive banner. Default is the design system's banner-background-positive.\n * @cssproperty --dds-banner-positive-icon-color - The color of the positive banner icon. Default is the design system's banner-icon-positive.\n * @cssproperty --dds-banner-positive-text-color - The text color of the positive banner. Default is the design system's banner-text-positive.\n * @cssproperty --dds-banner-positive-action-color - The color of the positive banner actions. Default is the design system's banner-action-enabled.\n \n @cssproperty --dds-banner-warning-background - The background color of the warning banner. Default is the design system's banner-background-warning.\n * @cssproperty --dds-banner-warning-icon-color - The color of the warning banner icon. Default is the design system's banner-icon-warning.\n * @cssproperty --dds-banner-warning-text-color - The text color of the warning banner. Default is the design system's banner-text-warning.\n * @cssproperty --dds-banner-warning-action-color - The color of the warning banner actions. Default is the design system's banner-action-inverted-enabled.\n \n @cssproperty --dds-banner-negative-background - The background color of the negative banner. Default is the design system's banner-background-negative.\n * @cssproperty --dds-banner-negative-icon-color - The color of the negative banner icon. Default is the design system's banner-icon-negative.\n * @cssproperty --dds-banner-negative-text-color - The text color of the negative banner. Default is the design system's banner-text-negative.\n * @cssproperty --dds-banner-negative-action-color - The color of the negative banner actions. Default is the design system's banner-action-inverted-enabled.\n /\n const reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {\n onDdsClose: 'dds-close' as EventName<DdsCloseEvent>\n },\n displayName: \"DapDSBanner\"\n })\n\n export default reactWrapper\n ","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/anchor-heading/anchor-heading.component.js'\n\nconst tagName = 'dap-ds-anchor-heading'\n\n/*\n `dap-ds-anchor-heading`\n * @summary Anchor heading is a heading with an anchor link.\n * @element dap-ds-anchor-heading\n * @title - Anchor heading\n \n @attribute {'h1' \| 'h2' \| 'h3' \| 'h4' \| 'h5' \| 'h6'} variant - The variant of the heading. Default is `h2`. Can be `h1`, `h2`, `h3`, `h4`, `h5`, or `h6`.\n * @attribute {string} label - The label of the heading.\n \n @csspart base - The main anchor heading container.\n * @csspart link - The link of the anchor heading. dap-ds-link element.\n * @csspart link-base - The base of the link part.\n * @csspart text - The text of the anchor heading.\n \n @cssproperty --dds-anchor-link-color - The color of the anchor link. Default is the primary color.\n * @cssproperty --dds-anchor-link-opacity - The opacity of the anchor link when not hovered. Default is 0.\n * @cssproperty --dds-anchor-link-hover-opacity - The opacity of the anchor link when hovered. Default is 1.\n * @cssproperty --dds-anchor-link-transition - The transition property for the anchor link opacity. Default is 'opacity 0.2s ease-in-out'.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'DapDSAnchorHeading',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/breadcrumb/breadcrumb.component.js'\n\nconst tagName = 'dap-ds-breadcrumb'\n\n/*\n `dap-ds-breadcrumb`\n * @summary A breadcrumb is a secondary navigation scheme that reveals the user's location in a website or Web application.\n * @element dap-ds-breadcrumb\n * @title - Breadcrumb\n \n @slot - The content of the breadcrumb.\n * @slot separator - The separator between breadcrumb items. Default is '/'.\n \n @csspart base - The main breadcrumb container.\n * @csspart separator - The separator of the breadcrumb.\n \n @cssproperty --dds-breadcrumb-width - The width of the breadcrumb container. Default is 100%.\n * @cssproperty --dds-breadcrumb-overflow-x - The horizontal overflow behavior of the breadcrumb. Default is auto.\n * @cssproperty --dds-breadcrumb-transition - The transition property for the breadcrumb. Default is 'all 0.2s ease-in-out'.\n \n @cssproperty --dds-breadcrumb-list-display - The display property of the breadcrumb list. Default is flex.\n * @cssproperty --dds-breadcrumb-list-flex-wrap - The flex-wrap property of the breadcrumb list. Default is nowrap.\n * @cssproperty --dds-breadcrumb-list-align-items - The align-items property of the breadcrumb list. Default is center.\n * @cssproperty --dds-breadcrumb-list-min-width - The minimum width of the breadcrumb list. Default is max-content.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'DapDSBreadcrumb',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/avatar/avatar.component.js'\n\nconst tagName = 'dap-ds-avatar'\n\n/*\n `dap-ds-avatar`\n * @summary Avatar component can be used to display user profile images or icons, or illustrations.\n * @element dap-ds-avatar\n * @title - Avatar\n \n @attribute {'lg' \| 'md' \| 'sm' \| 'xs' \| 'xxs'} size - The size of the avatar. Default is 'md'.\n * @attribute {string} src - The source of the avatar image.\n * @attribute {string} alt - The alt text of the avatar.\n * @attribute {number} width - The width of the avatar. This will override the size.\n * @attribute {number} height - The height of the avatar. This will override the size.\n \n @csspart base - The main avatar image container.\n * @csspart img - The avatar image.\n \n @cssproperty --dds-avatar-border-radius - The border radius of the avatar. Default is the design system's rounded radius.\n * @cssproperty --dds-avatar-background-color - The background color of the avatar. Default is transparent.\n * @cssproperty --dds-avatar-border-width - The width of the avatar's border. Default is 0.\n * @cssproperty --dds-avatar-border-color - The color of the avatar's border. Default is transparent.\n * @cssproperty --dds-avatar-border-style - The style of the avatar's border. Default is solid.\n * @cssproperty --dds-avatar-transition - The transition property for the avatar. Default is 'all 0.2s ease-in-out'.\n \n @cssproperty --dds-avatar-size-lg - The size of the large avatar. Default is the design system's spacing-2000.\n * @cssproperty --dds-avatar-size-md - The size of the medium avatar. Default is the design system's spacing-1600.\n * @cssproperty --dds-avatar-size-sm - The size of the small avatar. Default is the design system's spacing-1200.\n * @cssproperty --dds-avatar-size-xs - The size of the extra small avatar. Default is the design system's spacing-800.\n * @cssproperty --dds-avatar-size-xxs - The size of the extra extra small avatar. Default is the design system's spacing-600.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'DapDSAvatar',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/breadcrumb-item/breadcrumb-item.component.js'\n\nconst tagName = 'dap-ds-breadcrumb-item'\n\n/*\n `dap-ds-breadcrumb-item` custom element.\n * @element dap-ds-breadcrumb-item\n * @summary A breadcrumb item is a secondary navigation scheme that reveals the user's location in a website or Web application.\n * @title - Breadcrumb item\n * @group breadcrumb\n \n @slot - The content of the breadcrumb item.\n * @slot separator - The separator between breadcrumb items. Default is an arrow-right-s-line icon.\n \n @csspart base - The main breadcrumb item container. The li element.\n * @csspart link - The link of the breadcrumb item. The dds-link component.\n * @csspart link-base - The base part of the link part. The dds-link components base part.\n * @csspart item-nolink - The item of the breadcrumb item without a link. The span element.\n * @csspart separator - The separator of the breadcrumb item.\n \n @cssproperty --dds-breadcrumb-item-display - The display property of the breadcrumb item. Default is inline-flex.\n * @cssproperty --dds-breadcrumb-item-flex-wrap - The flex-wrap property of the breadcrumb item. Default is nowrap.\n * @cssproperty --dds-breadcrumb-item-align-items - The align-items property of the breadcrumb item. Default is center.\n * @cssproperty --dds-breadcrumb-item-color - The text color of the breadcrumb item. Default is the design system's text-neutral-base.\n * @cssproperty --dds-breadcrumb-item-transition - The transition property for the breadcrumb item. Default is 'all 0.2s ease-in-out'.\n \n @cssproperty --dds-breadcrumb-item-padding - The padding of the breadcrumb item. Default is the design system's spacing-200.\n * @cssproperty --dds-breadcrumb-item-font-size - The font size of the breadcrumb item. Default is the design system's font-sm.\n * @cssproperty --dds-breadcrumb-item-font-weight - The font weight of the breadcrumb item. Default is the design system's font-weight-medium.\n * @cssproperty --dds-breadcrumb-item-font-weight-bold - The bold font weight of the breadcrumb item. Default is the design system's font-weight-bold.\n \n @cssproperty --dds-breadcrumb-item-separator-color - The color of the separator. Default is the design system's text-neutral-disabled.\n * @cssproperty --dds-breadcrumb-item-link-color - The color of the link. Default is the design system's link-neutral-enabled.\n * @cssproperty --dds-breadcrumb-item-inverted-color - The text color when inverted. Default is the design system's text-neutral-inverted.\n * @cssproperty --dds-breadcrumb-item-inverted-link-color - The link color when inverted. Default is the design system's text-neutral-inverted.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'DapDSBreadcrumbItem',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/button/button.component.js'\n\nconst tagName = 'dap-ds-button'\n\n/*\n `dap-ds-button` is a custom button component.\n * @element dap-ds-button\n * @summary A button is a clickable element that can be used to trigger an action.\n * @title - Button\n \n @slot - The content of the button.\n \n @csspart base - The main button container.\n * @csspart high-contrast - The high contrast part of the button.\n \n @cssproperty --dds-button-padding-x - Horizontal padding of the button (default: var(--dds-spacing-300))\n * @cssproperty --dds-button-padding-y - Vertical padding of the button (default: var(--dds-spacing-300))\n * @cssproperty --dds-button-border-radius - Border radius of the button (default: var(--dds-radius-rounded))\n * @cssproperty --dds-button-font-weight - Font weight of the button (default: 700)\n * @cssproperty --dds-button-line-height - Line height of the button (default: var(--dds-font-line-height-large))\n * @cssproperty --dds-button-transition - Transition property of the button (default: all 0.2s ease-in-out)\n * @cssproperty --dds-button-disabled-opacity - Opacity of disabled button (default: 0.5)\n \n @cssproperty --dds-button-size-lg - Size of large button (default: var(--dds-spacing-1200))\n * @cssproperty --dds-button-size-md - Size of medium button (default: var(--dds-spacing-1000))\n * @cssproperty --dds-button-size-sm - Size of small button (default: var(--dds-spacing-800))\n * @cssproperty --dds-button-size-xs - Size of extra small button (default: var(--dds-spacing-600))\n \n @cssproperty --dds-button-circle-lg - Size of large circle button (default: var(--dds-spacing-1200))\n * @cssproperty --dds-button-circle-md - Size of medium circle button (default: var(--dds-spacing-1000))\n * @cssproperty --dds-button-circle-sm - Size of small circle button (default: var(--dds-spacing-800))\n * @cssproperty --dds-button-circle-xs - Size of extra small circle button (default: var(--dds-spacing-600))\n \n Primary button properties:\n * @cssproperty --dds-button-primary-color-bg - Background color of primary button (default: var(--dds-button-primary-background-enabled))\n * @cssproperty --dds-button-primary-color-bg-hover - Background color of primary button on hover (default: var(--dds-button-primary-background-hover))\n * @cssproperty --dds-button-primary-color-bg-active - Background color of primary button when active (default: var(--dds-button-primary-background-pressed))\n * @cssproperty --dds-button-primary-color-bg-disabled - Background color of disabled primary button (default: var(--dds-button-primary-background-disabled))\n * @cssproperty --dds-button-primary-color-text - Text color of primary button (default: var(--dds-button-primary-text-enabled))\n * @cssproperty --dds-button-primary-color-text-disabled - Text color of disabled primary button (default: var(--dds-button-primary-text-disabled))\n \n Primary inverted button properties:\n * @cssproperty --dds-button-primary-inverted-color-bg - Background color of primary inverted button (default: var(--dds-button-primary-background-inverted-enabled))\n * @cssproperty --dds-button-primary-inverted-color-bg-hover - Background color of primary inverted button on hover (default: var(--dds-button-primary-background-inverted-hover))\n * @cssproperty --dds-button-primary-inverted-color-bg-active - Background color of primary inverted button when active (default: var(--dds-button-primary-background-inverted-pressed))\n * @cssproperty --dds-button-primary-inverted-color-bg-disabled - Background color of disabled primary inverted button (default: var(--dds-button-primary-background-inverted-disabled))\n * @cssproperty --dds-button-primary-inverted-color-text - Text color of primary inverted button (default: var(--dds-button-primary-text-inverted))\n * @cssproperty --dds-button-primary-inverted-color-text-disabled - Text color of disabled primary inverted button (default: var(--dds-button-primary-text-inverted-disabled))\n \n Outline button properties:\n * @cssproperty --dds-button-outline-color-border - Border color of outline button (default: var(--dds-button-outline-border-enabled))\n * @cssproperty --dds-button-outline-color-border-hover - Border color of outline button on hover (default: var(--dds-button-outline-border-hover))\n * @cssproperty --dds-button-outline-color-border-active - Border color of outline button when active (default: var(--dds-button-outline-border-pressed))\n * @cssproperty --dds-button-outline-color-border-disabled - Border color of disabled outline button (default: var(--dds-button-outline-border-disabled))\n * @cssproperty --dds-button-outline-color-text - Text color of outline button (default: var(--dds-button-outline-text-enabled))\n * @cssproperty --dds-button-outline-color-text-hover - Text color of outline button on hover (default: var(--dds-button-outline-text-hover))\n * @cssproperty --dds-button-outline-color-text-active - Text color of outline button when active (default: var(--dds-button-outline-text-pressed))\n * @cssproperty --dds-button-outline-color-text-disabled - Text color of disabled outline button (default: var(--dds-button-outline-text-disabled))\n \n Outline inverted button properties:\n * @cssproperty --dds-button-outline-inverted-color-border - Border color of outline inverted button (default: var(--dds-button-outline-border-inverted-enabled))\n * @cssproperty --dds-button-outline-inverted-color-border-hover - Border color of outline inverted button on hover (default: var(--dds-button-outline-border-inverted-hover))\n * @cssproperty --dds-button-outline-inverted-color-border-active - Border color of outline inverted button when active (default: var(--dds-button-outline-border-inverted-pressed))\n * @cssproperty --dds-button-outline-inverted-color-border-disabled - Border color of disabled outline inverted button (default: var(--dds-button-outline-border-inverted-disabled))\n * @cssproperty --dds-button-outline-inverted-color-text - Text color of outline inverted button (default: var(--dds-button-outline-text-inverted-enabled))\n * @cssproperty --dds-button-outline-inverted-color-text-hover - Text color of outline inverted button on hover (default: var(--dds-button-outline-text-inverted-hover))\n * @cssproperty --dds-button-outline-inverted-color-text-active - Text color of outline inverted button when active (default: var(--dds-button-outline-text-inverted-pressed))\n * @cssproperty --dds-button-outline-inverted-color-text-disabled - Text color of disabled outline inverted button (default: var(--dds-button-outline-text-inverted-disabled))\n \n Subtle button properties:\n * @cssproperty --dds-button-subtle-color-bg - Background color of subtle button (default: var(--dds-button-subtle-background-enabled))\n * @cssproperty --dds-button-subtle-color-bg-hover - Background color of subtle button on hover (default: var(--dds-button-subtle-background-hover))\n * @cssproperty --dds-button-subtle-color-bg-active - Background color of subtle button when active (default: var(--dds-button-subtle-background-pressed))\n * @cssproperty --dds-button-subtle-color-bg-disabled - Background color of disabled subtle button (default: var(--dds-button-subtle-background-disabled))\n * @cssproperty --dds-button-subtle-color-border - Border color of subtle button (default: var(--dds-button-subtle-border-enabled))\n * @cssproperty --dds-button-subtle-color-border-hover - Border color of subtle button on hover (default: var(--dds-button-subtle-border-hover))\n * @cssproperty --dds-button-subtle-color-border-active - Border color of subtle button when active (default: var(--dds-button-subtle-border-pressed))\n * @cssproperty --dds-button-subtle-color-border-disabled - Border color of disabled subtle button (default: var(--dds-button-subtle-border-disabled))\n * @cssproperty --dds-button-subtle-color-text - Text color of subtle button (default: var(--dds-button-subtle-text-enabled))\n * @cssproperty --dds-button-subtle-color-text-hover - Text color of subtle button on hover (default: var(--dds-button-subtle-text-hover))\n * @cssproperty --dds-button-subtle-color-text-active - Text color of subtle button when active (default: var(--dds-button-subtle-text-pressed))\n * @cssproperty --dds-button-subtle-color-text-disabled - Text color of disabled subtle button (default: var(--dds-button-subtle-text-disabled))\n \n Clean button properties:\n * @cssproperty --dds-button-clean-color-text - Text color of clean button (default: var(--dds-text-link-base))\n * @cssproperty --dds-button-clean-color-text-hover - Text color of clean button on hover (default: var(--dds-text-link-hover))\n * @cssproperty --dds-button-clean-color-text-active - Text color of clean button when active (default: var(--dds-text-link-pressed))\n * @cssproperty --dds-button-clean-color-text-disabled - Text color of disabled clean button (default: var(--dds-text-neutral-disabled))\n \n Clean inverted button properties:\n * @cssproperty --dds-button-clean-inverted-color-text - Text color of clean inverted button (default: var(--dds-button-primary-text-inverted))\n * @cssproperty --dds-button-clean-inverted-color-text-hover - Text color of clean inverted button on hover (default: var(--dds-button-primary-text-inverted))\n * @cssproperty --dds-button-clean-inverted-color-text-active - Text color of clean inverted button when active (default: var(--dds-button-primary-text-inverted))\n * @cssproperty --dds-button-clean-inverted-color-text-disabled - Text color of disabled clean inverted button (default: var(--dds-text-neutral-disabled))\n \n Danger button properties:\n * @cssproperty --dds-button-danger-color-bg - Background color of danger button (default: var(--dds-button-primary-background-destructive-enabled))\n * @cssproperty --dds-button-danger-color-bg-hover - Background color of danger button on hover (default: var(--dds-button-primary-background-destructive-hover))\n * @cssproperty --dds-button-danger-color-bg-active - Background color of danger button when active (default: var(--dds-button-primary-background-destructive-pressed))\n * @cssproperty --dds-button-danger-color-text - Text color of danger button (default: var(--dds-button-primary-text-enabled))\n * @cssproperty --dds-button-danger-outline-color-border - Border color of danger outline button (default: var(--dds-button-outline-border-destructive-enabled))\n * @cssproperty --dds-button-danger-outline-color-border-hover - Border color of danger outline button on hover (default: var(--dds-button-outline-border-destructive-hover))\n * @cssproperty --dds-button-danger-outline-color-border-active - Border color of danger outline button when active (default: var(--dds-button-outline-border-destructive-pressed))\n * @cssproperty --dds-button-danger-outline-color-text - Text color of danger outline button (default: var(--dds-button-outline-text-destructive-enabled))\n * @cssproperty --dds-button-danger-outline-color-text-hover - Text color of danger outline button on hover (default: var(--dds-button-outline-text-destructive-hover))\n * @cssproperty --dds-button-danger-outline-color-text-active - Text color of danger outline button when active (default: var(--dds-button-outline-text-destructive-pressed))\n * @cssproperty --dds-button-danger-subtle-color-bg - Background color of danger subtle button (default: var(--dds-button-subtle-background-destructive-enabled))\n * @cssproperty --dds-button-danger-subtle-color-bg-hover - Background color of danger subtle button on hover (default: var(--dds-button-subtle-background-destructive-hover))\n * @cssproperty --dds-button-danger-subtle-color-bg-active - Background color of danger subtle button when active (default: var(--dds-button-subtle-background-destructive-pressed))\n * @cssproperty --dds-button-danger-subtle-color-text - Text color of danger subtle button (default: var(--dds-button-subtle-text-destructive-enabled))\n * @cssproperty --dds-button-danger-subtle-color-text-hover - Text color of danger subtle button on hover (default: var(--dds-button-subtle-text-destructive-hover))\n * @cssproperty --dds-button-danger-subtle-color-text-active - Text color of danger subtle button when active (default: var(--dds-button-subtle-text-destructive-pressed))\n * @cssproperty --dds-button-danger-clean-color-text - Text color of danger clean button (default: var(--dds-text-negative-subtle))\n * @cssproperty --dds-button-danger-clean-color-text-hover - Text color of danger clean button on hover (default: var(--dds-text-negative-base))\n * @cssproperty --dds-button-danger-clean-color-text-active - Text color of danger clean button when active (default: var(--dds-text-negative-strong))\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'DapDSButton',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/calendar/calendar-cell.component.js'\n\nconst tagName = 'dap-ds-calendar-cell'\n\n/*\n `dap-ds-calendar-cell`\n * @summary Calendar cell represents a single cell in the calendar.\n * @element dap-ds-calendar-cell\n * @title - Calendar cell\n * @group calendar\n \n @slot - The content of the calendar cell.\n \n @csspart base - The main calendar cell container.\n * @csspart today-mark - The today mark of the calendar cell.\n \n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'DapDSCalendarCell',\n})\n\nexport default reactWrapper\n","\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/calendar/calendar.component.js'\n import type { DdsChangeEvent } from '../../events/events'\n export type { DdsChangeEvent } from '../../events/events'\n\n const tagName = 'dap-ds-calendar'\n\n /*\n `dap-ds-calendar`\n * @summary A calendar is a visual representation of dates. It allows users to select a date.\n * @element dap-ds-calendar\n * @title - Calendar\n \n @event dds-change - Fired when the calendar value changes.\n \n @slot - The content of the calendar.\n \n @csspart base - The main calendar container.\n * @csspart header - The header of the calendar.\n * @csspart body - The body of the calendar.\n \n @cssproperty --dds-calendar-display - The display property of the calendar container. Default is flex.\n * @cssproperty --dds-calendar-isolation - The isolation property of the calendar. Default is isolate.\n * @cssproperty --dds-calendar-block-display - The display property of the calendar block. Default is block.\n * @cssproperty --dds-calendar-transition - The transition property for the calendar. Default is 'all 0.2s ease-in-out'.\n \n @cssproperty --dds-calendar-header-display - The display property of the calendar header. Default is grid.\n * @cssproperty --dds-calendar-header-grid-flow - The grid-auto-flow property of the calendar header. Default is column.\n * @cssproperty --dds-calendar-header-width - The width of the calendar header. Default is 100%.\n * @cssproperty --dds-calendar-header-gap - The gap between header items. Default is the design system's spacing-100.\n \n @cssproperty --dds-calendar-select-min-height - The minimum height of the select trigger. Default is auto.\n * @cssproperty --dds-calendar-select-max-height - The maximum height of the select trigger. Default is 32px.\n * @cssproperty --dds-calendar-select-padding - The padding of the select trigger. Default is the design system's spacing-200.\n * @cssproperty --dds-calendar-select-border-radius - The border radius of the select trigger. Default is the design system's radius-rounded.\n * @cssproperty --dds-calendar-select-border-color - The border color of the select trigger. Default is the design system's border-neutral-transparent-interactive.\n * @cssproperty --dds-calendar-select-background - The background color of the select trigger. Default is the design system's button-subtle-background-enabled.\n * @cssproperty --dds-calendar-select-color - The text color of the select trigger. Default is the design system's button-subtle-text-enabled.\n * @cssproperty --dds-calendar-select-font-size - The font size of the select trigger. Default is the design system's font-sm.\n * @cssproperty --dds-calendar-select-font-style - The font style of the select trigger. Default is normal.\n * @cssproperty --dds-calendar-select-font-weight - The font weight of the select trigger. Default is the design system's font-weight-bold.\n \n @cssproperty --dds-calendar-nav-button-margin - The margin of the navigation buttons. Default is the design system's spacing-200.\n * @cssproperty --dds-calendar-nav-button-color - The color of the navigation button icons. Default is the design system's button-subtle-icon-enabled.\n /\n const reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {\n onDdsChange: 'dds-change' as EventName<DdsChangeEvent>\n },\n displayName: \"DapDSCalendar\"\n })\n\n export default reactWrapper\n ","\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/callout/callout.component.js'\n import type { DdsCloseEvent } from '../../events/events'\n export type { DdsCloseEvent } from '../../events/events'\n\n const tagName = 'dap-ds-callout'\n\n /*\n `dap-ds-callout` is a custom callout component.\n * @element dap-ds-callout\n * @title - Callout\n \n @event dds-close - Fired when the close button is clicked.\n \n @slot - The content of the callout.\n * @slot title - The title of the callout.\n * @slot icon - The icon of the callout.\n * @slot actions - The actions of the callout.\n * @slot close - The close button of the callout.\n \n @csspart base - The main callout container.\n * @csspart icon - The icon of the callout.\n * @csspart title - The title of the callout.\n * @csspart description - The description of the callout.\n * @csspart actions - The actions of the callout.\n * @csspart close - The close button of the callout.\n \n @cssproperty --dds-callout-padding - Padding of the callout content. Default: var(--dds-spacing-300)\n * @cssproperty --dds-callout-gap - Gap between elements in horizontal layout. Default: var(--dds-spacing-300)\n * @cssproperty --dds-callout-icon-size - Size of the icon. Default: var(--dds-spacing-600)\n * @cssproperty --dds-callout-title-color - Color of the title text. Default: var(--dds-text-neutral-strong)\n * @cssproperty --dds-callout-description-color - Color of the description text. Default: var(--dds-text-neutral-base)\n * @cssproperty --dds-callout-title-font-size - Font size of the title. Default: var(--dds-font-base)\n * @cssproperty --dds-callout-description-font-size - Font size of the description. Default: var(--dds-font-base)\n * @cssproperty --dds-callout-title-font-weight - Font weight of the title. Default: var(--dds-font-weight-bold)\n * @cssproperty --dds-callout-description-font-weight - Font weight of the description. Default: var(--dds-font-weight-medium)\n * @cssproperty --dds-callout-actions-font-weight - Font weight of the actions. Default: var(--dds-font-weight-bold)\n * @cssproperty --dds-callout-actions-gap - Gap between action items. Default: var(--dds-spacing-400)\n * @cssproperty --dds-callout-content-gap - Gap between content elements. Default: var(--dds-spacing-100)\n /\n const reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {\n onDdsClose: 'dds-close' as EventName<DdsCloseEvent>\n },\n displayName: \"DapDSCallout\"\n })\n\n export default reactWrapper\n ","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/card/card-actions.component.js'\n\nconst tagName = 'dap-ds-card-actions'\n\n/*\n `dap-ds-card-actions`\n * @summary A card actions is a container for actions in a card.\n * @element dap-ds-card-actions\n * @title - Card actions\n * @group card\n \n @property {'sm' \| 'md' \| 'lg'} size - The size of the card actions. Default is `sm`.\n * @property {'top' \| 'bottom' \| 'both' \| 'none'} spacing - The spacing of the card actions. This adds a margin to the card actions. Default is `bottom`.\n \n @slot - The content of the card actions.\n \n @csspart base - The main card actions container.\n \n @cssproperty --dds-card-actions-gap - The gap between items in the card actions. Default is `var(--dds-spacing-200)`.\n * @cssproperty --dds-card-actions-padding-lg - The padding for large size card actions. Default is `var(--dds-spacing-600)`.\n * @cssproperty --dds-card-actions-padding-md - The padding for medium size card actions. Default is `var(--dds-spacing-400)`.\n * @cssproperty --dds-card-actions-padding-sm - The padding for small size card actions. Default is `var(--dds-spacing-400)`.\n * @cssproperty --dds-card-actions-margin-lg - The margin for large size card actions spacing. Default is `var(--dds-spacing-600)`.\n * @cssproperty --dds-card-actions-margin-md - The margin for medium size card actions spacing. Default is `var(--dds-spacing-400)`.\n * @cssproperty --dds-card-actions-margin-sm - The margin for small size card actions spacing. Default is `var(--dds-spacing-400)`.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'DapDSCardActions',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/card/card-content.component.js'\n\nconst tagName = 'dap-ds-card-content'\n\n/*\n `dap-ds-card-content`\n * @summary A card content is a container for content in a card.\n * @element dap-ds-card-content\n * @title - Card content\n * @group card\n \n @property {'sm' \| 'md' \| 'lg'} size - The size of the card subtitle. Default is `sm`.\n * @property {'top' \| 'bottom' \| 'both' \| 'none'} spacing - The spacing of the card content. This adds a margin to the card subtitle. Default is `bottom`.\n \n @slot - The content of the card-content.\n \n @csspart base - The main card content container.\n \n @cssproperty --dds-card-content-padding - The padding of the card content. Default is `0`.\n * @cssproperty --dds-card-content-margin - The margin of the card content. Default is `0`.\n * @cssproperty --dds-card-content-font-size - The font size of the card content. Default is `var(--dds-font-base)`.\n * @cssproperty --dds-card-content-line-height - The line height of the card content. Default is `var(--dds-font-line-height-xlarge)`.\n * @cssproperty --dds-card-content-spacing-lg - The large spacing value. Default is `var(--dds-spacing-600)`.\n * @cssproperty --dds-card-content-spacing-md - The medium spacing value. Default is `var(--dds-spacing-400)`.\n * @cssproperty --dds-card-content-spacing-sm - The small spacing value. Default is `var(--dds-spacing-400)`.\n * @cssproperty --dds-card-content-spacing-top - The top spacing value. Default is `0`.\n * @cssproperty --dds-card-content-spacing-bottom - The bottom spacing value. Default is `0`.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'DapDSCardContent',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/card/card-image.component.js'\n\nconst tagName = 'dap-ds-card-image'\n\n/*\n `dap-ds-card-image`\n * @summary A card image is a container for images in a card.\n * @element dap-ds-card-image\n * @title - Card image\n * @group card\n \n @slot - The default slot for the image. The slot can accept any element, for example a video. If nothing is added to the slot, the image will be rendered.\n \n @csspart base - The main card image container.\n \n @cssproperty --dds-card-image-width - The width of the image. Default is `100%`.\n * @cssproperty --dds-card-image-height - The height of the image. Default is `auto`.\n * @cssproperty --dds-card-image-object-fit - How the image fits within its container. Default is `cover`.\n * @cssproperty --dds-card-image-background-position - The background position of the image. Default is `center`.\n * @cssproperty --dds-card-image-background-size - How the background image is sized. Default is `cover`.\n * @cssproperty --dds-card-image-background-repeat - How the background image repeats. Default is `no-repeat`.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'DapDSCardImage',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/card/card-subtitle.component.js'\n\nconst tagName = 'dap-ds-card-subtitle'\n\n/*\n `dap-ds-card-subtitle`\n * @summary Subtitle of the card\n * @element dap-ds-card-subtitle\n * @title - Card subtitle\n * @group card\n \n @property {'sm' \| 'lg'} size - The size of the card subtitle. Default is `sm`.\n * @property {'top' \| 'bottom' \| 'both' \| 'none'} spacing - The spacing of the card subtitle. This adds a margin to the card subtitle. Default is `top`.\n \n @slot - The content of the subtitle.\n \n @csspart base - The subtitle container.\n \n @cssproperty --dds-card-subtitle-color - The color of the subtitle text. Default is `var(--dds-text-neutral-subtle)`.\n * @cssproperty --dds-card-subtitle-font-size - The font size of the subtitle. Default is `var(--dds-font-xs)`.\n * @cssproperty --dds-card-subtitle-font-weight - The font weight of the subtitle. Default is `var(--dds-font-weight-bold)`.\n * @cssproperty --dds-card-subtitle-line-height - The line height of the subtitle. Default is `var(--dds-font-line-height-large)`.\n \n @cssproperty --dds-card-subtitle-padding-sm - The padding for small size. Default is `0 var(--dds-spacing-400)`.\n * @cssproperty --dds-card-subtitle-padding-md - The padding for medium size. Default is `0 var(--dds-spacing-400)`.\n * @cssproperty --dds-card-subtitle-padding-lg - The padding for large size. Default is `0 var(--dds-spacing-600)`.\n \n @cssproperty --dds-card-subtitle-margin-sm - The base margin for small size. Default is `var(--dds-spacing-400)`.\n * @cssproperty --dds-card-subtitle-margin-md - The base margin for medium size. Default is `var(--dds-spacing-400)`.\n * @cssproperty --dds-card-subtitle-margin-lg - The base margin for large size. Default is `var(--dds-spacing-600)`.\n \n @cssproperty --dds-card-subtitle-spacing-top-sm - The top spacing for small size. Default is `var(--dds-spacing-400)`.\n * @cssproperty --dds-card-subtitle-spacing-top-md - The top spacing for medium size. Default is `var(--dds-spacing-400)`.\n * @cssproperty --dds-card-subtitle-spacing-top-lg - The top spacing for large size. Default is `var(--dds-spacing-600)`.\n \n @cssproperty --dds-card-subtitle-spacing-bottom-sm - The bottom spacing for small size. Default is `var(--dds-spacing-400)`.\n * @cssproperty --dds-card-subtitle-spacing-bottom-md - The bottom spacing for medium size. Default is `var(--dds-spacing-400)`.\n * @cssproperty --dds-card-subtitle-spacing-bottom-lg - The bottom spacing for large size. Default is `var(--dds-spacing-600)`.\n \n @cssproperty --dds-card-subtitle-spacing-both-sm - The both (top and bottom) spacing for small size. Default is `var(--dds-spacing-400)`.\n * @cssproperty --dds-card-subtitle-spacing-both-md - The both (top and bottom) spacing for medium size. Default is `var(--dds-spacing-400)`.\n * @cssproperty --dds-card-subtitle-spacing-both-lg - The both (top and bottom) spacing for large size. Default is `var(--dds-spacing-600)`.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'DapDSCardSubtitle',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/card/card-title.component.js'\n\nconst tagName = 'dap-ds-card-title'\n\n/*\n `dap-ds-card-title`\n * @summary Title of the card\n * @element dap-ds-card-title\n * @title - Card title\n * @group card\n \n @property {'sm' \|'md' \| 'lg'} size - The size of the card title. Default is `sm`.\n * @property {boolean} noPadding - Whether the card title should have no padding.\n * @property {'top' \| 'bottom' \| 'both' \| 'none'} spacing - The spacing of the card title. This adds a margin to the card title. Default is `top`.\n \n @slot - The content of the title.\n \n @csspart base - The main card title container.\n \n @cssproperty --dds-card-title-color - The text color of the card title. Default is `var(--dds-color-text-primary)`.\n * @cssproperty --dds-card-title-font-family - The font family of the card title. Default is `var(--dds-font-family-base)`.\n * @cssproperty --dds-card-title-font-weight - The font weight of the card title. Default is `var(--dds-font-weight-bold)`.\n * @cssproperty --dds-card-title-line-height - The line height of the card title. Default is `var(--dds-font-line-height-large)`.\n * @cssproperty --dds-card-title-margin-bottom - The bottom margin of the card title. Default is `var(--dds-spacing-100)`.\n \n @cssproperty --dds-card-title-sm-padding-x - The horizontal padding for small size. Default is `var(--dds-spacing-400)`.\n * @cssproperty --dds-card-title-sm-padding-bottom - The bottom padding for small size. Default is `var(--dds-spacing-100)`.\n * @cssproperty --dds-card-title-sm-spacing-top - The top spacing for small size. Default is `var(--dds-spacing-400)`.\n * @cssproperty --dds-card-title-sm-spacing-bottom - The bottom spacing for small size. Default is `var(--dds-spacing-400)`.\n \n @cssproperty --dds-card-title-md-padding-x - The horizontal padding for medium size. Default is `var(--dds-spacing-400)`.\n * @cssproperty --dds-card-title-md-padding-bottom - The bottom padding for medium size. Default is `var(--dds-spacing-100)`.\n * @cssproperty --dds-card-title-md-spacing-top - The top spacing for medium size. Default is `var(--dds-spacing-400)`.\n * @cssproperty --dds-card-title-md-spacing-bottom - The bottom spacing for medium size. Default is `var(--dds-spacing-400)`.\n \n @cssproperty --dds-card-title-lg-padding-x - The horizontal padding for large size. Default is `var(--dds-spacing-600)`.\n * @cssproperty --dds-card-title-lg-padding-bottom - The bottom padding for large size. Default is `var(--dds-spacing-100)`.\n * @cssproperty --dds-card-title-lg-spacing-top - The top spacing for large size. Default is `var(--dds-spacing-600)`.\n * @cssproperty --dds-card-title-lg-spacing-bottom - The bottom spacing for large size. Default is `var(--dds-spacing-600)`.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'DapDSCardTitle',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/card/card.component.js'\n\nconst tagName = 'dap-ds-card'\n\n/*\n `dap-ds-card`\n * @summary A card is a container for content, actions, and images in a consistent format.\n * @element dap-ds-card\n * @title - Card\n \n @property {'sm' \| 'md' \| 'lg'} size - The size of the card title. Default is `sm`.\n \n @slot - The content of the card.\n \n @csspart base - The main card container.\n \n @cssproperty --dds-card-padding - The padding of the card. Default is `var(--dds-spacing-400)`.\n * @cssproperty --dds-card-border-radius - The border radius of the card. Default is `var(--dds-radius-large)`.\n * @cssproperty --dds-card-border-width - The border width of the card. Default is `var(--dds-border-width-base)`.\n * @cssproperty --dds-card-border-color - The border color of the card. Default is `var(--dds-border-neutral-divider)`.\n * @cssproperty --dds-card-background - The background color of the card. Default is `var(--dds-background-neutral-base)`.\n * @cssproperty --dds-card-hover-border-color - The border color when hovering over the card. Default is `var(--dds-border-brand-base)`.\n * @cssproperty --dds-card-active-border-color - The border color when the card is active. Default is `var(--dds-border-brand-medium)`.\n * @cssproperty --dds-card-shadow - The box shadow of the card. Default is `none`.\n * @cssproperty --dds-card-hover-shadow - The box shadow when hovering over the card. Default is `none`.\n * @cssproperty --dds-card-transition-duration - The duration of the card's transitions. Default is `var(--dds-transition-medium)`.\n * @cssproperty --dds-card-transition-timing - The timing function of the card's transitions. Default is `var(--dds-easing-ease-in-out)`.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'DapDSCard',\n})\n\nexport default reactWrapper\n","\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/checkbox/checkbox.component.js'\n import type { DdsChangeEvent } from '../../events/events'\nimport type { DdsBlurEvent } from '../../events/events'\nimport type { DdsFocusEvent } from '../../events/events'\nimport type { DdsInputEvent } from '../../events/events'\n export type { DdsChangeEvent } from '../../events/events'\nexport type { DdsBlurEvent } from '../../events/events'\nexport type { DdsFocusEvent } from '../../events/events'\nexport type { DdsInputEvent } from '../../events/events'\n\n const tagName = 'dap-ds-checkbox'\n\n /*\n `dap-ds-checkbox`\n * @summary A checkbox is a form element that allows the user to select one or more options from a set.\n * @element dap-ds-checkbox\n * @title - Checkbox\n \n @event dds-change - Fired when the checkbox is checked or unchecked.\n * @event dds-blur - Emitted when the checkbox loses focus.\n * @event dds-focus - Emitted when the checkbox gains focus.\n * @event dds-input - Emitted when the checkbox receives input.\n \n @property {string} name - The name of the checkbox.\n * @property {string} value - The value of the checkbox.\n * @property {boolean} checked - Whether the checkbox is checked.\n * @property {string} label - The label of the checkbox.\n * @property {string} description - The description of the checkbox.\n * @property {boolean} disabled - Whether the checkbox is disabled.\n * @property {boolean} required - Whether the checkbox is required.\n * @property {'xs' \| sm' \| 'md' \| 'lg'} size - The size of the checkbox.\n * @property {'left' \| 'right'} labelPlacement - The placement of the label.\n * @property {'top' \| 'bottom'} descriptionPlacement - The placement of the description.\n * @property {boolean} subtle - The weight of the label.\n * @property {string} feedback - The feedback of the checkbox.\n * @property {'negative' \| 'positive' \| 'warning'} feedbackType - The feedback type of the checkbox.\n * @property {boolean} invalid - The invalid state of the checkbox.\n * @property {boolean} optional - The optional state of the checkbox.\n * @property {string} optionalLabel - The optional label of the checkbox.\n \n @csspart base - The main checkbox container.\n * @csspart label - The label of the checkbox.\n * @csspart input - The input of the checkbox.\n * @csspart control - The control of the checkbox.\n * @csspart icon - The icon of the checkbox.\n * @csspart label-container - The label container of the checkbox.\n * @csspart description - The description of the checkbox.\n \n @cssproperty --dds-checkbox-size - The size of the checkbox. Default is `var(--dds-spacing-500)`.\n * @cssproperty --dds-checkbox-border-width - The border width of the checkbox. Default is `var(--dds-border-width-large)`.\n * @cssproperty --dds-checkbox-border-radius - The border radius of the checkbox. Default is `var(--dds-radius-small)`.\n * @cssproperty --dds-checkbox-border-color - The border color of the checkbox. Default is `var(--dds-border-neutral-base)`.\n * @cssproperty --dds-checkbox-background-color - The background color of the checkbox. Default is `transparent`.\n * @cssproperty --dds-checkbox-icon-color - The color of the checkbox icon. Default is `var(--dds-button-primary-icon-enabled)`.\n * @cssproperty --dds-checkbox-hover-border-color - The border color when hovering over the checkbox. Default is `var(--dds-border-neutral-medium)`.\n * @cssproperty --dds-checkbox-hover-background-color - The background color when hovering over the checkbox. Default is `var(--dds-background-neutral-medium)`.\n * @cssproperty --dds-checkbox-active-border-color - The border color when the checkbox is active. Default is `var(--dds-border-neutral-strong)`.\n * @cssproperty --dds-checkbox-active-background-color - The background color when the checkbox is active. Default is `var(--dds-background-neutral-strong)`.\n * @cssproperty --dds-checkbox-checked-border-color - The border color when the checkbox is checked. Default is `var(--dds-background-brand-base-inverted)`.\n * @cssproperty --dds-checkbox-checked-background-color - The background color when the checkbox is checked. Default is `var(--dds-background-brand-base-inverted)`.\n * @cssproperty --dds-checkbox-checked-hover-border-color - The border color when hovering over a checked checkbox. Default is `var(--dds-background-brand-medium-inverted)`.\n * @cssproperty --dds-checkbox-checked-hover-background-color - The background color when hovering over a checked checkbox. Default is `var(--dds-background-brand-medium-inverted)`.\n * @cssproperty --dds-checkbox-checked-active-border-color - The border color when a checked checkbox is active. Default is `var(--dds-background-brand-strong-inverted)`.\n * @cssproperty --dds-checkbox-checked-active-background-color - The background color when a checked checkbox is active. Default is `var(--dds-background-brand-strong-inverted)`.\n * @cssproperty --dds-checkbox-invalid-border-color - The border color when the checkbox is invalid. Default is `var(--dds-border-negative-base)`.\n * @cssproperty --dds-checkbox-invalid-background-color - The background color when the checkbox is invalid. Default is `var(--dds-background-negative-base)`.\n * @cssproperty --dds-checkbox-invalid-hover-border-color - The border color when hovering over an invalid checkbox. Default is `var(--dds-border-negative-medium)`.\n * @cssproperty --dds-checkbox-invalid-hover-background-color - The background color when hovering over an invalid checkbox. Default is `var(--dds-background-negative-medium)`.\n * @cssproperty --dds-checkbox-invalid-active-border-color - The border color when an invalid checkbox is active. Default is `var(--dds-border-negative-strong)`.\n * @cssproperty --dds-checkbox-invalid-active-background-color - The background color when an invalid checkbox is active. Default is `var(--dds-background-negative-strong)`.\n * @cssproperty --dds-checkbox-disabled-border-color - The border color when the checkbox is disabled. Default is `var(--dds-button-primary-background-disabled)`.\n * @cssproperty --dds-checkbox-disabled-background-color - The background color when the checkbox is disabled. Default is `var(--dds-button-primary-background-disabled)`.\n * @cssproperty --dds-checkbox-disabled-icon-color - The color of the checkbox icon when disabled. Default is `var(--dds-button-primary-icon-disabled)`.\n /\n const reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {\n onDdsChange: 'dds-change' as EventName<DdsChangeEvent>,\nonDdsBlur: 'dds-blur' as EventName<DdsBlurEvent>,\nonDdsFocus: 'dds-focus' as EventName<DdsFocusEvent>,\nonDdsInput: 'dds-input' as EventName<DdsInputEvent>\n },\n displayName: \"DapDSCheckbox\"\n })\n\n export default reactWrapper\n ","\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/combobox/combobox.component.js'\n import type { DdsChangeEvent } from '../../events/events'\nimport type { DdsBlurEvent } from '../../events/events'\nimport type { DdsFocusEvent } from '../../events/events'\nimport type { DdsClearEvent } from '../../events/events'\nimport type { DdsSearchEvent } from '../../events/events'\nimport type { DdsInputEvent } from '../../events/events'\n export type { DdsChangeEvent } from '../../events/events'\nexport type { DdsBlurEvent } from '../../events/events'\nexport type { DdsFocusEvent } from '../../events/events'\nexport type { DdsClearEvent } from '../../events/events'\nexport type { DdsSearchEvent } from '../../events/events'\nexport type { DdsInputEvent } from '../../events/events'\n\n const tagName = 'dap-ds-combobox'\n\n /*\n `dap-ds-combobox`\n * @summary A select is a form element that allows the user to select one option from a set.\n * @element dap-ds-combobox\n * @title - Combobox\n \n @event dds-change - Fired when the select value changes.\n * @event dds-blur - Emitted when the select loses focus.\n * @event dds-focus - Emitted when the select gains focus.\n * @event dds-clear - Emitted when the select is cleared.\n * @event dds-search - Emitted when the manual input value changes.\n * @event dds-input - Emitted when typing happens in the input.\n \n @property {string} value - The value of the select.\n * @property {string} placeholder - The placeholder of the select.\n * @property { 'top' \| 'top-start' \| 'top-end' \| 'right' \| 'right-start'\| 'right-end' \| 'bottom' \| 'bottom-start' \| 'bottom-end' \| 'left' \| 'left-start' \| 'left-end'} placement - The placement of the select dropdown. Default is 'bottom-start'.\n * @property {boolean} opened - Whether the select dropdown is opened.\n * @property {'width' \| 'height' \| 'both'} sync - The sync mode of the select dropdown. How the dropdown item size is synced to the trigger element'.\n * @property {string} label - The label of the select.\n * @property {string} description - The description of the select.\n * @property {string} tooltip - The tooltip of the select.\n * @property {'top' \| 'right' \| 'bottom' \| 'left'} tooltipPlacement - The tooltip placement of the input.\n * @property {'xs' \| 'sm' \| 'sm'} size - The size of the select. Default is 'md'.\n * @property {boolean} disabled - Whether the select is disabled.\n * @property {boolean} required - Whether the select is required.\n * @property {boolean} readonly - Whether the select is readonly.\n * @property {boolean} autofocus - Whether the select is autofocus.\n * @property {string} feedback - The feedback content of the select.\n * @property {'error' \| 'warning' \| 'info'} feedbackType - The feedback type of the select.\n * @property {'none' \| 'typehead' \| 'autocomplete' \| 'manual'} searchMode - The search mode of the select.\n * @property {boolean} openOnEmpty - Whether the combobox should open on empty results.\n * @property {boolean} allowManualInput - Whether the combobox allows manual input, or free text.\n * @property {boolean} searchForText - Whether the combobox should search for the selected item text.\n * @property {boolean} noTextComplete - Whether the combobox should not complete the text.\n * @property {string} searchButtonAriaLabel - The aria label of the search button.\n * @property {string} selectable - Show the selected item check mark in the dropdown. 'true' or 'false'\n * @property {boolean} noAnimation - Whether the combobox open indicator should be animated.\n \n @csspart base - The main select container.\n * @csspart trigger - The trigger button of the select.\n * @csspart label - The label of the select.\n * @csspart description - The description of the select.\n * @csspart feedback - The feedback of the select.\n * @csspart tooltip - The tooltip of the select.\n * @csspart option-list - The option list of the select.\n \n @cssproperty --dds-combobox-background - The background color of the combobox. Defaults to var(--dds-fields-background-default).\n * @cssproperty --dds-combobox-border-color - The border color of the combobox. Defaults to var(--dds-border-neutral-base).\n * @cssproperty --dds-combobox-border-width - The border width of the combobox. Defaults to var(--dds-border-width-base, 1px).\n * @cssproperty --dds-combobox-border-radius - The border radius of the combobox. Defaults to var(--dds-radius-base).\n * @cssproperty --dds-combobox-text-color - The text color of the combobox. Defaults to var(--dds-text-neutral-base).\n * @cssproperty --dds-combobox-placeholder-color - The placeholder text color. Defaults to var(--dds-text-neutral-subtle).\n * @cssproperty --dds-combobox-disabled-background - The background color when disabled. Defaults to var(--dds-background-neutral-stronger).\n * @cssproperty --dds-combobox-disabled-text - The text color when disabled. Defaults to var(--dds-text-neutral-disabled).\n * @cssproperty --dds-combobox-error-border - The border color for error state. Defaults to var(--dds-border-negative-base).\n * @cssproperty --dds-combobox-success-border - The border color for success state. Defaults to var(--dds-border-positive-base).\n * @cssproperty --dds-combobox-icon-color - The color of the icons. Defaults to var(--dds-text-icon-neutral-subtle).\n * @cssproperty --dds-combobox-clear-icon-color - The color of the clear icon. Defaults to var(--dds-button-subtle-icon-neutral-enabled).\n * @cssproperty --dds-combobox-popup-background - The background color of the popup. Defaults to var(--dds-background-neutral-subtle).\n * @cssproperty --dds-combobox-popup-shadow - The box shadow of the popup. Defaults to 0 4px 6px -1px rgb(0 0 0 / 8%), 0 2px 4px -1px rgb(0 0 0 / 6%).\n \n @cssproperty --dds-combobox-padding-xs - The padding for extra small size. Defaults to var(--dds-spacing-200).\n * @cssproperty --dds-combobox-padding-sm - The padding for small size. Defaults to var(--dds-spacing-200).\n * @cssproperty --dds-combobox-padding-lg - The padding for large size. Defaults to var(--dds-spacing-300).\n * @cssproperty --dds-combobox-padding-horizontal - The horizontal padding. Defaults to var(--dds-spacing-300).\n * @cssproperty --dds-combobox-padding-vertical - The vertical padding. Defaults to var(--dds-spacing-200).\n * @cssproperty --dds-combobox-gap - The gap between elements. Defaults to var(--dds-spacing-100).\n * @cssproperty --dds-combobox-icon-gap - The gap between icons. Defaults to var(--dds-spacing-200).\n * @cssproperty --dds-combobox-action-gap - The gap between action elements. Defaults to var(--dds-spacing-200).\n * @cssproperty --dds-combobox-action-padding - The padding for action elements. Defaults to var(--dds-spacing-300).\n * @cssproperty --dds-combobox-clear-icon-width - The width of the clear icon. Defaults to var(--dds-spacing-800).\n * @cssproperty --dds-combobox-dropdown-icon-right - The right position of the dropdown icon. Defaults to var(--dds-spacing-600).\n * @cssproperty --dds-combobox-min-width - The minimum width of the combobox. Defaults to 7.5rem.\n \n @slot - The default slot for the options.\n /\n const reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {\n onDdsChange: 'dds-change' as EventName<DdsChangeEvent>,\nonDdsBlur: 'dds-blur' as EventName<DdsBlurEvent>,\nonDdsFocus: 'dds-focus' as EventName<DdsFocusEvent>,\nonDdsClear: 'dds-clear' as EventName<DdsClearEvent>,\nonDdsSearch: 'dds-search' as EventName<DdsSearchEvent>,\nonDdsInput: 'dds-input' as EventName<DdsInputEvent>\n },\n displayName: \"DapDSCombobox\"\n })\n\n export default reactWrapper\n ","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/command/command-group.component.js'\n\nconst tagName = 'dap-ds-command-group'\n\n/*\n `dap-ds-command-group`\n * @summary A command group is a group of command items.\n * @element dap-ds-command-group\n * @title - Command group\n * @group command\n \n @slot - The default slot for the command group.\n \n @cssprop --dds-command-group-gap - The gap between command group elements. Defaults to var(--dds-spacing-100)\n * @cssprop --dds-command-group-margin-bottom - The bottom margin of the command group. Defaults to var(--dds-spacing-200)\n * @cssprop --dds-command-group-border-radius - The border radius of the command group. Defaults to var(--dds-radius-small)\n * @cssprop --dds-command-group-label-font-weight - The font weight of the command group label. Defaults to var(--dds-font-weight-bold)\n * @cssprop --dds-command-group-items-gap - The gap between command items. Defaults to var(--dds-spacing-100)\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'DapDSCommandGroup',\n})\n\nexport default reactWrapper\n","\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/command/command-item.component.js'\n import type { DdsCommandItemClickEvent } from '../../events/events'\n export type { DdsCommandItemClickEvent } from '../../events/events'\n\n const tagName = 'dap-ds-command-item'\n\n /*\n `dap-ds-command-item`\n * @summary A command item is a command item that can be selected.\n * @element dap-ds-command-item\n * @title - Command item\n * @group command\n \n @event dds-command-item-click - Fired when the command item is clicked.\n \n @slot - The label of the command item.\n * @slot check - The check of the command item.\n \n @csspart base - The base part of the command item.\n * @csspart content - The content part of the command item.\n * @csspart label - The label part of the command item.\n \n @cssprop --dds-command-item-padding - The padding of the command item\n * @cssprop --dds-command-item-background - The background color of the command item\n * @cssprop --dds-command-item-color - The text color of the command item\n * @cssprop --dds-command-item-hover-background - The background color of the command item on hover\n * @cssprop --dds-command-item-selected-background - The background color of the selected command item\n /\n const reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {\n onDdsCommandItemClick: 'dds-command-item-click' as EventName<DdsCommandItemClickEvent>\n },\n displayName: \"DapDSCommandItem\"\n })\n\n export default reactWrapper\n ","\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/command/command.component.js'\n import type { DdsOpenedEvent } from '../../events/events'\nimport type { DdsClosedEvent } from '../../events/events'\n export type { DdsOpenedEvent } from '../../events/events'\nexport type { DdsClosedEvent } from '../../events/events'\n\n const tagName = 'dap-ds-command'\n\n /*\n `dap-ds-command`\n * @summary A command is a component that displays a list of commands.\n * @element dap-ds-command\n * @title - Command\n \n /\n const reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {\n onDdsOpened: 'dds-opened' as EventName<DdsOpenedEvent>,\nonDdsClosed: 'dds-closed' as EventName<DdsClosedEvent>\n },\n displayName: \"DapDSCommand\"\n })\n\n export default reactWrapper\n ","import { createComponent } from '@lit/react'\nimport * as React from 'react'\n\nimport Component from '../../components/content-switcher/content-switcher-item.component.js'\n\nconst tagName = 'dap-ds-content-switcher-item'\n\n/*\n `dap-ds-content-switcher-item`\n * @summary Segmented control item component for the segmented control.\n * @element dap-ds-content-switcher-item\n * @title - Content switcher item\n * @group content-switcher\n \n @slot iconcontent - The icon content of the segmented control item.\n \n @csspart input - The input of the segmented control item.\n \n @cssproperty --dds-content-switcher-item-height - The height of the content switcher item (default: var(--dds-spacing-800, 32px))\n * @cssproperty --dds-content-switcher-item-padding - The padding of the content switcher item (default: var(--dds-spacing-200, 8px) var(--dds-spacing-400, 16px))\n * @cssproperty --dds-content-switcher-item-font-size - The font size of the content switcher item (default: var(--dds-size-sm, 14px))\n * @cssproperty --dds-content-switcher-item-font-weight - The font weight of the content switcher item (default: var(--dds-weight-bold, 700))\n * @cssproperty --dds-content-switcher-item-border-radius - The border radius of the content switcher item (default: var(--dds-radius-large, 16px))\n * @cssproperty --dds-content-switcher-item-background - The background color of the content switcher item (default: transparent)\n * @cssproperty --dds-content-switcher-item-color - The text color of the content switcher item (default: var(--dds-text-neutral-base))\n * @cssproperty --dds-content-switcher-item-border-color - The border color of the content switcher item (default: transparent)\n * @cssproperty --dds-content-switcher-item-checked-background - The background color of the checked content switcher item (default: var(--dds-button-primary-background-enabled))\n * @cssproperty --dds-content-switcher-item-checked-color - The text color of the checked content switcher item (default: var(--dds-text-neutral-on-inverted))\n * @cssproperty --dds-content-switcher-item-checked-border-color - The border color of the checked content switcher item (default: var(--dds-border-neutral-transparent-interactive))\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'DapDSContentSwitcherItem',\n})\n\nexport default reactWrapper\n","\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/content-switcher/content-switcher.component.js'\n import type { DdsChangeEvent } from '../../events/events'\n export type { DdsChangeEvent } from '../../events/events'\n\n const tagName = 'dap-ds-content-switcher'\n\n /*\n `dap-ds-content-switcher`\n * @summary A content switcher is a set of two or more segments, each of which functions as a mutually exclusive button.\n * @element dap-ds-content-switcher\n * @title - Content switcher\n \n @slot - The content switcher items.\n \n @event dds-change - Fired when the content switcher is changed.\n * \n @csspart base - The main content switcher container.\n \n @cssproperty --dds-content-switcher-min-width - The minimum width of the content switcher (default: var(--dds-spacing-4000, 160px))\n * @cssproperty --dds-content-switcher-padding - The padding of the content switcher (default: var(--dds-spacing-100, 4px))\n * @cssproperty --dds-content-switcher-border-width - The border width of the content switcher (default: var(--dds-border-width-base))\n * @cssproperty --dds-content-switcher-border-color - The border color of the content switcher (default: var(--dds-border-neutral-transparent))\n * @cssproperty --dds-content-switcher-border-radius - The border radius of the content switcher (default: var(--dds-radius-rounded, 1000px))\n * @cssproperty --dds-content-switcher-background - The background color of the content switcher (default: var(--dds-transparent-black-subtle, rgb(0 0 0 / 5%)))\n * @cssproperty --dds-content-switcher-gap - The gap between content switcher items (default: var(--dds-spacing-100, 4px))\n /\n const reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {\n onDdsChange: 'dds-change' as EventName<DdsChangeEvent>\n },\n displayName: \"DapDSContentSwitcher\"\n })\n\n export default reactWrapper\n ","\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/copybox-input/copybox-input.component.js'\n import type { DdsCopyEvent } from '../../events/events'\nimport type { DdsChangeEvent } from '../../events/events'\nimport type { DdsInputEvent } from '../../events/events'\nimport type { DdsKeydownEvent } from '../../events/events'\nimport type { DdsBlurEvent } from '../../events/events'\nimport type { DdsFocusEvent } from '../../events/events'\nimport type { DdsNotAllowedEvent } from '../../events/events'\n export type { DdsCopyEvent } from '../../events/events'\nexport type { DdsChangeEvent } from '../../events/events'\nexport type { DdsInputEvent } from '../../events/events'\nexport type { DdsKeydownEvent } from '../../events/events'\nexport type { DdsBlurEvent } from '../../events/events'\nexport type { DdsFocusEvent } from '../../events/events'\nexport type { DdsNotAllowedEvent } from '../../events/events'\n\n const tagName = 'dap-ds-copybox-input'\n\n /*\n `dap-ds-copybox-input`\n * @summary A copybox input is a field for copying an input value.\n * @element dap-ds-copybox-input\n * @title - CopyBox input\n \n @property {string} label - The label of the input.\n * @property {string} placeholder - The placeholder of the input.\n * @property {string} description - The description of the input.\n * @property {string} tooltip - The tooltip of the input.\n * @property {'top' \| 'right' \| 'bottom' \| 'left'} tooltipPlacement - The position of the tooltip. Can be `top`, `right`, `bottom`, or `left`.\n * @property {'success' \| 'error'} status - The status of the input. Can be `success` or `error`.\n * @property {'xs' \| 'sm' \| 'sm'} size - The size of the input. Default is `sm`.\n * @property {string} name - The name of the input.\n * @property {string} value - The value of the input.\n * @property {boolean} disabled - The disabled state of the input. Default is false.\n * @property {boolean} required - The required state of the input. Default is false.\n * @property {boolean} readonly - The readonly state of the input. Default is false.\n * @property {boolean} autofocus - The autofocus state of the input. Default is false.\n * @property {string} feedback - The feedback of the input.\n * @property {'negative' \| 'positive' \| 'warning'} feedbackType - The feedback type of the input. Can be `negative`, `positive`, or `warning`.\n * @property {boolean} loading - The loading state of the input. Default is false.\n * @property {boolean} optional - The optional state of the input.\n * @property {string} optionalLabel - The optional label of the input.\n * @property {boolean} subtle - The weight of the label. Default is `false`\n * @property {string} copyButtonAriaLabel - The aria label of the copy button.\n \n @event dds-copy - Fired when the user clicks on the copy button.\n * @event dds-change - Fired when the input value changes.\n * @event dds-input - Fired when the input value changes.\n * @event dds-keydown - Fired when a key is pressed down.\n * @event dds-blur - Fired when the input loses focus.\n * @event dds-focus - Emitted when the input gains focus.\n * @event dds-not-allowed - Emitted when the value cannot be copied.\n \n @cssproperty --dds-input-height - The height of the input. Default is var(--dds-spacing-1000).\n * @cssproperty --dds-input-padding - The padding of the input. Default is var(--dds-spacing-300).\n * @cssproperty --dds-input-font-size - The font size of the input. Default is var(--dds-font-base).\n * @cssproperty --dds-input-border-color - The border color of the input. Default is var(--dds-border-neutral-base).\n * @cssproperty --dds-input-background-color - The background color of the input. Default is var(--dds-fields-background-default).\n * @cssproperty --dds-input-text-color - The text color of the input. Default is var(--dds-text-neutral-base).\n * @cssproperty --dds-input-border-radius - The border radius of the input. Default is var(--dds-radius-base).\n * @cssproperty --dds-input-border-width - The border width of the input. Default is var(--dds-border-width-base).\n * @cssproperty --dds-input-disabled-background - The background color of the disabled input. Default is var(--dds-fields-background-disabled).\n * @cssproperty --dds-input-disabled-text - The text color of the disabled input. Default is var(--dds-text-neutral-disabled).\n * @cssproperty --dds-input-readonly-background - The background color of the readonly input. Default is var(--dds-fields-background-read-only).\n * @cssproperty --dds-input-readonly-text - The text color of the readonly input. Default is var(--dds-text-neutral-subtle).\n * @cssproperty --dds-input-success-border - The border color of the success input. Default is var(--dds-border-positive-base).\n * @cssproperty --dds-input-error-border - The border color of the error input. Default is var(--dds-border-negative-base).\n * @cssproperty --dds-input-addon-background - The background color of the input addon. Default is var(--dds-background-ui-neutral-enabled).\n * @cssproperty --dds-input-addon-success-background - The background color of the success input addon. Default is var(--dds-background-ui-positive-enabled).\n * @cssproperty --dds-input-addon-error-background - The background color of the error input addon. Default is var(--dds-background-ui-negative-enabled).\n \n @csspart base - The base container of the component.\n * @csspart postfix - The inner postfix icon part of the component.\n * @csspart button - The button of the component.\n /\n const reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {\n onDdsCopy: 'dds-copy' as EventName<DdsCopyEvent>,\nonDdsChange: 'dds-change' as EventName<DdsChangeEvent>,\nonDdsInput: 'dds-input' as EventName<DdsInputEvent>,\nonDdsKeydown: 'dds-keydown' as EventName<DdsKeydownEvent>,\nonDdsBlur: 'dds-blur' as EventName<DdsBlurEvent>,\nonDdsFocus: 'dds-focus' as EventName<DdsFocusEvent>,\nonDdsNotAllowed: 'dds-not-allowed' as EventName<DdsNotAllowedEvent>\n },\n displayName: \"DapDSCopyBoxInput\"\n })\n\n export default reactWrapper\n ","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/dap-badge/dap-badge.component.js'\n\nconst tagName = 'dap-ds-dap-badge'\n\n/*\n `dap-ds-dap-badge`\n * @summary A DÁP badge is a brand element showing the use of this system design library.\n * @element dap-ds-dap-badge\n * @title - Dap badge\n \n @slot - Description of badge\n * \n @csspart base - Main badge container\n * @csspart icon - Badge icon\n * @csspart text - Badge text\n \n @cssproperty --dds-badge-padding - Custom padding for the badge (default: var(--dds-spacing-200) var(--dds-spacing-300))\n * @cssproperty --dds-badge-border-width - Custom border width for the badge (default: var(--dds-border-width-base))\n * @cssproperty --dds-badge-border-color - Custom border color for the badge (default: var(--dds-border-neutral-divider))\n * @cssproperty --dds-badge-border-radius - Custom border radius for the badge (default: var(--dds-spacing-200))\n * @cssproperty --dds-badge-color - Custom text color for the badge (default: var(--dds-text-neutral-base))\n * @cssproperty --dds-badge-gap - Custom gap between icon and text (default: var(--dds-spacing-200))\n * @cssproperty --dds-badge-font-size - Custom font size for the badge (default: var(--dds-font-xs))\n * @cssproperty --dds-badge-font-weight - Custom font weight for the badge (default: var(--dds-font-weight-medium))\n * @cssproperty --dds-badge-line-height - Custom line height for the badge (default: var(--dds-font-line-height-large))\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'DapDSDAPBadge',\n})\n\nexport default reactWrapper\n","\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/datatable/datatable.component.js'\n import type { DdsSortingChangeEvent } from '../../events/events'\nimport type { DdsSelectionChangeEvent } from '../../events/events'\nimport type { DdsPaginationChangeEvent } from '../../events/events'\nimport type { DdsRowClickEvent } from '../../events/events'\n export type { DdsSortingChangeEvent } from '../../events/events'\nexport type { DdsSelectionChangeEvent } from '../../events/events'\nexport type { DdsPaginationChangeEvent } from '../../events/events'\nexport type { DdsRowClickEvent } from '../../events/events'\n\n const tagName = 'dap-ds-datatable'\n\n /*\n `dap-ds-datatable`\n * @summary A data table is a component that displays data in a tabular format.\n * @element dap-ds-datatable\n * @title - Data table\n * @generic T\n \n @event dds-sorting-change - Fired when the sorting of the table changes.\n * @event dds-selection-change - Fired when the selection of the table changes.\n * @event dds-pagination-change - Fired when the pagination of the table changes.\n * @event dds-row-click - Fired when a row is clicked.\n \n @csspart base - The main table container.\n * @csspart header - The header of the table.\n * @csspart header-row - The header row of the table.\n * @csspart header-cell - All cells of the header.\n * @csspart body - The body of the table.\n * @csspart row - All rows of the table.\n * @csspart cell - All cells of the table.\n * @csspart pager - The pager of the table.\n \n @cssproperty --dds-datatable-bg-color - Background color of the table\n * @cssproperty --dds-datatable-border-color - Border color of the table cells\n * @cssproperty --dds-datatable-header-bg-color - Background color of the table header\n * @cssproperty --dds-datatable-header-text-color - Text color of the table header\n * @cssproperty --dds-datatable-row-hover-bg-color - Background color of hovered rows\n * @cssproperty --dds-datatable-row-selected-bg-color - Background color of selected rows\n * @cssproperty --dds-datatable-cell-padding - Padding of table cells\n * @cssproperty --dds-datatable-header-padding - Padding of header cells\n * @cssproperty --dds-datatable-border-width - Width of table borders\n * @cssproperty --dds-datatable-font-size - Font size of the table\n * @cssproperty --dds-datatable-line-height - Line height of the table\n * @cssproperty --dds-datatable-header-font-weight - Font weight of the header\n * @cssproperty --dds-datatable-stripe-color - Background color for striped rows\n * @cssproperty --dds-datatable-stripe-enabled - Whether to enable striped rows\n * @cssproperty --dds-datatable-border-radius - Border radius of the table\n * @cssproperty --dds-datatable-shadow - Box shadow of the table\n * @cssproperty --dds-datatable-transition-duration - Duration of hover/selection transitions\n * @cssproperty --dds-datatable-z-index - Z-index of the table\n * @cssproperty --dds-datatable-min-height - Minimum height of the table\n * @cssproperty --dds-datatable-max-height - Maximum height of the table\n * @cssproperty --dds-datatable-overflow-x - Horizontal overflow behavior\n * @cssproperty --dds-datatable-overflow-y - Vertical overflow behavior\n /\n const reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {\n onDdsSortingChange: 'dds-sorting-change' as EventName<DdsSortingChangeEvent>,\nonDdsSelectionChange: 'dds-selection-change' as EventName<DdsSelectionChangeEvent>,\nonDdsPaginationChange: 'dds-pagination-change' as EventName<DdsPaginationChangeEvent>,\nonDdsRowClick: 'dds-row-click' as EventName<DdsRowClickEvent>\n },\n displayName: \"DapDSDataTable\"\n })\n\n export default reactWrapper\n ","\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/datepicker/datepicker.component.js'\n import type { DdsChangeEvent } from '../../events/events'\nimport type { DdsInputEvent } from '../../events/events'\nimport type { DdsValidDateEvent } from '../../events/events'\nimport type { DdsInvalidDateEvent } 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 { DdsValidDateEvent } from '../../events/events'\nexport type { DdsInvalidDateEvent } 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-datepicker'\n\n /*\n `dap-ds-datepicker`\n * @summary A datepicker is a graphical user interface widget that allows the user to select a date from a calendar and/or time from a time range.\n * @element dap-ds-datepicker\n * @title - Datepicker\n \n @property {Dayjs} value - The value of the datepicker.\n * @property {string} label - The label of the datepicker.\n * @property {string} description - The description of the datepicker.\n * @property {'xs' \| 'sm' \| 'sm'} size - The size of the datepicker.\n * @property {boolean} disabled - The disabled state of the datepicker.\n * @property {boolean} required - The required state of the datepicker.\n * @property {boolean} readonly - The readonly state of the datepicker.\n * @property {boolean} autofocus - The autofocus state of the datepicker.\n * @property {string} tooltip - The tooltip of the datepicker.\n * @property {'top' \| 'right' \| 'bottom' \| 'left'} tooltipPlacement - The tooltip placement of the datepicker.\n * @property {string} feedback - The feedback of the datepicker.\n * @property {'negative' \| 'positive' \| 'warning'} feedbackType - The feedback type of the datepicker.\n * @property {boolean} optional - The optional state of the datepicker.\n * @property {string} optionalLabel - The optional label of the datepicker.\n * @property {boolean} subtle - The weight of the label. Default is `false`\n * @property {string} autocomplete - The autocomplete of the datepicker.\n * @property {boolean} autofocus - The autofocus of the datepicker.\n \n @event dds-change - Fired when the datepicker value changes.\n * @event dds-input - Fired when the datepicker input value changes.\n * @event dds-valid-date - Fired when the datepicker input value is valid. Happens on manual input typing.\n * @event dds-invalid-date - Fired when the datepicker input value is invalid. Type can be 'invalid' or 'out-of-range'. Happens on manual input typing.\n * @event dds-clear - Fired when the datepicker is cleared.\n * @event dds-focus - Emitted when the datepicker gains focus.\n * @event dds-blur - Emitted when the datepicker loses focus.\n \n @csspart base - The main datepicker container.\n * @csspart calendar - The calendar of the datepicker.\n * @csspart trigger - The trigger button of the datepicker.\n * @csspart label - The label of the datepicker.\n * @csspart description - The description of the datepicker.\n * @csspart feedback - The feedback of the datepicker.\n * @csspart tooltip - The tooltip of the datepicker.\n * @csspart input - The input of the datepicker.\n * @csspart clear-button - The clear button of the datepicker.\n \n @cssproperty --dds-combobox-background - The background color of the combobox. Defaults to var(--dds-fields-background-default).\n * @cssproperty --dds-combobox-border-color - The border color of the combobox. Defaults to var(--dds-border-neutral-base).\n * @cssproperty --dds-combobox-border-width - The border width of the combobox. Defaults to var(--dds-border-width-base, 1px).\n * @cssproperty --dds-combobox-border-radius - The border radius of the combobox. Defaults to var(--dds-radius-base).\n * @cssproperty --dds-combobox-text-color - The text color of the combobox. Defaults to var(--dds-text-neutral-base).\n * @cssproperty --dds-combobox-placeholder-color - The placeholder text color. Defaults to var(--dds-text-neutral-subtle).\n * @cssproperty --dds-combobox-disabled-background - The background color when disabled. Defaults to var(--dds-background-neutral-stronger).\n * @cssproperty --dds-combobox-disabled-text - The text color when disabled. Defaults to var(--dds-text-neutral-disabled).\n * @cssproperty --dds-combobox-error-border - The border color for error state. Defaults to var(--dds-border-negative-base).\n * @cssproperty --dds-combobox-success-border - The border color for success state. Defaults to var(--dds-border-positive-base).\n * @cssproperty --dds-combobox-icon-color - The color of the icons. Defaults to var(--dds-text-icon-neutral-subtle).\n * @cssproperty --dds-combobox-clear-icon-color - The color of the clear icon. Defaults to var(--dds-button-subtle-icon-neutral-enabled).\n * @cssproperty --dds-combobox-popup-background - The background color of the popup. Defaults to var(--dds-background-neutral-subtle).\n * @cssproperty --dds-combobox-popup-shadow - The box shadow of the popup. Defaults to 0 4px 6px -1px rgb(0 0 0 / 8%), 0 2px 4px -1px rgb(0 0 0 / 6%).\n \n @cssproperty --dds-combobox-padding-xs - The padding for extra small size. Defaults to var(--dds-spacing-200).\n * @cssproperty --dds-combobox-padding-sm - The padding for small size. Defaults to var(--dds-spacing-200).\n * @cssproperty --dds-combobox-padding-lg - The padding for large size. Defaults to var(--dds-spacing-300).\n * @cssproperty --dds-combobox-padding-horizontal - The horizontal padding. Defaults to var(--dds-spacing-300).\n * @cssproperty --dds-combobox-padding-vertical - The vertical padding. Defaults to var(--dds-spacing-200).\n * @cssproperty --dds-combobox-gap - The gap between elements. Defaults to var(--dds-spacing-100).\n * @cssproperty --dds-combobox-icon-gap - The gap between icons. Defaults to var(--dds-spacing-200).\n * @cssproperty --dds-combobox-action-gap - The gap between action elements. Defaults to var(--dds-spacing-200).\n * @cssproperty --dds-combobox-action-padding - The padding for action elements. Defaults to var(--dds-spacing-300).\n * @cssproperty --dds-combobox-clear-icon-width - The width of the clear icon. Defaults to var(--dds-spacing-800).\n * @cssproperty --dds-combobox-dropdown-icon-right - The right position of the dropdown icon. Defaults to var(--dds-spacing-600).\n * @cssproperty --dds-combobox-min-width - The minimum width of the combobox. Defaults to 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>,\nonDdsValidDate: 'dds-valid-date' as EventName<DdsValidDateEvent>,\nonDdsInvalidDate: 'dds-invalid-date' as EventName<DdsInvalidDateEvent>,\nonDdsClear: 'dds-clear' as EventName<DdsClearEvent>,\nonDdsFocus: 'dds-focus' as EventName<DdsFocusEvent>,\nonDdsBlur: 'dds-blur' as EventName<DdsBlurEvent>\n },\n displayName: \"DapDSDatePicker\"\n })\n\n export default reactWrapper\n ","import { createComponent } from '@lit/react'\nimport * as React from 'react'\n\nimport Component from '../../components/divider/divider.component.js'\n\nconst tagName = 'dap-ds-divider'\n\n/*\n `dap-ds-divider`\n * @summary A divider is a visual separator between elements.\n * @element dap-ds-divider\n * @title - Divider\n \n @cssproperty --dds-divider-border-width - The width of the divider border. Defaults to var(--dds-border-width-base)\n * @cssproperty --dds-divider-border-style - The style of the divider border. Defaults to solid\n * @cssproperty --dds-divider-border-color - The color of the divider border. Defaults to var(--dds-border-neutral-divider)\n * @cssproperty --dds-divider-border-color-inverted - The color of the divider border when inverted. Defaults to var(--dds-border-neutral-divider-inverted)\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'DapDSDivider',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/feedback/feedback.component.js'\n\nconst tagName = 'dap-ds-feedback'\n\n/*\n `dap-ds-feedback`\n * @summary A feedback is a container for feedback messages.\n * @element dap-ds-feedback\n * @title - Feedback\n \n @property {string} feedback - The feedback message.\n * @property {'xs' \| 'sm' \| 'lg'} feedbackSize - The size of the feedback. Default is `sm`.\n * @property {'negative' \| 'positive' \| 'warning'} feedbackSize - The type of the feedback.\n * @property {boolean} feedbackSubtle - The weight of the feedback.\n * @property {boolean} feedbackNoMargin - Removes the margins around the feedback.\n * @property {string} feedbackId - The id of the feedback.\n \n @slot icon - The custom icon of the feedback.\n * @slot - The text of the feedback.\n \n @csspart base - The main feedback container.\n * @csspart icon - The icon of the feedback.\n * @csspart text - The text of the feedback.\n \n @cssproperty --dds-feedback-spacing - The spacing around the feedback component. Default is `var(--dds-spacing-200)`.\n * @cssproperty --dds-feedback-color - The text color of the feedback. Default is `var(--dds-text-positive-subtle)`.\n * @cssproperty --dds-feedback-font-size - The font size of the feedback. Default is `var(--dds-font-sm)`.\n * @cssproperty --dds-feedback-font-weight - The font weight of the feedback. Default is `var(--dds-font-weight-bold)`.\n * @cssproperty --dds-feedback-icon-fill - The fill color of the feedback icon. Default is `var(--dds-icon-positive-subtle)`.\n * @cssproperty --dds-feedback-icon-spacing - The spacing between the icon and text. Default is `var(--dds-spacing-100)`.\n \n @cssproperty --dds-feedback-color-warning - The text color for warning feedback. Default is `var(--dds-text-neutral-base)`.\n * @cssproperty --dds-feedback-color-positive - The text color for positive feedback. Default is `var(--dds-text-positive-subtle)`.\n * @cssproperty --dds-feedback-color-negative - The text color for negative feedback. Default is `var(--dds-text-negative-subtle)`.\n * @cssproperty --dds-feedback-icon-fill-warning - The icon fill color for warning feedback. Default is `var(--dds-icon-informative-subtle)`.\n * @cssproperty --dds-feedback-icon-fill-positive - The icon fill color for positive feedback. Default is `var(--dds-icon-positive-subtle)`.\n * @cssproperty --dds-feedback-icon-fill-negative - The icon fill color for negative feedback. Default is `var(--dds-icon-negative-subtle)`.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'DapDSFeedback',\n})\n\nexport default reactWrapper\n","\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/file-input/file-input-list-item.component.js'\n import type { DdsFileRemoveEvent } from '../../events/events'\n export type { DdsFileRemoveEvent } from '../../events/events'\n\n const tagName = 'dap-ds-file-input-list-item'\n\n /*\n `dap-ds-file-input-list-item`\n * @summary A file input list item is a container for file input list items.\n * @element dap-ds-file-input-list-item\n * @title - File input list item\n * @group file-input\n \n @event dds-file-remove - Dispatched when a file is removed from the list.\n \n @csspart base - The main file input list item container.\n * @csspart feedback - The feedback container.\n * @csspart link - The link text of the item component.\n \n @cssproperty --dds-file-list-item-padding - The padding of the file list item.\n * @cssproperty --dds-file-list-item-border-width - The border width of the file list item.\n * @cssproperty --dds-file-list-item-border-color - The border color of the file list item.\n * @cssproperty --dds-file-list-item-border-radius - The border radius of the file list item.\n * @cssproperty --dds-file-list-item-bg-color - The background color of the file list item.\n * @cssproperty --dds-file-list-item-font-weight - The font weight of the file list item.\n * @cssproperty --dds-file-list-item-disabled-bg-color - The background color of the disabled file list item.\n * @cssproperty --dds-file-list-item-disabled-color - The text color of the disabled file list item.\n * @cssproperty --dds-file-list-item-content-margin - The margin of the content within the file list item.\n * @cssproperty --dds-file-list-item-content-gap - The gap between content elements in the file list item.\n * @cssproperty --dds-file-list-item-filename-color - The color of the filename text.\n * @cssproperty --dds-file-list-item-filesize-color - The color of the filesize text.\n * @cssproperty --dds-file-list-item-feedback-padding - The padding of the feedback section.\n * @cssproperty --dds-file-list-item-feedback-border-color - The border color of the feedback section.\n * @cssproperty --dds-file-list-item-feedback-font-size - The font size of the feedback text.\n /\n const reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {\n onDdsFileRemove: 'dds-file-remove' as EventName<DdsFileRemoveEvent>\n },\n displayName: \"DapDSFileInputListItem\"\n })\n\n export default reactWrapper\n ","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/file-input/file-input-list.component.js'\n\nconst tagName = 'dap-ds-file-input-list'\n\n/*\n `dap-ds-file-input-list`\n * @summary A file input list is a container for file input items.\n * @element dap-ds-file-input-list\n * @title - File input list\n * @group file-input\n \n @csspart base - The main file input list container.\n \n @cssproperty --dds-file-list-display - Controls the display property (default: flex)\n * @cssproperty --dds-file-list-flex-direction - Controls the flex-direction property (default: column)\n * @cssproperty --dds-file-list-padding - Controls the padding property (default: 0)\n * @cssproperty --dds-file-list-list-style - Controls the list-style-type property (default: none)\n * @cssproperty --dds-file-list-gap - Controls the row-gap property (default: var(--dds-spacing-200))\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'DapDSFileInputList',\n})\n\nexport default reactWrapper\n","\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/file-input/file-input.component.js'\n import type { DdsUploadStartEvent } from '../../events/events'\nimport type { DdsUploadProgressEvent } from '../../events/events'\nimport type { DdsUploadCompleteEvent } from '../../events/events'\nimport type { DdsUploadErrorEvent } from '../../events/events'\nimport type { DdsAllUploadsCompleteEvent } from '../../events/events'\nimport type { DdsFileRemovedEvent } from '../../events/events'\nimport type { DdsFileChangeEvent } from '../../events/events'\n export type { DdsUploadStartEvent } from '../../events/events'\nexport type { DdsUploadProgressEvent } from '../../events/events'\nexport type { DdsUploadCompleteEvent } from '../../events/events'\nexport type { DdsUploadErrorEvent } from '../../events/events'\nexport type { DdsAllUploadsCompleteEvent } from '../../events/events'\nexport type { DdsFileRemovedEvent } from '../../events/events'\nexport type { DdsFileChangeEvent } from '../../events/events'\n\n const tagName = 'dap-ds-file-input'\n\n /*\n `dap-ds-file-input`\n * @summary A file input is a control that allows users to select files to upload.\n * @element dap-ds-file-input\n * @title - File input\n \n @property {string} name - The name of the file input.\n * @property {string} value - The value of the file input.\n * @property {'success' \| 'error'} status - The status of the file input.\n * @property {string} label - The label for the file input.\n * @property {string} description - The description for the file input.\n * @property {string} tooltip - The tooltip for the file input.\n * @property {'top' \| 'right' \| 'bottom' \| 'left'} tooltipPlacement - The tooltip placement of the input.\n * @property {boolean} disabled - Whether the file input is disabled.\n * @property { 'xs' \| 'sm' \| 'lg' } size - The size of the file input.\n * @property {string} feedback - The feedback for the file input.\n * @property {'negative' \| 'positive' \| 'warning'} feedbackType - The type of feedback for the file input.\n * @property {boolean} required - Whether the file input is required.\n * @property {boolean} optional - Whether the file input is optional.\n * @property {boolean} subtle - Font weight of the feedback label. Default is `false` which is bold.\n \n @event dds-upload-start - Fired when a file upload starts.\n * @event dds-upload-progress - Fired during file upload progress.\n * @event dds-upload-complete - Fired when a file upload completes successfully.\n * @event dds-upload-error - Fired when a file upload encounters an error.\n * @event dds-all-uploads-complete - Fired when all file uploads are complete.\n * @event dds-file-removed - Fired when a file is removed from the file input.\n * @event dds-file-change - Fired when the file input value changes.\n \n @csspart base - The main file input container.\n * @csspart input - The file input control.\n * @csspart label - The file input label.\n * @csspart description - The file input description.\n * @csspart feedback - The file input feedback.\n * @csspart tooltip - The file input tooltip.\n /\n const reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {\n onDdsUploadStart: 'dds-upload-start' as EventName<DdsUploadStartEvent>,\nonDdsUploadProgress: 'dds-upload-progress' as EventName<DdsUploadProgressEvent>,\nonDdsUploadComplete: 'dds-upload-complete' as EventName<DdsUploadCompleteEvent>,\nonDdsUploadError: 'dds-upload-error' as EventName<DdsUploadErrorEvent>,\nonDdsAllUploadsComplete: 'dds-all-uploads-complete' as EventName<DdsAllUploadsCompleteEvent>,\nonDdsFileRemoved: 'dds-file-removed' as EventName<DdsFileRemovedEvent>,\nonDdsFileChange: 'dds-file-change' as EventName<DdsFileChangeEvent>\n },\n displayName: \"DapDSFileInput\"\n })\n\n export default reactWrapper\n ","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/icon/icon.component.js'\n\nconst tagName = 'dap-ds-icon'\n\n/*\n `dap-ds-icon`\n * @summary An icon is a graphical symbol that represents an object or action.\n * @element dap-ds-icon\n * @title - Icon\n \n @property {boolean} ariaHidden - Whether the icon is hidden from the accessibility tree. Default is true.\n * @property {string} ariaLabel - The aria label of the icon.\n \n @slot - The content of the icon for custom svg icons.\n \n @csspart base - The main icon container.\n * @csspart icon - The icon of the icon.\n \n @cssproperty --dds-icon-size-xs - The size of extra small icons (default: 12px)\n * @cssproperty --dds-icon-size-sm - The size of small icons (default: 16px)\n * @cssproperty --dds-icon-size-md - The size of medium icons (default: 20px)\n * @cssproperty --dds-icon-size-lg - The size of large icons (default: 24px)\n * @cssproperty --dds-icon-size-xl - The size of extra large icons (default: 32px)\n * @cssproperty --dds-icon-size-xxl - The size of extra extra large icons (default: 40px)\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'DapDSIcon',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/icon-button/icon-button.component.js'\n\nconst tagName = 'dap-ds-icon-button'\n\n/*\n `dap-ds-icon-button`\n * @summary An icon button is a button with an icon.\n * @element dap-ds-icon-button\n * @title - Icon button\n \n @property {string} ariaLabel - The aria label of the button.\n \n @slot - The icon of the button.\n \n @csspart base - The main button container.\n * @csspart content - The icon of the button.\n \n @cssproperty --dds-icon-button-border-width - The width of the button's border. Defaults to var(--dds-border-width-base).\n * @cssproperty --dds-icon-button-border-color - The color of the button's border. Defaults to var(--dds-border-neutral-transparent-interactive).\n * @cssproperty --dds-icon-button-border-radius - The border radius of the button. Defaults to var(--dds-radius-rounded).\n * @cssproperty --dds-icon-button-hover-border-width - The width of the button's border on hover. Defaults to var(--dds-border-width-large).\n * @cssproperty --dds-icon-button-active-border-width - The width of the button's border when active. Defaults to var(--dds-border-width-xlarge).\n * @cssproperty --dds-icon-button-transition - The transition property for the button. Defaults to var(--dds-transition-all).\n * @cssproperty --dds-icon-button-cursor - The cursor style for the button. Defaults to pointer.\n * @cssproperty --dds-icon-button-disabled-cursor - The cursor style for the disabled button. Defaults to not-allowed.\n \n @cssproperty --dds-icon-button-column-gap - The gap between icon and text. Defaults to var(--dds-spacing-100).\n * @cssproperty --dds-icon-button-padding-lg - Padding for large size. Defaults to var(--dds-spacing-0).\n * @cssproperty --dds-icon-button-padding-md - Padding for medium size. Defaults to var(--dds-spacing-100).\n * @cssproperty --dds-icon-button-padding-sm - Padding for small size. Defaults to var(--dds-spacing-50).\n * @cssproperty --dds-icon-button-padding-xs - Padding for extra small size. Defaults to var(--dds-spacing-25).\n \n @cssproperty --dds-icon-button-size-lg - Size for large button. Defaults to var(--dds-spacing-800).\n * @cssproperty --dds-icon-button-size-md - Size for medium button. Defaults to var(--dds-spacing-600).\n * @cssproperty --dds-icon-button-size-sm - Size for small button. Defaults to var(--dds-spacing-400).\n * @cssproperty --dds-icon-button-size-xs - Size for extra small button. Defaults to var(--dds-spacing-300).\n \n @cssproperty --dds-icon-button-neutral-bg - Background color for neutral variant. Defaults to var(--dds-transparent-black-subtle).\n * @cssproperty --dds-icon-button-neutral-color - Text color for neutral variant. Defaults to var(--dds-icon-neutral-base).\n * @cssproperty --dds-icon-button-neutral-hover-bg - Hover background color for neutral variant. Defaults to var(--dds-transparent-black-base).\n * @cssproperty --dds-icon-button-neutral-active-bg - Active background color for neutral variant. Defaults to var(--dds-transparent-black-medium).\n \n @cssproperty --dds-icon-button-brand-bg - Background color for brand variant. Defaults to var(--dds-button-subtle-background-enabled).\n * @cssproperty --dds-icon-button-brand-color - Text color for brand variant. Defaults to var(--dds-button-subtle-icon-enabled).\n * @cssproperty --dds-icon-button-brand-hover-bg - Hover background color for brand variant. Defaults to var(--dds-button-subtle-background-hover).\n * @cssproperty --dds-icon-button-brand-active-bg - Active background color for brand variant. Defaults to var(--dds-button-subtle-background-pressed).\n \n @cssproperty --dds-icon-button-inverted-bg - Background color for inverted variant. Defaults to var(--dds-transparent-white-subtle).\n * @cssproperty --dds-icon-button-inverted-color - Text color for inverted variant. Defaults to var(--dds-button-primary-icon-enabled).\n * @cssproperty --dds-icon-button-inverted-hover-bg - Hover background color for inverted variant. Defaults to var(--dds-transparent-white-base).\n * @cssproperty --dds-icon-button-inverted-active-bg - Active background color for inverted variant. Defaults to var(--dds-transparent-white-medium).\n \n @cssproperty --dds-icon-button-inverted-brand-bg - Background color for inverted brand variant. Defaults to var(--dds-button-primary-background-enabled).\n * @cssproperty --dds-icon-button-inverted-brand-color - Text color for inverted brand variant. Defaults to var(--dds-button-primary-icon-enabled).\n * @cssproperty --dds-icon-button-inverted-brand-hover-bg - Hover background color for inverted brand variant. Defaults to var(--dds-button-primary-background-enabled).\n * @cssproperty --dds-icon-button-inverted-brand-active-bg - Active background color for inverted brand variant. Defaults to var(--dds-button-primary-background-enabled).\n \n @cssproperty --dds-icon-button-disabled-color - Color for disabled state. Defaults to var(--dds-icon-neutral-disabled).\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'DapDSIconButton',\n})\n\nexport default reactWrapper\n","\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/input/input.component.js'\n import type { DdsChangeEvent } from '../../events/events'\nimport type { DdsInputEvent } from '../../events/events'\nimport type { DdsKeydownEvent } from '../../events/events'\nimport type { DdsBlurEvent } from '../../events/events'\nimport type { DdsFocusEvent } from '../../events/events'\n export type { DdsChangeEvent } from '../../events/events'\nexport type { DdsInputEvent } from '../../events/events'\nexport type { DdsKeydownEvent } from '../../events/events'\nexport type { DdsBlurEvent } from '../../events/events'\nexport type { DdsFocusEvent } from '../../events/events'\n\n const tagName = 'dap-ds-input'\n\n /*\n `dap-ds-input`\n * @summary An input is a field used to collect user input.\n * @element dap-ds-input\n * @title - Input\n \n @property {string} label - The label of the input.\n * @property {string} description - The description of the input.\n * @property {string} optionalLabel - Text of optional label.\n * @property {boolean} subtle - Text weight of label. If true the label is subtle. Default value is false.\n * @property {string} value - The value of the input.\n * @property {string} placeholder - The placeholder of the input.\n * @property {boolean} loading - The loading state of the input. Default is false.\n * @property {string} tooltip - The tooltip of the input.\n * @property {'top' \| 'right' \| 'bottom' \| 'left'} tooltipPlacement - The tooltip placement of the input.\n * @property {string} tooltipAriaLabel - The aria label of the tooltip.\n * @property {string} feedback - The feedback of the input.\n * @property {'negative' \| 'positive' \| 'warning'} feedbackType - The feedback type of the input. Can be `negative`, `positive`, or `warning`.\n * @property {'succes' \| 'error'} status - The status of the input. Can be `success` or `error`.\n * @property {'xs' \| 'sm' \| 'lg'} size - The size of the input. Default is `sm`.\n * @property {string} name - The name of the input.\n * @property {'text' \| 'number' \| 'button' \| 'color' \| 'email' \| 'hidden' \| 'reset' \| 'submit' \| 'url' \| 'password'\| 'file'} type - The type of the input. Default is 'text'.\n * @property {boolean} disabled - The disabled state of the input. Default is false.\n * @property {boolean} required - The required state of the input. Default is false.\n * @property {boolean} readonly - The readonly state of the input. Default is false.\n * @property {boolean} autofocus - The autofocus state of the input. Default is false.\n * @property {boolean} autocapitalize - The autocapitalize state of the input. Default is false.\n * @property {number} minlength - The minimum length of the input.\n * @property {number} maxlength - The maximum length of the input.\n * @property {number} min - The minimum value of the number input.\n * @property {number} max - The maximum value of the number input.\n * @property {number} step - The step value of the number input.\n * @property {string} inputmode - The inputmode of the input.\n * @property {string} pattern - The regex pattern of the input.\n \n @cssproperty --dds-input-height - The height of the input. Default is var(--dds-spacing-1000).\n * @cssproperty --dds-input-padding - The padding of the input. Default is var(--dds-spacing-300).\n * @cssproperty --dds-input-font-size - The font size of the input. Default is var(--dds-font-base).\n * @cssproperty --dds-input-border-color - The border color of the input. Default is var(--dds-border-neutral-base).\n * @cssproperty --dds-input-background-color - The background color of the input. Default is var(--dds-fields-background-default).\n * @cssproperty --dds-input-text-color - The text color of the input. Default is var(--dds-text-neutral-base).\n * @cssproperty --dds-input-border-radius - The border radius of the input. Default is var(--dds-radius-base).\n * @cssproperty --dds-input-border-width - The border width of the input. Default is var(--dds-border-width-base).\n * @cssproperty --dds-input-disabled-background - The background color of the disabled input. Default is var(--dds-fields-background-disabled).\n * @cssproperty --dds-input-disabled-text - The text color of the disabled input. Default is var(--dds-text-neutral-disabled).\n * @cssproperty --dds-input-readonly-background - The background color of the readonly input. Default is var(--dds-fields-background-read-only).\n * @cssproperty --dds-input-readonly-text - The text color of the readonly input. Default is var(--dds-text-neutral-subtle).\n * @cssproperty --dds-input-success-border - The border color of the success input. Default is var(--dds-border-positive-base).\n * @cssproperty --dds-input-error-border - The border color of the error input. Default is var(--dds-border-negative-base).\n * @cssproperty --dds-input-addon-background - The background color of the input addon. Default is var(--dds-background-ui-neutral-enabled).\n * @cssproperty --dds-input-addon-success-background - The background color of the success input addon. Default is var(--dds-background-ui-positive-enabled).\n * @cssproperty --dds-input-addon-error-background - The background color of the error input addon. Default is var(--dds-background-ui-negative-enabled).\n \n @event dds-change - Fired when the input value changes.\n * @event dds-input - Fired when the input value changes.\n * @event dds-keydown - Fired when a key is pressed down.\n * @event dds-blur - Fired when the input loses focus.\n * @event dds-focus - Emitted when the input gains focus.\n \n @slot postfix - The postfix of the input.\n * @slot prefix - The prefix of the input.\n * @slot addon-before - The addon before the input.\n * @slot addon-after - The addon after the input.\n * @slot feedback-icon - The custom icon of the feedback.\n \n @csspart base - The main input container.\n * @csspart input - The input element.\n * @csspart label - The label of the input.\n * @csspart description - The description of the input.\n * @csspart feedback - The feedback of the input.\n * @csspart tooltip - The tooltip of the input.\n * @csspart addon-before - The addon before the input.\n * @csspart addon-after - The addon after the input.\n * @csspart prefix - The prefix of the input.\n * @csspart postfix - The postfix of the input.\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>,\nonDdsKeydown: 'dds-keydown' as EventName<DdsKeydownEvent>,\nonDdsBlur: 'dds-blur' as EventName<DdsBlurEvent>,\nonDdsFocus: 'dds-focus' as EventName<DdsFocusEvent>\n },\n displayName: \"DapDSInput\"\n })\n\n export default reactWrapper\n ","import { createComponent } from '@lit/react'\nimport * as React from 'react'\n\nimport Component from '../../components/label/label.component.js'\n\nconst tagName = 'dap-ds-label'\n\n/*\n `dap-ds-label`\n * @summary A label is a container for labels intended for general use. It contains a label text, description, and tooltip.\n * @element dap-ds-label\n * @title - Label\n \n @property {string} label - The label text\n * @property {string} description - The description of the label\n * @property {string} tooltip - The tooltip text\n * @property {'xs' \| 'sm' \| 'lg'} size - The size of the input. Default is `sm`.\n * @property {'top' \| 'right' \| 'bottom' \| 'left'} tooltipPlacement - The tooltip placement of the label.\n * @property {boolean} optional - If the label is optional. Default value is `false`.\n * @property {string} optionalLabel - Label of optional text\n * @property {boolean} subtle - Text weight of label. If true the label is subtle. Default value is `false`.\n * @property {boolean} disabled - The disabled state of the label. Default is `false`.\n * @property {boolean} required - The required state of the label. Default is `false`.\n \n @csspart base - The main label container.\n * @csspart label - Tha main label container. dap-ds-form-label element.\n * @csspart label-base - The label text.\n * @csspart label-required - The required indicator of the label.\n * @csspart label-optional - The optional indicator of the label.\n * @csspart tooltip - The tooltip of the label. dap-ds-tooltip element.\n * @csspart description - The description of the label.\n \n @cssproperty {string} --dds-label-background - The background color of the label container. Default is `var(--dds-background-neutral-subtle)`.\n * @cssproperty {string} --dds-label-border-color - The border color of the label container. Default is `var(--dds-border-neutral-subtle)`.\n * @cssproperty {string} --dds-label-border-width - The border width of the label container. Default is `var(--dds-border-width-base)`.\n * @cssproperty {string} --dds-label-border-radius - The border radius of the label container. Default is `var(--dds-radius-base)`.\n * @cssproperty {string} --dds-label-padding - The padding of the label container. Default is `var(--dds-spacing-400)`.\n * @cssproperty {string} --dds-label-disabled-background - The background color of the label container when disabled. Default is `var(--dds-background-neutral-disabled-inverted)`.\n * @cssproperty {string} --dds-label-checked-border-color - The border color of the label container when checked. Default is `var(--dds-background-brand-base-inverted)`.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'DapDSLabel',\n})\n\nexport default reactWrapper\n","\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/link/link.component.js'\n import type { DdsClickEvent } from '../../events/events'\n export type { DdsClickEvent } from '../../events/events'\n\n const tagName = 'dap-ds-link'\n\n /*\n `dap-ds-link`\n * @summary A link is a reference to a web resource.\n * @element dap-ds-link\n * @title - Link\n \n @event dds-click - Emitted when the link is clicked.\n \n @slot - The text of the link.\n \n @csspart base - The main link container.\n * @csspart text - The text of the link.\n \n @cssproperty --dds-link-color - The color of the link text\n * @cssproperty --dds-link-hover-color - The color of the link text on hover\n * @cssproperty --dds-link-active-color - The color of the link text when active\n * @cssproperty --dds-link-visited-color - The color of the visited link text\n * @cssproperty --dds-link-font-size - The font size of the link text\n * @cssproperty --dds-link-line-height - The line height of the link text\n * @cssproperty --dds-link-font-weight - The font weight of the link text\n * @cssproperty --dds-link-text-decoration - The text decoration of the link\n \n @cssproperty --dds-link-neutral-color - The color of the neutral variant link\n * @cssproperty --dds-link-neutral-hover-color - The hover color of the neutral variant link\n * @cssproperty --dds-link-neutral-active-color - The active color of the neutral variant link\n * @cssproperty --dds-link-neutral-visited-color - The visited color of the neutral variant link\n \n @cssproperty --dds-link-brand-color - The color of the brand variant link\n * @cssproperty --dds-link-brand-hover-color - The hover color of the brand variant link\n * @cssproperty --dds-link-brand-active-color - The active color of the brand variant link\n * @cssproperty --dds-link-brand-visited-color - The visited color of the brand variant link\n \n @cssproperty --dds-link-inverted-color - The color of the inverted variant link\n * @cssproperty --dds-link-inverted-hover-color - The hover color of the inverted variant link\n * @cssproperty --dds-link-inverted-active-color - The active color of the inverted variant link\n * @cssproperty --dds-link-inverted-visited-color - The visited color of the inverted variant link\n \n @cssproperty --dds-link-warning-color - The color of the warning variant link\n * @cssproperty --dds-link-warning-hover-color - The hover color of the warning variant link\n * @cssproperty --dds-link-warning-active-color - The active color of the warning variant link\n * @cssproperty --dds-link-warning-visited-color - The visited color of the warning variant link\n \n @cssproperty --dds-link-disabled-color - The color of the disabled link\n * @cssproperty --dds-link-disabled-hover-color - The hover color of the disabled link\n * @cssproperty --dds-link-disabled-active-color - The active color of the disabled link\n * @cssproperty --dds-link-disabled-visited-color - The visited color of the disabled link\n \n @cssproperty --dds-link-lg-font-size - The font size of the large link\n * @cssproperty --dds-link-lg-line-height - The line height of the large link\n * @cssproperty --dds-link-md-font-size - The font size of the medium link\n * @cssproperty --dds-link-md-line-height - The line height of the medium link\n * @cssproperty --dds-link-sm-font-size - The font size of the small link\n * @cssproperty --dds-link-sm-line-height - The line height of the small link\n * @cssproperty --dds-link-xs-font-size - The font size of the extra small link\n * @cssproperty --dds-link-xs-line-height - The line height of the extra small link\n \n @cssproperty --dds-link-normal-font-weight - The font weight of the normal link\n * @cssproperty --dds-link-bold-font-weight - The font weight of the bold link\n \n @cssproperty --dds-link-no-underline-text-decoration - The text decoration when underline is removed\n /\n const reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {\n onDdsClick: 'dds-click' as EventName<DdsClickEvent>\n },\n displayName: \"DapDSLink\"\n })\n\n export default reactWrapper\n ","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/list-item/list-item.component.js'\n\nconst tagName = 'dap-ds-list-item'\n\n/*\n `dap-ds-list-item` is a custom banner component.\n * @element dap-ds-list-item\n * @summary A list\n * @title - List item\n \n @slot - The content of the list item.\n * @slot icon - The icon of the list item.\n * @slot title - The title of the list item.\n * @slot actions - The actions of the list item.\n \n @csspart base - The main list item container.\n * @csspart icon - The icon of the list item.\n * @csspart title - The title of the list item.\n * @csspart description - The description of the list item.\n * @csspart container - The container of the list item.\n \n @cssproperty --dds-list-item-gap - Gap between list item elements (default: var(--dds-spacing-200))\n * @cssproperty --dds-list-item-content-gap - Gap between content elements (default: var(--dds-spacing-200))\n * @cssproperty --dds-list-item-horizontal-gap - Gap for horizontal alignment (default: var(--dds-spacing-300))\n * @cssproperty --dds-list-item-vertical-gap - Gap for vertical alignment (default: var(--dds-spacing-200))\n * @cssproperty --dds-list-item-icon-size - Size of the icon (default: var(--dds-spacing-600))\n * @cssproperty --dds-list-item-number-size - Size of the number icon (default: 20px)\n * @cssproperty --dds-list-item-actions-gap - Gap between action elements (default: var(--dds-spacing-400))\n * @cssproperty --dds-list-item-actions-padding - Padding for the actions container (default: var(--dds-spacing-100))\n \n @cssproperty --dds-list-item-background-base - Background color for base shade (default: var(--dds-background-neutral-base))\n * @cssproperty --dds-list-item-background-subtle - Background color for subtle shade (default: var(--dds-background-neutral-subtle))\n * @cssproperty --dds-list-item-background-medium - Background color for medium shade (default: var(--dds-background-neutral-medium))\n * @cssproperty --dds-list-item-background-strong - Background color for strong shade (default: var(--dds-background-neutral-strong))\n \n @cssproperty --dds-list-item-icon-brand - Color for brand icon (default: var(--dds-icon-brand-subtle))\n * @cssproperty --dds-list-item-icon-neutral - Color for neutral icon (default: var(--dds-icon-neutral-base))\n * @cssproperty --dds-list-item-icon-positive - Color for positive icon (default: var(--dds-icon-positive-subtle))\n * @cssproperty --dds-list-item-icon-negative - Color for negative icon (default: var(--dds-icon-negative-subtle))\n \n @cssproperty --dds-list-item-title-color - Title text color (default: var(--dds-text-neutral-strong))\n * @cssproperty --dds-list-item-description-color - Description text color (default: var(--dds-text-neutral-base))\n * @cssproperty --dds-list-item-number-text-color - Number text color (default: var(--dds-text-neutral-inverted))\n \n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'DapDSListItem',\n})\n\nexport default reactWrapper\n","\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/modal/modal.component.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'\nimport type { DdsOkEvent } from '../../events/events'\nimport type { DdsCancelEvent } 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'\nexport type { DdsOkEvent } from '../../events/events'\nexport type { DdsCancelEvent } from '../../events/events'\n\n const tagName = 'dap-ds-modal'\n\n /*\n `dap-ds-modal`\n * @summary A modal is a container for modal content.\n * @element dap-ds-modal\n * @title - Modal\n \n @property {boolean} open - The open state of the modal.\n * @property {boolean} fullScreen - The full screen version of the modal.\n * @property {boolean} wideFooter - Wide layout mode for footer.\n * @property {boolean} bottomFooter - Pushes the footer to bottom.\n * @property {boolean} closeOnEsc - Whether the modal should close on pressing the escape key. Default is true.\n * @property {boolean} closeOnOverlayClick - Whether the modal should close on clicking the overlay. Default is true.\n * @property {string} closeButton - Whether the modal should have a close button. Default is true.\n * @property {string} title - The title of the modal.\n * @property {string} description - The description of the modal.\n * @property {string} okButtonLabel - The label of the OK button.\n * @property {string} cancelButtonLabel - The label of the Cancel button.\n * @property {boolean} okButtonDisabled - Whether the OK button should be disabled.\n * @property {boolean} cancelButtonDisabled - Whether the Cancel button should be disabled.\n * @property {boolean} cancelButtonDanger - Whether the Cancel button should be a danger button.\n * @property {boolean} okButtonDanger - Whether the OK button should be a danger button.\n * @property {boolean} hideOkButton - Whether the OK button should be hidden.\n * @property {boolean} hideCancelButton - Whether the Cancel button should be hidden.\n * @property {string} footer - Whether the modal should have a footer. Default is true.\n * @property {string} header - Whether the modal should have a header. Default is true.\n * @property {boolean} useNativeFocus - Whether the modal should use native focus. Default is false.\n \n @event dds-before-open - Fires before the modal opens.\n * @event dds-opened - Fires after the modal opens.\n * @event dds-before-close - Fires before the modal closes.\n * @event dds-closed - Fires after the modal closed.\n * @event dds-close - Fires when the modal is closes. You can prevent the modal from closing by calling `event.preventDefault()`.\n * @event dds-ok - Fires when the OK button is clicked. You can prevent the modal from closing by calling `event.preventDefault()`.\n * @event dds-cancel - Fires when the Cancel button is clicked. You can prevent the modal from closing by calling `event.preventDefault()`.\n \n @slot - The content of the modal.\n * @slot title - The title of the modal.\n * @slot description - The description of the modal.\n * @slot footer - The footer of the modal.\n \n @csspart base - The main modal container.\n * @csspart panel - The panel of the modal.\n * @csspart header - The header of the modal.\n * @csspart title - The title of the modal.\n * @csspart description - The description of the modal.\n * @csspart footer - The footer of the modal.\n * @csspart content - The body of the modal.\n * @csspart closebutton - The close button of the modal.\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 - Padding inside the modal. Default: var(--dds-spacing-800).\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 - Margin below the header. Default: var(--dds-spacing-800).\n * @cssproperty --dds-modal-footer-margin - Margin above the footer. Default: var(--dds-spacing-400).\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 \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>,\nonDdsOk: 'dds-ok' as EventName<DdsOkEvent>,\nonDdsCancel: 'dds-cancel' as EventName<DdsCancelEvent>\n },\n displayName: \"DapDSModal\"\n })\n\n export default reactWrapper\n ","import { createComponent } from '@lit/react'\nimport * as React from 'react'\n\nimport Component from '../../components/notification-badge/notification-badge.component.js'\n\nconst tagName = 'dap-ds-notification-badge'\n\n/*\n `dap-ds-notification-badge`\n * @summary 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.\n * @element dap-ds-notification-badge\n * @title - Notification badge\n \n @slot - The content of the notification badge.\n \n @csspart base - The main container of the notification badge.\n * @csspart noty - The notification badge container.\n \n @cssproperty --dds-notification-badge-size - Controls the overall size of the notification badge\n * @cssproperty --dds-notification-badge-min-width - Minimum width of the notification badge\n * @cssproperty --dds-notification-badge-height - Height of the notification badge\n * @cssproperty --dds-notification-badge-padding - Padding inside the notification badge\n * @cssproperty --dds-notification-badge-border-radius - Border radius of the notification badge\n * @cssproperty --dds-notification-badge-font-size - Font size of the notification badge text\n * @cssproperty --dds-notification-badge-dot-size - Size of the dot variant\n * @cssproperty --dds-notification-badge-color - Text color of the notification badge\n * @cssproperty --dds-notification-badge-neutral-bg - Background color for neutral type\n * @cssproperty --dds-notification-badge-brand-bg - Background color for brand type\n * @cssproperty --dds-notification-badge-info-bg - Background color for info type\n * @cssproperty --dds-notification-badge-positive-bg - Background color for positive type\n * @cssproperty --dds-notification-badge-warning-bg - Background color for warning type\n * @cssproperty --dds-notification-badge-negative-bg - Background color for negative type\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'DapDSNotificationBadge',\n})\n\nexport default reactWrapper\n","\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/number-input/number-input.component.js'\n import type { DdsChangeEvent } from '../../events/events'\nimport type { DdsInputEvent } from '../../events/events'\nimport type { DdsKeydownEvent } from '../../events/events'\nimport type { DdsBlurEvent } from '../../events/events'\nimport type { DdsFocusEvent } from '../../events/events'\n export type { DdsChangeEvent } from '../../events/events'\nexport type { DdsInputEvent } from '../../events/events'\nexport type { DdsKeydownEvent } from '../../events/events'\nexport type { DdsBlurEvent } from '../../events/events'\nexport type { DdsFocusEvent } from '../../events/events'\n\n const tagName = 'dap-ds-number-input'\n\n /*\n `dap-ds-number-input`\n * @summary A number input component.\n * @element dap-ds-number-input\n * @title - Number input\n \n @property {string} label - The label of the input.\n * @property {string} placeholder - The placeholder of the input.\n * @property {string} description - The description of the input.\n * @property {string} tooltip - The tooltip of the input.\n * @property {'top' \| 'right' \| 'bottom' \| 'left'} tooltipPlacement - The tooltip placement of the input.\n * @property {'success' \| 'error'} status - The status of the input. Can be `success` or `error`.\n * @property {'xs' \| 'sm' \| 'sm'} size - The size of the input. Default is `sm`. Can be `sm` or `lg`.\n * @property {string} name - The name of the input.\n * @property {string} value - The value of the input.\n * @property {string} thousandSeparator - The thousand separator of the input.\n * @property {string} decimalSeparator - The decimal separator of the input.\n * @property {number} decimalScale - The decimal scale of the input.\n * @property {string} allowNegative - The allow negative state of the input.\n * @property {string} allowDecimal - The allow decimal state of the input.\n * @property {boolean} disabled - The disabled state of the input. Default is false.\n * @property {boolean} required - The required state of the input. Default is false.\n * @property {boolean} readonly - The readonly state of the input. Default is false.\n * @property {boolean} autofocus - The autofocus state of the input. Default is false.\n * @property {number} min - The minimum value of the number input.\n * @property {number} max - The maximum value of the number input.\n * @property {number} step - The step value of the number input.\n * @property {string} feedback - The feedback of the input.\n * @property {'negative' \| 'positive' \| 'warning'} feedbackType - The feedback type of the input. Can be `negative`, `positive`, or `warning`.\n * @property {boolean} loading - The loading state of the input. Default is false.\n * @property {boolean} optional - The optional state of the input.\n * @property {string} optionalLabel - The optional label of the input.\n * @property {boolean} subtle - The weight of the label. Default is `false`\n * @property {boolean} disableEnter - Disables the enter key from being used to submit the form.\n * @property {boolean} hideControls - Hides the increment and decrement buttons.\n \n @event dds-change - Fired when the input value changes.\n * @event dds-input - Fired when the input value changes.\n * @event dds-keydown - Fired when a key is pressed down.\n * @event dds-blur - Fired when the input loses focus.\n * @event dds-focus - Emitted when the input gains focus.\n \n @slot feedback-icon - The custom icon of the feedback.\n \n @cssproperty --dds-input-height - The height of the input. Default is var(--dds-spacing-1000).\n * @cssproperty --dds-input-padding - The padding of the input. Default is var(--dds-spacing-300).\n * @cssproperty --dds-input-font-size - The font size of the input. Default is var(--dds-font-base).\n * @cssproperty --dds-input-border-color - The border color of the input. Default is var(--dds-border-neutral-base).\n * @cssproperty --dds-input-background-color - The background color of the input. Default is var(--dds-fields-background-default).\n * @cssproperty --dds-input-text-color - The text color of the input. Default is var(--dds-text-neutral-base).\n * @cssproperty --dds-input-border-radius - The border radius of the input. Default is var(--dds-radius-base).\n * @cssproperty --dds-input-border-width - The border width of the input. Default is var(--dds-border-width-base).\n * @cssproperty --dds-input-disabled-background - The background color of the disabled input. Default is var(--dds-fields-background-disabled).\n * @cssproperty --dds-input-disabled-text - The text color of the disabled input. Default is var(--dds-text-neutral-disabled).\n * @cssproperty --dds-input-readonly-background - The background color of the readonly input. Default is var(--dds-fields-background-read-only).\n * @cssproperty --dds-input-readonly-text - The text color of the readonly input. Default is var(--dds-text-neutral-subtle).\n * @cssproperty --dds-input-success-border - The border color of the success input. Default is var(--dds-border-positive-base).\n * @cssproperty --dds-input-error-border - The border color of the error input. Default is var(--dds-border-negative-base).\n * @cssproperty --dds-input-addon-background - The background color of the input addon. Default is var(--dds-background-ui-neutral-enabled).\n * @cssproperty --dds-input-addon-success-background - The background color of the success input addon. Default is var(--dds-background-ui-positive-enabled).\n * @cssproperty --dds-input-addon-error-background - The background color of the error input addon. Default is var(--dds-background-ui-negative-enabled).\n \n @csspart postfix - The postfix of the input.\n * @csspart decrement - The decrement button of the input.\n * @csspart increment - The increment button of the input.\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>,\nonDdsKeydown: 'dds-keydown' as EventName<DdsKeydownEvent>,\nonDdsBlur: 'dds-blur' as EventName<DdsBlurEvent>,\nonDdsFocus: 'dds-focus' as EventName<DdsFocusEvent>\n },\n displayName: \"DapDSNumberInput\"\n })\n\n export default reactWrapper\n ","\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/official-website-banner/official-website-banner.component.js'\n import type { DdsOpenedEvent } from '../../events/events'\nimport type { DdsClosedEvent } from '../../events/events'\n export type { DdsOpenedEvent } from '../../events/events'\nexport type { DdsClosedEvent } from '../../events/events'\n\n const tagName = 'dap-ds-official-website-banner'\n\n /*\n `dap-ds-official-website-banner`\n * @element dap-ds-official-website-banner\n * @summary An official website banner is a banner that displays that the website is an official website.\n * @title - Official website banner\n \n @property { 'sm' \| 'lg' } size - The size of the official website banner. Default is `sm`.\n * @property { 1 \| 2 \| 3 \| 4 \| 5 \| 6 } headingLevel - The heading level of the accordion. Default is `4`.\n * @property {boolean} opened - Whether the accordion is opened. Default is `false`.\n * @property { 'left' \| 'right' } iconLocation - The location of the icon. Default is `right`.\n * @property { 'default' \| 'collapsed' \| 'clean' \| 'clean-collapsed' } variant - The variant of the accordion.\n * @property {boolean} lastItem - Whether the accordion is the last item.\n \n @event dds-opened - Event fired when the accordion is opened.\n * @event dds-closed - Event fired when the accordion is closed.\n \n @slot default - The content of the accordion.\n * @slot heading - The heading of the accordion.\n * @slot icon-opened - The icon when the accordion is opened.\n * @slot icon-closed - The icon when the accordion is closed.\n \n @csspart base - The main accordion container.\n * @csspart heading - The heading of the accordion.\n * @csspart button - The button of the accordion.\n * @csspart content - The content of the accordion.\n * @csspart content-container - The container of the accordion content.\n * @csspart icon-wrapper - The icon wrapper of the accordion.\n * @csspart open-icon - The icon when the accordion is opened.\n * @csspart open-icon-base - The base of the icon when the accordion is opened.\n * @csspart close-icon - The icon when the accordion is closed.\n * @csspart close-icon-base - The base of the icon when the accordion is closed.\n \n @cssproperty --dds-accordion-border-width - The width of the accordion border (default: var(--dds-border-width-base))\n * @cssproperty --dds-accordion-border-style - The style of the accordion border (default: solid)\n * @cssproperty --dds-accordion-border-radius - The border radius of the accordion (default: var(--dds-radius-base))\n * @cssproperty --dds-accordion-border-color - The color of the accordion border (default: var(--dds-border-neutral-divider))\n * @cssproperty --dds-accordion-background-color - The background color of the accordion (default: var(--dds-background-neutral-subtle))\n * @cssproperty --dds-accordion-text-color - The text color of the accordion (default: var(--dds-text-neutral-strong))\n * @cssproperty --dds-accordion-hover-background - The background color when hovering over the accordion (default: var(--dds-background-neutral-base))\n * @cssproperty --dds-accordion-active-background - The background color when the accordion is active (default: var(--dds-background-neutral-medium))\n * @cssproperty --dds-accordion-icon-background - The background color of the accordion icon (default: var(--dds-transparent-black-subtle))\n * @cssproperty --dds-accordion-icon-color - The color of the accordion icon (default: var(--dds-icon-neutral-base))\n * @cssproperty --dds-accordion-icon-hover-background - The background color of the accordion icon when hovered (default: var(--dds-transparent-black-base))\n * @cssproperty --dds-accordion-icon-active-background - The background color of the accordion icon when active (default: var(--dds-transparent-black-strong))\n * @cssproperty --dds-accordion-icon-hover-color - The color of the accordion icon when hovered (default: var(--dds-icon-neutral-strong))\n * @cssproperty --dds-accordion-icon-active-color - The color of the accordion icon when active (default: var(--dds-icon-neutral-strong))\n * @cssproperty --dds-accordion-content-color - The color of the accordion content (default: var(--dds-text-text-neutral))\n * @cssproperty --dds-accordion-transition-duration - The duration of the accordion transitions (default: var(--dds-transition-fast))\n * @cssproperty --dds-accordion-transition-timing - The timing function of the accordion transitions (default: var(--dds-easing-ease-in-out))\n * @cssproperty --dds-accordion-divider-color - The color of the divider between accordion items (default: var(--dds-border-neutral-divider))\n /\n const reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {\n onDdsOpened: 'dds-opened' as EventName<DdsOpenedEvent>,\nonDdsClosed: 'dds-closed' as EventName<DdsClosedEvent>\n },\n displayName: \"DapDSOfficialWebsiteBanner\"\n })\n\n export default reactWrapper\n ","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/option-item/option-item.component.js'\n\nconst tagName = 'dap-ds-option-item'\n\n/*\n `dap-ds-option-item`\n * @summary An option item is a selectable item in a list of options.\n * @element dap-ds-option-item\n * @title - Option item\n * \n @csspart base - The main option item container.\n * @csspart prefix - The prefix of the option item.\n * @csspart label - The label of the option item.\n * @csspart suffix - The suffix of the option item.\n \n @slot prefix - The prefix of the option item.\n * @slot - The label of the option item.\n * @slot suffix - The suffix of the option item.\n \n @cssproperty --dds-option-item-padding-vertical - The vertical padding of the option item.\n * @cssproperty --dds-option-item-padding-horizontal - The horizontal padding of the option item.\n * @cssproperty --dds-option-item-border-radius - The border radius of the option item.\n * @cssproperty --dds-option-item-color - The text color of the option item.\n * @cssproperty --dds-option-item-hover-bg - The background color of the option item when hovered.\n * @cssproperty --dds-option-item-active-bg - The background color of the option item when active.\n * @cssproperty --dds-option-item-disabled-color - The text color of the option item when disabled.\n * @cssproperty --dds-option-item-high-contrast-border - The border color of the option item in high contrast mode.\n * @cssproperty --dds-option-item-selected-font-weight - The font weight of the option item when selected.\n * @cssproperty --dds-option-item-xs-font-size - The font size of the option item in extra small size.\n * @cssproperty --dds-option-item-lg-font-size - The font size of the option item in large size.\n * @cssproperty --dds-option-item-selected-icon-width - The width of the selected icon.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'DapDSOptionItem',\n})\n\nexport default reactWrapper\n","\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/option-list/option-list.component.js'\n import type { DdsCancelEvent } from '../../events/events'\nimport type { DdsOptionChangeEvent } from '../../events/events'\nimport type { DdsKeydownEvent } from '../../events/events'\n export type { DdsCancelEvent } from '../../events/events'\nexport type { DdsOptionChangeEvent } from '../../events/events'\nexport type { DdsKeydownEvent } from '../../events/events'\n\n const tagName = 'dap-ds-option-list'\n\n /*\n `dap-ds-option-list`\n * @summary An option list is a list of selectable options.\n * @element dap-ds-option-list\n * @title - Option list\n \n @event dds-cancel - Fired when the escape key is pressed.\n * @event dds-option-change - Fired when the option list value changes.\n * @event dds-keydown - Fired when a key is pressed down.\n \n @csspart base - The main option list container.\n \n @slot - The default slot for the options.\n /\n const reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {\n onDdsCancel: 'dds-cancel' as EventName<DdsCancelEvent>,\nonDdsOptionChange: 'dds-option-change' as EventName<DdsOptionChangeEvent>,\nonDdsKeydown: 'dds-keydown' as EventName<DdsKeydownEvent>\n },\n displayName: \"DapDSOptionList\"\n })\n\n export default reactWrapper\n ","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/overlay/overlay.component.js'\n\nconst tagName = 'dap-ds-overlay'\n\n/*\n `dap-ds-overlay`\n * @summary An overlay is a container for overlay content.\n * @element dap-ds-overlay\n * @title - Overlay\n \n @csspart overlay - The overlay element\n \n @cssproperty --dds-overlay-z-index - Controls the z-index of the overlay (default: 1)\n * @cssproperty --dds-overlay-background-color - Controls the background color of the overlay (default: var(--dds-black-10))\n * @cssproperty --dds-overlay-opacity-closed - Controls the opacity when overlay is closed (default: 0)\n * @cssproperty --dds-overlay-opacity-open - Controls the opacity when overlay is open (default: 1)\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'DapDSOverlay',\n})\n\nexport default reactWrapper\n","\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/pager/pager.component.js'\n import type { DdsPaginationChangeEvent } from '../../events/events'\n export type { DdsPaginationChangeEvent } from '../../events/events'\n\n const tagName = 'dap-ds-pager'\n\n /*\n `dap-ds-pager`\n * @summary A pager is a component that displays pagination controls.\n * @element dap-ds-pager\n * @title - Pager\n \n @event dds-pagination-change - Event fired when the pagination changes\n \n @csspart base - The main pager container.\n * @csspart first - The first page button.\n * @csspart previous - The previous page button.\n * @csspart next - The next page button.\n * @csspart last - The last page button.\n \n @cssproperty --dds-pager-spacing-vertical - The vertical spacing of the pager.\n * @cssproperty --dds-pager-spacing-horizontal - The horizontal spacing of the pager.\n * @cssproperty --dds-pager-button-padding - The padding of the pager buttons.\n * @cssproperty --dds-pager-button-border-width - The border width of the pager buttons.\n * @cssproperty --dds-pager-button-border-color - The border color of the pager buttons.\n * @cssproperty --dds-pager-button-border-radius - The border radius of the pager buttons.\n * @cssproperty --dds-pager-button-background - The background color of the pager buttons.\n * @cssproperty --dds-pager-button-font-size - The font size of the pager buttons.\n * @cssproperty --dds-pager-button-font-weight - The font weight of the pager buttons.\n /\n const reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {\n onDdsPaginationChange: 'dds-pagination-change' as EventName<DdsPaginationChangeEvent>\n },\n displayName: \"DapDSPager\"\n })\n\n export default reactWrapper\n ","\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/password-input/password-input.component.js'\n import type { DdsChangeEvent } from '../../events/events'\nimport type { DdsInputEvent } from '../../events/events'\nimport type { DdsKeydownEvent } from '../../events/events'\nimport type { DdsBlurEvent } from '../../events/events'\nimport type { DdsFocusEvent } from '../../events/events'\n export type { DdsChangeEvent } from '../../events/events'\nexport type { DdsInputEvent } from '../../events/events'\nexport type { DdsKeydownEvent } from '../../events/events'\nexport type { DdsBlurEvent } from '../../events/events'\nexport type { DdsFocusEvent } from '../../events/events'\n\n const tagName = 'dap-ds-password-input'\n\n /*\n `dap-ds-password-input`\n * @summary A password input a field for entering a password.\n * @element dap-ds-password-input\n * @title - Password input\n \n @property {string} label - The label of the password input.\n * @property {string} placeholder - The placeholder of the password input.\n * @property {string} description - The description of the password input.\n * @property {string} tooltip - The tooltip of the password input.\n * @property {'top' \| 'right' \| 'bottom' \| 'left'} tooltipPlacement - The tooltip placement of the input.\n * @property {string} status - The status of the password input. Can be `success` or `error`.\n * @property {'xs' \| 'sm' \| 'sm'} size - The size of the password input. Default is `sm`.\n * @property {string} name - The name of the password input.\n * @property {string} value - The value of the password input.\n * @property {boolean} disabled - The disabled state of the password input. Default is false.\n * @property {boolean} required - The required state of the password input. Default is false.\n * @property {boolean} readonly - The readonly state of the password input. Default is false.\n * @property {boolean} autofocus - The autofocus state of the password input. Default is false.\n * @property {string} feedback - The feedback of the input.\n * @property {'negative' \| 'positive' \| 'warning'} feedbackType - The feedback type of the input. Can be `negative`, `positive`, or `warning`.\n * @property {boolean} loading - The loading state of the password input. Default is false.\n * @property {boolean} optional - The optional state of the password input.\n * @property {string} optionalLabel - The optional label of the password input.\n * @property {boolean} subtle - The weight of the label. Default is `false`\n \n @event dds-change - Fired when the input value changes.\n * @event dds-input - Fired when the input value changes.\n * @event dds-keydown - Fired when a key is pressed down.\n * @event dds-blur - Fired when the input loses focus.\n * @event dds-focus - Emitted when the input gains focus.\n \n @cssproperty --dds-input-height - The height of the input. Default is var(--dds-spacing-1000).\n * @cssproperty --dds-input-padding - The padding of the input. Default is var(--dds-spacing-300).\n * @cssproperty --dds-input-font-size - The font size of the input. Default is var(--dds-font-base).\n * @cssproperty --dds-input-border-color - The border color of the input. Default is var(--dds-border-neutral-base).\n * @cssproperty --dds-input-background-color - The background color of the input. Default is var(--dds-fields-background-default).\n * @cssproperty --dds-input-text-color - The text color of the input. Default is var(--dds-text-neutral-base).\n * @cssproperty --dds-input-border-radius - The border radius of the input. Default is var(--dds-radius-base).\n * @cssproperty --dds-input-border-width - The border width of the input. Default is var(--dds-border-width-base).\n * @cssproperty --dds-input-disabled-background - The background color of the disabled input. Default is var(--dds-fields-background-disabled).\n * @cssproperty --dds-input-disabled-text - The text color of the disabled input. Default is var(--dds-text-neutral-disabled).\n * @cssproperty --dds-input-readonly-background - The background color of the readonly input. Default is var(--dds-fields-background-read-only).\n * @cssproperty --dds-input-readonly-text - The text color of the readonly input. Default is var(--dds-text-neutral-subtle).\n * @cssproperty --dds-input-success-border - The border color of the success input. Default is var(--dds-border-positive-base).\n * @cssproperty --dds-input-error-border - The border color of the error input. Default is var(--dds-border-negative-base).\n * @cssproperty --dds-input-addon-background - The background color of the input addon. Default is var(--dds-background-ui-neutral-enabled).\n * @cssproperty --dds-input-addon-success-background - The background color of the success input addon. Default is var(--dds-background-ui-positive-enabled).\n * @cssproperty --dds-input-addon-error-background - The background color of the error input addon. Default is var(--dds-background-ui-negative-enabled).\n \n @csspart postfix - The postfix of the password input.\n * @csspart password-input - The password input.\n * @csspart password-input--visible - The visible password input.\n * @csspart icon - The icon of the password input.\n * @csspart icon-base - The base of the icon.\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>,\nonDdsKeydown: 'dds-keydown' as EventName<DdsKeydownEvent>,\nonDdsBlur: 'dds-blur' as EventName<DdsBlurEvent>,\nonDdsFocus: 'dds-focus' as EventName<DdsFocusEvent>\n },\n displayName: \"DapDSPasswordInput\"\n })\n\n export default reactWrapper\n ","\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/popup/popup.component.js'\n import type { DdsOpenedEvent } from '../../events/events'\nimport type { DdsClosedEvent } from '../../events/events'\n export type { DdsOpenedEvent } from '../../events/events'\nexport type { DdsClosedEvent } from '../../events/events'\n\n const tagName = 'dap-ds-popup'\n\n /*\n `dap-ds-popup`\n * @summary A popup is a container for popup content.\n * @element dap-ds-popup\n * @title - Popup\n \n @property {'xs' \| 'sm' \| 'lg'} size - The size of the popup.\n \n @event dds-opened - Fired when the popup is opened.\n * @event dds-closed - Fired when the popup is closed.\n \n @slot trigger - The trigger of the popup.\n * @slot - The content of the popup.\n \n @csspart popup - The main popup container.\n * @csspart arrow - The arrow of the popup.\n \n @cssproperty --dds-popup-z-index - Z-index of the popup.\n * @cssproperty --dds-popup-padding - Default padding of the popup.\n * @cssproperty --dds-popup-padding-xs - Padding of the popup when size is xs.\n * @cssproperty --dds-popup-padding-lg - Padding of the popup when size is lg.\n * @cssproperty --dds-popup-border-width - Border width of the popup.\n * @cssproperty --dds-popup-border-radius - Border radius of the popup.\n * @cssproperty --dds-popup-border-color - Border color of the popup.\n * @cssproperty --dds-popup-background - Background color of the popup.\n * @cssproperty --dds-popup-color - Text color of the popup.\n * @cssproperty --dds-popup-arrow-size - Size of the popup arrow.\n /\n const reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {\n onDdsOpened: 'dds-opened' as EventName<DdsOpenedEvent>,\nonDdsClosed: 'dds-closed' as EventName<DdsClosedEvent>\n },\n displayName: \"DapDSPopup\"\n })\n\n export default reactWrapper\n ","\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/radio-button/radio-button.component.js'\n import type { DdsChangeEvent } from '../../events/events'\nimport type { DdsBlurEvent } from '../../events/events'\nimport type { DdsFocusEvent } from '../../events/events'\nimport type { DdsInputEvent } from '../../events/events'\n export type { DdsChangeEvent } from '../../events/events'\nexport type { DdsBlurEvent } from '../../events/events'\nexport type { DdsFocusEvent } from '../../events/events'\nexport type { DdsInputEvent } from '../../events/events'\n\n const tagName = 'dap-ds-radio-button'\n\n /*\n `dap-ds-radio-button`\n * @summary A radio button is a graphical control element that allows the user to choose only one of a predefined set of mutually exclusive options.\n * @element dap-ds-radio-button\n * @title - Radio button\n \n @property {string} name - The name of the radio button.\n * @property {string} value - The value of the radio button.\n * @property {boolean} checked - The checked state of the radio button.\n * @property {string} label - The label of the radio button.\n * @property {string} description - The description of the radio button.\n * @property {'xs', 'sm' \| 'md' \| 'lg'} size - The size of the radio button.\n * @property {boolean} disabled - The disabled state of the radio button.\n * @property {boolean} required - The required state of the radio button.\n * @property {'left' \| 'right'} labelPlacement - The placement of the label.\n * @property {'top' \| 'bottom'} descriptionPlacement - The placement of the description.\n \n @event dds-change - Fired when the radio button is checked.\n * @event dds-blur - Emitted when the radio button loses focus.\n * @event dds-focus - Emitted when the radio button gains focus.\n * @event dds-input - Emitted when the radio button receives input.\n \n @csspart base - The main radio button container.\n * @csspart wrapper - The wrapper of the radio button.\n * @csspart baselabel - The main label container\n * @csspart label - The label of the radio button.\n * @csspart input - The native input of the radio button.\n * @csspart control - The control of the radio button.\n * @csspart description - The description of the radio button.\n \n @cssproperty --dds-radio-size - Sets the size of the radio button. Default: var(--dds-spacing-600)\n * @cssproperty --dds-radio-border-width - Sets the border width of the radio button. Default: var(--dds-border-width-large)\n * @cssproperty --dds-radio-border-radius - Sets the border radius of the radio button. Default: var(--dds-radius-rounded)\n * @cssproperty --dds-radio-border-color - Sets the border color of the radio button. Default: var(--dds-border-neutral-base)\n * @cssproperty --dds-radio-background-color - Sets the background color of the radio button. Default: var(--dds-background-neutral-base)\n * @cssproperty --dds-radio-hover-border-color - Sets the border color of the radio button on hover. Default: var(--dds-border-neutral-medium)\n * @cssproperty --dds-radio-hover-background-color - Sets the background color of the radio button on hover. Default: var(--dds-background-neutral-medium)\n * @cssproperty --dds-radio-active-border-color - Sets the border color of the radio button when active. Default: var(--dds-border-neutral-strong)\n * @cssproperty --dds-radio-active-background-color - Sets the background color of the radio button when active. Default: var(--dds-background-neutral-strong)\n * @cssproperty --dds-radio-checked-background-color - Sets the background color of the checked radio button. Default: var(--dds-background-brand-base-inverted)\n * @cssproperty --dds-radio-checked-hover-background-color - Sets the background color of the checked radio button on hover. Default: var(--dds-background-brand-medium-inverted)\n * @cssproperty --dds-radio-checked-active-background-color - Sets the background color of the checked radio button when active. Default: var(--dds-background-brand-strong-inverted)\n * @cssproperty --dds-radio-disabled-background-color - Sets the background color of the disabled radio button. Default: var(--dds-background-neutral-disabled)\n * @cssproperty --dds-radio-icon-background-color - Sets the background color of the radio button icon. Default: var(--dds-transparent-white-strong-static)\n * @cssproperty --dds-radio-disabled-icon-background-color - Sets the background color of the disabled radio button icon. Default: var(--dds-background-neutral-stronger)\n * @cssproperty --dds-radio-invalid-border-color - Sets the border color of the invalid radio button. Default: var(--dds-border-negative-base)\n * @cssproperty --dds-radio-invalid-background-color - Sets the background color of the invalid radio button. Default: var(--dds-background-negative-base)\n * @cssproperty --dds-radio-invalid-hover-border-color - Sets the border color of the invalid radio button on hover. Default: var(--dds-border-negative-medium)\n * @cssproperty --dds-radio-invalid-hover-background-color - Sets the background color of the invalid radio button on hover. Default: var(--dds-background-negative-medium)\n * @cssproperty --dds-radio-invalid-active-border-color - Sets the border color of the invalid radio button when active. Default: var(--dds-border-negative-strong)\n * @cssproperty --dds-radio-invalid-active-background-color - Sets the background color of the invalid radio button when active. Default: var(--dds-background-negative-strong)\n * @cssproperty --dds-radio-invalid-checked-background-color - Sets the background color of the invalid checked radio button. Default: var(--dds-background-negative-base-inverted)\n * @cssproperty --dds-radio-invalid-checked-hover-background-color - Sets the background color of the invalid checked radio button on hover. Default: var(--dds-background-negative-medium-inverted)\n * @cssproperty --dds-radio-invalid-checked-active-background-color - Sets the background color of the invalid checked radio button when active. Default: var(--dds-background-negative-strong-inverted)\n * @cssproperty --dds-radio-icon-size - Sets the size of the radio button icon. Default: var(--dds-spacing-300)\n /\n const reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {\n onDdsChange: 'dds-change' as EventName<DdsChangeEvent>,\nonDdsBlur: 'dds-blur' as EventName<DdsBlurEvent>,\nonDdsFocus: 'dds-focus' as EventName<DdsFocusEvent>,\nonDdsInput: 'dds-input' as EventName<DdsInputEvent>\n },\n displayName: \"DapDSRadioButton\"\n })\n\n export default reactWrapper\n ","\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/rating/rating.component.js'\n import type { DdsChangeEvent } from '../../events/events'\n export type { DdsChangeEvent } from '../../events/events'\n\n const tagName = 'dap-ds-rating'\n\n /*\n `dap-ds-rating`\n * @summary Rating is a component that allows users to rate a product or service.\n * @element dap-ds-rating\n * @title - Rating\n \n @event dds-change - Event fired when the rating value changes.\n \n @csspart base - The main rating container.\n * @csspart star - The star element.\n * @csspart stars-container - The container of the stars.\n * @csspart icon - The icon of the star.\n /\n const reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {\n onDdsChange: 'dds-change' as EventName<DdsChangeEvent>\n },\n displayName: \"DapDSRating\"\n })\n\n export default reactWrapper\n ","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/scroll-area/scroll-area.component.js'\n\nconst tagName = 'dap-ds-scroll-area'\n\n/*\n `dap-ds-scroll-area`\n * @summary A component that provides a customizable scrollable area with a custom scrollbar.\n * @element dap-ds-scroll-area\n * @title - Scroll area\n \n @slot - The content to be scrolled\n \n @csspart viewport - The viewport element that contains the scrollable content\n * @csspart scrollbar - The scrollbar container\n * @csspart corner - The corner between vertical and horizontal scrollbars\n \n @cssprop --dds-scroll-area-radius - The border radius of the scroll area and its elements (default: var(--dds-radius-base))\n * @cssprop --dds-scroll-area-background - The background color of the scroll area (default: var(--dds-background-neutral-base))\n * @cssprop --dds-scroll-area-scrollbar-background - The background color of the scrollbar (default: var(--dds-background-neutral-subtle))\n * @cssprop --dds-scroll-area-thumb-background - The background color of the scrollbar thumb (default: var(--dds-background-neutral-interactive))\n * @cssprop --dds-scroll-area-thumb-hover-background - The background color of the scrollbar thumb on hover (default: var(--dds-background-neutral-interactive-hover))\n * @cssprop --dds-scroll-area-thumb-active-background - The background color of the scrollbar thumb when active (default: var(--dds-background-neutral-interactive-active))\n * @cssprop --dds-scroll-area-transition - The transition timing for scrollbar interactions (default: var(--dds-transition-fast) var(--dds-easing-ease-out))\n * @cssprop --dds-scroll-area-scrollbar-size - The width/height of the scrollbar (default: 10px)\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'DapDSScrollArea',\n})\n\nexport default reactWrapper\n","\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/search/search.component.js'\n import type { DdsChangeEvent } from '../../events/events'\nimport type { DdsBlurEvent } from '../../events/events'\nimport type { DdsFocusEvent } from '../../events/events'\nimport type { DdsClearEvent } from '../../events/events'\nimport type { DdsSearchEvent } from '../../events/events'\nimport type { DdsInputEvent } from '../../events/events'\n export type { DdsChangeEvent } from '../../events/events'\nexport type { DdsBlurEvent } from '../../events/events'\nexport type { DdsFocusEvent } from '../../events/events'\nexport type { DdsClearEvent } from '../../events/events'\nexport type { DdsSearchEvent } from '../../events/events'\nexport type { DdsInputEvent } from '../../events/events'\n\n const tagName = 'dap-ds-search'\n\n /*\n `dap-ds-search`\n * @summary A select is a form element that allows the user to select one option from a set.\n * @element dap-ds-search\n * @title - Search\n \n @event dds-change - Fired when the search value changes.\n * @event dds-blur - Emitted when the search loses focus.\n * @event dds-focus - Emitted when the search gains focus.\n * @event dds-clear - Emitted when the search is cleared.\n * @event dds-search - Emitted when the search input value changes.\n * @event dds-input - Emitted when typing happens in the search input.\n \n @property {string} value - The value of the search.\n * @property {string} placeholder - The placeholder of the search.\n * @property { 'top' \| 'top-start' \| 'top-end' \| 'right' \| 'right-start'\| 'right-end' \| 'bottom' \| 'bottom-start' \| 'bottom-end' \| 'left' \| 'left-start' \| 'left-end'} placement - The placement of the select dropdown. Default is 'bottom-start'.\n * @property {boolean} opened - Whether the search dropdown is opened.\n * @property {'width' \| 'height' \| 'both'} sync - The sync mode of the search dropdown. How the dropdown item size is synced to the trigger element'.\n * @property {string} label - The label of the search.\n * @property {string} description - The description of the search.\n * @property {string} tooltip - The tooltip of the search.\n * @property {'xs' \| 'sm' \| 'lg'} size - The size of the search.\n * @property {'none' \| 'typehead' \| 'autocomplete' \| 'manual'} searchMode - The search mode of the select. Default is 'none'.\n * @property {boolean} disabled - Whether the search is disabled.\n * @property {boolean} required - Whether the search is required.\n * @property {boolean} readonly - Whether the search is readonly.\n * @property {boolean} autofocus - Whether the search is autofocus.\n * @property {boolean} clearable - Whether the search is clearable.\n * @property {string} feedback - The feedback content of the search.\n * @property {'error' \| 'warning' \| 'info'} feedbackType - The feedback type of the search.\n * @property {boolean} allowManualInput - Whether the search allows manual input, or free text.\n * @property {boolean} searchForText - Whether the search should search for the selected item text.\n * @property {boolean} noTextComplete - Whether the search should not complete the text.\n * @property {string} searchButtonAriaLabel - The aria label of the search button.\n * @property {boolean} openOnEmpty - Whether the search should open on empty results.\n * @property {string} selectable - Show the selected item check mark in the dropdown. Default is 'false'.\n * @property {boolean} noAnimation - Whether the search open indicator should be animated. Default is true.\n * @property {boolean} subtle - Subtle color version\n \n @cssproperty --dds-combobox-padding-xs - The padding for extra small size. Defaults to var(--dds-spacing-200).\n * @cssproperty --dds-combobox-padding-sm - The padding for small size. Defaults to var(--dds-spacing-200).\n * @cssproperty --dds-combobox-padding-lg - The padding for large size. Defaults to var(--dds-spacing-300).\n * @cssproperty --dds-combobox-padding-horizontal - The horizontal padding. Defaults to var(--dds-spacing-300).\n * @cssproperty --dds-combobox-padding-vertical - The vertical padding. Defaults to var(--dds-spacing-200).\n * @cssproperty --dds-combobox-gap - The gap between elements. Defaults to var(--dds-spacing-100).\n * @cssproperty --dds-combobox-icon-gap - The gap between icons. Defaults to var(--dds-spacing-200).\n * @cssproperty --dds-combobox-action-gap - The gap between action elements. Defaults to var(--dds-spacing-200).\n * @cssproperty --dds-combobox-action-padding - The padding for action elements. Defaults to var(--dds-spacing-300).\n * @cssproperty --dds-combobox-clear-icon-width - The width of the clear icon. Defaults to var(--dds-spacing-800).\n * @cssproperty --dds-combobox-dropdown-icon-right - The right position of the dropdown icon. Defaults to var(--dds-spacing-600).\n * @cssproperty --dds-combobox-min-width - The minimum width of the combobox. Defaults to 7.5rem.\n \n @csspart base - The main search container.\n * @csspart trigger - The trigger button of the search.\n * @csspart label - The label of the search.\n * @csspart description - The description of the search.\n * @csspart feedback - The feedback of the search.\n * @csspart tooltip - The tooltip of the search.\n * @csspart option-list - The option list of the search.\n \n @slot - The default slot for the options.\n \n /\n const reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {\n onDdsChange: 'dds-change' as EventName<DdsChangeEvent>,\nonDdsBlur: 'dds-blur' as EventName<DdsBlurEvent>,\nonDdsFocus: 'dds-focus' as EventName<DdsFocusEvent>,\nonDdsClear: 'dds-clear' as EventName<DdsClearEvent>,\nonDdsSearch: 'dds-search' as EventName<DdsSearchEvent>,\nonDdsInput: 'dds-input' as EventName<DdsInputEvent>\n },\n displayName: \"DapDSSearch\"\n })\n\n export default reactWrapper\n ","\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/select/select.component.js'\n import type { DdsChangeEvent } from '../../events/events'\nimport type { DdsBlurEvent } from '../../events/events'\nimport type { DdsFocusEvent } from '../../events/events'\n export type { DdsChangeEvent } from '../../events/events'\nexport type { DdsBlurEvent } from '../../events/events'\nexport type { DdsFocusEvent } from '../../events/events'\n\n const tagName = 'dap-ds-select'\n\n /*\n `dap-ds-select`\n * @summary A select is a form element that allows the user to select one option from a set.\n * @element dap-ds-select\n * @title - Select\n \n @event dds-change - Fired when the select value changes.\n * @event dds-blur - Emitted when the select loses focus.\n * @event dds-focus - Emitted when the select gains focus.\n \n @property {string} value - The value of the select.\n * @property {string} label - The label of the select.\n * @property {string} description - The description of the select.\n * @property {string} tooltip - The tooltip of the select.\n * @property {'top' \| 'right' \| 'bottom' \| 'left'} tooltipPlacement - The tooltip placement of the select.\n * @property {'xs' \| 'sm' \| 'lg'} size - The size of the select. Default is `sm`.\n * @property {boolean} disabled - Whether the select is disabled.\n * @property {boolean} required - Whether the select is required.\n * @property {boolean} readonly - Whether the select is readonly.\n * @property {boolean} autofocus - Whether the select is autofocus.\n * @property {string} feedback - The feedback of the select.\n * @property {negative \| positive \| warning} feedbackType - The feedback type of the select. Can be `negative`, `positive`, or `warning`.\n * @property {string} status - The status of the select. Can be `success` or `error`.\n * @property {boolean} optional - The optional state of the select.\n * @property {string} optionalLabel - The optional label of the select.\n * @property {boolean} subtle - The weight of the label. Default is `false`\n \n @csspart base - The main select container.\n * @csspart trigger - The trigger button of the select.\n * @csspart label - The label of the select.\n * @csspart description - The description of the select.\n * @csspart feedback - The feedback of the select.\n * @csspart tooltip - The tooltip of the select.\n * @csspart option-list - The option list of the select.\n \n @cssproperty --dds-select-min-height - Minimum height of the select component (default: var(--dds-spacing-1000))\n * @cssproperty --dds-select-padding - Padding of the select component (default: var(--dds-spacing-300))\n * @cssproperty --dds-select-column-gap - Column gap of the select component (default: var(--dds-spacing-100))\n * @cssproperty --dds-select-border-color - Border color of the select component (default: var(--dds-border-neutral-base))\n * @cssproperty --dds-select-border-radius - Border radius of the select component (default: var(--dds-radius-base))\n * @cssproperty --dds-select-bg-color - Background color of the select component (default: var(--dds-background-neutral-subtle))\n * @cssproperty --dds-select-text-color - Text color of the select component (default: var(--dds-text-neutral-base))\n * @cssproperty --dds-select-icon-right - Right position of the icon (default: var(--dds-spacing-200))\n * @cssproperty --dds-select-icon-color - Color of the icon (default: var(--dds-icon-neutral-subtle))\n * @cssproperty --dds-select-text-margin-right - Right margin of the text (default: var(--dds-spacing-600))\n * @cssproperty --dds-select-disabled-border-color - Border color when disabled (default: var(--dds-background-neutral-stronger))\n * @cssproperty --dds-select-disabled-bg-color - Background color when disabled (default: var(--dds-background-neutral-stronger))\n * @cssproperty --dds-select-disabled-text-color - Text color when disabled (default: var(--dds-text-neutral-disabled))\n * @cssproperty --dds-select-error-border-color - Border color in error state (default: var(--dds-border-negative-base))\n * @cssproperty --dds-select-success-border-color - Border color in success state (default: var(--dds-border-positive-base))\n * @cssproperty --dds-select-xs-min-height - Minimum height for extra small size (default: var(--dds-spacing-800))\n * @cssproperty --dds-select-xs-padding - Padding for extra small size (default: var(--dds-spacing-200))\n * @cssproperty --dds-select-xs-font-size - Font size for extra small size (default: var(--dds-font-sm))\n * @cssproperty --dds-select-lg-min-height - Minimum height for large size (default: var(--dds-spacing-1200))\n * @cssproperty --dds-select-lg-padding - Padding for large size (default: var(--dds-spacing-400))\n * @cssproperty --dds-select-lg-font-size - Font size for large size (default: var(--dds-font-lg))\n * @cssproperty --dds-select-lg-icon-right - Right position of the icon for large size (default: var(--dds-spacing-300))\n * @cssproperty --dds-select-lg-icon-color - Color of the icon for large size (default: var(--dds-text-icon-neutral-subtle))\n * @cssproperty --dds-select-popup-bg-color - Background color of the popup (default: var(--dds-background-neutral-subtle))\n \n @slot - The option list of the select.\n * @slot indicator-icon - The indicator icon of the select.\n /\n const reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {\n onDdsChange: 'dds-change' as EventName<DdsChangeEvent>,\nonDdsBlur: 'dds-blur' as EventName<DdsBlurEvent>,\nonDdsFocus: 'dds-focus' as EventName<DdsFocusEvent>\n },\n displayName: \"DapDSSelect\"\n })\n\n export default reactWrapper\n ","\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/sidenav/sidenav-group.component.js'\n import type { DdsItemClickEvent } from '../../events/events'\n export type { DdsItemClickEvent } from '../../events/events'\n\n const tagName = 'dap-ds-sidenav-group'\n\n /*\n `dap-ds-sidenav-group`\n * @summary Side navigation group\n * @element dap-ds-sidenav-group\n * @title - Side navigation group\n * @group side-navigation\n \n @event dds-item-click - Event fired when the side navigation item is clicked.\n \n @slot - The content of the side navigation group.\n * @slot submenu - The submenu of the side navigation group.\n * @slot suffix - The suffix of the side navigation group.\n \n @csspart base - The main side navigation group container.\n * @csspart title - The title of the side navigation group.\n * @csspart link - The link of the side navigation group.\n * @csspart toggle - The toggle button of the side navigation group.\n * @csspart submenu - The submenu of the side navigation group.\n \n @cssproperty --dds-sidenav-group-margin-bottom - Default bottom margin of the sidenav group.\n * @cssproperty --dds-sidenav-group-border-radius - Border radius of the sidenav group.\n * @cssproperty --dds-sidenav-group-spacing-margin - Margin used for spacing variants.\n * @cssproperty --dds-sidenav-group-item-min-height - Minimum height of the sidenav group item.\n * @cssproperty --dds-sidenav-group-item-padding - Padding of the sidenav group item.\n * @cssproperty --dds-sidenav-group-item-color - Text color of the sidenav group item.\n * @cssproperty --dds-sidenav-group-item-font-size - Font size of the sidenav group item.\n * @cssproperty --dds-sidenav-group-item-font-weight - Font weight of the sidenav group item.\n * @cssproperty --dds-sidenav-group-item-bg-active - Background color when the item is active.\n * @cssproperty --dds-sidenav-group-item-bg-hover - Background color on hover and active states.\n * @cssproperty --dds-sidenav-group-toggle-margin - Margin for the toggle button.\n * @cssproperty --dds-sidenav-group-submenu-padding - Padding for the submenu.\n /\n const reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {\n onDdsItemClick: 'dds-item-click' as EventName<DdsItemClickEvent>\n },\n displayName: \"DapDSSideNavGroup\"\n })\n\n export default reactWrapper\n ","\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/sidenav/sidenav-item.component.js'\n import type { DdsItemClickEvent } from '../../events/events'\n export type { DdsItemClickEvent } from '../../events/events'\n\n const tagName = 'dap-ds-sidenav-item'\n\n /*\n `dap-ds-sidenav-item`\n * @summary Side navigation item\n * @element dap-ds-sidenav-item\n * @title - Side navigation item\n * @group side-navigation\n \n @event dds-item-click - Event fired when the side navigation item is clicked.\n \n @slot - The content of the side navigation item.\n * @slot suffix - The suffix of the side navigation item.\n \n @csspart base - The main side navigation item container.\n * @csspart link - The link of the side navigation item.\n \n @cssproperty --dds-sidenav-item-min-height - Minimum height of the sidenav item.\n * @cssproperty --dds-sidenav-item-margin-bottom - Default bottom margin of the sidenav item.\n * @cssproperty --dds-sidenav-item-padding - Padding of the sidenav item.\n * @cssproperty --dds-sidenav-item-radius - Border radius of the sidenav item.\n * @cssproperty --dds-sidenav-item-color - Text color of the sidenav item.\n * @cssproperty --dds-sidenav-item-font-size - Font size of the sidenav item.\n * @cssproperty --dds-sidenav-item-font-weight - Font weight of the sidenav item.\n * @cssproperty --dds-sidenav-item-spacing-margin - Margin used for spacing variants.\n * @cssproperty --dds-sidenav-item-bg-active - Background color when the item is active.\n * @cssproperty --dds-sidenav-item-bg-hover - Background color on hover and active states.\n /\n const reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {\n onDdsItemClick: 'dds-item-click' as EventName<DdsItemClickEvent>\n },\n displayName: \"DapDSSideNavItem\"\n })\n\n export default reactWrapper\n ","\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/sidenav/sidenav.component.js'\n import type { DdsItemClickEvent } from '../../events/events'\n export type { DdsItemClickEvent } from '../../events/events'\n\n const tagName = 'dap-ds-sidenav'\n\n /*\n `dap-ds-sidenav`\n * @summary Side navigation is a list of links that are used to navigate to different sections of a page.\n * @element dap-ds-sidenav\n * @title - Side navigation\n \n @event dds-item-click - Event fired when the side navigation item is clicked.\n \n @slot - The content of the side navigation.\n \n @csspart base - The main side navigation container.\n * @csspart menu - The menu of the side navigation.\n /\n const reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {\n onDdsItemClick: 'dds-item-click' as EventName<DdsItemClickEvent>\n },\n displayName: \"DapDSSideNav\"\n })\n\n export default reactWrapper\n ","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/skip-link/skip-link.component.js'\n\nconst tagName = 'dap-ds-skip-link'\n\n/*\n `dap-ds-skip-link`\n * @summary A skip link is a link that allows keyboard users to skip to the main content of a page.\n * @element dap-ds-skip-link\n * @title - Skip link\n \n @slot - The content of the skip link.\n \n @csspart base - The main skip link container.\n * @csspart text - The text container of the skip link.\n * @csspart high-contrast - The high contrast outline container.\n \n @cssproperty --dds-skip-link-border-color - Border color for the high contrast outline (default: var(--dds-border-neutral-transparent-interactive, #fff500))\n * @cssproperty --dds-skip-link-border-width - Border width for the high contrast outline (default: var(--dds-border-width-large))\n * @cssproperty --dds-skip-link-border-width-active - Border width for the active state (default: var(--dds-border-width-xlarge))\n * @cssproperty --dds-skip-link-border-radius - Border radius of the skip link (default: var(--dds-radius-small))\n * @cssproperty --dds-skip-link-padding-sm - Padding for small size variant (default: var(--dds-spacing-200))\n * @cssproperty --dds-skip-link-padding-lg - Padding for large size variant (default: var(--dds-spacing-400))\n * @cssproperty --dds-skip-link-text-underline-offset - Underline offset for the text (default: 3px)\n * @cssproperty --dds-skip-link-z-index - Z-index of the skip link (default: var(--dds-z-index-100))\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'DapDSSkipLink',\n})\n\nexport default reactWrapper\n","\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/snackbar/snackbar-message.component.js'\n import type { DdsCloseEvent } from '../../events/events'\n export type { DdsCloseEvent } from '../../events/events'\n\n const tagName = 'dap-ds-snackbar-message'\n\n /*\n `dap-ds-snackbar-message`\n * @summary The Snackbar component shows a sliding message to the user.\n * @element dap-ds-snackbar-message\n * @title - Snackbar message\n * @group snackbar\n \n @event dds-close - Fires when the snackbar closes.\n \n @slot default - The content of the snackbar.\n \n @csspart base - Main snackbar container.\n * @csspart text - The text part of the snackbar.\n * @csspart closebutton - The close button part of the component.\n * @csspart icon - The icon part of the close button.\n \n @cssproperty --dds-snackbar-width - Width of the snackbar.\n * @cssproperty --dds-snackbar-gap - Gap between snackbar elements.\n * @cssproperty --dds-snackbar-padding - Padding inside the snackbar.\n * @cssproperty --dds-snackbar-margin-bottom - Bottom margin of the snackbar.\n * @cssproperty --dds-snackbar-transition - Transition property for the snackbar.\n * @cssproperty --dds-snackbar-border-width - Border width of the snackbar.\n * @cssproperty --dds-snackbar-border-radius - Border radius of the snackbar.\n * @cssproperty --dds-snackbar-font-size - Font size used in the snackbar.\n /\n const reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {\n onDdsClose: 'dds-close' as EventName<DdsCloseEvent>\n },\n displayName: \"DapDSSnackbarMessage\"\n })\n\n export default reactWrapper\n ","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/snackbar/snackbar.component.js'\n\nconst tagName = 'dap-ds-snackbar'\n\n/*\n `dap-ds-snackbar`\n * @summary The Snackbar is a container of sliding messages.\n * @element dap-ds-snackbar\n * @title - Snackbar\n \n @csspart host - The host element\n \n @cssproperty --dds-snackbar-spacing - Spacing used for positioning the snackbar (default: var(--dds-spacing-400))\n * @cssproperty --dds-snackbar-z-index - Z-index of the snackbar container (default: 10000)\n * @cssproperty --dds-snackbar-pointer-events - Pointer events behavior for the snackbar (default: auto)\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'DapDSSnackbar',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/spinner/spinner.component.js'\n\nconst tagName = 'dap-ds-spinner'\n\n/*\n `dap-ds-spinner`\n * @summary Loading spinner component.\n * @element dap-ds-spinner\n * @title - Spinner\n \n @csspart base - The main spinner container.\n * @csspart icon - The loading icon element.\n * @csspart icon-base - The base of the loading icon.\n * @csspart text - The loading text element.\n \n @slot - The loading text content.\n \n @cssprop --dds-spinner-icon-color-neutral - Color for neutral spinner icons.\n * @cssprop --dds-spinner-icon-color-brand - Color for brand spinner icons.\n * @cssprop --dds-spinner-icon-color-negative - Color for negative spinner icons.\n * @cssprop --dds-spinner-icon-color-positive - Color for positive spinner icons.\n * @cssprop --dds-spinner-icon-color-inverted - Color for inverted spinner icons.\n * @cssprop --dds-spinner-text-spacing - Spacing between spinner and text.\n * @cssprop --dds-spinner-animation-duration - Duration of the spinner animation.\n \n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'DapDSSpinner',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport * as React from 'react'\n\nimport Component from '../../components/stack/stack.component.js'\n\nconst tagName = 'dap-ds-stack'\n\n/*\n `dap-ds-stack`\n * @summary A stack is a container for stacked content.\n * @element dap-ds-stack\n * @title - Stack\n \n @slot - The content of the stack.\n \n @csspart stack - The main stack container.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'DapDSStack',\n})\n\nexport default reactWrapper\n","\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/switch/switch.component.js'\n import type { DdsChangeEvent } from '../../events/events'\nimport type { DdsBlurEvent } from '../../events/events'\nimport type { DdsFocusEvent } from '../../events/events'\nimport type { DdsInputEvent } from '../../events/events'\n export type { DdsChangeEvent } from '../../events/events'\nexport type { DdsBlurEvent } from '../../events/events'\nexport type { DdsFocusEvent } from '../../events/events'\nexport type { DdsInputEvent } from '../../events/events'\n\n const tagName = 'dap-ds-switch'\n\n /*\n `dap-ds-switch`\n * @summary A switch is a graphical control element that allows the user to toggle between two states.\n * @element dap-ds-switch\n * @title - Switch\n \n @property {string} name - The name of the switch.\n * @property {string} value - The value of the switch.\n * @property {string} label - The label of the switch.\n * @property {string} description - The description of the switch.\n * @property {boolean} checked - The checked state of the switch.\n * @property {'xs' \| 'sm' \| 'md' \| 'lg'} size - The size of the switch.\n * @property {boolean} disabled - The disabled state of the switch.\n * @property {boolean} required - The required state of the switch.\n * @property {'left' \| 'right'} labelPlacement - The placement of the label.\n * @property {'top' \| 'bottom'} descriptionPlacement - The placement of the description.\n * @property {boolean} subtle - The weight of the label.\n * @property {string} feedback - The feedback of the switch.\n * @property {'negative' \| 'positive' \| 'warning'} feedbackType - The feedback type of the switch.\n * @property {boolean} optional - The optional state of the switch.\n * @property {string} optionalLabel - The optional label of the switch.\n \n @cssProperty --dds-switch-width - Width of the switch control.\n * @cssProperty --dds-switch-height - Height of the switch control.\n * @cssProperty --dds-switch-thumb-width - Width of the switch thumb.\n * @cssProperty --dds-switch-thumb-height - Height of the switch thumb.\n * @cssProperty --dds-switch-thumb-margin - Margin around the switch thumb.\n * @cssProperty --dds-switch-thumb-color - Color of the switch thumb.\n * @cssProperty --dds-switch-unchecked-bg - Background color of the switch when unchecked.\n * @cssProperty --dds-switch-checked-bg - Background color of the switch when checked.\n * @cssProperty --dds-switch-invalid-bg - Background color of the switch when invalid.\n * @cssProperty --dds-switch-disabled-bg - Background color of the switch when disabled.\n * @cssProperty --dds-switch-wrapper-padding - Padding of the switch wrapper.\n * @cssProperty --dds-switch-wrapper-bg - Background color of the switch wrapper.\n * @cssProperty --dds-switch-border-color - Border color of the switch.\n * @cssProperty --dds-switch-high-contrast-border-color - Border color of the switch in high contrast mode.\n \n @event dds-change - Fired when the input value changes.\n * @event dds-blur - Emitted when the input loses focus.\n * @event dds-focus - Emitted when the input gains focus.\n * @event dds-input - Emitted when the input receives input.\n \n @csspart base - The main switch container.\n * @csspart baselabel - The main label container\n * @csspart label - The label of the switch.\n * @csspart input - The native input of the switch.\n * @csspart control - The control of the switch.\n * @csspart description - The description of the switch.\n /\n const reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {\n onDdsChange: 'dds-change' as EventName<DdsChangeEvent>,\nonDdsBlur: 'dds-blur' as EventName<DdsBlurEvent>,\nonDdsFocus: 'dds-focus' as EventName<DdsFocusEvent>,\nonDdsInput: 'dds-input' as EventName<DdsInputEvent>\n },\n displayName: \"DapDSSwitch\"\n })\n\n export default reactWrapper\n ","\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/tab/tab-group.component.js'\n import type { DdsTabSelectEvent } from '../../events/events'\n export type { DdsTabSelectEvent } from '../../events/events'\n\n const tagName = 'dap-ds-tab-group'\n\n /*\n `dap-ds-tab-group`\n * @summary A tab group component. It is used with dap-ds-tab component to create a tab group.\n * @element dap-ds-tab-group\n * @title - Tab group\n * @group tab\n \n @event dds-tab-select - Fired when select a new tab.\n \n @slot - The tab items.\n \n @csspart base - The main container.\n * @csspart tab-nav - The tab navigation container.\n * @csspart tab-content - The tab content container.\n \n @cssproperty --dds-tab-group-border-radius - Border radius of the tab group container\n * @cssproperty --dds-tab-group-border-width - Border width of the tab navigation\n * @cssproperty --dds-tab-group-border-color - Border color of the tab navigation\n * @cssproperty --dds-tab-height-sm - Height of small tabs\n * @cssproperty --dds-tab-height-lg - Height of large tabs\n * @cssproperty --dds-tab-font-size-sm - Font size of small tabs\n * @cssproperty --dds-tab-font-size-lg - Font size of large tabs\n * @cssproperty --dds-tab-padding - Padding of the tab buttons\n * @cssproperty --dds-tab-border-width - Border width for tabs\n * @cssproperty --dds-tab-selected-border-color - Border color for selected tabs\n * @cssproperty --dds-tab-text-color - Text color for tabs\n * @cssproperty --dds-tab-hover-text-color - Text color for tabs on hover\n * @cssproperty --dds-tab-disabled-text-color - Text color for disabled tabs\n * @cssproperty --dds-tab-hover-background - Background color for tabs on hover\n * @cssproperty --dds-tab-active-background - Background color for active tabs\n /\n const reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {\n onDdsTabSelect: 'dds-tab-select' as EventName<DdsTabSelectEvent>\n },\n displayName: \"DapDSTabGroup\"\n })\n\n export default reactWrapper\n ","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/tab/tab.component.js'\n\nconst tagName = 'dap-ds-tab'\n\n/*\n `dap-ds-tab`\n * @summary A tab item component. It is used in dap-ds-tab-group component slot to create a tab item.\n * @element dap-ds-tab\n * @title - Tab\n * \n @slot - The tab title template.\n * @slot content - The tab content.\n \n @csspart base - The main tab content container.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'DapDSTab',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/table/table-cell.component.js'\n\nconst tagName = 'dap-ds-table-cell'\n\n/*\n Table cell component.\n * @element dap-ds-table-cell\n * @title - Table cell\n * @group table\n \n @slot - The default slot.\n \n @csspart base - The main cell container.\n \n @cssproperty --dds-table-cell-padding-block - Padding for the top and bottom of the cell. Default: var(--dds-spacing-200)\n * @cssproperty --dds-table-cell-padding-inline-start - Padding for the start (left in LTR) of the cell. Default: var(--dds-spacing-500)\n * @cssproperty --dds-table-cell-padding-inline-end - Padding for the end (right in LTR) of the cell. Default: var(--dds-spacing-500)\n * @cssproperty --dds-table-cell-border-width - Width of the cell's bottom border. Default: var(--dds-border-width-base)\n * @cssproperty --dds-table-cell-border-color - Color of the cell's bottom border. Default: var(--dds-border-neutral-subtle)\n * @cssproperty --dds-table-cell-text-color - Text color of the cell. Default: var(--dds-text-neutral-base)\n * @cssproperty --dds-table-cell-line-height - Line height of the cell text. Default: 1.5\n * @cssproperty --dds-table-cell-text-align - Text alignment in the cell. Default: left\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'DapDSTableCell',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/table/table-header.component.js'\n\nconst tagName = 'dap-ds-table-header'\n\n/*\n Table header cell component.\n * @element dap-ds-table-header\n * @title - Table header\n * @group table\n \n @slot - The default slot.\n \n @csspart base - The main header cell container.\n \n @cssproperty --dds-table-header-padding-block - Padding for the top and bottom of the header cell.\n * @cssproperty --dds-table-header-padding-inline-start - Padding for the start (left in LTR) of the header cell.\n * @cssproperty --dds-table-header-padding-inline-end - Padding for the end (right in LTR) of the header cell.\n * @cssproperty --dds-table-header-border-width - Width of the header cell's bottom border.\n * @cssproperty --dds-table-header-border-color - Color of the header cell's bottom border.\n * @cssproperty --dds-table-header-text-color - Text color of the header cell.\n * @cssproperty --dds-table-header-font-weight - Font weight of the header cell text.\n * @cssproperty --dds-table-header-line-height - Line height of the header cell text.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'DapDSTableHeader',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/table/table-row.component.js'\n\nconst tagName = 'dap-ds-table-row'\n\n/*\n Table row component.\n * @element dap-ds-table-row\n * @title - Table row\n * @group table\n \n @slot - The default slot. Accepts `dap-ds-table-cell` and `dap-ds-table-header` elements.\n \n @cssprop --dds-table-row-padding-right - Padding right for the last table header, defaults to var(--dds-spacing-500)\n * @cssprop --dds-table-row-padding-top - Padding top for table headers in mobile view, defaults to var(--dds-spacing-400)\n * @cssprop --dds-table-row-padding-bottom - Padding bottom for the last table cell in mobile view, defaults to var(--dds-spacing-400)\n * @cssprop --dds-table-row-border-color - Border color for table cells and headers, defaults to transparent\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'DapDSTableRow',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/table/table.component.js'\n\nconst tagName = 'dap-ds-table'\n\n/*\n Data table component.\n * @element dap-ds-table\n * @title - Table\n \n @slot - The default slot. Accepts `dap-ds-table-row` elements.\n \n @cssprop --dds-table-border-width - Width of the table border. Default: var(--dds-border-width-base, 1px)\n * @cssprop --dds-table-border-color - Color of the table border. Default: var(--dds-border-neutral-subtle)\n * @cssprop --dds-table-border-radius - Border radius of the table. Default: var(--dds-radius-small, 4px)\n * @cssprop --dds-table-row-divider-color - Color of the divider between rows in mobile view. Default: var(--dds-border-neutral-subtle)\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'DapDSTable',\n})\n\nexport default reactWrapper\n","\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/textarea/textarea.component.js'\n import type { DdsCountChangeEvent } from '../../events/events'\nimport type { DdsChangeEvent } from '../../events/events'\nimport type { DdsInputEvent } from '../../events/events'\nimport type { DdsKeydownEvent } from '../../events/events'\nimport type { DdsBlurEvent } from '../../events/events'\nimport type { DdsFocusEvent } from '../../events/events'\nimport type { DdsSelectEvent } from '../../events/events'\n export type { DdsCountChangeEvent } from '../../events/events'\nexport type { DdsChangeEvent } from '../../events/events'\nexport type { DdsInputEvent } from '../../events/events'\nexport type { DdsKeydownEvent } from '../../events/events'\nexport type { DdsBlurEvent } from '../../events/events'\nexport type { DdsFocusEvent } from '../../events/events'\nexport type { DdsSelectEvent } from '../../events/events'\n\n const tagName = 'dap-ds-textarea'\n\n /*\n `dap-ds-textarea`\n * @summary A textarea is a multi-line text input field.\n * @element dap-ds-textarea\n * @title - Textarea\n \n @property {'xs' \| 'sm' \| 'lg'} size - The size of the textarea. Default is `md`.\n * @property {boolean} disabled - The disabled state of the textarea.\n * @property {number} minlength - The minimum length of the textarea.\n * @property {string} value - The value of the textarea.\n * @property {string} tooltip - The tooltip of the textarea.\n * @property {'top' \| 'right' \| 'bottom' \| 'left'} tooltipPlacement - The tooltip placement of the textarea.\n * @property {InputStatus} status - The status of the textarea. Can be `success` or `error`.\n * @property {boolean} readonly - The readonly state of the textarea.\n * @property {boolean} required - The required state of the textarea.\n * @property {string} label - The label of the textarea.\n * @property {string} description - The description of the textarea.\n * @property {string} feedback - The feedback of the textarea.\n * @property {'negative' \| 'positive' \| 'warning'} feedbackType - The feedback type of the textarea. Can be `negative`, `positive`, or `warning`.\n * @property {boolean} optional - The optional state of the textarea.\n * @property {string} optionalLabel - The optional label of the textarea.\n * @property {boolean} subtle - The weight of the label. Default is `false`\n * @property {boolean} autofocus - The autofocus state of the textarea.\n \n @event dds-count-change - Fires when the count of the textarea changes.\n * @event dds-change - Fired when the textarea value changes.\n * @event dds-input - Fired when the textarea value changes.\n * @event dds-keydown - Fired when a key is pressed down.\n * @event dds-blur - Fired when the textarea loses focus.\n * @event dds-focus - Emitted when the textarea gains focus.\n * @event dds-select - Emitted when select text in textarea.\n \n @slot feedback-icon - The custom icon of the feedback.\n \n @csspart base - The main textarea container.\n * @csspart input - The native input of the textarea.\n * @csspart counter - The counter of the textarea.\n * @csspart counter-base - The base of the counter.\n * @csspart feedback - The feedback of the textarea.\n \n @cssproperty --dds-textarea-min-rows - Minimum number of rows in the textarea. Default is 2.\n * @cssproperty --dds-textarea-spacing - Gap between elements in the textarea container. Default is var(--dds-spacing-200).\n * @cssproperty --dds-textarea-gap - Gap between elements in the textarea container. Default is var(--dds-spacing-200).\n * @cssproperty --dds-textarea-margin-top - Top margin of the textarea. Default is var(--dds-spacing-200).\n * @cssproperty --dds-textarea-padding - Padding of the textarea control. Default is var(--dds-spacing-200) var(--dds-spacing-300).\n * @cssproperty --dds-textarea-border-width - Border width of the textarea. Default is var(--dds-border-width-base).\n * @cssproperty --dds-textarea-border-color - Border color of the textarea. Default is var(--dds-border-neutral-base).\n * @cssproperty --dds-textarea-background - Background color of the textarea. Default is var(--dds-fields-background-default).\n * @cssproperty --dds-textarea-color - Text color of the textarea. Default is var(--dds-text-neutral-base).\n * @cssproperty --dds-textarea-border-radius - Border radius of the textarea. Default is var(--dds-radius-base).\n * @cssproperty --dds-textarea-disabled-bg - Background color when disabled. Default is var(--dds-fields-background-disabled).\n * @cssproperty --dds-textarea-disabled-color - Text color when disabled. Default is var(--dds-text-neutral-disabled).\n * @cssproperty --dds-textarea-readonly-bg - Background color when readonly. Default is var(--dds-fields-background-read-only).\n * @cssproperty --dds-textarea-readonly-color - Text color when readonly. Default is var(--dds-text-neutral-subtle).\n * @cssproperty --dds-textarea-error-border - Border color when in error state. Default is var(--dds-border-negative-base).\n * @cssproperty --dds-textarea-success-border - Border color when in success state. Default is var(--dds-border-positive-base).\n /\n const reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {\n onDdsCountChange: 'dds-count-change' as EventName<DdsCountChangeEvent>,\nonDdsChange: 'dds-change' as EventName<DdsChangeEvent>,\nonDdsInput: 'dds-input' as EventName<DdsInputEvent>,\nonDdsKeydown: 'dds-keydown' as EventName<DdsKeydownEvent>,\nonDdsBlur: 'dds-blur' as EventName<DdsBlurEvent>,\nonDdsFocus: 'dds-focus' as EventName<DdsFocusEvent>,\nonDdsSelect: 'dds-select' as EventName<DdsSelectEvent>\n },\n displayName: \"DapDSTextarea\"\n })\n\n export default reactWrapper\n ","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/timeline/timeline-item.component.js'\n\nconst tagName = 'dap-ds-timeline-item'\n\n/*\n `dap-ds-timeline-item`\n * @summary A timeline is a graphical representation of a series of events.\n * @element dap-ds-timeline-item\n * @title - Timeline item\n * @group Timeline\n \n @slot - The default slot for the item content.\n \n @csspart base - The main timeline item container.\n * @csspart connector - The connector element between two timeline items.\n * @csspart content - The content of the timeline item.\n \n @cssproperty --dds-timeline-position - Position of the timeline dot (default: 28px)\n * @cssproperty --dds-timeline-connector-width - Width of the timeline connector line (default: 1px)\n * @cssproperty --dds-timeline-connector-left-position - Left position of the timeline connector (default: 5.5px)\n * @cssproperty --dds-timeline-dot-size - Size of the timeline dot (default: var(--dds-spacing-300))\n * @cssproperty --dds-timeline-item-margin-bottom - Bottom margin of timeline items (default: var(--dds-spacing-200))\n * @cssproperty --dds-timeline-item-padding-left - Left padding of timeline items (default: var(--dds-spacing-400))\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'DapDSTimelineItem',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/timeline/timeline.component.js'\n\nconst tagName = 'dap-ds-timeline'\n\n/*\n `dap-ds-timeline`\n * @summary A timeline is a graphical representation of a series of events.\n * @element dap-ds-timeline\n * @title - Timeline\n \n @slot - The default slot for the timeline items.\n \n @csspart base - The main timeline container.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'DapDSTimeline',\n})\n\nexport default reactWrapper\n","\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.component.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 {'sm' \| 'lg'} size - The size of the toc. Default is `lg`.\n \n @event 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 /\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 ","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/toggle-button/toggle-button.component.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 @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\n * @cssproperty --dds-toggle-button-min-width-md - Minimum width of the medium toggle button\n * @cssproperty --dds-toggle-button-min-width-sm - Minimum width of the small toggle button\n * @cssproperty --dds-toggle-button-min-width-xs - Minimum width of the extra small toggle button\n * @cssproperty --dds-toggle-button-height-lg - Height of the large toggle button\n * @cssproperty --dds-toggle-button-height-md - Height of the medium toggle button\n * @cssproperty --dds-toggle-button-height-sm - Height of the small toggle button\n * @cssproperty --dds-toggle-button-height-xs - Height of the extra small toggle button\n * @cssproperty --dds-toggle-button-padding-lg - Padding of the large toggle button\n * @cssproperty --dds-toggle-button-padding-md - Padding of the medium toggle button\n * @cssproperty --dds-toggle-button-padding-sm - Padding of the small toggle button\n * @cssproperty --dds-toggle-button-padding-xs - Padding of the extra small toggle button\n * @cssproperty --dds-toggle-button-font-size-lg - Font size of the large toggle button\n * @cssproperty --dds-toggle-button-font-size-md - Font size of the medium toggle button\n * @cssproperty --dds-toggle-button-font-size-sm - Font size of the small toggle button\n * @cssproperty --dds-toggle-button-font-size-xs - Font size of the extra small toggle button\n * @cssproperty --dds-toggle-button-border-enabled - Border color in enabled state\n * @cssproperty --dds-toggle-button-background-enabled - Background color in enabled state\n * @cssproperty --dds-toggle-button-content-enabled - Content/text color in enabled state\n * @cssproperty --dds-toggle-button-border-hover - Border color in hover state\n * @cssproperty --dds-toggle-button-background-hover - Background color in hover state\n * @cssproperty --dds-toggle-button-border-pressed - Border color in pressed state\n * @cssproperty --dds-toggle-button-background-pressed - Background color in pressed state\n * @cssproperty --dds-toggle-button-background-selected-enabled - Background color in selected enabled state\n * @cssproperty --dds-toggle-button-content-selected-enabled - Content/text color in selected enabled state\n * @cssproperty --dds-toggle-button-background-selected-hover - Background color in selected hover state\n * @cssproperty --dds-toggle-button-background-selected-pressed - Background color in selected pressed state\n * @cssproperty --dds-toggle-button-border-disabled - Border color in disabled state\n * @cssproperty --dds-toggle-button-background-disabled - Background color in disabled state\n * @cssproperty --dds-toggle-button-content-disabled - Content/text color in disabled state\n * @cssproperty --dds-toggle-button-highcontrast-border - High contrast border color\n * @cssproperty --dds-toggle-button-highcontrast-border-hover - High contrast border color on hover\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'DapDSToggleButton',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/tooltip/tooltip.component.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.\n * @cssproperty --dds-tooltip-padding - The padding inside the tooltip.\n * @cssproperty --dds-tooltip-border-color - The border color of the tooltip.\n * @cssproperty --dds-tooltip-bg-color - The background color of the tooltip.\n * @cssproperty --dds-tooltip-text-color - The text color of the tooltip.\n * @cssproperty --dds-tooltip-font-size - The font size of the tooltip text.\n * @cssproperty --dds-tooltip-box-shadow - The box shadow of the tooltip.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'DapDSTooltip',\n})\n\nexport default reactWrapper\n","\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.component.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} 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 {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 dds-before-open - Fires before the tray opens.\n * @event dds-opened - Fires after the tray opens.\n * @event dds-before-close - Fires before the tray closes.\n * @event dds-closed - Fires after the tray closed.\n * @event 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 - Padding inside the modal. Default: var(--dds-spacing-800).\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 - Margin below the header. Default: var(--dds-spacing-800).\n * @cssproperty --dds-modal-footer-margin - Margin above the footer. Default: var(--dds-spacing-400).\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 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 ","import { createComponent } from '@lit/react'\nimport * as React from 'react'\n\nimport Component from '../../components/typography/typography.component.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.\n * @cssproperty --dds-text-heading-color - The color of the heading typography.\n * @cssproperty --dds-text-description-subtle - The color of the subtle typography.\n * @cssproperty --dds-text-font-family - The font family of the typography.\n * @cssproperty --dds-text-font-weight-medium - The font weight of the medium typography.\n * @cssproperty --dds-text-font-weight-bold - The font weight of the bold typography.\n * @cssproperty --dds-text-font-size-h1 - The font size of the h1 typography.\n * @cssproperty --dds-text-font-size-h2 - The font size of the h2 typography.\n * @cssproperty --dds-text-font-size-h3 - The font size of the h3 typography.\n * @cssproperty --dds-text-font-size-h4 - The font size of the h4 typography.\n * @cssproperty --dds-text-font-size-h5 - The font size of the h5 typography.\n * @cssproperty --dds-text-font-size-h6 - The font size of the h6 typography.\n * @cssproperty --dds-text-font-size-body - The font size of the body typography.\n * @cssproperty --dds-text-font-size-caption - The font size of the caption typography.\n * @cssproperty --dds-text-font-size-description - The font size of the description typography.\n * @cssproperty --dds-text-font-size-description-lg - The font size of the description lg typography.\n * @cssproperty --dds-text-font-size-description-sm - The font size of the description sm typography.\n * @cssproperty --dds-text-font-size-lg - The font size of the lg typography.\n * @cssproperty --dds-text-font-size-md - The font size of the md typography.\n * @cssproperty --dds-text-font-size-sm - The font size of the sm typography.\n * @cssproperty --dds-text-font-size-xs - The font size of the xs typography.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'DapDSTypography',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/form/form-label/form-label.component.js'\n\nconst tagName = 'dap-ds-form-label'\n\n/*\n `dap-ds-form-label`\n * @summary A form label is a container for labels in a form.\n * @element dap-ds-form-label\n * @title - Form label\n * @group form\n \n @property {string} optionalLabel - Label of optional text\n * @property {boolean} subtle - Text weight of the label.\n * @property {boolean} optional - If the label is optional.\n * @property {boolean} required - If the label is required.\n * @property {string} label - The label text.\n \n @csspart base - The main form label container.\n * @csspart required - The required indicator of the form label.\n * @csspart optional - The optional indicator of the form label.\n \n @cssproperty --dds-form-label-font-weight - Font weight of the label. Defaults to var(--dds-font-weight-bold).\n * @cssproperty --dds-form-label-line-height - Line height of the label. Defaults to var(--dds-font-line-height-xlarge).\n * @cssproperty --dds-form-label-color - Text color of the label. Defaults to var(--dds-text-neutral-enabled).\n * @cssproperty --dds-form-label-disabled-color - Text color when the label is disabled. Defaults to var(--dds-text-neutral-disabled).\n * @cssproperty --dds-form-label-required-color - Color of the required indicator. Defaults to var(--dds-text-negative-subtle).\n * @cssproperty --dds-form-label-optional-color - Color of the optional indicator. Defaults to var(--dds-text-neutral-subtle).\n * @cssproperty --dds-form-label-margin-bottom - Bottom margin of the label. Defaults to var(--dds-spacing-200).\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'DapDSFormLabel',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/form/input-group/input-group.component.js'\n\nconst tagName = 'dap-ds-input-group'\n\n/*\n `dap-ds-input-group`\n * @summary An input group is a container for inputs.\n * @element dap-ds-input-group\n * @title - Input group\n * @group form\n \n @property {string} label - The label of the input group.\n * @property {string} description - The description of the input group.\n * @property {string} tooltip - The tooltip of the input group.\n * @property {'top' \| 'right' \| 'bottom' \| 'left'} tooltipPlacement - The tooltip placement of the input group.\n * @property {string} tooltipAriaLabel - The aria label of the tooltip.\n * @property {string} optionalLabel - The label of the input group when it is optional.\n * @property {boolean} disabled - Whether the input group is disabled.\n * @property {'xs' \| 'sm' \| 'lg'} size - The size of the input group. Default is `sm`. Can be `sm` or `lg`.\n * @property {boolean} required - Whether the input group is required.\n * @property {boolean} optional - Whether the input group is optional.\n * @property {string} feedback - The feedback of the input.\n * @property {string} feedbackType - The type of the feedback.\n * @property {boolean} subtle - Whether the input group label is subtle.\n \n @slot - The content of the input group items.\n * @slot feedback-icon - The custom icon of the feedback.\n \n @csspart base - The main input group container.\n * @csspart label - The label of the input group.\n * @csspart description - The description of the input group.\n * @csspart tooltip - The tooltip of the input group.\n * @csspart container - The container of the input group items.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'DapDSInputGroup',\n})\n\nexport default reactWrapper\n","\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/form/radio-group/radio-group.component.js'\n import type { DdsChangeEvent } from '../../events/events'\nimport type { DdsBlurEvent } from '../../events/events'\nimport type { DdsFocusEvent } from '../../events/events'\n export type { DdsChangeEvent } from '../../events/events'\nexport type { DdsBlurEvent } from '../../events/events'\nexport type { DdsFocusEvent } from '../../events/events'\n\n const tagName = 'dap-ds-radio-group'\n\n /*\n `dap-ds-radio-group`\n * @summary A radio group is a form element that allows the user to select one option from a set.\n * @element dap-ds-radio-group\n * @title - Radio group\n * @group radio-button\n \n @event dds-change - Fired when the radio group is checked.\n * @event dds-blur - Emitted when the radio group loses focus.\n * @event dds-focus - Emitted when the radio group gains focus.\n \n @property {string} name - The name of the radio group.\n * @property {string} value - The value of the radio group.\n * @property {boolean} disabled - Whether the radio group is disabled.\n * @property {boolean} required - Whether the radio group is required.\n * @property {string} label - The label of the radio group.\n * @property {string} description - The description of the radio group.\n * @property {string} tooltip - The tooltip of the radio group.\n * @property {'top' \| 'right' \| 'bottom' \| 'left'} tooltipPlacement - The tooltip placement of the radio group.\n * @property {string} feedback - The feedback of the radio group.\n * @property {'negative' \| 'positive' \| 'warning'} feedbackType - The feedback type of the radio group. Can be `negative`, `positive`, or `warning`.\n * @property {boolean} optional - The optional state of the radio group.\n * @property {string} optionalLabel - Text of optional label.\n * @property {boolean} subtle - The weight of the label. Default is `false`\n * @property {'xs' \| 'sm' \| 'lg'} size - The size of the radio group. Default is `sm`.\n * @property {boolean} subtle - Font weight of the feedback label. Default is `false` which is bold.\n \n @slot - The content of the radio group.\n * @slot feedback-icon - The custom icon of the feedback.\n \n @csspart base - The main radio group container.\n * @csspart label - The label of the radio group.\n * @csspart tooltip - The tooltip of the radio group.\n * @csspart container - The container of the radio group items.\n /\n const reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {\n onDdsChange: 'dds-change' as EventName<DdsChangeEvent>,\nonDdsBlur: 'dds-blur' as EventName<DdsBlurEvent>,\nonDdsFocus: 'dds-focus' as EventName<DdsFocusEvent>\n },\n displayName: \"DapDSRadioGroup\"\n })\n\n export default reactWrapper\n ","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/icons/arrows/arrows-arrow-down-line/arrows-arrow-down-line.component.js'\n\nconst tagName = 'dap-ds-icon-arrow-down-line'\n\n/*\n `dap-ds-icon-arrow-down-line`\n * @summary An icon\n * @element dap-ds-icon-arrow-down-line\n * @title - ArrowsArrowDownLine\n * @group icon\n * @icontype arrows\n \n @attribute {number} size - (optional) The width and height in pixels\n * @attribute {boolean} selected - (optional) Sets the icon color via the `fill` attribute\n * @attribute {string} accessibilityTitle - (optional) When using the icon standalone, make it meaningful for accessibility\n * @attribute {boolean} focusable - (optional) If `true` the icon can receive focus\n \n @csspart base - The main icon container.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'ArrowsArrowDownLine',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/icons/arrows/arrows-arrow-down-s-fill/arrows-arrow-down-s-fill.component.js'\n\nconst tagName = 'dap-ds-icon-arrow-down-s-fill'\n\n/*\n `dap-ds-icon-arrow-down-s-fill`\n * @summary An icon\n * @element dap-ds-icon-arrow-down-s-fill\n * @title - ArrowsArrowDownSFill\n * @group icon\n * @icontype arrows\n \n @attribute {number} size - (optional) The width and height in pixels\n * @attribute {boolean} selected - (optional) Sets the icon color via the `fill` attribute\n * @attribute {string} accessibilityTitle - (optional) When using the icon standalone, make it meaningful for accessibility\n * @attribute {boolean} focusable - (optional) If `true` the icon can receive focus\n \n @csspart base - The main icon container.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'ArrowsArrowDownSFill',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/icons/arrows/arrows-arrow-down-s-line/arrows-arrow-down-s-line.component.js'\n\nconst tagName = 'dap-ds-icon-arrow-down-s-line'\n\n/*\n `dap-ds-icon-arrow-down-s-line`\n * @summary An icon\n * @element dap-ds-icon-arrow-down-s-line\n * @title - ArrowsArrowDownSLine\n * @group icon\n * @icontype arrows\n \n @attribute {number} size - (optional) The width and height in pixels\n * @attribute {boolean} selected - (optional) Sets the icon color via the `fill` attribute\n * @attribute {string} accessibilityTitle - (optional) When using the icon standalone, make it meaningful for accessibility\n * @attribute {boolean} focusable - (optional) If `true` the icon can receive focus\n \n @csspart base - The main icon container.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'ArrowsArrowDownSLine',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/icons/arrows/arrows-arrow-left-down-line/arrows-arrow-left-down-line.component.js'\n\nconst tagName = 'dap-ds-icon-arrow-left-down-line'\n\n/*\n `dap-ds-icon-arrow-left-down-line`\n * @summary An icon\n * @element dap-ds-icon-arrow-left-down-line\n * @title - ArrowsArrowLeftDownLine\n * @group icon\n * @icontype arrows\n \n @attribute {number} size - (optional) The width and height in pixels\n * @attribute {boolean} selected - (optional) Sets the icon color via the `fill` attribute\n * @attribute {string} accessibilityTitle - (optional) When using the icon standalone, make it meaningful for accessibility\n * @attribute {boolean} focusable - (optional) If `true` the icon can receive focus\n \n @csspart base - The main icon container.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'ArrowsArrowLeftDownLine',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/icons/arrows/arrows-arrow-left-l-line/arrows-arrow-left-l-line.component.js'\n\nconst tagName = 'dap-ds-icon-arrow-left-l-line'\n\n/*\n `dap-ds-icon-arrow-left-l-line`\n * @summary An icon\n * @element dap-ds-icon-arrow-left-l-line\n * @title - ArrowsArrowLeftLLine\n * @group icon\n * @icontype arrows\n \n @attribute {number} size - (optional) The width and height in pixels\n * @attribute {boolean} selected - (optional) Sets the icon color via the `fill` attribute\n * @attribute {string} accessibilityTitle - (optional) When using the icon standalone, make it meaningful for accessibility\n * @attribute {boolean} focusable - (optional) If `true` the icon can receive focus\n \n @csspart base - The main icon container.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'ArrowsArrowLeftLLine',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/icons/arrows/arrows-arrow-left-line/arrows-arrow-left-line.component.js'\n\nconst tagName = 'dap-ds-icon-arrow-left-line'\n\n/*\n `dap-ds-icon-arrow-left-line`\n * @summary An icon\n * @element dap-ds-icon-arrow-left-line\n * @title - ArrowsArrowLeftLine\n * @group icon\n * @icontype arrows\n \n @attribute {number} size - (optional) The width and height in pixels\n * @attribute {boolean} selected - (optional) Sets the icon color via the `fill` attribute\n * @attribute {string} accessibilityTitle - (optional) When using the icon standalone, make it meaningful for accessibility\n * @attribute {boolean} focusable - (optional) If `true` the icon can receive focus\n \n @csspart base - The main icon container.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'ArrowsArrowLeftLine',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/icons/arrows/arrows-arrow-left-s-fill/arrows-arrow-left-s-fill.component.js'\n\nconst tagName = 'dap-ds-icon-arrow-left-s-fill'\n\n/*\n `dap-ds-icon-arrow-left-s-fill`\n * @summary An icon\n * @element dap-ds-icon-arrow-left-s-fill\n * @title - ArrowsArrowLeftSFill\n * @group icon\n * @icontype arrows\n \n @attribute {number} size - (optional) The width and height in pixels\n * @attribute {boolean} selected - (optional) Sets the icon color via the `fill` attribute\n * @attribute {string} accessibilityTitle - (optional) When using the icon standalone, make it meaningful for accessibility\n * @attribute {boolean} focusable - (optional) If `true` the icon can receive focus\n \n @csspart base - The main icon container.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'ArrowsArrowLeftSFill',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/icons/arrows/arrows-arrow-left-s-line/arrows-arrow-left-s-line.component.js'\n\nconst tagName = 'dap-ds-icon-arrow-left-s-line'\n\n/*\n `dap-ds-icon-arrow-left-s-line`\n * @summary An icon\n * @element dap-ds-icon-arrow-left-s-line\n * @title - ArrowsArrowLeftSLine\n * @group icon\n * @icontype arrows\n \n @attribute {number} size - (optional) The width and height in pixels\n * @attribute {boolean} selected - (optional) Sets the icon color via the `fill` attribute\n * @attribute {string} accessibilityTitle - (optional) When using the icon standalone, make it meaningful for accessibility\n * @attribute {boolean} focusable - (optional) If `true` the icon can receive focus\n \n @csspart base - The main icon container.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'ArrowsArrowLeftSLine',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/icons/arrows/arrows-arrow-left-up-line/arrows-arrow-left-up-line.component.js'\n\nconst tagName = 'dap-ds-icon-arrow-left-up-line'\n\n/*\n `dap-ds-icon-arrow-left-up-line`\n * @summary An icon\n * @element dap-ds-icon-arrow-left-up-line\n * @title - ArrowsArrowLeftUpLine\n * @group icon\n * @icontype arrows\n \n @attribute {number} size - (optional) The width and height in pixels\n * @attribute {boolean} selected - (optional) Sets the icon color via the `fill` attribute\n * @attribute {string} accessibilityTitle - (optional) When using the icon standalone, make it meaningful for accessibility\n * @attribute {boolean} focusable - (optional) If `true` the icon can receive focus\n \n @csspart base - The main icon container.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'ArrowsArrowLeftUpLine',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/icons/arrows/arrows-arrow-right-down-line/arrows-arrow-right-down-line.component.js'\n\nconst tagName = 'dap-ds-icon-arrow-right-down-line'\n\n/*\n `dap-ds-icon-arrow-right-down-line`\n * @summary An icon\n * @element dap-ds-icon-arrow-right-down-line\n * @title - ArrowsArrowRightDownLine\n * @group icon\n * @icontype arrows\n \n @attribute {number} size - (optional) The width and height in pixels\n * @attribute {boolean} selected - (optional) Sets the icon color via the `fill` attribute\n * @attribute {string} accessibilityTitle - (optional) When using the icon standalone, make it meaningful for accessibility\n * @attribute {boolean} focusable - (optional) If `true` the icon can receive focus\n \n @csspart base - The main icon container.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'ArrowsArrowRightDownLine',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/icons/arrows/arrows-arrow-right-l-line/arrows-arrow-right-l-line.component.js'\n\nconst tagName = 'dap-ds-icon-arrow-right-l-line'\n\n/*\n `dap-ds-icon-arrow-right-l-line`\n * @summary An icon\n * @element dap-ds-icon-arrow-right-l-line\n * @title - ArrowsArrowRightLLine\n * @group icon\n * @icontype arrows\n \n @attribute {number} size - (optional) The width and height in pixels\n * @attribute {boolean} selected - (optional) Sets the icon color via the `fill` attribute\n * @attribute {string} accessibilityTitle - (optional) When using the icon standalone, make it meaningful for accessibility\n * @attribute {boolean} focusable - (optional) If `true` the icon can receive focus\n \n @csspart base - The main icon container.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'ArrowsArrowRightLLine',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/icons/arrows/arrows-arrow-right-line/arrows-arrow-right-line.component.js'\n\nconst tagName = 'dap-ds-icon-arrow-right-line'\n\n/*\n `dap-ds-icon-arrow-right-line`\n * @summary An icon\n * @element dap-ds-icon-arrow-right-line\n * @title - ArrowsArrowRightLine\n * @group icon\n * @icontype arrows\n \n @attribute {number} size - (optional) The width and height in pixels\n * @attribute {boolean} selected - (optional) Sets the icon color via the `fill` attribute\n * @attribute {string} accessibilityTitle - (optional) When using the icon standalone, make it meaningful for accessibility\n * @attribute {boolean} focusable - (optional) If `true` the icon can receive focus\n \n @csspart base - The main icon container.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'ArrowsArrowRightLine',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/icons/arrows/arrows-arrow-right-s-fill/arrows-arrow-right-s-fill.component.js'\n\nconst tagName = 'dap-ds-icon-arrow-right-s-fill'\n\n/*\n `dap-ds-icon-arrow-right-s-fill`\n * @summary An icon\n * @element dap-ds-icon-arrow-right-s-fill\n * @title - ArrowsArrowRightSFill\n * @group icon\n * @icontype arrows\n \n @attribute {number} size - (optional) The width and height in pixels\n * @attribute {boolean} selected - (optional) Sets the icon color via the `fill` attribute\n * @attribute {string} accessibilityTitle - (optional) When using the icon standalone, make it meaningful for accessibility\n * @attribute {boolean} focusable - (optional) If `true` the icon can receive focus\n \n @csspart base - The main icon container.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'ArrowsArrowRightSFill',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/icons/arrows/arrows-arrow-right-s-line/arrows-arrow-right-s-line.component.js'\n\nconst tagName = 'dap-ds-icon-arrow-right-s-line'\n\n/*\n `dap-ds-icon-arrow-right-s-line`\n * @summary An icon\n * @element dap-ds-icon-arrow-right-s-line\n * @title - ArrowsArrowRightSLine\n * @group icon\n * @icontype arrows\n \n @attribute {number} size - (optional) The width and height in pixels\n * @attribute {boolean} selected - (optional) Sets the icon color via the `fill` attribute\n * @attribute {string} accessibilityTitle - (optional) When using the icon standalone, make it meaningful for accessibility\n * @attribute {boolean} focusable - (optional) If `true` the icon can receive focus\n \n @csspart base - The main icon container.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'ArrowsArrowRightSLine',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/icons/arrows/arrows-arrow-right-up-line/arrows-arrow-right-up-line.component.js'\n\nconst tagName = 'dap-ds-icon-arrow-right-up-line'\n\n/*\n `dap-ds-icon-arrow-right-up-line`\n * @summary An icon\n * @element dap-ds-icon-arrow-right-up-line\n * @title - ArrowsArrowRightUpLine\n * @group icon\n * @icontype arrows\n \n @attribute {number} size - (optional) The width and height in pixels\n * @attribute {boolean} selected - (optional) Sets the icon color via the `fill` attribute\n * @attribute {string} accessibilityTitle - (optional) When using the icon standalone, make it meaningful for accessibility\n * @attribute {boolean} focusable - (optional) If `true` the icon can receive focus\n \n @csspart base - The main icon container.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'ArrowsArrowRightUpLine',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/icons/arrows/arrows-arrow-up-line/arrows-arrow-up-line.component.js'\n\nconst tagName = 'dap-ds-icon-arrow-up-line'\n\n/*\n `dap-ds-icon-arrow-up-line`\n * @summary An icon\n * @element dap-ds-icon-arrow-up-line\n * @title - ArrowsArrowUpLine\n * @group icon\n * @icontype arrows\n \n @attribute {number} size - (optional) The width and height in pixels\n * @attribute {boolean} selected - (optional) Sets the icon color via the `fill` attribute\n * @attribute {string} accessibilityTitle - (optional) When using the icon standalone, make it meaningful for accessibility\n * @attribute {boolean} focusable - (optional) If `true` the icon can receive focus\n \n @csspart base - The main icon container.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'ArrowsArrowUpLine',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/icons/arrows/arrows-arrow-up-s-fill/arrows-arrow-up-s-fill.component.js'\n\nconst tagName = 'dap-ds-icon-arrow-up-s-fill'\n\n/*\n `dap-ds-icon-arrow-up-s-fill`\n * @summary An icon\n * @element dap-ds-icon-arrow-up-s-fill\n * @title - ArrowsArrowUpSFill\n * @group icon\n * @icontype arrows\n \n @attribute {number} size - (optional) The width and height in pixels\n * @attribute {boolean} selected - (optional) Sets the icon color via the `fill` attribute\n * @attribute {string} accessibilityTitle - (optional) When using the icon standalone, make it meaningful for accessibility\n * @attribute {boolean} focusable - (optional) If `true` the icon can receive focus\n \n @csspart base - The main icon container.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'ArrowsArrowUpSFill',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/icons/arrows/arrows-arrow-up-s-line/arrows-arrow-up-s-line.component.js'\n\nconst tagName = 'dap-ds-icon-arrow-up-s-line'\n\n/*\n `dap-ds-icon-arrow-up-s-line`\n * @summary An icon\n * @element dap-ds-icon-arrow-up-s-line\n * @title - ArrowsArrowUpSLine\n * @group icon\n * @icontype arrows\n \n @attribute {number} size - (optional) The width and height in pixels\n * @attribute {boolean} selected - (optional) Sets the icon color via the `fill` attribute\n * @attribute {string} accessibilityTitle - (optional) When using the icon standalone, make it meaningful for accessibility\n * @attribute {boolean} focusable - (optional) If `true` the icon can receive focus\n \n @csspart base - The main icon container.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'ArrowsArrowUpSLine',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/icons/arrows/arrows-expand-up-down-fill/arrows-expand-up-down-fill.component.js'\n\nconst tagName = 'dap-ds-icon-expand-up-down-fill'\n\n/*\n `dap-ds-icon-expand-up-down-fill`\n * @summary An icon\n * @element dap-ds-icon-expand-up-down-fill\n * @title - ArrowsExpandUpDownFill\n * @group icon\n * @icontype arrows\n \n @attribute {number} size - (optional) The width and height in pixels\n * @attribute {boolean} selected - (optional) Sets the icon color via the `fill` attribute\n * @attribute {string} accessibilityTitle - (optional) When using the icon standalone, make it meaningful for accessibility\n * @attribute {boolean} focusable - (optional) If `true` the icon can receive focus\n \n @csspart base - The main icon container.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'ArrowsExpandUpDownFill',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/icons/buildings/buildings-home-6-line/buildings-home-6-line.component.js'\n\nconst tagName = 'dap-ds-icon-home-6-line'\n\n/*\n `dap-ds-icon-home-6-line`\n * @summary An icon\n * @element dap-ds-icon-home-6-line\n * @title - BuildingsHome6Line\n * @group icon\n * @icontype buildings\n \n @attribute {number} size - (optional) The width and height in pixels\n * @attribute {boolean} selected - (optional) Sets the icon color via the `fill` attribute\n * @attribute {string} accessibilityTitle - (optional) When using the icon standalone, make it meaningful for accessibility\n * @attribute {boolean} focusable - (optional) If `true` the icon can receive focus\n \n @csspart base - The main icon container.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'BuildingsHome6Line',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/icons/business/business-calendar-line/business-calendar-line.component.js'\n\nconst tagName = 'dap-ds-icon-calendar-line'\n\n/*\n `dap-ds-icon-calendar-line`\n * @summary An icon\n * @element dap-ds-icon-calendar-line\n * @title - BusinessCalendarLine\n * @group icon\n * @icontype business\n \n @attribute {number} size - (optional) The width and height in pixels\n * @attribute {boolean} selected - (optional) Sets the icon color via the `fill` attribute\n * @attribute {string} accessibilityTitle - (optional) When using the icon standalone, make it meaningful for accessibility\n * @attribute {boolean} focusable - (optional) If `true` the icon can receive focus\n \n @csspart base - The main icon container.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'BusinessCalendarLine',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/icons/document/document-clipboard-line/document-clipboard-line.component.js'\n\nconst tagName = 'dap-ds-icon-clipboard-line'\n\n/*\n `dap-ds-icon-clipboard-line`\n * @summary An icon\n * @element dap-ds-icon-clipboard-line\n * @title - DocumentClipboardLine\n * @group icon\n * @icontype document\n \n @attribute {number} size - (optional) The width and height in pixels\n * @attribute {boolean} selected - (optional) Sets the icon color via the `fill` attribute\n * @attribute {string} accessibilityTitle - (optional) When using the icon standalone, make it meaningful for accessibility\n * @attribute {boolean} focusable - (optional) If `true` the icon can receive focus\n \n @csspart base - The main icon container.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'DocumentClipboardLine',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/icons/document/document-file-copy-line/document-file-copy-line.component.js'\n\nconst tagName = 'dap-ds-icon-file-copy-line'\n\n/*\n `dap-ds-icon-file-copy-line`\n * @summary An icon\n * @element dap-ds-icon-file-copy-line\n * @title - DocumentFileCopyLine\n * @group icon\n * @icontype document\n \n @attribute {number} size - (optional) The width and height in pixels\n * @attribute {boolean} selected - (optional) Sets the icon color via the `fill` attribute\n * @attribute {string} accessibilityTitle - (optional) When using the icon standalone, make it meaningful for accessibility\n * @attribute {boolean} focusable - (optional) If `true` the icon can receive focus\n \n @csspart base - The main icon container.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'DocumentFileCopyLine',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/icons/others/others-cookie-line/others-cookie-line.component.js'\n\nconst tagName = 'dap-ds-icon-cookie-line'\n\n/*\n `dap-ds-icon-cookie-line`\n * @summary An icon\n * @element dap-ds-icon-cookie-line\n * @title - OthersCookieLine\n * @group icon\n * @icontype others\n \n @attribute {number} size - (optional) The width and height in pixels\n * @attribute {boolean} selected - (optional) Sets the icon color via the `fill` attribute\n * @attribute {string} accessibilityTitle - (optional) When using the icon standalone, make it meaningful for accessibility\n * @attribute {boolean} focusable - (optional) If `true` the icon can receive focus\n \n @csspart base - The main icon container.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'OthersCookieLine',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/icons/system/system-add-line/system-add-line.component.js'\n\nconst tagName = 'dap-ds-icon-add-line'\n\n/*\n `dap-ds-icon-add-line`\n * @summary An icon\n * @element dap-ds-icon-add-line\n * @title - SystemAddLine\n * @group icon\n * @icontype system\n \n @attribute {number} size - (optional) The width and height in pixels\n * @attribute {boolean} selected - (optional) Sets the icon color via the `fill` attribute\n * @attribute {string} accessibilityTitle - (optional) When using the icon standalone, make it meaningful for accessibility\n * @attribute {boolean} focusable - (optional) If `true` the icon can receive focus\n \n @csspart base - The main icon container.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'SystemAddLine',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/icons/system/system-alert-fill/system-alert-fill.component.js'\n\nconst tagName = 'dap-ds-icon-alert-fill'\n\n/*\n `dap-ds-icon-alert-fill`\n * @summary An icon\n * @element dap-ds-icon-alert-fill\n * @title - SystemAlertFill\n * @group icon\n * @icontype system\n \n @attribute {number} size - (optional) The width and height in pixels\n * @attribute {boolean} selected - (optional) Sets the icon color via the `fill` attribute\n * @attribute {string} accessibilityTitle - (optional) When using the icon standalone, make it meaningful for accessibility\n * @attribute {boolean} focusable - (optional) If `true` the icon can receive focus\n \n @csspart base - The main icon container.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'SystemAlertFill',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/icons/system/system-alert-line/system-alert-line.component.js'\n\nconst tagName = 'dap-ds-icon-alert-line'\n\n/*\n `dap-ds-icon-alert-line`\n * @summary An icon\n * @element dap-ds-icon-alert-line\n * @title - SystemAlertLine\n * @group icon\n * @icontype system\n \n @attribute {number} size - (optional) The width and height in pixels\n * @attribute {boolean} selected - (optional) Sets the icon color via the `fill` attribute\n * @attribute {string} accessibilityTitle - (optional) When using the icon standalone, make it meaningful for accessibility\n * @attribute {boolean} focusable - (optional) If `true` the icon can receive focus\n \n @csspart base - The main icon container.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'SystemAlertLine',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/icons/system/system-check-line/system-check-line.component.js'\n\nconst tagName = 'dap-ds-icon-check-line'\n\n/*\n `dap-ds-icon-check-line`\n * @summary An icon\n * @element dap-ds-icon-check-line\n * @title - SystemCheckLine\n * @group icon\n * @icontype system\n \n @attribute {number} size - (optional) The width and height in pixels\n * @attribute {boolean} selected - (optional) Sets the icon color via the `fill` attribute\n * @attribute {string} accessibilityTitle - (optional) When using the icon standalone, make it meaningful for accessibility\n * @attribute {boolean} focusable - (optional) If `true` the icon can receive focus\n \n @csspart base - The main icon container.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'SystemCheckLine',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/icons/system/system-check-line2/system-check-line2.component.js'\n\nconst tagName = 'dap-ds-icon-check-line2'\n\n/*\n `dap-ds-icon-check-line2`\n * @summary An icon\n * @element dap-ds-icon-check-line2\n * @title - SystemCheckLine2\n * @group icon\n * @icontype system\n \n @attribute {number} size - (optional) The width and height in pixels\n * @attribute {boolean} selected - (optional) Sets the icon color via the `fill` attribute\n * @attribute {string} accessibilityTitle - (optional) When using the icon standalone, make it meaningful for accessibility\n * @attribute {boolean} focusable - (optional) If `true` the icon can receive focus\n \n @csspart base - The main icon container.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'SystemCheckLine2',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/icons/system/system-checkbox-blank-circle-fill/system-checkbox-blank-circle-fill.component.js'\n\nconst tagName = 'dap-ds-icon-checkbox-blank-circle-fill'\n\n/*\n `dap-ds-icon-checkbox-blank-circle-fill`\n * @summary An icon\n * @element dap-ds-icon-checkbox-blank-circle-fill\n * @title - SystemCheckboxBlankCircleFill\n * @group icon\n * @icontype system\n \n @attribute {number} size - (optional) The width and height in pixels\n * @attribute {boolean} selected - (optional) Sets the icon color via the `fill` attribute\n * @attribute {string} accessibilityTitle - (optional) When using the icon standalone, make it meaningful for accessibility\n * @attribute {boolean} focusable - (optional) If `true` the icon can receive focus\n \n @csspart base - The main icon container.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'SystemCheckboxBlankCircleFill',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/icons/system/system-checkbox-blank-circle-fill-check/system-checkbox-blank-circle-fill-check.component.js'\n\nconst tagName = 'dap-ds-icon-checkbox-blank-circle-fill-check'\n\n/*\n `dap-ds-icon-checkbox-blank-circle-fill-check`\n * @summary An icon\n * @element dap-ds-icon-checkbox-blank-circle-fill-check\n * @title - SystemCheckboxBlankCircleFillCheck\n * @group icon\n * @icontype system\n \n @attribute {number} size - (optional) The width and height in pixels\n * @attribute {boolean} selected - (optional) Sets the icon color via the `fill` attribute\n * @attribute {string} accessibilityTitle - (optional) When using the icon standalone, make it meaningful for accessibility\n * @attribute {boolean} focusable - (optional) If `true` the icon can receive focus\n \n @csspart base - The main icon container.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'SystemCheckboxBlankCircleFillCheck',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/icons/system/system-checkbox-blank-circle-line/system-checkbox-blank-circle-line.component.js'\n\nconst tagName = 'dap-ds-icon-checkbox-blank-circle-line'\n\n/*\n `dap-ds-icon-checkbox-blank-circle-line`\n * @summary An icon\n * @element dap-ds-icon-checkbox-blank-circle-line\n * @title - SystemCheckboxBlankCircleLine\n * @group icon\n * @icontype system\n \n @attribute {number} size - (optional) The width and height in pixels\n * @attribute {boolean} selected - (optional) Sets the icon color via the `fill` attribute\n * @attribute {string} accessibilityTitle - (optional) When using the icon standalone, make it meaningful for accessibility\n * @attribute {boolean} focusable - (optional) If `true` the icon can receive focus\n \n @csspart base - The main icon container.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'SystemCheckboxBlankCircleLine',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/icons/system/system-checkbox-circle-fill/system-checkbox-circle-fill.component.js'\n\nconst tagName = 'dap-ds-icon-checkbox-circle-fill'\n\n/*\n `dap-ds-icon-checkbox-circle-fill`\n * @summary An icon\n * @element dap-ds-icon-checkbox-circle-fill\n * @title - SystemCheckboxCircleFill\n * @group icon\n * @icontype system\n \n @attribute {number} size - (optional) The width and height in pixels\n * @attribute {boolean} selected - (optional) Sets the icon color via the `fill` attribute\n * @attribute {string} accessibilityTitle - (optional) When using the icon standalone, make it meaningful for accessibility\n * @attribute {boolean} focusable - (optional) If `true` the icon can receive focus\n \n @csspart base - The main icon container.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'SystemCheckboxCircleFill',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/icons/system/system-checkbox-circle-line/system-checkbox-circle-line.component.js'\n\nconst tagName = 'dap-ds-icon-checkbox-circle-line'\n\n/*\n `dap-ds-icon-checkbox-circle-line`\n * @summary An icon\n * @element dap-ds-icon-checkbox-circle-line\n * @title - SystemCheckboxCircleLine\n * @group icon\n * @icontype system\n \n @attribute {number} size - (optional) The width and height in pixels\n * @attribute {boolean} selected - (optional) Sets the icon color via the `fill` attribute\n * @attribute {string} accessibilityTitle - (optional) When using the icon standalone, make it meaningful for accessibility\n * @attribute {boolean} focusable - (optional) If `true` the icon can receive focus\n \n @csspart base - The main icon container.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'SystemCheckboxCircleLine',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/icons/system/system-close-circle-fill/system-close-circle-fill.component.js'\n\nconst tagName = 'dap-ds-icon-close-circle-fill'\n\n/*\n `dap-ds-icon-close-circle-fill`\n * @summary An icon\n * @element dap-ds-icon-close-circle-fill\n * @title - SystemCloseCircleFill\n * @group icon\n * @icontype system\n \n @attribute {number} size - (optional) The width and height in pixels\n * @attribute {boolean} selected - (optional) Sets the icon color via the `fill` attribute\n * @attribute {string} accessibilityTitle - (optional) When using the icon standalone, make it meaningful for accessibility\n * @attribute {boolean} focusable - (optional) If `true` the icon can receive focus\n \n @csspart base - The main icon container.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'SystemCloseCircleFill',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/icons/system/system-close-circle-line/system-close-circle-line.component.js'\n\nconst tagName = 'dap-ds-icon-close-circle-line'\n\n/*\n `dap-ds-icon-close-circle-line`\n * @summary An icon\n * @element dap-ds-icon-close-circle-line\n * @title - SystemCloseCircleLine\n * @group icon\n * @icontype system\n \n @attribute {number} size - (optional) The width and height in pixels\n * @attribute {boolean} selected - (optional) Sets the icon color via the `fill` attribute\n * @attribute {string} accessibilityTitle - (optional) When using the icon standalone, make it meaningful for accessibility\n * @attribute {boolean} focusable - (optional) If `true` the icon can receive focus\n \n @csspart base - The main icon container.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'SystemCloseCircleLine',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/icons/system/system-close-fill/system-close-fill.component.js'\n\nconst tagName = 'dap-ds-icon-close-fill'\n\n/*\n `dap-ds-icon-close-fill`\n * @summary An icon\n * @element dap-ds-icon-close-fill\n * @title - SystemCloseFill\n * @group icon\n * @icontype system\n \n @attribute {number} size - (optional) The width and height in pixels\n * @attribute {boolean} selected - (optional) Sets the icon color via the `fill` attribute\n * @attribute {string} accessibilityTitle - (optional) When using the icon standalone, make it meaningful for accessibility\n * @attribute {boolean} focusable - (optional) If `true` the icon can receive focus\n \n @csspart base - The main icon container.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'SystemCloseFill',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/icons/system/system-close-line/system-close-line.component.js'\n\nconst tagName = 'dap-ds-icon-close-line'\n\n/*\n `dap-ds-icon-close-line`\n * @summary An icon\n * @element dap-ds-icon-close-line\n * @title - SystemCloseLine\n * @group icon\n * @icontype system\n \n @attribute {number} size - (optional) The width and height in pixels\n * @attribute {boolean} selected - (optional) Sets the icon color via the `fill` attribute\n * @attribute {string} accessibilityTitle - (optional) When using the icon standalone, make it meaningful for accessibility\n * @attribute {boolean} focusable - (optional) If `true` the icon can receive focus\n \n @csspart base - The main icon container.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'SystemCloseLine',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/icons/system/system-download-line/system-download-line.component.js'\n\nconst tagName = 'dap-ds-icon-download-line'\n\n/*\n `dap-ds-icon-download-line`\n * @summary An icon\n * @element dap-ds-icon-download-line\n * @title - SystemDownloadLine\n * @group icon\n * @icontype system\n \n @attribute {number} size - (optional) The width and height in pixels\n * @attribute {boolean} selected - (optional) Sets the icon color via the `fill` attribute\n * @attribute {string} accessibilityTitle - (optional) When using the icon standalone, make it meaningful for accessibility\n * @attribute {boolean} focusable - (optional) If `true` the icon can receive focus\n \n @csspart base - The main icon container.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'SystemDownloadLine',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/icons/system/system-error-warning-fill/system-error-warning-fill.component.js'\n\nconst tagName = 'dap-ds-icon-error-warning-fill'\n\n/*\n `dap-ds-icon-error-warning-fill`\n * @summary An icon\n * @element dap-ds-icon-error-warning-fill\n * @title - SystemErrorWarningFill\n * @group icon\n * @icontype system\n \n @attribute {number} size - (optional) The width and height in pixels\n * @attribute {boolean} selected - (optional) Sets the icon color via the `fill` attribute\n * @attribute {string} accessibilityTitle - (optional) When using the icon standalone, make it meaningful for accessibility\n * @attribute {boolean} focusable - (optional) If `true` the icon can receive focus\n \n @csspart base - The main icon container.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'SystemErrorWarningFill',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/icons/system/system-error-warning-line/system-error-warning-line.component.js'\n\nconst tagName = 'dap-ds-icon-error-warning-line'\n\n/*\n `dap-ds-icon-error-warning-line`\n * @summary An icon\n * @element dap-ds-icon-error-warning-line\n * @title - SystemErrorWarningLine\n * @group icon\n * @icontype system\n \n @attribute {number} size - (optional) The width and height in pixels\n * @attribute {boolean} selected - (optional) Sets the icon color via the `fill` attribute\n * @attribute {string} accessibilityTitle - (optional) When using the icon standalone, make it meaningful for accessibility\n * @attribute {boolean} focusable - (optional) If `true` the icon can receive focus\n \n @csspart base - The main icon container.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'SystemErrorWarningLine',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/icons/system/system-external-link-line/system-external-link-line.component.js'\n\nconst tagName = 'dap-ds-icon-external-link-line'\n\n/*\n `dap-ds-icon-external-link-line`\n * @summary An icon\n * @element dap-ds-icon-external-link-line\n * @title - SystemExternalLinkLine\n * @group icon\n * @icontype system\n \n @attribute {number} size - (optional) The width and height in pixels\n * @attribute {boolean} selected - (optional) Sets the icon color via the `fill` attribute\n * @attribute {string} accessibilityTitle - (optional) When using the icon standalone, make it meaningful for accessibility\n * @attribute {boolean} focusable - (optional) If `true` the icon can receive focus\n \n @csspart base - The main icon container.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'SystemExternalLinkLine',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/icons/system/system-eye-line/system-eye-line.component.js'\n\nconst tagName = 'dap-ds-icon-eye-line'\n\n/*\n `dap-ds-icon-eye-line`\n * @summary An icon\n * @element dap-ds-icon-eye-line\n * @title - SystemEyeLine\n * @group icon\n * @icontype system\n \n @attribute {number} size - (optional) The width and height in pixels\n * @attribute {boolean} selected - (optional) Sets the icon color via the `fill` attribute\n * @attribute {string} accessibilityTitle - (optional) When using the icon standalone, make it meaningful for accessibility\n * @attribute {boolean} focusable - (optional) If `true` the icon can receive focus\n \n @csspart base - The main icon container.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'SystemEyeLine',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/icons/system/system-eye-off-line/system-eye-off-line.component.js'\n\nconst tagName = 'dap-ds-icon-eye-off-line'\n\n/*\n `dap-ds-icon-eye-off-line`\n * @summary An icon\n * @element dap-ds-icon-eye-off-line\n * @title - SystemEyeOffLine\n * @group icon\n * @icontype system\n \n @attribute {number} size - (optional) The width and height in pixels\n * @attribute {boolean} selected - (optional) Sets the icon color via the `fill` attribute\n * @attribute {string} accessibilityTitle - (optional) When using the icon standalone, make it meaningful for accessibility\n * @attribute {boolean} focusable - (optional) If `true` the icon can receive focus\n \n @csspart base - The main icon container.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'SystemEyeOffLine',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/icons/system/system-forbid-fill/system-forbid-fill.component.js'\n\nconst tagName = 'dap-ds-icon-forbid-fill'\n\n/*\n `dap-ds-icon-forbid-fill`\n * @summary An icon\n * @element dap-ds-icon-forbid-fill\n * @title - SystemForbidFill\n * @group icon\n * @icontype system\n \n @attribute {number} size - (optional) The width and height in pixels\n * @attribute {boolean} selected - (optional) Sets the icon color via the `fill` attribute\n * @attribute {string} accessibilityTitle - (optional) When using the icon standalone, make it meaningful for accessibility\n * @attribute {boolean} focusable - (optional) If `true` the icon can receive focus\n \n @csspart base - The main icon container.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'SystemForbidFill',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/icons/system/system-information-2-fill/system-information-2-fill.component.js'\n\nconst tagName = 'dap-ds-icon-information-2-fill'\n\n/*\n `dap-ds-icon-information-2-fill`\n * @summary An icon\n * @element dap-ds-icon-information-2-fill\n * @title - SystemInformation2Fill\n * @group icon\n * @icontype system\n \n @attribute {number} size - (optional) The width and height in pixels\n * @attribute {boolean} selected - (optional) Sets the icon color via the `fill` attribute\n * @attribute {string} accessibilityTitle - (optional) When using the icon standalone, make it meaningful for accessibility\n * @attribute {boolean} focusable - (optional) If `true` the icon can receive focus\n \n @csspart base - The main icon container.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'SystemInformation2Fill',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/icons/system/system-information-fill/system-information-fill.component.js'\n\nconst tagName = 'dap-ds-icon-information-fill'\n\n/*\n `dap-ds-icon-information-fill`\n * @summary An icon\n * @element dap-ds-icon-information-fill\n * @title - SystemInformationFill\n * @group icon\n * @icontype system\n \n @attribute {number} size - (optional) The width and height in pixels\n * @attribute {boolean} selected - (optional) Sets the icon color via the `fill` attribute\n * @attribute {string} accessibilityTitle - (optional) When using the icon standalone, make it meaningful for accessibility\n * @attribute {boolean} focusable - (optional) If `true` the icon can receive focus\n \n @csspart base - The main icon container.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'SystemInformationFill',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/icons/system/system-information-line/system-information-line.component.js'\n\nconst tagName = 'dap-ds-icon-information-line'\n\n/*\n `dap-ds-icon-information-line`\n * @summary An icon\n * @element dap-ds-icon-information-line\n * @title - SystemInformationLine\n * @group icon\n * @icontype system\n \n @attribute {number} size - (optional) The width and height in pixels\n * @attribute {boolean} selected - (optional) Sets the icon color via the `fill` attribute\n * @attribute {string} accessibilityTitle - (optional) When using the icon standalone, make it meaningful for accessibility\n * @attribute {boolean} focusable - (optional) If `true` the icon can receive focus\n \n @csspart base - The main icon container.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'SystemInformationLine',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/icons/system/system-lightbulb-fill/system-lightbulb-fill.component.js'\n\nconst tagName = 'dap-ds-icon-lightbulb-fill'\n\n/*\n `dap-ds-icon-lightbulb-fill`\n * @summary An icon\n * @element dap-ds-icon-lightbulb-fill\n * @title - SystemLightbulbFill\n * @group icon\n * @icontype system\n \n @attribute {number} size - (optional) The width and height in pixels\n * @attribute {boolean} selected - (optional) Sets the icon color via the `fill` attribute\n * @attribute {string} accessibilityTitle - (optional) When using the icon standalone, make it meaningful for accessibility\n * @attribute {boolean} focusable - (optional) If `true` the icon can receive focus\n \n @csspart base - The main icon container.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'SystemLightbulbFill',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/icons/system/system-loading-spinner/system-loading-spinner.component.js'\n\nconst tagName = 'dap-ds-icon-loading-spinner'\n\n/*\n `dap-ds-icon-loading-spinner`\n * @summary An icon\n * @element dap-ds-icon-loading-spinner\n * @title - SystemLoadingSpinner\n * @group icon\n * @icontype system\n \n @attribute {number} size - (optional) The width and height in pixels\n * @attribute {boolean} selected - (optional) Sets the icon color via the `fill` attribute\n * @attribute {string} accessibilityTitle - (optional) When using the icon standalone, make it meaningful for accessibility\n * @attribute {boolean} focusable - (optional) If `true` the icon can receive focus\n \n @csspart base - The main icon container.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'SystemLoadingSpinner',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/icons/system/system-lock-fill/system-lock-fill.component.js'\n\nconst tagName = 'dap-ds-icon-lock-fill'\n\n/*\n `dap-ds-icon-lock-fill`\n * @summary An icon\n * @element dap-ds-icon-lock-fill\n * @title - SystemLockFill\n * @group icon\n * @icontype system\n \n @attribute {number} size - (optional) The width and height in pixels\n * @attribute {boolean} selected - (optional) Sets the icon color via the `fill` attribute\n * @attribute {string} accessibilityTitle - (optional) When using the icon standalone, make it meaningful for accessibility\n * @attribute {boolean} focusable - (optional) If `true` the icon can receive focus\n \n @csspart base - The main icon container.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'SystemLockFill',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/icons/system/system-lock-line/system-lock-line.component.js'\n\nconst tagName = 'dap-ds-icon-lock-line'\n\n/*\n `dap-ds-icon-lock-line`\n * @summary An icon\n * @element dap-ds-icon-lock-line\n * @title - SystemLockLine\n * @group icon\n * @icontype system\n \n @attribute {number} size - (optional) The width and height in pixels\n * @attribute {boolean} selected - (optional) Sets the icon color via the `fill` attribute\n * @attribute {string} accessibilityTitle - (optional) When using the icon standalone, make it meaningful for accessibility\n * @attribute {boolean} focusable - (optional) If `true` the icon can receive focus\n \n @csspart base - The main icon container.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'SystemLockLine',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/icons/system/system-menu-line/system-menu-line.component.js'\n\nconst tagName = 'dap-ds-icon-menu-line'\n\n/*\n `dap-ds-icon-menu-line`\n * @summary An icon\n * @element dap-ds-icon-menu-line\n * @title - SystemMenuLine\n * @group icon\n * @icontype system\n \n @attribute {number} size - (optional) The width and height in pixels\n * @attribute {boolean} selected - (optional) Sets the icon color via the `fill` attribute\n * @attribute {string} accessibilityTitle - (optional) When using the icon standalone, make it meaningful for accessibility\n * @attribute {boolean} focusable - (optional) If `true` the icon can receive focus\n \n @csspart base - The main icon container.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'SystemMenuLine',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/icons/system/system-menu-line-s/system-menu-line-s.component.js'\n\nconst tagName = 'dap-ds-icon-menu-line-s'\n\n/*\n `dap-ds-icon-menu-line-s`\n * @summary An icon\n * @element dap-ds-icon-menu-line-s\n * @title - SystemMenuLineS\n * @group icon\n * @icontype system\n \n @attribute {number} size - (optional) The width and height in pixels\n * @attribute {boolean} selected - (optional) Sets the icon color via the `fill` attribute\n * @attribute {string} accessibilityTitle - (optional) When using the icon standalone, make it meaningful for accessibility\n * @attribute {boolean} focusable - (optional) If `true` the icon can receive focus\n \n @csspart base - The main icon container.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'SystemMenuLineS',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/icons/system/system-search-line/system-search-line.component.js'\n\nconst tagName = 'dap-ds-icon-search-line'\n\n/*\n `dap-ds-icon-search-line`\n * @summary An icon\n * @element dap-ds-icon-search-line\n * @title - SystemSearchLine\n * @group icon\n * @icontype system\n \n @attribute {number} size - (optional) The width and height in pixels\n * @attribute {boolean} selected - (optional) Sets the icon color via the `fill` attribute\n * @attribute {string} accessibilityTitle - (optional) When using the icon standalone, make it meaningful for accessibility\n * @attribute {boolean} focusable - (optional) If `true` the icon can receive focus\n \n @csspart base - The main icon container.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'SystemSearchLine',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/icons/system/system-shield-check-fill/system-shield-check-fill.component.js'\n\nconst tagName = 'dap-ds-icon-shield-check-fill'\n\n/*\n `dap-ds-icon-shield-check-fill`\n * @summary An icon\n * @element dap-ds-icon-shield-check-fill\n * @title - SystemShieldCheckFill\n * @group icon\n * @icontype system\n \n @attribute {number} size - (optional) The width and height in pixels\n * @attribute {boolean} selected - (optional) Sets the icon color via the `fill` attribute\n * @attribute {string} accessibilityTitle - (optional) When using the icon standalone, make it meaningful for accessibility\n * @attribute {boolean} focusable - (optional) If `true` the icon can receive focus\n \n @csspart base - The main icon container.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'SystemShieldCheckFill',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/icons/system/system-shield-check-line/system-shield-check-line.component.js'\n\nconst tagName = 'dap-ds-icon-shield-check-line'\n\n/*\n `dap-ds-icon-shield-check-line`\n * @summary An icon\n * @element dap-ds-icon-shield-check-line\n * @title - SystemShieldCheckLine\n * @group icon\n * @icontype system\n \n @attribute {number} size - (optional) The width and height in pixels\n * @attribute {boolean} selected - (optional) Sets the icon color via the `fill` attribute\n * @attribute {string} accessibilityTitle - (optional) When using the icon standalone, make it meaningful for accessibility\n * @attribute {boolean} focusable - (optional) If `true` the icon can receive focus\n \n @csspart base - The main icon container.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'SystemShieldCheckLine',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/icons/system/system-star-fill/system-star-fill.component.js'\n\nconst tagName = 'dap-ds-icon-star-fill'\n\n/*\n `dap-ds-icon-star-fill`\n * @summary An icon\n * @element dap-ds-icon-star-fill\n * @title - SystemStarFill\n * @group icon\n * @icontype system\n \n @attribute {number} size - (optional) The width and height in pixels\n * @attribute {boolean} selected - (optional) Sets the icon color via the `fill` attribute\n * @attribute {string} accessibilityTitle - (optional) When using the icon standalone, make it meaningful for accessibility\n * @attribute {boolean} focusable - (optional) If `true` the icon can receive focus\n \n @csspart base - The main icon container.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'SystemStarFill',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/icons/system/system-subtract-line/system-subtract-line.component.js'\n\nconst tagName = 'dap-ds-icon-subtract-line'\n\n/*\n `dap-ds-icon-subtract-line`\n * @summary An icon\n * @element dap-ds-icon-subtract-line\n * @title - SystemSubtractLine\n * @group icon\n * @icontype system\n \n @attribute {number} size - (optional) The width and height in pixels\n * @attribute {boolean} selected - (optional) Sets the icon color via the `fill` attribute\n * @attribute {string} accessibilityTitle - (optional) When using the icon standalone, make it meaningful for accessibility\n * @attribute {boolean} focusable - (optional) If `true` the icon can receive focus\n \n @csspart base - The main icon container.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'SystemSubtractLine',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/icons/system/system-subtract-line2/system-subtract-line2.component.js'\n\nconst tagName = 'dap-ds-icon-subtract-line2'\n\n/*\n `dap-ds-icon-subtract-line2`\n * @summary An icon\n * @element dap-ds-icon-subtract-line2\n * @title - SystemSubtractLine2\n * @group icon\n * @icontype system\n \n @attribute {number} size - (optional) The width and height in pixels\n * @attribute {boolean} selected - (optional) Sets the icon color via the `fill` attribute\n * @attribute {string} accessibilityTitle - (optional) When using the icon standalone, make it meaningful for accessibility\n * @attribute {boolean} focusable - (optional) If `true` the icon can receive focus\n \n @csspart base - The main icon container.\n */\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'SystemSubtractLine2',\n})\n\nexport default reactWrapper\n"],"names":["tagName","reactWrapper","createComponent","Component","React"],"mappings":"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"}
1	+ {"version":3,"file":"react.js","sources":["../src/react/dap-ds-accordion/index.ts","../src/react/dap-ds-accordion-group/index.ts","../src/react/dap-ds-avatar/index.ts","../src/react/dap-ds-anchor-heading/index.ts","../src/react/dap-ds-banner/index.ts","../src/react/dap-ds-breadcrumb/index.ts","../src/react/dap-ds-breadcrumb-item/index.ts","../src/react/dap-ds-badge/index.ts","../src/react/dap-ds-button/index.ts","../src/react/dap-ds-calendar-cell/index.ts","../src/react/dap-ds-calendar/index.ts","../src/react/dap-ds-callout/index.ts","../src/react/dap-ds-card-actions/index.ts","../src/react/dap-ds-card-content/index.ts","../src/react/dap-ds-card-image/index.ts","../src/react/dap-ds-card-subtitle/index.ts","../src/react/dap-ds-card-title/index.ts","../src/react/dap-ds-card/index.ts","../src/react/dap-ds-checkbox/index.ts","../src/react/dap-ds-command-group/index.ts","../src/react/dap-ds-command-item/index.ts","../src/react/dap-ds-command/index.ts","../src/react/dap-ds-combobox/index.ts","../src/react/dap-ds-content-switcher-item/index.ts","../src/react/dap-ds-content-switcher/index.ts","../src/react/dap-ds-copybox-input/index.ts","../src/react/dap-ds-dap-badge/index.ts","../src/react/dap-ds-datatable/index.ts","../src/react/dap-ds-datepicker/index.ts","../src/react/dap-ds-divider/index.ts","../src/react/dap-ds-feedback/index.ts","../src/react/dap-ds-file-input-list-item/index.ts","../src/react/dap-ds-file-input-list/index.ts","../src/react/dap-ds-file-input/index.ts","../src/react/dap-ds-icon/index.ts","../src/react/dap-ds-icon-button/index.ts","../src/react/dap-ds-input/index.ts","../src/react/dap-ds-label/index.ts","../src/react/dap-ds-link/index.ts","../src/react/dap-ds-list-item/index.ts","../src/react/dap-ds-modal/index.ts","../src/react/dap-ds-notification-badge/index.ts","../src/react/dap-ds-number-input/index.ts","../src/react/dap-ds-official-website-banner/index.ts","../src/react/dap-ds-option-item/index.ts","../src/react/dap-ds-option-list/index.ts","../src/react/dap-ds-overlay/index.ts","../src/react/dap-ds-pager/index.ts","../src/react/dap-ds-password-input/index.ts","../src/react/dap-ds-popup/index.ts","../src/react/dap-ds-radio-button/index.ts","../src/react/dap-ds-rating/index.ts","../src/react/dap-ds-scroll-area/index.ts","../src/react/dap-ds-search/index.ts","../src/react/dap-ds-select/index.ts","../src/react/dap-ds-sidenav-group/index.ts","../src/react/dap-ds-sidenav-item/index.ts","../src/react/dap-ds-sidenav/index.ts","../src/react/dap-ds-skip-link/index.ts","../src/react/dap-ds-snackbar-message/index.ts","../src/react/dap-ds-snackbar/index.ts","../src/react/dap-ds-spinner/index.ts","../src/react/dap-ds-stack/index.ts","../src/react/dap-ds-switch/index.ts","../src/react/dap-ds-tab-group/index.ts","../src/react/dap-ds-tab/index.ts","../src/react/dap-ds-table-cell/index.ts","../src/react/dap-ds-table-header/index.ts","../src/react/dap-ds-table-row/index.ts","../src/react/dap-ds-table/index.ts","../src/react/dap-ds-textarea/index.ts","../src/react/dap-ds-timeline-item/index.ts","../src/react/dap-ds-timeline/index.ts","../src/react/dap-ds-toc/index.ts","../src/react/dap-ds-toggle-button/index.ts","../src/react/dap-ds-tooltip/index.ts","../src/react/dap-ds-tray/index.ts","../src/react/dap-ds-typography/index.ts","../src/react/dap-ds-form-label/index.ts","../src/react/dap-ds-input-group/index.ts","../src/react/dap-ds-radio-group/index.ts","../src/react/dap-ds-icon-home-6-line/index.ts","../src/react/dap-ds-icon-arrow-down-line/index.ts","../src/react/dap-ds-icon-arrow-down-s-fill/index.ts","../src/react/dap-ds-icon-arrow-down-s-line/index.ts","../src/react/dap-ds-icon-arrow-left-down-line/index.ts","../src/react/dap-ds-icon-arrow-left-s-fill/index.ts","../src/react/dap-ds-icon-arrow-left-l-line/index.ts","../src/react/dap-ds-icon-arrow-left-line/index.ts","../src/react/dap-ds-icon-arrow-left-s-line/index.ts","../src/react/dap-ds-icon-arrow-left-up-line/index.ts","../src/react/dap-ds-icon-arrow-right-down-line/index.ts","../src/react/dap-ds-icon-arrow-right-l-line/index.ts","../src/react/dap-ds-icon-arrow-right-line/index.ts","../src/react/dap-ds-icon-arrow-right-s-fill/index.ts","../src/react/dap-ds-icon-arrow-right-s-line/index.ts","../src/react/dap-ds-icon-arrow-right-up-line/index.ts","../src/react/dap-ds-icon-arrow-up-s-fill/index.ts","../src/react/dap-ds-icon-arrow-up-line/index.ts","../src/react/dap-ds-icon-arrow-up-s-line/index.ts","../src/react/dap-ds-icon-expand-up-down-fill/index.ts","../src/react/dap-ds-icon-calendar-line/index.ts","../src/react/dap-ds-icon-clipboard-line/index.ts","../src/react/dap-ds-icon-file-copy-line/index.ts","../src/react/dap-ds-icon-cookie-line/index.ts","../src/react/dap-ds-icon-add-line/index.ts","../src/react/dap-ds-icon-alert-fill/index.ts","../src/react/dap-ds-icon-check-line/index.ts","../src/react/dap-ds-icon-alert-line/index.ts","../src/react/dap-ds-icon-check-line2/index.ts","../src/react/dap-ds-icon-checkbox-blank-circle-fill-check/index.ts","../src/react/dap-ds-icon-checkbox-blank-circle-fill/index.ts","../src/react/dap-ds-icon-checkbox-blank-circle-line/index.ts","../src/react/dap-ds-icon-checkbox-circle-fill/index.ts","../src/react/dap-ds-icon-checkbox-circle-line/index.ts","../src/react/dap-ds-icon-close-circle-fill/index.ts","../src/react/dap-ds-icon-close-fill/index.ts","../src/react/dap-ds-icon-close-circle-line/index.ts","../src/react/dap-ds-icon-close-line/index.ts","../src/react/dap-ds-icon-error-warning-fill/index.ts","../src/react/dap-ds-icon-download-line/index.ts","../src/react/dap-ds-icon-error-warning-line/index.ts","../src/react/dap-ds-icon-external-link-line/index.ts","../src/react/dap-ds-icon-eye-line/index.ts","../src/react/dap-ds-icon-eye-off-line/index.ts","../src/react/dap-ds-icon-information-2-fill/index.ts","../src/react/dap-ds-icon-forbid-fill/index.ts","../src/react/dap-ds-icon-information-fill/index.ts","../src/react/dap-ds-icon-lightbulb-fill/index.ts","../src/react/dap-ds-icon-information-line/index.ts","../src/react/dap-ds-icon-lock-fill/index.ts","../src/react/dap-ds-icon-loading-spinner/index.ts","../src/react/dap-ds-icon-lock-line/index.ts","../src/react/dap-ds-icon-menu-line-s/index.ts","../src/react/dap-ds-icon-menu-line/index.ts","../src/react/dap-ds-icon-shield-check-fill/index.ts","../src/react/dap-ds-icon-search-line/index.ts","../src/react/dap-ds-icon-shield-check-line/index.ts","../src/react/dap-ds-icon-subtract-line/index.ts","../src/react/dap-ds-icon-star-fill/index.ts","../src/react/dap-ds-icon-subtract-line2/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/accordion/accordion.component.js'\n import type { DdsOpenedEvent } from '../../events/events'\nimport type { DdsClosedEvent } from '../../events/events'\n export type { DdsOpenedEvent } from '../../events/events'\nexport type { DdsClosedEvent } from '../../events/events'\n\n const tagName = 'dap-ds-accordion'\n\n /*\n `dap-ds-accordion` is a custom accordion component.\n * @element dap-ds-accordion\n * @summary An accordion is a vertically stacked list of interactive items that can be expanded or collapsed to reveal or hide content.\n * @title - Accordion\n \n @property { 'sm' \| 'lg' } size - The size of the accordion. Default is `sm`.\n * @property { 1 \| 2 \| 3 \| 4 \| 5 \| 6 } headingLevel - The heading level of the accordion. Default is `4`.\n * @property {boolean} opened - Whether the accordion is opened. Default is `false`.\n * @property { 'left' \| 'right' } iconLocation - The location of the icon. Default is `right`.\n * @property { 'default' \| 'collapsed' \| 'clean' \| 'clean-collapsed' } variant - The variant of the accordion.\n * @property {boolean} lastItem - Whether the accordion is the last item.\n \n @event {{ open: boolean, item: AccordionBaseElement }} dds-opened - Event fired when the accordion is opened.\n * @event {{ open: boolean, item: AccordionBaseElement }} dds-closed - Event fired when the accordion is closed.\n \n @slot default - The content of the accordion.\n * @slot heading - The heading of the accordion.\n * @slot icon-opened - The icon when the accordion is opened.\n * @slot icon-closed - The icon when the accordion is closed.\n \n @csspart base - The main accordion container.\n * @csspart heading - The heading of the accordion.\n * @csspart button - The button of the accordion.\n * @csspart content - The content of the accordion.\n * @csspart content-container - The container of the accordion content.\n * @csspart icon-wrapper - The icon wrapper of the accordion.\n * @csspart open-icon - The icon when the accordion is opened.\n * @csspart open-icon-base - The base of the icon when the accordion is opened.\n * @csspart close-icon - The icon when the accordion is closed.\n * @csspart close-icon-base - The base of the icon when the accordion is closed.\n \n @cssproperty --dds-accordion-border-width - The width of the accordion border (default: var(--dds-border-width-base))\n * @cssproperty --dds-accordion-border-style - The style of the accordion border (default: solid)\n * @cssproperty --dds-accordion-border-radius - The border radius of the accordion (default: var(--dds-radius-base))\n * @cssproperty --dds-accordion-border-color - The color of the accordion border (default: var(--dds-border-neutral-divider))\n * @cssproperty --dds-accordion-background-color - The background color of the accordion (default: var(--dds-background-neutral-subtle))\n * @cssproperty --dds-accordion-text-color - The text color of the accordion (default: var(--dds-text-neutral-strong))\n * @cssproperty --dds-accordion-hover-background - The background color when hovering over the accordion (default: var(--dds-background-neutral-base))\n * @cssproperty --dds-accordion-active-background - The background color when the accordion is active (default: var(--dds-background-neutral-medium))\n * @cssproperty --dds-accordion-icon-background - The background color of the accordion icon (default: var(--dds-transparent-black-subtle))\n * @cssproperty --dds-accordion-icon-color - The color of the accordion icon (default: var(--dds-icon-neutral-base))\n * @cssproperty --dds-accordion-icon-hover-background - The background color of the accordion icon when hovered (default: var(--dds-transparent-black-base))\n * @cssproperty --dds-accordion-icon-active-background - The background color of the accordion icon when active (default: var(--dds-transparent-black-strong))\n * @cssproperty --dds-accordion-icon-hover-color - The color of the accordion icon when hovered (default: var(--dds-icon-neutral-strong))\n * @cssproperty --dds-accordion-icon-active-color - The color of the accordion icon when active (default: var(--dds-icon-neutral-strong))\n * @cssproperty --dds-accordion-content-color - The color of the accordion content (default: var(--dds-text-text-neutral))\n * @cssproperty --dds-accordion-transition-duration - The duration of the accordion transitions (default: var(--dds-transition-fast))\n * @cssproperty --dds-accordion-transition-timing - The timing function of the accordion transitions (default: var(--dds-easing-ease-in-out))\n * @cssproperty --dds-accordion-divider-color - The color of the divider between accordion items (default: var(--dds-border-neutral-divider))\n /\n const reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {\n onDdsOpened: 'dds-opened' as EventName<DdsOpenedEvent>,\nonDdsClosed: 'dds-closed' as EventName<DdsClosedEvent>\n },\n displayName: \"DapDSAccordion\"\n })\n\n export default reactWrapper\n ","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/accordion-group/accordion-group.component.js'\n\nconst tagName = 'dap-ds-accordion-group'\n\n/*\n `dap-ds-accordion-group` is a custom accordion group component.\n * @element dap-ds-accordion-group\n * @summary An accordion group is a collection of accordion components.\n * @title - Accordion group\n * @group accordion\n \n @slot - The content of the accordion group.\n \n @csspart base - The main accordion group container.\n \n @cssproperty --dds-accordion-group-spacing - Controls the gap between accordion items (default: var(--dds-spacing-300))\n * @cssproperty --dds-accordion-group-border-color - Controls the border color (default: var(--dds-border-neutral-subtle))\n * @cssproperty --dds-accordion-group-border-width - Controls the border width (default: var(--dds-border-width-base))\n * @cssproperty --dds-accordion-group-border-radius - Controls the border radius (default: var(--dds-radius-base))\n * @cssproperty --dds-accordion-group-background - Controls the background color (default: transparent)\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'DapDSAccordionGroup',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/avatar/avatar.component.js'\n\nconst tagName = 'dap-ds-avatar'\n\n/*\n `dap-ds-avatar`\n * @summary Avatar component can be used to display user profile images or icons, or illustrations.\n * @element dap-ds-avatar\n * @title - Avatar\n \n @attribute {'lg' \| 'md' \| 'sm' \| 'xs' \| 'xxs'} size - The size of the avatar. Default is 'md'.\n * @attribute {string} src - The source of the avatar image.\n * @attribute {string} alt - The alt text of the avatar.\n * @attribute {number} width - The width of the avatar. This will override the size.\n * @attribute {number} height - The height of the avatar. This will override the size.\n \n @csspart base - The main avatar image container.\n * @csspart img - The avatar image.\n \n @cssproperty --dds-avatar-border-radius - The border radius of the avatar. Default is the design system's rounded radius.\n * @cssproperty --dds-avatar-background-color - The background color of the avatar. Default is transparent.\n * @cssproperty --dds-avatar-border-width - The width of the avatar's border. Default is 0.\n * @cssproperty --dds-avatar-border-color - The color of the avatar's border. Default is transparent.\n * @cssproperty --dds-avatar-border-style - The style of the avatar's border. Default is solid.\n * @cssproperty --dds-avatar-transition - The transition property for the avatar. Default is 'all 0.2s ease-in-out'.\n \n @cssproperty --dds-avatar-size-lg - The size of the large avatar. Default is the design system's spacing-2000.\n * @cssproperty --dds-avatar-size-md - The size of the medium avatar. Default is the design system's spacing-1600.\n * @cssproperty --dds-avatar-size-sm - The size of the small avatar. Default is the design system's spacing-1200.\n * @cssproperty --dds-avatar-size-xs - The size of the extra small avatar. Default is the design system's spacing-800.\n * @cssproperty --dds-avatar-size-xxs - The size of the extra extra small avatar. Default is the design system's spacing-600.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'DapDSAvatar',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/anchor-heading/anchor-heading.component.js'\n\nconst tagName = 'dap-ds-anchor-heading'\n\n/*\n `dap-ds-anchor-heading`\n * @summary Anchor heading is a heading with an anchor link.\n * @element dap-ds-anchor-heading\n * @title - Anchor heading\n \n @attribute {'h1' \| 'h2' \| 'h3' \| 'h4' \| 'h5' \| 'h6'} variant - The variant of the heading. Default is `h2`. Can be `h1`, `h2`, `h3`, `h4`, `h5`, or `h6`.\n * @attribute {string} label - The label of the heading.\n \n @csspart base - The main anchor heading container.\n * @csspart link - The link of the anchor heading. dap-ds-link element.\n * @csspart link-base - The base of the link part.\n * @csspart text - The text of the anchor heading.\n \n @cssproperty --dds-anchor-link-color - The color of the anchor link. Default is the primary color.\n * @cssproperty --dds-anchor-link-opacity - The opacity of the anchor link when not hovered. Default is 0.\n * @cssproperty --dds-anchor-link-hover-opacity - The opacity of the anchor link when hovered. Default is 1.\n * @cssproperty --dds-anchor-link-transition - The transition property for the anchor link opacity. Default is 'opacity 0.2s ease-in-out'.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'DapDSAnchorHeading',\n})\n\nexport default reactWrapper\n","\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/banner/banner.component.js'\n import type { DdsCloseEvent } from '../../events/events'\n export type { DdsCloseEvent } from '../../events/events'\n\n const tagName = 'dap-ds-banner'\n\n /*\n `dap-ds-banner` is a custom banner component.\n * @element dap-ds-banner\n * @summary A banner is a message displayed at the top of the page to provide important information to the user.\n * @title - Banner\n \n @event {{ void }} dds-close - Event fired when the banner is closed.\n \n @slot - The content of the banner.\n * @slot actions - Actions of banner\n * @slot icon - The icon of the banner.\n \n @csspart base - The main banner container.\n * @csspart card-base - The wrapper card container.\n * @csspart icon - The icon of the banner.\n * @csspart icon-element - The icon element of the banner.\n * @csspart icon-base - The base of the icon.\n * @csspart closebutton - The close button of the banner.\n * @csspart close-icon-element - The icon element of the close button.\n * @csspart close-icon-base - The base of the close button icon.\n * @csspart actions - The actions of the banner.\n * @csspart title - The title of the banner.\n \n @cssproperty --dds-banner-gap - The gap between banner elements. Default is the design system's spacing-200.\n * @cssproperty --dds-banner-line-height - The line height of the banner text. Default is the design system's font-line-height-xlarge.\n * @cssproperty --dds-banner-transition - The transition property for the banner. Default is 'all 0.2s ease-in-out'.\n \n @cssproperty --dds-banner-brand-background - The background color of the brand banner. Default is the design system's banner-background-brand.\n * @cssproperty --dds-banner-brand-icon-color - The color of the brand banner icon. Default is the design system's banner-icon-brand.\n * @cssproperty --dds-banner-brand-text-color - The text color of the brand banner. Default is the design system's banner-text-brand.\n * @cssproperty --dds-banner-brand-action-color - The color of the brand banner actions. Default is the design system's banner-action-enabled.\n \n @cssproperty --dds-banner-info-background - The background color of the info banner. Default is the design system's banner-background-informative.\n * @cssproperty --dds-banner-info-icon-color - The color of the info banner icon. Default is the design system's banner-icon-informative.\n * @cssproperty --dds-banner-info-text-color - The text color of the info banner. Default is the design system's banner-text-informative.\n * @cssproperty --dds-banner-info-action-color - The color of the info banner actions. Default is the design system's banner-action-enabled.\n \n @cssproperty --dds-banner-positive-background - The background color of the positive banner. Default is the design system's banner-background-positive.\n * @cssproperty --dds-banner-positive-icon-color - The color of the positive banner icon. Default is the design system's banner-icon-positive.\n * @cssproperty --dds-banner-positive-text-color - The text color of the positive banner. Default is the design system's banner-text-positive.\n * @cssproperty --dds-banner-positive-action-color - The color of the positive banner actions. Default is the design system's banner-action-enabled.\n \n @cssproperty --dds-banner-warning-background - The background color of the warning banner. Default is the design system's banner-background-warning.\n * @cssproperty --dds-banner-warning-icon-color - The color of the warning banner icon. Default is the design system's banner-icon-warning.\n * @cssproperty --dds-banner-warning-text-color - The text color of the warning banner. Default is the design system's banner-text-warning.\n * @cssproperty --dds-banner-warning-action-color - The color of the warning banner actions. Default is the design system's banner-action-inverted-enabled.\n \n @cssproperty --dds-banner-negative-background - The background color of the negative banner. Default is the design system's banner-background-negative.\n * @cssproperty --dds-banner-negative-icon-color - The color of the negative banner icon. Default is the design system's banner-icon-negative.\n * @cssproperty --dds-banner-negative-text-color - The text color of the negative banner. Default is the design system's banner-text-negative.\n * @cssproperty --dds-banner-negative-action-color - The color of the negative banner actions. Default is the design system's banner-action-inverted-enabled.\n /\n const reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {\n onDdsClose: 'dds-close' as EventName<DdsCloseEvent>\n },\n displayName: \"DapDSBanner\"\n })\n\n export default reactWrapper\n ","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/breadcrumb/breadcrumb.component.js'\n\nconst tagName = 'dap-ds-breadcrumb'\n\n/*\n `dap-ds-breadcrumb`\n * @summary A breadcrumb is a secondary navigation scheme that reveals the user's location in a website or Web application.\n * @element dap-ds-breadcrumb\n * @title - Breadcrumb\n \n @slot - The content of the breadcrumb.\n * @slot separator - The separator between breadcrumb items. Default is '/'.\n \n @csspart base - The main breadcrumb container.\n * @csspart separator - The separator of the breadcrumb.\n \n @cssproperty --dds-breadcrumb-width - The width of the breadcrumb container. Default is 100%.\n * @cssproperty --dds-breadcrumb-overflow-x - The horizontal overflow behavior of the breadcrumb. Default is auto.\n * @cssproperty --dds-breadcrumb-transition - The transition property for the breadcrumb. Default is 'all 0.2s ease-in-out'.\n \n @cssproperty --dds-breadcrumb-list-display - The display property of the breadcrumb list. Default is flex.\n * @cssproperty --dds-breadcrumb-list-flex-wrap - The flex-wrap property of the breadcrumb list. Default is nowrap.\n * @cssproperty --dds-breadcrumb-list-align-items - The align-items property of the breadcrumb list. Default is center.\n * @cssproperty --dds-breadcrumb-list-min-width - The minimum width of the breadcrumb list. Default is max-content.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'DapDSBreadcrumb',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/breadcrumb-item/breadcrumb-item.component.js'\n\nconst tagName = 'dap-ds-breadcrumb-item'\n\n/*\n `dap-ds-breadcrumb-item` custom element.\n * @element dap-ds-breadcrumb-item\n * @summary A breadcrumb item is a secondary navigation scheme that reveals the user's location in a website or Web application.\n * @title - Breadcrumb item\n * @group breadcrumb\n \n @slot - The content of the breadcrumb item.\n * @slot separator - The separator between breadcrumb items. Default is an arrow-right-s-line icon.\n \n @csspart base - The main breadcrumb item container. The li element.\n * @csspart link - The link of the breadcrumb item. The dds-link component.\n * @csspart link-base - The base part of the link part. The dds-link components base part.\n * @csspart item-nolink - The item of the breadcrumb item without a link. The span element.\n * @csspart separator - The separator of the breadcrumb item.\n \n @cssproperty --dds-breadcrumb-item-display - The display property of the breadcrumb item. Default is inline-flex.\n * @cssproperty --dds-breadcrumb-item-flex-wrap - The flex-wrap property of the breadcrumb item. Default is nowrap.\n * @cssproperty --dds-breadcrumb-item-align-items - The align-items property of the breadcrumb item. Default is center.\n * @cssproperty --dds-breadcrumb-item-color - The text color of the breadcrumb item. Default is the design system's text-neutral-base.\n * @cssproperty --dds-breadcrumb-item-transition - The transition property for the breadcrumb item. Default is 'all 0.2s ease-in-out'.\n \n @cssproperty --dds-breadcrumb-item-padding - The padding of the breadcrumb item. Default is the design system's spacing-200.\n * @cssproperty --dds-breadcrumb-item-font-size - The font size of the breadcrumb item. Default is the design system's font-sm.\n * @cssproperty --dds-breadcrumb-item-font-weight - The font weight of the breadcrumb item. Default is the design system's font-weight-medium.\n * @cssproperty --dds-breadcrumb-item-font-weight-bold - The bold font weight of the breadcrumb item. Default is the design system's font-weight-bold.\n \n @cssproperty --dds-breadcrumb-item-separator-color - The color of the separator. Default is the design system's text-neutral-disabled.\n * @cssproperty --dds-breadcrumb-item-link-color - The color of the link. Default is the design system's link-neutral-enabled.\n * @cssproperty --dds-breadcrumb-item-inverted-color - The text color when inverted. Default is the design system's text-neutral-inverted.\n * @cssproperty --dds-breadcrumb-item-inverted-link-color - The link color when inverted. Default is the design system's text-neutral-inverted.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'DapDSBreadcrumbItem',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/badge/badge.component.js'\n\nconst tagName = 'dap-ds-badge'\n\n/*\n `dap-ds-badge`\n * @summary A badge is a small status descriptor for UI elements.\n * @element dap-ds-badge\n * @title - Badge\n \n @slot - The content of the badge.\n * @slot icon - The icon of the badge.\n \n @csspart base - The main container of the badge.\n * @csspart icon - The icon of the badge.\n * @csspart content - The content of the badge.\n * @csspart icon-base - The base of the icon.\n \n @cssproperty --dds-badge-border-width - The width of the badge's border. Default is the design system's base border width.\n * @cssproperty --dds-badge-border-style - The style of the badge's border. Default is solid.\n * @cssproperty --dds-badge-border-radius - The border radius of the badge. Default is the design system's base radius.\n * @cssproperty --dds-badge-font-weight - The font weight of the badge text. Default is bold.\n * @cssproperty --dds-badge-line-height - The line height of the badge text. Default is 1.2.\n * @cssproperty --dds-badge-transition - The transition property for the badge. Default is 'all 0.2s ease-in-out'.\n \n @cssproperty --dds-badge-padding-sm - The padding of the small badge. Default is the design system's spacing-100 and spacing-200.\n * @cssproperty --dds-badge-padding-lg - The padding of the large badge. Default is the design system's spacing-100 and spacing-300.\n * @cssproperty --dds-badge-font-size-sm - The font size of the small badge. Default is the design system's font-xs.\n * @cssproperty --dds-badge-font-size-lg - The font size of the large badge. Default is the design system's font-sm.\n \n @cssproperty --dds-badge-neutral-border-color - The border color of the neutral badge. Default is the design system's border-neutral-base.\n * @cssproperty --dds-badge-neutral-background - The background color of the neutral badge. Default is the design system's background-neutral-medium.\n * @cssproperty --dds-badge-neutral-color - The text color of the neutral badge. Default is the design system's text-neutral-subtle.\n \n @cssproperty --dds-badge-brand-border-color - The border color of the brand badge. Default is the design system's border-brand-base.\n * @cssproperty --dds-badge-brand-background - The background color of the brand badge. Default is the design system's background-brand-medium.\n * @cssproperty --dds-badge-brand-color - The text color of the brand badge. Default is the design system's text-brand-subtle.\n \n @cssproperty --dds-badge-info-border-color - The border color of the info badge. Default is the design system's border-informative-base.\n * @cssproperty --dds-badge-info-background - The background color of the info badge. Default is the design system's background-informative-medium.\n * @cssproperty --dds-badge-info-color - The text color of the info badge. Default is the design system's text-informative-subtle.\n \n @cssproperty --dds-badge-positive-border-color - The border color of the positive badge. Default is the design system's border-positive-base.\n * @cssproperty --dds-badge-positive-background - The background color of the positive badge. Default is the design system's background-positive-medium.\n * @cssproperty --dds-badge-positive-color - The text color of the positive badge. Default is the design system's text-positive-subtle.\n \n @cssproperty --dds-badge-warning-border-color - The border color of the warning badge. Default is the design system's border-warning-subtle.\n * @cssproperty --dds-badge-warning-background - The background color of the warning badge. Default is the design system's background-warning-medium.\n * @cssproperty --dds-badge-warning-color - The text color of the warning badge. Default is the design system's text-warning-subtle.\n \n @cssproperty --dds-badge-negative-border-color - The border color of the negative badge. Default is the design system's border-negative-base.\n * @cssproperty --dds-badge-negative-background - The background color of the negative badge. Default is the design system's background-negative-medium.\n * @cssproperty --dds-badge-negative-color - The text color of the negative badge. Default is the design system's text-negative-subtle.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'DapDSBadge',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/button/button.component.js'\n\nconst tagName = 'dap-ds-button'\n\n/*\n `dap-ds-button` is a custom button component.\n * @element dap-ds-button\n * @summary A button is a clickable element that can be used to trigger an action.\n * @title - Button\n \n @slot - The content of the button.\n \n @csspart base - The main button container.\n * @csspart high-contrast - The high contrast part of the button.\n \n @cssproperty --dds-button-padding-x - Horizontal padding of the button (default: var(--dds-spacing-300))\n * @cssproperty --dds-button-padding-y - Vertical padding of the button (default: var(--dds-spacing-300))\n * @cssproperty --dds-button-border-radius - Border radius of the button (default: var(--dds-radius-rounded))\n * @cssproperty --dds-button-font-weight - Font weight of the button (default: 700)\n * @cssproperty --dds-button-line-height - Line height of the button (default: var(--dds-font-line-height-large))\n * @cssproperty --dds-button-transition - Transition property of the button (default: all 0.2s ease-in-out)\n * @cssproperty --dds-button-disabled-opacity - Opacity of disabled button (default: 0.5)\n \n @cssproperty --dds-button-size-lg - Size of large button (default: var(--dds-spacing-1200))\n * @cssproperty --dds-button-size-md - Size of medium button (default: var(--dds-spacing-1000))\n * @cssproperty --dds-button-size-sm - Size of small button (default: var(--dds-spacing-800))\n * @cssproperty --dds-button-size-xs - Size of extra small button (default: var(--dds-spacing-600))\n \n @cssproperty --dds-button-circle-lg - Size of large circle button (default: var(--dds-spacing-1200))\n * @cssproperty --dds-button-circle-md - Size of medium circle button (default: var(--dds-spacing-1000))\n * @cssproperty --dds-button-circle-sm - Size of small circle button (default: var(--dds-spacing-800))\n * @cssproperty --dds-button-circle-xs - Size of extra small circle button (default: var(--dds-spacing-600))\n \n Primary button properties:\n * @cssproperty --dds-button-primary-color-bg - Background color of primary button (default: var(--dds-button-primary-background-enabled))\n * @cssproperty --dds-button-primary-color-bg-hover - Background color of primary button on hover (default: var(--dds-button-primary-background-hover))\n * @cssproperty --dds-button-primary-color-bg-active - Background color of primary button when active (default: var(--dds-button-primary-background-pressed))\n * @cssproperty --dds-button-primary-color-bg-disabled - Background color of disabled primary button (default: var(--dds-button-primary-background-disabled))\n * @cssproperty --dds-button-primary-color-text - Text color of primary button (default: var(--dds-button-primary-text-enabled))\n * @cssproperty --dds-button-primary-color-text-disabled - Text color of disabled primary button (default: var(--dds-button-primary-text-disabled))\n \n Primary inverted button properties:\n * @cssproperty --dds-button-primary-inverted-color-bg - Background color of primary inverted button (default: var(--dds-button-primary-background-inverted-enabled))\n * @cssproperty --dds-button-primary-inverted-color-bg-hover - Background color of primary inverted button on hover (default: var(--dds-button-primary-background-inverted-hover))\n * @cssproperty --dds-button-primary-inverted-color-bg-active - Background color of primary inverted button when active (default: var(--dds-button-primary-background-inverted-pressed))\n * @cssproperty --dds-button-primary-inverted-color-bg-disabled - Background color of disabled primary inverted button (default: var(--dds-button-primary-background-inverted-disabled))\n * @cssproperty --dds-button-primary-inverted-color-text - Text color of primary inverted button (default: var(--dds-button-primary-text-inverted))\n * @cssproperty --dds-button-primary-inverted-color-text-disabled - Text color of disabled primary inverted button (default: var(--dds-button-primary-text-inverted-disabled))\n \n Outline button properties:\n * @cssproperty --dds-button-outline-color-border - Border color of outline button (default: var(--dds-button-outline-border-enabled))\n * @cssproperty --dds-button-outline-color-border-hover - Border color of outline button on hover (default: var(--dds-button-outline-border-hover))\n * @cssproperty --dds-button-outline-color-border-active - Border color of outline button when active (default: var(--dds-button-outline-border-pressed))\n * @cssproperty --dds-button-outline-color-border-disabled - Border color of disabled outline button (default: var(--dds-button-outline-border-disabled))\n * @cssproperty --dds-button-outline-color-text - Text color of outline button (default: var(--dds-button-outline-text-enabled))\n * @cssproperty --dds-button-outline-color-text-hover - Text color of outline button on hover (default: var(--dds-button-outline-text-hover))\n * @cssproperty --dds-button-outline-color-text-active - Text color of outline button when active (default: var(--dds-button-outline-text-pressed))\n * @cssproperty --dds-button-outline-color-text-disabled - Text color of disabled outline button (default: var(--dds-button-outline-text-disabled))\n \n Outline inverted button properties:\n * @cssproperty --dds-button-outline-inverted-color-border - Border color of outline inverted button (default: var(--dds-button-outline-border-inverted-enabled))\n * @cssproperty --dds-button-outline-inverted-color-border-hover - Border color of outline inverted button on hover (default: var(--dds-button-outline-border-inverted-hover))\n * @cssproperty --dds-button-outline-inverted-color-border-active - Border color of outline inverted button when active (default: var(--dds-button-outline-border-inverted-pressed))\n * @cssproperty --dds-button-outline-inverted-color-border-disabled - Border color of disabled outline inverted button (default: var(--dds-button-outline-border-inverted-disabled))\n * @cssproperty --dds-button-outline-inverted-color-text - Text color of outline inverted button (default: var(--dds-button-outline-text-inverted-enabled))\n * @cssproperty --dds-button-outline-inverted-color-text-hover - Text color of outline inverted button on hover (default: var(--dds-button-outline-text-inverted-hover))\n * @cssproperty --dds-button-outline-inverted-color-text-active - Text color of outline inverted button when active (default: var(--dds-button-outline-text-inverted-pressed))\n * @cssproperty --dds-button-outline-inverted-color-text-disabled - Text color of disabled outline inverted button (default: var(--dds-button-outline-text-inverted-disabled))\n \n Subtle button properties:\n * @cssproperty --dds-button-subtle-color-bg - Background color of subtle button (default: var(--dds-button-subtle-background-enabled))\n * @cssproperty --dds-button-subtle-color-bg-hover - Background color of subtle button on hover (default: var(--dds-button-subtle-background-hover))\n * @cssproperty --dds-button-subtle-color-bg-active - Background color of subtle button when active (default: var(--dds-button-subtle-background-pressed))\n * @cssproperty --dds-button-subtle-color-bg-disabled - Background color of disabled subtle button (default: var(--dds-button-subtle-background-disabled))\n * @cssproperty --dds-button-subtle-color-border - Border color of subtle button (default: var(--dds-button-subtle-border-enabled))\n * @cssproperty --dds-button-subtle-color-border-hover - Border color of subtle button on hover (default: var(--dds-button-subtle-border-hover))\n * @cssproperty --dds-button-subtle-color-border-active - Border color of subtle button when active (default: var(--dds-button-subtle-border-pressed))\n * @cssproperty --dds-button-subtle-color-border-disabled - Border color of disabled subtle button (default: var(--dds-button-subtle-border-disabled))\n * @cssproperty --dds-button-subtle-color-text - Text color of subtle button (default: var(--dds-button-subtle-text-enabled))\n * @cssproperty --dds-button-subtle-color-text-hover - Text color of subtle button on hover (default: var(--dds-button-subtle-text-hover))\n * @cssproperty --dds-button-subtle-color-text-active - Text color of subtle button when active (default: var(--dds-button-subtle-text-pressed))\n * @cssproperty --dds-button-subtle-color-text-disabled - Text color of disabled subtle button (default: var(--dds-button-subtle-text-disabled))\n \n Clean button properties:\n * @cssproperty --dds-button-clean-color-text - Text color of clean button (default: var(--dds-text-link-base))\n * @cssproperty --dds-button-clean-color-text-hover - Text color of clean button on hover (default: var(--dds-text-link-hover))\n * @cssproperty --dds-button-clean-color-text-active - Text color of clean button when active (default: var(--dds-text-link-pressed))\n * @cssproperty --dds-button-clean-color-text-disabled - Text color of disabled clean button (default: var(--dds-text-neutral-disabled))\n \n Clean inverted button properties:\n * @cssproperty --dds-button-clean-inverted-color-text - Text color of clean inverted button (default: var(--dds-button-primary-text-inverted))\n * @cssproperty --dds-button-clean-inverted-color-text-hover - Text color of clean inverted button on hover (default: var(--dds-button-primary-text-inverted))\n * @cssproperty --dds-button-clean-inverted-color-text-active - Text color of clean inverted button when active (default: var(--dds-button-primary-text-inverted))\n * @cssproperty --dds-button-clean-inverted-color-text-disabled - Text color of disabled clean inverted button (default: var(--dds-text-neutral-disabled))\n \n Danger button properties:\n * @cssproperty --dds-button-danger-color-bg - Background color of danger button (default: var(--dds-button-primary-background-destructive-enabled))\n * @cssproperty --dds-button-danger-color-bg-hover - Background color of danger button on hover (default: var(--dds-button-primary-background-destructive-hover))\n * @cssproperty --dds-button-danger-color-bg-active - Background color of danger button when active (default: var(--dds-button-primary-background-destructive-pressed))\n * @cssproperty --dds-button-danger-color-text - Text color of danger button (default: var(--dds-button-primary-text-enabled))\n * @cssproperty --dds-button-danger-outline-color-border - Border color of danger outline button (default: var(--dds-button-outline-border-destructive-enabled))\n * @cssproperty --dds-button-danger-outline-color-border-hover - Border color of danger outline button on hover (default: var(--dds-button-outline-border-destructive-hover))\n * @cssproperty --dds-button-danger-outline-color-border-active - Border color of danger outline button when active (default: var(--dds-button-outline-border-destructive-pressed))\n * @cssproperty --dds-button-danger-outline-color-text - Text color of danger outline button (default: var(--dds-button-outline-text-destructive-enabled))\n * @cssproperty --dds-button-danger-outline-color-text-hover - Text color of danger outline button on hover (default: var(--dds-button-outline-text-destructive-hover))\n * @cssproperty --dds-button-danger-outline-color-text-active - Text color of danger outline button when active (default: var(--dds-button-outline-text-destructive-pressed))\n * @cssproperty --dds-button-danger-subtle-color-bg - Background color of danger subtle button (default: var(--dds-button-subtle-background-destructive-enabled))\n * @cssproperty --dds-button-danger-subtle-color-bg-hover - Background color of danger subtle button on hover (default: var(--dds-button-subtle-background-destructive-hover))\n * @cssproperty --dds-button-danger-subtle-color-bg-active - Background color of danger subtle button when active (default: var(--dds-button-subtle-background-destructive-pressed))\n * @cssproperty --dds-button-danger-subtle-color-text - Text color of danger subtle button (default: var(--dds-button-subtle-text-destructive-enabled))\n * @cssproperty --dds-button-danger-subtle-color-text-hover - Text color of danger subtle button on hover (default: var(--dds-button-subtle-text-destructive-hover))\n * @cssproperty --dds-button-danger-subtle-color-text-active - Text color of danger subtle button when active (default: var(--dds-button-subtle-text-destructive-pressed))\n * @cssproperty --dds-button-danger-clean-color-text - Text color of danger clean button (default: var(--dds-text-negative-subtle))\n * @cssproperty --dds-button-danger-clean-color-text-hover - Text color of danger clean button on hover (default: var(--dds-text-negative-base))\n * @cssproperty --dds-button-danger-clean-color-text-active - Text color of danger clean button when active (default: var(--dds-text-negative-strong))\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'DapDSButton',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/calendar/calendar-cell.component.js'\n\nconst tagName = 'dap-ds-calendar-cell'\n\n/*\n `dap-ds-calendar-cell`\n * @summary Calendar cell represents a single cell in the calendar.\n * @element dap-ds-calendar-cell\n * @title - Calendar cell\n * @group calendar\n \n @slot - The content of the calendar cell.\n \n @csspart base - The main calendar cell container.\n * @csspart today-mark - The today mark of the calendar cell.\n \n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'DapDSCalendarCell',\n})\n\nexport default reactWrapper\n","\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/calendar/calendar.component.js'\n import type { DdsChangeEvent } from '../../events/events'\n export type { DdsChangeEvent } from '../../events/events'\n\n const tagName = 'dap-ds-calendar'\n\n /*\n `dap-ds-calendar`\n * @summary A calendar is a visual representation of dates. It allows users to select a date.\n * @element dap-ds-calendar\n * @title - Calendar\n \n @event {{ value: Dayjs }} dds-change - Fired when the calendar value changes.\n \n @slot - The content of the calendar.\n \n @csspart base - The main calendar container.\n * @csspart header - The header of the calendar.\n * @csspart body - The body of the calendar.\n \n @cssproperty --dds-calendar-display - The display property of the calendar container. Default is flex.\n * @cssproperty --dds-calendar-isolation - The isolation property of the calendar. Default is isolate.\n * @cssproperty --dds-calendar-block-display - The display property of the calendar block. Default is block.\n * @cssproperty --dds-calendar-transition - The transition property for the calendar. Default is 'all 0.2s ease-in-out'.\n \n @cssproperty --dds-calendar-header-display - The display property of the calendar header. Default is grid.\n * @cssproperty --dds-calendar-header-grid-flow - The grid-auto-flow property of the calendar header. Default is column.\n * @cssproperty --dds-calendar-header-width - The width of the calendar header. Default is 100%.\n * @cssproperty --dds-calendar-header-gap - The gap between header items. Default is the design system's spacing-100.\n \n @cssproperty --dds-calendar-select-min-height - The minimum height of the select trigger. Default is auto.\n * @cssproperty --dds-calendar-select-max-height - The maximum height of the select trigger. Default is 32px.\n * @cssproperty --dds-calendar-select-padding - The padding of the select trigger. Default is the design system's spacing-200.\n * @cssproperty --dds-calendar-select-border-radius - The border radius of the select trigger. Default is the design system's radius-rounded.\n * @cssproperty --dds-calendar-select-border-color - The border color of the select trigger. Default is the design system's border-neutral-transparent-interactive.\n * @cssproperty --dds-calendar-select-background - The background color of the select trigger. Default is the design system's button-subtle-background-enabled.\n * @cssproperty --dds-calendar-select-color - The text color of the select trigger. Default is the design system's button-subtle-text-enabled.\n * @cssproperty --dds-calendar-select-font-size - The font size of the select trigger. Default is the design system's font-sm.\n * @cssproperty --dds-calendar-select-font-style - The font style of the select trigger. Default is normal.\n * @cssproperty --dds-calendar-select-font-weight - The font weight of the select trigger. Default is the design system's font-weight-bold.\n \n @cssproperty --dds-calendar-nav-button-margin - The margin of the navigation buttons. Default is the design system's spacing-200.\n * @cssproperty --dds-calendar-nav-button-color - The color of the navigation button icons. Default is the design system's button-subtle-icon-enabled.\n /\n const reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {\n onDdsChange: 'dds-change' as EventName<DdsChangeEvent>\n },\n displayName: \"DapDSCalendar\"\n })\n\n export default reactWrapper\n ","\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/callout/callout.component.js'\n import type { DdsCloseEvent } from '../../events/events'\n export type { DdsCloseEvent } from '../../events/events'\n\n const tagName = 'dap-ds-callout'\n\n /*\n `dap-ds-callout` is a custom callout component.\n * @element dap-ds-callout\n * @title - Callout\n \n @event {{ void }} dds-close - Fired when the close button is clicked.\n \n @slot - The content of the callout.\n * @slot title - The title of the callout.\n * @slot icon - The icon of the callout.\n * @slot actions - The actions of the callout.\n * @slot close - The close button of the callout.\n \n @csspart base - The main callout container.\n * @csspart icon - The icon of the callout.\n * @csspart title - The title of the callout.\n * @csspart description - The description of the callout.\n * @csspart actions - The actions of the callout.\n * @csspart close - The close button of the callout.\n \n @cssproperty --dds-callout-padding - Padding of the callout content. Default: var(--dds-spacing-300)\n * @cssproperty --dds-callout-gap - Gap between elements in horizontal layout. Default: var(--dds-spacing-300)\n * @cssproperty --dds-callout-icon-size - Size of the icon. Default: var(--dds-spacing-600)\n * @cssproperty --dds-callout-title-color - Color of the title text. Default: var(--dds-text-neutral-strong)\n * @cssproperty --dds-callout-description-color - Color of the description text. Default: var(--dds-text-neutral-base)\n * @cssproperty --dds-callout-title-font-size - Font size of the title. Default: var(--dds-font-base)\n * @cssproperty --dds-callout-description-font-size - Font size of the description. Default: var(--dds-font-base)\n * @cssproperty --dds-callout-title-font-weight - Font weight of the title. Default: var(--dds-font-weight-bold)\n * @cssproperty --dds-callout-description-font-weight - Font weight of the description. Default: var(--dds-font-weight-medium)\n * @cssproperty --dds-callout-actions-font-weight - Font weight of the actions. Default: var(--dds-font-weight-bold)\n * @cssproperty --dds-callout-actions-gap - Gap between action items. Default: var(--dds-spacing-400)\n * @cssproperty --dds-callout-content-gap - Gap between content elements. Default: var(--dds-spacing-100)\n /\n const reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {\n onDdsClose: 'dds-close' as EventName<DdsCloseEvent>\n },\n displayName: \"DapDSCallout\"\n })\n\n export default reactWrapper\n ","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/card/card-actions.component.js'\n\nconst tagName = 'dap-ds-card-actions'\n\n/*\n `dap-ds-card-actions`\n * @summary A card actions is a container for actions in a card.\n * @element dap-ds-card-actions\n * @title - Card actions\n * @group card\n \n @property {'sm' \| 'md' \| 'lg'} size - The size of the card actions. Default is `sm`.\n * @property {'top' \| 'bottom' \| 'both' \| 'none'} spacing - The spacing of the card actions. This adds a margin to the card actions. Default is `bottom`.\n \n @slot - The content of the card actions.\n \n @csspart base - The main card actions container.\n \n @cssproperty --dds-card-actions-gap - The gap between items in the card actions. Default is `var(--dds-spacing-200)`.\n * @cssproperty --dds-card-actions-padding-lg - The padding for large size card actions. Default is `var(--dds-spacing-600)`.\n * @cssproperty --dds-card-actions-padding-md - The padding for medium size card actions. Default is `var(--dds-spacing-400)`.\n * @cssproperty --dds-card-actions-padding-sm - The padding for small size card actions. Default is `var(--dds-spacing-400)`.\n * @cssproperty --dds-card-actions-margin-lg - The margin for large size card actions spacing. Default is `var(--dds-spacing-600)`.\n * @cssproperty --dds-card-actions-margin-md - The margin for medium size card actions spacing. Default is `var(--dds-spacing-400)`.\n * @cssproperty --dds-card-actions-margin-sm - The margin for small size card actions spacing. Default is `var(--dds-spacing-400)`.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'DapDSCardActions',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/card/card-content.component.js'\n\nconst tagName = 'dap-ds-card-content'\n\n/*\n `dap-ds-card-content`\n * @summary A card content is a container for content in a card.\n * @element dap-ds-card-content\n * @title - Card content\n * @group card\n \n @property {'sm' \| 'md' \| 'lg'} size - The size of the card subtitle. Default is `sm`.\n * @property {'top' \| 'bottom' \| 'both' \| 'none'} spacing - The spacing of the card content. This adds a margin to the card subtitle. Default is `bottom`.\n \n @slot - The content of the card-content.\n \n @csspart base - The main card content container.\n \n @cssproperty --dds-card-content-padding - The padding of the card content. Default is `0`.\n * @cssproperty --dds-card-content-margin - The margin of the card content. Default is `0`.\n * @cssproperty --dds-card-content-font-size - The font size of the card content. Default is `var(--dds-font-base)`.\n * @cssproperty --dds-card-content-line-height - The line height of the card content. Default is `var(--dds-font-line-height-xlarge)`.\n * @cssproperty --dds-card-content-spacing-lg - The large spacing value. Default is `var(--dds-spacing-600)`.\n * @cssproperty --dds-card-content-spacing-md - The medium spacing value. Default is `var(--dds-spacing-400)`.\n * @cssproperty --dds-card-content-spacing-sm - The small spacing value. Default is `var(--dds-spacing-400)`.\n * @cssproperty --dds-card-content-spacing-top - The top spacing value. Default is `0`.\n * @cssproperty --dds-card-content-spacing-bottom - The bottom spacing value. Default is `0`.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'DapDSCardContent',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/card/card-image.component.js'\n\nconst tagName = 'dap-ds-card-image'\n\n/*\n `dap-ds-card-image`\n * @summary A card image is a container for images in a card.\n * @element dap-ds-card-image\n * @title - Card image\n * @group card\n \n @slot - The default slot for the image. The slot can accept any element, for example a video. If nothing is added to the slot, the image will be rendered.\n \n @csspart base - The main card image container.\n \n @cssproperty --dds-card-image-width - The width of the image. Default is `100%`.\n * @cssproperty --dds-card-image-height - The height of the image. Default is `auto`.\n * @cssproperty --dds-card-image-object-fit - How the image fits within its container. Default is `cover`.\n * @cssproperty --dds-card-image-background-position - The background position of the image. Default is `center`.\n * @cssproperty --dds-card-image-background-size - How the background image is sized. Default is `cover`.\n * @cssproperty --dds-card-image-background-repeat - How the background image repeats. Default is `no-repeat`.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'DapDSCardImage',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/card/card-subtitle.component.js'\n\nconst tagName = 'dap-ds-card-subtitle'\n\n/*\n `dap-ds-card-subtitle`\n * @summary Subtitle of the card\n * @element dap-ds-card-subtitle\n * @title - Card subtitle\n * @group card\n \n @property {'sm' \| 'lg'} size - The size of the card subtitle. Default is `sm`.\n * @property {'top' \| 'bottom' \| 'both' \| 'none'} spacing - The spacing of the card subtitle. This adds a margin to the card subtitle. Default is `top`.\n \n @slot - The content of the subtitle.\n \n @csspart base - The subtitle container.\n \n @cssproperty --dds-card-subtitle-color - The color of the subtitle text. Default is `var(--dds-text-neutral-subtle)`.\n * @cssproperty --dds-card-subtitle-font-size - The font size of the subtitle. Default is `var(--dds-font-xs)`.\n * @cssproperty --dds-card-subtitle-font-weight - The font weight of the subtitle. Default is `var(--dds-font-weight-bold)`.\n * @cssproperty --dds-card-subtitle-line-height - The line height of the subtitle. Default is `var(--dds-font-line-height-large)`.\n \n @cssproperty --dds-card-subtitle-padding-sm - The padding for small size. Default is `0 var(--dds-spacing-400)`.\n * @cssproperty --dds-card-subtitle-padding-md - The padding for medium size. Default is `0 var(--dds-spacing-400)`.\n * @cssproperty --dds-card-subtitle-padding-lg - The padding for large size. Default is `0 var(--dds-spacing-600)`.\n \n @cssproperty --dds-card-subtitle-margin-sm - The base margin for small size. Default is `var(--dds-spacing-400)`.\n * @cssproperty --dds-card-subtitle-margin-md - The base margin for medium size. Default is `var(--dds-spacing-400)`.\n * @cssproperty --dds-card-subtitle-margin-lg - The base margin for large size. Default is `var(--dds-spacing-600)`.\n \n @cssproperty --dds-card-subtitle-spacing-top-sm - The top spacing for small size. Default is `var(--dds-spacing-400)`.\n * @cssproperty --dds-card-subtitle-spacing-top-md - The top spacing for medium size. Default is `var(--dds-spacing-400)`.\n * @cssproperty --dds-card-subtitle-spacing-top-lg - The top spacing for large size. Default is `var(--dds-spacing-600)`.\n \n @cssproperty --dds-card-subtitle-spacing-bottom-sm - The bottom spacing for small size. Default is `var(--dds-spacing-400)`.\n * @cssproperty --dds-card-subtitle-spacing-bottom-md - The bottom spacing for medium size. Default is `var(--dds-spacing-400)`.\n * @cssproperty --dds-card-subtitle-spacing-bottom-lg - The bottom spacing for large size. Default is `var(--dds-spacing-600)`.\n \n @cssproperty --dds-card-subtitle-spacing-both-sm - The both (top and bottom) spacing for small size. Default is `var(--dds-spacing-400)`.\n * @cssproperty --dds-card-subtitle-spacing-both-md - The both (top and bottom) spacing for medium size. Default is `var(--dds-spacing-400)`.\n * @cssproperty --dds-card-subtitle-spacing-both-lg - The both (top and bottom) spacing for large size. Default is `var(--dds-spacing-600)`.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'DapDSCardSubtitle',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/card/card-title.component.js'\n\nconst tagName = 'dap-ds-card-title'\n\n/*\n `dap-ds-card-title`\n * @summary Title of the card\n * @element dap-ds-card-title\n * @title - Card title\n * @group card\n \n @property {'sm' \|'md' \| 'lg'} size - The size of the card title. Default is `sm`.\n * @property {boolean} noPadding - Whether the card title should have no padding.\n * @property {'top' \| 'bottom' \| 'both' \| 'none'} spacing - The spacing of the card title. This adds a margin to the card title. Default is `top`.\n \n @slot - The content of the title.\n \n @csspart base - The main card title container.\n \n @cssproperty --dds-card-title-color - The text color of the card title. Default is `var(--dds-color-text-primary)`.\n * @cssproperty --dds-card-title-font-family - The font family of the card title. Default is `var(--dds-font-family-base)`.\n * @cssproperty --dds-card-title-font-weight - The font weight of the card title. Default is `var(--dds-font-weight-bold)`.\n * @cssproperty --dds-card-title-line-height - The line height of the card title. Default is `var(--dds-font-line-height-large)`.\n * @cssproperty --dds-card-title-margin-bottom - The bottom margin of the card title. Default is `var(--dds-spacing-100)`.\n \n @cssproperty --dds-card-title-sm-padding-x - The horizontal padding for small size. Default is `var(--dds-spacing-400)`.\n * @cssproperty --dds-card-title-sm-padding-bottom - The bottom padding for small size. Default is `var(--dds-spacing-100)`.\n * @cssproperty --dds-card-title-sm-spacing-top - The top spacing for small size. Default is `var(--dds-spacing-400)`.\n * @cssproperty --dds-card-title-sm-spacing-bottom - The bottom spacing for small size. Default is `var(--dds-spacing-400)`.\n \n @cssproperty --dds-card-title-md-padding-x - The horizontal padding for medium size. Default is `var(--dds-spacing-400)`.\n * @cssproperty --dds-card-title-md-padding-bottom - The bottom padding for medium size. Default is `var(--dds-spacing-100)`.\n * @cssproperty --dds-card-title-md-spacing-top - The top spacing for medium size. Default is `var(--dds-spacing-400)`.\n * @cssproperty --dds-card-title-md-spacing-bottom - The bottom spacing for medium size. Default is `var(--dds-spacing-400)`.\n \n @cssproperty --dds-card-title-lg-padding-x - The horizontal padding for large size. Default is `var(--dds-spacing-600)`.\n * @cssproperty --dds-card-title-lg-padding-bottom - The bottom padding for large size. Default is `var(--dds-spacing-100)`.\n * @cssproperty --dds-card-title-lg-spacing-top - The top spacing for large size. Default is `var(--dds-spacing-600)`.\n * @cssproperty --dds-card-title-lg-spacing-bottom - The bottom spacing for large size. Default is `var(--dds-spacing-600)`.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'DapDSCardTitle',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/card/card.component.js'\n\nconst tagName = 'dap-ds-card'\n\n/*\n `dap-ds-card`\n * @summary A card is a container for content, actions, and images in a consistent format.\n * @element dap-ds-card\n * @title - Card\n \n @property {'sm' \| 'md' \| 'lg'} size - The size of the card title. Default is `sm`.\n \n @slot - The content of the card.\n \n @csspart base - The main card container.\n \n @cssproperty --dds-card-padding - The padding of the card. Default is `var(--dds-spacing-400)`.\n * @cssproperty --dds-card-border-radius - The border radius of the card. Default is `var(--dds-radius-large)`.\n * @cssproperty --dds-card-border-width - The border width of the card. Default is `var(--dds-border-width-base)`.\n * @cssproperty --dds-card-border-color - The border color of the card. Default is `var(--dds-border-neutral-divider)`.\n * @cssproperty --dds-card-background - The background color of the card. Default is `var(--dds-background-neutral-base)`.\n * @cssproperty --dds-card-hover-border-color - The border color when hovering over the card. Default is `var(--dds-border-brand-base)`.\n * @cssproperty --dds-card-active-border-color - The border color when the card is active. Default is `var(--dds-border-brand-medium)`.\n * @cssproperty --dds-card-shadow - The box shadow of the card. Default is `none`.\n * @cssproperty --dds-card-hover-shadow - The box shadow when hovering over the card. Default is `none`.\n * @cssproperty --dds-card-transition-duration - The duration of the card's transitions. Default is `var(--dds-transition-medium)`.\n * @cssproperty --dds-card-transition-timing - The timing function of the card's transitions. Default is `var(--dds-easing-ease-in-out)`.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'DapDSCard',\n})\n\nexport default reactWrapper\n","\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/checkbox/checkbox.component.js'\n import type { DdsChangeEvent } from '../../events/events'\nimport type { DdsBlurEvent } from '../../events/events'\nimport type { DdsFocusEvent } from '../../events/events'\nimport type { DdsInputEvent } from '../../events/events'\n export type { DdsChangeEvent } from '../../events/events'\nexport type { DdsBlurEvent } from '../../events/events'\nexport type { DdsFocusEvent } from '../../events/events'\nexport type { DdsInputEvent } from '../../events/events'\n\n const tagName = 'dap-ds-checkbox'\n\n /*\n `dap-ds-checkbox`\n * @summary A checkbox is a form element that allows the user to select one or more options from a set.\n * @element dap-ds-checkbox\n * @title - Checkbox\n \n @event {{ checked: boolean, indeterminate: boolean, value: string, disabled: boolean, type: 'checkbox' }} dds-change - Fired when the checkbox is checked or unchecked.\n * @event {{ void }} dds-blur - Emitted when the checkbox loses focus.\n * @event {{ void }} dds-focus - Emitted when the checkbox gains focus.\n * @event {{ checked: boolean, indeterminate: boolean, value: string, disabled: boolean }} dds-input - Emitted when the checkbox receives input.\n \n @property {string} name - The name of the checkbox.\n * @property {string} value - The value of the checkbox.\n * @property {boolean} checked - Whether the checkbox is checked.\n * @property {string} label - The label of the checkbox.\n * @property {string} description - The description of the checkbox.\n * @property {boolean} disabled - Whether the checkbox is disabled.\n * @property {boolean} required - Whether the checkbox is required.\n * @property {'xs' \| sm' \| 'md' \| 'lg'} size - The size of the checkbox.\n * @property {'left' \| 'right'} labelPlacement - The placement of the label.\n * @property {'top' \| 'bottom'} descriptionPlacement - The placement of the description.\n * @property {boolean} subtle - The weight of the label.\n * @property {string} feedback - The feedback of the checkbox.\n * @property {'negative' \| 'positive' \| 'warning'} feedbackType - The feedback type of the checkbox.\n * @property {boolean} invalid - The invalid state of the checkbox.\n * @property {boolean} optional - The optional state of the checkbox.\n * @property {string} optionalLabel - The optional label of the checkbox.\n \n @csspart base - The main checkbox container.\n * @csspart label - The label of the checkbox.\n * @csspart input - The input of the checkbox.\n * @csspart control - The control of the checkbox.\n * @csspart icon - The icon of the checkbox.\n * @csspart label-container - The label container of the checkbox.\n * @csspart description - The description of the checkbox.\n \n @cssproperty --dds-checkbox-size - The size of the checkbox. Default is `var(--dds-spacing-500)`.\n * @cssproperty --dds-checkbox-border-width - The border width of the checkbox. Default is `var(--dds-border-width-large)`.\n * @cssproperty --dds-checkbox-border-radius - The border radius of the checkbox. Default is `var(--dds-radius-small)`.\n * @cssproperty --dds-checkbox-border-color - The border color of the checkbox. Default is `var(--dds-border-neutral-base)`.\n * @cssproperty --dds-checkbox-background-color - The background color of the checkbox. Default is `transparent`.\n * @cssproperty --dds-checkbox-icon-color - The color of the checkbox icon. Default is `var(--dds-button-primary-icon-enabled)`.\n * @cssproperty --dds-checkbox-hover-border-color - The border color when hovering over the checkbox. Default is `var(--dds-border-neutral-medium)`.\n * @cssproperty --dds-checkbox-hover-background-color - The background color when hovering over the checkbox. Default is `var(--dds-background-neutral-medium)`.\n * @cssproperty --dds-checkbox-active-border-color - The border color when the checkbox is active. Default is `var(--dds-border-neutral-strong)`.\n * @cssproperty --dds-checkbox-active-background-color - The background color when the checkbox is active. Default is `var(--dds-background-neutral-strong)`.\n * @cssproperty --dds-checkbox-checked-border-color - The border color when the checkbox is checked. Default is `var(--dds-background-brand-base-inverted)`.\n * @cssproperty --dds-checkbox-checked-background-color - The background color when the checkbox is checked. Default is `var(--dds-background-brand-base-inverted)`.\n * @cssproperty --dds-checkbox-checked-hover-border-color - The border color when hovering over a checked checkbox. Default is `var(--dds-background-brand-medium-inverted)`.\n * @cssproperty --dds-checkbox-checked-hover-background-color - The background color when hovering over a checked checkbox. Default is `var(--dds-background-brand-medium-inverted)`.\n * @cssproperty --dds-checkbox-checked-active-border-color - The border color when a checked checkbox is active. Default is `var(--dds-background-brand-strong-inverted)`.\n * @cssproperty --dds-checkbox-checked-active-background-color - The background color when a checked checkbox is active. Default is `var(--dds-background-brand-strong-inverted)`.\n * @cssproperty --dds-checkbox-invalid-border-color - The border color when the checkbox is invalid. Default is `var(--dds-border-negative-base)`.\n * @cssproperty --dds-checkbox-invalid-background-color - The background color when the checkbox is invalid. Default is `var(--dds-background-negative-base)`.\n * @cssproperty --dds-checkbox-invalid-hover-border-color - The border color when hovering over an invalid checkbox. Default is `var(--dds-border-negative-medium)`.\n * @cssproperty --dds-checkbox-invalid-hover-background-color - The background color when hovering over an invalid checkbox. Default is `var(--dds-background-negative-medium)`.\n * @cssproperty --dds-checkbox-invalid-active-border-color - The border color when an invalid checkbox is active. Default is `var(--dds-border-negative-strong)`.\n * @cssproperty --dds-checkbox-invalid-active-background-color - The background color when an invalid checkbox is active. Default is `var(--dds-background-negative-strong)`.\n * @cssproperty --dds-checkbox-disabled-border-color - The border color when the checkbox is disabled. Default is `var(--dds-button-primary-background-disabled)`.\n * @cssproperty --dds-checkbox-disabled-background-color - The background color when the checkbox is disabled. Default is `var(--dds-button-primary-background-disabled)`.\n * @cssproperty --dds-checkbox-disabled-icon-color - The color of the checkbox icon when disabled. Default is `var(--dds-button-primary-icon-disabled)`.\n /\n const reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {\n onDdsChange: 'dds-change' as EventName<DdsChangeEvent>,\nonDdsBlur: 'dds-blur' as EventName<DdsBlurEvent>,\nonDdsFocus: 'dds-focus' as EventName<DdsFocusEvent>,\nonDdsInput: 'dds-input' as EventName<DdsInputEvent>\n },\n displayName: \"DapDSCheckbox\"\n })\n\n export default reactWrapper\n ","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/command/command-group.component.js'\n\nconst tagName = 'dap-ds-command-group'\n\n/*\n `dap-ds-command-group`\n * @summary A command group is a group of command items.\n * @element dap-ds-command-group\n * @title - Command group\n * @group command\n \n @slot - The default slot for the command group.\n \n @cssprop --dds-command-group-gap - The gap between command group elements. Defaults to var(--dds-spacing-100)\n * @cssprop --dds-command-group-margin-bottom - The bottom margin of the command group. Defaults to var(--dds-spacing-200)\n * @cssprop --dds-command-group-border-radius - The border radius of the command group. Defaults to var(--dds-radius-small)\n * @cssprop --dds-command-group-label-font-weight - The font weight of the command group label. Defaults to var(--dds-font-weight-bold)\n * @cssprop --dds-command-group-items-gap - The gap between command items. Defaults to var(--dds-spacing-100)\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'DapDSCommandGroup',\n})\n\nexport default reactWrapper\n","\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/command/command-item.component.js'\n import type { DdsCommandItemClickEvent } from '../../events/events'\n export type { DdsCommandItemClickEvent } from '../../events/events'\n\n const tagName = 'dap-ds-command-item'\n\n /*\n `dap-ds-command-item`\n * @summary A command item is a command item that can be selected.\n * @element dap-ds-command-item\n * @title - Command item\n * @group command\n \n @event {{ value: string, closeOnSelect: boolean }} dds-command-item-click - Fired when the command item is clicked.\n \n @slot - The label of the command item.\n * @slot check - The check of the command item.\n \n @csspart base - The base part of the command item.\n * @csspart content - The content part of the command item.\n * @csspart label - The label part of the command item.\n \n @cssprop --dds-command-item-padding - The padding of the command item\n * @cssprop --dds-command-item-background - The background color of the command item\n * @cssprop --dds-command-item-color - The text color of the command item\n * @cssprop --dds-command-item-hover-background - The background color of the command item on hover\n * @cssprop --dds-command-item-selected-background - The background color of the selected command item\n /\n const reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {\n onDdsCommandItemClick: 'dds-command-item-click' as EventName<DdsCommandItemClickEvent>\n },\n displayName: \"DapDSCommandItem\"\n })\n\n export default reactWrapper\n ","\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/command/command.component.js'\n import type { DdsOpenedEvent } from '../../events/events'\nimport type { DdsClosedEvent } from '../../events/events'\n export type { DdsOpenedEvent } from '../../events/events'\nexport type { DdsClosedEvent } from '../../events/events'\n\n const tagName = 'dap-ds-command'\n\n /*\n `dap-ds-command`\n * @summary A command is a component that displays a list of commands.\n * @element dap-ds-command\n * @title - Command\n \n /\n const reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {\n onDdsOpened: 'dds-opened' as EventName<DdsOpenedEvent>,\nonDdsClosed: 'dds-closed' as EventName<DdsClosedEvent>\n },\n displayName: \"DapDSCommand\"\n })\n\n export default reactWrapper\n ","\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/combobox/combobox.component.js'\n import type { DdsChangeEvent } from '../../events/events'\nimport type { DdsBlurEvent } from '../../events/events'\nimport type { DdsFocusEvent } from '../../events/events'\nimport type { DdsClearEvent } from '../../events/events'\nimport type { DdsSearchEvent } from '../../events/events'\nimport type { DdsInputEvent } from '../../events/events'\n export type { DdsChangeEvent } from '../../events/events'\nexport type { DdsBlurEvent } from '../../events/events'\nexport type { DdsFocusEvent } from '../../events/events'\nexport type { DdsClearEvent } from '../../events/events'\nexport type { DdsSearchEvent } from '../../events/events'\nexport type { DdsInputEvent } from '../../events/events'\n\n const tagName = 'dap-ds-combobox'\n\n /*\n `dap-ds-combobox`\n * @summary A select is a form element that allows the user to select one option from a set.\n * @element dap-ds-combobox\n * @title - Combobox\n \n @event {{ value }} dds-change - Fired when the select value changes.\n * @event {{ void }} dds-blur - Emitted when the select loses focus.\n * @event {{ void }} dds-focus - Emitted when the select gains focus.\n * @event {{ void }} dds-clear - Emitted when the select is cleared.\n * @event {{ search: string }} dds-search - Emitted when the manual input value changes.\n * @event {{ input: string, originalEvent: Event }} dds-input - Emitted when typing happens in the input.\n \n @property {string} value - The value of the select.\n * @property {string} placeholder - The placeholder of the select.\n * @property { 'top' \| 'top-start' \| 'top-end' \| 'right' \| 'right-start'\| 'right-end' \| 'bottom' \| 'bottom-start' \| 'bottom-end' \| 'left' \| 'left-start' \| 'left-end'} placement - The placement of the select dropdown. Default is 'bottom-start'.\n * @property {boolean} opened - Whether the select dropdown is opened.\n * @property {'width' \| 'height' \| 'both'} sync - The sync mode of the select dropdown. How the dropdown item size is synced to the trigger element'.\n * @property {string} label - The label of the select.\n * @property {string} description - The description of the select.\n * @property {string} tooltip - The tooltip of the select.\n * @property {'top' \| 'right' \| 'bottom' \| 'left'} tooltipPlacement - The tooltip placement of the input.\n * @property {'xs' \| 'sm' \| 'sm'} size - The size of the select. Default is 'md'.\n * @property {boolean} disabled - Whether the select is disabled.\n * @property {boolean} required - Whether the select is required.\n * @property {boolean} readonly - Whether the select is readonly.\n * @property {boolean} autofocus - Whether the select is autofocus.\n * @property {string} feedback - The feedback content of the select.\n * @property {'error' \| 'warning' \| 'info'} feedbackType - The feedback type of the select.\n * @property {'none' \| 'typehead' \| 'autocomplete' \| 'manual'} searchMode - The search mode of the select.\n * @property {boolean} openOnEmpty - Whether the combobox should open on empty results.\n * @property {boolean} allowManualInput - Whether the combobox allows manual input, or free text.\n * @property {boolean} searchForText - Whether the combobox should search for the selected item text.\n * @property {boolean} noTextComplete - Whether the combobox should not complete the text.\n * @property {string} searchButtonAriaLabel - The aria label of the search button.\n * @property {string} selectable - Show the selected item check mark in the dropdown. 'true' or 'false'\n * @property {boolean} noAnimation - Whether the combobox open indicator should be animated.\n \n @csspart base - The main select container.\n * @csspart trigger - The trigger button of the select.\n * @csspart label - The label of the select.\n * @csspart description - The description of the select.\n * @csspart feedback - The feedback of the select.\n * @csspart tooltip - The tooltip of the select.\n * @csspart option-list - The option list of the select.\n \n @cssproperty --dds-combobox-background - The background color of the combobox. Defaults to var(--dds-fields-background-default).\n * @cssproperty --dds-combobox-border-color - The border color of the combobox. Defaults to var(--dds-border-neutral-base).\n * @cssproperty --dds-combobox-border-width - The border width of the combobox. Defaults to var(--dds-border-width-base, 1px).\n * @cssproperty --dds-combobox-border-radius - The border radius of the combobox. Defaults to var(--dds-radius-base).\n * @cssproperty --dds-combobox-text-color - The text color of the combobox. Defaults to var(--dds-text-neutral-base).\n * @cssproperty --dds-combobox-placeholder-color - The placeholder text color. Defaults to var(--dds-text-neutral-subtle).\n * @cssproperty --dds-combobox-disabled-background - The background color when disabled. Defaults to var(--dds-background-neutral-stronger).\n * @cssproperty --dds-combobox-disabled-text - The text color when disabled. Defaults to var(--dds-text-neutral-disabled).\n * @cssproperty --dds-combobox-error-border - The border color for error state. Defaults to var(--dds-border-negative-base).\n * @cssproperty --dds-combobox-success-border - The border color for success state. Defaults to var(--dds-border-positive-base).\n * @cssproperty --dds-combobox-icon-color - The color of the icons. Defaults to var(--dds-text-icon-neutral-subtle).\n * @cssproperty --dds-combobox-clear-icon-color - The color of the clear icon. Defaults to var(--dds-button-subtle-icon-neutral-enabled).\n * @cssproperty --dds-combobox-popup-background - The background color of the popup. Defaults to var(--dds-background-neutral-subtle).\n * @cssproperty --dds-combobox-popup-shadow - The box shadow of the popup. Defaults to 0 4px 6px -1px rgb(0 0 0 / 8%), 0 2px 4px -1px rgb(0 0 0 / 6%).\n \n @cssproperty --dds-combobox-padding-xs - The padding for extra small size. Defaults to var(--dds-spacing-200).\n * @cssproperty --dds-combobox-padding-sm - The padding for small size. Defaults to var(--dds-spacing-200).\n * @cssproperty --dds-combobox-padding-lg - The padding for large size. Defaults to var(--dds-spacing-300).\n * @cssproperty --dds-combobox-padding-horizontal - The horizontal padding. Defaults to var(--dds-spacing-300).\n * @cssproperty --dds-combobox-padding-vertical - The vertical padding. Defaults to var(--dds-spacing-200).\n * @cssproperty --dds-combobox-gap - The gap between elements. Defaults to var(--dds-spacing-100).\n * @cssproperty --dds-combobox-icon-gap - The gap between icons. Defaults to var(--dds-spacing-200).\n * @cssproperty --dds-combobox-action-gap - The gap between action elements. Defaults to var(--dds-spacing-200).\n * @cssproperty --dds-combobox-action-padding - The padding for action elements. Defaults to var(--dds-spacing-300).\n * @cssproperty --dds-combobox-clear-icon-width - The width of the clear icon. Defaults to var(--dds-spacing-800).\n * @cssproperty --dds-combobox-dropdown-icon-right - The right position of the dropdown icon. Defaults to var(--dds-spacing-600).\n * @cssproperty --dds-combobox-min-width - The minimum width of the combobox. Defaults to 7.5rem.\n \n @slot - The default slot for the options.\n /\n const reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {\n onDdsChange: 'dds-change' as EventName<DdsChangeEvent>,\nonDdsBlur: 'dds-blur' as EventName<DdsBlurEvent>,\nonDdsFocus: 'dds-focus' as EventName<DdsFocusEvent>,\nonDdsClear: 'dds-clear' as EventName<DdsClearEvent>,\nonDdsSearch: 'dds-search' as EventName<DdsSearchEvent>,\nonDdsInput: 'dds-input' as EventName<DdsInputEvent>\n },\n displayName: \"DapDSCombobox\"\n })\n\n export default reactWrapper\n ","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/content-switcher/content-switcher-item.component.js'\n\nconst tagName = 'dap-ds-content-switcher-item'\n\n/*\n `dap-ds-content-switcher-item`\n * @summary Segmented control item component for the segmented control.\n * @element dap-ds-content-switcher-item\n * @title - Content switcher item\n * @group content-switcher\n \n @slot iconcontent - The icon content of the segmented control item.\n \n @csspart input - The input of the segmented control item.\n \n @cssproperty --dds-content-switcher-item-height - The height of the content switcher item (default: var(--dds-spacing-800, 32px))\n * @cssproperty --dds-content-switcher-item-padding - The padding of the content switcher item (default: var(--dds-spacing-200, 8px) var(--dds-spacing-400, 16px))\n * @cssproperty --dds-content-switcher-item-font-size - The font size of the content switcher item (default: var(--dds-size-sm, 14px))\n * @cssproperty --dds-content-switcher-item-font-weight - The font weight of the content switcher item (default: var(--dds-weight-bold, 700))\n * @cssproperty --dds-content-switcher-item-border-radius - The border radius of the content switcher item (default: var(--dds-radius-large, 16px))\n * @cssproperty --dds-content-switcher-item-background - The background color of the content switcher item (default: transparent)\n * @cssproperty --dds-content-switcher-item-color - The text color of the content switcher item (default: var(--dds-text-neutral-base))\n * @cssproperty --dds-content-switcher-item-border-color - The border color of the content switcher item (default: transparent)\n * @cssproperty --dds-content-switcher-item-checked-background - The background color of the checked content switcher item (default: var(--dds-button-primary-background-enabled))\n * @cssproperty --dds-content-switcher-item-checked-color - The text color of the checked content switcher item (default: var(--dds-text-neutral-on-inverted))\n * @cssproperty --dds-content-switcher-item-checked-border-color - The border color of the checked content switcher item (default: var(--dds-border-neutral-transparent-interactive))\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'DapDSContentSwitcherItem',\n})\n\nexport default reactWrapper\n","\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/content-switcher/content-switcher.component.js'\n import type { DdsChangeEvent } from '../../events/events'\n export type { DdsChangeEvent } from '../../events/events'\n\n const tagName = 'dap-ds-content-switcher'\n\n /*\n `dap-ds-content-switcher`\n * @summary A content switcher is a set of two or more segments, each of which functions as a mutually exclusive button.\n * @element dap-ds-content-switcher\n * @title - Content switcher\n \n @slot - The content switcher items.\n \n @event {{ value: string, selected: boolean }} dds-change - Fired when the content switcher is changed.\n \n @csspart base - The main content switcher container.\n \n @cssproperty --dds-content-switcher-min-width - The minimum width of the content switcher (default: var(--dds-spacing-4000, 160px))\n * @cssproperty --dds-content-switcher-padding - The padding of the content switcher (default: var(--dds-spacing-100, 4px))\n * @cssproperty --dds-content-switcher-border-width - The border width of the content switcher (default: var(--dds-border-width-base))\n * @cssproperty --dds-content-switcher-border-color - The border color of the content switcher (default: var(--dds-border-neutral-transparent))\n * @cssproperty --dds-content-switcher-border-radius - The border radius of the content switcher (default: var(--dds-radius-rounded, 1000px))\n * @cssproperty --dds-content-switcher-background - The background color of the content switcher (default: var(--dds-transparent-black-subtle, rgb(0 0 0 / 5%)))\n * @cssproperty --dds-content-switcher-gap - The gap between content switcher items (default: var(--dds-spacing-100, 4px))\n /\n const reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {\n onDdsChange: 'dds-change' as EventName<DdsChangeEvent>\n },\n displayName: \"DapDSContentSwitcher\"\n })\n\n export default reactWrapper\n ","\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/copybox-input/copybox-input.component.js'\n import type { DdsCopyEvent } from '../../events/events'\nimport type { DdsChangeEvent } from '../../events/events'\nimport type { DdsInputEvent } from '../../events/events'\nimport type { DdsKeydownEvent } from '../../events/events'\nimport type { DdsBlurEvent } from '../../events/events'\nimport type { DdsFocusEvent } from '../../events/events'\nimport type { DdsNotAllowedEvent } from '../../events/events'\n export type { DdsCopyEvent } from '../../events/events'\nexport type { DdsChangeEvent } from '../../events/events'\nexport type { DdsInputEvent } from '../../events/events'\nexport type { DdsKeydownEvent } from '../../events/events'\nexport type { DdsBlurEvent } from '../../events/events'\nexport type { DdsFocusEvent } from '../../events/events'\nexport type { DdsNotAllowedEvent } from '../../events/events'\n\n const tagName = 'dap-ds-copybox-input'\n\n /*\n `dap-ds-copybox-input`\n * @summary A copybox input is a field for copying an input value.\n * @element dap-ds-copybox-input\n * @title - CopyBox input\n \n @property {string} label - The label of the input.\n * @property {string} placeholder - The placeholder of the input.\n * @property {string} description - The description of the input.\n * @property {string} tooltip - The tooltip of the input.\n * @property {'top' \| 'right' \| 'bottom' \| 'left'} tooltipPlacement - The position of the tooltip. Can be `top`, `right`, `bottom`, or `left`.\n * @property {'success' \| 'error'} status - The status of the input. Can be `success` or `error`.\n * @property {'xs' \| 'sm' \| 'sm'} size - The size of the input. Default is `sm`.\n * @property {string} name - The name of the input.\n * @property {string} value - The value of the input.\n * @property {boolean} disabled - The disabled state of the input. Default is false.\n * @property {boolean} required - The required state of the input. Default is false.\n * @property {boolean} readonly - The readonly state of the input. Default is false.\n * @property {boolean} autofocus - The autofocus state of the input. Default is false.\n * @property {string} feedback - The feedback of the input.\n * @property {'negative' \| 'positive' \| 'warning'} feedbackType - The feedback type of the input. Can be `negative`, `positive`, or `warning`.\n * @property {boolean} loading - The loading state of the input. Default is false.\n * @property {boolean} optional - The optional state of the input.\n * @property {string} optionalLabel - The optional label of the input.\n * @property {boolean} subtle - The weight of the label. Default is `false`\n * @property {string} copyButtonAriaLabel - The aria label of the copy button.\n \n @event {{ value: string }} dds-copy - Fired when the user clicks on the copy button.\n * @event {{ value: string }} dds-change - Fired when the input value changes.\n * @event {{ value: string }} dds-input - Fired when the input value changes.\n * @event {{ value: string, originalEvent: Event }} dds-keydown - Fired when a key is pressed down.\n * @event {{ void }} dds-blur - Fired when the input loses focus.\n * @event {{ void }} dds-focus - Emitted when the input gains focus.\n * @event {{ void }} dds-not-allowed - Emitted when the value cannot be copied.\n \n @cssproperty --dds-input-height - The height of the input. Default is var(--dds-spacing-1000).\n * @cssproperty --dds-input-padding - The padding of the input. Default is var(--dds-spacing-300).\n * @cssproperty --dds-input-font-size - The font size of the input. Default is var(--dds-font-base).\n * @cssproperty --dds-input-border-color - The border color of the input. Default is var(--dds-border-neutral-base).\n * @cssproperty --dds-input-background-color - The background color of the input. Default is var(--dds-fields-background-default).\n * @cssproperty --dds-input-text-color - The text color of the input. Default is var(--dds-text-neutral-base).\n * @cssproperty --dds-input-border-radius - The border radius of the input. Default is var(--dds-radius-base).\n * @cssproperty --dds-input-border-width - The border width of the input. Default is var(--dds-border-width-base).\n * @cssproperty --dds-input-disabled-background - The background color of the disabled input. Default is var(--dds-fields-background-disabled).\n * @cssproperty --dds-input-disabled-text - The text color of the disabled input. Default is var(--dds-text-neutral-disabled).\n * @cssproperty --dds-input-readonly-background - The background color of the readonly input. Default is var(--dds-fields-background-read-only).\n * @cssproperty --dds-input-readonly-text - The text color of the readonly input. Default is var(--dds-text-neutral-subtle).\n * @cssproperty --dds-input-success-border - The border color of the success input. Default is var(--dds-border-positive-base).\n * @cssproperty --dds-input-error-border - The border color of the error input. Default is var(--dds-border-negative-base).\n * @cssproperty --dds-input-addon-background - The background color of the input addon. Default is var(--dds-background-ui-neutral-enabled).\n * @cssproperty --dds-input-addon-success-background - The background color of the success input addon. Default is var(--dds-background-ui-positive-enabled).\n * @cssproperty --dds-input-addon-error-background - The background color of the error input addon. Default is var(--dds-background-ui-negative-enabled).\n \n @csspart base - The base container of the component.\n * @csspart postfix - The inner postfix icon part of the component.\n * @csspart button - The button of the component.\n /\n const reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {\n onDdsCopy: 'dds-copy' as EventName<DdsCopyEvent>,\nonDdsChange: 'dds-change' as EventName<DdsChangeEvent>,\nonDdsInput: 'dds-input' as EventName<DdsInputEvent>,\nonDdsKeydown: 'dds-keydown' as EventName<DdsKeydownEvent>,\nonDdsBlur: 'dds-blur' as EventName<DdsBlurEvent>,\nonDdsFocus: 'dds-focus' as EventName<DdsFocusEvent>,\nonDdsNotAllowed: 'dds-not-allowed' as EventName<DdsNotAllowedEvent>\n },\n displayName: \"DapDSCopyBoxInput\"\n })\n\n export default reactWrapper\n ","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/dap-badge/dap-badge.component.js'\n\nconst tagName = 'dap-ds-dap-badge'\n\n/*\n `dap-ds-dap-badge`\n * @summary A DÁP badge is a brand element showing the use of this system design library.\n * @element dap-ds-dap-badge\n * @title - Dap badge\n \n @slot - Description of badge\n * \n @csspart base - Main badge container\n * @csspart icon - Badge icon\n * @csspart text - Badge text\n \n @cssproperty --dds-badge-padding - Custom padding for the badge (default: var(--dds-spacing-200) var(--dds-spacing-300))\n * @cssproperty --dds-badge-border-width - Custom border width for the badge (default: var(--dds-border-width-base))\n * @cssproperty --dds-badge-border-color - Custom border color for the badge (default: var(--dds-border-neutral-divider))\n * @cssproperty --dds-badge-border-radius - Custom border radius for the badge (default: var(--dds-spacing-200))\n * @cssproperty --dds-badge-color - Custom text color for the badge (default: var(--dds-text-neutral-base))\n * @cssproperty --dds-badge-gap - Custom gap between icon and text (default: var(--dds-spacing-200))\n * @cssproperty --dds-badge-font-size - Custom font size for the badge (default: var(--dds-font-xs))\n * @cssproperty --dds-badge-font-weight - Custom font weight for the badge (default: var(--dds-font-weight-medium))\n * @cssproperty --dds-badge-line-height - Custom line height for the badge (default: var(--dds-font-line-height-large))\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'DapDSDAPBadge',\n})\n\nexport default reactWrapper\n","\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/datatable/datatable.component.js'\n import type { DdsSortingChangeEvent } from '../../events/events'\nimport type { DdsSelectionChangeEvent } from '../../events/events'\nimport type { DdsPaginationChangeEvent } from '../../events/events'\nimport type { DdsRowClickEvent } from '../../events/events'\n export type { DdsSortingChangeEvent } from '../../events/events'\nexport type { DdsSelectionChangeEvent } from '../../events/events'\nexport type { DdsPaginationChangeEvent } from '../../events/events'\nexport type { DdsRowClickEvent } from '../../events/events'\n\n const tagName = 'dap-ds-datatable'\n\n /*\n `dap-ds-datatable`\n * @summary A data table is a component that displays data in a tabular format.\n * @element dap-ds-datatable\n * @title - Data table\n * @generic T\n \n @event {{ sorting: SortingState }} dds-sorting-change - Fired when the sorting of the table changes.\n * @event {{ selection: RowSelectionState }} dds-selection-change - Fired when the selection of the table changes.\n * @event {{ pagination: PaginationState }} dds-pagination-change - Fired when the pagination of the table changes.\n * @event {{ row: Row<T> }} dds-row-click - Fired when a row is clicked.\n \n @csspart base - The main table container.\n * @csspart header - The header of the table.\n * @csspart header-row - The header row of the table.\n * @csspart header-cell - All cells of the header.\n * @csspart body - The body of the table.\n * @csspart row - All rows of the table.\n * @csspart cell - All cells of the table.\n * @csspart pager - The pager of the table.\n \n @cssproperty --dds-datatable-bg-color - Background color of the table\n * @cssproperty --dds-datatable-border-color - Border color of the table cells\n * @cssproperty --dds-datatable-header-bg-color - Background color of the table header\n * @cssproperty --dds-datatable-header-text-color - Text color of the table header\n * @cssproperty --dds-datatable-row-hover-bg-color - Background color of hovered rows\n * @cssproperty --dds-datatable-row-selected-bg-color - Background color of selected rows\n * @cssproperty --dds-datatable-cell-padding - Padding of table cells\n * @cssproperty --dds-datatable-header-padding - Padding of header cells\n * @cssproperty --dds-datatable-border-width - Width of table borders\n * @cssproperty --dds-datatable-font-size - Font size of the table\n * @cssproperty --dds-datatable-line-height - Line height of the table\n * @cssproperty --dds-datatable-header-font-weight - Font weight of the header\n * @cssproperty --dds-datatable-stripe-color - Background color for striped rows\n * @cssproperty --dds-datatable-stripe-enabled - Whether to enable striped rows\n * @cssproperty --dds-datatable-border-radius - Border radius of the table\n * @cssproperty --dds-datatable-shadow - Box shadow of the table\n * @cssproperty --dds-datatable-transition-duration - Duration of hover/selection transitions\n * @cssproperty --dds-datatable-z-index - Z-index of the table\n * @cssproperty --dds-datatable-min-height - Minimum height of the table\n * @cssproperty --dds-datatable-max-height - Maximum height of the table\n * @cssproperty --dds-datatable-overflow-x - Horizontal overflow behavior\n * @cssproperty --dds-datatable-overflow-y - Vertical overflow behavior\n /\n const reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {\n onDdsSortingChange: 'dds-sorting-change' as EventName<DdsSortingChangeEvent>,\nonDdsSelectionChange: 'dds-selection-change' as EventName<DdsSelectionChangeEvent>,\nonDdsPaginationChange: 'dds-pagination-change' as EventName<DdsPaginationChangeEvent>,\nonDdsRowClick: 'dds-row-click' as EventName<DdsRowClickEvent>\n },\n displayName: \"DapDSDataTable\"\n })\n\n export default reactWrapper\n ","\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/datepicker/datepicker.component.js'\n import type { DdsChangeEvent } from '../../events/events'\nimport type { DdsInputEvent } from '../../events/events'\nimport type { DdsValidDateEvent } from '../../events/events'\nimport type { DdsInvalidDateEvent } 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 { DdsValidDateEvent } from '../../events/events'\nexport type { DdsInvalidDateEvent } 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-datepicker'\n\n /*\n `dap-ds-datepicker`\n * @summary A datepicker is a graphical user interface widget that allows the user to select a date from a calendar and/or time from a time range.\n * @element dap-ds-datepicker\n * @title - Datepicker\n \n @property {Dayjs} value - The value of the datepicker.\n * @property {string} label - The label of the datepicker.\n * @property {string} description - The description of the datepicker.\n * @property {'xs' \| 'sm' \| 'sm'} size - The size of the datepicker.\n * @property {boolean} disabled - The disabled state of the datepicker.\n * @property {boolean} required - The required state of the datepicker.\n * @property {boolean} readonly - The readonly state of the datepicker.\n * @property {boolean} autofocus - The autofocus state of the datepicker.\n * @property {string} tooltip - The tooltip of the datepicker.\n * @property {'top' \| 'right' \| 'bottom' \| 'left'} tooltipPlacement - The tooltip placement of the datepicker.\n * @property {string} feedback - The feedback of the datepicker.\n * @property {'negative' \| 'positive' \| 'warning'} feedbackType - The feedback type of the datepicker.\n * @property {boolean} optional - The optional state of the datepicker.\n * @property {string} optionalLabel - The optional label of the datepicker.\n * @property {boolean} subtle - The weight of the label. Default is `false`\n * @property {string} autocomplete - The autocomplete of the datepicker.\n * @property {boolean} autofocus - The autofocus of the datepicker.\n \n @event {{ value: string }} dds-change - Fired when the datepicker value changes.\n * @event {{ value: string }} dds-input - Fired when the datepicker input value changes.\n * @event {{ value: string }} dds-valid-date - Fired when the datepicker input value is valid. Happens on manual input typing.\n * @event {{ value: string, type: 'invalid' \| 'out-of-range' }} dds-invalid-date - Fired when the datepicker input value is invalid. Happens on manual input typing.\n * @event {{ void }} dds-clear - Fired when the datepicker is cleared.\n * @event {{ void }} dds-focus - Emitted when the datepicker gains focus.\n * @event {{ void }} dds-blur - Emitted when the datepicker loses focus.\n \n @csspart base - The main datepicker container.\n * @csspart calendar - The calendar of the datepicker.\n * @csspart trigger - The trigger button of the datepicker.\n * @csspart label - The label of the datepicker.\n * @csspart description - The description of the datepicker.\n * @csspart feedback - The feedback of the datepicker.\n * @csspart tooltip - The tooltip of the datepicker.\n * @csspart input - The input of the datepicker.\n * @csspart clear-button - The clear button of the datepicker.\n \n @cssproperty --dds-combobox-background - The background color of the combobox. Defaults to var(--dds-fields-background-default).\n * @cssproperty --dds-combobox-border-color - The border color of the combobox. Defaults to var(--dds-border-neutral-base).\n * @cssproperty --dds-combobox-border-width - The border width of the combobox. Defaults to var(--dds-border-width-base, 1px).\n * @cssproperty --dds-combobox-border-radius - The border radius of the combobox. Defaults to var(--dds-radius-base).\n * @cssproperty --dds-combobox-text-color - The text color of the combobox. Defaults to var(--dds-text-neutral-base).\n * @cssproperty --dds-combobox-placeholder-color - The placeholder text color. Defaults to var(--dds-text-neutral-subtle).\n * @cssproperty --dds-combobox-disabled-background - The background color when disabled. Defaults to var(--dds-background-neutral-stronger).\n * @cssproperty --dds-combobox-disabled-text - The text color when disabled. Defaults to var(--dds-text-neutral-disabled).\n * @cssproperty --dds-combobox-error-border - The border color for error state. Defaults to var(--dds-border-negative-base).\n * @cssproperty --dds-combobox-success-border - The border color for success state. Defaults to var(--dds-border-positive-base).\n * @cssproperty --dds-combobox-icon-color - The color of the icons. Defaults to var(--dds-text-icon-neutral-subtle).\n * @cssproperty --dds-combobox-clear-icon-color - The color of the clear icon. Defaults to var(--dds-button-subtle-icon-neutral-enabled).\n * @cssproperty --dds-combobox-popup-background - The background color of the popup. Defaults to var(--dds-background-neutral-subtle).\n * @cssproperty --dds-combobox-popup-shadow - The box shadow of the popup. Defaults to 0 4px 6px -1px rgb(0 0 0 / 8%), 0 2px 4px -1px rgb(0 0 0 / 6%).\n \n @cssproperty --dds-combobox-padding-xs - The padding for extra small size. Defaults to var(--dds-spacing-200).\n * @cssproperty --dds-combobox-padding-sm - The padding for small size. Defaults to var(--dds-spacing-200).\n * @cssproperty --dds-combobox-padding-lg - The padding for large size. Defaults to var(--dds-spacing-300).\n * @cssproperty --dds-combobox-padding-horizontal - The horizontal padding. Defaults to var(--dds-spacing-300).\n * @cssproperty --dds-combobox-padding-vertical - The vertical padding. Defaults to var(--dds-spacing-200).\n * @cssproperty --dds-combobox-gap - The gap between elements. Defaults to var(--dds-spacing-100).\n * @cssproperty --dds-combobox-icon-gap - The gap between icons. Defaults to var(--dds-spacing-200).\n * @cssproperty --dds-combobox-action-gap - The gap between action elements. Defaults to var(--dds-spacing-200).\n * @cssproperty --dds-combobox-action-padding - The padding for action elements. Defaults to var(--dds-spacing-300).\n * @cssproperty --dds-combobox-clear-icon-width - The width of the clear icon. Defaults to var(--dds-spacing-800).\n * @cssproperty --dds-combobox-dropdown-icon-right - The right position of the dropdown icon. Defaults to var(--dds-spacing-600).\n * @cssproperty --dds-combobox-min-width - The minimum width of the combobox. Defaults to 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>,\nonDdsValidDate: 'dds-valid-date' as EventName<DdsValidDateEvent>,\nonDdsInvalidDate: 'dds-invalid-date' as EventName<DdsInvalidDateEvent>,\nonDdsClear: 'dds-clear' as EventName<DdsClearEvent>,\nonDdsFocus: 'dds-focus' as EventName<DdsFocusEvent>,\nonDdsBlur: 'dds-blur' as EventName<DdsBlurEvent>\n },\n displayName: \"DapDSDatePicker\"\n })\n\n export default reactWrapper\n ","import { createComponent } from '@lit/react'\nimport * as React from 'react'\n\nimport Component from '../../components/divider/divider.component.js'\n\nconst tagName = 'dap-ds-divider'\n\n/*\n `dap-ds-divider`\n * @summary A divider is a visual separator between elements.\n * @element dap-ds-divider\n * @title - Divider\n \n @cssproperty --dds-divider-border-width - The width of the divider border. Defaults to var(--dds-border-width-base)\n * @cssproperty --dds-divider-border-style - The style of the divider border. Defaults to solid\n * @cssproperty --dds-divider-border-color - The color of the divider border. Defaults to var(--dds-border-neutral-divider)\n * @cssproperty --dds-divider-border-color-inverted - The color of the divider border when inverted. Defaults to var(--dds-border-neutral-divider-inverted)\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'DapDSDivider',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/feedback/feedback.component.js'\n\nconst tagName = 'dap-ds-feedback'\n\n/*\n `dap-ds-feedback`\n * @summary A feedback is a container for feedback messages.\n * @element dap-ds-feedback\n * @title - Feedback\n \n @property {string} feedback - The feedback message.\n * @property {'xs' \| 'sm' \| 'lg'} feedbackSize - The size of the feedback. Default is `sm`.\n * @property {'negative' \| 'positive' \| 'warning'} feedbackSize - The type of the feedback.\n * @property {boolean} feedbackSubtle - The weight of the feedback.\n * @property {boolean} feedbackNoMargin - Removes the margins around the feedback.\n * @property {string} feedbackId - The id of the feedback.\n \n @slot icon - The custom icon of the feedback.\n * @slot - The text of the feedback.\n \n @csspart base - The main feedback container.\n * @csspart icon - The icon of the feedback.\n * @csspart text - The text of the feedback.\n \n @cssproperty --dds-feedback-spacing - The spacing around the feedback component. Default is `var(--dds-spacing-200)`.\n * @cssproperty --dds-feedback-color - The text color of the feedback. Default is `var(--dds-text-positive-subtle)`.\n * @cssproperty --dds-feedback-font-size - The font size of the feedback. Default is `var(--dds-font-sm)`.\n * @cssproperty --dds-feedback-font-weight - The font weight of the feedback. Default is `var(--dds-font-weight-bold)`.\n * @cssproperty --dds-feedback-icon-fill - The fill color of the feedback icon. Default is `var(--dds-icon-positive-subtle)`.\n * @cssproperty --dds-feedback-icon-spacing - The spacing between the icon and text. Default is `var(--dds-spacing-100)`.\n \n @cssproperty --dds-feedback-color-warning - The text color for warning feedback. Default is `var(--dds-text-neutral-base)`.\n * @cssproperty --dds-feedback-color-positive - The text color for positive feedback. Default is `var(--dds-text-positive-subtle)`.\n * @cssproperty --dds-feedback-color-negative - The text color for negative feedback. Default is `var(--dds-text-negative-subtle)`.\n * @cssproperty --dds-feedback-icon-fill-warning - The icon fill color for warning feedback. Default is `var(--dds-icon-informative-subtle)`.\n * @cssproperty --dds-feedback-icon-fill-positive - The icon fill color for positive feedback. Default is `var(--dds-icon-positive-subtle)`.\n * @cssproperty --dds-feedback-icon-fill-negative - The icon fill color for negative feedback. Default is `var(--dds-icon-negative-subtle)`.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'DapDSFeedback',\n})\n\nexport default reactWrapper\n","\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/file-input/file-input-list-item.component.js'\n import type { DdsFileRemoveEvent } from '../../events/events'\n export type { DdsFileRemoveEvent } from '../../events/events'\n\n const tagName = 'dap-ds-file-input-list-item'\n\n /*\n `dap-ds-file-input-list-item`\n * @summary A file input list item is a container for file input list items.\n * @element dap-ds-file-input-list-item\n * @title - File input list item\n * @group file-input\n \n @event {{ file: FileListElement }} dds-file-remove - Dispatched when a file is removed from the list.\n \n @csspart base - The main file input list item container.\n * @csspart feedback - The feedback container.\n * @csspart link - The link text of the item component.\n \n @cssproperty --dds-file-list-item-padding - The padding of the file list item.\n * @cssproperty --dds-file-list-item-border-width - The border width of the file list item.\n * @cssproperty --dds-file-list-item-border-color - The border color of the file list item.\n * @cssproperty --dds-file-list-item-border-radius - The border radius of the file list item.\n * @cssproperty --dds-file-list-item-bg-color - The background color of the file list item.\n * @cssproperty --dds-file-list-item-font-weight - The font weight of the file list item.\n * @cssproperty --dds-file-list-item-disabled-bg-color - The background color of the disabled file list item.\n * @cssproperty --dds-file-list-item-disabled-color - The text color of the disabled file list item.\n * @cssproperty --dds-file-list-item-content-margin - The margin of the content within the file list item.\n * @cssproperty --dds-file-list-item-content-gap - The gap between content elements in the file list item.\n * @cssproperty --dds-file-list-item-filename-color - The color of the filename text.\n * @cssproperty --dds-file-list-item-filesize-color - The color of the filesize text.\n * @cssproperty --dds-file-list-item-feedback-padding - The padding of the feedback section.\n * @cssproperty --dds-file-list-item-feedback-border-color - The border color of the feedback section.\n * @cssproperty --dds-file-list-item-feedback-font-size - The font size of the feedback text.\n /\n const reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {\n onDdsFileRemove: 'dds-file-remove' as EventName<DdsFileRemoveEvent>\n },\n displayName: \"DapDSFileInputListItem\"\n })\n\n export default reactWrapper\n ","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/file-input/file-input-list.component.js'\n\nconst tagName = 'dap-ds-file-input-list'\n\n/*\n `dap-ds-file-input-list`\n * @summary A file input list is a container for file input items.\n * @element dap-ds-file-input-list\n * @title - File input list\n * @group file-input\n \n @csspart base - The main file input list container.\n \n @cssproperty --dds-file-list-display - Controls the display property (default: flex)\n * @cssproperty --dds-file-list-flex-direction - Controls the flex-direction property (default: column)\n * @cssproperty --dds-file-list-padding - Controls the padding property (default: 0)\n * @cssproperty --dds-file-list-list-style - Controls the list-style-type property (default: none)\n * @cssproperty --dds-file-list-gap - Controls the row-gap property (default: var(--dds-spacing-200))\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'DapDSFileInputList',\n})\n\nexport default reactWrapper\n","\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/file-input/file-input.component.js'\n import type { DdsUploadStartEvent } from '../../events/events'\nimport type { DdsUploadProgressEvent } from '../../events/events'\nimport type { DdsUploadCompleteEvent } from '../../events/events'\nimport type { DdsUploadErrorEvent } from '../../events/events'\nimport type { DdsAllUploadsCompleteEvent } from '../../events/events'\nimport type { DdsFileRemovedEvent } from '../../events/events'\nimport type { DdsFileChangeEvent } from '../../events/events'\n export type { DdsUploadStartEvent } from '../../events/events'\nexport type { DdsUploadProgressEvent } from '../../events/events'\nexport type { DdsUploadCompleteEvent } from '../../events/events'\nexport type { DdsUploadErrorEvent } from '../../events/events'\nexport type { DdsAllUploadsCompleteEvent } from '../../events/events'\nexport type { DdsFileRemovedEvent } from '../../events/events'\nexport type { DdsFileChangeEvent } from '../../events/events'\n\n const tagName = 'dap-ds-file-input'\n\n /*\n `dap-ds-file-input`\n * @summary A file input is a control that allows users to select files to upload.\n * @element dap-ds-file-input\n * @title - File input\n \n @property {string} name - The name of the file input.\n * @property {string} value - The value of the file input.\n * @property {'success' \| 'error'} status - The status of the file input.\n * @property {string} label - The label for the file input.\n * @property {string} description - The description for the file input.\n * @property {string} tooltip - The tooltip for the file input.\n * @property {'top' \| 'right' \| 'bottom' \| 'left'} tooltipPlacement - The tooltip placement of the input.\n * @property {boolean} disabled - Whether the file input is disabled.\n * @property { 'xs' \| 'sm' \| 'lg' } size - The size of the file input.\n * @property {string} feedback - The feedback for the file input.\n * @property {'negative' \| 'positive' \| 'warning'} feedbackType - The type of feedback for the file input.\n * @property {boolean} required - Whether the file input is required.\n * @property {boolean} optional - Whether the file input is optional.\n * @property {boolean} subtle - Font weight of the feedback label. Default is `false` which is bold.\n \n @event {{ file: File }} dds-upload-start - Fired when a file upload starts.\n * @event {{ file: File, progress: number }} dds-upload-progress - Fired during file upload progress.\n * @event {{ file: File, item: DapDSFileInputListItem, result: any }} dds-upload-complete - Fired when a file upload completes successfully.\n * @event {{ file: File, item: DapDSFileInputListItem, error: Error }} dds-upload-error - Fired when a file upload encounters an error.\n * @event {{ void }} dds-all-uploads-complete - Fired when all file uploads are complete.\n * @event {{ file: FileListElement }} dds-file-removed - Fired when a file is removed from the file input.\n * @event {{ files: File[] }} dds-file-change - Fired when the file input value changes.\n \n @csspart base - The main file input container.\n * @csspart input - The file input control.\n * @csspart label - The file input label.\n * @csspart description - The file input description.\n * @csspart feedback - The file input feedback.\n * @csspart tooltip - The file input tooltip.\n /\n const reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {\n onDdsUploadStart: 'dds-upload-start' as EventName<DdsUploadStartEvent>,\nonDdsUploadProgress: 'dds-upload-progress' as EventName<DdsUploadProgressEvent>,\nonDdsUploadComplete: 'dds-upload-complete' as EventName<DdsUploadCompleteEvent>,\nonDdsUploadError: 'dds-upload-error' as EventName<DdsUploadErrorEvent>,\nonDdsAllUploadsComplete: 'dds-all-uploads-complete' as EventName<DdsAllUploadsCompleteEvent>,\nonDdsFileRemoved: 'dds-file-removed' as EventName<DdsFileRemovedEvent>,\nonDdsFileChange: 'dds-file-change' as EventName<DdsFileChangeEvent>\n },\n displayName: \"DapDSFileInput\"\n })\n\n export default reactWrapper\n ","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/icon/icon.component.js'\n\nconst tagName = 'dap-ds-icon'\n\n/*\n `dap-ds-icon`\n * @summary An icon is a graphical symbol that represents an object or action.\n * @element dap-ds-icon\n * @title - Icon\n \n @property {boolean} ariaHidden - Whether the icon is hidden from the accessibility tree. Default is true.\n * @property {string} ariaLabel - The aria label of the icon.\n \n @slot - The content of the icon for custom svg icons.\n \n @csspart base - The main icon container.\n * @csspart icon - The icon of the icon.\n \n @cssproperty --dds-icon-size-xs - The size of extra small icons (default: 12px)\n * @cssproperty --dds-icon-size-sm - The size of small icons (default: 16px)\n * @cssproperty --dds-icon-size-md - The size of medium icons (default: 20px)\n * @cssproperty --dds-icon-size-lg - The size of large icons (default: 24px)\n * @cssproperty --dds-icon-size-xl - The size of extra large icons (default: 32px)\n * @cssproperty --dds-icon-size-xxl - The size of extra extra large icons (default: 40px)\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'DapDSIcon',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/icon-button/icon-button.component.js'\n\nconst tagName = 'dap-ds-icon-button'\n\n/*\n `dap-ds-icon-button`\n * @summary An icon button is a button with an icon.\n * @element dap-ds-icon-button\n * @title - Icon button\n \n @property {string} ariaLabel - The aria label of the button.\n \n @slot - The icon of the button.\n \n @csspart base - The main button container.\n * @csspart content - The icon of the button.\n \n @cssproperty --dds-icon-button-border-width - The width of the button's border. Defaults to var(--dds-border-width-base).\n * @cssproperty --dds-icon-button-border-color - The color of the button's border. Defaults to var(--dds-border-neutral-transparent-interactive).\n * @cssproperty --dds-icon-button-border-radius - The border radius of the button. Defaults to var(--dds-radius-rounded).\n * @cssproperty --dds-icon-button-hover-border-width - The width of the button's border on hover. Defaults to var(--dds-border-width-large).\n * @cssproperty --dds-icon-button-active-border-width - The width of the button's border when active. Defaults to var(--dds-border-width-xlarge).\n * @cssproperty --dds-icon-button-transition - The transition property for the button. Defaults to var(--dds-transition-all).\n * @cssproperty --dds-icon-button-cursor - The cursor style for the button. Defaults to pointer.\n * @cssproperty --dds-icon-button-disabled-cursor - The cursor style for the disabled button. Defaults to not-allowed.\n \n @cssproperty --dds-icon-button-column-gap - The gap between icon and text. Defaults to var(--dds-spacing-100).\n * @cssproperty --dds-icon-button-padding-lg - Padding for large size. Defaults to var(--dds-spacing-0).\n * @cssproperty --dds-icon-button-padding-md - Padding for medium size. Defaults to var(--dds-spacing-100).\n * @cssproperty --dds-icon-button-padding-sm - Padding for small size. Defaults to var(--dds-spacing-50).\n * @cssproperty --dds-icon-button-padding-xs - Padding for extra small size. Defaults to var(--dds-spacing-25).\n \n @cssproperty --dds-icon-button-size-lg - Size for large button. Defaults to var(--dds-spacing-800).\n * @cssproperty --dds-icon-button-size-md - Size for medium button. Defaults to var(--dds-spacing-600).\n * @cssproperty --dds-icon-button-size-sm - Size for small button. Defaults to var(--dds-spacing-400).\n * @cssproperty --dds-icon-button-size-xs - Size for extra small button. Defaults to var(--dds-spacing-300).\n \n @cssproperty --dds-icon-button-neutral-bg - Background color for neutral variant. Defaults to var(--dds-transparent-black-subtle).\n * @cssproperty --dds-icon-button-neutral-color - Text color for neutral variant. Defaults to var(--dds-icon-neutral-base).\n * @cssproperty --dds-icon-button-neutral-hover-bg - Hover background color for neutral variant. Defaults to var(--dds-transparent-black-base).\n * @cssproperty --dds-icon-button-neutral-active-bg - Active background color for neutral variant. Defaults to var(--dds-transparent-black-medium).\n \n @cssproperty --dds-icon-button-brand-bg - Background color for brand variant. Defaults to var(--dds-button-subtle-background-enabled).\n * @cssproperty --dds-icon-button-brand-color - Text color for brand variant. Defaults to var(--dds-button-subtle-icon-enabled).\n * @cssproperty --dds-icon-button-brand-hover-bg - Hover background color for brand variant. Defaults to var(--dds-button-subtle-background-hover).\n * @cssproperty --dds-icon-button-brand-active-bg - Active background color for brand variant. Defaults to var(--dds-button-subtle-background-pressed).\n \n @cssproperty --dds-icon-button-inverted-bg - Background color for inverted variant. Defaults to var(--dds-transparent-white-subtle).\n * @cssproperty --dds-icon-button-inverted-color - Text color for inverted variant. Defaults to var(--dds-button-primary-icon-enabled).\n * @cssproperty --dds-icon-button-inverted-hover-bg - Hover background color for inverted variant. Defaults to var(--dds-transparent-white-base).\n * @cssproperty --dds-icon-button-inverted-active-bg - Active background color for inverted variant. Defaults to var(--dds-transparent-white-medium).\n \n @cssproperty --dds-icon-button-inverted-brand-bg - Background color for inverted brand variant. Defaults to var(--dds-button-primary-background-enabled).\n * @cssproperty --dds-icon-button-inverted-brand-color - Text color for inverted brand variant. Defaults to var(--dds-button-primary-icon-enabled).\n * @cssproperty --dds-icon-button-inverted-brand-hover-bg - Hover background color for inverted brand variant. Defaults to var(--dds-button-primary-background-enabled).\n * @cssproperty --dds-icon-button-inverted-brand-active-bg - Active background color for inverted brand variant. Defaults to var(--dds-button-primary-background-enabled).\n \n @cssproperty --dds-icon-button-disabled-color - Color for disabled state. Defaults to var(--dds-icon-neutral-disabled).\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'DapDSIconButton',\n})\n\nexport default reactWrapper\n","\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/input/input.component.js'\n import type { DdsChangeEvent } from '../../events/events'\nimport type { DdsInputEvent } from '../../events/events'\nimport type { DdsKeydownEvent } from '../../events/events'\nimport type { DdsBlurEvent } from '../../events/events'\nimport type { DdsFocusEvent } from '../../events/events'\n export type { DdsChangeEvent } from '../../events/events'\nexport type { DdsInputEvent } from '../../events/events'\nexport type { DdsKeydownEvent } from '../../events/events'\nexport type { DdsBlurEvent } from '../../events/events'\nexport type { DdsFocusEvent } from '../../events/events'\n\n const tagName = 'dap-ds-input'\n\n /*\n `dap-ds-input`\n * @summary An input is a field used to collect user input.\n * @element dap-ds-input\n * @title - Input\n \n @property {string} label - The label of the input.\n * @property {string} description - The description of the input.\n * @property {string} optionalLabel - Text of optional label.\n * @property {boolean} subtle - Text weight of label. If true the label is subtle. Default value is false.\n * @property {string} value - The value of the input.\n * @property {string} placeholder - The placeholder of the input.\n * @property {boolean} loading - The loading state of the input. Default is false.\n * @property {string} tooltip - The tooltip of the input.\n * @property {'top' \| 'right' \| 'bottom' \| 'left'} tooltipPlacement - The tooltip placement of the input.\n * @property {string} tooltipAriaLabel - The aria label of the tooltip.\n * @property {string} feedback - The feedback of the input.\n * @property {'negative' \| 'positive' \| 'warning'} feedbackType - The feedback type of the input. Can be `negative`, `positive`, or `warning`.\n * @property {'succes' \| 'error'} status - The status of the input. Can be `success` or `error`.\n * @property {'xs' \| 'sm' \| 'lg'} size - The size of the input. Default is `sm`.\n * @property {string} name - The name of the input.\n * @property {'text' \| 'number' \| 'button' \| 'color' \| 'email' \| 'hidden' \| 'reset' \| 'submit' \| 'url' \| 'password'\| 'file'} type - The type of the input. Default is 'text'.\n * @property {boolean} disabled - The disabled state of the input. Default is false.\n * @property {boolean} required - The required state of the input. Default is false.\n * @property {boolean} readonly - The readonly state of the input. Default is false.\n * @property {boolean} autofocus - The autofocus state of the input. Default is false.\n * @property {boolean} autocapitalize - The autocapitalize state of the input. Default is false.\n * @property {number} minlength - The minimum length of the input.\n * @property {number} maxlength - The maximum length of the input.\n * @property {number} min - The minimum value of the number input.\n * @property {number} max - The maximum value of the number input.\n * @property {number} step - The step value of the number input.\n * @property {string} inputmode - The inputmode of the input.\n * @property {string} pattern - The regex pattern of the input.\n \n @cssproperty --dds-input-height - The height of the input. Default is var(--dds-spacing-1000).\n * @cssproperty --dds-input-padding - The padding of the input. Default is var(--dds-spacing-300).\n * @cssproperty --dds-input-font-size - The font size of the input. Default is var(--dds-font-base).\n * @cssproperty --dds-input-border-color - The border color of the input. Default is var(--dds-border-neutral-base).\n * @cssproperty --dds-input-background-color - The background color of the input. Default is var(--dds-fields-background-default).\n * @cssproperty --dds-input-text-color - The text color of the input. Default is var(--dds-text-neutral-base).\n * @cssproperty --dds-input-border-radius - The border radius of the input. Default is var(--dds-radius-base).\n * @cssproperty --dds-input-border-width - The border width of the input. Default is var(--dds-border-width-base).\n * @cssproperty --dds-input-disabled-background - The background color of the disabled input. Default is var(--dds-fields-background-disabled).\n * @cssproperty --dds-input-disabled-text - The text color of the disabled input. Default is var(--dds-text-neutral-disabled).\n * @cssproperty --dds-input-readonly-background - The background color of the readonly input. Default is var(--dds-fields-background-read-only).\n * @cssproperty --dds-input-readonly-text - The text color of the readonly input. Default is var(--dds-text-neutral-subtle).\n * @cssproperty --dds-input-success-border - The border color of the success input. Default is var(--dds-border-positive-base).\n * @cssproperty --dds-input-error-border - The border color of the error input. Default is var(--dds-border-negative-base).\n * @cssproperty --dds-input-addon-background - The background color of the input addon. Default is var(--dds-background-ui-neutral-enabled).\n * @cssproperty --dds-input-addon-success-background - The background color of the success input addon. Default is var(--dds-background-ui-positive-enabled).\n * @cssproperty --dds-input-addon-error-background - The background color of the error input addon. Default is var(--dds-background-ui-negative-enabled).\n \n @event {{ value: string }} dds-change - Fired when the input value changes.\n * @event {{ value: string }} dds-input - Fired when the input value changes.\n * @event {{ value: string, originalEvent: Event }} dds-keydown - Fired when a key is pressed down.\n * @event {{ void }} dds-blur - Fired when the input loses focus.\n * @event {{ void }} dds-focus - Emitted when the input gains focus.\n \n @slot postfix - The postfix of the input.\n * @slot prefix - The prefix of the input.\n * @slot addon-before - The addon before the input.\n * @slot addon-after - The addon after the input.\n * @slot feedback-icon - The custom icon of the feedback.\n \n @csspart base - The main input container.\n * @csspart input - The input element.\n * @csspart label - The label of the input.\n * @csspart description - The description of the input.\n * @csspart feedback - The feedback of the input.\n * @csspart tooltip - The tooltip of the input.\n * @csspart addon-before - The addon before the input.\n * @csspart addon-after - The addon after the input.\n * @csspart prefix - The prefix of the input.\n * @csspart postfix - The postfix of the input.\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>,\nonDdsKeydown: 'dds-keydown' as EventName<DdsKeydownEvent>,\nonDdsBlur: 'dds-blur' as EventName<DdsBlurEvent>,\nonDdsFocus: 'dds-focus' as EventName<DdsFocusEvent>\n },\n displayName: \"DapDSInput\"\n })\n\n export default reactWrapper\n ","import { createComponent } from '@lit/react'\nimport * as React from 'react'\n\nimport Component from '../../components/label/label.component.js'\n\nconst tagName = 'dap-ds-label'\n\n/*\n `dap-ds-label`\n * @summary A label is a container for labels intended for general use. It contains a label text, description, and tooltip.\n * @element dap-ds-label\n * @title - Label\n \n @property {string} label - The label text\n * @property {string} description - The description of the label\n * @property {string} tooltip - The tooltip text\n * @property {'xs' \| 'sm' \| 'lg'} size - The size of the input. Default is `sm`.\n * @property {'top' \| 'right' \| 'bottom' \| 'left'} tooltipPlacement - The tooltip placement of the label.\n * @property {boolean} optional - If the label is optional. Default value is `false`.\n * @property {string} optionalLabel - Label of optional text\n * @property {boolean} subtle - Text weight of label. If true the label is subtle. Default value is `false`.\n * @property {boolean} disabled - The disabled state of the label. Default is `false`.\n * @property {boolean} required - The required state of the label. Default is `false`.\n \n @csspart base - The main label container.\n * @csspart label - Tha main label container. dap-ds-form-label element.\n * @csspart label-base - The label text.\n * @csspart label-required - The required indicator of the label.\n * @csspart label-optional - The optional indicator of the label.\n * @csspart tooltip - The tooltip of the label. dap-ds-tooltip element.\n * @csspart description - The description of the label.\n \n @cssproperty {string} --dds-label-background - The background color of the label container. Default is `var(--dds-background-neutral-subtle)`.\n * @cssproperty {string} --dds-label-border-color - The border color of the label container. Default is `var(--dds-border-neutral-subtle)`.\n * @cssproperty {string} --dds-label-border-width - The border width of the label container. Default is `var(--dds-border-width-base)`.\n * @cssproperty {string} --dds-label-border-radius - The border radius of the label container. Default is `var(--dds-radius-base)`.\n * @cssproperty {string} --dds-label-padding - The padding of the label container. Default is `var(--dds-spacing-400)`.\n * @cssproperty {string} --dds-label-disabled-background - The background color of the label container when disabled. Default is `var(--dds-background-neutral-disabled-inverted)`.\n * @cssproperty {string} --dds-label-checked-border-color - The border color of the label container when checked. Default is `var(--dds-background-brand-base-inverted)`.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'DapDSLabel',\n})\n\nexport default reactWrapper\n","\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/link/link.component.js'\n import type { DdsClickEvent } from '../../events/events'\n export type { DdsClickEvent } from '../../events/events'\n\n const tagName = 'dap-ds-link'\n\n /*\n `dap-ds-link`\n * @summary A link is a reference to a web resource.\n * @element dap-ds-link\n * @title - Link\n \n @event {{ event: Event }} dds-click - Emitted when the link is clicked.\n \n @slot - The text of the link.\n \n @csspart base - The main link container.\n * @csspart text - The text of the link.\n \n @cssproperty --dds-link-color - The color of the link text\n * @cssproperty --dds-link-hover-color - The color of the link text on hover\n * @cssproperty --dds-link-active-color - The color of the link text when active\n * @cssproperty --dds-link-visited-color - The color of the visited link text\n * @cssproperty --dds-link-font-size - The font size of the link text\n * @cssproperty --dds-link-line-height - The line height of the link text\n * @cssproperty --dds-link-font-weight - The font weight of the link text\n * @cssproperty --dds-link-text-decoration - The text decoration of the link\n \n @cssproperty --dds-link-neutral-color - The color of the neutral variant link\n * @cssproperty --dds-link-neutral-hover-color - The hover color of the neutral variant link\n * @cssproperty --dds-link-neutral-active-color - The active color of the neutral variant link\n * @cssproperty --dds-link-neutral-visited-color - The visited color of the neutral variant link\n \n @cssproperty --dds-link-brand-color - The color of the brand variant link\n * @cssproperty --dds-link-brand-hover-color - The hover color of the brand variant link\n * @cssproperty --dds-link-brand-active-color - The active color of the brand variant link\n * @cssproperty --dds-link-brand-visited-color - The visited color of the brand variant link\n \n @cssproperty --dds-link-inverted-color - The color of the inverted variant link\n * @cssproperty --dds-link-inverted-hover-color - The hover color of the inverted variant link\n * @cssproperty --dds-link-inverted-active-color - The active color of the inverted variant link\n * @cssproperty --dds-link-inverted-visited-color - The visited color of the inverted variant link\n \n @cssproperty --dds-link-warning-color - The color of the warning variant link\n * @cssproperty --dds-link-warning-hover-color - The hover color of the warning variant link\n * @cssproperty --dds-link-warning-active-color - The active color of the warning variant link\n * @cssproperty --dds-link-warning-visited-color - The visited color of the warning variant link\n \n @cssproperty --dds-link-disabled-color - The color of the disabled link\n * @cssproperty --dds-link-disabled-hover-color - The hover color of the disabled link\n * @cssproperty --dds-link-disabled-active-color - The active color of the disabled link\n * @cssproperty --dds-link-disabled-visited-color - The visited color of the disabled link\n \n @cssproperty --dds-link-lg-font-size - The font size of the large link\n * @cssproperty --dds-link-lg-line-height - The line height of the large link\n * @cssproperty --dds-link-md-font-size - The font size of the medium link\n * @cssproperty --dds-link-md-line-height - The line height of the medium link\n * @cssproperty --dds-link-sm-font-size - The font size of the small link\n * @cssproperty --dds-link-sm-line-height - The line height of the small link\n * @cssproperty --dds-link-xs-font-size - The font size of the extra small link\n * @cssproperty --dds-link-xs-line-height - The line height of the extra small link\n \n @cssproperty --dds-link-normal-font-weight - The font weight of the normal link\n * @cssproperty --dds-link-bold-font-weight - The font weight of the bold link\n \n @cssproperty --dds-link-no-underline-text-decoration - The text decoration when underline is removed\n /\n const reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {\n onDdsClick: 'dds-click' as EventName<DdsClickEvent>\n },\n displayName: \"DapDSLink\"\n })\n\n export default reactWrapper\n ","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/list-item/list-item.component.js'\n\nconst tagName = 'dap-ds-list-item'\n\n/*\n `dap-ds-list-item` is a custom banner component.\n * @element dap-ds-list-item\n * @summary A list\n * @title - List item\n \n @slot - The content of the list item.\n * @slot icon - The icon of the list item.\n * @slot title - The title of the list item.\n * @slot actions - The actions of the list item.\n \n @csspart base - The main list item container.\n * @csspart icon - The icon of the list item.\n * @csspart title - The title of the list item.\n * @csspart description - The description of the list item.\n * @csspart container - The container of the list item.\n \n @cssproperty --dds-list-item-gap - Gap between list item elements (default: var(--dds-spacing-200))\n * @cssproperty --dds-list-item-content-gap - Gap between content elements (default: var(--dds-spacing-200))\n * @cssproperty --dds-list-item-horizontal-gap - Gap for horizontal alignment (default: var(--dds-spacing-300))\n * @cssproperty --dds-list-item-vertical-gap - Gap for vertical alignment (default: var(--dds-spacing-200))\n * @cssproperty --dds-list-item-icon-size - Size of the icon (default: var(--dds-spacing-600))\n * @cssproperty --dds-list-item-number-size - Size of the number icon (default: 20px)\n * @cssproperty --dds-list-item-actions-gap - Gap between action elements (default: var(--dds-spacing-400))\n * @cssproperty --dds-list-item-actions-padding - Padding for the actions container (default: var(--dds-spacing-100))\n \n @cssproperty --dds-list-item-background-base - Background color for base shade (default: var(--dds-background-neutral-base))\n * @cssproperty --dds-list-item-background-subtle - Background color for subtle shade (default: var(--dds-background-neutral-subtle))\n * @cssproperty --dds-list-item-background-medium - Background color for medium shade (default: var(--dds-background-neutral-medium))\n * @cssproperty --dds-list-item-background-strong - Background color for strong shade (default: var(--dds-background-neutral-strong))\n \n @cssproperty --dds-list-item-icon-brand - Color for brand icon (default: var(--dds-icon-brand-subtle))\n * @cssproperty --dds-list-item-icon-neutral - Color for neutral icon (default: var(--dds-icon-neutral-base))\n * @cssproperty --dds-list-item-icon-positive - Color for positive icon (default: var(--dds-icon-positive-subtle))\n * @cssproperty --dds-list-item-icon-negative - Color for negative icon (default: var(--dds-icon-negative-subtle))\n \n @cssproperty --dds-list-item-title-color - Title text color (default: var(--dds-text-neutral-strong))\n * @cssproperty --dds-list-item-description-color - Description text color (default: var(--dds-text-neutral-base))\n * @cssproperty --dds-list-item-number-text-color - Number text color (default: var(--dds-text-neutral-inverted))\n \n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'DapDSListItem',\n})\n\nexport default reactWrapper\n","\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/modal/modal.component.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'\nimport type { DdsOkEvent } from '../../events/events'\nimport type { DdsCancelEvent } 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'\nexport type { DdsOkEvent } from '../../events/events'\nexport type { DdsCancelEvent } from '../../events/events'\n\n const tagName = 'dap-ds-modal'\n\n /*\n `dap-ds-modal`\n * @summary A modal is a container for modal content.\n * @element dap-ds-modal\n * @title - Modal\n \n @property {boolean} open - The open state of the modal.\n * @property {boolean} fullScreen - The full screen version of the modal.\n * @property {boolean} wideFooter - Wide layout mode for footer.\n * @property {boolean} bottomFooter - Pushes the footer to bottom.\n * @property {boolean} closeOnEsc - Whether the modal should close on pressing the escape key. Default is true.\n * @property {boolean} closeOnOverlayClick - Whether the modal should close on clicking the overlay. Default is true.\n * @property {string} closeButton - Whether the modal should have a close button. Default is true.\n * @property {string} title - The title of the modal.\n * @property {string} description - The description of the modal.\n * @property {string} okButtonLabel - The label of the OK button.\n * @property {string} cancelButtonLabel - The label of the Cancel button.\n * @property {boolean} okButtonDisabled - Whether the OK button should be disabled.\n * @property {boolean} cancelButtonDisabled - Whether the Cancel button should be disabled.\n * @property {boolean} cancelButtonDanger - Whether the Cancel button should be a danger button.\n * @property {boolean} okButtonDanger - Whether the OK button should be a danger button.\n * @property {boolean} hideOkButton - Whether the OK button should be hidden.\n * @property {boolean} hideCancelButton - Whether the Cancel button should be hidden.\n * @property {string} footer - Whether the modal should have a footer. Default is true.\n * @property {string} header - Whether the modal should have a header. Default is true.\n * @property {boolean} useNativeFocus - Whether the modal should use native focus. Default is false.\n \n @event {{ void }} dds-before-open - Fires before the modal opens.\n * @event {{ void }} dds-opened - Fires after the modal opens.\n * @event {{ void }} dds-before-close - Fires before the modal closes.\n * @event {{ void }} dds-closed - Fires after the modal closed.\n * @event {{ void }} dds-close - Fires when the modal is closes. You can prevent the modal from closing by calling `event.preventDefault()`.\n * @event {{ void }} dds-ok - Fires when the OK button is clicked. You can prevent the modal from closing by calling `event.preventDefault()`.\n * @event {{ void }} dds-cancel - Fires when the Cancel button is clicked. You can prevent the modal from closing by calling `event.preventDefault()`.\n \n @slot - The content of the modal.\n * @slot title - The title of the modal.\n * @slot description - The description of the modal.\n * @slot footer - The footer of the modal.\n \n @csspart base - The main modal container.\n * @csspart panel - The panel of the modal.\n * @csspart header - The header of the modal.\n * @csspart title - The title of the modal.\n * @csspart description - The description of the modal.\n * @csspart footer - The footer of the modal.\n * @csspart content - The body of the modal.\n * @csspart closebutton - The close button of the modal.\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 - Padding inside the modal. Default: var(--dds-spacing-800).\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 - Margin below the header. Default: var(--dds-spacing-800).\n * @cssproperty --dds-modal-footer-margin - Margin above the footer. Default: var(--dds-spacing-400).\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 \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>,\nonDdsOk: 'dds-ok' as EventName<DdsOkEvent>,\nonDdsCancel: 'dds-cancel' as EventName<DdsCancelEvent>\n },\n displayName: \"DapDSModal\"\n })\n\n export default reactWrapper\n ","import { createComponent } from '@lit/react'\nimport * as React from 'react'\n\nimport Component from '../../components/notification-badge/notification-badge.component.js'\n\nconst tagName = 'dap-ds-notification-badge'\n\n/*\n `dap-ds-notification-badge`\n * @summary 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.\n * @element dap-ds-notification-badge\n * @title - Notification badge\n \n @slot - The content of the notification badge.\n \n @csspart base - The main container of the notification badge.\n * @csspart noty - The notification badge container.\n \n @cssproperty --dds-notification-badge-size - Controls the overall size of the notification badge\n * @cssproperty --dds-notification-badge-min-width - Minimum width of the notification badge\n * @cssproperty --dds-notification-badge-height - Height of the notification badge\n * @cssproperty --dds-notification-badge-padding - Padding inside the notification badge\n * @cssproperty --dds-notification-badge-border-radius - Border radius of the notification badge\n * @cssproperty --dds-notification-badge-font-size - Font size of the notification badge text\n * @cssproperty --dds-notification-badge-dot-size - Size of the dot variant\n * @cssproperty --dds-notification-badge-color - Text color of the notification badge\n * @cssproperty --dds-notification-badge-neutral-bg - Background color for neutral type\n * @cssproperty --dds-notification-badge-brand-bg - Background color for brand type\n * @cssproperty --dds-notification-badge-info-bg - Background color for info type\n * @cssproperty --dds-notification-badge-positive-bg - Background color for positive type\n * @cssproperty --dds-notification-badge-warning-bg - Background color for warning type\n * @cssproperty --dds-notification-badge-negative-bg - Background color for negative type\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'DapDSNotificationBadge',\n})\n\nexport default reactWrapper\n","\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/number-input/number-input.component.js'\n import type { DdsChangeEvent } from '../../events/events'\nimport type { DdsInputEvent } from '../../events/events'\nimport type { DdsKeydownEvent } from '../../events/events'\nimport type { DdsBlurEvent } from '../../events/events'\nimport type { DdsFocusEvent } from '../../events/events'\n export type { DdsChangeEvent } from '../../events/events'\nexport type { DdsInputEvent } from '../../events/events'\nexport type { DdsKeydownEvent } from '../../events/events'\nexport type { DdsBlurEvent } from '../../events/events'\nexport type { DdsFocusEvent } from '../../events/events'\n\n const tagName = 'dap-ds-number-input'\n\n /*\n `dap-ds-number-input`\n * @summary A number input component.\n * @element dap-ds-number-input\n * @title - Number input\n \n @property {string} label - The label of the input.\n * @property {string} placeholder - The placeholder of the input.\n * @property {string} description - The description of the input.\n * @property {string} tooltip - The tooltip of the input.\n * @property {'top' \| 'right' \| 'bottom' \| 'left'} tooltipPlacement - The tooltip placement of the input.\n * @property {'success' \| 'error'} status - The status of the input. Can be `success` or `error`.\n * @property {'xs' \| 'sm' \| 'sm'} size - The size of the input. Default is `sm`. Can be `sm` or `lg`.\n * @property {string} name - The name of the input.\n * @property {string} value - The value of the input.\n * @property {string} thousandSeparator - The thousand separator of the input.\n * @property {string} decimalSeparator - The decimal separator of the input.\n * @property {number} decimalScale - The decimal scale of the input.\n * @property {string} allowNegative - The allow negative state of the input.\n * @property {string} allowDecimal - The allow decimal state of the input.\n * @property {boolean} disabled - The disabled state of the input. Default is false.\n * @property {boolean} required - The required state of the input. Default is false.\n * @property {boolean} readonly - The readonly state of the input. Default is false.\n * @property {boolean} autofocus - The autofocus state of the input. Default is false.\n * @property {number} min - The minimum value of the number input.\n * @property {number} max - The maximum value of the number input.\n * @property {number} step - The step value of the number input.\n * @property {string} feedback - The feedback of the input.\n * @property {'negative' \| 'positive' \| 'warning'} feedbackType - The feedback type of the input. Can be `negative`, `positive`, or `warning`.\n * @property {boolean} loading - The loading state of the input. Default is false.\n * @property {boolean} optional - The optional state of the input.\n * @property {string} optionalLabel - The optional label of the input.\n * @property {boolean} subtle - The weight of the label. Default is `false`\n * @property {boolean} disableEnter - Disables the enter key from being used to submit the form.\n * @property {boolean} hideControls - Hides the increment and decrement buttons.\n \n @event {{ value: string }} dds-change - Fired when the input value changes.\n * @event {{ value: string }} dds-input - Fired when the input value changes.\n * @event {{ value: string, originalEvent: Event }} dds-keydown - Fired when a key is pressed down.\n * @event {{ void }} dds-blur - Fired when the input loses focus.\n * @event {{ void }} dds-focus - Emitted when the input gains focus.\n \n @slot feedback-icon - The custom icon of the feedback.\n \n @cssproperty --dds-input-height - The height of the input. Default is var(--dds-spacing-1000).\n * @cssproperty --dds-input-padding - The padding of the input. Default is var(--dds-spacing-300).\n * @cssproperty --dds-input-font-size - The font size of the input. Default is var(--dds-font-base).\n * @cssproperty --dds-input-border-color - The border color of the input. Default is var(--dds-border-neutral-base).\n * @cssproperty --dds-input-background-color - The background color of the input. Default is var(--dds-fields-background-default).\n * @cssproperty --dds-input-text-color - The text color of the input. Default is var(--dds-text-neutral-base).\n * @cssproperty --dds-input-border-radius - The border radius of the input. Default is var(--dds-radius-base).\n * @cssproperty --dds-input-border-width - The border width of the input. Default is var(--dds-border-width-base).\n * @cssproperty --dds-input-disabled-background - The background color of the disabled input. Default is var(--dds-fields-background-disabled).\n * @cssproperty --dds-input-disabled-text - The text color of the disabled input. Default is var(--dds-text-neutral-disabled).\n * @cssproperty --dds-input-readonly-background - The background color of the readonly input. Default is var(--dds-fields-background-read-only).\n * @cssproperty --dds-input-readonly-text - The text color of the readonly input. Default is var(--dds-text-neutral-subtle).\n * @cssproperty --dds-input-success-border - The border color of the success input. Default is var(--dds-border-positive-base).\n * @cssproperty --dds-input-error-border - The border color of the error input. Default is var(--dds-border-negative-base).\n * @cssproperty --dds-input-addon-background - The background color of the input addon. Default is var(--dds-background-ui-neutral-enabled).\n * @cssproperty --dds-input-addon-success-background - The background color of the success input addon. Default is var(--dds-background-ui-positive-enabled).\n * @cssproperty --dds-input-addon-error-background - The background color of the error input addon. Default is var(--dds-background-ui-negative-enabled).\n \n @csspart postfix - The postfix of the input.\n * @csspart decrement - The decrement button of the input.\n * @csspart increment - The increment button of the input.\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>,\nonDdsKeydown: 'dds-keydown' as EventName<DdsKeydownEvent>,\nonDdsBlur: 'dds-blur' as EventName<DdsBlurEvent>,\nonDdsFocus: 'dds-focus' as EventName<DdsFocusEvent>\n },\n displayName: \"DapDSNumberInput\"\n })\n\n export default reactWrapper\n ","\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/official-website-banner/official-website-banner.component.js'\n import type { DdsOpenedEvent } from '../../events/events'\nimport type { DdsClosedEvent } from '../../events/events'\n export type { DdsOpenedEvent } from '../../events/events'\nexport type { DdsClosedEvent } from '../../events/events'\n\n const tagName = 'dap-ds-official-website-banner'\n\n /*\n `dap-ds-official-website-banner`\n * @element dap-ds-official-website-banner\n * @summary An official website banner is a banner that displays that the website is an official website.\n * @title - Official website banner\n \n @property { 'sm' \| 'lg' } size - The size of the official website banner. Default is `sm`.\n * @property { 1 \| 2 \| 3 \| 4 \| 5 \| 6 } headingLevel - The heading level of the accordion. Default is `4`.\n * @property {boolean} opened - Whether the accordion is opened. Default is `false`.\n * @property { 'left' \| 'right' } iconLocation - The location of the icon. Default is `right`.\n * @property { 'default' \| 'collapsed' \| 'clean' \| 'clean-collapsed' } variant - The variant of the accordion.\n * @property {boolean} lastItem - Whether the accordion is the last item.\n \n @event {{ void }} dds-opened - Event fired when the accordion is opened.\n * @event {{ void }} dds-closed - Event fired when the accordion is closed.\n \n @slot default - The content of the accordion.\n * @slot heading - The heading of the accordion.\n * @slot icon-opened - The icon when the accordion is opened.\n * @slot icon-closed - The icon when the accordion is closed.\n \n @csspart base - The main accordion container.\n * @csspart heading - The heading of the accordion.\n * @csspart button - The button of the accordion.\n * @csspart content - The content of the accordion.\n * @csspart content-container - The container of the accordion content.\n * @csspart icon-wrapper - The icon wrapper of the accordion.\n * @csspart open-icon - The icon when the accordion is opened.\n * @csspart open-icon-base - The base of the icon when the accordion is opened.\n * @csspart close-icon - The icon when the accordion is closed.\n * @csspart close-icon-base - The base of the icon when the accordion is closed.\n \n @cssproperty --dds-accordion-border-width - The width of the accordion border (default: var(--dds-border-width-base))\n * @cssproperty --dds-accordion-border-style - The style of the accordion border (default: solid)\n * @cssproperty --dds-accordion-border-radius - The border radius of the accordion (default: var(--dds-radius-base))\n * @cssproperty --dds-accordion-border-color - The color of the accordion border (default: var(--dds-border-neutral-divider))\n * @cssproperty --dds-accordion-background-color - The background color of the accordion (default: var(--dds-background-neutral-subtle))\n * @cssproperty --dds-accordion-text-color - The text color of the accordion (default: var(--dds-text-neutral-strong))\n * @cssproperty --dds-accordion-hover-background - The background color when hovering over the accordion (default: var(--dds-background-neutral-base))\n * @cssproperty --dds-accordion-active-background - The background color when the accordion is active (default: var(--dds-background-neutral-medium))\n * @cssproperty --dds-accordion-icon-background - The background color of the accordion icon (default: var(--dds-transparent-black-subtle))\n * @cssproperty --dds-accordion-icon-color - The color of the accordion icon (default: var(--dds-icon-neutral-base))\n * @cssproperty --dds-accordion-icon-hover-background - The background color of the accordion icon when hovered (default: var(--dds-transparent-black-base))\n * @cssproperty --dds-accordion-icon-active-background - The background color of the accordion icon when active (default: var(--dds-transparent-black-strong))\n * @cssproperty --dds-accordion-icon-hover-color - The color of the accordion icon when hovered (default: var(--dds-icon-neutral-strong))\n * @cssproperty --dds-accordion-icon-active-color - The color of the accordion icon when active (default: var(--dds-icon-neutral-strong))\n * @cssproperty --dds-accordion-content-color - The color of the accordion content (default: var(--dds-text-text-neutral))\n * @cssproperty --dds-accordion-transition-duration - The duration of the accordion transitions (default: var(--dds-transition-fast))\n * @cssproperty --dds-accordion-transition-timing - The timing function of the accordion transitions (default: var(--dds-easing-ease-in-out))\n * @cssproperty --dds-accordion-divider-color - The color of the divider between accordion items (default: var(--dds-border-neutral-divider))\n /\n const reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {\n onDdsOpened: 'dds-opened' as EventName<DdsOpenedEvent>,\nonDdsClosed: 'dds-closed' as EventName<DdsClosedEvent>\n },\n displayName: \"DapDSOfficialWebsiteBanner\"\n })\n\n export default reactWrapper\n ","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/option-item/option-item.component.js'\n\nconst tagName = 'dap-ds-option-item'\n\n/*\n `dap-ds-option-item`\n * @summary An option item is a selectable item in a list of options.\n * @element dap-ds-option-item\n * @title - Option item\n * \n @csspart base - The main option item container.\n * @csspart prefix - The prefix of the option item.\n * @csspart label - The label of the option item.\n * @csspart suffix - The suffix of the option item.\n \n @slot prefix - The prefix of the option item.\n * @slot - The label of the option item.\n * @slot suffix - The suffix of the option item.\n \n @cssproperty --dds-option-item-padding-vertical - The vertical padding of the option item.\n * @cssproperty --dds-option-item-padding-horizontal - The horizontal padding of the option item.\n * @cssproperty --dds-option-item-border-radius - The border radius of the option item.\n * @cssproperty --dds-option-item-color - The text color of the option item.\n * @cssproperty --dds-option-item-hover-bg - The background color of the option item when hovered.\n * @cssproperty --dds-option-item-active-bg - The background color of the option item when active.\n * @cssproperty --dds-option-item-disabled-color - The text color of the option item when disabled.\n * @cssproperty --dds-option-item-high-contrast-border - The border color of the option item in high contrast mode.\n * @cssproperty --dds-option-item-selected-font-weight - The font weight of the option item when selected.\n * @cssproperty --dds-option-item-xs-font-size - The font size of the option item in extra small size.\n * @cssproperty --dds-option-item-lg-font-size - The font size of the option item in large size.\n * @cssproperty --dds-option-item-selected-icon-width - The width of the selected icon.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'DapDSOptionItem',\n})\n\nexport default reactWrapper\n","\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/option-list/option-list.component.js'\n import type { DdsCancelEvent } from '../../events/events'\nimport type { DdsOptionChangeEvent } from '../../events/events'\nimport type { DdsKeydownEvent } from '../../events/events'\n export type { DdsCancelEvent } from '../../events/events'\nexport type { DdsOptionChangeEvent } from '../../events/events'\nexport type { DdsKeydownEvent } from '../../events/events'\n\n const tagName = 'dap-ds-option-list'\n\n /*\n `dap-ds-option-list`\n * @summary An option list is a list of selectable options.\n * @element dap-ds-option-list\n * @title - Option list\n \n @event {{ void }} dds-cancel - Fired when the escape key is pressed.\n * @event {{ option: DapDSOptionItem, value: string, index: number, text: string }} dds-option-change - Fired when the option list value changes.\n * @event {{ void }} dds-keydown - Fired when a key is pressed down.\n \n @csspart base - The main option list container.\n \n @slot - The default slot for the options.\n /\n const reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {\n onDdsCancel: 'dds-cancel' as EventName<DdsCancelEvent>,\nonDdsOptionChange: 'dds-option-change' as EventName<DdsOptionChangeEvent>,\nonDdsKeydown: 'dds-keydown' as EventName<DdsKeydownEvent>\n },\n displayName: \"DapDSOptionList\"\n })\n\n export default reactWrapper\n ","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/overlay/overlay.component.js'\n\nconst tagName = 'dap-ds-overlay'\n\n/*\n `dap-ds-overlay`\n * @summary An overlay is a container for overlay content.\n * @element dap-ds-overlay\n * @title - Overlay\n \n @csspart overlay - The overlay element\n \n @cssproperty --dds-overlay-z-index - Controls the z-index of the overlay (default: 1)\n * @cssproperty --dds-overlay-background-color - Controls the background color of the overlay (default: var(--dds-black-10))\n * @cssproperty --dds-overlay-opacity-closed - Controls the opacity when overlay is closed (default: 0)\n * @cssproperty --dds-overlay-opacity-open - Controls the opacity when overlay is open (default: 1)\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'DapDSOverlay',\n})\n\nexport default reactWrapper\n","\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/pager/pager.component.js'\n import type { DdsPaginationChangeEvent } from '../../events/events'\n export type { DdsPaginationChangeEvent } from '../../events/events'\n\n const tagName = 'dap-ds-pager'\n\n /*\n `dap-ds-pager`\n * @summary A pager is a component that displays pagination controls.\n * @element dap-ds-pager\n * @title - Pager\n \n @event {{ action: string, pagination: { pageIndex: number, pageSize: number } }} dds-pagination-change - Event fired when the pagination changes\n \n @csspart base - The main pager container.\n * @csspart first - The first page button.\n * @csspart previous - The previous page button.\n * @csspart next - The next page button.\n * @csspart last - The last page button.\n \n @cssproperty --dds-pager-spacing-vertical - The vertical spacing of the pager.\n * @cssproperty --dds-pager-spacing-horizontal - The horizontal spacing of the pager.\n * @cssproperty --dds-pager-button-padding - The padding of the pager buttons.\n * @cssproperty --dds-pager-button-border-width - The border width of the pager buttons.\n * @cssproperty --dds-pager-button-border-color - The border color of the pager buttons.\n * @cssproperty --dds-pager-button-border-radius - The border radius of the pager buttons.\n * @cssproperty --dds-pager-button-background - The background color of the pager buttons.\n * @cssproperty --dds-pager-button-font-size - The font size of the pager buttons.\n * @cssproperty --dds-pager-button-font-weight - The font weight of the pager buttons.\n /\n const reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {\n onDdsPaginationChange: 'dds-pagination-change' as EventName<DdsPaginationChangeEvent>\n },\n displayName: \"DapDSPager\"\n })\n\n export default reactWrapper\n ","\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/password-input/password-input.component.js'\n import type { DdsChangeEvent } from '../../events/events'\nimport type { DdsInputEvent } from '../../events/events'\nimport type { DdsKeydownEvent } from '../../events/events'\nimport type { DdsBlurEvent } from '../../events/events'\nimport type { DdsFocusEvent } from '../../events/events'\n export type { DdsChangeEvent } from '../../events/events'\nexport type { DdsInputEvent } from '../../events/events'\nexport type { DdsKeydownEvent } from '../../events/events'\nexport type { DdsBlurEvent } from '../../events/events'\nexport type { DdsFocusEvent } from '../../events/events'\n\n const tagName = 'dap-ds-password-input'\n\n /*\n `dap-ds-password-input`\n * @summary A password input a field for entering a password.\n * @element dap-ds-password-input\n * @title - Password input\n \n @property {string} label - The label of the password input.\n * @property {string} placeholder - The placeholder of the password input.\n * @property {string} description - The description of the password input.\n * @property {string} tooltip - The tooltip of the password input.\n * @property {'top' \| 'right' \| 'bottom' \| 'left'} tooltipPlacement - The tooltip placement of the input.\n * @property {string} status - The status of the password input. Can be `success` or `error`.\n * @property {'xs' \| 'sm' \| 'sm'} size - The size of the password input. Default is `sm`.\n * @property {string} name - The name of the password input.\n * @property {string} value - The value of the password input.\n * @property {boolean} disabled - The disabled state of the password input. Default is false.\n * @property {boolean} required - The required state of the password input. Default is false.\n * @property {boolean} readonly - The readonly state of the password input. Default is false.\n * @property {boolean} autofocus - The autofocus state of the password input. Default is false.\n * @property {string} feedback - The feedback of the input.\n * @property {'negative' \| 'positive' \| 'warning'} feedbackType - The feedback type of the input. Can be `negative`, `positive`, or `warning`.\n * @property {boolean} loading - The loading state of the password input. Default is false.\n * @property {boolean} optional - The optional state of the password input.\n * @property {string} optionalLabel - The optional label of the password input.\n * @property {boolean} subtle - The weight of the label. Default is `false`\n \n @event {{ value: string }} dds-change - Fired when the input value changes.\n * @event {{ value: string }} dds-input - Fired when the input value changes.\n * @event {{ value: string, originalEvent: Event }} dds-keydown - Fired when a key is pressed down.\n * @event {{ void }} dds-blur - Fired when the input loses focus.\n * @event {{ void }} dds-focus - Emitted when the input gains focus.\n \n @cssproperty --dds-input-height - The height of the input. Default is var(--dds-spacing-1000).\n * @cssproperty --dds-input-padding - The padding of the input. Default is var(--dds-spacing-300).\n * @cssproperty --dds-input-font-size - The font size of the input. Default is var(--dds-font-base).\n * @cssproperty --dds-input-border-color - The border color of the input. Default is var(--dds-border-neutral-base).\n * @cssproperty --dds-input-background-color - The background color of the input. Default is var(--dds-fields-background-default).\n * @cssproperty --dds-input-text-color - The text color of the input. Default is var(--dds-text-neutral-base).\n * @cssproperty --dds-input-border-radius - The border radius of the input. Default is var(--dds-radius-base).\n * @cssproperty --dds-input-border-width - The border width of the input. Default is var(--dds-border-width-base).\n * @cssproperty --dds-input-disabled-background - The background color of the disabled input. Default is var(--dds-fields-background-disabled).\n * @cssproperty --dds-input-disabled-text - The text color of the disabled input. Default is var(--dds-text-neutral-disabled).\n * @cssproperty --dds-input-readonly-background - The background color of the readonly input. Default is var(--dds-fields-background-read-only).\n * @cssproperty --dds-input-readonly-text - The text color of the readonly input. Default is var(--dds-text-neutral-subtle).\n * @cssproperty --dds-input-success-border - The border color of the success input. Default is var(--dds-border-positive-base).\n * @cssproperty --dds-input-error-border - The border color of the error input. Default is var(--dds-border-negative-base).\n * @cssproperty --dds-input-addon-background - The background color of the input addon. Default is var(--dds-background-ui-neutral-enabled).\n * @cssproperty --dds-input-addon-success-background - The background color of the success input addon. Default is var(--dds-background-ui-positive-enabled).\n * @cssproperty --dds-input-addon-error-background - The background color of the error input addon. Default is var(--dds-background-ui-negative-enabled).\n \n @csspart postfix - The postfix of the password input.\n * @csspart password-input - The password input.\n * @csspart password-input--visible - The visible password input.\n * @csspart icon - The icon of the password input.\n * @csspart icon-base - The base of the icon.\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>,\nonDdsKeydown: 'dds-keydown' as EventName<DdsKeydownEvent>,\nonDdsBlur: 'dds-blur' as EventName<DdsBlurEvent>,\nonDdsFocus: 'dds-focus' as EventName<DdsFocusEvent>\n },\n displayName: \"DapDSPasswordInput\"\n })\n\n export default reactWrapper\n ","\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/popup/popup.component.js'\n import type { DdsOpenedEvent } from '../../events/events'\nimport type { DdsClosedEvent } from '../../events/events'\n export type { DdsOpenedEvent } from '../../events/events'\nexport type { DdsClosedEvent } from '../../events/events'\n\n const tagName = 'dap-ds-popup'\n\n /*\n `dap-ds-popup`\n * @summary A popup is a container for popup content.\n * @element dap-ds-popup\n * @title - Popup\n \n @property {'xs' \| 'sm' \| 'lg'} size - The size of the popup.\n \n @event {{ void }} dds-opened - Fired when the popup is opened.\n * @event {{ void }} dds-closed - Fired when the popup is closed.\n \n @slot trigger - The trigger of the popup.\n * @slot - The content of the popup.\n \n @csspart popup - The main popup container.\n * @csspart arrow - The arrow of the popup.\n \n @cssproperty --dds-popup-z-index - Z-index of the popup.\n * @cssproperty --dds-popup-padding - Default padding of the popup.\n * @cssproperty --dds-popup-padding-xs - Padding of the popup when size is xs.\n * @cssproperty --dds-popup-padding-lg - Padding of the popup when size is lg.\n * @cssproperty --dds-popup-border-width - Border width of the popup.\n * @cssproperty --dds-popup-border-radius - Border radius of the popup.\n * @cssproperty --dds-popup-border-color - Border color of the popup.\n * @cssproperty --dds-popup-background - Background color of the popup.\n * @cssproperty --dds-popup-color - Text color of the popup.\n * @cssproperty --dds-popup-arrow-size - Size of the popup arrow.\n /\n const reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {\n onDdsOpened: 'dds-opened' as EventName<DdsOpenedEvent>,\nonDdsClosed: 'dds-closed' as EventName<DdsClosedEvent>\n },\n displayName: \"DapDSPopup\"\n })\n\n export default reactWrapper\n ","\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/radio-button/radio-button.component.js'\n import type { DdsChangeEvent } from '../../events/events'\nimport type { DdsBlurEvent } from '../../events/events'\nimport type { DdsFocusEvent } from '../../events/events'\nimport type { DdsInputEvent } from '../../events/events'\n export type { DdsChangeEvent } from '../../events/events'\nexport type { DdsBlurEvent } from '../../events/events'\nexport type { DdsFocusEvent } from '../../events/events'\nexport type { DdsInputEvent } from '../../events/events'\n\n const tagName = 'dap-ds-radio-button'\n\n /*\n `dap-ds-radio-button`\n * @summary A radio button is a graphical control element that allows the user to choose only one of a predefined set of mutually exclusive options.\n * @element dap-ds-radio-button\n * @title - Radio button\n \n @property {string} name - The name of the radio button.\n * @property {string} value - The value of the radio button.\n * @property {boolean} checked - The checked state of the radio button.\n * @property {string} label - The label of the radio button.\n * @property {string} description - The description of the radio button.\n * @property {'xs', 'sm' \| 'md' \| 'lg'} size - The size of the radio button.\n * @property {boolean} disabled - The disabled state of the radio button.\n * @property {boolean} required - The required state of the radio button.\n * @property {'left' \| 'right'} labelPlacement - The placement of the label.\n * @property {'top' \| 'bottom'} descriptionPlacement - The placement of the description.\n \n @event {{ value: string }} dds-change - Fired when the radio button is checked.\n * @event {{ void }} dds-blur - Emitted when the radio button loses focus.\n * @event {{ void }} dds-focus - Emitted when the radio button gains focus.\n * @event {{ value: string }} dds-input - Emitted when the radio button receives input.\n \n @csspart base - The main radio button container.\n * @csspart wrapper - The wrapper of the radio button.\n * @csspart baselabel - The main label container\n * @csspart label - The label of the radio button.\n * @csspart input - The native input of the radio button.\n * @csspart control - The control of the radio button.\n * @csspart description - The description of the radio button.\n \n @cssproperty --dds-radio-size - Sets the size of the radio button. Default: var(--dds-spacing-600)\n * @cssproperty --dds-radio-border-width - Sets the border width of the radio button. Default: var(--dds-border-width-large)\n * @cssproperty --dds-radio-border-radius - Sets the border radius of the radio button. Default: var(--dds-radius-rounded)\n * @cssproperty --dds-radio-border-color - Sets the border color of the radio button. Default: var(--dds-border-neutral-base)\n * @cssproperty --dds-radio-background-color - Sets the background color of the radio button. Default: var(--dds-background-neutral-base)\n * @cssproperty --dds-radio-hover-border-color - Sets the border color of the radio button on hover. Default: var(--dds-border-neutral-medium)\n * @cssproperty --dds-radio-hover-background-color - Sets the background color of the radio button on hover. Default: var(--dds-background-neutral-medium)\n * @cssproperty --dds-radio-active-border-color - Sets the border color of the radio button when active. Default: var(--dds-border-neutral-strong)\n * @cssproperty --dds-radio-active-background-color - Sets the background color of the radio button when active. Default: var(--dds-background-neutral-strong)\n * @cssproperty --dds-radio-checked-background-color - Sets the background color of the checked radio button. Default: var(--dds-background-brand-base-inverted)\n * @cssproperty --dds-radio-checked-hover-background-color - Sets the background color of the checked radio button on hover. Default: var(--dds-background-brand-medium-inverted)\n * @cssproperty --dds-radio-checked-active-background-color - Sets the background color of the checked radio button when active. Default: var(--dds-background-brand-strong-inverted)\n * @cssproperty --dds-radio-disabled-background-color - Sets the background color of the disabled radio button. Default: var(--dds-background-neutral-disabled)\n * @cssproperty --dds-radio-icon-background-color - Sets the background color of the radio button icon. Default: var(--dds-transparent-white-strong-static)\n * @cssproperty --dds-radio-disabled-icon-background-color - Sets the background color of the disabled radio button icon. Default: var(--dds-background-neutral-stronger)\n * @cssproperty --dds-radio-invalid-border-color - Sets the border color of the invalid radio button. Default: var(--dds-border-negative-base)\n * @cssproperty --dds-radio-invalid-background-color - Sets the background color of the invalid radio button. Default: var(--dds-background-negative-base)\n * @cssproperty --dds-radio-invalid-hover-border-color - Sets the border color of the invalid radio button on hover. Default: var(--dds-border-negative-medium)\n * @cssproperty --dds-radio-invalid-hover-background-color - Sets the background color of the invalid radio button on hover. Default: var(--dds-background-negative-medium)\n * @cssproperty --dds-radio-invalid-active-border-color - Sets the border color of the invalid radio button when active. Default: var(--dds-border-negative-strong)\n * @cssproperty --dds-radio-invalid-active-background-color - Sets the background color of the invalid radio button when active. Default: var(--dds-background-negative-strong)\n * @cssproperty --dds-radio-invalid-checked-background-color - Sets the background color of the invalid checked radio button. Default: var(--dds-background-negative-base-inverted)\n * @cssproperty --dds-radio-invalid-checked-hover-background-color - Sets the background color of the invalid checked radio button on hover. Default: var(--dds-background-negative-medium-inverted)\n * @cssproperty --dds-radio-invalid-checked-active-background-color - Sets the background color of the invalid checked radio button when active. Default: var(--dds-background-negative-strong-inverted)\n * @cssproperty --dds-radio-icon-size - Sets the size of the radio button icon. Default: var(--dds-spacing-300)\n /\n const reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {\n onDdsChange: 'dds-change' as EventName<DdsChangeEvent>,\nonDdsBlur: 'dds-blur' as EventName<DdsBlurEvent>,\nonDdsFocus: 'dds-focus' as EventName<DdsFocusEvent>,\nonDdsInput: 'dds-input' as EventName<DdsInputEvent>\n },\n displayName: \"DapDSRadioButton\"\n })\n\n export default reactWrapper\n ","\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/rating/rating.component.js'\n import type { DdsChangeEvent } from '../../events/events'\n export type { DdsChangeEvent } from '../../events/events'\n\n const tagName = 'dap-ds-rating'\n\n /*\n `dap-ds-rating`\n * @summary Rating is a component that allows users to rate a product or service.\n * @element dap-ds-rating\n * @title - Rating\n \n @event {{ value: number }} dds-change - Event fired when the rating value changes.\n \n @csspart base - The main rating container.\n * @csspart star - The star element.\n * @csspart stars-container - The container of the stars.\n * @csspart icon - The icon of the star.\n /\n const reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {\n onDdsChange: 'dds-change' as EventName<DdsChangeEvent>\n },\n displayName: \"DapDSRating\"\n })\n\n export default reactWrapper\n ","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/scroll-area/scroll-area.component.js'\n\nconst tagName = 'dap-ds-scroll-area'\n\n/*\n `dap-ds-scroll-area`\n * @summary A component that provides a customizable scrollable area with a custom scrollbar.\n * @element dap-ds-scroll-area\n * @title - Scroll area\n \n @slot - The content to be scrolled\n \n @csspart viewport - The viewport element that contains the scrollable content\n * @csspart scrollbar - The scrollbar container\n * @csspart corner - The corner between vertical and horizontal scrollbars\n \n @cssprop --dds-scroll-area-radius - The border radius of the scroll area and its elements (default: var(--dds-radius-base))\n * @cssprop --dds-scroll-area-background - The background color of the scroll area (default: var(--dds-background-neutral-base))\n * @cssprop --dds-scroll-area-scrollbar-background - The background color of the scrollbar (default: var(--dds-background-neutral-subtle))\n * @cssprop --dds-scroll-area-thumb-background - The background color of the scrollbar thumb (default: var(--dds-background-neutral-interactive))\n * @cssprop --dds-scroll-area-thumb-hover-background - The background color of the scrollbar thumb on hover (default: var(--dds-background-neutral-interactive-hover))\n * @cssprop --dds-scroll-area-thumb-active-background - The background color of the scrollbar thumb when active (default: var(--dds-background-neutral-interactive-active))\n * @cssprop --dds-scroll-area-transition - The transition timing for scrollbar interactions (default: var(--dds-transition-fast) var(--dds-easing-ease-out))\n * @cssprop --dds-scroll-area-scrollbar-size - The width/height of the scrollbar (default: 10px)\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'DapDSScrollArea',\n})\n\nexport default reactWrapper\n","\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/search/search.component.js'\n import type { DdsChangeEvent } from '../../events/events'\nimport type { DdsBlurEvent } from '../../events/events'\nimport type { DdsFocusEvent } from '../../events/events'\nimport type { DdsClearEvent } from '../../events/events'\nimport type { DdsSearchEvent } from '../../events/events'\nimport type { DdsInputEvent } from '../../events/events'\n export type { DdsChangeEvent } from '../../events/events'\nexport type { DdsBlurEvent } from '../../events/events'\nexport type { DdsFocusEvent } from '../../events/events'\nexport type { DdsClearEvent } from '../../events/events'\nexport type { DdsSearchEvent } from '../../events/events'\nexport type { DdsInputEvent } from '../../events/events'\n\n const tagName = 'dap-ds-search'\n\n /*\n `dap-ds-search`\n * @summary A select is a form element that allows the user to select one option from a set.\n * @element dap-ds-search\n * @title - Search\n \n @event dds-change - Fired when the search value changes.\n * @event dds-blur - Emitted when the search loses focus.\n * @event dds-focus - Emitted when the search gains focus.\n * @event dds-clear - Emitted when the search is cleared.\n * @event dds-search - Emitted when the search input value changes.\n * @event dds-input - Emitted when typing happens in the search input.\n \n @property {string} value - The value of the search.\n * @property {string} placeholder - The placeholder of the search.\n * @property { 'top' \| 'top-start' \| 'top-end' \| 'right' \| 'right-start'\| 'right-end' \| 'bottom' \| 'bottom-start' \| 'bottom-end' \| 'left' \| 'left-start' \| 'left-end'} placement - The placement of the select dropdown. Default is 'bottom-start'.\n * @property {boolean} opened - Whether the search dropdown is opened.\n * @property {'width' \| 'height' \| 'both'} sync - The sync mode of the search dropdown. How the dropdown item size is synced to the trigger element'.\n * @property {string} label - The label of the search.\n * @property {string} description - The description of the search.\n * @property {string} tooltip - The tooltip of the search.\n * @property {'xs' \| 'sm' \| 'lg'} size - The size of the search.\n * @property {'none' \| 'typehead' \| 'autocomplete' \| 'manual'} searchMode - The search mode of the select. Default is 'none'.\n * @property {boolean} disabled - Whether the search is disabled.\n * @property {boolean} required - Whether the search is required.\n * @property {boolean} readonly - Whether the search is readonly.\n * @property {boolean} autofocus - Whether the search is autofocus.\n * @property {boolean} clearable - Whether the search is clearable.\n * @property {string} feedback - The feedback content of the search.\n * @property {'error' \| 'warning' \| 'info'} feedbackType - The feedback type of the search.\n * @property {boolean} allowManualInput - Whether the search allows manual input, or free text.\n * @property {boolean} searchForText - Whether the search should search for the selected item text.\n * @property {boolean} noTextComplete - Whether the search should not complete the text.\n * @property {string} searchButtonAriaLabel - The aria label of the search button.\n * @property {boolean} openOnEmpty - Whether the search should open on empty results.\n * @property {string} selectable - Show the selected item check mark in the dropdown. Default is 'false'.\n * @property {boolean} noAnimation - Whether the search open indicator should be animated. Default is true.\n * @property {boolean} subtle - Subtle color version\n \n @cssproperty --dds-combobox-padding-xs - The padding for extra small size. Defaults to var(--dds-spacing-200).\n * @cssproperty --dds-combobox-padding-sm - The padding for small size. Defaults to var(--dds-spacing-200).\n * @cssproperty --dds-combobox-padding-lg - The padding for large size. Defaults to var(--dds-spacing-300).\n * @cssproperty --dds-combobox-padding-horizontal - The horizontal padding. Defaults to var(--dds-spacing-300).\n * @cssproperty --dds-combobox-padding-vertical - The vertical padding. Defaults to var(--dds-spacing-200).\n * @cssproperty --dds-combobox-gap - The gap between elements. Defaults to var(--dds-spacing-100).\n * @cssproperty --dds-combobox-icon-gap - The gap between icons. Defaults to var(--dds-spacing-200).\n * @cssproperty --dds-combobox-action-gap - The gap between action elements. Defaults to var(--dds-spacing-200).\n * @cssproperty --dds-combobox-action-padding - The padding for action elements. Defaults to var(--dds-spacing-300).\n * @cssproperty --dds-combobox-clear-icon-width - The width of the clear icon. Defaults to var(--dds-spacing-800).\n * @cssproperty --dds-combobox-dropdown-icon-right - The right position of the dropdown icon. Defaults to var(--dds-spacing-600).\n * @cssproperty --dds-combobox-min-width - The minimum width of the combobox. Defaults to 7.5rem.\n \n @csspart base - The main search container.\n * @csspart trigger - The trigger button of the search.\n * @csspart label - The label of the search.\n * @csspart description - The description of the search.\n * @csspart feedback - The feedback of the search.\n * @csspart tooltip - The tooltip of the search.\n * @csspart option-list - The option list of the search.\n \n @slot - The default slot for the options.\n \n /\n const reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {\n onDdsChange: 'dds-change' as EventName<DdsChangeEvent>,\nonDdsBlur: 'dds-blur' as EventName<DdsBlurEvent>,\nonDdsFocus: 'dds-focus' as EventName<DdsFocusEvent>,\nonDdsClear: 'dds-clear' as EventName<DdsClearEvent>,\nonDdsSearch: 'dds-search' as EventName<DdsSearchEvent>,\nonDdsInput: 'dds-input' as EventName<DdsInputEvent>\n },\n displayName: \"DapDSSearch\"\n })\n\n export default reactWrapper\n ","\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/select/select.component.js'\n import type { DdsChangeEvent } from '../../events/events'\nimport type { DdsBlurEvent } from '../../events/events'\nimport type { DdsFocusEvent } from '../../events/events'\n export type { DdsChangeEvent } from '../../events/events'\nexport type { DdsBlurEvent } from '../../events/events'\nexport type { DdsFocusEvent } from '../../events/events'\n\n const tagName = 'dap-ds-select'\n\n /*\n `dap-ds-select`\n * @summary A select is a form element that allows the user to select one option from a set.\n * @element dap-ds-select\n * @title - Select\n \n @event {{ value: string }} dds-change - Fired when the select value changes.\n * @event {{ void }} dds-blur - Emitted when the select loses focus.\n * @event {{ void }} dds-focus - Emitted when the select gains focus.\n \n @property {string} value - The value of the select.\n * @property {string} label - The label of the select.\n * @property {string} description - The description of the select.\n * @property {string} tooltip - The tooltip of the select.\n * @property {'top' \| 'right' \| 'bottom' \| 'left'} tooltipPlacement - The tooltip placement of the select.\n * @property {'xs' \| 'sm' \| 'lg'} size - The size of the select. Default is `sm`.\n * @property {boolean} disabled - Whether the select is disabled.\n * @property {boolean} required - Whether the select is required.\n * @property {boolean} readonly - Whether the select is readonly.\n * @property {boolean} autofocus - Whether the select is autofocus.\n * @property {string} feedback - The feedback of the select.\n * @property {negative \| positive \| warning} feedbackType - The feedback type of the select. Can be `negative`, `positive`, or `warning`.\n * @property {string} status - The status of the select. Can be `success` or `error`.\n * @property {boolean} optional - The optional state of the select.\n * @property {string} optionalLabel - The optional label of the select.\n * @property {boolean} subtle - The weight of the label. Default is `false`\n \n @csspart base - The main select container.\n * @csspart trigger - The trigger button of the select.\n * @csspart label - The label of the select.\n * @csspart description - The description of the select.\n * @csspart feedback - The feedback of the select.\n * @csspart tooltip - The tooltip of the select.\n * @csspart option-list - The option list of the select.\n \n @cssproperty --dds-select-min-height - Minimum height of the select component (default: var(--dds-spacing-1000))\n * @cssproperty --dds-select-padding - Padding of the select component (default: var(--dds-spacing-300))\n * @cssproperty --dds-select-column-gap - Column gap of the select component (default: var(--dds-spacing-100))\n * @cssproperty --dds-select-border-color - Border color of the select component (default: var(--dds-border-neutral-base))\n * @cssproperty --dds-select-border-radius - Border radius of the select component (default: var(--dds-radius-base))\n * @cssproperty --dds-select-bg-color - Background color of the select component (default: var(--dds-background-neutral-subtle))\n * @cssproperty --dds-select-text-color - Text color of the select component (default: var(--dds-text-neutral-base))\n * @cssproperty --dds-select-icon-right - Right position of the icon (default: var(--dds-spacing-200))\n * @cssproperty --dds-select-icon-color - Color of the icon (default: var(--dds-icon-neutral-subtle))\n * @cssproperty --dds-select-text-margin-right - Right margin of the text (default: var(--dds-spacing-600))\n * @cssproperty --dds-select-disabled-border-color - Border color when disabled (default: var(--dds-background-neutral-stronger))\n * @cssproperty --dds-select-disabled-bg-color - Background color when disabled (default: var(--dds-background-neutral-stronger))\n * @cssproperty --dds-select-disabled-text-color - Text color when disabled (default: var(--dds-text-neutral-disabled))\n * @cssproperty --dds-select-error-border-color - Border color in error state (default: var(--dds-border-negative-base))\n * @cssproperty --dds-select-success-border-color - Border color in success state (default: var(--dds-border-positive-base))\n * @cssproperty --dds-select-xs-min-height - Minimum height for extra small size (default: var(--dds-spacing-800))\n * @cssproperty --dds-select-xs-padding - Padding for extra small size (default: var(--dds-spacing-200))\n * @cssproperty --dds-select-xs-font-size - Font size for extra small size (default: var(--dds-font-sm))\n * @cssproperty --dds-select-lg-min-height - Minimum height for large size (default: var(--dds-spacing-1200))\n * @cssproperty --dds-select-lg-padding - Padding for large size (default: var(--dds-spacing-400))\n * @cssproperty --dds-select-lg-font-size - Font size for large size (default: var(--dds-font-lg))\n * @cssproperty --dds-select-lg-icon-right - Right position of the icon for large size (default: var(--dds-spacing-300))\n * @cssproperty --dds-select-lg-icon-color - Color of the icon for large size (default: var(--dds-text-icon-neutral-subtle))\n * @cssproperty --dds-select-popup-bg-color - Background color of the popup (default: var(--dds-background-neutral-subtle))\n \n @slot - The option list of the select.\n * @slot indicator-icon - The indicator icon of the select.\n /\n const reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {\n onDdsChange: 'dds-change' as EventName<DdsChangeEvent>,\nonDdsBlur: 'dds-blur' as EventName<DdsBlurEvent>,\nonDdsFocus: 'dds-focus' as EventName<DdsFocusEvent>\n },\n displayName: \"DapDSSelect\"\n })\n\n export default reactWrapper\n ","\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/sidenav/sidenav-group.component.js'\n import type { DdsItemClickEvent } from '../../events/events'\n export type { DdsItemClickEvent } from '../../events/events'\n\n const tagName = 'dap-ds-sidenav-group'\n\n /*\n `dap-ds-sidenav-group`\n * @summary Side navigation group\n * @element dap-ds-sidenav-group\n * @title - Side navigation group\n * @group side-navigation\n \n @event {{ href: string, event: Event }} dds-item-click - Event fired when the side navigation item is clicked.\n \n @slot - The content of the side navigation group.\n * @slot submenu - The submenu of the side navigation group.\n * @slot suffix - The suffix of the side navigation group.\n \n @csspart base - The main side navigation group container.\n * @csspart title - The title of the side navigation group.\n * @csspart link - The link of the side navigation group.\n * @csspart toggle - The toggle button of the side navigation group.\n * @csspart submenu - The submenu of the side navigation group.\n \n @cssproperty --dds-sidenav-group-margin-bottom - Default bottom margin of the sidenav group.\n * @cssproperty --dds-sidenav-group-border-radius - Border radius of the sidenav group.\n * @cssproperty --dds-sidenav-group-spacing-margin - Margin used for spacing variants.\n * @cssproperty --dds-sidenav-group-item-min-height - Minimum height of the sidenav group item.\n * @cssproperty --dds-sidenav-group-item-padding - Padding of the sidenav group item.\n * @cssproperty --dds-sidenav-group-item-color - Text color of the sidenav group item.\n * @cssproperty --dds-sidenav-group-item-font-size - Font size of the sidenav group item.\n * @cssproperty --dds-sidenav-group-item-font-weight - Font weight of the sidenav group item.\n * @cssproperty --dds-sidenav-group-item-bg-active - Background color when the item is active.\n * @cssproperty --dds-sidenav-group-item-bg-hover - Background color on hover and active states.\n * @cssproperty --dds-sidenav-group-toggle-margin - Margin for the toggle button.\n * @cssproperty --dds-sidenav-group-submenu-padding - Padding for the submenu.\n /\n const reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {\n onDdsItemClick: 'dds-item-click' as EventName<DdsItemClickEvent>\n },\n displayName: \"DapDSSideNavGroup\"\n })\n\n export default reactWrapper\n ","\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/sidenav/sidenav-item.component.js'\n import type { DdsItemClickEvent } from '../../events/events'\n export type { DdsItemClickEvent } from '../../events/events'\n\n const tagName = 'dap-ds-sidenav-item'\n\n /*\n `dap-ds-sidenav-item`\n * @summary Side navigation item\n * @element dap-ds-sidenav-item\n * @title - Side navigation item\n * @group side-navigation\n \n @event {{ href: string, event: Event }} dds-item-click - Event fired when the side navigation item is clicked.\n \n @slot - The content of the side navigation item.\n * @slot suffix - The suffix of the side navigation item.\n \n @csspart base - The main side navigation item container.\n * @csspart link - The link of the side navigation item.\n \n @cssproperty --dds-sidenav-item-min-height - Minimum height of the sidenav item.\n * @cssproperty --dds-sidenav-item-margin-bottom - Default bottom margin of the sidenav item.\n * @cssproperty --dds-sidenav-item-padding - Padding of the sidenav item.\n * @cssproperty --dds-sidenav-item-radius - Border radius of the sidenav item.\n * @cssproperty --dds-sidenav-item-color - Text color of the sidenav item.\n * @cssproperty --dds-sidenav-item-font-size - Font size of the sidenav item.\n * @cssproperty --dds-sidenav-item-font-weight - Font weight of the sidenav item.\n * @cssproperty --dds-sidenav-item-spacing-margin - Margin used for spacing variants.\n * @cssproperty --dds-sidenav-item-bg-active - Background color when the item is active.\n * @cssproperty --dds-sidenav-item-bg-hover - Background color on hover and active states.\n /\n const reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {\n onDdsItemClick: 'dds-item-click' as EventName<DdsItemClickEvent>\n },\n displayName: \"DapDSSideNavItem\"\n })\n\n export default reactWrapper\n ","\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/sidenav/sidenav.component.js'\n import type { DdsItemClickEvent } from '../../events/events'\n export type { DdsItemClickEvent } from '../../events/events'\n\n const tagName = 'dap-ds-sidenav'\n\n /*\n `dap-ds-sidenav`\n * @summary Side navigation is a list of links that are used to navigate to different sections of a page.\n * @element dap-ds-sidenav\n * @title - Side navigation\n \n @event {{ href: string, event: Event }} dds-item-click - Event fired when the side navigation item is clicked.\n \n @slot - The content of the side navigation.\n \n @csspart base - The main side navigation container.\n * @csspart menu - The menu of the side navigation.\n /\n const reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {\n onDdsItemClick: 'dds-item-click' as EventName<DdsItemClickEvent>\n },\n displayName: \"DapDSSideNav\"\n })\n\n export default reactWrapper\n ","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/skip-link/skip-link.component.js'\n\nconst tagName = 'dap-ds-skip-link'\n\n/*\n `dap-ds-skip-link`\n * @summary A skip link is a link that allows keyboard users to skip to the main content of a page.\n * @element dap-ds-skip-link\n * @title - Skip link\n \n @slot - The content of the skip link.\n \n @csspart base - The main skip link container.\n * @csspart text - The text container of the skip link.\n * @csspart high-contrast - The high contrast outline container.\n \n @cssproperty --dds-skip-link-border-color - Border color for the high contrast outline (default: var(--dds-border-neutral-transparent-interactive, #fff500))\n * @cssproperty --dds-skip-link-border-width - Border width for the high contrast outline (default: var(--dds-border-width-large))\n * @cssproperty --dds-skip-link-border-width-active - Border width for the active state (default: var(--dds-border-width-xlarge))\n * @cssproperty --dds-skip-link-border-radius - Border radius of the skip link (default: var(--dds-radius-small))\n * @cssproperty --dds-skip-link-padding-sm - Padding for small size variant (default: var(--dds-spacing-200))\n * @cssproperty --dds-skip-link-padding-lg - Padding for large size variant (default: var(--dds-spacing-400))\n * @cssproperty --dds-skip-link-text-underline-offset - Underline offset for the text (default: 3px)\n * @cssproperty --dds-skip-link-z-index - Z-index of the skip link (default: var(--dds-z-index-100))\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'DapDSSkipLink',\n})\n\nexport default reactWrapper\n","\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/snackbar/snackbar-message.component.js'\n import type { DdsCloseEvent } from '../../events/events'\n export type { DdsCloseEvent } from '../../events/events'\n\n const tagName = 'dap-ds-snackbar-message'\n\n /*\n `dap-ds-snackbar-message`\n * @summary The Snackbar component shows a sliding message to the user.\n * @element dap-ds-snackbar-message\n * @title - Snackbar message\n * @group snackbar\n \n @event {{ id: string }} dds-close - Fires when the snackbar closes.\n \n @slot default - The content of the snackbar.\n \n @csspart base - Main snackbar container.\n * @csspart text - The text part of the snackbar.\n * @csspart closebutton - The close button part of the component.\n * @csspart icon - The icon part of the close button.\n \n @cssproperty --dds-snackbar-width - Width of the snackbar.\n * @cssproperty --dds-snackbar-gap - Gap between snackbar elements.\n * @cssproperty --dds-snackbar-padding - Padding inside the snackbar.\n * @cssproperty --dds-snackbar-margin-bottom - Bottom margin of the snackbar.\n * @cssproperty --dds-snackbar-transition - Transition property for the snackbar.\n * @cssproperty --dds-snackbar-border-width - Border width of the snackbar.\n * @cssproperty --dds-snackbar-border-radius - Border radius of the snackbar.\n * @cssproperty --dds-snackbar-font-size - Font size used in the snackbar.\n /\n const reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {\n onDdsClose: 'dds-close' as EventName<DdsCloseEvent>\n },\n displayName: \"DapDSSnackbarMessage\"\n })\n\n export default reactWrapper\n ","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/snackbar/snackbar.component.js'\n\nconst tagName = 'dap-ds-snackbar'\n\n/*\n `dap-ds-snackbar`\n * @summary The Snackbar is a container of sliding messages.\n * @element dap-ds-snackbar\n * @title - Snackbar\n \n @csspart host - The host element\n \n @cssproperty --dds-snackbar-spacing - Spacing used for positioning the snackbar (default: var(--dds-spacing-400))\n * @cssproperty --dds-snackbar-z-index - Z-index of the snackbar container (default: 10000)\n * @cssproperty --dds-snackbar-pointer-events - Pointer events behavior for the snackbar (default: auto)\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'DapDSSnackbar',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/spinner/spinner.component.js'\n\nconst tagName = 'dap-ds-spinner'\n\n/*\n `dap-ds-spinner`\n * @summary Loading spinner component.\n * @element dap-ds-spinner\n * @title - Spinner\n \n @csspart base - The main spinner container.\n * @csspart icon - The loading icon element.\n * @csspart icon-base - The base of the loading icon.\n * @csspart text - The loading text element.\n \n @slot - The loading text content.\n \n @cssprop --dds-spinner-icon-color-neutral - Color for neutral spinner icons.\n * @cssprop --dds-spinner-icon-color-brand - Color for brand spinner icons.\n * @cssprop --dds-spinner-icon-color-negative - Color for negative spinner icons.\n * @cssprop --dds-spinner-icon-color-positive - Color for positive spinner icons.\n * @cssprop --dds-spinner-icon-color-inverted - Color for inverted spinner icons.\n * @cssprop --dds-spinner-text-spacing - Spacing between spinner and text.\n * @cssprop --dds-spinner-animation-duration - Duration of the spinner animation.\n \n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'DapDSSpinner',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport * as React from 'react'\n\nimport Component from '../../components/stack/stack.component.js'\n\nconst tagName = 'dap-ds-stack'\n\n/*\n `dap-ds-stack`\n * @summary A stack is a container for stacked content.\n * @element dap-ds-stack\n * @title - Stack\n \n @slot - The content of the stack.\n \n @csspart stack - The main stack container.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'DapDSStack',\n})\n\nexport default reactWrapper\n","\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/switch/switch.component.js'\n import type { DdsChangeEvent } from '../../events/events'\nimport type { DdsBlurEvent } from '../../events/events'\nimport type { DdsFocusEvent } from '../../events/events'\nimport type { DdsInputEvent } from '../../events/events'\n export type { DdsChangeEvent } from '../../events/events'\nexport type { DdsBlurEvent } from '../../events/events'\nexport type { DdsFocusEvent } from '../../events/events'\nexport type { DdsInputEvent } from '../../events/events'\n\n const tagName = 'dap-ds-switch'\n\n /*\n `dap-ds-switch`\n * @summary A switch is a graphical control element that allows the user to toggle between two states.\n * @element dap-ds-switch\n * @title - Switch\n \n @property {string} name - The name of the switch.\n * @property {string} value - The value of the switch.\n * @property {string} label - The label of the switch.\n * @property {string} description - The description of the switch.\n * @property {boolean} checked - The checked state of the switch.\n * @property {'xs' \| 'sm' \| 'md' \| 'lg'} size - The size of the switch.\n * @property {boolean} disabled - The disabled state of the switch.\n * @property {boolean} required - The required state of the switch.\n * @property {'left' \| 'right'} labelPlacement - The placement of the label.\n * @property {'top' \| 'bottom'} descriptionPlacement - The placement of the description.\n * @property {boolean} subtle - The weight of the label.\n * @property {string} feedback - The feedback of the switch.\n * @property {'negative' \| 'positive' \| 'warning'} feedbackType - The feedback type of the switch.\n * @property {boolean} optional - The optional state of the switch.\n * @property {string} optionalLabel - The optional label of the switch.\n \n @cssProperty --dds-switch-width - Width of the switch control.\n * @cssProperty --dds-switch-height - Height of the switch control.\n * @cssProperty --dds-switch-thumb-width - Width of the switch thumb.\n * @cssProperty --dds-switch-thumb-height - Height of the switch thumb.\n * @cssProperty --dds-switch-thumb-margin - Margin around the switch thumb.\n * @cssProperty --dds-switch-thumb-color - Color of the switch thumb.\n * @cssProperty --dds-switch-unchecked-bg - Background color of the switch when unchecked.\n * @cssProperty --dds-switch-checked-bg - Background color of the switch when checked.\n * @cssProperty --dds-switch-invalid-bg - Background color of the switch when invalid.\n * @cssProperty --dds-switch-disabled-bg - Background color of the switch when disabled.\n * @cssProperty --dds-switch-wrapper-padding - Padding of the switch wrapper.\n * @cssProperty --dds-switch-wrapper-bg - Background color of the switch wrapper.\n * @cssProperty --dds-switch-border-color - Border color of the switch.\n * @cssProperty --dds-switch-high-contrast-border-color - Border color of the switch in high contrast mode.\n \n @event {{ value: string }} dds-change - Fired when the input value changes.\n * @event {{ void }} dds-blur - Emitted when the input loses focus.\n * @event {{ void }} dds-focus - Emitted when the input gains focus.\n * @event {{ value: string }} dds-input - Emitted when the input receives input.\n \n @csspart base - The main switch container.\n * @csspart baselabel - The main label container\n * @csspart label - The label of the switch.\n * @csspart input - The native input of the switch.\n * @csspart control - The control of the switch.\n * @csspart description - The description of the switch.\n /\n const reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {\n onDdsChange: 'dds-change' as EventName<DdsChangeEvent>,\nonDdsBlur: 'dds-blur' as EventName<DdsBlurEvent>,\nonDdsFocus: 'dds-focus' as EventName<DdsFocusEvent>,\nonDdsInput: 'dds-input' as EventName<DdsInputEvent>\n },\n displayName: \"DapDSSwitch\"\n })\n\n export default reactWrapper\n ","\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/tab/tab-group.component.js'\n import type { DdsTabSelectEvent } from '../../events/events'\n export type { DdsTabSelectEvent } from '../../events/events'\n\n const tagName = 'dap-ds-tab-group'\n\n /*\n `dap-ds-tab-group`\n * @summary A tab group component. It is used with dap-ds-tab component to create a tab group.\n * @element dap-ds-tab-group\n * @title - Tab group\n * @group tab\n \n @event {{ tabId: string }} dds-tab-select - Fired when select a new tab.\n \n @slot - The tab items.\n \n @csspart base - The main container.\n * @csspart tab-nav - The tab navigation container.\n * @csspart tab-content - The tab content container.\n \n @cssproperty --dds-tab-group-border-radius - Border radius of the tab group container\n * @cssproperty --dds-tab-group-border-width - Border width of the tab navigation\n * @cssproperty --dds-tab-group-border-color - Border color of the tab navigation\n * @cssproperty --dds-tab-height-sm - Height of small tabs\n * @cssproperty --dds-tab-height-lg - Height of large tabs\n * @cssproperty --dds-tab-font-size-sm - Font size of small tabs\n * @cssproperty --dds-tab-font-size-lg - Font size of large tabs\n * @cssproperty --dds-tab-padding - Padding of the tab buttons\n * @cssproperty --dds-tab-border-width - Border width for tabs\n * @cssproperty --dds-tab-selected-border-color - Border color for selected tabs\n * @cssproperty --dds-tab-text-color - Text color for tabs\n * @cssproperty --dds-tab-hover-text-color - Text color for tabs on hover\n * @cssproperty --dds-tab-disabled-text-color - Text color for disabled tabs\n * @cssproperty --dds-tab-hover-background - Background color for tabs on hover\n * @cssproperty --dds-tab-active-background - Background color for active tabs\n /\n const reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {\n onDdsTabSelect: 'dds-tab-select' as EventName<DdsTabSelectEvent>\n },\n displayName: \"DapDSTabGroup\"\n })\n\n export default reactWrapper\n ","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/tab/tab.component.js'\n\nconst tagName = 'dap-ds-tab'\n\n/*\n `dap-ds-tab`\n * @summary A tab item component. It is used in dap-ds-tab-group component slot to create a tab item.\n * @element dap-ds-tab\n * @title - Tab\n * \n @slot - The tab title template.\n * @slot content - The tab content.\n \n @csspart base - The main tab content container.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'DapDSTab',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/table/table-cell.component.js'\n\nconst tagName = 'dap-ds-table-cell'\n\n/*\n Table cell component.\n * @element dap-ds-table-cell\n * @title - Table cell\n * @group table\n \n @slot - The default slot.\n \n @csspart base - The main cell container.\n \n @cssproperty --dds-table-cell-padding-block - Padding for the top and bottom of the cell. Default: var(--dds-spacing-200)\n * @cssproperty --dds-table-cell-padding-inline-start - Padding for the start (left in LTR) of the cell. Default: var(--dds-spacing-500)\n * @cssproperty --dds-table-cell-padding-inline-end - Padding for the end (right in LTR) of the cell. Default: var(--dds-spacing-500)\n * @cssproperty --dds-table-cell-border-width - Width of the cell's bottom border. Default: var(--dds-border-width-base)\n * @cssproperty --dds-table-cell-border-color - Color of the cell's bottom border. Default: var(--dds-border-neutral-subtle)\n * @cssproperty --dds-table-cell-text-color - Text color of the cell. Default: var(--dds-text-neutral-base)\n * @cssproperty --dds-table-cell-line-height - Line height of the cell text. Default: 1.5\n * @cssproperty --dds-table-cell-text-align - Text alignment in the cell. Default: left\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'DapDSTableCell',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/table/table-header.component.js'\n\nconst tagName = 'dap-ds-table-header'\n\n/*\n Table header cell component.\n * @element dap-ds-table-header\n * @title - Table header\n * @group table\n \n @slot - The default slot.\n \n @csspart base - The main header cell container.\n \n @cssproperty --dds-table-header-padding-block - Padding for the top and bottom of the header cell.\n * @cssproperty --dds-table-header-padding-inline-start - Padding for the start (left in LTR) of the header cell.\n * @cssproperty --dds-table-header-padding-inline-end - Padding for the end (right in LTR) of the header cell.\n * @cssproperty --dds-table-header-border-width - Width of the header cell's bottom border.\n * @cssproperty --dds-table-header-border-color - Color of the header cell's bottom border.\n * @cssproperty --dds-table-header-text-color - Text color of the header cell.\n * @cssproperty --dds-table-header-font-weight - Font weight of the header cell text.\n * @cssproperty --dds-table-header-line-height - Line height of the header cell text.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'DapDSTableHeader',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/table/table-row.component.js'\n\nconst tagName = 'dap-ds-table-row'\n\n/*\n Table row component.\n * @element dap-ds-table-row\n * @title - Table row\n * @group table\n \n @slot - The default slot. Accepts `dap-ds-table-cell` and `dap-ds-table-header` elements.\n \n @cssprop --dds-table-row-padding-right - Padding right for the last table header, defaults to var(--dds-spacing-500)\n * @cssprop --dds-table-row-padding-top - Padding top for table headers in mobile view, defaults to var(--dds-spacing-400)\n * @cssprop --dds-table-row-padding-bottom - Padding bottom for the last table cell in mobile view, defaults to var(--dds-spacing-400)\n * @cssprop --dds-table-row-border-color - Border color for table cells and headers, defaults to transparent\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'DapDSTableRow',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/table/table.component.js'\n\nconst tagName = 'dap-ds-table'\n\n/*\n Data table component.\n * @element dap-ds-table\n * @title - Table\n \n @slot - The default slot. Accepts `dap-ds-table-row` elements.\n \n @cssprop --dds-table-border-width - Width of the table border. Default: var(--dds-border-width-base, 1px)\n * @cssprop --dds-table-border-color - Color of the table border. Default: var(--dds-border-neutral-subtle)\n * @cssprop --dds-table-border-radius - Border radius of the table. Default: var(--dds-radius-small, 4px)\n * @cssprop --dds-table-row-divider-color - Color of the divider between rows in mobile view. Default: var(--dds-border-neutral-subtle)\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'DapDSTable',\n})\n\nexport default reactWrapper\n","\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/textarea/textarea.component.js'\n import type { DdsCountChangeEvent } from '../../events/events'\nimport type { DdsChangeEvent } from '../../events/events'\nimport type { DdsInputEvent } from '../../events/events'\nimport type { DdsKeydownEvent } from '../../events/events'\nimport type { DdsBlurEvent } from '../../events/events'\nimport type { DdsFocusEvent } from '../../events/events'\nimport type { DdsSelectEvent } from '../../events/events'\n export type { DdsCountChangeEvent } from '../../events/events'\nexport type { DdsChangeEvent } from '../../events/events'\nexport type { DdsInputEvent } from '../../events/events'\nexport type { DdsKeydownEvent } from '../../events/events'\nexport type { DdsBlurEvent } from '../../events/events'\nexport type { DdsFocusEvent } from '../../events/events'\nexport type { DdsSelectEvent } from '../../events/events'\n\n const tagName = 'dap-ds-textarea'\n\n /*\n `dap-ds-textarea`\n * @summary A textarea is a multi-line text input field.\n * @element dap-ds-textarea\n * @title - Textarea\n \n @property {'xs' \| 'sm' \| 'lg'} size - The size of the textarea. Default is `md`.\n * @property {boolean} disabled - The disabled state of the textarea.\n * @property {number} minlength - The minimum length of the textarea.\n * @property {string} value - The value of the textarea.\n * @property {string} tooltip - The tooltip of the textarea.\n * @property {'top' \| 'right' \| 'bottom' \| 'left'} tooltipPlacement - The tooltip placement of the textarea.\n * @property {InputStatus} status - The status of the textarea. Can be `success` or `error`.\n * @property {boolean} readonly - The readonly state of the textarea.\n * @property {boolean} required - The required state of the textarea.\n * @property {string} label - The label of the textarea.\n * @property {string} description - The description of the textarea.\n * @property {string} feedback - The feedback of the textarea.\n * @property {'negative' \| 'positive' \| 'warning'} feedbackType - The feedback type of the textarea. Can be `negative`, `positive`, or `warning`.\n * @property {boolean} optional - The optional state of the textarea.\n * @property {string} optionalLabel - The optional label of the textarea.\n * @property {boolean} subtle - The weight of the label. Default is `false`\n * @property {boolean} autofocus - The autofocus state of the textarea.\n \n @event {{ value: number }} dds-count-change - Fires when the count of the textarea changes.\n * @event {{ value: string }} dds-change - Fired when the textarea value changes.\n * @event {{ value: string }} dds-input - Fired when the textarea value changes.\n * @event {{ value: string, originalEvent: Event }} dds-keydown - Fired when a key is pressed down.\n * @event {{ void }} dds-blur - Fired when the textarea loses focus.\n * @event {{ void }} dds-focus - Emitted when the textarea gains focus.\n * @event {{ value: string }} dds-select - Emitted when select text in textarea.\n \n @slot feedback-icon - The custom icon of the feedback.\n \n @csspart base - The main textarea container.\n * @csspart input - The native input of the textarea.\n * @csspart counter - The counter of the textarea.\n * @csspart counter-base - The base of the counter.\n * @csspart feedback - The feedback of the textarea.\n \n @cssproperty --dds-textarea-min-rows - Minimum number of rows in the textarea. Default is 2.\n * @cssproperty --dds-textarea-spacing - Gap between elements in the textarea container. Default is var(--dds-spacing-200).\n * @cssproperty --dds-textarea-gap - Gap between elements in the textarea container. Default is var(--dds-spacing-200).\n * @cssproperty --dds-textarea-margin-top - Top margin of the textarea. Default is var(--dds-spacing-200).\n * @cssproperty --dds-textarea-padding - Padding of the textarea control. Default is var(--dds-spacing-200) var(--dds-spacing-300).\n * @cssproperty --dds-textarea-border-width - Border width of the textarea. Default is var(--dds-border-width-base).\n * @cssproperty --dds-textarea-border-color - Border color of the textarea. Default is var(--dds-border-neutral-base).\n * @cssproperty --dds-textarea-background - Background color of the textarea. Default is var(--dds-fields-background-default).\n * @cssproperty --dds-textarea-color - Text color of the textarea. Default is var(--dds-text-neutral-base).\n * @cssproperty --dds-textarea-border-radius - Border radius of the textarea. Default is var(--dds-radius-base).\n * @cssproperty --dds-textarea-disabled-bg - Background color when disabled. Default is var(--dds-fields-background-disabled).\n * @cssproperty --dds-textarea-disabled-color - Text color when disabled. Default is var(--dds-text-neutral-disabled).\n * @cssproperty --dds-textarea-readonly-bg - Background color when readonly. Default is var(--dds-fields-background-read-only).\n * @cssproperty --dds-textarea-readonly-color - Text color when readonly. Default is var(--dds-text-neutral-subtle).\n * @cssproperty --dds-textarea-error-border - Border color when in error state. Default is var(--dds-border-negative-base).\n * @cssproperty --dds-textarea-success-border - Border color when in success state. Default is var(--dds-border-positive-base).\n /\n const reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {\n onDdsCountChange: 'dds-count-change' as EventName<DdsCountChangeEvent>,\nonDdsChange: 'dds-change' as EventName<DdsChangeEvent>,\nonDdsInput: 'dds-input' as EventName<DdsInputEvent>,\nonDdsKeydown: 'dds-keydown' as EventName<DdsKeydownEvent>,\nonDdsBlur: 'dds-blur' as EventName<DdsBlurEvent>,\nonDdsFocus: 'dds-focus' as EventName<DdsFocusEvent>,\nonDdsSelect: 'dds-select' as EventName<DdsSelectEvent>\n },\n displayName: \"DapDSTextarea\"\n })\n\n export default reactWrapper\n ","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/timeline/timeline-item.component.js'\n\nconst tagName = 'dap-ds-timeline-item'\n\n/*\n `dap-ds-timeline-item`\n * @summary A timeline is a graphical representation of a series of events.\n * @element dap-ds-timeline-item\n * @title - Timeline item\n * @group Timeline\n \n @slot - The default slot for the item content.\n \n @csspart base - The main timeline item container.\n * @csspart connector - The connector element between two timeline items.\n * @csspart content - The content of the timeline item.\n \n @cssproperty --dds-timeline-position - Position of the timeline dot (default: 28px)\n * @cssproperty --dds-timeline-connector-width - Width of the timeline connector line (default: 1px)\n * @cssproperty --dds-timeline-connector-left-position - Left position of the timeline connector (default: 5.5px)\n * @cssproperty --dds-timeline-dot-size - Size of the timeline dot (default: var(--dds-spacing-300))\n * @cssproperty --dds-timeline-item-margin-bottom - Bottom margin of timeline items (default: var(--dds-spacing-200))\n * @cssproperty --dds-timeline-item-padding-left - Left padding of timeline items (default: var(--dds-spacing-400))\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'DapDSTimelineItem',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/timeline/timeline.component.js'\n\nconst tagName = 'dap-ds-timeline'\n\n/*\n `dap-ds-timeline`\n * @summary A timeline is a graphical representation of a series of events.\n * @element dap-ds-timeline\n * @title - Timeline\n \n @slot - The default slot for the timeline items.\n \n @csspart base - The main timeline container.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'DapDSTimeline',\n})\n\nexport default reactWrapper\n","\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.component.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 {'sm' \| 'lg'} size - The size of the toc. Default is `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 /\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 ","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/toggle-button/toggle-button.component.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 @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\n * @cssproperty --dds-toggle-button-min-width-md - Minimum width of the medium toggle button\n * @cssproperty --dds-toggle-button-min-width-sm - Minimum width of the small toggle button\n * @cssproperty --dds-toggle-button-min-width-xs - Minimum width of the extra small toggle button\n * @cssproperty --dds-toggle-button-height-lg - Height of the large toggle button\n * @cssproperty --dds-toggle-button-height-md - Height of the medium toggle button\n * @cssproperty --dds-toggle-button-height-sm - Height of the small toggle button\n * @cssproperty --dds-toggle-button-height-xs - Height of the extra small toggle button\n * @cssproperty --dds-toggle-button-padding-lg - Padding of the large toggle button\n * @cssproperty --dds-toggle-button-padding-md - Padding of the medium toggle button\n * @cssproperty --dds-toggle-button-padding-sm - Padding of the small toggle button\n * @cssproperty --dds-toggle-button-padding-xs - Padding of the extra small toggle button\n * @cssproperty --dds-toggle-button-font-size-lg - Font size of the large toggle button\n * @cssproperty --dds-toggle-button-font-size-md - Font size of the medium toggle button\n * @cssproperty --dds-toggle-button-font-size-sm - Font size of the small toggle button\n * @cssproperty --dds-toggle-button-font-size-xs - Font size of the extra small toggle button\n * @cssproperty --dds-toggle-button-border-enabled - Border color in enabled state\n * @cssproperty --dds-toggle-button-background-enabled - Background color in enabled state\n * @cssproperty --dds-toggle-button-content-enabled - Content/text color in enabled state\n * @cssproperty --dds-toggle-button-border-hover - Border color in hover state\n * @cssproperty --dds-toggle-button-background-hover - Background color in hover state\n * @cssproperty --dds-toggle-button-border-pressed - Border color in pressed state\n * @cssproperty --dds-toggle-button-background-pressed - Background color in pressed state\n * @cssproperty --dds-toggle-button-background-selected-enabled - Background color in selected enabled state\n * @cssproperty --dds-toggle-button-content-selected-enabled - Content/text color in selected enabled state\n * @cssproperty --dds-toggle-button-background-selected-hover - Background color in selected hover state\n * @cssproperty --dds-toggle-button-background-selected-pressed - Background color in selected pressed state\n * @cssproperty --dds-toggle-button-border-disabled - Border color in disabled state\n * @cssproperty --dds-toggle-button-background-disabled - Background color in disabled state\n * @cssproperty --dds-toggle-button-content-disabled - Content/text color in disabled state\n * @cssproperty --dds-toggle-button-highcontrast-border - High contrast border color\n * @cssproperty --dds-toggle-button-highcontrast-border-hover - High contrast border color on hover\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'DapDSToggleButton',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/tooltip/tooltip.component.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.\n * @cssproperty --dds-tooltip-padding - The padding inside the tooltip.\n * @cssproperty --dds-tooltip-border-color - The border color of the tooltip.\n * @cssproperty --dds-tooltip-bg-color - The background color of the tooltip.\n * @cssproperty --dds-tooltip-text-color - The text color of the tooltip.\n * @cssproperty --dds-tooltip-font-size - The font size of the tooltip text.\n * @cssproperty --dds-tooltip-box-shadow - The box shadow of the tooltip.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'DapDSTooltip',\n})\n\nexport default reactWrapper\n","\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.component.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} 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 {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 - Padding inside the modal. Default: var(--dds-spacing-800).\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 - Margin below the header. Default: var(--dds-spacing-800).\n * @cssproperty --dds-modal-footer-margin - Margin above the footer. Default: var(--dds-spacing-400).\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 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 ","import { createComponent } from '@lit/react'\nimport * as React from 'react'\n\nimport Component from '../../components/typography/typography.component.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.\n * @cssproperty --dds-text-heading-color - The color of the heading typography.\n * @cssproperty --dds-text-description-subtle - The color of the subtle typography.\n * @cssproperty --dds-text-font-family - The font family of the typography.\n * @cssproperty --dds-text-font-weight-medium - The font weight of the medium typography.\n * @cssproperty --dds-text-font-weight-bold - The font weight of the bold typography.\n * @cssproperty --dds-text-font-size-h1 - The font size of the h1 typography.\n * @cssproperty --dds-text-font-size-h2 - The font size of the h2 typography.\n * @cssproperty --dds-text-font-size-h3 - The font size of the h3 typography.\n * @cssproperty --dds-text-font-size-h4 - The font size of the h4 typography.\n * @cssproperty --dds-text-font-size-h5 - The font size of the h5 typography.\n * @cssproperty --dds-text-font-size-h6 - The font size of the h6 typography.\n * @cssproperty --dds-text-font-size-body - The font size of the body typography.\n * @cssproperty --dds-text-font-size-caption - The font size of the caption typography.\n * @cssproperty --dds-text-font-size-description - The font size of the description typography.\n * @cssproperty --dds-text-font-size-description-lg - The font size of the description lg typography.\n * @cssproperty --dds-text-font-size-description-sm - The font size of the description sm typography.\n * @cssproperty --dds-text-font-size-lg - The font size of the lg typography.\n * @cssproperty --dds-text-font-size-md - The font size of the md typography.\n * @cssproperty --dds-text-font-size-sm - The font size of the sm typography.\n * @cssproperty --dds-text-font-size-xs - The font size of the xs typography.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'DapDSTypography',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/form/form-label/form-label.component.js'\n\nconst tagName = 'dap-ds-form-label'\n\n/*\n `dap-ds-form-label`\n * @summary A form label is a container for labels in a form.\n * @element dap-ds-form-label\n * @title - Form label\n * @group form\n \n @property {string} optionalLabel - Label of optional text\n * @property {boolean} subtle - Text weight of the label.\n * @property {boolean} optional - If the label is optional.\n * @property {boolean} required - If the label is required.\n * @property {string} label - The label text.\n \n @csspart base - The main form label container.\n * @csspart required - The required indicator of the form label.\n * @csspart optional - The optional indicator of the form label.\n \n @cssproperty --dds-form-label-font-weight - Font weight of the label. Defaults to var(--dds-font-weight-bold).\n * @cssproperty --dds-form-label-line-height - Line height of the label. Defaults to var(--dds-font-line-height-xlarge).\n * @cssproperty --dds-form-label-color - Text color of the label. Defaults to var(--dds-text-neutral-enabled).\n * @cssproperty --dds-form-label-disabled-color - Text color when the label is disabled. Defaults to var(--dds-text-neutral-disabled).\n * @cssproperty --dds-form-label-required-color - Color of the required indicator. Defaults to var(--dds-text-negative-subtle).\n * @cssproperty --dds-form-label-optional-color - Color of the optional indicator. Defaults to var(--dds-text-neutral-subtle).\n * @cssproperty --dds-form-label-margin-bottom - Bottom margin of the label. Defaults to var(--dds-spacing-200).\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'DapDSFormLabel',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/form/input-group/input-group.component.js'\n\nconst tagName = 'dap-ds-input-group'\n\n/*\n `dap-ds-input-group`\n * @summary An input group is a container for inputs.\n * @element dap-ds-input-group\n * @title - Input group\n * @group form\n \n @property {string} label - The label of the input group.\n * @property {string} description - The description of the input group.\n * @property {string} tooltip - The tooltip of the input group.\n * @property {'top' \| 'right' \| 'bottom' \| 'left'} tooltipPlacement - The tooltip placement of the input group.\n * @property {string} tooltipAriaLabel - The aria label of the tooltip.\n * @property {string} optionalLabel - The label of the input group when it is optional.\n * @property {boolean} disabled - Whether the input group is disabled.\n * @property {'xs' \| 'sm' \| 'lg'} size - The size of the input group. Default is `sm`. Can be `sm` or `lg`.\n * @property {boolean} required - Whether the input group is required.\n * @property {boolean} optional - Whether the input group is optional.\n * @property {string} feedback - The feedback of the input.\n * @property {string} feedbackType - The type of the feedback.\n * @property {boolean} subtle - Whether the input group label is subtle.\n \n @slot - The content of the input group items.\n * @slot feedback-icon - The custom icon of the feedback.\n \n @csspart base - The main input group container.\n * @csspart label - The label of the input group.\n * @csspart description - The description of the input group.\n * @csspart tooltip - The tooltip of the input group.\n * @csspart container - The container of the input group items.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'DapDSInputGroup',\n})\n\nexport default reactWrapper\n","\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/form/radio-group/radio-group.component.js'\n import type { DdsChangeEvent } from '../../events/events'\nimport type { DdsBlurEvent } from '../../events/events'\nimport type { DdsFocusEvent } from '../../events/events'\n export type { DdsChangeEvent } from '../../events/events'\nexport type { DdsBlurEvent } from '../../events/events'\nexport type { DdsFocusEvent } from '../../events/events'\n\n const tagName = 'dap-ds-radio-group'\n\n /*\n `dap-ds-radio-group`\n * @summary A radio group is a form element that allows the user to select one option from a set.\n * @element dap-ds-radio-group\n * @title - Radio group\n * @group radio-button\n \n @event dds-change - Fired when the radio group is checked.\n * @event dds-blur - Emitted when the radio group loses focus.\n * @event dds-focus - Emitted when the radio group gains focus.\n \n @property {string} name - The name of the radio group.\n * @property {string} value - The value of the radio group.\n * @property {boolean} disabled - Whether the radio group is disabled.\n * @property {boolean} required - Whether the radio group is required.\n * @property {string} label - The label of the radio group.\n * @property {string} description - The description of the radio group.\n * @property {string} tooltip - The tooltip of the radio group.\n * @property {'top' \| 'right' \| 'bottom' \| 'left'} tooltipPlacement - The tooltip placement of the radio group.\n * @property {string} feedback - The feedback of the radio group.\n * @property {'negative' \| 'positive' \| 'warning'} feedbackType - The feedback type of the radio group. Can be `negative`, `positive`, or `warning`.\n * @property {boolean} optional - The optional state of the radio group.\n * @property {string} optionalLabel - Text of optional label.\n * @property {boolean} subtle - The weight of the label. Default is `false`\n * @property {'xs' \| 'sm' \| 'lg'} size - The size of the radio group. Default is `sm`.\n * @property {boolean} subtle - Font weight of the feedback label. Default is `false` which is bold.\n \n @slot - The content of the radio group.\n * @slot feedback-icon - The custom icon of the feedback.\n \n @csspart base - The main radio group container.\n * @csspart label - The label of the radio group.\n * @csspart tooltip - The tooltip of the radio group.\n * @csspart container - The container of the radio group items.\n /\n const reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {\n onDdsChange: 'dds-change' as EventName<DdsChangeEvent>,\nonDdsBlur: 'dds-blur' as EventName<DdsBlurEvent>,\nonDdsFocus: 'dds-focus' as EventName<DdsFocusEvent>\n },\n displayName: \"DapDSRadioGroup\"\n })\n\n export default reactWrapper\n ","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/icons/buildings/buildings-home-6-line/buildings-home-6-line.component.js'\n\nconst tagName = 'dap-ds-icon-home-6-line'\n\n/*\n `dap-ds-icon-home-6-line`\n * @summary An icon\n * @element dap-ds-icon-home-6-line\n * @title - BuildingsHome6Line\n * @group icon\n * @icontype buildings\n \n @attribute {number} size - (optional) The width and height in pixels\n * @attribute {boolean} selected - (optional) Sets the icon color via the `fill` attribute\n * @attribute {string} accessibilityTitle - (optional) When using the icon standalone, make it meaningful for accessibility\n * @attribute {boolean} focusable - (optional) If `true` the icon can receive focus\n \n @csspart base - The main icon container.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'BuildingsHome6Line',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/icons/arrows/arrows-arrow-down-line/arrows-arrow-down-line.component.js'\n\nconst tagName = 'dap-ds-icon-arrow-down-line'\n\n/*\n `dap-ds-icon-arrow-down-line`\n * @summary An icon\n * @element dap-ds-icon-arrow-down-line\n * @title - ArrowsArrowDownLine\n * @group icon\n * @icontype arrows\n \n @attribute {number} size - (optional) The width and height in pixels\n * @attribute {boolean} selected - (optional) Sets the icon color via the `fill` attribute\n * @attribute {string} accessibilityTitle - (optional) When using the icon standalone, make it meaningful for accessibility\n * @attribute {boolean} focusable - (optional) If `true` the icon can receive focus\n \n @csspart base - The main icon container.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'ArrowsArrowDownLine',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/icons/arrows/arrows-arrow-down-s-fill/arrows-arrow-down-s-fill.component.js'\n\nconst tagName = 'dap-ds-icon-arrow-down-s-fill'\n\n/*\n `dap-ds-icon-arrow-down-s-fill`\n * @summary An icon\n * @element dap-ds-icon-arrow-down-s-fill\n * @title - ArrowsArrowDownSFill\n * @group icon\n * @icontype arrows\n \n @attribute {number} size - (optional) The width and height in pixels\n * @attribute {boolean} selected - (optional) Sets the icon color via the `fill` attribute\n * @attribute {string} accessibilityTitle - (optional) When using the icon standalone, make it meaningful for accessibility\n * @attribute {boolean} focusable - (optional) If `true` the icon can receive focus\n \n @csspart base - The main icon container.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'ArrowsArrowDownSFill',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/icons/arrows/arrows-arrow-down-s-line/arrows-arrow-down-s-line.component.js'\n\nconst tagName = 'dap-ds-icon-arrow-down-s-line'\n\n/*\n `dap-ds-icon-arrow-down-s-line`\n * @summary An icon\n * @element dap-ds-icon-arrow-down-s-line\n * @title - ArrowsArrowDownSLine\n * @group icon\n * @icontype arrows\n \n @attribute {number} size - (optional) The width and height in pixels\n * @attribute {boolean} selected - (optional) Sets the icon color via the `fill` attribute\n * @attribute {string} accessibilityTitle - (optional) When using the icon standalone, make it meaningful for accessibility\n * @attribute {boolean} focusable - (optional) If `true` the icon can receive focus\n \n @csspart base - The main icon container.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'ArrowsArrowDownSLine',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/icons/arrows/arrows-arrow-left-down-line/arrows-arrow-left-down-line.component.js'\n\nconst tagName = 'dap-ds-icon-arrow-left-down-line'\n\n/*\n `dap-ds-icon-arrow-left-down-line`\n * @summary An icon\n * @element dap-ds-icon-arrow-left-down-line\n * @title - ArrowsArrowLeftDownLine\n * @group icon\n * @icontype arrows\n \n @attribute {number} size - (optional) The width and height in pixels\n * @attribute {boolean} selected - (optional) Sets the icon color via the `fill` attribute\n * @attribute {string} accessibilityTitle - (optional) When using the icon standalone, make it meaningful for accessibility\n * @attribute {boolean} focusable - (optional) If `true` the icon can receive focus\n \n @csspart base - The main icon container.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'ArrowsArrowLeftDownLine',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/icons/arrows/arrows-arrow-left-s-fill/arrows-arrow-left-s-fill.component.js'\n\nconst tagName = 'dap-ds-icon-arrow-left-s-fill'\n\n/*\n `dap-ds-icon-arrow-left-s-fill`\n * @summary An icon\n * @element dap-ds-icon-arrow-left-s-fill\n * @title - ArrowsArrowLeftSFill\n * @group icon\n * @icontype arrows\n \n @attribute {number} size - (optional) The width and height in pixels\n * @attribute {boolean} selected - (optional) Sets the icon color via the `fill` attribute\n * @attribute {string} accessibilityTitle - (optional) When using the icon standalone, make it meaningful for accessibility\n * @attribute {boolean} focusable - (optional) If `true` the icon can receive focus\n \n @csspart base - The main icon container.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'ArrowsArrowLeftSFill',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/icons/arrows/arrows-arrow-left-l-line/arrows-arrow-left-l-line.component.js'\n\nconst tagName = 'dap-ds-icon-arrow-left-l-line'\n\n/*\n `dap-ds-icon-arrow-left-l-line`\n * @summary An icon\n * @element dap-ds-icon-arrow-left-l-line\n * @title - ArrowsArrowLeftLLine\n * @group icon\n * @icontype arrows\n \n @attribute {number} size - (optional) The width and height in pixels\n * @attribute {boolean} selected - (optional) Sets the icon color via the `fill` attribute\n * @attribute {string} accessibilityTitle - (optional) When using the icon standalone, make it meaningful for accessibility\n * @attribute {boolean} focusable - (optional) If `true` the icon can receive focus\n \n @csspart base - The main icon container.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'ArrowsArrowLeftLLine',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/icons/arrows/arrows-arrow-left-line/arrows-arrow-left-line.component.js'\n\nconst tagName = 'dap-ds-icon-arrow-left-line'\n\n/*\n `dap-ds-icon-arrow-left-line`\n * @summary An icon\n * @element dap-ds-icon-arrow-left-line\n * @title - ArrowsArrowLeftLine\n * @group icon\n * @icontype arrows\n \n @attribute {number} size - (optional) The width and height in pixels\n * @attribute {boolean} selected - (optional) Sets the icon color via the `fill` attribute\n * @attribute {string} accessibilityTitle - (optional) When using the icon standalone, make it meaningful for accessibility\n * @attribute {boolean} focusable - (optional) If `true` the icon can receive focus\n \n @csspart base - The main icon container.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'ArrowsArrowLeftLine',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/icons/arrows/arrows-arrow-left-s-line/arrows-arrow-left-s-line.component.js'\n\nconst tagName = 'dap-ds-icon-arrow-left-s-line'\n\n/*\n `dap-ds-icon-arrow-left-s-line`\n * @summary An icon\n * @element dap-ds-icon-arrow-left-s-line\n * @title - ArrowsArrowLeftSLine\n * @group icon\n * @icontype arrows\n \n @attribute {number} size - (optional) The width and height in pixels\n * @attribute {boolean} selected - (optional) Sets the icon color via the `fill` attribute\n * @attribute {string} accessibilityTitle - (optional) When using the icon standalone, make it meaningful for accessibility\n * @attribute {boolean} focusable - (optional) If `true` the icon can receive focus\n \n @csspart base - The main icon container.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'ArrowsArrowLeftSLine',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/icons/arrows/arrows-arrow-left-up-line/arrows-arrow-left-up-line.component.js'\n\nconst tagName = 'dap-ds-icon-arrow-left-up-line'\n\n/*\n `dap-ds-icon-arrow-left-up-line`\n * @summary An icon\n * @element dap-ds-icon-arrow-left-up-line\n * @title - ArrowsArrowLeftUpLine\n * @group icon\n * @icontype arrows\n \n @attribute {number} size - (optional) The width and height in pixels\n * @attribute {boolean} selected - (optional) Sets the icon color via the `fill` attribute\n * @attribute {string} accessibilityTitle - (optional) When using the icon standalone, make it meaningful for accessibility\n * @attribute {boolean} focusable - (optional) If `true` the icon can receive focus\n \n @csspart base - The main icon container.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'ArrowsArrowLeftUpLine',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/icons/arrows/arrows-arrow-right-down-line/arrows-arrow-right-down-line.component.js'\n\nconst tagName = 'dap-ds-icon-arrow-right-down-line'\n\n/*\n `dap-ds-icon-arrow-right-down-line`\n * @summary An icon\n * @element dap-ds-icon-arrow-right-down-line\n * @title - ArrowsArrowRightDownLine\n * @group icon\n * @icontype arrows\n \n @attribute {number} size - (optional) The width and height in pixels\n * @attribute {boolean} selected - (optional) Sets the icon color via the `fill` attribute\n * @attribute {string} accessibilityTitle - (optional) When using the icon standalone, make it meaningful for accessibility\n * @attribute {boolean} focusable - (optional) If `true` the icon can receive focus\n \n @csspart base - The main icon container.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'ArrowsArrowRightDownLine',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/icons/arrows/arrows-arrow-right-l-line/arrows-arrow-right-l-line.component.js'\n\nconst tagName = 'dap-ds-icon-arrow-right-l-line'\n\n/*\n `dap-ds-icon-arrow-right-l-line`\n * @summary An icon\n * @element dap-ds-icon-arrow-right-l-line\n * @title - ArrowsArrowRightLLine\n * @group icon\n * @icontype arrows\n \n @attribute {number} size - (optional) The width and height in pixels\n * @attribute {boolean} selected - (optional) Sets the icon color via the `fill` attribute\n * @attribute {string} accessibilityTitle - (optional) When using the icon standalone, make it meaningful for accessibility\n * @attribute {boolean} focusable - (optional) If `true` the icon can receive focus\n \n @csspart base - The main icon container.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'ArrowsArrowRightLLine',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/icons/arrows/arrows-arrow-right-line/arrows-arrow-right-line.component.js'\n\nconst tagName = 'dap-ds-icon-arrow-right-line'\n\n/*\n `dap-ds-icon-arrow-right-line`\n * @summary An icon\n * @element dap-ds-icon-arrow-right-line\n * @title - ArrowsArrowRightLine\n * @group icon\n * @icontype arrows\n \n @attribute {number} size - (optional) The width and height in pixels\n * @attribute {boolean} selected - (optional) Sets the icon color via the `fill` attribute\n * @attribute {string} accessibilityTitle - (optional) When using the icon standalone, make it meaningful for accessibility\n * @attribute {boolean} focusable - (optional) If `true` the icon can receive focus\n \n @csspart base - The main icon container.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'ArrowsArrowRightLine',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/icons/arrows/arrows-arrow-right-s-fill/arrows-arrow-right-s-fill.component.js'\n\nconst tagName = 'dap-ds-icon-arrow-right-s-fill'\n\n/*\n `dap-ds-icon-arrow-right-s-fill`\n * @summary An icon\n * @element dap-ds-icon-arrow-right-s-fill\n * @title - ArrowsArrowRightSFill\n * @group icon\n * @icontype arrows\n \n @attribute {number} size - (optional) The width and height in pixels\n * @attribute {boolean} selected - (optional) Sets the icon color via the `fill` attribute\n * @attribute {string} accessibilityTitle - (optional) When using the icon standalone, make it meaningful for accessibility\n * @attribute {boolean} focusable - (optional) If `true` the icon can receive focus\n \n @csspart base - The main icon container.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'ArrowsArrowRightSFill',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/icons/arrows/arrows-arrow-right-s-line/arrows-arrow-right-s-line.component.js'\n\nconst tagName = 'dap-ds-icon-arrow-right-s-line'\n\n/*\n `dap-ds-icon-arrow-right-s-line`\n * @summary An icon\n * @element dap-ds-icon-arrow-right-s-line\n * @title - ArrowsArrowRightSLine\n * @group icon\n * @icontype arrows\n \n @attribute {number} size - (optional) The width and height in pixels\n * @attribute {boolean} selected - (optional) Sets the icon color via the `fill` attribute\n * @attribute {string} accessibilityTitle - (optional) When using the icon standalone, make it meaningful for accessibility\n * @attribute {boolean} focusable - (optional) If `true` the icon can receive focus\n \n @csspart base - The main icon container.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'ArrowsArrowRightSLine',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/icons/arrows/arrows-arrow-right-up-line/arrows-arrow-right-up-line.component.js'\n\nconst tagName = 'dap-ds-icon-arrow-right-up-line'\n\n/*\n `dap-ds-icon-arrow-right-up-line`\n * @summary An icon\n * @element dap-ds-icon-arrow-right-up-line\n * @title - ArrowsArrowRightUpLine\n * @group icon\n * @icontype arrows\n \n @attribute {number} size - (optional) The width and height in pixels\n * @attribute {boolean} selected - (optional) Sets the icon color via the `fill` attribute\n * @attribute {string} accessibilityTitle - (optional) When using the icon standalone, make it meaningful for accessibility\n * @attribute {boolean} focusable - (optional) If `true` the icon can receive focus\n \n @csspart base - The main icon container.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'ArrowsArrowRightUpLine',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/icons/arrows/arrows-arrow-up-s-fill/arrows-arrow-up-s-fill.component.js'\n\nconst tagName = 'dap-ds-icon-arrow-up-s-fill'\n\n/*\n `dap-ds-icon-arrow-up-s-fill`\n * @summary An icon\n * @element dap-ds-icon-arrow-up-s-fill\n * @title - ArrowsArrowUpSFill\n * @group icon\n * @icontype arrows\n \n @attribute {number} size - (optional) The width and height in pixels\n * @attribute {boolean} selected - (optional) Sets the icon color via the `fill` attribute\n * @attribute {string} accessibilityTitle - (optional) When using the icon standalone, make it meaningful for accessibility\n * @attribute {boolean} focusable - (optional) If `true` the icon can receive focus\n \n @csspart base - The main icon container.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'ArrowsArrowUpSFill',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/icons/arrows/arrows-arrow-up-line/arrows-arrow-up-line.component.js'\n\nconst tagName = 'dap-ds-icon-arrow-up-line'\n\n/*\n `dap-ds-icon-arrow-up-line`\n * @summary An icon\n * @element dap-ds-icon-arrow-up-line\n * @title - ArrowsArrowUpLine\n * @group icon\n * @icontype arrows\n \n @attribute {number} size - (optional) The width and height in pixels\n * @attribute {boolean} selected - (optional) Sets the icon color via the `fill` attribute\n * @attribute {string} accessibilityTitle - (optional) When using the icon standalone, make it meaningful for accessibility\n * @attribute {boolean} focusable - (optional) If `true` the icon can receive focus\n \n @csspart base - The main icon container.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'ArrowsArrowUpLine',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/icons/arrows/arrows-arrow-up-s-line/arrows-arrow-up-s-line.component.js'\n\nconst tagName = 'dap-ds-icon-arrow-up-s-line'\n\n/*\n `dap-ds-icon-arrow-up-s-line`\n * @summary An icon\n * @element dap-ds-icon-arrow-up-s-line\n * @title - ArrowsArrowUpSLine\n * @group icon\n * @icontype arrows\n \n @attribute {number} size - (optional) The width and height in pixels\n * @attribute {boolean} selected - (optional) Sets the icon color via the `fill` attribute\n * @attribute {string} accessibilityTitle - (optional) When using the icon standalone, make it meaningful for accessibility\n * @attribute {boolean} focusable - (optional) If `true` the icon can receive focus\n \n @csspart base - The main icon container.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'ArrowsArrowUpSLine',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/icons/arrows/arrows-expand-up-down-fill/arrows-expand-up-down-fill.component.js'\n\nconst tagName = 'dap-ds-icon-expand-up-down-fill'\n\n/*\n `dap-ds-icon-expand-up-down-fill`\n * @summary An icon\n * @element dap-ds-icon-expand-up-down-fill\n * @title - ArrowsExpandUpDownFill\n * @group icon\n * @icontype arrows\n \n @attribute {number} size - (optional) The width and height in pixels\n * @attribute {boolean} selected - (optional) Sets the icon color via the `fill` attribute\n * @attribute {string} accessibilityTitle - (optional) When using the icon standalone, make it meaningful for accessibility\n * @attribute {boolean} focusable - (optional) If `true` the icon can receive focus\n \n @csspart base - The main icon container.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'ArrowsExpandUpDownFill',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/icons/business/business-calendar-line/business-calendar-line.component.js'\n\nconst tagName = 'dap-ds-icon-calendar-line'\n\n/*\n `dap-ds-icon-calendar-line`\n * @summary An icon\n * @element dap-ds-icon-calendar-line\n * @title - BusinessCalendarLine\n * @group icon\n * @icontype business\n \n @attribute {number} size - (optional) The width and height in pixels\n * @attribute {boolean} selected - (optional) Sets the icon color via the `fill` attribute\n * @attribute {string} accessibilityTitle - (optional) When using the icon standalone, make it meaningful for accessibility\n * @attribute {boolean} focusable - (optional) If `true` the icon can receive focus\n \n @csspart base - The main icon container.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'BusinessCalendarLine',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/icons/document/document-clipboard-line/document-clipboard-line.component.js'\n\nconst tagName = 'dap-ds-icon-clipboard-line'\n\n/*\n `dap-ds-icon-clipboard-line`\n * @summary An icon\n * @element dap-ds-icon-clipboard-line\n * @title - DocumentClipboardLine\n * @group icon\n * @icontype document\n \n @attribute {number} size - (optional) The width and height in pixels\n * @attribute {boolean} selected - (optional) Sets the icon color via the `fill` attribute\n * @attribute {string} accessibilityTitle - (optional) When using the icon standalone, make it meaningful for accessibility\n * @attribute {boolean} focusable - (optional) If `true` the icon can receive focus\n \n @csspart base - The main icon container.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'DocumentClipboardLine',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/icons/document/document-file-copy-line/document-file-copy-line.component.js'\n\nconst tagName = 'dap-ds-icon-file-copy-line'\n\n/*\n `dap-ds-icon-file-copy-line`\n * @summary An icon\n * @element dap-ds-icon-file-copy-line\n * @title - DocumentFileCopyLine\n * @group icon\n * @icontype document\n \n @attribute {number} size - (optional) The width and height in pixels\n * @attribute {boolean} selected - (optional) Sets the icon color via the `fill` attribute\n * @attribute {string} accessibilityTitle - (optional) When using the icon standalone, make it meaningful for accessibility\n * @attribute {boolean} focusable - (optional) If `true` the icon can receive focus\n \n @csspart base - The main icon container.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'DocumentFileCopyLine',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/icons/others/others-cookie-line/others-cookie-line.component.js'\n\nconst tagName = 'dap-ds-icon-cookie-line'\n\n/*\n `dap-ds-icon-cookie-line`\n * @summary An icon\n * @element dap-ds-icon-cookie-line\n * @title - OthersCookieLine\n * @group icon\n * @icontype others\n \n @attribute {number} size - (optional) The width and height in pixels\n * @attribute {boolean} selected - (optional) Sets the icon color via the `fill` attribute\n * @attribute {string} accessibilityTitle - (optional) When using the icon standalone, make it meaningful for accessibility\n * @attribute {boolean} focusable - (optional) If `true` the icon can receive focus\n \n @csspart base - The main icon container.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'OthersCookieLine',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/icons/system/system-add-line/system-add-line.component.js'\n\nconst tagName = 'dap-ds-icon-add-line'\n\n/*\n `dap-ds-icon-add-line`\n * @summary An icon\n * @element dap-ds-icon-add-line\n * @title - SystemAddLine\n * @group icon\n * @icontype system\n \n @attribute {number} size - (optional) The width and height in pixels\n * @attribute {boolean} selected - (optional) Sets the icon color via the `fill` attribute\n * @attribute {string} accessibilityTitle - (optional) When using the icon standalone, make it meaningful for accessibility\n * @attribute {boolean} focusable - (optional) If `true` the icon can receive focus\n \n @csspart base - The main icon container.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'SystemAddLine',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/icons/system/system-alert-fill/system-alert-fill.component.js'\n\nconst tagName = 'dap-ds-icon-alert-fill'\n\n/*\n `dap-ds-icon-alert-fill`\n * @summary An icon\n * @element dap-ds-icon-alert-fill\n * @title - SystemAlertFill\n * @group icon\n * @icontype system\n \n @attribute {number} size - (optional) The width and height in pixels\n * @attribute {boolean} selected - (optional) Sets the icon color via the `fill` attribute\n * @attribute {string} accessibilityTitle - (optional) When using the icon standalone, make it meaningful for accessibility\n * @attribute {boolean} focusable - (optional) If `true` the icon can receive focus\n \n @csspart base - The main icon container.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'SystemAlertFill',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/icons/system/system-check-line/system-check-line.component.js'\n\nconst tagName = 'dap-ds-icon-check-line'\n\n/*\n `dap-ds-icon-check-line`\n * @summary An icon\n * @element dap-ds-icon-check-line\n * @title - SystemCheckLine\n * @group icon\n * @icontype system\n \n @attribute {number} size - (optional) The width and height in pixels\n * @attribute {boolean} selected - (optional) Sets the icon color via the `fill` attribute\n * @attribute {string} accessibilityTitle - (optional) When using the icon standalone, make it meaningful for accessibility\n * @attribute {boolean} focusable - (optional) If `true` the icon can receive focus\n \n @csspart base - The main icon container.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'SystemCheckLine',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/icons/system/system-alert-line/system-alert-line.component.js'\n\nconst tagName = 'dap-ds-icon-alert-line'\n\n/*\n `dap-ds-icon-alert-line`\n * @summary An icon\n * @element dap-ds-icon-alert-line\n * @title - SystemAlertLine\n * @group icon\n * @icontype system\n \n @attribute {number} size - (optional) The width and height in pixels\n * @attribute {boolean} selected - (optional) Sets the icon color via the `fill` attribute\n * @attribute {string} accessibilityTitle - (optional) When using the icon standalone, make it meaningful for accessibility\n * @attribute {boolean} focusable - (optional) If `true` the icon can receive focus\n \n @csspart base - The main icon container.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'SystemAlertLine',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/icons/system/system-check-line2/system-check-line2.component.js'\n\nconst tagName = 'dap-ds-icon-check-line2'\n\n/*\n `dap-ds-icon-check-line2`\n * @summary An icon\n * @element dap-ds-icon-check-line2\n * @title - SystemCheckLine2\n * @group icon\n * @icontype system\n \n @attribute {number} size - (optional) The width and height in pixels\n * @attribute {boolean} selected - (optional) Sets the icon color via the `fill` attribute\n * @attribute {string} accessibilityTitle - (optional) When using the icon standalone, make it meaningful for accessibility\n * @attribute {boolean} focusable - (optional) If `true` the icon can receive focus\n \n @csspart base - The main icon container.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'SystemCheckLine2',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/icons/system/system-checkbox-blank-circle-fill-check/system-checkbox-blank-circle-fill-check.component.js'\n\nconst tagName = 'dap-ds-icon-checkbox-blank-circle-fill-check'\n\n/*\n `dap-ds-icon-checkbox-blank-circle-fill-check`\n * @summary An icon\n * @element dap-ds-icon-checkbox-blank-circle-fill-check\n * @title - SystemCheckboxBlankCircleFillCheck\n * @group icon\n * @icontype system\n \n @attribute {number} size - (optional) The width and height in pixels\n * @attribute {boolean} selected - (optional) Sets the icon color via the `fill` attribute\n * @attribute {string} accessibilityTitle - (optional) When using the icon standalone, make it meaningful for accessibility\n * @attribute {boolean} focusable - (optional) If `true` the icon can receive focus\n \n @csspart base - The main icon container.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'SystemCheckboxBlankCircleFillCheck',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/icons/system/system-checkbox-blank-circle-fill/system-checkbox-blank-circle-fill.component.js'\n\nconst tagName = 'dap-ds-icon-checkbox-blank-circle-fill'\n\n/*\n `dap-ds-icon-checkbox-blank-circle-fill`\n * @summary An icon\n * @element dap-ds-icon-checkbox-blank-circle-fill\n * @title - SystemCheckboxBlankCircleFill\n * @group icon\n * @icontype system\n \n @attribute {number} size - (optional) The width and height in pixels\n * @attribute {boolean} selected - (optional) Sets the icon color via the `fill` attribute\n * @attribute {string} accessibilityTitle - (optional) When using the icon standalone, make it meaningful for accessibility\n * @attribute {boolean} focusable - (optional) If `true` the icon can receive focus\n \n @csspart base - The main icon container.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'SystemCheckboxBlankCircleFill',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/icons/system/system-checkbox-blank-circle-line/system-checkbox-blank-circle-line.component.js'\n\nconst tagName = 'dap-ds-icon-checkbox-blank-circle-line'\n\n/*\n `dap-ds-icon-checkbox-blank-circle-line`\n * @summary An icon\n * @element dap-ds-icon-checkbox-blank-circle-line\n * @title - SystemCheckboxBlankCircleLine\n * @group icon\n * @icontype system\n \n @attribute {number} size - (optional) The width and height in pixels\n * @attribute {boolean} selected - (optional) Sets the icon color via the `fill` attribute\n * @attribute {string} accessibilityTitle - (optional) When using the icon standalone, make it meaningful for accessibility\n * @attribute {boolean} focusable - (optional) If `true` the icon can receive focus\n \n @csspart base - The main icon container.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'SystemCheckboxBlankCircleLine',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/icons/system/system-checkbox-circle-fill/system-checkbox-circle-fill.component.js'\n\nconst tagName = 'dap-ds-icon-checkbox-circle-fill'\n\n/*\n `dap-ds-icon-checkbox-circle-fill`\n * @summary An icon\n * @element dap-ds-icon-checkbox-circle-fill\n * @title - SystemCheckboxCircleFill\n * @group icon\n * @icontype system\n \n @attribute {number} size - (optional) The width and height in pixels\n * @attribute {boolean} selected - (optional) Sets the icon color via the `fill` attribute\n * @attribute {string} accessibilityTitle - (optional) When using the icon standalone, make it meaningful for accessibility\n * @attribute {boolean} focusable - (optional) If `true` the icon can receive focus\n \n @csspart base - The main icon container.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'SystemCheckboxCircleFill',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/icons/system/system-checkbox-circle-line/system-checkbox-circle-line.component.js'\n\nconst tagName = 'dap-ds-icon-checkbox-circle-line'\n\n/*\n `dap-ds-icon-checkbox-circle-line`\n * @summary An icon\n * @element dap-ds-icon-checkbox-circle-line\n * @title - SystemCheckboxCircleLine\n * @group icon\n * @icontype system\n \n @attribute {number} size - (optional) The width and height in pixels\n * @attribute {boolean} selected - (optional) Sets the icon color via the `fill` attribute\n * @attribute {string} accessibilityTitle - (optional) When using the icon standalone, make it meaningful for accessibility\n * @attribute {boolean} focusable - (optional) If `true` the icon can receive focus\n \n @csspart base - The main icon container.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'SystemCheckboxCircleLine',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/icons/system/system-close-circle-fill/system-close-circle-fill.component.js'\n\nconst tagName = 'dap-ds-icon-close-circle-fill'\n\n/*\n `dap-ds-icon-close-circle-fill`\n * @summary An icon\n * @element dap-ds-icon-close-circle-fill\n * @title - SystemCloseCircleFill\n * @group icon\n * @icontype system\n \n @attribute {number} size - (optional) The width and height in pixels\n * @attribute {boolean} selected - (optional) Sets the icon color via the `fill` attribute\n * @attribute {string} accessibilityTitle - (optional) When using the icon standalone, make it meaningful for accessibility\n * @attribute {boolean} focusable - (optional) If `true` the icon can receive focus\n \n @csspart base - The main icon container.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'SystemCloseCircleFill',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/icons/system/system-close-fill/system-close-fill.component.js'\n\nconst tagName = 'dap-ds-icon-close-fill'\n\n/*\n `dap-ds-icon-close-fill`\n * @summary An icon\n * @element dap-ds-icon-close-fill\n * @title - SystemCloseFill\n * @group icon\n * @icontype system\n \n @attribute {number} size - (optional) The width and height in pixels\n * @attribute {boolean} selected - (optional) Sets the icon color via the `fill` attribute\n * @attribute {string} accessibilityTitle - (optional) When using the icon standalone, make it meaningful for accessibility\n * @attribute {boolean} focusable - (optional) If `true` the icon can receive focus\n \n @csspart base - The main icon container.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'SystemCloseFill',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/icons/system/system-close-circle-line/system-close-circle-line.component.js'\n\nconst tagName = 'dap-ds-icon-close-circle-line'\n\n/*\n `dap-ds-icon-close-circle-line`\n * @summary An icon\n * @element dap-ds-icon-close-circle-line\n * @title - SystemCloseCircleLine\n * @group icon\n * @icontype system\n \n @attribute {number} size - (optional) The width and height in pixels\n * @attribute {boolean} selected - (optional) Sets the icon color via the `fill` attribute\n * @attribute {string} accessibilityTitle - (optional) When using the icon standalone, make it meaningful for accessibility\n * @attribute {boolean} focusable - (optional) If `true` the icon can receive focus\n \n @csspart base - The main icon container.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'SystemCloseCircleLine',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/icons/system/system-close-line/system-close-line.component.js'\n\nconst tagName = 'dap-ds-icon-close-line'\n\n/*\n `dap-ds-icon-close-line`\n * @summary An icon\n * @element dap-ds-icon-close-line\n * @title - SystemCloseLine\n * @group icon\n * @icontype system\n \n @attribute {number} size - (optional) The width and height in pixels\n * @attribute {boolean} selected - (optional) Sets the icon color via the `fill` attribute\n * @attribute {string} accessibilityTitle - (optional) When using the icon standalone, make it meaningful for accessibility\n * @attribute {boolean} focusable - (optional) If `true` the icon can receive focus\n \n @csspart base - The main icon container.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'SystemCloseLine',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/icons/system/system-error-warning-fill/system-error-warning-fill.component.js'\n\nconst tagName = 'dap-ds-icon-error-warning-fill'\n\n/*\n `dap-ds-icon-error-warning-fill`\n * @summary An icon\n * @element dap-ds-icon-error-warning-fill\n * @title - SystemErrorWarningFill\n * @group icon\n * @icontype system\n \n @attribute {number} size - (optional) The width and height in pixels\n * @attribute {boolean} selected - (optional) Sets the icon color via the `fill` attribute\n * @attribute {string} accessibilityTitle - (optional) When using the icon standalone, make it meaningful for accessibility\n * @attribute {boolean} focusable - (optional) If `true` the icon can receive focus\n \n @csspart base - The main icon container.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'SystemErrorWarningFill',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/icons/system/system-download-line/system-download-line.component.js'\n\nconst tagName = 'dap-ds-icon-download-line'\n\n/*\n `dap-ds-icon-download-line`\n * @summary An icon\n * @element dap-ds-icon-download-line\n * @title - SystemDownloadLine\n * @group icon\n * @icontype system\n \n @attribute {number} size - (optional) The width and height in pixels\n * @attribute {boolean} selected - (optional) Sets the icon color via the `fill` attribute\n * @attribute {string} accessibilityTitle - (optional) When using the icon standalone, make it meaningful for accessibility\n * @attribute {boolean} focusable - (optional) If `true` the icon can receive focus\n \n @csspart base - The main icon container.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'SystemDownloadLine',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/icons/system/system-error-warning-line/system-error-warning-line.component.js'\n\nconst tagName = 'dap-ds-icon-error-warning-line'\n\n/*\n `dap-ds-icon-error-warning-line`\n * @summary An icon\n * @element dap-ds-icon-error-warning-line\n * @title - SystemErrorWarningLine\n * @group icon\n * @icontype system\n \n @attribute {number} size - (optional) The width and height in pixels\n * @attribute {boolean} selected - (optional) Sets the icon color via the `fill` attribute\n * @attribute {string} accessibilityTitle - (optional) When using the icon standalone, make it meaningful for accessibility\n * @attribute {boolean} focusable - (optional) If `true` the icon can receive focus\n \n @csspart base - The main icon container.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'SystemErrorWarningLine',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/icons/system/system-external-link-line/system-external-link-line.component.js'\n\nconst tagName = 'dap-ds-icon-external-link-line'\n\n/*\n `dap-ds-icon-external-link-line`\n * @summary An icon\n * @element dap-ds-icon-external-link-line\n * @title - SystemExternalLinkLine\n * @group icon\n * @icontype system\n \n @attribute {number} size - (optional) The width and height in pixels\n * @attribute {boolean} selected - (optional) Sets the icon color via the `fill` attribute\n * @attribute {string} accessibilityTitle - (optional) When using the icon standalone, make it meaningful for accessibility\n * @attribute {boolean} focusable - (optional) If `true` the icon can receive focus\n \n @csspart base - The main icon container.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'SystemExternalLinkLine',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/icons/system/system-eye-line/system-eye-line.component.js'\n\nconst tagName = 'dap-ds-icon-eye-line'\n\n/*\n `dap-ds-icon-eye-line`\n * @summary An icon\n * @element dap-ds-icon-eye-line\n * @title - SystemEyeLine\n * @group icon\n * @icontype system\n \n @attribute {number} size - (optional) The width and height in pixels\n * @attribute {boolean} selected - (optional) Sets the icon color via the `fill` attribute\n * @attribute {string} accessibilityTitle - (optional) When using the icon standalone, make it meaningful for accessibility\n * @attribute {boolean} focusable - (optional) If `true` the icon can receive focus\n \n @csspart base - The main icon container.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'SystemEyeLine',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/icons/system/system-eye-off-line/system-eye-off-line.component.js'\n\nconst tagName = 'dap-ds-icon-eye-off-line'\n\n/*\n `dap-ds-icon-eye-off-line`\n * @summary An icon\n * @element dap-ds-icon-eye-off-line\n * @title - SystemEyeOffLine\n * @group icon\n * @icontype system\n \n @attribute {number} size - (optional) The width and height in pixels\n * @attribute {boolean} selected - (optional) Sets the icon color via the `fill` attribute\n * @attribute {string} accessibilityTitle - (optional) When using the icon standalone, make it meaningful for accessibility\n * @attribute {boolean} focusable - (optional) If `true` the icon can receive focus\n \n @csspart base - The main icon container.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'SystemEyeOffLine',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/icons/system/system-information-2-fill/system-information-2-fill.component.js'\n\nconst tagName = 'dap-ds-icon-information-2-fill'\n\n/*\n `dap-ds-icon-information-2-fill`\n * @summary An icon\n * @element dap-ds-icon-information-2-fill\n * @title - SystemInformation2Fill\n * @group icon\n * @icontype system\n \n @attribute {number} size - (optional) The width and height in pixels\n * @attribute {boolean} selected - (optional) Sets the icon color via the `fill` attribute\n * @attribute {string} accessibilityTitle - (optional) When using the icon standalone, make it meaningful for accessibility\n * @attribute {boolean} focusable - (optional) If `true` the icon can receive focus\n \n @csspart base - The main icon container.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'SystemInformation2Fill',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/icons/system/system-forbid-fill/system-forbid-fill.component.js'\n\nconst tagName = 'dap-ds-icon-forbid-fill'\n\n/*\n `dap-ds-icon-forbid-fill`\n * @summary An icon\n * @element dap-ds-icon-forbid-fill\n * @title - SystemForbidFill\n * @group icon\n * @icontype system\n \n @attribute {number} size - (optional) The width and height in pixels\n * @attribute {boolean} selected - (optional) Sets the icon color via the `fill` attribute\n * @attribute {string} accessibilityTitle - (optional) When using the icon standalone, make it meaningful for accessibility\n * @attribute {boolean} focusable - (optional) If `true` the icon can receive focus\n \n @csspart base - The main icon container.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'SystemForbidFill',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/icons/system/system-information-fill/system-information-fill.component.js'\n\nconst tagName = 'dap-ds-icon-information-fill'\n\n/*\n `dap-ds-icon-information-fill`\n * @summary An icon\n * @element dap-ds-icon-information-fill\n * @title - SystemInformationFill\n * @group icon\n * @icontype system\n \n @attribute {number} size - (optional) The width and height in pixels\n * @attribute {boolean} selected - (optional) Sets the icon color via the `fill` attribute\n * @attribute {string} accessibilityTitle - (optional) When using the icon standalone, make it meaningful for accessibility\n * @attribute {boolean} focusable - (optional) If `true` the icon can receive focus\n \n @csspart base - The main icon container.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'SystemInformationFill',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/icons/system/system-lightbulb-fill/system-lightbulb-fill.component.js'\n\nconst tagName = 'dap-ds-icon-lightbulb-fill'\n\n/*\n `dap-ds-icon-lightbulb-fill`\n * @summary An icon\n * @element dap-ds-icon-lightbulb-fill\n * @title - SystemLightbulbFill\n * @group icon\n * @icontype system\n \n @attribute {number} size - (optional) The width and height in pixels\n * @attribute {boolean} selected - (optional) Sets the icon color via the `fill` attribute\n * @attribute {string} accessibilityTitle - (optional) When using the icon standalone, make it meaningful for accessibility\n * @attribute {boolean} focusable - (optional) If `true` the icon can receive focus\n \n @csspart base - The main icon container.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'SystemLightbulbFill',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/icons/system/system-information-line/system-information-line.component.js'\n\nconst tagName = 'dap-ds-icon-information-line'\n\n/*\n `dap-ds-icon-information-line`\n * @summary An icon\n * @element dap-ds-icon-information-line\n * @title - SystemInformationLine\n * @group icon\n * @icontype system\n \n @attribute {number} size - (optional) The width and height in pixels\n * @attribute {boolean} selected - (optional) Sets the icon color via the `fill` attribute\n * @attribute {string} accessibilityTitle - (optional) When using the icon standalone, make it meaningful for accessibility\n * @attribute {boolean} focusable - (optional) If `true` the icon can receive focus\n \n @csspart base - The main icon container.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'SystemInformationLine',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/icons/system/system-lock-fill/system-lock-fill.component.js'\n\nconst tagName = 'dap-ds-icon-lock-fill'\n\n/*\n `dap-ds-icon-lock-fill`\n * @summary An icon\n * @element dap-ds-icon-lock-fill\n * @title - SystemLockFill\n * @group icon\n * @icontype system\n \n @attribute {number} size - (optional) The width and height in pixels\n * @attribute {boolean} selected - (optional) Sets the icon color via the `fill` attribute\n * @attribute {string} accessibilityTitle - (optional) When using the icon standalone, make it meaningful for accessibility\n * @attribute {boolean} focusable - (optional) If `true` the icon can receive focus\n \n @csspart base - The main icon container.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'SystemLockFill',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/icons/system/system-loading-spinner/system-loading-spinner.component.js'\n\nconst tagName = 'dap-ds-icon-loading-spinner'\n\n/*\n `dap-ds-icon-loading-spinner`\n * @summary An icon\n * @element dap-ds-icon-loading-spinner\n * @title - SystemLoadingSpinner\n * @group icon\n * @icontype system\n \n @attribute {number} size - (optional) The width and height in pixels\n * @attribute {boolean} selected - (optional) Sets the icon color via the `fill` attribute\n * @attribute {string} accessibilityTitle - (optional) When using the icon standalone, make it meaningful for accessibility\n * @attribute {boolean} focusable - (optional) If `true` the icon can receive focus\n \n @csspart base - The main icon container.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'SystemLoadingSpinner',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/icons/system/system-lock-line/system-lock-line.component.js'\n\nconst tagName = 'dap-ds-icon-lock-line'\n\n/*\n `dap-ds-icon-lock-line`\n * @summary An icon\n * @element dap-ds-icon-lock-line\n * @title - SystemLockLine\n * @group icon\n * @icontype system\n \n @attribute {number} size - (optional) The width and height in pixels\n * @attribute {boolean} selected - (optional) Sets the icon color via the `fill` attribute\n * @attribute {string} accessibilityTitle - (optional) When using the icon standalone, make it meaningful for accessibility\n * @attribute {boolean} focusable - (optional) If `true` the icon can receive focus\n \n @csspart base - The main icon container.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'SystemLockLine',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/icons/system/system-menu-line-s/system-menu-line-s.component.js'\n\nconst tagName = 'dap-ds-icon-menu-line-s'\n\n/*\n `dap-ds-icon-menu-line-s`\n * @summary An icon\n * @element dap-ds-icon-menu-line-s\n * @title - SystemMenuLineS\n * @group icon\n * @icontype system\n \n @attribute {number} size - (optional) The width and height in pixels\n * @attribute {boolean} selected - (optional) Sets the icon color via the `fill` attribute\n * @attribute {string} accessibilityTitle - (optional) When using the icon standalone, make it meaningful for accessibility\n * @attribute {boolean} focusable - (optional) If `true` the icon can receive focus\n \n @csspart base - The main icon container.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'SystemMenuLineS',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/icons/system/system-menu-line/system-menu-line.component.js'\n\nconst tagName = 'dap-ds-icon-menu-line'\n\n/*\n `dap-ds-icon-menu-line`\n * @summary An icon\n * @element dap-ds-icon-menu-line\n * @title - SystemMenuLine\n * @group icon\n * @icontype system\n \n @attribute {number} size - (optional) The width and height in pixels\n * @attribute {boolean} selected - (optional) Sets the icon color via the `fill` attribute\n * @attribute {string} accessibilityTitle - (optional) When using the icon standalone, make it meaningful for accessibility\n * @attribute {boolean} focusable - (optional) If `true` the icon can receive focus\n \n @csspart base - The main icon container.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'SystemMenuLine',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/icons/system/system-shield-check-fill/system-shield-check-fill.component.js'\n\nconst tagName = 'dap-ds-icon-shield-check-fill'\n\n/*\n `dap-ds-icon-shield-check-fill`\n * @summary An icon\n * @element dap-ds-icon-shield-check-fill\n * @title - SystemShieldCheckFill\n * @group icon\n * @icontype system\n \n @attribute {number} size - (optional) The width and height in pixels\n * @attribute {boolean} selected - (optional) Sets the icon color via the `fill` attribute\n * @attribute {string} accessibilityTitle - (optional) When using the icon standalone, make it meaningful for accessibility\n * @attribute {boolean} focusable - (optional) If `true` the icon can receive focus\n \n @csspart base - The main icon container.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'SystemShieldCheckFill',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/icons/system/system-search-line/system-search-line.component.js'\n\nconst tagName = 'dap-ds-icon-search-line'\n\n/*\n `dap-ds-icon-search-line`\n * @summary An icon\n * @element dap-ds-icon-search-line\n * @title - SystemSearchLine\n * @group icon\n * @icontype system\n \n @attribute {number} size - (optional) The width and height in pixels\n * @attribute {boolean} selected - (optional) Sets the icon color via the `fill` attribute\n * @attribute {string} accessibilityTitle - (optional) When using the icon standalone, make it meaningful for accessibility\n * @attribute {boolean} focusable - (optional) If `true` the icon can receive focus\n \n @csspart base - The main icon container.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'SystemSearchLine',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/icons/system/system-shield-check-line/system-shield-check-line.component.js'\n\nconst tagName = 'dap-ds-icon-shield-check-line'\n\n/*\n `dap-ds-icon-shield-check-line`\n * @summary An icon\n * @element dap-ds-icon-shield-check-line\n * @title - SystemShieldCheckLine\n * @group icon\n * @icontype system\n \n @attribute {number} size - (optional) The width and height in pixels\n * @attribute {boolean} selected - (optional) Sets the icon color via the `fill` attribute\n * @attribute {string} accessibilityTitle - (optional) When using the icon standalone, make it meaningful for accessibility\n * @attribute {boolean} focusable - (optional) If `true` the icon can receive focus\n \n @csspart base - The main icon container.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'SystemShieldCheckLine',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/icons/system/system-subtract-line/system-subtract-line.component.js'\n\nconst tagName = 'dap-ds-icon-subtract-line'\n\n/*\n `dap-ds-icon-subtract-line`\n * @summary An icon\n * @element dap-ds-icon-subtract-line\n * @title - SystemSubtractLine\n * @group icon\n * @icontype system\n \n @attribute {number} size - (optional) The width and height in pixels\n * @attribute {boolean} selected - (optional) Sets the icon color via the `fill` attribute\n * @attribute {string} accessibilityTitle - (optional) When using the icon standalone, make it meaningful for accessibility\n * @attribute {boolean} focusable - (optional) If `true` the icon can receive focus\n \n @csspart base - The main icon container.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'SystemSubtractLine',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/icons/system/system-star-fill/system-star-fill.component.js'\n\nconst tagName = 'dap-ds-icon-star-fill'\n\n/*\n `dap-ds-icon-star-fill`\n * @summary An icon\n * @element dap-ds-icon-star-fill\n * @title - SystemStarFill\n * @group icon\n * @icontype system\n \n @attribute {number} size - (optional) The width and height in pixels\n * @attribute {boolean} selected - (optional) Sets the icon color via the `fill` attribute\n * @attribute {string} accessibilityTitle - (optional) When using the icon standalone, make it meaningful for accessibility\n * @attribute {boolean} focusable - (optional) If `true` the icon can receive focus\n \n @csspart base - The main icon container.\n /\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'SystemStarFill',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport as React from 'react'\n\nimport Component from '../../components/icons/system/system-subtract-line2/system-subtract-line2.component.js'\n\nconst tagName = 'dap-ds-icon-subtract-line2'\n\n/*\n `dap-ds-icon-subtract-line2`\n * @summary An icon\n * @element dap-ds-icon-subtract-line2\n * @title - SystemSubtractLine2\n * @group icon\n * @icontype system\n \n @attribute {number} size - (optional) The width and height in pixels\n * @attribute {boolean} selected - (optional) Sets the icon color via the `fill` attribute\n * @attribute {string} accessibilityTitle - (optional) When using the icon standalone, make it meaningful for accessibility\n * @attribute {boolean} focusable - (optional) If `true` the icon can receive focus\n \n @csspart base - The main icon container.\n */\nconst reactWrapper = createComponent({\n tagName,\n elementClass: Component,\n react: React,\n events: {},\n displayName: 'SystemSubtractLine2',\n})\n\nexport default reactWrapper\n"],"names":["tagName","reactWrapper","createComponent","Component","React"],"mappings":"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"}