dap-design-system 0.53.21 → 0.54.0

package/dist/react.js.map

@@ -1 +1 @@
-{"version":3,"file":"react.js","sources":["../src/react/dap-ds-accordion-group/index.ts","../src/react/dap-ds-avatar-group/index.ts","../src/react/dap-ds-anchor-heading/index.ts","../src/react/dap-ds-badge/index.ts","../src/react/dap-ds-banner/index.ts","../src/react/dap-ds-breadcrumb/index.ts","../src/react/dap-ds-accordion/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-chip/index.ts","../src/react/dap-ds-checkbox/index.ts","../src/react/dap-ds-code-puncher-slot/index.ts","../src/react/dap-ds-code-puncher/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-navigation-menu-item/index.ts","../src/react/dap-ds-navigation-menu/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-group/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-progress/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-scroll-progress/index.ts","../src/react/dap-ds-search/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-select/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-skeleton/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-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-time-grid/index.ts","../src/react/dap-ds-timepicker/index.ts","../src/react/dap-ds-timeline-item/index.ts","../src/react/dap-ds-timeline/index.ts","../src/react/dap-ds-tab-group/index.ts","../src/react/dap-ds-tab/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-line/index.ts","../src/react/dap-ds-icon-arrow-left-l-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-line/index.ts","../src/react/dap-ds-icon-arrow-right-s-fill/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-calendar-line/index.ts","../src/react/dap-ds-icon-home-6-line/index.ts","../src/react/dap-ds-icon-edit-line/index.ts","../src/react/dap-ds-icon-tools-line/index.ts","../src/react/dap-ds-icon-computer-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-file-image-line/index.ts","../src/react/dap-ds-icon-file-music-line/index.ts","../src/react/dap-ds-icon-file-text-line/index.ts","../src/react/dap-ds-icon-file-video-line/index.ts","../src/react/dap-ds-icon-folder-line/index.ts","../src/react/dap-ds-icon-folder-open-line/index.ts","../src/react/dap-ds-icon-heart-fill/index.ts","../src/react/dap-ds-icon-separator/index.ts","../src/react/dap-ds-icon-heart-line/index.ts","../src/react/dap-ds-icon-cookie-line/index.ts","../src/react/dap-ds-icon-account-circle-fill/index.ts","../src/react/dap-ds-icon-account-circle-line/index.ts","../src/react/dap-ds-icon-user-fill/index.ts","../src/react/dap-ds-icon-user-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-delete-bin-fill/index.ts","../src/react/dap-ds-icon-delete-bin-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-more-2-line/index.ts","../src/react/dap-ds-icon-more-line/index.ts","../src/react/dap-ds-icon-search-line/index.ts","../src/react/dap-ds-icon-share-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","../src/react/dap-ds-icon-time-fill/index.ts","../src/react/dap-ds-icon-time-line/index.ts","../src/react/dap-ds-icon-upload-2-fill/index.ts","../src/react/dap-ds-icon-upload-2-line/index.ts","../src/react/dap-ds-icon-upload-line/index.ts"],"sourcesContent":["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","\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/avatar-group/avatar-group.component.js'\n      import type { DdsOverflowClickEvent } from '../../events/events'\n      export type { DdsOverflowClickEvent } from '../../events/events'\n\n      const tagName = 'dap-ds-avatar-group'\n\n      /**\n * `dap-ds-avatar-group`\n * @summary Avatar group component displays multiple avatars in an organized layout with overflow management.\n * @element dap-ds-avatar-group\n * @title - Avatar Group\n * @group avatar\n *\n * @slot - The avatars to display in the group.\n *\n * @event dds-overflow-click - Fired when the overflow indicator is clicked.\n *\n * @csspart base - The main container of the avatar group.\n * @csspart avatars - The container for the visible avatars.\n * @csspart overflow - The overflow indicator element.\n *\n * @cssproperty --dds-avatar-group-gap - Gap between avatars in grid layout (default: 0)\n * @cssproperty --dds-avatar-group-overlap - Overlap amount for stacked layout (default: -8px)\n * @cssproperty --dds-avatar-group-border-width - Border width for avatars (default: var(--dds-border-width-base))\n * @cssproperty --dds-avatar-group-border-color - Border color for avatars (default: var(--dds-border-neutral-divider))\n * @cssproperty --dds-avatar-group-overflow-bg - Background color for overflow indicator (default: var(--dds-neutral-300))\n * @cssproperty --dds-avatar-group-overflow-color - Text color for overflow indicator (default: var(--dds-neutral-700))\n * @cssproperty --dds-avatar-group-overflow-border - Border for overflow indicator (default: var(--dds-avatar-group-border-width) solid var(--dds-avatar-group-border-color))\n * @cssproperty --dds-avatar-group-size-lg - Size for large avatars (default: var(--dds-spacing-2000))\n * @cssproperty --dds-avatar-group-size-md - Size for medium avatars (default: var(--dds-spacing-1600))\n * @cssproperty --dds-avatar-group-size-sm - Size for small avatars (default: var(--dds-spacing-1200))\n * @cssproperty --dds-avatar-group-size-xs - Size for extra small avatars (default: var(--dds-spacing-800))\n * @cssproperty --dds-avatar-group-size-xxs - Size for extra extra small avatars (default: var(--dds-spacing-400))\n *\n * @property { 'xxs' | 'xs' | 'sm' | 'md' | 'lg' } size - The size of avatars in the group. Default is `md`. See SizedMixin.\n * @property {string} sizeMap - Responsive size map (e.g. \"md:lg\"); see SizedMixin.\n */\n      const reactWrapper = createComponent({\n        tagName,\n        elementClass: Component,\n        react: React,\n        events: {\n          onDdsOverflowClick: 'dds-overflow-click' as EventName<DdsOverflowClickEvent>\n        },\n        displayName: \"DapDSAvatarGroup\"\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: var(--dds-color-primary))\n * @cssproperty --dds-anchor-link-opacity - The opacity of the anchor link when not hovered (default: 0)\n * @cssproperty --dds-anchor-link-hover-opacity - The opacity of the anchor link when hovered (default: 1)\n * @cssproperty --dds-anchor-link-transition - The transition property for the anchor link opacity (default: 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/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 * @property { 'sm' | 'lg' } size - The size of the badge. Default is `sm`.\n * @property {string} sizeMap - Responsive size map (e.g. \"md:lg\").\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: var(--dds-border-width-base))\n * @cssproperty --dds-badge-border-style - The style of the badge's border (default: solid)\n * @cssproperty --dds-badge-border-radius - The border radius of the badge (default: var(--dds-radius-base))\n * @cssproperty --dds-badge-font-weight - The font weight of the badge text (default: var(--dds-font-weight-bold))\n * @cssproperty --dds-badge-line-height - The line height of the badge text (default: 1.2)\n * @cssproperty --dds-badge-transition - The transition property for the badge (default: all 0.2s ease-in-out)\n *\n * @cssproperty --dds-badge-padding-sm - The padding of the small badge (default: var(--dds-spacing-100) var(--dds-spacing-200))\n * @cssproperty --dds-badge-padding-lg - The padding of the large badge (default: var(--dds-spacing-100) var(--dds-spacing-300))\n * @cssproperty --dds-badge-font-size-sm - The font size of the small badge (default: var(--dds-font-xs))\n * @cssproperty --dds-badge-font-size-lg - The font size of the large badge (default: var(--dds-font-sm))\n *\n * @cssproperty --dds-badge-neutral-border-color - The border color of the neutral badge (default: var(--dds-border-neutral-base))\n * @cssproperty --dds-badge-neutral-background - The background color of the neutral badge (default: var(--dds-background-neutral-medium))\n * @cssproperty --dds-badge-neutral-color - The text color of the neutral badge (default: var(--dds-text-neutral-subtle))\n *\n * @cssproperty --dds-badge-brand-border-color - The border color of the brand badge (default: var(--dds-border-brand-base))\n * @cssproperty --dds-badge-brand-background - The background color of the brand badge (default: var(--dds-background-brand-medium))\n * @cssproperty --dds-badge-brand-color - The text color of the brand badge (default: var(--dds-text-brand-subtle))\n *\n * @cssproperty --dds-badge-info-border-color - The border color of the info badge (default: var(--dds-border-informative-base))\n * @cssproperty --dds-badge-info-background - The background color of the info badge (default: var(--dds-background-informative-medium))\n * @cssproperty --dds-badge-info-color - The text color of the info badge (default: var(--dds-text-informative-subtle))\n *\n * @cssproperty --dds-badge-positive-border-color - The border color of the positive badge (default: var(--dds-border-positive-base))\n * @cssproperty --dds-badge-positive-background - The background color of the positive badge (default: var(--dds-background-positive-medium))\n * @cssproperty --dds-badge-positive-color - The text color of the positive badge (default: var(--dds-text-positive-subtle))\n *\n * @cssproperty --dds-badge-warning-border-color - The border color of the warning badge (default: var(--dds-border-warning-subtle))\n * @cssproperty --dds-badge-warning-background - The background color of the warning badge (default: var(--dds-background-warning-medium))\n * @cssproperty --dds-badge-warning-color - The text color of the warning badge (default: var(--dds-text-warning-subtle))\n *\n * @cssproperty --dds-badge-negative-border-color - The border color of the negative badge (default: var(--dds-border-negative-base))\n * @cssproperty --dds-badge-negative-background - The background color of the negative badge (default: var(--dds-background-negative-medium))\n * @cssproperty --dds-badge-negative-color - The text color of the negative badge (default: var(--dds-text-negative-subtle))\n *\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 {{ 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: var(--dds-spacing-200))\n * @cssproperty --dds-banner-line-height - The line height of the banner text (default: var(--dds-font-line-height-xlarge))\n * @cssproperty --dds-banner-transition - The transition property for the banner (default: all 0.2s ease-in-out)\n *\n * @cssproperty --dds-banner-brand-background - The background color of the brand banner (default: var(--dds-banner-background-brand))\n * @cssproperty --dds-banner-brand-icon-color - The color of the brand banner icon (default: var(--dds-banner-icon-brand))\n * @cssproperty --dds-banner-brand-text-color - The text color of the brand banner (default: var(--dds-banner-text-brand))\n * @cssproperty --dds-banner-brand-action-color - The color of the brand banner actions (default: var(--dds-banner-action-enabled))\n *\n * @cssproperty --dds-banner-info-background - The background color of the info banner (default: var(--dds-banner-background-informative))\n * @cssproperty --dds-banner-info-icon-color - The color of the info banner icon (default: var(--dds-banner-icon-informative))\n * @cssproperty --dds-banner-info-text-color - The text color of the info banner (default: var(--dds-banner-text-informative))\n * @cssproperty --dds-banner-info-action-color - The color of the info banner actions (default: var(--dds-banner-action-enabled))\n *\n * @cssproperty --dds-banner-positive-background - The background color of the positive banner (default: var(--dds-banner-background-positive))\n * @cssproperty --dds-banner-positive-icon-color - The color of the positive banner icon (default: var(--dds-banner-icon-positive))\n * @cssproperty --dds-banner-positive-text-color - The text color of the positive banner (default: var(--dds-banner-text-positive))\n * @cssproperty --dds-banner-positive-action-color - The color of the positive banner actions (default: var(--dds-banner-action-enabled))\n *\n * @cssproperty --dds-banner-warning-background - The background color of the warning banner (default: var(--dds-banner-background-warning))\n * @cssproperty --dds-banner-warning-icon-color - The color of the warning banner icon (default: var(--dds-banner-icon-warning))\n * @cssproperty --dds-banner-warning-text-color - The text color of the warning banner (default: var(--dds-banner-text-warning))\n * @cssproperty --dds-banner-warning-action-color - The color of the warning banner actions (default: var(--dds-banner-action-inverted-enabled))\n *\n * @cssproperty --dds-banner-negative-background - The background color of the negative banner (default: var(--dds-banner-background-negative))\n * @cssproperty --dds-banner-negative-icon-color - The color of the negative banner icon (default: var(--dds-banner-icon-negative))\n * @cssproperty --dds-banner-negative-text-color - The text color of the negative banner (default: var(--dds-banner-text-negative))\n * @cssproperty --dds-banner-negative-action-color - The color of the negative banner actions (default: var(--dds-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: 100%)\n * @cssproperty --dds-breadcrumb-overflow-x - The horizontal overflow behavior of the breadcrumb (default: auto)\n * @cssproperty --dds-breadcrumb-transition - The transition property for the breadcrumb (default: all 0.2s ease-in-out)\n * @cssproperty --dds-breadcrumb-list-display - The display property of the breadcrumb list (default: flex)\n * @cssproperty --dds-breadcrumb-list-flex-wrap - The flex-wrap property of the breadcrumb list (default: nowrap)\n * @cssproperty --dds-breadcrumb-list-align-items - The align-items property of the breadcrumb list (default: center)\n * @cssproperty --dds-breadcrumb-list-min-width - The minimum width of the breadcrumb list (default: 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","\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 { 'xxs' | 'xs' | 'sm' | 'md' | 'lg' } size - The size of the accordion. Default is `sm`. Visual variants are sm and lg (other sizes map to sm).\n * @property {string} sizeMap - Responsive size map (e.g. \"md:lg\")\n * @property {string} parentSized - When \"true\", size is taken from the parent card if present.\n * @property {string} heading - The heading text of the accordion, this will be used as the aria label of the heading also if ariaLabel is not provided\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 * @property {boolean} disabled - Whether the accordion is disabled.\n * @property {boolean} loading - Whether the accordion is in loading state.\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    ","\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/avatar/avatar.component.js'\n      import type { DdsLoadEvent } from '../../events/events'\nimport type { DdsErrorEvent } from '../../events/events'\n      export type { DdsLoadEvent } from '../../events/events'\nexport type { DdsErrorEvent } from '../../events/events'\n\n      const tagName = 'dap-ds-avatar'\n\n      /**\n * `dap-ds-avatar`\n * @summary Avatar component can be used to display user profile images, initials, or icons.\n * @element dap-ds-avatar\n * @title - Avatar\n *\n * @slot icon - The icon to display when variant is 'icon'.\n * @slot fallback - Custom fallback content when image fails to load.\n *\n * @event dds-load - Fired when the image loads successfully.\n * @event dds-error - Fired when the image fails to load.\n *\n * @csspart base - The main avatar container.\n * @csspart img - The avatar image.\n * @csspart initials - The initials container.\n * @csspart icon - The icon container.\n * @csspart fallback - The fallback content container.\n * @csspart loading - The loading indicator.\n *\n * @cssproperty --dds-avatar-border-radius - The border radius of the avatar (default: 50%)\n * @cssproperty --dds-avatar-background-color - The background color of the avatar (default: var(--dds-neutral-200))\n * @cssproperty --dds-avatar-border-width - The border width of the avatar (default: 0)\n * @cssproperty --dds-avatar-border-color - The color of the avatar's border (default: transparent)\n * @cssproperty --dds-avatar-border-style - The style of the avatar's border (default: solid)\n * @cssproperty --dds-avatar-transition - The transition property for the avatar (default: all 0.2s ease-in-out)\n * @cssproperty --dds-avatar-text-color - The text color for initials (default: var(--dds-text-neutral-strong))\n * @cssproperty --dds-avatar-font-weight - The font weight for initials (default: var(--dds-font-weight-bold))\n * @cssproperty --dds-avatar-lg-size - Size for large avatars (default: var(--dds-avatar-size-lg))\n * @cssproperty --dds-avatar-md-size - Size for medium avatars (default: var(--dds-avatar-size-md))\n * @cssproperty --dds-avatar-sm-size - Size for small avatars (default: var(--dds-avatar-size-sm))\n * @cssproperty --dds-avatar-xs-size - Size for extra small avatars (default: var(--dds-avatar-size-xs))\n * @cssproperty --dds-avatar-xxs-size - Size for extra extra small avatars (default: var(--dds-avatar-size-xxs))\n * @cssproperty --dds-avatar-font-size-lg - Font size for large avatars (default: var(--dds-font-2xl))\n * @cssproperty --dds-avatar-font-size-md - Font size for medium avatars (default: var(--dds-font-lg))\n * @cssproperty --dds-avatar-font-size-sm - Font size for small avatars (default: var(--dds-font-base))\n * @cssproperty --dds-avatar-font-size-xs - Font size for extra small avatars (default: var(--dds-font-sm))\n * @cssproperty --dds-avatar-font-size-xxs - Font size for extra extra small avatars (default: var(--dds-font-xs))\n * @cssproperty --dds-avatar-hover-transform - Transform applied on hover for interactive avatars (default: scale(1.05))\n * @cssproperty --dds-avatar-active-transform - Transform applied when active for interactive avatars (default: scale(0.95))\n * @cssproperty --dds-avatar-focus-ring - Focus ring style for interactive avatars (default: 0 0 0 2px var(--dds-focus-outer-ring))\n * @cssproperty --dds-avatar-loading-background - Background color when loading (default: var(--dds-neutral-100))\n * @cssproperty --dds-avatar-error-background - Background color when image fails to load (default: var(--dds-negative-100))\n * @cssproperty --dds-avatar-error-color - Text color when image fails to load (default: var(--dds-negative-600))\n *\n * @property { 'xxs' | 'xs' | 'sm' | 'md' | 'lg' } size - The size of the avatar. Default is `md`.\n * @property {string} sizeMap - Responsive size map (e.g. \"md:lg\").\n */\n      const reactWrapper = createComponent({\n        tagName,\n        elementClass: Component,\n        react: React,\n        events: {\n          onDdsLoad: 'dds-load' as EventName<DdsLoadEvent>,\nonDdsError: 'dds-error' as EventName<DdsErrorEvent>\n        },\n        displayName: \"DapDSAvatar\"\n      })\n\n      export 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: inline-flex)\n * @cssproperty --dds-breadcrumb-item-flex-wrap - The flex-wrap property of the breadcrumb item (default: nowrap)\n * @cssproperty --dds-breadcrumb-item-align-items - The align-items property of the breadcrumb item (default: center)\n * @cssproperty --dds-breadcrumb-item-color - The text color of the breadcrumb item (default: var(--dds-text-neutral-base))\n * @cssproperty --dds-breadcrumb-item-transition - The transition property for the breadcrumb item (default: all 0.2s ease-in-out)\n * @cssproperty --dds-breadcrumb-item-gap - The gap between the breadcrumb item and the separator (default: var(--dds-spacing-200))\n * @cssproperty --dds-breadcrumb-item-padding - The padding of the breadcrumb item (default: var(--dds-spacing-200))\n * @cssproperty --dds-breadcrumb-item-font-size - The font size of the breadcrumb item (default: var(--dds-font-sm))\n * @cssproperty --dds-breadcrumb-item-font-weight - The font weight of the breadcrumb item (default: var(--dds-font-weight-medium))\n * @cssproperty --dds-breadcrumb-item-font-weight-bold - The bold font weight of the breadcrumb item (default: var(--dds-font-weight-bold))\n * @cssproperty --dds-breadcrumb-item-separator-color - The color of the separator (default: var(--dds-text-neutral-disabled))\n * @cssproperty --dds-breadcrumb-item-link-color - The color of the link (default: var(--dds-link-neutral-enabled))\n * @cssproperty --dds-breadcrumb-item-inverted-color - The text color when inverted (default: var(--dds-text-neutral-inverted))\n * @cssproperty --dds-breadcrumb-item-inverted-link-color - The link color when inverted (default: var(--dds-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","\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/button/button.component.js'\n      import type { DdsLoadingTimeoutEvent } from '../../events/events'\n      export type { DdsLoadingTimeoutEvent } from '../../events/events'\n\n      const tagName = 'dap-ds-button'\n\n      /**\n * `dap-ds-button` is a versatile button component for triggering actions and navigation.\n * @element dap-ds-button\n * @summary A button is a clickable element that can be used to trigger an action, submit forms, or navigate to other pages.\n * @title - Button\n *\n * @example Basic Usage\n * ```html\n * <dap-ds-button>Click me</dap-ds-button>\n * <dap-ds-button variant=\"outline\">Secondary action</dap-ds-button>\n * <dap-ds-button href=\"/dashboard\">Navigate</dap-ds-button>\n * ```\n *\n * @example Form Integration\n * ```html\n * <form>\n *   <dap-ds-button htmlType=\"submit\">Submit Form</dap-ds-button>\n *   <dap-ds-button htmlType=\"reset\" variant=\"outline\">Reset</dap-ds-button>\n * </form>\n * ```\n *\n * @example Accessibility\n * ```html\n * <!-- Icon-only buttons require aria-label -->\n * <dap-ds-button aria-label=\"Close dialog\" shape=\"circle\">\n *   <dap-ds-icon name=\"close-line\"></dap-ds-icon>\n * </dap-ds-button>\n * ```\n *\n * @property {string} sizeMap - The size map of the button.\n * @example\n * ```html\n * <dap-ds-button sizeMap=\"sm:lg,xs:xs\">Small</dap-ds-button>\n * ```\n *\n * @event dds-loading-timeout - Emitted when the loading timeout is reached\n *\n * @slot - The content of the button. Can contain text, icons, or other elements.\n *\n * @csspart base - The main button container.\n * @csspart high-contrast - The high contrast part of the button.\n * @csspart content - The content wrapper inside 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 */\n      const reactWrapper = createComponent({\n        tagName,\n        elementClass: Component,\n        react: React,\n        events: {\n          onDdsLoadingTimeout: 'dds-loading-timeout' as EventName<DdsLoadingTimeoutEvent>\n        },\n        displayName: \"DapDSButton\"\n      })\n\n      export 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 * @cssproperty --dds-calendar-cell-display - The display property of the calendar cell host (default: flex)\n * @cssproperty --dds-calendar-cell-position - The position property of the calendar cell host (default: relative)\n * @cssproperty --dds-calendar-cell-border-radius - The border radius of the calendar cell (default: var(--dds-radius-rounded))\n * @cssproperty --dds-calendar-cell-min-width - The minimum width of the calendar cell (default: var(--dds-spacing-1000))\n * @cssproperty --dds-calendar-cell-height - The height of the calendar cell (default: var(--dds-spacing-1000))\n * @cssproperty --dds-calendar-cell-min-height - The minimum height of the calendar cell (default: var(--dds-spacing-1000))\n * @cssproperty --dds-calendar-cell-color - The text color of the calendar cell (default: var(--dds-button-subtle-text-neutral-enabled))\n * @cssproperty --dds-calendar-cell-font-size - The font size of the calendar cell (default: var(--dds-font-sm))\n * @cssproperty --dds-calendar-cell-font-weight - The font weight of the calendar cell (default: var(--dds-font-weight-medium))\n * @cssproperty --dds-calendar-cell-text-align - The text alignment of the calendar cell (default: center)\n * @cssproperty --dds-calendar-cell-cursor - The cursor style of the calendar cell (default: pointer)\n * @cssproperty --dds-calendar-cell-background-hover - The background color of the calendar cell on hover (default: var(--dds-background-neutral-medium))\n * @cssproperty --dds-calendar-cell-background-active - The background color of the calendar cell when active (default: var(--dds-background-neutral-strong))\n *\n * @cssproperty --dds-calendar-cell-selected-background - The background color of the selected calendar cell (default: var(--dds-button-primary-background-enabled))\n * @cssproperty --dds-calendar-cell-selected-color - The text color of the selected calendar cell (default: var(--dds-button-primary-text-enabled))\n * @cssproperty --dds-calendar-cell-selected-background-hover - The background color of the selected calendar cell on hover (default: var(--dds-button-primary-background-hover))\n * @cssproperty --dds-calendar-cell-selected-background-pressed - The background color of the selected calendar cell when pressed (default: var(--dds-button-primary-background-pressed))\n * @cssproperty --dds-calendar-cell-selected-today-mark-background - The background color of the today mark in selected calendar cell (default: var(--dds-text-neutral-on-inverted))\n *\n * @cssproperty --dds-calendar-cell-disabled-color - The text color of the disabled calendar cell (default: var(--dds-text-neutral-disabled))\n * @cssproperty --dds-calendar-cell-disabled-cursor - The cursor style of the disabled calendar cell (default: not-allowed)\n *\n * @cssproperty --dds-calendar-cell-out-of-range-color - The text color of the out-of-range calendar cell (default: var(--dds-text-neutral-placeholder))\n *\n * @cssproperty --dds-calendar-cell-today-font-weight - The font weight of the today calendar cell (default: var(--dds-font-weight-bold))\n *\n * @cssproperty --dds-calendar-cell-header-background - The background color of the header calendar cell (default: transparent)\n * @cssproperty --dds-calendar-cell-header-color - The text color of the header calendar cell (default: var(--dds-text-neutral-base))\n * @cssproperty --dds-calendar-cell-header-text-transform - The text transform of the header calendar cell (default: capitalize)\n * @cssproperty --dds-calendar-cell-header-cursor - The cursor style of the header calendar cell (default: default)\n *\n * @cssproperty --dds-calendar-cell-in-range-color - The text color of the in-range calendar cell (default: var(--dds-button-primary-text-enabled))\n * @cssproperty --dds-calendar-cell-in-range-background-hover - The background color of the in-range calendar cell on hover (default: var(--dds-button-primary-background-hover))\n * @cssproperty --dds-calendar-cell-in-range-background-pressed - The background color of the in-range calendar cell when pressed (default: var(--dds-button-primary-background-pressed))\n *\n * @cssproperty --dds-calendar-cell-range-background - The background color of the range start/end calendar cell (default: var(--dds-button-primary-background-enabled))\n * @cssproperty --dds-calendar-cell-range-color - The text color of the range start/end calendar cell (default: var(--dds-button-primary-text-enabled))\n * @cssproperty --dds-calendar-cell-range-today-mark-background - The background color of the today mark in range start/end calendar cell (default: var(--dds-text-neutral-on-inverted))\n *\n * @cssproperty --dds-calendar-cell-today-mark-bottom - The bottom position of the today mark (default: var(--dds-spacing-100))\n * @cssproperty --dds-calendar-cell-today-mark-width - The width of the today mark (default: 5px)\n * @cssproperty --dds-calendar-cell-today-mark-height - The height of the today mark (default: 5px)\n * @cssproperty --dds-calendar-cell-today-mark-stroke - The stroke color of the today mark (default: var(--dds-border-neutral-transparent))\n * @cssproperty --dds-calendar-cell-today-mark-background - The background color of the today mark (default: var(--dds-background-neutral-medium-inverted))\n * @cssproperty --dds-calendar-cell-today-mark-fill - The fill color of the today mark (default: var(--dds-background-neutral-medium-inverted))\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 calendar-header - The header of the calendar.\n * @csspart body - The body of the calendar.\n * @csspart calendar-grid-header - The header of the calendar grid.\n * @csspart calendar-grid-header-cell - The header cell of the calendar grid.\n * @csspart calendar-grid-cell - The cell of the calendar grid.\n * @csspart calendar-header-button-prev - The previous month button of the calendar header.\n * @csspart calendar-header-button-next - The next month button of the calendar header.\n * @csspart calendar-header-year-select - The year select of the calendar header.\n * @csspart calendar-header-month-select - The month select of the calendar header.\n *\n * @cssproperty --dds-calendar-display - The display property of the calendar container (default: flex)\n * @cssproperty --dds-calendar-isolation - The isolation property of the calendar (default: isolate)\n * @cssproperty --dds-calendar-block-display - The display property of the calendar block (default: block)\n * @cssproperty --dds-calendar-transition - The transition property for the calendar (default: all 0.2s ease-in-out)\n * @cssproperty --dds-calendar-header-display - The display property of the calendar header (default: grid)\n * @cssproperty --dds-calendar-header-grid-flow - The grid-auto-flow property of the calendar header (default: column)\n * @cssproperty --dds-calendar-header-width - The width of the calendar header (default: 100%)\n * @cssproperty --dds-calendar-header-gap - The gap between header items (default: var(--dds-spacing-100))\n * @cssproperty --dds-calendar-select-min-height - The minimum height of the select trigger (default: auto)\n * @cssproperty --dds-calendar-select-max-height - The maximum height of the select trigger (default: 32px)\n * @cssproperty --dds-calendar-select-padding - The padding of the select trigger (default: var(--dds-spacing-200))\n * @cssproperty --dds-calendar-select-border-radius - The border radius of the select trigger (default: var(--dds-radius-rounded))\n * @cssproperty --dds-calendar-select-border-color - The border color of the select trigger (default: var(--dds-border-neutral-transparent-interactive))\n * @cssproperty --dds-calendar-select-background - The background color of the select trigger (default: var(--dds-button-subtle-background-enabled))\n * @cssproperty --dds-calendar-select-color - The text color of the select trigger (default: var(--dds-button-subtle-text-enabled))\n * @cssproperty --dds-calendar-select-font-size - The font size of the select trigger (default: var(--dds-font-sm))\n * @cssproperty --dds-calendar-select-font-style - The font style of the select trigger (default: normal)\n * @cssproperty --dds-calendar-select-font-weight - The font weight of the select trigger (default: var(--dds-font-weight-bold))\n * @cssproperty --dds-calendar-nav-button-margin - The margin of the navigation buttons (default: var(--dds-spacing-200))\n * @cssproperty --dds-calendar-nav-button-color - The color of the navigation button icons (default: var(--dds-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 content - The content of the callout.\n * @csspart card-content - The content of the card.\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 * @cssproperty --dds-callout-border-radius - Border radius of the callout. (default: var(--dds-radius-base))\n *\n * @cssproperty --dds-callout-brand-background - Brand variant background color. (default: var(--dds-background-brand-base))\n * @cssproperty --dds-callout-brand-background-subtle - Brand variant subtle background color. (default: var(--dds-background-brand-subtle))\n * @cssproperty --dds-callout-brand-background-medium - Brand variant medium background color. (default: var(--dds-background-brand-medium))\n * @cssproperty --dds-callout-brand-background-strong - Brand variant strong background color. (default: var(--dds-background-brand-strong))\n * @cssproperty --dds-callout-brand-icon - Brand variant icon color. (default: var(--dds-icon-brand-subtle))\n * @cssproperty --dds-callout-brand-border - Brand variant border color. (default: var(--dds-border-brand-subtle))\n *\n * @cssproperty --dds-callout-info-background - Info variant background color. (default: var(--dds-background-informative-base))\n * @cssproperty --dds-callout-info-background-subtle - Info variant subtle background color. (default: var(--dds-background-informative-subtle))\n * @cssproperty --dds-callout-info-background-medium - Info variant medium background color. (default: var(--dds-background-informative-medium))\n * @cssproperty --dds-callout-info-background-strong - Info variant strong background color. (default: var(--dds-background-informative-strong))\n * @cssproperty --dds-callout-info-icon - Info variant icon color. (default: var(--dds-icon-informative-subtle))\n * @cssproperty --dds-callout-info-border - Info variant border color. (default: var(--dds-border-informative-subtle))\n *\n * @cssproperty --dds-callout-positive-background - Positive variant background color. (default: var(--dds-background-positive-base))\n * @cssproperty --dds-callout-positive-background-subtle - Positive variant subtle background color. (default: var(--dds-background-positive-subtle))\n * @cssproperty --dds-callout-positive-background-medium - Positive variant medium background color. (default: var(--dds-background-positive-medium))\n * @cssproperty --dds-callout-positive-background-strong - Positive variant strong background color. (default: var(--dds-background-positive-strong))\n * @cssproperty --dds-callout-positive-icon - Positive variant icon color. (default: var(--dds-icon-positive-subtle))\n * @cssproperty --dds-callout-positive-border - Positive variant border color. (default: var(--dds-border-positive-subtle))\n *\n * @cssproperty --dds-callout-warning-background - Warning variant background color. (default: var(--dds-background-warning-base))\n * @cssproperty --dds-callout-warning-background-subtle - Warning variant subtle background color. (default: var(--dds-background-warning-subtle))\n * @cssproperty --dds-callout-warning-background-medium - Warning variant medium background color. (default: var(--dds-background-warning-medium))\n * @cssproperty --dds-callout-warning-background-strong - Warning variant strong background color. (default: var(--dds-background-warning-strong))\n * @cssproperty --dds-callout-warning-icon - Warning variant icon color. (default: var(--dds-icon-neutral-strong))\n * @cssproperty --dds-callout-warning-border - Warning variant border color. (default: var(--dds-border-warning-subtle))\n *\n * @cssproperty --dds-callout-negative-background - Negative variant background color. (default: var(--dds-background-negative-base))\n * @cssproperty --dds-callout-negative-background-subtle - Negative variant subtle background color. (default: var(--dds-background-negative-subtle))\n * @cssproperty --dds-callout-negative-background-medium - Negative variant medium background color. (default: var(--dds-background-negative-medium))\n * @cssproperty --dds-callout-negative-background-strong - Negative variant strong background color. (default: var(--dds-background-negative-strong))\n * @cssproperty --dds-callout-negative-icon - Negative variant icon color. (default: var(--dds-icon-negative-subtle))\n * @cssproperty --dds-callout-negative-border - Negative variant border color. (default: var(--dds-border-negative-subtle))\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 * @property {string} sizeMap - Responsive size map (e.g. \"md:lg\").\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: var(--dds-spacing-200))\n * @cssproperty --dds-card-actions-padding-lg - The padding for large size card actions. (default: var(--dds-spacing-600))\n * @cssproperty --dds-card-actions-padding-md - The padding for medium size card actions. (default: var(--dds-spacing-400))\n * @cssproperty --dds-card-actions-padding-sm - The padding for small size card actions. (default: var(--dds-spacing-400))\n * @cssproperty --dds-card-actions-margin-lg - The margin for large size card actions spacing. (default: var(--dds-spacing-600))\n * @cssproperty --dds-card-actions-margin-md - The margin for medium size card actions spacing. (default: var(--dds-spacing-400))\n * @cssproperty --dds-card-actions-margin-sm - The margin for small size card actions spacing. (default: 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 * @property {string} sizeMap - Responsive size map (e.g. \"md:lg\").\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: 0)\n * @cssproperty --dds-card-content-margin - The margin of the card content. (default: 0)\n * @cssproperty --dds-card-content-font-size - The font size of the card content. (default: var(--dds-font-base))\n * @cssproperty --dds-card-content-line-height - The line height of the card content. (default: var(--dds-font-line-height-xlarge))\n * @cssproperty --dds-card-content-spacing-lg - The large spacing value. (default: var(--dds-spacing-600))\n * @cssproperty --dds-card-content-spacing-md - The medium spacing value. (default: var(--dds-spacing-400))\n * @cssproperty --dds-card-content-spacing-sm - The small spacing value. (default: var(--dds-spacing-400))\n * @cssproperty --dds-card-content-spacing-top - The top spacing value. (default: 0)\n * @cssproperty --dds-card-content-spacing-bottom - The bottom spacing value. (default: 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: 100%)\n * @cssproperty --dds-card-image-height - The height of the image. (default: auto)\n * @cssproperty --dds-card-image-object-fit - How the image fits within its container. (default: cover)\n * @cssproperty --dds-card-image-background-position - The background position of the image. (default: center)\n * @cssproperty --dds-card-image-background-size - How the background image is sized. (default: cover)\n * @cssproperty --dds-card-image-background-repeat - How the background image repeats. (default: 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' | 'md' | '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 * @property {string} sizeMap - Responsive size map (e.g. \"md:lg\").\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: var(--dds-text-neutral-subtle))\n * @cssproperty --dds-card-subtitle-font-size - The font size of the subtitle. (default: var(--dds-font-xs))\n * @cssproperty --dds-card-subtitle-font-weight - The font weight of the subtitle. (default: var(--dds-font-weight-bold))\n * @cssproperty --dds-card-subtitle-line-height - The line height of the subtitle. (default: var(--dds-font-line-height-large))\n *\n * @cssproperty --dds-card-subtitle-padding-sm - The padding for small size. (default: 0 var(--dds-spacing-400))\n * @cssproperty --dds-card-subtitle-padding-md - The padding for medium size. (default: 0 var(--dds-spacing-400))\n * @cssproperty --dds-card-subtitle-padding-lg - The padding for large size. (default: 0 var(--dds-spacing-600))\n *\n * @cssproperty --dds-card-subtitle-margin-sm - The base margin for small size. (default: var(--dds-spacing-400))\n * @cssproperty --dds-card-subtitle-margin-md - The base margin for medium size. (default: var(--dds-spacing-400))\n * @cssproperty --dds-card-subtitle-margin-lg - The base margin for large size. (default: var(--dds-spacing-600))\n *\n * @cssproperty --dds-card-subtitle-spacing-top-sm - The top spacing for small size. (default: var(--dds-spacing-400))\n * @cssproperty --dds-card-subtitle-spacing-top-md - The top spacing for medium size. (default: var(--dds-spacing-400))\n * @cssproperty --dds-card-subtitle-spacing-top-lg - The top spacing for large size. (default: var(--dds-spacing-600))\n *\n * @cssproperty --dds-card-subtitle-spacing-bottom-sm - The bottom spacing for small size. (default: var(--dds-spacing-400))\n * @cssproperty --dds-card-subtitle-spacing-bottom-md - The bottom spacing for medium size. (default: var(--dds-spacing-400))\n * @cssproperty --dds-card-subtitle-spacing-bottom-lg - The bottom spacing for large size. (default: var(--dds-spacing-600))\n *\n * @cssproperty --dds-card-subtitle-spacing-both-sm - The both (top and bottom) spacing for small size. (default: var(--dds-spacing-400))\n * @cssproperty --dds-card-subtitle-spacing-both-md - The both (top and bottom) spacing for medium size. (default: var(--dds-spacing-400))\n * @cssproperty --dds-card-subtitle-spacing-both-lg - The both (top and bottom) spacing for large size. (default: 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: var(--dds-color-text-primary))\n * @cssproperty --dds-card-title-font-weight - The font weight of the card title. (default: var(--dds-font-weight-bold))\n * @cssproperty --dds-card-title-line-height - The line height of the card title. (default: var(--dds-font-line-height-large))\n * @cssproperty --dds-card-title-margin-bottom - The bottom margin of the card title. (default: var(--dds-spacing-100))\n *\n * @cssproperty --dds-card-title-sm-padding-x - The horizontal padding for small size. (default: var(--dds-spacing-400))\n * @cssproperty --dds-card-title-sm-padding-bottom - The bottom padding for small size. (default: var(--dds-spacing-100))\n * @cssproperty --dds-card-title-sm-spacing-top - The top spacing for small size. (default: var(--dds-spacing-400))\n * @cssproperty --dds-card-title-sm-spacing-bottom - The bottom spacing for small size. (default: var(--dds-spacing-400))\n *\n * @cssproperty --dds-card-title-md-padding-x - The horizontal padding for medium size. (default: var(--dds-spacing-400))\n * @cssproperty --dds-card-title-md-padding-bottom - The bottom padding for medium size. (default: var(--dds-spacing-100))\n * @cssproperty --dds-card-title-md-spacing-top - The top spacing for medium size. (default: var(--dds-spacing-400))\n * @cssproperty --dds-card-title-md-spacing-bottom - The bottom spacing for medium size. (default: var(--dds-spacing-400))\n *\n * @cssproperty --dds-card-title-lg-padding-x - The horizontal padding for large size. (default: var(--dds-spacing-600))\n * @cssproperty --dds-card-title-lg-padding-bottom - The bottom padding for large size. (default: var(--dds-spacing-100))\n * @cssproperty --dds-card-title-lg-spacing-top - The top spacing for large size. (default: var(--dds-spacing-600))\n * @cssproperty --dds-card-title-lg-spacing-bottom - The bottom spacing for large size. (default: 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. Default is `sm`.\n * @property {string} sizeMap - Responsive size map (e.g. \"md:lg\").\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: var(--dds-spacing-400))\n * @cssproperty --dds-card-border-radius - The border radius of the card. (default: var(--dds-radius-large))\n * @cssproperty --dds-card-border-width - The border width of the card. (default: var(--dds-border-width-base))\n * @cssproperty --dds-card-border-color - The border color of the card. (default: var(--dds-border-neutral-divider))\n * @cssproperty --dds-card-background - The background color of the card. (default: var(--dds-background-neutral-base))\n * @cssproperty --dds-card-hover-border-color - The border color when hovering over the card. (default: var(--dds-border-brand-base))\n * @cssproperty --dds-card-active-border-color - The border color when the card is active. (default: var(--dds-border-brand-medium))\n * @cssproperty --dds-card-shadow - The box shadow of the card. (default: none)\n * @cssproperty --dds-card-hover-shadow - The box shadow when hovering over the card. (default: none)\n * @cssproperty --dds-card-transition-duration - The duration of the card's transitions. (default: var(--dds-transition-medium))\n * @cssproperty --dds-card-transition-timing - The timing function of the card's transitions. (default: 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/chip/chip.component.js'\n      import type { DdsRemoveEvent } from '../../events/events'\nimport type { DdsSelectEvent } from '../../events/events'\n      export type { DdsRemoveEvent } from '../../events/events'\nexport type { DdsSelectEvent } from '../../events/events'\n\n      const tagName = 'dap-ds-chip'\n\n      /**\n * `dap-ds-chip`\n * @summary A chip is a small status descriptor for UI elements.\n * @element dap-ds-chip\n * @title - Chip\n *\n * @property { 'sm' | 'lg' } size - The size of the chip. Default is `sm`.\n * @property {string} sizeMap - Responsive size map (e.g. \"md:lg\").\n *\n * @event {{ value: string }} dds-remove - Fired when the chip is removed\n * @event {{ value?: string, selected: boolean }} dds-select - Fired when the chip is selected\n *\n * @csspart base - The base part\n * @csspart content-container - The container for the content\n * @csspart remove-button - The remove button\n * @csspart remove-icon - The icon of the remove icon\n * @csspart remove-icon-base - The base of the remove icon\n * @csspart remove-icon-base-base - The base of the remove icon base\n *\n * @cssproperty --dds-chip-border - Border of the chip (default: var(--dds-border-width-base) solid var(--dds-transparent-black-base))\n * @cssproperty --dds-chip-border-radius - Border radius of the chip (default: var(--dds-radius-small))\n * @cssproperty --dds-chip-font-weight - Font weight of the chip (default: var(--dds-font-weight-bold))\n * @cssproperty --dds-chip-line-height - Line height of the chip (default: 1.5)\n * @cssproperty --dds-chip-transition - Transition timing for chip interactions (default: all 0.2s ease-in-out)\n * @cssproperty --dds-chip-padding-sm - Padding for small chip size (default: var(--dds-spacing-100) var(--dds-spacing-200))\n * @cssproperty --dds-chip-padding-lg - Padding for large chip size (default: var(--dds-spacing-200) var(--dds-spacing-300))\n * @cssproperty --dds-chip-font-size-sm - Font size for small chip size (default: var(--dds-font-xs))\n * @cssproperty --dds-chip-font-size-lg - Font size for large chip size (default: var(--dds-font-xs))\n * @cssproperty --dds-chip-background-color - Background color of the chip (default: var(--dds-background-neutral-base))\n * @cssproperty --dds-chip-text-color - Text color of the chip (default: var(--dds-text-neutral-base))\n * @cssproperty --dds-chip-hover-background-color - Background color of the chip on hover (default: var(--dds-background-neutral-medium))\n * @cssproperty --dds-chip-active-background-color - Background color of the chip when active (default: var(--dds-background-neutral-strong))\n * @cssproperty --dds-chip-selected-background-color - Background color of the selected chip (default: var(--dds-background-brand-medium))\n * @cssproperty --dds-chip-selected-text-color - Text color of the selected chip (default: var(--dds-text-brand-subtle))\n * @cssproperty --dds-chip-selected-border-color - Border color of the selected chip (default: var(--dds-border-brand-base))\n * @cssproperty --dds-chip-disabled-background-color - Background color of the disabled chip (default: var(--dds-background-neutral-medium))\n * @cssproperty --dds-chip-disabled-text-color - Text color of the disabled chip (default: var(--dds-text-neutral-subtle))\n *\n */\n      const reactWrapper = createComponent({\n        tagName,\n        elementClass: Component,\n        react: React,\n        events: {\n          onDdsRemove: 'dds-remove' as EventName<DdsRemoveEvent>,\nonDdsSelect: 'dds-select' as EventName<DdsSelectEvent>\n        },\n        displayName: \"DapDSChip\"\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/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, readonly: 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, readonly: 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} readonly - Whether the checkbox is readonly (cannot be changed but value is submitted with form).\n * @property {boolean} required - Whether the checkbox is required.\n * @property {'xs' | 'sm' | 'lg'} size - The size of the checkbox. Default is 'sm'.\n * @property {string} sizeMap - Responsive size map (e.g. \"md:lg\").\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 icon-base - The base icon container.\n * @csspart label-container - The label container of the checkbox.\n * @csspart description - The description of the checkbox.\n * @csspart readonly - The readonly state of the checkbox.\n *\n * @cssproperty --dds-checkbox-size - The size of the checkbox. (default: var(--dds-spacing-500))\n * @cssproperty --dds-checkbox-border-width - The border width of the checkbox. (default: var(--dds-border-width-large))\n * @cssproperty --dds-checkbox-border-radius - The border radius of the checkbox. (default: var(--dds-radius-small))\n * @cssproperty --dds-checkbox-border-color - The border color of the checkbox. (default: var(--dds-border-neutral-base))\n * @cssproperty --dds-checkbox-background-color - The background color of the checkbox. (default: transparent)\n * @cssproperty --dds-checkbox-icon-color - The color of the checkbox icon. (default: var(--dds-button-primary-icon-enabled))\n * @cssproperty --dds-checkbox-hover-border-color - The border color when hovering over the checkbox. (default: var(--dds-border-neutral-medium))\n * @cssproperty --dds-checkbox-hover-background-color - The background color when hovering over the checkbox. (default: var(--dds-background-neutral-medium))\n * @cssproperty --dds-checkbox-active-border-color - The border color when the checkbox is active. (default: var(--dds-border-neutral-strong))\n * @cssproperty --dds-checkbox-active-background-color - The background color when the checkbox is active. (default: var(--dds-background-neutral-strong))\n * @cssproperty --dds-checkbox-checked-border-color - The border color when the checkbox is checked. (default: var(--dds-background-brand-base-inverted))\n * @cssproperty --dds-checkbox-checked-background-color - The background color when the checkbox is checked. (default: var(--dds-background-brand-base-inverted))\n * @cssproperty --dds-checkbox-checked-hover-border-color - The border color when hovering over a checked checkbox. (default: var(--dds-background-brand-medium-inverted))\n * @cssproperty --dds-checkbox-checked-hover-background-color - The background color when hovering over a checked checkbox. (default: var(--dds-background-brand-medium-inverted))\n * @cssproperty --dds-checkbox-checked-active-border-color - The border color when a checked checkbox is active. (default: var(--dds-background-brand-strong-inverted))\n * @cssproperty --dds-checkbox-checked-active-background-color - The background color when a checked checkbox is active. (default: var(--dds-background-brand-strong-inverted))\n * @cssproperty --dds-checkbox-invalid-border-color - The border color when the checkbox is invalid. (default: var(--dds-border-negative-base))\n * @cssproperty --dds-checkbox-invalid-background-color - The background color when the checkbox is invalid. (default: var(--dds-background-negative-base))\n * @cssproperty --dds-checkbox-invalid-hover-border-color - The border color when hovering over an invalid checkbox. (default: var(--dds-border-negative-medium))\n * @cssproperty --dds-checkbox-invalid-hover-background-color - The background color when hovering over an invalid checkbox. (default: var(--dds-background-negative-medium))\n * @cssproperty --dds-checkbox-invalid-active-border-color - The border color when an invalid checkbox is active. (default: var(--dds-border-negative-strong))\n * @cssproperty --dds-checkbox-invalid-active-background-color - The background color when an invalid checkbox is active. (default: var(--dds-background-negative-strong))\n * @cssproperty --dds-checkbox-disabled-border-color - The border color when the checkbox is disabled. (default: var(--dds-button-primary-background-disabled))\n * @cssproperty --dds-checkbox-disabled-background-color - The background color when the checkbox is disabled. (default: var(--dds-button-primary-background-disabled))\n * @cssproperty --dds-checkbox-disabled-icon-color - The color of the checkbox icon when disabled. (default: var(--dds-button-primary-icon-disabled))\n * @cssproperty --dds-checkbox-readonly-border-color - The border color when the checkbox is readonly. (default: var(--dds-border-neutral-subtle))\n * @cssproperty --dds-checkbox-readonly-background-color - The background color when the checkbox is readonly. (default: var(--dds-background-neutral-subtle))\n * @cssproperty --dds-checkbox-readonly-icon-color - The color of the checkbox icon when readonly. (default: var(--dds-text-neutral-base))\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/code-puncher/code-puncher-slot.component.js'\n\nconst tagName = 'dap-ds-code-puncher-slot'\n\n/**\n * `dap-ds-code-puncher-slot`\n * @summary Individual digit input slot for code puncher.\n * @element dap-ds-code-puncher-slot\n * @title - Code puncher slot\n *\n * @csspart base - The slot container.\n * @csspart input - The input element.\n */\nconst reactWrapper = createComponent({\n  tagName,\n  elementClass: Component,\n  react: React,\n  events: {},\n  displayName: 'DapDSCodePuncherSlot',\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/code-puncher/code-puncher.component.js'\n      import type { DdsInputEvent } from '../../events/events'\nimport type { DdsChangeEvent } from '../../events/events'\nimport type { DdsCompleteEvent } from '../../events/events'\nimport type { DdsFocusEvent } from '../../events/events'\nimport type { DdsBlurEvent } from '../../events/events'\n      export type { DdsInputEvent } from '../../events/events'\nexport type { DdsChangeEvent } from '../../events/events'\nexport type { DdsCompleteEvent } from '../../events/events'\nexport type { DdsFocusEvent } from '../../events/events'\nexport type { DdsBlurEvent } from '../../events/events'\n\n      const tagName = 'dap-ds-code-puncher'\n\n      /**\n * `dap-ds-code-puncher`\n * @summary A composable PIN/OTP input component for entering verification codes.\n * @element dap-ds-code-puncher\n * @title - Code Puncher\n * @group code-puncher\n *\n * @property {string} value - The complete code value.\n * @property {boolean} mask - Mask input like password. Default is false.\n * @property {string} pattern - Regex pattern for allowed characters. Default is '[0-9]'.\n * @property {string} placeholder - Placeholder character for empty slots.\n * @property {'xs' | 'sm' | 'lg'} size - The size of the slots. Default is 'sm'.\n * @property {string} label - The label of the component.\n * @property {string} description - The description of the component.\n * @property {string} tooltip - The tooltip of the component.\n * @property {string} feedback - The feedback message.\n * @property {'negative' | 'positive' | 'warning'} feedbackType - The feedback type.\n * @property {'success' | 'error'} status - The status of the component.\n * @property {boolean} disabled - Disable all slots. Default is false.\n * @property {boolean} readonly - Read-only state. Default is false.\n * @property {boolean} required - Required for form validation. Default is false.\n * @property {string} name - Form element name.\n * @property {string} autocomplete - Autocomplete hint. Default is 'one-time-code'.\n *\n * @event {{ value: string, index: number }} dds-input - Fires on each digit input.\n * @event {{ value: string }} dds-change - Fires when value changes.\n * @event {{ value: string }} dds-complete - Fires when all slots are filled.\n * @event dds-focus - Fires when component gains focus.\n * @event dds-blur - Fires when component loses focus.\n *\n * @slot default - Slot for code-puncher-group, code-puncher-slot, and code-puncher-separator elements.\n *\n * @csspart base - The main container.\n * @csspart slots - The slots container.\n * @csspart label - The label element.\n * @csspart description - The description element.\n * @csspart feedback - The feedback element.\n */\n      const reactWrapper = createComponent({\n        tagName,\n        elementClass: Component,\n        react: React,\n        events: {\n          onDdsInput: 'dds-input' as EventName<DdsInputEvent>,\nonDdsChange: 'dds-change' as EventName<DdsChangeEvent>,\nonDdsComplete: 'dds-complete' as EventName<DdsCompleteEvent>,\nonDdsFocus: 'dds-focus' as EventName<DdsFocusEvent>,\nonDdsBlur: 'dds-blur' as EventName<DdsBlurEvent>\n        },\n        displayName: \"DapDSCodePuncher\"\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 {boolean} 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' | '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 content of the select.\n * @property {'negative' | 'positive' | '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} textComplete - Whether the combobox should 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 * @property {boolean} multiselect - Whether the combobox is multiselect.\n * @property {number} maxSelections - The maximum number of selections allowed.\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 * @csspart input - The input of the select.\n *\n * @cssproperty --dds-combobox-background - The background color of the combobox. (default: var(--dds-fields-background-default))\n * @cssproperty --dds-combobox-border-color - The border color of the combobox. (default: var(--dds-border-neutral-base))\n * @cssproperty --dds-combobox-border-width - The border width of the combobox. (default: var(--dds-border-width-base, 1px))\n * @cssproperty --dds-combobox-border-radius - The border radius of the combobox. (default: var(--dds-radius-base))\n * @cssproperty --dds-combobox-text-color - The text color of the combobox. (default: var(--dds-text-neutral-base))\n * @cssproperty --dds-combobox-placeholder-color - The placeholder text color. (default: var(--dds-text-neutral-subtle))\n * @cssproperty --dds-combobox-disabled-background - The background color when disabled. (default: var(--dds-background-neutral-stronger))\n * @cssproperty --dds-combobox-disabled-text - The text color when disabled. (default: var(--dds-text-neutral-disabled))\n * @cssproperty --dds-combobox-error-border - The border color for error state. (default: var(--dds-border-negative-base))\n * @cssproperty --dds-combobox-success-border - The border color for success state. (default: var(--dds-border-positive-base))\n * @cssproperty --dds-combobox-icon-color - The color of the icons. (default: var(--dds-text-icon-neutral-subtle))\n * @cssproperty --dds-combobox-loading-spinner-color - The color of the loading spinner. (default: var(--dds-icon-neutral-base))\n * @cssproperty --dds-combobox-clear-icon-color - The color of the clear icon. (default: var(--dds-button-subtle-icon-neutral-enabled))\n * @cssproperty --dds-combobox-popup-background - The background color of the popup. (default: var(--dds-background-neutral-subtle))\n * @cssproperty --dds-combobox-popup-shadow - The box shadow of the popup. (default: 0 4px 6px -1px rgba(0, 0, 0, 0.08), 0 2px 4px -1px rgba(0, 0, 0, 0.06))\n * @cssproperty --dds-combobox-icon-opened-transform - The transform of the icon when the combobox is opened (default: rotate(90deg)).\n * @cssproperty --dds-combobox-padding-xs - The padding for extra small size. (default: var(--dds-spacing-200))\n * @cssproperty --dds-combobox-padding-sm - The padding for small size. (default: var(--dds-spacing-200))\n * @cssproperty --dds-combobox-padding-lg - The padding for large size. (default: var(--dds-spacing-300))\n * @cssproperty --dds-combobox-padding-horizontal - The horizontal padding. (default: var(--dds-spacing-300))\n * @cssproperty --dds-combobox-padding-vertical - The vertical padding. (default: var(--dds-spacing-200))\n * @cssproperty --dds-combobox-gap - The gap between elements. (default: var(--dds-spacing-100))\n * @cssproperty --dds-combobox-icon-gap - The gap between icons. (default: var(--dds-spacing-200))\n * @cssproperty --dds-combobox-action-gap - The gap between action elements. (default: var(--dds-spacing-200))\n * @cssproperty --dds-combobox-action-padding - The padding for action elements. (default: var(--dds-spacing-300))\n * @cssproperty --dds-combobox-clear-icon-width - The width of the clear icon. (default: var(--dds-spacing-800))\n * @cssproperty --dds-combobox-dropdown-icon-right - The right position of the dropdown icon. (default: var(--dds-spacing-600))\n * @cssproperty --dds-combobox-min-width - The minimum width of the combobox. (default: 7.5rem)\n * @cssproperty --dds-combobox-chips-gap - The gap between chips. (default: var(--dds-spacing-100))\n * @cssproperty --dds-combobox-chips-padding - The padding for chips. (default: var(--dds-spacing-100))\n * @cssproperty --dds-combobox-chips-max-height - The maximum height of the chips. (default: 120px)\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 * @csspart base - The base part of the command group.\n * @csspart label - The label part of the command group.\n * @csspart items - The items part of the command group.\n *\n * @cssproperty --dds-command-group-gap - The gap between command group elements. (default: var(--dds-spacing-100))\n * @cssproperty --dds-command-group-margin-bottom - The bottom margin of the command group. (default: var(--dds-spacing-200))\n * @cssproperty --dds-command-group-border-radius - The border radius of the command group. (default: var(--dds-radius-small))\n * @cssproperty --dds-command-group-label-font-weight - The font weight of the command group label. (default: var(--dds-font-weight-bold))\n * @cssproperty --dds-command-group-items-gap - The gap between command items. (default: 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 * @cssproperty --dds-command-item-padding - The padding of the command item (default: var(--dds-spacing-100) var(--dds-spacing-200))\n * @cssproperty --dds-command-item-background - The background color of the command item (default: none)\n * @cssproperty --dds-command-item-color - The text color of the command item (default: var(--dds-text-primary-base))\n * @cssproperty --dds-command-item-hover-background - The background color of the command item on hover (default: var(--dds-transparent-black-subtle))\n * @cssproperty --dds-command-item-selected-background - The background color of the selected command item (default: var(--dds-transparent-black-subtle))\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 { DdsChangeEvent } from '../../events/events'\nimport type { DdsOpenedEvent } from '../../events/events'\nimport type { DdsClosedEvent } from '../../events/events'\nimport type { DdsCloseEvent } from '../../events/events'\n      export type { DdsChangeEvent } from '../../events/events'\nexport type { DdsOpenedEvent } from '../../events/events'\nexport type { DdsClosedEvent } from '../../events/events'\nexport type { DdsCloseEvent } 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 * @event {{ value: string }} dds-change - Fired when the command value changes.\n *\n * @slot trigger - The trigger element for the command dropdown.\n * @slot - The command items.\n */\n      const reactWrapper = createComponent({\n        tagName,\n        elementClass: Component,\n        react: React,\n        events: {\n          onDdsChange: 'dds-change' as EventName<DdsChangeEvent>,\nonDdsOpened: 'dds-opened' as EventName<DdsOpenedEvent>,\nonDdsClosed: 'dds-closed' as EventName<DdsClosedEvent>,\nonDdsClose: 'dds-close' as EventName<DdsCloseEvent>\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 {{ 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-xs - The height of the extra small input. (default: var(--dds-spacing-800))\n * @cssproperty --dds-input-height-sm - The height of the small input. (default: var(--dds-spacing-1000))\n * @cssproperty --dds-input-height-lg - The height of the large input. (default: var(--dds-spacing-1200))\n * @cssproperty --dds-input-padding-xs - The padding of the extra small input. (default: 0 var(--dds-spacing-200))\n * @cssproperty --dds-input-padding-sm - The padding of the small input. (default: 0 var(--dds-spacing-300))\n * @cssproperty --dds-input-padding-lg - The padding of the large input. (default: 0 var(--dds-spacing-400))\n * @cssproperty --dds-input-font-size-xs - The font size of the extra small input. (default: var(--dds-font-sm))\n * @cssproperty --dds-input-font-size-sm - The font size of the small input. (default: var(--dds-font-base))\n * @cssproperty --dds-input-font-size-lg - The font size of the large input. (default: var(--dds-font-lg))\n * @cssproperty --dds-input-border - The border of the input. (default: var(--dds-border-width-base) solid var(--dds-border-neutral-base))\n * @cssproperty --dds-input-background - The background color of the input. (default: var(--dds-fields-background-default))\n * @cssproperty --dds-input-text-color - The text color of the input. (default: var(--dds-text-neutral-base))\n * @cssproperty --dds-input-border-radius - The border radius of the input. (default: var(--dds-radius-base))\n * @cssproperty --dds-input-disabled-border - The border of the disabled input. (default: 0 solid var(--dds-border-neutral-disabled))\n * @cssproperty --dds-input-disabled-background - The background color of the disabled input. (default: var(--dds-fields-background-disabled))\n * @cssproperty --dds-input-disabled-text - The text color of the disabled input. (default: var(--dds-text-neutral-disabled))\n * @cssproperty --dds-input-readonly-border - The border of the readonly input. (default: 0 solid var(--dds-border-neutral-subtle))\n * @cssproperty --dds-input-readonly-background - The background color of the readonly input. (default: var(--dds-fields-background-read-only))\n * @cssproperty --dds-input-readonly-text - The text color of the readonly input. (default: var(--dds-text-neutral-subtle))\n * @cssproperty --dds-input-success-border - The border of the success input. (default: var(--dds-border-width-base) solid var(--dds-border-positive-base))\n * @cssproperty --dds-input-error-border - The border of the error input. (default: var(--dds-border-width-base) solid var(--dds-border-negative-base))\n * @cssproperty --dds-input-addon-background - The background color of the input addon. (default: var(--dds-fields-background-default))\n * @cssproperty --dds-input-addon-success-background - The background color of the success input addon. (default: var(--dds-fields-background-default))\n * @cssproperty --dds-input-addon-error-background - The background color of the error input addon. (default: var(--dds-fields-background-default))\n * @cssproperty --dds-input-addon-border-before - The border of the addon before the input. (default: var(--dds-border-width-base) solid var(--dds-border-neutral-base))\n * @cssproperty --dds-input-addon-border-after - The border of the addon after the input. (default: var(--dds-border-width-base) solid var(--dds-border-neutral-base))\n * @cssproperty --dds-input-addon-border-width-before - The border width of the addon before the input. (default: var(--dds-border-width-base) 0 var(--dds-border-width-base) var(--dds-border-width-base))\n * @cssproperty --dds-input-addon-border-width-after - The border width of the addon after the input. (default: var(--dds-border-width-base) var(--dds-border-width-base) var(--dds-border-width-base) 0)\n * @cssproperty --dds-input-addon-success-border - The border of the success addon. (default: var(--dds-border-width-base) solid var(--dds-border-positive-base))\n * @cssproperty --dds-input-addon-success-border-before - The border of the success addon before the input. (default: var(--dds-border-width-base) solid var(--dds-border-positive-base))\n * @cssproperty --dds-input-addon-success-border-after - The border of the success addon after the input. (default: var(--dds-border-width-base) solid var(--dds-border-positive-base))\n * @cssproperty --dds-input-addon-success-border-width-before - The border width of the success addon before the input. (default: var(--dds-border-width-base) 0 var(--dds-border-width-base) var(--dds-border-width-base))\n * @cssproperty --dds-input-addon-success-border-width-after - The border width of the success addon after the input. (default: var(--dds-border-width-base) var(--dds-border-width-base) var(--dds-border-width-base) 0)\n * @cssproperty --dds-input-addon-error-border-before - The border of the error addon before the input. (default: var(--dds-border-width-base) solid var(--dds-border-negative-base))\n * @cssproperty --dds-input-addon-error-border-after - The border of the error addon after the input. (default: var(--dds-border-width-base) solid var(--dds-border-negative-base))\n * @cssproperty --dds-input-addon-error-border-width-before - The border width of the error addon before the input. (default: var(--dds-border-width-base) 0 var(--dds-border-width-base) var(--dds-border-width-base))\n * @cssproperty --dds-input-addon-error-border-width-after - The border width of the error addon after the input. (default: var(--dds-border-width-base) var(--dds-border-width-base) var(--dds-border-width-base) 0)\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 * @csspart copy-button-base - The base of the copy button.\n * @csspart copy-button-content - The content of the copy button.\n * @csspart copy-icon - The copy icon of the component.\n * @csspart copy-icon-base - The base of the copy icon.\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-sm - Custom padding for the small badge (default: var(--dds-spacing-200) var(--dds-spacing-300))\n * @cssproperty --dds-badge-padding-lg - Custom padding for the large badge (default: var(--dds-spacing-400))\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-radius-base))\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-sm - Custom font size for the small badge (default: var(--dds-font-xs))\n * @cssproperty --dds-badge-font-size-lg - Custom font size for the large 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 * @cssproperty --dds-badge-border-color-normal - Custom border color for the normal variant (default: var(--dds-transparent-black-medium))\n * @cssproperty --dds-badge-background-color-normal - Custom background color for the normal variant (default: var(--dds-background-brand-subtle))\n * @cssproperty --dds-badge-color-normal - Custom text color for the normal variant (default: var(--dds-text-brand-subtle))\n * @cssproperty --dds-badge-border-color-inverted - Custom border color for the inverted variant (default: var(--dds-transparent-white-medium))\n * @cssproperty --dds-badge-background-color-inverted - Custom background color for the inverted variant (default: var(--dds-background-brand-base-inverted))\n * @cssproperty --dds-badge-color-inverted - Custom text color for the inverted variant (default: var(--dds-text-neutral-inverted))\n *\n * @property { 'sm' | 'lg' } size - The size of the DÁP badge. Default is `sm`.\n * @property {string} sizeMap - Responsive size map (e.g. \"md:lg\").\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 * @slot loading - The loading content of the table.\n * @slot empty - The empty content of the table.\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 empty - The empty content of the table.\n * @csspart loading - The loading content 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 * @csspart pager-base - The base of the pager.\n * @csspart pager-first - The first button of the pager.\n * @csspart pager-previous - The previous button of the pager.\n * @csspart pager-next - The next button of the pager.\n * @csspart pager-last - The last button of the pager.\n * @csspart pager-page-size-select - The page size select of the pager.\n *\n * @cssproperty --dds-datatable-bg-color - Background color of the table. (default: var(--dds-background-neutral-subtle)).\n * @cssproperty --dds-datatable-border-color - Border color of the table cells. (default: var(--dds-border-neutral-divider))\n * @cssproperty --dds-datatable-header-bg-color - Background color of the table header. (default: var(--dds-background-neutral-subtle))\n * @cssproperty --dds-datatable-header-text-color - Text color of the table header. (default: var(--dds-text-neutral-strong))\n * @cssproperty --dds-datatable-row-hover-bg-color - Background color of hovered rows. (default: var(--dds-background-brand-strong))\n * @cssproperty --dds-datatable-row-selected-bg-color - Background color of selected rows. (default: var(--dds-background-brand-strong))\n * @cssproperty --dds-datatable-cell-padding - Padding of table cells. (default: var(--dds-spacing-200))\n * @cssproperty --dds-datatable-header-padding - Padding of header cells. (default: var(--dds-spacing-200))\n * @cssproperty --dds-datatable-last-column-padding - Padding of the last column. (default: var(--dds-spacing-500))\n * @cssproperty --dds-datatable-first-column-padding - Padding of the first column. (default: var(--dds-spacing-500))\n * @cssproperty --dds-datatable-border-width - Width of table borders. (default: var(--dds-border-width-base))\n * @cssproperty --dds-datatable-stripe-color - Background color for striped rows. (default: var(--dds-background-neutral-base))\n * @cssproperty --dds-datatable-border-radius - Border radius of the table. (default: var(--dds-radius-base))\n * @cssproperty --dds-datatable-shadow - Box shadow of the table. (default: none)\n * @cssproperty --dds-datatable-transition-duration - Duration of hover/selection transitions. (default: 0.2s)\n * @cssproperty --dds-datatable-z-index - Z-index of the table. (default: 1)\n * @cssproperty --dds-datatable-min-height - Minimum height of the table. (default: auto)\n * @cssproperty --dds-datatable-max-height - Maximum height of the table. (default: none)\n * @cssproperty --dds-datatable-overflow-x - Horizontal overflow behavior. (default: auto)\n * @cssproperty --dds-datatable-overflow-y - Vertical overflow behavior. (default: auto)\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 * @csspart calendar-grid-cell-base - The base of the calendar grid cell.\n * @csspart calendar-grid-cell - The cell of the calendar grid.\n * @csspart calendar-grid-header-cell-base - The base of the calendar grid header cell.\n * @csspart calendar-grid-header-cell - The header cell of the calendar grid.\n * @csspart calendar-grid-cell-today-mark - The today mark of the calendar grid cell.\n *\n * @cssproperty --dds-combobox-background - The background color of the combobox. (default: var(--dds-fields-background-default))\n * @cssproperty --dds-combobox-border-color - The border color of the combobox. (default: var(--dds-border-neutral-base))\n * @cssproperty --dds-combobox-border-width - The border width of the combobox. (default: var(--dds-border-width-base, 1px))\n * @cssproperty --dds-combobox-border-radius - The border radius of the combobox. (default: var(--dds-radius-base))\n * @cssproperty --dds-combobox-text-color - The text color of the combobox. (default: var(--dds-text-neutral-base))\n * @cssproperty --dds-combobox-placeholder-color - The placeholder text color. (default: var(--dds-text-neutral-subtle))\n * @cssproperty --dds-combobox-disabled-background - The background color when disabled. (default: var(--dds-background-neutral-stronger))\n * @cssproperty --dds-combobox-disabled-text - The text color when disabled. (default: var(--dds-text-neutral-disabled))\n * @cssproperty --dds-combobox-error-border - The border color for error state. (default: var(--dds-border-negative-base))\n * @cssproperty --dds-combobox-success-border - The border color for success state. (default: var(--dds-border-positive-base))\n * @cssproperty --dds-combobox-icon-color - The color of the icons. (default: var(--dds-text-icon-neutral-subtle))\n * @cssproperty --dds-combobox-clear-icon-color - The color of the clear icon. (default: var(--dds-button-subtle-icon-neutral-enabled))\n * @cssproperty --dds-combobox-popup-background - The background color of the popup. (default: var(--dds-background-neutral-subtle))\n * @cssproperty --dds-combobox-popup-shadow - The box shadow of the popup. (default: 0 4px 6px -1px rgb(0 0 0 / 8%), 0 2px 4px -1px rgb(0 0 0 / 6%))\n * @cssproperty --dds-combobox-padding-xs - The padding for extra small size. (default: var(--dds-spacing-200))\n * @cssproperty --dds-combobox-padding-sm - The padding for small size. (default: var(--dds-spacing-200))\n * @cssproperty --dds-combobox-padding-lg - The padding for large size. (default: var(--dds-spacing-300))\n * @cssproperty --dds-combobox-padding-horizontal - The horizontal padding. (default: var(--dds-spacing-300))\n * @cssproperty --dds-combobox-padding-vertical - The vertical padding. (default: var(--dds-spacing-200))\n * @cssproperty --dds-combobox-gap - The gap between elements. (default: var(--dds-spacing-100))\n * @cssproperty --dds-combobox-icon-gap - The gap between icons. (default: var(--dds-spacing-200))\n * @cssproperty --dds-combobox-action-gap - The gap between action elements. (default: var(--dds-spacing-200))\n * @cssproperty --dds-combobox-action-padding - The padding for action elements. (default: var(--dds-spacing-300))\n * @cssproperty --dds-combobox-clear-icon-width - The width of the clear icon. (default: var(--dds-spacing-800))\n * @cssproperty --dds-combobox-dropdown-icon-right - The right position of the dropdown icon. (default: var(--dds-spacing-600))\n * @cssproperty --dds-combobox-min-width - The minimum width of the combobox. (default: 7.5rem)\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. (default: var(--dds-border-width-base))\n * @cssproperty --dds-divider-border-style - The style of the divider border. (default: solid)\n * @cssproperty --dds-divider-border-color - The color of the divider border. (default: var(--dds-border-neutral-divider))\n * @cssproperty --dds-divider-border-color-inverted - The color of the divider border when inverted. (default: 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'} feedbackType - 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: var(--dds-spacing-200))\n * @cssproperty --dds-feedback-color - The text color of the feedback. (default: var(--dds-text-positive-subtle))\n * @cssproperty --dds-feedback-font-size - The font size of the feedback. (default: var(--dds-font-sm))\n * @cssproperty --dds-feedback-font-weight - The font weight of the feedback. (default: var(--dds-font-weight-bold))\n * @cssproperty --dds-feedback-icon-fill - The fill color of the feedback icon. (default: var(--dds-icon-positive-subtle))\n * @cssproperty --dds-feedback-icon-spacing - The spacing between the icon and text. (default: var(--dds-spacing-100))\n * @cssproperty --dds-feedback-color-warning - The text color for warning feedback. (default: var(--dds-text-neutral-base))\n * @cssproperty --dds-feedback-color-positive - The text color for positive feedback. (default: var(--dds-text-positive-subtle))\n * @cssproperty --dds-feedback-color-negative - The text color for negative feedback. (default: var(--dds-text-negative-subtle))\n * @cssproperty --dds-feedback-icon-fill-warning - The icon fill color for warning feedback. (default: var(--dds-icon-informative-subtle))\n * @cssproperty --dds-feedback-icon-fill-positive - The icon fill color for positive feedback. (default: var(--dds-icon-positive-subtle))\n * @cssproperty --dds-feedback-icon-fill-negative - The icon fill color for negative feedback. (default: 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'\nimport type { DdsFileClickEvent } from '../../events/events'\n      export type { DdsFileRemoveEvent } from '../../events/events'\nexport type { DdsFileClickEvent } 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 * @event {{ file: FileListElement }} dds-file-click - Dispatched when a file is clicked.\n *\n * @slot delete-button - The delete button.\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 * @csspart filename - The filename text of the item component.\n * @csspart filesize - The filesize text of the item component.\n * @csspart spinner - The spinner of the item component.\n * @csspart remove-button - The remove button of the item component.\n * @csspart thumbnail - The thumbnail of the item component.\n *\n * @cssproperty --dds-file-list-item-padding - The padding of the file list item (default: var(--dds-spacing-200))\n * @cssproperty --dds-file-list-item-border-width - The border width of the file list item (default: var(--dds-border-width-base))\n * @cssproperty --dds-file-list-item-border-color - The border color of the file list item (default: var(--dds-border-neutral-transparent))\n * @cssproperty --dds-file-list-item-border-radius - The border radius of the file list item (default: var(--dds-radius-base))\n * @cssproperty --dds-file-list-item-bg-color - The background color of the file list item (default: var(--dds-fields-background-default))\n * @cssproperty --dds-file-list-item-font-weight - The font weight of the file list item (default: var(--dds-font-weight-medium))\n * @cssproperty --dds-file-list-item-disabled-bg-color - The background color of the disabled file list item (default: var(--dds-cold-grey-400))\n * @cssproperty --dds-file-list-item-disabled-color - The text color of the disabled file list item (default: var(--dds-text-neutral-disabled))\n * @cssproperty --dds-file-list-item-content-margin - The margin of the content within the file list item (default: var(--dds-spacing-100) var(--dds-spacing-200))\n * @cssproperty --dds-file-list-item-content-gap - The gap between content elements in the file list item (default: var(--dds-spacing-200))\n * @cssproperty --dds-file-list-item-filename-color - The color of the filename text (default: var(--dds-text-neutral-base))\n * @cssproperty --dds-file-list-item-filesize-color - The color of the filesize text (default: var(--dds-text-neutral-subtle))\n * @cssproperty --dds-file-list-item-feedback-padding-x - The padding of the feedback section (default: var(--dds-spacing-200))\n * @cssproperty --dds-file-list-item-feedback-padding-y - The padding of the feedback section (default: var(--dds-spacing-100))\n * @cssproperty --dds-file-list-item-feedback-border-color - The border color of the feedback section (default: var(--dds-border-neutral-divider))\n * @cssproperty --dds-file-list-item-feedback-font-size - The font size of the feedback text (default: var(--dds-font-sm))\n */\n      const reactWrapper = createComponent({\n        tagName,\n        elementClass: Component,\n        react: React,\n        events: {\n          onDdsFileRemove: 'dds-file-remove' as EventName<DdsFileRemoveEvent>,\nonDdsFileClick: 'dds-file-click' as EventName<DdsFileClickEvent>\n        },\n        displayName: \"DapDSFileInputListItem\"\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/file-input/file-input-list.component.js'\n      import type { DdsFileClickEvent } from '../../events/events'\n      export type { DdsFileClickEvent } from '../../events/events'\n\n      const 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 * @slot delete-button - The delete button.\n *\n * @event {{ file: FileListElement }} dds-file-click - Dispatched when a file is clicked.\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 */\n      const reactWrapper = createComponent({\n        tagName,\n        elementClass: Component,\n        react: React,\n        events: {\n          onDdsFileClick: 'dds-file-click' as EventName<DdsFileClickEvent>\n        },\n        displayName: \"DapDSFileInputList\"\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/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 { DdsFileDeleteErrorEvent } from '../../events/events'\nimport type { DdsFileChangeEvent } from '../../events/events'\nimport type { DdsFilesAcceptedEvent } 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 { DdsFileDeleteErrorEvent } from '../../events/events'\nexport type { DdsFileChangeEvent } from '../../events/events'\nexport type { DdsFilesAcceptedEvent } 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 * @property {string} uploadButtonLabel - The label for the upload button.\n * @property {string} browseButtonLabel - The label for the browse button.\n * @property {string} accept - The file types that the file input accepts.\n * @property {boolean} multiple - Whether the file input accepts multiple files.\n * @property {boolean} keepValue - Whether to keep the value when new files are selected.\n * @property {string} uploadUrl - A remote URL to upload files to.\n * @property {string} deleteUrl - A remote URL to delete uploaded files from. Supports placeholders: `{fileName}`, `{id}`, `{key}`, `{location}`.\n * @property {string} uploadHeaders - Custom headers for upload requests (JSON string).\n * @property {string} deleteHeaders - Custom headers for delete requests (JSON string).\n * @property {boolean} autoupload - Whether to automatically upload files after selection.\n * @property {number} maxFiles - The maximum number of files that can be uploaded.\n * @property {number} maxFileSize - The maximum size of files that can be uploaded (in bytes).\n * @property {number} maxSizePerFile - The maximum size a single file can have (in bytes).\n * @property {string} maxFileSizeErrorText - Text for the max file size error.\n * @property {string} maxSizePerFileErrorText - Text for the max size per file error.\n * @property {string} maxFileAmountErrorText - Text for the max file amount error.\n * @property {string} fileTypeErrorText - Text for the file type error.\n * @property {boolean} showDropzone - Whether to show a separate dropzone area.\n * @property {string} dropzoneText - Text to display in the dropzone.\n * @property {string} dropzoneAriaLabel - Aria label for the dropzone.\n * @property {boolean} showFileList - Whether to show the built-in file list.\n * @property {boolean} confirmRemove - Whether to show confirmation dialog before removing files.\n * @property {string} showUploadButton - Whether to show the upload button. Default is `true`.\n * @property {string} removeButtonLabel - The label for the remove button.\n * @property {string} cancelButtonLabel - The label for the cancel button.\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, errors: FileError[], item?: DapDSFileInputListItem }} dds-upload-error - Fired when a file upload encounters an error. Always contains an errors array, even if there is only one 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 {{ file: FileListElement, error: Error }} dds-file-delete-error - Fired when a file deletion from server encounters an error.\n * @event {{ newFiles: File[], files: File[], canceledFiles: Set<File>, currentFiles: File[] }} dds-file-change - Fired when the file input value changes. This event is cancelable. Event detail contains: `newFiles` (just the files being added in this operation), `currentFiles` (all files that were already selected before this operation), `files` (all files after merge with existing when keepValue=true), and `canceledFiles` (Set to add files you want to reject). You can either: (1) Call `event.preventDefault()` to reject all files, or (2) Add specific files to `canceledFiles` to reject only those files.\n * @event {{ files: File[] }} dds-files-accepted - Fired when the file input value changes. This event is cancelable. Event detail contains: `files` (all files after merge with existing when keepValue=true).\n *\n * @slot dropzone-content - The content to display in the dropzone.\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 * @csspart upload-progress - The upload progress container.\n * @csspart browse-button - The browse button.\n * @csspart upload-button - The upload button.\n * @csspart dropzone - The dropzone area.\n *\n * @cssproperty --dds-file-input-holder-margin - The margin of the input holder in shorthand format: top right bottom left (default: var(--dds-spacing-400) 0 0 0)\n * @cssproperty --dds-file-input-dropzone-padding - The padding of the dropzone (default: var(--dds-spacing-800))\n * @cssproperty --dds-file-input-dropzone-border - The border of the dropzone in shorthand format: width style color (default: var(--dds-border-width-base) dashed var(--dds-border-neutral-subtle))\n * @cssproperty --dds-file-input-dropzone-border-radius - The border radius of the dropzone (default: var(--dds-radius-base))\n * @cssproperty --dds-file-input-dropzone-background - The background of the dropzone (default: var(--dds-color-background-primary))\n * @cssproperty --dds-file-input-dropzone-border-hover - The border of the dropzone on hover in shorthand format: width style color (default: var(--dds-border-width-base) dashed var(--dds-color-border-primary-hover))\n * @cssproperty --dds-file-input-dropzone-background-hover - The background of the dropzone on hover (default: var(--dds-color-background-primary-hover))\n * @cssproperty --dds-file-input-dropzone-border-dragover - The border of the dropzone when dragging over in shorthand format: width style color (default: var(--dds-border-width-base) dashed var(--dds-color-border-accent))\n * @cssproperty --dds-file-input-dropzone-background-dragover - The background of the dropzone when dragging over (default: var(--dds-color-background-accent-light))\n * @cssproperty --dds-file-input-dropzone-border-disabled - The border of the disabled dropzone in shorthand format: width style color (default: var(--dds-border-width-base) dashed var(--dds-border-neutral-disabled))\n * @cssproperty --dds-file-input-dropzone-gap - The gap between elements in the dropzone content (default: var(--dds-spacing-300))\n * @cssproperty --dds-file-input-dropzone-accept-color - The text color of the accepted file types in the dropzone (default: var(--dds-color-text-secondary))\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>,\nonDdsFileDeleteError: 'dds-file-delete-error' as EventName<DdsFileDeleteErrorEvent>,\nonDdsFileChange: 'dds-file-change' as EventName<DdsFileChangeEvent>,\nonDdsFilesAccepted: 'dds-files-accepted' as EventName<DdsFilesAcceptedEvent>\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 * @csspart icon - The icon of the icon.\n * @csspart icon-base - The base of the icon.\n *\n * @cssproperty --dds-icon-button-border-width - Border width of the icon button (default: var(--dds-border-width-base))\n * @cssproperty --dds-icon-button-border-color - Border color of the icon button (default: var(--dds-border-neutral-transparent-interactive, #fff500))\n * @cssproperty --dds-icon-button-border-radius - Border radius of the icon button (default: var(--dds-radius-rounded))\n * @cssproperty --dds-icon-button-hover-border-width - Border width on hover (default: var(--dds-border-width-large))\n * @cssproperty --dds-icon-button-active-border-width - Border width when active (default: var(--dds-border-width-xlarge))\n * @cssproperty --dds-icon-button-transition - Transition property for the icon button (default: var(--dds-transition-all))\n * @cssproperty --dds-icon-button-cursor - Cursor style for the button (default: pointer)\n * @cssproperty --dds-icon-button-disabled-cursor - Cursor style for the disabled button (default: not-allowed)\n * @cssproperty --dds-icon-button-column-gap - Column gap between elements (default: var(--dds-spacing-100))\n * @cssproperty --dds-icon-button-padding-lg - Padding for large size (default: var(--dds-spacing-0))\n * @cssproperty --dds-icon-button-padding-md - Padding for medium size (default: var(--dds-spacing-100))\n * @cssproperty --dds-icon-button-padding-sm - Padding for small size (default: var(--dds-spacing-50))\n * @cssproperty --dds-icon-button-padding-xs - Padding for extra small size (default: var(--dds-spacing-25))\n * @cssproperty --dds-icon-button-size-lg - Size for large icon button (default: var(--dds-spacing-800))\n * @cssproperty --dds-icon-button-size-md - Size for medium icon button (default: var(--dds-spacing-600))\n * @cssproperty --dds-icon-button-size-sm - Size for small icon button (default: var(--dds-spacing-400))\n * @cssproperty --dds-icon-button-size-xs - Size for extra small icon button (default: var(--dds-spacing-300))\n * @cssproperty --dds-icon-button-neutral-bg - Background color for neutral variant (default: var(--dds-transparent-black-subtle))\n * @cssproperty --dds-icon-button-neutral-color - Text color for neutral variant (default: var(--dds-icon-neutral-base))\n * @cssproperty --dds-icon-button-neutral-hover-bg - Hover background color for neutral variant (default: var(--dds-transparent-black-base))\n * @cssproperty --dds-icon-button-neutral-active-bg - Active background color for neutral variant (default: var(--dds-transparent-black-medium))\n * @cssproperty --dds-icon-button-brand-bg - Background color for brand variant (default: var(--dds-button-subtle-background-enabled))\n * @cssproperty --dds-icon-button-brand-color - Text color for brand variant (default: var(--dds-button-subtle-icon-enabled))\n * @cssproperty --dds-icon-button-brand-hover-bg - Hover background color for brand variant (default: var(--dds-button-subtle-background-hover))\n * @cssproperty --dds-icon-button-brand-active-bg - Active background color for brand variant (default: var(--dds-button-subtle-background-pressed))\n * @cssproperty --dds-icon-button-inverted-bg - Background color for inverted variant (default: var(--dds-transparent-white-subtle))\n * @cssproperty --dds-icon-button-inverted-color - Text color for inverted variant (default: var(--dds-button-primary-icon-enabled))\n * @cssproperty --dds-icon-button-inverted-hover-bg - Hover background color for inverted variant (default: var(--dds-transparent-white-base))\n * @cssproperty --dds-icon-button-inverted-active-bg - Active background color for inverted variant (default: var(--dds-transparent-white-medium))\n * @cssproperty --dds-icon-button-inverted-brand-bg - Background color for inverted brand variant (default: var(--dds-button-primary-background-enabled))\n * @cssproperty --dds-icon-button-inverted-brand-color - Text color for inverted brand variant (default: var(--dds-button-primary-icon-enabled))\n * @cssproperty --dds-icon-button-inverted-brand-hover-bg - Hover background color for inverted brand variant (default: var(--dds-button-primary-background-enabled))\n * @cssproperty --dds-icon-button-inverted-brand-active-bg - Active background color for inverted brand variant (default: var(--dds-button-primary-background-enabled))\n * @cssproperty --dds-icon-button-disabled-color - Color for disabled state (default: 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} sizeMap - Responsive size map (e.g. \"xs:lg\").\n * @property {string} name - The name of the input.\n * @property {'text' | 'number' | 'button' | 'color' | 'email' | 'hidden' | 'reset' | 'submit' | 'url' | 'password'| 'file' | 'time'} 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-xs - The height of the extra small input. (default: var(--dds-spacing-800)).\n * @cssproperty --dds-input-height-sm - The height of the small input. (default: var(--dds-spacing-1000)).\n * @cssproperty --dds-input-height-lg - The height of the large input. (default: var(--dds-spacing-1200)).\n * @cssproperty --dds-input-padding-xs - The padding of the extra small input. (default: 0 var(--dds-spacing-200)).\n * @cssproperty --dds-input-padding-sm - The padding of the small input. (default: 0 var(--dds-spacing-300)).\n * @cssproperty --dds-input-padding-lg - The padding of the large input. (default: 0 var(--dds-spacing-400)).\n * @cssproperty --dds-input-font-size-xs - The font size of the extra small input. (default: var(--dds-font-sm)).\n * @cssproperty --dds-input-font-size-sm - The font size of the small input. (default: var(--dds-font-base)).\n * @cssproperty --dds-input-font-size-lg - The font size of the large input. (default: var(--dds-font-lg)).\n * @cssproperty --dds-input-border - The border of the input. (default: var(--dds-border-width-base) solid var(--dds-border-neutral-base)).\n * @cssproperty --dds-input-background - The background color of the input. (default: var(--dds-fields-background-default)).\n * @cssproperty --dds-input-text-color - The text color of the input. (default: var(--dds-text-neutral-base)).\n * @cssproperty --dds-input-border-radius - The border radius of the input. (default: var(--dds-radius-base)).\n * @cssproperty --dds-input-disabled-border - The border of the disabled input. (default: 0 solid var(--dds-border-neutral-disabled)).\n * @cssproperty --dds-input-disabled-background - The background color of the disabled input. (default: var(--dds-fields-background-disabled)).\n * @cssproperty --dds-input-disabled-text - The text color of the disabled input. (default: var(--dds-text-neutral-disabled)).\n * @cssproperty --dds-input-readonly-border - The border of the readonly input. (default: 0 solid var(--dds-border-neutral-subtle)).\n * @cssproperty --dds-input-readonly-background - The background color of the readonly input. (default: var(--dds-fields-background-read-only)).\n * @cssproperty --dds-input-readonly-text - The text color of the readonly input. (default: var(--dds-text-neutral-subtle)).\n * @cssproperty --dds-input-success-border - The border of the success input. (default: var(--dds-border-width-base) solid var(--dds-border-positive-base)).\n * @cssproperty --dds-input-error-border - The border of the error input. (default: var(--dds-border-width-base) solid var(--dds-border-negative-base)).\n * @cssproperty --dds-input-addon-background - The background color of the input addon. (default: var(--dds-fields-background-default)).\n * @cssproperty --dds-input-addon-success-background - The background color of the success input addon. (default: var(--dds-fields-background-default)).\n * @cssproperty --dds-input-addon-error-background - The background color of the error input addon. (default: var(--dds-fields-background-default)).\n * @cssproperty --dds-input-addon-border-before - The border of the addon before the input. (default: var(--dds-border-width-base) solid var(--dds-border-neutral-base)).\n * @cssproperty --dds-input-addon-border-after - The border of the addon after the input. (default: var(--dds-border-width-base) solid var(--dds-border-neutral-base)).\n * @cssproperty --dds-input-addon-border-width-before - The border width of the addon before the input. (default: var(--dds-border-width-base) 0 var(--dds-border-width-base) var(--dds-border-width-base)).\n * @cssproperty --dds-input-addon-border-width-after - The border width of the addon after the input. (default: var(--dds-border-width-base) var(--dds-border-width-base) var(--dds-border-width-base) 0).\n * @cssproperty --dds-input-addon-success-border - The border of the success addon. (default: var(--dds-border-width-base) solid var(--dds-border-positive-base)).\n * @cssproperty --dds-input-addon-success-border-before - The border of the success addon before the input. (default: var(--dds-border-width-base) solid var(--dds-border-positive-base)).\n * @cssproperty --dds-input-addon-success-border-after - The border of the success addon after the input. (default: var(--dds-border-width-base) solid var(--dds-border-positive-base)).\n * @cssproperty --dds-input-addon-success-border-width-before - The border width of the success addon before the input. (default: var(--dds-border-width-base) 0 var(--dds-border-width-base) var(--dds-border-width-base)).\n * @cssproperty --dds-input-addon-success-border-width-after - The border width of the success addon after the input. (default: var(--dds-border-width-base) var(--dds-border-width-base) var(--dds-border-width-base) 0).\n * @cssproperty --dds-input-addon-error-border-before - The border of the error addon before the input. (default: var(--dds-border-width-base) solid var(--dds-border-negative-base)).\n * @cssproperty --dds-input-addon-error-border-after - The border of the error addon after the input. (default: var(--dds-border-width-base) solid var(--dds-border-negative-base)).\n * @cssproperty --dds-input-addon-error-border-width-before - The border width of the error addon before the input. (default: var(--dds-border-width-base) 0 var(--dds-border-width-base) var(--dds-border-width-base)).\n * @cssproperty --dds-input-addon-error-border-width-after - The border width of the error addon after the input. (default: var(--dds-border-width-base) var(--dds-border-width-base) var(--dds-border-width-base) 0).\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: var(--dds-background-neutral-subtle)).\n * @cssproperty {string} --dds-label-border-color - The border color of the label container. (default: var(--dds-border-neutral-subtle)).\n * @cssproperty {string} --dds-label-border-width - The border width of the label container. (default: var(--dds-border-width-base)).\n * @cssproperty {string} --dds-label-border-radius - The border radius of the label container. (default: var(--dds-radius-base)).\n * @cssproperty {string} --dds-label-padding - The padding of the label container. (default: var(--dds-spacing-400)).\n * @cssproperty {string} --dds-label-disabled-background - The background color of the label container when disabled. (default: var(--dds-background-neutral-disabled-inverted)).\n * @cssproperty {string} --dds-label-checked-border-color - The border color of the label container when checked. (default: 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 * @slot link - A router link element (e.g. Next.js Link) used for SPA navigation.\n *   Rendered outside the visible link so it is always accessible to programmatic clicks.\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 (default: var(--dds-link-enabled)).\n * @cssproperty --dds-link-hover-color - The color of the link text on hover (default: var(--dds-link-hover)).\n * @cssproperty --dds-link-active-color - The color of the link text when active (default: var(--dds-link-pressed)).\n * @cssproperty --dds-link-visited-color - The color of the visited link text (default: var(--dds-link-pressed)).\n * @cssproperty --dds-link-font-size - The font size of the link text (default: var(--dds-font-base)).\n * @cssproperty --dds-link-line-height - The line height of the link text (default: var(--dds-font-line-height-xlarge)).\n * @cssproperty --dds-link-font-weight - The font weight of the link text (default: var(--dds-font-weight-medium)).\n * @cssproperty --dds-link-text-decoration - The text decoration of the link (default: underline).\n *\n * @cssproperty --dds-link-neutral-color - The color of the neutral variant link (default: var(--dds-link-neutral-enabled)).\n * @cssproperty --dds-link-neutral-hover-color - The hover color of the neutral variant link (default: var(--dds-link-neutral-hover)).\n * @cssproperty --dds-link-neutral-active-color - The active color of the neutral variant link (default: var(--dds-link-neutral-pressed)).\n * @cssproperty --dds-link-neutral-visited-color - The visited color of the neutral variant link (default: var(--dds-link-neutral-pressed)).\n *\n * @cssproperty --dds-link-brand-color - The color of the brand variant link (default: var(--dds-link-enabled)).\n * @cssproperty --dds-link-brand-hover-color - The hover color of the brand variant link (default: var(--dds-link-hover)).\n * @cssproperty --dds-link-brand-active-color - The active color of the brand variant link (default: var(--dds-link-pressed)).\n * @cssproperty --dds-link-brand-visited-color - The visited color of the brand variant link (default: var(--dds-link-pressed)).\n *\n * @cssproperty --dds-link-inverted-color - The color of the inverted variant link (default: var(--dds-link-inverted-enabled)).\n * @cssproperty --dds-link-inverted-hover-color - The hover color of the inverted variant link (default: var(--dds-link-inverted-hover)).\n * @cssproperty --dds-link-inverted-active-color - The active color of the inverted variant link (default: var(--dds-link-inverted-pressed)).\n * @cssproperty --dds-link-inverted-visited-color - The visited color of the inverted variant link (default: var(--dds-link-inverted-visited)).\n *\n * @cssproperty --dds-link-warning-color - The color of the warning variant link (default: var(--dds-banner-action-inverted-enabled)).\n * @cssproperty --dds-link-warning-hover-color - The hover color of the warning variant link (default: var(--dds-banner-action-inverted-hover)).\n * @cssproperty --dds-link-warning-active-color - The active color of the warning variant link (default: var(--dds-banner-action-inverted-pressed)).\n * @cssproperty --dds-link-warning-visited-color - The visited color of the warning variant link (default: var(--dds-banner-action-inverted-enabled)).\n *\n * @cssproperty --dds-link-disabled-color - The color of the disabled link (default: var(--dds-text-neutral-disabled)).\n * @cssproperty --dds-link-disabled-hover-color - The hover color of the disabled link (default: var(--dds-text-neutral-disabled)).\n * @cssproperty --dds-link-disabled-active-color - The active color of the disabled link (default: var(--dds-text-neutral-disabled)).\n * @cssproperty --dds-link-disabled-visited-color - The visited color of the disabled link (default: var(--dds-text-neutral-disabled)).\n *\n * @cssproperty --dds-link-lg-font-size - The font size of the large link (default: var(--dds-font-lg)).\n * @cssproperty --dds-link-lg-line-height - The line height of the large link (default: var(--dds-font-line-height-xlarge)).\n * @cssproperty --dds-link-md-font-size - The font size of the medium link (default: var(--dds-font-base)).\n * @cssproperty --dds-link-md-line-height - The line height of the medium link (default: var(--dds-font-line-height-xlarge)).\n * @cssproperty --dds-link-sm-font-size - The font size of the small link (default: var(--dds-font-sm)).\n * @cssproperty --dds-link-sm-line-height - The line height of the small link (default: var(--dds-font-line-height-xlarge)).\n * @cssproperty --dds-link-xs-font-size - The font size of the extra small link (default: var(--dds-font-xs)).\n * @cssproperty --dds-link-xs-line-height - The line height of the extra small link (default: var(--dds-font-line-height-xlarge)).\n *\n * @cssproperty --dds-link-normal-font-weight - The font weight of the normal link (default: var(--dds-font-weight-medium)).\n * @cssproperty --dds-link-bold-font-weight - The font weight of the bold link (default: var(--dds-font-weight-bold)).\n *\n * @cssproperty --dds-link-no-underline-text-decoration - The text decoration when underline is removed (default: none).\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 * @csspart list-item-base - The base list item container.\n * @csspart icon-container - The container of the icon.\n * @csspart title-container - The container of the title.\n * @csspart description-container - The container of the description.\n * @csspart actions-container - The container of the actions.\n * @csspart iteractive-indicator-container - The container of the interactive indicator.\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 {string} title - Title of the modal.\n * @property {string} description - Description of the modal.\n * @property {boolean} fullScreen - Full screen version of the modal.\n * @property {boolean} noModal - If true, uses `.show()` (no overlay); if false, uses `.showModal()`. Default is false.\n * @property {'sm'|'lg'} size - Size of the modal. Default is 'sm'.\n * @property {string} sizeMap - Breakpoint→size map for the modal (e.g. \"md:lg\").\n *\n * @property {string} header - Whether to show the header. Default is 'true'.\n * @property {string} footer - Whether to show the footer. Default is 'true'.\n *\n * @property {boolean} wideFooter - Wide layout mode for footer.\n * @property {boolean} bottomFooter - Pushes the footer to the bottom.\n * @property {boolean} fixedHeader - Fixes the header to the top.\n * @property {boolean} fixedFooter - Fixes the footer to the bottom.\n *\n * @property {string} closeOnEsc - Whether to close on Escape key. Default is 'true'.\n * @property {string} closeOnOverlayClick - Whether to close on overlay click. Default is 'true'.\n * @property {string} closeButton - Whether to show the close button. Default is 'true'.\n *\n * @property {string} okButtonLabel - Label of the OK button.\n * @property {boolean} okButtonDisabled - Whether the OK button is disabled.\n * @property {boolean} okButtonDanger - Whether the OK button uses danger style.\n * @property {boolean} hideOkButton - Whether to hide the OK button.\n * @property {string} okButtonSize - Override size for the OK button; empty uses modal size.\n * @property {string} okButtonSizeMap - Override sizeMap for the OK button.\n *\n * @property {string} cancelButtonLabel - Label of the Cancel button.\n * @property {boolean} cancelButtonDisabled - Whether the Cancel button is disabled.\n * @property {boolean} cancelButtonDanger - Whether the Cancel button uses danger style.\n * @property {boolean} hideCancelButton - Whether to hide the Cancel button.\n * @property {string} cancelButtonSize - Override size for the Cancel button; empty uses modal size.\n * @property {string} cancelButtonSizeMap - Override sizeMap for the Cancel button.\n *\n * @property {string} closeButtonSize - Override size for the close icon button; empty uses modal size.\n * @property {string} closeButtonSizeMap - Override sizeMap for the close icon button.\n *\n * @property {boolean} useNativeFocus - Use native browser focus handling. 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 header-container - The container of the header.\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-sm - Padding inside the modal. (default: var(--dds-spacing-600)).\n * @cssproperty --dds-modal-padding-lg - Padding inside the modal. (default: var(--dds-spacing-1200)).\n * @cssproperty --dds-modal-transform-amount - Amount to transform for entrance animation. (default: 2rem).\n * @cssproperty --dds-modal-transition-speed - Speed of transition animations. (default: var(--dds-transition-fast)).\n * @cssproperty --dds-modal-transition-timing - Timing function for transitions. (default: var(--dds-easing-ease-in-out)).\n * @cssproperty --dds-modal-border-width - Border width of the modal. (default: var(--dds-border-width-base)).\n * @cssproperty --dds-modal-border-color - Border color of the modal. (default: var(--dds-border-neutral-divider)).\n * @cssproperty --dds-modal-border-radius - Border radius of the modal. (default: var(--dds-radius-large, 16px)).\n * @cssproperty --dds-modal-background - Background color of the modal. (default: var(--dds-background-neutral-subtle)).\n * @cssproperty --dds-modal-header-margin-sm - Margin below the header. (default: var(--dds-spacing-400)).\n * @cssproperty --dds-modal-header-margin-lg - Margin below the header. (default: var(--dds-spacing-600)).\n * @cssproperty --dds-modal-footer-margin-sm - Margin above the footer. (default: var(--dds-spacing-400)).\n * @cssproperty --dds-modal-footer-margin-lg - Margin above the footer. (default: var(--dds-spacing-600)).\n * @cssproperty --dds-modal-footer-gap - Gap between footer elements. (default: var(--dds-spacing-200)).\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    ","\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/navigation-menu/navigation-menu-item.component.js'\n      import type { DdsNavigationItemClickEvent } from '../../events/events'\nimport type { DdsNavigationDropdownOpenEvent } from '../../events/events'\n      export type { DdsNavigationItemClickEvent } from '../../events/events'\nexport type { DdsNavigationDropdownOpenEvent } from '../../events/events'\n\n      const tagName = 'dap-ds-navigation-menu-item'\n\n      /**\n * `dap-ds-navigation-menu-item`\n * @summary A navigation menu item that can contain either a simple link or dropdown content.\n * Supports nested items with cascading flyout behavior. Part of the navigation menu system.\n * This is for NAVIGATION (website menus), not application menus.\n *\n * @element dap-ds-navigation-menu-item\n * @title - Navigation Menu Item\n * @group navigation-menu\n *\n * @property {string} label - The label text for the navigation item. This will be displayed in the title slot if no custom title slot content is provided.\n * @property {'xs' | 'sm' | 'lg'} size - The size of the popup. Default is 'sm'.\n * @property {boolean} disabled - The disabled state of the popup. Default is false.\n * @property {boolean} opened - The open state of the popup. Default is false.\n * @property {'top' | 'right' | 'bottom' | 'left' | 'top-start' | 'top-end' | 'bottom-start' | 'bottom-end' | 'left-start' | 'left-end' | 'right-start' | 'right-end'} placement - The placement of the popup (automatically adjusted based on nesting level). Default is 'bottom-start'.\n * @property {'absolute' | 'fixed'} floatingStrategy - The floating strategy of the popup. Default is 'fixed'.\n * @property {number} offset - The offset of the popup. Default is 0.\n * @property {boolean} sync - Whether the popup should sync its width with the trigger. Default is false.\n * @property {number | 'auto'} maxHeight - The maximum height of the popup. Default is 250.\n * @property {number | 'auto'} maxWidth - The maximum width of the popup. Default is 'auto'.\n * @property {boolean} hasArrow - Whether the popup has an arrow. Default is false.\n * @property {boolean} overflow - Whether the popup should overflow. Default is true.\n * @property {boolean} fullWidth - Whether the popup should take full width of the screen. Default is false.\n * @property {boolean} exactHref - Whether the navigation item should be active if the href is exactly the same as the activeHref. Default is false.\n * @property {string} icon - The name of the icon to display in the trigger.\n * @property {string} ariaLabelledBy - The name of the element that labels the navigation dropdown.\n * @property {string} activeHref - The href of the navigation item that is active (receives aria-current=\"page\").\n * @property {string} baseHref - The href of the navigation item. If provided, the navigation item will be active if the href is a substring of the activeHref.\n * @property {string} href - The href URL for the navigation item link. When provided, the default trigger renders as a link.\n * @property {'_blank' | '_self' | '_parent' | '_top'} target - The target attribute for link navigation.\n * @property {string} rel - The rel attribute for link security and behavior.\n * @property {number} level - The nesting level of this navigation item (0 = top-level, automatically set for nested items). Default is 0.\n * @property {'horizontal' | 'vertical'} orientation - The orientation of the parent navigation menu (automatically inherited). Default is 'horizontal'.\n * @property {'group' | 'items'} tabMode - Controls how Tab key navigates through top-level items. Default is 'group'.\n *\n * @event {{ href: string, event: Event }} dds-navigation-item-click - Fired when a navigation item is clicked.\n * @event {{ item: DapDSNavigationMenuItem }} dds-navigation-dropdown-open - Fired when a navigation dropdown is opened.\n *\n * @slot trigger - The trigger element (link, button, etc.) for this navigation item.\n * @slot title - The title of the navigation item.\n * @slot indicator - The expand indicator icon (defaults to arrow icon based on orientation and level).\n * @slot link - A router link element (e.g. Next.js Link) used for SPA navigation.\n *   Rendered outside the popup so it is always accessible to programmatic clicks.\n * @slot - The dropdown content (can contain nested dap-ds-navigation-menu-item elements).\n *\n * @csspart base - The base part of the navigation item.\n * @csspart trigger - The trigger element part.\n * @csspart trigger-base - The base part of the trigger button (from dap-ds-button).\n * @csspart trigger-content - The content part of the trigger button (from dap-ds-button).\n * @csspart trigger-high-contrast - The high contrast part of the trigger button (from dap-ds-button).\n * @csspart trigger-stack-base - The base part of the trigger stack (from dap-ds-stack).\n * @csspart title - The title slot wrapper.\n * @csspart indicator - The expand indicator container.\n * @csspart indicator-icon - The expand indicator icon part.\n * @csspart indicator-icon-base - The base part of the indicator icon (from dap-ds-icon).\n * @csspart indicator-icon-icon - The icon part of the indicator icon (from dap-ds-icon).\n * @csspart popup - The dropdown popup container.\n * @csspart content - The dropdown content wrapper (default slot).\n * @csspart arrow - The dropdown arrow part.\n *\n * @cssproperty --dds-navigation-menu-item-spacing - The padding/spacing of the navigation menu item content. (default: var(--dds-spacing-200)).\n * @cssproperty --dds-navigation-menu-item-border-width - The border width of the navigation menu item content. (default: var(--dds-border-width-base)).\n * @cssproperty --dds-navigation-menu-item-border-color - The border color of the navigation menu item content. (default: var(--dds-border-neutral-subtle)).\n * @cssproperty --dds-navigation-menu-item-border-radius - The border radius of the navigation menu item content. (default: var(--dds-radius-base)).\n * @cssproperty --dds-navigation-menu-item-background - The background color of the navigation menu item content. (default: var(--dds-background-neutral-base)).\n * @cssproperty --dds-navigation-menu-item-shadow - The box shadow of the navigation menu item content. (default: var(--dds-shadow-base)).\n *\n * @accessibility\n * - Active navigation items marked with `aria-current=\"page\"`\n * - Dropdowns use `aria-expanded` and `aria-haspopup`\n * - No menu/menuitem roles (this is navigation, not an application menu)\n */\n      const reactWrapper = createComponent({\n        tagName,\n        elementClass: Component,\n        react: React,\n        events: {\n          onDdsNavigationItemClick: 'dds-navigation-item-click' as EventName<DdsNavigationItemClickEvent>,\nonDdsNavigationDropdownOpen: 'dds-navigation-dropdown-open' as EventName<DdsNavigationDropdownOpenEvent>\n        },\n        displayName: \"DapDSNavigationMenuItem\"\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/navigation-menu/navigation-menu.component.js'\n      import type { DdsNavigationItemClickEvent } from '../../events/events'\n      export type { DdsNavigationItemClickEvent } from '../../events/events'\n\n      const tagName = 'dap-ds-navigation-menu'\n\n      /**\n * `dap-ds-navigation-menu`\n * @summary A navigation menu for website/application navigation. Supports nested dropdowns with unlimited depth.\n * This is a NAVIGATION component, not an application menu (like dropdowns or context menus).\n * Uses semantic HTML (`<nav>`) and proper navigation ARIA attributes.\n *\n * @element dap-ds-navigation-menu\n * @title - Navigation Menu\n *\n * @property {string} activeHref - The currently active href for highlighting active navigation items with aria-current=\"page\". Defaults to window.location.pathname if not provided.\n * @property {'horizontal' | 'vertical'} orientation - The orientation of the navigation menu. Default is 'horizontal'.\n * @property {boolean} fullWidth - Whether the navigation menu should take full width of the screen. Default is false.\n * @property {boolean} allowMultipleOpen - Whether multiple dropdown branches can stay open simultaneously (accordion mode). Default is true.\n * @property {'group' | 'items'} tabMode - Controls how Tab key navigates through top-level items. Default is 'group'. Group mode will have the first item in the tab order, and items mode will have all items in the tab order.\n *\n * @event {{ href: string, event: Event }} dds-navigation-item-click - Fired when a navigation item is clicked.\n *\n * @slot - The navigation menu list and items.\n *\n * @csspart base - The main navigation menu container (nav element).\n *\n * @cssproperty --dds-navigation-menu-item-gap - The gap between navigation menu items. (default: var(--dds-spacing-100)).\n *\n * @accessibility\n * - Uses semantic `<nav>` element (no menu/menubar roles)\n * - Active items marked with `aria-current=\"page\"`\n * - Keyboard navigation: Tab, Arrow keys, Enter, Escape\n * - Screen readers announce as navigation landmark\n */\n      const reactWrapper = createComponent({\n        tagName,\n        elementClass: Component,\n        react: React,\n        events: {\n          onDdsNavigationItemClick: 'dds-navigation-item-click' as EventName<DdsNavigationItemClickEvent>\n        },\n        displayName: \"DapDSNavigationMenu\"\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 (default: var(--dds-spacing-500))\n * @cssproperty --dds-notification-badge-min-width - Minimum width of the notification badge (default: var(--dds-spacing-500))\n * @cssproperty --dds-notification-badge-height - Height of the notification badge (default: var(--dds-spacing-500))\n * @cssproperty --dds-notification-badge-padding - Padding inside the notification badge (default: 0 var(--dds-spacing-150))\n * @cssproperty --dds-notification-badge-border-radius - Border radius of the notification badge (default: var(--dds-radius-base))\n * @cssproperty --dds-notification-badge-font-size - Font size of the notification badge text (default: var(--dds-font-xs))\n * @cssproperty --dds-notification-badge-dot-size - Size of the dot variant (default: var(--dds-spacing-200))\n * @cssproperty --dds-notification-badge-color - Text color of the notification badge (default: var(--dds-background-neutral-medium))\n * @cssproperty --dds-notification-badge-neutral-bg - Background color for neutral type (default: var(--dds-text-neutral-subtle))\n * @cssproperty --dds-notification-badge-brand-bg - Background color for brand type (default: var(--dds-text-brand-subtle))\n * @cssproperty --dds-notification-badge-info-bg - Background color for info type (default: var(--dds-text-informative-subtle))\n * @cssproperty --dds-notification-badge-positive-bg - Background color for positive type (default: var(--dds-text-positive-subtle))\n * @cssproperty --dds-notification-badge-warning-bg - Background color for warning type (default: var(--dds-text-warning-subtle))\n * @cssproperty --dds-notification-badge-negative-bg - Background color for negative type (default: var(--dds-text-negative-subtle))\n * @cssproperty --dds-notification-badge-circular-offset-x - Horizontal offset for circular positioning (default: 20px)\n * @cssproperty --dds-notification-badge-circular-offset-y - Vertical offset for circular positioning (default: -20px)\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-xs - The height of the extra small input. (default: var(--dds-spacing-800) ).\n * @cssproperty --dds-input-height-sm - The height of the small input. (default: var(--dds-spacing-1000)).\n * @cssproperty --dds-input-height-lg - The height of the large input. (default: var(--dds-spacing-1200)).\n * @cssproperty --dds-input-padding-xs - The padding of the extra small input. (default: 0 var(--dds-spacing-200)).\n * @cssproperty --dds-input-padding-sm - The padding of the small input. (default: 0 var(--dds-spacing-300)).\n * @cssproperty --dds-input-padding-lg - The padding of the large input. (default: 0 var(--dds-spacing-400)).\n * @cssproperty --dds-input-font-size-xs - The font size of the extra small input. (default: var(--dds-font-sm)).\n * @cssproperty --dds-input-font-size-sm - The font size of the small input. (default: var(--dds-font-base)).\n * @cssproperty --dds-input-font-size-lg - The font size of the large input. (default: var(--dds-font-lg)).\n * @cssproperty --dds-input-border - The border of the input. (default: var(--dds-border-width-base) solid var(--dds-border-neutral-base)).\n * @cssproperty --dds-input-background - The background color of the input. (default: var(--dds-fields-background-default)).\n * @cssproperty --dds-input-text-color - The text color of the input. (default: var(--dds-text-neutral-base)).\n * @cssproperty --dds-input-border-radius - The border radius of the input. (default: var(--dds-radius-base)).\n * @cssproperty --dds-input-disabled-border - The border of the disabled input. (default: 0 solid var(--dds-border-neutral-disabled)).\n * @cssproperty --dds-input-disabled-background - The background color of the disabled input. (default: var(--dds-fields-background-disabled)).\n * @cssproperty --dds-input-disabled-text - The text color of the disabled input. (default: var(--dds-text-neutral-disabled)).\n * @cssproperty --dds-input-readonly-border - The border of the readonly input. (default: 0 solid var(--dds-border-neutral-subtle)).\n * @cssproperty --dds-input-readonly-background - The background color of the readonly input. (default: var(--dds-fields-background-read-only)).\n * @cssproperty --dds-input-readonly-text - The text color of the readonly input. (default: var(--dds-text-neutral-subtle)).\n * @cssproperty --dds-input-success-border - The border of the success input. (default: var(--dds-border-width-base) solid var(--dds-border-positive-base)).\n * @cssproperty --dds-input-error-border - The border of the error input. (default: var(--dds-border-width-base) solid var(--dds-border-negative-base)).\n * @cssproperty --dds-input-addon-background - The background color of the input addon. (default: var(--dds-fields-background-default)).\n * @cssproperty --dds-input-addon-success-background - The background color of the success input addon. (default: var(--dds-fields-background-default)).\n * @cssproperty --dds-input-addon-error-background - The background color of the error input addon. (default: var(--dds-fields-background-default)).\n * @cssproperty --dds-input-addon-border-before - The border of the addon before the input. (default: var(--dds-border-width-base) solid var(--dds-border-neutral-base)).\n * @cssproperty --dds-input-addon-border-after - The border of the addon after the input. (default: var(--dds-border-width-base) solid var(--dds-border-neutral-base)).\n * @cssproperty --dds-input-addon-border-width-before - The border width of the addon before the input. (default: var(--dds-border-width-base) 0 var(--dds-border-width-base) var(--dds-border-width-base)).\n * @cssproperty --dds-input-addon-border-width-after - The border width of the addon after the input. (default: var(--dds-border-width-base) var(--dds-border-width-base) var(--dds-border-width-base) 0).\n * @cssproperty --dds-input-addon-success-border - The border of the success addon. (default: var(--dds-border-width-base) solid var(--dds-border-positive-base)).\n * @cssproperty --dds-input-addon-success-border-before - The border of the success addon before the input. (default: var(--dds-border-width-base) solid var(--dds-border-positive-base)).\n * @cssproperty --dds-input-addon-success-border-after - The border of the success addon after the input. (default: var(--dds-border-width-base) solid var(--dds-border-positive-base)).\n * @cssproperty --dds-input-addon-success-border-width-before - The border width of the success addon before the input. (default: var(--dds-border-width-base) 0 var(--dds-border-width-base) var(--dds-border-width-base)).\n * @cssproperty --dds-input-addon-success-border-width-after - The border width of the success addon after the input. (default: var(--dds-border-width-base) var(--dds-border-width-base) var(--dds-border-width-base) 0).\n * @cssproperty --dds-input-addon-error-border-before - The border of the error addon before the input. (default: var(--dds-border-width-base) solid var(--dds-border-negative-base)).\n * @cssproperty --dds-input-addon-error-border-after - The border of the error addon after the input. (default: var(--dds-border-width-base) solid var(--dds-border-negative-base)).\n * @cssproperty --dds-input-addon-error-border-width-before - The border width of the error addon before the input. (default: var(--dds-border-width-base) 0 var(--dds-border-width-base) var(--dds-border-width-base)).\n * @cssproperty --dds-input-addon-error-border-width-after - The border width of the error addon after the input. (default: var(--dds-border-width-base) var(--dds-border-width-base) var(--dds-border-width-base) 0).\n *\n * @csspart base - The main number 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 * @csspart decrement-button - The decrement button of the input.\n * @csspart increment-button - The increment button of the input.\n * @csspart decrement-button-base - The base of the decrement button.\n * @csspart increment-button-base - The base of the increment button.\n * @csspart decrement-button-content - The content of the decrement button.\n * @csspart increment-button-content - The content of the increment button.\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 {string} heading - The heading text of the accordion, this will be used as the aria label of the heading also if ariaLabel is not provided\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-official-banner-background-color - The background color of the official website banner (default: var(--dds-background-brand-medium-inverted))\n * @cssproperty --dds-official-banner-text-color - The text color of the official website banner (default: var(--dds-text-neutral-on-inverted))\n * @cssproperty --dds-official-banner-heading-hover-color - The heading hover color of the official website banner (default: var(--dds-background-brand-medium-inverted))\n * @cssproperty --dds-official-banner-border-radius - The border radius of the official website banner (default: 0)\n * @cssproperty --dds-official-banner-icon-color - The icon color of the official website banner (default: var(--dds-text-neutral-on-inverted))\n * @cssproperty --dds-official-banner-icon-color-hover - The icon hover color of the opener icon official website banner (default: var(--dds-text-neutral-on-inverted))\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-group/option-group.component.js'\n\nconst tagName = 'dap-ds-option-group'\n\n/**\n * `dap-ds-option-group`\n * @summary An option group is a container for grouping related option items.\n * Used with dap-ds-select to create grouped options that render as native optgroup elements.\n * @element dap-ds-option-group\n * @title - Option group\n *\n * @property {string} label - The label of the option group (displayed in native optgroup).\n * @property {boolean} disabled - Whether all options in the group are disabled.\n *\n * @slot - The option items in this group.\n *\n * @csspart base - The main option group container.\n * @csspart label - The label of the option group.\n */\nconst reactWrapper = createComponent({\n  tagName,\n  elementClass: Component,\n  react: React,\n  events: {},\n  displayName: 'DapDSOptionGroup',\n})\n\nexport 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 * @group select,combobox\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 (default: var(--dds-spacing-100))\n * @cssproperty --dds-option-item-padding-horizontal - The horizontal padding of the option item (default: var(--dds-spacing-200))\n * @cssproperty --dds-option-item-border-radius - The border radius of the option item (default: var(--dds-radius-small, 4px))\n * @cssproperty --dds-option-item-color - The text color of the option item (default: var(--dds-text-neutral-base))\n * @cssproperty --dds-option-item-hover-bg - The background color of the option item when hovered (default: var(--dds-background-neutral-medium))\n * @cssproperty --dds-option-item-active-bg - The background color of the option item when active (default: var(--dds-background-neutral-strong))\n * @cssproperty --dds-option-item-disabled-color - The text color of the option item when disabled (default: var(--dds-text-neutral-disabled))\n * @cssproperty --dds-option-item-high-contrast-border - The border color of the option item in high contrast mode (default: var(--dds-border-neutral-transparent-interactive, #fff500))\n * @cssproperty --dds-option-item-selected-font-weight - The font weight of the option item when selected (default: var(--dds-font-weight-bold))\n * @cssproperty --dds-option-item-xs-font-size - The font size of the option item in extra small size (default: var(--dds-font-sm))\n * @cssproperty --dds-option-item-lg-font-size - The font size of the option item in large size (default: var(--dds-font-lg))\n * @cssproperty --dds-option-item-selected-icon-width - The width of the selected icon (default: var(--dds-spacing-400))\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'\nimport type { DdsListChangedEvent } from '../../events/events'\n      export type { DdsCancelEvent } from '../../events/events'\nexport type { DdsOptionChangeEvent } from '../../events/events'\nexport type { DdsKeydownEvent } from '../../events/events'\nexport type { DdsListChangedEvent } 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 * @event {{ elements: DapDSOptionItem[] }} dds-list-changed - Fired when the available options list changes.\n *\n * @csspart base - The main option list container.\n * @csspart option-item - The option item of the option list.\n * @csspart popup-base - The base of the popup.\n * @csspart option-item-base - The base of the option item.\n * @csspart option-item-label - The label of the option item.\n * @csspart option-item-prefix - The prefix of the option item.\n * @csspart option-item-suffix - The suffix of the option item.\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>,\nonDdsListChanged: 'dds-list-changed' as EventName<DdsListChangedEvent>\n        },\n        displayName: \"DapDSOptionList\"\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/overlay/overlay.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'\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'\n\n      const 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 * @property {boolean} open - The open state of the overlay.\n *\n * @event {CustomEvent} dds-before-open - Fires before the overlay opens.\n * @event {CustomEvent} dds-opened - Fires after the overlay opens.\n * @event {CustomEvent} dds-before-close - Fires before the overlay closes.\n * @event {CustomEvent} dds-closed - Fires after the overlay closes.\n *\n * @slot - The content of the overlay.\n *\n * @csspart base - The overlay element\n *\n * @cssproperty --dds-overlay-z-index - Controls the z-index of the overlay (default: 1)\n * @cssproperty --dds-overlay-background - Controls the background 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 * @cssproperty --dds-overlay-transition-duration - Controls the transition duration (default: var(--dds-transition-fast))\n * @cssproperty --dds-overlay-transition-timing - Controls the transition timing function (default: var(--dds-easing-ease-in-out))\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>\n        },\n        displayName: \"DapDSOverlay\"\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/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 * @csspart page-size - The page size select.\n * @csspart pager-button-first-base - The base of the first page button.\n * @csspart pager-button-first-content - The content of the first page button.\n * @csspart pager-button-previous-base - The base of the previous page button.\n * @csspart pager-button-previous-content - The content of the previous page button.\n * @csspart pager-button-next-base - The base of the next page button.\n * @csspart pager-button-next-content - The content of the next page button.\n * @csspart pager-button-last-base - The base of the last page button.\n * @csspart pager-button-last-content - The content of the last page button.\n * @csspart page-size-select-base - The base of the page size select.\n * @csspart page-size-select-trigger - The trigger of the page size select.\n *\n * @cssproperty --dds-pager-spacing-vertical - The vertical spacing of the pager (default: var(--dds-spacing-400))\n * @cssproperty --dds-pager-spacing-horizontal - The horizontal spacing of the pager (default: var(--dds-spacing-200))\n * @cssproperty --dds-pager-button-padding - The padding of the pager buttons (default: var(--dds-spacing-150))\n * @cssproperty --dds-pager-button-border-width - The border width of the pager buttons (default: var(--dds-border-width-base, 1px))\n * @cssproperty --dds-pager-button-border-color - The border color of the pager buttons (default: var(--dds-button-subtle-border-neutral-enabled))\n * @cssproperty --dds-pager-button-border-radius - The border radius of the pager buttons (default: var(--dds-radius-rounded))\n * @cssproperty --dds-pager-button-background - The background color of the pager buttons (default: var(--dds-button-subtle-background-neutral-enabled))\n * @cssproperty --dds-pager-button-font-size - The font size of the pager buttons (default: var(--dds-font-sm, 14px))\n * @cssproperty --dds-pager-button-font-weight - The font weight of the pager buttons (default: var(--dds-font-weight-bold, 700))\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-xs - The height of the extra small input. (default: var(--dds-spacing-800)).\n * @cssproperty --dds-input-height-sm - The height of the small input. (default: var(--dds-spacing-1000)).\n * @cssproperty --dds-input-height-lg - The height of the large input. (default: var(--dds-spacing-1200)).\n * @cssproperty --dds-input-padding-xs - The padding of the extra small input. (default: 0 var(--dds-spacing-200)).\n * @cssproperty --dds-input-padding-sm - The padding of the small input. (default: 0 var(--dds-spacing-300)).\n * @cssproperty --dds-input-padding-lg - The padding of the large input. (default: 0 var(--dds-spacing-400)).\n * @cssproperty --dds-input-font-size-xs - The font size of the extra small input. (default: var(--dds-font-sm)).\n * @cssproperty --dds-input-font-size-sm - The font size of the small input. (default: var(--dds-font-base)).\n * @cssproperty --dds-input-font-size-lg - The font size of the large input. (default: var(--dds-font-lg)).\n * @cssproperty --dds-input-border - The border of the input. (default: var(--dds-border-width-base) solid var(--dds-border-neutral-base)).\n * @cssproperty --dds-input-background - The background color of the input. (default: var(--dds-fields-background-default)).\n * @cssproperty --dds-input-text-color - The text color of the input. (default: var(--dds-text-neutral-base)).\n * @cssproperty --dds-input-border-radius - The border radius of the input. (default: var(--dds-radius-base)).\n * @cssproperty --dds-input-disabled-border - The border of the disabled input. (default: 0 solid var(--dds-border-neutral-disabled)).\n * @cssproperty --dds-input-disabled-background - The background color of the disabled input. (default: var(--dds-fields-background-disabled)).\n * @cssproperty --dds-input-disabled-text - The text color of the disabled input. (default: var(--dds-text-neutral-disabled)).\n * @cssproperty --dds-input-readonly-border - The border of the readonly input. (default: 0 solid var(--dds-border-neutral-subtle)).\n * @cssproperty --dds-input-readonly-background - The background color of the readonly input. (default: var(--dds-fields-background-read-only)).\n * @cssproperty --dds-input-readonly-text - The text color of the readonly input. (default: var(--dds-text-neutral-subtle)).\n * @cssproperty --dds-input-success-border - The border of the success input. (default: var(--dds-border-width-base) solid var(--dds-border-positive-base)).\n * @cssproperty --dds-input-error-border - The border of the error input. (default: var(--dds-border-width-base) solid var(--dds-border-negative-base)).\n * @cssproperty --dds-input-addon-background - The background color of the input addon. (default: var(--dds-fields-background-default)).\n * @cssproperty --dds-input-addon-success-background - The background color of the success input addon. (default: var(--dds-fields-background-default)).\n * @cssproperty --dds-input-addon-error-background - The background color of the error input addon. (default: var(--dds-fields-background-default)).\n * @cssproperty --dds-input-addon-border-before - The border of the addon before the input. (default: var(--dds-border-width-base) solid var(--dds-border-neutral-base)).\n * @cssproperty --dds-input-addon-border-after - The border of the addon after the input. (default: var(--dds-border-width-base) solid var(--dds-border-neutral-base)).\n * @cssproperty --dds-input-addon-border-width-before - The border width of the addon before the input. (default: var(--dds-border-width-base) 0 var(--dds-border-width-base) var(--dds-border-width-base)).\n * @cssproperty --dds-input-addon-border-width-after - The border width of the addon after the input. (default: var(--dds-border-width-base) var(--dds-border-width-base) var(--dds-border-width-base) 0).\n * @cssproperty --dds-input-addon-success-border - The border of the success addon. (default: var(--dds-border-width-base) solid var(--dds-border-positive-base)).\n * @cssproperty --dds-input-addon-success-border-before - The border of the success addon before the input. (default: var(--dds-border-width-base) solid var(--dds-border-positive-base)).\n * @cssproperty --dds-input-addon-success-border-after - The border of the success addon after the input. (default: var(--dds-border-width-base) solid var(--dds-border-positive-base)).\n * @cssproperty --dds-input-addon-success-border-width-before - The border width of the success addon before the input. (default: var(--dds-border-width-base) 0 var(--dds-border-width-base) var(--dds-border-width-base)).\n * @cssproperty --dds-input-addon-success-border-width-after - The border width of the success addon after the input. (default: var(--dds-border-width-base) var(--dds-border-width-base) var(--dds-border-width-base) 0).\n * @cssproperty --dds-input-addon-error-border-before - The border of the error addon before the input. (default: var(--dds-border-width-base) solid var(--dds-border-negative-base)).\n * @cssproperty --dds-input-addon-error-border-after - The border of the error addon after the input. (default: var(--dds-border-width-base) solid var(--dds-border-negative-base)).\n * @cssproperty --dds-input-addon-error-border-width-before - The border width of the error addon before the input. (default: var(--dds-border-width-base) 0 var(--dds-border-width-base) var(--dds-border-width-base)).\n * @cssproperty --dds-input-addon-error-border-width-after - The border width of the error addon after the input. (default: var(--dds-border-width-base) var(--dds-border-width-base) var(--dds-border-width-base) 0).\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 show-button - The show button of the password input.\n * @csspart show-button-base - The base of the show button.\n * @csspart show-button-content - The content of the show button.\n * @csspart show-icon - The show icon of the password input.\n * @csspart show-icon-base - The base of the show icon.\n * @csspart hide-button - The hide button of the password input.\n * @csspart hide-button-base - The base of the hide button.\n * @csspart hide-button-content - The content of the hide button.\n * @csspart hide-icon - The hide icon of the password input.\n * @csspart hide-icon-base - The base of the hide 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'\nimport type { DdsCloseEvent } from '../../events/events'\n      export type { DdsOpenedEvent } from '../../events/events'\nexport type { DdsClosedEvent } from '../../events/events'\nexport type { DdsCloseEvent } 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 * @property {boolean} disabled - The disabled state of the popup.\n * @property {boolean} opened - The open state of the popup.\n * @property {'top' | 'right' | 'bottom' | 'left' | 'top-start' | 'top-end' | 'bottom-start' | 'bottom-end' | 'left-start' | 'left-end' | 'right-start' | 'right-end'} placement - The placement of the popup.\n * @property {'absolute' | 'fixed'} floatingStrategy - The floating strategy of the popup.\n * @property {number} offset - The offset of the popup.\n * @property {boolean} sync - Whether the popup should sync its width with the trigger.\n * @property {number | 'auto'} maxHeight - The maximum height of the popup.\n * @property {number | 'auto'} maxWidth - The maximum width of the popup.\n * @property {boolean} hasArrow - Whether the popup has an arrow.\n * @property {boolean} overflow - Whether the popup should overflow.\n * @property {boolean} fullWidth - Whether the popup should take full width of the screen.\n *\n * @event {{ void }} dds-opened - Fired when the popup is opened.\n * @event {{ void }} dds-closed - Fired when the popup is closed.\n * @event {{ void }} dds-close - Fired when the popup should be 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 (default: var(--dds-z-index-20))\n * @cssproperty --dds-popup-padding - Default padding of the popup (default: var(--dds-spacing-400))\n * @cssproperty --dds-popup-padding-xs - Padding of the popup when size is xs (default: var(--dds-spacing-200))\n * @cssproperty --dds-popup-padding-lg - Padding of the popup when size is lg (default: var(--dds-spacing-500))\n * @cssproperty --dds-popup-border-width - Border width of the popup (default: var(--dds-border-width-base))\n * @cssproperty --dds-popup-border-radius - Border radius of the popup (default: var(--dds-radius-base))\n * @cssproperty --dds-popup-border-color - Border color of the popup (default: var(--dds-border-neutral-subtle))\n * @cssproperty --dds-popup-background - Background color of the popup (default: var(--dds-background-neutral-base))\n * @cssproperty --dds-popup-color - Text color of the popup (default: var(--dds-text-neutral-base))\n * @cssproperty --dds-popup-arrow-size - Size of the popup arrow (default: var(--dds-tooltip-arrow-size))\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>,\nonDdsClose: 'dds-close' as EventName<DdsCloseEvent>\n        },\n        displayName: \"DapDSPopup\"\n      })\n\n      export default reactWrapper\n    ","import { createComponent } from '@lit/react'\nimport * as React from 'react'\n\nimport Component from '../../components/progress/progress.component.js'\n\nconst tagName = 'dap-ds-progress'\n\n/**\n * `dap-ds-progress`\n * @summary Progress indicator component with linear and circular variants.\n * @element dap-ds-progress\n * @title - Progress\n *\n * @csspart base - The main progress container.\n * @csspart track - The progress track (background).\n * @csspart fill - The progress fill (bar for linear, circle for circular).\n * @csspart label - The progress label text.\n * @csspart percentage - The percentage text (circular variant only).\n * @csspart background - The background circle (circular variant only).\n *\n * @slot label - Custom label content for the progress indicator.\n *\n * @cssprop --dds-progress-track-color - Background color of the progress track (default: var(--dds-neutral-200))\n * @cssprop --dds-progress-fill-color-neutral - Fill color for neutral variant (default: var(--dds-icon-neutral-base))\n * @cssprop --dds-progress-fill-color-brand - Fill color for brand variant (default: var(--dds-icon-brand-subtle))\n * @cssprop --dds-progress-fill-color-negative - Fill color for negative variant (default: var(--dds-icon-negative-subtle))\n * @cssprop --dds-progress-fill-color-positive - Fill color for positive variant (default: var(--dds-icon-positive-subtle))\n * @cssprop --dds-progress-fill-color-inverted - Fill color for inverted variant (default: var(--dds-icon-neutral-inverted))\n * @cssprop --dds-progress-height-xs - Height for extra small linear progress (default: var(--dds-spacing-50))\n * @cssprop --dds-progress-height-sm - Height for small linear progress (default: var(--dds-spacing-100))\n * @cssprop --dds-progress-height-md - Height for medium linear progress (default: var(--dds-spacing-150))\n * @cssprop --dds-progress-height-lg - Height for large linear progress (default: var(--dds-spacing-200))\n * @cssprop --dds-progress-height-xl - Height for extra large linear progress (default: var(--dds-spacing-300))\n * @cssprop --dds-progress-height-xxl - Height for extra extra large linear progress (default: var(--dds-spacing-400))\n * @cssprop --dds-progress-diameter-xs - Diameter for extra small circular progress (default: var(--dds-spacing-600))\n * @cssprop --dds-progress-diameter-sm - Diameter for small circular progress (default: var(--dds-spacing-800))\n * @cssprop --dds-progress-diameter-md - Diameter for medium circular progress (default: var(--dds-spacing-1200))\n * @cssprop --dds-progress-diameter-lg - Diameter for large circular progress (default: var(--dds-spacing-1600))\n * @cssprop --dds-progress-diameter-xl - Diameter for extra large circular progress (default: var(--dds-spacing-2000))\n * @cssprop --dds-progress-diameter-xxl - Diameter for extra extra large circular progress (default: var(--dds-spacing-2400))\n * @cssprop --dds-progress-stroke-width - Stroke width for circular progress (default: var(--dds-spacing-200))\n * @cssprop --dds-progress-animation-duration - Duration of indeterminate animation (default: 1.5s)\n *\n * @property { 'xs' | 'sm' | 'md' | 'lg' | 'xl' | 'xxl' } size - The size of the progress indicator. Default is `sm`. See SizedMixin.\n * @property {string} sizeMap - Responsive size map (e.g. \"md:lg\"); see SizedMixin.\n */\nconst reactWrapper = createComponent({\n  tagName,\n  elementClass: Component,\n  react: React,\n  events: {},\n  displayName: 'DapDSProgress',\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/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 * @event {{ checked: boolean, value: string, disabled: boolean, readonly: boolean, type: 'radio' }} 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 {{ checked: boolean, value: string, disabled: boolean, readonly: boolean }} dds-input - Emitted when the radio button receives input.\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 - Whether the radio button is checked.\n * @property {string} label - The label of the radio button.\n * @property {string} description - The description of the radio button.\n * @property {boolean} disabled - Whether the radio button is disabled.\n * @property {boolean} readonly - Whether the radio button is readonly (cannot be changed but value is submitted with form).\n * @property {boolean} required - Whether the radio button is required.\n * @property {'xs' | 'sm' | 'lg'} size - The size of the radio button. Default is 'sm'.\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 radio button.\n * @property {'negative' | 'positive' | 'warning'} feedbackType - The feedback type of the radio button.\n * @property {boolean} invalid - The invalid state of the radio button.\n * @property {boolean} optional - The optional state of the radio button.\n * @property {string} optionalLabel - The optional label of the radio button.\n * @property {boolean} preventDefault - Whether the radio button should prevent the default action.\n * @property {boolean} focusable - Whether the radio button is focusable.\n * @property {'normal' | 'background'} type - The type of the radio button.\n * @property {boolean} border - This sets up a border around the radio button, when true.\n *\n * @csspart base - The main radio button container.\n * @csspart wrapper - The wrapper of the radio button.\n * @csspart base-label - 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 label-container - The label container 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 * @cssproperty --dds-radio-readonly-border-color - Sets the border color when the radio button is readonly. (default: var(--dds-border-neutral-subtle))\n * @cssproperty --dds-radio-readonly-background-color - Sets the background color when the radio button is readonly. (default: var(--dds-background-neutral-subtle))\n * @cssproperty --dds-radio-readonly-icon-color - Sets the color of the radio button icon when readonly. (default: var(--dds-text-neutral-base))\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","import { createComponent } from '@lit/react'\nimport * as React from 'react'\n\nimport Component from '../../components/scroll-progress/scroll-progress.component.js'\n\nconst tagName = 'dap-ds-scroll-progress'\n\n/**\n * `dap-ds-scroll-progress`\n * @summary A progress bar that displays scroll position, supporting both page-level and container-level scroll tracking.\n * @element dap-ds-scroll-progress\n * @title - Scroll Progress\n *\n * @csspart base - The main scroll progress container.\n * @csspart track - The progress track (background).\n * @csspart fill - The progress fill bar.\n *\n * @cssprop --dds-scroll-progress-z-index - Z-index for fixed positioning (default: 1000)\n * @cssprop --dds-scroll-progress-transition - Transition for progress updates (default: width 0.1s ease-out)\n * @cssprop --dds-scroll-progress-track-color - Background color of the progress track (default: var(--dds-neutral-200))\n * @cssprop --dds-scroll-progress-fill-color-neutral - Fill color for neutral variant\n * @cssprop --dds-scroll-progress-fill-color-brand - Fill color for brand variant\n * @cssprop --dds-scroll-progress-fill-color-negative - Fill color for negative variant\n * @cssprop --dds-scroll-progress-fill-color-positive - Fill color for positive variant\n * @cssprop --dds-scroll-progress-fill-color-inverted - Fill color for inverted variant\n *\n * @property { 'xxs' | 'xs' | 'sm' | 'md' | 'lg' } size - The size of the scroll progress bar. Default is `sm`. See SizedMixin.\n * @property {string} sizeMap - Responsive size map (e.g. \"md:lg\"); see SizedMixin.\n */\nconst reactWrapper = createComponent({\n  tagName,\n  elementClass: Component,\n  react: React,\n  events: {},\n  displayName: 'DapDSScrollProgress',\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 {boolean} 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 {string} clearButton - Whether the search is clearable. Default is 'true'.\n * @property {string} feedback - The feedback content of the search.\n * @property {'negative' | 'positive' | '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} textComplete - 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-background - The background color of the combobox. (default: var(--dds-fields-background-default))\n * @cssproperty --dds-combobox-border-color - The border color of the combobox. (default: var(--dds-border-neutral-base))\n * @cssproperty --dds-combobox-border-width - The border width of the combobox. (default: var(--dds-border-width-base, 1px))\n * @cssproperty --dds-combobox-border-radius - The border radius of the combobox. (default: var(--dds-radius-base))\n * @cssproperty --dds-combobox-text-color - The text color of the combobox. (default: var(--dds-text-neutral-base))\n * @cssproperty --dds-combobox-placeholder-color - The placeholder text color. (default: var(--dds-text-neutral-subtle))\n * @cssproperty --dds-combobox-disabled-background - The background color when disabled. (default: var(--dds-background-neutral-stronger))\n * @cssproperty --dds-combobox-disabled-text - The text color when disabled. (default: var(--dds-text-neutral-disabled))\n * @cssproperty --dds-combobox-error-border - The border color for error state. (default: var(--dds-border-negative-base))\n * @cssproperty --dds-combobox-success-border - The border color for success state. (default: var(--dds-border-positive-base))\n * @cssproperty --dds-combobox-icon-color - The color of the icons. (default: var(--dds-text-icon-neutral-subtle))\n * @cssproperty --dds-combobox-loading-spinner-color - The color of the loading spinner. (default: var(--dds-icon-neutral-base))\n * @cssproperty --dds-combobox-clear-icon-color - The color of the clear icon. (default: var(--dds-button-subtle-icon-neutral-enabled))\n * @cssproperty --dds-combobox-popup-background - The background color of the popup. (default: var(--dds-background-neutral-subtle))\n * @cssproperty --dds-combobox-popup-shadow - The box shadow of the popup. (default: 0 4px 6px -1px rgba(0, 0, 0, 0.08), 0 2px 4px -1px rgba(0, 0, 0, 0.06))\n * @cssproperty --dds-combobox-icon-opened-transform - The transform of the icon when the combobox is opened (default: rotate(90deg)).\n * @cssproperty --dds-combobox-padding-xs - The padding for extra small size. (default: var(--dds-spacing-200))\n * @cssproperty --dds-combobox-padding-sm - The padding for small size. (default: var(--dds-spacing-200))\n * @cssproperty --dds-combobox-padding-lg - The padding for large size. (default: var(--dds-spacing-300))\n * @cssproperty --dds-combobox-padding-horizontal - The horizontal padding. (default: var(--dds-spacing-300))\n * @cssproperty --dds-combobox-padding-vertical - The vertical padding. (default: var(--dds-spacing-200))\n * @cssproperty --dds-combobox-gap - The gap between elements. (default: var(--dds-spacing-100))\n * @cssproperty --dds-combobox-icon-gap - The gap between icons. (default: var(--dds-spacing-200))\n * @cssproperty --dds-combobox-action-gap - The gap between action elements. (default: var(--dds-spacing-200))\n * @cssproperty --dds-combobox-action-padding - The padding for action elements. (default: var(--dds-spacing-300))\n * @cssproperty --dds-combobox-clear-icon-width - The width of the clear icon. (default: var(--dds-spacing-800))\n * @cssproperty --dds-combobox-dropdown-icon-right - The right position of the dropdown icon. (default: var(--dds-spacing-600))\n * @cssproperty --dds-combobox-min-width - The minimum width of the combobox. (default: 7.5rem)\n * @cssproperty --dds-combobox-chips-gap - The gap between chips. (default: var(--dds-spacing-100))\n * @cssproperty --dds-combobox-chips-padding - The padding for chips. (default: var(--dds-spacing-100))\n * @cssproperty --dds-combobox-chips-max-height - The maximum height of the chips. (default: 120px)\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 * @csspart input - The input 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    ","import { createComponent } from '@lit/react'\nimport * as React from 'react'\n\nimport Component from '../../components/sidenav/sidenav-group.component.js'\n\nconst 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 * @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 (default: var(--dds-spacing-100))\n * @cssproperty --dds-sidenav-group-border-radius - Border radius of the sidenav group (default: var(--dds-radius-base))\n * @cssproperty --dds-sidenav-group-spacing-margin - Margin used for spacing variants (default: var(--dds-spacing-400))\n * @cssproperty --dds-sidenav-group-item-min-height-xs - Minimum height of the sidenav group item (default: var(--dds-spacing-800))\n * @cssproperty --dds-sidenav-group-item-min-height-sm - Minimum height of the sidenav group item (default: var(--dds-spacing-1000))\n * @cssproperty --dds-sidenav-group-item-min-height-lg - Minimum height of the sidenav group item (default: var(--dds-spacing-1200))\n * @cssproperty --dds-sidenav-group-item-padding-xs - Padding of the sidenav group item (default: var(--dds-spacing-100) var(--dds-spacing-300))\n * @cssproperty --dds-sidenav-group-item-padding-sm - Padding of the sidenav group item (default: var(--dds-spacing-200) var(--dds-spacing-400))\n * @cssproperty --dds-sidenav-group-item-padding-lg - Padding of the sidenav group item (default: var(--dds-spacing-300) var(--dds-spacing-500))\n * @cssproperty --dds-sidenav-group-item-color - Text color of the sidenav group item (default: var(--dds-text-neutral-base))\n * @cssproperty --dds-sidenav-group-item-font-size-xs - Font size of the sidenav group item (default: var(--dds-font-sm))\n * @cssproperty --dds-sidenav-group-item-font-size-sm - Font size of the sidenav group item (default: var(--dds-font-base))\n * @cssproperty --dds-sidenav-group-item-font-size-lg - Font size of the sidenav group item (default: var(--dds-font-lg))\n * @cssproperty --dds-sidenav-group-item-font-weight - Font weight of the sidenav group item (default: var(--dds-font-weight-medium))\n * @cssproperty --dds-sidenav-group-item-bg-active - Background color when the item is active (default: var(--dds-transparent-black-subtle))\n * @cssproperty --dds-sidenav-group-item-bg-hover - Background color on hover and active states (default: var(--dds-transparent-black-base))\n * @cssproperty --dds-sidenav-group-toggle-margin - Margin for the toggle button (default: var(--dds-spacing-300))\n * @cssproperty --dds-sidenav-group-submenu-padding - Padding for the submenu (default: var(--dds-spacing-300) 0)\n */\nconst reactWrapper = createComponent({\n  tagName,\n  elementClass: Component,\n  react: React,\n  events: {},\n  displayName: 'DapDSSideNavGroup',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport * as React from 'react'\n\nimport Component from '../../components/sidenav/sidenav-item.component.js'\n\nconst 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 * @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-xs - Minimum height of the sidenav item (default: var(--dds-spacing-800))\n * @cssproperty --dds-sidenav-item-min-height-sm - Minimum height of the sidenav item (default: var(--dds-spacing-1000))\n * @cssproperty --dds-sidenav-item-min-height-lg - Minimum height of the sidenav item (default: var(--dds-spacing-1200))\n * @cssproperty --dds-sidenav-item-margin-bottom - Default bottom margin of the sidenav item (default: var(--dds-spacing-100))\n * @cssproperty --dds-sidenav-item-padding-xs - Padding of the sidenav item (default: var(--dds-spacing-100) var(--dds-spacing-300))\n * @cssproperty --dds-sidenav-item-padding-sm - Padding of the sidenav item (default: var(--dds-spacing-200) var(--dds-spacing-400))\n * @cssproperty --dds-sidenav-item-padding-lg - Padding of the sidenav item (default: var(--dds-spacing-300) var(--dds-spacing-500))\n * @cssproperty --dds-sidenav-item-radius - Border radius of the sidenav item (default: var(--dds-radius-base))\n * @cssproperty --dds-sidenav-item-color - Text color of the sidenav item (default: var(--dds-text-neutral-base))\n * @cssproperty --dds-sidenav-item-font-size-xs - Font size of the sidenav item (default: var(--dds-font-sm))\n * @cssproperty --dds-sidenav-item-font-size-sm - Font size of the sidenav item (default: var(--dds-font-base))\n * @cssproperty --dds-sidenav-item-font-size-lg - Font size of the sidenav item (default: var(--dds-font-lg))\n * @cssproperty --dds-sidenav-item-font-weight - Font weight of the sidenav item (default: var(--dds-font-weight-medium))\n * @cssproperty --dds-sidenav-item-spacing-margin - Margin used for spacing variants (default: var(--dds-spacing-400))\n * @cssproperty --dds-sidenav-item-bg-active - Background color when the item is active (default: var(--dds-transparent-black-subtle))\n * @cssproperty --dds-sidenav-item-bg-hover - Background color on hover and active states (default: var(--dds-transparent-black-base))\n */\nconst reactWrapper = createComponent({\n  tagName,\n  elementClass: Component,\n  react: React,\n  events: {},\n  displayName: 'DapDSSideNavItem',\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/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    ","\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'\nimport type { DdsOpenedEvent } from '../../events/events'\nimport type { DdsClosedEvent } from '../../events/events'\n      export type { DdsChangeEvent } from '../../events/events'\nexport type { DdsBlurEvent } from '../../events/events'\nexport type { DdsFocusEvent } from '../../events/events'\nexport type { DdsOpenedEvent } from '../../events/events'\nexport type { DdsClosedEvent } 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 * @event {{ void }} dds-opened - Emitted when the select dropdown is opened.\n * @event {{ void }} dds-closed - Emitted when the select dropdown is closed.\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 popup-base - The base of the popup.\n * @csspart option-list - The option list of the select.\n * @csspart option-item - The option item of the select.\n * @csspart option-item-base - The base of the option item.\n * @csspart option-item-label - The label of the option item.\n * @csspart option-item-prefix - The prefix of the option item.\n * @csspart option-item-suffix - The suffix of the option item.\n * @csspart indicator-icon - The indicator icon of the select.\n * @csspart mobile-tray - The mobile tray of the select.\n * @csspart mobile-content - The mobile content of the select.\n * @csspart mobile-body - The mobile body of the select.\n * @csspart mobile-header - The mobile header of the select.\n * @csspart mobile-footer - The mobile footer 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 * @cssproperty --dds-select-icon-opened-transform - Transform of the icon when the select is opened (default: rotate(90deg))\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>,\nonDdsOpened: 'dds-opened' as EventName<DdsOpenedEvent>,\nonDdsClosed: 'dds-closed' as EventName<DdsClosedEvent>\n        },\n        displayName: \"DapDSSelect\"\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 (default: clamp(var(--dds-spacing-6000), 20vw, var(--dds-containers-xsmall)))\n * @cssproperty --dds-snackbar-gap - Gap between snackbar elements (default: var(--dds-spacing-400))\n * @cssproperty --dds-snackbar-padding - Padding inside the snackbar (default: var(--dds-spacing-400))\n * @cssproperty --dds-snackbar-margin-bottom - Bottom margin of the snackbar (default: var(--dds-spacing-400))\n * @cssproperty --dds-snackbar-transition - Transition property for the snackbar (default: transform var(--dds-transition-slow) var(--dds-easing-ease-out)allow-discrete, opacity var(--dds-transition-slow) var(--dds-easing-ease-out) allow-discrete, margin var(--dds-transition-slow) var(--dds-easing-ease-out) allow-discrete, box-shadow var(--dds-transition-slow) var(--dds-easing-ease-out) allow-discrete)\n * @cssproperty --dds-snackbar-border-radius - Border radius of the snackbar (default: var(--dds-radius-base))\n * @cssproperty --dds-snackbar-font-size - Font size used in the snackbar (default: var(--dds-font-sm))\n * @cssproperty --dds-snackbar-background - Background color of the snackbar (default: var(--dds-snackbar-error-background))\n * @cssproperty --dds-snackbar-border - Border color of the snackbar (default: var(--dds-snackbar-error-border))\n * @cssproperty --dds-snackbar-text - Text color of the snackbar (default: var(--dds-snackbar-variant-text))\n * @cssproperty --dds-snackbar-icon - Icon color of the snackbar (default: var(--dds-snackbar-variant-icon))\n * @cssproperty --dds-snackbar-link - Link color of the snackbar (default: var(--dds-snackbar-variant-link))\n * @cssproperty --dds-snackbar-information-background - Background color for information variant (default: var(--dds-background-informative-medium))\n * @cssproperty --dds-snackbar-information-border - Border color for information variant (default: var(--dds-border-width-base) solidvar(--dds-border-informative-subtle))\n * @cssproperty --dds-snackbar-information-icon - Icon color for information variant (default: var(--dds-icon-informative-subtle))\n * @cssproperty --dds-snackbar-success-background - Background color for success variant (default: var(--dds-background-positive-medium))\n * @cssproperty --dds-snackbar-success-border - Border color for success variant (default: var(--dds-border-width-base) solidvar(--dds-border-positive-subtle))\n * @cssproperty --dds-snackbar-success-icon - Icon color for success variant (default: var(--dds-icon-positive-subtle))\n * @cssproperty --dds-snackbar-error-background - Background color for error variant (default: var(--dds-background-negative-medium))\n * @cssproperty --dds-snackbar-error-border - Border color for error variant (default: var(--dds-border-width-base) solidvar(--dds-border-negative-subtle))\n * @cssproperty --dds-snackbar-error-icon - Icon color for error variant (default: var(--dds-icon-negative-subtle))\n * @cssproperty --dds-snackbar-variant-text - Text color for information, success, and error variants (default: var(--dds-text-neutral-base))\n * @cssproperty --dds-snackbar-variant-icon - Icon color for information, success, and error variants (default: var(--dds-text-neutral-base))\n * @cssproperty --dds-snackbar-variant-link - Link color for information, success, and error variants (default: var(--dds-text-neutral-base))\n * @cssproperty --dds-snackbar-animation-duration - Duration of entrance animations (default: 0.3s)\n * @cssproperty --dds-snackbar-animation-timing - Timing function for animations (default: ease-out)\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 * @csspart message - The message part of the snackbar\n * @csspart message-base - The base part of the message\n * @csspart message-text - The text part of the message\n * @csspart message-closebutton - The close button part of the message\n * @csspart message-close-icon - The close icon part of the message\n * @csspart message-actions - The actions part of the message\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/skeleton/skeleton.component.js'\n\nconst tagName = 'dap-ds-skeleton'\n\n/**\n * `dap-ds-skeleton`\n * @summary A skeleton loader component for displaying placeholder content while loading.\n * @element dap-ds-skeleton\n * @title - Skeleton\n *\n * @example Basic Usage\n * ```html\n * <dap-ds-skeleton></dap-ds-skeleton>\n * <dap-ds-skeleton variant=\"circular\"></dap-ds-skeleton>\n * <dap-ds-skeleton variant=\"rectangular\" width=\"200px\" height=\"100px\"></dap-ds-skeleton>\n * <dap-ds-skeleton animation=\"custom\" custom-keyframes=\"0% { transform: scale(1); } 50% { transform: scale(1.1); } 100% { transform: scale(1); }\"></dap-ds-skeleton>\n * ```\n *\n * @csspart base - The main skeleton container.\n *\n * @cssprop --dds-skeleton-color - The base color of the skeleton (default: linear-gradient(90deg, transparent, rgb(0 0 0 / 10%), transparent))\n * @cssprop --dds-skeleton-animation-duration - Duration of the loading animation (default: 1.5s)\n * @cssprop --dds-skeleton-border-radius - Border radius for rectangular skeletons (default: var(--dds-radius-small))\n * @cssprop --dds-skeleton-text-spacing - Spacing between text lines in text variant (default: var(--dds-spacing-100))\n * @cssprop --dds-skeleton-animation-timing-function - Timing function for the loading animation (default: ease-in-out)\n */\nconst reactWrapper = createComponent({\n  tagName,\n  elementClass: Component,\n  react: React,\n  events: {},\n  displayName: 'DapDSSkeleton',\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 icon-content - The content of the loading icon.\n * @csspart text - The loading text element.\n *\n * @slot - The loading text content.\n * @slot icon - The loading icon content.\n *\n * @cssprop --dds-spinner-icon-color-neutral - Color for neutral spinner icons (default: var(--dds-icon-neutral-base))\n * @cssprop --dds-spinner-icon-color-brand - Color for brand spinner icons (default: var(--dds-icon-brand-subtle))\n * @cssprop --dds-spinner-icon-color-negative - Color for negative spinner icons (default: var(--dds-icon-negative-subtle))\n * @cssprop --dds-spinner-icon-color-positive - Color for positive spinner icons (default: var(--dds-icon-positive-subtle))\n * @cssprop --dds-spinner-icon-color-inverted - Color for inverted spinner icons (default: var(--dds-icon-neutral-inverted))\n * @cssprop --dds-spinner-text-spacing - Spacing between spinner and text (default: var(--dds-spacing-400))\n * @cssprop --dds-spinner-animation-duration - Duration of the spinner animation (default: 1s)\n *\n * @property { 'xs' | 'sm' | 'md' | 'lg' | 'xl' | 'xxl' } size - The size of the spinner. Default is `lg`. See SizedMixin.\n * @property {string} sizeMap - Responsive size map (e.g. \"md:lg\"); see SizedMixin.\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' | 'lg'} size - The size of the switch.\n * @property {boolean} disabled - The disabled state of the switch.\n * @property {boolean} readonly - Whether the switch is readonly (cannot be changed but value is submitted with form).\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 (default: var(--dds-spacing-1000)\n * @cssProperty --dds-switch-height - Height of the switch control (default: var(--dds-spacing-600))\n * @cssProperty --dds-switch-thumb-width - Width of the switch thumb (default: var(--dds-spacing-500))\n * @cssProperty --dds-switch-thumb-height - Height of the switch thumb (default: var(--dds-spacing-500))\n * @cssProperty --dds-switch-thumb-margin - Margin around the switch thumb (default: 0.125rem)\n * @cssProperty --dds-switch-thumb-color - Color of the switch thumb (default: var(--dds-button-primary-icon-enabled))\n * @cssProperty --dds-switch-unchecked-bg - Background color of the switch when unchecked (default: var(--dds-background-neutral-base-inverted))\n * @cssProperty --dds-switch-checked-bg - Background color of the switch when checked (default: var(--dds-background-brand-base-inverted))\n * @cssProperty --dds-switch-invalid-bg - Background color of the switch when invalid (default: var(--dds-background-negative-base-inverted))\n * @cssProperty --dds-switch-disabled-bg - Background color of the switch when disabled (default: var(--dds-background-neutral-disabled))\n * @cssProperty --dds-switch-readonly-bg - Background color of the switch when readonly (default: var(--dds-background-neutral-disabled))\n * @cssProperty --dds-switch-wrapper-padding - Padding of the switch wrapper (default: var(--dds-spacing-400))\n * @cssProperty --dds-switch-wrapper-bg - Background color of the switch wrapper (default: var(--dds-background-neutral-subtle))\n * @cssProperty --dds-switch-border-color - Border color of the switch (default: var(--dds-border-neutral-subtle))\n * @cssProperty --dds-switch-high-contrast-border-color - Border color of the switch in high contrast mode (default: var(--dds-border-neutral-transparent-interactive, #fff500))\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    ","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. (default: var(--dds-spacing-200))\n * @cssproperty --dds-table-header-padding-inline-start - Padding for the start (left in LTR) of the header cell. (default: var(--dds-spacing-500))\n * @cssproperty --dds-table-header-padding-inline-end - Padding for the end (right in LTR) of the header cell. (default: var(--dds-spacing-200))\n * @cssproperty --dds-table-header-border-width - Width of the header cell's bottom border. (default: var(--dds-border-width-base))\n * @cssproperty --dds-table-header-border-color - Color of the header cell's bottom border. (default: var(--dds-border-neutral-subtle))\n * @cssproperty --dds-table-header-text-color - Text color of the header cell. (default: var(--dds-text-neutral-strong))\n * @cssproperty --dds-table-header-font-weight - Font weight of the header cell text. (default: var(--dds-font-weight-bold))\n * @cssproperty --dds-table-header-line-height - Line height of the header cell text. (default: var(--dds-font-line-height-xlarge))\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, (default: var(--dds-spacing-500))\n * @cssprop --dds-table-row-padding-top - Padding top for table headers in mobile view, (default: var(--dds-spacing-400))\n * @cssprop --dds-table-row-padding-bottom - Padding bottom for the last table cell in mobile view, (default: var(--dds-spacing-400))\n * @cssprop --dds-table-row-border-color - Border color for table cells and headers, (default: 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 * @csspart feedback-base - The base of the feedback.\n * @csspart feedback-text - The text of the feedback.\n * @csspart feedback-icon - The icon of the feedback.\n *\n * @cssproperty --dds-textarea-min-rows - Minimum number of rows in the textarea. (default: 2)\n * @cssproperty --dds-textarea-spacing - Gap between elements in the textarea container. (default: var(--dds-spacing-200))\n * @cssproperty --dds-textarea-gap - Gap between elements in the textarea container. (default: var(--dds-spacing-200))\n * @cssproperty --dds-textarea-margin-top - Top margin of the textarea. (default: var(--dds-spacing-200))\n * @cssproperty --dds-textarea-padding - Padding of the textarea control. (default: var(--dds-spacing-200) var(--dds-spacing-300))\n * @cssproperty --dds-textarea-border-width - Border width of the textarea. (default: var(--dds-border-width-base))\n * @cssproperty --dds-textarea-border-color - Border color of the textarea. (default: var(--dds-border-neutral-base))\n * @cssproperty --dds-textarea-background - Background color of the textarea. (default: var(--dds-fields-background-default))\n * @cssproperty --dds-textarea-color - Text color of the textarea. (default: var(--dds-text-neutral-base))\n * @cssproperty --dds-textarea-border-radius - Border radius of the textarea. (default: var(--dds-radius-base))\n * @cssproperty --dds-textarea-disabled-bg - Background color when disabled. (default: var(--dds-fields-background-disabled))\n * @cssproperty --dds-textarea-disabled-color - Text color when disabled. (default: var(--dds-text-neutral-disabled))\n * @cssproperty --dds-textarea-readonly-bg - Background color when readonly. (default: var(--dds-fields-background-read-only))\n * @cssproperty --dds-textarea-readonly-color - Text color when readonly. (default: var(--dds-text-neutral-subtle))\n * @cssproperty --dds-textarea-error-border - Border color when in error state. (default: var(--dds-border-negative-base))\n * @cssproperty --dds-textarea-success-border - Border color when in success state. (default: 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    ","\n      import { createComponent } from '@lit/react'\n      import { type EventName } from '@lit/react'\n      import * as React from 'react'\n\n      import Component from '../../components/timepicker/time-grid.component.js'\n      import type { DdsChangeEvent } from '../../events/events'\nimport type { DdsCloseEvent } from '../../events/events'\n      export type { DdsChangeEvent } from '../../events/events'\nexport type { DdsCloseEvent } from '../../events/events'\n\n      const tagName = 'dap-ds-time-grid'\n\n      /**\n * `dap-ds-time-grid`\n * @summary A time grid component that allows users to select hours and minutes in two side-by-side scrollable columns.\n * @element dap-ds-time-grid\n * @title - Time grid\n * @group timepicker\n *\n * @property {number} selectedHour - The currently selected hour (0-23).\n * @property {number} selectedMinute - The currently selected minute (0-59).\n * @property {string} minTime - The minimum selectable time (format: 'HH:mm').\n * @property {string} maxTime - The maximum selectable time (format: 'HH:mm').\n * @property {number} step - The step interval in minutes.\n * @property {string} locale - The locale for time formatting.\n *\n * @event {{ detail: TimeSelection }} dds-change - Fired when time selection changes.\n * @event {{ void }} dds-close - Fired when the time grid should close.\n *\n * @csspart time-grid - The main time grid container.\n * @csspart hour-section - The hour selection section.\n * @csspart minute-section - The minute selection section.\n * @csspart time-button - Individual time selection buttons.\n * @csspart time-button-base - The base part of the time button.\n * @csspart time-button-content - The content part of the time button.\n * @csspart time-button-high-contrast - The high contrast part of the time button.\n * @csspart section-header-title - The title of the section header.\n * @csspart section-header-divider - The divider between the section header and the time buttons.\n * @csspart time-column - The time column container.\n *\n * @cssprop --dds-time-grid-gap - The gap between time sections (default: var(--dds-spacing-400)).\n * @cssprop --dds-time-grid-padding - The padding around the time grid (default: var(--dds-spacing-0)).\n * @cssprop --dds-time-grid-column-gap - The gap between time buttons in columns (default: var(--dds-spacing-200)).\n * @cssprop --dds-time-grid-border-radius - The border radius of the time grid (default: var(--dds-radius-base)).\n * @cssprop --dds-time-grid-background - The background color of the time grid (default: var(--dds-background-neutral-subtle)).\n * @cssprop --dds-time-grid-transition - The transition timing for the time grid (default: all 0.2s ease-in-out).\n * @cssprop --dds-time-grid-max-width - The maximum width of the time grid (default: 400px).\n * @cssprop --dds-time-grid-column-max-height - The maximum height of time columns (default: 240px).\n */\n      const reactWrapper = createComponent({\n        tagName,\n        elementClass: Component,\n        react: React,\n        events: {\n          onDdsChange: 'dds-change' as EventName<DdsChangeEvent>,\nonDdsClose: 'dds-close' as EventName<DdsCloseEvent>\n        },\n        displayName: \"DapDSTimeGrid\"\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/timepicker/timepicker.component.js'\n      import type { DdsChangeEvent } from '../../events/events'\nimport type { DdsInputEvent } from '../../events/events'\nimport type { DdsValidTimeEvent } from '../../events/events'\nimport type { DdsInvalidTimeEvent } from '../../events/events'\nimport type { DdsClearEvent } from '../../events/events'\nimport type { DdsFocusEvent } from '../../events/events'\nimport type { DdsBlurEvent } from '../../events/events'\n      export type { DdsChangeEvent } from '../../events/events'\nexport type { DdsInputEvent } from '../../events/events'\nexport type { DdsValidTimeEvent } from '../../events/events'\nexport type { DdsInvalidTimeEvent } from '../../events/events'\nexport type { DdsClearEvent } from '../../events/events'\nexport type { DdsFocusEvent } from '../../events/events'\nexport type { DdsBlurEvent } from '../../events/events'\n\n      const tagName = 'dap-ds-timepicker'\n\n      /**\n * `dap-ds-timepicker`\n * @summary A timepicker is a graphical user interface widget that allows the user to select a time from a time range.\n * @element dap-ds-timepicker\n * @title - Timepicker\n *\n * @property {Dayjs | string} value - The value of the timepicker. Can be a Dayjs object or a string in 'HH:mm' format.\n * @property {string} label - The label of the timepicker.\n * @property {string} description - The description of the timepicker.\n * @property {'xs' | 'sm' | 'lg'} size - The size of the timepicker.\n * @property {boolean} disabled - The disabled state of the timepicker.\n * @property {boolean} required - The required state of the timepicker.\n * @property {boolean} readonly - The readonly state of the timepicker.\n * @property {boolean} autofocus - The autofocus state of the timepicker.\n * @property {string} tooltip - The tooltip of the timepicker.\n * @property {'top' | 'right' | 'bottom' | 'left'} tooltipPlacement - The tooltip placement of the timepicker.\n * @property {string} feedback - The feedback of the timepicker.\n * @property {'negative' | 'positive' | 'warning'} feedbackType - The feedback type of the timepicker.\n * @property {boolean} optional - The optional state of the timepicker.\n * @property {string} optionalLabel - The optional label of the timepicker.\n * @property {boolean} subtle - The weight of the label. Default is `false`\n * @property {string} autocomplete - The autocomplete of the timepicker.\n * @property {string} placeholder - The placeholder of the timepicker.\n * @property {boolean} loading - The loading state of the timepicker.\n * @property {string} format - The format of the timepicker. Defaults to 'HH:mm'.\n * @property {string} minTime - The minimum time of the timepicker. Format: 'HH:mm'.\n * @property {string} maxTime - The maximum time of the timepicker. Format: 'HH:mm'.\n * @property {number} step - The step interval in minutes. Defaults to 15.\n * @property {boolean} openTimeOnInput - Whether the time picker should open on typing.\n * @property {boolean} sendEmptyEventOnInput - Whether the time picker should send an empty event on typing.\n * @property {string} clearButton - Whether the clear button should be shown. Defaults to 'true'.\n * @property {string} clearButtonAriaLabel - The aria label of the clear button.\n * @property {string} placement - The placement of the dropdown of the timepicker.\n * @property {FloatingStrategy} floatingStrategy - The floating strategy of the timepicker.\n * @property {string} locale - The locale of the timepicker.\n * @property {boolean} closeOnSelection - Whether the dropdown should close when a time is selected.\n * @property {boolean} showSeconds - Whether to show the seconds column in the time picker.\n * @property {number} secondsStep - The step interval in seconds. Defaults to 1.\n * @property {function} disabledTime - Callback to determine if a time should be disabled.\n * @property {boolean} hideDisabledTimes - Whether to hide disabled times or show them as disabled.\n * @property {TimePreset[]} presets - Array of preset time slots for quick selection.\n *\n * @event {{ value: Dayjs | string, hour: number, minute: number, second?: number }} dds-change - Fired when the timepicker value changes.\n * @event {{ value: string }} dds-input - Fired when the timepicker input value changes.\n * @event {{ value: Dayjs | string, hour: number, minute: number, second?: number }} dds-valid-time - Fired when the timepicker input value is valid. Happens on manual input typing.\n * @event {{ value: Dayjs | string, hour: number, minute: number, second?: number, type: 'invalid' | 'out-of-range' }} dds-invalid-time - Fired when the timepicker input value is invalid. Happens on manual input typing.\n * @event {{ void }} dds-clear - Fired when the timepicker is cleared.\n * @event {{ void }} dds-focus - Emitted when the timepicker gains focus.\n * @event {{ void }} dds-blur - Emitted when the timepicker loses focus.\n *\n * @csspart base - The main timepicker container.\n * @csspart trigger - The trigger button of the timepicker.\n * @csspart label - The label of the timepicker.\n * @csspart description - The description of the timepicker.\n * @csspart feedback - The feedback of the timepicker.\n * @csspart tooltip - The tooltip of the timepicker.\n * @csspart input - The input of the timepicker.\n * @csspart clear-button - The clear button of the timepicker.\n *\n * @cssproperty --dds-timepicker-background - The background color of the timepicker. (default: var(--dds-fields-background-default))\n * @cssproperty --dds-timepicker-border-color - The border color of the timepicker. (default: var(--dds-border-neutral-base))\n * @cssproperty --dds-timepicker-border-width - The border width of the timepicker. (default: var(--dds-border-width-base, 1px))\n * @cssproperty --dds-timepicker-border-radius - The border radius of the timepicker. (default: var(--dds-radius-base))\n * @cssproperty --dds-timepicker-text-color - The text color of the timepicker. (default: var(--dds-text-neutral-base))\n * @cssproperty --dds-timepicker-placeholder-color - The placeholder text color. (default: var(--dds-text-neutral-subtle))\n * @cssproperty --dds-timepicker-disabled-background - The background color when disabled. (default: var(--dds-background-neutral-stronger))\n * @cssproperty --dds-timepicker-disabled-text - The text color when disabled. (default: var(--dds-text-neutral-disabled))\n * @cssproperty --dds-timepicker-error-border - The border color for error state. (default: var(--dds-border-negative-base))\n * @cssproperty --dds-timepicker-success-border - The border color for success state. (default: var(--dds-border-positive-base))\n * @cssproperty --dds-timepicker-icon-color - The color of the icons. (default: var(--dds-text-icon-neutral-subtle))\n * @cssproperty --dds-timepicker-clear-icon-color - The color of the clear icon. (default: var(--dds-button-subtle-icon-neutral-enabled))\n * @cssproperty --dds-timepicker-popup-background - The background color of the popup. (default: var(--dds-background-neutral-subtle))\n * @cssproperty --dds-timepicker-popup-shadow - The box shadow of the popup. (default: 0 4px 6px -1px rgb(0 0 0 / 8%), 0 2px 4px -1px rgb(0 0 0 / 6%))\n *\n * @cssproperty --dds-timepicker-padding-xs - The padding for extra small size. (default: var(--dds-spacing-200))\n * @cssproperty --dds-timepicker-padding-sm - The padding for small size. (default: var(--dds-spacing-200))\n * @cssproperty --dds-timepicker-padding-lg - The padding for large size. (default: var(--dds-spacing-300))\n * @cssproperty --dds-timepicker-padding-horizontal - The horizontal padding. (default: var(--dds-spacing-300))\n * @cssproperty --dds-timepicker-padding-vertical - The vertical padding. (default: var(--dds-spacing-200))\n * @cssproperty --dds-timepicker-gap - The gap between elements. (default: var(--dds-spacing-100))\n * @cssproperty --dds-timepicker-icon-gap - The gap between icons. (default: var(--dds-spacing-200))\n * @cssproperty --dds-timepicker-action-gap - The gap between action elements. (default: var(--dds-spacing-200))\n * @cssproperty --dds-timepicker-action-padding - The padding for action elements. (default: var(--dds-spacing-300))\n * @cssproperty --dds-timepicker-clear-icon-width - The width of the clear icon. (default: var(--dds-spacing-800))\n * @cssproperty --dds-timepicker-dropdown-icon-right - The right position of the dropdown icon. (default: var(--dds-spacing-600))\n * @cssproperty --dds-timepicker-min-width - The minimum width of the timepicker. (default: 7.5rem)\n *\n */\n      const reactWrapper = createComponent({\n        tagName,\n        elementClass: Component,\n        react: React,\n        events: {\n          onDdsChange: 'dds-change' as EventName<DdsChangeEvent>,\nonDdsInput: 'dds-input' as EventName<DdsInputEvent>,\nonDdsValidTime: 'dds-valid-time' as EventName<DdsValidTimeEvent>,\nonDdsInvalidTime: 'dds-invalid-time' as EventName<DdsInvalidTimeEvent>,\nonDdsClear: 'dds-clear' as EventName<DdsClearEvent>,\nonDdsFocus: 'dds-focus' as EventName<DdsFocusEvent>,\nonDdsBlur: 'dds-blur' as EventName<DdsBlurEvent>\n        },\n        displayName: \"DapDSTimePicker\"\n      })\n\n      export default reactWrapper\n    ","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/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 (default: var(--dds-radius-base))\n * @cssproperty --dds-tab-border-radius - Border radius for tab items (default: var(--dds-radius-base) var(--dds-radius-base) 0 0)\n * @cssproperty --dds-tab-group-border-width - Border width of the tab navigation (default: var(--dds-border-width-base))\n * @cssproperty --dds-tab-group-border-color - Border color of the tab navigation (default: var(--dds-border-neutral-subtle))\n * @cssproperty --dds-tab-height-sm - Height of small tabs (default: 40px)\n * @cssproperty --dds-tab-height-lg - Height of large tabs (default: 50px)\n * @cssproperty --dds-tab-font-size-sm - Font size of small tabs (default: var(--dds-font-base))\n * @cssproperty --dds-tab-font-size-lg - Font size of large tabs (default: var(--dds-font-lg))\n * @cssproperty --dds-tab-padding - Padding of the tab buttons (default: 0 var(--dds-spacing-400))\n * @cssproperty --dds-tab-border-width - Border width for tabs (default: var(--dds-border-width-large))\n * @cssproperty --dds-tab-selected-border-color - Border color for selected tabs (default: var(--dds-border-brand-base))\n * @cssproperty --dds-tab-text-color - Text color for tabs (default: var(--dds-button-subtle-text-neutral-enabled))\n * @cssproperty --dds-tab-hover-text-color - Text color for tabs on hover (default: var(--dds-text-brand-subtle))\n * @cssproperty --dds-tab-disabled-text-color - Text color for disabled tabs (default: var(--dds-text-neutral-disabled))\n * @cssproperty --dds-tab-hover-background - Background color for tabs on hover (default: var(--dds-transparent-black-subtle))\n * @cssproperty --dds-tab-active-background - Background color for active tabs (default: var(--dds-transparent-black-base))\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","\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 { 'xs' | 'sm' | 'md' | 'lg' } size - The size of the TOC. Default is `lg.\n * @property {string} sizeMap - Responsive size map (e.g. \"md:lg\").\n *\n * @event {{ selectedItem: HTMLAnchorElement, anchorElement: IntersectionObserverEntry | HTMLElement }} dds-anchor-change - Event that is triggered when the anchor changes.\n *\n * @csspart base - The main container of the toc.\n *\n * @cssproperty --dds-toc-border-width - Width of the TOC border. (default: var(--dds-border-width-base))\n * @cssproperty --dds-toc-border-color - Color of the TOC border. (default: var(--dds-border-neutral-divider))\n * @cssproperty --dds-toc-title-color - Color of the TOC title. (default: var(--dds-text-neutral-strong))\n * @cssproperty --dds-toc-title-font-size - Font size of the TOC title. (default: var(--dds-font-base))\n * @cssproperty --dds-toc-title-font-weight - Font weight of the TOC title. (default: var(--dds-font-weight-bold))\n * @cssproperty --dds-toc-title-line-height - Line height of the TOC title. (default: 1.25)\n * @cssproperty --dds-toc-link-color - Color of the TOC links. (default: var(--dds-button-subtle-text-neutral-enabled))\n * @cssproperty --dds-toc-link-active-color - Color of the active TOC link. (default: var(--dds-button-subtle-text-enabled))\n * @cssproperty --dds-toc-link-border-color - Border color of the active TOC link. (default: var(--dds-border-brand-base))\n * @cssproperty --dds-toc-link-line-height - Line height of the TOC links. (default: 1.2)\n * @cssproperty --dds-toc-link-padding - Padding of the TOC links. (default: var(--dds-spacing-200))\n * @cssproperty --dds-toc-indent-level-0 - Indent level of the TOC items. (default: var(--dds-spacing-400))\n * @cssproperty --dds-toc-indent-level-1 - Indent level of the TOC items. (default: var(--dds-spacing-800))\n * @cssproperty --dds-toc-indent-level-2 - Indent level of the TOC items. (default: var(--dds-spacing-1200))\n * @cssproperty --dds-toc-indent-level-3 - Indent level of the TOC items. (default: var(--dds-spacing-1600))\n * @cssproperty --dds-toc-indent-level-4 - Indent level of the TOC items. (default: var(--dds-spacing-2000))\n * @cssproperty --dds-toc-indent-level-5 - Indent level of the TOC items. (default: var(--dds-spacing-2400))\n */\n      const reactWrapper = createComponent({\n        tagName,\n        elementClass: Component,\n        react: React,\n        events: {\n          onDdsAnchorChange: 'dds-anchor-change' as EventName<DdsAnchorChangeEvent>\n        },\n        displayName: \"DapDSTOC\"\n      })\n\n      export default reactWrapper\n    ","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 * @property { 'xs' | 'sm' | 'md' | 'lg' } size - The size of the toggle button. Default is `md`\n * @property {string} sizeMap - Responsive size map (e.g. \"md:lg\")\n *\n * @slot - The content of the toggle button.\n *\n * @csspart base - The main button container.\n * @csspart high-contrast - The high contrast part of the button.\n *\n * @cssproperty --dds-toggle-button-min-width-lg - Minimum width of the large toggle button (default: var(--dds-spacing-2400))\n * @cssproperty --dds-toggle-button-min-width-md - Minimum width of the medium toggle button (default: var(--dds-spacing-2000))\n * @cssproperty --dds-toggle-button-min-width-sm - Minimum width of the small toggle button (default: var(--dds-spacing-1200))\n * @cssproperty --dds-toggle-button-min-width-xs - Minimum width of the extra small toggle button (default: var(--dds-spacing-1200))\n * @cssproperty --dds-toggle-button-height-lg - Height of the large toggle button (default: var(--dds-spacing-1200))\n * @cssproperty --dds-toggle-button-height-md - Height of the medium toggle button (default: var(--dds-spacing-1000))\n * @cssproperty --dds-toggle-button-height-sm - Height of the small toggle button (default: var(--dds-spacing-800))\n * @cssproperty --dds-toggle-button-height-xs - Height of the extra small toggle button (default: var(--dds-spacing-600))\n * @cssproperty --dds-toggle-button-padding-lg - Padding of the large toggle button (default: var(--dds-spacing-300) var(--dds-spacing-400))\n * @cssproperty --dds-toggle-button-padding-md - Padding of the medium toggle button (default: var(--dds-spacing-300))\n * @cssproperty --dds-toggle-button-padding-sm - Padding of the small toggle button (default: var(--dds-spacing-200))\n * @cssproperty --dds-toggle-button-padding-xs - Padding of the extra small toggle button (default: var(--dds-spacing-150) var(--dds-spacing-200))\n * @cssproperty --dds-toggle-button-font-size-lg - Font size of the large toggle button (default: 1.125rem)\n * @cssproperty --dds-toggle-button-font-size-md - Font size of the medium toggle button (default: 1rem)\n * @cssproperty --dds-toggle-button-font-size-sm - Font size of the small toggle button (default: 0.875rem)\n * @cssproperty --dds-toggle-button-font-size-xs - Font size of the extra small toggle button (default: var(--dds-font-xs))\n * @cssproperty --dds-toggle-button-border-enabled - Border color in enabled state (default: var(--dds-button-toggle-border-enabled))\n * @cssproperty --dds-toggle-button-background-enabled - Background color in enabled state (default: var(--dds-button-toggle-background-enabled))\n * @cssproperty --dds-toggle-button-content-enabled - Content/text color in enabled state (default: var(--dds-button-toggle-content-enabled))\n * @cssproperty --dds-toggle-button-border-hover - Border color in hover state (default: var(--dds-button-toggle-border-hover))\n * @cssproperty --dds-toggle-button-background-hover - Background color in hover state (default: var(--dds-button-toggle-background-hover))\n * @cssproperty --dds-toggle-button-border-pressed - Border color in pressed state (default: var(--dds-button-toggle-border-pressed))\n * @cssproperty --dds-toggle-button-background-pressed - Background color in pressed state (default: var(--dds-button-toggle-background-pressed))\n * @cssproperty --dds-toggle-button-background-selected-enabled - Background color in selected enabled state (default: var(--dds-button-toggle-background-selected-enabled))\n * @cssproperty --dds-toggle-button-content-selected-enabled - Content/text color in selected enabled state (default: var(--dds-button-toggle-content-selected-enabled))\n * @cssproperty --dds-toggle-button-background-selected-hover - Background color in selected hover state (default: var(--dds-button-toggle-background-selected-hover))\n * @cssproperty --dds-toggle-button-background-selected-pressed - Background color in selected pressed state (default: var(--dds-button-toggle-background-selected-pressed))\n * @cssproperty --dds-toggle-button-border-disabled - Border color in disabled state (default: var(--dds-button-toggle-border-disabled))\n * @cssproperty --dds-toggle-button-background-disabled - Background color in disabled state (default: var(--dds-button-toggle-background-disabled))\n * @cssproperty --dds-toggle-button-content-disabled - Content/text color in disabled state (default: var(--dds-button-toggle-content-disabled))\n * @cssproperty --dds-toggle-button-highcontrast-border - High contrast border color (default: var(--dds-button-toggle-highcontrast-border))\n * @cssproperty --dds-toggle-button-highcontrast-border-hover - High contrast border color on hover (default: var(--dds-button-toggle-highcontrast-border-hover))\n *\n */\nconst reactWrapper = createComponent({\n  tagName,\n  elementClass: Component,\n  react: React,\n  events: {},\n  displayName: 'DapDSToggleButton',\n})\n\nexport default reactWrapper\n","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 (default: 14rem)\n * @cssproperty --dds-tooltip-padding - The padding inside the tooltip (default: var(--dds-spacing-400))\n * @cssproperty --dds-tooltip-border-color - The border color of the tooltip (default: var(--dds-border-neutral-subtle))\n * @cssproperty --dds-tooltip-bg-color - The background color of the tooltip (default: var(--dds-background-neutral-base))\n * @cssproperty --dds-tooltip-text-color - The text color of the tooltip (default: var(--dds-text-neutral-base))\n * @cssproperty --dds-tooltip-font-size - The font size of the tooltip text (default: var(--dds-font-sm))\n * @cssproperty --dds-tooltip-box-shadow - The box shadow of the tooltip (default: 0 8px 12px -2px rgb(0 0 0 / 8%), 0 2px 6px -2px rgb(0 0 0 / 6%))\n */\nconst reactWrapper = createComponent({\n  tagName,\n  elementClass: Component,\n  react: React,\n  events: {},\n  displayName: 'DapDSTooltip',\n})\n\nexport default reactWrapper\n","\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} noModal - Whether the tray should have a modal overlay. Default is false. If true the tray will use the .show() method, if false the tray will use the .showModal() method.\n * @property {boolean} closeOnEsc - Whether the tray should close on pressing the escape key. Default is true.\n * @property {boolean} closeOnOverlayClick - Whether the tray should close on clicking the overlay. Default is true.\n * @property {string} closeButton - Whether the tray should have a close button. Default is true.\n * @property {string} title - The title of the tray.\n * @property {string} description - The description of the tray.\n * @property {string} okButtonLabel - The label of the OK button.\n * @property {string} cancelButtonLabel - The label of the Cancel button.\n * @property { 'sm' | 'lg' } size - The size of the tray. Default is 'sm'.\n * @property {string} footer - Whether the tray should have a footer. Default is false.\n * @property {string} header - Whether the tray should have a header. Default is false.\n *\n * @event {{ void }} dds-before-open - Fires before the tray opens.\n * @event {{ void }} dds-opened - Fires after the tray opens.\n * @event {{ void }} dds-before-close - Fires before the tray closes.\n * @event {{ void }} dds-closed - Fires after the tray closed.\n * @event {{ void }} dds-close - Fires when the tray is closes. You can prevent the tray from closing by calling `event.preventDefault()`.\n *\n * @slot - The content of the tray.\n * @slot header - The header of the tray.\n * @slot footer - The footer of the tray.\n *\n * @cssproperty --dds-modal-max-block-size - Maximum height of the modal. (default: 80vh)\n * @cssproperty --dds-modal-max-inline-size - Maximum width of the modal. (default: 600px)\n * @cssproperty --dds-modal-padding-sm - Padding inside the modal. (default: var(--dds-spacing-600))\n * @cssproperty --dds-modal-padding-lg - Padding inside the modal. (default: var(--dds-spacing-1200))\n * @cssproperty --dds-modal-transform-amount - Amount to transform for entrance animation. (default: 2rem)\n * @cssproperty --dds-modal-transition-speed - Speed of transition animations. (default: var(--dds-transition-fast))\n * @cssproperty --dds-modal-transition-timing - Timing function for transitions. (default: var(--dds-easing-ease-in-out))\n * @cssproperty --dds-modal-border-width - Border width of the modal. (default: var(--dds-border-width-base))\n * @cssproperty --dds-modal-border-color - Border color of the modal. (default: var(--dds-border-neutral-divider))\n * @cssproperty --dds-modal-border-radius - Border radius of the modal. (default: var(--dds-radius-large, 16px))\n * @cssproperty --dds-modal-background - Background color of the modal. (default: var(--dds-background-neutral-subtle))\n * @cssproperty --dds-modal-header-margin-sm - Margin below the header. (default: var(--dds-spacing-400))\n * @cssproperty --dds-modal-header-margin-lg - Margin below the header. (default: var(--dds-spacing-600))\n * @cssproperty --dds-modal-footer-margin-sm - Margin above the footer. (default: var(--dds-spacing-400))\n * @cssproperty --dds-modal-footer-margin-lg - Margin above the footer. (default: var(--dds-spacing-600))\n * @cssproperty --dds-modal-footer-gap - Gap between footer elements. (default: var(--dds-spacing-400))\n * @cssproperty --dds-modal-close-margin - Margin for the close button. (default: var(--dds-spacing-300))\n * @cssproperty --dds-tray-width-side - Width of the side (left/right) trays. (default: 250px)\n * @cssproperty --dds-tray-min-width-horizontal - Minimum width of the horizontal (top/bottom) trays. (default: 400px)\n * @cssproperty --dds-tray-min-height-horizontal - Minimum height of the horizontal (top/bottom) trays. (default: 300px)\n * @cssproperty --dds-tray-min-height-vertical - Minimum height of the vertical (left/right) trays. (default: 100%)\n * @cssproperty --dds-tray-transform-duration - Duration of the transform animation. (default: 0.3s)\n * @cssproperty --dds-tray-transform-timing - Timing function for the transform animation. (default: ease-in-out)\n *\n * @csspart base - The main tray container.\n * @csspart panel - The panel of the tray.\n * @csspart header - The header of the tray.\n * @csspart footer - The footer of the tray.\n * @csspart content - The content of the tray.\n * @csspart body - The body of the tray.\n *\n */\n      const reactWrapper = createComponent({\n        tagName,\n        elementClass: Component,\n        react: React,\n        events: {\n          onDdsBeforeOpen: 'dds-before-open' as EventName<DdsBeforeOpenEvent>,\nonDdsOpened: 'dds-opened' as EventName<DdsOpenedEvent>,\nonDdsBeforeClose: 'dds-before-close' as EventName<DdsBeforeCloseEvent>,\nonDdsClosed: 'dds-closed' as EventName<DdsClosedEvent>,\nonDdsClose: 'dds-close' as EventName<DdsCloseEvent>\n        },\n        displayName: \"DapDSTray\"\n      })\n\n      export default reactWrapper\n    ","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. (default: var(--dds-text-neutral-base))\n * @cssproperty --dds-text-color-inverted - The color of the typography in inverted mode. (default: var(--dds-text-neutral-on-inverted))\n * @cssproperty --dds-text-heading-color - The color of the heading typography. (default: var(--dds-text-neutral-strong))\n * @cssproperty --dds-text-heading-color-inverted - The color of the heading typography in inverted mode. (default: var(--dds-text-neutral-on-inverted))\n * @cssproperty --dds-text-description-color - The color of the subtle typography. (default: var(--dds-text-neutral-subtle))\n * @cssproperty --dds-text-description-color-inverted - The color of the subtle typography in inverted mode. (default: var(--dds-text-neutral-on-inverted))\n * @cssproperty --dds-text-font-family - The font family of the typography. (default: var(--font-family))\n * @cssproperty --dds-text-font-weight-medium - The font weight of the medium typography. (default: var(--dds-font-weight-medium))\n * @cssproperty --dds-text-font-weight-bold - The font weight of the bold typography. (default: var(--dds-font-weight-bold))\n * @cssproperty --dds-text-font-size-h1 - The font size of the h1 typography. (default: var(--dds-font-7xl))\n * @cssproperty --dds-text-font-size-h2 - The font size of the h2 typography. (default: var(--dds-font-4xl))\n * @cssproperty --dds-text-font-size-h3 - The font size of the h3 typography. (default: var(--dds-font-2xl))\n * @cssproperty --dds-text-font-size-h4 - The font size of the h4 typography. (default: var(--dds-font-xl))\n * @cssproperty --dds-text-font-size-h5 - The font size of the h5 typography. (default: var(--dds-font-lg))\n * @cssproperty --dds-text-font-size-h6 - The font size of the h6 typography. (default: var(--dds-font-base))\n * @cssproperty --dds-text-font-size-body - The font size of the body typography. (default: var(--dds-font-base))\n * @cssproperty --dds-text-font-size-caption - The font size of the caption typography. (default: var(--dds-font-xs))\n * @cssproperty --dds-text-font-size-description - The font size of the description typography. (default: var(--dds-font-base))\n * @cssproperty --dds-text-font-size-description-lg - The font size of the description lg typography. (default: var(--dds-font-base))\n * @cssproperty --dds-text-font-size-description-sm - The font size of the description sm typography. (default: var(--dds-font-sm))\n * @cssproperty --dds-text-font-size-lg - The font size of the lg typography. (default: var(--dds-font-lg))\n * @cssproperty --dds-text-font-size-md - The font size of the md typography. (default: var(--dds-font-base))\n * @cssproperty --dds-text-font-size-sm - The font size of the sm typography. (default: var(--dds-font-sm))\n * @cssproperty --dds-text-font-size-xs - The font size of the xs typography. (default: var(--dds-font-xs))\n */\nconst reactWrapper = createComponent({\n  tagName,\n  elementClass: Component,\n  react: React,\n  events: {},\n  displayName: 'DapDSTypography',\n})\n\nexport default reactWrapper\n","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. (default: var(--dds-font-weight-bold))\n * @cssproperty --dds-form-label-line-height - Line height of the label. (default: var(--dds-font-line-height-xlarge))\n * @cssproperty --dds-form-label-color - Text color of the label. (default: var(--dds-text-neutral-enabled))\n * @cssproperty --dds-form-label-disabled-color - Text color when the label is disabled. (default: var(--dds-text-neutral-disabled))\n * @cssproperty --dds-form-label-required-color - Color of the required indicator. (default: var(--dds-text-negative-subtle))\n * @cssproperty --dds-form-label-optional-color - Color of the optional indicator. (default: var(--dds-text-neutral-subtle))\n * @cssproperty --dds-form-label-margin-bottom - Bottom margin of the label. (default: 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`.\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-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-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-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-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-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-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/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/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/design/design-edit-line/design-edit-line.component.js'\n\nconst tagName = 'dap-ds-icon-edit-line'\n\n/**\n * `dap-ds-icon-edit-line`\n * @summary An icon\n * @element dap-ds-icon-edit-line\n * @title - DesignEditLine\n * @group icon\n * @icontype design\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: 'DesignEditLine',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport * as React from 'react'\n\nimport Component from '../../components/icons/design/design-tools-line/design-tools-line.component.js'\n\nconst tagName = 'dap-ds-icon-tools-line'\n\n/**\n * `dap-ds-icon-tools-line`\n * @summary An icon\n * @element dap-ds-icon-tools-line\n * @title - DesignToolsLine\n * @group icon\n * @icontype design\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: 'DesignToolsLine',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport * as React from 'react'\n\nimport Component from '../../components/icons/device/device-computer-line/device-computer-line.component.js'\n\nconst tagName = 'dap-ds-icon-computer-line'\n\n/**\n * `dap-ds-icon-computer-line`\n * @summary An icon\n * @element dap-ds-icon-computer-line\n * @title - DeviceComputerLine\n * @group icon\n * @icontype device\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: 'DeviceComputerLine',\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/document/document-file-image-line/document-file-image-line.component.js'\n\nconst tagName = 'dap-ds-icon-file-image-line'\n\n/**\n * `dap-ds-icon-file-image-line`\n * @summary An icon\n * @element dap-ds-icon-file-image-line\n * @title - DocumentFileImageLine\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: 'DocumentFileImageLine',\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-music-line/document-file-music-line.component.js'\n\nconst tagName = 'dap-ds-icon-file-music-line'\n\n/**\n * `dap-ds-icon-file-music-line`\n * @summary An icon\n * @element dap-ds-icon-file-music-line\n * @title - DocumentFileMusicLine\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: 'DocumentFileMusicLine',\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-text-line/document-file-text-line.component.js'\n\nconst tagName = 'dap-ds-icon-file-text-line'\n\n/**\n * `dap-ds-icon-file-text-line`\n * @summary An icon\n * @element dap-ds-icon-file-text-line\n * @title - DocumentFileTextLine\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: 'DocumentFileTextLine',\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-video-line/document-file-video-line.component.js'\n\nconst tagName = 'dap-ds-icon-file-video-line'\n\n/**\n * `dap-ds-icon-file-video-line`\n * @summary An icon\n * @element dap-ds-icon-file-video-line\n * @title - DocumentFileVideoLine\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: 'DocumentFileVideoLine',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport * as React from 'react'\n\nimport Component from '../../components/icons/document/document-folder-line/document-folder-line.component.js'\n\nconst tagName = 'dap-ds-icon-folder-line'\n\n/**\n * `dap-ds-icon-folder-line`\n * @summary An icon\n * @element dap-ds-icon-folder-line\n * @title - DocumentFolderLine\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: 'DocumentFolderLine',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport * as React from 'react'\n\nimport Component from '../../components/icons/document/document-folder-open-line/document-folder-open-line.component.js'\n\nconst tagName = 'dap-ds-icon-folder-open-line'\n\n/**\n * `dap-ds-icon-folder-open-line`\n * @summary An icon\n * @element dap-ds-icon-folder-open-line\n * @title - DocumentFolderOpenLine\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: 'DocumentFolderOpenLine',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport * as React from 'react'\n\nimport Component from '../../components/icons/health/health-heart-fill/health-heart-fill.component.js'\n\nconst tagName = 'dap-ds-icon-heart-fill'\n\n/**\n * `dap-ds-icon-heart-fill`\n * @summary An icon\n * @element dap-ds-icon-heart-fill\n * @title - HealthHeartFill\n * @group icon\n * @icontype health\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: 'HealthHeartFill',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport * as React from 'react'\n\nimport Component from '../../components/icons/editor/editor-separator/editor-separator.component.js'\n\nconst tagName = 'dap-ds-icon-separator'\n\n/**\n * `dap-ds-icon-separator`\n * @summary An icon\n * @element dap-ds-icon-separator\n * @title - EditorSeparator\n * @group icon\n * @icontype editor\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: 'EditorSeparator',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport * as React from 'react'\n\nimport Component from '../../components/icons/health/health-heart-line/health-heart-line.component.js'\n\nconst tagName = 'dap-ds-icon-heart-line'\n\n/**\n * `dap-ds-icon-heart-line`\n * @summary An icon\n * @element dap-ds-icon-heart-line\n * @title - HealthHeartLine\n * @group icon\n * @icontype health\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: 'HealthHeartLine',\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/user/user-account-circle-fill/user-account-circle-fill.component.js'\n\nconst tagName = 'dap-ds-icon-account-circle-fill'\n\n/**\n * `dap-ds-icon-account-circle-fill`\n * @summary An icon\n * @element dap-ds-icon-account-circle-fill\n * @title - UserAccountCircleFill\n * @group icon\n * @icontype user\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: 'UserAccountCircleFill',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport * as React from 'react'\n\nimport Component from '../../components/icons/user/user-account-circle-line/user-account-circle-line.component.js'\n\nconst tagName = 'dap-ds-icon-account-circle-line'\n\n/**\n * `dap-ds-icon-account-circle-line`\n * @summary An icon\n * @element dap-ds-icon-account-circle-line\n * @title - UserAccountCircleLine\n * @group icon\n * @icontype user\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: 'UserAccountCircleLine',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport * as React from 'react'\n\nimport Component from '../../components/icons/user/user-user-fill/user-user-fill.component.js'\n\nconst tagName = 'dap-ds-icon-user-fill'\n\n/**\n * `dap-ds-icon-user-fill`\n * @summary An icon\n * @element dap-ds-icon-user-fill\n * @title - UserUserFill\n * @group icon\n * @icontype user\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: 'UserUserFill',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport * as React from 'react'\n\nimport Component from '../../components/icons/user/user-user-line/user-user-line.component.js'\n\nconst tagName = 'dap-ds-icon-user-line'\n\n/**\n * `dap-ds-icon-user-line`\n * @summary An icon\n * @element dap-ds-icon-user-line\n * @title - UserUserLine\n * @group icon\n * @icontype user\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: 'UserUserLine',\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-delete-bin-fill/system-delete-bin-fill.component.js'\n\nconst tagName = 'dap-ds-icon-delete-bin-fill'\n\n/**\n * `dap-ds-icon-delete-bin-fill`\n * @summary An icon\n * @element dap-ds-icon-delete-bin-fill\n * @title - SystemDeleteBinFill\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: 'SystemDeleteBinFill',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport * as React from 'react'\n\nimport Component from '../../components/icons/system/system-delete-bin-line/system-delete-bin-line.component.js'\n\nconst tagName = 'dap-ds-icon-delete-bin-line'\n\n/**\n * `dap-ds-icon-delete-bin-line`\n * @summary An icon\n * @element dap-ds-icon-delete-bin-line\n * @title - SystemDeleteBinLine\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: 'SystemDeleteBinLine',\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-more-2-line/system-more-2-line.component.js'\n\nconst tagName = 'dap-ds-icon-more-2-line'\n\n/**\n * `dap-ds-icon-more-2-line`\n * @summary An icon\n * @element dap-ds-icon-more-2-line\n * @title - SystemMore2Line\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: 'SystemMore2Line',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport * as React from 'react'\n\nimport Component from '../../components/icons/system/system-more-line/system-more-line.component.js'\n\nconst tagName = 'dap-ds-icon-more-line'\n\n/**\n * `dap-ds-icon-more-line`\n * @summary An icon\n * @element dap-ds-icon-more-line\n * @title - SystemMoreLine\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: 'SystemMoreLine',\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-share-line/system-share-line.component.js'\n\nconst tagName = 'dap-ds-icon-share-line'\n\n/**\n * `dap-ds-icon-share-line`\n * @summary An icon\n * @element dap-ds-icon-share-line\n * @title - SystemShareLine\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: 'SystemShareLine',\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","import { createComponent } from '@lit/react'\nimport * as React from 'react'\n\nimport Component from '../../components/icons/system/system-time-fill/system-time-fill.component.js'\n\nconst tagName = 'dap-ds-icon-time-fill'\n\n/**\n * `dap-ds-icon-time-fill`\n * @summary An icon\n * @element dap-ds-icon-time-fill\n * @title - SystemTimeFill\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: 'SystemTimeFill',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport * as React from 'react'\n\nimport Component from '../../components/icons/system/system-time-line/system-time-line.component.js'\n\nconst tagName = 'dap-ds-icon-time-line'\n\n/**\n * `dap-ds-icon-time-line`\n * @summary An icon\n * @element dap-ds-icon-time-line\n * @title - SystemTimeLine\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: 'SystemTimeLine',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport * as React from 'react'\n\nimport Component from '../../components/icons/system/system-upload-2-fill/system-upload-2-fill.component.js'\n\nconst tagName = 'dap-ds-icon-upload-2-fill'\n\n/**\n * `dap-ds-icon-upload-2-fill`\n * @summary An icon\n * @element dap-ds-icon-upload-2-fill\n * @title - SystemUpload2Fill\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: 'SystemUpload2Fill',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport * as React from 'react'\n\nimport Component from '../../components/icons/system/system-upload-2-line/system-upload-2-line.component.js'\n\nconst tagName = 'dap-ds-icon-upload-2-line'\n\n/**\n * `dap-ds-icon-upload-2-line`\n * @summary An icon\n * @element dap-ds-icon-upload-2-line\n * @title - SystemUpload2Line\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: 'SystemUpload2Line',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport * as React from 'react'\n\nimport Component from '../../components/icons/system/system-upload-line/system-upload-line.component.js'\n\nconst tagName = 'dap-ds-icon-upload-line'\n\n/**\n * `dap-ds-icon-upload-line`\n * @summary An icon\n * @element dap-ds-icon-upload-line\n * @title - SystemUploadLine\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: 'SystemUploadLine',\n})\n\nexport default reactWrapper\n"],"names":["tagName","reactWrapper","createComponent","Component","React"],"mappings":"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"}
+{"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-anchor-heading/index.ts","../src/react/dap-ds-avatar/index.ts","../src/react/dap-ds-badge/index.ts","../src/react/dap-ds-avatar-group/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-calendar-cell/index.ts","../src/react/dap-ds-calendar/index.ts","../src/react/dap-ds-button/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-chip/index.ts","../src/react/dap-ds-code-puncher-slot/index.ts","../src/react/dap-ds-code-puncher/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-image-zoom/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-navigation-menu-item/index.ts","../src/react/dap-ds-navigation-menu/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-group/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-progress/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-scroll-progress/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-skeleton/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-time-grid/index.ts","../src/react/dap-ds-timepicker/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-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-home-6-line/index.ts","../src/react/dap-ds-icon-calendar-line/index.ts","../src/react/dap-ds-icon-edit-line/index.ts","../src/react/dap-ds-icon-tools-line/index.ts","../src/react/dap-ds-icon-computer-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-file-image-line/index.ts","../src/react/dap-ds-icon-file-music-line/index.ts","../src/react/dap-ds-icon-file-text-line/index.ts","../src/react/dap-ds-icon-file-video-line/index.ts","../src/react/dap-ds-icon-folder-line/index.ts","../src/react/dap-ds-icon-folder-open-line/index.ts","../src/react/dap-ds-icon-separator/index.ts","../src/react/dap-ds-icon-heart-fill/index.ts","../src/react/dap-ds-icon-heart-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-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-delete-bin-fill/index.ts","../src/react/dap-ds-icon-delete-bin-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-more-2-line/index.ts","../src/react/dap-ds-icon-more-line/index.ts","../src/react/dap-ds-icon-search-line/index.ts","../src/react/dap-ds-icon-share-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","../src/react/dap-ds-icon-time-fill/index.ts","../src/react/dap-ds-icon-time-line/index.ts","../src/react/dap-ds-icon-upload-2-fill/index.ts","../src/react/dap-ds-icon-upload-2-line/index.ts","../src/react/dap-ds-icon-upload-line/index.ts","../src/react/dap-ds-icon-zoom-in-line/index.ts","../src/react/dap-ds-icon-zoom-out-line/index.ts","../src/react/dap-ds-icon-account-circle-fill/index.ts","../src/react/dap-ds-icon-account-circle-line/index.ts","../src/react/dap-ds-icon-user-fill/index.ts","../src/react/dap-ds-icon-user-line/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 { 'xxs' | 'xs' | 'sm' | 'md' | 'lg' } size - The size of the accordion. Default is `sm`. Visual variants are sm and lg (other sizes map to sm).\n * @property {string} sizeMap - Responsive size map (e.g. \"md:lg\")\n * @property {string} parentSized - When \"true\", size is taken from the parent card if present.\n * @property {string} heading - The heading text of the accordion, this will be used as the aria label of the heading also if ariaLabel is not provided\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 * @property {boolean} disabled - Whether the accordion is disabled.\n * @property {boolean} loading - Whether the accordion is in loading state.\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/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: var(--dds-color-primary))\n * @cssproperty --dds-anchor-link-opacity - The opacity of the anchor link when not hovered (default: 0)\n * @cssproperty --dds-anchor-link-hover-opacity - The opacity of the anchor link when hovered (default: 1)\n * @cssproperty --dds-anchor-link-transition - The transition property for the anchor link opacity (default: 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/avatar/avatar.component.js'\n      import type { DdsLoadEvent } from '../../events/events'\nimport type { DdsErrorEvent } from '../../events/events'\n      export type { DdsLoadEvent } from '../../events/events'\nexport type { DdsErrorEvent } from '../../events/events'\n\n      const tagName = 'dap-ds-avatar'\n\n      /**\n * `dap-ds-avatar`\n * @summary Avatar component can be used to display user profile images, initials, or icons.\n * @element dap-ds-avatar\n * @title - Avatar\n *\n * @slot icon - The icon to display when variant is 'icon'.\n * @slot fallback - Custom fallback content when image fails to load.\n *\n * @event dds-load - Fired when the image loads successfully.\n * @event dds-error - Fired when the image fails to load.\n *\n * @csspart base - The main avatar container.\n * @csspart img - The avatar image.\n * @csspart initials - The initials container.\n * @csspart icon - The icon container.\n * @csspart fallback - The fallback content container.\n * @csspart loading - The loading indicator.\n *\n * @cssproperty --dds-avatar-border-radius - The border radius of the avatar (default: 50%)\n * @cssproperty --dds-avatar-background-color - The background color of the avatar (default: var(--dds-neutral-200))\n * @cssproperty --dds-avatar-border-width - The border width of the avatar (default: 0)\n * @cssproperty --dds-avatar-border-color - The color of the avatar's border (default: transparent)\n * @cssproperty --dds-avatar-border-style - The style of the avatar's border (default: solid)\n * @cssproperty --dds-avatar-transition - The transition property for the avatar (default: all 0.2s ease-in-out)\n * @cssproperty --dds-avatar-text-color - The text color for initials (default: var(--dds-text-neutral-strong))\n * @cssproperty --dds-avatar-font-weight - The font weight for initials (default: var(--dds-font-weight-bold))\n * @cssproperty --dds-avatar-lg-size - Size for large avatars (default: var(--dds-avatar-size-lg))\n * @cssproperty --dds-avatar-md-size - Size for medium avatars (default: var(--dds-avatar-size-md))\n * @cssproperty --dds-avatar-sm-size - Size for small avatars (default: var(--dds-avatar-size-sm))\n * @cssproperty --dds-avatar-xs-size - Size for extra small avatars (default: var(--dds-avatar-size-xs))\n * @cssproperty --dds-avatar-xxs-size - Size for extra extra small avatars (default: var(--dds-avatar-size-xxs))\n * @cssproperty --dds-avatar-font-size-lg - Font size for large avatars (default: var(--dds-font-2xl))\n * @cssproperty --dds-avatar-font-size-md - Font size for medium avatars (default: var(--dds-font-lg))\n * @cssproperty --dds-avatar-font-size-sm - Font size for small avatars (default: var(--dds-font-base))\n * @cssproperty --dds-avatar-font-size-xs - Font size for extra small avatars (default: var(--dds-font-sm))\n * @cssproperty --dds-avatar-font-size-xxs - Font size for extra extra small avatars (default: var(--dds-font-xs))\n * @cssproperty --dds-avatar-hover-transform - Transform applied on hover for interactive avatars (default: scale(1.05))\n * @cssproperty --dds-avatar-active-transform - Transform applied when active for interactive avatars (default: scale(0.95))\n * @cssproperty --dds-avatar-focus-ring - Focus ring style for interactive avatars (default: 0 0 0 2px var(--dds-focus-outer-ring))\n * @cssproperty --dds-avatar-loading-background - Background color when loading (default: var(--dds-neutral-100))\n * @cssproperty --dds-avatar-error-background - Background color when image fails to load (default: var(--dds-negative-100))\n * @cssproperty --dds-avatar-error-color - Text color when image fails to load (default: var(--dds-negative-600))\n *\n * @property { 'xxs' | 'xs' | 'sm' | 'md' | 'lg' } size - The size of the avatar. Default is `md`.\n * @property {string} sizeMap - Responsive size map (e.g. \"md:lg\").\n */\n      const reactWrapper = createComponent({\n        tagName,\n        elementClass: Component,\n        react: React,\n        events: {\n          onDdsLoad: 'dds-load' as EventName<DdsLoadEvent>,\nonDdsError: 'dds-error' as EventName<DdsErrorEvent>\n        },\n        displayName: \"DapDSAvatar\"\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 * @property { 'sm' | 'lg' } size - The size of the badge. Default is `sm`.\n * @property {string} sizeMap - Responsive size map (e.g. \"md:lg\").\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: var(--dds-border-width-base))\n * @cssproperty --dds-badge-border-style - The style of the badge's border (default: solid)\n * @cssproperty --dds-badge-border-radius - The border radius of the badge (default: var(--dds-radius-base))\n * @cssproperty --dds-badge-font-weight - The font weight of the badge text (default: var(--dds-font-weight-bold))\n * @cssproperty --dds-badge-line-height - The line height of the badge text (default: 1.2)\n * @cssproperty --dds-badge-transition - The transition property for the badge (default: all 0.2s ease-in-out)\n *\n * @cssproperty --dds-badge-padding-sm - The padding of the small badge (default: var(--dds-spacing-100) var(--dds-spacing-200))\n * @cssproperty --dds-badge-padding-lg - The padding of the large badge (default: var(--dds-spacing-100) var(--dds-spacing-300))\n * @cssproperty --dds-badge-font-size-sm - The font size of the small badge (default: var(--dds-font-xs))\n * @cssproperty --dds-badge-font-size-lg - The font size of the large badge (default: var(--dds-font-sm))\n *\n * @cssproperty --dds-badge-neutral-border-color - The border color of the neutral badge (default: var(--dds-border-neutral-base))\n * @cssproperty --dds-badge-neutral-background - The background color of the neutral badge (default: var(--dds-background-neutral-medium))\n * @cssproperty --dds-badge-neutral-color - The text color of the neutral badge (default: var(--dds-text-neutral-subtle))\n *\n * @cssproperty --dds-badge-brand-border-color - The border color of the brand badge (default: var(--dds-border-brand-base))\n * @cssproperty --dds-badge-brand-background - The background color of the brand badge (default: var(--dds-background-brand-medium))\n * @cssproperty --dds-badge-brand-color - The text color of the brand badge (default: var(--dds-text-brand-subtle))\n *\n * @cssproperty --dds-badge-info-border-color - The border color of the info badge (default: var(--dds-border-informative-base))\n * @cssproperty --dds-badge-info-background - The background color of the info badge (default: var(--dds-background-informative-medium))\n * @cssproperty --dds-badge-info-color - The text color of the info badge (default: var(--dds-text-informative-subtle))\n *\n * @cssproperty --dds-badge-positive-border-color - The border color of the positive badge (default: var(--dds-border-positive-base))\n * @cssproperty --dds-badge-positive-background - The background color of the positive badge (default: var(--dds-background-positive-medium))\n * @cssproperty --dds-badge-positive-color - The text color of the positive badge (default: var(--dds-text-positive-subtle))\n *\n * @cssproperty --dds-badge-warning-border-color - The border color of the warning badge (default: var(--dds-border-warning-subtle))\n * @cssproperty --dds-badge-warning-background - The background color of the warning badge (default: var(--dds-background-warning-medium))\n * @cssproperty --dds-badge-warning-color - The text color of the warning badge (default: var(--dds-text-warning-subtle))\n *\n * @cssproperty --dds-badge-negative-border-color - The border color of the negative badge (default: var(--dds-border-negative-base))\n * @cssproperty --dds-badge-negative-background - The background color of the negative badge (default: var(--dds-background-negative-medium))\n * @cssproperty --dds-badge-negative-color - The text color of the negative badge (default: var(--dds-text-negative-subtle))\n *\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/avatar-group/avatar-group.component.js'\n      import type { DdsOverflowClickEvent } from '../../events/events'\n      export type { DdsOverflowClickEvent } from '../../events/events'\n\n      const tagName = 'dap-ds-avatar-group'\n\n      /**\n * `dap-ds-avatar-group`\n * @summary Avatar group component displays multiple avatars in an organized layout with overflow management.\n * @element dap-ds-avatar-group\n * @title - Avatar Group\n * @group avatar\n *\n * @slot - The avatars to display in the group.\n *\n * @event dds-overflow-click - Fired when the overflow indicator is clicked.\n *\n * @csspart base - The main container of the avatar group.\n * @csspart avatars - The container for the visible avatars.\n * @csspart overflow - The overflow indicator element.\n *\n * @cssproperty --dds-avatar-group-gap - Gap between avatars in grid layout (default: 0)\n * @cssproperty --dds-avatar-group-overlap - Overlap amount for stacked layout (default: -8px)\n * @cssproperty --dds-avatar-group-border-width - Border width for avatars (default: var(--dds-border-width-base))\n * @cssproperty --dds-avatar-group-border-color - Border color for avatars (default: var(--dds-border-neutral-divider))\n * @cssproperty --dds-avatar-group-overflow-bg - Background color for overflow indicator (default: var(--dds-neutral-300))\n * @cssproperty --dds-avatar-group-overflow-color - Text color for overflow indicator (default: var(--dds-neutral-700))\n * @cssproperty --dds-avatar-group-overflow-border - Border for overflow indicator (default: var(--dds-avatar-group-border-width) solid var(--dds-avatar-group-border-color))\n * @cssproperty --dds-avatar-group-size-lg - Size for large avatars (default: var(--dds-spacing-2000))\n * @cssproperty --dds-avatar-group-size-md - Size for medium avatars (default: var(--dds-spacing-1600))\n * @cssproperty --dds-avatar-group-size-sm - Size for small avatars (default: var(--dds-spacing-1200))\n * @cssproperty --dds-avatar-group-size-xs - Size for extra small avatars (default: var(--dds-spacing-800))\n * @cssproperty --dds-avatar-group-size-xxs - Size for extra extra small avatars (default: var(--dds-spacing-400))\n *\n * @property { 'xxs' | 'xs' | 'sm' | 'md' | 'lg' } size - The size of avatars in the group. Default is `md`. See SizedMixin.\n * @property {string} sizeMap - Responsive size map (e.g. \"md:lg\"); see SizedMixin.\n */\n      const reactWrapper = createComponent({\n        tagName,\n        elementClass: Component,\n        react: React,\n        events: {\n          onDdsOverflowClick: 'dds-overflow-click' as EventName<DdsOverflowClickEvent>\n        },\n        displayName: \"DapDSAvatarGroup\"\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/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: var(--dds-spacing-200))\n * @cssproperty --dds-banner-line-height - The line height of the banner text (default: var(--dds-font-line-height-xlarge))\n * @cssproperty --dds-banner-transition - The transition property for the banner (default: all 0.2s ease-in-out)\n *\n * @cssproperty --dds-banner-brand-background - The background color of the brand banner (default: var(--dds-banner-background-brand))\n * @cssproperty --dds-banner-brand-icon-color - The color of the brand banner icon (default: var(--dds-banner-icon-brand))\n * @cssproperty --dds-banner-brand-text-color - The text color of the brand banner (default: var(--dds-banner-text-brand))\n * @cssproperty --dds-banner-brand-action-color - The color of the brand banner actions (default: var(--dds-banner-action-enabled))\n *\n * @cssproperty --dds-banner-info-background - The background color of the info banner (default: var(--dds-banner-background-informative))\n * @cssproperty --dds-banner-info-icon-color - The color of the info banner icon (default: var(--dds-banner-icon-informative))\n * @cssproperty --dds-banner-info-text-color - The text color of the info banner (default: var(--dds-banner-text-informative))\n * @cssproperty --dds-banner-info-action-color - The color of the info banner actions (default: var(--dds-banner-action-enabled))\n *\n * @cssproperty --dds-banner-positive-background - The background color of the positive banner (default: var(--dds-banner-background-positive))\n * @cssproperty --dds-banner-positive-icon-color - The color of the positive banner icon (default: var(--dds-banner-icon-positive))\n * @cssproperty --dds-banner-positive-text-color - The text color of the positive banner (default: var(--dds-banner-text-positive))\n * @cssproperty --dds-banner-positive-action-color - The color of the positive banner actions (default: var(--dds-banner-action-enabled))\n *\n * @cssproperty --dds-banner-warning-background - The background color of the warning banner (default: var(--dds-banner-background-warning))\n * @cssproperty --dds-banner-warning-icon-color - The color of the warning banner icon (default: var(--dds-banner-icon-warning))\n * @cssproperty --dds-banner-warning-text-color - The text color of the warning banner (default: var(--dds-banner-text-warning))\n * @cssproperty --dds-banner-warning-action-color - The color of the warning banner actions (default: var(--dds-banner-action-inverted-enabled))\n *\n * @cssproperty --dds-banner-negative-background - The background color of the negative banner (default: var(--dds-banner-background-negative))\n * @cssproperty --dds-banner-negative-icon-color - The color of the negative banner icon (default: var(--dds-banner-icon-negative))\n * @cssproperty --dds-banner-negative-text-color - The text color of the negative banner (default: var(--dds-banner-text-negative))\n * @cssproperty --dds-banner-negative-action-color - The color of the negative banner actions (default: var(--dds-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: 100%)\n * @cssproperty --dds-breadcrumb-overflow-x - The horizontal overflow behavior of the breadcrumb (default: auto)\n * @cssproperty --dds-breadcrumb-transition - The transition property for the breadcrumb (default: all 0.2s ease-in-out)\n * @cssproperty --dds-breadcrumb-list-display - The display property of the breadcrumb list (default: flex)\n * @cssproperty --dds-breadcrumb-list-flex-wrap - The flex-wrap property of the breadcrumb list (default: nowrap)\n * @cssproperty --dds-breadcrumb-list-align-items - The align-items property of the breadcrumb list (default: center)\n * @cssproperty --dds-breadcrumb-list-min-width - The minimum width of the breadcrumb list (default: 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: inline-flex)\n * @cssproperty --dds-breadcrumb-item-flex-wrap - The flex-wrap property of the breadcrumb item (default: nowrap)\n * @cssproperty --dds-breadcrumb-item-align-items - The align-items property of the breadcrumb item (default: center)\n * @cssproperty --dds-breadcrumb-item-color - The text color of the breadcrumb item (default: var(--dds-text-neutral-base))\n * @cssproperty --dds-breadcrumb-item-transition - The transition property for the breadcrumb item (default: all 0.2s ease-in-out)\n * @cssproperty --dds-breadcrumb-item-gap - The gap between the breadcrumb item and the separator (default: var(--dds-spacing-200))\n * @cssproperty --dds-breadcrumb-item-padding - The padding of the breadcrumb item (default: var(--dds-spacing-200))\n * @cssproperty --dds-breadcrumb-item-font-size - The font size of the breadcrumb item (default: var(--dds-font-sm))\n * @cssproperty --dds-breadcrumb-item-font-weight - The font weight of the breadcrumb item (default: var(--dds-font-weight-medium))\n * @cssproperty --dds-breadcrumb-item-font-weight-bold - The bold font weight of the breadcrumb item (default: var(--dds-font-weight-bold))\n * @cssproperty --dds-breadcrumb-item-separator-color - The color of the separator (default: var(--dds-text-neutral-disabled))\n * @cssproperty --dds-breadcrumb-item-link-color - The color of the link (default: var(--dds-link-neutral-enabled))\n * @cssproperty --dds-breadcrumb-item-inverted-color - The text color when inverted (default: var(--dds-text-neutral-inverted))\n * @cssproperty --dds-breadcrumb-item-inverted-link-color - The link color when inverted (default: var(--dds-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/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 * @cssproperty --dds-calendar-cell-display - The display property of the calendar cell host (default: flex)\n * @cssproperty --dds-calendar-cell-position - The position property of the calendar cell host (default: relative)\n * @cssproperty --dds-calendar-cell-border-radius - The border radius of the calendar cell (default: var(--dds-radius-rounded))\n * @cssproperty --dds-calendar-cell-min-width - The minimum width of the calendar cell (default: var(--dds-spacing-1000))\n * @cssproperty --dds-calendar-cell-height - The height of the calendar cell (default: var(--dds-spacing-1000))\n * @cssproperty --dds-calendar-cell-min-height - The minimum height of the calendar cell (default: var(--dds-spacing-1000))\n * @cssproperty --dds-calendar-cell-color - The text color of the calendar cell (default: var(--dds-button-subtle-text-neutral-enabled))\n * @cssproperty --dds-calendar-cell-font-size - The font size of the calendar cell (default: var(--dds-font-sm))\n * @cssproperty --dds-calendar-cell-font-weight - The font weight of the calendar cell (default: var(--dds-font-weight-medium))\n * @cssproperty --dds-calendar-cell-text-align - The text alignment of the calendar cell (default: center)\n * @cssproperty --dds-calendar-cell-cursor - The cursor style of the calendar cell (default: pointer)\n * @cssproperty --dds-calendar-cell-background-hover - The background color of the calendar cell on hover (default: var(--dds-background-neutral-medium))\n * @cssproperty --dds-calendar-cell-background-active - The background color of the calendar cell when active (default: var(--dds-background-neutral-strong))\n *\n * @cssproperty --dds-calendar-cell-selected-background - The background color of the selected calendar cell (default: var(--dds-button-primary-background-enabled))\n * @cssproperty --dds-calendar-cell-selected-color - The text color of the selected calendar cell (default: var(--dds-button-primary-text-enabled))\n * @cssproperty --dds-calendar-cell-selected-background-hover - The background color of the selected calendar cell on hover (default: var(--dds-button-primary-background-hover))\n * @cssproperty --dds-calendar-cell-selected-background-pressed - The background color of the selected calendar cell when pressed (default: var(--dds-button-primary-background-pressed))\n * @cssproperty --dds-calendar-cell-selected-today-mark-background - The background color of the today mark in selected calendar cell (default: var(--dds-text-neutral-on-inverted))\n *\n * @cssproperty --dds-calendar-cell-disabled-color - The text color of the disabled calendar cell (default: var(--dds-text-neutral-disabled))\n * @cssproperty --dds-calendar-cell-disabled-cursor - The cursor style of the disabled calendar cell (default: not-allowed)\n *\n * @cssproperty --dds-calendar-cell-out-of-range-color - The text color of the out-of-range calendar cell (default: var(--dds-text-neutral-placeholder))\n *\n * @cssproperty --dds-calendar-cell-today-font-weight - The font weight of the today calendar cell (default: var(--dds-font-weight-bold))\n *\n * @cssproperty --dds-calendar-cell-header-background - The background color of the header calendar cell (default: transparent)\n * @cssproperty --dds-calendar-cell-header-color - The text color of the header calendar cell (default: var(--dds-text-neutral-base))\n * @cssproperty --dds-calendar-cell-header-text-transform - The text transform of the header calendar cell (default: capitalize)\n * @cssproperty --dds-calendar-cell-header-cursor - The cursor style of the header calendar cell (default: default)\n *\n * @cssproperty --dds-calendar-cell-in-range-color - The text color of the in-range calendar cell (default: var(--dds-button-primary-text-enabled))\n * @cssproperty --dds-calendar-cell-in-range-background-hover - The background color of the in-range calendar cell on hover (default: var(--dds-button-primary-background-hover))\n * @cssproperty --dds-calendar-cell-in-range-background-pressed - The background color of the in-range calendar cell when pressed (default: var(--dds-button-primary-background-pressed))\n *\n * @cssproperty --dds-calendar-cell-range-background - The background color of the range start/end calendar cell (default: var(--dds-button-primary-background-enabled))\n * @cssproperty --dds-calendar-cell-range-color - The text color of the range start/end calendar cell (default: var(--dds-button-primary-text-enabled))\n * @cssproperty --dds-calendar-cell-range-today-mark-background - The background color of the today mark in range start/end calendar cell (default: var(--dds-text-neutral-on-inverted))\n *\n * @cssproperty --dds-calendar-cell-today-mark-bottom - The bottom position of the today mark (default: var(--dds-spacing-100))\n * @cssproperty --dds-calendar-cell-today-mark-width - The width of the today mark (default: 5px)\n * @cssproperty --dds-calendar-cell-today-mark-height - The height of the today mark (default: 5px)\n * @cssproperty --dds-calendar-cell-today-mark-stroke - The stroke color of the today mark (default: var(--dds-border-neutral-transparent))\n * @cssproperty --dds-calendar-cell-today-mark-background - The background color of the today mark (default: var(--dds-background-neutral-medium-inverted))\n * @cssproperty --dds-calendar-cell-today-mark-fill - The fill color of the today mark (default: var(--dds-background-neutral-medium-inverted))\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 calendar-header - The header of the calendar.\n * @csspart body - The body of the calendar.\n * @csspart calendar-grid-header - The header of the calendar grid.\n * @csspart calendar-grid-header-cell - The header cell of the calendar grid.\n * @csspart calendar-grid-cell - The cell of the calendar grid.\n * @csspart calendar-header-button-prev - The previous month button of the calendar header.\n * @csspart calendar-header-button-next - The next month button of the calendar header.\n * @csspart calendar-header-year-select - The year select of the calendar header.\n * @csspart calendar-header-month-select - The month select of the calendar header.\n *\n * @cssproperty --dds-calendar-display - The display property of the calendar container (default: flex)\n * @cssproperty --dds-calendar-isolation - The isolation property of the calendar (default: isolate)\n * @cssproperty --dds-calendar-block-display - The display property of the calendar block (default: block)\n * @cssproperty --dds-calendar-transition - The transition property for the calendar (default: all 0.2s ease-in-out)\n * @cssproperty --dds-calendar-header-display - The display property of the calendar header (default: grid)\n * @cssproperty --dds-calendar-header-grid-flow - The grid-auto-flow property of the calendar header (default: column)\n * @cssproperty --dds-calendar-header-width - The width of the calendar header (default: 100%)\n * @cssproperty --dds-calendar-header-gap - The gap between header items (default: var(--dds-spacing-100))\n * @cssproperty --dds-calendar-select-min-height - The minimum height of the select trigger (default: auto)\n * @cssproperty --dds-calendar-select-max-height - The maximum height of the select trigger (default: 32px)\n * @cssproperty --dds-calendar-select-padding - The padding of the select trigger (default: var(--dds-spacing-200))\n * @cssproperty --dds-calendar-select-border-radius - The border radius of the select trigger (default: var(--dds-radius-rounded))\n * @cssproperty --dds-calendar-select-border-color - The border color of the select trigger (default: var(--dds-border-neutral-transparent-interactive))\n * @cssproperty --dds-calendar-select-background - The background color of the select trigger (default: var(--dds-button-subtle-background-enabled))\n * @cssproperty --dds-calendar-select-color - The text color of the select trigger (default: var(--dds-button-subtle-text-enabled))\n * @cssproperty --dds-calendar-select-font-size - The font size of the select trigger (default: var(--dds-font-sm))\n * @cssproperty --dds-calendar-select-font-style - The font style of the select trigger (default: normal)\n * @cssproperty --dds-calendar-select-font-weight - The font weight of the select trigger (default: var(--dds-font-weight-bold))\n * @cssproperty --dds-calendar-nav-button-margin - The margin of the navigation buttons (default: var(--dds-spacing-200))\n * @cssproperty --dds-calendar-nav-button-color - The color of the navigation button icons (default: var(--dds-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/button/button.component.js'\n      import type { DdsLoadingTimeoutEvent } from '../../events/events'\n      export type { DdsLoadingTimeoutEvent } from '../../events/events'\n\n      const tagName = 'dap-ds-button'\n\n      /**\n * `dap-ds-button` is a versatile button component for triggering actions and navigation.\n * @element dap-ds-button\n * @summary A button is a clickable element that can be used to trigger an action, submit forms, or navigate to other pages.\n * @title - Button\n *\n * @example Basic Usage\n * ```html\n * <dap-ds-button>Click me</dap-ds-button>\n * <dap-ds-button variant=\"outline\">Secondary action</dap-ds-button>\n * <dap-ds-button href=\"/dashboard\">Navigate</dap-ds-button>\n * ```\n *\n * @example Form Integration\n * ```html\n * <form>\n *   <dap-ds-button htmlType=\"submit\">Submit Form</dap-ds-button>\n *   <dap-ds-button htmlType=\"reset\" variant=\"outline\">Reset</dap-ds-button>\n * </form>\n * ```\n *\n * @example Accessibility\n * ```html\n * <!-- Icon-only buttons require aria-label -->\n * <dap-ds-button aria-label=\"Close dialog\" shape=\"circle\">\n *   <dap-ds-icon name=\"close-line\"></dap-ds-icon>\n * </dap-ds-button>\n * ```\n *\n * @property {string} sizeMap - The size map of the button.\n * @example\n * ```html\n * <dap-ds-button sizeMap=\"sm:lg,xs:xs\">Small</dap-ds-button>\n * ```\n *\n * @event dds-loading-timeout - Emitted when the loading timeout is reached\n *\n * @slot - The content of the button. Can contain text, icons, or other elements.\n *\n * @csspart base - The main button container.\n * @csspart high-contrast - The high contrast part of the button.\n * @csspart content - The content wrapper inside 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 */\n      const reactWrapper = createComponent({\n        tagName,\n        elementClass: Component,\n        react: React,\n        events: {\n          onDdsLoadingTimeout: 'dds-loading-timeout' as EventName<DdsLoadingTimeoutEvent>\n        },\n        displayName: \"DapDSButton\"\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 content - The content of the callout.\n * @csspart card-content - The content of the card.\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 * @cssproperty --dds-callout-border-radius - Border radius of the callout. (default: var(--dds-radius-base))\n *\n * @cssproperty --dds-callout-brand-background - Brand variant background color. (default: var(--dds-background-brand-base))\n * @cssproperty --dds-callout-brand-background-subtle - Brand variant subtle background color. (default: var(--dds-background-brand-subtle))\n * @cssproperty --dds-callout-brand-background-medium - Brand variant medium background color. (default: var(--dds-background-brand-medium))\n * @cssproperty --dds-callout-brand-background-strong - Brand variant strong background color. (default: var(--dds-background-brand-strong))\n * @cssproperty --dds-callout-brand-icon - Brand variant icon color. (default: var(--dds-icon-brand-subtle))\n * @cssproperty --dds-callout-brand-border - Brand variant border color. (default: var(--dds-border-brand-subtle))\n *\n * @cssproperty --dds-callout-info-background - Info variant background color. (default: var(--dds-background-informative-base))\n * @cssproperty --dds-callout-info-background-subtle - Info variant subtle background color. (default: var(--dds-background-informative-subtle))\n * @cssproperty --dds-callout-info-background-medium - Info variant medium background color. (default: var(--dds-background-informative-medium))\n * @cssproperty --dds-callout-info-background-strong - Info variant strong background color. (default: var(--dds-background-informative-strong))\n * @cssproperty --dds-callout-info-icon - Info variant icon color. (default: var(--dds-icon-informative-subtle))\n * @cssproperty --dds-callout-info-border - Info variant border color. (default: var(--dds-border-informative-subtle))\n *\n * @cssproperty --dds-callout-positive-background - Positive variant background color. (default: var(--dds-background-positive-base))\n * @cssproperty --dds-callout-positive-background-subtle - Positive variant subtle background color. (default: var(--dds-background-positive-subtle))\n * @cssproperty --dds-callout-positive-background-medium - Positive variant medium background color. (default: var(--dds-background-positive-medium))\n * @cssproperty --dds-callout-positive-background-strong - Positive variant strong background color. (default: var(--dds-background-positive-strong))\n * @cssproperty --dds-callout-positive-icon - Positive variant icon color. (default: var(--dds-icon-positive-subtle))\n * @cssproperty --dds-callout-positive-border - Positive variant border color. (default: var(--dds-border-positive-subtle))\n *\n * @cssproperty --dds-callout-warning-background - Warning variant background color. (default: var(--dds-background-warning-base))\n * @cssproperty --dds-callout-warning-background-subtle - Warning variant subtle background color. (default: var(--dds-background-warning-subtle))\n * @cssproperty --dds-callout-warning-background-medium - Warning variant medium background color. (default: var(--dds-background-warning-medium))\n * @cssproperty --dds-callout-warning-background-strong - Warning variant strong background color. (default: var(--dds-background-warning-strong))\n * @cssproperty --dds-callout-warning-icon - Warning variant icon color. (default: var(--dds-icon-neutral-strong))\n * @cssproperty --dds-callout-warning-border - Warning variant border color. (default: var(--dds-border-warning-subtle))\n *\n * @cssproperty --dds-callout-negative-background - Negative variant background color. (default: var(--dds-background-negative-base))\n * @cssproperty --dds-callout-negative-background-subtle - Negative variant subtle background color. (default: var(--dds-background-negative-subtle))\n * @cssproperty --dds-callout-negative-background-medium - Negative variant medium background color. (default: var(--dds-background-negative-medium))\n * @cssproperty --dds-callout-negative-background-strong - Negative variant strong background color. (default: var(--dds-background-negative-strong))\n * @cssproperty --dds-callout-negative-icon - Negative variant icon color. (default: var(--dds-icon-negative-subtle))\n * @cssproperty --dds-callout-negative-border - Negative variant border color. (default: var(--dds-border-negative-subtle))\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 * @property {string} sizeMap - Responsive size map (e.g. \"md:lg\").\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: var(--dds-spacing-200))\n * @cssproperty --dds-card-actions-padding-lg - The padding for large size card actions. (default: var(--dds-spacing-600))\n * @cssproperty --dds-card-actions-padding-md - The padding for medium size card actions. (default: var(--dds-spacing-400))\n * @cssproperty --dds-card-actions-padding-sm - The padding for small size card actions. (default: var(--dds-spacing-400))\n * @cssproperty --dds-card-actions-margin-lg - The margin for large size card actions spacing. (default: var(--dds-spacing-600))\n * @cssproperty --dds-card-actions-margin-md - The margin for medium size card actions spacing. (default: var(--dds-spacing-400))\n * @cssproperty --dds-card-actions-margin-sm - The margin for small size card actions spacing. (default: 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 * @property {string} sizeMap - Responsive size map (e.g. \"md:lg\").\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: 0)\n * @cssproperty --dds-card-content-margin - The margin of the card content. (default: 0)\n * @cssproperty --dds-card-content-font-size - The font size of the card content. (default: var(--dds-font-base))\n * @cssproperty --dds-card-content-line-height - The line height of the card content. (default: var(--dds-font-line-height-xlarge))\n * @cssproperty --dds-card-content-spacing-lg - The large spacing value. (default: var(--dds-spacing-600))\n * @cssproperty --dds-card-content-spacing-md - The medium spacing value. (default: var(--dds-spacing-400))\n * @cssproperty --dds-card-content-spacing-sm - The small spacing value. (default: var(--dds-spacing-400))\n * @cssproperty --dds-card-content-spacing-top - The top spacing value. (default: 0)\n * @cssproperty --dds-card-content-spacing-bottom - The bottom spacing value. (default: 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: 100%)\n * @cssproperty --dds-card-image-height - The height of the image. (default: auto)\n * @cssproperty --dds-card-image-object-fit - How the image fits within its container. (default: cover)\n * @cssproperty --dds-card-image-background-position - The background position of the image. (default: center)\n * @cssproperty --dds-card-image-background-size - How the background image is sized. (default: cover)\n * @cssproperty --dds-card-image-background-repeat - How the background image repeats. (default: 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' | 'md' | '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 * @property {string} sizeMap - Responsive size map (e.g. \"md:lg\").\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: var(--dds-text-neutral-subtle))\n * @cssproperty --dds-card-subtitle-font-size - The font size of the subtitle. (default: var(--dds-font-xs))\n * @cssproperty --dds-card-subtitle-font-weight - The font weight of the subtitle. (default: var(--dds-font-weight-bold))\n * @cssproperty --dds-card-subtitle-line-height - The line height of the subtitle. (default: var(--dds-font-line-height-large))\n *\n * @cssproperty --dds-card-subtitle-padding-sm - The padding for small size. (default: 0 var(--dds-spacing-400))\n * @cssproperty --dds-card-subtitle-padding-md - The padding for medium size. (default: 0 var(--dds-spacing-400))\n * @cssproperty --dds-card-subtitle-padding-lg - The padding for large size. (default: 0 var(--dds-spacing-600))\n *\n * @cssproperty --dds-card-subtitle-margin-sm - The base margin for small size. (default: var(--dds-spacing-400))\n * @cssproperty --dds-card-subtitle-margin-md - The base margin for medium size. (default: var(--dds-spacing-400))\n * @cssproperty --dds-card-subtitle-margin-lg - The base margin for large size. (default: var(--dds-spacing-600))\n *\n * @cssproperty --dds-card-subtitle-spacing-top-sm - The top spacing for small size. (default: var(--dds-spacing-400))\n * @cssproperty --dds-card-subtitle-spacing-top-md - The top spacing for medium size. (default: var(--dds-spacing-400))\n * @cssproperty --dds-card-subtitle-spacing-top-lg - The top spacing for large size. (default: var(--dds-spacing-600))\n *\n * @cssproperty --dds-card-subtitle-spacing-bottom-sm - The bottom spacing for small size. (default: var(--dds-spacing-400))\n * @cssproperty --dds-card-subtitle-spacing-bottom-md - The bottom spacing for medium size. (default: var(--dds-spacing-400))\n * @cssproperty --dds-card-subtitle-spacing-bottom-lg - The bottom spacing for large size. (default: var(--dds-spacing-600))\n *\n * @cssproperty --dds-card-subtitle-spacing-both-sm - The both (top and bottom) spacing for small size. (default: var(--dds-spacing-400))\n * @cssproperty --dds-card-subtitle-spacing-both-md - The both (top and bottom) spacing for medium size. (default: var(--dds-spacing-400))\n * @cssproperty --dds-card-subtitle-spacing-both-lg - The both (top and bottom) spacing for large size. (default: 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: var(--dds-color-text-primary))\n * @cssproperty --dds-card-title-font-weight - The font weight of the card title. (default: var(--dds-font-weight-bold))\n * @cssproperty --dds-card-title-line-height - The line height of the card title. (default: var(--dds-font-line-height-large))\n * @cssproperty --dds-card-title-margin-bottom - The bottom margin of the card title. (default: var(--dds-spacing-100))\n *\n * @cssproperty --dds-card-title-sm-padding-x - The horizontal padding for small size. (default: var(--dds-spacing-400))\n * @cssproperty --dds-card-title-sm-padding-bottom - The bottom padding for small size. (default: var(--dds-spacing-100))\n * @cssproperty --dds-card-title-sm-spacing-top - The top spacing for small size. (default: var(--dds-spacing-400))\n * @cssproperty --dds-card-title-sm-spacing-bottom - The bottom spacing for small size. (default: var(--dds-spacing-400))\n *\n * @cssproperty --dds-card-title-md-padding-x - The horizontal padding for medium size. (default: var(--dds-spacing-400))\n * @cssproperty --dds-card-title-md-padding-bottom - The bottom padding for medium size. (default: var(--dds-spacing-100))\n * @cssproperty --dds-card-title-md-spacing-top - The top spacing for medium size. (default: var(--dds-spacing-400))\n * @cssproperty --dds-card-title-md-spacing-bottom - The bottom spacing for medium size. (default: var(--dds-spacing-400))\n *\n * @cssproperty --dds-card-title-lg-padding-x - The horizontal padding for large size. (default: var(--dds-spacing-600))\n * @cssproperty --dds-card-title-lg-padding-bottom - The bottom padding for large size. (default: var(--dds-spacing-100))\n * @cssproperty --dds-card-title-lg-spacing-top - The top spacing for large size. (default: var(--dds-spacing-600))\n * @cssproperty --dds-card-title-lg-spacing-bottom - The bottom spacing for large size. (default: 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. Default is `sm`.\n * @property {string} sizeMap - Responsive size map (e.g. \"md:lg\").\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: var(--dds-spacing-400))\n * @cssproperty --dds-card-border-radius - The border radius of the card. (default: var(--dds-radius-large))\n * @cssproperty --dds-card-border-width - The border width of the card. (default: var(--dds-border-width-base))\n * @cssproperty --dds-card-border-color - The border color of the card. (default: var(--dds-border-neutral-divider))\n * @cssproperty --dds-card-background - The background color of the card. (default: var(--dds-background-neutral-base))\n * @cssproperty --dds-card-hover-border-color - The border color when hovering over the card. (default: var(--dds-border-brand-base))\n * @cssproperty --dds-card-active-border-color - The border color when the card is active. (default: var(--dds-border-brand-medium))\n * @cssproperty --dds-card-shadow - The box shadow of the card. (default: none)\n * @cssproperty --dds-card-hover-shadow - The box shadow when hovering over the card. (default: none)\n * @cssproperty --dds-card-transition-duration - The duration of the card's transitions. (default: var(--dds-transition-medium))\n * @cssproperty --dds-card-transition-timing - The timing function of the card's transitions. (default: 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, readonly: 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, readonly: 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} readonly - Whether the checkbox is readonly (cannot be changed but value is submitted with form).\n * @property {boolean} required - Whether the checkbox is required.\n * @property {'xs' | 'sm' | 'lg'} size - The size of the checkbox. Default is 'sm'.\n * @property {string} sizeMap - Responsive size map (e.g. \"md:lg\").\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 icon-base - The base icon container.\n * @csspart label-container - The label container of the checkbox.\n * @csspart description - The description of the checkbox.\n * @csspart readonly - The readonly state of the checkbox.\n *\n * @cssproperty --dds-checkbox-size - The size of the checkbox. (default: var(--dds-spacing-500))\n * @cssproperty --dds-checkbox-border-width - The border width of the checkbox. (default: var(--dds-border-width-large))\n * @cssproperty --dds-checkbox-border-radius - The border radius of the checkbox. (default: var(--dds-radius-small))\n * @cssproperty --dds-checkbox-border-color - The border color of the checkbox. (default: var(--dds-border-neutral-base))\n * @cssproperty --dds-checkbox-background-color - The background color of the checkbox. (default: transparent)\n * @cssproperty --dds-checkbox-icon-color - The color of the checkbox icon. (default: var(--dds-button-primary-icon-enabled))\n * @cssproperty --dds-checkbox-hover-border-color - The border color when hovering over the checkbox. (default: var(--dds-border-neutral-medium))\n * @cssproperty --dds-checkbox-hover-background-color - The background color when hovering over the checkbox. (default: var(--dds-background-neutral-medium))\n * @cssproperty --dds-checkbox-active-border-color - The border color when the checkbox is active. (default: var(--dds-border-neutral-strong))\n * @cssproperty --dds-checkbox-active-background-color - The background color when the checkbox is active. (default: var(--dds-background-neutral-strong))\n * @cssproperty --dds-checkbox-checked-border-color - The border color when the checkbox is checked. (default: var(--dds-background-brand-base-inverted))\n * @cssproperty --dds-checkbox-checked-background-color - The background color when the checkbox is checked. (default: var(--dds-background-brand-base-inverted))\n * @cssproperty --dds-checkbox-checked-hover-border-color - The border color when hovering over a checked checkbox. (default: var(--dds-background-brand-medium-inverted))\n * @cssproperty --dds-checkbox-checked-hover-background-color - The background color when hovering over a checked checkbox. (default: var(--dds-background-brand-medium-inverted))\n * @cssproperty --dds-checkbox-checked-active-border-color - The border color when a checked checkbox is active. (default: var(--dds-background-brand-strong-inverted))\n * @cssproperty --dds-checkbox-checked-active-background-color - The background color when a checked checkbox is active. (default: var(--dds-background-brand-strong-inverted))\n * @cssproperty --dds-checkbox-invalid-border-color - The border color when the checkbox is invalid. (default: var(--dds-border-negative-base))\n * @cssproperty --dds-checkbox-invalid-background-color - The background color when the checkbox is invalid. (default: var(--dds-background-negative-base))\n * @cssproperty --dds-checkbox-invalid-hover-border-color - The border color when hovering over an invalid checkbox. (default: var(--dds-border-negative-medium))\n * @cssproperty --dds-checkbox-invalid-hover-background-color - The background color when hovering over an invalid checkbox. (default: var(--dds-background-negative-medium))\n * @cssproperty --dds-checkbox-invalid-active-border-color - The border color when an invalid checkbox is active. (default: var(--dds-border-negative-strong))\n * @cssproperty --dds-checkbox-invalid-active-background-color - The background color when an invalid checkbox is active. (default: var(--dds-background-negative-strong))\n * @cssproperty --dds-checkbox-disabled-border-color - The border color when the checkbox is disabled. (default: var(--dds-button-primary-background-disabled))\n * @cssproperty --dds-checkbox-disabled-background-color - The background color when the checkbox is disabled. (default: var(--dds-button-primary-background-disabled))\n * @cssproperty --dds-checkbox-disabled-icon-color - The color of the checkbox icon when disabled. (default: var(--dds-button-primary-icon-disabled))\n * @cssproperty --dds-checkbox-readonly-border-color - The border color when the checkbox is readonly. (default: var(--dds-border-neutral-subtle))\n * @cssproperty --dds-checkbox-readonly-background-color - The background color when the checkbox is readonly. (default: var(--dds-background-neutral-subtle))\n * @cssproperty --dds-checkbox-readonly-icon-color - The color of the checkbox icon when readonly. (default: var(--dds-text-neutral-base))\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/chip/chip.component.js'\n      import type { DdsRemoveEvent } from '../../events/events'\nimport type { DdsSelectEvent } from '../../events/events'\n      export type { DdsRemoveEvent } from '../../events/events'\nexport type { DdsSelectEvent } from '../../events/events'\n\n      const tagName = 'dap-ds-chip'\n\n      /**\n * `dap-ds-chip`\n * @summary A chip is a small status descriptor for UI elements.\n * @element dap-ds-chip\n * @title - Chip\n *\n * @property { 'sm' | 'lg' } size - The size of the chip. Default is `sm`.\n * @property {string} sizeMap - Responsive size map (e.g. \"md:lg\").\n *\n * @event {{ value: string }} dds-remove - Fired when the chip is removed\n * @event {{ value?: string, selected: boolean }} dds-select - Fired when the chip is selected\n *\n * @csspart base - The base part\n * @csspart content-container - The container for the content\n * @csspart remove-button - The remove button\n * @csspart remove-icon - The icon of the remove icon\n * @csspart remove-icon-base - The base of the remove icon\n * @csspart remove-icon-base-base - The base of the remove icon base\n *\n * @cssproperty --dds-chip-border - Border of the chip (default: var(--dds-border-width-base) solid var(--dds-transparent-black-base))\n * @cssproperty --dds-chip-border-radius - Border radius of the chip (default: var(--dds-radius-small))\n * @cssproperty --dds-chip-font-weight - Font weight of the chip (default: var(--dds-font-weight-bold))\n * @cssproperty --dds-chip-line-height - Line height of the chip (default: 1.5)\n * @cssproperty --dds-chip-transition - Transition timing for chip interactions (default: all 0.2s ease-in-out)\n * @cssproperty --dds-chip-padding-sm - Padding for small chip size (default: var(--dds-spacing-100) var(--dds-spacing-200))\n * @cssproperty --dds-chip-padding-lg - Padding for large chip size (default: var(--dds-spacing-200) var(--dds-spacing-300))\n * @cssproperty --dds-chip-font-size-sm - Font size for small chip size (default: var(--dds-font-xs))\n * @cssproperty --dds-chip-font-size-lg - Font size for large chip size (default: var(--dds-font-xs))\n * @cssproperty --dds-chip-background-color - Background color of the chip (default: var(--dds-background-neutral-base))\n * @cssproperty --dds-chip-text-color - Text color of the chip (default: var(--dds-text-neutral-base))\n * @cssproperty --dds-chip-hover-background-color - Background color of the chip on hover (default: var(--dds-background-neutral-medium))\n * @cssproperty --dds-chip-active-background-color - Background color of the chip when active (default: var(--dds-background-neutral-strong))\n * @cssproperty --dds-chip-selected-background-color - Background color of the selected chip (default: var(--dds-background-brand-medium))\n * @cssproperty --dds-chip-selected-text-color - Text color of the selected chip (default: var(--dds-text-brand-subtle))\n * @cssproperty --dds-chip-selected-border-color - Border color of the selected chip (default: var(--dds-border-brand-base))\n * @cssproperty --dds-chip-disabled-background-color - Background color of the disabled chip (default: var(--dds-background-neutral-medium))\n * @cssproperty --dds-chip-disabled-text-color - Text color of the disabled chip (default: var(--dds-text-neutral-subtle))\n *\n */\n      const reactWrapper = createComponent({\n        tagName,\n        elementClass: Component,\n        react: React,\n        events: {\n          onDdsRemove: 'dds-remove' as EventName<DdsRemoveEvent>,\nonDdsSelect: 'dds-select' as EventName<DdsSelectEvent>\n        },\n        displayName: \"DapDSChip\"\n      })\n\n      export default reactWrapper\n    ","import { createComponent } from '@lit/react'\nimport * as React from 'react'\n\nimport Component from '../../components/code-puncher/code-puncher-slot.component.js'\n\nconst tagName = 'dap-ds-code-puncher-slot'\n\n/**\n * `dap-ds-code-puncher-slot`\n * @summary Individual digit input slot for code puncher.\n * @element dap-ds-code-puncher-slot\n * @title - Code puncher slot\n *\n * @csspart base - The slot container.\n * @csspart input - The input element.\n */\nconst reactWrapper = createComponent({\n  tagName,\n  elementClass: Component,\n  react: React,\n  events: {},\n  displayName: 'DapDSCodePuncherSlot',\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/code-puncher/code-puncher.component.js'\n      import type { DdsInputEvent } from '../../events/events'\nimport type { DdsChangeEvent } from '../../events/events'\nimport type { DdsCompleteEvent } from '../../events/events'\nimport type { DdsFocusEvent } from '../../events/events'\nimport type { DdsBlurEvent } from '../../events/events'\n      export type { DdsInputEvent } from '../../events/events'\nexport type { DdsChangeEvent } from '../../events/events'\nexport type { DdsCompleteEvent } from '../../events/events'\nexport type { DdsFocusEvent } from '../../events/events'\nexport type { DdsBlurEvent } from '../../events/events'\n\n      const tagName = 'dap-ds-code-puncher'\n\n      /**\n * `dap-ds-code-puncher`\n * @summary A composable PIN/OTP input component for entering verification codes.\n * @element dap-ds-code-puncher\n * @title - Code Puncher\n * @group code-puncher\n *\n * @property {string} value - The complete code value.\n * @property {boolean} mask - Mask input like password. Default is false.\n * @property {string} pattern - Regex pattern for allowed characters. Default is '[0-9]'.\n * @property {string} placeholder - Placeholder character for empty slots.\n * @property {'xs' | 'sm' | 'lg'} size - The size of the slots. Default is 'sm'.\n * @property {string} label - The label of the component.\n * @property {string} description - The description of the component.\n * @property {string} tooltip - The tooltip of the component.\n * @property {string} feedback - The feedback message.\n * @property {'negative' | 'positive' | 'warning'} feedbackType - The feedback type.\n * @property {'success' | 'error'} status - The status of the component.\n * @property {boolean} disabled - Disable all slots. Default is false.\n * @property {boolean} readonly - Read-only state. Default is false.\n * @property {boolean} required - Required for form validation. Default is false.\n * @property {string} name - Form element name.\n * @property {string} autocomplete - Autocomplete hint. Default is 'one-time-code'.\n *\n * @event {{ value: string, index: number }} dds-input - Fires on each digit input.\n * @event {{ value: string }} dds-change - Fires when value changes.\n * @event {{ value: string }} dds-complete - Fires when all slots are filled.\n * @event dds-focus - Fires when component gains focus.\n * @event dds-blur - Fires when component loses focus.\n *\n * @slot default - Slot for code-puncher-group, code-puncher-slot, and code-puncher-separator elements.\n *\n * @csspart base - The main container.\n * @csspart slots - The slots container.\n * @csspart label - The label element.\n * @csspart description - The description element.\n * @csspart feedback - The feedback element.\n */\n      const reactWrapper = createComponent({\n        tagName,\n        elementClass: Component,\n        react: React,\n        events: {\n          onDdsInput: 'dds-input' as EventName<DdsInputEvent>,\nonDdsChange: 'dds-change' as EventName<DdsChangeEvent>,\nonDdsComplete: 'dds-complete' as EventName<DdsCompleteEvent>,\nonDdsFocus: 'dds-focus' as EventName<DdsFocusEvent>,\nonDdsBlur: 'dds-blur' as EventName<DdsBlurEvent>\n        },\n        displayName: \"DapDSCodePuncher\"\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 {boolean} 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' | '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 content of the select.\n * @property {'negative' | 'positive' | '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} textComplete - Whether the combobox should 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 * @property {boolean} multiselect - Whether the combobox is multiselect.\n * @property {number} maxSelections - The maximum number of selections allowed.\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 * @csspart input - The input of the select.\n *\n * @cssproperty --dds-combobox-background - The background color of the combobox. (default: var(--dds-fields-background-default))\n * @cssproperty --dds-combobox-border-color - The border color of the combobox. (default: var(--dds-border-neutral-base))\n * @cssproperty --dds-combobox-border-width - The border width of the combobox. (default: var(--dds-border-width-base, 1px))\n * @cssproperty --dds-combobox-border-radius - The border radius of the combobox. (default: var(--dds-radius-base))\n * @cssproperty --dds-combobox-text-color - The text color of the combobox. (default: var(--dds-text-neutral-base))\n * @cssproperty --dds-combobox-placeholder-color - The placeholder text color. (default: var(--dds-text-neutral-subtle))\n * @cssproperty --dds-combobox-disabled-background - The background color when disabled. (default: var(--dds-background-neutral-stronger))\n * @cssproperty --dds-combobox-disabled-text - The text color when disabled. (default: var(--dds-text-neutral-disabled))\n * @cssproperty --dds-combobox-error-border - The border color for error state. (default: var(--dds-border-negative-base))\n * @cssproperty --dds-combobox-success-border - The border color for success state. (default: var(--dds-border-positive-base))\n * @cssproperty --dds-combobox-icon-color - The color of the icons. (default: var(--dds-text-icon-neutral-subtle))\n * @cssproperty --dds-combobox-loading-spinner-color - The color of the loading spinner. (default: var(--dds-icon-neutral-base))\n * @cssproperty --dds-combobox-clear-icon-color - The color of the clear icon. (default: var(--dds-button-subtle-icon-neutral-enabled))\n * @cssproperty --dds-combobox-popup-background - The background color of the popup. (default: var(--dds-background-neutral-subtle))\n * @cssproperty --dds-combobox-popup-shadow - The box shadow of the popup. (default: 0 4px 6px -1px rgba(0, 0, 0, 0.08), 0 2px 4px -1px rgba(0, 0, 0, 0.06))\n * @cssproperty --dds-combobox-icon-opened-transform - The transform of the icon when the combobox is opened (default: rotate(90deg)).\n * @cssproperty --dds-combobox-padding-xs - The padding for extra small size. (default: var(--dds-spacing-200))\n * @cssproperty --dds-combobox-padding-sm - The padding for small size. (default: var(--dds-spacing-200))\n * @cssproperty --dds-combobox-padding-lg - The padding for large size. (default: var(--dds-spacing-300))\n * @cssproperty --dds-combobox-padding-horizontal - The horizontal padding. (default: var(--dds-spacing-300))\n * @cssproperty --dds-combobox-padding-vertical - The vertical padding. (default: var(--dds-spacing-200))\n * @cssproperty --dds-combobox-gap - The gap between elements. (default: var(--dds-spacing-100))\n * @cssproperty --dds-combobox-icon-gap - The gap between icons. (default: var(--dds-spacing-200))\n * @cssproperty --dds-combobox-action-gap - The gap between action elements. (default: var(--dds-spacing-200))\n * @cssproperty --dds-combobox-action-padding - The padding for action elements. (default: var(--dds-spacing-300))\n * @cssproperty --dds-combobox-clear-icon-width - The width of the clear icon. (default: var(--dds-spacing-800))\n * @cssproperty --dds-combobox-dropdown-icon-right - The right position of the dropdown icon. (default: var(--dds-spacing-600))\n * @cssproperty --dds-combobox-min-width - The minimum width of the combobox. (default: 7.5rem)\n * @cssproperty --dds-combobox-chips-gap - The gap between chips. (default: var(--dds-spacing-100))\n * @cssproperty --dds-combobox-chips-padding - The padding for chips. (default: var(--dds-spacing-100))\n * @cssproperty --dds-combobox-chips-max-height - The maximum height of the chips. (default: 120px)\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 * @csspart base - The base part of the command group.\n * @csspart label - The label part of the command group.\n * @csspart items - The items part of the command group.\n *\n * @cssproperty --dds-command-group-gap - The gap between command group elements. (default: var(--dds-spacing-100))\n * @cssproperty --dds-command-group-margin-bottom - The bottom margin of the command group. (default: var(--dds-spacing-200))\n * @cssproperty --dds-command-group-border-radius - The border radius of the command group. (default: var(--dds-radius-small))\n * @cssproperty --dds-command-group-label-font-weight - The font weight of the command group label. (default: var(--dds-font-weight-bold))\n * @cssproperty --dds-command-group-items-gap - The gap between command items. (default: 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 * @cssproperty --dds-command-item-padding - The padding of the command item (default: var(--dds-spacing-100) var(--dds-spacing-200))\n * @cssproperty --dds-command-item-background - The background color of the command item (default: none)\n * @cssproperty --dds-command-item-color - The text color of the command item (default: var(--dds-text-primary-base))\n * @cssproperty --dds-command-item-hover-background - The background color of the command item on hover (default: var(--dds-transparent-black-subtle))\n * @cssproperty --dds-command-item-selected-background - The background color of the selected command item (default: var(--dds-transparent-black-subtle))\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 { DdsChangeEvent } from '../../events/events'\nimport type { DdsOpenedEvent } from '../../events/events'\nimport type { DdsClosedEvent } from '../../events/events'\nimport type { DdsCloseEvent } from '../../events/events'\n      export type { DdsChangeEvent } from '../../events/events'\nexport type { DdsOpenedEvent } from '../../events/events'\nexport type { DdsClosedEvent } from '../../events/events'\nexport type { DdsCloseEvent } 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 * @event {{ value: string }} dds-change - Fired when the command value changes.\n *\n * @slot trigger - The trigger element for the command dropdown.\n * @slot - The command items.\n */\n      const reactWrapper = createComponent({\n        tagName,\n        elementClass: Component,\n        react: React,\n        events: {\n          onDdsChange: 'dds-change' as EventName<DdsChangeEvent>,\nonDdsOpened: 'dds-opened' as EventName<DdsOpenedEvent>,\nonDdsClosed: 'dds-closed' as EventName<DdsClosedEvent>,\nonDdsClose: 'dds-close' as EventName<DdsCloseEvent>\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 {{ 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-xs - The height of the extra small input. (default: var(--dds-spacing-800))\n * @cssproperty --dds-input-height-sm - The height of the small input. (default: var(--dds-spacing-1000))\n * @cssproperty --dds-input-height-lg - The height of the large input. (default: var(--dds-spacing-1200))\n * @cssproperty --dds-input-padding-xs - The padding of the extra small input. (default: 0 var(--dds-spacing-200))\n * @cssproperty --dds-input-padding-sm - The padding of the small input. (default: 0 var(--dds-spacing-300))\n * @cssproperty --dds-input-padding-lg - The padding of the large input. (default: 0 var(--dds-spacing-400))\n * @cssproperty --dds-input-font-size-xs - The font size of the extra small input. (default: var(--dds-font-sm))\n * @cssproperty --dds-input-font-size-sm - The font size of the small input. (default: var(--dds-font-base))\n * @cssproperty --dds-input-font-size-lg - The font size of the large input. (default: var(--dds-font-lg))\n * @cssproperty --dds-input-border - The border of the input. (default: var(--dds-border-width-base) solid var(--dds-border-neutral-base))\n * @cssproperty --dds-input-background - The background color of the input. (default: var(--dds-fields-background-default))\n * @cssproperty --dds-input-text-color - The text color of the input. (default: var(--dds-text-neutral-base))\n * @cssproperty --dds-input-border-radius - The border radius of the input. (default: var(--dds-radius-base))\n * @cssproperty --dds-input-disabled-border - The border of the disabled input. (default: 0 solid var(--dds-border-neutral-disabled))\n * @cssproperty --dds-input-disabled-background - The background color of the disabled input. (default: var(--dds-fields-background-disabled))\n * @cssproperty --dds-input-disabled-text - The text color of the disabled input. (default: var(--dds-text-neutral-disabled))\n * @cssproperty --dds-input-readonly-border - The border of the readonly input. (default: 0 solid var(--dds-border-neutral-subtle))\n * @cssproperty --dds-input-readonly-background - The background color of the readonly input. (default: var(--dds-fields-background-read-only))\n * @cssproperty --dds-input-readonly-text - The text color of the readonly input. (default: var(--dds-text-neutral-subtle))\n * @cssproperty --dds-input-success-border - The border of the success input. (default: var(--dds-border-width-base) solid var(--dds-border-positive-base))\n * @cssproperty --dds-input-error-border - The border of the error input. (default: var(--dds-border-width-base) solid var(--dds-border-negative-base))\n * @cssproperty --dds-input-addon-background - The background color of the input addon. (default: var(--dds-fields-background-default))\n * @cssproperty --dds-input-addon-success-background - The background color of the success input addon. (default: var(--dds-fields-background-default))\n * @cssproperty --dds-input-addon-error-background - The background color of the error input addon. (default: var(--dds-fields-background-default))\n * @cssproperty --dds-input-addon-border-before - The border of the addon before the input. (default: var(--dds-border-width-base) solid var(--dds-border-neutral-base))\n * @cssproperty --dds-input-addon-border-after - The border of the addon after the input. (default: var(--dds-border-width-base) solid var(--dds-border-neutral-base))\n * @cssproperty --dds-input-addon-border-width-before - The border width of the addon before the input. (default: var(--dds-border-width-base) 0 var(--dds-border-width-base) var(--dds-border-width-base))\n * @cssproperty --dds-input-addon-border-width-after - The border width of the addon after the input. (default: var(--dds-border-width-base) var(--dds-border-width-base) var(--dds-border-width-base) 0)\n * @cssproperty --dds-input-addon-success-border - The border of the success addon. (default: var(--dds-border-width-base) solid var(--dds-border-positive-base))\n * @cssproperty --dds-input-addon-success-border-before - The border of the success addon before the input. (default: var(--dds-border-width-base) solid var(--dds-border-positive-base))\n * @cssproperty --dds-input-addon-success-border-after - The border of the success addon after the input. (default: var(--dds-border-width-base) solid var(--dds-border-positive-base))\n * @cssproperty --dds-input-addon-success-border-width-before - The border width of the success addon before the input. (default: var(--dds-border-width-base) 0 var(--dds-border-width-base) var(--dds-border-width-base))\n * @cssproperty --dds-input-addon-success-border-width-after - The border width of the success addon after the input. (default: var(--dds-border-width-base) var(--dds-border-width-base) var(--dds-border-width-base) 0)\n * @cssproperty --dds-input-addon-error-border-before - The border of the error addon before the input. (default: var(--dds-border-width-base) solid var(--dds-border-negative-base))\n * @cssproperty --dds-input-addon-error-border-after - The border of the error addon after the input. (default: var(--dds-border-width-base) solid var(--dds-border-negative-base))\n * @cssproperty --dds-input-addon-error-border-width-before - The border width of the error addon before the input. (default: var(--dds-border-width-base) 0 var(--dds-border-width-base) var(--dds-border-width-base))\n * @cssproperty --dds-input-addon-error-border-width-after - The border width of the error addon after the input. (default: var(--dds-border-width-base) var(--dds-border-width-base) var(--dds-border-width-base) 0)\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 * @csspart copy-button-base - The base of the copy button.\n * @csspart copy-button-content - The content of the copy button.\n * @csspart copy-icon - The copy icon of the component.\n * @csspart copy-icon-base - The base of the copy icon.\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-sm - Custom padding for the small badge (default: var(--dds-spacing-200) var(--dds-spacing-300))\n * @cssproperty --dds-badge-padding-lg - Custom padding for the large badge (default: var(--dds-spacing-400))\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-radius-base))\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-sm - Custom font size for the small badge (default: var(--dds-font-xs))\n * @cssproperty --dds-badge-font-size-lg - Custom font size for the large 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 * @cssproperty --dds-badge-border-color-normal - Custom border color for the normal variant (default: var(--dds-transparent-black-medium))\n * @cssproperty --dds-badge-background-color-normal - Custom background color for the normal variant (default: var(--dds-background-brand-subtle))\n * @cssproperty --dds-badge-color-normal - Custom text color for the normal variant (default: var(--dds-text-brand-subtle))\n * @cssproperty --dds-badge-border-color-inverted - Custom border color for the inverted variant (default: var(--dds-transparent-white-medium))\n * @cssproperty --dds-badge-background-color-inverted - Custom background color for the inverted variant (default: var(--dds-background-brand-base-inverted))\n * @cssproperty --dds-badge-color-inverted - Custom text color for the inverted variant (default: var(--dds-text-neutral-inverted))\n *\n * @property { 'sm' | 'lg' } size - The size of the DÁP badge. Default is `sm`.\n * @property {string} sizeMap - Responsive size map (e.g. \"md:lg\").\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 * @slot loading - The loading content of the table.\n * @slot empty - The empty content of the table.\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 empty - The empty content of the table.\n * @csspart loading - The loading content 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 * @csspart pager-base - The base of the pager.\n * @csspart pager-first - The first button of the pager.\n * @csspart pager-previous - The previous button of the pager.\n * @csspart pager-next - The next button of the pager.\n * @csspart pager-last - The last button of the pager.\n * @csspart pager-page-size-select - The page size select of the pager.\n *\n * @cssproperty --dds-datatable-bg-color - Background color of the table. (default: var(--dds-background-neutral-subtle)).\n * @cssproperty --dds-datatable-border-color - Border color of the table cells. (default: var(--dds-border-neutral-divider))\n * @cssproperty --dds-datatable-header-bg-color - Background color of the table header. (default: var(--dds-background-neutral-subtle))\n * @cssproperty --dds-datatable-header-text-color - Text color of the table header. (default: var(--dds-text-neutral-strong))\n * @cssproperty --dds-datatable-row-hover-bg-color - Background color of hovered rows. (default: var(--dds-background-brand-strong))\n * @cssproperty --dds-datatable-row-selected-bg-color - Background color of selected rows. (default: var(--dds-background-brand-strong))\n * @cssproperty --dds-datatable-cell-padding - Padding of table cells. (default: var(--dds-spacing-200))\n * @cssproperty --dds-datatable-header-padding - Padding of header cells. (default: var(--dds-spacing-200))\n * @cssproperty --dds-datatable-last-column-padding - Padding of the last column. (default: var(--dds-spacing-500))\n * @cssproperty --dds-datatable-first-column-padding - Padding of the first column. (default: var(--dds-spacing-500))\n * @cssproperty --dds-datatable-border-width - Width of table borders. (default: var(--dds-border-width-base))\n * @cssproperty --dds-datatable-stripe-color - Background color for striped rows. (default: var(--dds-background-neutral-base))\n * @cssproperty --dds-datatable-border-radius - Border radius of the table. (default: var(--dds-radius-base))\n * @cssproperty --dds-datatable-shadow - Box shadow of the table. (default: none)\n * @cssproperty --dds-datatable-transition-duration - Duration of hover/selection transitions. (default: 0.2s)\n * @cssproperty --dds-datatable-z-index - Z-index of the table. (default: 1)\n * @cssproperty --dds-datatable-min-height - Minimum height of the table. (default: auto)\n * @cssproperty --dds-datatable-max-height - Maximum height of the table. (default: none)\n * @cssproperty --dds-datatable-overflow-x - Horizontal overflow behavior. (default: auto)\n * @cssproperty --dds-datatable-overflow-y - Vertical overflow behavior. (default: auto)\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 * @csspart calendar-grid-cell-base - The base of the calendar grid cell.\n * @csspart calendar-grid-cell - The cell of the calendar grid.\n * @csspart calendar-grid-header-cell-base - The base of the calendar grid header cell.\n * @csspart calendar-grid-header-cell - The header cell of the calendar grid.\n * @csspart calendar-grid-cell-today-mark - The today mark of the calendar grid cell.\n *\n * @cssproperty --dds-combobox-background - The background color of the combobox. (default: var(--dds-fields-background-default))\n * @cssproperty --dds-combobox-border-color - The border color of the combobox. (default: var(--dds-border-neutral-base))\n * @cssproperty --dds-combobox-border-width - The border width of the combobox. (default: var(--dds-border-width-base, 1px))\n * @cssproperty --dds-combobox-border-radius - The border radius of the combobox. (default: var(--dds-radius-base))\n * @cssproperty --dds-combobox-text-color - The text color of the combobox. (default: var(--dds-text-neutral-base))\n * @cssproperty --dds-combobox-placeholder-color - The placeholder text color. (default: var(--dds-text-neutral-subtle))\n * @cssproperty --dds-combobox-disabled-background - The background color when disabled. (default: var(--dds-background-neutral-stronger))\n * @cssproperty --dds-combobox-disabled-text - The text color when disabled. (default: var(--dds-text-neutral-disabled))\n * @cssproperty --dds-combobox-error-border - The border color for error state. (default: var(--dds-border-negative-base))\n * @cssproperty --dds-combobox-success-border - The border color for success state. (default: var(--dds-border-positive-base))\n * @cssproperty --dds-combobox-icon-color - The color of the icons. (default: var(--dds-text-icon-neutral-subtle))\n * @cssproperty --dds-combobox-clear-icon-color - The color of the clear icon. (default: var(--dds-button-subtle-icon-neutral-enabled))\n * @cssproperty --dds-combobox-popup-background - The background color of the popup. (default: var(--dds-background-neutral-subtle))\n * @cssproperty --dds-combobox-popup-shadow - The box shadow of the popup. (default: 0 4px 6px -1px rgb(0 0 0 / 8%), 0 2px 4px -1px rgb(0 0 0 / 6%))\n * @cssproperty --dds-combobox-padding-xs - The padding for extra small size. (default: var(--dds-spacing-200))\n * @cssproperty --dds-combobox-padding-sm - The padding for small size. (default: var(--dds-spacing-200))\n * @cssproperty --dds-combobox-padding-lg - The padding for large size. (default: var(--dds-spacing-300))\n * @cssproperty --dds-combobox-padding-horizontal - The horizontal padding. (default: var(--dds-spacing-300))\n * @cssproperty --dds-combobox-padding-vertical - The vertical padding. (default: var(--dds-spacing-200))\n * @cssproperty --dds-combobox-gap - The gap between elements. (default: var(--dds-spacing-100))\n * @cssproperty --dds-combobox-icon-gap - The gap between icons. (default: var(--dds-spacing-200))\n * @cssproperty --dds-combobox-action-gap - The gap between action elements. (default: var(--dds-spacing-200))\n * @cssproperty --dds-combobox-action-padding - The padding for action elements. (default: var(--dds-spacing-300))\n * @cssproperty --dds-combobox-clear-icon-width - The width of the clear icon. (default: var(--dds-spacing-800))\n * @cssproperty --dds-combobox-dropdown-icon-right - The right position of the dropdown icon. (default: var(--dds-spacing-600))\n * @cssproperty --dds-combobox-min-width - The minimum width of the combobox. (default: 7.5rem)\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. (default: var(--dds-border-width-base))\n * @cssproperty --dds-divider-border-style - The style of the divider border. (default: solid)\n * @cssproperty --dds-divider-border-color - The color of the divider border. (default: var(--dds-border-neutral-divider))\n * @cssproperty --dds-divider-border-color-inverted - The color of the divider border when inverted. (default: 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'} feedbackType - 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: var(--dds-spacing-200))\n * @cssproperty --dds-feedback-color - The text color of the feedback. (default: var(--dds-text-positive-subtle))\n * @cssproperty --dds-feedback-font-size - The font size of the feedback. (default: var(--dds-font-sm))\n * @cssproperty --dds-feedback-font-weight - The font weight of the feedback. (default: var(--dds-font-weight-bold))\n * @cssproperty --dds-feedback-icon-fill - The fill color of the feedback icon. (default: var(--dds-icon-positive-subtle))\n * @cssproperty --dds-feedback-icon-spacing - The spacing between the icon and text. (default: var(--dds-spacing-100))\n * @cssproperty --dds-feedback-color-warning - The text color for warning feedback. (default: var(--dds-text-neutral-base))\n * @cssproperty --dds-feedback-color-positive - The text color for positive feedback. (default: var(--dds-text-positive-subtle))\n * @cssproperty --dds-feedback-color-negative - The text color for negative feedback. (default: var(--dds-text-negative-subtle))\n * @cssproperty --dds-feedback-icon-fill-warning - The icon fill color for warning feedback. (default: var(--dds-icon-informative-subtle))\n * @cssproperty --dds-feedback-icon-fill-positive - The icon fill color for positive feedback. (default: var(--dds-icon-positive-subtle))\n * @cssproperty --dds-feedback-icon-fill-negative - The icon fill color for negative feedback. (default: 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'\nimport type { DdsFileClickEvent } from '../../events/events'\n      export type { DdsFileRemoveEvent } from '../../events/events'\nexport type { DdsFileClickEvent } 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 * @event {{ file: FileListElement }} dds-file-click - Dispatched when a file is clicked.\n *\n * @slot delete-button - The delete button.\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 * @csspart filename - The filename text of the item component.\n * @csspart filesize - The filesize text of the item component.\n * @csspart spinner - The spinner of the item component.\n * @csspart remove-button - The remove button of the item component.\n * @csspart thumbnail - The thumbnail of the item component.\n *\n * @cssproperty --dds-file-list-item-padding - The padding of the file list item (default: var(--dds-spacing-200))\n * @cssproperty --dds-file-list-item-border-width - The border width of the file list item (default: var(--dds-border-width-base))\n * @cssproperty --dds-file-list-item-border-color - The border color of the file list item (default: var(--dds-border-neutral-transparent))\n * @cssproperty --dds-file-list-item-border-radius - The border radius of the file list item (default: var(--dds-radius-base))\n * @cssproperty --dds-file-list-item-bg-color - The background color of the file list item (default: var(--dds-fields-background-default))\n * @cssproperty --dds-file-list-item-font-weight - The font weight of the file list item (default: var(--dds-font-weight-medium))\n * @cssproperty --dds-file-list-item-disabled-bg-color - The background color of the disabled file list item (default: var(--dds-cold-grey-400))\n * @cssproperty --dds-file-list-item-disabled-color - The text color of the disabled file list item (default: var(--dds-text-neutral-disabled))\n * @cssproperty --dds-file-list-item-content-margin - The margin of the content within the file list item (default: var(--dds-spacing-100) var(--dds-spacing-200))\n * @cssproperty --dds-file-list-item-content-gap - The gap between content elements in the file list item (default: var(--dds-spacing-200))\n * @cssproperty --dds-file-list-item-filename-color - The color of the filename text (default: var(--dds-text-neutral-base))\n * @cssproperty --dds-file-list-item-filesize-color - The color of the filesize text (default: var(--dds-text-neutral-subtle))\n * @cssproperty --dds-file-list-item-feedback-padding-x - The padding of the feedback section (default: var(--dds-spacing-200))\n * @cssproperty --dds-file-list-item-feedback-padding-y - The padding of the feedback section (default: var(--dds-spacing-100))\n * @cssproperty --dds-file-list-item-feedback-border-color - The border color of the feedback section (default: var(--dds-border-neutral-divider))\n * @cssproperty --dds-file-list-item-feedback-font-size - The font size of the feedback text (default: var(--dds-font-sm))\n */\n      const reactWrapper = createComponent({\n        tagName,\n        elementClass: Component,\n        react: React,\n        events: {\n          onDdsFileRemove: 'dds-file-remove' as EventName<DdsFileRemoveEvent>,\nonDdsFileClick: 'dds-file-click' as EventName<DdsFileClickEvent>\n        },\n        displayName: \"DapDSFileInputListItem\"\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/file-input/file-input-list.component.js'\n      import type { DdsFileClickEvent } from '../../events/events'\n      export type { DdsFileClickEvent } from '../../events/events'\n\n      const 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 * @slot delete-button - The delete button.\n *\n * @event {{ file: FileListElement }} dds-file-click - Dispatched when a file is clicked.\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 */\n      const reactWrapper = createComponent({\n        tagName,\n        elementClass: Component,\n        react: React,\n        events: {\n          onDdsFileClick: 'dds-file-click' as EventName<DdsFileClickEvent>\n        },\n        displayName: \"DapDSFileInputList\"\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/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 { DdsFileDeleteErrorEvent } from '../../events/events'\nimport type { DdsFileChangeEvent } from '../../events/events'\nimport type { DdsFilesAcceptedEvent } 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 { DdsFileDeleteErrorEvent } from '../../events/events'\nexport type { DdsFileChangeEvent } from '../../events/events'\nexport type { DdsFilesAcceptedEvent } 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 * @property {string} uploadButtonLabel - The label for the upload button.\n * @property {string} browseButtonLabel - The label for the browse button.\n * @property {string} accept - The file types that the file input accepts.\n * @property {boolean} multiple - Whether the file input accepts multiple files.\n * @property {boolean} keepValue - Whether to keep the value when new files are selected.\n * @property {string} uploadUrl - A remote URL to upload files to.\n * @property {string} deleteUrl - A remote URL to delete uploaded files from. Supports placeholders: `{fileName}`, `{id}`, `{key}`, `{location}`.\n * @property {string} uploadHeaders - Custom headers for upload requests (JSON string).\n * @property {string} deleteHeaders - Custom headers for delete requests (JSON string).\n * @property {boolean} autoupload - Whether to automatically upload files after selection.\n * @property {number} maxFiles - The maximum number of files that can be uploaded.\n * @property {number} maxFileSize - The maximum size of files that can be uploaded (in bytes).\n * @property {number} maxSizePerFile - The maximum size a single file can have (in bytes).\n * @property {string} maxFileSizeErrorText - Text for the max file size error.\n * @property {string} maxSizePerFileErrorText - Text for the max size per file error.\n * @property {string} maxFileAmountErrorText - Text for the max file amount error.\n * @property {string} fileTypeErrorText - Text for the file type error.\n * @property {boolean} showDropzone - Whether to show a separate dropzone area.\n * @property {string} dropzoneText - Text to display in the dropzone.\n * @property {string} dropzoneAriaLabel - Aria label for the dropzone.\n * @property {boolean} showFileList - Whether to show the built-in file list.\n * @property {boolean} confirmRemove - Whether to show confirmation dialog before removing files.\n * @property {string} showUploadButton - Whether to show the upload button. Default is `true`.\n * @property {string} removeButtonLabel - The label for the remove button.\n * @property {string} cancelButtonLabel - The label for the cancel button.\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, errors: FileError[], item?: DapDSFileInputListItem }} dds-upload-error - Fired when a file upload encounters an error. Always contains an errors array, even if there is only one 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 {{ file: FileListElement, error: Error }} dds-file-delete-error - Fired when a file deletion from server encounters an error.\n * @event {{ newFiles: File[], files: File[], canceledFiles: Set<File>, currentFiles: File[] }} dds-file-change - Fired when the file input value changes. This event is cancelable. Event detail contains: `newFiles` (just the files being added in this operation), `currentFiles` (all files that were already selected before this operation), `files` (all files after merge with existing when keepValue=true), and `canceledFiles` (Set to add files you want to reject). You can either: (1) Call `event.preventDefault()` to reject all files, or (2) Add specific files to `canceledFiles` to reject only those files.\n * @event {{ files: File[] }} dds-files-accepted - Fired when the file input value changes. This event is cancelable. Event detail contains: `files` (all files after merge with existing when keepValue=true).\n *\n * @slot dropzone-content - The content to display in the dropzone.\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 * @csspart upload-progress - The upload progress container.\n * @csspart browse-button - The browse button.\n * @csspart upload-button - The upload button.\n * @csspart dropzone - The dropzone area.\n *\n * @cssproperty --dds-file-input-holder-margin - The margin of the input holder in shorthand format: top right bottom left (default: var(--dds-spacing-400) 0 0 0)\n * @cssproperty --dds-file-input-dropzone-padding - The padding of the dropzone (default: var(--dds-spacing-800))\n * @cssproperty --dds-file-input-dropzone-border - The border of the dropzone in shorthand format: width style color (default: var(--dds-border-width-base) dashed var(--dds-border-neutral-subtle))\n * @cssproperty --dds-file-input-dropzone-border-radius - The border radius of the dropzone (default: var(--dds-radius-base))\n * @cssproperty --dds-file-input-dropzone-background - The background of the dropzone (default: var(--dds-color-background-primary))\n * @cssproperty --dds-file-input-dropzone-border-hover - The border of the dropzone on hover in shorthand format: width style color (default: var(--dds-border-width-base) dashed var(--dds-color-border-primary-hover))\n * @cssproperty --dds-file-input-dropzone-background-hover - The background of the dropzone on hover (default: var(--dds-color-background-primary-hover))\n * @cssproperty --dds-file-input-dropzone-border-dragover - The border of the dropzone when dragging over in shorthand format: width style color (default: var(--dds-border-width-base) dashed var(--dds-color-border-accent))\n * @cssproperty --dds-file-input-dropzone-background-dragover - The background of the dropzone when dragging over (default: var(--dds-color-background-accent-light))\n * @cssproperty --dds-file-input-dropzone-border-disabled - The border of the disabled dropzone in shorthand format: width style color (default: var(--dds-border-width-base) dashed var(--dds-border-neutral-disabled))\n * @cssproperty --dds-file-input-dropzone-gap - The gap between elements in the dropzone content (default: var(--dds-spacing-300))\n * @cssproperty --dds-file-input-dropzone-accept-color - The text color of the accepted file types in the dropzone (default: var(--dds-color-text-secondary))\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>,\nonDdsFileDeleteError: 'dds-file-delete-error' as EventName<DdsFileDeleteErrorEvent>,\nonDdsFileChange: 'dds-file-change' as EventName<DdsFileChangeEvent>,\nonDdsFilesAccepted: 'dds-files-accepted' as EventName<DdsFilesAcceptedEvent>\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 * @csspart icon - The icon of the icon.\n * @csspart icon-base - The base of the icon.\n *\n * @cssproperty --dds-icon-button-border-width - Border width of the icon button (default: var(--dds-border-width-base))\n * @cssproperty --dds-icon-button-border-color - Border color of the icon button (default: var(--dds-border-neutral-transparent-interactive, #fff500))\n * @cssproperty --dds-icon-button-border-radius - Border radius of the icon button (default: var(--dds-radius-rounded))\n * @cssproperty --dds-icon-button-hover-border-width - Border width on hover (default: var(--dds-border-width-large))\n * @cssproperty --dds-icon-button-active-border-width - Border width when active (default: var(--dds-border-width-xlarge))\n * @cssproperty --dds-icon-button-transition - Transition property for the icon button (default: var(--dds-transition-all))\n * @cssproperty --dds-icon-button-cursor - Cursor style for the button (default: pointer)\n * @cssproperty --dds-icon-button-disabled-cursor - Cursor style for the disabled button (default: not-allowed)\n * @cssproperty --dds-icon-button-column-gap - Column gap between elements (default: var(--dds-spacing-100))\n * @cssproperty --dds-icon-button-padding-lg - Padding for large size (default: var(--dds-spacing-0))\n * @cssproperty --dds-icon-button-padding-md - Padding for medium size (default: var(--dds-spacing-100))\n * @cssproperty --dds-icon-button-padding-sm - Padding for small size (default: var(--dds-spacing-50))\n * @cssproperty --dds-icon-button-padding-xs - Padding for extra small size (default: var(--dds-spacing-25))\n * @cssproperty --dds-icon-button-size-lg - Size for large icon button (default: var(--dds-spacing-800))\n * @cssproperty --dds-icon-button-size-md - Size for medium icon button (default: var(--dds-spacing-600))\n * @cssproperty --dds-icon-button-size-sm - Size for small icon button (default: var(--dds-spacing-400))\n * @cssproperty --dds-icon-button-size-xs - Size for extra small icon button (default: var(--dds-spacing-300))\n * @cssproperty --dds-icon-button-neutral-bg - Background color for neutral variant (default: var(--dds-transparent-black-subtle))\n * @cssproperty --dds-icon-button-neutral-color - Text color for neutral variant (default: var(--dds-icon-neutral-base))\n * @cssproperty --dds-icon-button-neutral-hover-bg - Hover background color for neutral variant (default: var(--dds-transparent-black-base))\n * @cssproperty --dds-icon-button-neutral-active-bg - Active background color for neutral variant (default: var(--dds-transparent-black-medium))\n * @cssproperty --dds-icon-button-brand-bg - Background color for brand variant (default: var(--dds-button-subtle-background-enabled))\n * @cssproperty --dds-icon-button-brand-color - Text color for brand variant (default: var(--dds-button-subtle-icon-enabled))\n * @cssproperty --dds-icon-button-brand-hover-bg - Hover background color for brand variant (default: var(--dds-button-subtle-background-hover))\n * @cssproperty --dds-icon-button-brand-active-bg - Active background color for brand variant (default: var(--dds-button-subtle-background-pressed))\n * @cssproperty --dds-icon-button-inverted-bg - Background color for inverted variant (default: var(--dds-transparent-white-subtle))\n * @cssproperty --dds-icon-button-inverted-color - Text color for inverted variant (default: var(--dds-button-primary-icon-enabled))\n * @cssproperty --dds-icon-button-inverted-hover-bg - Hover background color for inverted variant (default: var(--dds-transparent-white-base))\n * @cssproperty --dds-icon-button-inverted-active-bg - Active background color for inverted variant (default: var(--dds-transparent-white-medium))\n * @cssproperty --dds-icon-button-inverted-brand-bg - Background color for inverted brand variant (default: var(--dds-button-primary-background-enabled))\n * @cssproperty --dds-icon-button-inverted-brand-color - Text color for inverted brand variant (default: var(--dds-button-primary-icon-enabled))\n * @cssproperty --dds-icon-button-inverted-brand-hover-bg - Hover background color for inverted brand variant (default: var(--dds-button-primary-background-enabled))\n * @cssproperty --dds-icon-button-inverted-brand-active-bg - Active background color for inverted brand variant (default: var(--dds-button-primary-background-enabled))\n * @cssproperty --dds-icon-button-disabled-color - Color for disabled state (default: 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/image-zoom/image-zoom.component.js'\n      import type { DdsZoomEvent } from '../../events/events'\nimport type { DdsUnzoomEvent } from '../../events/events'\n      export type { DdsZoomEvent } from '../../events/events'\nexport type { DdsUnzoomEvent } from '../../events/events'\n\n      const tagName = 'dap-ds-image-zoom'\n\n      /**\n * `dap-ds-image-zoom`\n * @summary An image zoom component that provides a Medium.com-style zoom experience. Click an image to expand it to fill the viewport with a smooth animation.\n * @element dap-ds-image-zoom\n * @title - Image Zoom\n *\n * @property {boolean} open - The open/zoomed state. Can be used for controlled mode.\n * @property {boolean} isDisabled - Disables zoom functionality.\n * @property {number} zoomMargin - Margin in pixels from viewport edges when zoomed. Default is 0.\n * @property {string} expandButtonAriaLabel - Accessible label for the zoom trigger. Default is 'Expand image'.\n * @property {string} unzoomButtonAriaLabel - Accessible label for the unzoom button. Default is 'Minimize image'.\n * @property {boolean} hideButtons - Hides the expand and unzoom buttons. Default is false.\n * @property {boolean} canSwipeToUnzoom - Enables swipe gesture to close when zoomed. Default is true.\n * @property {number} swipeToUnzoomThreshold - Swipe distance in pixels required to trigger unzoom. Default is 10.\n * @property {string} zoomSrc - URL of a higher quality image to display when zoomed. Falls back to the slotted image src.\n *\n * @event {CustomEvent} dds-zoom - Fires when the image is about to zoom. Cancelable via event.preventDefault().\n * @event {CustomEvent} dds-unzoom - Fires after the image has unzoomed.\n *\n * @slot - The image or content element to zoom. Should contain an <img> element.\n *\n * @csspart trigger - The zoom trigger wrapper element.\n * @csspart dialog - The zoom dialog element.\n * @csspart overlay - The backdrop overlay element.\n * @csspart zoomed-image - The zoomed image element.\n * @csspart unzoom-button - The button to close the zoomed view.\n * @csspart expand-button - The button to expand the image.\n *\n * @cssproperty --dds-image-zoom-overlay-bg - Overlay background color (default: rgba(0, 0, 0, 0.8)).\n * @cssproperty --dds-image-zoom-transition-speed - Animation duration (default: 300ms).\n * @cssproperty --dds-image-zoom-transition-timing - Animation timing function (default: var(--dds-easing-ease-in-out, ease-in-out)).\n */\n      const reactWrapper = createComponent({\n        tagName,\n        elementClass: Component,\n        react: React,\n        events: {\n          onDdsZoom: 'dds-zoom' as EventName<DdsZoomEvent>,\nonDdsUnzoom: 'dds-unzoom' as EventName<DdsUnzoomEvent>\n        },\n        displayName: \"DapDSImageZoom\"\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/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} sizeMap - Responsive size map (e.g. \"xs:lg\").\n * @property {string} name - The name of the input.\n * @property {'text' | 'number' | 'button' | 'color' | 'email' | 'hidden' | 'reset' | 'submit' | 'url' | 'password'| 'file' | 'time'} 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-xs - The height of the extra small input. (default: var(--dds-spacing-800)).\n * @cssproperty --dds-input-height-sm - The height of the small input. (default: var(--dds-spacing-1000)).\n * @cssproperty --dds-input-height-lg - The height of the large input. (default: var(--dds-spacing-1200)).\n * @cssproperty --dds-input-padding-xs - The padding of the extra small input. (default: 0 var(--dds-spacing-200)).\n * @cssproperty --dds-input-padding-sm - The padding of the small input. (default: 0 var(--dds-spacing-300)).\n * @cssproperty --dds-input-padding-lg - The padding of the large input. (default: 0 var(--dds-spacing-400)).\n * @cssproperty --dds-input-font-size-xs - The font size of the extra small input. (default: var(--dds-font-sm)).\n * @cssproperty --dds-input-font-size-sm - The font size of the small input. (default: var(--dds-font-base)).\n * @cssproperty --dds-input-font-size-lg - The font size of the large input. (default: var(--dds-font-lg)).\n * @cssproperty --dds-input-border - The border of the input. (default: var(--dds-border-width-base) solid var(--dds-border-neutral-base)).\n * @cssproperty --dds-input-background - The background color of the input. (default: var(--dds-fields-background-default)).\n * @cssproperty --dds-input-text-color - The text color of the input. (default: var(--dds-text-neutral-base)).\n * @cssproperty --dds-input-border-radius - The border radius of the input. (default: var(--dds-radius-base)).\n * @cssproperty --dds-input-disabled-border - The border of the disabled input. (default: 0 solid var(--dds-border-neutral-disabled)).\n * @cssproperty --dds-input-disabled-background - The background color of the disabled input. (default: var(--dds-fields-background-disabled)).\n * @cssproperty --dds-input-disabled-text - The text color of the disabled input. (default: var(--dds-text-neutral-disabled)).\n * @cssproperty --dds-input-readonly-border - The border of the readonly input. (default: 0 solid var(--dds-border-neutral-subtle)).\n * @cssproperty --dds-input-readonly-background - The background color of the readonly input. (default: var(--dds-fields-background-read-only)).\n * @cssproperty --dds-input-readonly-text - The text color of the readonly input. (default: var(--dds-text-neutral-subtle)).\n * @cssproperty --dds-input-success-border - The border of the success input. (default: var(--dds-border-width-base) solid var(--dds-border-positive-base)).\n * @cssproperty --dds-input-error-border - The border of the error input. (default: var(--dds-border-width-base) solid var(--dds-border-negative-base)).\n * @cssproperty --dds-input-addon-background - The background color of the input addon. (default: var(--dds-fields-background-default)).\n * @cssproperty --dds-input-addon-success-background - The background color of the success input addon. (default: var(--dds-fields-background-default)).\n * @cssproperty --dds-input-addon-error-background - The background color of the error input addon. (default: var(--dds-fields-background-default)).\n * @cssproperty --dds-input-addon-border-before - The border of the addon before the input. (default: var(--dds-border-width-base) solid var(--dds-border-neutral-base)).\n * @cssproperty --dds-input-addon-border-after - The border of the addon after the input. (default: var(--dds-border-width-base) solid var(--dds-border-neutral-base)).\n * @cssproperty --dds-input-addon-border-width-before - The border width of the addon before the input. (default: var(--dds-border-width-base) 0 var(--dds-border-width-base) var(--dds-border-width-base)).\n * @cssproperty --dds-input-addon-border-width-after - The border width of the addon after the input. (default: var(--dds-border-width-base) var(--dds-border-width-base) var(--dds-border-width-base) 0).\n * @cssproperty --dds-input-addon-success-border - The border of the success addon. (default: var(--dds-border-width-base) solid var(--dds-border-positive-base)).\n * @cssproperty --dds-input-addon-success-border-before - The border of the success addon before the input. (default: var(--dds-border-width-base) solid var(--dds-border-positive-base)).\n * @cssproperty --dds-input-addon-success-border-after - The border of the success addon after the input. (default: var(--dds-border-width-base) solid var(--dds-border-positive-base)).\n * @cssproperty --dds-input-addon-success-border-width-before - The border width of the success addon before the input. (default: var(--dds-border-width-base) 0 var(--dds-border-width-base) var(--dds-border-width-base)).\n * @cssproperty --dds-input-addon-success-border-width-after - The border width of the success addon after the input. (default: var(--dds-border-width-base) var(--dds-border-width-base) var(--dds-border-width-base) 0).\n * @cssproperty --dds-input-addon-error-border-before - The border of the error addon before the input. (default: var(--dds-border-width-base) solid var(--dds-border-negative-base)).\n * @cssproperty --dds-input-addon-error-border-after - The border of the error addon after the input. (default: var(--dds-border-width-base) solid var(--dds-border-negative-base)).\n * @cssproperty --dds-input-addon-error-border-width-before - The border width of the error addon before the input. (default: var(--dds-border-width-base) 0 var(--dds-border-width-base) var(--dds-border-width-base)).\n * @cssproperty --dds-input-addon-error-border-width-after - The border width of the error addon after the input. (default: var(--dds-border-width-base) var(--dds-border-width-base) var(--dds-border-width-base) 0).\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: var(--dds-background-neutral-subtle)).\n * @cssproperty {string} --dds-label-border-color - The border color of the label container. (default: var(--dds-border-neutral-subtle)).\n * @cssproperty {string} --dds-label-border-width - The border width of the label container. (default: var(--dds-border-width-base)).\n * @cssproperty {string} --dds-label-border-radius - The border radius of the label container. (default: var(--dds-radius-base)).\n * @cssproperty {string} --dds-label-padding - The padding of the label container. (default: var(--dds-spacing-400)).\n * @cssproperty {string} --dds-label-disabled-background - The background color of the label container when disabled. (default: var(--dds-background-neutral-disabled-inverted)).\n * @cssproperty {string} --dds-label-checked-border-color - The border color of the label container when checked. (default: 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 * @slot link - A router link element (e.g. Next.js Link) used for SPA navigation.\n *   Rendered outside the visible link so it is always accessible to programmatic clicks.\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 (default: var(--dds-link-enabled)).\n * @cssproperty --dds-link-hover-color - The color of the link text on hover (default: var(--dds-link-hover)).\n * @cssproperty --dds-link-active-color - The color of the link text when active (default: var(--dds-link-pressed)).\n * @cssproperty --dds-link-visited-color - The color of the visited link text (default: var(--dds-link-pressed)).\n * @cssproperty --dds-link-font-size - The font size of the link text (default: var(--dds-font-base)).\n * @cssproperty --dds-link-line-height - The line height of the link text (default: var(--dds-font-line-height-xlarge)).\n * @cssproperty --dds-link-font-weight - The font weight of the link text (default: var(--dds-font-weight-medium)).\n * @cssproperty --dds-link-text-decoration - The text decoration of the link (default: underline).\n *\n * @cssproperty --dds-link-neutral-color - The color of the neutral variant link (default: var(--dds-link-neutral-enabled)).\n * @cssproperty --dds-link-neutral-hover-color - The hover color of the neutral variant link (default: var(--dds-link-neutral-hover)).\n * @cssproperty --dds-link-neutral-active-color - The active color of the neutral variant link (default: var(--dds-link-neutral-pressed)).\n * @cssproperty --dds-link-neutral-visited-color - The visited color of the neutral variant link (default: var(--dds-link-neutral-pressed)).\n *\n * @cssproperty --dds-link-brand-color - The color of the brand variant link (default: var(--dds-link-enabled)).\n * @cssproperty --dds-link-brand-hover-color - The hover color of the brand variant link (default: var(--dds-link-hover)).\n * @cssproperty --dds-link-brand-active-color - The active color of the brand variant link (default: var(--dds-link-pressed)).\n * @cssproperty --dds-link-brand-visited-color - The visited color of the brand variant link (default: var(--dds-link-pressed)).\n *\n * @cssproperty --dds-link-inverted-color - The color of the inverted variant link (default: var(--dds-link-inverted-enabled)).\n * @cssproperty --dds-link-inverted-hover-color - The hover color of the inverted variant link (default: var(--dds-link-inverted-hover)).\n * @cssproperty --dds-link-inverted-active-color - The active color of the inverted variant link (default: var(--dds-link-inverted-pressed)).\n * @cssproperty --dds-link-inverted-visited-color - The visited color of the inverted variant link (default: var(--dds-link-inverted-visited)).\n *\n * @cssproperty --dds-link-warning-color - The color of the warning variant link (default: var(--dds-banner-action-inverted-enabled)).\n * @cssproperty --dds-link-warning-hover-color - The hover color of the warning variant link (default: var(--dds-banner-action-inverted-hover)).\n * @cssproperty --dds-link-warning-active-color - The active color of the warning variant link (default: var(--dds-banner-action-inverted-pressed)).\n * @cssproperty --dds-link-warning-visited-color - The visited color of the warning variant link (default: var(--dds-banner-action-inverted-enabled)).\n *\n * @cssproperty --dds-link-disabled-color - The color of the disabled link (default: var(--dds-text-neutral-disabled)).\n * @cssproperty --dds-link-disabled-hover-color - The hover color of the disabled link (default: var(--dds-text-neutral-disabled)).\n * @cssproperty --dds-link-disabled-active-color - The active color of the disabled link (default: var(--dds-text-neutral-disabled)).\n * @cssproperty --dds-link-disabled-visited-color - The visited color of the disabled link (default: var(--dds-text-neutral-disabled)).\n *\n * @cssproperty --dds-link-lg-font-size - The font size of the large link (default: var(--dds-font-lg)).\n * @cssproperty --dds-link-lg-line-height - The line height of the large link (default: var(--dds-font-line-height-xlarge)).\n * @cssproperty --dds-link-md-font-size - The font size of the medium link (default: var(--dds-font-base)).\n * @cssproperty --dds-link-md-line-height - The line height of the medium link (default: var(--dds-font-line-height-xlarge)).\n * @cssproperty --dds-link-sm-font-size - The font size of the small link (default: var(--dds-font-sm)).\n * @cssproperty --dds-link-sm-line-height - The line height of the small link (default: var(--dds-font-line-height-xlarge)).\n * @cssproperty --dds-link-xs-font-size - The font size of the extra small link (default: var(--dds-font-xs)).\n * @cssproperty --dds-link-xs-line-height - The line height of the extra small link (default: var(--dds-font-line-height-xlarge)).\n *\n * @cssproperty --dds-link-normal-font-weight - The font weight of the normal link (default: var(--dds-font-weight-medium)).\n * @cssproperty --dds-link-bold-font-weight - The font weight of the bold link (default: var(--dds-font-weight-bold)).\n *\n * @cssproperty --dds-link-no-underline-text-decoration - The text decoration when underline is removed (default: none).\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 * @csspart list-item-base - The base list item container.\n * @csspart icon-container - The container of the icon.\n * @csspart title-container - The container of the title.\n * @csspart description-container - The container of the description.\n * @csspart actions-container - The container of the actions.\n * @csspart iteractive-indicator-container - The container of the interactive indicator.\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 {string} title - Title of the modal.\n * @property {string} description - Description of the modal.\n * @property {boolean} fullScreen - Full screen version of the modal.\n * @property {boolean} noModal - If true, uses `.show()` (no overlay); if false, uses `.showModal()`. Default is false.\n * @property {'sm'|'lg'} size - Size of the modal. Default is 'sm'.\n * @property {string} sizeMap - Breakpoint→size map for the modal (e.g. \"md:lg\").\n *\n * @property {string} header - Whether to show the header. Default is 'true'.\n * @property {string} footer - Whether to show the footer. Default is 'true'.\n *\n * @property {boolean} wideFooter - Wide layout mode for footer.\n * @property {boolean} bottomFooter - Pushes the footer to the bottom.\n * @property {boolean} fixedHeader - Fixes the header to the top.\n * @property {boolean} fixedFooter - Fixes the footer to the bottom.\n *\n * @property {string} closeOnEsc - Whether to close on Escape key. Default is 'true'.\n * @property {string} closeOnOverlayClick - Whether to close on overlay click. Default is 'true'.\n * @property {string} closeButton - Whether to show the close button. Default is 'true'.\n *\n * @property {string} okButtonLabel - Label of the OK button.\n * @property {boolean} okButtonDisabled - Whether the OK button is disabled.\n * @property {boolean} okButtonDanger - Whether the OK button uses danger style.\n * @property {boolean} hideOkButton - Whether to hide the OK button.\n * @property {string} okButtonSize - Override size for the OK button; empty uses modal size.\n * @property {string} okButtonSizeMap - Override sizeMap for the OK button.\n *\n * @property {string} cancelButtonLabel - Label of the Cancel button.\n * @property {boolean} cancelButtonDisabled - Whether the Cancel button is disabled.\n * @property {boolean} cancelButtonDanger - Whether the Cancel button uses danger style.\n * @property {boolean} hideCancelButton - Whether to hide the Cancel button.\n * @property {string} cancelButtonSize - Override size for the Cancel button; empty uses modal size.\n * @property {string} cancelButtonSizeMap - Override sizeMap for the Cancel button.\n *\n * @property {string} closeButtonSize - Override size for the close icon button; empty uses modal size.\n * @property {string} closeButtonSizeMap - Override sizeMap for the close icon button.\n *\n * @property {boolean} useNativeFocus - Use native browser focus handling. 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 header-container - The container of the header.\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-sm - Padding inside the modal. (default: var(--dds-spacing-600)).\n * @cssproperty --dds-modal-padding-lg - Padding inside the modal. (default: var(--dds-spacing-1200)).\n * @cssproperty --dds-modal-transform-amount - Amount to transform for entrance animation. (default: 2rem).\n * @cssproperty --dds-modal-transition-speed - Speed of transition animations. (default: var(--dds-transition-fast)).\n * @cssproperty --dds-modal-transition-timing - Timing function for transitions. (default: var(--dds-easing-ease-in-out)).\n * @cssproperty --dds-modal-border-width - Border width of the modal. (default: var(--dds-border-width-base)).\n * @cssproperty --dds-modal-border-color - Border color of the modal. (default: var(--dds-border-neutral-divider)).\n * @cssproperty --dds-modal-border-radius - Border radius of the modal. (default: var(--dds-radius-large, 16px)).\n * @cssproperty --dds-modal-background - Background color of the modal. (default: var(--dds-background-neutral-subtle)).\n * @cssproperty --dds-modal-header-margin-sm - Margin below the header. (default: var(--dds-spacing-400)).\n * @cssproperty --dds-modal-header-margin-lg - Margin below the header. (default: var(--dds-spacing-600)).\n * @cssproperty --dds-modal-footer-margin-sm - Margin above the footer. (default: var(--dds-spacing-400)).\n * @cssproperty --dds-modal-footer-margin-lg - Margin above the footer. (default: var(--dds-spacing-600)).\n * @cssproperty --dds-modal-footer-gap - Gap between footer elements. (default: var(--dds-spacing-200)).\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    ","\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/navigation-menu/navigation-menu-item.component.js'\n      import type { DdsNavigationItemClickEvent } from '../../events/events'\nimport type { DdsNavigationDropdownOpenEvent } from '../../events/events'\n      export type { DdsNavigationItemClickEvent } from '../../events/events'\nexport type { DdsNavigationDropdownOpenEvent } from '../../events/events'\n\n      const tagName = 'dap-ds-navigation-menu-item'\n\n      /**\n * `dap-ds-navigation-menu-item`\n * @summary A navigation menu item that can contain either a simple link or dropdown content.\n * Supports nested items with cascading flyout behavior. Part of the navigation menu system.\n * This is for NAVIGATION (website menus), not application menus.\n *\n * @element dap-ds-navigation-menu-item\n * @title - Navigation Menu Item\n * @group navigation-menu\n *\n * @property {string} label - The label text for the navigation item. This will be displayed in the title slot if no custom title slot content is provided.\n * @property {'xs' | 'sm' | 'lg'} size - The size of the popup. Default is 'sm'.\n * @property {boolean} disabled - The disabled state of the popup. Default is false.\n * @property {boolean} opened - The open state of the popup. Default is false.\n * @property {'top' | 'right' | 'bottom' | 'left' | 'top-start' | 'top-end' | 'bottom-start' | 'bottom-end' | 'left-start' | 'left-end' | 'right-start' | 'right-end'} placement - The placement of the popup (automatically adjusted based on nesting level). Default is 'bottom-start'.\n * @property {'absolute' | 'fixed'} floatingStrategy - The floating strategy of the popup. Default is 'fixed'.\n * @property {number} offset - The offset of the popup. Default is 0.\n * @property {boolean} sync - Whether the popup should sync its width with the trigger. Default is false.\n * @property {number | 'auto'} maxHeight - The maximum height of the popup. Default is 250.\n * @property {number | 'auto'} maxWidth - The maximum width of the popup. Default is 'auto'.\n * @property {boolean} hasArrow - Whether the popup has an arrow. Default is false.\n * @property {boolean} overflow - Whether the popup should overflow. Default is true.\n * @property {boolean} fullWidth - Whether the popup should take full width of the screen. Default is false.\n * @property {boolean} exactHref - Whether the navigation item should be active if the href is exactly the same as the activeHref. Default is false.\n * @property {string} icon - The name of the icon to display in the trigger.\n * @property {string} ariaLabelledBy - The name of the element that labels the navigation dropdown.\n * @property {string} activeHref - The href of the navigation item that is active (receives aria-current=\"page\").\n * @property {string} baseHref - The href of the navigation item. If provided, the navigation item will be active if the href is a substring of the activeHref.\n * @property {string} href - The href URL for the navigation item link. When provided, the default trigger renders as a link.\n * @property {'_blank' | '_self' | '_parent' | '_top'} target - The target attribute for link navigation.\n * @property {string} rel - The rel attribute for link security and behavior.\n * @property {number} level - The nesting level of this navigation item (0 = top-level, automatically set for nested items). Default is 0.\n * @property {'horizontal' | 'vertical'} orientation - The orientation of the parent navigation menu (automatically inherited). Default is 'horizontal'.\n * @property {'group' | 'items'} tabMode - Controls how Tab key navigates through top-level items. Default is 'group'.\n *\n * @event {{ href: string, event: Event }} dds-navigation-item-click - Fired when a navigation item is clicked.\n * @event {{ item: DapDSNavigationMenuItem }} dds-navigation-dropdown-open - Fired when a navigation dropdown is opened.\n *\n * @slot trigger - The trigger element (link, button, etc.) for this navigation item.\n * @slot title - The title of the navigation item.\n * @slot indicator - The expand indicator icon (defaults to arrow icon based on orientation and level).\n * @slot link - A router link element (e.g. Next.js Link) used for SPA navigation.\n *   Rendered outside the popup so it is always accessible to programmatic clicks.\n * @slot - The dropdown content (can contain nested dap-ds-navigation-menu-item elements).\n *\n * @csspart base - The base part of the navigation item.\n * @csspart trigger - The trigger element part.\n * @csspart trigger-base - The base part of the trigger button (from dap-ds-button).\n * @csspart trigger-content - The content part of the trigger button (from dap-ds-button).\n * @csspart trigger-high-contrast - The high contrast part of the trigger button (from dap-ds-button).\n * @csspart trigger-stack-base - The base part of the trigger stack (from dap-ds-stack).\n * @csspart title - The title slot wrapper.\n * @csspart indicator - The expand indicator container.\n * @csspart indicator-icon - The expand indicator icon part.\n * @csspart indicator-icon-base - The base part of the indicator icon (from dap-ds-icon).\n * @csspart indicator-icon-icon - The icon part of the indicator icon (from dap-ds-icon).\n * @csspart popup - The dropdown popup container.\n * @csspart content - The dropdown content wrapper (default slot).\n * @csspart arrow - The dropdown arrow part.\n *\n * @cssproperty --dds-navigation-menu-item-spacing - The padding/spacing of the navigation menu item content. (default: var(--dds-spacing-200)).\n * @cssproperty --dds-navigation-menu-item-border-width - The border width of the navigation menu item content. (default: var(--dds-border-width-base)).\n * @cssproperty --dds-navigation-menu-item-border-color - The border color of the navigation menu item content. (default: var(--dds-border-neutral-subtle)).\n * @cssproperty --dds-navigation-menu-item-border-radius - The border radius of the navigation menu item content. (default: var(--dds-radius-base)).\n * @cssproperty --dds-navigation-menu-item-background - The background color of the navigation menu item content. (default: var(--dds-background-neutral-base)).\n * @cssproperty --dds-navigation-menu-item-shadow - The box shadow of the navigation menu item content. (default: var(--dds-shadow-base)).\n *\n * @accessibility\n * - Active navigation items marked with `aria-current=\"page\"`\n * - Dropdowns use `aria-expanded` and `aria-haspopup`\n * - No menu/menuitem roles (this is navigation, not an application menu)\n */\n      const reactWrapper = createComponent({\n        tagName,\n        elementClass: Component,\n        react: React,\n        events: {\n          onDdsNavigationItemClick: 'dds-navigation-item-click' as EventName<DdsNavigationItemClickEvent>,\nonDdsNavigationDropdownOpen: 'dds-navigation-dropdown-open' as EventName<DdsNavigationDropdownOpenEvent>\n        },\n        displayName: \"DapDSNavigationMenuItem\"\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/navigation-menu/navigation-menu.component.js'\n      import type { DdsNavigationItemClickEvent } from '../../events/events'\n      export type { DdsNavigationItemClickEvent } from '../../events/events'\n\n      const tagName = 'dap-ds-navigation-menu'\n\n      /**\n * `dap-ds-navigation-menu`\n * @summary A navigation menu for website/application navigation. Supports nested dropdowns with unlimited depth.\n * This is a NAVIGATION component, not an application menu (like dropdowns or context menus).\n * Uses semantic HTML (`<nav>`) and proper navigation ARIA attributes.\n *\n * @element dap-ds-navigation-menu\n * @title - Navigation Menu\n *\n * @property {string} activeHref - The currently active href for highlighting active navigation items with aria-current=\"page\". Defaults to window.location.pathname if not provided.\n * @property {'horizontal' | 'vertical'} orientation - The orientation of the navigation menu. Default is 'horizontal'.\n * @property {boolean} fullWidth - Whether the navigation menu should take full width of the screen. Default is false.\n * @property {boolean} allowMultipleOpen - Whether multiple dropdown branches can stay open simultaneously (accordion mode). Default is true.\n * @property {'group' | 'items'} tabMode - Controls how Tab key navigates through top-level items. Default is 'group'. Group mode will have the first item in the tab order, and items mode will have all items in the tab order.\n *\n * @event {{ href: string, event: Event }} dds-navigation-item-click - Fired when a navigation item is clicked.\n *\n * @slot - The navigation menu list and items.\n *\n * @csspart base - The main navigation menu container (nav element).\n *\n * @cssproperty --dds-navigation-menu-item-gap - The gap between navigation menu items. (default: var(--dds-spacing-100)).\n *\n * @accessibility\n * - Uses semantic `<nav>` element (no menu/menubar roles)\n * - Active items marked with `aria-current=\"page\"`\n * - Keyboard navigation: Tab, Arrow keys, Enter, Escape\n * - Screen readers announce as navigation landmark\n */\n      const reactWrapper = createComponent({\n        tagName,\n        elementClass: Component,\n        react: React,\n        events: {\n          onDdsNavigationItemClick: 'dds-navigation-item-click' as EventName<DdsNavigationItemClickEvent>\n        },\n        displayName: \"DapDSNavigationMenu\"\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 (default: var(--dds-spacing-500))\n * @cssproperty --dds-notification-badge-min-width - Minimum width of the notification badge (default: var(--dds-spacing-500))\n * @cssproperty --dds-notification-badge-height - Height of the notification badge (default: var(--dds-spacing-500))\n * @cssproperty --dds-notification-badge-padding - Padding inside the notification badge (default: 0 var(--dds-spacing-150))\n * @cssproperty --dds-notification-badge-border-radius - Border radius of the notification badge (default: var(--dds-radius-base))\n * @cssproperty --dds-notification-badge-font-size - Font size of the notification badge text (default: var(--dds-font-xs))\n * @cssproperty --dds-notification-badge-dot-size - Size of the dot variant (default: var(--dds-spacing-200))\n * @cssproperty --dds-notification-badge-color - Text color of the notification badge (default: var(--dds-background-neutral-medium))\n * @cssproperty --dds-notification-badge-neutral-bg - Background color for neutral type (default: var(--dds-text-neutral-subtle))\n * @cssproperty --dds-notification-badge-brand-bg - Background color for brand type (default: var(--dds-text-brand-subtle))\n * @cssproperty --dds-notification-badge-info-bg - Background color for info type (default: var(--dds-text-informative-subtle))\n * @cssproperty --dds-notification-badge-positive-bg - Background color for positive type (default: var(--dds-text-positive-subtle))\n * @cssproperty --dds-notification-badge-warning-bg - Background color for warning type (default: var(--dds-text-warning-subtle))\n * @cssproperty --dds-notification-badge-negative-bg - Background color for negative type (default: var(--dds-text-negative-subtle))\n * @cssproperty --dds-notification-badge-circular-offset-x - Horizontal offset for circular positioning (default: 20px)\n * @cssproperty --dds-notification-badge-circular-offset-y - Vertical offset for circular positioning (default: -20px)\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-xs - The height of the extra small input. (default: var(--dds-spacing-800) ).\n * @cssproperty --dds-input-height-sm - The height of the small input. (default: var(--dds-spacing-1000)).\n * @cssproperty --dds-input-height-lg - The height of the large input. (default: var(--dds-spacing-1200)).\n * @cssproperty --dds-input-padding-xs - The padding of the extra small input. (default: 0 var(--dds-spacing-200)).\n * @cssproperty --dds-input-padding-sm - The padding of the small input. (default: 0 var(--dds-spacing-300)).\n * @cssproperty --dds-input-padding-lg - The padding of the large input. (default: 0 var(--dds-spacing-400)).\n * @cssproperty --dds-input-font-size-xs - The font size of the extra small input. (default: var(--dds-font-sm)).\n * @cssproperty --dds-input-font-size-sm - The font size of the small input. (default: var(--dds-font-base)).\n * @cssproperty --dds-input-font-size-lg - The font size of the large input. (default: var(--dds-font-lg)).\n * @cssproperty --dds-input-border - The border of the input. (default: var(--dds-border-width-base) solid var(--dds-border-neutral-base)).\n * @cssproperty --dds-input-background - The background color of the input. (default: var(--dds-fields-background-default)).\n * @cssproperty --dds-input-text-color - The text color of the input. (default: var(--dds-text-neutral-base)).\n * @cssproperty --dds-input-border-radius - The border radius of the input. (default: var(--dds-radius-base)).\n * @cssproperty --dds-input-disabled-border - The border of the disabled input. (default: 0 solid var(--dds-border-neutral-disabled)).\n * @cssproperty --dds-input-disabled-background - The background color of the disabled input. (default: var(--dds-fields-background-disabled)).\n * @cssproperty --dds-input-disabled-text - The text color of the disabled input. (default: var(--dds-text-neutral-disabled)).\n * @cssproperty --dds-input-readonly-border - The border of the readonly input. (default: 0 solid var(--dds-border-neutral-subtle)).\n * @cssproperty --dds-input-readonly-background - The background color of the readonly input. (default: var(--dds-fields-background-read-only)).\n * @cssproperty --dds-input-readonly-text - The text color of the readonly input. (default: var(--dds-text-neutral-subtle)).\n * @cssproperty --dds-input-success-border - The border of the success input. (default: var(--dds-border-width-base) solid var(--dds-border-positive-base)).\n * @cssproperty --dds-input-error-border - The border of the error input. (default: var(--dds-border-width-base) solid var(--dds-border-negative-base)).\n * @cssproperty --dds-input-addon-background - The background color of the input addon. (default: var(--dds-fields-background-default)).\n * @cssproperty --dds-input-addon-success-background - The background color of the success input addon. (default: var(--dds-fields-background-default)).\n * @cssproperty --dds-input-addon-error-background - The background color of the error input addon. (default: var(--dds-fields-background-default)).\n * @cssproperty --dds-input-addon-border-before - The border of the addon before the input. (default: var(--dds-border-width-base) solid var(--dds-border-neutral-base)).\n * @cssproperty --dds-input-addon-border-after - The border of the addon after the input. (default: var(--dds-border-width-base) solid var(--dds-border-neutral-base)).\n * @cssproperty --dds-input-addon-border-width-before - The border width of the addon before the input. (default: var(--dds-border-width-base) 0 var(--dds-border-width-base) var(--dds-border-width-base)).\n * @cssproperty --dds-input-addon-border-width-after - The border width of the addon after the input. (default: var(--dds-border-width-base) var(--dds-border-width-base) var(--dds-border-width-base) 0).\n * @cssproperty --dds-input-addon-success-border - The border of the success addon. (default: var(--dds-border-width-base) solid var(--dds-border-positive-base)).\n * @cssproperty --dds-input-addon-success-border-before - The border of the success addon before the input. (default: var(--dds-border-width-base) solid var(--dds-border-positive-base)).\n * @cssproperty --dds-input-addon-success-border-after - The border of the success addon after the input. (default: var(--dds-border-width-base) solid var(--dds-border-positive-base)).\n * @cssproperty --dds-input-addon-success-border-width-before - The border width of the success addon before the input. (default: var(--dds-border-width-base) 0 var(--dds-border-width-base) var(--dds-border-width-base)).\n * @cssproperty --dds-input-addon-success-border-width-after - The border width of the success addon after the input. (default: var(--dds-border-width-base) var(--dds-border-width-base) var(--dds-border-width-base) 0).\n * @cssproperty --dds-input-addon-error-border-before - The border of the error addon before the input. (default: var(--dds-border-width-base) solid var(--dds-border-negative-base)).\n * @cssproperty --dds-input-addon-error-border-after - The border of the error addon after the input. (default: var(--dds-border-width-base) solid var(--dds-border-negative-base)).\n * @cssproperty --dds-input-addon-error-border-width-before - The border width of the error addon before the input. (default: var(--dds-border-width-base) 0 var(--dds-border-width-base) var(--dds-border-width-base)).\n * @cssproperty --dds-input-addon-error-border-width-after - The border width of the error addon after the input. (default: var(--dds-border-width-base) var(--dds-border-width-base) var(--dds-border-width-base) 0).\n *\n * @csspart base - The main number 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 * @csspart decrement-button - The decrement button of the input.\n * @csspart increment-button - The increment button of the input.\n * @csspart decrement-button-base - The base of the decrement button.\n * @csspart increment-button-base - The base of the increment button.\n * @csspart decrement-button-content - The content of the decrement button.\n * @csspart increment-button-content - The content of the increment button.\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 {string} heading - The heading text of the accordion, this will be used as the aria label of the heading also if ariaLabel is not provided\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-official-banner-background-color - The background color of the official website banner (default: var(--dds-background-brand-medium-inverted))\n * @cssproperty --dds-official-banner-text-color - The text color of the official website banner (default: var(--dds-text-neutral-on-inverted))\n * @cssproperty --dds-official-banner-heading-hover-color - The heading hover color of the official website banner (default: var(--dds-background-brand-medium-inverted))\n * @cssproperty --dds-official-banner-border-radius - The border radius of the official website banner (default: 0)\n * @cssproperty --dds-official-banner-icon-color - The icon color of the official website banner (default: var(--dds-text-neutral-on-inverted))\n * @cssproperty --dds-official-banner-icon-color-hover - The icon hover color of the opener icon official website banner (default: var(--dds-text-neutral-on-inverted))\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-group/option-group.component.js'\n\nconst tagName = 'dap-ds-option-group'\n\n/**\n * `dap-ds-option-group`\n * @summary An option group is a container for grouping related option items.\n * Used with dap-ds-select to create grouped options that render as native optgroup elements.\n * @element dap-ds-option-group\n * @title - Option group\n *\n * @property {string} label - The label of the option group (displayed in native optgroup).\n * @property {boolean} disabled - Whether all options in the group are disabled.\n *\n * @slot - The option items in this group.\n *\n * @csspart base - The main option group container.\n * @csspart label - The label of the option group.\n */\nconst reactWrapper = createComponent({\n  tagName,\n  elementClass: Component,\n  react: React,\n  events: {},\n  displayName: 'DapDSOptionGroup',\n})\n\nexport 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 * @group select,combobox\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 (default: var(--dds-spacing-100))\n * @cssproperty --dds-option-item-padding-horizontal - The horizontal padding of the option item (default: var(--dds-spacing-200))\n * @cssproperty --dds-option-item-border-radius - The border radius of the option item (default: var(--dds-radius-small, 4px))\n * @cssproperty --dds-option-item-color - The text color of the option item (default: var(--dds-text-neutral-base))\n * @cssproperty --dds-option-item-hover-bg - The background color of the option item when hovered (default: var(--dds-background-neutral-medium))\n * @cssproperty --dds-option-item-active-bg - The background color of the option item when active (default: var(--dds-background-neutral-strong))\n * @cssproperty --dds-option-item-disabled-color - The text color of the option item when disabled (default: var(--dds-text-neutral-disabled))\n * @cssproperty --dds-option-item-high-contrast-border - The border color of the option item in high contrast mode (default: var(--dds-border-neutral-transparent-interactive, #fff500))\n * @cssproperty --dds-option-item-selected-font-weight - The font weight of the option item when selected (default: var(--dds-font-weight-bold))\n * @cssproperty --dds-option-item-xs-font-size - The font size of the option item in extra small size (default: var(--dds-font-sm))\n * @cssproperty --dds-option-item-lg-font-size - The font size of the option item in large size (default: var(--dds-font-lg))\n * @cssproperty --dds-option-item-selected-icon-width - The width of the selected icon (default: var(--dds-spacing-400))\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'\nimport type { DdsListChangedEvent } from '../../events/events'\n      export type { DdsCancelEvent } from '../../events/events'\nexport type { DdsOptionChangeEvent } from '../../events/events'\nexport type { DdsKeydownEvent } from '../../events/events'\nexport type { DdsListChangedEvent } 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 * @event {{ elements: DapDSOptionItem[] }} dds-list-changed - Fired when the available options list changes.\n *\n * @csspart base - The main option list container.\n * @csspart option-item - The option item of the option list.\n * @csspart popup-base - The base of the popup.\n * @csspart option-item-base - The base of the option item.\n * @csspart option-item-label - The label of the option item.\n * @csspart option-item-prefix - The prefix of the option item.\n * @csspart option-item-suffix - The suffix of the option item.\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>,\nonDdsListChanged: 'dds-list-changed' as EventName<DdsListChangedEvent>\n        },\n        displayName: \"DapDSOptionList\"\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/overlay/overlay.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'\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'\n\n      const 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 * @property {boolean} open - The open state of the overlay.\n *\n * @event {CustomEvent} dds-before-open - Fires before the overlay opens.\n * @event {CustomEvent} dds-opened - Fires after the overlay opens.\n * @event {CustomEvent} dds-before-close - Fires before the overlay closes.\n * @event {CustomEvent} dds-closed - Fires after the overlay closes.\n *\n * @slot - The content of the overlay.\n *\n * @csspart base - The overlay element\n *\n * @cssproperty --dds-overlay-z-index - Controls the z-index of the overlay (default: 1)\n * @cssproperty --dds-overlay-background - Controls the background 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 * @cssproperty --dds-overlay-transition-duration - Controls the transition duration (default: var(--dds-transition-fast))\n * @cssproperty --dds-overlay-transition-timing - Controls the transition timing function (default: var(--dds-easing-ease-in-out))\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>\n        },\n        displayName: \"DapDSOverlay\"\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/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 * @csspart page-size - The page size select.\n * @csspart pager-button-first-base - The base of the first page button.\n * @csspart pager-button-first-content - The content of the first page button.\n * @csspart pager-button-previous-base - The base of the previous page button.\n * @csspart pager-button-previous-content - The content of the previous page button.\n * @csspart pager-button-next-base - The base of the next page button.\n * @csspart pager-button-next-content - The content of the next page button.\n * @csspart pager-button-last-base - The base of the last page button.\n * @csspart pager-button-last-content - The content of the last page button.\n * @csspart page-size-select-base - The base of the page size select.\n * @csspart page-size-select-trigger - The trigger of the page size select.\n *\n * @cssproperty --dds-pager-spacing-vertical - The vertical spacing of the pager (default: var(--dds-spacing-400))\n * @cssproperty --dds-pager-spacing-horizontal - The horizontal spacing of the pager (default: var(--dds-spacing-200))\n * @cssproperty --dds-pager-button-padding - The padding of the pager buttons (default: var(--dds-spacing-150))\n * @cssproperty --dds-pager-button-border-width - The border width of the pager buttons (default: var(--dds-border-width-base, 1px))\n * @cssproperty --dds-pager-button-border-color - The border color of the pager buttons (default: var(--dds-button-subtle-border-neutral-enabled))\n * @cssproperty --dds-pager-button-border-radius - The border radius of the pager buttons (default: var(--dds-radius-rounded))\n * @cssproperty --dds-pager-button-background - The background color of the pager buttons (default: var(--dds-button-subtle-background-neutral-enabled))\n * @cssproperty --dds-pager-button-font-size - The font size of the pager buttons (default: var(--dds-font-sm, 14px))\n * @cssproperty --dds-pager-button-font-weight - The font weight of the pager buttons (default: var(--dds-font-weight-bold, 700))\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-xs - The height of the extra small input. (default: var(--dds-spacing-800)).\n * @cssproperty --dds-input-height-sm - The height of the small input. (default: var(--dds-spacing-1000)).\n * @cssproperty --dds-input-height-lg - The height of the large input. (default: var(--dds-spacing-1200)).\n * @cssproperty --dds-input-padding-xs - The padding of the extra small input. (default: 0 var(--dds-spacing-200)).\n * @cssproperty --dds-input-padding-sm - The padding of the small input. (default: 0 var(--dds-spacing-300)).\n * @cssproperty --dds-input-padding-lg - The padding of the large input. (default: 0 var(--dds-spacing-400)).\n * @cssproperty --dds-input-font-size-xs - The font size of the extra small input. (default: var(--dds-font-sm)).\n * @cssproperty --dds-input-font-size-sm - The font size of the small input. (default: var(--dds-font-base)).\n * @cssproperty --dds-input-font-size-lg - The font size of the large input. (default: var(--dds-font-lg)).\n * @cssproperty --dds-input-border - The border of the input. (default: var(--dds-border-width-base) solid var(--dds-border-neutral-base)).\n * @cssproperty --dds-input-background - The background color of the input. (default: var(--dds-fields-background-default)).\n * @cssproperty --dds-input-text-color - The text color of the input. (default: var(--dds-text-neutral-base)).\n * @cssproperty --dds-input-border-radius - The border radius of the input. (default: var(--dds-radius-base)).\n * @cssproperty --dds-input-disabled-border - The border of the disabled input. (default: 0 solid var(--dds-border-neutral-disabled)).\n * @cssproperty --dds-input-disabled-background - The background color of the disabled input. (default: var(--dds-fields-background-disabled)).\n * @cssproperty --dds-input-disabled-text - The text color of the disabled input. (default: var(--dds-text-neutral-disabled)).\n * @cssproperty --dds-input-readonly-border - The border of the readonly input. (default: 0 solid var(--dds-border-neutral-subtle)).\n * @cssproperty --dds-input-readonly-background - The background color of the readonly input. (default: var(--dds-fields-background-read-only)).\n * @cssproperty --dds-input-readonly-text - The text color of the readonly input. (default: var(--dds-text-neutral-subtle)).\n * @cssproperty --dds-input-success-border - The border of the success input. (default: var(--dds-border-width-base) solid var(--dds-border-positive-base)).\n * @cssproperty --dds-input-error-border - The border of the error input. (default: var(--dds-border-width-base) solid var(--dds-border-negative-base)).\n * @cssproperty --dds-input-addon-background - The background color of the input addon. (default: var(--dds-fields-background-default)).\n * @cssproperty --dds-input-addon-success-background - The background color of the success input addon. (default: var(--dds-fields-background-default)).\n * @cssproperty --dds-input-addon-error-background - The background color of the error input addon. (default: var(--dds-fields-background-default)).\n * @cssproperty --dds-input-addon-border-before - The border of the addon before the input. (default: var(--dds-border-width-base) solid var(--dds-border-neutral-base)).\n * @cssproperty --dds-input-addon-border-after - The border of the addon after the input. (default: var(--dds-border-width-base) solid var(--dds-border-neutral-base)).\n * @cssproperty --dds-input-addon-border-width-before - The border width of the addon before the input. (default: var(--dds-border-width-base) 0 var(--dds-border-width-base) var(--dds-border-width-base)).\n * @cssproperty --dds-input-addon-border-width-after - The border width of the addon after the input. (default: var(--dds-border-width-base) var(--dds-border-width-base) var(--dds-border-width-base) 0).\n * @cssproperty --dds-input-addon-success-border - The border of the success addon. (default: var(--dds-border-width-base) solid var(--dds-border-positive-base)).\n * @cssproperty --dds-input-addon-success-border-before - The border of the success addon before the input. (default: var(--dds-border-width-base) solid var(--dds-border-positive-base)).\n * @cssproperty --dds-input-addon-success-border-after - The border of the success addon after the input. (default: var(--dds-border-width-base) solid var(--dds-border-positive-base)).\n * @cssproperty --dds-input-addon-success-border-width-before - The border width of the success addon before the input. (default: var(--dds-border-width-base) 0 var(--dds-border-width-base) var(--dds-border-width-base)).\n * @cssproperty --dds-input-addon-success-border-width-after - The border width of the success addon after the input. (default: var(--dds-border-width-base) var(--dds-border-width-base) var(--dds-border-width-base) 0).\n * @cssproperty --dds-input-addon-error-border-before - The border of the error addon before the input. (default: var(--dds-border-width-base) solid var(--dds-border-negative-base)).\n * @cssproperty --dds-input-addon-error-border-after - The border of the error addon after the input. (default: var(--dds-border-width-base) solid var(--dds-border-negative-base)).\n * @cssproperty --dds-input-addon-error-border-width-before - The border width of the error addon before the input. (default: var(--dds-border-width-base) 0 var(--dds-border-width-base) var(--dds-border-width-base)).\n * @cssproperty --dds-input-addon-error-border-width-after - The border width of the error addon after the input. (default: var(--dds-border-width-base) var(--dds-border-width-base) var(--dds-border-width-base) 0).\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 show-button - The show button of the password input.\n * @csspart show-button-base - The base of the show button.\n * @csspart show-button-content - The content of the show button.\n * @csspart show-icon - The show icon of the password input.\n * @csspart show-icon-base - The base of the show icon.\n * @csspart hide-button - The hide button of the password input.\n * @csspart hide-button-base - The base of the hide button.\n * @csspart hide-button-content - The content of the hide button.\n * @csspart hide-icon - The hide icon of the password input.\n * @csspart hide-icon-base - The base of the hide 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'\nimport type { DdsCloseEvent } from '../../events/events'\n      export type { DdsOpenedEvent } from '../../events/events'\nexport type { DdsClosedEvent } from '../../events/events'\nexport type { DdsCloseEvent } 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 * @property {boolean} disabled - The disabled state of the popup.\n * @property {boolean} opened - The open state of the popup.\n * @property {'top' | 'right' | 'bottom' | 'left' | 'top-start' | 'top-end' | 'bottom-start' | 'bottom-end' | 'left-start' | 'left-end' | 'right-start' | 'right-end'} placement - The placement of the popup.\n * @property {'absolute' | 'fixed'} floatingStrategy - The floating strategy of the popup.\n * @property {number} offset - The offset of the popup.\n * @property {boolean} sync - Whether the popup should sync its width with the trigger.\n * @property {number | 'auto'} maxHeight - The maximum height of the popup.\n * @property {number | 'auto'} maxWidth - The maximum width of the popup.\n * @property {boolean} hasArrow - Whether the popup has an arrow.\n * @property {boolean} overflow - Whether the popup should overflow.\n * @property {boolean} fullWidth - Whether the popup should take full width of the screen.\n *\n * @event {{ void }} dds-opened - Fired when the popup is opened.\n * @event {{ void }} dds-closed - Fired when the popup is closed.\n * @event {{ void }} dds-close - Fired when the popup should be 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 (default: var(--dds-z-index-20))\n * @cssproperty --dds-popup-padding - Default padding of the popup (default: var(--dds-spacing-400))\n * @cssproperty --dds-popup-padding-xs - Padding of the popup when size is xs (default: var(--dds-spacing-200))\n * @cssproperty --dds-popup-padding-lg - Padding of the popup when size is lg (default: var(--dds-spacing-500))\n * @cssproperty --dds-popup-border-width - Border width of the popup (default: var(--dds-border-width-base))\n * @cssproperty --dds-popup-border-radius - Border radius of the popup (default: var(--dds-radius-base))\n * @cssproperty --dds-popup-border-color - Border color of the popup (default: var(--dds-border-neutral-subtle))\n * @cssproperty --dds-popup-background - Background color of the popup (default: var(--dds-background-neutral-base))\n * @cssproperty --dds-popup-color - Text color of the popup (default: var(--dds-text-neutral-base))\n * @cssproperty --dds-popup-arrow-size - Size of the popup arrow (default: var(--dds-tooltip-arrow-size))\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>,\nonDdsClose: 'dds-close' as EventName<DdsCloseEvent>\n        },\n        displayName: \"DapDSPopup\"\n      })\n\n      export default reactWrapper\n    ","import { createComponent } from '@lit/react'\nimport * as React from 'react'\n\nimport Component from '../../components/progress/progress.component.js'\n\nconst tagName = 'dap-ds-progress'\n\n/**\n * `dap-ds-progress`\n * @summary Progress indicator component with linear and circular variants.\n * @element dap-ds-progress\n * @title - Progress\n *\n * @csspart base - The main progress container.\n * @csspart track - The progress track (background).\n * @csspart fill - The progress fill (bar for linear, circle for circular).\n * @csspart label - The progress label text.\n * @csspart percentage - The percentage text (circular variant only).\n * @csspart background - The background circle (circular variant only).\n *\n * @slot label - Custom label content for the progress indicator.\n *\n * @cssprop --dds-progress-track-color - Background color of the progress track (default: var(--dds-neutral-200))\n * @cssprop --dds-progress-fill-color-neutral - Fill color for neutral variant (default: var(--dds-icon-neutral-base))\n * @cssprop --dds-progress-fill-color-brand - Fill color for brand variant (default: var(--dds-icon-brand-subtle))\n * @cssprop --dds-progress-fill-color-negative - Fill color for negative variant (default: var(--dds-icon-negative-subtle))\n * @cssprop --dds-progress-fill-color-positive - Fill color for positive variant (default: var(--dds-icon-positive-subtle))\n * @cssprop --dds-progress-fill-color-inverted - Fill color for inverted variant (default: var(--dds-icon-neutral-inverted))\n * @cssprop --dds-progress-height-xs - Height for extra small linear progress (default: var(--dds-spacing-50))\n * @cssprop --dds-progress-height-sm - Height for small linear progress (default: var(--dds-spacing-100))\n * @cssprop --dds-progress-height-md - Height for medium linear progress (default: var(--dds-spacing-150))\n * @cssprop --dds-progress-height-lg - Height for large linear progress (default: var(--dds-spacing-200))\n * @cssprop --dds-progress-height-xl - Height for extra large linear progress (default: var(--dds-spacing-300))\n * @cssprop --dds-progress-height-xxl - Height for extra extra large linear progress (default: var(--dds-spacing-400))\n * @cssprop --dds-progress-diameter-xs - Diameter for extra small circular progress (default: var(--dds-spacing-600))\n * @cssprop --dds-progress-diameter-sm - Diameter for small circular progress (default: var(--dds-spacing-800))\n * @cssprop --dds-progress-diameter-md - Diameter for medium circular progress (default: var(--dds-spacing-1200))\n * @cssprop --dds-progress-diameter-lg - Diameter for large circular progress (default: var(--dds-spacing-1600))\n * @cssprop --dds-progress-diameter-xl - Diameter for extra large circular progress (default: var(--dds-spacing-2000))\n * @cssprop --dds-progress-diameter-xxl - Diameter for extra extra large circular progress (default: var(--dds-spacing-2400))\n * @cssprop --dds-progress-stroke-width - Stroke width for circular progress (default: var(--dds-spacing-200))\n * @cssprop --dds-progress-animation-duration - Duration of indeterminate animation (default: 1.5s)\n *\n * @property { 'xs' | 'sm' | 'md' | 'lg' | 'xl' | 'xxl' } size - The size of the progress indicator. Default is `sm`. See SizedMixin.\n * @property {string} sizeMap - Responsive size map (e.g. \"md:lg\"); see SizedMixin.\n */\nconst reactWrapper = createComponent({\n  tagName,\n  elementClass: Component,\n  react: React,\n  events: {},\n  displayName: 'DapDSProgress',\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/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 * @event {{ checked: boolean, value: string, disabled: boolean, readonly: boolean, type: 'radio' }} 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 {{ checked: boolean, value: string, disabled: boolean, readonly: boolean }} dds-input - Emitted when the radio button receives input.\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 - Whether the radio button is checked.\n * @property {string} label - The label of the radio button.\n * @property {string} description - The description of the radio button.\n * @property {boolean} disabled - Whether the radio button is disabled.\n * @property {boolean} readonly - Whether the radio button is readonly (cannot be changed but value is submitted with form).\n * @property {boolean} required - Whether the radio button is required.\n * @property {'xs' | 'sm' | 'lg'} size - The size of the radio button. Default is 'sm'.\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 radio button.\n * @property {'negative' | 'positive' | 'warning'} feedbackType - The feedback type of the radio button.\n * @property {boolean} invalid - The invalid state of the radio button.\n * @property {boolean} optional - The optional state of the radio button.\n * @property {string} optionalLabel - The optional label of the radio button.\n * @property {boolean} preventDefault - Whether the radio button should prevent the default action.\n * @property {boolean} focusable - Whether the radio button is focusable.\n * @property {'normal' | 'background'} type - The type of the radio button.\n * @property {boolean} border - This sets up a border around the radio button, when true.\n *\n * @csspart base - The main radio button container.\n * @csspart wrapper - The wrapper of the radio button.\n * @csspart base-label - 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 label-container - The label container 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 * @cssproperty --dds-radio-readonly-border-color - Sets the border color when the radio button is readonly. (default: var(--dds-border-neutral-subtle))\n * @cssproperty --dds-radio-readonly-background-color - Sets the background color when the radio button is readonly. (default: var(--dds-background-neutral-subtle))\n * @cssproperty --dds-radio-readonly-icon-color - Sets the color of the radio button icon when readonly. (default: var(--dds-text-neutral-base))\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","import { createComponent } from '@lit/react'\nimport * as React from 'react'\n\nimport Component from '../../components/scroll-progress/scroll-progress.component.js'\n\nconst tagName = 'dap-ds-scroll-progress'\n\n/**\n * `dap-ds-scroll-progress`\n * @summary A progress bar that displays scroll position, supporting both page-level and container-level scroll tracking.\n * @element dap-ds-scroll-progress\n * @title - Scroll Progress\n *\n * @csspart base - The main scroll progress container.\n * @csspart track - The progress track (background).\n * @csspart fill - The progress fill bar.\n *\n * @cssprop --dds-scroll-progress-z-index - Z-index for fixed positioning (default: 1000)\n * @cssprop --dds-scroll-progress-transition - Transition for progress updates (default: width 0.1s ease-out)\n * @cssprop --dds-scroll-progress-track-color - Background color of the progress track (default: var(--dds-neutral-200))\n * @cssprop --dds-scroll-progress-fill-color-neutral - Fill color for neutral variant\n * @cssprop --dds-scroll-progress-fill-color-brand - Fill color for brand variant\n * @cssprop --dds-scroll-progress-fill-color-negative - Fill color for negative variant\n * @cssprop --dds-scroll-progress-fill-color-positive - Fill color for positive variant\n * @cssprop --dds-scroll-progress-fill-color-inverted - Fill color for inverted variant\n *\n * @property { 'xxs' | 'xs' | 'sm' | 'md' | 'lg' } size - The size of the scroll progress bar. Default is `sm`. See SizedMixin.\n * @property {string} sizeMap - Responsive size map (e.g. \"md:lg\"); see SizedMixin.\n */\nconst reactWrapper = createComponent({\n  tagName,\n  elementClass: Component,\n  react: React,\n  events: {},\n  displayName: 'DapDSScrollProgress',\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 {boolean} 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 {string} clearButton - Whether the search is clearable. Default is 'true'.\n * @property {string} feedback - The feedback content of the search.\n * @property {'negative' | 'positive' | '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} textComplete - 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-background - The background color of the combobox. (default: var(--dds-fields-background-default))\n * @cssproperty --dds-combobox-border-color - The border color of the combobox. (default: var(--dds-border-neutral-base))\n * @cssproperty --dds-combobox-border-width - The border width of the combobox. (default: var(--dds-border-width-base, 1px))\n * @cssproperty --dds-combobox-border-radius - The border radius of the combobox. (default: var(--dds-radius-base))\n * @cssproperty --dds-combobox-text-color - The text color of the combobox. (default: var(--dds-text-neutral-base))\n * @cssproperty --dds-combobox-placeholder-color - The placeholder text color. (default: var(--dds-text-neutral-subtle))\n * @cssproperty --dds-combobox-disabled-background - The background color when disabled. (default: var(--dds-background-neutral-stronger))\n * @cssproperty --dds-combobox-disabled-text - The text color when disabled. (default: var(--dds-text-neutral-disabled))\n * @cssproperty --dds-combobox-error-border - The border color for error state. (default: var(--dds-border-negative-base))\n * @cssproperty --dds-combobox-success-border - The border color for success state. (default: var(--dds-border-positive-base))\n * @cssproperty --dds-combobox-icon-color - The color of the icons. (default: var(--dds-text-icon-neutral-subtle))\n * @cssproperty --dds-combobox-loading-spinner-color - The color of the loading spinner. (default: var(--dds-icon-neutral-base))\n * @cssproperty --dds-combobox-clear-icon-color - The color of the clear icon. (default: var(--dds-button-subtle-icon-neutral-enabled))\n * @cssproperty --dds-combobox-popup-background - The background color of the popup. (default: var(--dds-background-neutral-subtle))\n * @cssproperty --dds-combobox-popup-shadow - The box shadow of the popup. (default: 0 4px 6px -1px rgba(0, 0, 0, 0.08), 0 2px 4px -1px rgba(0, 0, 0, 0.06))\n * @cssproperty --dds-combobox-icon-opened-transform - The transform of the icon when the combobox is opened (default: rotate(90deg)).\n * @cssproperty --dds-combobox-padding-xs - The padding for extra small size. (default: var(--dds-spacing-200))\n * @cssproperty --dds-combobox-padding-sm - The padding for small size. (default: var(--dds-spacing-200))\n * @cssproperty --dds-combobox-padding-lg - The padding for large size. (default: var(--dds-spacing-300))\n * @cssproperty --dds-combobox-padding-horizontal - The horizontal padding. (default: var(--dds-spacing-300))\n * @cssproperty --dds-combobox-padding-vertical - The vertical padding. (default: var(--dds-spacing-200))\n * @cssproperty --dds-combobox-gap - The gap between elements. (default: var(--dds-spacing-100))\n * @cssproperty --dds-combobox-icon-gap - The gap between icons. (default: var(--dds-spacing-200))\n * @cssproperty --dds-combobox-action-gap - The gap between action elements. (default: var(--dds-spacing-200))\n * @cssproperty --dds-combobox-action-padding - The padding for action elements. (default: var(--dds-spacing-300))\n * @cssproperty --dds-combobox-clear-icon-width - The width of the clear icon. (default: var(--dds-spacing-800))\n * @cssproperty --dds-combobox-dropdown-icon-right - The right position of the dropdown icon. (default: var(--dds-spacing-600))\n * @cssproperty --dds-combobox-min-width - The minimum width of the combobox. (default: 7.5rem)\n * @cssproperty --dds-combobox-chips-gap - The gap between chips. (default: var(--dds-spacing-100))\n * @cssproperty --dds-combobox-chips-padding - The padding for chips. (default: var(--dds-spacing-100))\n * @cssproperty --dds-combobox-chips-max-height - The maximum height of the chips. (default: 120px)\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 * @csspart input - The input 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'\nimport type { DdsOpenedEvent } from '../../events/events'\nimport type { DdsClosedEvent } from '../../events/events'\n      export type { DdsChangeEvent } from '../../events/events'\nexport type { DdsBlurEvent } from '../../events/events'\nexport type { DdsFocusEvent } from '../../events/events'\nexport type { DdsOpenedEvent } from '../../events/events'\nexport type { DdsClosedEvent } 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 * @event {{ void }} dds-opened - Emitted when the select dropdown is opened.\n * @event {{ void }} dds-closed - Emitted when the select dropdown is closed.\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 popup-base - The base of the popup.\n * @csspart option-list - The option list of the select.\n * @csspart option-item - The option item of the select.\n * @csspart option-item-base - The base of the option item.\n * @csspart option-item-label - The label of the option item.\n * @csspart option-item-prefix - The prefix of the option item.\n * @csspart option-item-suffix - The suffix of the option item.\n * @csspart indicator-icon - The indicator icon of the select.\n * @csspart mobile-tray - The mobile tray of the select.\n * @csspart mobile-content - The mobile content of the select.\n * @csspart mobile-body - The mobile body of the select.\n * @csspart mobile-header - The mobile header of the select.\n * @csspart mobile-footer - The mobile footer 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 * @cssproperty --dds-select-icon-opened-transform - Transform of the icon when the select is opened (default: rotate(90deg))\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>,\nonDdsOpened: 'dds-opened' as EventName<DdsOpenedEvent>,\nonDdsClosed: 'dds-closed' as EventName<DdsClosedEvent>\n        },\n        displayName: \"DapDSSelect\"\n      })\n\n      export default reactWrapper\n    ","import { createComponent } from '@lit/react'\nimport * as React from 'react'\n\nimport Component from '../../components/sidenav/sidenav-group.component.js'\n\nconst 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 * @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 (default: var(--dds-spacing-100))\n * @cssproperty --dds-sidenav-group-border-radius - Border radius of the sidenav group (default: var(--dds-radius-base))\n * @cssproperty --dds-sidenav-group-spacing-margin - Margin used for spacing variants (default: var(--dds-spacing-400))\n * @cssproperty --dds-sidenav-group-item-min-height-xs - Minimum height of the sidenav group item (default: var(--dds-spacing-800))\n * @cssproperty --dds-sidenav-group-item-min-height-sm - Minimum height of the sidenav group item (default: var(--dds-spacing-1000))\n * @cssproperty --dds-sidenav-group-item-min-height-lg - Minimum height of the sidenav group item (default: var(--dds-spacing-1200))\n * @cssproperty --dds-sidenav-group-item-padding-xs - Padding of the sidenav group item (default: var(--dds-spacing-100) var(--dds-spacing-300))\n * @cssproperty --dds-sidenav-group-item-padding-sm - Padding of the sidenav group item (default: var(--dds-spacing-200) var(--dds-spacing-400))\n * @cssproperty --dds-sidenav-group-item-padding-lg - Padding of the sidenav group item (default: var(--dds-spacing-300) var(--dds-spacing-500))\n * @cssproperty --dds-sidenav-group-item-color - Text color of the sidenav group item (default: var(--dds-text-neutral-base))\n * @cssproperty --dds-sidenav-group-item-font-size-xs - Font size of the sidenav group item (default: var(--dds-font-sm))\n * @cssproperty --dds-sidenav-group-item-font-size-sm - Font size of the sidenav group item (default: var(--dds-font-base))\n * @cssproperty --dds-sidenav-group-item-font-size-lg - Font size of the sidenav group item (default: var(--dds-font-lg))\n * @cssproperty --dds-sidenav-group-item-font-weight - Font weight of the sidenav group item (default: var(--dds-font-weight-medium))\n * @cssproperty --dds-sidenav-group-item-bg-active - Background color when the item is active (default: var(--dds-transparent-black-subtle))\n * @cssproperty --dds-sidenav-group-item-bg-hover - Background color on hover and active states (default: var(--dds-transparent-black-base))\n * @cssproperty --dds-sidenav-group-toggle-margin - Margin for the toggle button (default: var(--dds-spacing-300))\n * @cssproperty --dds-sidenav-group-submenu-padding - Padding for the submenu (default: var(--dds-spacing-300) 0)\n */\nconst reactWrapper = createComponent({\n  tagName,\n  elementClass: Component,\n  react: React,\n  events: {},\n  displayName: 'DapDSSideNavGroup',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport * as React from 'react'\n\nimport Component from '../../components/sidenav/sidenav-item.component.js'\n\nconst 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 * @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-xs - Minimum height of the sidenav item (default: var(--dds-spacing-800))\n * @cssproperty --dds-sidenav-item-min-height-sm - Minimum height of the sidenav item (default: var(--dds-spacing-1000))\n * @cssproperty --dds-sidenav-item-min-height-lg - Minimum height of the sidenav item (default: var(--dds-spacing-1200))\n * @cssproperty --dds-sidenav-item-margin-bottom - Default bottom margin of the sidenav item (default: var(--dds-spacing-100))\n * @cssproperty --dds-sidenav-item-padding-xs - Padding of the sidenav item (default: var(--dds-spacing-100) var(--dds-spacing-300))\n * @cssproperty --dds-sidenav-item-padding-sm - Padding of the sidenav item (default: var(--dds-spacing-200) var(--dds-spacing-400))\n * @cssproperty --dds-sidenav-item-padding-lg - Padding of the sidenav item (default: var(--dds-spacing-300) var(--dds-spacing-500))\n * @cssproperty --dds-sidenav-item-radius - Border radius of the sidenav item (default: var(--dds-radius-base))\n * @cssproperty --dds-sidenav-item-color - Text color of the sidenav item (default: var(--dds-text-neutral-base))\n * @cssproperty --dds-sidenav-item-font-size-xs - Font size of the sidenav item (default: var(--dds-font-sm))\n * @cssproperty --dds-sidenav-item-font-size-sm - Font size of the sidenav item (default: var(--dds-font-base))\n * @cssproperty --dds-sidenav-item-font-size-lg - Font size of the sidenav item (default: var(--dds-font-lg))\n * @cssproperty --dds-sidenav-item-font-weight - Font weight of the sidenav item (default: var(--dds-font-weight-medium))\n * @cssproperty --dds-sidenav-item-spacing-margin - Margin used for spacing variants (default: var(--dds-spacing-400))\n * @cssproperty --dds-sidenav-item-bg-active - Background color when the item is active (default: var(--dds-transparent-black-subtle))\n * @cssproperty --dds-sidenav-item-bg-hover - Background color on hover and active states (default: var(--dds-transparent-black-base))\n */\nconst reactWrapper = createComponent({\n  tagName,\n  elementClass: Component,\n  react: React,\n  events: {},\n  displayName: 'DapDSSideNavItem',\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/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/skeleton/skeleton.component.js'\n\nconst tagName = 'dap-ds-skeleton'\n\n/**\n * `dap-ds-skeleton`\n * @summary A skeleton loader component for displaying placeholder content while loading.\n * @element dap-ds-skeleton\n * @title - Skeleton\n *\n * @example Basic Usage\n * ```html\n * <dap-ds-skeleton></dap-ds-skeleton>\n * <dap-ds-skeleton variant=\"circular\"></dap-ds-skeleton>\n * <dap-ds-skeleton variant=\"rectangular\" width=\"200px\" height=\"100px\"></dap-ds-skeleton>\n * <dap-ds-skeleton animation=\"custom\" custom-keyframes=\"0% { transform: scale(1); } 50% { transform: scale(1.1); } 100% { transform: scale(1); }\"></dap-ds-skeleton>\n * ```\n *\n * @csspart base - The main skeleton container.\n *\n * @cssprop --dds-skeleton-color - The base color of the skeleton (default: linear-gradient(90deg, transparent, rgb(0 0 0 / 10%), transparent))\n * @cssprop --dds-skeleton-animation-duration - Duration of the loading animation (default: 1.5s)\n * @cssprop --dds-skeleton-border-radius - Border radius for rectangular skeletons (default: var(--dds-radius-small))\n * @cssprop --dds-skeleton-text-spacing - Spacing between text lines in text variant (default: var(--dds-spacing-100))\n * @cssprop --dds-skeleton-animation-timing-function - Timing function for the loading animation (default: ease-in-out)\n */\nconst reactWrapper = createComponent({\n  tagName,\n  elementClass: Component,\n  react: React,\n  events: {},\n  displayName: 'DapDSSkeleton',\n})\n\nexport 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 (default: clamp(var(--dds-spacing-6000), 20vw, var(--dds-containers-xsmall)))\n * @cssproperty --dds-snackbar-gap - Gap between snackbar elements (default: var(--dds-spacing-400))\n * @cssproperty --dds-snackbar-padding - Padding inside the snackbar (default: var(--dds-spacing-400))\n * @cssproperty --dds-snackbar-margin-bottom - Bottom margin of the snackbar (default: var(--dds-spacing-400))\n * @cssproperty --dds-snackbar-transition - Transition property for the snackbar (default: transform var(--dds-transition-slow) var(--dds-easing-ease-out)allow-discrete, opacity var(--dds-transition-slow) var(--dds-easing-ease-out) allow-discrete, margin var(--dds-transition-slow) var(--dds-easing-ease-out) allow-discrete, box-shadow var(--dds-transition-slow) var(--dds-easing-ease-out) allow-discrete)\n * @cssproperty --dds-snackbar-border-radius - Border radius of the snackbar (default: var(--dds-radius-base))\n * @cssproperty --dds-snackbar-font-size - Font size used in the snackbar (default: var(--dds-font-sm))\n * @cssproperty --dds-snackbar-background - Background color of the snackbar (default: var(--dds-snackbar-error-background))\n * @cssproperty --dds-snackbar-border - Border color of the snackbar (default: var(--dds-snackbar-error-border))\n * @cssproperty --dds-snackbar-text - Text color of the snackbar (default: var(--dds-snackbar-variant-text))\n * @cssproperty --dds-snackbar-icon - Icon color of the snackbar (default: var(--dds-snackbar-variant-icon))\n * @cssproperty --dds-snackbar-link - Link color of the snackbar (default: var(--dds-snackbar-variant-link))\n * @cssproperty --dds-snackbar-information-background - Background color for information variant (default: var(--dds-background-informative-medium))\n * @cssproperty --dds-snackbar-information-border - Border color for information variant (default: var(--dds-border-width-base) solidvar(--dds-border-informative-subtle))\n * @cssproperty --dds-snackbar-information-icon - Icon color for information variant (default: var(--dds-icon-informative-subtle))\n * @cssproperty --dds-snackbar-success-background - Background color for success variant (default: var(--dds-background-positive-medium))\n * @cssproperty --dds-snackbar-success-border - Border color for success variant (default: var(--dds-border-width-base) solidvar(--dds-border-positive-subtle))\n * @cssproperty --dds-snackbar-success-icon - Icon color for success variant (default: var(--dds-icon-positive-subtle))\n * @cssproperty --dds-snackbar-error-background - Background color for error variant (default: var(--dds-background-negative-medium))\n * @cssproperty --dds-snackbar-error-border - Border color for error variant (default: var(--dds-border-width-base) solidvar(--dds-border-negative-subtle))\n * @cssproperty --dds-snackbar-error-icon - Icon color for error variant (default: var(--dds-icon-negative-subtle))\n * @cssproperty --dds-snackbar-variant-text - Text color for information, success, and error variants (default: var(--dds-text-neutral-base))\n * @cssproperty --dds-snackbar-variant-icon - Icon color for information, success, and error variants (default: var(--dds-text-neutral-base))\n * @cssproperty --dds-snackbar-variant-link - Link color for information, success, and error variants (default: var(--dds-text-neutral-base))\n * @cssproperty --dds-snackbar-animation-duration - Duration of entrance animations (default: 0.3s)\n * @cssproperty --dds-snackbar-animation-timing - Timing function for animations (default: ease-out)\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 * @csspart message - The message part of the snackbar\n * @csspart message-base - The base part of the message\n * @csspart message-text - The text part of the message\n * @csspart message-closebutton - The close button part of the message\n * @csspart message-close-icon - The close icon part of the message\n * @csspart message-actions - The actions part of the message\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 icon-content - The content of the loading icon.\n * @csspart text - The loading text element.\n *\n * @slot - The loading text content.\n * @slot icon - The loading icon content.\n *\n * @cssprop --dds-spinner-icon-color-neutral - Color for neutral spinner icons (default: var(--dds-icon-neutral-base))\n * @cssprop --dds-spinner-icon-color-brand - Color for brand spinner icons (default: var(--dds-icon-brand-subtle))\n * @cssprop --dds-spinner-icon-color-negative - Color for negative spinner icons (default: var(--dds-icon-negative-subtle))\n * @cssprop --dds-spinner-icon-color-positive - Color for positive spinner icons (default: var(--dds-icon-positive-subtle))\n * @cssprop --dds-spinner-icon-color-inverted - Color for inverted spinner icons (default: var(--dds-icon-neutral-inverted))\n * @cssprop --dds-spinner-text-spacing - Spacing between spinner and text (default: var(--dds-spacing-400))\n * @cssprop --dds-spinner-animation-duration - Duration of the spinner animation (default: 1s)\n *\n * @property { 'xs' | 'sm' | 'md' | 'lg' | 'xl' | 'xxl' } size - The size of the spinner. Default is `lg`. See SizedMixin.\n * @property {string} sizeMap - Responsive size map (e.g. \"md:lg\"); see SizedMixin.\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' | 'lg'} size - The size of the switch.\n * @property {boolean} disabled - The disabled state of the switch.\n * @property {boolean} readonly - Whether the switch is readonly (cannot be changed but value is submitted with form).\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 (default: var(--dds-spacing-1000)\n * @cssProperty --dds-switch-height - Height of the switch control (default: var(--dds-spacing-600))\n * @cssProperty --dds-switch-thumb-width - Width of the switch thumb (default: var(--dds-spacing-500))\n * @cssProperty --dds-switch-thumb-height - Height of the switch thumb (default: var(--dds-spacing-500))\n * @cssProperty --dds-switch-thumb-margin - Margin around the switch thumb (default: 0.125rem)\n * @cssProperty --dds-switch-thumb-color - Color of the switch thumb (default: var(--dds-button-primary-icon-enabled))\n * @cssProperty --dds-switch-unchecked-bg - Background color of the switch when unchecked (default: var(--dds-background-neutral-base-inverted))\n * @cssProperty --dds-switch-checked-bg - Background color of the switch when checked (default: var(--dds-background-brand-base-inverted))\n * @cssProperty --dds-switch-invalid-bg - Background color of the switch when invalid (default: var(--dds-background-negative-base-inverted))\n * @cssProperty --dds-switch-disabled-bg - Background color of the switch when disabled (default: var(--dds-background-neutral-disabled))\n * @cssProperty --dds-switch-readonly-bg - Background color of the switch when readonly (default: var(--dds-background-neutral-disabled))\n * @cssProperty --dds-switch-wrapper-padding - Padding of the switch wrapper (default: var(--dds-spacing-400))\n * @cssProperty --dds-switch-wrapper-bg - Background color of the switch wrapper (default: var(--dds-background-neutral-subtle))\n * @cssProperty --dds-switch-border-color - Border color of the switch (default: var(--dds-border-neutral-subtle))\n * @cssProperty --dds-switch-high-contrast-border-color - Border color of the switch in high contrast mode (default: var(--dds-border-neutral-transparent-interactive, #fff500))\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 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 (default: var(--dds-radius-base))\n * @cssproperty --dds-tab-border-radius - Border radius for tab items (default: var(--dds-radius-base) var(--dds-radius-base) 0 0)\n * @cssproperty --dds-tab-group-border-width - Border width of the tab navigation (default: var(--dds-border-width-base))\n * @cssproperty --dds-tab-group-border-color - Border color of the tab navigation (default: var(--dds-border-neutral-subtle))\n * @cssproperty --dds-tab-height-sm - Height of small tabs (default: 40px)\n * @cssproperty --dds-tab-height-lg - Height of large tabs (default: 50px)\n * @cssproperty --dds-tab-font-size-sm - Font size of small tabs (default: var(--dds-font-base))\n * @cssproperty --dds-tab-font-size-lg - Font size of large tabs (default: var(--dds-font-lg))\n * @cssproperty --dds-tab-padding - Padding of the tab buttons (default: 0 var(--dds-spacing-400))\n * @cssproperty --dds-tab-border-width - Border width for tabs (default: var(--dds-border-width-large))\n * @cssproperty --dds-tab-selected-border-color - Border color for selected tabs (default: var(--dds-border-brand-base))\n * @cssproperty --dds-tab-text-color - Text color for tabs (default: var(--dds-button-subtle-text-neutral-enabled))\n * @cssproperty --dds-tab-hover-text-color - Text color for tabs on hover (default: var(--dds-text-brand-subtle))\n * @cssproperty --dds-tab-disabled-text-color - Text color for disabled tabs (default: var(--dds-text-neutral-disabled))\n * @cssproperty --dds-tab-hover-background - Background color for tabs on hover (default: var(--dds-transparent-black-subtle))\n * @cssproperty --dds-tab-active-background - Background color for active tabs (default: var(--dds-transparent-black-base))\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. (default: var(--dds-spacing-200))\n * @cssproperty --dds-table-header-padding-inline-start - Padding for the start (left in LTR) of the header cell. (default: var(--dds-spacing-500))\n * @cssproperty --dds-table-header-padding-inline-end - Padding for the end (right in LTR) of the header cell. (default: var(--dds-spacing-200))\n * @cssproperty --dds-table-header-border-width - Width of the header cell's bottom border. (default: var(--dds-border-width-base))\n * @cssproperty --dds-table-header-border-color - Color of the header cell's bottom border. (default: var(--dds-border-neutral-subtle))\n * @cssproperty --dds-table-header-text-color - Text color of the header cell. (default: var(--dds-text-neutral-strong))\n * @cssproperty --dds-table-header-font-weight - Font weight of the header cell text. (default: var(--dds-font-weight-bold))\n * @cssproperty --dds-table-header-line-height - Line height of the header cell text. (default: var(--dds-font-line-height-xlarge))\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, (default: var(--dds-spacing-500))\n * @cssprop --dds-table-row-padding-top - Padding top for table headers in mobile view, (default: var(--dds-spacing-400))\n * @cssprop --dds-table-row-padding-bottom - Padding bottom for the last table cell in mobile view, (default: var(--dds-spacing-400))\n * @cssprop --dds-table-row-border-color - Border color for table cells and headers, (default: 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 * @csspart feedback-base - The base of the feedback.\n * @csspart feedback-text - The text of the feedback.\n * @csspart feedback-icon - The icon of the feedback.\n *\n * @cssproperty --dds-textarea-min-rows - Minimum number of rows in the textarea. (default: 2)\n * @cssproperty --dds-textarea-spacing - Gap between elements in the textarea container. (default: var(--dds-spacing-200))\n * @cssproperty --dds-textarea-gap - Gap between elements in the textarea container. (default: var(--dds-spacing-200))\n * @cssproperty --dds-textarea-margin-top - Top margin of the textarea. (default: var(--dds-spacing-200))\n * @cssproperty --dds-textarea-padding - Padding of the textarea control. (default: var(--dds-spacing-200) var(--dds-spacing-300))\n * @cssproperty --dds-textarea-border-width - Border width of the textarea. (default: var(--dds-border-width-base))\n * @cssproperty --dds-textarea-border-color - Border color of the textarea. (default: var(--dds-border-neutral-base))\n * @cssproperty --dds-textarea-background - Background color of the textarea. (default: var(--dds-fields-background-default))\n * @cssproperty --dds-textarea-color - Text color of the textarea. (default: var(--dds-text-neutral-base))\n * @cssproperty --dds-textarea-border-radius - Border radius of the textarea. (default: var(--dds-radius-base))\n * @cssproperty --dds-textarea-disabled-bg - Background color when disabled. (default: var(--dds-fields-background-disabled))\n * @cssproperty --dds-textarea-disabled-color - Text color when disabled. (default: var(--dds-text-neutral-disabled))\n * @cssproperty --dds-textarea-readonly-bg - Background color when readonly. (default: var(--dds-fields-background-read-only))\n * @cssproperty --dds-textarea-readonly-color - Text color when readonly. (default: var(--dds-text-neutral-subtle))\n * @cssproperty --dds-textarea-error-border - Border color when in error state. (default: var(--dds-border-negative-base))\n * @cssproperty --dds-textarea-success-border - Border color when in success state. (default: 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/timepicker/time-grid.component.js'\n      import type { DdsChangeEvent } from '../../events/events'\nimport type { DdsCloseEvent } from '../../events/events'\n      export type { DdsChangeEvent } from '../../events/events'\nexport type { DdsCloseEvent } from '../../events/events'\n\n      const tagName = 'dap-ds-time-grid'\n\n      /**\n * `dap-ds-time-grid`\n * @summary A time grid component that allows users to select hours and minutes in two side-by-side scrollable columns.\n * @element dap-ds-time-grid\n * @title - Time grid\n * @group timepicker\n *\n * @property {number} selectedHour - The currently selected hour (0-23).\n * @property {number} selectedMinute - The currently selected minute (0-59).\n * @property {string} minTime - The minimum selectable time (format: 'HH:mm').\n * @property {string} maxTime - The maximum selectable time (format: 'HH:mm').\n * @property {number} step - The step interval in minutes.\n * @property {string} locale - The locale for time formatting.\n *\n * @event {{ detail: TimeSelection }} dds-change - Fired when time selection changes.\n * @event {{ void }} dds-close - Fired when the time grid should close.\n *\n * @csspart time-grid - The main time grid container.\n * @csspart hour-section - The hour selection section.\n * @csspart minute-section - The minute selection section.\n * @csspart time-button - Individual time selection buttons.\n * @csspart time-button-base - The base part of the time button.\n * @csspart time-button-content - The content part of the time button.\n * @csspart time-button-high-contrast - The high contrast part of the time button.\n * @csspart section-header-title - The title of the section header.\n * @csspart section-header-divider - The divider between the section header and the time buttons.\n * @csspart time-column - The time column container.\n *\n * @cssprop --dds-time-grid-gap - The gap between time sections (default: var(--dds-spacing-400)).\n * @cssprop --dds-time-grid-padding - The padding around the time grid (default: var(--dds-spacing-0)).\n * @cssprop --dds-time-grid-column-gap - The gap between time buttons in columns (default: var(--dds-spacing-200)).\n * @cssprop --dds-time-grid-border-radius - The border radius of the time grid (default: var(--dds-radius-base)).\n * @cssprop --dds-time-grid-background - The background color of the time grid (default: var(--dds-background-neutral-subtle)).\n * @cssprop --dds-time-grid-transition - The transition timing for the time grid (default: all 0.2s ease-in-out).\n * @cssprop --dds-time-grid-max-width - The maximum width of the time grid (default: 400px).\n * @cssprop --dds-time-grid-column-max-height - The maximum height of time columns (default: 240px).\n */\n      const reactWrapper = createComponent({\n        tagName,\n        elementClass: Component,\n        react: React,\n        events: {\n          onDdsChange: 'dds-change' as EventName<DdsChangeEvent>,\nonDdsClose: 'dds-close' as EventName<DdsCloseEvent>\n        },\n        displayName: \"DapDSTimeGrid\"\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/timepicker/timepicker.component.js'\n      import type { DdsChangeEvent } from '../../events/events'\nimport type { DdsInputEvent } from '../../events/events'\nimport type { DdsValidTimeEvent } from '../../events/events'\nimport type { DdsInvalidTimeEvent } from '../../events/events'\nimport type { DdsClearEvent } from '../../events/events'\nimport type { DdsFocusEvent } from '../../events/events'\nimport type { DdsBlurEvent } from '../../events/events'\n      export type { DdsChangeEvent } from '../../events/events'\nexport type { DdsInputEvent } from '../../events/events'\nexport type { DdsValidTimeEvent } from '../../events/events'\nexport type { DdsInvalidTimeEvent } from '../../events/events'\nexport type { DdsClearEvent } from '../../events/events'\nexport type { DdsFocusEvent } from '../../events/events'\nexport type { DdsBlurEvent } from '../../events/events'\n\n      const tagName = 'dap-ds-timepicker'\n\n      /**\n * `dap-ds-timepicker`\n * @summary A timepicker is a graphical user interface widget that allows the user to select a time from a time range.\n * @element dap-ds-timepicker\n * @title - Timepicker\n *\n * @property {Dayjs | string} value - The value of the timepicker. Can be a Dayjs object or a string in 'HH:mm' format.\n * @property {string} label - The label of the timepicker.\n * @property {string} description - The description of the timepicker.\n * @property {'xs' | 'sm' | 'lg'} size - The size of the timepicker.\n * @property {boolean} disabled - The disabled state of the timepicker.\n * @property {boolean} required - The required state of the timepicker.\n * @property {boolean} readonly - The readonly state of the timepicker.\n * @property {boolean} autofocus - The autofocus state of the timepicker.\n * @property {string} tooltip - The tooltip of the timepicker.\n * @property {'top' | 'right' | 'bottom' | 'left'} tooltipPlacement - The tooltip placement of the timepicker.\n * @property {string} feedback - The feedback of the timepicker.\n * @property {'negative' | 'positive' | 'warning'} feedbackType - The feedback type of the timepicker.\n * @property {boolean} optional - The optional state of the timepicker.\n * @property {string} optionalLabel - The optional label of the timepicker.\n * @property {boolean} subtle - The weight of the label. Default is `false`\n * @property {string} autocomplete - The autocomplete of the timepicker.\n * @property {string} placeholder - The placeholder of the timepicker.\n * @property {boolean} loading - The loading state of the timepicker.\n * @property {string} format - The format of the timepicker. Defaults to 'HH:mm'.\n * @property {string} minTime - The minimum time of the timepicker. Format: 'HH:mm'.\n * @property {string} maxTime - The maximum time of the timepicker. Format: 'HH:mm'.\n * @property {number} step - The step interval in minutes. Defaults to 15.\n * @property {boolean} openTimeOnInput - Whether the time picker should open on typing.\n * @property {boolean} sendEmptyEventOnInput - Whether the time picker should send an empty event on typing.\n * @property {string} clearButton - Whether the clear button should be shown. Defaults to 'true'.\n * @property {string} clearButtonAriaLabel - The aria label of the clear button.\n * @property {string} placement - The placement of the dropdown of the timepicker.\n * @property {FloatingStrategy} floatingStrategy - The floating strategy of the timepicker.\n * @property {string} locale - The locale of the timepicker.\n * @property {boolean} closeOnSelection - Whether the dropdown should close when a time is selected.\n * @property {boolean} showSeconds - Whether to show the seconds column in the time picker.\n * @property {number} secondsStep - The step interval in seconds. Defaults to 1.\n * @property {function} disabledTime - Callback to determine if a time should be disabled.\n * @property {boolean} hideDisabledTimes - Whether to hide disabled times or show them as disabled.\n * @property {TimePreset[]} presets - Array of preset time slots for quick selection.\n *\n * @event {{ value: Dayjs | string, hour: number, minute: number, second?: number }} dds-change - Fired when the timepicker value changes.\n * @event {{ value: string }} dds-input - Fired when the timepicker input value changes.\n * @event {{ value: Dayjs | string, hour: number, minute: number, second?: number }} dds-valid-time - Fired when the timepicker input value is valid. Happens on manual input typing.\n * @event {{ value: Dayjs | string, hour: number, minute: number, second?: number, type: 'invalid' | 'out-of-range' }} dds-invalid-time - Fired when the timepicker input value is invalid. Happens on manual input typing.\n * @event {{ void }} dds-clear - Fired when the timepicker is cleared.\n * @event {{ void }} dds-focus - Emitted when the timepicker gains focus.\n * @event {{ void }} dds-blur - Emitted when the timepicker loses focus.\n *\n * @csspart base - The main timepicker container.\n * @csspart trigger - The trigger button of the timepicker.\n * @csspart label - The label of the timepicker.\n * @csspart description - The description of the timepicker.\n * @csspart feedback - The feedback of the timepicker.\n * @csspart tooltip - The tooltip of the timepicker.\n * @csspart input - The input of the timepicker.\n * @csspart clear-button - The clear button of the timepicker.\n *\n * @cssproperty --dds-timepicker-background - The background color of the timepicker. (default: var(--dds-fields-background-default))\n * @cssproperty --dds-timepicker-border-color - The border color of the timepicker. (default: var(--dds-border-neutral-base))\n * @cssproperty --dds-timepicker-border-width - The border width of the timepicker. (default: var(--dds-border-width-base, 1px))\n * @cssproperty --dds-timepicker-border-radius - The border radius of the timepicker. (default: var(--dds-radius-base))\n * @cssproperty --dds-timepicker-text-color - The text color of the timepicker. (default: var(--dds-text-neutral-base))\n * @cssproperty --dds-timepicker-placeholder-color - The placeholder text color. (default: var(--dds-text-neutral-subtle))\n * @cssproperty --dds-timepicker-disabled-background - The background color when disabled. (default: var(--dds-background-neutral-stronger))\n * @cssproperty --dds-timepicker-disabled-text - The text color when disabled. (default: var(--dds-text-neutral-disabled))\n * @cssproperty --dds-timepicker-error-border - The border color for error state. (default: var(--dds-border-negative-base))\n * @cssproperty --dds-timepicker-success-border - The border color for success state. (default: var(--dds-border-positive-base))\n * @cssproperty --dds-timepicker-icon-color - The color of the icons. (default: var(--dds-text-icon-neutral-subtle))\n * @cssproperty --dds-timepicker-clear-icon-color - The color of the clear icon. (default: var(--dds-button-subtle-icon-neutral-enabled))\n * @cssproperty --dds-timepicker-popup-background - The background color of the popup. (default: var(--dds-background-neutral-subtle))\n * @cssproperty --dds-timepicker-popup-shadow - The box shadow of the popup. (default: 0 4px 6px -1px rgb(0 0 0 / 8%), 0 2px 4px -1px rgb(0 0 0 / 6%))\n *\n * @cssproperty --dds-timepicker-padding-xs - The padding for extra small size. (default: var(--dds-spacing-200))\n * @cssproperty --dds-timepicker-padding-sm - The padding for small size. (default: var(--dds-spacing-200))\n * @cssproperty --dds-timepicker-padding-lg - The padding for large size. (default: var(--dds-spacing-300))\n * @cssproperty --dds-timepicker-padding-horizontal - The horizontal padding. (default: var(--dds-spacing-300))\n * @cssproperty --dds-timepicker-padding-vertical - The vertical padding. (default: var(--dds-spacing-200))\n * @cssproperty --dds-timepicker-gap - The gap between elements. (default: var(--dds-spacing-100))\n * @cssproperty --dds-timepicker-icon-gap - The gap between icons. (default: var(--dds-spacing-200))\n * @cssproperty --dds-timepicker-action-gap - The gap between action elements. (default: var(--dds-spacing-200))\n * @cssproperty --dds-timepicker-action-padding - The padding for action elements. (default: var(--dds-spacing-300))\n * @cssproperty --dds-timepicker-clear-icon-width - The width of the clear icon. (default: var(--dds-spacing-800))\n * @cssproperty --dds-timepicker-dropdown-icon-right - The right position of the dropdown icon. (default: var(--dds-spacing-600))\n * @cssproperty --dds-timepicker-min-width - The minimum width of the timepicker. (default: 7.5rem)\n *\n */\n      const reactWrapper = createComponent({\n        tagName,\n        elementClass: Component,\n        react: React,\n        events: {\n          onDdsChange: 'dds-change' as EventName<DdsChangeEvent>,\nonDdsInput: 'dds-input' as EventName<DdsInputEvent>,\nonDdsValidTime: 'dds-valid-time' as EventName<DdsValidTimeEvent>,\nonDdsInvalidTime: 'dds-invalid-time' as EventName<DdsInvalidTimeEvent>,\nonDdsClear: 'dds-clear' as EventName<DdsClearEvent>,\nonDdsFocus: 'dds-focus' as EventName<DdsFocusEvent>,\nonDdsBlur: 'dds-blur' as EventName<DdsBlurEvent>\n        },\n        displayName: \"DapDSTimePicker\"\n      })\n\n      export default reactWrapper\n    ","\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 { 'xs' | 'sm' | 'md' | 'lg' } size - The size of the TOC. Default is `lg.\n * @property {string} sizeMap - Responsive size map (e.g. \"md:lg\").\n *\n * @event {{ selectedItem: HTMLAnchorElement, anchorElement: IntersectionObserverEntry | HTMLElement }} dds-anchor-change - Event that is triggered when the anchor changes.\n *\n * @csspart base - The main container of the toc.\n *\n * @cssproperty --dds-toc-border-width - Width of the TOC border. (default: var(--dds-border-width-base))\n * @cssproperty --dds-toc-border-color - Color of the TOC border. (default: var(--dds-border-neutral-divider))\n * @cssproperty --dds-toc-title-color - Color of the TOC title. (default: var(--dds-text-neutral-strong))\n * @cssproperty --dds-toc-title-font-size - Font size of the TOC title. (default: var(--dds-font-base))\n * @cssproperty --dds-toc-title-font-weight - Font weight of the TOC title. (default: var(--dds-font-weight-bold))\n * @cssproperty --dds-toc-title-line-height - Line height of the TOC title. (default: 1.25)\n * @cssproperty --dds-toc-link-color - Color of the TOC links. (default: var(--dds-button-subtle-text-neutral-enabled))\n * @cssproperty --dds-toc-link-active-color - Color of the active TOC link. (default: var(--dds-button-subtle-text-enabled))\n * @cssproperty --dds-toc-link-border-color - Border color of the active TOC link. (default: var(--dds-border-brand-base))\n * @cssproperty --dds-toc-link-line-height - Line height of the TOC links. (default: 1.2)\n * @cssproperty --dds-toc-link-padding - Padding of the TOC links. (default: var(--dds-spacing-200))\n * @cssproperty --dds-toc-indent-level-0 - Indent level of the TOC items. (default: var(--dds-spacing-400))\n * @cssproperty --dds-toc-indent-level-1 - Indent level of the TOC items. (default: var(--dds-spacing-800))\n * @cssproperty --dds-toc-indent-level-2 - Indent level of the TOC items. (default: var(--dds-spacing-1200))\n * @cssproperty --dds-toc-indent-level-3 - Indent level of the TOC items. (default: var(--dds-spacing-1600))\n * @cssproperty --dds-toc-indent-level-4 - Indent level of the TOC items. (default: var(--dds-spacing-2000))\n * @cssproperty --dds-toc-indent-level-5 - Indent level of the TOC items. (default: var(--dds-spacing-2400))\n */\n      const reactWrapper = createComponent({\n        tagName,\n        elementClass: Component,\n        react: React,\n        events: {\n          onDdsAnchorChange: 'dds-anchor-change' as EventName<DdsAnchorChangeEvent>\n        },\n        displayName: \"DapDSTOC\"\n      })\n\n      export default reactWrapper\n    ","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 * @property { 'xs' | 'sm' | 'md' | 'lg' } size - The size of the toggle button. Default is `md`\n * @property {string} sizeMap - Responsive size map (e.g. \"md:lg\")\n *\n * @slot - The content of the toggle button.\n *\n * @csspart base - The main button container.\n * @csspart high-contrast - The high contrast part of the button.\n *\n * @cssproperty --dds-toggle-button-min-width-lg - Minimum width of the large toggle button (default: var(--dds-spacing-2400))\n * @cssproperty --dds-toggle-button-min-width-md - Minimum width of the medium toggle button (default: var(--dds-spacing-2000))\n * @cssproperty --dds-toggle-button-min-width-sm - Minimum width of the small toggle button (default: var(--dds-spacing-1200))\n * @cssproperty --dds-toggle-button-min-width-xs - Minimum width of the extra small toggle button (default: var(--dds-spacing-1200))\n * @cssproperty --dds-toggle-button-height-lg - Height of the large toggle button (default: var(--dds-spacing-1200))\n * @cssproperty --dds-toggle-button-height-md - Height of the medium toggle button (default: var(--dds-spacing-1000))\n * @cssproperty --dds-toggle-button-height-sm - Height of the small toggle button (default: var(--dds-spacing-800))\n * @cssproperty --dds-toggle-button-height-xs - Height of the extra small toggle button (default: var(--dds-spacing-600))\n * @cssproperty --dds-toggle-button-padding-lg - Padding of the large toggle button (default: var(--dds-spacing-300) var(--dds-spacing-400))\n * @cssproperty --dds-toggle-button-padding-md - Padding of the medium toggle button (default: var(--dds-spacing-300))\n * @cssproperty --dds-toggle-button-padding-sm - Padding of the small toggle button (default: var(--dds-spacing-200))\n * @cssproperty --dds-toggle-button-padding-xs - Padding of the extra small toggle button (default: var(--dds-spacing-150) var(--dds-spacing-200))\n * @cssproperty --dds-toggle-button-font-size-lg - Font size of the large toggle button (default: 1.125rem)\n * @cssproperty --dds-toggle-button-font-size-md - Font size of the medium toggle button (default: 1rem)\n * @cssproperty --dds-toggle-button-font-size-sm - Font size of the small toggle button (default: 0.875rem)\n * @cssproperty --dds-toggle-button-font-size-xs - Font size of the extra small toggle button (default: var(--dds-font-xs))\n * @cssproperty --dds-toggle-button-border-enabled - Border color in enabled state (default: var(--dds-button-toggle-border-enabled))\n * @cssproperty --dds-toggle-button-background-enabled - Background color in enabled state (default: var(--dds-button-toggle-background-enabled))\n * @cssproperty --dds-toggle-button-content-enabled - Content/text color in enabled state (default: var(--dds-button-toggle-content-enabled))\n * @cssproperty --dds-toggle-button-border-hover - Border color in hover state (default: var(--dds-button-toggle-border-hover))\n * @cssproperty --dds-toggle-button-background-hover - Background color in hover state (default: var(--dds-button-toggle-background-hover))\n * @cssproperty --dds-toggle-button-border-pressed - Border color in pressed state (default: var(--dds-button-toggle-border-pressed))\n * @cssproperty --dds-toggle-button-background-pressed - Background color in pressed state (default: var(--dds-button-toggle-background-pressed))\n * @cssproperty --dds-toggle-button-background-selected-enabled - Background color in selected enabled state (default: var(--dds-button-toggle-background-selected-enabled))\n * @cssproperty --dds-toggle-button-content-selected-enabled - Content/text color in selected enabled state (default: var(--dds-button-toggle-content-selected-enabled))\n * @cssproperty --dds-toggle-button-background-selected-hover - Background color in selected hover state (default: var(--dds-button-toggle-background-selected-hover))\n * @cssproperty --dds-toggle-button-background-selected-pressed - Background color in selected pressed state (default: var(--dds-button-toggle-background-selected-pressed))\n * @cssproperty --dds-toggle-button-border-disabled - Border color in disabled state (default: var(--dds-button-toggle-border-disabled))\n * @cssproperty --dds-toggle-button-background-disabled - Background color in disabled state (default: var(--dds-button-toggle-background-disabled))\n * @cssproperty --dds-toggle-button-content-disabled - Content/text color in disabled state (default: var(--dds-button-toggle-content-disabled))\n * @cssproperty --dds-toggle-button-highcontrast-border - High contrast border color (default: var(--dds-button-toggle-highcontrast-border))\n * @cssproperty --dds-toggle-button-highcontrast-border-hover - High contrast border color on hover (default: var(--dds-button-toggle-highcontrast-border-hover))\n *\n */\nconst reactWrapper = createComponent({\n  tagName,\n  elementClass: Component,\n  react: React,\n  events: {},\n  displayName: 'DapDSToggleButton',\n})\n\nexport default reactWrapper\n","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 (default: 14rem)\n * @cssproperty --dds-tooltip-padding - The padding inside the tooltip (default: var(--dds-spacing-400))\n * @cssproperty --dds-tooltip-border-color - The border color of the tooltip (default: var(--dds-border-neutral-subtle))\n * @cssproperty --dds-tooltip-bg-color - The background color of the tooltip (default: var(--dds-background-neutral-base))\n * @cssproperty --dds-tooltip-text-color - The text color of the tooltip (default: var(--dds-text-neutral-base))\n * @cssproperty --dds-tooltip-font-size - The font size of the tooltip text (default: var(--dds-font-sm))\n * @cssproperty --dds-tooltip-box-shadow - The box shadow of the tooltip (default: 0 8px 12px -2px rgb(0 0 0 / 8%), 0 2px 6px -2px rgb(0 0 0 / 6%))\n */\nconst reactWrapper = createComponent({\n  tagName,\n  elementClass: Component,\n  react: React,\n  events: {},\n  displayName: 'DapDSTooltip',\n})\n\nexport default reactWrapper\n","\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} noModal - Whether the tray should have a modal overlay. Default is false. If true the tray will use the .show() method, if false the tray will use the .showModal() method.\n * @property {boolean} closeOnEsc - Whether the tray should close on pressing the escape key. Default is true.\n * @property {boolean} closeOnOverlayClick - Whether the tray should close on clicking the overlay. Default is true.\n * @property {string} closeButton - Whether the tray should have a close button. Default is true.\n * @property {string} title - The title of the tray.\n * @property {string} description - The description of the tray.\n * @property {string} okButtonLabel - The label of the OK button.\n * @property {string} cancelButtonLabel - The label of the Cancel button.\n * @property { 'sm' | 'lg' } size - The size of the tray. Default is 'sm'.\n * @property {string} footer - Whether the tray should have a footer. Default is false.\n * @property {string} header - Whether the tray should have a header. Default is false.\n *\n * @event {{ void }} dds-before-open - Fires before the tray opens.\n * @event {{ void }} dds-opened - Fires after the tray opens.\n * @event {{ void }} dds-before-close - Fires before the tray closes.\n * @event {{ void }} dds-closed - Fires after the tray closed.\n * @event {{ void }} dds-close - Fires when the tray is closes. You can prevent the tray from closing by calling `event.preventDefault()`.\n *\n * @slot - The content of the tray.\n * @slot header - The header of the tray.\n * @slot footer - The footer of the tray.\n *\n * @cssproperty --dds-modal-max-block-size - Maximum height of the modal. (default: 80vh)\n * @cssproperty --dds-modal-max-inline-size - Maximum width of the modal. (default: 600px)\n * @cssproperty --dds-modal-padding-sm - Padding inside the modal. (default: var(--dds-spacing-600))\n * @cssproperty --dds-modal-padding-lg - Padding inside the modal. (default: var(--dds-spacing-1200))\n * @cssproperty --dds-modal-transform-amount - Amount to transform for entrance animation. (default: 2rem)\n * @cssproperty --dds-modal-transition-speed - Speed of transition animations. (default: var(--dds-transition-fast))\n * @cssproperty --dds-modal-transition-timing - Timing function for transitions. (default: var(--dds-easing-ease-in-out))\n * @cssproperty --dds-modal-border-width - Border width of the modal. (default: var(--dds-border-width-base))\n * @cssproperty --dds-modal-border-color - Border color of the modal. (default: var(--dds-border-neutral-divider))\n * @cssproperty --dds-modal-border-radius - Border radius of the modal. (default: var(--dds-radius-large, 16px))\n * @cssproperty --dds-modal-background - Background color of the modal. (default: var(--dds-background-neutral-subtle))\n * @cssproperty --dds-modal-header-margin-sm - Margin below the header. (default: var(--dds-spacing-400))\n * @cssproperty --dds-modal-header-margin-lg - Margin below the header. (default: var(--dds-spacing-600))\n * @cssproperty --dds-modal-footer-margin-sm - Margin above the footer. (default: var(--dds-spacing-400))\n * @cssproperty --dds-modal-footer-margin-lg - Margin above the footer. (default: var(--dds-spacing-600))\n * @cssproperty --dds-modal-footer-gap - Gap between footer elements. (default: var(--dds-spacing-400))\n * @cssproperty --dds-modal-close-margin - Margin for the close button. (default: var(--dds-spacing-300))\n * @cssproperty --dds-tray-width-side - Width of the side (left/right) trays. (default: 250px)\n * @cssproperty --dds-tray-min-width-horizontal - Minimum width of the horizontal (top/bottom) trays. (default: 400px)\n * @cssproperty --dds-tray-min-height-horizontal - Minimum height of the horizontal (top/bottom) trays. (default: 300px)\n * @cssproperty --dds-tray-min-height-vertical - Minimum height of the vertical (left/right) trays. (default: 100%)\n * @cssproperty --dds-tray-transform-duration - Duration of the transform animation. (default: 0.3s)\n * @cssproperty --dds-tray-transform-timing - Timing function for the transform animation. (default: ease-in-out)\n *\n * @csspart base - The main tray container.\n * @csspart panel - The panel of the tray.\n * @csspart header - The header of the tray.\n * @csspart footer - The footer of the tray.\n * @csspart content - The content of the tray.\n * @csspart body - The body of the tray.\n *\n */\n      const reactWrapper = createComponent({\n        tagName,\n        elementClass: Component,\n        react: React,\n        events: {\n          onDdsBeforeOpen: 'dds-before-open' as EventName<DdsBeforeOpenEvent>,\nonDdsOpened: 'dds-opened' as EventName<DdsOpenedEvent>,\nonDdsBeforeClose: 'dds-before-close' as EventName<DdsBeforeCloseEvent>,\nonDdsClosed: 'dds-closed' as EventName<DdsClosedEvent>,\nonDdsClose: 'dds-close' as EventName<DdsCloseEvent>\n        },\n        displayName: \"DapDSTray\"\n      })\n\n      export default reactWrapper\n    ","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. (default: var(--dds-text-neutral-base))\n * @cssproperty --dds-text-color-inverted - The color of the typography in inverted mode. (default: var(--dds-text-neutral-on-inverted))\n * @cssproperty --dds-text-heading-color - The color of the heading typography. (default: var(--dds-text-neutral-strong))\n * @cssproperty --dds-text-heading-color-inverted - The color of the heading typography in inverted mode. (default: var(--dds-text-neutral-on-inverted))\n * @cssproperty --dds-text-description-color - The color of the subtle typography. (default: var(--dds-text-neutral-subtle))\n * @cssproperty --dds-text-description-color-inverted - The color of the subtle typography in inverted mode. (default: var(--dds-text-neutral-on-inverted))\n * @cssproperty --dds-text-font-family - The font family of the typography. (default: var(--font-family))\n * @cssproperty --dds-text-font-weight-medium - The font weight of the medium typography. (default: var(--dds-font-weight-medium))\n * @cssproperty --dds-text-font-weight-bold - The font weight of the bold typography. (default: var(--dds-font-weight-bold))\n * @cssproperty --dds-text-font-size-h1 - The font size of the h1 typography. (default: var(--dds-font-7xl))\n * @cssproperty --dds-text-font-size-h2 - The font size of the h2 typography. (default: var(--dds-font-4xl))\n * @cssproperty --dds-text-font-size-h3 - The font size of the h3 typography. (default: var(--dds-font-2xl))\n * @cssproperty --dds-text-font-size-h4 - The font size of the h4 typography. (default: var(--dds-font-xl))\n * @cssproperty --dds-text-font-size-h5 - The font size of the h5 typography. (default: var(--dds-font-lg))\n * @cssproperty --dds-text-font-size-h6 - The font size of the h6 typography. (default: var(--dds-font-base))\n * @cssproperty --dds-text-font-size-body - The font size of the body typography. (default: var(--dds-font-base))\n * @cssproperty --dds-text-font-size-caption - The font size of the caption typography. (default: var(--dds-font-xs))\n * @cssproperty --dds-text-font-size-description - The font size of the description typography. (default: var(--dds-font-base))\n * @cssproperty --dds-text-font-size-description-lg - The font size of the description lg typography. (default: var(--dds-font-base))\n * @cssproperty --dds-text-font-size-description-sm - The font size of the description sm typography. (default: var(--dds-font-sm))\n * @cssproperty --dds-text-font-size-lg - The font size of the lg typography. (default: var(--dds-font-lg))\n * @cssproperty --dds-text-font-size-md - The font size of the md typography. (default: var(--dds-font-base))\n * @cssproperty --dds-text-font-size-sm - The font size of the sm typography. (default: var(--dds-font-sm))\n * @cssproperty --dds-text-font-size-xs - The font size of the xs typography. (default: var(--dds-font-xs))\n */\nconst reactWrapper = createComponent({\n  tagName,\n  elementClass: Component,\n  react: React,\n  events: {},\n  displayName: 'DapDSTypography',\n})\n\nexport default reactWrapper\n","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. (default: var(--dds-font-weight-bold))\n * @cssproperty --dds-form-label-line-height - Line height of the label. (default: var(--dds-font-line-height-xlarge))\n * @cssproperty --dds-form-label-color - Text color of the label. (default: var(--dds-text-neutral-enabled))\n * @cssproperty --dds-form-label-disabled-color - Text color when the label is disabled. (default: var(--dds-text-neutral-disabled))\n * @cssproperty --dds-form-label-required-color - Color of the required indicator. (default: var(--dds-text-negative-subtle))\n * @cssproperty --dds-form-label-optional-color - Color of the optional indicator. (default: var(--dds-text-neutral-subtle))\n * @cssproperty --dds-form-label-margin-bottom - Bottom margin of the label. (default: 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`.\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-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/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/design/design-edit-line/design-edit-line.component.js'\n\nconst tagName = 'dap-ds-icon-edit-line'\n\n/**\n * `dap-ds-icon-edit-line`\n * @summary An icon\n * @element dap-ds-icon-edit-line\n * @title - DesignEditLine\n * @group icon\n * @icontype design\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: 'DesignEditLine',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport * as React from 'react'\n\nimport Component from '../../components/icons/design/design-tools-line/design-tools-line.component.js'\n\nconst tagName = 'dap-ds-icon-tools-line'\n\n/**\n * `dap-ds-icon-tools-line`\n * @summary An icon\n * @element dap-ds-icon-tools-line\n * @title - DesignToolsLine\n * @group icon\n * @icontype design\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: 'DesignToolsLine',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport * as React from 'react'\n\nimport Component from '../../components/icons/device/device-computer-line/device-computer-line.component.js'\n\nconst tagName = 'dap-ds-icon-computer-line'\n\n/**\n * `dap-ds-icon-computer-line`\n * @summary An icon\n * @element dap-ds-icon-computer-line\n * @title - DeviceComputerLine\n * @group icon\n * @icontype device\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: 'DeviceComputerLine',\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/document/document-file-image-line/document-file-image-line.component.js'\n\nconst tagName = 'dap-ds-icon-file-image-line'\n\n/**\n * `dap-ds-icon-file-image-line`\n * @summary An icon\n * @element dap-ds-icon-file-image-line\n * @title - DocumentFileImageLine\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: 'DocumentFileImageLine',\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-music-line/document-file-music-line.component.js'\n\nconst tagName = 'dap-ds-icon-file-music-line'\n\n/**\n * `dap-ds-icon-file-music-line`\n * @summary An icon\n * @element dap-ds-icon-file-music-line\n * @title - DocumentFileMusicLine\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: 'DocumentFileMusicLine',\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-text-line/document-file-text-line.component.js'\n\nconst tagName = 'dap-ds-icon-file-text-line'\n\n/**\n * `dap-ds-icon-file-text-line`\n * @summary An icon\n * @element dap-ds-icon-file-text-line\n * @title - DocumentFileTextLine\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: 'DocumentFileTextLine',\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-video-line/document-file-video-line.component.js'\n\nconst tagName = 'dap-ds-icon-file-video-line'\n\n/**\n * `dap-ds-icon-file-video-line`\n * @summary An icon\n * @element dap-ds-icon-file-video-line\n * @title - DocumentFileVideoLine\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: 'DocumentFileVideoLine',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport * as React from 'react'\n\nimport Component from '../../components/icons/document/document-folder-line/document-folder-line.component.js'\n\nconst tagName = 'dap-ds-icon-folder-line'\n\n/**\n * `dap-ds-icon-folder-line`\n * @summary An icon\n * @element dap-ds-icon-folder-line\n * @title - DocumentFolderLine\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: 'DocumentFolderLine',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport * as React from 'react'\n\nimport Component from '../../components/icons/document/document-folder-open-line/document-folder-open-line.component.js'\n\nconst tagName = 'dap-ds-icon-folder-open-line'\n\n/**\n * `dap-ds-icon-folder-open-line`\n * @summary An icon\n * @element dap-ds-icon-folder-open-line\n * @title - DocumentFolderOpenLine\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: 'DocumentFolderOpenLine',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport * as React from 'react'\n\nimport Component from '../../components/icons/editor/editor-separator/editor-separator.component.js'\n\nconst tagName = 'dap-ds-icon-separator'\n\n/**\n * `dap-ds-icon-separator`\n * @summary An icon\n * @element dap-ds-icon-separator\n * @title - EditorSeparator\n * @group icon\n * @icontype editor\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: 'EditorSeparator',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport * as React from 'react'\n\nimport Component from '../../components/icons/health/health-heart-fill/health-heart-fill.component.js'\n\nconst tagName = 'dap-ds-icon-heart-fill'\n\n/**\n * `dap-ds-icon-heart-fill`\n * @summary An icon\n * @element dap-ds-icon-heart-fill\n * @title - HealthHeartFill\n * @group icon\n * @icontype health\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: 'HealthHeartFill',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport * as React from 'react'\n\nimport Component from '../../components/icons/health/health-heart-line/health-heart-line.component.js'\n\nconst tagName = 'dap-ds-icon-heart-line'\n\n/**\n * `dap-ds-icon-heart-line`\n * @summary An icon\n * @element dap-ds-icon-heart-line\n * @title - HealthHeartLine\n * @group icon\n * @icontype health\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: 'HealthHeartLine',\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-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-delete-bin-fill/system-delete-bin-fill.component.js'\n\nconst tagName = 'dap-ds-icon-delete-bin-fill'\n\n/**\n * `dap-ds-icon-delete-bin-fill`\n * @summary An icon\n * @element dap-ds-icon-delete-bin-fill\n * @title - SystemDeleteBinFill\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: 'SystemDeleteBinFill',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport * as React from 'react'\n\nimport Component from '../../components/icons/system/system-delete-bin-line/system-delete-bin-line.component.js'\n\nconst tagName = 'dap-ds-icon-delete-bin-line'\n\n/**\n * `dap-ds-icon-delete-bin-line`\n * @summary An icon\n * @element dap-ds-icon-delete-bin-line\n * @title - SystemDeleteBinLine\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: 'SystemDeleteBinLine',\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-more-2-line/system-more-2-line.component.js'\n\nconst tagName = 'dap-ds-icon-more-2-line'\n\n/**\n * `dap-ds-icon-more-2-line`\n * @summary An icon\n * @element dap-ds-icon-more-2-line\n * @title - SystemMore2Line\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: 'SystemMore2Line',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport * as React from 'react'\n\nimport Component from '../../components/icons/system/system-more-line/system-more-line.component.js'\n\nconst tagName = 'dap-ds-icon-more-line'\n\n/**\n * `dap-ds-icon-more-line`\n * @summary An icon\n * @element dap-ds-icon-more-line\n * @title - SystemMoreLine\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: 'SystemMoreLine',\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-share-line/system-share-line.component.js'\n\nconst tagName = 'dap-ds-icon-share-line'\n\n/**\n * `dap-ds-icon-share-line`\n * @summary An icon\n * @element dap-ds-icon-share-line\n * @title - SystemShareLine\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: 'SystemShareLine',\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","import { createComponent } from '@lit/react'\nimport * as React from 'react'\n\nimport Component from '../../components/icons/system/system-time-fill/system-time-fill.component.js'\n\nconst tagName = 'dap-ds-icon-time-fill'\n\n/**\n * `dap-ds-icon-time-fill`\n * @summary An icon\n * @element dap-ds-icon-time-fill\n * @title - SystemTimeFill\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: 'SystemTimeFill',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport * as React from 'react'\n\nimport Component from '../../components/icons/system/system-time-line/system-time-line.component.js'\n\nconst tagName = 'dap-ds-icon-time-line'\n\n/**\n * `dap-ds-icon-time-line`\n * @summary An icon\n * @element dap-ds-icon-time-line\n * @title - SystemTimeLine\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: 'SystemTimeLine',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport * as React from 'react'\n\nimport Component from '../../components/icons/system/system-upload-2-fill/system-upload-2-fill.component.js'\n\nconst tagName = 'dap-ds-icon-upload-2-fill'\n\n/**\n * `dap-ds-icon-upload-2-fill`\n * @summary An icon\n * @element dap-ds-icon-upload-2-fill\n * @title - SystemUpload2Fill\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: 'SystemUpload2Fill',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport * as React from 'react'\n\nimport Component from '../../components/icons/system/system-upload-2-line/system-upload-2-line.component.js'\n\nconst tagName = 'dap-ds-icon-upload-2-line'\n\n/**\n * `dap-ds-icon-upload-2-line`\n * @summary An icon\n * @element dap-ds-icon-upload-2-line\n * @title - SystemUpload2Line\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: 'SystemUpload2Line',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport * as React from 'react'\n\nimport Component from '../../components/icons/system/system-upload-line/system-upload-line.component.js'\n\nconst tagName = 'dap-ds-icon-upload-line'\n\n/**\n * `dap-ds-icon-upload-line`\n * @summary An icon\n * @element dap-ds-icon-upload-line\n * @title - SystemUploadLine\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: 'SystemUploadLine',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport * as React from 'react'\n\nimport Component from '../../components/icons/system/system-zoom-in-line/system-zoom-in-line.component.js'\n\nconst tagName = 'dap-ds-icon-zoom-in-line'\n\n/**\n * `dap-ds-icon-zoom-in-line`\n * @summary An icon\n * @element dap-ds-icon-zoom-in-line\n * @title - SystemZoomInLine\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: 'SystemZoomInLine',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport * as React from 'react'\n\nimport Component from '../../components/icons/system/system-zoom-out-line/system-zoom-out-line.component.js'\n\nconst tagName = 'dap-ds-icon-zoom-out-line'\n\n/**\n * `dap-ds-icon-zoom-out-line`\n * @summary An icon\n * @element dap-ds-icon-zoom-out-line\n * @title - SystemZoomOutLine\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: 'SystemZoomOutLine',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport * as React from 'react'\n\nimport Component from '../../components/icons/user/user-account-circle-fill/user-account-circle-fill.component.js'\n\nconst tagName = 'dap-ds-icon-account-circle-fill'\n\n/**\n * `dap-ds-icon-account-circle-fill`\n * @summary An icon\n * @element dap-ds-icon-account-circle-fill\n * @title - UserAccountCircleFill\n * @group icon\n * @icontype user\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: 'UserAccountCircleFill',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport * as React from 'react'\n\nimport Component from '../../components/icons/user/user-account-circle-line/user-account-circle-line.component.js'\n\nconst tagName = 'dap-ds-icon-account-circle-line'\n\n/**\n * `dap-ds-icon-account-circle-line`\n * @summary An icon\n * @element dap-ds-icon-account-circle-line\n * @title - UserAccountCircleLine\n * @group icon\n * @icontype user\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: 'UserAccountCircleLine',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport * as React from 'react'\n\nimport Component from '../../components/icons/user/user-user-fill/user-user-fill.component.js'\n\nconst tagName = 'dap-ds-icon-user-fill'\n\n/**\n * `dap-ds-icon-user-fill`\n * @summary An icon\n * @element dap-ds-icon-user-fill\n * @title - UserUserFill\n * @group icon\n * @icontype user\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: 'UserUserFill',\n})\n\nexport default reactWrapper\n","import { createComponent } from '@lit/react'\nimport * as React from 'react'\n\nimport Component from '../../components/icons/user/user-user-line/user-user-line.component.js'\n\nconst tagName = 'dap-ds-icon-user-line'\n\n/**\n * `dap-ds-icon-user-line`\n * @summary An icon\n * @element dap-ds-icon-user-line\n * @title - UserUserLine\n * @group icon\n * @icontype user\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: 'UserUserLine',\n})\n\nexport default reactWrapper\n"],"names":["tagName","reactWrapper","createComponent","Component","React"],"mappings":"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"}