@public-ui/components 1.6.0-rc.24 → 1.6.0-rc.25

package/dist/types/types/button-link-text.d.ts

@@ -1,20 +1,18 @@
 import { Generic } from '@a11y-ui/core';
-import { KoliBriButtonCallbacks, LinkTarget } from './button-link';
 import { PropHideLabel } from './props/hide-label';
 import { PropHref } from './props/href';
 import { PropIcon } from './props/icon';
 import { PropLabel } from './props/label';
 import { StencilUnknown } from './unknown';
-type RequiredButtonProps = PropLabel & {
-  on: KoliBriButtonCallbacks<StencilUnknown>;
-};
+import { PropButtonCallbacks } from './props/button-callbacks';
+import { PropLinkTarget } from './props/link-target';
+type RequiredButtonProps = PropLabel & PropButtonCallbacks<StencilUnknown>;
 type RequiredLinkProps = PropHref;
 type RequiredTextProps = PropLabel;
-type OptionalButtonOrLinkOrTextProps = PropHideLabel & PropIcon & {
+type OptionalButtonOrLinkOrTextProps = PropHideLabel & {
   active: boolean;
-  target: LinkTarget;
   targetDescription: string;
-};
+} & PropIcon & PropLinkTarget;
 type OptionalButtonProps = OptionalButtonOrLinkOrTextProps & {
   disabled: boolean;
 };

package/dist/types/types/button-link.d.ts

@@ -1,110 +1,6 @@
-import { Generic } from '@a11y-ui/core';
 import { Events } from '../enums/events';
-import { EventCallback, EventValueOrEventCallback } from './callbacks';
-import { Stringified } from './common';
-import { KoliBriAllIcon, KoliBriIconProp } from './icon';
-import { AlignPropType } from './props/align';
-import { PropAriaControls } from './props/aria-controls';
-import { PropAriaCurrent, PropListenAriaCurrent } from './props/aria-current';
-import { AriaExpandedPropType, PropAriaExpanded } from './props/aria-expanded';
-import { PropAriaLabel } from './props/aria-label';
-import { PropAriaSelected } from './props/aria-selected';
-import { PropDisabled } from './props/disabled';
-import { PropDownload } from './props/download';
-import { PropHideLabel } from './props/hide-label';
-import { PropHref } from './props/href';
-import { PropId } from './props/id';
-import { PropLabelWithExpertSlot } from './props/label';
-import { PropName } from './props/name';
-import { PropStealth } from './props/stealth';
-import { StencilUnknown } from './unknown';
-export type AlternativButtonLinkRole = 'button' | 'link' | 'tab';
-type OptionalButtonAndLinkProps = {
-  ariaControls: string;
-  ariaExpanded: AriaExpandedPropType;
-  ariaSelected: boolean;
-  disabled: boolean;
-  icon: Stringified<KoliBriIconProp>;
-  iconAlign: AlignPropType;
-  iconOnly: boolean;
-  role: AlternativButtonLinkRole;
-  tabIndex: number;
-  tooltipAlign: AlignPropType;
-} & PropAriaCurrent & PropAriaLabel & PropHideLabel;
-type RequiredButtonAndLinkStates = {
-  icon: KoliBriAllIcon;
-};
-type OptionalButtonAndLinkStates = {
-  ariaControls: string;
-  ariaExpanded: AriaExpandedPropType;
-  ariaSelected: boolean;
-  disabled: boolean;
-  iconAlign: AlignPropType;
-  iconOnly: boolean;
-  role: AlternativButtonLinkRole;
-  tabIndex: number;
-  tooltipAlign: AlignPropType;
-} & PropAriaCurrent & PropHideLabel;
-export type KoliBriButtonType = 'button' | 'reset' | 'submit';
-export type KoliBriButtonVariant = 'primary' | 'secondary' | 'normal' | 'tertiary' | 'danger' | 'ghost' | 'custom';
-export type KoliBriButtonCallbacks<T> = {
-  [Events.onClick]?: EventValueOrEventCallback<MouseEvent, T>;
-  [Events.onMouseDown]?: EventCallback<MouseEvent>;
-};
-export type KoliBriButtonVariantPropState = {
-  variant: KoliBriButtonVariant;
-};
-export type KoliBriButtonCustomClassPropState = {
-  customClass: string;
-};
-export type RequiredButtonLinkProps = unknown;
-export type OptionalButtonLinkProps = OptionalButtonAndLinkProps & {
-  accessKey: string;
-  on: KoliBriButtonCallbacks<StencilUnknown>;
-  syncValueBySelector: string;
-  type: KoliBriButtonType;
-  value: Stringified<StencilUnknown>;
-} & PropDisabled & PropId & PropLabelWithExpertSlot & PropName;
-export type ButtonLinkProps = Generic.Element.Members<RequiredButtonProps, OptionalButtonProps>;
-type RequiredButtonLinkStates = RequiredButtonAndLinkStates & PropLabelWithExpertSlot & KoliBriButtonVariantPropState & {
-  type: KoliBriButtonType;
-};
-type OptionalButtonLinkStates = OptionalButtonAndLinkStates & KoliBriButtonCustomClassPropState & {
-  accessKey: string;
-  on: KoliBriButtonCallbacks<StencilUnknown>;
-  syncValueBySelector: string;
-  value: StencilUnknown;
-} & PropDisabled & PropId & PropName;
-export type ButtonLinkStates = Generic.Element.Members<RequiredButtonStates, OptionalButtonStates>;
-export type RequiredButtonProps = RequiredButtonLinkProps & PropLabelWithExpertSlot;
-export type OptionalButtonProps = OptionalButtonLinkProps & PropAriaControls & PropAriaExpanded & PropAriaSelected & PropDisabled & KoliBriButtonVariantPropState & KoliBriButtonCustomClassPropState;
-export type ButtonProps = Generic.Element.Members<RequiredButtonProps, OptionalButtonProps>;
-export type RequiredButtonStates = RequiredButtonLinkStates & KoliBriButtonVariantPropState & PropLabelWithExpertSlot;
-export type OptionalButtonStates = OptionalButtonLinkStates & PropAriaControls & PropAriaExpanded & PropAriaSelected & PropDisabled & KoliBriButtonCustomClassPropState;
-export type ButtonStates = Generic.Element.Members<RequiredButtonStates, OptionalButtonStates>;
+import { EventValueOrEventCallback } from './callbacks';
 export type LinkOnCallbacks = {
   [Events.onClick]?: EventValueOrEventCallback<Event, string>;
 };
-export type LinkTarget = '_blank' | '_parent' | '_self' | '_top' | string;
 export type LinkUseCase = 'text' | 'image' | 'nav';
-type RequiredLinkProps = PropHref;
-type OptionalLinkProps = OptionalButtonAndLinkProps & {
-  on: LinkOnCallbacks;
-  selector: string;
-  target: LinkTarget;
-  targetDescription: string;
-  useCase: LinkUseCase;
-} & PropDownload & PropLabelWithExpertSlot & PropListenAriaCurrent & PropStealth;
-export type LinkProps = Generic.Element.Members<RequiredLinkProps, OptionalLinkProps>;
-type RequiredLinkStates = RequiredButtonAndLinkStates & PropHref & PropLabelWithExpertSlot;
-type OptionalLinkStates = OptionalButtonAndLinkStates & {
-  on: LinkOnCallbacks;
-  selector: string;
-  target: LinkTarget;
-  targetDescription: string;
-  useCase: LinkUseCase;
-} & PropDownload & PropListenAriaCurrent & PropStealth;
-export type LinkStates = Generic.Element.Members<RequiredLinkStates, OptionalLinkStates>;
-export type KoliBriLinkAPI = Generic.Element.ComponentApi<RequiredLinkProps, OptionalLinkProps, RequiredLinkStates, OptionalLinkStates>;
-export declare const watchTooltipAlignment: (component: Generic.Element.Component, propName: string, value?: AlignPropType) => void;
-export {};

package/dist/types/types/input/control/number.d.ts

@@ -1,4 +1,4 @@
-import { ButtonProps } from '../../button-link';
+import { Props as ButtonProps } from '../../../components/button/types';
 import { Stringified } from '../../common';
 import { KoliBriHorizontalIcon } from '../../icon';
 import { InputTypeOnDefault, InputTypeOnOff } from '../types';

package/dist/types/types/props/alternative-button-link-role.d.ts

@@ -0,0 +1,6 @@
+import { Generic } from '@a11y-ui/core';
+export type AlternativeButtonLinkRolePropType = 'button' | 'link' | 'tab';
+export type PropAlternativeButtonLinkRole = {
+  role: AlternativeButtonLinkRolePropType;
+};
+export declare const validateAlternativeButtonLinkRole: (component: Generic.Element.Component, value?: AlternativeButtonLinkRolePropType) => void;

package/dist/types/types/props/aria-expanded.d.ts

@@ -1,6 +1,7 @@
 import { Generic } from '@a11y-ui/core';
-export type AriaExpandedPropType = boolean;
+type AriaExpandedPropType = boolean;
 export type PropAriaExpanded = {
   ariaExpanded: AriaExpandedPropType;
 };
 export declare const validateAriaExpanded: (component: Generic.Element.Component, value?: AriaExpandedPropType) => void;
+export {};

package/dist/types/types/props/aria-selected.d.ts

@@ -1,5 +1,7 @@
 import { Generic } from '@a11y-ui/core';
+type AriaSelectedPropType = boolean;
 export type PropAriaSelected = {
-  ariaSelected: boolean;
+  ariaSelected: AriaSelectedPropType;
 };
 export declare const validateAriaSelected: (component: Generic.Element.Component, value?: boolean) => void;
+export {};

package/dist/types/types/props/button-callbacks.d.ts

@@ -0,0 +1,12 @@
+import { Events } from '../../enums/events';
+import { EventCallback, EventValueOrEventCallback } from '../callbacks';
+import { Generic } from '@a11y-ui/core';
+import { StencilUnknown } from '../unknown';
+export type ButtonCallbacksPropType<T> = {
+  [Events.onClick]?: EventValueOrEventCallback<MouseEvent, T>;
+  [Events.onMouseDown]?: EventCallback<MouseEvent>;
+};
+export type PropButtonCallbacks<T> = {
+  on: ButtonCallbacksPropType<T>;
+};
+export declare const validateButtonCallbacks: (component: Generic.Element.Component, value?: ButtonCallbacksPropType<StencilUnknown>) => void;

package/dist/types/types/props/button-type.d.ts

@@ -0,0 +1,6 @@
+import { Generic } from '@a11y-ui/core';
+export type ButtonTypePropType = 'button' | 'reset' | 'submit';
+export type PropButtonType = {
+  type: ButtonTypePropType;
+};
+export declare const validateButtonType: (component: Generic.Element.Component, value?: ButtonTypePropType) => void;

package/dist/types/types/props/button-variant.d.ts

@@ -0,0 +1,6 @@
+import { Generic } from '@a11y-ui/core';
+export type ButtonVariantPropType = 'primary' | 'secondary' | 'normal' | 'tertiary' | 'danger' | 'ghost' | 'custom';
+export type PropButtonVariant = {
+  variant: ButtonVariantPropType;
+};
+export declare const validateButtonVariant: (component: Generic.Element.Component, value?: ButtonVariantPropType) => void;

package/dist/types/types/props/custom-class.d.ts

@@ -0,0 +1,6 @@
+import { Generic } from '@a11y-ui/core';
+export type CustomClassPropType = string;
+export type PropCustomClass = {
+  customClass: CustomClassPropType;
+};
+export declare const validateCustomClass: (component: Generic.Element.Component, value?: CustomClassPropType) => void;

package/dist/types/types/props/icon.d.ts

@@ -2,7 +2,7 @@ import { Generic } from '@a11y-ui/core';
 import { Stringified } from '../common';
 import { KoliBriIconProp, KoliBriIconState } from '../icon';
 import { AlignPropType } from './align';
-type IconPropType = Stringified<KoliBriIconProp>;
+export type IconPropType = Stringified<KoliBriIconProp>;
 export type PropIcon = {
   icon: IconPropType;
 };
@@ -10,4 +10,3 @@ export declare const mapIconProp2State: (icon: KoliBriIconProp, iconAlign?: Alig
 export declare const isIcon: (value?: unknown) => boolean;
 export declare const validateIcon: (component: Generic.Element.Component, value?: IconPropType) => void;
 export declare const watchIconAlign: (component: Generic.Element.Component, value?: AlignPropType) => void;
-export {};

package/dist/types/types/props/link-target.d.ts

@@ -0,0 +1,6 @@
+import { Generic } from '@a11y-ui/core';
+export type LinkTargetPropType = '_blank' | '_parent' | '_self' | '_top' | string;
+export type PropLinkTarget = {
+  target: LinkTargetPropType;
+};
+export declare const validateLinkTarget: (component: Generic.Element.Component, value?: LinkTargetPropType) => void;

package/dist/types/types/props/required.d.ts

@@ -1,6 +1,7 @@
 import { Generic } from '@a11y-ui/core';
-export type RequiredPropType = boolean;
+type RequiredPropType = boolean;
 export type PropRequired = {
   required: RequiredPropType;
 };
 export declare const validateRequired: (component: Generic.Element.Component, value?: RequiredPropType) => void;
+export {};

package/dist/types/types/props/sync-value-by-selector.d.ts

@@ -0,0 +1,4 @@
+export type SyncValueBySelectorPropType = string;
+export type PropSyncValueBySelector = {
+  syncValueBySelector: SyncValueBySelectorPropType;
+};

package/dist/types/types/props/tooltip-align.d.ts

@@ -0,0 +1,7 @@
+import { Generic } from '@a11y-ui/core';
+import { AlignPropType } from './align';
+export type TooltipAlignPropType = AlignPropType;
+export type PropTooltipAlign = {
+  tooltipAlign: TooltipAlignPropType;
+};
+export declare const validateTooltipAlign: (component: Generic.Element.Component, value?: TooltipAlignPropType) => void;

package/doc/abbr.md

@@ -47,7 +47,7 @@ Der KoliBri Tooltip kann von Screenreadern vorgelesen werden und verändert sein
 
 | Property        | Attribute        | Description                                                                                                                                   | Type                                                  | Default     |
 | --------------- | ---------------- | --------------------------------------------------------------------------------------------------------------------------------------------- | ----------------------------------------------------- | ----------- |
-| `_label`        | `_label`         | Defines the abbreviation title and tooltip content                                                                                            | `string` \| `undefined`                                 | `undefined` |
+| `_label`        | `_label`         | Setzt die sichtbare oder semantische Beschriftung der Komponente (z.B. Aria-Label, Label, Headline, Caption, Summary usw.).                   | `string` \| `undefined`                                 | `undefined` |
 | `_title`        | `_title`         | <span class="text-red-500">**[DEPRECATED]**</span> Use _label.<br/><br/>Dieses Property gibt die Beschreibung oder Erläuterung der Abkürzung an. | `string` \| `undefined`                                 | `undefined` |
 | `_tooltipAlign` | `_tooltip-align` | Defines where to show the Tooltip preferably: top, right, bottom or left.                                                                     | `"bottom"` \| `"left"` \| `"right"` \| `"top"` \| `undefined` | `'top'`     |
 

package/doc/accordion.md

@@ -122,13 +122,13 @@ Standardansicht gelegt.
 
 ## Properties
 
-| Property   | Attribute  | Description                                                                                                                                           | Type                                                                                 | Default     |
-| ---------- | ---------- | ----------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------ | ----------- |
-| `_heading` | `_heading` | <span class="text-red-500">**[DEPRECATED]**</span> Use _label.<br/><br/>Gibt die Beschriftung der Komponente an.                                         | `string` \| `undefined`                                                                | `undefined` |
-| `_label`   | `_label`   | Defines the button label                                                                                                                              | `string` \| `undefined`                                                                | `undefined` |
-| `_level`   | `_level`   | Gibt an, welchen H-Level von 1 bis 6 die Überschrift hat. Oder bei 0, ob es keine Überschrift ist und als fett gedruckter Text angezeigt werden soll. | `0` \| `1` \| `2` \| `3` \| `4` \| `5` \| `6` \| `undefined`                                       | `1`         |
-| `_on`      | --         | Gibt die EventCallback-Funktionen an.                                                                                                                 | `undefined` \| `{ onClick?: EventValueOrEventCallback<Event, boolean>` \| `undefined; }` | `undefined` |
-| `_open`    | `_open`    | If set (to true) opens/expands the element, closes if not set (or set to false).                                                                      | `boolean` \| `undefined`                                                               | `false`     |
+| Property   | Attribute  | Description                                                                                                                                                    | Type                                                                                 | Default     |
+| ---------- | ---------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------ | ----------- |
+| `_heading` | `_heading` | <span class="text-red-500">**[DEPRECATED]**</span> Use _label.<br/><br/>Gibt die Beschriftung der Komponente an.                                                  | `string` \| `undefined`                                                                | `undefined` |
+| `_label`   | `_label`   | Setzt die sichtbare oder semantische Beschriftung der Komponente (z.B. Aria-Label, Label, Headline, Caption, Summary usw.).                                    | `string` \| `undefined`                                                                | `undefined` |
+| `_level`   | `_level`   | Gibt an, welchen H-Level von 1 bis 6 die Überschrift hat. Oder bei 0, ob es keine Überschrift ist und als fett gedruckter Text angezeigt werden soll.          | `0` \| `1` \| `2` \| `3` \| `4` \| `5` \| `6` \| `undefined`                                       | `1`         |
+| `_on`      | --         | Gibt die EventCallback-Funktionen an.                                                                                                                          | `undefined` \| `{ onClick?: EventValueOrEventCallback<Event, boolean>` \| `undefined; }` | `undefined` |
+| `_open`    | `_open`    | If set (to true) opens/expands the element, closes if not set (or set to false). TODO: Change type back to `OpenPropType` after Stencil#4663 has been resolved | `boolean` \| `undefined`                                                               | `false`     |
 
 
 ## Slots

package/doc/alert.md

@@ -83,8 +83,8 @@ Bei der **Alert**-Komponente wurden insbesondere folgende Punkte der Barrierefre
 | Property     | Attribute     | Description                                                                                                                                           | Type                                                                    | Default     |
 | ------------ | ------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------- | ----------------------------------------------------------------------- | ----------- |
 | `_alert`     | `_alert`      | Gibt an, ob der Screenreader die Meldung aktiv vorlesen soll.                                                                                         | `boolean` \| `undefined`                                                  | `false`     |
-| `_hasCloser` | `_has-closer` | Defines whether the element can be closed.                                                                                                            | `boolean` \| `undefined`                                                  | `false`     |
-| `_label`     | `_label`      | Defines the description of the component.                                                                                                             | `string` \| `undefined`                                                   | `undefined` |
+| `_hasCloser` | `_has-closer` | Defines whether the element can be closed. TODO: Change type back to `HasCloserPropType` after Stencil#4663 has been resolved                         | `boolean` \| `undefined`                                                  | `false`     |
+| `_label`     | `_label`      | Setzt die sichtbare oder semantische Beschriftung der Komponente (z.B. Aria-Label, Label, Headline, Caption, Summary usw.).                           | `string` \| `undefined`                                                   | `undefined` |
 | `_level`     | `_level`      | Gibt an, welchen H-Level von 1 bis 6 die Überschrift hat. Oder bei 0, ob es keine Überschrift ist und als fett gedruckter Text angezeigt werden soll. | `0` \| `1` \| `2` \| `3` \| `4` \| `5` \| `6` \| `undefined`                          | `1`         |
 | `_on`        | --            | Gibt die EventCallback-Function für das Schließen des Alerts an.                                                                                      | `undefined` \| `{ onClose?: EventCallback<Event>` \| `undefined; }`         | `undefined` |
 | `_type`      | `_type`       | Setzt den Typ der Komponente oder des interaktiven Elements in der Komponente an.                                                                     | `"default"` \| `"error"` \| `"info"` \| `"success"` \| `"warning"` \| `undefined` | `'default'` |

package/doc/avatar.md

@@ -47,10 +47,10 @@ Bei der **Avatar**-Komponente wurden insbesondere folgende Punkte der Barrierefr
 
 ## Properties
 
-| Property              | Attribute | Description                                                                                           | Type                  | Default     |
-| --------------------- | --------- | ----------------------------------------------------------------------------------------------------- | --------------------- | ----------- |
-| `_label` _(required)_ | `_label`  | Defines the label, usually the name of the person, to render as alt text and to compute initials from | `string`              | `undefined` |
-| `_src`                | `_src`    | Defines the image source to render                                                                    | `string` \| `undefined` | `undefined` |
+| Property              | Attribute | Description                                                                                                                 | Type                  | Default     |
+| --------------------- | --------- | --------------------------------------------------------------------------------------------------------------------------- | --------------------- | ----------- |
+| `_label` _(required)_ | `_label`  | Setzt die sichtbare oder semantische Beschriftung der Komponente (z.B. Aria-Label, Label, Headline, Caption, Summary usw.). | `string`              | `undefined` |
+| `_src`                | `_src`    | Defines the image source to render                                                                                          | `string` \| `undefined` | `undefined` |
 
 
 ## Dependencies

package/doc/badge.md

@@ -87,14 +87,14 @@ Die zusätzliche Ausgabe eines **Icon** gewährleistet, dass der Nutzer auch hie
 
 ## Properties
 
-| Property              | Attribute       | Description                                                                                                                                                                                                                                                                                                                        | Type                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                           | Default     |
-| --------------------- | --------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | ----------- |
-| `_color`              | `_color`        | Setzt die Hintergrundfarbe.                                                                                                                                                                                                                                                                                                        | `string` \| `undefined` \| `{ backgroundColor: string; color: string; }` \| `{ backgroundColor: string; foregroundColor: Stringified<CharacteristicColors>; }`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                       | `'#000'`    |
-| `_hideLabel`          | `_hide-label`   | <span class="text-red-500">**[DEPRECATED]**</span> Will be removed in the next major version.<br/><br/>⚠️ We does not support the `_hide-label` property for the `kol-badge` element,   since it would not be accessible without visible labeling. A separate tooltip   is not planed, because a badge is not an interactive element. | `boolean` \| `undefined`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                         | `false`     |
-| `_icon`               | `_icon`         | Setzt die Iconklasse (z.B.: `_icon="codicon codicon-home`).                                                                                                                                                                                                                                                                        | `KoliBriHorizontalIcon & KoliBriVerticalIcon` \| `string` \| `undefined`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                           | `undefined` |
-| `_iconOnly`           | `_icon-only`    | <span style="color:red">**[DEPRECATED]**</span> use _hide-label<br/><br/>Blendet die Beschriftung (Label) aus und zeigt sie stattdessen mittels eines Tooltips an.                                                                                                                                                                 | `boolean` \| `undefined`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                         | `undefined` |
-| `_label` _(required)_ | `_label`        | Setzt die sichtbare oder semantische Beschriftung der Komponente (z.B. Aria-Label, Label, Headline, Caption, Summary usw.).                                                                                                                                                                                                        | `string`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                       | `undefined` |
-| `_smartButton`        | `_smart-button` | Ermöglicht einen Schalter ins das Eingabefeld mit einer beliebigen Aktion zu einzufügen (nur _hide-label).                                                                                                                                                                                                                         | `string` \| `undefined` \| `{ _label: LabelWithExpertSlotPropType; } & { _ariaControls?: string` \| `undefined; _ariaExpanded?: boolean` \| `undefined; _ariaSelected?: boolean` \| `undefined; _disabled?: boolean` \| `undefined; _icon?: Stringified<KoliBriIconProp>` \| `undefined; _iconAlign?: AlignPropType` \| `undefined; _iconOnly?: boolean` \| `undefined; _role?: AlternativButtonLinkRole` \| `undefined; _tabIndex?: number` \| `undefined; _tooltipAlign?: AlignPropType` \| `undefined; _ariaCurrent?: AriaCurrentPropType` \| `undefined; _ariaLabel?: string` \| `undefined; _hideLabel?: boolean` \| `undefined; _accessKey?: string` \| `undefined; _on?: KoliBriButtonCallbacks<StencilUnknown>` \| `undefined; _syncValueBySelector?: string` \| `undefined; _type?: KoliBriButtonType` \| `undefined; _value?: Stringified<StencilUnknown>; _id?: string` \| `undefined; _label?: LabelWithExpertSlotPropType` \| `undefined; _name?: string` \| `undefined; _variant?: KoliBriButtonVariant` \| `undefined; _customClass?: string` \| `undefined; }` | `undefined` |
+| Property              | Attribute       | Description                                                                                                                                                                                                                                                                                                                                                                                                            | Type                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                    | Default     |
+| --------------------- | --------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ----------- |
+| `_color`              | `_color`        | Setzt die Hintergrundfarbe.                                                                                                                                                                                                                                                                                                                                                                                            | `string` \| `undefined` \| `{ backgroundColor: string; color: string; }` \| `{ backgroundColor: string; foregroundColor: Stringified<CharacteristicColors>; }`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                | `'#000'`    |
+| `_hideLabel`          | `_hide-label`   | <span class="text-red-500">**[DEPRECATED]**</span> Will be removed in the next major version.<br/><br/>⚠️ We does not support the `_hide-label` property for the `kol-badge` element,   since it would not be accessible without visible labeling. A separate tooltip   is not planed, because a badge is not an interactive element. TODO: Change type back to `HideLabelPropType` after Stencil#4663 has been resolved. | `boolean` \| `undefined`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                  | `false`     |
+| `_icon`               | `_icon`         | Setzt die Iconklasse (z.B.: `_icon="codicon codicon-home`).                                                                                                                                                                                                                                                                                                                                                            | `KoliBriHorizontalIcon & KoliBriVerticalIcon` \| `string` \| `undefined`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                    | `undefined` |
+| `_iconOnly`           | `_icon-only`    | <span style="color:red">**[DEPRECATED]**</span> use _hide-label<br/><br/>Blendet die Beschriftung (Label) aus und zeigt sie stattdessen mittels eines Tooltips an.                                                                                                                                                                                                                                                     | `boolean` \| `undefined`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                  | `undefined` |
+| `_label` _(required)_ | `_label`        | Setzt die sichtbare oder semantische Beschriftung der Komponente (z.B. Aria-Label, Label, Headline, Caption, Summary usw.).                                                                                                                                                                                                                                                                                            | `string`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                | `undefined` |
+| `_smartButton`        | `_smart-button` | Ermöglicht einen Schalter in das Eingabefeld mit einer beliebigen Aktion zu einzufügen (nur _hide-label).                                                                                                                                                                                                                                                                                                              | `string` \| `undefined` \| `{ _label: LabelWithExpertSlotPropType; } & { _tabIndex?: number` \| `undefined; _value?: Stringified<StencilUnknown>; _accessKey?: string` \| `undefined; _iconAlign?: AlignPropType` \| `undefined; _iconOnly?: boolean` \| `undefined; _role?: AlternativeButtonLinkRolePropType` \| `undefined; _ariaControls?: string` \| `undefined; _ariaCurrent?: AriaCurrentPropType` \| `undefined; _ariaExpanded?: boolean` \| `undefined; _ariaLabel?: string` \| `undefined; _ariaSelected?: boolean` \| `undefined; _on?: ButtonCallbacksPropType<StencilUnknown>` \| `undefined; _type?: ButtonTypePropType` \| `undefined; _variant?: ButtonVariantPropType` \| `undefined; _customClass?: string` \| `undefined; _disabled?: boolean` \| `undefined; _hideLabel?: boolean` \| `undefined; _icon?: IconPropType` \| `undefined; _id?: string` \| `undefined; _name?: string` \| `undefined; _syncValueBySelector?: string` \| `undefined; _tooltipAlign?: AlignPropType` \| `undefined; }` | `undefined` |
 
 
 ## Dependencies

package/doc/button-link.md

@@ -34,21 +34,21 @@ Da der Link, nicht wie der Button, in mehrere Varianten (`primary` oder `seconda
 | `_accessKey`          | `_access-key`    | Gibt an, mit welcher Tastenkombination man das interaktive Element der Komponente auslösen oder fokussieren kann.                                                                                                                                                                                                | `string` \| `undefined`                                                                                                                                  | `undefined` |
 | `_ariaControls`       | `_aria-controls` | Gibt an, welche Elemente kontrolliert werden. (https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-controls)                                                                                                                                                                         | `string` \| `undefined`                                                                                                                                  | `undefined` |
 | `_ariaCurrent`        | `_aria-current`  | <span class="text-red-500">**[DEPRECATED]**</span> aria-current is not necessary for buttons. will be removed in version 2.<br/><br/>Gibt an, welchen aktuellen Auswahlstatus das interaktive Element der Komponente hat. (https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-current) | `"date"` \| `"location"` \| `"page"` \| `"step"` \| `"time"` \| `boolean` \| `undefined`                                                                           | `undefined` |
-| `_ariaExpanded`       | `_aria-expanded` | Gibt an, ob durch das interaktive Element in der Komponente etwas aufgeklappt wurde. (https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-expanded)                                                                                                                                  | `boolean` \| `undefined`                                                                                                                                 | `undefined` |
+| `_ariaExpanded`       | `_aria-expanded` | Gibt an, ob durch das interaktive Element in der Komponente etwas aufgeklappt wurde. (https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-expanded) TODO: Change type back to `AriaExpandedPropType` after Stencil#4663 has been resolved                                            | `boolean` \| `undefined`                                                                                                                                 | `undefined` |
 | `_ariaLabel`          | `_aria-label`    | <span style="color:red">**[DEPRECATED]**</span> use _label instead<br/><br/>Setzt die sichtbare oder semantische Beschriftung der Komponente (z.B. Aria-Label, Label, Headline, Caption, Summary usw.).                                                                                                          | `string` \| `undefined`                                                                                                                                  | `undefined` |
-| `_ariaSelected`       | `_aria-selected` | Gibt an, ob interaktive Element in der Komponente ausgewählt ist (z.B. role=tab). (https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-selected)                                                                                                                                     | `boolean` \| `undefined`                                                                                                                                 | `undefined` |
-| `_disabled`           | `_disabled`      | Deaktiviert das interaktive Element in der Komponente und erlaubt keine Interaktion mehr damit.                                                                                                                                                                                                                  | `boolean` \| `undefined`                                                                                                                                 | `false`     |
-| `_hideLabel`          | `_hide-label`    | Blendet die Beschriftung (Label) aus und zeigt sie stattdessen mittels eines Tooltips an.                                                                                                                                                                                                                        | `boolean` \| `undefined`                                                                                                                                 | `false`     |
+| `_ariaSelected`       | `_aria-selected` | Gibt an, ob interaktive Element in der Komponente ausgewählt ist (z.B. role=tab). (https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-selected) TODO: Change type back to `AriaSelectedPropType` after Stencil#4663 has been resolved                                               | `boolean` \| `undefined`                                                                                                                                 | `undefined` |
+| `_disabled`           | `_disabled`      | Deaktiviert das interaktive Element in der Komponente und erlaubt keine Interaktion mehr damit. TODO: Change type back to `DisabledPropType` after Stencil#4663 has been resolved                                                                                                                                | `boolean` \| `undefined`                                                                                                                                 | `false`     |
+| `_hideLabel`          | `_hide-label`    | Blendet die Beschriftung (Label) aus und zeigt sie stattdessen mittels eines Tooltips an. TODO: Change type back to `HideLabelPropType` after Stencil#4663 has been resolved.                                                                                                                                    | `boolean` \| `undefined`                                                                                                                                 | `false`     |
 | `_icon`               | `_icon`          | Setzt die Iconklasse (z.B.: `_icon="codicon codicon-home`).                                                                                                                                                                                                                                                      | `KoliBriHorizontalIcon & KoliBriVerticalIcon` \| `string` \| `undefined`                                                                                   | `undefined` |
 | `_iconOnly`           | `_icon-only`     | <span style="color:red">**[DEPRECATED]**</span> use _hide-label<br/><br/>Blendet die Beschriftung (Label) aus und zeigt sie stattdessen mittels eines Tooltips an.                                                                                                                                               | `boolean` \| `undefined`                                                                                                                                 | `undefined` |
 | `_id`                 | `_id`            | Defines the internal ID of the primary component element.                                                                                                                                                                                                                                                        | `string` \| `undefined`                                                                                                                                  | `undefined` |
 | `_label` _(required)_ | `_label`         | Setzt die sichtbare oder semantische Beschriftung der Komponente (z.B. Aria-Label, Label, Headline, Caption, Summary usw.).                                                                                                                                                                                      | `boolean` \| `string`                                                                                                                                    | `undefined` |
 | `_name`               | `_name`          | Gibt den technischen Namen des Eingabefeldes an.                                                                                                                                                                                                                                                                 | `string` \| `undefined`                                                                                                                                  | `undefined` |
 | `_on`                 | --               | Gibt die EventCallback-Funktionen für die Button-Events an.                                                                                                                                                                                                                                                      | `undefined` \| `{ onClick?: EventValueOrEventCallback<MouseEvent, StencilUnknown>` \| `undefined; onMouseDown?: EventCallback<MouseEvent>` \| `undefined; }` | `undefined` |
-| `_role`               | `_role`          | Gibt die Rolle des primären Elements in der Komponente an.                                                                                                                                                                                                                                                       | `"button"` \| `"link"` \| `"tab"` \| `undefined`                                                                                                             | `undefined` |
+| `_role`               | `_role`          | Defines the role of the components primary element.                                                                                                                                                                                                                                                              | `"button"` \| `"link"` \| `"tab"` \| `undefined`                                                                                                             | `undefined` |
 | `_tabIndex`           | `_tab-index`     | Gibt an, welchen Tab-Index das primäre Element in der Komponente hat. (https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/tabindex)                                                                                                                                                             | `number` \| `undefined`                                                                                                                                  | `undefined` |
 | `_tooltipAlign`       | `_tooltip-align` | Defines where to show the Tooltip preferably: top, right, bottom or left.                                                                                                                                                                                                                                        | `"bottom"` \| `"left"` \| `"right"` \| `"top"` \| `undefined`                                                                                                  | `'top'`     |
-| `_type`               | `_type`          | Setzt den Typ der Komponente oder des interaktiven Elements in der Komponente an.                                                                                                                                                                                                                                | `"button"` \| `"reset"` \| `"submit"` \| `undefined`                                                                                                         | `'button'`  |
+| `_type`               | `_type`          | Defines either the type of the component or of the components interactive element.                                                                                                                                                                                                                               | `"button"` \| `"reset"` \| `"submit"` \| `undefined`                                                                                                         | `'button'`  |
 | `_value`              | `_value`         | Gibt einen Wert an, den der Schalter bei einem Klick zurückgibt.                                                                                                                                                                                                                                                 | `boolean` \| `null` \| `number` \| `object` \| `string` \| `undefined`                                                                                           | `undefined` |
 
 

package/doc/button.md

@@ -100,28 +100,28 @@ Probleme mit Disabled-Status
 
 | Property              | Attribute        | Description                                                                                                                                                                                                                                                                                                      | Type                                                                                                                                                   | Default     |
 | --------------------- | ---------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------ | ----------- |
-| `_accessKey`          | `_access-key`    | Gibt an, mit welcher Tastenkombination man das interaktive Element der Komponente auslösen oder fokussieren kann.                                                                                                                                                                                                | `string` \| `undefined`                                                                                                                                  | `undefined` |
+| `_accessKey`          | `_access-key`    | <span class="text-red-500">**[DEPRECATED]**</span> <br/><br/>Gibt an, mit welcher Tastenkombination man das interaktive Element der Komponente auslösen oder fokussieren kann.                                                                                                                                      | `string` \| `undefined`                                                                                                                                  | `undefined` |
 | `_ariaControls`       | `_aria-controls` | Gibt an, welche Elemente kontrolliert werden. (https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-controls)                                                                                                                                                                         | `string` \| `undefined`                                                                                                                                  | `undefined` |
-| `_ariaCurrent`        | `_aria-current`  | <span class="text-red-500">**[DEPRECATED]**</span> aria-current is not necessary for buttons. will be removed in version 2.<br/><br/>Gibt an, welchen aktuellen Auswahlstatus das interaktive Element der Komponente hat. (https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-current) | `"date"` \| `"location"` \| `"page"` \| `"step"` \| `"time"` \| `boolean` \| `undefined`                                                                           | `undefined` |
+| `_ariaCurrent`        | `_aria-current`  | <span style="color:red">**[DEPRECATED]**</span> aria-current is not necessary for buttons. will be removed in version 2.<br/><br/>Gibt an, welchen aktuellen Auswahlstatus das interaktive Element der Komponente hat. (https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-current) | `"date"` \| `"location"` \| `"page"` \| `"step"` \| `"time"` \| `boolean` \| `undefined`                                                                           | `undefined` |
 | `_ariaExpanded`       | `_aria-expanded` | Gibt an, ob durch das interaktive Element in der Komponente etwas aufgeklappt wurde. (https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-expanded)                                                                                                                                  | `boolean` \| `undefined`                                                                                                                                 | `undefined` |
 | `_ariaLabel`          | `_aria-label`    | <span style="color:red">**[DEPRECATED]**</span> use _label instead<br/><br/>Setzt die sichtbare oder semantische Beschriftung der Komponente (z.B. Aria-Label, Label, Headline, Caption, Summary usw.).                                                                                                          | `string` \| `undefined`                                                                                                                                  | `undefined` |
 | `_ariaSelected`       | `_aria-selected` | Gibt an, ob interaktive Element in der Komponente ausgewählt ist (z.B. role=tab). (https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-selected)                                                                                                                                     | `boolean` \| `undefined`                                                                                                                                 | `undefined` |
-| `_customClass`        | `_custom-class`  | Gibt an, welche Custom-Class übergeben werden soll, wenn _variant="custom" gesetzt ist.                                                                                                                                                                                                                          | `string` \| `undefined`                                                                                                                                  | `undefined` |
+| `_customClass`        | `_custom-class`  | Defines the custom class attribute if _variant="custom" is set.                                                                                                                                                                                                                                                  | `string` \| `undefined`                                                                                                                                  | `undefined` |
 | `_disabled`           | `_disabled`      | Deaktiviert das interaktive Element in der Komponente und erlaubt keine Interaktion mehr damit.                                                                                                                                                                                                                  | `boolean` \| `undefined`                                                                                                                                 | `false`     |
 | `_hideLabel`          | `_hide-label`    | Blendet die Beschriftung (Label) aus und zeigt sie stattdessen mittels eines Tooltips an.                                                                                                                                                                                                                        | `boolean` \| `undefined`                                                                                                                                 | `false`     |
-| `_icon`               | `_icon`          | Setzt die Iconklasse (z.B.: `_icon="codicon codicon-home`).                                                                                                                                                                                                                                                      | `KoliBriHorizontalIcon & KoliBriVerticalIcon` \| `string` \| `undefined`                                                                                   | `undefined` |
+| `_icon`               | `_icon`          | Defines the icon classnames.                                                                                                                                                                                                                                                                                     | `KoliBriHorizontalIcon & KoliBriVerticalIcon` \| `string` \| `undefined`                                                                                   | `undefined` |
 | `_iconAlign`          | `_icon-align`    | <span style="color:red">**[DEPRECATED]**</span> <br/><br/>Deprecated: Defines where to show the Tooltip preferably: top, right, bottom or left.                                                                                                                                                                  | `"bottom"` \| `"left"` \| `"right"` \| `"top"` \| `undefined`                                                                                                  | `undefined` |
 | `_iconOnly`           | `_icon-only`     | <span style="color:red">**[DEPRECATED]**</span> use _hide-label<br/><br/>Blendet die Beschriftung (Label) aus und zeigt sie stattdessen mittels eines Tooltips an.                                                                                                                                               | `boolean` \| `undefined`                                                                                                                                 | `undefined` |
 | `_id`                 | `_id`            | Gibt die interne ID des primären Elements in der Komponente an.                                                                                                                                                                                                                                                  | `string` \| `undefined`                                                                                                                                  | `undefined` |
 | `_label` _(required)_ | `_label`         | Setzt die sichtbare oder semantische Beschriftung der Komponente (z.B. Aria-Label, Label, Headline, Caption, Summary usw.).                                                                                                                                                                                      | `boolean` \| `string`                                                                                                                                    | `undefined` |
 | `_name`               | `_name`          | Gibt den technischen Namen des Eingabefeldes an.                                                                                                                                                                                                                                                                 | `string` \| `undefined`                                                                                                                                  | `undefined` |
-| `_on`                 | --               | Gibt die EventCallback-Funktionen für die Button-Events an.                                                                                                                                                                                                                                                      | `undefined` \| `{ onClick?: EventValueOrEventCallback<MouseEvent, StencilUnknown>` \| `undefined; onMouseDown?: EventCallback<MouseEvent>` \| `undefined; }` | `undefined` |
-| `_role`               | `_role`          | Gibt die Rolle des primären Elements in der Komponente an.                                                                                                                                                                                                                                                       | `"button"` \| `"link"` \| `"tab"` \| `undefined`                                                                                                             | `undefined` |
+| `_on`                 | --               | Defines the callback functions for button events.                                                                                                                                                                                                                                                                | `undefined` \| `{ onClick?: EventValueOrEventCallback<MouseEvent, StencilUnknown>` \| `undefined; onMouseDown?: EventCallback<MouseEvent>` \| `undefined; }` | `undefined` |
+| `_role`               | `_role`          | Defines the role of the components primary element.                                                                                                                                                                                                                                                              | `"button"` \| `"link"` \| `"tab"` \| `undefined`                                                                                                             | `undefined` |
 | `_tabIndex`           | `_tab-index`     | Gibt an, welchen Tab-Index das primäre Element in der Komponente hat. (https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/tabindex)                                                                                                                                                             | `number` \| `undefined`                                                                                                                                  | `undefined` |
 | `_tooltipAlign`       | `_tooltip-align` | Defines where to show the Tooltip preferably: top, right, bottom or left.                                                                                                                                                                                                                                        | `"bottom"` \| `"left"` \| `"right"` \| `"top"` \| `undefined`                                                                                                  | `'top'`     |
-| `_type`               | `_type`          | Setzt den Typ der Komponente oder des interaktiven Elements in der Komponente an.                                                                                                                                                                                                                                | `"button"` \| `"reset"` \| `"submit"` \| `undefined`                                                                                                         | `'button'`  |
+| `_type`               | `_type`          | Defines either the type of the component or of the components interactive element.                                                                                                                                                                                                                               | `"button"` \| `"reset"` \| `"submit"` \| `undefined`                                                                                                         | `'button'`  |
 | `_value`              | `_value`         | Gibt einen Wert an, den der Schalter bei einem Klick zurückgibt.                                                                                                                                                                                                                                                 | `boolean` \| `null` \| `number` \| `object` \| `string` \| `undefined`                                                                                           | `undefined` |
-| `_variant`            | `_variant`       | Gibt an, welche Variante der Darstellung genutzt werden soll.                                                                                                                                                                                                                                                    | `"custom"` \| `"danger"` \| `"ghost"` \| `"normal"` \| `"primary"` \| `"secondary"` \| `"tertiary"` \| `undefined`                                                   | `'normal'`  |
+| `_variant`            | `_variant`       | Defines which variant should be used for presentation.                                                                                                                                                                                                                                                           | `"custom"` \| `"danger"` \| `"ghost"` \| `"normal"` \| `"primary"` \| `"secondary"` \| `"tertiary"` \| `undefined`                                                   | `'normal'`  |
 
 
 ## Dependencies

package/doc/card.md

@@ -78,8 +78,8 @@ Bitte beachten Sie, dass Sie zwar ein beliebiges HTML-Tag als Inhalts-Container
 
 | Property     | Attribute     | Description                                                                                                                                           | Type                                                            | Default     |
 | ------------ | ------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------- | --------------------------------------------------------------- | ----------- |
-| `_hasCloser` | `_has-closer` | Defines whether the card has a close button.                                                                                                          | `boolean` \| `undefined`                                          | `undefined` |
-| `_hasFooter` | `_has-footer` | Shows the slot="footer".                                                                                                                              | `boolean` \| `undefined`                                          | `false`     |
+| `_hasCloser` | `_has-closer` | Defines whether the card has a close button. TODO: Change type back to `HasCloserPropType` after Stencil#4663 has been resolved                       | `boolean` \| `undefined`                                          | `undefined` |
+| `_hasFooter` | `_has-footer` | Shows the slot="footer". TODO: Change type back to `HasFooterPropType` after Stencil#4663 has been resolved                                           | `boolean` \| `undefined`                                          | `false`     |
 | `_heading`   | `_heading`    | <span class="text-red-500">**[DEPRECATED]**</span> Use _label.<br/><br/>Gibt die Beschriftung der Komponente an.                                         | `string` \| `undefined`                                           | `undefined` |
 | `_headline`  | `_headline`   | <span style="color:red">**[DEPRECATED]**</span> Verwende stattdessen das Property _heading.<br/><br/>Gibt die Beschriftung der Komponente an.         | `string` \| `undefined`                                           | `undefined` |
 | `_label`     | `_label`      |                                                                                                                                                       | `string` \| `undefined`                                           | `undefined` |

package/doc/details.md

@@ -91,11 +91,11 @@ Verwenden Sie das Attribut **`_label`**, um den Text zu definieren, der als Übe
 
 ## Properties
 
-| Property   | Attribute  | Description                                                                                                              | Type                   | Default     |
-| ---------- | ---------- | ------------------------------------------------------------------------------------------------------------------------ | ---------------------- | ----------- |
-| `_label`   | `_label`   | Defines the summary label.                                                                                               | `string` \| `undefined`  | `undefined` |
-| `_open`    | `_open`    | Gibt an, ob die Komponente entweder geöffnet oder geschlossen ist.                                                       | `boolean` \| `undefined` | `false`     |
-| `_summary` | `_summary` | <span class="text-red-500">**[DEPRECATED]**</span> Use _label.<br/><br/>Gibt die Zusammenfassung der Detailbeschreibung an. | `string` \| `undefined`  | `undefined` |
+| Property   | Attribute  | Description                                                                                                                                                    | Type                   | Default     |
+| ---------- | ---------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------- | ---------------------- | ----------- |
+| `_label`   | `_label`   | Setzt die sichtbare oder semantische Beschriftung der Komponente (z.B. Aria-Label, Label, Headline, Caption, Summary usw.).                                    | `string` \| `undefined`  | `undefined` |
+| `_open`    | `_open`    | If set (to true) opens/expands the element, closes if not set (or set to false). TODO: Change type back to `OpenPropType` after Stencil#4663 has been resolved | `boolean` \| `undefined` | `false`     |
+| `_summary` | `_summary` | <span class="text-red-500">**[DEPRECATED]**</span> Use _label.<br/><br/>Gibt die Zusammenfassung der Detailbeschreibung an.                                       | `string` \| `undefined`  | `undefined` |
 
 
 ## Slots