@public-ui/components 1.1.10-rc.9 → 1.1.10

package/dist/types/components.d.ts

@@ -10,13 +10,13 @@ import { HeadingLevel } from "./types/heading-level";
 import { KoliBriAccordionCallbacks } from "./components/accordion/component";
 import { AlertType, AlertVariant, KoliBriAlertEventCallbacks } from "./types/alert";
 import { KoliBriColor } from "./components/badge/component";
-import { Icofont } from "./types/icofont";
-import { Alignment, KoliBriIconProp } from "./types/icon";
 import { Stringified } from "./types/common";
+import { Alignment, KoliBriIconProp } from "./types/icon";
 import { NavLinkProps } from "./components/link/component";
 import { AriaCurrent, ButtonProps, KoliBriButtonCallbacks, KoliBriButtonType, KoliBriButtonVariant, LinkOnCallbacks, LinkTarget, LinkUseCase } from "./types/button-link";
 import { KoliBriFormCallbacks } from "./components/form/component";
 import { FontAwesome, FontAwesomeOssPrefix } from "./enums/font-awesome";
+import { Icofont } from "./types/icofont";
 import { KoliBriInputIcon } from "./components/input-text/types";
 import { InputTypeOnDefault, InputTypeOnOff, Option, SelectOption } from "./types/input/types";
 import { InputCheckboxType } from "./components/input-checkbox/types";
@@ -103,9 +103,10 @@ export namespace Components {
         /**
           * Gibt einen Identifier eines Icons aus den Icofont's an. (https://icofont.com/)
          */
-        "_icon"?: Icofont;
+        "_icon"?: Stringified<KoliBriIconProp>;
         /**
           * Gibt an, ob das Icon entweder links oder rechts dargestellt werden soll.
+          * @deprecated
          */
         "_iconAlign"?: Alignment;
         /**
@@ -159,7 +160,7 @@ export namespace Components {
         /**
           * Gibt den Class-Identifier eines Icons eine eingebunden Icofont an. (z.B. https://icofont.com/)
          */
-        "_icon"?: KoliBriIconProp;
+        "_icon"?: Stringified<KoliBriIconProp>;
         /**
           * Gibt an, ob das Icon links oder rechts dargestellt werden soll.
           * @deprecated
@@ -181,6 +182,10 @@ export namespace Components {
           * Gibt die EventCallback-Funktionen für die Button-Events an.
          */
         "_on"?: KoliBriButtonCallbacks;
+        /**
+          * Gibt an, welchen Tab-Index der Button hat. (https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/tabindex)
+         */
+        "_tabIndex"?: number;
         /**
           * Gibt an, ob der Tooltip oben, rechts, unten oder links angezeigt werden soll.
          */
@@ -218,7 +223,7 @@ export namespace Components {
          */
         "_ariaExpanded"?: boolean;
         /**
-          * Gibt einen Text des Buttons für den Screenreader an. Für die Sprachsteuerung muss der Aria-Text mit dem Label-Text des Buttons beginnen. (https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-label)
+          * Gibt einen beschreibenden Text für den Screenreader an. Damit die Sprachsteuerung von interaktiven Elementen funktioniert, muss der Aria-Label-Text mit dem Label-Text des Buttons beginnen.  - https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-label
          */
         "_ariaLabel"?: string;
         /**
@@ -228,7 +233,7 @@ export namespace Components {
         /**
           * Gibt den Class-Identifier eines Icons eine eingebunden Icofont an. (z.B. https://icofont.com/)
          */
-        "_icon"?: KoliBriIconProp;
+        "_icon"?: Stringified<KoliBriIconProp>;
         /**
           * Gibt an, ob das Icon links oder rechts dargestellt werden soll.
           * @deprecated
@@ -243,13 +248,17 @@ export namespace Components {
          */
         "_id"?: string;
         /**
-          * Gibt den Label für die Beschriftung der Schaltfläche an.
+          * Gibt einen beschreibenden Text für das Text-Element an.
          */
         "_label": string;
         /**
           * Gibt die EventCallback-Funktionen für die Button-Events an.
          */
         "_on"?: KoliBriButtonCallbacks;
+        /**
+          * Gibt an, welchen Tab-Index der Button hat. (https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/tabindex)
+         */
+        "_tabIndex"?: number;
         /**
           * Gibt an, ob der Tooltip oben, rechts, unten oder links angezeigt werden soll.
          */
@@ -291,7 +300,7 @@ export namespace Components {
         /**
           * Gibt den Class-Identifier eines Icons eine eingebunden Icofont an. (z.B. https://icofont.com/)
          */
-        "_icon"?: KoliBriIconProp;
+        "_icon"?: Stringified<KoliBriIconProp>;
         /**
           * Gibt an, ob das Icon links oder rechts dargestellt werden soll.
           * @deprecated
@@ -313,6 +322,10 @@ export namespace Components {
           * Gibt die EventCallback-Funktionen für die Button-Events an.
          */
         "_on"?: KoliBriButtonCallbacks;
+        /**
+          * Gibt an, welchen Tab-Index der Button hat. (https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/tabindex)
+         */
+        "_tabIndex"?: number;
         /**
           * Gibt an, ob der Tooltip oben, rechts, unten oder links angezeigt werden soll.
          */
@@ -962,6 +975,7 @@ export namespace Components {
         "_touched"?: boolean;
         /**
           * Gibt an, ob es ein DateTime-, Date-, Month-, Week-, Time-, DateTime-Local-, Number-Eingabefeld ist.
+          * @deprecated Das W3C hat die Date-Typen in eine eigene Gruppe zusammengefasst. Verwende hierfür die InputDate-Komponente.
          */
         "_type"?: InputNumberType;
         /**
@@ -1397,10 +1411,10 @@ export namespace Components {
         /**
           * Gibt den Class-Identifier eines Icons eine eingebunden Icofont an. (z.B. https://icofont.com/)
          */
-        "_icon"?: KoliBriIconProp;
+        "_icon"?: Stringified<KoliBriIconProp>;
         /**
           * Gibt an, ob das Icon entweder links oder rechts dargestellt werden soll.
-          * @deprecated
+          * @deprecated Wird durch das neue flexibleren Icon-Typ abgedeckt.
          */
         "_iconAlign"?: Alignment;
         /**
@@ -1409,6 +1423,7 @@ export namespace Components {
         "_iconOnly"?: boolean;
         /**
           * Gibt die EventCallback-Funktionen für den Link an.
+          * @deprecated Hierzu sollte statt Link- die ButtonLink-Komponente verwendet werden.
          */
         "_on"?: LinkOnCallbacks;
         /**
@@ -1423,6 +1438,10 @@ export namespace Components {
           * Gibt an, ob der Link nur beim Fokus sichtbar ist.
          */
         "_stealth"?: boolean;
+        /**
+          * Gibt an, welchen Tab-Index der Button hat. (https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/tabindex)
+         */
+        "_tabIndex"?: number;
         /**
           * Definiert das Verhalten, bei dem der Link geöffnet werden soll.
          */
@@ -1458,7 +1477,7 @@ export namespace Components {
          */
         "_ariaExpanded"?: boolean;
         /**
-          * Gibt einen beschreibenden Text des Links an.  (https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-label)
+          * Gibt einen beschreibenden Text für den Screenreader an. Damit die Sprachsteuerung von interaktiven Elementen funktioniert, muss der Aria-Label-Text mit dem Label-Text des Buttons beginnen.  - https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-label
          */
         "_ariaLabel"?: string;
         /**
@@ -1484,7 +1503,7 @@ export namespace Components {
         /**
           * Gibt den Class-Identifier eines Icons eine eingebunden Icofont an. (z.B. https://icofont.com/)
          */
-        "_icon"?: KoliBriIconProp;
+        "_icon"?: Stringified<KoliBriIconProp>;
         /**
           * Gibt an, ob das Icon entweder links oder rechts dargestellt werden soll.
           * @deprecated
@@ -1494,8 +1513,13 @@ export namespace Components {
           * Gibt an, ob nur das Icon angezeigt wird.
          */
         "_iconOnly"?: boolean;
+        /**
+          * Gibt einen beschreibenden Text für das Text-Element an.
+         */
+        "_label": string;
         /**
           * Gibt die EventCallback-Funktionen für den Link an.
+          * @deprecated
          */
         "_on"?: LinkOnCallbacks;
         /**
@@ -1510,6 +1534,10 @@ export namespace Components {
           * Gibt an, ob der Link nur beim Fokus sichtbar ist.
          */
         "_stealth"?: boolean;
+        /**
+          * Gibt an, welchen Tab-Index der Button hat. (https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/tabindex)
+         */
+        "_tabIndex"?: number;
         /**
           * Definiert das Verhalten, bei dem der Link geöffnet werden soll.
          */
@@ -1601,10 +1629,10 @@ export namespace Components {
         /**
           * Gibt den Class-Identifier eines Icons eine eingebunden Icofont an. (z.B. https://icofont.com/)
          */
-        "_icon"?: KoliBriIconProp;
+        "_icon"?: Stringified<KoliBriIconProp>;
         /**
           * Gibt an, ob das Icon entweder links oder rechts dargestellt werden soll.
-          * @deprecated
+          * @deprecated Wird durch das neue flexibleren Icon-Typ abgedeckt.
          */
         "_iconAlign"?: Alignment;
         /**
@@ -1613,6 +1641,7 @@ export namespace Components {
         "_iconOnly"?: boolean;
         /**
           * Gibt die EventCallback-Funktionen für den Link an.
+          * @deprecated Hierzu sollte statt Link- die ButtonLink-Komponente verwendet werden.
          */
         "_on"?: LinkOnCallbacks;
         /**
@@ -1627,6 +1656,10 @@ export namespace Components {
           * Gibt an, ob der Link nur beim Fokus sichtbar ist.
          */
         "_stealth"?: boolean;
+        /**
+          * Gibt an, welchen Tab-Index der Button hat. (https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/tabindex)
+         */
+        "_tabIndex"?: number;
         /**
           * Definiert das Verhalten, bei dem der Link geöffnet werden soll.
          */
@@ -1867,19 +1900,29 @@ export namespace Components {
         /**
           * Gibt den Class-Identifier eines Icons eine eingebunden Icofont an. (z.B. https://icofont.com/)
          */
-        "_icon"?: KoliBriIconProp;
+        "_icon"?: Stringified<KoliBriIconProp>;
         /**
-          * Gibt den Label für die Beschriftung der Schaltfläche an.
+          * Gibt an, ob nur das Icon angezeigt wird.
          */
-        "_label"?: string;
+        "_iconOnly"?: boolean;
         /**
-          * Gibt an, ob der Tooltip oben, rechts, unten oder links angezeigt werden soll.
+          * Gibt einen beschreibenden Text für das Text-Element an.
          */
-        "_tooltipAlign"?: TooltipAlignment;
+        "_label": string;
+    }
+    interface KolSpanWc {
         /**
-          * Gibt an, ob der Tooltip oben, rechts, unten oder links angezeigt werden soll.
+          * Gibt den Class-Identifier eines Icons eine eingebunden Icofont an. (z.B. https://icofont.com/)
+         */
+        "_icon"?: Stringified<KoliBriIconProp>;
+        /**
+          * Gibt an, ob nur das Icon angezeigt wird.
+         */
+        "_iconOnly"?: boolean;
+        /**
+          * Gibt einen beschreibenden Text für das Text-Element an.
          */
-        "_tooltipId"?: string;
+        "_label": string;
     }
     interface KolSpin {
         /**
@@ -2351,6 +2394,12 @@ declare global {
         prototype: HTMLKolSpanElement;
         new (): HTMLKolSpanElement;
     };
+    interface HTMLKolSpanWcElement extends Components.KolSpanWc, HTMLStencilElement {
+    }
+    var HTMLKolSpanWcElement: {
+        prototype: HTMLKolSpanWcElement;
+        new (): HTMLKolSpanWcElement;
+    };
     interface HTMLKolSpinElement extends Components.KolSpin, HTMLStencilElement {
     }
     var HTMLKolSpinElement: {
@@ -2446,6 +2495,7 @@ declare global {
         "kol-select": HTMLKolSelectElement;
         "kol-skip-nav": HTMLKolSkipNavElement;
         "kol-span": HTMLKolSpanElement;
+        "kol-span-wc": HTMLKolSpanWcElement;
         "kol-spin": HTMLKolSpinElement;
         "kol-symbol": HTMLKolSymbolElement;
         "kol-table": HTMLKolTableElement;
@@ -2523,9 +2573,10 @@ declare namespace LocalJSX {
         /**
           * Gibt einen Identifier eines Icons aus den Icofont's an. (https://icofont.com/)
          */
-        "_icon"?: Icofont;
+        "_icon"?: Stringified<KoliBriIconProp>;
         /**
           * Gibt an, ob das Icon entweder links oder rechts dargestellt werden soll.
+          * @deprecated
          */
         "_iconAlign"?: Alignment;
         /**
@@ -2579,7 +2630,7 @@ declare namespace LocalJSX {
         /**
           * Gibt den Class-Identifier eines Icons eine eingebunden Icofont an. (z.B. https://icofont.com/)
          */
-        "_icon"?: KoliBriIconProp;
+        "_icon"?: Stringified<KoliBriIconProp>;
         /**
           * Gibt an, ob das Icon links oder rechts dargestellt werden soll.
           * @deprecated
@@ -2601,6 +2652,10 @@ declare namespace LocalJSX {
           * Gibt die EventCallback-Funktionen für die Button-Events an.
          */
         "_on"?: KoliBriButtonCallbacks;
+        /**
+          * Gibt an, welchen Tab-Index der Button hat. (https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/tabindex)
+         */
+        "_tabIndex"?: number;
         /**
           * Gibt an, ob der Tooltip oben, rechts, unten oder links angezeigt werden soll.
          */
@@ -2634,7 +2689,7 @@ declare namespace LocalJSX {
          */
         "_ariaExpanded"?: boolean;
         /**
-          * Gibt einen Text des Buttons für den Screenreader an. Für die Sprachsteuerung muss der Aria-Text mit dem Label-Text des Buttons beginnen. (https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-label)
+          * Gibt einen beschreibenden Text für den Screenreader an. Damit die Sprachsteuerung von interaktiven Elementen funktioniert, muss der Aria-Label-Text mit dem Label-Text des Buttons beginnen.  - https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-label
          */
         "_ariaLabel"?: string;
         /**
@@ -2644,7 +2699,7 @@ declare namespace LocalJSX {
         /**
           * Gibt den Class-Identifier eines Icons eine eingebunden Icofont an. (z.B. https://icofont.com/)
          */
-        "_icon"?: KoliBriIconProp;
+        "_icon"?: Stringified<KoliBriIconProp>;
         /**
           * Gibt an, ob das Icon links oder rechts dargestellt werden soll.
           * @deprecated
@@ -2659,13 +2714,17 @@ declare namespace LocalJSX {
          */
         "_id"?: string;
         /**
-          * Gibt den Label für die Beschriftung der Schaltfläche an.
+          * Gibt einen beschreibenden Text für das Text-Element an.
          */
         "_label": string;
         /**
           * Gibt die EventCallback-Funktionen für die Button-Events an.
          */
         "_on"?: KoliBriButtonCallbacks;
+        /**
+          * Gibt an, welchen Tab-Index der Button hat. (https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/tabindex)
+         */
+        "_tabIndex"?: number;
         /**
           * Gibt an, ob der Tooltip oben, rechts, unten oder links angezeigt werden soll.
          */
@@ -2707,7 +2766,7 @@ declare namespace LocalJSX {
         /**
           * Gibt den Class-Identifier eines Icons eine eingebunden Icofont an. (z.B. https://icofont.com/)
          */
-        "_icon"?: KoliBriIconProp;
+        "_icon"?: Stringified<KoliBriIconProp>;
         /**
           * Gibt an, ob das Icon links oder rechts dargestellt werden soll.
           * @deprecated
@@ -2729,6 +2788,10 @@ declare namespace LocalJSX {
           * Gibt die EventCallback-Funktionen für die Button-Events an.
          */
         "_on"?: KoliBriButtonCallbacks;
+        /**
+          * Gibt an, welchen Tab-Index der Button hat. (https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/tabindex)
+         */
+        "_tabIndex"?: number;
         /**
           * Gibt an, ob der Tooltip oben, rechts, unten oder links angezeigt werden soll.
          */
@@ -3374,6 +3437,7 @@ declare namespace LocalJSX {
         "_touched"?: boolean;
         /**
           * Gibt an, ob es ein DateTime-, Date-, Month-, Week-, Time-, DateTime-Local-, Number-Eingabefeld ist.
+          * @deprecated Das W3C hat die Date-Typen in eine eigene Gruppe zusammengefasst. Verwende hierfür die InputDate-Komponente.
          */
         "_type"?: InputNumberType;
         /**
@@ -3809,10 +3873,10 @@ declare namespace LocalJSX {
         /**
           * Gibt den Class-Identifier eines Icons eine eingebunden Icofont an. (z.B. https://icofont.com/)
          */
-        "_icon"?: KoliBriIconProp;
+        "_icon"?: Stringified<KoliBriIconProp>;
         /**
           * Gibt an, ob das Icon entweder links oder rechts dargestellt werden soll.
-          * @deprecated
+          * @deprecated Wird durch das neue flexibleren Icon-Typ abgedeckt.
          */
         "_iconAlign"?: Alignment;
         /**
@@ -3821,6 +3885,7 @@ declare namespace LocalJSX {
         "_iconOnly"?: boolean;
         /**
           * Gibt die EventCallback-Funktionen für den Link an.
+          * @deprecated Hierzu sollte statt Link- die ButtonLink-Komponente verwendet werden.
          */
         "_on"?: LinkOnCallbacks;
         /**
@@ -3835,6 +3900,10 @@ declare namespace LocalJSX {
           * Gibt an, ob der Link nur beim Fokus sichtbar ist.
          */
         "_stealth"?: boolean;
+        /**
+          * Gibt an, welchen Tab-Index der Button hat. (https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/tabindex)
+         */
+        "_tabIndex"?: number;
         /**
           * Definiert das Verhalten, bei dem der Link geöffnet werden soll.
          */
@@ -3870,7 +3939,7 @@ declare namespace LocalJSX {
          */
         "_ariaExpanded"?: boolean;
         /**
-          * Gibt einen beschreibenden Text des Links an.  (https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-label)
+          * Gibt einen beschreibenden Text für den Screenreader an. Damit die Sprachsteuerung von interaktiven Elementen funktioniert, muss der Aria-Label-Text mit dem Label-Text des Buttons beginnen.  - https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-label
          */
         "_ariaLabel"?: string;
         /**
@@ -3896,7 +3965,7 @@ declare namespace LocalJSX {
         /**
           * Gibt den Class-Identifier eines Icons eine eingebunden Icofont an. (z.B. https://icofont.com/)
          */
-        "_icon"?: KoliBriIconProp;
+        "_icon"?: Stringified<KoliBriIconProp>;
         /**
           * Gibt an, ob das Icon entweder links oder rechts dargestellt werden soll.
           * @deprecated
@@ -3906,8 +3975,13 @@ declare namespace LocalJSX {
           * Gibt an, ob nur das Icon angezeigt wird.
          */
         "_iconOnly"?: boolean;
+        /**
+          * Gibt einen beschreibenden Text für das Text-Element an.
+         */
+        "_label": string;
         /**
           * Gibt die EventCallback-Funktionen für den Link an.
+          * @deprecated
          */
         "_on"?: LinkOnCallbacks;
         /**
@@ -3922,6 +3996,10 @@ declare namespace LocalJSX {
           * Gibt an, ob der Link nur beim Fokus sichtbar ist.
          */
         "_stealth"?: boolean;
+        /**
+          * Gibt an, welchen Tab-Index der Button hat. (https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/tabindex)
+         */
+        "_tabIndex"?: number;
         /**
           * Definiert das Verhalten, bei dem der Link geöffnet werden soll.
          */
@@ -4013,10 +4091,10 @@ declare namespace LocalJSX {
         /**
           * Gibt den Class-Identifier eines Icons eine eingebunden Icofont an. (z.B. https://icofont.com/)
          */
-        "_icon"?: KoliBriIconProp;
+        "_icon"?: Stringified<KoliBriIconProp>;
         /**
           * Gibt an, ob das Icon entweder links oder rechts dargestellt werden soll.
-          * @deprecated
+          * @deprecated Wird durch das neue flexibleren Icon-Typ abgedeckt.
          */
         "_iconAlign"?: Alignment;
         /**
@@ -4025,6 +4103,7 @@ declare namespace LocalJSX {
         "_iconOnly"?: boolean;
         /**
           * Gibt die EventCallback-Funktionen für den Link an.
+          * @deprecated Hierzu sollte statt Link- die ButtonLink-Komponente verwendet werden.
          */
         "_on"?: LinkOnCallbacks;
         /**
@@ -4039,6 +4118,10 @@ declare namespace LocalJSX {
           * Gibt an, ob der Link nur beim Fokus sichtbar ist.
          */
         "_stealth"?: boolean;
+        /**
+          * Gibt an, welchen Tab-Index der Button hat. (https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/tabindex)
+         */
+        "_tabIndex"?: number;
         /**
           * Definiert das Verhalten, bei dem der Link geöffnet werden soll.
          */
@@ -4279,19 +4362,29 @@ declare namespace LocalJSX {
         /**
           * Gibt den Class-Identifier eines Icons eine eingebunden Icofont an. (z.B. https://icofont.com/)
          */
-        "_icon"?: KoliBriIconProp;
+        "_icon"?: Stringified<KoliBriIconProp>;
         /**
-          * Gibt den Label für die Beschriftung der Schaltfläche an.
+          * Gibt an, ob nur das Icon angezeigt wird.
          */
-        "_label"?: string;
+        "_iconOnly"?: boolean;
         /**
-          * Gibt an, ob der Tooltip oben, rechts, unten oder links angezeigt werden soll.
+          * Gibt einen beschreibenden Text für das Text-Element an.
          */
-        "_tooltipAlign"?: TooltipAlignment;
+        "_label": string;
+    }
+    interface KolSpanWc {
         /**
-          * Gibt an, ob der Tooltip oben, rechts, unten oder links angezeigt werden soll.
+          * Gibt den Class-Identifier eines Icons eine eingebunden Icofont an. (z.B. https://icofont.com/)
          */
-        "_tooltipId"?: string;
+        "_icon"?: Stringified<KoliBriIconProp>;
+        /**
+          * Gibt an, ob nur das Icon angezeigt wird.
+         */
+        "_iconOnly"?: boolean;
+        /**
+          * Gibt einen beschreibenden Text für das Text-Element an.
+         */
+        "_label": string;
     }
     interface KolSpin {
         /**
@@ -4532,6 +4625,7 @@ declare namespace LocalJSX {
         "kol-select": KolSelect;
         "kol-skip-nav": KolSkipNav;
         "kol-span": KolSpan;
+        "kol-span-wc": KolSpanWc;
         "kol-spin": KolSpin;
         "kol-symbol": KolSymbol;
         "kol-table": KolTable;
@@ -4592,6 +4686,7 @@ declare module "@stencil/core" {
             "kol-select": LocalJSX.KolSelect & JSXBase.HTMLAttributes<HTMLKolSelectElement>;
             "kol-skip-nav": LocalJSX.KolSkipNav & JSXBase.HTMLAttributes<HTMLKolSkipNavElement>;
             "kol-span": LocalJSX.KolSpan & JSXBase.HTMLAttributes<HTMLKolSpanElement>;
+            "kol-span-wc": LocalJSX.KolSpanWc & JSXBase.HTMLAttributes<HTMLKolSpanWcElement>;
             "kol-spin": LocalJSX.KolSpin & JSXBase.HTMLAttributes<HTMLKolSpinElement>;
             "kol-symbol": LocalJSX.KolSymbol & JSXBase.HTMLAttributes<HTMLKolSymbolElement>;
             "kol-table": LocalJSX.KolTable & JSXBase.HTMLAttributes<HTMLKolTableElement>;

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

@@ -3,6 +3,7 @@ import { Events } from '../enums/events';
 import { Generic } from '@public-ui/core';
 import { EventCallback } from './callbacks';
 import { Alignment, KoliBriCustomIcon, KoliBriIconProp } from './icon';
+import { Stringified } from './common';
 export declare type AriaCurrent = boolean | 'page' | 'step' | 'location' | 'date' | 'time';
 declare type RequiredButtonAndLinkProps = unknown;
 declare type OptionalButtonAndLinkProps = {
@@ -11,9 +12,10 @@ declare type OptionalButtonAndLinkProps = {
   ariaExpanded: boolean;
   ariaLabel: string;
   disabled: boolean;
-  icon: KoliBriIconProp;
+  icon: Stringified<KoliBriIconProp>;
   iconAlign: Alignment;
   iconOnly: boolean;
+  tabIndex: number;
   tooltipAlign: TooltipAlignment;
 };
 declare type RequiredButtonAndLinkStates = {
@@ -32,12 +34,14 @@ declare type OptionalButtonAndLinkStates = {
   ariaExpanded: boolean;
   disabled: boolean;
   iconOnly: boolean;
+  tabIndex: number;
   tooltipAlign: TooltipAlignment;
 };
 export declare type KoliBriButtonType = 'button' | 'reset' | 'submit';
-export declare type KoliBriButtonVariant = 'primary' | 'secondary' | 'normal' | 'danger' | 'ghost';
+export declare type KoliBriButtonVariant = 'primary' | 'secondary' | 'normal' | 'danger' | 'ghost' | 'custom';
 export declare type KoliBriButtonCallbacks = {
   [Events.onClick]?: EventCallback<PointerEvent>;
+  [Events.onMouseDown]?: EventCallback<MouseEvent>;
 };
 export declare type KoliBriButtonVariantCustomClass = {
   customClass: string;
@@ -72,7 +76,7 @@ export declare type LinkOnCallbacks = {
 };
 export declare type LinkTarget = '_blank' | '_parent' | '_self' | '_top' | string;
 export declare type LinkUseCase = 'text' | 'image' | 'nav';
-export declare type RequiredLinkProps = RequiredButtonAndLinkProps & unknown;
+export declare type RequiredLinkProps = RequiredButtonAndLinkProps;
 export declare type OptionalLinkProps = OptionalButtonAndLinkProps & {
   ariaSelected: boolean;
   fill: boolean;
@@ -87,7 +91,7 @@ export declare type OptionalLinkProps = OptionalButtonAndLinkProps & {
   useCase: LinkUseCase;
 };
 export declare type LinkProps = Generic.Element.Members<RequiredLinkProps, OptionalLinkProps>;
-export declare type RequiredLinkStates = RequiredButtonAndLinkStates & unknown;
+export declare type RequiredLinkStates = RequiredButtonAndLinkStates;
 export declare type OptionalLinkStates = OptionalButtonAndLinkStates & {
   ariaSelected: boolean;
   fill: boolean;
@@ -102,9 +106,13 @@ export declare type OptionalLinkStates = OptionalButtonAndLinkStates & {
   useCase: LinkUseCase;
 };
 export declare type LinkStates = Generic.Element.Members<RequiredLinkStates, OptionalLinkStates>;
-export declare type RequiredLinkButtonProps = RequiredLinkProps;
+export declare type RequiredLinkButtonProps = RequiredLinkProps & {
+  label: string;
+};
 export declare type OptionalLinkButtonProps = OptionalLinkProps & KoliBriButtonVariantCustomClass;
-export declare type RequiredLinkButtonStates = RequiredLinkStates;
+export declare type RequiredLinkButtonStates = RequiredLinkStates & {
+  label: string;
+};
 export declare type OptionalLinkButtonStates = OptionalLinkStates & KoliBriButtonVariantCustomClass;
 export declare type LinkButtonStates = Generic.Element.Members<RequiredLinkButtonStates, OptionalLinkButtonStates>;
 export declare const watchTooltipAlignment: (component: Generic.Element.Component, propName: string, value?: TooltipAlignment) => void;

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

@@ -1,4 +1,4 @@
-import { Generic } from '@public-ui/core';
+export declare type KoliBriIconProp = AnyIconFontClass | KoliBriAllIcon;
 export declare type Alignment = 'left' | 'right';
 export declare type AnyIconFontClass = string;
 export declare type KoliBriCustomIcon = {
@@ -12,7 +12,7 @@ export declare type KoliBriHorizontalIcon = {
   right?: AnyIconFontClass | KoliBriCustomIcon;
   left: AnyIconFontClass | KoliBriCustomIcon;
 };
-declare type KoliBriAllIcon = {
+export declare type KoliBriAllIcon = {
   top: AnyIconFontClass | KoliBriCustomIcon;
   right?: AnyIconFontClass | KoliBriCustomIcon;
   bottom?: AnyIconFontClass | KoliBriCustomIcon;
@@ -33,8 +33,9 @@ declare type KoliBriAllIcon = {
   bottom?: AnyIconFontClass | KoliBriCustomIcon;
   left: AnyIconFontClass | KoliBriCustomIcon;
 };
-export declare type KoliBriIconProp = AnyIconFontClass | KoliBriAllIcon;
-export declare const isIcon: (value?: unknown) => boolean;
-export declare const watchIcon: (component: Generic.Element.Component, value?: KoliBriIconProp) => void;
-export declare const watchIconAlign: (component: Generic.Element.Component, value?: Alignment) => void;
-export {};
+export declare type KoliBriIconState = {
+  top?: AnyIconFontClass | KoliBriCustomIcon;
+  right?: AnyIconFontClass | KoliBriCustomIcon;
+  bottom?: AnyIconFontClass | KoliBriCustomIcon;
+  left?: AnyIconFontClass | KoliBriCustomIcon;
+};

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

@@ -9,7 +9,6 @@ declare type SetStateHooks = {
 };
 export declare const setState: <T>(component: Generic.Element.Component, propName: string, value?: T | undefined, hooks?: SetStateHooks) => void;
 declare type WatchOptions = {
-  allowNull?: boolean;
   defaultValue?: unknown;
   hooks?: SetStateHooks;
   required?: boolean;
@@ -21,7 +20,7 @@ declare type WatchStringOptions = WatchOptions & {
   defaultValue?: string | null;
   minLength?: number;
 };
-declare type WatchNumberOptions = WatchOptions & {
+export declare type WatchNumberOptions = WatchOptions & {
   defaultValue?: number | null;
   min?: number;
   max?: number;

package/dist/types/utils/testing.d.ts

@@ -0,0 +1 @@
+export declare const reflectAttrs: (_props: Record<string, unknown>, _defaults?: Record<string, unknown>, _filter?: string[]) => string;

package/dist/types/utils/validator.d.ts

@@ -1,3 +1,4 @@
+export declare const isObject: (value: unknown) => boolean;
 export declare const isString: (value: unknown, minLength?: number) => boolean;
 export declare const isStyle: (style?: Record<string, string>) => boolean;
 export declare const STATE_CHANGE_EVENT: Event;

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

@@ -0,0 +1,6 @@
+import { Generic } from '@public-ui/core';
+import { Alignment, KoliBriIconProp, KoliBriIconState } from '../../types/icon';
+export declare const mapIconProp2State: (icon: KoliBriIconProp, iconAlign?: Alignment) => KoliBriIconState;
+export declare const isIcon: (value?: unknown) => boolean;
+export declare const validateIcon: (component: Generic.Element.Component, value?: KoliBriIconProp) => void;
+export declare const watchIconAlign: (component: Generic.Element.Component, value?: Alignment) => void;

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

@@ -0,0 +1,3 @@
+import { Generic } from '@public-ui/core';
+export declare const validateAriaLabel: (component: Generic.Element.Component, value?: string) => void;
+export declare const validateLabel: (component: Generic.Element.Component, value?: string) => void;

package/dist/types/utils/validators/tab-index.d.ts

@@ -0,0 +1,2 @@
+import { Generic } from '@public-ui/core';
+export declare const validateTabIndex: (component: Generic.Element.Component, value?: number) => void;