@public-ui/components 3.0.0-rc.2 → 3.0.0-rc.3

package/dist/types/functional-components/inputs/Input/Input.d.ts

@@ -1,10 +1,13 @@
 import { type FunctionalComponent as FC } from '../../../stencil-public-runtime';
 import type { JSXBase, VNode } from '../../../stencil-public-runtime';
+import { type InternMsgPropType } from '../../../schema';
 import type { DefaultInputProps } from '../_types';
 export type InputProps = DefaultInputProps<JSXBase.InputHTMLAttributes<HTMLInputElement>> & {
     value?: string | number | string[];
+    touched?: boolean;
     suggestions?: VNode;
     spellcheck?: boolean;
+    msg?: InternMsgPropType;
 } & {
     [key: `data-${string}`]: unknown;
     [key: `aria-${string}`]: unknown;

package/dist/types/functional-components/inputs/NativeOption/NativeOption.d.ts

@@ -6,6 +6,7 @@ export type NativeOptionProps = Omit<JSXBase.OptionHTMLAttributes<HTMLOptionElem
     value: W3CInputValue;
     label: W3CInputValue;
     index?: string | number;
+    baseClassName?: 'kol-select' | 'kol-datalist';
 };
 declare const NativeOptionFc: FC<NativeOptionProps>;
 export default NativeOptionFc;

package/dist/types/functional-components/inputs/NativeOptionList/NativeOptionList.d.ts

@@ -8,6 +8,7 @@ export type NativeOptionListProps = {
     options?: SelectOption<W3CInputValue>[];
     OptionProps?: Omit<JSXBase.OptionHTMLAttributes<HTMLOptionElement>, 'value' | 'label'>;
     OptionGroupProps?: Omit<JSXBase.OptgroupHTMLAttributes<HTMLOptGroupElement>, 'label'>;
+    baseClassName?: 'kol-select';
 };
 declare const NativeOptionListFc: FC<NativeOptionListProps>;
 export default NativeOptionListFc;

package/dist/types/functional-components/inputs/NativeSelect/NativeSelect.d.ts

@@ -2,7 +2,11 @@ import { type FunctionalComponent as FC } from '../../../stencil-public-runtime'
 import type { JSXBase } from '../../../stencil-public-runtime';
 import type { DefaultInputProps } from '../_types';
 import { type NativeOptionListProps } from '../NativeOptionList';
+import { type InternMsgPropType } from '../../../schema';
 type SelectAttributes = JSXBase.SelectHTMLAttributes<HTMLSelectElement>;
-export type SelectProps = DefaultInputProps<SelectAttributes> & NativeOptionListProps;
+export type SelectProps = DefaultInputProps<SelectAttributes> & NativeOptionListProps & {
+    touched?: boolean;
+    msg?: InternMsgPropType;
+};
 declare const NativeSelectFc: FC<SelectProps>;
 export default NativeSelectFc;

package/dist/types/functional-components/inputs/TextArea/TextArea.d.ts

@@ -1,8 +1,11 @@
 import { type FunctionalComponent as FC } from '../../../stencil-public-runtime';
 import type { JSXBase } from '../../../stencil-public-runtime';
 import type { DefaultInputProps } from '../_types';
+import { type InternMsgPropType } from '../../../schema';
 export type TextAreaProps = DefaultInputProps<JSXBase.TextareaHTMLAttributes<HTMLTextAreaElement>> & {
     value: string;
+    touched?: boolean;
+    msg?: InternMsgPropType;
 };
 declare const TextAreaFc: FC<TextAreaProps>;
 export default TextAreaFc;

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

@@ -1,12 +1,12 @@
 import type { Generic } from 'adopted-style-sheets';
-import type { PropLabel, PropOpen, PropAlign, PropModal } from '../props';
+import type { PropLabel, PropOpen, PropAlign } from '../props';
 import type { KoliBriModalEventCallbacks } from '../types';
 type RequiredProps = PropLabel;
-type OptionalProps = PropAlign & PropOpen & PropModal & {
+type OptionalProps = PropAlign & PropOpen & {
     on: KoliBriModalEventCallbacks;
 };
 type RequiredStates = PropAlign & PropOpen & PropLabel;
-type OptionalStates = PropModal & {
+type OptionalStates = {
     on: KoliBriModalEventCallbacks;
 };
 export type DrawerProps = Generic.Element.Members<RequiredProps, OptionalProps>;

package/dist/types/schema/props/error-list.d.ts

@@ -1,7 +1,8 @@
 import type { Generic } from 'adopted-style-sheets';
+import { EventCallback } from '../types';
 export type ErrorListPropType = {
     message: string;
-    selector: string;
+    selector: string | EventCallback<Event>;
 };
 export type PropErrorList = {
     errorList: ErrorListPropType[];

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

@@ -13,3 +13,4 @@ export type PropMsg = {
 export declare const validateMsg: (component: Generic.Element.Component, value?: Stringified<MsgPropType>) => void;
 export declare function isMsgEmpty(msg?: MsgPropType): boolean;
 export declare function convertMsgToInternMsg(msg?: MsgPropType): InternMsgPropType | undefined;
+export declare function checkHasError(msg?: InternMsgPropType, touched?: boolean): boolean;

package/doc/accordion.md

@@ -11,7 +11,7 @@
 | `_label` _(required)_ | `_label`    | Defines the visible or semantic label of the component (e.g. aria-label, label, headline, caption, summary, etc.). | `string`                                                                                  | `undefined` |
 | `_level`              | `_level`    | Defines which H-level from 1-6 the heading has. 0 specifies no heading and is shown as bold text.                  | `0` \| `1` \| `2` \| `3` \| `4` \| `5` \| `6` \| `undefined`                                            | `1`         |
 | `_on`                 | --          | Gibt die EventCallback-Funktionen an.                                                                              | `undefined` \| `{ onClick?: EventValueOrEventCallback<MouseEvent, boolean>` \| `undefined; }` | `undefined` |
-| `_open`               | `_open`     | If set (to true) opens/expands the element, closes if not set (or set to false).                                   | `boolean` \| `undefined`                                                                    | `false`     |
+| `_open`               | `_open`     | Opens/expands the element when truthy, closes/collapses when falsy.                                                | `boolean` \| `undefined`                                                                    | `false`     |
 
 
 ## Methods

package/doc/button-link.md

@@ -7,7 +7,7 @@
 
 | Property              | Attribute           | Description                                                                                                                                                                      | Type                                                                                                                                                   | Default     |
 | --------------------- | ------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------ | ----------- |
-| `_accessKey`          | `_access-key`       | Defines the elements access key.                                                                                                                                                 | `string` \| `undefined`                                                                                                                                  | `undefined` |
+| `_accessKey`          | `_access-key`       | Defines which key combination can be used to trigger or focus the interactive element of the component.                                                                          | `string` \| `undefined`                                                                                                                                  | `undefined` |
 | `_ariaControls`       | `_aria-controls`    | Defines which elements are controlled by this component. (https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-controls)                              | `string` \| `undefined`                                                                                                                                  | `undefined` |
 | `_ariaDescription`    | `_aria-description` | Defines the value for the aria-description attribute.                                                                                                                            | `string` \| `undefined`                                                                                                                                  | `undefined` |
 | `_ariaExpanded`       | `_aria-expanded`    | Defines whether the interactive element of the component expanded something. (https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-expanded)          | `boolean` \| `undefined`                                                                                                                                 | `undefined` |

package/doc/button.md

@@ -7,7 +7,7 @@
 
 | Property              | Attribute           | Description                                                                                                                                                                      | Type                                                                                                                                                   | Default     |
 | --------------------- | ------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------ | ----------- |
-| `_accessKey`          | `_access-key`       | Defines the elements access key.                                                                                                                                                 | `string` \| `undefined`                                                                                                                                  | `undefined` |
+| `_accessKey`          | `_access-key`       | Defines which key combination can be used to trigger or focus the interactive element of the component.                                                                          | `string` \| `undefined`                                                                                                                                  | `undefined` |
 | `_ariaControls`       | `_aria-controls`    | Defines which elements are controlled by this component. (https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-controls)                              | `string` \| `undefined`                                                                                                                                  | `undefined` |
 | `_ariaDescription`    | `_aria-description` | Defines the value for the aria-description attribute.                                                                                                                            | `string` \| `undefined`                                                                                                                                  | `undefined` |
 | `_ariaExpanded`       | `_aria-expanded`    | Defines whether the interactive element of the component expanded something. (https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-expanded)          | `boolean` \| `undefined`                                                                                                                                 | `undefined` |
@@ -21,7 +21,7 @@
 | `_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` |
+| `_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/combobox.md

@@ -21,7 +21,7 @@
 | `_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` |
+| `_suggestions` _(required)_ | `_suggestions`   | Suggestions to provide for the input.                                                                                                                        | `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'`     |
 | `_touched`                  | `_touched`       | Shows if the input was touched by a user.                                                                                                                    | `boolean` \| `undefined`                                                                                                                                                                                                                                                                                                                                                                      | `false`     |

package/doc/details.md

@@ -11,7 +11,7 @@
 | `_label` _(required)_ | `_label`    | Defines the visible or semantic label of the component (e.g. aria-label, label, headline, caption, summary, etc.). | `string`                                                                                   | `undefined` |
 | `_level`              | `_level`    | Defines which H-level from 1-6 the heading has. 0 specifies no heading and is shown as bold text.                  | `0` \| `1` \| `2` \| `3` \| `4` \| `5` \| `6` \| `undefined`                                             | `1`         |
 | `_on`                 | --          | Defines the callback functions for details.                                                                        | `undefined` \| `{ onToggle?: EventValueOrEventCallback<MouseEvent, boolean>` \| `undefined; }` | `undefined` |
-| `_open`               | `_open`     | If set (to true) opens/expands the element, closes if not set (or set to false).                                   | `boolean` \| `undefined`                                                                     | `false`     |
+| `_open`               | `_open`     | Opens/expands the element when truthy, closes/collapses when falsy.                                                | `boolean` \| `undefined`                                                                     | `false`     |
 
 
 ## Methods

package/doc/drawer.md

@@ -7,11 +7,10 @@
 
 | Property              | Attribute | Description                                                                                                        | Type                                                      | Default     |
 | --------------------- | --------- | ------------------------------------------------------------------------------------------------------------------ | --------------------------------------------------------- | ----------- |
-| `_align`              | `_align`  | Specifies the orientation of the drawer.                                                                           | `"bottom"` \| `"left"` \| `"right"` \| `"top"` \| `undefined`     | `undefined` |
+| `_align`              | `_align`  | Defines the visual orientation of the component.                                                                   | `"bottom"` \| `"left"` \| `"right"` \| `"top"` \| `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` |
-| `_modal`              | `_modal`  | Indicates whether the drawer is a modal.                                                                           | `boolean` \| `undefined`                                    | `undefined` |
 | `_on`                 | --        | Specifies the EventCallback function to be called when the drawer is closing.                                      | `undefined` \| `({ onClose?: (() => void)` \| `undefined; })` | `undefined` |
-| `_open`               | `_open`   | Specifies the default open state of the drawer.                                                                    | `boolean` \| `undefined`                                    | `undefined` |
+| `_open`               | `_open`   | Opens/expands the element when truthy, closes/collapses when falsy.                                                | `boolean` \| `undefined`                                    | `undefined` |
 
 
 ## Methods

package/doc/link-button.md

@@ -7,7 +7,7 @@
 
 | Property             | Attribute             | Description                                                                                                                                                  | Type                                                                                                 | Default     |
 | -------------------- | --------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------ | ---------------------------------------------------------------------------------------------------- | ----------- |
-| `_accessKey`         | `_access-key`         | Defines the elements access key.                                                                                                                             | `string` \| `undefined`                                                                                | `undefined` |
+| `_accessKey`         | `_access-key`         | Defines which key combination can be used to trigger or focus the interactive element of the component.                                                      | `string` \| `undefined`                                                                                | `undefined` |
 | `_ariaCurrentValue`  | `_aria-current-value` | Defines the value for the aria-current attribute.                                                                                                            | `"date"` \| `"false"` \| `"location"` \| `"page"` \| `"step"` \| `"time"` \| `"true"` \| `undefined`               | `undefined` |
 | `_ariaDescription`   | `_aria-description`   | Defines the value for the aria-description attribute.                                                                                                        | `string` \| `undefined`                                                                                | `undefined` |
 | `_customClass`       | `_custom-class`       | Defines the custom class attribute if _variant="custom" is set.                                                                                              | `string` \| `undefined`                                                                                | `undefined` |

package/doc/link.md

@@ -7,7 +7,7 @@
 
 | Property             | Attribute             | Description                                                                                                                                                  | Type                                                                                   | Default     |
 | -------------------- | --------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------ | -------------------------------------------------------------------------------------- | ----------- |
-| `_accessKey`         | `_access-key`         | Defines the elements access key.                                                                                                                             | `string` \| `undefined`                                                                  | `undefined` |
+| `_accessKey`         | `_access-key`         | Defines which key combination can be used to trigger or focus the interactive element of the component.                                                      | `string` \| `undefined`                                                                  | `undefined` |
 | `_ariaCurrentValue`  | `_aria-current-value` | Defines the value for the aria-current attribute.                                                                                                            | `"date"` \| `"false"` \| `"location"` \| `"page"` \| `"step"` \| `"time"` \| `"true"` \| `undefined` | `undefined` |
 | `_ariaDescription`   | `_aria-description`   | Defines the value for the aria-description attribute.                                                                                                        | `string` \| `undefined`                                                                  | `undefined` |
 | `_disabled`          | `_disabled`           | Makes the element not focusable and ignore all events.                                                                                                       | `boolean` \| `undefined`                                                                 | `false`     |
@@ -18,7 +18,7 @@
 | `_label`             | `_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`                                                                  | `undefined` |
 | `_on`                | --                    | Defines the callback functions for links.                                                                                                                    | `undefined` \| `{ onClick?: EventValueOrEventCallback<Event, string>` \| `undefined; }`    | `undefined` |
 | `_role`              | `_role`               | Defines the role of the components primary element.                                                                                                          | `"button"` \| `"link"` \| `"tab"` \| `"treeitem"` \| `undefined`                               | `undefined` |
-| `_shortKey`          | `_short-key`          | Defines the elements access key.                                                                                                                             | `string` \| `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` |
 | `_target`            | `_target`             | Defines where to open the link.                                                                                                                              | `string` \| `undefined`                                                                  | `undefined` |
 | `_tooltipAlign`      | `_tooltip-align`      | Defines where to show the Tooltip preferably: top, right, bottom or left.                                                                                    | `"bottom"` \| `"left"` \| `"right"` \| `"top"` \| `undefined`                                  | `'right'`   |

package/doc/tabs.md

@@ -7,7 +7,7 @@
 
 | Property              | Attribute   | Description                                                                                                        | Type                                                                                                                                                                                                                                                     | Default     |
 | --------------------- | ----------- | ------------------------------------------------------------------------------------------------------------------ | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ----------- |
-| `_align`              | `_align`    | Defines the position of the tab captions.                                                                          | `"bottom"` \| `"left"` \| `"right"` \| `"top"` \| `undefined`                                                                                                                                                                                                    | `'top'`     |
+| `_align`              | `_align`    | Defines the visual orientation of the component.                                                                   | `"bottom"` \| `"left"` \| `"right"` \| `"top"` \| `undefined`                                                                                                                                                                                                    | `'top'`     |
 | `_behavior`           | `_behavior` | Defines which behavior is active.                                                                                  | `"select-automatic"` \| `"select-manual"` \| `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` |
 | `_on`                 | --          | Gibt die Liste der Callback-Funktionen an, die auf Events aufgerufen werden sollen.                                | `undefined` \| `{ onCreate?: EventCallback<Event>` \| `{ label: string; callback: EventCallback<Event>; }` \| `undefined; } & { onSelect?: EventValueOrEventCallback<MouseEvent` \| `KeyboardEvent` \| `CustomEvent<any>` \| `PointerEvent, number>` \| `undefined; }` | `undefined` |

package/doc/toolbar.md

@@ -5,10 +5,10 @@
 
 ## Properties
 
-| Property              | Attribute | Description                                                                       | Type                    | Default     |
-| --------------------- | --------- | --------------------------------------------------------------------------------- | ----------------------- | ----------- |
-| `_items` _(required)_ | --        | Defines the functional elements of toolbar to render (e.g. kol-link, kol-button). | `ToolbarItemPropType[]` | `undefined` |
-| `_label` _(required)_ | `_label`  | Defines the semantic aria-label of the component.                                 | `string`                | `undefined` |
+| Property              | Attribute | Description                                                                                                        | Type                    | Default     |
+| --------------------- | --------- | ------------------------------------------------------------------------------------------------------------------ | ----------------------- | ----------- |
+| `_items` _(required)_ | --        | Defines the functional elements of toolbar to render (e.g. kol-link, kol-button).                                  | `ToolbarItemPropType[]` | `undefined` |
+| `_label` _(required)_ | `_label`  | Defines the visible or semantic label of the component (e.g. aria-label, label, headline, caption, summary, etc.). | `string`                | `undefined` |
 
 
 ----------------------------------------------

package/doc/tree-item.md

@@ -5,12 +5,12 @@
 
 ## Properties
 
-| Property              | Attribute | Description                                                                      | Type                   | Default     |
-| --------------------- | --------- | -------------------------------------------------------------------------------- | ---------------------- | ----------- |
-| `_active`             | `_active` | If set (to true) the tree item is the active one.                                | `boolean` \| `undefined` | `undefined` |
-| `_href` _(required)_  | `_href`   | This property is used for a link from a reference to the target URL.             | `string`               | `undefined` |
-| `_label` _(required)_ | `_label`  | Defines the label of the link.                                                   | `string`               | `undefined` |
-| `_open`               | `_open`   | If set (to true) opens/expands the element, closes if not set (or set to false). | `boolean` \| `undefined` | `undefined` |
+| Property              | Attribute | Description                                                                                                        | Type                   | Default     |
+| --------------------- | --------- | ------------------------------------------------------------------------------------------------------------------ | ---------------------- | ----------- |
+| `_active`             | `_active` | If set (to true) the tree item is the active one.                                                                  | `boolean` \| `undefined` | `undefined` |
+| `_href` _(required)_  | `_href`   | Defines the target URI of the link.                                                                                | `string`               | `undefined` |
+| `_label` _(required)_ | `_label`  | Defines the visible or semantic label of the component (e.g. aria-label, label, headline, caption, summary, etc.). | `string`               | `undefined` |
+| `_open`               | `_open`   | Opens/expands the element when truthy, closes/collapses when falsy.                                                | `boolean` \| `undefined` | `undefined` |
 
 
 ## Methods

package/doc/tree.md

@@ -5,9 +5,9 @@
 
 ## Properties
 
-| Property              | Attribute | Description                    | Type     | Default     |
-| --------------------- | --------- | ------------------------------ | -------- | ----------- |
-| `_label` _(required)_ | `_label`  | Defines the label of the tree. | `string` | `undefined` |
+| Property              | Attribute | Description                                                                                                        | Type     | Default     |
+| --------------------- | --------- | ------------------------------------------------------------------------------------------------------------------ | -------- | ----------- |
+| `_label` _(required)_ | `_label`  | Defines the visible or semantic label of the component (e.g. aria-label, label, headline, caption, summary, etc.). | `string` | `undefined` |
 
 
 ----------------------------------------------

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@public-ui/components",
-  "version": "3.0.0-rc.2",
+  "version": "3.0.0-rc.3",
   "license": "EUPL-1.2",
   "homepage": "https://public-ui.github.io",
   "repository": {
@@ -50,6 +50,19 @@
     "webstandard",
     "wcag"
   ],
+  "dependencies": {
+    "@floating-ui/dom": "1.6.13",
+    "adopted-style-sheets": "1.1.7",
+    "clsx": "2.1.1",
+    "color-convert": "2.0.1",
+    "color-rgba": "2.4.0",
+    "lodash-es": "4.17.21",
+    "markdown-it": "14.1.0",
+    "query-selector-all-shadow-root": "0.0.3",
+    "query-selector-shadow-root": "0.0.3",
+    "rgba-convert": "0.3.0",
+    "wcag-contrast": "3.0.0"
+  },
   "peerDependencies": {
     "adopted-style-sheets": "1.1.7"
   },

package/vscode-custom-data.json

@@ -35,7 +35,7 @@
         },
         {
           "name": "_open",
-          "description": "If set (to true) opens/expands the element, closes if not set (or set to false)."
+          "description": "Opens/expands the element when truthy, closes/collapses when falsy."
         }
       ]
     },
@@ -200,7 +200,7 @@
       "attributes": [
         {
           "name": "_access-key",
-          "description": "Defines the elements access key."
+          "description": "Defines which key combination can be used to trigger or focus the interactive element of the component."
         },
         {
           "name": "_aria-controls",
@@ -266,7 +266,7 @@
         },
         {
           "name": "_short-key",
-          "description": "Defines the elements short key."
+          "description": "Adds a visual short key hint to the component."
         },
         {
           "name": "_tab-index",
@@ -347,7 +347,7 @@
       "attributes": [
         {
           "name": "_access-key",
-          "description": "Defines the elements access key."
+          "description": "Defines which key combination can be used to trigger or focus the interactive element of the component."
         },
         {
           "name": "_aria-controls",
@@ -553,7 +553,7 @@
         },
         {
           "name": "_suggestions",
-          "description": "Suggestions the user can choose from."
+          "description": "Suggestions to provide for the input."
         },
         {
           "name": "_tab-index",
@@ -608,7 +608,7 @@
         },
         {
           "name": "_open",
-          "description": "If set (to true) opens/expands the element, closes if not set (or set to false)."
+          "description": "Opens/expands the element when truthy, closes/collapses when falsy."
         }
       ]
     },
@@ -621,7 +621,7 @@
       "attributes": [
         {
           "name": "_align",
-          "description": "Specifies the orientation of the drawer.",
+          "description": "Defines the visual orientation of the component.",
           "values": [
             {
               "name": "bottom"
@@ -641,13 +641,9 @@
           "name": "_label",
           "description": "Defines the visible or semantic label of the component (e.g. aria-label, label, headline, caption, summary, etc.)."
         },
-        {
-          "name": "_modal",
-          "description": "Indicates whether the drawer is a modal."
-        },
         {
           "name": "_open",
-          "description": "Specifies the default open state of the drawer."
+          "description": "Opens/expands the element when truthy, closes/collapses when falsy."
         }
       ]
     },
@@ -2423,7 +2419,7 @@
       "attributes": [
         {
           "name": "_access-key",
-          "description": "Defines the elements access key."
+          "description": "Defines which key combination can be used to trigger or focus the interactive element of the component."
         },
         {
           "name": "_aria-current-value",
@@ -2500,7 +2496,7 @@
         },
         {
           "name": "_short-key",
-          "description": "Defines the elements access key."
+          "description": "Adds a visual short key hint to the component."
         },
         {
           "name": "_tab-index",
@@ -2539,7 +2535,7 @@
       "attributes": [
         {
           "name": "_access-key",
-          "description": "Defines the elements access key."
+          "description": "Defines which key combination can be used to trigger or focus the interactive element of the component."
         },
         {
           "name": "_aria-current-value",
@@ -3395,7 +3391,7 @@
       "attributes": [
         {
           "name": "_align",
-          "description": "Defines the position of the tab captions.",
+          "description": "Defines the visual orientation of the component.",
           "values": [
             {
               "name": "bottom"
@@ -3594,7 +3590,7 @@
       "attributes": [
         {
           "name": "_label",
-          "description": "Defines the semantic aria-label of the component."
+          "description": "Defines the visible or semantic label of the component (e.g. aria-label, label, headline, caption, summary, etc.)."
         }
       ]
     },
@@ -3607,7 +3603,7 @@
       "attributes": [
         {
           "name": "_label",
-          "description": "Defines the label of the tree."
+          "description": "Defines the visible or semantic label of the component (e.g. aria-label, label, headline, caption, summary, etc.)."
         }
       ]
     },
@@ -3624,15 +3620,15 @@
         },
         {
           "name": "_href",
-          "description": "This property is used for a link from a reference to the target URL."
+          "description": "Defines the target URI of the link."
         },
         {
           "name": "_label",
-          "description": "Defines the label of the link."
+          "description": "Defines the visible or semantic label of the component (e.g. aria-label, label, headline, caption, summary, etc.)."
         },
         {
           "name": "_open",
-          "description": "If set (to true) opens/expands the element, closes if not set (or set to false)."
+          "description": "Opens/expands the element when truthy, closes/collapses when falsy."
         }
       ]
     },
@@ -3649,15 +3645,15 @@
         },
         {
           "name": "_href",
-          "description": "This property is used for a link from a reference to the target URL."
+          "description": "Defines the target URI of the link."
         },
         {
           "name": "_label",
-          "description": "Defines the label of the link."
+          "description": "Defines the visible or semantic label of the component (e.g. aria-label, label, headline, caption, summary, etc.)."
         },
         {
           "name": "_open",
-          "description": "If set (to true) opens/expands the element, closes if not set (or set to false)."
+          "description": "Opens/expands the element when truthy, closes/collapses when falsy."
         }
       ]
     },

package/dist/cjs/FormFieldMsg-b0b8219b.js

@@ -1,4 +0,0 @@
-/*!
- * KoliBri - The accessible HTML-Standard
- */
-"use strict";const tslib_es6=require("./tslib.es6-5e301284.js"),clsx=require("./clsx-dd4d6dd1.js"),index=require("./index-56ff9cf2.js"),Alert=require("./Alert-9bb150c8.js"),FormFieldMsgFc=r=>{var{alert:e,msg:s,hideError:i,id:l,class:d}=r,t=tslib_es6.__rest(r,["alert","msg","hideError","id","class"]);return index.h(Alert.KolAlertFc,Object.assign({id:`${l}-error`,alert:e,type:"error",class:clsx.clsx({error:!0,"visually-hidden":!0===i},d)},s,t,{"aria-hidden":"true"}),(null==s?void 0:s.description)||void 0)},KolFormFieldMsgFc=FormFieldMsgFc;exports.KolFormFieldMsgFc=KolFormFieldMsgFc;

package/dist/cjs/FormFieldMsg-b0b8219b.js.map

@@ -1 +0,0 @@
-{"file":"FormFieldMsg-b0b8219b.js","mappings":";;;;;;;;;;AAcA,MAAM,cAAc,GAA2C,CAAC,EAA0D;QAA1D,EAAE,KAAK,EAAE,GAAG,EAAE,SAAS,EAAE,EAAE,EAAE,KAAK,EAAE,UAAU,OAAY,EAAP,KAAK,wBAAxD,4CAA0D,CAAF;IAAO,QAC9HA,QAACC,gBAAU,kBACV,EAAE,EAAE,GAAG,EAAE,QAAQ,EACjB,KAAK,EAAE,KAAK,EACZ,IAAI,EAAC,OAAO,EACZ,KAAK,EAAEC,SAAI,CACV;YACC,KAAK,EAAE,IAAI;YACX,iBAAiB,EAAE,SAAS,KAAK,IAAI;SACrC,EACD,UAAU,CACV,IACG,GAAG,EACH,KAAK,mBACG,MAAM,KAEjB,CAAA,GAAG,aAAH,GAAG,uBAAH,GAAG,CAAE,WAAW,KAAI,SAAS,CAClB,EACb;CAAA,CAAC;AAEF,0BAAe,cAAc;;;;","names":["h","KolAlertFc","clsx"],"sources":["src/functional-components/FormFieldMsg/FormFieldMsg.tsx"],"sourcesContent":["import clsx from 'clsx';\nimport type { AlertPropType, HideErrorPropType, IdPropType, InternMsgPropType } from '../../schema';\nimport type { FunctionalComponent } from '@stencil/core';\nimport { h } from '@stencil/core';\nimport KolAlertFc from '../Alert';\nimport type { JSXBase } from '@stencil/core/internal';\n\ntype FormFieldMsgProps = JSXBase.HTMLAttributes<HTMLDivElement> & {\n\talert?: AlertPropType;\n\tmsg?: InternMsgPropType;\n\thideError?: HideErrorPropType;\n\tid: IdPropType;\n};\n\nconst FormFieldMsgFc: FunctionalComponent<FormFieldMsgProps> = ({ alert, msg, hideError, id, class: classNames, ...other }) => (\n\t<KolAlertFc\n\t\tid={`${id}-error`}\n\t\talert={alert}\n\t\ttype=\"error\"\n\t\tclass={clsx(\n\t\t\t{\n\t\t\t\terror: true,\n\t\t\t\t'visually-hidden': hideError === true,\n\t\t\t},\n\t\t\tclassNames,\n\t\t)}\n\t\t{...msg}\n\t\t{...other}\n\t\taria-hidden=\"true\"\n\t>\n\t\t{msg?.description || undefined}\n\t</KolAlertFc>\n);\n\nexport default FormFieldMsgFc;\n"],"version":3}

package/dist/cjs/Icon-1c216a0b.js

@@ -1,4 +0,0 @@
-/*!
- * KoliBri - The accessible HTML-Standard
- */
-"use strict";const index=require("./index-56ff9cf2.js"),componentNames=require("./component-names-6f6ca767.js"),KolIconFc=c=>{const{class:o,style:n,icons:e,label:s,onClick:l}=c;return index.h(componentNames.KolIconTag,{class:o,style:n,onClick:l,_icons:e,_label:s})},KolIconFc$1=KolIconFc;exports.KolIconFc=KolIconFc$1;

package/dist/cjs/InputContainerStateWrapper-96ae5e62.js

@@ -1,4 +0,0 @@
-/*!
- * KoliBri - The accessible HTML-Standard
- */
-"use strict";const index=require("./index-56ff9cf2.js"),isString=require("./isString-8ded65b8.js"),isObject=require("./isObject-6090b636.js"),tslib_es6=require("./tslib.es6-5e301284.js"),componentNames=require("./component-names-6f6ca767.js"),Icon=require("./Icon-1c216a0b.js"),clsx=require("./clsx-dd4d6dd1.js"),InputAdornment=(n,t)=>{var{position:e="start",class:o}=n,s=tslib_es6.__rest(n,["position","class"]);const i=`inputAdornment-${e}`;return index.h("div",Object.assign({class:clsx.clsx(i,o)},s),t)},InputAdornment$1=InputAdornment;function hasItems(n){return!!n&&(Array.isArray(n)?n.length>0:Boolean(n))}const KolInputContainerFc$1=(n,t)=>{const{class:e,startAdornment:o,endAdornment:s}=n,i=tslib_es6.__rest(n,["class","startAdornment","endAdornment"]);return hasItems(o)||hasItems(s)?index.h("div",Object.assign({class:clsx.clsx("input",e)},i),index.h(InputAdornment$1,{position:"start"},o),t,index.h(InputAdornment$1,{position:"end"},s)):index.h("div",Object.assign({class:clsx.clsx("input",e)},i),t)},KolInputContainerFc$2=KolInputContainerFc$1,KolButtonFc=n=>{const{label:t,icons:e,hideLabel:o,disabled:s,onClick:i}=n,c=tslib_es6.__rest(n,["label","icons","hideLabel","disabled","onClick"]);return index.h(componentNames.KolButtonWcTag,Object.assign({tabindex:0,_label:t,_disabled:s,_icons:e,_hideLabel:o,_on:{onClick:i}},c))},KolButtonFc$1=KolButtonFc,KolIconButtonFc=n=>{const{componentName:t="button",label:e,icon:o,onClick:s}=n,i=tslib_es6.__rest(n,["componentName","label","icon","onClick"]),c="button"===t?KolButtonFc$1:Icon.KolIconFc;return index.h(c,Object.assign({label:e||"",hideLabel:!0,icons:`codicon codicon-${o}`,onClick:s},i))},KolIconButtonFc$1=KolIconButtonFc;function getInputContainerProps(n){let t,e;return"_icons"in n&&(t=n._icons),"_smartButton"in n&&(e=n._smartButton),{icons:t,smartButton:e,disabled:n._disabled}}const InputContainerStateWrapperFc=({state:n,endAdornment:t},e)=>{const{icons:o,smartButton:s,disabled:i}=getInputContainerProps(n);let c=null==o?void 0:o.left;isString.isString(c)&&(c={icon:c});let r=null==o?void 0:o.right;isString.isString(r)&&(r={icon:r});const l=[],a=[];return t&&(Array.isArray(t)?a.push(...t):a.push(t)),c&&l.push(index.h(KolIconButtonFc$1,Object.assign({componentName:"icon"},isObject.isObject(c)?c:{}))),isObject.isObject(s)&&a.push(index.h(KolIconButtonFc$1,Object.assign({componentName:"button"},s,{hideLabel:!0,disabled:i}))),r&&a.push(index.h(KolIconButtonFc$1,Object.assign({componentName:"icon"},isObject.isObject(r)?r:{}))),index.h(KolInputContainerFc$2,{startAdornment:l,endAdornment:a},e)},KolInputContainerFc=InputContainerStateWrapperFc;exports.KolIconButtonFc=KolIconButtonFc$1,exports.KolInputContainerFc=KolInputContainerFc;

package/dist/cjs/InputContainerStateWrapper-96ae5e62.js.map

@@ -1 +0,0 @@
-{"file":"InputContainerStateWrapper-96ae5e62.js","mappings":"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","names":["h","clsx","KolInputContainerFc","InputAdornment","KolButtonWcTag","KolButtonFc","KolIconFc","isString","KolIconButtonFc","isObject"],"sources":["src/functional-components/InputAdornment/InputAdornment.tsx","src/functional-components/InputContainer/InputContainer.tsx","src/functional-components/Button/Button.tsx","src/functional-components/IconButton/IconButton.tsx","src/functional-component-wrappers/InputContainerStateWrapper/InputContainerStateWrapper.tsx"],"sourcesContent":["import { h, type FunctionalComponent as FC } from '@stencil/core';\nimport type { JSXBase } from '@stencil/core/internal';\nimport clsx from 'clsx';\n\nexport type InputAdornmentProps = JSXBase.HTMLAttributes<HTMLDivElement> & {\n\tposition?: 'start' | 'end';\n};\n\nconst InputAdornment: FC<InputAdornmentProps> = ({ position = 'start', class: className, ...other }, children) => {\n\tconst rootClassName = `inputAdornment-${position}`;\n\n\treturn (\n\t\t<div class={clsx(rootClassName, className)} {...other}>\n\t\t\t{children}\n\t\t</div>\n\t);\n};\n\nexport default InputAdornment;\n","import { h, type FunctionalComponent as FC } from '@stencil/core';\nimport clsx from 'clsx';\nimport type { JSXBase, VNode } from '@stencil/core/internal';\nimport InputAdornment from '../InputAdornment';\n\ntype InputAdornmentType = VNode | VNode[] | null;\n\nexport type InputContainerProps = JSXBase.HTMLAttributes & {\n\tstartAdornment?: InputAdornmentType;\n\tendAdornment?: InputAdornmentType;\n};\n\nfunction hasItems(items?: InputAdornmentType): boolean {\n\tif (!items) {\n\t\treturn false;\n\t}\n\n\treturn Array.isArray(items) ? items.length > 0 : Boolean(items);\n}\n\nconst KolInputContainerFc: FC<InputContainerProps> = (props, children) => {\n\tconst { class: classNames, startAdornment, endAdornment, ...other } = props;\n\n\tif (!hasItems(startAdornment) && !hasItems(endAdornment)) {\n\t\treturn (\n\t\t\t<div class={clsx('input', classNames)} {...other}>\n\t\t\t\t{children}\n\t\t\t</div>\n\t\t);\n\t}\n\n\treturn (\n\t\t<div class={clsx('input', classNames)} {...other}>\n\t\t\t<InputAdornment position=\"start\">{startAdornment}</InputAdornment>\n\t\t\t{children}\n\t\t\t<InputAdornment position=\"end\">{endAdornment}</InputAdornment>\n\t\t</div>\n\t);\n};\n\nexport default KolInputContainerFc;\n","import { h, type FunctionalComponent as FC } from '@stencil/core';\nimport { KolButtonWcTag } from '../../core/component-names';\nimport type { InternalButtonProps } from '../../schema';\n\nexport type ButtonProps = Partial<InternalButtonProps> & {\n\tlabel: string;\n\tclass?: string;\n\tonClick?: (event: MouseEvent) => void;\n};\n\nconst KolButtonFc: FC<ButtonProps> = (props) => {\n\tconst { label, icons, hideLabel, disabled, onClick, ...other } = props;\n\n\treturn <KolButtonWcTag tabindex={0} _label={label} _disabled={disabled} _icons={icons} _hideLabel={hideLabel} _on={{ onClick }} {...other} />;\n};\n\nexport default KolButtonFc;\n","import { h, type FunctionalComponent as FC } from '@stencil/core';\nimport KolButtonFc, { type ButtonProps } from '../Button';\nimport KolIconFc, { type IconProps } from '../Icon';\n\ntype IconType = Partial<Omit<IconProps, 'icons'>> & {\n\tcomponentName: 'icon';\n\ticon?: string;\n\tclass?: never;\n\n\tonClick?: (event: MouseEvent) => void;\n};\n\ntype ButtonType = Partial<Omit<ButtonProps, 'icons'>> & {\n\tcomponentName: 'button';\n\ticon?: string;\n\tlabel?: string;\n\tclass?: string;\n\n\tonClick?: (event: MouseEvent) => void;\n};\n\nexport type IconButtonProps = IconType | ButtonType;\n\n/**\n * `KolIconButtonFc` is a functional component that renders either a Button or an Icon based on the provided props.\n *\n * Depending on the value of the `componentName` prop, either a Button (`KolButtonFc`) or an Icon (`KolIconFc`) is rendered.\n * Both components support optional `icon` props for displaying an icon and an optional `onClick` handler for user interactions.\n *\n * This component combines the flexibility of rendering either a button with an optional label or a simple icon, while ensuring that unnecessary props for the selected element are not passed.\n *\n * Supported props:\n * - `componentName`: Specifies whether a 'button' or 'icon' should be rendered. Default is 'button'.\n * - `label`: An optional label, which is only shown for Buttons.\n * - `icon`: The name of the icon (e.g., \"home\", \"edit\") or the Codicon class used for the icon display.\n * - `class`: Optional CSS class for additional styling customization.\n * - `onClick`: Optional click handler for user interactions.\n *\n * Example usage:\n * ```tsx\n * <KolIconButtonFc componentName=\"button\" label=\"Submit\" icon=\"check\" onClick={handleClick} />\n * <KolIconButtonFc componentName=\"icon\" icon=\"alert\" onClick={handleClick} />\n * ```\n *\n * @param {IconButtonProps} props - The properties that customize the component, including the selection of the component type (Button or Icon) and other specific attributes.\n * @returns {JSX.Element} - The rendered JSX element (Button or Icon).\n */\nconst KolIconButtonFc: FC<IconButtonProps> = (props) => {\n\tconst { componentName = 'button', label, icon, onClick, ...other } = props;\n\tconst Component = componentName === 'button' ? KolButtonFc : KolIconFc;\n\n\treturn <Component label={label || ''} hideLabel icons={`codicon codicon-${icon}`} onClick={onClick} {...other} />;\n};\n\nexport default KolIconButtonFc;\n","import { h, type FunctionalComponent as FC } from '@stencil/core';\nimport type {\n\tButtonProps,\n\tIconOrIconClass,\n\tInputColorStates,\n\tInputEmailStates,\n\tInputFileStates,\n\tInputNumberStates,\n\tInputPasswordStates,\n\tInputRangeStates,\n\tInputTextStates,\n\tKoliBriHorizontalIcons,\n\tTextareaStates,\n\tSelectStates,\n} from '../../schema';\n\nimport KolInputContainerFc, { type InputContainerProps } from '../../functional-components/InputContainer';\nimport KolIconButtonFc from '../../functional-components/IconButton';\nimport { isObject, isString } from 'lodash-es';\n\ntype InputState =\n\t| TextareaStates\n\t| SelectStates\n\t| InputTextStates\n\t| InputEmailStates\n\t| InputPasswordStates\n\t| InputNumberStates\n\t| InputColorStates\n\t| InputFileStates\n\t| InputRangeStates;\n\nexport type InputContainerStateWrapperProps = Partial<InputContainerProps> & {\n\tstate: InputState;\n};\n\nfunction getInputContainerProps(state: InputState): { icons?: KoliBriHorizontalIcons; smartButton?: ButtonProps; disabled?: boolean } {\n\tlet icons: KoliBriHorizontalIcons | undefined = undefined;\n\tlet smartButton: ButtonProps | undefined;\n\n\tif ('_icons' in state) {\n\t\ticons = state._icons;\n\t}\n\n\tif ('_smartButton' in state) {\n\t\tsmartButton = state._smartButton;\n\t}\n\n\treturn { icons, smartButton, disabled: state._disabled };\n}\n\nconst InputContainerStateWrapperFc: FC<InputContainerStateWrapperProps> = ({ state, endAdornment: defaultEndAdornment }, children) => {\n\tconst { icons, smartButton, disabled } = getInputContainerProps(state);\n\n\tlet leftIconProps: IconOrIconClass | undefined = icons?.left;\n\tif (isString(leftIconProps)) {\n\t\tleftIconProps = { icon: leftIconProps };\n\t}\n\n\tlet rightIconProps: IconOrIconClass | undefined = icons?.right;\n\tif (isString(rightIconProps)) {\n\t\trightIconProps = { icon: rightIconProps };\n\t}\n\n\tconst startAdornment = [];\n\tconst endAdornment = [];\n\n\tif (defaultEndAdornment) {\n\t\tif (Array.isArray(defaultEndAdornment)) {\n\t\t\tendAdornment.push(...defaultEndAdornment);\n\t\t} else {\n\t\t\tendAdornment.push(defaultEndAdornment);\n\t\t}\n\t}\n\n\tif (leftIconProps) {\n\t\tstartAdornment.push(<KolIconButtonFc componentName=\"icon\" {...(isObject(leftIconProps) ? leftIconProps : {})} />);\n\t}\n\n\tif (isObject(smartButton)) {\n\t\tendAdornment.push(<KolIconButtonFc componentName=\"button\" {...smartButton} hideLabel={true} disabled={disabled} />);\n\t}\n\n\tif (rightIconProps) {\n\t\tendAdornment.push(<KolIconButtonFc componentName=\"icon\" {...(isObject(rightIconProps) ? rightIconProps : {})} />);\n\t}\n\n\treturn (\n\t\t<KolInputContainerFc startAdornment={startAdornment} endAdornment={endAdornment}>\n\t\t\t{children}\n\t\t</KolInputContainerFc>\n\t);\n};\n\nexport default InputContainerStateWrapperFc;\n"],"version":3}

package/dist/cjs/InputStateWrapper-2f2a6a4c.js

@@ -1,4 +0,0 @@
-/*!
- * KoliBri - The accessible HTML-Standard
- */
-"use strict";const tslib_es6=require("./tslib.es6-5e301284.js"),index=require("./index-56ff9cf2.js"),getRenderStates=require("./getRenderStates-5aea416a.js"),InputFc=e=>{const{ariaDescribedBy:t,hideLabel:s,label:i,suggestions:n,value:a}=e,l=tslib_es6.__rest(e,["ariaDescribedBy","hideLabel","label","suggestions","value"]),r=Object.assign(Object.assign({type:"text",list:n?`${l.id}-list`:void 0},getRenderStates.getDefaultProps({ariaDescribedBy:t,hideLabel:s,label:i})),l);return index.h(index.Fragment,null,index.h("input",Object.assign({},r,{value:a})),n)},KolInputFc=InputFc,SuggestionsFc=e=>{var{id:t,suggestions:s}=e,i=tslib_es6.__rest(e,["id","suggestions"]);return s?index.h("datalist",Object.assign({id:`${t}-list`},i),s.map((e=>index.h("option",{value:e})))):null},KolSuggestionsFc=SuggestionsFc;function getInputProps(e){const{ariaDescribedBy:t}=getRenderStates.getRenderStates(e),s={id:e._id,hideLabel:e._hideLabel,label:e._label,accessKey:e._accessKey,disabled:e._disabled,name:e._name,ariaDescribedBy:t};if("_type"in e&&(s.type=e._type),"_value"in e&&(s.value=e._value),"_required"in e&&(s.required=e._required),"_maxLength"in e&&(s.maxlength=e._maxLength),"_placeholder"in e&&(s.placeholder=e._placeholder),"_autoComplete"in e&&(s.autoComplete=e._autoComplete),"_spellCheck"in e&&(s.spellcheck=e._spellCheck),"_pattern"in e&&(s.pattern=e._pattern),"_readOnly"in e&&(s.readOnly=e._readOnly),"_min"in e&&(s.min=e._min),"_max"in e&&(s.max=e._max),"_step"in e&&(s.step=e._step),"_multiple"in e&&(s.multiple=e._multiple),"_checked"in e&&(s.checked=e._checked),"_indeterminate"in e&&(s.indeterminate=e._indeterminate),"_suggestions"in e){Array.isArray(e._suggestions)&&e._suggestions.length>0&&(s.suggestions=index.h(KolSuggestionsFc,{id:e._id,suggestions:e._suggestions}))}return s}const InputStateWrapper=e=>{var{state:t}=e,s=tslib_es6.__rest(e,["state"]);return index.h(KolInputFc,Object.assign({},getInputProps(t),s))},KolInputStateWrapperFc=InputStateWrapper;exports.KolInputStateWrapperFc=KolInputStateWrapperFc,exports.KolSuggestionsFc=KolSuggestionsFc;

package/dist/cjs/InputStateWrapper-2f2a6a4c.js.map

@@ -1 +0,0 @@
-{"file":"InputStateWrapper-2f2a6a4c.js","mappings":"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","names":["getDefaultProps","h","getRenderStates","SuggestionsFc"],"sources":["src/functional-components/inputs/Input/Input.tsx","src/functional-components/Suggestions/Suggestions.tsx","src/functional-component-wrappers/InputStateWrapper/InputStateWrapper.tsx"],"sourcesContent":["import { h, Fragment, type FunctionalComponent as FC } from '@stencil/core';\nimport type { JSXBase, VNode } from '@stencil/core/internal';\nimport { getDefaultProps } from '../_helpers/getDefaultProps';\nimport type { DefaultInputProps } from '../_types';\n\nexport type InputProps = DefaultInputProps<JSXBase.InputHTMLAttributes<HTMLInputElement>> & {\n\tvalue?: string | number | string[];\n\tsuggestions?: VNode;\n\tspellcheck?: boolean;\n} & {\n\t[key: `data-${string}`]: unknown;\n\t[key: `aria-${string}`]: unknown;\n};\n\nconst InputFc: FC<InputProps> = (props) => {\n\tconst { ariaDescribedBy, hideLabel, label, suggestions, value, ...other } = props;\n\n\tconst inputProps: JSXBase.InputHTMLAttributes<HTMLInputElement> = {\n\t\ttype: 'text',\n\t\tlist: suggestions ? `${other.id}-list` : undefined,\n\t\t...getDefaultProps({ ariaDescribedBy, hideLabel, label }),\n\t\t...other,\n\t};\n\n\treturn (\n\t\t<>\n\t\t\t<input {...inputProps} value={value} />\n\t\t\t{suggestions}\n\t\t</>\n\t);\n};\n\nexport default InputFc;\n","import { h, type FunctionalComponent as FC } from '@stencil/core';\nimport type { JSXBase } from '@stencil/core/internal';\nimport type { W3CInputValue } from '../../schema';\n\nexport type SuggestionsProps = JSXBase.HTMLAttributes<HTMLDataListElement> & {\n\tid: string;\n\tsuggestions: W3CInputValue[];\n};\n\nconst SuggestionsFc: FC<SuggestionsProps> = ({ id, suggestions, ...other }) => {\n\tif (!suggestions) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<datalist id={`${id}-list`} {...other}>\n\t\t\t{suggestions.map((option: W3CInputValue) => (\n\t\t\t\t<option value={option} />\n\t\t\t))}\n\t\t</datalist>\n\t);\n};\nexport default SuggestionsFc;\n","import type { VNode } from '@stencil/core';\nimport { h, type FunctionalComponent as FC } from '@stencil/core';\nimport KolInputFc, { type InputProps } from '../../functional-components/inputs/Input';\n\nimport type {\n\tInputColorStates,\n\tInputEmailStates,\n\tInputFileStates,\n\tInputNumberStates,\n\tInputPasswordStates,\n\tInputRangeStates,\n\tInputTextStates,\n\tInputCheckboxStates,\n\tInputRadioStates,\n} from '../../schema';\nimport { getRenderStates } from '../_helpers/getRenderStates';\nimport SuggestionsFc from '../../functional-components/Suggestions';\n\ntype InputState =\n\t| InputTextStates\n\t| InputEmailStates\n\t| InputPasswordStates\n\t| InputNumberStates\n\t| InputColorStates\n\t| InputFileStates\n\t| InputRangeStates\n\t| InputCheckboxStates\n\t| InputRadioStates;\n\nexport type InputStateWrapperProps = Partial<InputProps> & {\n\tstate: InputState;\n};\n\nfunction getInputProps(state: InputState): InputProps {\n\tconst { ariaDescribedBy } = getRenderStates(state);\n\n\tconst props: InputProps = {\n\t\tid: state._id,\n\t\thideLabel: state._hideLabel,\n\t\tlabel: state._label,\n\t\taccessKey: state._accessKey,\n\t\tdisabled: state._disabled,\n\t\tname: state._name,\n\n\t\tariaDescribedBy: ariaDescribedBy,\n\t};\n\n\tif ('_type' in state) props.type = state._type;\n\tif ('_value' in state) props.value = state._value as string | number | string[];\n\tif ('_required' in state) props.required = state._required;\n\tif ('_maxLength' in state) props.maxlength = state._maxLength;\n\tif ('_placeholder' in state) props.placeholder = state._placeholder;\n\tif ('_autoComplete' in state) props.autoComplete = state._autoComplete;\n\tif ('_spellCheck' in state) props.spellcheck = state._spellCheck;\n\tif ('_pattern' in state) props.pattern = state._pattern;\n\tif ('_readOnly' in state) props.readOnly = state._readOnly;\n\tif ('_min' in state) props.min = state._min;\n\tif ('_max' in state) props.max = state._max;\n\tif ('_step' in state) props.step = state._step;\n\tif ('_multiple' in state) props.multiple = state._multiple;\n\tif ('_checked' in state) props.checked = state._checked;\n\tif ('_indeterminate' in state) props.indeterminate = state._indeterminate;\n\n\tif ('_suggestions' in state) {\n\t\tconst hasSuggestions = Array.isArray(state._suggestions) && state._suggestions.length > 0;\n\t\tif (hasSuggestions) {\n\t\t\tprops.suggestions = (<SuggestionsFc id={state._id} suggestions={state._suggestions} />) as VNode;\n\t\t}\n\t}\n\n\treturn props;\n}\n\nconst InputStateWrapper: FC<InputStateWrapperProps> = ({ state, ...other }) => {\n\treturn <KolInputFc {...getInputProps(state)} {...other} />;\n};\n\nexport default InputStateWrapper;\n"],"version":3}