@public-ui/components 1.6.0-rc.2 → 1.6.0-rc.4

package/doc/badge.md

@@ -89,13 +89,14 @@ Die zusätzliche Ausgabe eines **Icon** gewährleistet, dass der Nutzer auch hie
 
 ## Properties
 
-| Property              | Attribute       | Description                                                                                                                 | Type                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                    | Default     |
-| --------------------- | --------------- | --------------------------------------------------------------------------------------------------------------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ----------- |
-| `_color`              | `_color`        | Setzt die Hintergrundfarbe.                                                                                                 | `string` \| `undefined` \| `{ backgroundColor: string; color: string; }` \| `{ backgroundColor: string; foregroundColor: Stringified<CharacteristicColors>; }`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                | `'#000'`    |
-| `_icon`               | `_icon`         | Setzt die Iconklasse (z.B.: `_icon="codicon codicon-home`).                                                                 | `KoliBriHorizontalIcon & KoliBriVerticalIcon` \| `string` \| `undefined`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                    | `undefined` |
-| `_iconOnly`           | `_icon-only`    | Blendet die Beschriftung (Label) aus und zeigt sie stattdessen mittels eines Tooltips an.                                   | `boolean` \| `undefined`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                  | `false`     |
-| `_label` _(required)_ | `_label`        | Setzt die sichtbare oder semantische Beschriftung der Komponente (z.B. Aria-Label, Label, Headline, Caption, Summary usw.). | `string`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                | `undefined` |
-| `_smartButton`        | `_smart-button` | Ermöglicht einen Schalter ins das Eingabefeld mit einer beliebigen Aktion zu einzufügen (nur Icon-Only).                    | `string` \| `undefined` \| `{ _label: string; } & { _ariaControls?: string` \| `undefined; _ariaLabel?: string` \| `undefined; _icon?: Stringified<KoliBriIconProp>` \| `undefined; _iconAlign?: Align` \| `undefined; _iconOnly?: boolean` \| `undefined; _role?: AlternativButtonLinkRole` \| `undefined; _tabIndex?: number` \| `undefined; _tooltipAlign?: Align` \| `undefined; _ariaCurrent?: AriaCurrent` \| `undefined; _ariaExpanded?: boolean` \| `undefined; _ariaSelected?: boolean` \| `undefined; _disabled?: boolean` \| `undefined; _accessKey?: string` \| `undefined; _id?: string` \| `undefined; _on?: KoliBriButtonCallbacks<unknown>` \| `undefined; _type?: KoliBriButtonType` \| `undefined; _value?: unknown; _variant?: KoliBriButtonVariant` \| `undefined; _customClass?: string` \| `undefined; }` | `undefined` |
+| Property              | Attribute       | Description                                                                                                                                                        | Type                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                       | Default     |
+| --------------------- | --------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------ | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ----------- |
+| `_color`              | `_color`        | Setzt die Hintergrundfarbe.                                                                                                                                        | `string` \| `undefined` \| `{ backgroundColor: string; color: string; }` \| `{ backgroundColor: string; foregroundColor: Stringified<CharacteristicColors>; }`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                   | `'#000'`    |
+| `_hideLabel`          | `_hide-label`   | Blendet die Beschriftung (Label) aus und zeigt sie stattdessen mittels eines Tooltips an.                                                                          | `boolean` \| `undefined`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                     | `false`     |
+| `_icon`               | `_icon`         | Setzt die Iconklasse (z.B.: `_icon="codicon codicon-home`).                                                                                                        | `KoliBriHorizontalIcon & KoliBriVerticalIcon` \| `string` \| `undefined`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                       | `undefined` |
+| `_iconOnly`           | `_icon-only`    | <span class="text-red-500">**[DEPRECATED]**</span> use _hide-label<br/><br/>Blendet die Beschriftung (Label) aus und zeigt sie stattdessen mittels eines Tooltips an. | `boolean` \| `undefined`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                     | `undefined` |
+| `_label` _(required)_ | `_label`        | Setzt die sichtbare oder semantische Beschriftung der Komponente (z.B. Aria-Label, Label, Headline, Caption, Summary usw.).                                        | `string`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                   | `undefined` |
+| `_smartButton`        | `_smart-button` | Ermöglicht einen Schalter ins das Eingabefeld mit einer beliebigen Aktion zu einzufügen (nur Icon-Only).                                                           | `string` \| `undefined` \| `{ _label: string; } & { _ariaControls?: string` \| `undefined; _ariaLabel?: string` \| `undefined; _icon?: Stringified<KoliBriIconProp>` \| `undefined; _iconAlign?: Align` \| `undefined; _iconOnly?: boolean` \| `undefined; _role?: AlternativButtonLinkRole` \| `undefined; _tabIndex?: number` \| `undefined; _tooltipAlign?: Align` \| `undefined; _ariaCurrent?: AriaCurrent` \| `undefined; _ariaExpanded?: boolean` \| `undefined; _ariaSelected?: boolean` \| `undefined; _disabled?: boolean` \| `undefined; _hideLabel?: boolean` \| `undefined; _accessKey?: string` \| `undefined; _id?: string` \| `undefined; _on?: KoliBriButtonCallbacks<unknown>` \| `undefined; _type?: KoliBriButtonType` \| `undefined; _value?: unknown; _variant?: KoliBriButtonVariant` \| `undefined; _customClass?: string` \| `undefined; }` | `undefined` |
 
 
 ## Dependencies

package/doc/breadcrumb.md

@@ -37,14 +37,14 @@ Das gesamte JSON-Objekt muss in eckigen Klammern an das Attribut **`_links`** ü
 
 - **`_href`** übergibt den Link, der für dieses Element verwendet werden soll.
 - **`_icon`** (optional) übergibt den Namen des Icon, wenn zusätzlich zum Text des Elements noch ein Icon angezeigt werden soll. Es stehen die <kol-link _href="https://microsoft.github.io/vscode-codicons/dist/codicon.html" _label="Codicons"></kol-link> zur Verfügung
-- **`_iconOnly`** (optional). Wenn der Wert auf **true** gesetzt wird, erscheint im Link ausschließlich das Icon, ohne weiteren Text. Die Eigenschaft `_icon` muss gesetzt werden.
+- **`_hide-label`** (optional). Wenn der Wert auf **true** gesetzt wird, erscheint im Link ausschließlich das Icon, ohne weiteren Text. Die Eigenschaft `_icon` muss gesetzt werden.
 - **`_label`** übergibt den Text, der für dieses Element angezeigt werden soll.
 
 Beispiel für ein JSON-Objekt, das an das Attribut **`_links`** übergeben wird:
 
 ```JSON
 [
-  { '_label': 'Startseite', '_href': '#/', '_icon': 'codicon codicon-home', '_iconOnly': true },
+  { '_label': 'Startseite', '_href': '#/', '_icon': 'codicon codicon-home', '_hide-label _': true },
   { '_label': '1. Unterseite', '_href': '/unterseite_eins' },
   { '_label': '2. Unterseite', '_href': '/unterseite_zwei' }
 ]

package/doc/button-link.md

@@ -38,8 +38,9 @@ Da der Link, nicht wie der Button, in mehrere Varianten (`primary` oder `seconda
 | `_ariaLabel`          | `_aria-label`    | Setzt die sichtbare oder semantische Beschriftung der Komponente (z.B. Aria-Label, Label, Headline, Caption, Summary usw.).                                                     | `string` \| `undefined`                                                                                                                           | `undefined` |
 | `_ariaSelected`       | `_aria-selected` | Gibt an, ob interaktive Element in der Komponente ausgewählt ist (z.B. role=tab). (https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-selected)    | `boolean` \| `undefined`                                                                                                                          | `undefined` |
 | `_disabled`           | `_disabled`      | Deaktiviert das interaktive Element in der Komponente und erlaubt keine Interaktion mehr damit.                                                                                 | `boolean` \| `undefined`                                                                                                                          | `false`     |
+| `_hideLabel`          | `_hide-label`    | Blendet die Beschriftung (Label) aus und zeigt sie stattdessen mittels eines Tooltips an.                                                                                       | `boolean` \| `undefined`                                                                                                                          | `false`     |
 | `_icon`               | `_icon`          | Setzt die Iconklasse (z.B.: `_icon="codicon codicon-home`).                                                                                                                     | `KoliBriHorizontalIcon & KoliBriVerticalIcon` \| `string` \| `undefined`                                                                            | `undefined` |
-| `_iconOnly`           | `_icon-only`     | Blendet die Beschriftung (Label) aus und zeigt sie stattdessen mittels eines Tooltips an.                                                                                       | `boolean` \| `undefined`                                                                                                                          | `false`     |
+| `_iconOnly`           | `_icon-only`     | <span class="text-red-500">**[DEPRECATED]**</span> use _hide-label<br/><br/>Blendet die Beschriftung (Label) aus und zeigt sie stattdessen mittels eines Tooltips an.              | `boolean` \| `undefined`                                                                                                                          | `undefined` |
 | `_id`                 | `_id`            | Gibt die interne ID des primären Elements in der Komponente an.                                                                                                                 | `string` \| `undefined`                                                                                                                           | `undefined` |
 | `_label` _(required)_ | `_label`         | Setzt die sichtbare oder semantische Beschriftung der Komponente (z.B. Aria-Label, Label, Headline, Caption, Summary usw.).                                                     | `string`                                                                                                                                        | `undefined` |
 | `_on`                 | --               | Gibt die EventCallback-Funktionen für die Button-Events an.                                                                                                                     | `undefined` \| `{ onClick?: EventValueOrEventCallback<MouseEvent, unknown>` \| `undefined; onMouseDown?: EventCallback<MouseEvent>` \| `undefined; }` | `undefined` |

package/doc/button.md

@@ -53,7 +53,7 @@ Das Objekt ist vom Typ `KoliBriAllIcon`, kann also einen oder mehrere der Schlü
 
 ### Schaltfläche ohne Text
 
-Mittels **`_iconOnly`** wird die Schaltfläche nur das icon anzeigen (<kol-link _href="#icon" _label="siehe icon"></kol-link>)
+Mittels **`_hide-label`** wird die Schaltfläche nur das icon anzeigen (<kol-link _href="#icon" _label="siehe icon"></kol-link>)
 
 <kol-alert _type="info">Beachten Sie, dass das Attribut **`_label`** auch dann gesetzt werden muss, wenn nur ein Icon angezeigt werden soll, dieses wird von Screenreadern vorgelesen und in den Tooltip gesetzt.</kol-alert>
 
@@ -108,9 +108,10 @@ Probleme mit Disabled-Status
 | `_ariaSelected`       | `_aria-selected` | Gibt an, ob interaktive Element in der Komponente ausgewählt ist (z.B. role=tab). (https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-selected)    | `boolean` \| `undefined`                                                                                                                          | `undefined` |
 | `_customClass`        | `_custom-class`  | Gibt an, welche Custom-Class übergeben werden soll, wenn _variant="custom" gesetzt ist.                                                                                         | `string` \| `undefined`                                                                                                                           | `undefined` |
 | `_disabled`           | `_disabled`      | Deaktiviert das interaktive Element in der Komponente und erlaubt keine Interaktion mehr damit.                                                                                 | `boolean` \| `undefined`                                                                                                                          | `false`     |
+| `_hideLabel`          | `_hide-label`    | Blendet die Beschriftung (Label) aus und zeigt sie stattdessen mittels eines Tooltips an.                                                                                       | `boolean` \| `undefined`                                                                                                                          | `false`     |
 | `_icon`               | `_icon`          | Setzt die Iconklasse (z.B.: `_icon="codicon codicon-home`).                                                                                                                     | `KoliBriHorizontalIcon & KoliBriVerticalIcon` \| `string` \| `undefined`                                                                            | `undefined` |
 | `_iconAlign`          | `_icon-align`    | <span class="text-red-500">**[DEPRECATED]**</span> <br/><br/>Deprecated: Gibt an, ob das Icon links oder rechts von der Beschriftung angezeigt werden soll.                        | `"bottom"` \| `"left"` \| `"right"` \| `"top"` \| `undefined`                                                                                           | `undefined` |
-| `_iconOnly`           | `_icon-only`     | Blendet die Beschriftung (Label) aus und zeigt sie stattdessen mittels eines Tooltips an.                                                                                       | `boolean` \| `undefined`                                                                                                                          | `false`     |
+| `_iconOnly`           | `_icon-only`     | <span style="color:red">**[DEPRECATED]**</span> use _hide-label<br/><br/>Blendet die Beschriftung (Label) aus und zeigt sie stattdessen mittels eines Tooltips an.              | `boolean` \| `undefined`                                                                                                                          | `undefined` |
 | `_id`                 | `_id`            | Gibt die interne ID des primären Elements in der Komponente an.                                                                                                                 | `string` \| `undefined`                                                                                                                           | `undefined` |
 | `_label` _(required)_ | `_label`         | Setzt die sichtbare oder semantische Beschriftung der Komponente (z.B. Aria-Label, Label, Headline, Caption, Summary usw.).                                                     | `string`                                                                                                                                        | `undefined` |
 | `_on`                 | --               | Gibt die EventCallback-Funktionen für die Button-Events an.                                                                                                                     | `undefined` \| `{ onClick?: EventValueOrEventCallback<MouseEvent, unknown>` \| `undefined; onMouseDown?: EventCallback<MouseEvent>` \| `undefined; }` | `undefined` |