npm - @public-ui/components - Versions diffs - 4.0.0-alpha.5 → 4.0.0-alpha.7 - Mend

@public-ui/components 4.0.0-alpha.5 → 4.0.0-alpha.7

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (635) hide show

package/doc/input-date.md CHANGED Viewed

@@ -20,7 +20,7 @@
 | `_min`                | `_min`           | Defines the smallest possible input value.                                                                                                                    | `` Date \| `${number}-${number}-${number}T${number}:${number}:${number}` \| `${number}-${number}-${number}T${number}:${number}` \| `${number}-${number}-${number}` \| `${number}-${number}` \| `${number}-W${number}` \| `${number}:${number}:${number}` \| `${number}:${number}` \| undefined ``                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                 | `undefined` |
 | `_msg`                | `_msg`           | Defines the properties for a message rendered as Alert component.                                                                                             | `Omit<AlertProps, "_on" \| "_hasCloser" \| "_label" \| "_level" \| "_variant"> & { _description: string; } \| string \| undefined`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                | `undefined` |
 | `_name`               | `_name`          | Defines the technical name of an input field.                                                                                                                 | `string \| undefined`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                             | `undefined` |
-| `_on`                 | --               | Gibt die EventCallback-Funktionen für das Input-Event an.                                                                                                     | `InputTypeOnBlur & InputTypeOnClick & InputTypeOnChange & InputTypeOnFocus & InputTypeOnInput \| undefined`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                       | `undefined` |
+| `_on`                 | --               | Gibt die EventCallback-Funktionen für das Input-Event an.                                                                                                     | `InputTypeOnBlur & InputTypeOnClick & InputTypeOnChange & InputTypeOnFocus & InputTypeOnInput & InputTypeOnKeyDown \| undefined`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                  | `undefined` |
 | `_readOnly`           | `_read-only`     | Makes the input element read only.                                                                                                                            | `boolean \| undefined`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                            | `false`     |
 | `_required`           | `_required`      | Makes the input element required.                                                                                                                             | `boolean \| undefined`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                            | `false`     |
 | `_shortKey`           | `_short-key`     | Adds a visual shortcut hint after the label and instructs the screen reader to read the shortcut aloud.                                                       | `string \| undefined`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                             | `undefined` |

package/doc/input-email.md CHANGED Viewed

@@ -22,7 +22,7 @@
 | `_msg`                | `_msg`                 | Defines the properties for a message rendered as Alert component.                                                                                             | `Omit<AlertProps, "_on" \| "_hasCloser" \| "_label" \| "_level" \| "_variant"> & { _description: string; } \| string \| undefined`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                | `undefined` |
 | `_multiple`           | `_multiple`            | Makes the input accept multiple inputs.                                                                                                                       | `boolean \| undefined`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                            | `false`     |
 | `_name`               | `_name`                | Defines the technical name of an input field.                                                                                                                 | `string \| undefined`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                             | `undefined` |
-| `_on`                 | --                     | Gibt die EventCallback-Funktionen für das Input-Event an.                                                                                                     | `InputTypeOnBlur & InputTypeOnClick & InputTypeOnChange & InputTypeOnFocus & InputTypeOnInput \| undefined`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                       | `undefined` |
+| `_on`                 | --                     | Gibt die EventCallback-Funktionen für das Input-Event an.                                                                                                     | `InputTypeOnBlur & InputTypeOnClick & InputTypeOnChange & InputTypeOnFocus & InputTypeOnInput & InputTypeOnKeyDown \| undefined`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                  | `undefined` |
 | `_pattern`            | `_pattern`             | Defines a validation pattern for the input field.                                                                                                             | `string \| undefined`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                             | `undefined` |
 | `_placeholder`        | `_placeholder`         | Defines the placeholder for input field. To be shown when there's no value.                                                                                   | `string \| undefined`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                             | `undefined` |
 | `_readOnly`           | `_read-only`           | Makes the input element read only.                                                                                                                            | `boolean \| undefined`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                            | `false`     |

package/doc/input-file.md CHANGED Viewed

@@ -19,7 +19,7 @@
 | `_msg`                | `_msg`           | Defines the properties for a message rendered as Alert component.                                                                                             | `Omit<AlertProps, "_on" \| "_hasCloser" \| "_label" \| "_level" \| "_variant"> & { _description: string; } \| string \| undefined`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                | `undefined` |
 | `_multiple`           | `_multiple`      | Makes the input accept multiple inputs.                                                                                                                       | `boolean \| undefined`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                            | `false`     |
 | `_name`               | `_name`          | Defines the technical name of an input field.                                                                                                                 | `string \| undefined`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                             | `undefined` |
-| `_on`                 | --               | Gibt die EventCallback-Funktionen für das Input-Event an.                                                                                                     | `InputTypeOnBlur & InputTypeOnClick & InputTypeOnChange & InputTypeOnFocus & InputTypeOnInput \| undefined`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                       | `undefined` |
+| `_on`                 | --               | Gibt die EventCallback-Funktionen für das Input-Event an.                                                                                                     | `InputTypeOnBlur & InputTypeOnClick & InputTypeOnChange & InputTypeOnFocus & InputTypeOnInput & InputTypeOnKeyDown \| undefined`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                  | `undefined` |
 | `_required`           | `_required`      | Makes the input element required.                                                                                                                             | `boolean \| undefined`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                            | `false`     |
 | `_shortKey`           | `_short-key`     | Adds a visual shortcut hint after the label and instructs the screen reader to read the shortcut aloud.                                                       | `string \| undefined`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                             | `undefined` |
 | `_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?: StencilUnknown; _ariaExpanded?: boolean \| undefined; _accessKey?: string \| undefined; _role?: "tab" \| "treeitem" \| undefined; _ariaControls?: string \| undefined; _ariaDescription?: string \| undefined; _ariaSelected?: boolean \| undefined; _on?: ButtonCallbacksPropType<StencilUnknown> \| undefined; _type?: "button" \| "reset" \| "submit" \| undefined; _variant?: "primary" \| "secondary" \| "normal" \| "tertiary" \| "danger" \| "ghost" \| "custom" \| undefined; _customClass?: string \| undefined; _disabled?: boolean \| undefined; _hideLabel?: boolean \| undefined; _icons?: IconsPropType \| undefined; _id?: string \| undefined; _name?: string \| undefined; _shortKey?: string \| undefined; _syncValueBySelector?: string \| undefined; _tooltipAlign?: AlignPropType \| undefined; }` | `undefined` |

package/doc/input-number.md CHANGED Viewed

@@ -20,7 +20,7 @@
 | `_min`                | `_min`           | Defines the smallest possible input value.                                                                                                                    | `` `${number}.${number}` \| `${number}` \| number \| undefined ``                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                 | `undefined` |
 | `_msg`                | `_msg`           | Defines the properties for a message rendered as Alert component.                                                                                             | `Omit<AlertProps, "_on" \| "_hasCloser" \| "_label" \| "_level" \| "_variant"> & { _description: string; } \| string \| undefined`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                | `undefined` |
 | `_name`               | `_name`          | Defines the technical name of an input field.                                                                                                                 | `string \| undefined`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                             | `undefined` |
-| `_on`                 | --               | Gibt die EventCallback-Funktionen für das Input-Event an.                                                                                                     | `InputTypeOnBlur & InputTypeOnClick & InputTypeOnChange & InputTypeOnFocus & InputTypeOnInput \| undefined`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                       | `undefined` |
+| `_on`                 | --               | Gibt die EventCallback-Funktionen für das Input-Event an.                                                                                                     | `InputTypeOnBlur & InputTypeOnClick & InputTypeOnChange & InputTypeOnFocus & InputTypeOnInput & InputTypeOnKeyDown \| undefined`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                  | `undefined` |
 | `_placeholder`        | `_placeholder`   | Defines the placeholder for input field. To be shown when there's no value.                                                                                   | `string \| undefined`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                             | `undefined` |
 | `_readOnly`           | `_read-only`     | Makes the input element read only.                                                                                                                            | `boolean \| undefined`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                            | `false`     |
 | `_required`           | `_required`      | Makes the input element required.                                                                                                                             | `boolean \| undefined`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                            | `false`     |

package/doc/input-password.md CHANGED Viewed

@@ -21,7 +21,7 @@
 | `_maxLengthBehavior`  | `_max-length-behavior` | Defines the behavior when maxLength is set. 'hard' sets the maxlength attribute, 'soft' shows a character counter without preventing input.                   | `"hard" \| "soft" \| undefined`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                   | `'hard'`    |
 | `_msg`                | `_msg`                 | Defines the properties for a message rendered as Alert component.                                                                                             | `Omit<AlertProps, "_on" \| "_hasCloser" \| "_label" \| "_level" \| "_variant"> & { _description: string; } \| string \| undefined`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                | `undefined` |
 | `_name`               | `_name`                | Defines the technical name of an input field.                                                                                                                 | `string \| undefined`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                             | `undefined` |
-| `_on`                 | --                     | Gibt die EventCallback-Funktionen für das Input-Event an.                                                                                                     | `InputTypeOnBlur & InputTypeOnClick & InputTypeOnChange & InputTypeOnFocus & InputTypeOnInput \| undefined`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                       | `undefined` |
+| `_on`                 | --                     | Gibt die EventCallback-Funktionen für das Input-Event an.                                                                                                     | `InputTypeOnBlur & InputTypeOnClick & InputTypeOnChange & InputTypeOnFocus & InputTypeOnInput & InputTypeOnKeyDown \| undefined`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                  | `undefined` |
 | `_pattern`            | `_pattern`             | Defines a validation pattern for the input field.                                                                                                             | `string \| undefined`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                             | `undefined` |
 | `_placeholder`        | `_placeholder`         | Defines the placeholder for input field. To be shown when there's no value.                                                                                   | `string \| undefined`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                             | `undefined` |
 | `_readOnly`           | `_read-only`           | Makes the input element read only.                                                                                                                            | `boolean \| undefined`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                            | `false`     |

package/doc/input-radio.md CHANGED Viewed

@@ -15,7 +15,7 @@
 | `_label` _(required)_ | `_label`         | Defines the visible or semantic label of the component (e.g. aria-label, label, headline, caption, summary, etc.). Set to `false` to enable the expert slot.  | `string`                                                                                                                           | `undefined`  |
 | `_msg`                | `_msg`           | Defines the properties for a message rendered as Alert component.                                                                                             | `Omit<AlertProps, "_on" \| "_hasCloser" \| "_label" \| "_level" \| "_variant"> & { _description: string; } \| string \| undefined` | `undefined`  |
 | `_name`               | `_name`          | Defines the technical name of an input field.                                                                                                                 | `string \| undefined`                                                                                                              | `undefined`  |
-| `_on`                 | --               | Gibt die EventCallback-Funktionen für das Input-Event an.                                                                                                     | `InputTypeOnBlur & InputTypeOnClick & InputTypeOnChange & InputTypeOnFocus & InputTypeOnInput \| undefined`                        | `undefined`  |
+| `_on`                 | --               | Gibt die EventCallback-Funktionen für das Input-Event an.                                                                                                     | `InputTypeOnBlur & InputTypeOnClick & InputTypeOnChange & InputTypeOnFocus & InputTypeOnInput & InputTypeOnKeyDown \| undefined`   | `undefined`  |
 | `_options`            | `_options`       | Options the user can choose from.                                                                                                                             | `RadioOption<StencilUnknown>[] \| string \| undefined`                                                                             | `undefined`  |
 | `_orientation`        | `_orientation`   | Defines whether the orientation of the component is horizontal or vertical.                                                                                   | `"horizontal" \| "vertical" \| undefined`                                                                                          | `'vertical'` |
 | `_required`           | `_required`      | Makes the input element required.                                                                                                                             | `boolean \| undefined`                                                                                                             | `false`      |

package/doc/input-range.md CHANGED Viewed

@@ -20,7 +20,7 @@
 | `_min`                | `_min`           | Defines the smallest possible input value.                                                                                                                    | `` `${number}.${number}` \| `${number}` \| number \| undefined ``                                                                  | `0`         |
 | `_msg`                | `_msg`           | Defines the properties for a message rendered as Alert component.                                                                                             | `Omit<AlertProps, "_on" \| "_hasCloser" \| "_label" \| "_level" \| "_variant"> & { _description: string; } \| string \| undefined` | `undefined` |
 | `_name`               | `_name`          | Defines the technical name of an input field.                                                                                                                 | `string \| undefined`                                                                                                              | `undefined` |
-| `_on`                 | --               | Gibt die EventCallback-Funktionen für das Input-Event an.                                                                                                     | `InputTypeOnBlur & InputTypeOnClick & InputTypeOnChange & InputTypeOnFocus & InputTypeOnInput \| undefined`                        | `undefined` |
+| `_on`                 | --               | Gibt die EventCallback-Funktionen für das Input-Event an.                                                                                                     | `InputTypeOnBlur & InputTypeOnClick & InputTypeOnChange & InputTypeOnFocus & InputTypeOnInput & InputTypeOnKeyDown \| undefined`   | `undefined` |
 | `_shortKey`           | `_short-key`     | Adds a visual shortcut hint after the label and instructs the screen reader to read the shortcut aloud.                                                       | `string \| undefined`                                                                                                              | `undefined` |
 | `_step`               | `_step`          | Defines the step size for value changes.                                                                                                                      | `` `${number}.${number}` \| `${number}` \| number \| undefined ``                                                                  | `undefined` |
 | `_suggestions`        | `_suggestions`   | Suggestions to provide for the input.                                                                                                                         | `W3CInputValue[] \| string \| undefined`                                                                                           | `undefined` |

package/doc/input-text.md CHANGED Viewed

@@ -21,7 +21,7 @@
 | `_maxLengthBehavior`  | `_max-length-behavior` | Defines the behavior when maxLength is set. 'hard' sets the maxlength attribute, 'soft' shows a character counter without preventing input.                   | `"hard" \| "soft" \| undefined`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                   | `'hard'`    |
 | `_msg`                | `_msg`                 | Defines the properties for a message rendered as Alert component.                                                                                             | `Omit<AlertProps, "_on" \| "_hasCloser" \| "_label" \| "_level" \| "_variant"> & { _description: string; } \| string \| undefined`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                | `undefined` |
 | `_name`               | `_name`                | Defines the technical name of an input field.                                                                                                                 | `string \| undefined`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                             | `undefined` |
-| `_on`                 | --                     | Gibt die EventCallback-Funktionen für das Input-Event an.                                                                                                     | `InputTypeOnBlur & InputTypeOnClick & InputTypeOnChange & InputTypeOnFocus & InputTypeOnInput \| undefined`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                       | `undefined` |
+| `_on`                 | --                     | Gibt die EventCallback-Funktionen für das Input-Event an.                                                                                                     | `InputTypeOnBlur & InputTypeOnClick & InputTypeOnChange & InputTypeOnFocus & InputTypeOnInput & InputTypeOnKeyDown \| undefined`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                  | `undefined` |
 | `_pattern`            | `_pattern`             | Defines a validation pattern for the input field.                                                                                                             | `string \| undefined`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                             | `undefined` |
 | `_placeholder`        | `_placeholder`         | Defines the placeholder for input field. To be shown when there's no value.                                                                                   | `string \| undefined`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                             | `undefined` |
 | `_readOnly`           | `_read-only`           | Makes the input element read only.                                                                                                                            | `boolean \| undefined`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                            | `false`     |

package/doc/select.md CHANGED Viewed

@@ -18,7 +18,7 @@
 | `_msg`                  | `_msg`           | Defines the properties for a message rendered as Alert component.                                                                                             | `Omit<AlertProps, "_on" \| "_hasCloser" \| "_label" \| "_level" \| "_variant"> & { _description: string; } \| string \| undefined` | `undefined` |
 | `_multiple`             | `_multiple`      | Makes the input accept multiple inputs.                                                                                                                       | `boolean \| undefined`                                                                                                             | `false`     |
 | `_name`                 | `_name`          | Defines the technical name of an input field.                                                                                                                 | `string \| undefined`                                                                                                              | `undefined` |
-| `_on`                   | --               | Gibt die EventCallback-Funktionen für das Input-Event an.                                                                                                     | `InputTypeOnBlur & InputTypeOnClick & InputTypeOnChange & InputTypeOnFocus & InputTypeOnInput \| undefined`                        | `undefined` |
+| `_on`                   | --               | Gibt die EventCallback-Funktionen für das Input-Event an.                                                                                                     | `InputTypeOnBlur & InputTypeOnClick & InputTypeOnChange & InputTypeOnFocus & InputTypeOnInput & InputTypeOnKeyDown \| undefined`   | `undefined` |
 | `_options` _(required)_ | `_options`       | Options the user can choose from, also supporting Optgroup.                                                                                                   | `(Option<StencilUnknown> \| Optgroup<StencilUnknown>)[] \| string`                                                                 | `undefined` |
 | `_required`             | `_required`      | Makes the input element required.                                                                                                                             | `boolean \| undefined`                                                                                                             | `false`     |
 | `_rows`                 | `_rows`          | Defines how many rows of options should be visible at the same time.                                                                                          | `number \| undefined`                                                                                                              | `undefined` |

package/doc/single-select.md CHANGED Viewed

@@ -7,7 +7,7 @@
 | Property                | Attribute            | Description                                                                                                                                                   | Type                                                                                                                               | Default     |
 | ----------------------- | -------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------- | ---------------------------------------------------------------------------------------------------------------------------------- | ----------- |
-| `_accessKey`            | `_access-key`        | Defines the key combination that can be used to trigger or focus the component’s interactive element.                                                         | `string \| undefined`                                                                                                              | `undefined` |
+| `_accessKey`            | `_access-key`        | Defines the key combination that can be used to trigger or focus the component's interactive element.                                                         | `string \| undefined`                                                                                                              | `undefined` |
 | `_disabled`             | `_disabled`          | Makes the element not focusable and ignore all events.                                                                                                        | `boolean \| undefined`                                                                                                             | `false`     |
 | `_hideClearButton`      | `_hide-clear-button` | Defines the whether the clear button should be hidden.                                                                                                        | `boolean \| undefined`                                                                                                             | `false`     |
 | `_hideLabel`            | `_hide-label`        | Hides the caption by default and displays the caption text with a tooltip when the interactive element is focused or the mouse is over it.                    | `boolean \| undefined`                                                                                                             | `false`     |
@@ -18,7 +18,7 @@
 | `_label` _(required)_   | `_label`             | Defines the visible or semantic label of the component (e.g. aria-label, label, headline, caption, summary, etc.). Set to `false` to enable the expert slot.  | `string`                                                                                                                           | `undefined` |
 | `_msg`                  | `_msg`               | Defines the properties for a message rendered as Alert component.                                                                                             | `Omit<AlertProps, "_on" \| "_hasCloser" \| "_label" \| "_level" \| "_variant"> & { _description: string; } \| string \| undefined` | `undefined` |
 | `_name`                 | `_name`              | Defines the technical name of an input field.                                                                                                                 | `string \| undefined`                                                                                                              | `undefined` |
-| `_on`                   | --                   | Gibt die EventCallback-Funktionen für das Input-Event an.                                                                                                     | `InputTypeOnBlur & InputTypeOnClick & InputTypeOnChange & InputTypeOnFocus & InputTypeOnInput \| undefined`                        | `undefined` |
+| `_on`                   | --                   | Gibt die EventCallback-Funktionen für das Input-Event an.                                                                                                     | `InputTypeOnBlur & InputTypeOnClick & InputTypeOnChange & InputTypeOnFocus & InputTypeOnInput & InputTypeOnKeyDown \| undefined`   | `undefined` |
 | `_options` _(required)_ | `_options`           | Options the user can choose from.                                                                                                                             | `Option<StencilUnknown>[] \| string`                                                                                               | `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`     |

package/doc/table-stateful.md CHANGED Viewed

@@ -23,13 +23,13 @@
 ## Methods
-### `getSelection() => Promise<KoliBriTableDataType[] | KoliBriTableDataType | null>`
+### `getSelection() => Promise<KoliBriTableDataType[] | null>`
 Returns the selected rows.
 #### Returns
-Type: `Promise<KoliBriTableDataType | KoliBriTableDataType[] | null>`
+Type: `Promise<KoliBriTableDataType[] | null>`

package/doc/table-stateless.md CHANGED Viewed

@@ -13,7 +13,7 @@
 | `_headerCells` _(required)_ | `_header-cells`      | Defines the horizontal and vertical table headers.                                                                 | `string \| { horizontal?: KoliBriTableHeaderCell[][] \| undefined; vertical?: KoliBriTableHeaderCell[][] \| 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` |
 | `_minWidth` _(required)_    | `_min-width`         | Defines the table min-width (CSS width values).                                                                    | `string`                                                                                                                                                                                                                                                           | `undefined` |
-| `_on`                       | --                   | Defines the callback functions for table events.                                                                   | `undefined \| { onSort?: EventValueOrEventCallback<MouseEvent, SortEventPayload> \| undefined; onSelectionChange?: EventValueOrEventCallback<Event, SelectionChangeEventPayload> \| undefined; }`                                                                  | `undefined` |
+| `_on`                       | --                   | Defines the callback functions for table events.                                                                   | `undefined \| { onSort?: EventValueOrEventCallback<MouseEvent, SortEventPayload> \| undefined; onSelectionChange?: EventValueOrEventCallback<Event, KoliBriTableSelectionKeys> \| undefined; }`                                                                    | `undefined` |
 | `_selection`                | `_selection`         | Defines how rows can be selected and the current selection.                                                        | `string \| undefined \| ({ label: (row: KoliBriTableDataType) => string; keyPropertyName?: string \| undefined; multiple?: boolean \| undefined; selectedKeys?: KoliBriTableSelectionKeys \| undefined; disabledKeys?: KoliBriTableSelectionKeys \| undefined; })` | `undefined` |
 | `_tableSettings`            | --                   | Defines the table settings including column visibility, order and width.                                           | `TableSettings \| undefined`                                                                                                                                                                                                                                       | `undefined` |

package/doc/textarea.md CHANGED Viewed

@@ -21,7 +21,7 @@
 | `_maxLengthBehavior`  | `_max-length-behavior` | Defines the behavior when maxLength is set. 'hard' sets the maxlength attribute, 'soft' shows a character counter without preventing input.                                                                                                                                                        | `"hard" \| "soft" \| undefined`                                                                                                    | `'hard'`     |
 | `_msg`                | `_msg`                 | Defines the properties for a message rendered as Alert component.                                                                                                                                                                                                                                  | `Omit<AlertProps, "_on" \| "_hasCloser" \| "_label" \| "_level" \| "_variant"> & { _description: string; } \| string \| undefined` | `undefined`  |
 | `_name`               | `_name`                | Defines the technical name of an input field.                                                                                                                                                                                                                                                      | `string \| undefined`                                                                                                              | `undefined`  |
-| `_on`                 | --                     | Gibt die EventCallback-Funktionen für das Input-Event an.                                                                                                                                                                                                                                          | `InputTypeOnBlur & InputTypeOnClick & InputTypeOnChange & InputTypeOnFocus & InputTypeOnInput \| undefined`                        | `undefined`  |
+| `_on`                 | --                     | Gibt die EventCallback-Funktionen für das Input-Event an.                                                                                                                                                                                                                                          | `InputTypeOnBlur & InputTypeOnClick & InputTypeOnChange & InputTypeOnFocus & InputTypeOnInput & InputTypeOnKeyDown \| undefined`   | `undefined`  |
 | `_placeholder`        | `_placeholder`         | Defines the placeholder for input field. To be shown when there's no value.                                                                                                                                                                                                                        | `string \| undefined`                                                                                                              | `undefined`  |
 | `_readOnly`           | `_read-only`           | Makes the input element read only.                                                                                                                                                                                                                                                                 | `boolean \| undefined`                                                                                                             | `false`      |
 | `_required`           | `_required`            | Makes the input element required.                                                                                                                                                                                                                                                                  | `boolean \| undefined`                                                                                                             | `false`      |

package/loader/index.d.ts ADDED Viewed

	@@ -0,0 +1 @@
1	+ export { defineCustomElements } from '../dist/loader';

package/loader/index.mjs ADDED Viewed

	@@ -0,0 +1 @@
1	+ export { defineCustomElements } from '../dist/loader';

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "@public-ui/components",
-  "version": "4.0.0-alpha.5",
+  "version": "4.0.0-alpha.7",
   "license": "EUPL-1.2",
   "homepage": "https://public-ui.github.io",
   "repository": {
@@ -17,6 +17,20 @@
   },
   "main": "dist/index.cjs.js",
   "module": "dist/index.js",
+  "exports": {
+    ".": {
+      "types": "./dist/types/index.d.ts",
+      "import": "./dist/index.js",
+      "require": "./dist/index.cjs.js"
+    },
+    "./loader": {
+      "types": "./loader/index.d.ts",
+      "import": "./loader/index.mjs",
+      "require": "./dist/loader/index.cjs.js"
+    },
+    "./custom-elements.json": "./custom-elements.json",
+    "./package.json": "./package.json"
+  },
   "customElements": "custom-elements.json",
   "es2015": "dist/esm/index.mjs",
   "es2017": "dist/esm/index.mjs",
@@ -56,9 +70,9 @@
     "boxen": "8.0.1",
     "chalk": "5.6.2",
     "clsx": "2.1.1",
-    "color-convert": "3.1.2",
+    "color-convert": "3.1.3",
     "color-rgba": "2.4.0",
-    "figlet": "1.9.3",
+    "figlet": "1.9.4",
     "lodash-es": "4.17.21",
     "markdown-it": "14.1.0",
     "query-selector-all-shadow-root": "0.0.3",
@@ -76,6 +90,7 @@
     "doc",
     "custom-elements.json",
     "index.scss",
+    "loader",
     "postinstall.js",
     "vscode-custom-data.json"
   ],

package/vscode-custom-data.json CHANGED Viewed

@@ -501,6 +501,10 @@
           "name": "_disabled",
           "description": "Makes the element not focusable and ignore all events."
         },
+        {
+          "name": "_hide-clear-button",
+          "description": "Hides the clear button."
+        },
         {
           "name": "_hide-label",
           "description": "Hides the caption by default and displays the caption text with a tooltip when the\ninteractive element is focused or the mouse is over it."
@@ -3180,7 +3184,7 @@
       "attributes": [
         {
           "name": "_access-key",
-          "description": "Defines the key combination that can be used to trigger or focus the component’s interactive element."
+          "description": "Defines the key combination that can be used to trigger or focus the component's interactive element."
         },
         {
           "name": "_disabled",

package/dist/cjs/CustomSuggestionsToggle-B2o8krAR.js DELETED Viewed

@@ -1,4 +0,0 @@
-/*!
- * KoliBri - The accessible HTML-Standard
- */
-"use strict";var index=require("./index-CHPNB6lV.js"),clsx=require("./clsx-CkZlkaek.js"),componentNames=require("./component-names-D7MwtuB7.js"),i18n=require("./i18n-NiDr3RbD.js");const CustomSuggestionsOptionFc=({index:o,ref:s,selected:e,onClick:n,onMouseOver:t,onFocus:i,onKeyDown:u,option:r,searchTerm:l})=>index.h("li",{id:`option-${o}`,key:`-${o}`,ref:s,"data-index":o,tabIndex:-1,role:"option","aria-selected":e?"true":void 0,onClick:n,onMouseOver:t,onFocus:i,class:"kol-custom-suggestions-option",onKeyDown:u},((o,s)=>{if(!(null==s?void 0:s.trim()))return o;const e=new RegExp(`(${s.replace(/[.*+?^${}()|[\]\\]/g,"\\$&")})`,"gi");return o.split(e).map((o,s)=>e.test(o)?index.h("mark",{key:s},o):o)})(String(r),l||"")),CustomSuggestionsOptionsGroupFc=({blockSuggestionMouseOver:o,onKeyDown:s,style:e},n)=>index.h("ul",{role:"listbox",style:e,class:clsx.clsx("kol-custom-suggestions-options-group",{"kol-custom-suggestions-options-group--cursor-hidden":o}),onKeyDown:s},n),translateDropdown=i18n.translate("kol-dropdown"),CustomSuggestionsToggleFc=({onClick:o,disabled:s})=>index.h("button",{tabindex:"-1",class:"kol-custom-suggestions-toggle",onClick:o,disabled:s},index.h(componentNames.KolIconTag,{_icons:"codicon codicon-triangle-down",_label:translateDropdown}));exports.CustomSuggestionsOptionFc=CustomSuggestionsOptionFc,exports.CustomSuggestionsOptionsGroupFc=CustomSuggestionsOptionsGroupFc,exports.CustomSuggestionsToggleFc=CustomSuggestionsToggleFc;

package/dist/cjs/CustomSuggestionsToggle-B2o8krAR.js.map DELETED Viewed

@@ -1 +0,0 @@

- {"version":3,"file":"CustomSuggestionsToggle-B2o8krAR.js","sources":["src/functional-components/CustomSuggestionsOption/CustomSuggestionsOption.tsx","src/functional-components/CustomSuggestionsOptionsGroup/CustomSuggestionsOptionsGroup.tsx","src/functional-components/CustomSuggestionsToggle/CustomSuggestionsToggle.tsx"],"sourcesContent":["import { type FunctionalComponent as FC, h } from '@stencil/core';\nimport type { JSXBase } from '@stencil/core/internal';\nimport type { W3CInputValue } from '../../schema';\n\nexport type CustomSuggestionsProps = JSXBase.HTMLAttributes<HTMLLIElement> & {\n\tindex: number;\n\toption: W3CInputValue;\n\tselected: boolean;\n\tsearchTerm?: string;\n\tref?: ((elm?: HTMLLIElement | undefined) => void) | undefined;\n};\n\nconst CustomSuggestionsOptionFc: FC<CustomSuggestionsProps> = ({ index, ref, selected, onClick, onMouseOver, onFocus, onKeyDown, option, searchTerm }) => {\n\tconst highlightSearchTerm = (text: string, searchTerm: string) => {\n\t\tif (!searchTerm?.trim()) return text;\n\n\t\tconst regex = new RegExp(`(${searchTerm.replace(/[.*+?^${}()|[\\]\\\\]/g, '\\\\$&')})`, 'gi');\n\t\tconst parts = text.split(regex);\n\n\t\treturn parts.map((part, partIndex) => (regex.test(part) ? <mark key={partIndex}>{part}</mark> : part));\n\t};\n\n\treturn (\n\t\t<li\n\t\t\tid={`option-${index}`}\n\t\t\tkey={`-${index}`}\n\t\t\tref={ref}\n\t\t\tdata-index={index}\n\t\t\ttabIndex={-1}\n\t\t\trole=\"option\"\n\t\t\taria-selected={selected ? 'true' : undefined}\n\t\t\tonClick={onClick}\n\t\t\tonMouseOver={onMouseOver}\n\t\t\tonFocus={onFocus}\n\t\t\tclass=\"kol-custom-suggestions-option\"\n\t\t\tonKeyDown={onKeyDown}\n\t\t>\n\t\t\t{highlightSearchTerm(String(option), searchTerm || '')}\n\t\t</li>\n\t);\n};\nexport default CustomSuggestionsOptionFc;\n","import { type FunctionalComponent as FC, h } from '@stencil/core';\nimport type { JSXBase } from '@stencil/core/internal';\nimport clsx from 'clsx';\n\nexport type CustomSuggestionsOptionsGroupProps = JSXBase.HTMLAttributes<HTMLUListElement> & {\n\tblockSuggestionMouseOver: boolean;\n};\n\nconst CustomSuggestionsOptionsGroupFc: FC<CustomSuggestionsOptionsGroupProps> = ({ blockSuggestionMouseOver, onKeyDown, style }, children) => {\n\treturn (\n\t\t<ul\n\t\t\trole=\"listbox\"\n\t\t\tstyle={style}\n\t\t\tclass={clsx('kol-custom-suggestions-options-group', {\n\t\t\t\t'kol-custom-suggestions-options-group--cursor-hidden': blockSuggestionMouseOver,\n\t\t\t})}\n\t\t\tonKeyDown={onKeyDown}\n\t\t>\n\t\t\t{children}\n\t\t</ul>\n\t);\n};\nexport default CustomSuggestionsOptionsGroupFc;\n","import { type FunctionalComponent as FC, h } from '@stencil/core';\nimport type { JSXBase } from '@stencil/core/internal';\nimport { KolIconTag } from '../../core/component-names';\nimport { translate } from '../../i18n';\n\nconst translateDropdown = translate('kol-dropdown');\n\nexport type CustomSuggestionsToggleProps = JSXBase.HTMLAttributes<HTMLButtonElement> & { disabled?: boolean };\n\nconst CustomSuggestionsToggleFc: FC<CustomSuggestionsToggleProps> = ({ onClick, disabled }) => {\n\treturn (\n\t\t<button tabindex=\"-1\" class=\"kol-custom-suggestions-toggle\" onClick={onClick} disabled={disabled}>\n\t\t\t<KolIconTag _icons=\"codicon codicon-triangle-down\" _label={translateDropdown} />\n\t\t</button>\n\t);\n};\nexport default CustomSuggestionsToggleFc;\n"],"names":["index","h","clsx","translate","KolIconTag"],"mappings":";;;;;;;;;;AAYM,MAAA,yBAAyB,GAA+B,CAAC,SAAEA,OAAK,EAAE,GAAG,EAAE,QAAQ,EAAE,OAAO,EAAE,WAAW,EAAE,OAAO,EAAE,SAAS,EAAE,MAAM,EAAE,UAAU,EAAE,KAAI;AACxJ,IAAA,MAAM,mBAAmB,GAAG,CAAC,IAAY,EAAE,UAAkB,KAAI;QAChE,IAAI,EAAC,UAAU,KAAV,IAAA,IAAA,UAAU,uBAAV,UAAU,CAAE,IAAI,EAAE,CAAA;AAAE,YAAA,OAAO,IAAI;AAEpC,QAAA,MAAM,KAAK,GAAG,IAAI,MAAM,CAAC,CAAA,CAAA,EAAI,UAAU,CAAC,OAAO,CAAC,qBAAqB,EAAE,MAAM,CAAC,GAAG,EAAE,IAAI,CAAC;QACxF,MAAM,KAAK,GAAG,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC;AAE/B,QAAA,OAAO,KAAK,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,SAAS,MAAM,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,GAAGC,OAAM,CAAA,MAAA,EAAA,EAAA,GAAG,EAAE,SAAS,EAAA,EAAG,IAAI,CAAQ,GAAG,IAAI,CAAC,CAAC;AACvG,KAAC;AAED,IAAA,QACCA,OAAA,CAAA,IAAA,EAAA,EACC,EAAE,EAAE,CAAU,OAAA,EAAAD,OAAK,EAAE,EACrB,GAAG,EAAE,CAAI,CAAA,EAAAA,OAAK,EAAE,EAChB,GAAG,EAAE,GAAG,EACI,YAAA,EAAAA,OAAK,EACjB,QAAQ,EAAE,EAAE,EACZ,IAAI,EAAC,QAAQ,mBACE,QAAQ,GAAG,MAAM,GAAG,SAAS,EAC5C,OAAO,EAAE,OAAO,EAChB,WAAW,EAAE,WAAW,EACxB,OAAO,EAAE,OAAO,EAChB,KAAK,EAAC,+BAA+B,EACrC,SAAS,EAAE,SAAS,EAAA,EAEnB,mBAAmB,CAAC,MAAM,CAAC,MAAM,CAAC,EAAE,UAAU,IAAI,EAAE,CAAC,CAClD;AAEP;;AChCA,MAAM,+BAA+B,GAA2C,CAAC,EAAE,wBAAwB,EAAE,SAAS,EAAE,KAAK,EAAE,EAAE,QAAQ,KAAI;AAC5I,IAAA,QACCC,OAAA,CAAA,IAAA,EAAA,EACC,IAAI,EAAC,SAAS,EACd,KAAK,EAAE,KAAK,EACZ,KAAK,EAAEC,SAAI,CAAC,sCAAsC,EAAE;AACnD,YAAA,qDAAqD,EAAE,wBAAwB;SAC/E,CAAC,EACF,SAAS,EAAE,SAAS,IAEnB,QAAQ,CACL;AAEP;;AChBA,MAAM,iBAAiB,GAAGC,cAAS,CAAC,cAAc,CAAC;AAI7C,MAAA,yBAAyB,GAAqC,CAAC,EAAE,OAAO,EAAE,QAAQ,EAAE,KAAI;AAC7F,IAAA,QACCF,OAAQ,CAAA,QAAA,EAAA,EAAA,QAAQ,EAAC,IAAI,EAAC,KAAK,EAAC,+BAA+B,EAAC,OAAO,EAAE,OAAO,EAAE,QAAQ,EAAE,QAAQ,EAAA,EAC/FA,OAAA,CAACG,yBAAU,EAAA,EAAC,MAAM,EAAC,+BAA+B,EAAC,MAAM,EAAE,iBAAiB,EAAA,CAAI,CACxE;AAEX;;;;;;"}

package/dist/cjs/FormFieldStateWrapper-Ce-97mQS.js DELETED Viewed

@@ -1,4 +0,0 @@
-/*!
- * KoliBri - The accessible HTML-Standard
- */
-"use strict";var common=require("./common-Cd2qH809.js"),accessAndShortKey=require("./access-and-short-key-BExF929g.js"),disabled=require("./disabled-DT-7CUov.js"),hideLabel=require("./hide-label-DdGk9NfD.js"),label=require("./label-Nicf9N_T.js"),tooltipAlign=require("./tooltip-align-WJPFINTL.js"),events=require("./events-DDhO-Ns8.js"),associated_controller=require("./associated.controller-Dpp0zVIP.js"),isObject=require("./isObject-DMA85Fq4.js"),tslib_es6=require("./tslib.es6-7DbU_BSw.js"),index=require("./index-CHPNB6lV.js"),clsx=require("./clsx-CkZlkaek.js"),reuse=require("./reuse-Cs36Ddzu.js"),i18n=require("./i18n-NiDr3RbD.js"),InternalUnderlinedBadgeText=require("./InternalUnderlinedBadgeText-6awxvjQh.js"),Alert=require("./Alert-DgT5oYb1.js"),componentNames=require("./component-names-D7MwtuB7.js");const validateAdjustHeight=(e,t)=>{common.watchBoolean(e,"_adjustHeight",t)},validateHideMsg=(e,t,n)=>{common.watchBoolean(e,"_hideMsg",t,n)},validateHint=(e,t)=>{common.watchString(e,"_hint",t)},validateMsg=(e,t)=>{common.objectObjectHandler(t,()=>{try{t=common.parseJson(t)}catch(e){}common.watchValidator(e,"_msg",e=>{if(void 0===e)return!0;if("string"==typeof e&&e.length>0)return!0;if(common.isObject(e)&&null!==e){const t=e._description;return common.isString(t,1)}return!1},new Set(["MsgPropType","string"]),t)})};function checkHasMsg(e,t){var n;if(!e)return!1;const i="string"==typeof e?"error":null!==(n=e._type)&&void 0!==n?n:"error";return!0===t||"error"!==i}function normalizeMsg(e){if("string"==typeof e)try{return common.parseJson(e)}catch(t){return{_description:e,_type:"error"}}return e&&"object"==typeof e&&!("_type"in e)?Object.assign(Object.assign({},e),{_type:"error"}):e}const validateTouched=(e,t)=>{common.watchBoolean(e,"_touched",t)},KolFormFieldCharacterLimitHintFc=({id:e,maxLength:t})=>index.h("span",{id:`${e}-character-limit-hint`,class:"visually-hidden"},i18n.translate("kol-character-limit-hint",{placeholders:{limit:String(t)}})),KolFormFieldCounterFc=({currentLength:e,currentLengthDebounced:t,maxLength:n,maxLengthBehavior:i})=>{let o,r;const s=["kol-form-field__counter"];if("hard"===i)o="number"==typeof n?i18n.translate("kol-character-counter-current-of-max",{placeholders:{current:String(e),max:String(n)}}):i18n.translate("kol-character-counter-current",{placeholders:{current:String(e)}}),r="number"==typeof n?i18n.translate("kol-character-counter-current-of-max-aria",{placeholders:{current:String(t),max:String(n)}}):i18n.translate("kol-character-counter-current",{placeholders:{current:String(t)}});else{if("number"!=typeof n)return null;{const i=n-e,a=i<0,l=n-t,c=l<0;o=a?i18n.translate("kol-character-limit-exceeded",{placeholders:{over:String(Math.abs(i))}}):i18n.translate("kol-character-limit-remaining",{placeholders:{remaining:String(i)}}),r=c?i18n.translate("kol-character-limit-exceeded",{placeholders:{over:String(Math.abs(l))}}):i18n.translate("kol-character-limit-remaining",{placeholders:{remaining:String(l)}}),a&&s.push("kol-form-field__counter--exceeded")}}return index.h(index.Fragment,null,index.h("span",{class:clsx.clsx(s),"aria-hidden":"true","data-testid":"input-counter"},o),index.h("span",{"aria-live":"polite",class:"visually-hidden","data-testid":"input-counter-aria"},r))},KolFormFieldHintFc=e=>{var{id:t,class:n,hint:i,baseClassName:o="kol-form-field"}=e,r=tslib_es6.__rest(e,["id","class","hint","baseClassName"]);return i?index.h("span",Object.assign({class:clsx.clsx(`${o}__hint`,n),id:`${t}-hint`},r),i):null};var symbolTag="[object Symbol]";function isSymbol(e){return"symbol"==typeof e||isObject.isObjectLike(e)&&isObject.baseGetTag(e)==symbolTag}var reWhitespace=/\s/;function trimmedEndIndex(e){for(var t=e.length;t--&&reWhitespace.test(e.charAt(t)););return t}var reTrimStart=/^\s+/;function baseTrim(e){return e?e.slice(0,trimmedEndIndex(e)+1).replace(reTrimStart,""):e}var NAN=NaN,reIsBadHex=/^[-+]0x[0-9a-f]+$/i,reIsBinary=/^0b[01]+$/i,reIsOctal=/^0o[0-7]+$/i,freeParseInt=parseInt;function toNumber(e){if("number"==typeof e)return e;if(isSymbol(e))return NAN;if(isObject.isObject(e)){var t="function"==typeof e.valueOf?e.valueOf():e;e=isObject.isObject(t)?t+"":t}if("string"!=typeof e)return 0===e?e:+e;e=baseTrim(e);var n=reIsBinary.test(e);return n||reIsOctal.test(e)?freeParseInt(e.slice(2),n?2:8):reIsBadHex.test(e)?NAN:+e}var now=function(){return isObject.root.Date.now()},FUNC_ERROR_TEXT="Expected a function",nativeMax=Math.max,nativeMin=Math.min;function debounce(e,t,n){var i,o,r,s,a,l,c=0,d=!1,h=!1,u=!0;if("function"!=typeof e)throw new TypeError(FUNC_ERROR_TEXT);function m(t){var n=i,r=o;return i=o=void 0,c=t,s=e.apply(r,n)}function p(e){var n=e-l;return void 0===l||n>=t||n<0||h&&e-c>=r}function g(){var e=now();if(p(e))return b(e);a=setTimeout(g,function(e){var n=t-(e-l);return h?nativeMin(n,r-(e-c)):n}(e))}function b(e){return a=void 0,u&&i?m(e):(i=o=void 0,s)}function v(){var e=now(),n=p(e);if(i=arguments,o=this,l=e,n){if(void 0===a)return function(e){return c=e,a=setTimeout(g,t),d?m(e):s}(l);if(h)return clearTimeout(a),a=setTimeout(g,t),m(l)}return void 0===a&&(a=setTimeout(g,t)),s}return t=toNumber(t)||0,isObject.isObject(n)&&(d=!!n.leading,r=(h="maxWait"in n)?nativeMax(toNumber(n.maxWait)||0,t):r,u="trailing"in n?!!n.trailing:u),v.cancel=function(){void 0!==a&&clearTimeout(a),c=0,i=l=o=a=void 0},v.flush=function(){return void 0===a?s:b(now())},v}const LabelFc=({hasExpertSlot:e,accessKey:t,shortKey:n,label:i,showBadge:o=!0})=>{if(e)return index.h("slot",{name:"expert"});if(!i)return null;const r=InternalUnderlinedBadgeText.isString(t)||InternalUnderlinedBadgeText.isString(n);if(!o||!r)return index.h("span",null,i);const s=reuse.buildBadgeTextString(t,n);return index.h(index.Fragment,null,index.h(InternalUnderlinedBadgeText.KolInternalUnderlinedBadgeTextFc,{badgeText:s,label:i})," ",index.h("kbd",{class:"badge-text-hint","aria-hidden":"true"},s))},KolFormFieldLabelFc=e=>{var{component:t="label",id:n,baseClassName:i="kol-form-field",class:o,accessKey:r,shortKey:s,label:a,hideLabel:l,hasExpertSlot:c,showBadge:d}=e,h=tslib_es6.__rest(e,["component","id","baseClassName","class","accessKey","shortKey","label","hideLabel","hasExpertSlot","showBadge"]);const u=!c&&l;return index.h(t,Object.assign({},h,{class:clsx.clsx(`${i}__label`,o),id:u?void 0:`${n}-label`,hidden:u,htmlFor:n}),index.h("span",{class:clsx.clsx(`${i}__label-text`)},index.h(LabelFc,{hasExpertSlot:c,accessKey:r,shortKey:s,label:a,showBadge:d})))},FormFieldMsgFc=e=>{var t,n,{alert:i,msg:o,id:r,class:s}=e,a=tslib_es6.__rest(e,["alert","msg","id","class"]);const l=normalizeMsg(o);return index.h(Alert.KolAlertFc,Object.assign({id:`${r}-msg`,alert:null!==(t=null==l?void 0:l._alert)&&void 0!==t?t:i,hasCloser:!1,level:0,type:null!==(n=null==l?void 0:l._type)&&void 0!==n?n:"error",variant:"msg",class:clsx.clsx("kol-form-field__msg",s)},a),(null==l?void 0:l._description)||void 0)},FormFieldTooltipFc=({id:e,align:t,badgeText:n,label:i,class:o})=>index.h(componentNames.KolTooltipWcTag,{"aria-hidden":"true",class:clsx.clsx("kol-form-field__tooltip",o),_badgeText:n,_align:t,_id:`${e}-label`,_label:i});function getModifierClassNameByMsgType(e){return(null==e?void 0:e.type)&&{default:"msg-type-default",info:"msg-type-info",success:"msg-type-success",warning:"msg-type-warning",error:"msg-type-error"}[null==e?void 0:e.type]||""}const InputContainer=(e,t)=>{var{class:n}=e,i=tslib_es6.__rest(e,["class"]);return index.h("div",Object.assign({class:clsx.clsx("kol-form-field__input",n)},i),t)},KolFormFieldFc=(e,t)=>{var n;const{component:i="div",renderNoLabel:o,renderNoTooltip:r,renderNoHint:s,anotherChildren:a,id:l,required:c,alert:d,disabled:h,class:u,msg:m,hideMsg:p,hideLabel:g,label:b,hint:v,accessKey:f,shortKey:_,tooltipAlign:y,counter:x,readOnly:F,touched:L,maxLength:K,formFieldLabelProps:j,formFieldHintProps:S,formFieldTooltipProps:T,formFieldMsgProps:C,formFieldInputProps:B}=e,O=tslib_es6.__rest(e,["component","renderNoLabel","renderNoTooltip","renderNoHint","anotherChildren","id","required","alert","disabled","class","msg","hideMsg","hideLabel","label","hint","accessKey","shortKey","tooltipAlign","counter","readOnly","touched","maxLength","formFieldLabelProps","formFieldHintProps","formFieldTooltipProps","formFieldMsgProps","formFieldInputProps"]),k=!o,M=!s,H=!r,I=reuse.showExpertSlot(b),A=checkHasMsg(m,L),N=reuse.buildBadgeTextString(f,_),E=H&&!I&&g,D="string"==typeof m?"error":null!==(n=null==m?void 0:m._type)&&void 0!==n?n:"error";let q={"kol-form-field--disabled":Boolean(h),"kol-form-field--required":Boolean(c),"kol-form-field--touched":Boolean(L),"kol-form-field--hide-label":Boolean(g),"kol-form-field--read-only":Boolean(F),"kol-form-field--hidden-msg":Boolean(p)};return A&&(q=Object.assign(Object.assign({},q),{[`kol-form-field--${D||"error"}`]:!0,[`kol-form-field--${getModifierClassNameByMsgType({type:D})}`]:!0})),index.h(i,Object.assign({class:clsx.clsx("kol-form-field",q,u)},O),k&&index.h(KolFormFieldLabelFc,Object.assign({},j||{},{id:l,hasExpertSlot:I,hideLabel:g,label:b,accessKey:f,shortKey:_})),index.h(InputContainer,Object.assign({},B),t,E&&!0===g&&index.h(FormFieldTooltipFc,Object.assign({},T||{},{id:l,label:b,align:y,badgeText:N}))),x?index.h(KolFormFieldCounterFc,Object.assign({},x)):null,K?index.h(KolFormFieldCharacterLimitHintFc,{id:l,maxLength:K}):null,A&&!p&&index.h(FormFieldMsgFc,Object.assign({},C||{},{id:l,alert:d,msg:m})),M&&index.h(KolFormFieldHintFc,Object.assign({},S||{},{id:l,hint:v})),a)};function getDefaultProps({ariaDescribedBy:e,hideLabel:t,label:n}){return{title:"",autoCapitalize:"off",autoCorrect:"off","aria-describedby":(null==e?void 0:e.length)?e.join(" "):void 0,"aria-label":t&&n?n:void 0}}class ControlledInputController extends associated_controller.AssociatedInputController{constructor(e,t,n){super(e,t,n),this.component=e}validateTouched(e){validateTouched(this.component,e)}componentWillLoad(){super.componentWillLoad(),this.validateTouched(this.component._touched)}}class InputController extends ControlledInputController{constructor(e,t,n){super(e,t,n),this.valueChangeListeners=[],this.onFacade={onBlur:this.onBlur.bind(this),onChange:this.onChange.bind(this),onClick:this.onClick.bind(this),onFocus:this.onFocus.bind(this),onInput:this.onInput.bind(this)},this.updateCurrentLengthDebounced=debounce(e=>{common.setState(this.component,"_currentLengthDebounced",e)},500),this.component=e}validateAccessKey(e){accessAndShortKey.validateAccessKey(this.component,e),accessAndShortKey.validateAccessAndShortKey(e,this.component._shortKey)}validateAdjustHeight(e){validateAdjustHeight(this.component,e)}validateDisabled(e){disabled.validateDisabled(this.component,e)}validateTooltipAlign(e){tooltipAlign.validateTooltipAlign(this.component,e)}validateHideMsg(e){validateHideMsg(this.component,e,{hooks:{afterPatch:()=>{this.component.state._hideMsg&&common.a11yHint("Property _hideMsg for inputs: Only use when the error message is shown outside of the input component.")}}})}validateHideLabel(e){hideLabel.validateHideLabel(this.component,e,{hooks:{afterPatch:()=>{this.component.state._hideLabel&&common.a11yHint("Property hide-label for inputs: Only use for exceptions like search inputs that are clearly identifiable by their context.")}}})}validateHint(e){validateHint(this.component,e)}validateId(e){common.watchString(this.component,"_id",e,{minLength:1}),""!==e&&void 0!==e||common.devHint("A unique ID on the input fields is not strictly required, but it might be relevant for E2E tests.")}validateLabel(e){label.validateLabelWithExpertSlot(this.component,e,{required:!0})}validateMsg(e){validateMsg(this.component,e)}validateOn(e){"object"==typeof e&&common.setState(this.component,"_on",e)}validateShortKey(e){accessAndShortKey.validateShortKey(this.component,e),accessAndShortKey.validateAccessAndShortKey(this.component._accessKey,e)}validateSmartButton(e){common.objectObjectHandler(e,()=>{try{e=common.parseJson(e)}catch(e){}common.setState(this.component,"_smartButton",e)})}validateTabIndex(e){accessAndShortKey.validateTabIndex(this.component,e)}componentWillLoad(){super.componentWillLoad(),this.validateAccessKey(this.component._accessKey),this.validateAdjustHeight(this.component._adjustHeight),this.validateMsg(this.component._msg),this.validateDisabled(this.component._disabled),this.validateHideMsg(this.component._hideMsg),this.validateHideLabel(this.component._hideLabel),this.validateHint(this.component._hint),this.validateId(this.component._id),this.validateLabel(this.component._label),this.validateShortKey(this.component._shortKey),this.validateSmartButton(this.component._smartButton),this.validateOn(this.component._on),this.validateTabIndex(this.component._tabIndex),accessAndShortKey.validateAccessAndShortKey(this.component._accessKey,this.component._shortKey)}emitEvent(e,t){this.host&&events.dispatchDomEvent(this.host,e,t)}onBlur(e){var t;this.component._touched=!0,this.emitEvent(events.KolEvent.blur),"function"==typeof(null===(t=this.component._on)||void 0===t?void 0:t.onBlur)&&this.component._on.onBlur(e)}onChange(e,t){var n;void 0===t&&(t=e.target.value),this.emitEvent(events.KolEvent.change,t),"function"==typeof(null===(n=this.component._on)||void 0===n?void 0:n.onChange)&&this.component._on.onChange(e,t),this.valueChangeListeners.forEach(e=>e(t))}onInput(e,t=!0,n){var i;void 0===n&&(n=e.target.value),this.emitEvent(events.KolEvent.input,n),t&&this.setFormAssociatedValue(n),"function"==typeof(null===(i=this.component._on)||void 0===i?void 0:i.onInput)&&this.component._on.onInput(e,n)}onClick(e){var t;this.emitEvent(events.KolEvent.click),"function"==typeof(null===(t=this.component._on)||void 0===t?void 0:t.onClick)&&this.component._on.onClick(e)}onFocus(e){var t;this.emitEvent(events.KolEvent.focus),"function"==typeof(null===(t=this.component._on)||void 0===t?void 0:t.onFocus)&&this.component._on.onFocus(e)}addValueChangeListener(e){this.valueChangeListeners.push(e)}hasSoftCharacterLimit(){return"number"==typeof this.component.state._maxLength&&"soft"===this.component.state._maxLengthBehavior}hasCounter(){return!0===this.component.state._hasCounter}}const getRenderStates=e=>{var t;const n=e._msg,i="string"==typeof n?n:null==n?void 0:n._description,o="string"==typeof n?"error":null!==(t=null==n?void 0:n._type)&&void 0!==t?t:"error",r=Boolean(i&&i.length>0),s="error"===o&&r&&!0===e._touched,a="string"==typeof e._hint&&e._hint.length>0,l=[];return r&&!e._hideMsg&&l.push(`${e._id}-msg`),a&&l.push(`${e._id}-hint`),{hasError:s,hasHint:a,ariaDescribedBy:l}};function getFormFieldProps(e){const t={id:e._id,disabled:e._disabled,msg:e._msg,hint:e._hint,label:e._label,hideLabel:e._hideLabel,hideMsg:e._hideMsg,touched:e._touched};return"_required"in e&&(t.required=e._required),"_readOnly"in e&&(t.readOnly=e._readOnly),"_accessKey"in e&&(t.accessKey=e._accessKey),"_shortKey"in e&&(t.shortKey=e._shortKey),"_maxLength"in e&&(t.maxLength=e._maxLength),"_currentLength"in e&&"number"==typeof e._currentLength&&"_currentLengthDebounced"in e&&"number"==typeof e._currentLengthDebounced&&"_hasCounter"in e&&!0===e._hasCounter&&(t.counter={currentLength:e._currentLength,currentLengthDebounced:e._currentLengthDebounced,maxLength:e._maxLength,maxLengthBehavior:e._maxLengthBehavior||"hard"}),t}const FormFieldStateWrapper=(e,t)=>{var{state:n}=e,i=tslib_es6.__rest(e,["state"]);return index.h(KolFormFieldFc,Object.assign({},getFormFieldProps(n),i),t)};exports.FormFieldStateWrapper=FormFieldStateWrapper,exports.FormFieldTooltipFc=FormFieldTooltipFc,exports.InputController=InputController,exports.KolFormFieldHintFc=KolFormFieldHintFc,exports.KolFormFieldLabelFc=KolFormFieldLabelFc,exports.checkHasMsg=checkHasMsg,exports.getDefaultProps=getDefaultProps,exports.getRenderStates=getRenderStates;