@public-ui/components 1.4.2 → 1.5.0-rc.1

package/dist/types/components.d.ts

@@ -17,6 +17,7 @@ import { NavLinkProps } from "./components/link/component";
 import { KoliBriFormCallbacks } from "./components/form/component";
 import { FontAwesome, FontAwesomeOssPrefix } from "./enums/font-awesome";
 import { Icofont } from "./types/icofont";
+import { Loading } from "./utils/validators/loading";
 import { KoliBriHorizontalIcon as KoliBriHorizontalIcon1, Stringified as Stringified1 } from "./components";
 import { InputCheckboxIcon, InputCheckboxVariant } from "./components/input-checkbox/types";
 import { InputTypeOnDefault, InputTypeOnOff, Option, SelectOption } from "./types/input/types";
@@ -48,6 +49,7 @@ export { NavLinkProps } from "./components/link/component";
 export { KoliBriFormCallbacks } from "./components/form/component";
 export { FontAwesome, FontAwesomeOssPrefix } from "./enums/font-awesome";
 export { Icofont } from "./types/icofont";
+export { Loading } from "./utils/validators/loading";
 export { KoliBriHorizontalIcon as KoliBriHorizontalIcon1, Stringified as Stringified1 } from "./components";
 export { InputCheckboxIcon, InputCheckboxVariant } from "./components/input-checkbox/types";
 export { InputTypeOnDefault, InputTypeOnOff, Option, SelectOption } from "./types/input/types";
@@ -441,29 +443,29 @@ export namespace Components {
         /**
           * Gibt den Text der Überschrift an.
          */
-        "_label": string;
+        "_headline": string;
         /**
           * Gibt an, welchen H-Level von 1 bis 6 die Überschrift hat. Oder ob es keine Überschrift ist, sondern nur fett gedruckt.
          */
         "_level"?: HeadingLevel;
         /**
-          * Gibt den Text der zusätzlichen Beschriftung an.
+          * Gibt den Text der zusätzlichen Überschrift an.
          */
-        "_overline"?: string;
+        "_secondaryHeadline"?: string;
     }
     interface KolHeadingWc {
         /**
           * Gibt den Text der Überschrift an.
          */
-        "_label": string;
+        "_headline": string;
         /**
           * Gibt an, welchen H-Level von 1 bis 6 die Überschrift hat. Oder ob es keine Überschrift ist, sondern nur fett gedruckt.
          */
         "_level"?: HeadingLevel;
         /**
-          * Gibt den Text der zusätzlichen Beschriftung an.
+          * Gibt den Text der zusätzlichen Überschrift an.
          */
-        "_overline"?: string;
+        "_secondaryHeadline"?: string;
     }
     interface KolIcon {
         /**
@@ -520,6 +522,28 @@ export namespace Components {
          */
         "_part"?: string;
     }
+    interface KolImage {
+        /**
+          * Gibt den alternativen Text an.
+         */
+        "_alt": string;
+        /**
+          * Gibt den Lademodus an.
+         */
+        "_loading"?: Loading;
+        /**
+          * ...
+         */
+        "_sizes"?: string;
+        /**
+          * Gibt die Quell-URL an.
+         */
+        "_src": string;
+        /**
+          * Gibt eine Liste von Quell-URLs mit Breiten der Bilder an.
+         */
+        "_srcset"?: string;
+    }
     interface KolIndentedText {
     }
     interface KolInput {
@@ -2299,6 +2323,12 @@ declare global {
         prototype: HTMLKolIconIcofontElement;
         new (): HTMLKolIconIcofontElement;
     };
+    interface HTMLKolImageElement extends Components.KolImage, HTMLStencilElement {
+    }
+    var HTMLKolImageElement: {
+        prototype: HTMLKolImageElement;
+        new (): HTMLKolImageElement;
+    };
     interface HTMLKolIndentedTextElement extends Components.KolIndentedText, HTMLStencilElement {
     }
     var HTMLKolIndentedTextElement: {
@@ -2540,6 +2570,7 @@ declare global {
         "kol-icon": HTMLKolIconElement;
         "kol-icon-font-awesome": HTMLKolIconFontAwesomeElement;
         "kol-icon-icofont": HTMLKolIconIcofontElement;
+        "kol-image": HTMLKolImageElement;
         "kol-indented-text": HTMLKolIndentedTextElement;
         "kol-input": HTMLKolInputElement;
         "kol-input-adapter-leanup": HTMLKolInputAdapterLeanupElement;
@@ -2952,29 +2983,29 @@ declare namespace LocalJSX {
         /**
           * Gibt den Text der Überschrift an.
          */
-        "_label": string;
+        "_headline": string;
         /**
           * Gibt an, welchen H-Level von 1 bis 6 die Überschrift hat. Oder ob es keine Überschrift ist, sondern nur fett gedruckt.
          */
         "_level"?: HeadingLevel;
         /**
-          * Gibt den Text der zusätzlichen Beschriftung an.
+          * Gibt den Text der zusätzlichen Überschrift an.
          */
-        "_overline"?: string;
+        "_secondaryHeadline"?: string;
     }
     interface KolHeadingWc {
         /**
           * Gibt den Text der Überschrift an.
          */
-        "_label": string;
+        "_headline": string;
         /**
           * Gibt an, welchen H-Level von 1 bis 6 die Überschrift hat. Oder ob es keine Überschrift ist, sondern nur fett gedruckt.
          */
         "_level"?: HeadingLevel;
         /**
-          * Gibt den Text der zusätzlichen Beschriftung an.
+          * Gibt den Text der zusätzlichen Überschrift an.
          */
-        "_overline"?: string;
+        "_secondaryHeadline"?: string;
     }
     interface KolIcon {
         /**
@@ -3031,6 +3062,28 @@ declare namespace LocalJSX {
          */
         "_part"?: string;
     }
+    interface KolImage {
+        /**
+          * Gibt den alternativen Text an.
+         */
+        "_alt": string;
+        /**
+          * Gibt den Lademodus an.
+         */
+        "_loading"?: Loading;
+        /**
+          * ...
+         */
+        "_sizes"?: string;
+        /**
+          * Gibt die Quell-URL an.
+         */
+        "_src": string;
+        /**
+          * Gibt eine Liste von Quell-URLs mit Breiten der Bilder an.
+         */
+        "_srcset"?: string;
+    }
     interface KolIndentedText {
     }
     interface KolInput {
@@ -4713,6 +4766,7 @@ declare namespace LocalJSX {
         "kol-icon": KolIcon;
         "kol-icon-font-awesome": KolIconFontAwesome;
         "kol-icon-icofont": KolIconIcofont;
+        "kol-image": KolImage;
         "kol-indented-text": KolIndentedText;
         "kol-input": KolInput;
         "kol-input-adapter-leanup": KolInputAdapterLeanup;
@@ -4779,6 +4833,7 @@ declare module "@stencil/core" {
              * @deprecated Wir empfehlen die flexiblere KolIcon-Komponente zu verwenden.
              */
             "kol-icon-icofont": LocalJSX.KolIconIcofont & JSXBase.HTMLAttributes<HTMLKolIconIcofontElement>;
+            "kol-image": LocalJSX.KolImage & JSXBase.HTMLAttributes<HTMLKolImageElement>;
             "kol-indented-text": LocalJSX.KolIndentedText & JSXBase.HTMLAttributes<HTMLKolIndentedTextElement>;
             "kol-input": LocalJSX.KolInput & JSXBase.HTMLAttributes<HTMLKolInputElement>;
             /**

package/dist/types/core/i18n.d.ts

@@ -0,0 +1,18 @@
+import { Generic } from '@a11y-ui/core';
+interface ITranslationOptions {
+  count?: number;
+  placeholders?: {
+    [K: string]: string;
+  };
+}
+export interface II18nService {
+  addResourceBundle: (lng: Generic.I18n.Locale.ISO_639_1, translationMap: Generic.I18n.Map<string, string>) => void;
+  translate: (key: string, options?: ITranslationOptions) => string;
+}
+export declare class I18nextService implements II18nService {
+  private i18next;
+  constructor(lng: Generic.I18n.Locale.ISO_639_1, translations?: Generic.I18n.RegisterPatch<Generic.I18n.Locale.ISO_639_1, string, string> | Generic.I18n.RegisterPatch<Generic.I18n.Locale.ISO_639_1, string, string>[] | Set<Generic.I18n.RegisterPatch<Generic.I18n.Locale.ISO_639_1, string, string>>);
+  addResourceBundle(lng: Generic.I18n.Locale.ISO_639_1, translationMap: Generic.I18n.Map<string, string>): void;
+  translate(key: string, options?: ITranslationOptions): string;
+}
+export {};

package/dist/types/core/index.d.ts

@@ -0,0 +1,4 @@
+import type { Generic, LoaderCallback, RegisterOptions } from '@a11y-ui/core';
+import { II18nService } from './i18n';
+export declare const register: (themes: Generic.Theming.RegisterPatch<string, string, string> | Generic.Theming.RegisterPatch<string, string, string>[] | Set<Generic.Theming.RegisterPatch<string, string, string>>, loaders: LoaderCallback | LoaderCallback[] | Set<LoaderCallback>, options?: RegisterOptions) => Promise<void[]>;
+export declare const getI18nService: () => II18nService | undefined;

package/dist/types/enums/bund.d.ts

@@ -1,6 +1,6 @@
 export declare enum Bundesministerium {
   'Die Bundesregierung' = "BReg",
-  'Bundesministerium der Finanzen' = "DEFAULT",
+  'Bundesministerium der Finanzen' = "BMF",
   'Bundesministerium des Innern, für Bau und Heimat' = "BMI",
   'Auswärtiges Amt' = "AA",
   'Bundesministerium für Wirtschaft und Energie' = "BMWi",
@@ -27,7 +27,7 @@ export declare enum Bundesamt {
   'Bundesamt für Justiz' = "BfJ",
   'Bundesamt für Kartographie und Geodäsie' = "BKG",
   'Bundesamt für kerntechnische Entsorgungssicherheit' = "BASE",
-  'Bundesamt für Migration und Flüchtlinge' = "DEFAULT",
+  'Bundesamt für Migration und Flüchtlinge' = "BAMF",
   'Bundesamt für Sicherheit in der Informationstechnik' = "BSI",
   'Bundesamt für Verbraucherschutz und Lebensmittelsicherheit' = "BVL",
   'Bundesamt für Verfassungsschutz' = "BfV",

package/dist/types/global/script.d.ts

@@ -1,2 +1,2 @@
-declare const _default: () => void;
+declare const _default: () => Promise<void>;
 export default _default;

package/dist/types/index.d.ts

@@ -1 +1 @@
-export*from"./components";export*from"./enums/bund";export*from"./kolibri";export{configKoliBri}from"./utils/dev.utils";export{Optgroup,Option,SelectOption}from"./types/input/types";export{KoliBriDevHelper}from"./utils/prop.validators";export{ToasterService}from"./components/toast/toaster";export{translations}from"./i18n";export{register}from"@public-ui/core";
+export{register}from"./core";export*from"./components";export*from"./enums/bund";export*from"./kolibri";export*from"./schema";export{configKoliBri}from"./utils/dev.utils";export{Optgroup,Option,SelectOption}from"./types/input/types";export{KoliBriDevHelper}from"./utils/prop.validators";export{ToasterService}from"./components/toast/toaster";export{translations}from"./i18n";

package/dist/types/schema/i18n-keys.d.ts

@@ -0,0 +1,29 @@
+export declare enum KeyEnum {
+  'error' = 0,
+  'warning' = 1,
+  'info' = 2,
+  'success' = 3,
+  'message' = 4,
+  'close' = 5,
+  'form-description' = 6,
+  'of' = 7,
+  'characters' = 8,
+  'new' = 9,
+  'no-entries' = 10,
+  'change-order' = 11,
+  'action-running' = 12,
+  'action-done' = 13,
+  'page-first' = 14,
+  'page-back' = 15,
+  'page-next' = 16,
+  'page-last' = 17,
+  'entries-per-site' = 18,
+  'page-current' = 19,
+  'page-selected' = 20,
+  'page-per-site' = 21,
+  'nav-maximize' = 22,
+  'nav-minimize' = 23,
+  'logo-description' = 24,
+  'open-link-in-tab' = 25,
+  'kolibri-logo' = 26
+}

package/dist/types/schema/index.d.ts

@@ -0,0 +1,2 @@
+import { Theme } from '@a11y-ui/core';
+export declare const KoliBri: Theme<"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", "symbol" | "card" | "abbr" | "button" | "details" | "dialog" | "form" | "link" | "nav" | "progress" | "select" | "table" | "textarea" | "image" | "heading" | "accordion" | "icon" | "badge" | "tabs" | "accordion-group" | "alert" | "avatar" | "breadcrumb" | "button-group" | "button-link" | "dropdown" | "indented-text" | "input-checkbox" | "input-color" | "input-date" | "input-file" | "input-email" | "input-number" | "input-password" | "input-radio" | "input-range" | "input-text" | "link-button" | "link-group" | "modal" | "pagination" | "popover" | "separator" | "skip-nav" | "spin" | "toast" | "toolbar" | "tooltip">;

package/dist/types/schema/tag-names.d.ts

@@ -0,0 +1,50 @@
+export declare enum TagEnum {
+  'abbr' = 0,
+  'accordion' = 1,
+  'accordion-group' = 2,
+  'alert' = 3,
+  'avatar' = 4,
+  'badge' = 5,
+  'breadcrumb' = 6,
+  'button' = 7,
+  'button-group' = 8,
+  'button-link' = 9,
+  'card' = 10,
+  'details' = 11,
+  'dialog' = 12,
+  'dropdown' = 13,
+  'form' = 14,
+  'heading' = 15,
+  'icon' = 16,
+  'image' = 17,
+  'indented-text' = 18,
+  'input-checkbox' = 19,
+  'input-color' = 20,
+  'input-date' = 21,
+  'input-file' = 22,
+  'input-email' = 23,
+  'input-number' = 24,
+  'input-password' = 25,
+  'input-radio' = 26,
+  'input-range' = 27,
+  'input-text' = 28,
+  'link' = 29,
+  'link-button' = 30,
+  'link-group' = 31,
+  'modal' = 32,
+  'nav' = 33,
+  'pagination' = 34,
+  'popover' = 35,
+  'progress' = 36,
+  'select' = 37,
+  'separator' = 38,
+  'skip-nav' = 39,
+  'spin' = 40,
+  'symbol' = 41,
+  'table' = 42,
+  'tabs' = 43,
+  'textarea' = 44,
+  'toast' = 45,
+  'toolbar' = 46,
+  'tooltip' = 47
+}

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

@@ -24,22 +24,22 @@ type OptionalButtonAndLinkProps = {
   tooltipAlign: Alignment;
 };
 type RequiredButtonAndLinkStates = {
-  ariaLabel: string;
   icon: {
     top?: KoliBriCustomIcon;
     right?: KoliBriCustomIcon;
     bottom?: KoliBriCustomIcon;
     left?: KoliBriCustomIcon;
   };
-  iconAlign: Alignment;
   label: string;
 };
 type OptionalButtonAndLinkStates = {
+  ariaLabel: string;
   ariaControls: string;
   ariaCurrent: AriaCurrent;
   ariaExpanded: boolean;
   ariaSelected: boolean;
   disabled: boolean;
+  iconAlign: Alignment;
   iconOnly: boolean;
   role: AlternativButtonLinkRole;
   tabIndex: number;
@@ -51,10 +51,12 @@ export type KoliBriButtonCallbacks<T> = {
   [Events.onClick]?: EventValueOrEventCallback<MouseEvent, T>;
   [Events.onMouseDown]?: EventCallback<MouseEvent>;
 };
-export type KoliBriButtonVariantCustomClass = {
-  customClass: string;
+export type KoliBriButtonVariantPropState = {
   variant: KoliBriButtonVariant;
 };
+export type KoliBriButtonCustomClassPropState = {
+  customClass: string;
+};
 export type RequiredButtonLinkProps = RequiredButtonAndLinkProps;
 export type OptionalButtonLinkProps = OptionalButtonAndLinkProps & {
   accessKey: string;
@@ -63,20 +65,20 @@ export type OptionalButtonLinkProps = OptionalButtonAndLinkProps & {
   type: KoliBriButtonType;
   value: Stringified<unknown>;
 };
-type RequiredButtonLinkStates = RequiredButtonAndLinkStates & {
+type RequiredButtonLinkStates = RequiredButtonAndLinkStates & KoliBriButtonVariantPropState & {
   type: KoliBriButtonType;
 };
-type OptionalButtonLinkStates = OptionalButtonAndLinkStates & KoliBriButtonVariantCustomClass & {
+type OptionalButtonLinkStates = OptionalButtonAndLinkStates & KoliBriButtonCustomClassPropState & {
   accessKey: string;
   id: string;
   on: KoliBriButtonCallbacks<unknown>;
   value: unknown;
 };
 export type RequiredButtonProps = RequiredButtonLinkProps;
-export type OptionalButtonProps = OptionalButtonLinkProps & KoliBriButtonVariantCustomClass;
+export type OptionalButtonProps = OptionalButtonLinkProps & KoliBriButtonVariantPropState & KoliBriButtonCustomClassPropState;
 export type ButtonProps = Generic.Element.Members<RequiredButtonProps, OptionalButtonProps>;
-export type RequiredButtonStates = RequiredButtonLinkStates;
-export type OptionalButtonStates = OptionalButtonLinkStates & KoliBriButtonVariantCustomClass;
+export type RequiredButtonStates = RequiredButtonLinkStates & KoliBriButtonVariantPropState;
+export type OptionalButtonStates = OptionalButtonLinkStates & KoliBriButtonCustomClassPropState;
 export type ButtonStates = Generic.Element.Members<RequiredButtonStates, OptionalButtonStates>;
 export type LinkOnCallbacks = {
   [Events.onClick]?: EventValueOrEventCallback<Event, string>;
@@ -109,9 +111,9 @@ export type OptionalLinkStates = OptionalButtonAndLinkStates & {
 };
 export type LinkStates = Generic.Element.Members<RequiredLinkStates, OptionalLinkStates>;
 export type RequiredLinkButtonProps = RequiredLinkProps;
-export type OptionalLinkButtonProps = OptionalLinkProps & KoliBriButtonVariantCustomClass;
-export type RequiredLinkButtonStates = unknown;
-export type OptionalLinkButtonStates = KoliBriButtonVariantCustomClass;
+export type OptionalLinkButtonProps = OptionalLinkProps & KoliBriButtonVariantPropState & KoliBriButtonCustomClassPropState;
+export type RequiredLinkButtonStates = KoliBriButtonVariantPropState;
+export type OptionalLinkButtonStates = KoliBriButtonCustomClassPropState;
 export type LinkButtonStates = Generic.Element.Members<RequiredLinkButtonStates, OptionalLinkButtonStates>;
 export declare const watchTooltipAlignment: (component: Generic.Element.Component, propName: string, value?: Alignment) => void;
 export {};

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

@@ -26,7 +26,7 @@ export type WatchNumberOptions = WatchOptions & {
   min?: number;
   max?: number;
 };
-export declare const watchValidator: <T>(component: Generic.Element.Component, propName: string, validationFunction: (value?: T | undefined) => boolean, requiredGeneric: Set<string | null | undefined>, value?: T | undefined, options?: WatchOptions) => void;
+export declare function watchValidator<T>(component: Generic.Element.Component, propName: string, validationFunction: (value?: T) => boolean, requiredGeneric: Set<string | null | undefined>, value?: T, options?: WatchOptions): void;
 export declare const watchBoolean: (component: Generic.Element.Component, propName: string, value?: boolean, options?: WatchBooleanOptions) => void;
 export declare const watchString: (component: Generic.Element.Component, propName: string, value?: string, options?: WatchStringOptions) => void;
 export declare const watchNumber: (component: Generic.Element.Component, propName: string, value?: number, options?: WatchNumberOptions) => void;

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

@@ -0,0 +1,3 @@
+import { Generic } from '@a11y-ui/core';
+export type Loading = 'eager' | 'lazy';
+export declare function validateLoading(component: Generic.Element.Component, value?: Loading): void;

package/doc/accordion.md

@@ -152,13 +152,19 @@ Standardansicht gelegt.
 ### Depends on
 
 - [kol-heading-wc](../heading)
-- [kol-icon](../icon)
+- kol-button-wc
 
 ### Graph
 ```mermaid
 graph TD;
   kol-accordion --> kol-heading-wc
-  kol-accordion --> kol-icon
+  kol-accordion --> kol-button-wc
+  kol-button-wc --> kol-span-wc
+  kol-button-wc --> kol-tooltip
+  kol-span-wc --> kol-icon
+  kol-tooltip --> kol-badge
+  kol-badge --> kol-span-wc
+  kol-badge --> kol-button-wc
   style kol-accordion fill:#f9f,stroke:#333,stroke-width:4px
 ```
 

package/doc/badge.md

@@ -103,7 +103,7 @@ Die zusätzliche Ausgabe eines **Icon** gewährleistet, dass der Nutzer auch hie
 | `_icon`               | `_icon`         | Gibt einen Identifier eines Icons aus den Icofont's an. (https://icofont.com/)                           | `string \| undefined \| { top: string \| KoliBriCustomIcon; right?: string \| KoliBriCustomIcon \| undefined; bottom?: string \| KoliBriCustomIcon \| undefined; left?: string \| KoliBriCustomIcon \| undefined; } \| { top?: string \| KoliBriCustomIcon \| undefined; right: string \| KoliBriCustomIcon; bottom?: string \| KoliBriCustomIcon \| undefined; left?: string \| KoliBriCustomIcon \| undefined; } \| { top?: string \| KoliBriCustomIcon \| undefined; right?: string \| KoliBriCustomIcon \| undefined; bottom: string \| KoliBriCustomIcon; left?: string \| KoliBriCustomIcon \| undefined; } \| { top?: string \| KoliBriCustomIcon \| undefined; right?: string \| KoliBriCustomIcon \| undefined; bottom?: string \| KoliBriCustomIcon \| undefined; left: string \| KoliBriCustomIcon; }` | `undefined` |
 | `_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?: AlternativButtonLinkRole \| undefined; _tabIndex?: number \| undefined; _tooltipAlign?: Alignment \| undefined; _accessKey?: string \| undefined; _id?: string \| undefined; _on?: KoliBriButtonCallbacks<unknown> \| undefined; _type?: KoliBriButtonType \| undefined; _value?: unknown; _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?: AlternativButtonLinkRole \| undefined; _tabIndex?: number \| undefined; _tooltipAlign?: Alignment \| undefined; _accessKey?: string \| undefined; _id?: string \| undefined; _on?: KoliBriButtonCallbacks<unknown> \| undefined; _type?: KoliBriButtonType \| undefined; _value?: unknown; _variant?: KoliBriButtonVariant \| undefined; _customClass?: string \| undefined; }`                   | `undefined` |
 
 
 ## CSS Custom Properties

package/doc/button-link.md

@@ -35,7 +35,7 @@ Da der Link, nicht wie der Button, in mehrere Varianten (`primary` oder `seconda
 | `_ariaControls`       | `_aria-controls` | Gibt an, welche Elemente kontrolliert werden.  (https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-controls)                                                                                                                                             | `string \| undefined`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                             | `undefined` |
 | `_ariaCurrent`        | `_aria-current`  | Gibt an, welchen aktuellen Auswahlstatus der Button hat. (https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-current)                                                                                                                                    | `"date" \| "location" \| "page" \| "step" \| "time" \| boolean \| undefined`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                      | `undefined` |
 | `_ariaExpanded`       | `_aria-expanded` | Gibt an, ob durch den Button etwas aufgeklappt wurde. (https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-expanded)                                                                                                                                      | `boolean \| undefined`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                            | `undefined` |
-| `_ariaLabel`          | `_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 | `string \| undefined`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                             | `''`        |
+| `_ariaLabel`          | `_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 | `string \| undefined`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                             | `undefined` |
 | `_ariaSelected`       | `_aria-selected` | Gibt an, ob Element ausgewählt ist (role=tab). (https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-selected)                                                                                                                                             | `boolean \| undefined`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                            | `undefined` |
 | `_disabled`           | `_disabled`      | Gibt an, ob der Button deaktiviert ist.                                                                                                                                                                                                                                               | `boolean \| undefined`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                            | `false`     |
 | `_icon`               | `_icon`          | Gibt den Class-Identifier eines Icons eine eingebunden Icofont an. (z.B. https://icofont.com/)                                                                                                                                                                                        | `string \| undefined \| { top: string \| KoliBriCustomIcon; right?: string \| KoliBriCustomIcon \| undefined; bottom?: string \| KoliBriCustomIcon \| undefined; left?: string \| KoliBriCustomIcon \| undefined; } \| { top?: string \| KoliBriCustomIcon \| undefined; right: string \| KoliBriCustomIcon; bottom?: string \| KoliBriCustomIcon \| undefined; left?: string \| KoliBriCustomIcon \| undefined; } \| { top?: string \| KoliBriCustomIcon \| undefined; right?: string \| KoliBriCustomIcon \| undefined; bottom: string \| KoliBriCustomIcon; left?: string \| KoliBriCustomIcon \| undefined; } \| { top?: string \| KoliBriCustomIcon \| undefined; right?: string \| KoliBriCustomIcon \| undefined; bottom?: string \| KoliBriCustomIcon \| undefined; left: string \| KoliBriCustomIcon; }` | `undefined` |

package/doc/button.md

@@ -142,12 +142,12 @@ Probleme mit Disabled-Status
 | `_ariaControls`       | `_aria-controls` | Gibt an, welche Elemente kontrolliert werden.  (https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-controls)          | `string \| undefined`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                             | `undefined` |
 | `_ariaCurrent`        | `_aria-current`  | Gibt an, welchen aktuellen Auswahlstatus der Button hat. (https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-current) | `"date" \| "location" \| "page" \| "step" \| "time" \| boolean \| undefined`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                      | `undefined` |
 | `_ariaExpanded`       | `_aria-expanded` | Gibt an, ob durch den Button etwas aufgeklappt wurde. (https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-expanded)   | `boolean \| undefined`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                            | `undefined` |
-| `_ariaLabel`          | `_aria-label`    | Gibt einen beschreibenden Text des Buttons an.  (https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-label)            | `string \| undefined`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                             | `''`        |
+| `_ariaLabel`          | `_aria-label`    | Gibt einen beschreibenden Text des Buttons an.  (https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-label)            | `string \| undefined`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                             | `undefined` |
 | `_ariaSelected`       | `_aria-selected` | Gibt an, ob Element ausgewählt ist (role=tab). (https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-selected)          | `boolean \| undefined`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                            | `undefined` |
 | `_customClass`        | `_custom-class`  | Gibt an, welche Custom-Class übergeben werden soll, wenn _variant="custom" gesetzt ist.                                                            | `string \| undefined`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                             | `undefined` |
 | `_disabled`           | `_disabled`      | Gibt an, ob der Button deaktiviert ist.                                                                                                            | `boolean \| undefined`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                            | `false`     |
 | `_icon`               | `_icon`          | Gibt den Class-Identifier eines Icons eine eingebunden Icofont an. (z.B. https://icofont.com/)                                                     | `string \| undefined \| { top: string \| KoliBriCustomIcon; right?: string \| KoliBriCustomIcon \| undefined; bottom?: string \| KoliBriCustomIcon \| undefined; left?: string \| KoliBriCustomIcon \| undefined; } \| { top?: string \| KoliBriCustomIcon \| undefined; right: string \| KoliBriCustomIcon; bottom?: string \| KoliBriCustomIcon \| undefined; left?: string \| KoliBriCustomIcon \| undefined; } \| { top?: string \| KoliBriCustomIcon \| undefined; right?: string \| KoliBriCustomIcon \| undefined; bottom: string \| KoliBriCustomIcon; left?: string \| KoliBriCustomIcon \| undefined; } \| { top?: string \| KoliBriCustomIcon \| undefined; right?: string \| KoliBriCustomIcon \| undefined; bottom?: string \| KoliBriCustomIcon \| undefined; left: string \| KoliBriCustomIcon; }` | `undefined` |
-| `_iconAlign`          | `_icon-align`    | <span class="text-red-500">**[DEPRECATED]**</span> <br/><br/>Gibt an, ob das Icon links oder rechts dargestellt werden soll.                          | `"bottom" \| "left" \| "right" \| "top" \| undefined`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                             | `'left'`    |
+| `_iconAlign`          | `_icon-align`    | <span class="text-red-500">**[DEPRECATED]**</span> <br/><br/>Gibt an, ob das Icon links oder rechts dargestellt werden soll.                          | `"bottom" \| "left" \| "right" \| "top" \| undefined`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                             | `undefined` |
 | `_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` |

package/doc/heading.md

@@ -35,11 +35,11 @@ Geben Sie mit dem Attribut `_level` das H-Element an, das Sie ausgeben möchten.
 
 ## Properties
 
-| Property              | Attribute   | Description                                                                                                            | Type                                           | Default     |
-| --------------------- | ----------- | ---------------------------------------------------------------------------------------------------------------------- | ---------------------------------------------- | ----------- |
-| `_label` _(required)_ | `_label`    | Gibt den Text der Überschrift an.                                                                                      | `string`                                       | `undefined` |
-| `_level`              | `_level`    | Gibt an, welchen H-Level von 1 bis 6 die Überschrift hat. Oder ob es keine Überschrift ist, sondern nur fett gedruckt. | `0 \| 1 \| 2 \| 3 \| 4 \| 5 \| 6 \| undefined` | `1`         |
-| `_overline`           | `_overline` | Gibt den Text der zusätzlichen Beschriftung an.                                                                        | `string \| undefined`                          | `''`        |
+| Property                 | Attribute             | Description                                                                                                            | Type                                           | Default     |
+| ------------------------ | --------------------- | ---------------------------------------------------------------------------------------------------------------------- | ---------------------------------------------- | ----------- |
+| `_headline` _(required)_ | `_headline`           | Gibt den Text der Überschrift an.                                                                                      | `string`                                       | `undefined` |
+| `_level`                 | `_level`              | Gibt an, welchen H-Level von 1 bis 6 die Überschrift hat. Oder ob es keine Überschrift ist, sondern nur fett gedruckt. | `0 \| 1 \| 2 \| 3 \| 4 \| 5 \| 6 \| undefined` | `1`         |
+| `_secondaryHeadline`     | `_secondary-headline` | Gibt den Text der zusätzlichen Überschrift an.                                                                         | `string \| undefined`                          | `undefined` |
 
 
 ## Dependencies