@adyen/adyen-platform-experience-web 1.10.0 → 1.10.2

package/dist/es/components/internal/FormFields/Select/components/SelectButton.js

@@ -1,111 +1,109 @@
-import { jsx as i } from "../../../../../external/preact/jsx-runtime/dist/jsxRuntime.module.js";
-import L from "classnames";
-import { useMemo as N } from "../../../../../external/preact/hooks/dist/hooks.module.js";
-import B from "../../../../../core/Context/useCoreContext.js";
-import { ButtonVariant as R } from "../../../Button/types.js";
-import h from "../../../Typography/Typography.js";
-import { TypographyVariant as A, TypographyElement as E } from "../../../Typography/types.js";
-import { DROPDOWN_BUTTON_ICON_CLASS as I, DROPDOWN_BUTTON_TEXT_CLASS as P, DROPDOWN_BUTTON_MULTI_SELECT_COUNTER_CLASS as g, DROPDOWN_BUTTON_COLLAPSE_INDICATOR_CLASS as U, DROPDOWN_BUTTON_CLEAR_CLASS as x, DROPDOWN_BUTTON_CLASS as W, DROPDOWN_BUTTON_VALID_CLASS as v, DROPDOWN_BUTTON_INVALID_CLASS as w, DROPDOWN_BUTTON_READONLY_CLASS as V, DROPDOWN_BUTTON_HAS_SELECTION_CLASS as K, DROPDOWN_BUTTON_ACTIVE_CLASS as F, DROPDOWN_BUTTON_CLASSNAME as k } from "../constants.js";
-import { InteractionKeyCode as b } from "../../../../types.js";
-import { Fragment as M } from "../../../../../external/preact/dist/preact.module.js";
-import Y from "../../../Img/Img.js";
-import { Icon as u } from "../../../Icon/Icon.js";
-import j from "../../../Button/Button.js";
-import { boolOrFalse as f } from "../../../../../utils/value/bool.js";
-const H = ({
-  active: a,
-  disabled: T,
-  className: t,
-  filterable: r,
-  toggleButtonRef: n,
-  buttonVariant: c,
-  ...l
+import { jsx as t } from "../../../../../external/.pnpm/preact@10.28.2/node_modules/preact/jsx-runtime/dist/jsxRuntime.module.js";
+import f from "classnames";
+import { useMemo as c } from "../../../../../external/.pnpm/preact@10.28.2/node_modules/preact/hooks/dist/hooks.module.js";
+import L from "../../../../../core/Context/useCoreContext.js";
+import { ButtonVariant as I } from "../../../Button/types.js";
+import y from "../../../Typography/Typography.js";
+import { TypographyVariant as B, TypographyElement as h } from "../../../Typography/types.js";
+import { DEFAULT_BUTTON_CLASSNAME as _ } from "../../../Button/constants.js";
+import { DROPDOWN_BUTTON_ICON_CLASS as R, DROPDOWN_BUTTON_TEXT_CLASS as v, DROPDOWN_BUTTON_MULTI_SELECT_COUNTER_CLASS as E, DROPDOWN_BUTTON_COLLAPSE_INDICATOR_CLASS as g, DROPDOWN_BUTTON_CLEAR_CLASS as U, DROPDOWN_BUTTON_CLASS as P, DROPDOWN_BUTTON_VALID_CLASS as x, DROPDOWN_BUTTON_INVALID_CLASS as W, DROPDOWN_BUTTON_READONLY_CLASS as w, DROPDOWN_BUTTON_HAS_SELECTION_CLASS as V, DROPDOWN_BUTTON_ACTIVE_CLASS as F } from "../constants.js";
+import { InteractionKeyCode as C } from "../../../../types.js";
+import { Fragment as K } from "../../../../../external/.pnpm/preact@10.28.2/node_modules/preact/dist/preact.module.js";
+import M from "../../../Img/Img.js";
+import { Icon as D } from "../../../Icon/Icon.js";
+import k from "../../../Button/Button.js";
+import { boolOrFalse as S } from "../../../../../utils/value/bool.js";
+import { getModifierClasses as Y } from "../../../../../utils/preact/className.js";
+const j = ({
+  active: e,
+  disabled: N,
+  className: a,
+  filterable: m,
+  toggleButtonRef: l,
+  buttonVariant: s,
+  ...o
 }) => {
-  const o = N(() => r ? L(k, t) : t, [t, r]);
-  return r ? /* @__PURE__ */ i("div", { ...l, className: o, ref: n }) : /* @__PURE__ */ i(
-    j,
+  const d = s ?? I.SECONDARY, i = c(() => Y(_, [d], [_]), [d]), n = c(() => m ? f(i, a) : a, [i, a, m]);
+  return m ? /* @__PURE__ */ t("div", { ...o, className: n, ref: l }) : /* @__PURE__ */ t(
+    k,
     {
-      ...l,
-      className: o,
-      disabled: T,
-      variant: c ?? R.SECONDARY,
-      ref: n,
-      "aria-label": l["aria-label"],
-      "aria-labelledby": l["aria-labelledby"]
+      ...o,
+      className: n,
+      disabled: N,
+      variant: d,
+      ref: l,
+      "aria-label": o["aria-label"],
+      "aria-labelledby": o["aria-labelledby"]
     }
   );
-}, na = (a) => {
-  var S, C;
-  const { i18n: T } = B(), { active: t, clearable: r, filterable: n, multiSelect: c, placeholder: l, onClear: o, readonly: O, showList: d, withoutCollapseIndicator: y } = a, s = N(() => (l == null ? void 0 : l.trim()) || T.get("common.inputs.select.placeholder"), [T, l]), e = N(() => f(c) ? void 0 : t[0], [t, c]), _ = N(() => {
-    var m;
-    return ((m = e == null ? void 0 : e.name) == null ? void 0 : m.trim()) || s;
-  }, [e, s]), D = N(() => f(r) && !!t.length, [t, r]);
-  return /* @__PURE__ */ i(
-    H,
+}, oe = (e) => {
+  const { i18n: N } = L(), { active: a, clearable: m, filterable: l, multiSelect: s, placeholder: o, onClear: d, readonly: i, showList: n, withoutCollapseIndicator: A } = e, O = c(() => o?.trim() || N.get("common.inputs.select.placeholder"), [N, o]), r = c(() => S(s) ? void 0 : a[0], [a, s]), b = c(() => r?.name?.trim() || O, [r, O]), u = c(() => S(m) && !!a.length && !i, [a, m, i]);
+  return /* @__PURE__ */ t(
+    j,
     {
-      buttonVariant: a.buttonVariant,
-      active: t,
-      disabled: O,
-      "aria-disabled": O,
-      "aria-expanded": d,
+      buttonVariant: e.buttonVariant,
+      active: a,
+      disabled: i,
+      "aria-disabled": i,
+      "aria-expanded": n,
       "aria-haspopup": "dialog",
-      "aria-invalid": a.isInvalid,
-      className: L(W, {
-        [F]: d,
-        [K]: !!t.length,
-        [V]: O,
-        [w]: a.isInvalid,
-        [v]: a.isValid
+      "aria-invalid": e.isInvalid,
+      className: f(P, {
+        [F]: n,
+        [V]: !!a.length,
+        [w]: i,
+        [W]: e.isInvalid,
+        [x]: e.isValid
       }),
-      filterable: n,
-      name: a.name,
-      onClick: O ? void 0 : a.toggleList,
-      onKeyDown: O ? void 0 : a.onButtonKeyDown,
-      role: !n || d ? "button" : void 0,
+      filterable: l,
+      name: e.name,
+      onClick: i ? void 0 : e.toggleList,
+      onKeyDown: i ? void 0 : e.onButtonKeyDown,
+      role: !l || n ? "button" : void 0,
       tabIndex: 0,
-      title: _,
-      toggleButtonRef: a.toggleButtonRef,
-      type: n ? void 0 : "button",
-      "aria-describedby": a.ariaDescribedBy,
-      id: a.id,
-      ...d && n ? {} : { "aria-label": a["aria-label"], "aria-labelledby": a["aria-labelledby"] },
+      title: b,
+      toggleButtonRef: e.toggleButtonRef,
+      type: l ? void 0 : "button",
+      "aria-describedby": e.ariaDescribedBy,
+      id: e.id,
+      ...n && l ? {} : { "aria-label": e["aria-label"], "aria-labelledby": e["aria-labelledby"] },
       children: [
-        a.renderButtonContent ? a.renderButtonContent({ item: e }) : d && n ? /* @__PURE__ */ i(
+        e.renderButtonContent ? e.renderButtonContent({ item: r }) : n && l ? /* @__PURE__ */ t(
           "input",
           {
             "aria-autocomplete": "list",
-            "aria-label": a["aria-label"],
-            "aria-labelledby": a["aria-labelledby"],
-            "aria-controls": a.selectListId,
-            "aria-expanded": d,
-            "aria-owns": a.selectListId,
-            "aria-invalid": a.isInvalid,
+            "aria-label": e["aria-label"],
+            "aria-labelledby": e["aria-labelledby"],
+            "aria-controls": e.selectListId,
+            "aria-expanded": n,
+            "aria-owns": e.selectListId,
+            "aria-invalid": e.isInvalid,
             autoComplete: "off",
             className: "adyen-pe-filter-input",
-            onInput: a.onInput,
-            onKeyDown: a.onFilterInputKeyDown,
-            placeholder: s,
-            ref: a.filterInputRef,
+            onInput: e.onInput,
+            onKeyDown: e.onFilterInputKeyDown,
+            placeholder: O,
+            ref: e.filterInputRef,
             role: "combobox",
             type: "text"
           }
-        ) : /* @__PURE__ */ i(M, { children: [
-          (e == null ? void 0 : e.icon) && /* @__PURE__ */ i(Y, { className: I, src: e.icon, alt: ((S = e == null ? void 0 : e.name) == null ? void 0 : S.trim()) ?? "" }),
-          /* @__PURE__ */ i("span", { className: P, children: ((C = e == null ? void 0 : e.selectedOptionName) == null ? void 0 : C.trim()) || _ }),
-          c && a.appliedFilterNumber > 0 && /* @__PURE__ */ i("div", { className: g, children: /* @__PURE__ */ i(h, { el: E.SPAN, variant: A.BODY, stronger: !0, children: a.appliedFilterNumber }) })
+        ) : /* @__PURE__ */ t(K, { children: [
+          r?.icon && /* @__PURE__ */ t(M, { className: R, src: r.icon, alt: r?.name?.trim() ?? "" }),
+          /* @__PURE__ */ t("span", { className: v, children: r?.selectedOptionName?.trim() || b }),
+          s && e.appliedFilterNumber > 0 && /* @__PURE__ */ t("div", { className: E, children: /* @__PURE__ */ t(y, { el: h.SPAN, variant: B.BODY, stronger: !0, children: e.appliedFilterNumber }) })
         ] }),
-        !y && !D && /* @__PURE__ */ i("span", { className: U, children: /* @__PURE__ */ i(u, { name: "chevron-down" }) }),
-        D && /* @__PURE__ */ i(
+        !A && !u && /* @__PURE__ */ t("span", { className: g, children: /* @__PURE__ */ t(D, { name: "chevron-down" }) }),
+        u && /* @__PURE__ */ t(
           "span",
           {
             role: "button",
             tabIndex: 0,
-            className: x,
-            onClick: o,
-            onKeyDown: (m) => {
-              (m.code === b.ENTER || m.code === b.SPACE) && (o == null || o(m));
+            className: U,
+            onClick: d,
+            onKeyDown: (T) => {
+              (T.code === C.ENTER || T.code === C.SPACE) && d?.(T);
             },
-            children: /* @__PURE__ */ i(u, { name: "cross-circle-fill" })
+            children: /* @__PURE__ */ t(D, { name: "cross-circle-fill" })
           }
         )
       ]
@@ -113,5 +111,5 @@ const H = ({
   );
 };
 export {
-  na as default
+  oe as default
 };

package/dist/es/components/internal/FormFields/Select/components/SelectList.js

@@ -1,13 +1,13 @@
-import { jsx as o } from "../../../../../external/preact/jsx-runtime/dist/jsxRuntime.module.js";
+import { jsx as o } from "../../../../../external/.pnpm/preact@10.28.2/node_modules/preact/jsx-runtime/dist/jsxRuntime.module.js";
 import { useResponsiveContainer as h, containerQueries as W } from "../../../../../hooks/useResponsiveContainer.js";
-import w from "../../../Popover/PopoverContainer.js";
-import { PopoverContainerPosition as V, PopoverContainerVariant as y, PopoverContainerSize as z } from "../../../Popover/types.js";
-import F from "../../../../../core/Context/useCoreContext.js";
+import { PopoverContainerPosition as w, PopoverContainerVariant as V, PopoverContainerSize as y } from "../../../Popover/types.js";
+import z from "../../../../../core/Context/useCoreContext.js";
 import a from "classnames";
-import { memo as j } from "../../../../../external/preact/compat/dist/compat.module.js";
-import { useMemo as l } from "../../../../../external/preact/hooks/dist/hooks.module.js";
-import { DROPDOWN_LIST_CLASS as B, DROPDOWN_LIST_ACTIVE_CLASS as K, DROPDOWN_ELEMENT_CLASS as Q, DROPDOWN_ELEMENT_NO_OPTION_CLASS as U } from "../constants.js";
-import $, { renderListItemDefault as k } from "./SelectListItem.js";
+import { memo as F } from "../../../../../external/.pnpm/preact@10.28.2/node_modules/preact/compat/dist/compat.module.js";
+import { useMemo as l } from "../../../../../external/.pnpm/preact@10.28.2/node_modules/preact/hooks/dist/hooks.module.js";
+import { DROPDOWN_LIST_CLASS as j, DROPDOWN_LIST_ACTIVE_CLASS as B, DROPDOWN_ELEMENT_CLASS as K, DROPDOWN_ELEMENT_NO_OPTION_CLASS as Q } from "../constants.js";
+import U, { renderListItemDefault as $ } from "./SelectListItem.js";
+import k from "../../../Popover/Popover.js";
 import { fixedForwardRef as q } from "../../../../../utils/preact/fixedForwardRef.js";
 import { isFunction as G } from "../../../../../utils/value/is.js";
 import { boolOrFalse as H } from "../../../../../utils/value/bool.js";
@@ -17,13 +17,13 @@ const J = q(
     commitActions: p,
     items: d,
     disableFocusTrap: f,
-    multiSelect: n,
+    multiSelect: s,
     onKeyDown: O,
     onSelect: u,
     renderListItem: i,
     selectListId: S,
     showList: t,
-    textFilter: s,
+    textFilter: n,
     toggleButtonRef: C,
     dismissPopover: P,
     setToTargetWidth: N,
@@ -34,9 +34,9 @@ const J = q(
     activeIndex: L,
     filterable: T
   }, M) => {
-    const { i18n: x } = F(), I = h(W.down.xs), m = d.filter((e) => !s || e.name.toLowerCase().includes(s)), R = a(B, { [K]: t }), A = a(Q, U), b = l(() => G(i) ? i : k, [i]), r = l(() => H(n), [n]);
+    const { i18n: x } = z(), I = h(W.down.xs), m = d.filter((e) => !n || e.name.toLowerCase().includes(n)), R = a(j, { [B]: t }), A = a(K, Q), b = l(() => G(i) ? i : $, [i]), r = l(() => H(s), [s]);
     return t ? /* @__PURE__ */ o(
-      w,
+      k,
       {
         classNameModifiers: v,
         actions: r ? p : void 0,
@@ -46,16 +46,16 @@ const J = q(
         dismissible: !1,
         open: t,
         setToTargetWidth: N,
-        containerSize: z.MEDIUM,
-        variant: y.POPOVER,
+        containerSize: y.MEDIUM,
+        variant: V.POPOVER,
         targetElement: C,
         withContentPadding: !1,
-        position: V.BOTTOM,
+        position: w.BOTTOM,
         showOverlay: _ && I,
         fitPosition: D,
         fixedPositioning: E,
         children: /* @__PURE__ */ o("ul", { className: R, id: S, ref: M, role: "listbox", "aria-multiselectable": r, children: m.length ? m.map((e, g) => /* @__PURE__ */ o(
-          $,
+          U,
           {
             item: e,
             multiSelect: r,
@@ -70,7 +70,7 @@ const J = q(
       }
     ) : null;
   }
-), ce = j(J);
+), ce = F(J);
 export {
   ce as default
 };

package/dist/es/components/internal/FormFields/Select/components/SelectListItem.js

@@ -1,11 +1,11 @@
-import { jsx as s } from "../../../../../external/preact/jsx-runtime/dist/jsxRuntime.module.js";
+import { jsx as s } from "../../../../../external/.pnpm/preact@10.28.2/node_modules/preact/jsx-runtime/dist/jsxRuntime.module.js";
 import C from "classnames";
-import { memo as S } from "../../../../../external/preact/compat/dist/compat.module.js";
-import { useRef as _, useEffect as D } from "../../../../../external/preact/hooks/dist/hooks.module.js";
+import { memo as S } from "../../../../../external/.pnpm/preact@10.28.2/node_modules/preact/compat/dist/compat.module.js";
+import { useRef as _, useEffect as D } from "../../../../../external/.pnpm/preact@10.28.2/node_modules/preact/hooks/dist/hooks.module.js";
 import { DROPDOWN_ELEMENT_CHECKMARK_CLASS as O, DROPDOWN_ELEMENT_CLASS as f, DROPDOWN_ELEMENT_KEYBOARD_ACTIVE_CLASS as u, DROPDOWN_ELEMENT_DISABLED_CLASS as L, DROPDOWN_ELEMENT_ACTIVE_CLASS as d, DROPDOWN_ELEMENT_ICON_CLASS as p, DROPDOWN_ELEMENT_CONTENT_CLASS as h, DROPDOWN_ELEMENT_CHECKBOX_CLASS as A } from "../constants.js";
 import { Icon as r } from "../../../Icon/Icon.js";
 import R from "../../../Img/Img.js";
-import { Fragment as T } from "../../../../../external/preact/dist/preact.module.js";
+import { Fragment as T } from "../../../../../external/.pnpm/preact@10.28.2/node_modules/preact/dist/preact.module.js";
 import { boolOrFalse as I } from "../../../../../utils/value/bool.js";
 const M = (e) => e.multiSelect ? /* @__PURE__ */ s("span", { className: A, children: e.selected ? /* @__PURE__ */ s(r, { name: "checkmark-square-fill" }) : /* @__PURE__ */ s(r, { name: "square" }) }) : null, k = (e) => e.multiSelect ? null : /* @__PURE__ */ s("span", { className: O, children: e.selected && /* @__PURE__ */ s(r, { name: "checkmark" }) }), K = (e) => /* @__PURE__ */ s(T, { children: [
   M(e),

package/dist/es/components/internal/FormFields/Select/constants.js

@@ -1,31 +1,27 @@
-import { DEFAULT_BUTTON_CLASSNAME as N } from "../../Button/constants.js";
-import { ButtonVariant as D } from "../../Button/types.js";
-import { getModifierClasses as T } from "../../../../utils/preact/className.js";
-const S = "adyen-pe-dropdown", C = T(N, [D.SECONDARY], [N]), _ = `${S}__button`, A = `${_}--active`, c = `${_}-collapse-indicator`, n = `${_}-clear`, s = `${_}--has-selection`, R = `${_}-icon`, e = `${_}-multiselect-counter`, P = `${_}--readonly`, W = `${_}-text`, i = `${_}--valid`, $ = `${_}--invalid`, O = `${S}__element`, a = `${O}--active`, B = `${O}--keyboard-active`, I = `${O}-checkbox`, U = `${O}-checkmark`, r = `${O}-content`, l = `${O}--disabled`, M = `${O}-icon`, d = `${O}--no-option`, t = `${S}__list`, m = `${t}--active`, p = `${S}--multiselect`;
+const S = "adyen-pe-dropdown", _ = `${S}__button`, N = `${_}--active`, T = `${_}-collapse-indicator`, E = `${_}-clear`, L = `${_}--has-selection`, t = `${_}-icon`, c = `${_}-multiselect-counter`, C = `${_}--readonly`, o = `${_}-text`, n = `${_}--valid`, A = `${_}--invalid`, O = `${S}__element`, s = `${O}--active`, R = `${O}--keyboard-active`, e = `${O}-checkbox`, P = `${O}-checkmark`, W = `${O}-content`, $ = `${O}--disabled`, I = `${O}-icon`, i = `${O}--no-option`, D = `${S}__list`, a = `${D}--active`, B = `${S}--multiselect`;
 export {
   S as DROPDOWN_BASE_CLASS,
-  A as DROPDOWN_BUTTON_ACTIVE_CLASS,
+  N as DROPDOWN_BUTTON_ACTIVE_CLASS,
   _ as DROPDOWN_BUTTON_CLASS,
-  C as DROPDOWN_BUTTON_CLASSNAME,
-  n as DROPDOWN_BUTTON_CLEAR_CLASS,
-  c as DROPDOWN_BUTTON_COLLAPSE_INDICATOR_CLASS,
-  s as DROPDOWN_BUTTON_HAS_SELECTION_CLASS,
-  R as DROPDOWN_BUTTON_ICON_CLASS,
-  $ as DROPDOWN_BUTTON_INVALID_CLASS,
-  e as DROPDOWN_BUTTON_MULTI_SELECT_COUNTER_CLASS,
-  P as DROPDOWN_BUTTON_READONLY_CLASS,
-  W as DROPDOWN_BUTTON_TEXT_CLASS,
-  i as DROPDOWN_BUTTON_VALID_CLASS,
-  a as DROPDOWN_ELEMENT_ACTIVE_CLASS,
-  I as DROPDOWN_ELEMENT_CHECKBOX_CLASS,
-  U as DROPDOWN_ELEMENT_CHECKMARK_CLASS,
+  E as DROPDOWN_BUTTON_CLEAR_CLASS,
+  T as DROPDOWN_BUTTON_COLLAPSE_INDICATOR_CLASS,
+  L as DROPDOWN_BUTTON_HAS_SELECTION_CLASS,
+  t as DROPDOWN_BUTTON_ICON_CLASS,
+  A as DROPDOWN_BUTTON_INVALID_CLASS,
+  c as DROPDOWN_BUTTON_MULTI_SELECT_COUNTER_CLASS,
+  C as DROPDOWN_BUTTON_READONLY_CLASS,
+  o as DROPDOWN_BUTTON_TEXT_CLASS,
+  n as DROPDOWN_BUTTON_VALID_CLASS,
+  s as DROPDOWN_ELEMENT_ACTIVE_CLASS,
+  e as DROPDOWN_ELEMENT_CHECKBOX_CLASS,
+  P as DROPDOWN_ELEMENT_CHECKMARK_CLASS,
   O as DROPDOWN_ELEMENT_CLASS,
-  r as DROPDOWN_ELEMENT_CONTENT_CLASS,
-  l as DROPDOWN_ELEMENT_DISABLED_CLASS,
-  M as DROPDOWN_ELEMENT_ICON_CLASS,
-  B as DROPDOWN_ELEMENT_KEYBOARD_ACTIVE_CLASS,
-  d as DROPDOWN_ELEMENT_NO_OPTION_CLASS,
-  m as DROPDOWN_LIST_ACTIVE_CLASS,
-  t as DROPDOWN_LIST_CLASS,
-  p as DROPDOWN_MULTI_SELECT_CLASS
+  W as DROPDOWN_ELEMENT_CONTENT_CLASS,
+  $ as DROPDOWN_ELEMENT_DISABLED_CLASS,
+  I as DROPDOWN_ELEMENT_ICON_CLASS,
+  R as DROPDOWN_ELEMENT_KEYBOARD_ACTIVE_CLASS,
+  i as DROPDOWN_ELEMENT_NO_OPTION_CLASS,
+  a as DROPDOWN_LIST_ACTIVE_CLASS,
+  D as DROPDOWN_LIST_CLASS,
+  B as DROPDOWN_MULTI_SELECT_CLASS
 };

package/dist/es/components/internal/FormFields/Select/hooks/useSelect.js

@@ -1,4 +1,4 @@
-import { useCallback as i, useState as O, useEffect as g } from "../../../../../external/preact/hooks/dist/hooks.module.js";
+import { useCallback as i, useState as O, useEffect as g } from "../../../../../external/.pnpm/preact@10.28.2/node_modules/preact/hooks/dist/hooks.module.js";
 import { EMPTY_ARRAY as t } from "../../../../../utils/value/constants.js";
 const z = ({ items: f, multiSelect: r, selected: l }) => {
   const a = i(

package/dist/es/components/internal/FormFields/utils.js

@@ -7,14 +7,14 @@ const u = [
   t.ARROW_UP,
   t.ARROW_DOWN,
   t.TAB
-], E = ({ event: s, inputType: o, onValidInput: c }) => {
-  const i = s.currentTarget, { key: e } = s, r = /^[0-9.,-]$/.test(e), l = /[.,]/.test(i.value), a = e === "." || e === ",", n = u.includes(e);
-  if (o === "number" && !n && (!r || l && a)) {
+], R = ({ event: s, inputType: c, onValidInput: o }) => {
+  const i = s.currentTarget, { key: e } = s, n = /^[0-9.,-]$/.test(e), l = /[.,]/.test(i.value), a = e === "." || e === ",", r = u.includes(e);
+  if (c === "number" && !r && (!n || l && a)) {
     s.preventDefault();
     return;
   }
-  c == null || c(s);
+  o?.(s);
 };
 export {
-  E as filterDisallowedCharacters
+  R as filterDisallowedCharacters
 };

package/dist/es/components/internal/FormWrappers/FormCalendarInput.js

@@ -1,42 +1,37 @@
-import { jsx as r } from "../../../external/preact/jsx-runtime/dist/jsxRuntime.module.js";
-import { useMemo as l } from "../../../external/preact/hooks/dist/hooks.module.js";
+import { jsx as o } from "../../../external/.pnpm/preact@10.28.2/node_modules/preact/jsx-runtime/dist/jsxRuntime.module.js";
+import { useMemo as m } from "../../../external/.pnpm/preact@10.28.2/node_modules/preact/hooks/dist/hooks.module.js";
 import { useWizardFormContext as d } from "../../../hooks/form/wizard/WizardFormContext.js";
 import c from "./FormField.js";
 import { CalendarInput as F } from "../FormFields/CalendarInput/CalendarInput.js";
-import { VisibleField as f } from "./VisibleField.js";
-import { FieldError as g } from "../FormFields/FieldError/FieldError.js";
-import { Controller as h } from "../../../hooks/form/Controller.js";
-function j({ clearable: u, fieldName: n, label: p }) {
-  const { control: a, fieldsConfig: i } = d(), m = l(() => {
-    var o;
-    return (o = i[n]) == null ? void 0 : o.required;
-  }, [i]);
-  return /* @__PURE__ */ r(f, { name: n, children: /* @__PURE__ */ r(c, { label: p, optional: !m, children: /* @__PURE__ */ r(
-    h,
+import { VisibleField as g } from "./VisibleField.js";
+import { FieldError as h } from "../FormFields/FieldError/FieldError.js";
+import { Controller as C } from "../../../hooks/form/Controller.js";
+function O({ clearable: u, fieldName: r, label: p, isReadOnly: i }) {
+  const { control: a, fieldsConfig: n } = d(), s = m(() => n[r]?.required, [n, r]), l = m(() => i ?? n[r]?.readOnly, [n, r, i]);
+  return /* @__PURE__ */ o(g, { name: r, children: /* @__PURE__ */ o(c, { label: p, optional: !s, children: /* @__PURE__ */ o(
+    C,
     {
-      name: n,
+      name: r,
       control: a,
       rules: {
-        required: m
+        required: s
       },
-      render: ({ field: o, fieldState: e }) => {
-        var s, t;
-        return /* @__PURE__ */ r("div", { children: [
-          /* @__PURE__ */ r(
-            F,
-            {
-              value: o.value,
-              onInput: o.onInput,
-              isInvalid: !!e.error && e.isTouched,
-              clearable: u
-            }
-          ),
-          ((s = e.error) == null ? void 0 : s.message) && /* @__PURE__ */ r(g, { errorMessage: (t = e.error) == null ? void 0 : t.message, withTopMargin: !0 })
-        ] });
-      }
+      render: ({ field: t, fieldState: e }) => /* @__PURE__ */ o("div", { children: [
+        /* @__PURE__ */ o(
+          F,
+          {
+            value: t.value,
+            onInput: t.onInput,
+            isInvalid: !!e.error && e.isTouched,
+            clearable: u,
+            isReadOnly: l
+          }
+        ),
+        e.error?.message && /* @__PURE__ */ o(h, { errorMessage: e.error?.message, withTopMargin: !0 })
+      ] })
     }
   ) }) });
 }
 export {
-  j as FormCalendarInput
+  O as FormCalendarInput
 };

package/dist/es/components/internal/FormWrappers/FormField.js

@@ -1,4 +1,4 @@
-import { jsx as e } from "../../../external/preact/jsx-runtime/dist/jsxRuntime.module.js";
+import { jsx as e } from "../../../external/.pnpm/preact@10.28.2/node_modules/preact/jsx-runtime/dist/jsxRuntime.module.js";
 import c from "../../../core/Context/useCoreContext.js";
 import a from "../Typography/Typography.js";
 import { TypographyVariant as n, TypographyElement as r } from "../Typography/types.js";

package/dist/es/components/internal/FormWrappers/FormSelect.js

@@ -1,73 +1,70 @@
-import { jsx as s } from "../../../external/preact/jsx-runtime/dist/jsxRuntime.module.js";
-import { useMemo as j, useEffect as h } from "../../../external/preact/hooks/dist/hooks.module.js";
-import { useWizardFormContext as w } from "../../../hooks/form/wizard/WizardFormContext.js";
-import y from "./FormField.js";
-import { VisibleField as z } from "./VisibleField.js";
-import { FieldError as C } from "../FormFields/FieldError/FieldError.js";
-import { Controller as R } from "../../../hooks/form/Controller.js";
-import W from "../FormFields/Select/Select.js";
-function L({
-  className: v,
-  clearable: F,
-  fieldName: o,
-  filterable: V,
-  hideOptionalLabel: f,
+import { jsx as s } from "../../../external/.pnpm/preact@10.28.2/node_modules/preact/jsx-runtime/dist/jsxRuntime.module.js";
+import { useMemo as p, useEffect as m } from "../../../external/.pnpm/preact@10.28.2/node_modules/preact/hooks/dist/hooks.module.js";
+import { useWizardFormContext as O } from "../../../hooks/form/wizard/WizardFormContext.js";
+import R from "./FormField.js";
+import { VisibleField as b } from "./VisibleField.js";
+import { FieldError as j } from "../FormFields/FieldError/FieldError.js";
+import { Controller as w } from "../../../hooks/form/Controller.js";
+import z from "../FormFields/Select/Select.js";
+function K({
+  className: d,
+  clearable: v,
+  fieldName: r,
+  filterable: F,
+  hideOptionalLabel: C,
   isRequired: i,
-  items: e,
-  label: q,
-  onChange: u,
-  preventInvalidState: x,
-  readonly: I,
-  validate: M
+  isReadOnly: c,
+  items: o,
+  label: V,
+  onChange: y,
+  preventInvalidState: q,
+  readonly: x,
+  validate: I
 }) {
-  const { control: T, fieldsConfig: c, getValues: l, setValue: t } = w(), m = j(() => {
-    var r;
-    return i ?? ((r = c[o]) == null ? void 0 : r.required);
-  }, [c, i]);
-  return h(() => {
-    if (!e.length) return;
-    const r = l(o);
-    r && !e.some((n) => n.id === r) && t(o, "");
-  }, [l, t, e]), h(() => {
-    var r;
-    e && e.length === 1 && t(o, (r = e[0]) == null ? void 0 : r.id);
-  }, [e, t, o]), /* @__PURE__ */ s(z, { name: o, children: /* @__PURE__ */ s(y, { label: q, optional: !m && !f, className: v, children: /* @__PURE__ */ s(
-    R,
+  const { control: M, fieldsConfig: t, getValues: l, setValue: u } = O(), a = p(() => i ?? t[r]?.required, [t, r, i]), T = p(() => c ?? t[r]?.readOnly, [t, r, c]);
+  return m(() => {
+    if (!o.length) return;
+    const e = l(r);
+    e && !o.some((n) => n.id === e) && u(r, "");
+  }, [l, u, o]), m(() => {
+    o && o.length === 1 && u(r, o[0]?.id);
+  }, [o, u, r]), /* @__PURE__ */ s(b, { name: r, children: /* @__PURE__ */ s(R, { label: V, optional: !a && !C, className: d, children: /* @__PURE__ */ s(
+    w,
     {
-      name: o,
-      control: T,
+      name: r,
+      control: M,
       rules: {
-        required: m,
-        validate: M
+        required: a,
+        validate: I
       },
-      render: ({ field: r, fieldState: n }) => {
-        var p, d;
-        const E = (g) => {
-          const b = g.target.value;
-          r.onInput(b), u == null || u(g);
-        }, a = !!n.error && n.isTouched;
+      render: ({ field: e, fieldState: n }) => {
+        const f = (h) => {
+          const E = h.target.value;
+          e.onInput(E), y?.(h);
+        }, g = !!n.error && n.isTouched;
         return /* @__PURE__ */ s("div", { children: [
           /* @__PURE__ */ s(
-            W,
+            z,
             {
-              ...r,
-              isInvalid: x ? !1 : a,
+              ...e,
+              isInvalid: q ? !1 : g,
               isValid: !n.error,
-              items: e,
-              filterable: V,
-              clearable: F,
-              name: o,
-              onChange: E,
-              readonly: I,
-              selected: r.value
+              items: o,
+              filterable: F,
+              clearable: v,
+              name: r,
+              onChange: f,
+              readonly: x || T,
+              selected: e.value,
+              fitPosition: !0
             }
           ),
-          a && ((p = n.error) == null ? void 0 : p.message) && /* @__PURE__ */ s(C, { errorMessage: (d = n.error) == null ? void 0 : d.message, withTopMargin: !0 })
+          g && n.error?.message && /* @__PURE__ */ s(j, { errorMessage: n.error?.message, withTopMargin: !0 })
         ] });
       }
     }
   ) }) });
 }
 export {
-  L as FormSelect
+  K as FormSelect
 };