@public-ui/components 1.5.0-rc.7 → 1.5.0-rc.9

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

@@ -2,49 +2,34 @@ import { Generic } from '@a11y-ui/core';
 import { Events } from '../enums/events';
 import { EventCallback, EventValueOrEventCallback } from './callbacks';
 import { Stringified } from './common';
-import { KoliBriCustomIcon, KoliBriIconProp } from './icon';
-import { Alignment } from './props/alignment';
-export type AriaCurrent = boolean | 'page' | 'step' | 'location' | 'date' | 'time';
+import { KoliBriAllIcon, KoliBriIconProp } from './icon';
+import { PropAlignment, PropAriaCurrent, PropAriaExpanded, PropAriaSelected, PropDisabled, PropStealth } from './props';
+import { PropLabel } from './props/label';
 export type AlternativButtonLinkRole = 'button' | 'link' | 'tab';
-type RequiredButtonAndLinkProps = {
-  label: string;
-};
+type RequiredButtonAndLinkProps = PropLabel;
 type OptionalButtonAndLinkProps = {
   ariaControls: string;
-  ariaCurrent: AriaCurrent;
-  ariaExpanded: boolean;
   ariaLabel: string;
-  ariaSelected: boolean;
-  disabled: boolean;
   icon: Stringified<KoliBriIconProp>;
-  iconAlign: Alignment;
+  iconAlign: PropAlignment;
   iconOnly: boolean;
   role: AlternativButtonLinkRole;
   tabIndex: number;
-  tooltipAlign: Alignment;
-};
+  tooltipAlign: PropAlignment;
+} & PropAriaCurrent & PropAriaExpanded & PropAriaSelected & PropDisabled;
 type RequiredButtonAndLinkStates = {
-  icon: {
-    top?: KoliBriCustomIcon;
-    right?: KoliBriCustomIcon;
-    bottom?: KoliBriCustomIcon;
-    left?: KoliBriCustomIcon;
-  };
+  icon: KoliBriAllIcon;
   label: string;
 };
 type OptionalButtonAndLinkStates = {
   ariaLabel: string;
   ariaControls: string;
-  ariaCurrent: AriaCurrent;
-  ariaExpanded: boolean;
-  ariaSelected: boolean;
-  disabled: boolean;
-  iconAlign: Alignment;
+  iconAlign: PropAlignment;
   iconOnly: boolean;
   role: AlternativButtonLinkRole;
   tabIndex: number;
-  tooltipAlign: Alignment;
-};
+  tooltipAlign: PropAlignment;
+} & PropAriaCurrent & PropAriaExpanded & PropAriaSelected & PropDisabled;
 export type KoliBriButtonType = 'button' | 'reset' | 'submit';
 export type KoliBriButtonVariant = 'primary' | 'secondary' | 'normal' | 'danger' | 'ghost' | 'custom';
 export type KoliBriButtonCallbacks<T> = {
@@ -60,6 +45,7 @@ export type KoliBriButtonCustomClassPropState = {
 export type RequiredButtonLinkProps = RequiredButtonAndLinkProps;
 export type OptionalButtonLinkProps = OptionalButtonAndLinkProps & {
   accessKey: string;
+  disabled: boolean;
   id: string;
   on: KoliBriButtonCallbacks<unknown>;
   type: KoliBriButtonType;
@@ -70,6 +56,7 @@ type RequiredButtonLinkStates = RequiredButtonAndLinkStates & KoliBriButtonVaria
 };
 type OptionalButtonLinkStates = OptionalButtonAndLinkStates & KoliBriButtonCustomClassPropState & {
   accessKey: string;
+  disabled: boolean;
   id: string;
   on: KoliBriButtonCallbacks<unknown>;
   value: unknown;
@@ -89,13 +76,13 @@ export type RequiredLinkProps = RequiredButtonAndLinkProps & {
   href: string;
 };
 export type OptionalLinkProps = OptionalButtonAndLinkProps & {
+  disabled: boolean;
   on: LinkOnCallbacks;
   selector: string;
-  stealth: boolean;
   target: LinkTarget;
   targetDescription: string;
   useCase: LinkUseCase;
-};
+} & PropStealth;
 export type LinkProps = Generic.Element.Members<RequiredLinkProps, OptionalLinkProps>;
 export type RequiredLinkStates = RequiredButtonAndLinkStates & {
   href: string;
@@ -104,16 +91,12 @@ export type OptionalLinkStates = OptionalButtonAndLinkStates & {
   ariaSelected: boolean;
   on: LinkOnCallbacks;
   selector: string;
-  stealth: boolean;
   target: LinkTarget;
   targetDescription: string;
   useCase: LinkUseCase;
-};
+} & PropAriaSelected & PropStealth;
 export type LinkStates = Generic.Element.Members<RequiredLinkStates, OptionalLinkStates>;
 export type RequiredLinkButtonProps = RequiredLinkProps;
 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 declare const watchTooltipAlignment: (component: Generic.Element.Component, propName: string, value?: PropAlignment) => void;
 export {};

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

@@ -1,40 +1,18 @@
-export type KoliBriIconProp = AnyIconFontClass | KoliBriAllIcon;
 export type AnyIconFontClass = string;
 export type KoliBriCustomIcon = {
   icon: AnyIconFontClass;
   style?: Record<string, string>;
 };
+type IconOrIconClass = AnyIconFontClass | KoliBriCustomIcon;
 export type KoliBriHorizontalIcon = {
-  right: AnyIconFontClass | KoliBriCustomIcon;
-  left?: AnyIconFontClass | KoliBriCustomIcon;
-} | {
-  right?: AnyIconFontClass | KoliBriCustomIcon;
-  left: AnyIconFontClass | KoliBriCustomIcon;
-};
-export type KoliBriAllIcon = {
-  top: AnyIconFontClass | KoliBriCustomIcon;
-  right?: AnyIconFontClass | KoliBriCustomIcon;
-  bottom?: AnyIconFontClass | KoliBriCustomIcon;
-  left?: AnyIconFontClass | KoliBriCustomIcon;
-} | {
-  top?: AnyIconFontClass | KoliBriCustomIcon;
-  right: AnyIconFontClass | KoliBriCustomIcon;
-  bottom?: AnyIconFontClass | KoliBriCustomIcon;
-  left?: AnyIconFontClass | KoliBriCustomIcon;
-} | {
-  top?: AnyIconFontClass | KoliBriCustomIcon;
-  right?: AnyIconFontClass | KoliBriCustomIcon;
-  bottom: AnyIconFontClass | KoliBriCustomIcon;
-  left?: AnyIconFontClass | KoliBriCustomIcon;
-} | {
-  top?: AnyIconFontClass | KoliBriCustomIcon;
-  right?: AnyIconFontClass | KoliBriCustomIcon;
-  bottom?: AnyIconFontClass | KoliBriCustomIcon;
-  left: AnyIconFontClass | KoliBriCustomIcon;
+  right?: IconOrIconClass;
+  left?: IconOrIconClass;
 };
-export type KoliBriIconState = {
-  top?: AnyIconFontClass | KoliBriCustomIcon;
-  right?: AnyIconFontClass | KoliBriCustomIcon;
-  bottom?: AnyIconFontClass | KoliBriCustomIcon;
-  left?: AnyIconFontClass | KoliBriCustomIcon;
+type KoliBriVerticalIcon = {
+  top?: IconOrIconClass;
+  bottom?: IconOrIconClass;
 };
+export type KoliBriAllIcon = KoliBriHorizontalIcon & KoliBriVerticalIcon;
+export type KoliBriIconProp = AnyIconFontClass | KoliBriAllIcon;
+export type KoliBriIconState = KoliBriAllIcon;
+export {};

package/dist/types/types/props/adjust-height.d.ts

@@ -0,0 +1,5 @@
+import { Generic } from '@a11y-ui/core';
+export type PropAdjustHeight = {
+  adjustHeight: boolean;
+};
+export declare const validateAdjustHeight: (component: Generic.Element.Component, value?: boolean) => void;

package/dist/types/types/props/alert.d.ts

@@ -0,0 +1,5 @@
+import { Generic } from '@a11y-ui/core';
+export type PropAlert = {
+  alert: boolean;
+};
+export declare const validateAlert: (component: Generic.Element.Component, value?: boolean) => void;

package/dist/types/types/props/alignment.d.ts

@@ -1,4 +1,4 @@
 type HorizontalAlignment = 'left' | 'right';
 type VerticalAlignment = 'top' | 'bottom';
-export type Alignment = HorizontalAlignment | VerticalAlignment;
+export type PropAlignment = HorizontalAlignment | VerticalAlignment;
 export {};

package/dist/types/types/props/aria-current.d.ts

@@ -0,0 +1,6 @@
+import { Generic } from '@a11y-ui/core';
+export type AriaCurrent = 'date' | 'location' | 'page' | 'step' | 'time' | boolean;
+export type PropAriaCurrent = {
+  ariaCurrent: AriaCurrent;
+};
+export declare const validateAriaCurrent: (component: Generic.Element.Component, value?: AriaCurrent) => void;

package/dist/types/types/props/aria-expanded.d.ts

@@ -0,0 +1,5 @@
+import { Generic } from '@a11y-ui/core';
+export type PropAriaExpanded = {
+  ariaExpanded: boolean;
+};
+export declare const validateAriaExpanded: (component: Generic.Element.Component, value?: boolean) => void;

package/dist/types/types/props/aria-selected.d.ts

@@ -0,0 +1,5 @@
+import { Generic } from '@a11y-ui/core';
+export type PropAriaSelected = {
+  ariaSelected: boolean;
+};
+export declare const validateAriaSelected: (component: Generic.Element.Component, value?: boolean) => void;

package/dist/types/types/props/checked.d.ts

@@ -0,0 +1,5 @@
+import { Generic } from '@a11y-ui/core';
+export type PropChecked = {
+  checked: boolean;
+};
+export declare const validateChecked: (component: Generic.Element.Component, value?: boolean) => void;

package/dist/types/types/props/collapsible.d.ts

@@ -0,0 +1,5 @@
+import { Generic } from '@a11y-ui/core';
+export type PropCollapsible = {
+  collapsible: boolean;
+};
+export declare const validateCollapsible: (component: Generic.Element.Component, value?: boolean) => void;

package/dist/types/types/props/compact.d.ts

@@ -0,0 +1,5 @@
+import { Generic } from '@a11y-ui/core';
+export type PropCompact = {
+  compact: boolean;
+};
+export declare const validateCompact: (component: Generic.Element.Component, value?: boolean) => void;

package/dist/types/types/props/disabled.d.ts

@@ -0,0 +1,5 @@
+import { Generic } from '@a11y-ui/core';
+export type PropDisabled = {
+  disabled: boolean;
+};
+export declare const validateDisabled: (component: Generic.Element.Component, value?: boolean) => void;

package/dist/types/types/props/has-closer.d.ts

@@ -0,0 +1,5 @@
+import { Generic } from '@a11y-ui/core';
+export type PropHasCloser = {
+  hasCloser: boolean;
+};
+export declare const validateHasCloser: (component: Generic.Element.Component, value?: boolean) => void;

package/dist/types/types/props/has-compact-button.d.ts

@@ -0,0 +1,5 @@
+import { Generic } from '@a11y-ui/core';
+export type PropHasCompactButton = {
+  hasCompactButton: boolean;
+};
+export declare const validateHasCompactButton: (component: Generic.Element.Component, value?: boolean) => void;

package/dist/types/types/props/has-counter.d.ts

@@ -0,0 +1,5 @@
+import { Generic } from '@a11y-ui/core';
+export type PropHasCounter = {
+  hasCounter: boolean;
+};
+export declare const validateHasCounter: (component: Generic.Element.Component, value?: boolean) => void;

package/dist/types/types/props/has-footer.d.ts

@@ -0,0 +1,5 @@
+import { Generic } from '@a11y-ui/core';
+export type PropHasFooter = {
+  hasFooter: boolean;
+};
+export declare const validateHasFooter: (component: Generic.Element.Component, value?: boolean) => void;

package/dist/types/types/props/hide-label.d.ts

@@ -0,0 +1,5 @@
+import { Generic } from '@a11y-ui/core';
+export type PropHideLabel = {
+  hideLabel: boolean;
+};
+export declare const validateHideLabel: (component: Generic.Element.Component, value?: boolean) => void;

package/dist/types/types/props/indeterminate.d.ts

@@ -0,0 +1,5 @@
+import { Generic } from '@a11y-ui/core';
+export type PropIndeterminate = {
+  indeterminate: boolean;
+};
+export declare const validateIndeterminate: (component: Generic.Element.Component, value?: boolean) => void;

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

@@ -0,0 +1 @@
+export{PropAdjustHeight,validateAdjustHeight}from"./adjust-height";export{PropAlert,validateAlert}from"./alert";export{PropAlignment}from"./alignment";export{PropChecked,validateChecked}from"./checked";export{AriaCurrent,PropAriaCurrent,validateAriaCurrent}from"./aria-current";export{PropAriaExpanded,validateAriaExpanded}from"./aria-expanded";export{PropAriaSelected,validateAriaSelected}from"./aria-selected";export{PropCollapsible,validateCollapsible}from"./collapsible";export{PropCompact,validateCompact}from"./compact";export{PropDisabled,validateDisabled}from"./disabled";export{PropHasCloser,validateHasCloser}from"./has-closer";export{PropHasCompactButton,validateHasCompactButton}from"./has-compact-button";export{PropHasCounter,validateHasCounter}from"./has-counter";export{PropHasFooter,validateHasFooter}from"./has-footer";export{PropHideLabel,validateHideLabel}from"./hide-label";export{PropIndeterminate,validateIndeterminate}from"./indeterminate";export{PropMultiple,validateMultiple}from"./multiple";export{PropOpen,validateOpen}from"./open";export{PropReadOnly,validateReadOnly}from"./read-only";export{PropRequired,validateRequired}from"./required";export{PropShow,validateShow}from"./show";export{PropStealth,validateStealth}from"./stealth";export{PropTouched,validateTouched}from"./touched";

package/dist/types/{utils/validators → types/props}/label.d.ts

@@ -1,7 +1,11 @@
 import { Generic } from '@a11y-ui/core';
-import { WatchStringOptions } from '../prop.validators';
-export declare const hasEnoughReadableChars: (str: string, min?: number) => boolean;
-export declare const containsOnlyNumbers: (str: string) => boolean;
+import { WatchStringOptions } from '../../utils/prop.validators';
+export declare function hasEnoughReadableChars(str: string, min?: number): boolean;
+export declare function containsOnlyNumbers(str: string): boolean;
+export type PropLabel = {
+  label: string;
+};
+export type LabelProp = Generic.Element.Members<PropLabel, unknown>;
 export declare const validateAriaLabelWithLabel: (component: Generic.Element.Component, value?: string) => void;
 export declare const validateLabel: (component: Generic.Element.Component, value?: string, options?: WatchStringOptions) => void;
 export declare const validateLabelWithAriaLabel: (component: Generic.Element.Component, value?: string) => void;

package/dist/types/types/props/multiple.d.ts

@@ -0,0 +1,5 @@
+import { Generic } from '@a11y-ui/core';
+export type PropMultiple = {
+  multiple: boolean;
+};
+export declare const validateMultiple: (component: Generic.Element.Component, value?: boolean) => void;

package/dist/types/types/props/open.d.ts

@@ -0,0 +1,5 @@
+import { Generic } from '@a11y-ui/core';
+export type PropOpen = {
+  open: boolean;
+};
+export declare const validateOpen: (component: Generic.Element.Component, value?: boolean) => void;

package/dist/types/types/props/read-only.d.ts

@@ -0,0 +1,5 @@
+import { Generic } from '@a11y-ui/core';
+export type PropReadOnly = {
+  readOnly: boolean;
+};
+export declare const validateReadOnly: (component: Generic.Element.Component, value?: boolean) => void;

package/dist/types/types/props/required.d.ts

@@ -0,0 +1,5 @@
+import { Generic } from '@a11y-ui/core';
+export type PropRequired = {
+  required: boolean;
+};
+export declare const validateRequired: (component: Generic.Element.Component, value?: boolean) => void;

package/dist/types/types/props/show.d.ts

@@ -0,0 +1,6 @@
+import { Generic } from '@a11y-ui/core';
+import { WatchBooleanOptions } from '../../utils/prop.validators';
+export type PropShow = {
+  show: boolean;
+};
+export declare const validateShow: (component: Generic.Element.Component, value?: boolean, hooks?: WatchBooleanOptions) => void;

package/dist/types/types/props/stealth.d.ts

@@ -0,0 +1,5 @@
+import { Generic } from '@a11y-ui/core';
+export type PropStealth = {
+  stealth: boolean;
+};
+export declare const validateStealth: (component: Generic.Element.Component, value?: boolean) => void;

package/dist/types/types/props/touched.d.ts

@@ -0,0 +1,5 @@
+import { Generic } from '@a11y-ui/core';
+export type PropTouched = {
+  touched: boolean;
+};
+export declare const validateTouched: (component: Generic.Element.Component, value?: boolean) => void;

package/dist/types/utils/a11y.tipps.d.ts

@@ -1,6 +1,7 @@
 export declare const a11yHint: (msg: string) => void;
 export declare const deprecatedHint: (msg: string) => void;
 export declare const devHint: (msg: string) => void;
+export declare const devWarning: (msg: string) => void;
 export declare const featureHint: (msg: string, done?: boolean) => void;
 export declare const a11yHintDisabled: () => void;
 export declare const a11yHintLabelingLandmarks: (value: unknown) => void;

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

@@ -2,7 +2,7 @@ import { Generic } from '@a11y-ui/core';
 import { Stringified } from '../types/common';
 export declare const objectObjectHandler: (value: unknown, cb: () => void) => void;
 export declare const emptyStringByArrayHandler: (value: unknown, cb: () => void) => void;
-export declare const setEventTargetAndStopPropagation: (event: Event, target?: HTMLElement) => void;
+export declare const setEventTarget: (event: Event, target?: HTMLElement) => void;
 type SetStateHooks = {
   afterPatch?: Generic.Element.StateHooksCallback;
   beforePatch?: Generic.Element.NextStateHooksCallback;
@@ -13,7 +13,7 @@ type WatchOptions = {
   hooks?: SetStateHooks;
   required?: boolean;
 };
-type WatchBooleanOptions = WatchOptions & {
+export type WatchBooleanOptions = WatchOptions & {
   defaultValue?: boolean | null;
 };
 export type WatchStringOptions = WatchOptions & {

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

@@ -1,4 +1,4 @@
-export declare const propergateFocus: <H extends HTMLElement, R extends HTMLElement>(host?: H | undefined, ref?: R | undefined) => void;
+export declare const propagateFocus: <H extends HTMLElement, R extends HTMLElement>(host?: H | undefined, ref?: R | undefined) => void;
 export declare const smartSetTimeout: (cb: () => void, delay?: number) => void;
 type ProzessEnv = 'development' | 'production' | 'test';
 export declare let processEnv: ProzessEnv;

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

@@ -1,3 +1,3 @@
 import { Generic } from '@a11y-ui/core';
-import { Alignment } from '../../types/props/alignment';
-export declare const validateAlignment: (component: Generic.Element.Component, propName: string, value?: Alignment) => void;
+import { PropAlignment } from '../../types/props';
+export declare const validateAlignment: (component: Generic.Element.Component, propName: string, value?: PropAlignment) => void;

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

@@ -1,7 +1,7 @@
 import { Generic } from '@a11y-ui/core';
 import { KoliBriIconProp, KoliBriIconState } from '../../types/icon';
-import { Alignment } from '../../types/props/alignment';
-export declare const mapIconProp2State: (icon: KoliBriIconProp, iconAlign?: Alignment) => KoliBriIconState;
+import { PropAlignment } from '../../types/props';
+export declare const mapIconProp2State: (icon: KoliBriIconProp, iconAlign?: PropAlignment) => 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;
+export declare const watchIconAlign: (component: Generic.Element.Component, value?: PropAlignment) => void;

package/doc/accordion.md

@@ -112,18 +112,6 @@ Standardansicht gelegt.
 | `"header"`  | Ermöglicht das Einfügen beliebigen HTML's in den Kopfbereich des Accordions.    |
 
 
-## Shadow Parts
-
-| Part          | Description                                                 |
-| ------------- | ----------------------------------------------------------- |
-| `"accordion"` | Ermöglicht das Stylen des äußeren Container des Accordions. |
-| `"close"`     | Ermöglicht das Stylen des geschlossenen Zustands und Icons. |
-| `"content"`   | Ermöglicht das Stylen des Inhaltsbereichs.                  |
-| `"header"`    | Ermöglicht das Stylen des Kopfbereichs.                     |
-| `"icon"`      | Ermöglicht das Stylen der Icons.                            |
-| `"open"`      | Ermöglicht das Stylen des geöffneten Zustands und Icons.    |
-
-
 ## Dependencies
 
 ### Depends on

package/doc/badge.md

@@ -97,13 +97,13 @@ Die zusätzliche Ausgabe eines **Icon** gewährleistet, dass der Nutzer auch hie
 
 ## Properties
 
-| Property              | Attribute       | Description                                                                                              | Type                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                              | Default     |
-| --------------------- | --------------- | -------------------------------------------------------------------------------------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ----------- |
-| `_color`              | `_color`        | Gibt die Farbe des Hintergrundes bzw. der Schrift an.                                                    | `string \| undefined \| { backgroundColor: string; color: string; }`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                              | `'#000'`    |
-| `_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; _variant?: KoliBriButtonVariant \| undefined; _customClass?: string \| undefined; }`                   | `undefined` |
+| Property              | Attribute       | Description                                                                                              | Type                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                    | Default     |
+| --------------------- | --------------- | -------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ----------- |
+| `_color`              | `_color`        | Gibt die Farbe des Hintergrundes bzw. der Schrift an.                                                    | `string \| undefined \| { backgroundColor: string; color: string; }`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                    | `'#000'`    |
+| `_icon`               | `_icon`         | Gibt einen Identifier eines Icons aus den Icofont's an. (https://icofont.com/)                           | `KoliBriHorizontalIcon & KoliBriVerticalIcon \| string \| undefined`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                    | `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; _ariaLabel?: string \| undefined; _icon?: Stringified<KoliBriIconProp> \| undefined; _iconAlign?: PropAlignment \| undefined; _iconOnly?: boolean \| undefined; _role?: AlternativButtonLinkRole \| undefined; _tabIndex?: number \| undefined; _tooltipAlign?: PropAlignment \| undefined; _ariaCurrent?: AriaCurrent \| undefined; _ariaExpanded?: boolean \| undefined; _ariaSelected?: boolean \| undefined; _disabled?: boolean \| undefined; _accessKey?: string \| undefined; _id?: string \| undefined; _on?: KoliBriButtonCallbacks<unknown> \| undefined; _type?: KoliBriButtonType \| undefined; _value?: unknown; _variant?: KoliBriButtonVariant \| undefined; _customClass?: string \| undefined; }` | `undefined` |
 
 
 ## Dependencies

package/doc/breadcrumb.md

@@ -86,18 +86,10 @@ Beachten Sie, dass auch das letzte Element in der Breadcrumb-Komponente per Tab-
 
 ## Properties
 
-| Property                  | Attribute     | Description                                                                  | Type                       | Default     |
-| ------------------------- | ------------- | ---------------------------------------------------------------------------- | -------------------------- | ----------- |
-| `_ariaLabel` _(required)_ | `_aria-label` | Gibt den Text an, der die Navigation von anderen Navigationen differenziert. | `string`                   | `undefined` |
-| `_links` _(required)_     | `_links`      | Gibt die geordnete Liste der Seitenhierarchie in Links an.                   | `NavLinkProps[] \| string` | `undefined` |
-
-
-## Shadow Parts
-
-| Part          | Description                                |
-| ------------- | ------------------------------------------ |
-| `"link"`      | Ermöglicht das Stylen der Links.           |
-| `"separator"` | Ermöglicht das Ändern des Separator-Icons. |
+| Property                  | Attribute     | Description                                                                  | Type                    | Default     |
+| ------------------------- | ------------- | ---------------------------------------------------------------------------- | ----------------------- | ----------- |
+| `_ariaLabel` _(required)_ | `_aria-label` | Gibt den Text an, der die Navigation von anderen Navigationen differenziert. | `string`                | `undefined` |
+| `_links` _(required)_     | `_links`      | Gibt die geordnete Liste der Seitenhierarchie in Links an.                   | `LinkProps[] \| string` | `undefined` |
 
 
 ## Dependencies

package/doc/button-link.md

@@ -29,25 +29,25 @@ Da der Link, nicht wie der Button, in mehrere Varianten (`primary` oder `seconda
 
 ## Properties
 
-| Property              | Attribute        | Description                                                                                                                                                                                                                                                                           | Type                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                              | Default     |
-| --------------------- | ---------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ----------- |
-| `_accessKey`          | `_access-key`    | Gibt an, mit welcher Tastenkombination man den Button auslösen oder fokussieren kann.                                                                                                                                                                                                 | `string \| undefined`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                             | `undefined` |
-| `_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`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                             | `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` |
-| `_iconOnly`           | `_icon-only`     | Gibt an, ob nur das Icon angezeigt wird.                                                                                                                                                                                                                                              | `boolean \| undefined`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                            | `false`     |
-| `_id`                 | `_id`            | Gibt die ID der Schaltfläche an. (Selection, Testing)                                                                                                                                                                                                                                 | `string \| undefined`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                             | `undefined` |
-| `_label` _(required)_ | `_label`         | Gibt einen beschreibenden Text für das Text-Element an.                                                                                                                                                                                                                               | `string`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                          | `undefined` |
-| `_on`                 | --               | Gibt die EventCallback-Funktionen für die Button-Events an.                                                                                                                                                                                                                           | `undefined \| { onClick?: EventValueOrEventCallback<MouseEvent, unknown> \| undefined; onMouseDown?: EventCallback<MouseEvent> \| undefined; }`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                   | `undefined` |
-| `_role`               | `_role`          | Gibt an, welche Role der Schalter hat.                                                                                                                                                                                                                                                | `"button" \| "link" \| "tab" \| undefined`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                        | `undefined` |
-| `_tabIndex`           | `_tab-index`     | Gibt an, welchen Tab-Index der Button hat. (https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/tabindex)                                                                                                                                                             | `number \| undefined`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                             | `undefined` |
-| `_tooltipAlign`       | `_tooltip-align` | Gibt an, ob der Tooltip oben, rechts, unten oder links angezeigt werden soll.                                                                                                                                                                                                         | `"bottom" \| "left" \| "right" \| "top" \| undefined`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                             | `'top'`     |
-| `_type`               | `_type`          | Gibt an, welche Typ der Button hat.                                                                                                                                                                                                                                                   | `"button" \| "reset" \| "submit" \| undefined`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                    | `'button'`  |
-| `_value`              | --               | Gibt einen Wert an, den der Schalter bei einem Klick zurückgibt.                                                                                                                                                                                                                      | `unknown`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                         | `undefined` |
+| Property              | Attribute        | Description                                                                                                                                                                                                                                                                           | Type                                                                                                                                            | Default     |
+| --------------------- | ---------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------- | ----------- |
+| `_accessKey`          | `_access-key`    | Gibt an, mit welcher Tastenkombination man den Button auslösen oder fokussieren kann.                                                                                                                                                                                                 | `string \| undefined`                                                                                                                           | `undefined` |
+| `_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`                                                                                                                           | `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/)                                                                                                                                                                                        | `KoliBriHorizontalIcon & KoliBriVerticalIcon \| string \| 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 einen beschreibenden Text für das Text-Element an.                                                                                                                                                                                                                               | `string`                                                                                                                                        | `undefined` |
+| `_on`                 | --               | Gibt die EventCallback-Funktionen für die Button-Events an.                                                                                                                                                                                                                           | `undefined \| { onClick?: EventValueOrEventCallback<MouseEvent, unknown> \| undefined; onMouseDown?: EventCallback<MouseEvent> \| undefined; }` | `undefined` |
+| `_role`               | `_role`          | Gibt an, welche Role der Schalter hat.                                                                                                                                                                                                                                                | `"button" \| "link" \| "tab" \| undefined`                                                                                                      | `undefined` |
+| `_tabIndex`           | `_tab-index`     | Gibt an, welchen Tab-Index der Button hat. (https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/tabindex)                                                                                                                                                             | `number \| undefined`                                                                                                                           | `undefined` |
+| `_tooltipAlign`       | `_tooltip-align` | Gibt an, ob der Tooltip oben, rechts, unten oder links angezeigt werden soll.                                                                                                                                                                                                         | `"bottom" \| "left" \| "right" \| "top" \| undefined`                                                                                           | `'top'`     |
+| `_type`               | `_type`          | Gibt an, welche Typ der Button hat.                                                                                                                                                                                                                                                   | `"button" \| "reset" \| "submit" \| undefined`                                                                                                  | `'button'`  |
+| `_value`              | --               | Gibt einen Wert an, den der Schalter bei einem Klick zurückgibt.                                                                                                                                                                                                                      | `unknown`                                                                                                                                       | `undefined` |
 
 
 ## Dependencies