@public-ui/components 4.0.3-rc.1 → 4.0.3

package/dist/types/functional-components/Button/Button.d.ts

@@ -1,6 +1,6 @@
 import { type FunctionalComponent as FC } from '../../stencil-public-runtime';
-import type { InternalButtonProps } from '../../schema';
-export type ButtonProps = Partial<InternalButtonProps> & {
+import type { OptionalButtonProps, RequiredButtonProps } from '../../schema';
+export type ButtonProps = Partial<RequiredButtonProps & OptionalButtonProps> & {
     label: string;
     class?: string;
     onClick?: (event: MouseEvent) => void;

package/dist/types/schema/components/badge.d.ts

@@ -1,19 +1,19 @@
 import type { Generic } from 'adopted-style-sheets';
 import type { ColorPair, PropColor, PropLabel } from '../props';
 import type { KoliBriIconsProp, Stringified } from '../types';
-import type { ButtonProps } from './button';
+import type { InternalButtonProps } from './button';
 type RequiredProps = PropLabel;
 type OptionalProps = {
     icons: Stringified<KoliBriIconsProp>;
     color: Stringified<PropColor>;
-    smartButton: Stringified<ButtonProps>;
+    smartButton: Stringified<InternalButtonProps>;
 };
 type RequiredStates = {
     color: ColorPair;
 };
 type OptionalStates = {
     icons: KoliBriIconsProp;
-    smartButton: ButtonProps;
+    smartButton: InternalButtonProps;
 };
 type RequiredWatchers = RequiredStates;
 type OptionalWatchers = OptionalStates;

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

@@ -1,8 +1,8 @@
 import type { Generic } from 'adopted-style-sheets';
-import type { PropAlternativeButtonLinkRole, PropButtonVariant, PropInline } from '../props';
+import type { PropButtonVariant, PropInline, PropVariantClassName } from '../props';
 import type { OptionalButtonProps, OptionalButtonStates, RequiredButtonProps, RequiredButtonStates } from './button';
 type RequiredProps = RequiredButtonProps;
-type OptionalProps = Omit<OptionalButtonProps, keyof PropAlternativeButtonLinkRole | keyof PropButtonVariant> & PropInline;
+type OptionalProps = Omit<OptionalButtonProps, keyof PropButtonVariant> & PropVariantClassName & PropInline;
 export type ButtonLinkProps = Generic.Element.Members<RequiredProps, OptionalProps>;
 export type ButtonLinkStates = Generic.Element.Members<RequiredButtonStates, OptionalButtonStates>;
 export {};

package/dist/types/schema/components/button.d.ts

@@ -1,20 +1,15 @@
 import type { Generic } from 'adopted-style-sheets';
-import type { AriaExpandedPropType, ButtonVariantPropType, PropAccessKey, PropAlternativeButtonLinkRole, PropAriaControls, PropAriaDescription, PropAriaSelected, PropButtonCallbacks, PropButtonType, PropButtonVariant, PropCustomClass, PropDisabled, PropHideLabel, PropIcons, PropId, PropInline, PropLabelWithExpertSlot, PropName, PropShortKey, PropSyncValueBySelector, PropTooltipAlign } from '../props';
-import type { KoliBriAllIcons, StencilUnknown } from '../types';
+import type { AriaExpandedPropType, PropAccessKey, PropAlternativeButtonLinkRole, PropAriaControls, PropAriaDescription, PropAriaSelected, PropButtonCallbacks, PropButtonType, PropButtonVariant, PropCustomClass, PropDisabled, PropHideLabel, PropIcons, PropId, PropInline, PropLabelWithExpertSlot, PropName, PropShortKey, PropSyncValueBySelector, PropTooltipAlign, PropVariantClassName } from '../props';
+import type { StencilUnknown } from '../types';
 export type RequiredButtonProps = PropLabelWithExpertSlot;
 export type OptionalButtonProps = {
     ariaExpanded: AriaExpandedPropType;
     tabIndex: number;
     value: StencilUnknown;
 } & PropAccessKey & PropAlternativeButtonLinkRole & PropAriaControls & PropAriaDescription & PropAriaSelected & PropButtonCallbacks<StencilUnknown> & PropButtonType & PropButtonVariant & PropCustomClass & PropDisabled & PropHideLabel & PropIcons & PropId & PropInline & PropName & PropShortKey & PropSyncValueBySelector & PropTooltipAlign;
-export type RequiredButtonStates = RequiredButtonProps & PropButtonType & {
-    icons: KoliBriAllIcons;
-};
-export type OptionalButtonStates = Omit<RequiredButtonProps & OptionalButtonProps, keyof RequiredButtonStates> & {
-    buttonVariant: ButtonVariantPropType;
-};
+export type RequiredButtonStates = PropIcons & PropLabelWithExpertSlot & PropButtonCallbacks<StencilUnknown> & PropButtonType & PropButtonVariant;
+export type OptionalButtonStates = Omit<OptionalButtonProps, keyof PropIcons | keyof PropLabelWithExpertSlot | keyof PropButtonCallbacks<StencilUnknown> | keyof PropButtonType | keyof PropButtonVariant>;
 export type ButtonProps = Generic.Element.Members<RequiredButtonProps, OptionalButtonProps>;
+export type InternalButtonProps = Generic.Element.Members<RequiredButtonProps, Omit<OptionalButtonProps, keyof PropButtonVariant> & PropVariantClassName>;
 export type ButtonStates = Generic.Element.Members<RequiredButtonStates, OptionalButtonStates>;
-export type ButtonAPI = Generic.Element.ComponentApi<RequiredButtonProps, OptionalButtonProps, RequiredButtonStates, OptionalButtonStates>;
-export type InternalButtonProps = RequiredButtonProps & OptionalButtonProps;
-export type InternalButtonAPI = Omit<ButtonAPI, 'validateVariant'>;
+export type ButtonAPI = Generic.Element.ComponentApi<RequiredButtonProps, Omit<OptionalButtonProps, keyof PropButtonVariant> & PropVariantClassName, RequiredButtonStates, OptionalButtonStates>;

package/dist/types/schema/components/combobox.d.ts

@@ -18,7 +18,7 @@ type RequiredStates = {
 type OptionalStates = {
     on: InputTypeOnDefault;
     placeholder: string;
-} & PropAccessKey & PropDisabled & PropHideLabel & PropHint & KoliBriHIcons & PropId & PropName & PropRequired & PropMsg & PropShortKey & PropTouched;
+} & PropAccessKey & PropDisabled & PropHideLabel & PropHint & KoliBriHIcons & PropName & PropRequired & PropMsg & PropShortKey & PropTouched;
 export type ComboboxProps = Generic.Element.Members<RequiredProps, OptionalProps>;
 export type ComboboxStates = Generic.Element.Members<RequiredStates, OptionalStates>;
 export type ComboboxWatches = Generic.Element.Watchers<RequiredProps, OptionalProps>;

package/dist/types/schema/components/input-color.d.ts

@@ -1,12 +1,12 @@
 import type { Generic } from 'adopted-style-sheets';
 import type { MsgPropType, PropAccessKey, PropAutoComplete, PropDisabled, PropHideLabel, PropHideMsg, PropHint, PropHorizontalIcons, PropLabelWithExpertSlot, PropMsg, PropName, PropShortKey, PropSuggestions, PropSyncValueBySelector, PropTouched } from '../props';
 import type { InputTypeOnDefault, KoliBriHIcons, Stringified, W3CInputValue } from '../types';
-import type { ButtonProps } from './button';
+import type { InternalButtonProps } from './button';
 type RequiredProps = PropLabelWithExpertSlot;
 type OptionalProps = {
     msg: Stringified<MsgPropType>;
     on: InputTypeOnDefault;
-    smartButton: Stringified<ButtonProps>;
+    smartButton: Stringified<InternalButtonProps>;
     value: string;
 } & PropAccessKey & PropAutoComplete & PropDisabled & PropHideLabel & PropHideMsg & PropHint & PropHorizontalIcons & PropName & PropShortKey & PropSuggestions & PropSyncValueBySelector & PropTouched;
 type RequiredStates = {
@@ -15,7 +15,7 @@ type RequiredStates = {
 } & PropHideMsg & PropLabelWithExpertSlot;
 type OptionalStates = {
     on: InputTypeOnDefault;
-    smartButton: ButtonProps;
+    smartButton: InternalButtonProps;
     value: string;
 } & PropAccessKey & PropAutoComplete & PropDisabled & PropHideLabel & PropHint & KoliBriHIcons & PropMsg & PropName & PropShortKey & PropTouched;
 export type InputColorProps = Generic.Element.Members<RequiredProps, OptionalProps>;

package/dist/types/schema/components/input-date.d.ts

@@ -1,14 +1,14 @@
 import type { Generic } from 'adopted-style-sheets';
 import type { InputDateTypePropType, MsgPropType, PropAccessKey, PropAutoComplete, PropDisabled, PropHideLabel, PropHideMsg, PropHint, PropHorizontalIcons, PropId, PropLabelWithExpertSlot, PropMsg, PropName, PropReadOnly, PropRequired, PropShortKey, PropSuggestions, PropSyncValueBySelector, PropTouched } from '../props';
 import type { InputTypeOnDefault, Iso8601, KoliBriHIcons, NumberString, Stringified, W3CInputValue } from '../types';
-import type { ButtonProps } from './button';
+import type { InternalButtonProps } from './button';
 type RequiredProps = PropLabelWithExpertSlot;
 type OptionalProps = {
     max: Iso8601 | Date;
     min: Iso8601 | Date;
     msg: Stringified<MsgPropType>;
     on: InputTypeOnDefault;
-    smartButton: Stringified<ButtonProps>;
+    smartButton: Stringified<InternalButtonProps>;
     step: number | NumberString;
     type: InputDateTypePropType;
     value: Iso8601 | Date | null;
@@ -23,7 +23,7 @@ type OptionalStates = {
     min: Iso8601;
     on: InputTypeOnDefault;
     placeholder: string;
-    smartButton: ButtonProps;
+    smartButton: InternalButtonProps;
     step: number;
     value: Iso8601 | null;
 } & PropAccessKey & PropAutoComplete & PropHint & PropSyncValueBySelector & PropDisabled & PropHideLabel & KoliBriHIcons & PropMsg & PropName & PropReadOnly & PropRequired & PropShortKey & PropTouched;

package/dist/types/schema/components/input-email.d.ts

@@ -1,7 +1,7 @@
 import type { Generic } from 'adopted-style-sheets';
 import type { MsgPropType, PropAccessKey, PropAutoComplete, PropDisabled, PropHideLabel, PropHideMsg, PropHint, PropHorizontalIcons, PropId, PropLabelWithExpertSlot, PropMaxLengthBehavior, PropMsg, PropMultiple, PropName, PropReadOnly, PropRequired, PropShortKey, PropSuggestions, PropSyncValueBySelector, PropTouched } from '../props';
 import type { InputTypeOnDefault, KoliBriHIcons, Stringified, W3CInputValue } from '../types';
-import type { ButtonProps } from './button';
+import type { InternalButtonProps } from './button';
 type RequiredProps = PropLabelWithExpertSlot;
 type OptionalProps = {
     maxLength: number;
@@ -9,7 +9,7 @@ type OptionalProps = {
     on: InputTypeOnDefault;
     pattern: string;
     placeholder: string;
-    smartButton: Stringified<ButtonProps>;
+    smartButton: Stringified<InternalButtonProps>;
     value: string;
 } & PropAccessKey & PropAutoComplete & PropDisabled & PropHideMsg & PropHideLabel & PropHint & PropHorizontalIcons & PropMaxLengthBehavior & PropMultiple & PropName & PropReadOnly & PropRequired & PropShortKey & PropSuggestions & PropSyncValueBySelector & PropTouched;
 type RequiredStates = {
@@ -23,7 +23,7 @@ type OptionalStates = {
     on: InputTypeOnDefault;
     pattern: string;
     placeholder: string;
-    smartButton: ButtonProps;
+    smartButton: InternalButtonProps;
     value: string;
 } & PropAccessKey & PropAutoComplete & PropDisabled & PropHideLabel & PropHint & KoliBriHIcons & PropMaxLengthBehavior & PropMsg & PropMultiple & PropName & PropReadOnly & PropRequired & PropShortKey & PropTouched;
 export type InputEmailProps = Generic.Element.Members<RequiredProps, OptionalProps>;

package/dist/types/schema/components/input-file.d.ts

@@ -1,19 +1,19 @@
 import type { Generic } from 'adopted-style-sheets';
 import type { MsgPropType, PropAccessKey, PropDisabled, PropHideLabel, PropHideMsg, PropHint, PropHorizontalIcons, PropId, PropLabelWithExpertSlot, PropMsg, PropMultiple, PropName, PropRequired, PropShortKey, PropSyncValueBySelector, PropTouched } from '../props';
 import type { InputTypeOnDefault, KoliBriHIcons, Stringified } from '../types';
-import type { ButtonProps } from './button';
+import type { InternalButtonProps } from './button';
 type RequiredProps = PropLabelWithExpertSlot;
 type OptionalProps = {
     accept: string;
     msg: Stringified<MsgPropType>;
     on: InputTypeOnDefault;
-    smartButton: Stringified<ButtonProps>;
+    smartButton: Stringified<InternalButtonProps>;
 } & PropAccessKey & PropDisabled & PropHideMsg & PropHideLabel & PropHint & PropHorizontalIcons & PropMultiple & PropName & PropRequired & PropShortKey & PropSyncValueBySelector & PropTouched;
 type RequiredStates = PropId & PropLabelWithExpertSlot & PropHideMsg;
 type OptionalStates = {
     accept: string;
     on: InputTypeOnDefault;
-    smartButton: ButtonProps;
+    smartButton: InternalButtonProps;
 } & PropAccessKey & PropDisabled & PropHideLabel & PropHint & KoliBriHIcons & PropMsg & PropMultiple & PropName & PropRequired & PropShortKey & PropTouched;
 export type InputFileProps = Generic.Element.Members<RequiredProps, OptionalProps>;
 export type InputFileStates = Generic.Element.Members<RequiredStates, OptionalStates>;

package/dist/types/schema/components/input-number.d.ts

@@ -1,7 +1,7 @@
 import type { Generic } from 'adopted-style-sheets';
 import type { MsgPropType, PlaceholderPropType, PropAccessKey, PropAutoComplete, PropDisabled, PropHideLabel, PropHideMsg, PropHint, PropHorizontalIcons, PropId, PropLabelWithExpertSlot, PropMsg, PropName, PropReadOnly, PropRequired, PropShortKey, PropSuggestions, PropSyncValueBySelector, PropTouched } from '../props';
 import type { InputTypeOnDefault, KoliBriHIcons, NumberString, Stringified, W3CInputValue } from '../types';
-import type { ButtonProps } from './button';
+import type { InternalButtonProps } from './button';
 type RequiredProps = PropLabelWithExpertSlot;
 type OptionalProps = {
     max: number | NumberString;
@@ -9,7 +9,7 @@ type OptionalProps = {
     msg: Stringified<MsgPropType>;
     on: InputTypeOnDefault;
     placeholder: PlaceholderPropType;
-    smartButton: Stringified<ButtonProps>;
+    smartButton: Stringified<InternalButtonProps>;
     step: number | NumberString;
     value: number | NumberString | null;
 } & PropAccessKey & PropAutoComplete & PropDisabled & PropHideLabel & PropHideMsg & PropHint & PropHorizontalIcons & PropName & PropReadOnly & PropRequired & PropSuggestions & PropTouched;
@@ -22,7 +22,7 @@ type OptionalStates = {
     min: number;
     on: InputTypeOnDefault;
     placeholder: PlaceholderPropType;
-    smartButton: ButtonProps;
+    smartButton: InternalButtonProps;
     step: number;
     value: number;
 } & PropAccessKey & PropAutoComplete & PropDisabled & PropHideLabel & PropHint & KoliBriHIcons & PropMsg & PropName & PropReadOnly & PropRequired & PropSyncValueBySelector & PropShortKey & PropTouched;

package/dist/types/schema/components/input-password.d.ts

@@ -2,14 +2,14 @@ import type { Generic } from 'adopted-style-sheets';
 import type { MsgPropType, PropAccessKey, PropAutoComplete, PropDisabled, PropHasCounter, PropHideLabel, PropHideMsg, PropHint, PropHorizontalIcons, PropId, PropLabelWithExpertSlot, PropMaxLengthBehavior, PropMsg, PropName, PropReadOnly, PropRequired, PropShortKey, PropSyncValueBySelector, PropTouched } from '../props';
 import type { PropPasswordVariant } from '../props/variant/password-variant';
 import type { InputTypeOnDefault, KoliBriHIcons, Stringified } from '../types';
-import type { ButtonProps } from './button';
+import type { InternalButtonProps } from './button';
 type RequiredProps = PropLabelWithExpertSlot;
 type OptionalProps = {
     maxLength: number;
     on: InputTypeOnDefault;
     pattern: string;
     placeholder: string;
-    smartButton: Stringified<ButtonProps>;
+    smartButton: Stringified<InternalButtonProps>;
     value: string;
     msg: Stringified<MsgPropType>;
 } & PropAccessKey & PropAutoComplete & PropPasswordVariant & PropDisabled & PropHasCounter & PropHideMsg & PropHideLabel & PropHint & PropHorizontalIcons & PropMaxLengthBehavior & PropName & PropReadOnly & PropRequired & PropShortKey & PropSyncValueBySelector & PropTouched;
@@ -23,7 +23,7 @@ type OptionalStates = {
     on: InputTypeOnDefault;
     pattern: string;
     placeholder: string;
-    smartButton: ButtonProps;
+    smartButton: InternalButtonProps;
     value: string | null;
 } & PropAccessKey & PropAutoComplete & PropPasswordVariant & PropDisabled & PropHasCounter & PropHideLabel & PropHint & KoliBriHIcons & PropMaxLengthBehavior & PropMsg & PropName & PropReadOnly & PropRequired & PropShortKey & PropSyncValueBySelector & PropTouched;
 export type InputPasswordProps = Generic.Element.Members<RequiredProps, OptionalProps>;

package/dist/types/schema/components/input-text.d.ts

@@ -1,7 +1,7 @@
 import type { Generic } from 'adopted-style-sheets';
 import type { InputTextTypePropType, MsgPropType, PropAccessKey, PropAutoComplete, PropDisabled, PropHasCounter, PropHideLabel, PropHideMsg, PropHint, PropHorizontalIcons, PropId, PropLabelWithExpertSlot, PropMaxLengthBehavior, PropMsg, PropName, PropReadOnly, PropRequired, PropShortKey, PropSpellCheck, PropSuggestions, PropSyncValueBySelector, PropTouched } from '../props';
 import type { InputTypeOnDefault, KoliBriHIcons, Stringified, W3CInputValue } from '../types';
-import type { ButtonProps } from './button';
+import type { InternalButtonProps } from './button';
 type RequiredProps = PropLabelWithExpertSlot;
 type OptionalProps = {
     maxLength: number;
@@ -9,10 +9,10 @@ type OptionalProps = {
     on: InputTypeOnDefault;
     pattern: string;
     placeholder: string;
-    smartButton: Stringified<ButtonProps>;
+    smartButton: Stringified<InternalButtonProps>;
     type: InputTextTypePropType;
     value: string;
-} & PropAccessKey & PropAutoComplete & PropDisabled & PropHasCounter & PropHideMsg & PropHideLabel & PropHint & PropHorizontalIcons & PropId & PropMaxLengthBehavior & PropName & PropReadOnly & PropRequired & PropShortKey & PropSpellCheck & PropSuggestions & PropSyncValueBySelector & PropTouched;
+} & PropAccessKey & PropAutoComplete & PropDisabled & PropHasCounter & PropHideMsg & PropHideLabel & PropHint & PropHorizontalIcons & PropMaxLengthBehavior & PropName & PropReadOnly & PropRequired & PropShortKey & PropSpellCheck & PropSuggestions & PropSyncValueBySelector & PropTouched;
 type RequiredStates = {
     currentLength: number;
     currentLengthDebounced: number;
@@ -25,7 +25,7 @@ type OptionalStates = {
     on: InputTypeOnDefault;
     pattern: string;
     placeholder: string;
-    smartButton: ButtonProps;
+    smartButton: InternalButtonProps;
     value: string;
 } & PropAccessKey & PropAutoComplete & PropDisabled & PropHasCounter & PropHideLabel & PropHint & KoliBriHIcons & PropMaxLengthBehavior & PropMsg & PropName & PropReadOnly & PropRequired & PropShortKey & PropSpellCheck & PropTouched;
 export type InputTextProps = Generic.Element.Members<RequiredProps, OptionalProps>;

package/dist/types/schema/components/select.d.ts

@@ -16,7 +16,7 @@ type RequiredStates = {
 type OptionalStates = {
     on: InputTypeOnDefault;
     tabIndex: number;
-} & PropAccessKey & PropDisabled & PropHideLabel & PropHint & KoliBriHIcons & PropId & PropName & PropRequired & PropRows & PropMsg & PropShortKey & PropTouched;
+} & PropAccessKey & PropDisabled & PropHideLabel & PropHint & KoliBriHIcons & PropName & PropRequired & PropRows & PropMsg & PropShortKey & PropTouched;
 export type SelectProps = Generic.Element.Members<RequiredProps, OptionalProps>;
 export type SelectStates = Generic.Element.Members<RequiredStates, OptionalStates>;
 export type SelectWatches = Generic.Element.Watchers<RequiredProps, OptionalProps>;

package/dist/types/schema/components/single-select.d.ts

@@ -16,7 +16,7 @@ type OptionalStates = {
     on: InputTypeOnDefault;
     placeholder: string;
     hasClearButton: boolean;
-} & PropAccessKey & PropDisabled & PropHideLabel & KoliBriHIcons & PropHint & PropId & PropName & PropRequired & PropRows & PropMsg & PropShortKey & PropTouched;
+} & PropAccessKey & PropDisabled & PropHideLabel & KoliBriHIcons & PropHint & PropName & PropRequired & PropRows & PropMsg & PropShortKey & PropTouched;
 export type SingleSelectProps = Generic.Element.Members<RequiredProps, OptionalProps>;
 export type SingleSelectStates = Generic.Element.Members<RequiredStates, OptionalStates>;
 export type SingleSelectWatches = Generic.Element.Watchers<RequiredProps, OptionalProps>;

package/dist/types/schema/components/table.d.ts

@@ -2,12 +2,12 @@ import type { Generic } from 'adopted-style-sheets';
 import type { PropHasSettingsMenu, PropLabel, PropTableData, PropTableDataFoot, PropTableSelection, StatefulPropTableCallbacks } from '../props';
 import type { PropPaginationPosition } from '../props/pagination-position';
 import type { KoliBriSortDirection, KoliBriTableDataType, KoliBriTableHeaderCell, KoliBriTableSelection, Stringified } from '../types';
-import type { ButtonProps } from './button';
+import type { InternalButtonProps } from './button';
 import type { LinkProps } from './link';
 import type { KoliBriPaginationProps } from './pagination';
 export type ActionColumnPropType = ({
     type: 'button';
-} & ButtonProps) | ({
+} & InternalButtonProps) | ({
     type: 'link';
 } & LinkProps);
 export type KoliBriTableSelectedHead = {

package/dist/types/schema/components/textarea.d.ts

@@ -11,7 +11,7 @@ type OptionalProps = {
     placeholder: string;
     resize: CSSResize;
     value: string;
-} & PropAccessKey & PropAdjustHeight & PropDisabled & PropHasCounter & PropHideLabel & PropHideMsg & PropHint & PropHorizontalIcons & PropId & PropMaxLengthBehavior & PropName & PropReadOnly & PropRequired & PropRows & PropShortKey & PropSpellCheck & PropSyncValueBySelector & PropTouched;
+} & PropAccessKey & PropAdjustHeight & PropDisabled & PropHasCounter & PropHideLabel & PropHideMsg & PropHint & PropHorizontalIcons & PropMaxLengthBehavior & PropName & PropReadOnly & PropRequired & PropRows & PropShortKey & PropSpellCheck & PropSyncValueBySelector & PropTouched;
 type RequiredStates = {
     adjustHeight: boolean;
     currentLength: number;

package/dist/types/schema/components/toaster.d.ts

@@ -1,7 +1,6 @@
 import type { Generic } from 'adopted-style-sheets';
 import type { AlertTypePropType, LabelPropType } from '../props';
-declare const toastStatusOptions: readonly ["adding", "settled", "removing"];
-type ToastStatus = (typeof toastStatusOptions)[number];
+type ToastStatus = 'adding' | 'removing' | 'settled';
 export type ToastRenderFunction = (nodeRef: HTMLElement, options: {
     close: () => void;
 }) => void;

package/dist/types/schema/props/aria-has-popup.d.ts

@@ -1,3 +1 @@
-declare const ariaHasPopupOptions: readonly ["false", "true", "menu", "listbox", "tree", "grid", "dialog"];
-export type AriaHasPopupPropType = (typeof ariaHasPopupOptions)[number];
-export {};
+export type AriaHasPopupPropType = 'dialog' | 'false' | 'grid' | 'listbox' | 'menu' | 'tree' | 'true';

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

@@ -1 +1 @@
-export*from"./accept";export*from"./access-key";export*from"./accordion-callbacks";export*from"./active";export*from"./adjust-height";export*from"./alert";export*from"./alert-type";export*from"./align";export*from"./allow-multi-sort";export*from"./alt";export*from"./alternative-button-link-role";export*from"./aria-controls";export*from"./aria-current-value";export*from"./aria-description";export*from"./aria-expanded";export*from"./aria-owns";export*from"./aria-selected";export*from"./auto-complete";export*from"./badge-text";export*from"./button-callbacks";export*from"./button-type";export*from"./button-variant";export*from"./checked";export*from"./collapsible";export*from"./color";export*from"./current-length";export*from"./custom-class";export*from"./details-callbacks";export*from"./disabled";export*from"./download";export*from"./error-list";export*from"./has-closer";export*from"./has-compact-button";export*from"./has-counter";export*from"./has-icons-when-expanded";export*from"./has-settings-menu";export*from"./has-value";export*from"./hide-label";export*from"./hide-msg";export*from"./hint";export*from"./href";export*from"./icons";export*from"./icons-input-checkbox";export*from"./id";export*from"./image-sizes";export*from"./image-source";export*from"./image-srcset";export*from"./indeterminate";export*from"./inline";export*from"./label";export*from"./label-align";export*from"./level";export*from"./link-on-callbacks";export*from"./link-target";export*from"./loading";export*from"./max";export*from"./max-length";export*from"./max-length-behavior";export*from"./modal";export*from"./msg";export*from"./multiple";export*from"./name";export*from"./open";export*from"./options";export*from"./pagination-position";export*from"./pattern";export*from"./placeholder";export*from"./popover-align";export*from"./popover-callbacks";export*from"./quote";export*from"./read-only";export*from"./required";export*from"./resize-textarea";export*from"./rows";export*from"./short-key";export*from"./show";export*from"./spell-check";export*from"./suggestions";export*from"./sync-value-by-selector";export*from"./tab-behavior";export*from"./tab-index";export*from"./table-callbacks";export*from"./table-data";export*from"./table-data-foot";export*from"./table-header-cells";export*from"./table-selection";export*from"./toolbar-items";export*from"./tooltip-align";export*from"./touched";export*from"./type-input-date";export*from"./type-input-text";export*from"./unit";export*from"./variant-alert";export*from"./variant-input-checkbox";export*from"./variant-progress";export*from"./variant-quote";export*from"./variant/spin";export*from"./width";
+export*from"./accept";export*from"./access-key";export*from"./accordion-callbacks";export*from"./active";export*from"./adjust-height";export*from"./alert";export*from"./alert-type";export*from"./align";export*from"./allow-multi-sort";export*from"./alt";export*from"./alternative-button-link-role";export*from"./aria-controls";export*from"./aria-current-value";export*from"./aria-description";export*from"./aria-expanded";export*from"./aria-owns";export*from"./aria-selected";export*from"./auto-complete";export*from"./badge-text";export*from"./button-callbacks";export*from"./button-type";export*from"./button-variant";export*from"./checked";export*from"./collapsible";export*from"./color";export*from"./current-length";export*from"./custom-class";export*from"./details-callbacks";export*from"./disabled";export*from"./download";export*from"./error-list";export*from"./has-closer";export*from"./has-compact-button";export*from"./has-counter";export*from"./has-icons-when-expanded";export*from"./has-settings-menu";export*from"./has-value";export*from"./hide-label";export*from"./hide-msg";export*from"./hint";export*from"./href";export*from"./icons";export*from"./icons-input-checkbox";export*from"./id";export*from"./image-sizes";export*from"./image-source";export*from"./image-srcset";export*from"./indeterminate";export*from"./inline";export*from"./label";export*from"./label-align";export*from"./level";export*from"./link-on-callbacks";export*from"./link-target";export*from"./loading";export*from"./max";export*from"./max-length";export*from"./max-length-behavior";export*from"./modal";export*from"./msg";export*from"./multiple";export*from"./name";export*from"./open";export*from"./options";export*from"./pagination-position";export*from"./pattern";export*from"./placeholder";export*from"./popover-align";export*from"./popover-callbacks";export*from"./quote";export*from"./read-only";export*from"./required";export*from"./resize-textarea";export*from"./rows";export*from"./short-key";export*from"./show";export*from"./spell-check";export*from"./suggestions";export*from"./sync-value-by-selector";export*from"./tab-behavior";export*from"./tab-index";export*from"./table-callbacks";export*from"./table-data";export*from"./table-data-foot";export*from"./table-header-cells";export*from"./table-selection";export*from"./toolbar-items";export*from"./tooltip-align";export*from"./touched";export*from"./type-input-date";export*from"./type-input-text";export*from"./unit";export*from"./variant-alert";export*from"./variant-class-name";export*from"./variant-input-checkbox";export*from"./variant-progress";export*from"./variant-quote";export*from"./variant/spin";export*from"./width";

package/dist/types/schema/props/toolbar-items.d.ts

@@ -1,8 +1,8 @@
 import type { Generic } from 'adopted-style-sheets';
-import type { ButtonProps, LinkProps } from '../../schema';
+import type { InternalButtonProps, LinkProps } from '../../schema';
 export type ToolbarItemPropType = ({
     type: 'button';
-} & ButtonProps) | ({
+} & InternalButtonProps) | ({
     type: 'link';
 } & LinkProps);
 export type ToolbarItemsPropType = ToolbarItemPropType[];

package/dist/types/schema/props/variant-class-name.d.ts

@@ -0,0 +1,6 @@
+import type { Generic } from 'adopted-style-sheets';
+export type VariantClassNamePropType = string;
+export type PropVariantClassName = {
+    variant: VariantClassNamePropType;
+};
+export declare const validateVariantClassName: (component: Generic.Element.Component, value?: VariantClassNamePropType) => void;

package/doc/badge.md

@@ -5,12 +5,12 @@
 
 ## Properties
 
-| Property              | Attribute       | Description                                                                                                        | Type                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                              | Default     |
-| --------------------- | --------------- | ------------------------------------------------------------------------------------------------------------------ | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ----------- |
-| `_color`              | `_color`        | Defines the backgroundColor and foregroundColor.                                                                   | `string \| undefined \| { backgroundColor: string; foregroundColor: Stringified<CharacteristicColors>; }`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                         | `'#000'`    |
-| `_icons`              | `_icons`        | Defines the icon classnames (e.g. `_icons="fa-solid fa-user"`).                                                    | `KoliBriHorizontalIcons & KoliBriVerticalIcons \| string \| undefined`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                            | `undefined` |
-| `_label` _(required)_ | `_label`        | Defines the visible or semantic label of the component (e.g. aria-label, label, headline, caption, summary, etc.). | `string`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                          | `undefined` |
-| `_smartButton`        | `_smart-button` | Allows to add a button with an arbitrary action within the element (_hide-label only).                             | `string \| undefined \| { _label: string; } & { _ariaExpanded?: boolean \| undefined; _tabIndex?: number \| undefined; _value?: StencilUnknown; _accessKey?: string \| undefined; _role?: "tab" \| "treeitem" \| undefined; _ariaControls?: string \| undefined; _ariaDescription?: string \| undefined; _ariaSelected?: boolean \| undefined; _on?: ButtonCallbacksPropType<StencilUnknown> \| undefined; _type?: "button" \| "reset" \| "submit" \| undefined; _variant?: "primary" \| "secondary" \| "normal" \| "tertiary" \| "danger" \| "ghost" \| "custom" \| undefined; _customClass?: string \| undefined; _disabled?: boolean \| undefined; _hideLabel?: boolean \| undefined; _icons?: IconsPropType \| undefined; _id?: string \| undefined; _inline?: boolean \| undefined; _name?: string \| undefined; _shortKey?: string \| undefined; _syncValueBySelector?: string \| undefined; _tooltipAlign?: AlignPropType \| undefined; }` | `undefined` |
+| Property              | Attribute       | Description                                                                                                        | Type                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                               | Default     |
+| --------------------- | --------------- | ------------------------------------------------------------------------------------------------------------------ | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | ----------- |
+| `_color`              | `_color`        | Defines the backgroundColor and foregroundColor.                                                                   | `string \| undefined \| { backgroundColor: string; foregroundColor: Stringified<CharacteristicColors>; }`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                          | `'#000'`    |
+| `_icons`              | `_icons`        | Defines the icon classnames (e.g. `_icons="fa-solid fa-user"`).                                                    | `KoliBriHorizontalIcons & KoliBriVerticalIcons \| string \| undefined`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                             | `undefined` |
+| `_label` _(required)_ | `_label`        | Defines the visible or semantic label of the component (e.g. aria-label, label, headline, caption, summary, etc.). | `string`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                           | `undefined` |
+| `_smartButton`        | `_smart-button` | Allows to add a button with an arbitrary action within the element (_hide-label only).                             | `string \| undefined \| { _label: string; } & { _on?: ButtonCallbacksPropType<StencilUnknown> \| undefined; _type?: "button" \| "reset" \| "submit" \| undefined; _ariaExpanded?: boolean \| undefined; _tabIndex?: number \| undefined; _value?: StencilUnknown; _accessKey?: string \| undefined; _role?: "tab" \| "treeitem" \| undefined; _ariaControls?: string \| undefined; _ariaDescription?: string \| undefined; _ariaSelected?: boolean \| undefined; _customClass?: string \| undefined; _disabled?: boolean \| undefined; _hideLabel?: boolean \| undefined; _icons?: IconsPropType \| undefined; _id?: string \| undefined; _inline?: boolean \| undefined; _name?: string \| undefined; _shortKey?: string \| undefined; _syncValueBySelector?: string \| undefined; _tooltipAlign?: AlignPropType \| undefined; _variant?: string \| undefined; }` | `undefined` |
 
 
 ## Methods

package/doc/button-link.md

@@ -15,16 +15,16 @@
 | `_disabled`           | `_disabled`         | Makes the element not focusable and ignore all events.                                                                                                                                                                                   | `boolean \| undefined`                                                                                                                                 | `false`     |
 | `_hideLabel`          | `_hide-label`       | Hides the caption by default and displays the caption text with a tooltip when the interactive element is focused or the mouse is over it.                                                                                               | `boolean \| undefined`                                                                                                                                 | `false`     |
 | `_icons`              | `_icons`            | Defines the icon classnames (e.g. `_icons="fa-solid fa-user"`).                                                                                                                                                                          | `KoliBriHorizontalIcons & KoliBriVerticalIcons \| string \| undefined`                                                                                 | `undefined` |
-| `_id`                 | `_id`               | <span class="text-red-500">**[DEPRECATED]**</span> Will be removed in the next major version.<br/><br/>Defines the internal ID of the primary component element.                                                                            | `string \| undefined`                                                                                                                                  | `undefined` |
 | `_inline`             | `_inline`           | Defines whether the component is displayed as a standalone block or inline without enforcing a minimum size of 44px.                                                                                                                     | `boolean \| undefined`                                                                                                                                 | `true`      |
 | `_label` _(required)_ | `_label`            | Defines the visible or semantic label of the component (e.g. aria-label, label, headline, caption, summary, etc.). Set to `false` to enable the expert slot.                                                                             | `string`                                                                                                                                               | `undefined` |
 | `_name`               | `_name`             | Defines the technical name of an input field.                                                                                                                                                                                            | `string \| undefined`                                                                                                                                  | `undefined` |
 | `_on`                 | --                  | Gibt die EventCallback-Funktionen für die Button-Events an.                                                                                                                                                                              | `undefined \| { onClick?: EventValueOrEventCallback<MouseEvent, StencilUnknown> \| undefined; onMouseDown?: EventCallback<MouseEvent> \| undefined; }` | `undefined` |
-| `_role`               | `_role`             | <span style="color:red">**[DEPRECATED]**</span> We prefer the semantic role of the HTML element and do not allow for customization. We will remove this prop in the future.<br/><br/>Defines the role of the components primary element. | `"tab" \| "treeitem" \| undefined`                                                                                                                     | `undefined` |
+| `_role`               | `_role`             | <span class="text-red-500">**[DEPRECATED]**</span> We prefer the semantic role of the HTML element and do not allow for customization. We will remove this prop in the future.<br/><br/>Defines the role of the components primary element. | `"tab" \| "treeitem" \| undefined`                                                                                                                     | `undefined` |
 | `_shortKey`           | `_short-key`        | Adds a visual shortcut hint after the label and instructs the screen reader to read the shortcut aloud.                                                                                                                                  | `string \| undefined`                                                                                                                                  | `undefined` |
 | `_tooltipAlign`       | `_tooltip-align`    | Defines where to show the Tooltip preferably: top, right, bottom or left.                                                                                                                                                                | `"bottom" \| "left" \| "right" \| "top" \| undefined`                                                                                                  | `'top'`     |
 | `_type`               | `_type`             | Defines either the type of the component or of the components interactive element.                                                                                                                                                       | `"button" \| "reset" \| "submit" \| undefined`                                                                                                         | `'button'`  |
 | `_value`              | `_value`            | Defines the value of the element.                                                                                                                                                                                                        | `boolean \| null \| number \| object \| string \| undefined`                                                                                           | `undefined` |
+| `_variant`            | `_variant`          | Defines which variant should be used for presentation.                                                                                                                                                                                   | `string \| undefined`                                                                                                                                  | `undefined` |
 
 
 ## Methods

package/doc/button.md

@@ -16,12 +16,11 @@
 | `_disabled`           | `_disabled`         | Makes the element not focusable and ignore all events.                                                                                                                                                                                   | `boolean \| undefined`                                                                                                                                 | `false`     |
 | `_hideLabel`          | `_hide-label`       | Hides the caption by default and displays the caption text with a tooltip when the interactive element is focused or the mouse is over it.                                                                                               | `boolean \| undefined`                                                                                                                                 | `false`     |
 | `_icons`              | `_icons`            | Defines the icon classnames (e.g. `_icons="fa-solid fa-user"`).                                                                                                                                                                          | `KoliBriHorizontalIcons & KoliBriVerticalIcons \| string \| undefined`                                                                                 | `undefined` |
-| `_id`                 | `_id`               | <span class="text-red-500">**[DEPRECATED]**</span> Will be removed in the next major version.<br/><br/>Defines the internal ID of the primary component element.                                                                            | `string \| undefined`                                                                                                                                  | `undefined` |
 | `_inline`             | `_inline`           | Defines whether the component is displayed as a standalone block or inline without enforcing a minimum size of 44px.                                                                                                                     | `boolean \| undefined`                                                                                                                                 | `false`     |
 | `_label` _(required)_ | `_label`            | Defines the visible or semantic label of the component (e.g. aria-label, label, headline, caption, summary, etc.). Set to `false` to enable the expert slot.                                                                             | `string`                                                                                                                                               | `undefined` |
 | `_name`               | `_name`             | Defines the technical name of an input field.                                                                                                                                                                                            | `string \| undefined`                                                                                                                                  | `undefined` |
 | `_on`                 | --                  | Defines the callback functions for button events.                                                                                                                                                                                        | `undefined \| { onClick?: EventValueOrEventCallback<MouseEvent, StencilUnknown> \| undefined; onMouseDown?: EventCallback<MouseEvent> \| undefined; }` | `undefined` |
-| `_role`               | `_role`             | <span style="color:red">**[DEPRECATED]**</span> We prefer the semantic role of the HTML element and do not allow for customization. We will remove this prop in the future.<br/><br/>Defines the role of the components primary element. | `"tab" \| "treeitem" \| undefined`                                                                                                                     | `undefined` |
+| `_role`               | `_role`             | <span class="text-red-500">**[DEPRECATED]**</span> We prefer the semantic role of the HTML element and do not allow for customization. We will remove this prop in the future.<br/><br/>Defines the role of the components primary element. | `"tab" \| "treeitem" \| undefined`                                                                                                                     | `undefined` |
 | `_shortKey`           | `_short-key`        | Adds a visual shortcut hint after the label and instructs the screen reader to read the shortcut aloud.                                                                                                                                  | `string \| undefined`                                                                                                                                  | `undefined` |
 | `_tooltipAlign`       | `_tooltip-align`    | Defines where to show the Tooltip preferably: top, right, bottom or left.                                                                                                                                                                | `"bottom" \| "left" \| "right" \| "top" \| undefined`                                                                                                  | `'top'`     |
 | `_type`               | `_type`             | Defines either the type of the component or of the components interactive element.                                                                                                                                                       | `"button" \| "reset" \| "submit" \| undefined`                                                                                                         | `'button'`  |

package/doc/combobox.md

@@ -5,27 +5,26 @@
 
 ## Properties
 
-| Property                    | Attribute           | Description                                                                                                                                                   | Type                                                                                                                               | Default     |
-| --------------------------- | ------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------- | ---------------------------------------------------------------------------------------------------------------------------------- | ----------- |
-| `_accessKey`                | `_access-key`       | Defines the key combination that can be used to trigger or focus the component's interactive element.                                                         | `string \| undefined`                                                                                                              | `undefined` |
-| `_disabled`                 | `_disabled`         | Makes the element not focusable and ignore all events.                                                                                                        | `boolean \| undefined`                                                                                                             | `false`     |
-| `_hasClearButton`           | `_has-clear-button` | Shows the clear button if enabled.                                                                                                                            | `boolean \| undefined`                                                                                                             | `true`      |
-| `_hideLabel`                | `_hide-label`       | Hides the caption by default and displays the caption text with a tooltip when the interactive element is focused or the mouse is over it.                    | `boolean \| undefined`                                                                                                             | `false`     |
-| `_hideMsg`                  | `_hide-msg`         | Hides the error message but leaves it in the DOM for the input's aria-describedby.                                                                            | `boolean \| undefined`                                                                                                             | `false`     |
-| `_hint`                     | `_hint`             | Defines the hint text.                                                                                                                                        | `string \| undefined`                                                                                                              | `''`        |
-| `_icons`                    | `_icons`            | Defines the icon classnames (e.g. `_icons="fa-solid fa-user"`).                                                                                               | `string \| undefined \| { right?: IconOrIconClass \| undefined; left?: IconOrIconClass \| undefined; }`                            | `undefined` |
-| `_id`                       | `_id`               | <span class="text-red-500">**[DEPRECATED]**</span> Will be removed in the next major version.<br/><br/>Defines the internal ID of the primary component element. | `string \| undefined`                                                                                                              | `undefined` |
-| `_label` _(required)_       | `_label`            | Defines the visible or semantic label of the component (e.g. aria-label, label, headline, caption, summary, etc.). Set to `false` to enable the expert slot.  | `string`                                                                                                                           | `undefined` |
-| `_msg`                      | `_msg`              | Defines the properties for a message rendered as Alert component.                                                                                             | `Omit<AlertProps, "_on" \| "_variant" \| "_hasCloser" \| "_label" \| "_level"> & { _description: string; } \| string \| undefined` | `undefined` |
-| `_name`                     | `_name`             | Defines the technical name of an input field.                                                                                                                 | `string \| undefined`                                                                                                              | `undefined` |
-| `_on`                       | --                  | Gibt die EventCallback-Funktionen für das Input-Event an.                                                                                                     | `InputTypeOnBlur & InputTypeOnClick & InputTypeOnChange & InputTypeOnFocus & InputTypeOnInput & InputTypeOnKeyDown \| undefined`   | `undefined` |
-| `_placeholder`              | `_placeholder`      | Defines the placeholder for input field. To be shown when there's no value.                                                                                   | `string \| undefined`                                                                                                              | `undefined` |
-| `_required`                 | `_required`         | Makes the input element required.                                                                                                                             | `boolean \| undefined`                                                                                                             | `false`     |
-| `_shortKey`                 | `_short-key`        | Adds a visual shortcut hint after the label and instructs the screen reader to read the shortcut aloud.                                                       | `string \| undefined`                                                                                                              | `undefined` |
-| `_suggestions` _(required)_ | `_suggestions`      | Suggestions to provide for the input.                                                                                                                         | `W3CInputValue[] \| string`                                                                                                        | `undefined` |
-| `_tooltipAlign`             | `_tooltip-align`    | Defines where to show the Tooltip preferably: top, right, bottom or left.                                                                                     | `"bottom" \| "left" \| "right" \| "top" \| undefined`                                                                              | `'top'`     |
-| `_touched`                  | `_touched`          | Shows if the input was touched by a user.                                                                                                                     | `boolean \| undefined`                                                                                                             | `false`     |
-| `_value`                    | `_value`            | Defines the value of the element.                                                                                                                             | `string \| undefined`                                                                                                              | `undefined` |
+| Property                    | Attribute           | Description                                                                                                                                                  | Type                                                                                                                               | Default     |
+| --------------------------- | ------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------ | ---------------------------------------------------------------------------------------------------------------------------------- | ----------- |
+| `_accessKey`                | `_access-key`       | Defines the key combination that can be used to trigger or focus the component's interactive element.                                                        | `string \| undefined`                                                                                                              | `undefined` |
+| `_disabled`                 | `_disabled`         | Makes the element not focusable and ignore all events.                                                                                                       | `boolean \| undefined`                                                                                                             | `false`     |
+| `_hasClearButton`           | `_has-clear-button` | Shows the clear button if enabled.                                                                                                                           | `boolean \| undefined`                                                                                                             | `true`      |
+| `_hideLabel`                | `_hide-label`       | Hides the caption by default and displays the caption text with a tooltip when the interactive element is focused or the mouse is over it.                   | `boolean \| undefined`                                                                                                             | `false`     |
+| `_hideMsg`                  | `_hide-msg`         | Hides the error message but leaves it in the DOM for the input's aria-describedby.                                                                           | `boolean \| undefined`                                                                                                             | `false`     |
+| `_hint`                     | `_hint`             | Defines the hint text.                                                                                                                                       | `string \| undefined`                                                                                                              | `''`        |
+| `_icons`                    | `_icons`            | Defines the icon classnames (e.g. `_icons="fa-solid fa-user"`).                                                                                              | `string \| undefined \| { right?: IconOrIconClass \| undefined; left?: IconOrIconClass \| undefined; }`                            | `undefined` |
+| `_label` _(required)_       | `_label`            | Defines the visible or semantic label of the component (e.g. aria-label, label, headline, caption, summary, etc.). Set to `false` to enable the expert slot. | `string`                                                                                                                           | `undefined` |
+| `_msg`                      | `_msg`              | Defines the properties for a message rendered as Alert component.                                                                                            | `Omit<AlertProps, "_on" \| "_variant" \| "_hasCloser" \| "_label" \| "_level"> & { _description: string; } \| string \| undefined` | `undefined` |
+| `_name`                     | `_name`             | Defines the technical name of an input field.                                                                                                                | `string \| undefined`                                                                                                              | `undefined` |
+| `_on`                       | --                  | Gibt die EventCallback-Funktionen für das Input-Event an.                                                                                                    | `InputTypeOnBlur & InputTypeOnClick & InputTypeOnChange & InputTypeOnFocus & InputTypeOnInput & InputTypeOnKeyDown \| undefined`   | `undefined` |
+| `_placeholder`              | `_placeholder`      | Defines the placeholder for input field. To be shown when there's no value.                                                                                  | `string \| undefined`                                                                                                              | `undefined` |
+| `_required`                 | `_required`         | Makes the input element required.                                                                                                                            | `boolean \| undefined`                                                                                                             | `false`     |
+| `_shortKey`                 | `_short-key`        | Adds a visual shortcut hint after the label and instructs the screen reader to read the shortcut aloud.                                                      | `string \| undefined`                                                                                                              | `undefined` |
+| `_suggestions` _(required)_ | `_suggestions`      | Suggestions to provide for the input.                                                                                                                        | `W3CInputValue[] \| string`                                                                                                        | `undefined` |
+| `_tooltipAlign`             | `_tooltip-align`    | Defines where to show the Tooltip preferably: top, right, bottom or left.                                                                                    | `"bottom" \| "left" \| "right" \| "top" \| undefined`                                                                              | `'top'`     |
+| `_touched`                  | `_touched`          | Shows if the input was touched by a user.                                                                                                                    | `boolean \| undefined`                                                                                                             | `false`     |
+| `_value`                    | `_value`            | Defines the value of the element.                                                                                                                            | `string \| undefined`                                                                                                              | `undefined` |
 
 
 ## Methods