dap-design-system 0.62.0 → 0.62.2

package/dist/manifest/web-types.json

@@ -6,6 +6,45 @@
   "contributions": {
     "html": {
       "elements": [
+        {
+          "name": "dap-ds-accordion-group",
+          "description": "An accordion group is a collection of accordion components.\n---\n\n\n### **Slots:**\n - _default_ - The content of the accordion group.\n\n### **CSS Properties:**\n - **--dds-accordion-group-spacing** - Controls the gap between accordion items (default: var(--dds-spacing-300)) _(default: undefined)_\n- **--dds-accordion-group-border-color** - Controls the border color (default: var(--dds-border-neutral-subtle)) _(default: undefined)_\n- **--dds-accordion-group-border-width** - Controls the border width (default: var(--dds-border-width-base)) _(default: undefined)_\n- **--dds-accordion-group-border-radius** - Controls the border radius (default: var(--dds-radius-base)) _(default: undefined)_\n- **--dds-accordion-group-background** - Controls the background color (default: transparent) _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The main accordion group container.",
+          "doc-url": "",
+          "attributes": [
+            {
+              "name": "autoClose",
+              "description": "Whether to close other accordions when one is opened.",
+              "value": { "type": "string", "default": "'true'" }
+            },
+            {
+              "name": "variant",
+              "description": "The variant of the accordion",
+              "value": {
+                "type": "'default' | 'collapsed' | 'clean' | 'clean-collapsed'",
+                "default": "'default'"
+              }
+            }
+          ],
+          "slots": [
+            { "name": "", "description": "The content of the accordion group." }
+          ],
+          "events": [],
+          "js": {
+            "properties": [
+              {
+                "name": "autoClose",
+                "description": "Whether to close other accordions when one is opened.",
+                "type": "string"
+              },
+              {
+                "name": "variant",
+                "description": "The variant of the accordion",
+                "type": "'default' | 'collapsed' | 'clean' | 'clean-collapsed'"
+              }
+            ],
+            "events": []
+          }
+        },
         {
           "name": "dap-ds-accordion",
           "description": "An accordion is a vertically stacked list of interactive items that can be expanded or collapsed to reveal or hide content.\n---\n\n\n### **Events:**\n - **dds-opened** - Event fired when the accordion is opened.\n- **dds-closed** - Event fired when the accordion is closed.\n\n### **Slots:**\n - **default** - The content of the accordion.\n- **heading** - The heading of the accordion.\n- **icon-opened** - The icon when the accordion is opened.\n- **icon-closed** - The icon when the accordion is closed.\n\n### **CSS Properties:**\n - **--dds-accordion-border-width** - The width of the accordion border (default: var(--dds-border-width-base)) _(default: undefined)_\n- **--dds-accordion-border-style** - The style of the accordion border (default: solid) _(default: undefined)_\n- **--dds-accordion-border-radius** - The border radius of the accordion (default: var(--dds-radius-base)) _(default: undefined)_\n- **--dds-accordion-border-color** - The color of the accordion border (default: var(--dds-border-neutral-divider)) _(default: undefined)_\n- **--dds-accordion-background-color** - The background color of the accordion (default: var(--dds-background-neutral-subtle)) _(default: undefined)_\n- **--dds-accordion-text-color** - The text color of the accordion (default: var(--dds-text-neutral-strong)) _(default: undefined)_\n- **--dds-accordion-hover-background** - The background color when hovering over the accordion (default: var(--dds-background-neutral-base)) _(default: undefined)_\n- **--dds-accordion-active-background** - The background color when the accordion is active (default: var(--dds-background-neutral-medium)) _(default: undefined)_\n- **--dds-accordion-icon-background** - The background color of the accordion icon (default: var(--dds-transparent-black-subtle)) _(default: undefined)_\n- **--dds-accordion-icon-color** - The color of the accordion icon (default: var(--dds-icon-neutral-base)) _(default: undefined)_\n- **--dds-accordion-icon-hover-background** - The background color of the accordion icon when hovered (default: var(--dds-transparent-black-base)) _(default: undefined)_\n- **--dds-accordion-icon-active-background** - The background color of the accordion icon when active (default: var(--dds-transparent-black-strong)) _(default: undefined)_\n- **--dds-accordion-icon-hover-color** - The color of the accordion icon when hovered (default: var(--dds-icon-neutral-strong)) _(default: undefined)_\n- **--dds-accordion-icon-active-color** - The color of the accordion icon when active (default: var(--dds-icon-neutral-strong)) _(default: undefined)_\n- **--dds-accordion-content-color** - The color of the accordion content (default: var(--dds-text-text-neutral)) _(default: undefined)_\n- **--dds-accordion-transition-duration** - The duration of the accordion transitions (default: var(--dds-transition-fast)) _(default: undefined)_\n- **--dds-accordion-transition-timing** - The timing function of the accordion transitions (default: var(--dds-easing-ease-in-out)) _(default: undefined)_\n- **--dds-accordion-divider-color** - The color of the divider between accordion items (default: var(--dds-border-neutral-divider)) _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The main accordion container.\n- **heading** - The heading of the accordion.\n- **button** - The button of the accordion.\n- **content** - The content of the accordion.\n- **content-container** - The container of the accordion content.\n- **icon-wrapper** - The icon wrapper of the accordion.\n- **open-icon** - The icon when the accordion is opened.\n- **open-icon-base** - The base of the icon when the accordion is opened.\n- **close-icon** - The icon when the accordion is closed.\n- **close-icon-base** - The base of the icon when the accordion is closed.",
@@ -369,72 +408,6 @@
             ]
           }
         },
-        {
-          "name": "dap-ds-anchor-heading",
-          "description": "Anchor heading is a heading with an anchor link.\n---\n\n\n### **CSS Properties:**\n - **--dds-anchor-link-color** - The color of the anchor link (default: var(--dds-color-primary)) _(default: undefined)_\n- **--dds-anchor-link-opacity** - The opacity of the anchor link when not hovered (default: 0) _(default: undefined)_\n- **--dds-anchor-link-hover-opacity** - The opacity of the anchor link when hovered (default: 1) _(default: undefined)_\n- **--dds-anchor-link-transition** - The transition property for the anchor link opacity (default: opacity 0.2s ease-in-out) _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The main anchor heading container.\n- **link** - The link of the anchor heading. dap-ds-link element.\n- **link-base** - The base of the link part.\n- **text** - The text of the anchor heading.",
-          "doc-url": "",
-          "attributes": [
-            {
-              "name": "variant",
-              "description": "The variant of the heading. Default is `h2`. Can be `h1`, `h2`, `h3`, `h4`, `h5`, or `h6`.",
-              "value": { "type": "HeadingVariant" }
-            },
-            {
-              "name": "label",
-              "description": "The label of the heading.",
-              "value": { "type": "string" }
-            }
-          ],
-          "events": [],
-          "js": {
-            "properties": [
-              { "name": "variant", "type": "HeadingVariant" },
-              { "name": "label", "type": "string" },
-              { "name": "elementId" },
-              { "name": "anchorTitle" }
-            ],
-            "events": []
-          }
-        },
-        {
-          "name": "dap-ds-accordion-group",
-          "description": "An accordion group is a collection of accordion components.\n---\n\n\n### **Slots:**\n - _default_ - The content of the accordion group.\n\n### **CSS Properties:**\n - **--dds-accordion-group-spacing** - Controls the gap between accordion items (default: var(--dds-spacing-300)) _(default: undefined)_\n- **--dds-accordion-group-border-color** - Controls the border color (default: var(--dds-border-neutral-subtle)) _(default: undefined)_\n- **--dds-accordion-group-border-width** - Controls the border width (default: var(--dds-border-width-base)) _(default: undefined)_\n- **--dds-accordion-group-border-radius** - Controls the border radius (default: var(--dds-radius-base)) _(default: undefined)_\n- **--dds-accordion-group-background** - Controls the background color (default: transparent) _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The main accordion group container.",
-          "doc-url": "",
-          "attributes": [
-            {
-              "name": "autoClose",
-              "description": "Whether to close other accordions when one is opened.",
-              "value": { "type": "string", "default": "'true'" }
-            },
-            {
-              "name": "variant",
-              "description": "The variant of the accordion",
-              "value": {
-                "type": "'default' | 'collapsed' | 'clean' | 'clean-collapsed'",
-                "default": "'default'"
-              }
-            }
-          ],
-          "slots": [
-            { "name": "", "description": "The content of the accordion group." }
-          ],
-          "events": [],
-          "js": {
-            "properties": [
-              {
-                "name": "autoClose",
-                "description": "Whether to close other accordions when one is opened.",
-                "type": "string"
-              },
-              {
-                "name": "variant",
-                "description": "The variant of the accordion",
-                "type": "'default' | 'collapsed' | 'clean' | 'clean-collapsed'"
-              }
-            ],
-            "events": []
-          }
-        },
         {
           "name": "dap-ds-badge",
           "description": "A badge is a small status descriptor for UI elements.\n---\n\n\n### **Slots:**\n - _default_ - The content of the badge.\n- **icon** - The icon of the badge.\n\n### **CSS Properties:**\n - **--dds-badge-border-width** - The width of the badge's border (default: var(--dds-border-width-base)) _(default: undefined)_\n- **--dds-badge-border-style** - The style of the badge's border (default: solid) _(default: undefined)_\n- **--dds-badge-border-radius** - The border radius of the badge (default: var(--dds-radius-base)) _(default: undefined)_\n- **--dds-badge-font-weight** - The font weight of the badge text (default: var(--dds-font-weight-bold)) _(default: undefined)_\n- **--dds-badge-line-height** - The line height of the badge text (default: 1.2) _(default: undefined)_\n- **--dds-badge-transition** - The transition property for the badge (default: all 0.2s ease-in-out) _(default: undefined)_\n- **--dds-badge-padding-sm** - The padding of the small badge (default: var(--dds-spacing-100) var(--dds-spacing-200)) _(default: undefined)_\n- **--dds-badge-padding-lg** - The padding of the large badge (default: var(--dds-spacing-100) var(--dds-spacing-300)) _(default: undefined)_\n- **--dds-badge-font-size-sm** - The font size of the small badge (default: var(--dds-font-xs)) _(default: undefined)_\n- **--dds-badge-font-size-lg** - The font size of the large badge (default: var(--dds-font-sm)) _(default: undefined)_\n- **--dds-badge-neutral-border-color** - The border color of the neutral badge (default: var(--dds-border-neutral-base)) _(default: undefined)_\n- **--dds-badge-neutral-background** - The background color of the neutral badge (default: var(--dds-background-neutral-medium)) _(default: undefined)_\n- **--dds-badge-neutral-color** - The text color of the neutral badge (default: var(--dds-text-neutral-subtle)) _(default: undefined)_\n- **--dds-badge-brand-border-color** - The border color of the brand badge (default: var(--dds-border-brand-base)) _(default: undefined)_\n- **--dds-badge-brand-background** - The background color of the brand badge (default: var(--dds-background-brand-medium)) _(default: undefined)_\n- **--dds-badge-brand-color** - The text color of the brand badge (default: var(--dds-text-brand-subtle)) _(default: undefined)_\n- **--dds-badge-info-border-color** - The border color of the info badge (default: var(--dds-border-informative-base)) _(default: undefined)_\n- **--dds-badge-info-background** - The background color of the info badge (default: var(--dds-background-informative-medium)) _(default: undefined)_\n- **--dds-badge-info-color** - The text color of the info badge (default: var(--dds-text-informative-subtle)) _(default: undefined)_\n- **--dds-badge-positive-border-color** - The border color of the positive badge (default: var(--dds-border-positive-base)) _(default: undefined)_\n- **--dds-badge-positive-background** - The background color of the positive badge (default: var(--dds-background-positive-medium)) _(default: undefined)_\n- **--dds-badge-positive-color** - The text color of the positive badge (default: var(--dds-text-positive-subtle)) _(default: undefined)_\n- **--dds-badge-warning-border-color** - The border color of the warning badge (default: var(--dds-border-warning-subtle)) _(default: undefined)_\n- **--dds-badge-warning-background** - The background color of the warning badge (default: var(--dds-background-warning-medium)) _(default: undefined)_\n- **--dds-badge-warning-color** - The text color of the warning badge (default: var(--dds-text-warning-subtle)) _(default: undefined)_\n- **--dds-badge-negative-border-color** - The border color of the negative badge (default: var(--dds-border-negative-base)) _(default: undefined)_\n- **--dds-badge-negative-background** - The background color of the negative badge (default: var(--dds-background-negative-medium)) _(default: undefined)_\n- **--dds-badge-negative-color** - The text color of the negative badge (default: var(--dds-text-negative-subtle)) _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The main container of the badge.\n- **icon** - The icon of the badge.\n- **content** - The content of the badge.\n- **icon-base** - The base of the icon.",
@@ -495,6 +468,33 @@
             "events": []
           }
         },
+        {
+          "name": "dap-ds-anchor-heading",
+          "description": "Anchor heading is a heading with an anchor link.\n---\n\n\n### **CSS Properties:**\n - **--dds-anchor-link-color** - The color of the anchor link (default: var(--dds-color-primary)) _(default: undefined)_\n- **--dds-anchor-link-opacity** - The opacity of the anchor link when not hovered (default: 0) _(default: undefined)_\n- **--dds-anchor-link-hover-opacity** - The opacity of the anchor link when hovered (default: 1) _(default: undefined)_\n- **--dds-anchor-link-transition** - The transition property for the anchor link opacity (default: opacity 0.2s ease-in-out) _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The main anchor heading container.\n- **link** - The link of the anchor heading. dap-ds-link element.\n- **link-base** - The base of the link part.\n- **text** - The text of the anchor heading.",
+          "doc-url": "",
+          "attributes": [
+            {
+              "name": "variant",
+              "description": "The variant of the heading. Default is `h2`. Can be `h1`, `h2`, `h3`, `h4`, `h5`, or `h6`.",
+              "value": { "type": "HeadingVariant" }
+            },
+            {
+              "name": "label",
+              "description": "The label of the heading.",
+              "value": { "type": "string" }
+            }
+          ],
+          "events": [],
+          "js": {
+            "properties": [
+              { "name": "variant", "type": "HeadingVariant" },
+              { "name": "label", "type": "string" },
+              { "name": "elementId" },
+              { "name": "anchorTitle" }
+            ],
+            "events": []
+          }
+        },
         {
           "name": "dap-ds-banner",
           "description": "A banner is a message displayed at the top of the page to provide important information to the user.\n---\n\n\n### **Events:**\n - **dds-close** - Event fired when the banner is closed.\n\n### **Slots:**\n - _default_ - The content of the banner.\n- **actions** - Actions of banner\n- **icon** - The icon of the banner.\n\n### **CSS Properties:**\n - **--dds-banner-gap** - The gap between banner elements (default: var(--dds-spacing-200)) _(default: undefined)_\n- **--dds-banner-line-height** - The line height of the banner text (default: var(--dds-font-line-height-xlarge)) _(default: undefined)_\n- **--dds-banner-transition** - The transition property for the banner (default: all 0.2s ease-in-out) _(default: undefined)_\n- **--dds-banner-brand-background** - The background color of the brand banner (default: var(--dds-banner-background-brand)) _(default: undefined)_\n- **--dds-banner-brand-icon-color** - The color of the brand banner icon (default: var(--dds-banner-icon-brand)) _(default: undefined)_\n- **--dds-banner-brand-text-color** - The text color of the brand banner (default: var(--dds-banner-text-brand)) _(default: undefined)_\n- **--dds-banner-brand-action-color** - The color of the brand banner actions (default: var(--dds-banner-action-enabled)) _(default: undefined)_\n- **--dds-banner-info-background** - The background color of the info banner (default: var(--dds-banner-background-informative)) _(default: undefined)_\n- **--dds-banner-info-icon-color** - The color of the info banner icon (default: var(--dds-banner-icon-informative)) _(default: undefined)_\n- **--dds-banner-info-text-color** - The text color of the info banner (default: var(--dds-banner-text-informative)) _(default: undefined)_\n- **--dds-banner-info-action-color** - The color of the info banner actions (default: var(--dds-banner-action-enabled)) _(default: undefined)_\n- **--dds-banner-positive-background** - The background color of the positive banner (default: var(--dds-banner-background-positive)) _(default: undefined)_\n- **--dds-banner-positive-icon-color** - The color of the positive banner icon (default: var(--dds-banner-icon-positive)) _(default: undefined)_\n- **--dds-banner-positive-text-color** - The text color of the positive banner (default: var(--dds-banner-text-positive)) _(default: undefined)_\n- **--dds-banner-positive-action-color** - The color of the positive banner actions (default: var(--dds-banner-action-enabled)) _(default: undefined)_\n- **--dds-banner-warning-background** - The background color of the warning banner (default: var(--dds-banner-background-warning)) _(default: undefined)_\n- **--dds-banner-warning-icon-color** - The color of the warning banner icon (default: var(--dds-banner-icon-warning)) _(default: undefined)_\n- **--dds-banner-warning-text-color** - The text color of the warning banner (default: var(--dds-banner-text-warning)) _(default: undefined)_\n- **--dds-banner-warning-action-color** - The color of the warning banner actions (default: var(--dds-banner-action-inverted-enabled)) _(default: undefined)_\n- **--dds-banner-negative-background** - The background color of the negative banner (default: var(--dds-banner-background-negative)) _(default: undefined)_\n- **--dds-banner-negative-icon-color** - The color of the negative banner icon (default: var(--dds-banner-icon-negative)) _(default: undefined)_\n- **--dds-banner-negative-text-color** - The text color of the negative banner (default: var(--dds-banner-text-negative)) _(default: undefined)_\n- **--dds-banner-negative-action-color** - The color of the negative banner actions (default: var(--dds-banner-action-inverted-enabled)) _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The main banner container.\n- **card-base** - The wrapper card container.\n- **icon** - The icon of the banner.\n- **icon-element** - The icon element of the banner.\n- **icon-base** - The base of the icon.\n- **closebutton** - The close button of the banner.\n- **close-icon-element** - The icon element of the close button.\n- **close-icon-base** - The base of the close button icon.\n- **actions** - The actions of the banner.\n- **title** -  The title of the banner.",
@@ -5425,6 +5425,11 @@
                 "description": "The aria label of the tooltip.",
                 "type": "string"
               },
+              {
+                "name": "tooltipTrigger",
+                "description": "How the tooltip opens: `click` (click/Enter, default) or `hover` (hover and keyboard focus).",
+                "type": "'click' | 'hover'"
+              },
               {
                 "name": "feedback",
                 "description": "The feedback of the input.",
@@ -9983,7 +9988,8 @@
           "attributes": [
             {
               "name": "role",
-              "value": { "type": "string", "default": "'grid'" }
+              "description": "The html role of the table. A static data table is a `table`; `grid` is\nonly right for an interactive widget with keyboard-navigable cells.",
+              "value": { "type": "string", "default": "'table'" }
             },
             {
               "name": "mobile",
@@ -10005,7 +10011,11 @@
           "events": [],
           "js": {
             "properties": [
-              { "name": "role", "type": "string" },
+              {
+                "name": "role",
+                "description": "The html role of the table. A static data table is a `table`; `grid` is\nonly right for an interactive widget with keyboard-navigable cells.",
+                "type": "string"
+              },
               {
                 "name": "mobile",
                 "description": "If the table has mobile design",
@@ -11975,7 +11985,7 @@
           }
         },
         {
-          "name": "dap-ds-icon-arrow-left-line",
+          "name": "dap-ds-icon-arrow-left-s-fill",
           "description": "An icon\n---\n\n\n### **CSS Parts:**\n - **base** - The main icon container.",
           "doc-url": "",
           "attributes": [
@@ -12028,7 +12038,7 @@
           }
         },
         {
-          "name": "dap-ds-icon-arrow-left-s-fill",
+          "name": "dap-ds-icon-arrow-left-line",
           "description": "An icon\n---\n\n\n### **CSS Parts:**\n - **base** - The main icon container.",
           "doc-url": "",
           "attributes": [
@@ -12823,7 +12833,7 @@
           }
         },
         {
-          "name": "dap-ds-icon-computer-line",
+          "name": "dap-ds-icon-edit-line",
           "description": "An icon\n---\n\n\n### **CSS Parts:**\n - **base** - The main icon container.",
           "doc-url": "",
           "attributes": [
@@ -12876,7 +12886,7 @@
           }
         },
         {
-          "name": "dap-ds-icon-edit-line",
+          "name": "dap-ds-icon-tools-line",
           "description": "An icon\n---\n\n\n### **CSS Parts:**\n - **base** - The main icon container.",
           "doc-url": "",
           "attributes": [
@@ -12929,7 +12939,7 @@
           }
         },
         {
-          "name": "dap-ds-icon-tools-line",
+          "name": "dap-ds-icon-computer-line",
           "description": "An icon\n---\n\n\n### **CSS Parts:**\n - **base** - The main icon container.",
           "doc-url": "",
           "attributes": [

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

@@ -24,6 +24,7 @@ export type { DdsFocusEvent } from '../../events/events';
 * @property {string} tooltip - The tooltip of the input.
 * @property {'top' | 'right' | 'bottom' | 'left'} tooltipPlacement - The tooltip placement of the input.
 * @property {string} tooltipAriaLabel - The aria label of the tooltip.
+* @property {'click' | 'hover'} tooltipTrigger - How the tooltip opens: `click` (click/Enter, default) or `hover` (hover and keyboard focus).
 * @property {string} feedback - The feedback of the input.
 * @property {'negative' | 'positive' | 'warning'} feedbackType - The feedback type of the input. Can be `negative`, `positive`, or `warning`.
 * @property {'succes' | 'error'} status - The status of the input. Can be `success` or `error`.

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

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../src/react/dap-ds-input/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/input/input.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 {boolean} hideLabel - Visually hides the label while keeping it available to assistive technology. (default: false)\n * @property {string} description - The description of the input.\n * @property {string} optionalLabel - Text of optional label.\n * @property {string} requiredLabel - Text of required indicator. (default: '*')\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    "],"names":["tagName","reactWrapper","createComponent","Component","React"],"mappings":";;;;AAiBM,MAAMA,IAAU,gBAsGVC,IAAeC,EAAgB;AAAA,EACnC,SAAAF;AAAA,EACA,cAAcG;AAAAA,EACd,OAAOC;AAAA,EACP,QAAQ;AAAA,IACN,aAAa;AAAA,IACvB,YAAY;AAAA,IACZ,cAAc;AAAA,IACd,WAAW;AAAA,IACX,YAAY;AAAA,EACJ;AAAA,EACA,aAAa;AACf,CAAC;"}
+{"version":3,"file":"index.js","sources":["../../../src/react/dap-ds-input/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/input/input.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 {boolean} hideLabel - Visually hides the label while keeping it available to assistive technology. (default: false)\n * @property {string} description - The description of the input.\n * @property {string} optionalLabel - Text of optional label.\n * @property {string} requiredLabel - Text of required indicator. (default: '*')\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 {'click' | 'hover'} tooltipTrigger - How the tooltip opens: `click` (click/Enter, default) or `hover` (hover and keyboard focus).\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    "],"names":["tagName","reactWrapper","createComponent","Component","React"],"mappings":";;;;AAiBM,MAAMA,IAAU,gBAuGVC,IAAeC,EAAgB;AAAA,EACnC,SAAAF;AAAA,EACA,cAAcG;AAAAA,EACd,OAAOC;AAAA,EACP,QAAQ;AAAA,IACN,aAAa;AAAA,IACvB,YAAY;AAAA,IACZ,cAAc;AAAA,IACd,WAAW;AAAA,IACX,YAAY;AAAA,EACJ;AAAA,EACA,aAAa;AACf,CAAC;"}

package/dist/react/index.d.ts

@@ -1,9 +1,9 @@
+export { default as DapDSAccordionGroupReact } from './dap-ds-accordion-group/index.js';
 export { default as DapDSAccordionReact } from './dap-ds-accordion/index.js';
 export { default as DapDSAvatarReact } from './dap-ds-avatar/index.js';
 export { default as DapDSAvatarGroupReact } from './dap-ds-avatar-group/index.js';
-export { default as DapDSAnchorHeadingReact } from './dap-ds-anchor-heading/index.js';
-export { default as DapDSAccordionGroupReact } from './dap-ds-accordion-group/index.js';
 export { default as DapDSBadgeReact } from './dap-ds-badge/index.js';
+export { default as DapDSAnchorHeadingReact } from './dap-ds-anchor-heading/index.js';
 export { default as DapDSBannerReact } from './dap-ds-banner/index.js';
 export { default as DapDSBreadcrumbReact } from './dap-ds-breadcrumb/index.js';
 export { default as DapDSBreadcrumbItemReact } from './dap-ds-breadcrumb-item/index.js';
@@ -97,8 +97,8 @@ export { default as ArrowsArrowDownSFillReact } from './dap-ds-icon-arrow-down-s
 export { default as ArrowsArrowDownSLineReact } from './dap-ds-icon-arrow-down-s-line/index.js';
 export { default as ArrowsArrowLeftDownLineReact } from './dap-ds-icon-arrow-left-down-line/index.js';
 export { default as ArrowsArrowLeftLLineReact } from './dap-ds-icon-arrow-left-l-line/index.js';
-export { default as ArrowsArrowLeftLineReact } from './dap-ds-icon-arrow-left-line/index.js';
 export { default as ArrowsArrowLeftSFillReact } from './dap-ds-icon-arrow-left-s-fill/index.js';
+export { default as ArrowsArrowLeftLineReact } from './dap-ds-icon-arrow-left-line/index.js';
 export { default as ArrowsArrowLeftSLineReact } from './dap-ds-icon-arrow-left-s-line/index.js';
 export { default as ArrowsArrowLeftUpLineReact } from './dap-ds-icon-arrow-left-up-line/index.js';
 export { default as ArrowsArrowRightDownLineReact } from './dap-ds-icon-arrow-right-down-line/index.js';
@@ -113,9 +113,9 @@ export { default as ArrowsArrowUpSLineReact } from './dap-ds-icon-arrow-up-s-lin
 export { default as ArrowsExpandUpDownFillReact } from './dap-ds-icon-expand-up-down-fill/index.js';
 export { default as BuildingsHome6LineReact } from './dap-ds-icon-home-6-line/index.js';
 export { default as BusinessCalendarLineReact } from './dap-ds-icon-calendar-line/index.js';
-export { default as DeviceComputerLineReact } from './dap-ds-icon-computer-line/index.js';
 export { default as DesignEditLineReact } from './dap-ds-icon-edit-line/index.js';
 export { default as DesignToolsLineReact } from './dap-ds-icon-tools-line/index.js';
+export { default as DeviceComputerLineReact } from './dap-ds-icon-computer-line/index.js';
 export { default as DocumentClipboardLineReact } from './dap-ds-icon-clipboard-line/index.js';
 export { default as DocumentFileCopyLineReact } from './dap-ds-icon-file-copy-line/index.js';
 export { default as DocumentFileImageLineReact } from './dap-ds-icon-file-image-line/index.js';

package/dist/react-types.ts

@@ -3,12 +3,12 @@ import type { DdsAllUploadsCompleteEvent, DdsAnchorChangeEvent, DdsBeforeCloseEv
 type HtmlType = { children?: React.ReactNode | Element, class?: string, ref?: React.RefObject<any>, key?: React.Key | null | undefined,
   style?: Partial<CSSStyleDeclaration>, id?: string, onClick?: (e: React.MouseEvent) => void, onChange?: (e: React.ChangeEvent) => void}
   
+export type DapDSAccordionGroupType = HtmlType & Partial<Omit<DDS.DapDSAccordionGroup, 'children' | 'style'>>
 export type DapDSAccordionType = HtmlType & Partial<Omit<DDS.DapDSAccordion, 'children' | 'style'>> & { "ondds-opened"?: (e: DdsOpenedEvent) => void, "ondds-closed"?: (e: DdsClosedEvent) => void }
 export type DapDSAvatarType = HtmlType & Partial<Omit<DDS.DapDSAvatar, 'children' | 'style'>> & { "ondds-load"?: (e: DdsLoadEvent) => void, "ondds-error"?: (e: DdsErrorEvent) => void }
 export type DapDSAvatarGroupType = HtmlType & Partial<Omit<DDS.DapDSAvatarGroup, 'children' | 'style'>> & { "ondds-overflow-click"?: (e: DdsOverflowClickEvent) => void }
-export type DapDSAnchorHeadingType = HtmlType & Partial<Omit<DDS.DapDSAnchorHeading, 'children' | 'style'>>
-export type DapDSAccordionGroupType = HtmlType & Partial<Omit<DDS.DapDSAccordionGroup, 'children' | 'style'>>
 export type DapDSBadgeType = HtmlType & Partial<Omit<DDS.DapDSBadge, 'children' | 'style'>>
+export type DapDSAnchorHeadingType = HtmlType & Partial<Omit<DDS.DapDSAnchorHeading, 'children' | 'style'>>
 export type DapDSBannerType = HtmlType & Partial<Omit<DDS.DapDSBanner, 'children' | 'style'>> & { "ondds-close"?: (e: DdsCloseEvent) => void }
 export type DapDSBreadcrumbType = HtmlType & Partial<Omit<DDS.DapDSBreadcrumb, 'children' | 'style'>>
 export type DapDSBreadcrumbItemType = HtmlType & Partial<Omit<DDS.DapDSBreadcrumbItem, 'children' | 'style'>>
@@ -102,8 +102,8 @@ export type ArrowsArrowDownSFillType = HtmlType & Partial<Omit<DDS.ArrowsArrowDo
 export type ArrowsArrowDownSLineType = HtmlType & Partial<Omit<DDS.ArrowsArrowDownSLine, 'children' | 'style'>>
 export type ArrowsArrowLeftDownLineType = HtmlType & Partial<Omit<DDS.ArrowsArrowLeftDownLine, 'children' | 'style'>>
 export type ArrowsArrowLeftLLineType = HtmlType & Partial<Omit<DDS.ArrowsArrowLeftLLine, 'children' | 'style'>>
-export type ArrowsArrowLeftLineType = HtmlType & Partial<Omit<DDS.ArrowsArrowLeftLine, 'children' | 'style'>>
 export type ArrowsArrowLeftSFillType = HtmlType & Partial<Omit<DDS.ArrowsArrowLeftSFill, 'children' | 'style'>>
+export type ArrowsArrowLeftLineType = HtmlType & Partial<Omit<DDS.ArrowsArrowLeftLine, 'children' | 'style'>>
 export type ArrowsArrowLeftSLineType = HtmlType & Partial<Omit<DDS.ArrowsArrowLeftSLine, 'children' | 'style'>>
 export type ArrowsArrowLeftUpLineType = HtmlType & Partial<Omit<DDS.ArrowsArrowLeftUpLine, 'children' | 'style'>>
 export type ArrowsArrowRightDownLineType = HtmlType & Partial<Omit<DDS.ArrowsArrowRightDownLine, 'children' | 'style'>>
@@ -118,9 +118,9 @@ export type ArrowsArrowUpSLineType = HtmlType & Partial<Omit<DDS.ArrowsArrowUpSL
 export type ArrowsExpandUpDownFillType = HtmlType & Partial<Omit<DDS.ArrowsExpandUpDownFill, 'children' | 'style'>>
 export type BuildingsHome6LineType = HtmlType & Partial<Omit<DDS.BuildingsHome6Line, 'children' | 'style'>>
 export type BusinessCalendarLineType = HtmlType & Partial<Omit<DDS.BusinessCalendarLine, 'children' | 'style'>>
-export type DeviceComputerLineType = HtmlType & Partial<Omit<DDS.DeviceComputerLine, 'children' | 'style'>>
 export type DesignEditLineType = HtmlType & Partial<Omit<DDS.DesignEditLine, 'children' | 'style'>>
 export type DesignToolsLineType = HtmlType & Partial<Omit<DDS.DesignToolsLine, 'children' | 'style'>>
+export type DeviceComputerLineType = HtmlType & Partial<Omit<DDS.DeviceComputerLine, 'children' | 'style'>>
 export type DocumentClipboardLineType = HtmlType & Partial<Omit<DDS.DocumentClipboardLine, 'children' | 'style'>>
 export type DocumentFileCopyLineType = HtmlType & Partial<Omit<DDS.DocumentFileCopyLine, 'children' | 'style'>>
 export type DocumentFileImageLineType = HtmlType & Partial<Omit<DDS.DocumentFileImageLine, 'children' | 'style'>>

package/dist/react.js

@@ -1,9 +1,9 @@
-import { default as t } from "./react/dap-ds-accordion/index.js";
-import { default as o } from "./react/dap-ds-avatar/index.js";
-import { default as p } from "./react/dap-ds-avatar-group/index.js";
-import { default as s } from "./react/dap-ds-anchor-heading/index.js";
-import { default as c } from "./react/dap-ds-accordion-group/index.js";
-import { default as u } from "./react/dap-ds-badge/index.js";
+import { default as t } from "./react/dap-ds-accordion-group/index.js";
+import { default as o } from "./react/dap-ds-accordion/index.js";
+import { default as p } from "./react/dap-ds-avatar/index.js";
+import { default as s } from "./react/dap-ds-avatar-group/index.js";
+import { default as c } from "./react/dap-ds-badge/index.js";
+import { default as u } from "./react/dap-ds-anchor-heading/index.js";
 import { default as x } from "./react/dap-ds-banner/index.js";
 import { default as i } from "./react/dap-ds-breadcrumb/index.js";
 import { default as n } from "./react/dap-ds-breadcrumb-item/index.js";
@@ -97,8 +97,8 @@ import { default as Tt } from "./react/dap-ds-icon-arrow-down-s-fill/index.js";
 import { default as Ut } from "./react/dap-ds-icon-arrow-down-s-line/index.js";
 import { default as Ot } from "./react/dap-ds-icon-arrow-left-down-line/index.js";
 import { default as Gt } from "./react/dap-ds-icon-arrow-left-l-line/index.js";
-import { default as Et } from "./react/dap-ds-icon-arrow-left-line/index.js";
-import { default as Nt } from "./react/dap-ds-icon-arrow-left-s-fill/index.js";
+import { default as Et } from "./react/dap-ds-icon-arrow-left-s-fill/index.js";
+import { default as Nt } from "./react/dap-ds-icon-arrow-left-line/index.js";
 import { default as Zt } from "./react/dap-ds-icon-arrow-left-s-line/index.js";
 import { default as jt } from "./react/dap-ds-icon-arrow-left-up-line/index.js";
 import { default as zt } from "./react/dap-ds-icon-arrow-right-down-line/index.js";
@@ -113,9 +113,9 @@ import { default as sr } from "./react/dap-ds-icon-arrow-up-s-line/index.js";
 import { default as cr } from "./react/dap-ds-icon-expand-up-down-fill/index.js";
 import { default as ur } from "./react/dap-ds-icon-home-6-line/index.js";
 import { default as xr } from "./react/dap-ds-icon-calendar-line/index.js";
-import { default as ir } from "./react/dap-ds-icon-computer-line/index.js";
-import { default as nr } from "./react/dap-ds-icon-edit-line/index.js";
-import { default as yr } from "./react/dap-ds-icon-tools-line/index.js";
+import { default as ir } from "./react/dap-ds-icon-edit-line/index.js";
+import { default as nr } from "./react/dap-ds-icon-tools-line/index.js";
+import { default as yr } from "./react/dap-ds-icon-computer-line/index.js";
 import { default as Ar } from "./react/dap-ds-icon-clipboard-line/index.js";
 import { default as Fr } from "./react/dap-ds-icon-file-copy-line/index.js";
 import { default as br } from "./react/dap-ds-icon-file-image-line/index.js";
@@ -186,8 +186,8 @@ export {
   Ut as ArrowsArrowDownSLineReact,
   Ot as ArrowsArrowLeftDownLineReact,
   Gt as ArrowsArrowLeftLLineReact,
-  Et as ArrowsArrowLeftLineReact,
-  Nt as ArrowsArrowLeftSFillReact,
+  Nt as ArrowsArrowLeftLineReact,
+  Et as ArrowsArrowLeftSFillReact,
   Zt as ArrowsArrowLeftSLineReact,
   jt as ArrowsArrowLeftUpLineReact,
   zt as ArrowsArrowRightDownLineReact,
@@ -202,12 +202,12 @@ export {
   cr as ArrowsExpandUpDownFillReact,
   ur as BuildingsHome6LineReact,
   xr as BusinessCalendarLineReact,
-  c as DapDSAccordionGroupReact,
-  t as DapDSAccordionReact,
-  s as DapDSAnchorHeadingReact,
-  p as DapDSAvatarGroupReact,
-  o as DapDSAvatarReact,
-  u as DapDSBadgeReact,
+  t as DapDSAccordionGroupReact,
+  o as DapDSAccordionReact,
+  u as DapDSAnchorHeadingReact,
+  s as DapDSAvatarGroupReact,
+  p as DapDSAvatarReact,
+  c as DapDSBadgeReact,
   x as DapDSBannerReact,
   n as DapDSBreadcrumbItemReact,
   i as DapDSBreadcrumbReact,
@@ -296,9 +296,9 @@ export {
   it as DapDSTooltipReact,
   nt as DapDSTrayReact,
   yt as DapDSTypographyReact,
-  nr as DesignEditLineReact,
-  yr as DesignToolsLineReact,
-  ir as DeviceComputerLineReact,
+  ir as DesignEditLineReact,
+  nr as DesignToolsLineReact,
+  yr as DeviceComputerLineReact,
   Ar as DocumentClipboardLineReact,
   Fr as DocumentFileCopyLineReact,
   br as DocumentFileImageLineReact,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "dap-design-system",
-  "version": "0.62.0",
+  "version": "0.62.2",
   "description": "Official design system for the DÁP (dap.gov.hu)",
   "main": "dist/dds.js",
   "module": "dist/dds.js",