@public-ui/components 2.2.0-alpha.0 → 2.2.0

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

@@ -1,10 +1,9 @@
 import type { Generic } from 'adopted-style-sheets';
-import type { MsgPropType, PropDisabled, PropHideError, PropHideLabel, PropLabelWithExpertSlot, PropMsg, PropName, PropSuggestions, PropSyncValueBySelector, PropTouched } from '../props';
+import type { PropAccessKey, MsgPropType, PropDisabled, PropHideError, PropHideLabel, PropLabelWithExpertSlot, PropMsg, PropName, PropShortKey, PropSuggestions, PropSyncValueBySelector, PropTouched } from '../props';
 import type { InputTypeOnDefault, InputTypeOnOff, KoliBriHorizontalIcons, Stringified, W3CInputValue } from '../types';
 import type { ButtonProps } from './button';
 type RequiredProps = PropLabelWithExpertSlot;
 type OptionalProps = {
-    accessKey: string;
     alert: boolean;
     autoComplete: InputTypeOnOff;
     error: string;
@@ -15,14 +14,13 @@ type OptionalProps = {
     smartButton: Stringified<ButtonProps>;
     tabIndex: number;
     value: string;
-} & PropDisabled & PropHideError & PropHideLabel & PropName & PropSuggestions & PropSyncValueBySelector & PropTouched;
+} & PropAccessKey & PropDisabled & PropHideError & PropHideLabel & PropName & PropShortKey & PropSuggestions & PropSyncValueBySelector & PropTouched;
 type RequiredStates = {
     autoComplete: InputTypeOnOff;
     id: string;
     suggestions: W3CInputValue[];
 } & PropHideError & PropLabelWithExpertSlot;
 type OptionalStates = {
-    accessKey: string;
     alert: boolean;
     hint: string;
     icons: KoliBriHorizontalIcons;
@@ -30,7 +28,7 @@ type OptionalStates = {
     smartButton: ButtonProps;
     tabIndex: number;
     value: string;
-} & PropDisabled & PropHideLabel & PropMsg & PropName & PropTouched;
+} & PropAccessKey & PropDisabled & PropHideLabel & PropMsg & PropName & PropShortKey & PropTouched;
 export type InputColorProps = Generic.Element.Members<RequiredProps, OptionalProps>;
 export type InputColorStates = Generic.Element.Members<RequiredStates, OptionalStates>;
 export type InputColorWatches = Generic.Element.Watchers<RequiredProps, OptionalProps>;

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

@@ -1,5 +1,5 @@
 import type { Generic } from 'adopted-style-sheets';
-import type { MsgPropType, PropDisabled, PropHideError, PropHideLabel, PropId, PropLabelWithExpertSlot, PropMsg, PropName, PropReadOnly, PropRequired, PropSuggestions, PropSyncValueBySelector, PropTouched } from '../props';
+import type { MsgPropType, PropAccessKey, PropDisabled, PropHideError, PropHideLabel, PropId, PropLabelWithExpertSlot, PropMsg, PropName, PropReadOnly, PropRequired, PropShortKey, PropSuggestions, PropSyncValueBySelector, PropTouched } from '../props';
 import type { InputDateType, InputTypeOnDefault, InputTypeOnOff, Iso8601, KoliBriHorizontalIcons, OptionalInputProps, Stringified, W3CInputValue } from '../types';
 import type { ButtonProps } from './button';
 type RequiredProps = PropLabelWithExpertSlot;
@@ -15,7 +15,6 @@ type RequiredStates = {
     type: InputDateType;
 } & PropLabelWithExpertSlot & PropHideError & PropId;
 type OptionalStates = {
-    accessKey: string;
     alert: boolean;
     hint: string;
     icons: KoliBriHorizontalIcons;
@@ -27,7 +26,7 @@ type OptionalStates = {
     step: number;
     tabIndex: number;
     value: Iso8601 | null;
-} & PropSyncValueBySelector & PropDisabled & PropHideLabel & PropMsg & PropName & PropReadOnly & PropRequired & PropTouched;
+} & PropAccessKey & PropSyncValueBySelector & PropDisabled & PropHideLabel & PropMsg & PropName & PropReadOnly & PropRequired & PropShortKey & PropTouched;
 export type InputDateProps = Generic.Element.Members<RequiredProps, OptionalProps>;
 export type InputDateStates = Generic.Element.Members<RequiredStates, OptionalStates>;
 export type InputDateWatches = Generic.Element.Watchers<RequiredProps, OptionalProps>;

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

@@ -1,10 +1,9 @@
 import type { Generic } from 'adopted-style-sheets';
-import type { MsgPropType, PropDisabled, PropHasCounter, PropHideError, PropHideLabel, PropId, PropLabelWithExpertSlot, PropMsg, PropMultiple, PropName, PropReadOnly, PropRequired, PropSuggestions, PropSyncValueBySelector, PropTouched } from '../props';
+import type { MsgPropType, PropAccessKey, PropDisabled, PropHasCounter, PropHideError, PropHideLabel, PropId, PropLabelWithExpertSlot, PropMsg, PropMultiple, PropName, PropReadOnly, PropRequired, PropShortKey, PropSuggestions, PropSyncValueBySelector, PropTouched } from '../props';
 import type { InputTypeOnDefault, InputTypeOnOff, KoliBriHorizontalIcons, Stringified, W3CInputValue } from '../types';
 import type { ButtonProps } from './button';
 type RequiredProps = PropLabelWithExpertSlot;
 type OptionalProps = {
-    accessKey: string;
     alert: boolean;
     autoComplete: InputTypeOnOff;
     error: string;
@@ -18,14 +17,13 @@ type OptionalProps = {
     smartButton: Stringified<ButtonProps>;
     tabIndex: number;
     value: string;
-} & PropDisabled & PropHasCounter & PropHideError & PropHideLabel & PropMultiple & PropName & PropReadOnly & PropRequired & PropSuggestions & PropSyncValueBySelector & PropTouched;
+} & PropAccessKey & PropDisabled & PropHasCounter & PropHideError & PropHideLabel & PropMultiple & PropName & PropReadOnly & PropRequired & PropShortKey & PropSuggestions & PropSyncValueBySelector & PropTouched;
 type RequiredStates = {
     autoComplete: InputTypeOnOff;
     hasValue: boolean;
     suggestions: W3CInputValue[];
 } & PropId & PropHideError & PropLabelWithExpertSlot;
 type OptionalStates = {
-    accessKey: string;
     alert: boolean;
     currentLength: number;
     hint: string;
@@ -37,7 +35,7 @@ type OptionalStates = {
     smartButton: ButtonProps;
     tabIndex: number;
     value: string;
-} & PropDisabled & PropHasCounter & PropHideLabel & PropMsg & PropMultiple & PropName & PropReadOnly & PropRequired & PropTouched;
+} & PropAccessKey & PropDisabled & PropHasCounter & PropHideLabel & PropMsg & PropMultiple & PropName & PropReadOnly & PropRequired & PropShortKey & PropTouched;
 export type InputEmailProps = Generic.Element.Members<RequiredProps, OptionalProps>;
 export type InputEmailStates = Generic.Element.Members<RequiredStates, OptionalStates>;
 export type InputEmailWatches = Generic.Element.Watchers<RequiredProps, OptionalProps>;

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

@@ -1,12 +1,11 @@
 import type { Generic } from 'adopted-style-sheets';
-import type { MsgPropType, PropDisabled, PropHideError, PropHideLabel, PropId, PropLabelWithExpertSlot, PropMsg, PropMultiple, PropName, PropRequired, PropSyncValueBySelector, PropTouched } from '../props';
+import type { MsgPropType, PropDisabled, PropHideError, PropHideLabel, PropId, PropLabelWithExpertSlot, PropMsg, PropMultiple, PropName, PropRequired, PropSyncValueBySelector, PropTouched, PropAccessKey, PropShortKey } from '../props';
 import type { InputTypeOnDefault, KoliBriHorizontalIcons, Stringified } from '../types';
 import type { ButtonProps } from './button';
 type RequiredProps = PropLabelWithExpertSlot;
 type OptionalProps = {
     accept: string;
     alert: boolean;
-    accessKey: string;
     error: string;
     hint: string;
     icons: Stringified<KoliBriHorizontalIcons>;
@@ -15,19 +14,18 @@ type OptionalProps = {
     smartButton: Stringified<ButtonProps>;
     tabIndex: number;
     value: string;
-} & PropDisabled & PropHideError & PropHideLabel & PropMultiple & PropName & PropRequired & PropSyncValueBySelector & PropTouched;
+} & PropAccessKey & PropDisabled & PropHideError & PropHideLabel & PropMultiple & PropName & PropRequired & PropShortKey & PropSyncValueBySelector & PropTouched;
 type RequiredStates = PropId & PropLabelWithExpertSlot & PropHideError;
 type OptionalStates = {
     accept: string;
     alert: boolean;
-    accessKey: string;
     hint: string;
     icons: KoliBriHorizontalIcons;
     on: InputTypeOnDefault;
     smartButton: ButtonProps;
     tabIndex: number;
     value: string;
-} & PropDisabled & PropHideLabel & PropMsg & PropMultiple & PropName & PropRequired & PropTouched;
+} & PropAccessKey & PropDisabled & PropHideLabel & PropMsg & PropMultiple & PropName & PropRequired & PropShortKey & PropTouched;
 export type InputFileProps = Generic.Element.Members<RequiredProps, OptionalProps>;
 export type InputFileStates = Generic.Element.Members<RequiredStates, OptionalStates>;
 export type InputFileWatches = Generic.Element.Watchers<RequiredProps, OptionalProps>;

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

@@ -1,5 +1,5 @@
 import type { Generic } from 'adopted-style-sheets';
-import type { MsgPropType, PropDisabled, PropHideError, PropHideLabel, PropId, PropLabelWithExpertSlot, PropMsg, PropName, PropReadOnly, PropRequired, PropSuggestions, PropSyncValueBySelector, PropTouched } from '../props';
+import type { MsgPropType, PropAccessKey, PropDisabled, PropHideError, PropHideLabel, PropId, PropLabelWithExpertSlot, PropMsg, PropName, PropReadOnly, PropRequired, PropShortKey, PropSuggestions, PropSyncValueBySelector, PropTouched } from '../props';
 import type { InputTypeOnDefault, InputTypeOnOff, Iso8601, KoliBriHorizontalIcons, OptionalInputProps, Stringified, W3CInputValue } from '../types';
 import type { ButtonProps } from './button';
 type RequiredProps = PropLabelWithExpertSlot;
@@ -14,7 +14,6 @@ type RequiredStates = {
     suggestions: W3CInputValue[];
 } & PropId & PropHideError & PropLabelWithExpertSlot;
 type OptionalStates = {
-    accessKey: string;
     alert: boolean;
     hint: string;
     icons: KoliBriHorizontalIcons;
@@ -26,7 +25,7 @@ type OptionalStates = {
     step: number;
     tabIndex: number;
     value: string;
-} & PropDisabled & PropHideLabel & PropMsg & PropName & PropReadOnly & PropRequired & PropSyncValueBySelector & PropTouched;
+} & PropAccessKey & PropDisabled & PropHideLabel & PropMsg & PropName & PropReadOnly & PropRequired & PropSyncValueBySelector & PropShortKey & PropTouched;
 export type InputNumberProps = Generic.Element.Members<RequiredProps, OptionalProps>;
 export type InputNumberStates = Generic.Element.Members<RequiredStates, OptionalStates>;
 export type InputNumberWatches = Generic.Element.Watchers<RequiredProps, OptionalProps>;

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

@@ -1,11 +1,10 @@
 import type { Generic } from 'adopted-style-sheets';
-import type { MsgPropType, PropDisabled, PropHasCounter, PropHideError, PropHideLabel, PropId, PropLabelWithExpertSlot, PropMsg, PropName, PropReadOnly, PropRequired, PropSyncValueBySelector, PropTouched } from '../props';
+import type { MsgPropType, PropAccessKey, PropDisabled, PropHasCounter, PropHideError, PropHideLabel, PropId, PropLabelWithExpertSlot, PropMsg, PropName, PropReadOnly, PropRequired, PropShortKey, PropSyncValueBySelector, PropTouched } from '../props';
 import type { InputTypeOnDefault, InputTypeOnOff, KoliBriHorizontalIcons, Stringified } from '../types';
 import type { ButtonProps } from './button';
 import type { PropPasswordVariant } from '../props/variant/password-variant';
 type RequiredProps = PropLabelWithExpertSlot;
 type OptionalProps = {
-    accessKey: string;
     alert: boolean;
     autoComplete: InputTypeOnOff;
     error: string;
@@ -19,13 +18,12 @@ type OptionalProps = {
     tabIndex: number;
     value: string;
     msg: Stringified<MsgPropType>;
-} & PropPasswordVariant & PropDisabled & PropHasCounter & PropHideError & PropHideLabel & PropName & PropReadOnly & PropRequired & PropSyncValueBySelector & PropTouched;
+} & PropAccessKey & PropPasswordVariant & PropDisabled & PropHasCounter & PropHideError & PropHideLabel & PropName & PropReadOnly & PropRequired & PropShortKey & PropSyncValueBySelector & PropTouched;
 type RequiredStates = {
     autoComplete: InputTypeOnOff;
     hasValue: boolean;
 } & PropId & PropHideError & PropLabelWithExpertSlot;
 type OptionalStates = {
-    accessKey: string;
     alert: boolean;
     currentLength: number;
     hint: string;
@@ -37,7 +35,7 @@ type OptionalStates = {
     smartButton: ButtonProps;
     tabIndex: number;
     value: string | null;
-} & PropPasswordVariant & PropDisabled & PropHasCounter & PropHideLabel & PropMsg & PropName & PropReadOnly & PropRequired & PropTouched;
+} & PropAccessKey & PropPasswordVariant & PropDisabled & PropHasCounter & PropHideLabel & PropMsg & PropName & PropReadOnly & PropRequired & PropShortKey & PropTouched;
 export type InputPasswordProps = Generic.Element.Members<RequiredProps, OptionalProps>;
 export type InputPasswordStates = Generic.Element.Members<RequiredStates, OptionalStates>;
 export type InputPasswordWatches = Generic.Element.Watchers<RequiredProps, OptionalProps>;

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

@@ -1,9 +1,8 @@
 import type { Generic } from 'adopted-style-sheets';
-import type { MsgPropType, PropDisabled, PropHideError, PropHideLabel, PropId, PropLabelWithExpertSlot, PropMsg, PropName, PropRadioOptions, PropRequired, PropSyncValueBySelector, PropTooltipAlign, PropTouched } from '../props';
+import type { MsgPropType, PropAccessKey, PropDisabled, PropHideError, PropHideLabel, PropId, PropLabelWithExpertSlot, PropMsg, PropName, PropRadioOptions, PropRequired, PropShortKey, PropSyncValueBySelector, PropTooltipAlign, PropTouched } from '../props';
 import type { InputTypeOnDefault, RadioOption, Orientation, StencilUnknown, Stringified } from '../types';
 type RequiredProps = PropLabelWithExpertSlot;
 type OptionalProps = {
-    accessKey: string;
     alert: boolean;
     error: string;
     hint: string;
@@ -12,19 +11,18 @@ type OptionalProps = {
     orientation: Orientation;
     tabIndex: number;
     value: StencilUnknown;
-} & PropDisabled & PropHideError & PropHideLabel & PropName & PropRadioOptions & PropRequired & PropSyncValueBySelector & PropTouched & PropTooltipAlign;
+} & PropAccessKey & PropDisabled & PropHideError & PropHideLabel & PropName & PropRadioOptions & PropRequired & PropShortKey & PropSyncValueBySelector & PropTouched & PropTooltipAlign;
 type RequiredStates = {
     options: RadioOption<StencilUnknown>[];
     orientation: Orientation;
 } & PropId & PropHideError & PropLabelWithExpertSlot;
 type OptionalStates = {
-    accessKey: string;
     alert: boolean;
     hint: string;
     on: InputTypeOnDefault;
     tabIndex: number;
     value: StencilUnknown;
-} & PropDisabled & PropHideLabel & PropMsg & PropName & PropRequired & PropTouched;
+} & PropAccessKey & PropDisabled & PropHideLabel & PropMsg & PropName & PropRequired & PropShortKey & PropTouched;
 export type InputRadioProps = Generic.Element.Members<RequiredProps, OptionalProps>;
 export type InputRadioStates = Generic.Element.Members<RequiredStates, OptionalStates>;
 export type InputRadioWatches = Generic.Element.Watchers<RequiredProps, OptionalProps>;

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

@@ -1,9 +1,8 @@
 import type { Generic } from 'adopted-style-sheets';
-import type { MsgPropType, PropDisabled, PropHideError, PropHideLabel, PropId, PropLabelWithExpertSlot, PropMsg, PropName, PropSuggestions, PropSyncValueBySelector, PropTouched } from '../props';
+import type { MsgPropType, PropAccessKey, PropDisabled, PropHideError, PropHideLabel, PropId, PropLabelWithExpertSlot, PropMsg, PropName, PropShortKey, PropSuggestions, PropSyncValueBySelector, PropTouched } from '../props';
 import type { InputTypeOnDefault, InputTypeOnOff, KoliBriHorizontalIcons, Stringified, W3CInputValue } from '../types';
 type RequiredProps = PropLabelWithExpertSlot;
 type OptionalProps = {
-    accessKey: string;
     alert: boolean;
     autoComplete: InputTypeOnOff;
     error: string;
@@ -16,13 +15,12 @@ type OptionalProps = {
     step: number;
     tabIndex: number;
     value: number;
-} & PropDisabled & PropHideError & PropHideLabel & PropName & PropSuggestions & PropSyncValueBySelector & PropTouched;
+} & PropAccessKey & PropDisabled & PropHideError & PropHideLabel & PropName & PropSuggestions & PropSyncValueBySelector & PropShortKey & PropTouched;
 type RequiredStates = {
     autoComplete: InputTypeOnOff;
     suggestions: W3CInputValue[];
 } & PropId & PropHideError & PropLabelWithExpertSlot;
 type OptionalStates = {
-    accessKey: string;
     alert: boolean;
     hint: string;
     icons: KoliBriHorizontalIcons;
@@ -32,7 +30,7 @@ type OptionalStates = {
     step: number;
     tabIndex: number;
     value: number;
-} & PropDisabled & PropHideLabel & PropMsg & PropName & PropTouched;
+} & PropAccessKey & PropDisabled & PropHideLabel & PropMsg & PropName & PropShortKey & PropTouched;
 export type InputRangeProps = Generic.Element.Members<RequiredProps, OptionalProps>;
 export type InputRangeStates = Generic.Element.Members<RequiredStates, OptionalStates>;
 export type InputRangeWatches = Generic.Element.Watchers<RequiredProps, OptionalProps>;

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

@@ -1,10 +1,9 @@
 import type { Generic } from 'adopted-style-sheets';
-import type { MsgPropType, PropDisabled, PropHasCounter, PropHideError, PropHideLabel, PropId, PropLabelWithExpertSlot, PropMsg, PropName, PropReadOnly, PropRequired, PropSuggestions, PropSyncValueBySelector, PropTouched } from '../props';
+import type { MsgPropType, PropAccessKey, PropDisabled, PropHasCounter, PropHideError, PropHideLabel, PropId, PropLabelWithExpertSlot, PropMsg, PropName, PropReadOnly, PropRequired, PropShortKey, PropSuggestions, PropSyncValueBySelector, PropTouched } from '../props';
 import type { InputTextType, InputTypeOnDefault, InputTypeOnOff, KoliBriHorizontalIcons, Stringified, W3CInputValue } from '../types';
 import type { ButtonProps } from './button';
 type RequiredProps = PropLabelWithExpertSlot;
 type OptionalProps = {
-    accessKey: string;
     alert: boolean;
     autoComplete: InputTypeOnOff;
     error: string;
@@ -19,7 +18,7 @@ type OptionalProps = {
     type: InputTextType;
     value: string;
     msg: Stringified<MsgPropType>;
-} & PropDisabled & PropHasCounter & PropHideError & PropHideLabel & PropId & PropName & PropReadOnly & PropRequired & PropSuggestions & PropSyncValueBySelector & PropTouched;
+} & PropAccessKey & PropDisabled & PropHasCounter & PropHideError & PropHideLabel & PropId & PropName & PropReadOnly & PropRequired & PropShortKey & PropSuggestions & PropSyncValueBySelector & PropTouched;
 type RequiredStates = {
     autoComplete: InputTypeOnOff;
     hasValue: boolean;
@@ -27,7 +26,6 @@ type RequiredStates = {
     type: InputTextType;
 } & PropId & PropHideError & PropLabelWithExpertSlot;
 type OptionalStates = {
-    accessKey: string;
     alert: boolean;
     currentLength: number;
     hint: string;
@@ -39,7 +37,7 @@ type OptionalStates = {
     smartButton: ButtonProps;
     tabIndex: number;
     value: string;
-} & PropDisabled & PropHasCounter & PropHideLabel & PropMsg & PropName & PropReadOnly & PropRequired & PropTouched;
+} & PropAccessKey & PropDisabled & PropHasCounter & PropHideLabel & PropMsg & PropName & PropReadOnly & PropRequired & PropShortKey & PropTouched;
 export type InputTextProps = Generic.Element.Members<RequiredProps, OptionalProps>;
 export type InputTextStates = Generic.Element.Members<RequiredStates, OptionalStates>;
 export type InputTextWatches = Generic.Element.Watchers<RequiredProps, OptionalProps>;

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

@@ -1,9 +1,9 @@
 import type { Generic } from 'adopted-style-sheets';
-import type { PropAccessKey, PropAlternativeButtonLinkRole, PropAriaCurrentValue, PropAriaDescription, PropAriaExpanded, PropAriaOwns, PropDisabled, PropDownload, PropHideLabel, PropHref, PropIcons, PropLabelWithExpertSlot, PropLinkOnCallbacks, PropLinkTarget, PropTooltipAlign } from '../props';
+import type { PropAccessKey, PropAlternativeButtonLinkRole, PropAriaCurrentValue, PropAriaDescription, PropAriaExpanded, PropAriaOwns, PropDisabled, PropDownload, PropHideLabel, PropHref, PropIcons, PropLabelWithExpertSlot, PropLinkOnCallbacks, PropLinkTarget, PropShortKey, PropTooltipAlign } from '../props';
 export type RequiredProps = PropHref;
 export type OptionalProps = {
     tabIndex: number;
-} & PropAccessKey & PropAlternativeButtonLinkRole & PropAriaCurrentValue & PropAriaDescription & PropDisabled & PropDownload & PropHideLabel & PropIcons & PropLabelWithExpertSlot & PropLinkOnCallbacks & PropLinkTarget & PropTooltipAlign;
+} & PropAccessKey & PropAlternativeButtonLinkRole & PropAriaCurrentValue & PropAriaDescription & PropDisabled & PropDownload & PropHideLabel & PropIcons & PropLabelWithExpertSlot & PropLinkOnCallbacks & PropLinkTarget & PropShortKey & PropTooltipAlign;
 type RequiredStates = PropAriaCurrentValue & PropIcons & PropHref;
 type OptionalStates = {
     ariaCurrent: string;

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

@@ -1,9 +1,8 @@
 import type { Generic } from 'adopted-style-sheets';
-import type { MsgPropType, PropDisabled, PropHideError, PropHideLabel, PropId, PropLabelWithExpertSlot, PropMsg, PropMultiple, PropName, PropOptionsWithOptgroup, PropRequired, PropRows, PropSyncValueBySelector, PropTouched } from '../props';
+import type { MsgPropType, PropAccessKey, PropDisabled, PropHideError, PropHideLabel, PropId, PropLabelWithExpertSlot, PropMsg, PropMultiple, PropName, PropOptionsWithOptgroup, PropRequired, PropRows, PropShortKey, PropSyncValueBySelector, PropTouched } from '../props';
 import type { InputTypeOnDefault, KoliBriHorizontalIcons, SelectOption, Stringified, W3CInputValue } from '../types';
 type RequiredProps = PropLabelWithExpertSlot;
 type OptionalProps = {
-    accessKey: string;
     alert: boolean;
     error: string;
     hint: string;
@@ -12,21 +11,20 @@ type OptionalProps = {
     on: InputTypeOnDefault;
     tabIndex: number;
     value: Stringified<W3CInputValue[]>;
-} & PropDisabled & PropHideError & PropHideLabel & PropMultiple & PropName & PropOptionsWithOptgroup & PropRequired & PropRows & PropSyncValueBySelector & PropTouched;
+} & PropAccessKey & PropDisabled & PropHideError & PropHideLabel & PropMultiple & PropName & PropOptionsWithOptgroup & PropRequired & PropRows & PropShortKey & PropSyncValueBySelector & PropTouched;
 type RequiredStates = {
     hasValue: boolean;
     options: SelectOption<W3CInputValue>[];
     value: W3CInputValue[];
 } & PropId & PropHideError & PropMultiple & PropLabelWithExpertSlot;
 type OptionalStates = {
-    accessKey: string;
     alert: boolean;
     error: string;
     hint: string;
     icons: KoliBriHorizontalIcons;
     on: InputTypeOnDefault;
     tabIndex: number;
-} & PropDisabled & PropHideLabel & PropId & PropName & PropRequired & PropRows & PropMsg & PropTouched;
+} & PropAccessKey & PropDisabled & PropHideLabel & PropId & 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

@@ -1,9 +1,8 @@
 import type { Generic } from 'adopted-style-sheets';
-import type { PropDisabled, PropHideError, PropHideLabel, PropId, PropLabelWithExpertSlot, PropMsg, PropName, PropRequired, PropSyncValueBySelector, PropTouched, PropOptions, MsgPropType } from '../props';
+import type { MsgPropType, PropDisabled, PropHideError, PropHideLabel, PropId, PropLabelWithExpertSlot, PropMsg, PropName, PropRequired, PropSyncValueBySelector, PropTouched, PropOptions, PropShortKey, PropAccessKey } from '../props';
 import type { InputTypeOnDefault, KoliBriHorizontalIcons, Option, StencilUnknown, Stringified } from '../types';
 type RequiredProps = PropLabelWithExpertSlot & PropOptions;
 type OptionalProps = {
-    accessKey: string;
     hint: string;
     icons: Stringified<KoliBriHorizontalIcons>;
     msg: Stringified<MsgPropType>;
@@ -11,12 +10,11 @@ type OptionalProps = {
     placeholder: string;
     tabIndex: number;
     value: string;
-} & PropDisabled & PropHideError & PropHideLabel & PropName & PropRequired & PropSyncValueBySelector & PropTouched;
+} & PropAccessKey & PropDisabled & PropHideError & PropHideLabel & PropName & PropRequired & PropSyncValueBySelector & PropShortKey & PropTouched;
 type RequiredStates = {
     options: Option<StencilUnknown>[];
 } & PropId & PropHideError & PropLabelWithExpertSlot;
 type OptionalStates = {
-    accessKey: string;
     alert: boolean;
     hint: string;
     value: string;
@@ -24,7 +22,7 @@ type OptionalStates = {
     on: InputTypeOnDefault;
     tabIndex: number;
     placeholder: string;
-} & PropDisabled & PropHideLabel & PropId & PropName & PropRequired & PropMsg & PropTouched;
+} & PropAccessKey & PropDisabled & PropHideLabel & PropId & PropName & PropRequired & 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/span.d.ts

@@ -1,11 +1,11 @@
 import type { Generic } from 'adopted-style-sheets';
-import type { PropAccessKey, PropHideLabel, PropLabelWithExpertSlot } from '../props';
+import type { PropHideLabel, PropLabelWithExpertSlot, PropBadgeText } from '../props';
 import type { KoliBriCustomIcon, KoliBriIconsProp, Stringified } from '../types';
 type RequiredProps = PropLabelWithExpertSlot;
 type OptionalProps = {
     allowMarkdown: boolean;
     icons: Stringified<KoliBriIconsProp>;
-} & PropHideLabel & PropAccessKey;
+} & PropHideLabel & PropBadgeText;
 type RequiredStates = {
     allowMarkdown: boolean;
     icons: {
@@ -15,7 +15,7 @@ type RequiredStates = {
         left?: KoliBriCustomIcon;
     };
 } & PropLabelWithExpertSlot;
-type OptionalStates = PropHideLabel & PropAccessKey;
+type OptionalStates = PropHideLabel & PropBadgeText;
 export type SpanProps = Generic.Element.Members<RequiredProps, OptionalProps>;
 export type SpanStates = Generic.Element.Members<RequiredStates, OptionalStates>;
 export type SpanAPI = Generic.Element.ComponentApi<RequiredProps, OptionalProps, RequiredStates, OptionalStates>;

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

@@ -1,11 +1,10 @@
 import type { Generic } from 'adopted-style-sheets';
-import type { MsgPropType, PropAdjustHeight, PropDisabled, PropHasCounter, PropHideError, PropHideLabel, PropId, PropLabelWithExpertSlot, PropMsg, PropName, PropReadOnly, PropRequired, PropRows, PropSyncValueBySelector, PropTouched } from '../props';
+import type { MsgPropType, PropAccessKey, PropAdjustHeight, PropDisabled, PropHasCounter, PropHideError, PropHideLabel, PropId, PropLabelWithExpertSlot, PropMsg, PropName, PropReadOnly, PropRequired, PropRows, PropShortKey, PropSyncValueBySelector, PropTouched } from '../props';
 import type { InputTypeOnDefault, KoliBriHorizontalIcons, Stringified } from '../types';
 export declare const cssResizeOptions: readonly ["both", "horizontal", "vertical", "none"];
 export type CSSResize = (typeof cssResizeOptions)[number];
 type RequiredProps = PropLabelWithExpertSlot;
 type OptionalProps = {
-    accessKey: string;
     alert: boolean;
     error: string;
     hint: string;
@@ -17,7 +16,7 @@ type OptionalProps = {
     resize: CSSResize;
     tabIndex: number;
     value: string;
-} & PropAdjustHeight & PropDisabled & PropHasCounter & PropHideError & PropHideLabel & PropName & PropReadOnly & PropRequired & PropRows & PropSyncValueBySelector & PropTouched;
+} & PropAccessKey & PropAdjustHeight & PropDisabled & PropHasCounter & PropHideError & PropHideLabel & PropName & PropReadOnly & PropRequired & PropRows & PropSyncValueBySelector & PropShortKey & PropTouched;
 type RequiredStates = {
     adjustHeight: boolean;
     currentLength: number;
@@ -25,7 +24,6 @@ type RequiredStates = {
     resize: CSSResize;
 } & PropId & PropAdjustHeight & PropHideError & PropLabelWithExpertSlot;
 type OptionalStates = {
-    accessKey: string;
     alert: boolean;
     error: string;
     hint: string;
@@ -35,7 +33,7 @@ type OptionalStates = {
     placeholder: string;
     tabIndex: number;
     value: string;
-} & PropDisabled & PropHasCounter & PropHideLabel & PropMsg & PropName & PropReadOnly & PropRequired & PropRows & PropTouched;
+} & PropAccessKey & PropDisabled & PropHasCounter & PropHideLabel & PropMsg & PropName & PropReadOnly & PropRequired & PropRows & PropShortKey & PropTouched;
 export type TextareaProps = Generic.Element.Members<RequiredProps, OptionalProps>;
 export type TextareaStates = Generic.Element.Members<RequiredStates, OptionalStates>;
 export type TextareaWatches = Generic.Element.Watchers<RequiredProps, OptionalProps>;

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

@@ -1,9 +1,9 @@
 import type { Generic } from 'adopted-style-sheets';
-import type { PropAccessKey, PropAlign, PropId, PropLabel } from '../props';
+import type { PropAlign, PropBadgeText, PropId, PropLabel } from '../props';
 type RequiredProps = PropLabel;
-type OptionalProps = PropAccessKey & PropAlign & PropId;
+type OptionalProps = PropBadgeText & PropAlign & PropId;
 type RequiredStates = PropLabel & PropAlign;
-type OptionalStates = PropAccessKey & PropId;
+type OptionalStates = PropBadgeText & PropId;
 export type TooltipProps = Generic.Element.Members<RequiredProps, OptionalProps>;
 export type TooltipStates = Generic.Element.Members<RequiredStates, OptionalStates>;
 export type TooltipAPI = Generic.Element.ComponentApi<RequiredProps, OptionalProps, RequiredStates, OptionalStates>;

package/dist/types/schema/props/badge-text.d.ts

@@ -0,0 +1,8 @@
+import type { Generic } from 'adopted-style-sheets';
+import type { AccessKeyPropType } from './access-key';
+import type { ShortKeyPropType } from './short-key';
+export type BadgeTextPropType = AccessKeyPropType | ShortKeyPropType;
+export type PropBadgeText = {
+    badgeText: BadgeTextPropType;
+};
+export declare const validateBadgeText: (component: Generic.Element.Component, value?: BadgeTextPropType) => void;

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

@@ -1 +1 @@
-export*from"./access-key";export*from"./accordion-callbacks";export*from"./active";export*from"./adjust-height";export*from"./alert";export*from"./align";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"./button-callbacks";export*from"./button-type";export*from"./button-variant";export*from"./checked";export*from"./collapsible";export*from"./details-callbacks";export*from"./color";export*from"./custom-class";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"./heading-variant";export*from"./hide-error";export*from"./hide-label";export*from"./href";export*from"./icons";export*from"./id";export*from"./image-source";export*from"./indeterminate";export*from"./label";export*from"./label-align";export*from"./link-on-callbacks";export*from"./link-target";export*from"./loading";export*from"./max";export*from"./modal";export*from"./msg";export*from"./multiple";export*from"./name";export*from"./open";export*from"./options";export*from"./pagination-position";export*from"./popover-callbacks";export*from"./read-only";export*from"./required";export*from"./rows";export*from"./show";export*from"./suggestions";export*from"./sync-value-by-selector";export*from"./tab-behavior";export*from"./table-callbacks";export*from"./table-data";export*from"./table-data-foot";export*from"./table-header-cells";export*from"./table-selection";export*from"./tooltip-align";export*from"./toolbar-items";export*from"./touched";export*from"./variant/spin";
+export*from"./access-key";export*from"./accordion-callbacks";export*from"./active";export*from"./adjust-height";export*from"./alert";export*from"./align";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"./badge-text";export*from"./button-callbacks";export*from"./button-type";export*from"./button-variant";export*from"./checked";export*from"./collapsible";export*from"./details-callbacks";export*from"./color";export*from"./custom-class";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"./heading-variant";export*from"./hide-error";export*from"./hide-label";export*from"./href";export*from"./icons";export*from"./id";export*from"./image-source";export*from"./indeterminate";export*from"./label";export*from"./label-align";export*from"./link-on-callbacks";export*from"./link-target";export*from"./loading";export*from"./max";export*from"./modal";export*from"./msg";export*from"./multiple";export*from"./name";export*from"./open";export*from"./options";export*from"./pagination-position";export*from"./popover-callbacks";export*from"./read-only";export*from"./required";export*from"./rows";export*from"./short-key";export*from"./show";export*from"./suggestions";export*from"./sync-value-by-selector";export*from"./tab-behavior";export*from"./table-callbacks";export*from"./table-data";export*from"./table-data-foot";export*from"./table-header-cells";export*from"./table-selection";export*from"./tooltip-align";export*from"./toolbar-items";export*from"./touched";export*from"./variant/spin";

package/dist/types/schema/props/short-key.d.ts

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

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

@@ -3,4 +3,5 @@ type ProcessEnv = (typeof PROCESS_ENVS)[number];
 export declare let processEnv: ProcessEnv;
 export declare const handleSlotContent: (hostRef: HTMLElement, slotRef: HTMLElement, slotName: string) => void;
 export declare const showExpertSlot: (label: unknown) => label is "";
+export declare const buildBadgeTextString: (accessKey?: string, shortKey?: string) => string;
 export {};

package/dist/types/schema/validators/access-and-short-key.d.ts

@@ -0,0 +1,2 @@
+import type { AccessKeyPropType, ShortKeyPropType } from '../props';
+export declare const validateAccessAndShortKey: (accessKey?: AccessKeyPropType, shortKey?: ShortKeyPropType) => void;

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

@@ -1 +1 @@
-export*from"./functional-component-rendering";export*from"./snapshot-testing";
+export*from"./functional-component-rendering";export*from"./snapshot-testing";export*from"./snapshot-input-testing";

package/dist/types/utils/testing/snapshot-input-testing.d.ts

@@ -0,0 +1,3 @@
+export declare function executeInputSnapshotTests<Props extends Record<string, unknown>>(ComponentName: string, components: unknown[], extendedProps?: Partial<Props>, options?: {
+    hasSmartButton?: boolean;
+}): void;

package/doc/badge.md

@@ -100,12 +100,12 @@ Die zusätzliche Ausgabe eines **Icon** gewährleistet, dass der Nutzer auch hie
 
 ## 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; } & { _tabIndex?: number` \| `undefined; _value?: Stringified<StencilUnknown>; _ariaExpanded?: boolean` \| `undefined; _role?: "button"` \| `"link"` \| `"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; _name?: string` \| `undefined; _syncValueBySelector?: string` \| `undefined; _tooltipAlign?: AlignPropType` \| `undefined; _accessKey?: string` \| `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; } & { _tabIndex?: number` \| `undefined; _value?: Stringified<StencilUnknown>; _ariaExpanded?: boolean` \| `undefined; _accessKey?: string` \| `undefined; _role?: "button"` \| `"link"` \| `"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; _name?: string` \| `undefined; _shortKey?: string` \| `undefined; _syncValueBySelector?: string` \| `undefined; _tooltipAlign?: AlignPropType` \| `undefined; }` | `undefined` |
 
 
 ----------------------------------------------

package/doc/button-link.md

@@ -67,6 +67,7 @@ kolibriElement._on = {
 | `_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`             | Defines the role of the components primary element.                                                                                                                              | `"button"` \| `"link"` \| `"tab"` \| `"treeitem"` \| `undefined`                                                                                               | `undefined` |
+| `_shortKey`           | `_short-key`        | Adds a visual short key hint to the component.                                                                                                                                   | `string` \| `undefined`                                                                                                                                  | `undefined` |
 | `_tabIndex`           | `_tab-index`        | Defines which tab-index the primary element of the component has. (https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/tabindex)                                 | `number` \| `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/button.md

@@ -137,6 +137,7 @@ Probleme mit Disabled-Status
 | `_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`             | Defines the role of the components primary element.                                                                                                                              | `"button"` \| `"link"` \| `"tab"` \| `"treeitem"` \| `undefined`                                                                                               | `undefined` |
+| `_shortKey`           | `_short-key`        | Defines the elements short key.                                                                                                                                                  | `string` \| `undefined`                                                                                                                                  | `undefined` |
 | `_tabIndex`           | `_tab-index`        | Defines which tab-index the primary element of the component has. (https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/tabindex)                                 | `number` \| `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

@@ -70,6 +70,7 @@ Beispiel für die Konstruktion des JSON-Array:
 | `_on`                       | --               | Gibt die EventCallback-Funktionen für das Input-Event an.                                                                                                                             | `InputTypeOnBlur & InputTypeOnClick & InputTypeOnChange & InputTypeOnFocus & InputTypeOnInput` \| `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 short key hint to the component.                                                                                                                                        | `string` \| `undefined`                                                                                                                                                                                                                                                                                                                                                                       | `undefined` |
 | `_suggestions` _(required)_ | `_suggestions`   | Suggestions the user can choose from.                                                                                                                                                 | `W3CInputValue[]` \| `string`                                                                                                                                                                                                                                                                                                                                                                 | `undefined` |
 | `_tabIndex`                 | `_tab-index`     | Defines which tab-index the primary element of the component has. (https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/tabindex)                                      | `number` \| `undefined`                                                                                                                                                                                                                                                                                                                                                                       | `undefined` |
 | `_tooltipAlign`             | `_tooltip-align` | Defines where to show the Tooltip preferably: top, right, bottom or left.                                                                                                             | `"bottom"` \| `"left"` \| `"right"` \| `"top"` \| `undefined`                                                                                                                                                                                                                                                                                                                                       | `'top'`     |