From b7707deba2392f0091df9ecdafc2b1468dd56c81 Mon Sep 17 00:00:00 2001 From: Stefan Dietz Date: Wed, 11 Oct 2023 10:54:30 +0200 Subject: [PATCH] Add automatic readme updates --- .../components/src/components/abbr/readme.md | 9 ++- .../src/components/accordion/readme.md | 21 +++---- .../components/src/components/badge/readme.md | 15 ++--- .../src/components/breadcrumb/readme.md | 9 ++- .../src/components/button-link/readme.md | 39 ++++++------ .../src/components/button/readme.md | 46 ++++++--------- .../components/src/components/card/readme.md | 24 +++----- .../src/components/details/readme.md | 11 ++-- .../src/components/heading/readme.md | 2 - .../components/src/components/icon/readme.md | 15 ++--- .../src/components/input-checkbox/readme.md | 52 ++++++++-------- .../src/components/input-color/readme.md | 44 +++++++------- .../src/components/input-date/readme.md | 56 +++++++++--------- .../src/components/input-email/readme.md | 59 +++++++++---------- .../src/components/input-file/readme.md | 45 +++++++------- .../src/components/input-number/readme.md | 57 +++++++++--------- .../src/components/input-password/readme.md | 54 ++++++++--------- .../src/components/input-radio/readme.md | 6 -- .../src/components/input-range/readme.md | 2 - .../src/components/input-text/readme.md | 59 +++++++++---------- .../src/components/kolibri/readme.md | 10 ++-- .../src/components/link-button/readme.md | 39 +++++------- .../src/components/link-group/readme.md | 18 ++---- .../components/src/components/link/readme.md | 42 +++++-------- .../components/src/components/logo/readme.md | 7 +-- .../components/src/components/modal/readme.md | 13 ++-- .../components/src/components/nav/readme.md | 23 +++----- .../src/components/pagination/readme.md | 3 +- .../src/components/progress/readme.md | 15 +++-- .../components/src/components/quote/readme.md | 13 ++-- .../src/components/select/readme.md | 4 -- .../src/components/skip-nav/readme.md | 9 ++- .../components/src/components/span/readme.md | 4 +- .../src/components/split-button/readme.md | 5 -- .../src/components/symbol/readme.md | 9 ++- .../components/src/components/table/readme.md | 17 +++--- .../components/src/components/tabs/readme.md | 16 +++-- .../src/components/version/readme.md | 7 +-- 38 files changed, 380 insertions(+), 499 deletions(-) diff --git a/packages/components/src/components/abbr/readme.md b/packages/components/src/components/abbr/readme.md index ec252a2bdc..0e109ec8ac 100644 --- a/packages/components/src/components/abbr/readme.md +++ b/packages/components/src/components/abbr/readme.md @@ -44,11 +44,10 @@ Der KoliBri Tooltip kann von Screenreadern vorgelesen werden und verändert sein ## Properties -| Property | Attribute | Description | Type | Default | -| --------------- | ---------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------- | ----------------------------------------------------- | ----------- | -| `_label` | `_label` | Defines the visible or semantic label of the component (e.g. aria-label, label, headline, caption, summary, etc.). | `string \| undefined` | `undefined` | -| `_title` | `_title` | **[DEPRECATED]** Use \_label.

Deprecated: 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'` | +| Property | Attribute | Description | Type | Default | +| --------------------- | ---------------- | ------------------------------------------------------------------------------------------------------------------ | ----------------------------------------------------- | ----------- | +| `_label` _(required)_ | `_label` | Defines the visible or semantic label of the component (e.g. aria-label, label, headline, caption, summary, etc.). | `string` | `undefined` | +| `_tooltipAlign` | `_tooltip-align` | Defines where to show the Tooltip preferably: top, right, bottom or left. | `"bottom" \| "left" \| "right" \| "top" \| undefined` | `'top'` | ## Slots diff --git a/packages/components/src/components/accordion/readme.md b/packages/components/src/components/accordion/readme.md index 5929103826..1686efa025 100644 --- a/packages/components/src/components/accordion/readme.md +++ b/packages/components/src/components/accordion/readme.md @@ -109,21 +109,18 @@ Standardansicht gelegt. ## Properties -| Property | Attribute | Description | Type | Default | -| ---------- | ---------- | -------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------ | ----------- | -| `_heading` | `_heading` | **[DEPRECATED]** Use \_label.

Deprecated: Gibt die Beschriftung der Komponente an. | `string \| undefined` | `undefined` | -| `_label` | `_label` | Defines the visible or semantic label of the component (e.g. aria-label, label, headline, caption, summary, etc.). | `string \| undefined` | `undefined` | -| `_level` | `_level` | Defines which H-level from 1-6 the heading has. 0 specifies no heading and is shown as bold text. | `0 \| 1 \| 2 \| 3 \| 4 \| 5 \| 6 \| undefined` | `1` | -| `_on` | -- | Gibt die EventCallback-Funktionen an. | `undefined \| { onClick?: EventValueOrEventCallback \| 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 | +| --------------------- | --------- | ------------------------------------------------------------------------------------------------------------------ | ------------------------------------------------------------------------------------ | ----------- | +| `_label` _(required)_ | `_label` | Defines the visible or semantic label of the component (e.g. aria-label, label, headline, caption, summary, etc.). | `string` | `undefined` | +| `_level` | `_level` | Defines which H-level from 1-6 the heading has. 0 specifies no heading and is shown as bold text. | `0 \| 1 \| 2 \| 3 \| 4 \| 5 \| 6 \| undefined` | `1` | +| `_on` | -- | Gibt die EventCallback-Funktionen an. | `undefined \| { onClick?: EventValueOrEventCallback \| undefined; }` | `undefined` | +| `_open` | `_open` | If set (to true) opens/expands the element, closes if not set (or set to false). | `boolean \| undefined` | `false` | ## Slots -| Slot | Description | -| ----------- | ------------------------------------------------------------------------------------------------------ | -| | Ermöglicht das Einfügen beliebigen HTML's in den Inhaltsbereich des Accordions. | -| `"content"` | Ermöglicht das Einfügen beliebigen HTML's in den Inhaltsbereich des Accordions. | -| `"header"` | Deprecated für Version 2: Ermöglicht das Einfügen beliebigen HTML's in den Kopfbereich des Accordions. | +| Slot | Description | +| ---- | ------------------------------------------------------------------------------- | +| | Ermöglicht das Einfügen beliebigen HTML's in den Inhaltsbereich des Accordions. | ## Dependencies diff --git a/packages/components/src/components/badge/readme.md b/packages/components/src/components/badge/readme.md index 104ebd8ef7..9ee61fd2df 100644 --- a/packages/components/src/components/badge/readme.md +++ b/packages/components/src/components/badge/readme.md @@ -82,15 +82,12 @@ Die zusätzliche Ausgabe eines **Icon** gewährleistet, dass der Nutzer auch hie ## Properties -| Property | Attribute | Description | Type | Default | -| --------------------- | --------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ----------- | -| `_color` | `_color` | Defines the backgroundColor and foregroundColor. | `string \| undefined \| { backgroundColor: string; color: string; } \| { backgroundColor: string; foregroundColor: Stringified; }` | `'#000'` | -| `_hideLabel` | `_hide-label` | **[DEPRECATED]** Will be removed in the next major version.

Deprecated: ⚠️ We do 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` | **[DEPRECATED]** Use \_icons.

| `KoliBriHorizontalIcons & KoliBriVerticalIcons \| string \| undefined` | `undefined` | -| `_iconOnly` | `_icon-only` | **[DEPRECATED]** use \_hide-label

Deprecated: Hides the label and shows the description in a Tooltip instead. | `boolean \| undefined` | `undefined` | -| `_icons` | `_icons` | Defines the icon classnames (e.g. `_icons="fa-solid fa-user"`). | `KoliBriHorizontalIcons & KoliBriVerticalIcons \| string \| undefined` | `undefined` | -| `_label` _(required)_ | `_label` | Defines the visible or semantic label of the component (e.g. aria-label, label, headline, caption, summary, etc.). | `string` | `undefined` | -| `_smartButton` | `_smart-button` | Allows to add a button with an arbitrary action within the element (\_hide-label only). | `string \| undefined \| { _label: string; } & { _tabIndex?: number \| undefined; _value?: Stringified; _accessKey?: string \| undefined; _iconAlign?: AlignPropType \| undefined; _iconOnly?: boolean \| undefined; _icon?: IconsPropType \| undefined; _role?: AlternativeButtonLinkRolePropType \| undefined; _ariaControls?: string \| undefined; _ariaCurrent?: AriaCurrentPropType \| undefined; _ariaExpanded?: boolean \| undefined; _ariaLabel?: string \| undefined; _ariaSelected?: boolean \| undefined; _on?: ButtonCallbacksPropType \| undefined; _type?: ButtonTypePropType \| undefined; _variant?: ButtonVariantPropType \| undefined; _customClass?: string \| undefined; _disabled?: boolean \| undefined; _hideLabel?: boolean \| undefined; _icons?: IconsPropType \| undefined; _id?: string \| undefined; _name?: string \| undefined; _syncValueBySelector?: string \| undefined; _tooltipAlign?: AlignPropType \| undefined; }` | `undefined` | +| Property | Attribute | Description | Type | Default | +| --------------------- | --------------- | ------------------------------------------------------------------------------------------------------------------ | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ----------- | +| `_color` | `_color` | Defines the backgroundColor and foregroundColor. | `string \| undefined \| { backgroundColor: string; foregroundColor: Stringified; }` | `'#000'` | +| `_icons` | `_icons` | Defines the icon classnames (e.g. `_icons="fa-solid fa-user"`). | `KoliBriHorizontalIcons & KoliBriVerticalIcons \| string \| undefined` | `undefined` | +| `_label` _(required)_ | `_label` | Defines the visible or semantic label of the component (e.g. aria-label, label, headline, caption, summary, etc.). | `string` | `undefined` | +| `_smartButton` | `_smart-button` | Allows to add a button with an arbitrary action within the element (\_hide-label only). | `string \| undefined \| { _label: string; } & { _tabIndex?: number \| undefined; _value?: Stringified; _role?: AlternativeButtonLinkRolePropType \| undefined; _ariaControls?: string \| undefined; _ariaExpanded?: boolean \| undefined; _ariaSelected?: boolean \| undefined; _on?: ButtonCallbacksPropType \| undefined; _type?: ButtonTypePropType \| undefined; _variant?: ButtonVariantPropType \| undefined; _customClass?: string \| undefined; _disabled?: boolean \| undefined; _hideLabel?: boolean \| undefined; _icons?: IconsPropType \| undefined; _id?: string \| undefined; _name?: string \| undefined; _syncValueBySelector?: string \| undefined; _tooltipAlign?: AlignPropType \| undefined; }` | `undefined` | ## Dependencies diff --git a/packages/components/src/components/breadcrumb/readme.md b/packages/components/src/components/breadcrumb/readme.md index 9dc7c2d0fa..001bd73584 100644 --- a/packages/components/src/components/breadcrumb/readme.md +++ b/packages/components/src/components/breadcrumb/readme.md @@ -87,11 +87,10 @@ Beachten Sie, dass auch das letzte Element in der Breadcrumb-Komponente per Tab- ## Properties -| Property | Attribute | Description | Type | Default | -| --------------------- | ------------- | ------------------------------------------------------------------------------------------------------------------------------------------- | --------------------------------- | ----------- | -| `_ariaLabel` | `_aria-label` | **[DEPRECATED]** use \_label instead

Deprecated: Setzt die semantische Beschriftung der Komponente. | `string \| undefined` | `undefined` | -| `_label` | `_label` | Defines the visible or semantic label of the component (e.g. aria-label, label, headline, caption, summary, etc.). | `string \| undefined` | `undefined` | -| `_links` _(required)_ | `_links` | Defines the list of links combined with their labels to render. | `BreadcrumbLinkProps[] \| string` | `undefined` | +| Property | Attribute | Description | Type | Default | +| --------------------- | --------- | ------------------------------------------------------------------------------------------------------------------ | --------------------------------- | ----------- | +| `_label` _(required)_ | `_label` | Defines the visible or semantic label of the component (e.g. aria-label, label, headline, caption, summary, etc.). | `string` | `undefined` | +| `_links` _(required)_ | `_links` | Defines the list of links combined with their labels to render. | `BreadcrumbLinkProps[] \| string` | `undefined` | ## Dependencies diff --git a/packages/components/src/components/button-link/readme.md b/packages/components/src/components/button-link/readme.md index af78a3e520..89e221965b 100644 --- a/packages/components/src/components/button-link/readme.md +++ b/packages/components/src/components/button-link/readme.md @@ -28,28 +28,23 @@ Da der Link, nicht wie der Button, in mehrere Varianten (`primary` oder `seconda ## Properties -| Property | Attribute | Description | Type | Default | -| --------------------- | ---------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------ | ----------- | -| `_accessKey` | `_access-key` | Defines which key combination can be used to trigger or focus the interactive element of the component. | `string \| undefined` | `undefined` | -| `_ariaControls` | `_aria-controls` | Defines which elements are controlled by this component. (https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-controls) | `string \| undefined` | `undefined` | -| `_ariaCurrent` | `_aria-current` | **[DEPRECATED]** aria-current is not necessary for buttons. will be removed in version 2.

Deprecated: Marks the element as the selected in a group of related elements. Can be one of the following: `date` \| `location` \| `page` \| `step` \| `time` \| `true`. (https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-current) | `"date" \| "location" \| "page" \| "step" \| "time" \| boolean \| undefined` | `undefined` | -| `_ariaExpanded` | `_aria-expanded` | Defines whether the interactive element of the component expanded something. (https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-expanded) | `boolean \| undefined` | `undefined` | -| `_ariaLabel` | `_aria-label` | **[DEPRECATED]** use \_label instead

Deprecated: Setzt die semantische Beschriftung der Komponente. | `string \| undefined` | `undefined` | -| `_ariaSelected` | `_aria-selected` | Defines whether the interactive element of the component is selected (e.g. role=tab). (https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-selected) | `boolean \| undefined` | `undefined` | -| `_disabled` | `_disabled` | Makes the element not focusable and ignore all events. | `boolean \| undefined` | `false` | -| `_hideLabel` | `_hide-label` | Hides the caption by default and displays the caption text with a tooltip when the interactive element is focused or the mouse is over it. | `boolean \| undefined` | `false` | -| `_icon` | `_icon` | **[DEPRECATED]** Use \_icons.

| `KoliBriHorizontalIcons & KoliBriVerticalIcons \| string \| undefined` | `undefined` | -| `_iconOnly` | `_icon-only` | **[DEPRECATED]** use \_hide-label

Deprecated: Hides the label and shows the description in a Tooltip instead. | `boolean \| undefined` | `undefined` | -| `_icons` | `_icons` | Defines the icon classnames (e.g. `_icons="fa-solid fa-user"`). | `KoliBriHorizontalIcons & KoliBriVerticalIcons \| string \| undefined` | `undefined` | -| `_id` | `_id` | Defines the internal ID of the primary component element. | `string \| undefined` | `undefined` | -| `_label` _(required)_ | `_label` | Defines the visible or semantic label of the component (e.g. aria-label, label, headline, caption, summary, etc.). Set to `false` to enable the expert slot. | `string` | `undefined` | -| `_name` | `_name` | Defines the technical name of an input field. | `string \| undefined` | `undefined` | -| `_on` | -- | Gibt die EventCallback-Funktionen für die Button-Events an. | `undefined \| { onClick?: EventValueOrEventCallback \| undefined; onMouseDown?: EventCallback \| undefined; }` | `undefined` | -| `_role` | `_role` | Defines the role of the components primary element. | `"button" \| "link" \| "tab" \| undefined` | `undefined` | -| `_tabIndex` | `_tab-index` | Defines which tab-index the primary element of the component has. (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` | Defines either the type of the component or of the components interactive element. | `"button" \| "reset" \| "submit" \| undefined` | `'button'` | -| `_value` | `_value` | Defines the value that the button emits on click. | `boolean \| null \| number \| object \| string \| undefined` | `undefined` | +| Property | Attribute | Description | Type | Default | +| --------------------- | ---------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------ | ----------- | +| `_ariaControls` | `_aria-controls` | Defines which elements are controlled by this component. (https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-controls) | `string \| undefined` | `undefined` | +| `_ariaExpanded` | `_aria-expanded` | Defines whether the interactive element of the component expanded something. (https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-expanded) | `boolean \| undefined` | `undefined` | +| `_ariaSelected` | `_aria-selected` | Defines whether the interactive element of the component is selected (e.g. role=tab). (https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-selected) | `boolean \| undefined` | `undefined` | +| `_disabled` | `_disabled` | Makes the element not focusable and ignore all events. | `boolean \| undefined` | `false` | +| `_hideLabel` | `_hide-label` | Hides the caption by default and displays the caption text with a tooltip when the interactive element is focused or the mouse is over it. | `boolean \| undefined` | `false` | +| `_icons` | `_icons` | Defines the icon classnames (e.g. `_icons="fa-solid fa-user"`). | `KoliBriHorizontalIcons & KoliBriVerticalIcons \| string \| undefined` | `undefined` | +| `_id` | `_id` | Defines the internal ID of the primary component element. | `string \| undefined` | `undefined` | +| `_label` _(required)_ | `_label` | Defines the visible or semantic label of the component (e.g. aria-label, label, headline, caption, summary, etc.). Set to `false` to enable the expert slot. | `string` | `undefined` | +| `_name` | `_name` | Defines the technical name of an input field. | `string \| undefined` | `undefined` | +| `_on` | -- | Gibt die EventCallback-Funktionen für die Button-Events an. | `undefined \| { onClick?: EventValueOrEventCallback \| undefined; onMouseDown?: EventCallback \| undefined; }` | `undefined` | +| `_role` | `_role` | Defines the role of the components primary element. | `"button" \| "link" \| "tab" \| undefined` | `undefined` | +| `_tabIndex` | `_tab-index` | Defines which tab-index the primary element of the component has. (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` | Defines either the type of the component or of the components interactive element. | `"button" \| "reset" \| "submit" \| undefined` | `'button'` | +| `_value` | `_value` | Defines the value that the button emits on click. | `boolean \| null \| number \| object \| string \| undefined` | `undefined` | ## Dependencies diff --git a/packages/components/src/components/button/readme.md b/packages/components/src/components/button/readme.md index 57fd40a711..6d627a3466 100644 --- a/packages/components/src/components/button/readme.md +++ b/packages/components/src/components/button/readme.md @@ -97,37 +97,30 @@ Probleme mit Disabled-Status ## Properties -| Property | Attribute | Description | Type | Default | -| --------------------- | ---------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------ | ----------- | -| `_accessKey` | `_access-key` | **[DEPRECATED]**

Defines which key combination can be used to trigger or focus the interactive element of the component. | `string \| undefined` | `undefined` | -| `_ariaControls` | `_aria-controls` | Defines which elements are controlled by this component. (https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-controls) | `string \| undefined` | `undefined` | -| `_ariaCurrent` | `_aria-current` | **[DEPRECATED]** aria-current is not necessary for buttons. will be removed in version 2.

Deprecated: Marks the element as the selected in a group of related elements. Can be one of the following: `date` \| `location` \| `page` \| `step` \| `time` \| `true`. (https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-current) | `"date" \| "location" \| "page" \| "step" \| "time" \| boolean \| undefined` | `undefined` | -| `_ariaExpanded` | `_aria-expanded` | Defines whether the interactive element of the component expanded something. (https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-expanded) | `boolean \| undefined` | `undefined` | -| `_ariaLabel` | `_aria-label` | **[DEPRECATED]** use \_label instead

Deprecated: Setzt die semantische Beschriftung der Komponente. | `string \| undefined` | `undefined` | -| `_ariaSelected` | `_aria-selected` | Defines whether the interactive element of the component is selected (e.g. role=tab). (https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-selected) | `boolean \| undefined` | `undefined` | -| `_customClass` | `_custom-class` | Defines the custom class attribute if \_variant="custom" is set. | `string \| undefined` | `undefined` | -| `_disabled` | `_disabled` | Makes the element not focusable and ignore all events. | `boolean \| undefined` | `false` | -| `_hideLabel` | `_hide-label` | Hides the caption by default and displays the caption text with a tooltip when the interactive element is focused or the mouse is over it. | `boolean \| undefined` | `false` | -| `_icon` | `_icon` | **[DEPRECATED]** Use \_icons.

| `KoliBriHorizontalIcons & KoliBriVerticalIcons \| string \| undefined` | `undefined` | -| `_iconAlign` | `_icon-align` | **[DEPRECATED]**

Deprecated: Defines where to show the Tooltip preferably: top, right, bottom or left. | `"bottom" \| "left" \| "right" \| "top" \| undefined` | `undefined` | -| `_iconOnly` | `_icon-only` | **[DEPRECATED]** use \_hide-label

Deprecated: Hides the label and shows the description in a Tooltip instead. | `boolean \| undefined` | `undefined` | -| `_icons` | `_icons` | Defines the icon classnames (e.g. `_icons="fa-solid fa-user"`). | `KoliBriHorizontalIcons & KoliBriVerticalIcons \| string \| undefined` | `undefined` | -| `_id` | `_id` | Defines the internal ID of the primary component element. | `string \| undefined` | `undefined` | -| `_label` _(required)_ | `_label` | Defines the visible or semantic label of the component (e.g. aria-label, label, headline, caption, summary, etc.). Set to `false` to enable the expert slot. | `string` | `undefined` | -| `_name` | `_name` | Defines the technical name of an input field. | `string \| undefined` | `undefined` | -| `_on` | -- | Defines the callback functions for button events. | `undefined \| { onClick?: EventValueOrEventCallback \| undefined; onMouseDown?: EventCallback \| undefined; }` | `undefined` | -| `_role` | `_role` | Defines the role of the components primary element. | `"button" \| "link" \| "tab" \| undefined` | `undefined` | -| `_tabIndex` | `_tab-index` | Defines which tab-index the primary element of the component has. (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` | Defines either the type of the component or of the components interactive element. | `"button" \| "reset" \| "submit" \| undefined` | `'button'` | -| `_value` | `_value` | Defines the value that the button emits on click. | `boolean \| null \| number \| object \| string \| undefined` | `undefined` | -| `_variant` | `_variant` | Defines which variant should be used for presentation. | `"custom" \| "danger" \| "ghost" \| "normal" \| "primary" \| "secondary" \| "tertiary" \| undefined` | `'normal'` | +| Property | Attribute | Description | Type | Default | +| --------------------- | ---------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------ | ----------- | +| `_ariaControls` | `_aria-controls` | Defines which elements are controlled by this component. (https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-controls) | `string \| undefined` | `undefined` | +| `_ariaExpanded` | `_aria-expanded` | Defines whether the interactive element of the component expanded something. (https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-expanded) | `boolean \| undefined` | `undefined` | +| `_ariaSelected` | `_aria-selected` | Defines whether the interactive element of the component is selected (e.g. role=tab). (https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-selected) | `boolean \| undefined` | `undefined` | +| `_customClass` | `_custom-class` | Defines the custom class attribute if \_variant="custom" is set. | `string \| undefined` | `undefined` | +| `_disabled` | `_disabled` | Makes the element not focusable and ignore all events. | `boolean \| undefined` | `false` | +| `_hideLabel` | `_hide-label` | Hides the caption by default and displays the caption text with a tooltip when the interactive element is focused or the mouse is over it. | `boolean \| undefined` | `false` | +| `_icons` | `_icons` | Defines the icon classnames (e.g. `_icons="fa-solid fa-user"`). | `KoliBriHorizontalIcons & KoliBriVerticalIcons \| string \| undefined` | `undefined` | +| `_id` | `_id` | Defines the internal ID of the primary component element. | `string \| undefined` | `undefined` | +| `_label` _(required)_ | `_label` | Defines the visible or semantic label of the component (e.g. aria-label, label, headline, caption, summary, etc.). Set to `false` to enable the expert slot. | `string` | `undefined` | +| `_name` | `_name` | Defines the technical name of an input field. | `string \| undefined` | `undefined` | +| `_on` | -- | Defines the callback functions for button events. | `undefined \| { onClick?: EventValueOrEventCallback \| undefined; onMouseDown?: EventCallback \| undefined; }` | `undefined` | +| `_role` | `_role` | Defines the role of the components primary element. | `"button" \| "link" \| "tab" \| undefined` | `undefined` | +| `_tabIndex` | `_tab-index` | Defines which tab-index the primary element of the component has. (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` | Defines either the type of the component or of the components interactive element. | `"button" \| "reset" \| "submit" \| undefined` | `'button'` | +| `_value` | `_value` | Defines the value that the button emits on click. | `boolean \| null \| number \| object \| string \| undefined` | `undefined` | +| `_variant` | `_variant` | Defines which variant should be used for presentation. | `"custom" \| "danger" \| "ghost" \| "normal" \| "primary" \| "secondary" \| "tertiary" \| undefined` | `'normal'` | ## Dependencies ### Used by -- [kol-nav](../nav) - [kol-pagination](../pagination) - [kol-table](../table) - [kol-toast-container](../toast-container) @@ -145,7 +138,6 @@ graph TD; kol-button-wc --> kol-tooltip-wc kol-span-wc --> kol-icon kol-tooltip-wc --> kol-span-wc - kol-nav --> kol-button kol-pagination --> kol-button kol-table --> kol-button kol-toast-container --> kol-button diff --git a/packages/components/src/components/card/readme.md b/packages/components/src/components/card/readme.md index 278fed1355..f2ed17e4b4 100644 --- a/packages/components/src/components/card/readme.md +++ b/packages/components/src/components/card/readme.md @@ -68,24 +68,18 @@ Bitte beachten Sie, dass Sie zwar ein beliebiges HTML-Tag als Inhalts-Container ## Properties -| Property | Attribute | Description | Type | Default | -| ------------ | ------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------- | --------------------------------------------------------------- | ----------- | -| `_hasCloser` | `_has-closer` | Defines whether the element can be closed. | `boolean \| undefined` | `false` | -| `_hasFooter` | `_has-footer` | Shows the slot="footer". | `boolean \| undefined` | `false` | -| `_heading` | `_heading` | **[DEPRECATED]** Use \_label.

Deprecated: Gibt die Beschriftung der Komponente an. | `string \| undefined` | `undefined` | -| `_headline` | `_headline` | **[DEPRECATED]** Verwende stattdessen das Property \_heading.

Deprecated: Gibt die Beschriftung der Komponente an. | `string \| undefined` | `undefined` | -| `_label` | `_label` | Defines the visible or semantic label of the component (e.g. aria-label, label, headline, caption, summary, etc.). | `string \| undefined` | `undefined` | -| `_level` | `_level` | Defines which H-level from 1-6 the heading has. 0 specifies no heading and is shown as bold text. | `0 \| 1 \| 2 \| 3 \| 4 \| 5 \| 6 \| undefined` | `1` | -| `_on` | -- | Defines the event callback functions for the component. | `undefined \| { onClose?: EventCallback \| undefined; }` | `undefined` | +| Property | Attribute | Description | Type | Default | +| --------------------- | ------------- | ------------------------------------------------------------------------------------------------------------------ | --------------------------------------------------------------- | ----------- | +| `_hasCloser` | `_has-closer` | Defines whether the element can be closed. | `boolean \| undefined` | `false` | +| `_label` _(required)_ | `_label` | Defines the visible or semantic label of the component (e.g. aria-label, label, headline, caption, summary, etc.). | `string` | `undefined` | +| `_level` | `_level` | Defines which H-level from 1-6 the heading has. 0 specifies no heading and is shown as bold text. | `0 \| 1 \| 2 \| 3 \| 4 \| 5 \| 6 \| undefined` | `1` | +| `_on` | -- | Defines the event callback functions for the component. | `undefined \| { onClose?: EventCallback \| undefined; }` | `undefined` | ## Slots -| Slot | Description | -| ----------- | -------------------------------------------------------------------------------------------------------------------------- | -| | Ermöglicht das Einfügen beliebigen HTML's in den Inhaltsbereich der Card. | -| `"content"` | Ermöglicht das Einfügen beliebigen HTML's in den Inhaltsbereich der Card. | -| `"footer"` | Deprecated für Version 2: Ermöglicht das Einfügen beliebigen HTML's in den Fußbereich der Card. | -| `"header"` | Deprecated für Version 2: Ermöglicht das Einfügen beliebigen HTML's in den Kopfbereich unterhalb der Überschrift der Card. | +| Slot | Description | +| ---- | ------------------------------------------------------------------------- | +| | Ermöglicht das Einfügen beliebigen HTML's in den Inhaltsbereich der Card. | ## Dependencies diff --git a/packages/components/src/components/details/readme.md b/packages/components/src/components/details/readme.md index bb3336265b..4ea5f99c76 100644 --- a/packages/components/src/components/details/readme.md +++ b/packages/components/src/components/details/readme.md @@ -90,12 +90,11 @@ Verwenden Sie das Attribut **`_label`**, um den Text zu definieren, der als Übe ## Properties -| Property | Attribute | Description | Type | Default | -| ---------- | ---------- | ------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------- | ----------- | -| `_label` | `_label` | Defines the visible or semantic label of the component (e.g. aria-label, label, headline, caption, summary, etc.). | `string \| undefined` | `undefined` | -| `_on` | -- | Defines the callback functions for details. | `undefined \| { onToggle?: EventValueOrEventCallback \| undefined; }` | `undefined` | -| `_open` | `_open` | If set (to true) opens/expands the element, closes if not set (or set to false). | `boolean \| undefined` | `false` | -| `_summary` | `_summary` | **[DEPRECATED]** Use \_label.

Deprecated: Gibt die Zusammenfassung der Detailbeschreibung an. | `string \| undefined` | `undefined` | +| Property | Attribute | Description | Type | Default | +| --------------------- | --------- | ------------------------------------------------------------------------------------------------------------------ | ------------------------------------------------------------------------------------- | ----------- | +| `_label` _(required)_ | `_label` | Defines the visible or semantic label of the component (e.g. aria-label, label, headline, caption, summary, etc.). | `string` | `undefined` | +| `_on` | -- | Defines the callback functions for details. | `undefined \| { onToggle?: EventValueOrEventCallback \| undefined; }` | `undefined` | +| `_open` | `_open` | If set (to true) opens/expands the element, closes if not set (or set to false). | `boolean \| undefined` | `false` | ## Slots diff --git a/packages/components/src/components/heading/readme.md b/packages/components/src/components/heading/readme.md index a1f86cdb79..a999f609e8 100644 --- a/packages/components/src/components/heading/readme.md +++ b/packages/components/src/components/heading/readme.md @@ -57,7 +57,6 @@ Die Überschriftenebene wird durch das Attribut **`_level`** übergeben. Möglic - [kol-alert-wc](../alert) - [kol-card](../card) - [kol-heading](.) -- [kol-link-group](../link-group) ### Graph @@ -67,7 +66,6 @@ graph TD; kol-alert-wc --> kol-heading-wc kol-card --> kol-heading-wc kol-heading --> kol-heading-wc - kol-link-group --> kol-heading-wc style kol-heading-wc fill:#f9f,stroke:#333,stroke-width:4px ``` diff --git a/packages/components/src/components/icon/readme.md b/packages/components/src/components/icon/readme.md index 1429ed0012..6e72c61e36 100644 --- a/packages/components/src/components/icon/readme.md +++ b/packages/components/src/components/icon/readme.md @@ -46,13 +46,10 @@ Mittels der Property `_label` muss ein Kontext-relevantes Icon beschriftet werde ## Properties -| Property | Attribute | Description | Type | Default | -| ------------ | ------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | --------------------- | ----------- | -| `_ariaLabel` | `_aria-label` | **[DEPRECATED]** use \_label instead

Deprecated: Setzt die semantische Beschriftung der Komponente. | `string \| undefined` | `undefined` | -| `_icon` | `_icon` | **[DEPRECATED]** Use \_icons.

| `string \| undefined` | `undefined` | -| `_icons` | `_icons` | Defines the icon classnames (e.g. `_icons="fa-solid fa-user"`). | `string \| undefined` | `undefined` | -| `_label` | `_label` | Defines the visible or semantic label of the component (e.g. aria-label, label, headline, caption, summary, etc.). | `string \| undefined` | `undefined` | -| `_part` | `_part` | **[DEPRECATED]** Das Styling sollte stets über CSS erfolgen.

Deprecated: Gibt den Identifier für den CSS-Part an, um das Icon von Außen ändern zu können. (https://meowni.ca/posts/part-theme-explainer/) | `string \| undefined` | `undefined` | +| Property | Attribute | Description | Type | Default | +| --------------------- | --------- | ------------------------------------------------------------------------------------------------------------------ | -------- | ----------- | +| `_icons` _(required)_ | `_icons` | Defines the icon classnames (e.g. `_icons="fa-solid fa-user"`). | `string` | `undefined` | +| `_label` _(required)_ | `_label` | Defines the visible or semantic label of the component (e.g. aria-label, label, headline, caption, summary, etc.). | `string` | `undefined` | ## Shadow Parts @@ -67,8 +64,6 @@ Mittels der Property `_label` muss ein Kontext-relevantes Icon beschriftet werde - [kol-alert-wc](../alert) - [kol-breadcrumb](../breadcrumb) - [kol-details](../details) -- [kol-icon-font-awesome](../icon-font-awesome) -- [kol-icon-icofont](../icon-icofont) - kol-input - [kol-input-checkbox](../input-checkbox) - kol-link-wc @@ -81,8 +76,6 @@ graph TD; kol-alert-wc --> kol-icon kol-breadcrumb --> kol-icon kol-details --> kol-icon - kol-icon-font-awesome --> kol-icon - kol-icon-icofont --> kol-icon kol-input --> kol-icon kol-input-checkbox --> kol-icon kol-link-wc --> kol-icon diff --git a/packages/components/src/components/input-checkbox/readme.md b/packages/components/src/components/input-checkbox/readme.md index a79578849d..50ca42dbea 100644 --- a/packages/components/src/components/input-checkbox/readme.md +++ b/packages/components/src/components/input-checkbox/readme.md @@ -58,36 +58,34 @@ Achten Sie darauf, jeder Checkbox ein Label zuzuweisen, da dieses von Screenread ## Properties -| Property | Attribute | Description | Type | Default | -| ---------------- | ---------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ----------- | -| `_accessKey` | `_access-key` | Defines which key combination can be used to trigger or focus the interactive element of the component. | `string \| undefined` | `undefined` | -| `_alert` | `_alert` | Defines whether the screen-readers should read out the notification. | `boolean \| undefined` | `true` | -| `_checked` | `_checked` | Defines whether the checkbox is checked or not. Can be read and written. | `boolean \| undefined` | `false` | -| `_disabled` | `_disabled` | Makes the element not focusable and ignore all events. | `boolean \| undefined` | `false` | -| `_error` | `_error` | Defines the error message text. | `string \| undefined` | `undefined` | -| `_hideError` | `_hide-error` | Hides the error message but leaves it in the DOM for the input's aria-describedby. | `boolean \| undefined` | `false` | -| `_hideLabel` | `_hide-label` | Hides the caption by default and displays the caption text with a tooltip when the interactive element is focused or the mouse is over it. | `boolean \| undefined` | `false` | -| `_hint` | `_hint` | Defines the hint text. | `string \| undefined` | `''` | -| `_icon` | `_icon` | **[DEPRECATED]** Use \_icons.

| `string \| undefined \| { checked: string; indeterminate?: string \| undefined; unchecked?: string \| undefined; } \| { checked?: string \| undefined; indeterminate: string; unchecked?: string \| undefined; } \| { checked?: string \| undefined; indeterminate?: string \| undefined; unchecked: string; }` | `undefined` | -| `_icons` | `_icons` | Defines the icon classnames (e.g. `_icons="fa-solid fa-user"`). | `string \| undefined \| { checked: string; indeterminate?: string \| undefined; unchecked?: string \| undefined; } \| { checked?: string \| undefined; indeterminate: string; unchecked?: string \| undefined; } \| { checked?: string \| undefined; indeterminate?: string \| undefined; unchecked: string; }` | `undefined` | -| `_id` | `_id` | Defines the internal ID of the primary component element. | `string \| undefined` | `undefined` | -| `_indeterminate` | `_indeterminate` | Puts the checkbox in the indeterminate state, does not change the value of \_checked. | `boolean \| undefined` | `undefined` | -| `_label` | `_label` | Defines the visible or semantic label of the component (e.g. aria-label, label, headline, caption, summary, etc.). Set to `false` to enable the expert slot. | `string \| undefined` | `undefined` | -| `_name` | `_name` | Defines the technical name of an input field. | `string \| undefined` | `undefined` | -| `_on` | -- | Gibt die EventCallback-Funktionen für das Input-Event an. | `InputTypeOnBlur & InputTypeOnClick & InputTypeOnChange & InputTypeOnFocus \| undefined` | `undefined` | -| `_required` | `_required` | Makes the input element required. | `boolean \| undefined` | `false` | -| `_tabIndex` | `_tab-index` | Defines which tab-index the primary element of the component has. (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'` | -| `_touched` | `_touched` | Shows if the input was touched by a user. | `boolean \| undefined` | `false` | -| `_type` | `_type` | **[DEPRECATED]** Verwende stattdessen das Attribute \_variant.

Deprecated: Defines which variant should be used for presentation. | `"button" \| "checkbox" \| "default" \| "switch" \| undefined` | `undefined` | -| `_value` | `_value` | Defines the value of the input. | `boolean \| null \| number \| object \| string \| undefined` | `true` | -| `_variant` | `_variant` | Defines which variant should be used for presentation. | `"button" \| "checkbox" \| "default" \| "switch" \| undefined` | `undefined` | +| Property | Attribute | Description | Type | Default | +| ---------------- | ---------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------ | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ----------- | +| `_accessKey` | `_access-key` | Defines which key combination can be used to trigger or focus the interactive element of the component. | `string \| undefined` | `undefined` | +| `_alert` | `_alert` | Defines whether the screen-readers should read out the notification. | `boolean \| undefined` | `true` | +| `_checked` | `_checked` | Defines whether the checkbox is checked or not. Can be read and written. | `boolean \| undefined` | `false` | +| `_disabled` | `_disabled` | Makes the element not focusable and ignore all events. | `boolean \| undefined` | `false` | +| `_error` | `_error` | Defines the error message text. | `string \| undefined` | `undefined` | +| `_hideError` | `_hide-error` | Hides the error message but leaves it in the DOM for the input's aria-describedby. | `boolean \| undefined` | `false` | +| `_hideLabel` | `_hide-label` | Hides the caption by default and displays the caption text with a tooltip when the interactive element is focused or the mouse is over it. | `boolean \| undefined` | `false` | +| `_hint` | `_hint` | Defines the hint text. | `string \| undefined` | `''` | +| `_icons` | `_icons` | Defines the icon classnames (e.g. `_icons="fa-solid fa-user"`). | `string \| undefined \| { checked: string; indeterminate?: string \| undefined; unchecked?: string \| undefined; } \| { checked?: string \| undefined; indeterminate: string; unchecked?: string \| undefined; } \| { checked?: string \| undefined; indeterminate?: string \| undefined; unchecked: string; }` | `undefined` | +| `_id` | `_id` | Defines the internal ID of the primary component element. | `string \| undefined` | `undefined` | +| `_indeterminate` | `_indeterminate` | Puts the checkbox in the indeterminate state, does not change the value of \_checked. | `boolean \| undefined` | `undefined` | +| `_label` | `_label` | Defines the visible or semantic label of the component (e.g. aria-label, label, headline, caption, summary, etc.). Set to `false` to enable the expert slot. | `string \| undefined` | `undefined` | +| `_name` | `_name` | Defines the technical name of an input field. | `string \| undefined` | `undefined` | +| `_on` | -- | Gibt die EventCallback-Funktionen für das Input-Event an. | `InputTypeOnBlur & InputTypeOnClick & InputTypeOnChange & InputTypeOnFocus \| undefined` | `undefined` | +| `_required` | `_required` | Makes the input element required. | `boolean \| undefined` | `false` | +| `_tabIndex` | `_tab-index` | Defines which tab-index the primary element of the component has. (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'` | +| `_touched` | `_touched` | Shows if the input was touched by a user. | `boolean \| undefined` | `false` | +| `_value` | `_value` | Defines the value of the input. | `boolean \| null \| number \| object \| string \| undefined` | `true` | +| `_variant` | `_variant` | Defines which variant should be used for presentation. | `"button" \| "default" \| "switch" \| undefined` | `'default'` | ## Slots -| Slot | Description | -| ---- | ------------------------------ | -| | Die Beschriftung der Checkbox. | +| Slot | Description | +| ---------- | ------------------------------ | +| `"expert"` | Die Beschriftung der Checkbox. | ## Dependencies diff --git a/packages/components/src/components/input-color/readme.md b/packages/components/src/components/input-color/readme.md index 697bff4347..e18ad6a3fb 100644 --- a/packages/components/src/components/input-color/readme.md +++ b/packages/components/src/components/input-color/readme.md @@ -46,29 +46,27 @@ Für eine vollständige Barrierefreiheit prüfen Sie die Verwendung einer vorgef ## Properties -| Property | Attribute | Description | Type | Default | -| --------------- | ---------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------ | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ----------- | -| `_accessKey` | `_access-key` | Defines which key combination can be used to trigger or focus the interactive element of the component. | `string \| undefined` | `undefined` | -| `_alert` | `_alert` | Defines whether the screen-readers should read out the notification. | `boolean \| undefined` | `true` | -| `_autoComplete` | `_auto-complete` | Defines whether the input can be auto-completed. | `"off" \| "on" \| undefined` | `undefined` | -| `_disabled` | `_disabled` | Makes the element not focusable and ignore all events. | `boolean \| undefined` | `false` | -| `_error` | `_error` | Defines the error message text. | `string \| undefined` | `undefined` | -| `_hideError` | `_hide-error` | Hides the error message but leaves it in the DOM for the input's aria-describedby. | `boolean \| undefined` | `false` | -| `_hideLabel` | `_hide-label` | Hides the caption by default and displays the caption text with a tooltip when the interactive element is focused or the mouse is over it. | `boolean \| undefined` | `false` | -| `_hint` | `_hint` | Defines the hint text. | `string \| undefined` | `''` | -| `_icon` | `_icon` | **[DEPRECATED]** Use \_icons.

| `string \| undefined \| { right?: IconOrIconClass \| undefined; left?: IconOrIconClass \| undefined; }` | `undefined` | -| `_icons` | `_icons` | Defines the icon classnames (e.g. `_icons="fa-solid fa-user"`). | `string \| undefined \| { right?: IconOrIconClass \| undefined; left?: IconOrIconClass \| undefined; }` | `undefined` | -| `_id` | `_id` | Defines the internal ID of the primary component element. | `string \| undefined` | `undefined` | -| `_label` | `_label` | Defines the visible or semantic label of the component (e.g. aria-label, label, headline, caption, summary, etc.). Set to `false` to enable the expert slot. | `string \| undefined` | `undefined` | -| `_list` | `_list` | **[DEPRECATED]** Use \_suggestions instead.

Deprecated: Gibt die Liste der Vorschlagswörter an. | `W3CInputValue[] \| string \| undefined` | `undefined` | -| `_name` | `_name` | Defines the technical name of an input field. | `string \| undefined` | `undefined` | -| `_on` | -- | Gibt die EventCallback-Funktionen für das Input-Event an. | `InputTypeOnBlur & InputTypeOnClick & InputTypeOnChange & InputTypeOnFocus \| undefined` | `undefined` | -| `_smartButton` | `_smart-button` | Allows to add a button with an arbitrary action within the element (\_hide-label only). | `string \| undefined \| { _label: string; } & { _tabIndex?: number \| undefined; _value?: Stringified; _accessKey?: string \| undefined; _iconAlign?: AlignPropType \| undefined; _iconOnly?: boolean \| undefined; _icon?: IconsPropType \| undefined; _role?: AlternativeButtonLinkRolePropType \| undefined; _ariaControls?: string \| undefined; _ariaCurrent?: AriaCurrentPropType \| undefined; _ariaExpanded?: boolean \| undefined; _ariaLabel?: string \| undefined; _ariaSelected?: boolean \| undefined; _on?: ButtonCallbacksPropType \| undefined; _type?: ButtonTypePropType \| undefined; _variant?: ButtonVariantPropType \| undefined; _customClass?: string \| undefined; _disabled?: boolean \| undefined; _hideLabel?: boolean \| undefined; _icons?: IconsPropType \| undefined; _id?: string \| undefined; _name?: string \| undefined; _syncValueBySelector?: string \| undefined; _tooltipAlign?: AlignPropType \| undefined; }` | `undefined` | -| `_suggestions` | `_suggestions` | Suggestions to provide for the input. | `W3CInputValue[] \| string \| undefined` | `undefined` | -| `_tabIndex` | `_tab-index` | Defines which tab-index the primary element of the component has. (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'` | -| `_touched` | `_touched` | Shows if the input was touched by a user. | `boolean \| undefined` | `false` | -| `_value` | `_value` | Defines the value of the input. | `string \| undefined` | `undefined` | +| Property | Attribute | Description | Type | Default | +| --------------- | ---------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------ | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ----------- | +| `_accessKey` | `_access-key` | Defines which key combination can be used to trigger or focus the interactive element of the component. | `string \| undefined` | `undefined` | +| `_alert` | `_alert` | Defines whether the screen-readers should read out the notification. | `boolean \| undefined` | `true` | +| `_autoComplete` | `_auto-complete` | Defines whether the input can be auto-completed. | `"off" \| "on" \| undefined` | `undefined` | +| `_disabled` | `_disabled` | Makes the element not focusable and ignore all events. | `boolean \| undefined` | `false` | +| `_error` | `_error` | Defines the error message text. | `string \| undefined` | `undefined` | +| `_hideError` | `_hide-error` | Hides the error message but leaves it in the DOM for the input's aria-describedby. | `boolean \| undefined` | `false` | +| `_hideLabel` | `_hide-label` | Hides the caption by default and displays the caption text with a tooltip when the interactive element is focused or the mouse is over it. | `boolean \| undefined` | `false` | +| `_hint` | `_hint` | Defines the hint text. | `string \| undefined` | `''` | +| `_icons` | `_icons` | Defines the icon classnames (e.g. `_icons="fa-solid fa-user"`). | `string \| undefined \| { right?: IconOrIconClass \| undefined; left?: IconOrIconClass \| undefined; }` | `undefined` | +| `_id` | `_id` | Defines the internal ID of the primary component element. | `string \| undefined` | `undefined` | +| `_label` | `_label` | Defines the visible or semantic label of the component (e.g. aria-label, label, headline, caption, summary, etc.). Set to `false` to enable the expert slot. | `string \| undefined` | `undefined` | +| `_name` | `_name` | Defines the technical name of an input field. | `string \| undefined` | `undefined` | +| `_on` | -- | Gibt die EventCallback-Funktionen für das Input-Event an. | `InputTypeOnBlur & InputTypeOnClick & InputTypeOnChange & InputTypeOnFocus \| undefined` | `undefined` | +| `_smartButton` | `_smart-button` | Allows to add a button with an arbitrary action within the element (\_hide-label only). | `string \| undefined \| { _label: string; } & { _tabIndex?: number \| undefined; _value?: Stringified; _role?: AlternativeButtonLinkRolePropType \| undefined; _ariaControls?: string \| undefined; _ariaExpanded?: boolean \| undefined; _ariaSelected?: boolean \| undefined; _on?: ButtonCallbacksPropType \| undefined; _type?: ButtonTypePropType \| undefined; _variant?: ButtonVariantPropType \| undefined; _customClass?: string \| undefined; _disabled?: boolean \| undefined; _hideLabel?: boolean \| undefined; _icons?: IconsPropType \| undefined; _id?: string \| undefined; _name?: string \| undefined; _syncValueBySelector?: string \| undefined; _tooltipAlign?: AlignPropType \| undefined; }` | `undefined` | +| `_suggestions` | `_suggestions` | Suggestions to provide for the input. | `W3CInputValue[] \| string \| undefined` | `undefined` | +| `_tabIndex` | `_tab-index` | Defines which tab-index the primary element of the component has. (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'` | +| `_touched` | `_touched` | Shows if the input was touched by a user. | `boolean \| undefined` | `false` | +| `_value` | `_value` | Defines the value of the input. | `string \| undefined` | `undefined` | ## Slots diff --git a/packages/components/src/components/input-date/readme.md b/packages/components/src/components/input-date/readme.md index f8bda2fe94..5ac5c4321d 100644 --- a/packages/components/src/components/input-date/readme.md +++ b/packages/components/src/components/input-date/readme.md @@ -76,35 +76,33 @@ Das Eingabefeld für Zeitangaben gibt es in unterschiedlichen Ausprägungen (Dat ## Properties -| Property | Attribute | Description | Type | Default | -| --------------- | ---------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------ | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ----------- | -| `_accessKey` | `_access-key` | Defines which key combination can be used to trigger or focus the interactive element of the component. | `string \| undefined` | `undefined` | -| `_alert` | `_alert` | Defines whether the screen-readers should read out the notification. | `boolean \| undefined` | `true` | -| `_autoComplete` | `_auto-complete` | Defines whether the input can be auto-completed. | `"off" \| "on" \| undefined` | `undefined` | -| `_disabled` | `_disabled` | Makes the element not focusable and ignore all events. | `boolean \| undefined` | `false` | -| `_error` | `_error` | Defines the error message text. | `string \| undefined` | `undefined` | -| `_hideError` | `_hide-error` | Hides the error message but leaves it in the DOM for the input's aria-describedby. | `boolean \| undefined` | `false` | -| `_hideLabel` | `_hide-label` | Hides the caption by default and displays the caption text with a tooltip when the interactive element is focused or the mouse is over it. | `boolean \| undefined` | `false` | -| `_hint` | `_hint` | Defines the hint text. | `string \| undefined` | `''` | -| `_icon` | `_icon` | **[DEPRECATED]** Use \_icons.

| `string \| undefined \| { right?: IconOrIconClass \| undefined; left?: IconOrIconClass \| undefined; }` | `undefined` | -| `_icons` | `_icons` | | `string \| undefined \| { right?: IconOrIconClass \| undefined; left?: IconOrIconClass \| undefined; }` | `undefined` | -| `_id` | `_id` | Defines the internal ID of the primary component element. | `string \| undefined` | `undefined` | -| `_label` | `_label` | Defines the visible or semantic label of the component (e.g. aria-label, label, headline, caption, summary, etc.). Set to `false` to enable the expert slot. | `string \| undefined` | `undefined` | -| `_list` | `_list` | **[DEPRECATED]** Use \_suggestions instead.

Deprecated: Gibt die Liste der Vorschlagszahlen an. | `string \| string[] \| undefined` | `undefined` | -| `_max` | `_max` | Defines the largest possible input value. | `Date \| `${number}-${number}-${number}T${number}:${number}:${number}`\|`${number}-${number}-${number}T${number}:${number}` \| `${number}-${number}-${number}`\|`${number}-${number}`\|`${number}-W${number}`\|`${number}:${number}:${number}` \| `${number}:${number}` \| undefined` | `undefined` | -| `_min` | `_min` | Defines the smallest possible input value. | `Date \| `${number}-${number}-${number}T${number}:${number}:${number}`\|`${number}-${number}-${number}T${number}:${number}` \| `${number}-${number}-${number}`\|`${number}-${number}`\|`${number}-W${number}`\|`${number}:${number}:${number}` \| `${number}:${number}` \| undefined` | `undefined` | -| `_name` | `_name` | Defines the technical name of an input field. | `string \| undefined` | `undefined` | -| `_on` | -- | Gibt die EventCallback-Funktionen für das Input-Event an. | `InputTypeOnBlur & InputTypeOnClick & InputTypeOnChange & InputTypeOnFocus \| undefined` | `undefined` | -| `_readOnly` | `_read-only` | Makes the input element read only. | `boolean \| undefined` | `false` | -| `_required` | `_required` | Makes the input element required. | `boolean \| undefined` | `false` | -| `_smartButton` | `_smart-button` | Allows to add a button with an arbitrary action within the element (\_hide-label only). | `string \| undefined \| { _label: string; } & { _tabIndex?: number \| undefined; _value?: Stringified; _accessKey?: string \| undefined; _iconAlign?: AlignPropType \| undefined; _iconOnly?: boolean \| undefined; _icon?: IconsPropType \| undefined; _role?: AlternativeButtonLinkRolePropType \| undefined; _ariaControls?: string \| undefined; _ariaCurrent?: AriaCurrentPropType \| undefined; _ariaExpanded?: boolean \| undefined; _ariaLabel?: string \| undefined; _ariaSelected?: boolean \| undefined; _on?: ButtonCallbacksPropType \| undefined; _type?: ButtonTypePropType \| undefined; _variant?: ButtonVariantPropType \| undefined; _customClass?: string \| undefined; _disabled?: boolean \| undefined; _hideLabel?: boolean \| undefined; _icons?: IconsPropType \| undefined; _id?: string \| undefined; _name?: string \| undefined; _syncValueBySelector?: string \| undefined; _tooltipAlign?: AlignPropType \| undefined; }` | `undefined` | -| `_step` | `_step` | Defines the step size for value changes. | `number \| undefined` | `undefined` | -| `_suggestions` | `_suggestions` | Suggestions to provide for the input. | `W3CInputValue[] \| string \| undefined` | `undefined` | -| `_tabIndex` | `_tab-index` | Defines which tab-index the primary element of the component has. (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'` | -| `_touched` | `_touched` | Shows if the input was touched by a user. | `boolean \| undefined` | `false` | -| `_type` | `_type` | Defines either the type of the component or of the components interactive element. | `"date" \| "datetime-local" \| "month" \| "time" \| "week"` | `'date'` | -| `_value` | `_value` | Defines the value of the input. | `Date \| `${number}-${number}-${number}T${number}:${number}:${number}`\|`${number}-${number}-${number}T${number}:${number}` \| `${number}-${number}-${number}`\|`${number}-${number}`\|`${number}-W${number}`\|`${number}:${number}:${number}` \| `${number}:${number}` \| null \| undefined` | `undefined` | +| Property | Attribute | Description | Type | Default | +| --------------- | ---------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------ | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ----------- | +| `_accessKey` | `_access-key` | Defines which key combination can be used to trigger or focus the interactive element of the component. | `string \| undefined` | `undefined` | +| `_alert` | `_alert` | Defines whether the screen-readers should read out the notification. | `boolean \| undefined` | `true` | +| `_autoComplete` | `_auto-complete` | Defines whether the input can be auto-completed. | `"off" \| "on" \| undefined` | `undefined` | +| `_disabled` | `_disabled` | Makes the element not focusable and ignore all events. | `boolean \| undefined` | `false` | +| `_error` | `_error` | Defines the error message text. | `string \| undefined` | `undefined` | +| `_hideError` | `_hide-error` | Hides the error message but leaves it in the DOM for the input's aria-describedby. | `boolean \| undefined` | `false` | +| `_hideLabel` | `_hide-label` | Hides the caption by default and displays the caption text with a tooltip when the interactive element is focused or the mouse is over it. | `boolean \| undefined` | `false` | +| `_hint` | `_hint` | Defines the hint text. | `string \| undefined` | `''` | +| `_icons` | `_icons` | Defines the icon classnames (e.g. `_icons="fa-solid fa-user"`). | `string \| undefined \| { right?: IconOrIconClass \| undefined; left?: IconOrIconClass \| undefined; }` | `undefined` | +| `_id` | `_id` | Defines the internal ID of the primary component element. | `string \| undefined` | `undefined` | +| `_label` | `_label` | Defines the visible or semantic label of the component (e.g. aria-label, label, headline, caption, summary, etc.). Set to `false` to enable the expert slot. | `string \| undefined` | `undefined` | +| `_max` | `_max` | Defines the largest possible input value. | `Date \| `${number}-${number}-${number}T${number}:${number}:${number}`\|`${number}-${number}-${number}T${number}:${number}` \| `${number}-${number}-${number}`\|`${number}-${number}`\|`${number}-W${number}`\|`${number}:${number}:${number}` \| `${number}:${number}` \| undefined` | `undefined` | +| `_min` | `_min` | Defines the smallest possible input value. | `Date \| `${number}-${number}-${number}T${number}:${number}:${number}`\|`${number}-${number}-${number}T${number}:${number}` \| `${number}-${number}-${number}`\|`${number}-${number}`\|`${number}-W${number}`\|`${number}:${number}:${number}` \| `${number}:${number}` \| undefined` | `undefined` | +| `_name` | `_name` | Defines the technical name of an input field. | `string \| undefined` | `undefined` | +| `_on` | -- | Gibt die EventCallback-Funktionen für das Input-Event an. | `InputTypeOnBlur & InputTypeOnClick & InputTypeOnChange & InputTypeOnFocus \| undefined` | `undefined` | +| `_readOnly` | `_read-only` | Makes the input element read only. | `boolean \| undefined` | `false` | +| `_required` | `_required` | Makes the input element required. | `boolean \| undefined` | `false` | +| `_smartButton` | `_smart-button` | Allows to add a button with an arbitrary action within the element (\_hide-label only). | `string \| undefined \| { _label: string; } & { _tabIndex?: number \| undefined; _value?: Stringified; _role?: AlternativeButtonLinkRolePropType \| undefined; _ariaControls?: string \| undefined; _ariaExpanded?: boolean \| undefined; _ariaSelected?: boolean \| undefined; _on?: ButtonCallbacksPropType \| undefined; _type?: ButtonTypePropType \| undefined; _variant?: ButtonVariantPropType \| undefined; _customClass?: string \| undefined; _disabled?: boolean \| undefined; _hideLabel?: boolean \| undefined; _icons?: IconsPropType \| undefined; _id?: string \| undefined; _name?: string \| undefined; _syncValueBySelector?: string \| undefined; _tooltipAlign?: AlignPropType \| undefined; }` | `undefined` | +| `_step` | `_step` | Defines the step size for value changes. | `number \| undefined` | `undefined` | +| `_suggestions` | `_suggestions` | Suggestions to provide for the input. | `W3CInputValue[] \| string \| undefined` | `undefined` | +| `_tabIndex` | `_tab-index` | Defines which tab-index the primary element of the component has. (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'` | +| `_touched` | `_touched` | Shows if the input was touched by a user. | `boolean \| undefined` | `false` | +| `_type` | `_type` | Defines either the type of the component or of the components interactive element. | `"date" \| "datetime-local" \| "month" \| "time" \| "week"` | `'date'` | +| `_value` | `_value` | Defines the value of the input. | `Date \| `${number}-${number}-${number}T${number}:${number}:${number}`\|`${number}-${number}-${number}T${number}:${number}` \| `${number}-${number}-${number}`\|`${number}-${number}`\|`${number}-W${number}`\|`${number}:${number}:${number}` \| `${number}:${number}` \| null \| undefined` | `undefined` | ## Slots diff --git a/packages/components/src/components/input-email/readme.md b/packages/components/src/components/input-email/readme.md index 05abf3a84c..5db5434eb5 100644 --- a/packages/components/src/components/input-email/readme.md +++ b/packages/components/src/components/input-email/readme.md @@ -44,37 +44,34 @@ Um eine fehlgeschlagene Validierung anzuzeigen, setzen Sie das Attrbut **`_error ## Properties -| Property | Attribute | Description | Type | Default | -| --------------- | ---------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------ | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ----------- | -| `_accessKey` | `_access-key` | Defines which key combination can be used to trigger or focus the interactive element of the component. | `string \| undefined` | `undefined` | -| `_alert` | `_alert` | Defines whether the screen-readers should read out the notification. | `boolean \| undefined` | `true` | -| `_autoComplete` | `_auto-complete` | Defines whether the input can be auto-completed. | `"off" \| "on" \| undefined` | `undefined` | -| `_disabled` | `_disabled` | Makes the element not focusable and ignore all events. | `boolean \| undefined` | `false` | -| `_error` | `_error` | Defines the error message text. | `string \| undefined` | `undefined` | -| `_hasCounter` | `_has-counter` | Shows the character count on the lower border of the input. | `boolean \| undefined` | `false` | -| `_hideError` | `_hide-error` | Hides the error message but leaves it in the DOM for the input's aria-describedby. | `boolean \| undefined` | `false` | -| `_hideLabel` | `_hide-label` | Hides the caption by default and displays the caption text with a tooltip when the interactive element is focused or the mouse is over it. | `boolean \| undefined` | `false` | -| `_hint` | `_hint` | Defines the hint text. | `string \| undefined` | `''` | -| `_icon` | `_icon` | **[DEPRECATED]** Use \_icons.

| `string \| undefined \| { right?: IconOrIconClass \| undefined; left?: IconOrIconClass \| undefined; }` | `undefined` | -| `_icons` | `_icons` | | `string \| undefined \| { right?: IconOrIconClass \| undefined; left?: IconOrIconClass \| undefined; }` | `undefined` | -| `_id` | `_id` | Defines the internal ID of the primary component element. | `string \| undefined` | `undefined` | -| `_label` | `_label` | Defines the visible or semantic label of the component (e.g. aria-label, label, headline, caption, summary, etc.). Set to `false` to enable the expert slot. | `string \| undefined` | `undefined` | -| `_list` | `_list` | **[DEPRECATED]** Use \_suggestions.

Deprecated: Gibt die Liste der Vorschlagswörter an. | `string \| string[] \| undefined` | `undefined` | -| `_maxLength` | `_max-length` | Defines the maximum number of input characters. | `number \| undefined` | `undefined` | -| `_multiple` | `_multiple` | Makes the input accept multiple inputs. | `boolean \| undefined` | `false` | -| `_name` | `_name` | Defines the technical name of an input field. | `string \| undefined` | `undefined` | -| `_on` | -- | Gibt die EventCallback-Funktionen für das Input-Event an. | `InputTypeOnBlur & InputTypeOnClick & InputTypeOnChange & InputTypeOnFocus \| undefined` | `undefined` | -| `_pattern` | `_pattern` | Defines a validation pattern for the input field. | `string \| undefined` | `undefined` | -| `_placeholder` | `_placeholder` | Defines the placeholder for input field. To be shown when there's no value. | `string \| undefined` | `undefined` | -| `_readOnly` | `_read-only` | Makes the input element read only. | `boolean \| undefined` | `false` | -| `_required` | `_required` | Makes the input element required. | `boolean \| undefined` | `false` | -| `_size` | `_size` | Setzt die Breite des Eingabefeldes in Buchstabenbreiten. | `number \| undefined` | `undefined` | -| `_smartButton` | `_smart-button` | Allows to add a button with an arbitrary action within the element (\_hide-label only). | `string \| undefined \| { _label: string; } & { _tabIndex?: number \| undefined; _value?: Stringified; _accessKey?: string \| undefined; _iconAlign?: AlignPropType \| undefined; _iconOnly?: boolean \| undefined; _icon?: IconsPropType \| undefined; _role?: AlternativeButtonLinkRolePropType \| undefined; _ariaControls?: string \| undefined; _ariaCurrent?: AriaCurrentPropType \| undefined; _ariaExpanded?: boolean \| undefined; _ariaLabel?: string \| undefined; _ariaSelected?: boolean \| undefined; _on?: ButtonCallbacksPropType \| undefined; _type?: ButtonTypePropType \| undefined; _variant?: ButtonVariantPropType \| undefined; _customClass?: string \| undefined; _disabled?: boolean \| undefined; _hideLabel?: boolean \| undefined; _icons?: IconsPropType \| undefined; _id?: string \| undefined; _name?: string \| undefined; _syncValueBySelector?: string \| undefined; _tooltipAlign?: AlignPropType \| undefined; }` | `undefined` | -| `_suggestions` | `_suggestions` | Suggestions to provide for the input. | `W3CInputValue[] \| string \| undefined` | `undefined` | -| `_tabIndex` | `_tab-index` | Defines which tab-index the primary element of the component has. (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'` | -| `_touched` | `_touched` | Shows if the input was touched by a user. | `boolean \| undefined` | `false` | -| `_value` | `_value` | Defines the value of the input. | `string \| undefined` | `undefined` | +| Property | Attribute | Description | Type | Default | +| --------------- | ---------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------ | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ----------- | +| `_accessKey` | `_access-key` | Defines which key combination can be used to trigger or focus the interactive element of the component. | `string \| undefined` | `undefined` | +| `_alert` | `_alert` | Defines whether the screen-readers should read out the notification. | `boolean \| undefined` | `true` | +| `_autoComplete` | `_auto-complete` | Defines whether the input can be auto-completed. | `"off" \| "on" \| undefined` | `undefined` | +| `_disabled` | `_disabled` | Makes the element not focusable and ignore all events. | `boolean \| undefined` | `false` | +| `_error` | `_error` | Defines the error message text. | `string \| undefined` | `undefined` | +| `_hasCounter` | `_has-counter` | Shows the character count on the lower border of the input. | `boolean \| undefined` | `false` | +| `_hideError` | `_hide-error` | Hides the error message but leaves it in the DOM for the input's aria-describedby. | `boolean \| undefined` | `false` | +| `_hideLabel` | `_hide-label` | Hides the caption by default and displays the caption text with a tooltip when the interactive element is focused or the mouse is over it. | `boolean \| undefined` | `false` | +| `_hint` | `_hint` | Defines the hint text. | `string \| undefined` | `''` | +| `_icons` | `_icons` | Defines the icon classnames (e.g. `_icons="fa-solid fa-user"`). | `string \| undefined \| { right?: IconOrIconClass \| undefined; left?: IconOrIconClass \| undefined; }` | `undefined` | +| `_id` | `_id` | Defines the internal ID of the primary component element. | `string \| undefined` | `undefined` | +| `_label` | `_label` | Defines the visible or semantic label of the component (e.g. aria-label, label, headline, caption, summary, etc.). Set to `false` to enable the expert slot. | `string \| undefined` | `undefined` | +| `_maxLength` | `_max-length` | Defines the maximum number of input characters. | `number \| undefined` | `undefined` | +| `_multiple` | `_multiple` | Makes the input accept multiple inputs. | `boolean \| undefined` | `false` | +| `_name` | `_name` | Defines the technical name of an input field. | `string \| undefined` | `undefined` | +| `_on` | -- | Gibt die EventCallback-Funktionen für das Input-Event an. | `InputTypeOnBlur & InputTypeOnClick & InputTypeOnChange & InputTypeOnFocus \| undefined` | `undefined` | +| `_pattern` | `_pattern` | Defines a validation pattern for the input field. | `string \| undefined` | `undefined` | +| `_placeholder` | `_placeholder` | Defines the placeholder for input field. To be shown when there's no value. | `string \| undefined` | `undefined` | +| `_readOnly` | `_read-only` | Makes the input element read only. | `boolean \| undefined` | `false` | +| `_required` | `_required` | Makes the input element required. | `boolean \| undefined` | `false` | +| `_smartButton` | `_smart-button` | Allows to add a button with an arbitrary action within the element (\_hide-label only). | `string \| undefined \| { _label: string; } & { _tabIndex?: number \| undefined; _value?: Stringified; _role?: AlternativeButtonLinkRolePropType \| undefined; _ariaControls?: string \| undefined; _ariaExpanded?: boolean \| undefined; _ariaSelected?: boolean \| undefined; _on?: ButtonCallbacksPropType \| undefined; _type?: ButtonTypePropType \| undefined; _variant?: ButtonVariantPropType \| undefined; _customClass?: string \| undefined; _disabled?: boolean \| undefined; _hideLabel?: boolean \| undefined; _icons?: IconsPropType \| undefined; _id?: string \| undefined; _name?: string \| undefined; _syncValueBySelector?: string \| undefined; _tooltipAlign?: AlignPropType \| undefined; }` | `undefined` | +| `_suggestions` | `_suggestions` | Suggestions to provide for the input. | `W3CInputValue[] \| string \| undefined` | `undefined` | +| `_tabIndex` | `_tab-index` | Defines which tab-index the primary element of the component has. (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'` | +| `_touched` | `_touched` | Shows if the input was touched by a user. | `boolean \| undefined` | `false` | +| `_value` | `_value` | Defines the value of the input. | `string \| undefined` | `undefined` | ## Slots diff --git a/packages/components/src/components/input-file/readme.md b/packages/components/src/components/input-file/readme.md index e21ded1e89..354c9f7826 100644 --- a/packages/components/src/components/input-file/readme.md +++ b/packages/components/src/components/input-file/readme.md @@ -41,29 +41,28 @@ Mögliche Werte und weitere Informationen erhalten Sie im **[DEPRECATED]** Use \_icons.

| `string \| undefined \| { right?: IconOrIconClass \| undefined; left?: IconOrIconClass \| undefined; }` | `undefined` | -| `_icons` | `_icons` | Defines the icon classnames (e.g. `_icons="fa-solid fa-user"`). | `string \| undefined \| { right?: IconOrIconClass \| undefined; left?: IconOrIconClass \| undefined; }` | `undefined` | -| `_id` | `_id` | Defines the internal ID of the primary component element. | `string \| undefined` | `undefined` | -| `_label` | `_label` | Defines the visible or semantic label of the component (e.g. aria-label, label, headline, caption, summary, etc.). Set to `false` to enable the expert slot. | `string \| undefined` | `undefined` | -| `_multiple` | `_multiple` | Makes the input accept multiple inputs. | `boolean \| undefined` | `false` | -| `_name` | `_name` | Defines the technical name of an input field. | `string \| undefined` | `undefined` | -| `_on` | -- | Gibt die EventCallback-Funktionen für das Input-Event an. | `InputTypeOnBlur & InputTypeOnClick & InputTypeOnChange & InputTypeOnFocus \| undefined` | `undefined` | -| `_required` | `_required` | Makes the input element required. | `boolean \| undefined` | `false` | -| `_smartButton` | `_smart-button` | Allows to add a button with an arbitrary action within the element (\_hide-label only). | `string \| undefined \| { _label: string; } & { _tabIndex?: number \| undefined; _value?: Stringified; _accessKey?: string \| undefined; _iconAlign?: AlignPropType \| undefined; _iconOnly?: boolean \| undefined; _icon?: IconsPropType \| undefined; _role?: AlternativeButtonLinkRolePropType \| undefined; _ariaControls?: string \| undefined; _ariaCurrent?: AriaCurrentPropType \| undefined; _ariaExpanded?: boolean \| undefined; _ariaLabel?: string \| undefined; _ariaSelected?: boolean \| undefined; _on?: ButtonCallbacksPropType \| undefined; _type?: ButtonTypePropType \| undefined; _variant?: ButtonVariantPropType \| undefined; _customClass?: string \| undefined; _disabled?: boolean \| undefined; _hideLabel?: boolean \| undefined; _icons?: IconsPropType \| undefined; _id?: string \| undefined; _name?: string \| undefined; _syncValueBySelector?: string \| undefined; _tooltipAlign?: AlignPropType \| undefined; }` | `undefined` | -| `_tabIndex` | `_tab-index` | Defines which tab-index the primary element of the component has. (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'` | -| `_touched` | `_touched` | Shows if the input was touched by a user. | `boolean \| undefined` | `false` | -| `_value` | `_value` | Defines the value of the input. | `string \| undefined` | `undefined` | +| Property | Attribute | Description | Type | Default | +| --------------- | ---------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------ | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ----------- | +| `_accept` | `_accept` | Defines which file formats are accepted. | `string \| undefined` | `undefined` | +| `_accessKey` | `_access-key` | Defines which key combination can be used to trigger or focus the interactive element of the component. | `string \| undefined` | `undefined` | +| `_alert` | `_alert` | Defines whether the screen-readers should read out the notification. | `boolean \| undefined` | `true` | +| `_disabled` | `_disabled` | Makes the element not focusable and ignore all events. | `boolean \| undefined` | `false` | +| `_error` | `_error` | Defines the error message text. | `string \| undefined` | `undefined` | +| `_hideError` | `_hide-error` | Hides the error message but leaves it in the DOM for the input's aria-describedby. | `boolean \| undefined` | `false` | +| `_hideLabel` | `_hide-label` | Hides the caption by default and displays the caption text with a tooltip when the interactive element is focused or the mouse is over it. | `boolean \| undefined` | `false` | +| `_hint` | `_hint` | Defines the hint text. | `string \| undefined` | `''` | +| `_icons` | `_icons` | Defines the icon classnames (e.g. `_icons="fa-solid fa-user"`). | `string \| undefined \| { right?: IconOrIconClass \| undefined; left?: IconOrIconClass \| undefined; }` | `undefined` | +| `_id` | `_id` | Defines the internal ID of the primary component element. | `string \| undefined` | `undefined` | +| `_label` | `_label` | Defines the visible or semantic label of the component (e.g. aria-label, label, headline, caption, summary, etc.). Set to `false` to enable the expert slot. | `string \| undefined` | `undefined` | +| `_multiple` | `_multiple` | Makes the input accept multiple inputs. | `boolean \| undefined` | `false` | +| `_name` | `_name` | Defines the technical name of an input field. | `string \| undefined` | `undefined` | +| `_on` | -- | Gibt die EventCallback-Funktionen für das Input-Event an. | `InputTypeOnBlur & InputTypeOnClick & InputTypeOnChange & InputTypeOnFocus \| undefined` | `undefined` | +| `_required` | `_required` | Makes the input element required. | `boolean \| undefined` | `false` | +| `_smartButton` | `_smart-button` | Allows to add a button with an arbitrary action within the element (\_hide-label only). | `string \| undefined \| { _label: string; } & { _tabIndex?: number \| undefined; _value?: Stringified; _role?: AlternativeButtonLinkRolePropType \| undefined; _ariaControls?: string \| undefined; _ariaExpanded?: boolean \| undefined; _ariaSelected?: boolean \| undefined; _on?: ButtonCallbacksPropType \| undefined; _type?: ButtonTypePropType \| undefined; _variant?: ButtonVariantPropType \| undefined; _customClass?: string \| undefined; _disabled?: boolean \| undefined; _hideLabel?: boolean \| undefined; _icons?: IconsPropType \| undefined; _id?: string \| undefined; _name?: string \| undefined; _syncValueBySelector?: string \| undefined; _tooltipAlign?: AlignPropType \| undefined; }` | `undefined` | +| `_tabIndex` | `_tab-index` | Defines which tab-index the primary element of the component has. (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'` | +| `_touched` | `_touched` | Shows if the input was touched by a user. | `boolean \| undefined` | `false` | +| `_value` | `_value` | Defines the value of the input. | `string \| undefined` | `undefined` | ## Slots diff --git a/packages/components/src/components/input-number/readme.md b/packages/components/src/components/input-number/readme.md index 77b1e49477..fe62951d41 100644 --- a/packages/components/src/components/input-number/readme.md +++ b/packages/components/src/components/input-number/readme.md @@ -35,36 +35,33 @@ Der Input-Typ **Number** erzeugt ein Eingabefeld für Zahlen. ## Properties -| Property | Attribute | Description | Type | Default | -| --------------- | ---------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ----------- | -| `_accessKey` | `_access-key` | Defines which key combination can be used to trigger or focus the interactive element of the component. | `string \| undefined` | `undefined` | -| `_alert` | `_alert` | Defines whether the screen-readers should read out the notification. | `boolean \| undefined` | `true` | -| `_autoComplete` | `_auto-complete` | Defines whether the input can be auto-completed. | `"off" \| "on" \| undefined` | `undefined` | -| `_disabled` | `_disabled` | Makes the element not focusable and ignore all events. | `boolean \| undefined` | `false` | -| `_error` | `_error` | Defines the error message text. | `string \| undefined` | `undefined` | -| `_hideError` | `_hide-error` | Hides the error message but leaves it in the DOM for the input's aria-describedby. | `boolean \| undefined` | `false` | -| `_hideLabel` | `_hide-label` | Hides the caption by default and displays the caption text with a tooltip when the interactive element is focused or the mouse is over it. | `boolean \| undefined` | `false` | -| `_hint` | `_hint` | Defines the hint text. | `string \| undefined` | `''` | -| `_icon` | `_icon` | **[DEPRECATED]** Use \_icons.

| `string \| undefined \| { right?: IconOrIconClass \| undefined; left?: IconOrIconClass \| undefined; }` | `undefined` | -| `_icons` | `_icons` | Defines the icon classnames (e.g. `_icons="fa-solid fa-user"`). | `string \| undefined \| { right?: IconOrIconClass \| undefined; left?: IconOrIconClass \| undefined; }` | `undefined` | -| `_id` | `_id` | Defines the internal ID of the primary component element. | `string \| undefined` | `undefined` | -| `_label` | `_label` | Defines the visible or semantic label of the component (e.g. aria-label, label, headline, caption, summary, etc.). Set to `false` to enable the expert slot. | `string \| undefined` | `undefined` | -| `_list` | `_list` | **[DEPRECATED]** Use \_suggestions intead.

Deprecated: Gibt die Liste der Vorschlagszahlen an. | `string \| string[] \| undefined` | `undefined` | -| `_max` | `_max` | Defines the largest possible input value. | ``${number}-${number}-${number}T${number}:${number}:${number}` \| `${number}-${number}-${number}T${number}:${number}` \| `${number}-${number}-${number}` \| `${number}-${number}` \| `${number}-W${number}` \| `${number}:${number}:${number}` \| `${number}:${number}` \| number \| undefined` | `undefined` | -| `_min` | `_min` | Defines the smallest possible input value. | ``${number}-${number}-${number}T${number}:${number}:${number}` \| `${number}-${number}-${number}T${number}:${number}` \| `${number}-${number}-${number}` \| `${number}-${number}` \| `${number}-W${number}` \| `${number}:${number}:${number}` \| `${number}:${number}` \| number \| undefined` | `undefined` | -| `_name` | `_name` | Defines the technical name of an input field. | `string \| undefined` | `undefined` | -| `_on` | -- | Gibt die EventCallback-Funktionen für das Input-Event an. | `InputTypeOnBlur & InputTypeOnClick & InputTypeOnChange & InputTypeOnFocus \| undefined` | `undefined` | -| `_placeholder` | `_placeholder` | Defines the placeholder for input field. To be shown when there's no value. | `string \| undefined` | `undefined` | -| `_readOnly` | `_read-only` | Makes the input element read only. | `boolean \| undefined` | `false` | -| `_required` | `_required` | Makes the input element required. | `boolean \| undefined` | `false` | -| `_smartButton` | `_smart-button` | Allows to add a button with an arbitrary action within the element (\_hide-label only). | `string \| undefined \| { _label: string; } & { _tabIndex?: number \| undefined; _value?: Stringified; _accessKey?: string \| undefined; _iconAlign?: AlignPropType \| undefined; _iconOnly?: boolean \| undefined; _icon?: IconsPropType \| undefined; _role?: AlternativeButtonLinkRolePropType \| undefined; _ariaControls?: string \| undefined; _ariaCurrent?: AriaCurrentPropType \| undefined; _ariaExpanded?: boolean \| undefined; _ariaLabel?: string \| undefined; _ariaSelected?: boolean \| undefined; _on?: ButtonCallbacksPropType \| undefined; _type?: ButtonTypePropType \| undefined; _variant?: ButtonVariantPropType \| undefined; _customClass?: string \| undefined; _disabled?: boolean \| undefined; _hideLabel?: boolean \| undefined; _icons?: IconsPropType \| undefined; _id?: string \| undefined; _name?: string \| undefined; _syncValueBySelector?: string \| undefined; _tooltipAlign?: AlignPropType \| undefined; }` | `undefined` | -| `_step` | `_step` | Defines the step size for value changes. | `number \| undefined` | `undefined` | -| `_suggestions` | `_suggestions` | Suggestions to provide for the input. | `W3CInputValue[] \| string \| undefined` | `undefined` | -| `_tabIndex` | `_tab-index` | Defines which tab-index the primary element of the component has. (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'` | -| `_touched` | `_touched` | Shows if the input was touched by a user. | `boolean \| undefined` | `false` | -| `_type` | `_type` | **[DEPRECATED]** Das W3C hat die Date-Typen in eine eigene Gruppe zusammengefasst. Verwende hierfür die InputDate-Komponente.

Deprecated: Defines either the type of the component or of the components interactive element. | `"date" \| "datetime-local" \| "month" \| "number" \| "time" \| "week" \| undefined` | `'number'` | -| `_value` | `_value` | Defines the value of the input. | ``${number}-${number}-${number}T${number}:${number}:${number}` \| `${number}-${number}-${number}T${number}:${number}` \| `${number}-${number}-${number}` \| `${number}-${number}` \| `${number}-W${number}` \| `${number}:${number}:${number}` \| `${number}:${number}` \| null \| number \| undefined` | `undefined` | +| Property | Attribute | Description | Type | Default | +| --------------- | ---------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------ | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ----------- | +| `_accessKey` | `_access-key` | Defines which key combination can be used to trigger or focus the interactive element of the component. | `string \| undefined` | `undefined` | +| `_alert` | `_alert` | Defines whether the screen-readers should read out the notification. | `boolean \| undefined` | `true` | +| `_autoComplete` | `_auto-complete` | Defines whether the input can be auto-completed. | `"off" \| "on" \| undefined` | `undefined` | +| `_disabled` | `_disabled` | Makes the element not focusable and ignore all events. | `boolean \| undefined` | `false` | +| `_error` | `_error` | Defines the error message text. | `string \| undefined` | `undefined` | +| `_hideError` | `_hide-error` | Hides the error message but leaves it in the DOM for the input's aria-describedby. | `boolean \| undefined` | `false` | +| `_hideLabel` | `_hide-label` | Hides the caption by default and displays the caption text with a tooltip when the interactive element is focused or the mouse is over it. | `boolean \| undefined` | `false` | +| `_hint` | `_hint` | Defines the hint text. | `string \| undefined` | `''` | +| `_icons` | `_icons` | Defines the icon classnames (e.g. `_icons="fa-solid fa-user"`). | `string \| undefined \| { right?: IconOrIconClass \| undefined; left?: IconOrIconClass \| undefined; }` | `undefined` | +| `_id` | `_id` | Defines the internal ID of the primary component element. | `string \| undefined` | `undefined` | +| `_label` | `_label` | Defines the visible or semantic label of the component (e.g. aria-label, label, headline, caption, summary, etc.). Set to `false` to enable the expert slot. | `string \| undefined` | `undefined` | +| `_max` | `_max` | Defines the largest possible input value. | ``${number}-${number}-${number}T${number}:${number}:${number}` \| `${number}-${number}-${number}T${number}:${number}` \| `${number}-${number}-${number}` \| `${number}-${number}` \| `${number}-W${number}` \| `${number}:${number}:${number}` \| `${number}:${number}` \| number \| undefined` | `undefined` | +| `_min` | `_min` | Defines the smallest possible input value. | ``${number}-${number}-${number}T${number}:${number}:${number}` \| `${number}-${number}-${number}T${number}:${number}` \| `${number}-${number}-${number}` \| `${number}-${number}` \| `${number}-W${number}` \| `${number}:${number}:${number}` \| `${number}:${number}` \| number \| undefined` | `undefined` | +| `_name` | `_name` | Defines the technical name of an input field. | `string \| undefined` | `undefined` | +| `_on` | -- | Gibt die EventCallback-Funktionen für das Input-Event an. | `InputTypeOnBlur & InputTypeOnClick & InputTypeOnChange & InputTypeOnFocus \| undefined` | `undefined` | +| `_placeholder` | `_placeholder` | Defines the placeholder for input field. To be shown when there's no value. | `string \| undefined` | `undefined` | +| `_readOnly` | `_read-only` | Makes the input element read only. | `boolean \| undefined` | `false` | +| `_required` | `_required` | Makes the input element required. | `boolean \| undefined` | `false` | +| `_smartButton` | `_smart-button` | Allows to add a button with an arbitrary action within the element (\_hide-label only). | `string \| undefined \| { _label: string; } & { _tabIndex?: number \| undefined; _value?: Stringified; _role?: AlternativeButtonLinkRolePropType \| undefined; _ariaControls?: string \| undefined; _ariaExpanded?: boolean \| undefined; _ariaSelected?: boolean \| undefined; _on?: ButtonCallbacksPropType \| undefined; _type?: ButtonTypePropType \| undefined; _variant?: ButtonVariantPropType \| undefined; _customClass?: string \| undefined; _disabled?: boolean \| undefined; _hideLabel?: boolean \| undefined; _icons?: IconsPropType \| undefined; _id?: string \| undefined; _name?: string \| undefined; _syncValueBySelector?: string \| undefined; _tooltipAlign?: AlignPropType \| undefined; }` | `undefined` | +| `_step` | `_step` | Defines the step size for value changes. | `number \| undefined` | `undefined` | +| `_suggestions` | `_suggestions` | Suggestions to provide for the input. | `W3CInputValue[] \| string \| undefined` | `undefined` | +| `_tabIndex` | `_tab-index` | Defines which tab-index the primary element of the component has. (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'` | +| `_touched` | `_touched` | Shows if the input was touched by a user. | `boolean \| undefined` | `false` | +| `_value` | `_value` | Defines the value of the input. | ``${number}-${number}-${number}T${number}:${number}:${number}` \| `${number}-${number}-${number}T${number}:${number}` \| `${number}-${number}-${number}` \| `${number}-${number}` \| `${number}-W${number}` \| `${number}:${number}:${number}` \| `${number}:${number}` \| null \| number \| undefined` | `undefined` | ## Slots diff --git a/packages/components/src/components/input-password/readme.md b/packages/components/src/components/input-password/readme.md index e524f0874d..e2dd96f958 100644 --- a/packages/components/src/components/input-password/readme.md +++ b/packages/components/src/components/input-password/readme.md @@ -36,34 +36,32 @@ Der Input-Typ **Password** erzeugt ein Eingabefeld für Passwörter. Die Eingabe ## Properties -| Property | Attribute | Description | Type | Default | -| --------------- | ---------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------ | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ----------- | -| `_accessKey` | `_access-key` | Defines which key combination can be used to trigger or focus the interactive element of the component. | `string \| undefined` | `undefined` | -| `_alert` | `_alert` | Defines whether the screen-readers should read out the notification. | `boolean \| undefined` | `true` | -| `_autoComplete` | `_auto-complete` | Defines whether the input can be auto-completed. | `"off" \| "on" \| undefined` | `undefined` | -| `_disabled` | `_disabled` | Makes the element not focusable and ignore all events. | `boolean \| undefined` | `false` | -| `_error` | `_error` | Defines the error message text. | `string \| undefined` | `undefined` | -| `_hasCounter` | `_has-counter` | Shows the character count on the lower border of the input. | `boolean \| undefined` | `false` | -| `_hideError` | `_hide-error` | Hides the error message but leaves it in the DOM for the input's aria-describedby. | `boolean \| undefined` | `false` | -| `_hideLabel` | `_hide-label` | Hides the caption by default and displays the caption text with a tooltip when the interactive element is focused or the mouse is over it. | `boolean \| undefined` | `false` | -| `_hint` | `_hint` | Defines the hint text. | `string \| undefined` | `''` | -| `_icon` | `_icon` | **[DEPRECATED]** Use \_icons.

| `string \| undefined \| { right?: IconOrIconClass \| undefined; left?: IconOrIconClass \| undefined; }` | `undefined` | -| `_icons` | `_icons` | Defines the icon classnames (e.g. `_icons="fa-solid fa-user"`). | `string \| undefined \| { right?: IconOrIconClass \| undefined; left?: IconOrIconClass \| undefined; }` | `undefined` | -| `_id` | `_id` | Defines the internal ID of the primary component element. | `string \| undefined` | `undefined` | -| `_label` | `_label` | Defines the visible or semantic label of the component (e.g. aria-label, label, headline, caption, summary, etc.). Set to `false` to enable the expert slot. | `string \| undefined` | `undefined` | -| `_maxLength` | `_max-length` | Defines the maximum number of input characters. | `number \| undefined` | `undefined` | -| `_name` | `_name` | Defines the technical name of an input field. | `string \| undefined` | `undefined` | -| `_on` | -- | Gibt die EventCallback-Funktionen für das Input-Event an. | `InputTypeOnBlur & InputTypeOnClick & InputTypeOnChange & InputTypeOnFocus \| undefined` | `undefined` | -| `_pattern` | `_pattern` | Defines a validation pattern for the input field. | `string \| undefined` | `undefined` | -| `_placeholder` | `_placeholder` | Defines the placeholder for input field. To be shown when there's no value. | `string \| undefined` | `undefined` | -| `_readOnly` | `_read-only` | Makes the input element read only. | `boolean \| undefined` | `false` | -| `_required` | `_required` | Makes the input element required. | `boolean \| undefined` | `false` | -| `_size` | `_size` | Setzt die Breite des Eingabefeldes in Buchstabenbreiten. | `number \| undefined` | `undefined` | -| `_smartButton` | `_smart-button` | Allows to add a button with an arbitrary action within the element (\_hide-label only). | `string \| undefined \| { _label: string; } & { _tabIndex?: number \| undefined; _value?: Stringified; _accessKey?: string \| undefined; _iconAlign?: AlignPropType \| undefined; _iconOnly?: boolean \| undefined; _icon?: IconsPropType \| undefined; _role?: AlternativeButtonLinkRolePropType \| undefined; _ariaControls?: string \| undefined; _ariaCurrent?: AriaCurrentPropType \| undefined; _ariaExpanded?: boolean \| undefined; _ariaLabel?: string \| undefined; _ariaSelected?: boolean \| undefined; _on?: ButtonCallbacksPropType \| undefined; _type?: ButtonTypePropType \| undefined; _variant?: ButtonVariantPropType \| undefined; _customClass?: string \| undefined; _disabled?: boolean \| undefined; _hideLabel?: boolean \| undefined; _icons?: IconsPropType \| undefined; _id?: string \| undefined; _name?: string \| undefined; _syncValueBySelector?: string \| undefined; _tooltipAlign?: AlignPropType \| undefined; }` | `undefined` | -| `_tabIndex` | `_tab-index` | Defines which tab-index the primary element of the component has. (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'` | -| `_touched` | `_touched` | Shows if the input was touched by a user. | `boolean \| undefined` | `false` | -| `_value` | `_value` | Defines the value of the input. | `string \| undefined` | `undefined` | +| Property | Attribute | Description | Type | Default | +| --------------- | ---------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------ | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ----------- | +| `_accessKey` | `_access-key` | Defines which key combination can be used to trigger or focus the interactive element of the component. | `string \| undefined` | `undefined` | +| `_alert` | `_alert` | Defines whether the screen-readers should read out the notification. | `boolean \| undefined` | `true` | +| `_autoComplete` | `_auto-complete` | Defines whether the input can be auto-completed. | `"off" \| "on" \| undefined` | `undefined` | +| `_disabled` | `_disabled` | Makes the element not focusable and ignore all events. | `boolean \| undefined` | `false` | +| `_error` | `_error` | Defines the error message text. | `string \| undefined` | `undefined` | +| `_hasCounter` | `_has-counter` | Shows the character count on the lower border of the input. | `boolean \| undefined` | `false` | +| `_hideError` | `_hide-error` | Hides the error message but leaves it in the DOM for the input's aria-describedby. | `boolean \| undefined` | `false` | +| `_hideLabel` | `_hide-label` | Hides the caption by default and displays the caption text with a tooltip when the interactive element is focused or the mouse is over it. | `boolean \| undefined` | `false` | +| `_hint` | `_hint` | Defines the hint text. | `string \| undefined` | `''` | +| `_icons` | `_icons` | Defines the icon classnames (e.g. `_icons="fa-solid fa-user"`). | `string \| undefined \| { right?: IconOrIconClass \| undefined; left?: IconOrIconClass \| undefined; }` | `undefined` | +| `_id` | `_id` | Defines the internal ID of the primary component element. | `string \| undefined` | `undefined` | +| `_label` | `_label` | Defines the visible or semantic label of the component (e.g. aria-label, label, headline, caption, summary, etc.). Set to `false` to enable the expert slot. | `string \| undefined` | `undefined` | +| `_maxLength` | `_max-length` | Defines the maximum number of input characters. | `number \| undefined` | `undefined` | +| `_name` | `_name` | Defines the technical name of an input field. | `string \| undefined` | `undefined` | +| `_on` | -- | Gibt die EventCallback-Funktionen für das Input-Event an. | `InputTypeOnBlur & InputTypeOnClick & InputTypeOnChange & InputTypeOnFocus \| undefined` | `undefined` | +| `_pattern` | `_pattern` | Defines a validation pattern for the input field. | `string \| undefined` | `undefined` | +| `_placeholder` | `_placeholder` | Defines the placeholder for input field. To be shown when there's no value. | `string \| undefined` | `undefined` | +| `_readOnly` | `_read-only` | Makes the input element read only. | `boolean \| undefined` | `false` | +| `_required` | `_required` | Makes the input element required. | `boolean \| undefined` | `false` | +| `_smartButton` | `_smart-button` | Allows to add a button with an arbitrary action within the element (\_hide-label only). | `string \| undefined \| { _label: string; } & { _tabIndex?: number \| undefined; _value?: Stringified; _role?: AlternativeButtonLinkRolePropType \| undefined; _ariaControls?: string \| undefined; _ariaExpanded?: boolean \| undefined; _ariaSelected?: boolean \| undefined; _on?: ButtonCallbacksPropType \| undefined; _type?: ButtonTypePropType \| undefined; _variant?: ButtonVariantPropType \| undefined; _customClass?: string \| undefined; _disabled?: boolean \| undefined; _hideLabel?: boolean \| undefined; _icons?: IconsPropType \| undefined; _id?: string \| undefined; _name?: string \| undefined; _syncValueBySelector?: string \| undefined; _tooltipAlign?: AlignPropType \| undefined; }` | `undefined` | +| `_tabIndex` | `_tab-index` | Defines which tab-index the primary element of the component has. (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'` | +| `_touched` | `_touched` | Shows if the input was touched by a user. | `boolean \| undefined` | `false` | +| `_value` | `_value` | Defines the value of the input. | `string \| undefined` | `undefined` | ## Slots diff --git a/packages/components/src/components/input-radio/readme.md b/packages/components/src/components/input-radio/readme.md index 2daaa6f481..54d11e09c2 100644 --- a/packages/components/src/components/input-radio/readme.md +++ b/packages/components/src/components/input-radio/readme.md @@ -87,7 +87,6 @@ Dem EventHandler werden zwei Parameter übergeben, das ursprüngliche Event und | `_hint` | `_hint` | Defines the hint text. | `string \| undefined` | `''` | | `_id` | `_id` | Defines the internal ID of the primary component element. | `string \| undefined` | `undefined` | | `_label` | `_label` | Defines the visible or semantic label of the component (e.g. aria-label, label, headline, caption, summary, etc.). Set to `false` to enable the expert slot. | `string \| undefined` | `undefined` | -| `_list` | `_list` | **[DEPRECATED]** Use \_options.

Deprecated: Gibt die Liste der Optionen für das Eingabefeld an. | `Option[] \| string \| undefined` | `undefined` | | `_name` | `_name` | Defines the technical name of an input field. | `string \| undefined` | `undefined` | | `_on` | -- | Gibt die EventCallback-Funktionen für das Input-Event an. | `InputTypeOnBlur & InputTypeOnClick & InputTypeOnChange & InputTypeOnFocus \| undefined` | `undefined` | | `_options` | `_options` | Options the user can choose from. | `Option[] \| string \| undefined` | `undefined` | @@ -106,10 +105,6 @@ Dem EventHandler werden zwei Parameter übergeben, das ursprüngliche Event und ## Dependencies -### Used by - -- [kol-input-radio-group](../input-radio-group) - ### Depends on - kol-input @@ -133,7 +128,6 @@ graph TD; kol-alert-wc --> kol-heading-wc kol-alert-wc --> kol-button-wc kol-alert-wc --> kol-icon - kol-input-radio-group --> kol-input-radio style kol-input-radio fill:#f9f,stroke:#333,stroke-width:4px ``` diff --git a/packages/components/src/components/input-range/readme.md b/packages/components/src/components/input-range/readme.md index 81cd999f93..d7ca129217 100644 --- a/packages/components/src/components/input-range/readme.md +++ b/packages/components/src/components/input-range/readme.md @@ -60,11 +60,9 @@ Der Input-Typ **Range** erzeugt ein interaktives Element, mit dem Werte durch Ve | `_hideError` | `_hide-error` | Hides the error message but leaves it in the DOM for the input's aria-describedby. | `boolean \| undefined` | `false` | | `_hideLabel` | `_hide-label` | Hides the caption by default and displays the caption text with a tooltip when the interactive element is focused or the mouse is over it. | `boolean \| undefined` | `false` | | `_hint` | `_hint` | Defines the hint text. | `string \| undefined` | `''` | -| `_icon` | `_icon` | **[DEPRECATED]** Use \_icons.

| `string \| undefined \| { right?: IconOrIconClass \| undefined; left?: IconOrIconClass \| undefined; }` | `undefined` | | `_icons` | `_icons` | Defines the icon classnames (e.g. `_icons="fa-solid fa-user"`). | `string \| undefined \| { right?: IconOrIconClass \| undefined; left?: IconOrIconClass \| undefined; }` | `undefined` | | `_id` | `_id` | Defines the internal ID of the primary component element. | `string \| undefined` | `undefined` | | `_label` | `_label` | Defines the visible or semantic label of the component (e.g. aria-label, label, headline, caption, summary, etc.). Set to `false` to enable the expert slot. | `string \| undefined` | `undefined` | -| `_list` | `_list` | **[DEPRECATED]** Use \_suggestions.

Deprecated: Gibt die Liste der Vorschlagswörter an. | `Option[] \| string \| undefined` | `undefined` | | `_max` | `_max` | Defines the largest possible input value. | `number \| undefined` | `undefined` | | `_min` | `_min` | Defines the smallest possible input value. | `number \| undefined` | `undefined` | | `_name` | `_name` | Defines the technical name of an input field. | `string \| undefined` | `undefined` | diff --git a/packages/components/src/components/input-text/readme.md b/packages/components/src/components/input-text/readme.md index be8c8d4760..ed2e388a01 100644 --- a/packages/components/src/components/input-text/readme.md +++ b/packages/components/src/components/input-text/readme.md @@ -55,37 +55,34 @@ Der Input-Typ **Text** erzeugt ein Eingabefeld für normalen Text, Suchbegriffe, ## Properties -| Property | Attribute | Description | Type | Default | -| --------------- | ---------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------ | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ----------- | -| `_accessKey` | `_access-key` | Defines which key combination can be used to trigger or focus the interactive element of the component. | `string \| undefined` | `undefined` | -| `_alert` | `_alert` | Defines whether the screen-readers should read out the notification. | `boolean \| undefined` | `true` | -| `_autoComplete` | `_auto-complete` | Defines whether the input can be auto-completed. | `"off" \| "on" \| undefined` | `undefined` | -| `_disabled` | `_disabled` | Makes the element not focusable and ignore all events. | `boolean \| undefined` | `false` | -| `_error` | `_error` | Defines the error message text. | `string \| undefined` | `undefined` | -| `_hasCounter` | `_has-counter` | Shows the character count on the lower border of the input. | `boolean \| undefined` | `false` | -| `_hideError` | `_hide-error` | Hides the error message but leaves it in the DOM for the input's aria-describedby. | `boolean \| undefined` | `false` | -| `_hideLabel` | `_hide-label` | Hides the caption by default and displays the caption text with a tooltip when the interactive element is focused or the mouse is over it. | `boolean \| undefined` | `false` | -| `_hint` | `_hint` | Defines the hint text. | `string \| undefined` | `''` | -| `_icon` | `_icon` | **[DEPRECATED]** Use \_icons.

| `string \| undefined \| { right?: IconOrIconClass \| undefined; left?: IconOrIconClass \| undefined; }` | `undefined` | -| `_icons` | `_icons` | Defines the icon classnames (e.g. `_icons="fa-solid fa-user"`). | `string \| undefined \| { right?: IconOrIconClass \| undefined; left?: IconOrIconClass \| undefined; }` | `undefined` | -| `_id` | `_id` | Defines the internal ID of the primary component element. | `string \| undefined` | `undefined` | -| `_label` | `_label` | Defines the visible or semantic label of the component (e.g. aria-label, label, headline, caption, summary, etc.). Set to `false` to enable the expert slot. | `string \| undefined` | `undefined` | -| `_list` | `_list` | **[DEPRECATED]** Use \_suggestions.

Deprecated: Gibt die Liste der Vorschlagswörter an. | `string \| string[] \| undefined` | `undefined` | -| `_maxLength` | `_max-length` | Defines the maximum number of input characters. | `number \| undefined` | `undefined` | -| `_name` | `_name` | Defines the technical name of an input field. | `string \| undefined` | `undefined` | -| `_on` | -- | Gibt die EventCallback-Funktionen für das Input-Event an. | `InputTypeOnBlur & InputTypeOnClick & InputTypeOnChange & InputTypeOnFocus \| undefined` | `undefined` | -| `_pattern` | `_pattern` | Defines a validation pattern for the input field. | `string \| undefined` | `undefined` | -| `_placeholder` | `_placeholder` | Defines the placeholder for input field. To be shown when there's no value. | `string \| undefined` | `undefined` | -| `_readOnly` | `_read-only` | Makes the input element read only. | `boolean \| undefined` | `false` | -| `_required` | `_required` | Makes the input element required. | `boolean \| undefined` | `false` | -| `_size` | `_size` | Setzt die Breite des Eingabefeldes in Buchstabenbreiten. | `number \| undefined` | `undefined` | -| `_smartButton` | `_smart-button` | Allows to add a button with an arbitrary action within the element (\_hide-label only). | `string \| undefined \| { _label: string; } & { _tabIndex?: number \| undefined; _value?: Stringified; _accessKey?: string \| undefined; _iconAlign?: AlignPropType \| undefined; _iconOnly?: boolean \| undefined; _icon?: IconsPropType \| undefined; _role?: AlternativeButtonLinkRolePropType \| undefined; _ariaControls?: string \| undefined; _ariaCurrent?: AriaCurrentPropType \| undefined; _ariaExpanded?: boolean \| undefined; _ariaLabel?: string \| undefined; _ariaSelected?: boolean \| undefined; _on?: ButtonCallbacksPropType \| undefined; _type?: ButtonTypePropType \| undefined; _variant?: ButtonVariantPropType \| undefined; _customClass?: string \| undefined; _disabled?: boolean \| undefined; _hideLabel?: boolean \| undefined; _icons?: IconsPropType \| undefined; _id?: string \| undefined; _name?: string \| undefined; _syncValueBySelector?: string \| undefined; _tooltipAlign?: AlignPropType \| undefined; }` | `undefined` | -| `_suggestions` | `_suggestions` | Suggestions to provide for the input. | `W3CInputValue[] \| string \| undefined` | `undefined` | -| `_tabIndex` | `_tab-index` | Defines which tab-index the primary element of the component has. (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'` | -| `_touched` | `_touched` | Shows if the input was touched by a user. | `boolean \| undefined` | `false` | -| `_type` | `_type` | Defines either the type of the component or of the components interactive element. | `"search" \| "tel" \| "text" \| "url" \| undefined` | `'text'` | -| `_value` | `_value` | Defines the value of the input. | `string \| undefined` | `undefined` | +| Property | Attribute | Description | Type | Default | +| --------------- | ---------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------ | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ----------- | +| `_accessKey` | `_access-key` | Defines which key combination can be used to trigger or focus the interactive element of the component. | `string \| undefined` | `undefined` | +| `_alert` | `_alert` | Defines whether the screen-readers should read out the notification. | `boolean \| undefined` | `true` | +| `_autoComplete` | `_auto-complete` | Defines whether the input can be auto-completed. | `"off" \| "on" \| undefined` | `undefined` | +| `_disabled` | `_disabled` | Makes the element not focusable and ignore all events. | `boolean \| undefined` | `false` | +| `_error` | `_error` | Defines the error message text. | `string \| undefined` | `undefined` | +| `_hasCounter` | `_has-counter` | Shows the character count on the lower border of the input. | `boolean \| undefined` | `false` | +| `_hideError` | `_hide-error` | Hides the error message but leaves it in the DOM for the input's aria-describedby. | `boolean \| undefined` | `false` | +| `_hideLabel` | `_hide-label` | Hides the caption by default and displays the caption text with a tooltip when the interactive element is focused or the mouse is over it. | `boolean \| undefined` | `false` | +| `_hint` | `_hint` | Defines the hint text. | `string \| undefined` | `''` | +| `_icons` | `_icons` | Defines the icon classnames (e.g. `_icons="fa-solid fa-user"`). | `string \| undefined \| { right?: IconOrIconClass \| undefined; left?: IconOrIconClass \| undefined; }` | `undefined` | +| `_id` | `_id` | Defines the internal ID of the primary component element. | `string \| undefined` | `undefined` | +| `_label` | `_label` | Defines the visible or semantic label of the component (e.g. aria-label, label, headline, caption, summary, etc.). Set to `false` to enable the expert slot. | `string \| undefined` | `undefined` | +| `_maxLength` | `_max-length` | Defines the maximum number of input characters. | `number \| undefined` | `undefined` | +| `_name` | `_name` | Defines the technical name of an input field. | `string \| undefined` | `undefined` | +| `_on` | -- | Gibt die EventCallback-Funktionen für das Input-Event an. | `InputTypeOnBlur & InputTypeOnClick & InputTypeOnChange & InputTypeOnFocus \| undefined` | `undefined` | +| `_pattern` | `_pattern` | Defines a validation pattern for the input field. | `string \| undefined` | `undefined` | +| `_placeholder` | `_placeholder` | Defines the placeholder for input field. To be shown when there's no value. | `string \| undefined` | `undefined` | +| `_readOnly` | `_read-only` | Makes the input element read only. | `boolean \| undefined` | `false` | +| `_required` | `_required` | Makes the input element required. | `boolean \| undefined` | `false` | +| `_smartButton` | `_smart-button` | Allows to add a button with an arbitrary action within the element (\_hide-label only). | `string \| undefined \| { _label: string; } & { _tabIndex?: number \| undefined; _value?: Stringified; _role?: AlternativeButtonLinkRolePropType \| undefined; _ariaControls?: string \| undefined; _ariaExpanded?: boolean \| undefined; _ariaSelected?: boolean \| undefined; _on?: ButtonCallbacksPropType \| undefined; _type?: ButtonTypePropType \| undefined; _variant?: ButtonVariantPropType \| undefined; _customClass?: string \| undefined; _disabled?: boolean \| undefined; _hideLabel?: boolean \| undefined; _icons?: IconsPropType \| undefined; _id?: string \| undefined; _name?: string \| undefined; _syncValueBySelector?: string \| undefined; _tooltipAlign?: AlignPropType \| undefined; }` | `undefined` | +| `_suggestions` | `_suggestions` | Suggestions to provide for the input. | `W3CInputValue[] \| string \| undefined` | `undefined` | +| `_tabIndex` | `_tab-index` | Defines which tab-index the primary element of the component has. (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'` | +| `_touched` | `_touched` | Shows if the input was touched by a user. | `boolean \| undefined` | `false` | +| `_type` | `_type` | Defines either the type of the component or of the components interactive element. | `"search" \| "tel" \| "text" \| "url" \| undefined` | `'text'` | +| `_value` | `_value` | Defines the value of the input. | `string \| undefined` | `undefined` | ## Slots diff --git a/packages/components/src/components/kolibri/readme.md b/packages/components/src/components/kolibri/readme.md index 6c887c5a64..a1638b5fab 100644 --- a/packages/components/src/components/kolibri/readme.md +++ b/packages/components/src/components/kolibri/readme.md @@ -26,10 +26,10 @@ Diese Komponente implementiert das Logo von KoliBri. ## Properties -| Property | Attribute | Description | Type | Default | -| ---------- | ---------- | ------------------------------------------------------------------------ | -------------------------------------------------------------------------------------------------------------------------------------------------------- | ----------- | -| `_animate` | `_animate` | Gibt an, ob das Bild-Logo farblich animiert werden soll. | `boolean \| undefined` | `false` | -| `_color` | `_color` | Gibt an, in welcher Farbe das Bild-Logo initial dargestellt werden soll. | `string \| undefined \| { backgroundColor: string; color: string; } \| { backgroundColor: string; foregroundColor: Stringified; }` | `'#003c78'` | -| `_labeled` | `_labeled` | Defines whether the component has a label. | `boolean \| undefined` | `undefined` | +| Property | Attribute | Description | Type | Default | +| ---------- | ---------- | ------------------------------------------------------------------------ | --------------------------------------------------------------------------------------------------------- | ----------- | +| `_animate` | `_animate` | Gibt an, ob das Bild-Logo farblich animiert werden soll. | `boolean \| undefined` | `false` | +| `_color` | `_color` | Gibt an, in welcher Farbe das Bild-Logo initial dargestellt werden soll. | `string \| undefined \| { backgroundColor: string; foregroundColor: Stringified; }` | `'#003c78'` | +| `_labeled` | `_labeled` | Defines whether the component has a label. | `boolean \| undefined` | `undefined` | --- diff --git a/packages/components/src/components/link-button/readme.md b/packages/components/src/components/link-button/readme.md index e3578567f8..c2265026a0 100644 --- a/packages/components/src/components/link-button/readme.md +++ b/packages/components/src/components/link-button/readme.md @@ -29,29 +29,22 @@ Weitere Informationen zum Aussehen finden Sie auf der **[DEPRECATED]** will be removed in v2

Deprecated: Defines which elements are controlled by this component. (https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-controls) | `string \| undefined` | `undefined` | -| `_ariaCurrent` | `_aria-current` | **[DEPRECATED]** use \_listen-aria-current instead

Deprecated: Marks the element as the selected in a group of related elements. Can be one of the following: `date` \| `location` \| `page` \| `step` \| `time` \| `true`. (https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-current) | `"date" \| "location" \| "page" \| "step" \| "time" \| boolean \| undefined` | `undefined` | -| `_ariaExpanded` | `_aria-expanded` | **[DEPRECATED]** will be removed in v2

Deprecated: Defines whether the interactive element of the component expanded something. (https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-expanded) | `boolean \| undefined` | `undefined` | -| `_ariaLabel` | `_aria-label` | **[DEPRECATED]** use \_label instead

Deprecated: Setzt die semantische Beschriftung der Komponente. | `string \| undefined` | `undefined` | -| `_ariaSelected` | `_aria-selected` | **[DEPRECATED]** will be removed in v2

Deprecated: Defines whether the interactive element of the component is selected (e.g. role=tab). (https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-selected) | `boolean \| undefined` | `undefined` | -| `_customClass` | `_custom-class` | Defines the custom class attribute if \_variant="custom" is set. | `string \| undefined` | `undefined` | -| `_disabled` | `_disabled` | **[DEPRECATED]** Ein Link kann nicht deaktiviert werden, nutzen Sie den Button-Link stattdessen.

Deprecated: Makes the element not focusable and ignore all events. | `boolean \| undefined` | `false` | -| `_download` | `_download` | Tells the browser that the link contains a file. Optionally sets the filename. | `string \| undefined` | `undefined` | -| `_hideLabel` | `_hide-label` | Hides the caption by default and displays the caption text with a tooltip when the interactive element is focused or the mouse is over it. | `boolean \| undefined` | `false` | -| `_href` _(required)_ | `_href` | Defines the target URI of the link. | `string` | `undefined` | -| `_icon` | `_icon` | Defines the icon classnames (e.g. `_icons="fa-solid fa-user"`). | `KoliBriHorizontalIcons & KoliBriVerticalIcons \| string \| undefined` | `undefined` | -| `_iconOnly` | `_icon-only` | **[DEPRECATED]** use \_hide-label

Deprecated: Hides the label and shows the description in a Tooltip instead. | `boolean \| undefined` | `undefined` | -| `_label` _(required)_ | `_label` | Defines the visible or semantic label of the component (e.g. aria-label, label, headline, caption, summary, etc.). Set to `false` to enable the expert slot. | `string` | `undefined` | -| `_listenAriaCurrent` | `_listen-aria-current` | Listen on a aria-current event with this value. If the value matches the current value and the href is the same as the current url, the aria-current attribute will be set to current value. | `"date" \| "location" \| "page" \| "step" \| "time" \| boolean \| undefined` | `undefined` | -| `_on` | -- | Defines the callback functions for links. | `undefined \| { onClick?: EventValueOrEventCallback \| undefined; }` | `undefined` | -| `_role` | `_role` | Defines the role of the components primary element. | `"button" \| "link" \| "tab" \| undefined` | `undefined` | -| `_tabIndex` | `_tab-index` | Defines which tab-index the primary element of the component has. (https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/tabindex) | `number \| undefined` | `undefined` | -| `_target` | `_target` | Defines where to open the link. | `string \| undefined` | `undefined` | -| `_targetDescription` | `_target-description` | Defines the description to use when the link is going to be opened in another application. | `string \| undefined` | `translate('kol-open-link-in-tab')` | -| `_tooltipAlign` | `_tooltip-align` | Defines where to show the Tooltip preferably: top, right, bottom or left. | `"bottom" \| "left" \| "right" \| "top" \| undefined` | `'right'` | -| `_variant` | `_variant` | Defines which variant should be used for presentation. | `"custom" \| "danger" \| "ghost" \| "normal" \| "primary" \| "secondary" \| "tertiary" \| undefined` | `'normal'` | +| Property | Attribute | Description | Type | Default | +| --------------------- | ---------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ---------------------------------------------------------------------------------------------------- | ----------------------------------- | +| `_customClass` | `_custom-class` | Defines the custom class attribute if \_variant="custom" is set. | `string \| undefined` | `undefined` | +| `_download` | `_download` | Tells the browser that the link contains a file. Optionally sets the filename. | `string \| undefined` | `undefined` | +| `_hideLabel` | `_hide-label` | Hides the caption by default and displays the caption text with a tooltip when the interactive element is focused or the mouse is over it. | `boolean \| undefined` | `false` | +| `_href` _(required)_ | `_href` | Defines the target URI of the link. | `string` | `undefined` | +| `_icons` | `_icons` | Defines the icon classnames (e.g. `_icons="fa-solid fa-user"`). | `KoliBriHorizontalIcons & KoliBriVerticalIcons \| string \| undefined` | `undefined` | +| `_label` _(required)_ | `_label` | Defines the visible or semantic label of the component (e.g. aria-label, label, headline, caption, summary, etc.). Set to `false` to enable the expert slot. | `string` | `undefined` | +| `_listenAriaCurrent` | `_listen-aria-current` | Listen on an aria-current event with this value. If the value matches the current value and the href is the same as the current url, the aria-current attribute will be set to current value. | `"date" \| "location" \| "page" \| "step" \| "time" \| boolean \| undefined` | `undefined` | +| `_on` | -- | Defines the callback functions for links. | `undefined \| { onClick?: EventValueOrEventCallback \| undefined; }` | `undefined` | +| `_role` | `_role` | Defines the role of the components primary element. | `"button" \| "link" \| "tab" \| undefined` | `undefined` | +| `_tabIndex` | `_tab-index` | Defines which tab-index the primary element of the component has. (https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/tabindex) | `number \| undefined` | `undefined` | +| `_target` | `_target` | Defines where to open the link. | `string \| undefined` | `undefined` | +| `_targetDescription` | `_target-description` | Defines the description to use when the link is going to be opened in another application. | `string \| undefined` | `translate('kol-open-link-in-tab')` | +| `_tooltipAlign` | `_tooltip-align` | Defines where to show the Tooltip preferably: top, right, bottom or left. | `"bottom" \| "left" \| "right" \| "top" \| undefined` | `'right'` | +| `_variant` | `_variant` | Defines which variant should be used for presentation. | `"custom" \| "danger" \| "ghost" \| "normal" \| "primary" \| "secondary" \| "tertiary" \| undefined` | `'normal'` | ## Dependencies diff --git a/packages/components/src/components/link-group/readme.md b/packages/components/src/components/link-group/readme.md index 61271b300d..728a7faab2 100644 --- a/packages/components/src/components/link-group/readme.md +++ b/packages/components/src/components/link-group/readme.md @@ -76,29 +76,23 @@ nemo, incidunt excepturi facilis, amet ducimus minus quae corporis eligendi cum ## Properties -| Property | Attribute | Description | Type | Default | -| --------------------- | ------------------ | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------ | -| `_ariaLabel` | `_aria-label` | **[DEPRECATED]** use \_label instead

Deprecated: Setzt die semantische Beschriftung der Komponente. | `string \| undefined` | `undefined` | -| `_heading` | `_heading` | **[DEPRECATED]** remove in the next major version

Deprecated: Gibt die optionale Überschrift zur Link-Gruppe an. | `string \| undefined` | `undefined` | -| `_label` | `_label` | Defines the visible or semantic label of the component (e.g. aria-label, label, headline, caption, summary, etc.). | `string \| undefined` | `undefined` | -| `_level` | `_level` | Defines which H-level from 1-6 the heading has. 0 specifies no heading and is shown as bold text. | `0 \| 1 \| 2 \| 3 \| 4 \| 5 \| 6 \| undefined` | `undefined` | -| `_links` _(required)_ | `_links` | Defines the list of links to render. | `LinkProps[] \| string` | `undefined` | -| `_listStyleType` | `_list-style-type` | Gibt den List-Style-Typen für ungeordnete Listen aus. Wird bei horizontalen LinkGroups als Trenner verwendet | `"circle" \| "decimal" \| "decimal-leading-zero" \| "disc" \| "lower-alpha" \| "lower-greek" \| "lower-latin" \| "lower-roman" \| "none" \| "square" \| "upper-alpha" \| "upper-latin" \| "upper-roman" \| undefined` | `undefined` | -| `_ordered` | `_ordered` | **[DEPRECATED]** Wird mittels der Property \_list-style-type automatisch gesteuert.

Deprecated: Gibt an, ob eine Ordered- oder eine Unordered-List verwendet werden soll. | `boolean \| undefined` | `false` | -| `_orientation` | `_orientation` | Defines whether the orientation of the component is horizontal or vertical. | `"horizontal" \| "vertical" \| undefined` | `'vertical'` | +| Property | Attribute | Description | Type | Default | +| --------------------- | ------------------ | ------------------------------------------------------------------------------------------------------------------ | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------ | +| `_label` _(required)_ | `_label` | Defines the visible or semantic label of the component (e.g. aria-label, label, headline, caption, summary, etc.). | `string` | `undefined` | +| `_links` _(required)_ | `_links` | Defines the list of links to render. | `LinkProps[] \| string` | `undefined` | +| `_listStyleType` | `_list-style-type` | Gibt den List-Style-Typen für ungeordnete Listen aus. Wird bei horizontalen LinkGroups als Trenner verwendet | `"circle" \| "decimal" \| "decimal-leading-zero" \| "disc" \| "lower-alpha" \| "lower-greek" \| "lower-latin" \| "lower-roman" \| "none" \| "square" \| "upper-alpha" \| "upper-latin" \| "upper-roman" \| undefined` | `undefined` | +| `_orientation` | `_orientation` | Defines whether the orientation of the component is horizontal or vertical. | `"horizontal" \| "vertical" \| undefined` | `'vertical'` | ## Dependencies ### Depends on -- [kol-heading-wc](../heading) - [kol-link](../link) ### Graph ```mermaid graph TD; - kol-link-group --> kol-heading-wc kol-link-group --> kol-link kol-link --> kol-link-wc kol-link-wc --> kol-span-wc diff --git a/packages/components/src/components/link/readme.md b/packages/components/src/components/link/readme.md index 1b334dd06e..68268da4e1 100644 --- a/packages/components/src/components/link/readme.md +++ b/packages/components/src/components/link/readme.md @@ -66,39 +66,26 @@ Eingabe von Leerzeichen eingefügt werden. Zusätzliche Leerzeichen vergrößern ## Properties -| Property | Attribute | Description | Type | Default | -| -------------------- | ---------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ----------------------------------------------------------------------------------- | ---------------------------------------------- | -| `_ariaControls` | `_aria-controls` | **[DEPRECATED]** will be removed in v2

Deprecated: Defines which elements are controlled by this component. (https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-controls) | `string \| undefined` | `undefined` | -| `_ariaCurrent` | `_aria-current` | **[DEPRECATED]** use \_listen-aria-current instead

Deprecated: Marks the element as the selected in a group of related elements. Can be one of the following: `date` \| `location` \| `page` \| `step` \| `time` \| `true`. (https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-current) | `"date" \| "location" \| "page" \| "step" \| "time" \| boolean \| undefined` | `undefined` | -| `_ariaExpanded` | `_aria-expanded` | **[DEPRECATED]** will be removed in v2

Deprecated: Defines whether the interactive element of the component expanded something. (https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-expanded) | `boolean \| undefined` | `undefined` | -| `_ariaLabel` | `_aria-label` | **[DEPRECATED]** use \_label instead

Deprecated: Setzt die semantische Beschriftung der Komponente. | `string \| undefined` | `undefined` | -| `_ariaSelected` | `_aria-selected` | **[DEPRECATED]** will be removed in v2

Deprecated: Defines whether the interactive element of the component is selected (e.g. role=tab). (https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-selected) | `boolean \| undefined` | `undefined` | -| `_disabled` | `_disabled` | **[DEPRECATED]** Ein Link kann nicht deaktiviert werden, nutzen Sie den Button-Link stattdessen.

Deprecated: Makes the element not focusable and ignore all events. | `boolean \| undefined` | `false` | -| `_download` | `_download` | Tells the browser that the link contains a file. Optionally sets the filename. | `string \| undefined` | `undefined` | -| `_hideLabel` | `_hide-label` | Hides the caption by default and displays the caption text with a tooltip when the interactive element is focused or the mouse is over it. | `boolean \| undefined` | `false` | -| `_href` _(required)_ | `_href` | Sets the target URI of the link or citation source. | `string` | `undefined` | -| `_icon` | `_icon` | **[DEPRECATED]** Use \_icons.

| `KoliBriHorizontalIcons & KoliBriVerticalIcons \| string \| undefined` | `undefined` | -| `_iconAlign` | `_icon-align` | **[DEPRECATED]** Wird durch das neue flexibleren Icon-Typ abgedeckt.

Deprecated: Defines where to show the Tooltip preferably: top, right, bottom or left. | `"bottom" \| "left" \| "right" \| "top" \| undefined` | `undefined` | -| `_iconOnly` | `_icon-only` | **[DEPRECATED]** use \_hide-label

Deprecated: Hides the label and shows the description in a Tooltip instead. | `boolean \| undefined` | `undefined` | -| `_icons` | `_icons` | Defines the icon classnames (e.g. `_icons="fa-solid fa-user"`). | `KoliBriHorizontalIcons & KoliBriVerticalIcons \| string \| undefined` | `undefined` | -| `_label` | `_label` | Defines the visible or semantic label of the component (e.g. aria-label, label, headline, caption, summary, etc.). Set to `false` to enable the expert slot. | `string \| undefined` | `undefined` | -| `_listenAriaCurrent` | `_listen-aria-current` | Listen on a aria-current event with this value. If the value matches the current value and the href is the same as the current url, the aria-current attribute will be set to current value. | `"date" \| "location" \| "page" \| "step" \| "time" \| boolean \| undefined` | `undefined` | -| `_on` | -- | Defines the callback functions for links. | `undefined \| { onClick?: EventValueOrEventCallback \| undefined; }` | `undefined` | -| `_role` | `_role` | Defines the role of the components primary element. | `"button" \| "link" \| "tab" \| undefined` | `undefined` | -| `_selector` | `_selector` | **[DEPRECATED]** will be removed in v2

Deprecated: Gibt die ID eines DOM-Elements, zu dem gesprungen werden soll, aus. | `string \| undefined` | `undefined` | -| `_stealth` | `_stealth` | **[DEPRECATED]** will be removed in v2

Deprecated: Gibt an, ob der Link nur beim Fokus sichtbar ist. | `boolean \| undefined` | `false` | -| `_tabIndex` | `_tab-index` | Defines which tab-index the primary element of the component has. (https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/tabindex) | `number \| undefined` | `undefined` | -| `_target` | `_target` | Defines where to open the link. | `string \| undefined` | `undefined` | -| `_targetDescription` | `_target-description` | Defines the description to use when the link is going to be opened in another application. | `string \| undefined` | `'Der Link wird in einem neuen Tab geöffnet.'` | -| `_tooltipAlign` | `_tooltip-align` | Defines where to show the Tooltip preferably: top, right, bottom or left. | `"bottom" \| "left" \| "right" \| "top" \| undefined` | `'right'` | -| `_useCase` | `_use-case` | **[DEPRECATED]** will be removed in v2

Deprecated: Gibt den Verwendungsfall des Links an. | `"image" \| "nav" \| "text" \| undefined` | `'text'` | +| Property | Attribute | Description | Type | Default | +| -------------------- | ---------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ----------------------------------------------------------------------------------- | ---------------------------------------------- | +| `_download` | `_download` | Tells the browser that the link contains a file. Optionally sets the filename. | `string \| undefined` | `undefined` | +| `_hideLabel` | `_hide-label` | Hides the caption by default and displays the caption text with a tooltip when the interactive element is focused or the mouse is over it. | `boolean \| undefined` | `false` | +| `_href` _(required)_ | `_href` | Sets the target URI of the link or citation source. | `string` | `undefined` | +| `_icons` | `_icons` | Defines the icon classnames (e.g. `_icons="fa-solid fa-user"`). | `KoliBriHorizontalIcons & KoliBriVerticalIcons \| string \| undefined` | `undefined` | +| `_label` | `_label` | Defines the visible or semantic label of the component (e.g. aria-label, label, headline, caption, summary, etc.). Set to `false` to enable the expert slot. | `string \| undefined` | `undefined` | +| `_listenAriaCurrent` | `_listen-aria-current` | Listen on an aria-current event with this value. If the value matches the current value and the href is the same as the current url, the aria-current attribute will be set to current value. | `"date" \| "location" \| "page" \| "step" \| "time" \| boolean \| undefined` | `undefined` | +| `_on` | -- | Defines the callback functions for links. | `undefined \| { onClick?: EventValueOrEventCallback \| undefined; }` | `undefined` | +| `_role` | `_role` | Defines the role of the components primary element. | `"button" \| "link" \| "tab" \| undefined` | `undefined` | +| `_tabIndex` | `_tab-index` | Defines which tab-index the primary element of the component has. (https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/tabindex) | `number \| undefined` | `undefined` | +| `_target` | `_target` | Defines where to open the link. | `string \| undefined` | `undefined` | +| `_targetDescription` | `_target-description` | Defines the description to use when the link is going to be opened in another application. | `string \| undefined` | `'Der Link wird in einem neuen Tab geöffnet.'` | +| `_tooltipAlign` | `_tooltip-align` | Defines where to show the Tooltip preferably: top, right, bottom or left. | `"bottom" \| "left" \| "right" \| "top" \| undefined` | `'right'` | ## Dependencies ### Used by - [kol-breadcrumb](../breadcrumb) -- [kol-input-adapter-leanup](../input-adapter-leanup) - [kol-link-group](../link-group) - [kol-quote](../quote) @@ -117,7 +104,6 @@ graph TD; kol-span-wc --> kol-icon kol-tooltip-wc --> kol-span-wc kol-breadcrumb --> kol-link - kol-input-adapter-leanup --> kol-link kol-link-group --> kol-link kol-quote --> kol-link style kol-link fill:#f9f,stroke:#333,stroke-width:4px diff --git a/packages/components/src/components/logo/readme.md b/packages/components/src/components/logo/readme.md index d4c3eea0cc..cf9613a39e 100644 --- a/packages/components/src/components/logo/readme.md +++ b/packages/components/src/components/logo/readme.md @@ -52,9 +52,8 @@ Das Attribut **`_org`** wird für die Definition des gewünschten Logos verwende ## Properties -| Property | Attribute | Description | Type | Default | -| ------------------- | --------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | -------------------------------------------------------------- | ----------- | -| `_abbr` | `_abbr` | **[DEPRECATED]** Verwende stattdessen das Property \_org.

Deprecated: Gibt die Abkürzung eines Ministeriums, eines Amts oder einer Bundesanstalt an. | `Bundesamt \| Bundesanstalt \| Bundesministerium \| undefined` | `undefined` | -| `_org` _(required)_ | `_org` | Gibt die Abkürzung eines Ministeriums, eines Amts oder einer Bundesanstalt an. | `Bundesamt \| Bundesanstalt \| Bundesministerium` | `undefined` | +| Property | Attribute | Description | Type | Default | +| ------------------- | --------- | ------------------------------------------------------------------------------ | ------------------------------------------------- | ----------- | +| `_org` _(required)_ | `_org` | Gibt die Abkürzung eines Ministeriums, eines Amts oder einer Bundesanstalt an. | `Bundesamt \| Bundesanstalt \| Bundesministerium` | `undefined` | --- diff --git a/packages/components/src/components/modal/readme.md b/packages/components/src/components/modal/readme.md index 39bade4268..a5c7c1d09d 100644 --- a/packages/components/src/components/modal/readme.md +++ b/packages/components/src/components/modal/readme.md @@ -106,13 +106,12 @@ Des Weiteren gibt es immer nur maximal ein aktives Modal, welches alle selektier ## Properties -| Property | Attribute | Description | Type | Default | -| ---------------- | ------------- | ------------------------------------------------------------------------------------------------------------------------------------------- | --------------------------------------------------------------- | ----------- | -| `_activeElement` | -- | Gibt die Referenz auf das auslösende HTML-Element an, wodurch das Modal geöffnet wurde. | `HTMLElement \| null \| undefined` | `undefined` | -| `_ariaLabel` | `_aria-label` | **[DEPRECATED]** use \_label instead

Deprecated: Setzt die semantische Beschriftung der Komponente. | `string \| undefined` | `undefined` | -| `_label` | `_label` | Defines the visible or semantic label of the component (e.g. aria-label, label, headline, caption, summary, etc.). | `string \| undefined` | `undefined` | -| `_on` | -- | Gibt die EventCallback-Function für das Schließen des Modals an. | `undefined \| { onClose?: EventCallback \| undefined; }` | `undefined` | -| `_width` | `_width` | Defines the width of the modal. (max-width: 100%) | `string \| undefined` | `'100%'` | +| Property | Attribute | Description | Type | Default | +| --------------------- | --------- | ------------------------------------------------------------------------------------------------------------------ | --------------------------------------------------------------- | ----------- | +| `_activeElement` | -- | Gibt die Referenz auf das auslösende HTML-Element an, wodurch das Modal geöffnet wurde. | `HTMLElement \| null \| undefined` | `undefined` | +| `_label` _(required)_ | `_label` | Defines the visible or semantic label of the component (e.g. aria-label, label, headline, caption, summary, etc.). | `string` | `undefined` | +| `_on` | -- | Gibt die EventCallback-Function für das Schließen des Modals an. | `undefined \| { onClose?: EventCallback \| undefined; }` | `undefined` | +| `_width` | `_width` | Defines the width of the modal. (max-width: 100%) | `string \| undefined` | `'100%'` | ## Slots diff --git a/packages/components/src/components/nav/readme.md b/packages/components/src/components/nav/readme.md index 2a5944cd24..9677be4dd4 100644 --- a/packages/components/src/components/nav/readme.md +++ b/packages/components/src/components/nav/readme.md @@ -98,18 +98,14 @@ Die Ausrichtung der Navigationsleiste kann mit dem Attribut **`_orientation`** u ## Properties -| Property | Attribute | Description | Type | Default | -| --------------------- | --------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | --------------------------------------------------------------- | ------------ | -| `_ariaCurrentValue` | `_aria-current-value` | Defines the value of aria-current to be used with the current context within the navigation. | `"date" \| "location" \| "page" \| "step" \| "time" \| boolean` | `false` | -| `_ariaLabel` | `_aria-label` | **[DEPRECATED]** use \_label instead

Deprecated: Setzt die semantische Beschriftung der Komponente. | `string \| undefined` | `undefined` | -| `_collapsible` | `_collapsible` | Defines if navigation nodes can be collapsed or not. Enabled by default. | `boolean \| undefined` | `true` | -| `_compact` | `_compact` | **[DEPRECATED]** Use \_hide-label

Deprecated: Gibt an, ob die Navigation kompakt angezeigt wird. | `boolean \| undefined` | `false` | -| `_hasCompactButton` | `_has-compact-button` | **[DEPRECATED]** Version 2

Deprecated: Gibt an, ob die Navigation eine zusätzliche Schaltfläche zum Aus- und Einklappen der Navigation anzeigen soll. | `boolean \| undefined` | `false` | -| `_hideLabel` | `_hide-label` | Hides the caption by default and displays the caption text with a tooltip when the interactive element is focused or the mouse is over it. | `boolean \| undefined` | `false` | -| `_label` | `_label` | Defines the visible or semantic label of the component (e.g. aria-label, label, headline, caption, summary, etc.). | `string \| undefined` | `undefined` | -| `_links` _(required)_ | `_links` | Defines the list of links, buttons or texts to render. | `ButtonOrLinkOrTextWithChildrenProps[] \| string` | `undefined` | -| `_orientation` | `_orientation` | Defines whether the orientation of the component is horizontal or vertical. | `"horizontal" \| "vertical" \| undefined` | `'vertical'` | -| `_variant` | `_variant` | **[DEPRECATED]** This property is deprecated and will be removed in the next major version.

Deprecated: Defines which variant should be used for presentation. | `"primary" \| "secondary" \| undefined` | `'primary'` | +| Property | Attribute | Description | Type | Default | +| --------------------- | --------------------- | ------------------------------------------------------------------------------------------------------------------------------------------ | --------------------------------------------------------------- | ------------ | +| `_ariaCurrentValue` | `_aria-current-value` | Defines the value of aria-current to be used with the current context within the navigation. | `"date" \| "location" \| "page" \| "step" \| "time" \| boolean` | `false` | +| `_collapsible` | `_collapsible` | Defines if navigation nodes can be collapsed or not. Enabled by default. | `boolean \| undefined` | `true` | +| `_hideLabel` | `_hide-label` | Hides the caption by default and displays the caption text with a tooltip when the interactive element is focused or the mouse is over it. | `boolean \| undefined` | `false` | +| `_label` _(required)_ | `_label` | Defines the visible or semantic label of the component (e.g. aria-label, label, headline, caption, summary, etc.). | `string` | `undefined` | +| `_links` _(required)_ | `_links` | Defines the list of links, buttons or texts to render. | `ButtonOrLinkOrTextWithChildrenProps[] \| string` | `undefined` | +| `_orientation` | `_orientation` | Defines whether the orientation of the component is horizontal or vertical. | `"horizontal" \| "vertical" \| undefined` | `'vertical'` | ## Dependencies @@ -117,7 +113,6 @@ Die Ausrichtung der Navigationsleiste kann mit dem Attribut **`_orientation`** u - kol-button-link-text-switch - kol-button-wc -- [kol-button](../button) ### Graph @@ -125,7 +120,6 @@ Die Ausrichtung der Navigationsleiste kann mit dem Attribut **`_orientation`** u graph TD; kol-nav --> kol-button-link-text-switch kol-nav --> kol-button-wc - kol-nav --> kol-button kol-button-link-text-switch --> kol-button-wc kol-button-link-text-switch --> kol-link-wc kol-button-link-text-switch --> kol-span-wc @@ -136,7 +130,6 @@ graph TD; kol-link-wc --> kol-span-wc kol-link-wc --> kol-icon kol-link-wc --> kol-tooltip-wc - kol-button --> kol-button-wc style kol-nav fill:#f9f,stroke:#333,stroke-width:4px ``` diff --git a/packages/components/src/components/pagination/readme.md b/packages/components/src/components/pagination/readme.md index 466ed7eba5..b0b222a28f 100644 --- a/packages/components/src/components/pagination/readme.md +++ b/packages/components/src/components/pagination/readme.md @@ -51,14 +51,13 @@ Klassische Anwendungsbereiche einer Paginierung sind z.B. Blog-ähnliche Inhalte | `_customClass` | `_custom-class` | Defines the custom class attribute if \_variant="custom" is set. | `string \| undefined` | `undefined` | | `_hasButtons` | `_has-buttons` | Defines which navigation buttons to render (first, last, next, previous buttons). | `boolean \| string \| undefined \| { first: boolean; last: boolean; next: boolean; previous: boolean; }` | `true` | | `_label` | `_label` | Defines the visible or semantic label of the component (e.g. aria-label, label, headline, caption, summary, etc.). | `string \| undefined` | `undefined` | -| `_max` | `_max` | Defines the maximum number of pages. | `number \| undefined` | `undefined` | +| `_max` _(required)_ | `_max` | Defines the maximum number of pages. | `number` | `undefined` | | `_on` _(required)_ | -- | Gibt an, auf welche Callback-Events reagiert werden. | `{ onChangePage?: EventValueOrEventCallback \| undefined; onChangePageSize?: EventValueOrEventCallback \| undefined; onClick?: EventValueOrEventCallback \| undefined; }` | `undefined` | | `_page` _(required)_ | `_page` | Defines the current page. | `number` | `undefined` | | `_pageSize` | `_page-size` | Defines the amount of entries to show per page. | `number` | `1` | | `_pageSizeOptions` | `_page-size-options` | Defines the options for the page-size-select. | `number[] \| string` | `[]` | | `_siblingCount` | `_sibling-count` | Defines the amount of pages to show next to the current page. | `number \| undefined` | `1` | | `_tooltipAlign` | `_tooltip-align` | Defines where to show the Tooltip preferably: top, right, bottom or left. | `"bottom" \| "left" \| "right" \| "top" \| undefined` | `'top'` | -| `_total` | `_total` | **[DEPRECATED]** Use \_max.

Setzt die Gesamtanzahl der Seiten. | `number \| undefined` | `undefined` | | `_variant` | `_variant` | Defines which variant should be used for presentation. | `"custom" \| "danger" \| "ghost" \| "normal" \| "primary" \| "secondary" \| "tertiary" \| undefined` | `'normal'` | ## Dependencies diff --git a/packages/components/src/components/progress/readme.md b/packages/components/src/components/progress/readme.md index 3fef4fdaa0..2c780f6b9a 100644 --- a/packages/components/src/components/progress/readme.md +++ b/packages/components/src/components/progress/readme.md @@ -44,13 +44,12 @@ Verwenden Sie das Attribut **`_value`**, um den aktuellen Wert der Komponente zu ## Properties -| Property | Attribute | Description | Type | Default | -| --------------------- | ---------- | ---------------------------------------------------------------------------------------------------------------------------------------------------- | ----------------------------------------------------------------------------- | ----------- | -| `_label` | `_label` | Defines the visible or semantic label of the component (e.g. aria-label, label, headline, caption, summary, etc.). | `string \| undefined` | `undefined` | -| `_max` _(required)_ | `_max` | Defines at which value the progress display is completed. | `number` | `undefined` | -| `_type` | `_type` | **[DEPRECATED]** will be removed in v2, use \_variant

Defines which variant should be used for presentation. | `"bar" \| "cycle" \| "cycle-label-value" \| "cycle-value-label" \| undefined` | `undefined` | -| `_unit` | `_unit` | Defines the unit of the step values (not shown). | `string \| undefined` | `'%'` | -| `_value` _(required)_ | `_value` | Defines the progress. | `number` | `undefined` | -| `_variant` | `_variant` | Defines which variant should be used for presentation. | `"bar" \| "cycle" \| "cycle-label-value" \| "cycle-value-label" \| undefined` | `undefined` | +| Property | Attribute | Description | Type | Default | +| --------------------- | ---------- | ------------------------------------------------------------------------------------------------------------------ | ----------------------------------------------------------------------------- | ----------- | +| `_label` | `_label` | Defines the visible or semantic label of the component (e.g. aria-label, label, headline, caption, summary, etc.). | `string \| undefined` | `undefined` | +| `_max` _(required)_ | `_max` | Defines at which value the progress display is completed. | `number` | `undefined` | +| `_unit` | `_unit` | Defines the unit of the step values (not shown). | `string \| undefined` | `'%'` | +| `_value` _(required)_ | `_value` | Defines the progress. | `number` | `undefined` | +| `_variant` | `_variant` | Defines which variant should be used for presentation. | `"bar" \| "cycle" \| "cycle-label-value" \| "cycle-value-label" \| undefined` | `undefined` | --- diff --git a/packages/components/src/components/quote/readme.md b/packages/components/src/components/quote/readme.md index bb584f39de..acf8389570 100644 --- a/packages/components/src/components/quote/readme.md +++ b/packages/components/src/components/quote/readme.md @@ -66,13 +66,12 @@ Die `inline`-Variante ist Standard, sofern die Eingerückte gewünscht ist, kann ## Properties -| Property | Attribute | Description | Type | Default | -| --------------------- | ---------- | ------------------------------------------------------------------------------------------------------------------------------- | ---------------------------------- | ----------- | -| `_caption` | `_caption` | **[DEPRECATED]** Use \_label.

Deprecated: Defines the visible caption of the component. | `string \| undefined` | `undefined` | -| `_href` _(required)_ | `_href` | Sets the target URI of the link or citation source. | `string` | `undefined` | -| `_label` | `_label` | Defines the visible or semantic label of the component (e.g. aria-label, label, headline, caption, summary, etc.). | `string \| undefined` | `undefined` | -| `_quote` _(required)_ | `_quote` | Defines the text of the quote. | `string` | `undefined` | -| `_variant` | `_variant` | Defines which variant should be used for presentation. | `"block" \| "inline" \| undefined` | `'inline'` | +| Property | Attribute | Description | Type | Default | +| --------------------- | ---------- | ------------------------------------------------------------------------------------------------------------------ | ---------------------------------- | ----------- | +| `_href` _(required)_ | `_href` | Sets the target URI of the link or citation source. | `string` | `undefined` | +| `_label` | `_label` | Defines the visible or semantic label of the component (e.g. aria-label, label, headline, caption, summary, etc.). | `string \| undefined` | `undefined` | +| `_quote` _(required)_ | `_quote` | Defines the text of the quote. | `string` | `undefined` | +| `_variant` | `_variant` | Defines which variant should be used for presentation. | `"block" \| "inline" \| undefined` | `'inline'` | ## Dependencies diff --git a/packages/components/src/components/select/readme.md b/packages/components/src/components/select/readme.md index 0fd14aafc0..281765d2b9 100644 --- a/packages/components/src/components/select/readme.md +++ b/packages/components/src/components/select/readme.md @@ -95,22 +95,18 @@ import { xxx..., xxx..., FormatHandler, } from '@leanup/form'; | `_alert` | `_alert` | Defines whether the screen-readers should read out the notification. | `boolean \| undefined` | `true` | | `_disabled` | `_disabled` | Makes the element not focusable and ignore all events. | `boolean \| undefined` | `false` | | `_error` | `_error` | Defines the error message text. | `string \| undefined` | `undefined` | -| `_height` | `_height` | **[DEPRECATED]** Use \_rows instead.

Deprecated: Defines an individual height. | `string \| undefined` | `undefined` | | `_hideError` | `_hide-error` | Hides the error message but leaves it in the DOM for the input's aria-describedby. | `boolean \| undefined` | `false` | | `_hideLabel` | `_hide-label` | Hides the caption by default and displays the caption text with a tooltip when the interactive element is focused or the mouse is over it. | `boolean \| undefined` | `false` | | `_hint` | `_hint` | Defines the hint text. | `string \| undefined` | `''` | -| `_icon` | `_icon` | **[DEPRECATED]** Use \_icons.

| `string \| undefined \| { right?: IconOrIconClass \| undefined; left?: IconOrIconClass \| undefined; }` | `undefined` | | `_icons` | `_icons` | Defines the icon classnames (e.g. `_icons="fa-solid fa-user"`). | `string \| undefined \| { right?: IconOrIconClass \| undefined; left?: IconOrIconClass \| undefined; }` | `undefined` | | `_id` | `_id` | Defines the internal ID of the primary component element. | `string \| undefined` | `undefined` | | `_label` | `_label` | Defines the visible or semantic label of the component (e.g. aria-label, label, headline, caption, summary, etc.). Set to `false` to enable the expert slot. | `string \| undefined` | `undefined` | -| `_list` | `_list` | **[DEPRECATED]** use \_options

Deprecated: Options the user can choose from, also supporting Optgroup. | `SelectOption[] \| string \| undefined` | `undefined` | | `_multiple` | `_multiple` | Makes the input accept multiple inputs. | `boolean \| undefined` | `false` | | `_name` | `_name` | Defines the technical name of an input field. | `string \| undefined` | `undefined` | | `_on` | -- | Gibt die EventCallback-Funktionen für das Input-Event an. | `InputTypeOnBlur & InputTypeOnClick & InputTypeOnChange & InputTypeOnFocus \| undefined` | `undefined` | | `_options` | `_options` | Options the user can choose from, also supporting Optgroup. | `(Option \| Optgroup)[] \| string \| undefined` | `undefined` | | `_required` | `_required` | Makes the input element required. | `boolean \| undefined` | `false` | | `_rows` | `_rows` | Defines how many rows of options should be visible at the same time. | `number \| undefined` | `undefined` | -| `_size` | `_size` | Wechselt das Eingabeelement in den Auswahlfeld modus und setzt die Höhe des Feldes. | `number \| undefined` | `undefined` | | `_tabIndex` | `_tab-index` | Defines which tab-index the primary element of the component has. (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'` | | `_touched` | `_touched` | Shows if the input was touched by a user. | `boolean \| undefined` | `false` | diff --git a/packages/components/src/components/skip-nav/readme.md b/packages/components/src/components/skip-nav/readme.md index a3ef2eb99c..52e30aaa02 100644 --- a/packages/components/src/components/skip-nav/readme.md +++ b/packages/components/src/components/skip-nav/readme.md @@ -53,11 +53,10 @@ Die **SkipNav** wird durch Übergabe eines JSON-Objekts erzeugt, das für das Re ## Properties -| Property | Attribute | Description | Type | Default | -| --------------------- | ------------- | ------------------------------------------------------------------------------------------------------------------------------------------- | ----------------------- | ----------- | -| `_ariaLabel` | `_aria-label` | **[DEPRECATED]** use \_label instead

Deprecated: Setzt die semantische Beschriftung der Komponente. | `string \| undefined` | `undefined` | -| `_label` | `_label` | Defines the visible or semantic label of the component (e.g. aria-label, label, headline, caption, summary, etc.). | `string \| undefined` | `undefined` | -| `_links` _(required)_ | `_links` | Defines the list of links combined with their labels to render. | `LinkProps[] \| string` | `undefined` | +| Property | Attribute | Description | Type | Default | +| --------------------- | --------- | ------------------------------------------------------------------------------------------------------------------ | ----------------------- | ----------- | +| `_label` _(required)_ | `_label` | Defines the visible or semantic label of the component (e.g. aria-label, label, headline, caption, summary, etc.). | `string` | `undefined` | +| `_links` _(required)_ | `_links` | Defines the list of links combined with their labels to render. | `LinkProps[] \| string` | `undefined` | ## Dependencies diff --git a/packages/components/src/components/span/readme.md b/packages/components/src/components/span/readme.md index 960577ea79..f4d7cdbc96 100644 --- a/packages/components/src/components/span/readme.md +++ b/packages/components/src/components/span/readme.md @@ -23,9 +23,7 @@ Die **Span**-Komponente dient dazu innerhalb zahlreicher KoliBri-Komponenten die | Property | Attribute | Description | Type | Default | | --------------------- | ------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------ | ---------------------------------------------------------------------- | ----------- | | `_hideLabel` | `_hide-label` | Hides the caption by default and displays the caption text with a tooltip when the interactive element is focused or the mouse is over it. | `boolean \| undefined` | `false` | -| `_icon` | `_icon` | **[DEPRECATED]** Use \_icons.

| `KoliBriHorizontalIcons & KoliBriVerticalIcons \| string \| undefined` | `undefined` | -| `_iconOnly` | `_icon-only` | **[DEPRECATED]** use \_hide-label

Deprecated: Hides the label and shows the description in a Tooltip instead. | `boolean \| undefined` | `undefined` | -| `_icons` | `_icons` | Defines the icon classnames (e.g. `_icons="fa-solid fa-user"`). | `KoliBriHorizontalIcons & KoliBriVerticalIcons \| string \| undefined` | `undefined` | +| `_icons` | `_icons` | Defines the g classnames (e.g. `_icons="fa-solid fa-user"`). | `KoliBriHorizontalIcons & KoliBriVerticalIcons \| string \| undefined` | `undefined` | | `_label` _(required)_ | `_label` | Defines the visible or semantic label of the component (e.g. aria-label, label, headline, caption, summary, etc.). Set to `false` to enable the expert slot. | `string` | `undefined` | ## Dependencies diff --git a/packages/components/src/components/split-button/readme.md b/packages/components/src/components/split-button/readme.md index 906455262a..cc1fd10d9c 100644 --- a/packages/components/src/components/split-button/readme.md +++ b/packages/components/src/components/split-button/readme.md @@ -29,23 +29,18 @@ dem sich weitere Aktionen verbergen. | Property | Attribute | Description | Type | Default | | --------------------- | ---------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------ | ----------- | -| `_accessKey` | `_access-key` | Defines which key combination can be used to trigger or focus the interactive element of the component. | `string \| undefined` | `undefined` | | `_ariaControls` | `_aria-controls` | Defines which elements are controlled by this component. (https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-controls) | `string \| undefined` | `undefined` | | `_ariaExpanded` | `_aria-expanded` | Defines whether the interactive element of the component expanded something. (https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-expanded) | `boolean \| undefined` | `undefined` | -| `_ariaLabel` | `_aria-label` | **[DEPRECATED]** use \_label instead

Deprecated: Setzt die semantische Beschriftung der Komponente. | `string \| undefined` | `undefined` | | `_ariaSelected` | `_aria-selected` | Defines whether the interactive element of the component is selected (e.g. role=tab). (https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-selected) | `boolean \| undefined` | `undefined` | | `_customClass` | `_custom-class` | Defines the custom class attribute if \_variant="custom" is set. | `string \| undefined` | `undefined` | | `_disabled` | `_disabled` | Makes the element not focusable and ignore all events. | `boolean \| undefined` | `false` | | `_hideLabel` | `_hide-label` | Hides the caption by default and displays the caption text with a tooltip when the interactive element is focused or the mouse is over it. | `boolean \| undefined` | `false` | -| `_icon` | `_icon` | **[DEPRECATED]** Use \_icons.

| `KoliBriHorizontalIcons & KoliBriVerticalIcons \| string \| undefined` | `undefined` | | `_icons` | `_icons` | Defines the icon classnames (e.g. `_icons="fa-solid fa-user"`). | `KoliBriHorizontalIcons & KoliBriVerticalIcons \| string \| undefined` | `undefined` | | `_id` | `_id` | Defines the internal ID of the primary component element. | `string \| undefined` | `undefined` | | `_label` _(required)_ | `_label` | Defines the visible or semantic label of the component (e.g. aria-label, label, headline, caption, summary, etc.). | `string` | `undefined` | | `_name` | `_name` | Defines the technical name of an input field. | `string \| undefined` | `undefined` | | `_on` | -- | Defines the callback functions for button events. | `undefined \| { onClick?: EventValueOrEventCallback \| undefined; onMouseDown?: EventCallback \| undefined; }` | `undefined` | | `_role` | `_role` | Defines the role of the components primary element. | `"button" \| "link" \| "tab" \| undefined` | `undefined` | -| `_show` | `_show` | Makes the element show up. | `boolean \| undefined` | `false` | -| `_showDropdown` | `_show-dropdown` | **[DEPRECATED]** use \_show instead

Deprecated: Defines whether to show the dropdown menu. | `boolean \| undefined` | `false` | | `_tabIndex` | `_tab-index` | Defines which tab-index the primary element of the component has. (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` | Defines either the type of the component or of the components interactive element. | `"button" \| "reset" \| "submit" \| undefined` | `'button'` | diff --git a/packages/components/src/components/symbol/readme.md b/packages/components/src/components/symbol/readme.md index 9e5a59b928..e396a8a11e 100644 --- a/packages/components/src/components/symbol/readme.md +++ b/packages/components/src/components/symbol/readme.md @@ -32,10 +32,9 @@ Das eigentliche Symbol, welches am Bildschirm ausgegeben wird, wird über die Pr ## Properties -| Property | Attribute | Description | Type | Default | -| ---------------------- | ------------- | ----------------------------------------------------------------------------------------------------------------------------------- | --------------------- | ----------- | -| `_ariaLabel` | `_aria-label` | **[DEPRECATED]** use \_label

Deprecated: Setzt die semantische Beschriftung der Komponente. | `string \| undefined` | `undefined` | -| `_label` | `_label` | Sets the visible or semantic label of the component (e.g. Aria label, Label, Headline, Caption, Summary, etc.). | `string \| undefined` | `undefined` | -| `_symbol` _(required)_ | `_symbol` | Dieses Property gibt den String an der angezeigt werden soll. | `string` | `undefined` | +| Property | Attribute | Description | Type | Default | +| ---------------------- | --------- | --------------------------------------------------------------------------------------------------------------- | -------- | ----------- | +| `_label` _(required)_ | `_label` | Sets the visible or semantic label of the component (e.g. Aria label, Label, Headline, Caption, Summary, etc.). | `string` | `undefined` | +| `_symbol` _(required)_ | `_symbol` | Dieses Property gibt den String an der angezeigt werden soll. | `string` | `undefined` | --- diff --git a/packages/components/src/components/table/readme.md b/packages/components/src/components/table/readme.md index f149159d6b..3056bf0734 100644 --- a/packages/components/src/components/table/readme.md +++ b/packages/components/src/components/table/readme.md @@ -121,15 +121,14 @@ Warum die Tabelle einen **Tabindex** hat, wird auf der folgenden Webseite beschr ## Properties -| Property | Attribute | Description | Type | Default | -| ----------------------- | ------------- | ------------------------------------------------------------------------------------------------------------------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ----------- | -| `_caption` | `_caption` | **[DEPRECATED]** Use \_label.

Deprecated: Defines the visible caption of the component. | `string \| undefined` | `undefined` | -| `_data` _(required)_ | `_data` | Defines the primary table data. | `KoliBriTableDataType[] \| string` | `undefined` | -| `_dataFoot` | `_data-foot` | Defines the data for the table footer. | `KoliBriTableDataType[] \| string \| undefined` | `undefined` | -| `_headers` _(required)_ | `_headers` | Defines the horizontal and vertical table headers. | `string \| { horizontal?: KoliBriTableHeaderCell[][] \| undefined; vertical?: KoliBriTableHeaderCell[][] \| undefined; }` | `undefined` | -| `_label` | `_label` | Defines the visible or semantic label of the component (e.g. aria-label, label, headline, caption, summary, etc.). | `string \| undefined` | `undefined` | -| `_minWidth` | `_min-width` | Defines the table min-width. | `string \| undefined` | `undefined` | -| `_pagination` | `_pagination` | Defines whether to show the data distributed over multiple pages. | `boolean \| string \| undefined \| { _page: number; } & { _on?: KoliBriPaginationButtonCallbacks \| undefined; _page?: number \| undefined; _boundaryCount?: number \| undefined; _hasButtons?: boolean \| Stringified \| undefined; _pageSize?: number \| undefined; _pageSizeOptions?: Stringified \| undefined; _siblingCount?: number \| undefined; _total?: number \| undefined; _variant?: ButtonVariantPropType \| undefined; _customClass?: string \| undefined; _label?: string \| undefined; _max?: number \| undefined; _tooltipAlign?: AlignPropType \| undefined; }` | `undefined` | +| Property | Attribute | Description | Type | Default | +| ----------------------- | ------------- | ------------------------------------------------------------------------------------------------------------------ | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ----------- | +| `_data` _(required)_ | `_data` | Defines the primary table data. | `KoliBriTableDataType[] \| string` | `undefined` | +| `_dataFoot` | `_data-foot` | Defines the data for the table footer. | `KoliBriTableDataType[] \| string \| undefined` | `undefined` | +| `_headers` _(required)_ | `_headers` | Defines the horizontal and vertical table headers. | `string \| { horizontal?: KoliBriTableHeaderCell[][] \| undefined; vertical?: KoliBriTableHeaderCell[][] \| undefined; }` | `undefined` | +| `_label` _(required)_ | `_label` | Defines the visible or semantic label of the component (e.g. aria-label, label, headline, caption, summary, etc.). | `string` | `undefined` | +| `_minWidth` | `_min-width` | Defines the table min-width. | `string \| undefined` | `undefined` | +| `_pagination` | `_pagination` | Defines whether to show the data distributed over multiple pages. | `boolean \| string \| undefined \| { _page: number; } & { _on?: KoliBriPaginationButtonCallbacks \| undefined; _page?: number \| undefined; _max?: number \| undefined; _boundaryCount?: number \| undefined; _hasButtons?: boolean \| Stringified \| undefined; _pageSize?: number \| undefined; _pageSizeOptions?: Stringified \| undefined; _siblingCount?: number \| undefined; _variant?: ButtonVariantPropType \| undefined; _customClass?: string \| undefined; _label?: string \| undefined; _tooltipAlign?: AlignPropType \| undefined; }` | `undefined` | ## Dependencies diff --git a/packages/components/src/components/tabs/readme.md b/packages/components/src/components/tabs/readme.md index dce1bd5a20..ecc2707aa2 100644 --- a/packages/components/src/components/tabs/readme.md +++ b/packages/components/src/components/tabs/readme.md @@ -90,15 +90,13 @@ Hier steht immer der beeinträchtige Nutzende im Vordergrund. Um möglichst effi ## Properties -| Property | Attribute | Description | Type | Default | -| -------------------- | ------------- | ------------------------------------------------------------------------------------------------------------------------------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ----------- | -| `_align` | `_align` | Defines the position of the tab captions. | `"bottom" \| "left" \| "right" \| "top" \| undefined` | `'top'` | -| `_ariaLabel` | `_aria-label` | **[DEPRECATED]** use \_label instead

Deprecated: Setzt die semantische Beschriftung der Komponente. | `string \| undefined` | `undefined` | -| `_label` | `_label` | Defines the visible or semantic label of the component (e.g. aria-label, label, headline, caption, summary, etc.). | `string \| undefined` | `undefined` | -| `_on` | -- | Gibt die Liste der Callback-Funktionen an, die auf Events aufgerufen werden sollen. | `undefined \| { onCreate?: EventCallback \| { label: string; callback: EventCallback; } \| undefined; } & { onSelect?: EventValueOrEventCallback \| KeyboardEvent \| PointerEvent, number> \| undefined; }` | `undefined` | -| `_selected` | `_selected` | Defines which tab is active. | `number \| undefined` | `0` | -| `_tabs` _(required)_ | `_tabs` | Defines the tab captions. | `TabButtonProps[] \| string` | `undefined` | -| `_tabsAlign` | `_tabs-align` | **[DEPRECATED]** Use \_align.

Deprecated: Setzt die Position der Registrierkarten. | `"bottom" \| "left" \| "right" \| "top" \| undefined` | `'top'` | +| Property | Attribute | Description | Type | Default | +| --------------------- | ----------- | ------------------------------------------------------------------------------------------------------------------ | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ----------- | +| `_align` | `_align` | Defines the position of the tab captions. | `"bottom" \| "left" \| "right" \| "top" \| undefined` | `'top'` | +| `_label` _(required)_ | `_label` | Defines the visible or semantic label of the component (e.g. aria-label, label, headline, caption, summary, etc.). | `string` | `undefined` | +| `_on` | -- | Gibt die Liste der Callback-Funktionen an, die auf Events aufgerufen werden sollen. | `undefined \| { onCreate?: EventCallback \| { label: string; callback: EventCallback; } \| undefined; } & { onSelect?: EventValueOrEventCallback \| KeyboardEvent \| PointerEvent, number> \| undefined; }` | `undefined` | +| `_selected` | `_selected` | Defines which tab is active. | `number \| undefined` | `0` | +| `_tabs` _(required)_ | `_tabs` | Defines the tab captions. | `TabButtonProps[] \| string` | `undefined` | ## Dependencies diff --git a/packages/components/src/components/version/readme.md b/packages/components/src/components/version/readme.md index 468c3f505d..569c82134b 100644 --- a/packages/components/src/components/version/readme.md +++ b/packages/components/src/components/version/readme.md @@ -26,10 +26,9 @@ Die **Version** wird standardmäßig als **_Inline-Element_** ausgegeben. ## Properties -| Property | Attribute | Description | Type | Default | -| ---------- | ---------- | ----------------------------------------------------------------------------------------------------------------------------- | --------------------- | ----------- | -| `_label` | `_label` | Defines the visible or semantic label of the component (e.g. aria-label, label, headline, caption, summary, etc.). | `string \| undefined` | `undefined` | -| `_version` | `_version` | **[DEPRECATED]** use \_label instead

Deprecated: Gibt die Versionsnummer als Text an. | `string \| undefined` | `undefined` | +| Property | Attribute | Description | Type | Default | +| --------------------- | --------- | ------------------------------------------------------------------------------------------------------------------ | -------- | ----------- | +| `_label` _(required)_ | `_label` | Defines the visible or semantic label of the component (e.g. aria-label, label, headline, caption, summary, etc.). | `string` | `undefined` | ## Dependencies