@public-ui/components 1.6.0-rc.3 → 1.6.0-rc.5

package/dist/types/components/version/types.d.ts

@@ -0,0 +1,11 @@
+import { Generic } from '@a11y-ui/core';
+type RequiredProps = {
+  version: string;
+};
+type OptionalProps = unknown;
+export type KoliBriVersionProps = Generic.Element.Members<RequiredProps, OptionalProps>;
+type RequiredStates = RequiredProps;
+type OptionalStates = OptionalProps;
+export type KoliBriVersionStates = Generic.Element.Members<RequiredStates, OptionalStates>;
+export type KoliBriVersionAPI = Generic.Element.ComponentApi<RequiredProps, OptionalProps, RequiredStates, OptionalStates>;
+export {};

package/dist/types/components.d.ts

@@ -14,7 +14,7 @@ import { PropColor } from "./types/props/color";
 import { KoliBriHorizontalIcon, KoliBriIconProp } from "./types/icon";
 import { AlternativButtonLinkRole, ButtonProps, KoliBriButtonCallbacks, KoliBriButtonType, KoliBriButtonVariant, LinkOnCallbacks, LinkProps, LinkTarget, LinkUseCase } from "./types/button-link";
 import { ButtonOrLinkOrTextWithChildrenProps } from "./types/button-link-text";
-import { KoliBriFormCallbacks } from "./components/form/component";
+import { KoliBriFormCallbacks } from "./components/form/types";
 import { FontAwesome, FontAwesomeOssPrefix } from "./enums/font-awesome";
 import { Icofont } from "./types/icofont";
 import { Loading } from "./utils/validators/loading";
@@ -26,18 +26,17 @@ import { W3CInputValue } from "./types/w3c";
 import { Orientation } from "./types/orientation";
 import { InputTextType } from "./types/input/control/text";
 import { Stringified as Stringified1 } from "./components";
-import { ListStyleType } from "./components/link-group/component";
+import { ListStyleType } from "./components/link-group/types";
 import { Bundesamt, Bundesanstalt, Bundesministerium } from "./enums/bund";
 import { KoliBriModalEventCallbacks } from "./types/modal";
 import { KoliBriNavVariant } from "./components/nav/component";
-import { PaginationHasButton } from "./components/pagination/component";
-import { KoliBriPaginationButtonCallbacks } from "./components/pagination/types";
+import { KoliBriPaginationButtonCallbacks, PaginationHasButton } from "./components/pagination/types";
 import { KoliBriProgressType } from "./types/progress";
 import { KoliBriQuoteVariant } from "./components/quote/types";
 import { SpinVariant } from "./types/props/variant/spin";
 import { KoliBriSplitButtonCallback } from "./components/split-button/types";
-import { KoliBriDataType, KoliBriTableHeaders, KoliBriTablePaginationProps } from "./types/table";
-import { KoliBriTabsCallbacks, TabButtonProps } from "./components/tabs/component";
+import { KoliBriTableDataType, KoliBriTableHeaders, KoliBriTablePaginationProps } from "./components/table/types";
+import { KoliBriTabsCallbacks, TabButtonProps } from "./components/tabs/types";
 import { CSSResize } from "./components/textarea/types";
 import { KoliBriToastEventCallbacks } from "./types/toast";
 export { Align, AriaCurrent } from "./types/props";
@@ -49,7 +48,7 @@ export { PropColor } from "./types/props/color";
 export { KoliBriHorizontalIcon, KoliBriIconProp } from "./types/icon";
 export { AlternativButtonLinkRole, ButtonProps, KoliBriButtonCallbacks, KoliBriButtonType, KoliBriButtonVariant, LinkOnCallbacks, LinkProps, LinkTarget, LinkUseCase } from "./types/button-link";
 export { ButtonOrLinkOrTextWithChildrenProps } from "./types/button-link-text";
-export { KoliBriFormCallbacks } from "./components/form/component";
+export { KoliBriFormCallbacks } from "./components/form/types";
 export { FontAwesome, FontAwesomeOssPrefix } from "./enums/font-awesome";
 export { Icofont } from "./types/icofont";
 export { Loading } from "./utils/validators/loading";
@@ -61,18 +60,17 @@ export { W3CInputValue } from "./types/w3c";
 export { Orientation } from "./types/orientation";
 export { InputTextType } from "./types/input/control/text";
 export { Stringified as Stringified1 } from "./components";
-export { ListStyleType } from "./components/link-group/component";
+export { ListStyleType } from "./components/link-group/types";
 export { Bundesamt, Bundesanstalt, Bundesministerium } from "./enums/bund";
 export { KoliBriModalEventCallbacks } from "./types/modal";
 export { KoliBriNavVariant } from "./components/nav/component";
-export { PaginationHasButton } from "./components/pagination/component";
-export { KoliBriPaginationButtonCallbacks } from "./components/pagination/types";
+export { KoliBriPaginationButtonCallbacks, PaginationHasButton } from "./components/pagination/types";
 export { KoliBriProgressType } from "./types/progress";
 export { KoliBriQuoteVariant } from "./components/quote/types";
 export { SpinVariant } from "./types/props/variant/spin";
 export { KoliBriSplitButtonCallback } from "./components/split-button/types";
-export { KoliBriDataType, KoliBriTableHeaders, KoliBriTablePaginationProps } from "./types/table";
-export { KoliBriTabsCallbacks, TabButtonProps } from "./components/tabs/component";
+export { KoliBriTableDataType, KoliBriTableHeaders, KoliBriTablePaginationProps } from "./components/table/types";
+export { KoliBriTabsCallbacks, TabButtonProps } from "./components/tabs/types";
 export { CSSResize } from "./components/textarea/types";
 export { KoliBriToastEventCallbacks } from "./types/toast";
 export namespace Components {
@@ -664,6 +662,10 @@ export namespace Components {
           * Macht das Eingabeelement zu einem Pflichtfeld.
          */
         "_required"?: boolean;
+        /**
+          * Ermöglicht den Slotnamen zu bestimmen. Wird nur verwendet, wenn sonst mehrere Slots mit dem gleichen Namen innerhalb eines ShadowDOMs existieren würden.
+         */
+        "_slotName"?: string;
         /**
           * Ermöglicht eine Schaltfläche ins das Eingabefeld mit einer beliebigen Aktion zu einzufügen (ohne label).
          */
@@ -735,6 +737,10 @@ export namespace Components {
           * Macht das Eingabeelement zu einem Pflichtfeld.
          */
         "_required"?: boolean;
+        /**
+          * Selector for synchronizing the value with another input element.
+         */
+        "_syncValueBySelector"?: string;
         /**
           * Gibt an, welchen Tab-Index das primäre Element in der Komponente hat. (https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/tabindex)
          */
@@ -814,6 +820,10 @@ export namespace Components {
           * Ermöglicht eine Schaltfläche ins das Eingabefeld mit einer beliebigen Aktion zu einzufügen (ohne label).
          */
         "_smartButton"?: ButtonProps;
+        /**
+          * Selector for synchronizing the value with another input element.
+         */
+        "_syncValueBySelector"?: string;
         /**
           * Gibt an, welchen Tab-Index das primäre Element in der Komponente hat. (https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/tabindex)
          */
@@ -904,6 +914,10 @@ export namespace Components {
           * Gibt die Schrittweite der Wertveränderung an.
          */
         "_step"?: number;
+        /**
+          * Selector for synchronizing the value with another input element.
+         */
+        "_syncValueBySelector"?: string;
         /**
           * Gibt an, welchen Tab-Index das primäre Element in der Komponente hat. (https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/tabindex)
          */
@@ -1006,6 +1020,10 @@ export namespace Components {
           * Ermöglicht eine Schaltfläche ins das Eingabefeld mit einer beliebigen Aktion zu einzufügen (ohne label).
          */
         "_smartButton"?: ButtonProps;
+        /**
+          * Selector for synchronizing the value with another input element.
+         */
+        "_syncValueBySelector"?: string;
         /**
           * Gibt an, welchen Tab-Index das primäre Element in der Komponente hat. (https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/tabindex)
          */
@@ -1080,6 +1098,10 @@ export namespace Components {
           * Ermöglicht eine Schaltfläche ins das Eingabefeld mit einer beliebigen Aktion zu einzufügen (ohne label).
          */
         "_smartButton"?: ButtonProps;
+        /**
+          * Selector for synchronizing the value with another input element.
+         */
+        "_syncValueBySelector"?: string;
         /**
           * Gibt an, welchen Tab-Index das primäre Element in der Komponente hat. (https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/tabindex)
          */
@@ -1174,6 +1196,10 @@ export namespace Components {
           * Gibt die Schrittweite der Wertveränderung an.
          */
         "_step"?: number;
+        /**
+          * Selector for synchronizing the value with another input element.
+         */
+        "_syncValueBySelector"?: string;
         /**
           * Gibt an, welchen Tab-Index das primäre Element in der Komponente hat. (https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/tabindex)
          */
@@ -1269,6 +1295,10 @@ export namespace Components {
           * Ermöglicht eine Schaltfläche ins das Eingabefeld mit einer beliebigen Aktion zu einzufügen (ohne label).
          */
         "_smartButton"?: ButtonProps;
+        /**
+          * Selector for synchronizing the value with another input element.
+         */
+        "_syncValueBySelector"?: string;
         /**
           * Gibt an, welchen Tab-Index das primäre Element in der Komponente hat. (https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/tabindex)
          */
@@ -1335,6 +1365,10 @@ export namespace Components {
           * Macht das Eingabeelement zu einem Pflichtfeld.
          */
         "_required"?: boolean;
+        /**
+          * Selector for synchronizing the value with another input element.
+         */
+        "_syncValueBySelector"?: string;
         /**
           * Gibt an, welchen Tab-Index das primäre Element in der Komponente hat. (https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/tabindex)
          */
@@ -1482,6 +1516,10 @@ export namespace Components {
           * Gibt die Schrittweite der Wertveränderung an.
          */
         "_step"?: number;
+        /**
+          * Selector for synchronizing the value with another input element.
+         */
+        "_syncValueBySelector"?: string;
         /**
           * Gibt an, welchen Tab-Index das primäre Element in der Komponente hat. (https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/tabindex)
          */
@@ -1576,6 +1614,10 @@ export namespace Components {
           * Ermöglicht eine Schaltfläche ins das Eingabefeld mit einer beliebigen Aktion zu einzufügen (ohne label).
          */
         "_smartButton"?: ButtonProps;
+        /**
+          * Selector for synchronizing the value with another input element.
+         */
+        "_syncValueBySelector"?: string;
         /**
           * Gibt an, welchen Tab-Index das primäre Element in der Komponente hat. (https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/tabindex)
          */
@@ -2147,6 +2189,10 @@ export namespace Components {
           * Wechselt das Eingabeelement in den Auswahlfeld modus und setzt die Höhe des Feldes.
          */
         "_size"?: number;
+        /**
+          * Selector for synchronizing the value with another input element.
+         */
+        "_syncValueBySelector"?: string;
         /**
           * Gibt an, welchen Tab-Index das primäre Element in der Komponente hat. (https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/tabindex)
          */
@@ -2319,11 +2365,11 @@ export namespace Components {
         /**
           * Gibt die Daten an, die für die Erstellung der Tabelle verwendet werden.
          */
-        "_data": Stringified<KoliBriDataType[]>;
+        "_data": Stringified<KoliBriTableDataType[]>;
         /**
           * Hier können die Daten für die Fußzeile der Tabelle übergeben werden.
          */
-        "_dataFoot"?: Stringified<KoliBriDataType[]>;
+        "_dataFoot"?: Stringified<KoliBriTableDataType[]>;
         /**
           * Gibt die horizontalen und vertikalen Header für die Tabelle an.
          */
@@ -2432,6 +2478,10 @@ export namespace Components {
           * Gibt die Anzahl der anzuzeigenden Zeilen des Eingabefeldes an.
          */
         "_rows"?: number;
+        /**
+          * Selector for synchronizing the value with another input element.
+         */
+        "_syncValueBySelector"?: string;
         /**
           * Gibt an, welchen Tab-Index das primäre Element in der Komponente hat. (https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/tabindex)
          */
@@ -5183,11 +5233,11 @@ declare namespace LocalJSX {
         /**
           * Gibt die Daten an, die für die Erstellung der Tabelle verwendet werden.
          */
-        "_data": Stringified<KoliBriDataType[]>;
+        "_data": Stringified<KoliBriTableDataType[]>;
         /**
           * Hier können die Daten für die Fußzeile der Tabelle übergeben werden.
          */
-        "_dataFoot"?: Stringified<KoliBriDataType[]>;
+        "_dataFoot"?: Stringified<KoliBriTableDataType[]>;
         /**
           * Gibt die horizontalen und vertikalen Header für die Tabelle an.
          */

package/dist/types/i18n.d.ts

@@ -2,7 +2,7 @@ import { Generic } from '@a11y-ui/core';
 import locale_de from './locales/de';
 type ResourcePrefix = 'Kol';
 type ComponentKeys = keyof typeof locale_de;
-export declare const translations: Set<Generic.I18n.RegisterPatch<Generic.I18n.Locale.ISO_639_1, "Kol", "info" | "success" | "warning" | "error" | "of" | "characters" | "message" | "close" | "form-description" | "new" | "no-entries" | "change-order" | "action-running" | "action-done" | "page-first" | "page-back" | "page-next" | "page-last" | "entries-per-site" | "page-current" | "page-selected" | "page-per-site" | "nav-maximize" | "nav-minimize" | "logo-description" | "open-link-in-tab" | "kolibri-logo">>;
+export declare const translations: Set<Generic.I18n.RegisterPatch<Generic.I18n.Locale.ISO_639_1, "Kol", "info" | "success" | "warning" | "error" | "close" | "of" | "characters" | "message" | "form-description" | "new" | "no-entries" | "change-order" | "action-running" | "action-done" | "page-first" | "page-back" | "page-next" | "page-last" | "entries-per-site" | "page-current" | "page-selected" | "page-per-site" | "nav-maximize" | "nav-minimize" | "logo-description" | "open-link-in-tab" | "kolibri-logo">>;
 type Options = {
   count?: number;
   placeholders?: {

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

@@ -83,10 +83,10 @@ export type OptionalLinkProps = OptionalButtonAndLinkProps & {
   useCase: LinkUseCase;
 } & PropDownload & PropStealth;
 export type LinkProps = Generic.Element.Members<RequiredLinkProps, OptionalLinkProps>;
-export type RequiredLinkStates = RequiredButtonAndLinkStates & {
+type RequiredLinkStates = RequiredButtonAndLinkStates & {
   href: string;
 };
-export type OptionalLinkStates = OptionalButtonAndLinkStates & {
+type OptionalLinkStates = OptionalButtonAndLinkStates & {
   ariaSelected: boolean;
   on: LinkOnCallbacks;
   selector: string;
@@ -95,6 +95,7 @@ export type OptionalLinkStates = OptionalButtonAndLinkStates & {
   useCase: LinkUseCase;
 } & PropAriaSelected & PropDownload & PropStealth;
 export type LinkStates = Generic.Element.Members<RequiredLinkStates, OptionalLinkStates>;
+export type KoliBriLinkAPI = Generic.Element.ComponentApi<RequiredLinkProps, OptionalLinkProps, RequiredLinkStates, OptionalLinkStates>;
 export type RequiredLinkButtonProps = RequiredLinkProps;
 export type OptionalLinkButtonProps = OptionalLinkProps & KoliBriButtonVariantPropState & KoliBriButtonCustomClassPropState;
 export declare const watchTooltipAlignment: (component: Generic.Element.Component, propName: string, value?: Align) => void;

package/doc/badge.md

@@ -94,7 +94,7 @@ Die zusätzliche Ausgabe eines **Icon** gewährleistet, dass der Nutzer auch hie
 | `_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`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                     | `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` |
 | `_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` |
 

package/doc/button-link.md

@@ -40,7 +40,7 @@ Da der Link, nicht wie der Button, in mehrere Varianten (`primary` oder `seconda
 | `_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`     | <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`                                                                                                                          | `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

@@ -111,7 +111,7 @@ Probleme mit Disabled-Status
 | `_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`     | <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`                                                                                                                          | `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` |