@adyen/adyen-platform-experience-web
Version:
87 lines (86 loc) • 2.69 kB
JavaScript
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 d } from "../../../external/.pnpm/preact@10.28.2/node_modules/preact/hooks/dist/hooks.module.js";
import { useWizardFormContext as R } from "../../../hooks/form/wizard/WizardFormContext.js";
import $ 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 J({
className: v,
clearable: F,
fieldName: r,
filterable: m,
hideOptionalLabel: C,
isRequired: i,
isReadOnly: c,
items: o,
label: I,
onChange: V,
preventInvalidState: y,
readonly: q,
validate: x
}) {
const { control: M, fieldsConfig: e, getValues: l, setValue: u } = R(), g = p(() => i ?? e[r]?.required, [e, r, i]), T = p(() => c ?? e[r]?.readOnly, [e, r, c]);
return d(() => {
if (!o.length) return;
const t = l(r);
t && !o.some((n) => n.id === t) && u(r, "");
}, [l, u, o, r]), d(() => {
o && o.length === 1 && u(r, o[0]?.id);
}, [o, u, r]), /* @__PURE__ */ s(b, { name: r, children: /* @__PURE__ */ s(
$,
{
label: I,
optional: !g && !C,
className: v,
testId: r ? `form-field-${r}` : void 0,
children: /* @__PURE__ */ s(
w,
{
name: r,
control: M,
rules: {
required: g,
validate: x
},
render: ({ field: t, fieldState: n }) => {
const E = (h) => {
const O = h.target.value;
t.onInput(O), V?.(h);
}, a = !!n.error && n.isTouched;
return /* @__PURE__ */ s("div", { children: [
/* @__PURE__ */ s(
z,
{
...t,
isInvalid: y ? !1 : a,
isValid: !n.error,
items: o,
filterable: m,
clearable: F,
name: r,
onChange: E,
readonly: q || T,
selected: t.value,
fitPosition: !0
}
),
a && n.error?.message && /* @__PURE__ */ s(
j,
{
errorMessage: n.error?.message,
testId: r ? `field-error-${r}` : void 0,
withTopMargin: !0
}
)
] });
}
}
)
}
) });
}
export {
J as FormSelect
};