@public-ui/components 1.1.17 → 1.2.0-rc.0

package/dist/types/components/link/component.d.ts

@@ -14,6 +14,7 @@ export declare class KolLinkWc implements Generic.Element.ComponentApi<RequiredL
   private readonly nonce;
   private ref?;
   private readonly catchRef;
+  private readonly onClick;
   private readonly getRenderValues;
   render(): JSX.Element;
   _ariaControls?: string;
@@ -23,7 +24,7 @@ export declare class KolLinkWc implements Generic.Element.ComponentApi<RequiredL
   _ariaSelected?: boolean;
   _disabled?: boolean;
   _fill?: boolean;
-  _href?: string;
+  _href: string;
   _icon?: Stringified<KoliBriIconProp>;
   _iconAlign?: Alignment;
   _iconOnly?: boolean;

package/dist/types/components/link/shadow.d.ts

@@ -16,7 +16,7 @@ export declare class KolLink implements Generic.Element.Members<RequiredLinkProp
   _ariaSelected?: boolean;
   _disabled?: boolean;
   _fill?: boolean;
-  _href?: string;
+  _href: string;
   _icon?: Stringified<KoliBriIconProp>;
   _iconAlign?: Alignment;
   _iconOnly?: boolean;

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

@@ -1,6 +1,6 @@
 import { JSX, State } from '../../stencil-public-runtime';
 import { Generic } from '@public-ui/core';
-import { AlternativButtonLinkRole, AriaCurrent, KoliBriButtonVariant, LinkButtonStates, LinkTarget, OptionalLinkButtonProps, OptionalLinkButtonStates, RequiredLinkButtonProps, RequiredLinkButtonStates } from '../../types/button-link';
+import { AlternativButtonLinkRole, AriaCurrent, KoliBriButtonVariant, LinkButtonStates, LinkOnCallbacks, LinkTarget, OptionalLinkButtonProps, OptionalLinkButtonStates, RequiredLinkButtonProps, RequiredLinkButtonStates } from '../../types/button-link';
 import { Stringified } from '../../types/common';
 import { KoliBriIconProp } from '../../types/icon';
 import { TooltipAlignment } from '../tooltip/component';
@@ -19,10 +19,11 @@ export declare class KolLinkButton implements Generic.Element.Members<RequiredLi
   _ariaSelected?: boolean;
   _customClass?: string;
   _disabled?: boolean;
-  _href?: string;
+  _href: string;
   _icon?: Stringified<KoliBriIconProp>;
   _iconOnly?: boolean;
   _label: string;
+  _on?: LinkOnCallbacks;
   _role?: AlternativButtonLinkRole;
   _tabIndex?: number;
   _target?: LinkTarget;

package/dist/types/components/tabs/component.d.ts

@@ -11,7 +11,7 @@ export type KoliBriTabsCallbacks = {
     callback: EventCallback<Event>;
   };
 } & {
-  [Events.onSelect]?: EventValueCallback<CustomEvent | KeyboardEvent | PointerEvent, number>;
+  [Events.onSelect]?: EventValueCallback<CustomEvent | KeyboardEvent | MouseEvent | PointerEvent, number>;
 };
 type RequiredTabButtonProps = {
   label: string;
@@ -52,6 +52,7 @@ export declare class KolTabs implements Generic.Element.ComponentApi<RequiredPro
   private onKeyDown;
   private readonly onClickSelect;
   private readonly onMouseDown;
+  private readonly callbacks;
   private renderButtonGroup;
   private tabPanelHost?;
   private readonly catchTabPanelHost;

package/dist/types/components.d.ts

@@ -190,7 +190,7 @@ export namespace Components {
         /**
           * Gibt die EventCallback-Funktionen für die Button-Events an.
          */
-        "_on"?: KoliBriButtonCallbacks;
+        "_on"?: KoliBriButtonCallbacks<unknown>;
         /**
           * Gibt an, welche Role der Schalter hat.
          */
@@ -207,6 +207,10 @@ export namespace Components {
           * Gibt an, welche Typ der Button hat.
          */
         "_type"?: KoliBriButtonType;
+        /**
+          * Gibt einen Wert an, den der Schalter bei einem Klick zurückgibt.
+         */
+        "_value"?: Stringified<unknown>;
         /**
           * Gibt an, welche Ausprägung der Button hat.
          */
@@ -264,7 +268,7 @@ export namespace Components {
         /**
           * Gibt die EventCallback-Funktionen für die Button-Events an.
          */
-        "_on"?: KoliBriButtonCallbacks;
+        "_on"?: KoliBriButtonCallbacks<unknown>;
         /**
           * Gibt an, welche Role der Schalter hat.
          */
@@ -281,6 +285,10 @@ export namespace Components {
           * Gibt an, welche Typ der Button hat.
          */
         "_type"?: KoliBriButtonType;
+        /**
+          * Gibt einen Wert an, den der Schalter bei einem Klick zurückgibt.
+         */
+        "_value"?: Stringified<unknown>;
     }
     interface KolButtonWc {
         /**
@@ -339,7 +347,7 @@ export namespace Components {
         /**
           * Gibt die EventCallback-Funktionen für die Button-Events an.
          */
-        "_on"?: KoliBriButtonCallbacks;
+        "_on"?: KoliBriButtonCallbacks<unknown>;
         /**
           * Gibt an, welche Role der Schalter hat.
          */
@@ -356,6 +364,10 @@ export namespace Components {
           * Gibt an, welche Typ der Button hat.
          */
         "_type"?: KoliBriButtonType;
+        /**
+          * Gibt einen Wert an, den der Schalter bei einem Klick zurückgibt.
+         */
+        "_value"?: Stringified<unknown>;
         /**
           * Gibt an, welche Ausprägung der Button hat.
          */
@@ -1446,7 +1458,7 @@ export namespace Components {
         /**
           * Gibt die Ziel-Url des Links an.
          */
-        "_href"?: string;
+        "_href": string;
         /**
           * Gibt den Class-Identifier eines Icons eine eingebunden Icofont an. (z.B. https://icofont.com/)
          */
@@ -1466,7 +1478,6 @@ export namespace Components {
         "_label": string;
         /**
           * Gibt die EventCallback-Funktionen für den Link an.
-          * @deprecated Hierzu sollte statt Link- die ButtonLink-Komponente verwendet werden.
          */
         "_on"?: LinkOnCallbacks;
         /**
@@ -1547,7 +1558,7 @@ export namespace Components {
         /**
           * Gibt die Ziel-Url des Links an.
          */
-        "_href"?: string;
+        "_href": string;
         /**
           * Gibt den Class-Identifier eines Icons eine eingebunden Icofont an. (z.B. https://icofont.com/)
          */
@@ -1560,6 +1571,10 @@ export namespace Components {
           * Gibt einen beschreibenden Text für das Text-Element an.
          */
         "_label": string;
+        /**
+          * Gibt die EventCallback-Funktionen für den Link an.
+         */
+        "_on"?: LinkOnCallbacks;
         /**
           * Gibt an, welche Role der Schalter hat.
          */
@@ -1648,7 +1663,7 @@ export namespace Components {
         /**
           * Gibt die Ziel-Url des Links an.
          */
-        "_href"?: string;
+        "_href": string;
         /**
           * Gibt den Class-Identifier eines Icons eine eingebunden Icofont an. (z.B. https://icofont.com/)
          */
@@ -2718,7 +2733,7 @@ declare namespace LocalJSX {
         /**
           * Gibt die EventCallback-Funktionen für die Button-Events an.
          */
-        "_on"?: KoliBriButtonCallbacks;
+        "_on"?: KoliBriButtonCallbacks<unknown>;
         /**
           * Gibt an, welche Role der Schalter hat.
          */
@@ -2735,6 +2750,10 @@ declare namespace LocalJSX {
           * Gibt an, welche Typ der Button hat.
          */
         "_type"?: KoliBriButtonType;
+        /**
+          * Gibt einen Wert an, den der Schalter bei einem Klick zurückgibt.
+         */
+        "_value"?: Stringified<unknown>;
         /**
           * Gibt an, welche Ausprägung der Button hat.
          */
@@ -2792,7 +2811,7 @@ declare namespace LocalJSX {
         /**
           * Gibt die EventCallback-Funktionen für die Button-Events an.
          */
-        "_on"?: KoliBriButtonCallbacks;
+        "_on"?: KoliBriButtonCallbacks<unknown>;
         /**
           * Gibt an, welche Role der Schalter hat.
          */
@@ -2809,6 +2828,10 @@ declare namespace LocalJSX {
           * Gibt an, welche Typ der Button hat.
          */
         "_type"?: KoliBriButtonType;
+        /**
+          * Gibt einen Wert an, den der Schalter bei einem Klick zurückgibt.
+         */
+        "_value"?: Stringified<unknown>;
     }
     interface KolButtonWc {
         /**
@@ -2867,7 +2890,7 @@ declare namespace LocalJSX {
         /**
           * Gibt die EventCallback-Funktionen für die Button-Events an.
          */
-        "_on"?: KoliBriButtonCallbacks;
+        "_on"?: KoliBriButtonCallbacks<unknown>;
         /**
           * Gibt an, welche Role der Schalter hat.
          */
@@ -2884,6 +2907,10 @@ declare namespace LocalJSX {
           * Gibt an, welche Typ der Button hat.
          */
         "_type"?: KoliBriButtonType;
+        /**
+          * Gibt einen Wert an, den der Schalter bei einem Klick zurückgibt.
+         */
+        "_value"?: Stringified<unknown>;
         /**
           * Gibt an, welche Ausprägung der Button hat.
          */
@@ -3974,7 +4001,7 @@ declare namespace LocalJSX {
         /**
           * Gibt die Ziel-Url des Links an.
          */
-        "_href"?: string;
+        "_href": string;
         /**
           * Gibt den Class-Identifier eines Icons eine eingebunden Icofont an. (z.B. https://icofont.com/)
          */
@@ -3994,7 +4021,6 @@ declare namespace LocalJSX {
         "_label": string;
         /**
           * Gibt die EventCallback-Funktionen für den Link an.
-          * @deprecated Hierzu sollte statt Link- die ButtonLink-Komponente verwendet werden.
          */
         "_on"?: LinkOnCallbacks;
         /**
@@ -4075,7 +4101,7 @@ declare namespace LocalJSX {
         /**
           * Gibt die Ziel-Url des Links an.
          */
-        "_href"?: string;
+        "_href": string;
         /**
           * Gibt den Class-Identifier eines Icons eine eingebunden Icofont an. (z.B. https://icofont.com/)
          */
@@ -4088,6 +4114,10 @@ declare namespace LocalJSX {
           * Gibt einen beschreibenden Text für das Text-Element an.
          */
         "_label": string;
+        /**
+          * Gibt die EventCallback-Funktionen für den Link an.
+         */
+        "_on"?: LinkOnCallbacks;
         /**
           * Gibt an, welche Role der Schalter hat.
          */
@@ -4176,7 +4206,7 @@ declare namespace LocalJSX {
         /**
           * Gibt die Ziel-Url des Links an.
          */
-        "_href"?: string;
+        "_href": string;
         /**
           * Gibt den Class-Identifier eines Icons eine eingebunden Icofont an. (z.B. https://icofont.com/)
          */

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

@@ -1,7 +1,7 @@
 import { TooltipAlignment } from '../components/tooltip/component';
 import { Events } from '../enums/events';
 import { Generic } from '@public-ui/core';
-import { EventCallback } from './callbacks';
+import { EventCallback, EventValueCallback } from './callbacks';
 import { Alignment, KoliBriCustomIcon, KoliBriIconProp } from './icon';
 import { Stringified } from './common';
 export type AriaCurrent = boolean | 'page' | 'step' | 'location' | 'date' | 'time';
@@ -47,8 +47,8 @@ type OptionalButtonAndLinkStates = {
 };
 export type KoliBriButtonType = 'button' | 'reset' | 'submit';
 export type KoliBriButtonVariant = 'primary' | 'secondary' | 'normal' | 'danger' | 'ghost' | 'custom';
-export type KoliBriButtonCallbacks = {
-  [Events.onClick]?: EventCallback<PointerEvent>;
+export type KoliBriButtonCallbacks<T> = {
+  [Events.onClick]?: EventValueCallback<MouseEvent, T>;
   [Events.onMouseDown]?: EventCallback<MouseEvent>;
 };
 export type KoliBriButtonVariantCustomClass = {
@@ -59,8 +59,9 @@ export type RequiredButtonLinkProps = RequiredButtonAndLinkProps;
 export type OptionalButtonLinkProps = OptionalButtonAndLinkProps & {
   accessKey: string;
   id: string;
-  on: KoliBriButtonCallbacks;
+  on: KoliBriButtonCallbacks<unknown>;
   type: KoliBriButtonType;
+  value: Stringified<unknown>;
 };
 type RequiredButtonLinkStates = RequiredButtonAndLinkStates & {
   type: KoliBriButtonType;
@@ -68,7 +69,8 @@ type RequiredButtonLinkStates = RequiredButtonAndLinkStates & {
 type OptionalButtonLinkStates = OptionalButtonAndLinkStates & KoliBriButtonVariantCustomClass & {
   accessKey: string;
   id: string;
-  on: KoliBriButtonCallbacks;
+  on: KoliBriButtonCallbacks<unknown>;
+  value: unknown;
 };
 export type RequiredButtonProps = RequiredButtonLinkProps;
 export type OptionalButtonProps = OptionalButtonLinkProps & KoliBriButtonVariantCustomClass;
@@ -77,14 +79,15 @@ export type RequiredButtonStates = RequiredButtonLinkStates;
 export type OptionalButtonStates = OptionalButtonLinkStates & KoliBriButtonVariantCustomClass;
 export type ButtonStates = Generic.Element.Members<RequiredButtonStates, OptionalButtonStates>;
 export type LinkOnCallbacks = {
-  [Events.onClick]?: EventCallback<Event>;
+  [Events.onClick]?: EventValueCallback<Event, string>;
 };
 export type LinkTarget = '_blank' | '_parent' | '_self' | '_top' | string;
 export type LinkUseCase = 'text' | 'image' | 'nav';
-export type RequiredLinkProps = RequiredButtonAndLinkProps;
+export type RequiredLinkProps = RequiredButtonAndLinkProps & {
+  href: string;
+};
 export type OptionalLinkProps = OptionalButtonAndLinkProps & {
   fill: boolean;
-  href: string;
   on: LinkOnCallbacks;
   part: string;
   selector: string;
@@ -95,11 +98,12 @@ export type OptionalLinkProps = OptionalButtonAndLinkProps & {
   useCase: LinkUseCase;
 };
 export type LinkProps = Generic.Element.Members<RequiredLinkProps, OptionalLinkProps>;
-export type RequiredLinkStates = RequiredButtonAndLinkStates;
+export type RequiredLinkStates = RequiredButtonAndLinkStates & {
+  href: string;
+};
 export type OptionalLinkStates = OptionalButtonAndLinkStates & {
   ariaSelected: boolean;
   fill: boolean;
-  href: string;
   on: LinkOnCallbacks;
   part: string;
   selector: string;

package/dist/types/utils/prop.validators.d.ts

@@ -55,10 +55,10 @@ export declare class KoliBriUtils {
 export declare class KoliBriDevHelper {
   static readonly patchTheme: (name: string, map: Generic.Theming.Map<string, string>) => string;
   static readonly patchThemeTag: (themeName: string, tagName: "GLOBAL" | "PROPERTIES" | `${Uppercase<string>}-${Uppercase<string>}`, css: string) => void;
-  static readonly querySelector: <T extends Element>(selector: string, node?: Document | HTMLElement | ShadowRoot | undefined) => T | null;
-  static readonly querySelectorAll: <T extends Element>(selector: string, node?: Document | HTMLElement | ShadowRoot | undefined) => T[];
+  static readonly querySelector: <T extends Element>(selector: string, node?: HTMLElement | ShadowRoot | Document | undefined) => T | null;
+  static readonly querySelectorAll: <T extends Element>(selector: string, node?: HTMLElement | ShadowRoot | Document | undefined) => T[];
   static readonly scrollByHTMLElement: (element: HTMLElement, parentElement?: HTMLElement | Window) => void;
-  static readonly scrollBySelector: (selector: string, document?: Document | HTMLElement | ShadowRoot | undefined) => void;
+  static readonly scrollBySelector: (selector: string, document?: HTMLElement | ShadowRoot | Document | undefined) => void;
   static readonly stringifyJson: (value: unknown) => string;
 }
 export {};

package/doc/badge.md

@@ -104,7 +104,7 @@ Die zusätzliche Ausgabe eines **Icon** gewährleistet, dass der Nutzer auch hie
 | `_iconAlign`          | `_icon-align`   | <span class="text-red-500">**[DEPRECATED]**</span> <br/><br/>Gibt an, ob das Icon entweder links oder rechts dargestellt werden soll. | `"left" \| "right" \| undefined`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                  | `'left'`                 |
 | `_iconOnly`           | `_icon-only`    | Gibt an, ob nur das Icon angezeigt wird.                                                                                           | `boolean \| undefined`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                            | `false`                  |
 | `_label` _(required)_ | `_label`        | Gibt den Label-Text des Badges an.                                                                                                 | `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; _ariaCurrent?: AriaCurrent \| undefined; _ariaExpanded?: boolean \| undefined; _ariaLabel?: string \| undefined; _ariaSelected?: boolean \| undefined; _disabled?: boolean \| undefined; _icon?: Stringified<KoliBriIconProp> \| undefined; _iconAlign?: Alignment \| undefined; _iconOnly?: boolean \| undefined; _role?: "tab" \| undefined; _tabIndex?: number \| undefined; _tooltipAlign?: TooltipAlignment \| undefined; _accessKey?: string \| undefined; _id?: string \| undefined; _on?: KoliBriButtonCallbacks \| undefined; _type?: KoliBriButtonType \| undefined; _customClass?: string \| undefined; _variant?: KoliBriButtonVariant \| undefined; }`                                                          | `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; _ariaCurrent?: AriaCurrent \| undefined; _ariaExpanded?: boolean \| undefined; _ariaLabel?: string \| undefined; _ariaSelected?: boolean \| undefined; _disabled?: boolean \| undefined; _icon?: Stringified<KoliBriIconProp> \| undefined; _iconAlign?: Alignment \| undefined; _iconOnly?: boolean \| undefined; _role?: "tab" \| undefined; _tabIndex?: number \| undefined; _tooltipAlign?: TooltipAlignment \| undefined; _accessKey?: string \| undefined; _id?: string \| undefined; _on?: KoliBriButtonCallbacks<unknown> \| undefined; _type?: KoliBriButtonType \| undefined; _value?: unknown; _customClass?: string \| undefined; _variant?: KoliBriButtonVariant \| undefined; }`                               | `undefined`              |
 
 
 ## Dependencies

package/doc/button-link.md

@@ -42,11 +42,12 @@ Da der Link, nicht wie der Button, in mehrere Varianten (`primary` oder `seconda
 | `_iconOnly`           | `_icon-only`     | Gibt an, ob nur das Icon angezeigt wird.                                                                                                                                                                                                                                              | `boolean \| undefined`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                            | `false`     |
 | `_id`                 | `_id`            | Gibt die ID der Schaltfläche an. (Selection, Testing)                                                                                                                                                                                                                                 | `string \| undefined`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                             | `undefined` |
 | `_label` _(required)_ | `_label`         | Gibt einen beschreibenden Text für das Text-Element an.                                                                                                                                                                                                                               | `string`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                          | `undefined` |
-| `_on`                 | --               | Gibt die EventCallback-Funktionen für die Button-Events an.                                                                                                                                                                                                                           | `undefined \| { onClick?: EventCallback<PointerEvent> \| undefined; onMouseDown?: EventCallback<MouseEvent> \| undefined; }`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                      | `undefined` |
+| `_on`                 | --               | Gibt die EventCallback-Funktionen für die Button-Events an.                                                                                                                                                                                                                           | `undefined \| { onClick?: EventValueCallback<MouseEvent, unknown> \| undefined; onMouseDown?: EventCallback<MouseEvent> \| undefined; }`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                          | `undefined` |
 | `_role`               | `_role`          | Gibt an, welche Role der Schalter hat.                                                                                                                                                                                                                                                | `"tab" \| undefined`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                              | `undefined` |
 | `_tabIndex`           | `_tab-index`     | Gibt an, welchen Tab-Index der Button hat. (https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/tabindex)                                                                                                                                                             | `number \| undefined`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                             | `undefined` |
 | `_tooltipAlign`       | `_tooltip-align` | Gibt an, ob der Tooltip oben, rechts, unten oder links angezeigt werden soll.                                                                                                                                                                                                         | `"bottom" \| "left" \| "right" \| "top" \| undefined`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                             | `'top'`     |
 | `_type`               | `_type`          | Gibt an, welche Typ der Button hat.                                                                                                                                                                                                                                                   | `"button" \| "reset" \| "submit" \| undefined`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                    | `'button'`  |
+| `_value`              | --               | Gibt einen Wert an, den der Schalter bei einem Klick zurückgibt.                                                                                                                                                                                                                      | `unknown`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                         | `undefined` |
 
 
 ## Dependencies

package/doc/button.md

@@ -151,11 +151,12 @@ Probleme mit Disabled-Status
 | `_iconOnly`           | `_icon-only`     | Gibt an, ob nur das Icon angezeigt wird.                                                                                                           | `boolean \| undefined`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                            | `false`     |
 | `_id`                 | `_id`            | Gibt die ID der Schaltfläche an. (Selection, Testing)                                                                                              | `string \| undefined`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                             | `undefined` |
 | `_label` _(required)_ | `_label`         | Gibt den Label für die Beschriftung der Schaltfläche an.                                                                                           | `string`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                          | `undefined` |
-| `_on`                 | --               | Gibt die EventCallback-Funktionen für die Button-Events an.                                                                                        | `undefined \| { onClick?: EventCallback<PointerEvent> \| undefined; onMouseDown?: EventCallback<MouseEvent> \| undefined; }`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                      | `undefined` |
+| `_on`                 | --               | Gibt die EventCallback-Funktionen für die Button-Events an.                                                                                        | `undefined \| { onClick?: EventValueCallback<MouseEvent, unknown> \| undefined; onMouseDown?: EventCallback<MouseEvent> \| undefined; }`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                          | `undefined` |
 | `_role`               | `_role`          | Gibt an, welche Role der Schalter hat.                                                                                                             | `"tab" \| undefined`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                              | `undefined` |
 | `_tabIndex`           | `_tab-index`     | Gibt an, welchen Tab-Index der Button hat. (https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/tabindex)                          | `number \| undefined`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                             | `undefined` |
 | `_tooltipAlign`       | `_tooltip-align` | Gibt an, ob der Tooltip oben, rechts, unten oder links angezeigt werden soll.                                                                      | `"bottom" \| "left" \| "right" \| "top" \| undefined`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                             | `'top'`     |
 | `_type`               | `_type`          | Gibt an, welche Typ der Button hat.                                                                                                                | `"button" \| "reset" \| "submit" \| undefined`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                    | `'button'`  |
+| `_value`              | --               | Gibt einen Wert an, den der Schalter bei einem Klick zurückgibt.                                                                                   | `unknown`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                         | `undefined` |
 | `_variant`            | `_variant`       | Gibt an, welche Ausprägung der Button hat.                                                                                                         | `"custom" \| "danger" \| "ghost" \| "normal" \| "primary" \| "secondary" \| undefined`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                            | `'normal'`  |