import { jsx as l, jsxs as R } from "react/jsx-runtime"; import { Input as I, Checkbox as ee, Textarea as re, RadioGroup as te, HStack as le, Radio as ne, Select as oe, Modal as ie, ModalOverlay as ce, ModalContent as ue, ModalHeader as se, ModalCloseButton as ae, ModalBody as de, VStack as fe, SimpleGrid as be, ModalFooter as pe, Button as A, FormControl as ve, FormLabel as me, FormErrorMessage as xe, useDisclosure as Fe } from "@chakra-ui/react"; import { useContext as he, useMemo as m, useRef as ge, useEffect as G, createContext as ke, useState as Se, useCallback as E } from "react"; import { Controller as P, useForm as ye, useWatch as Re } from "react-hook-form"; const Me = {}, y = { create: { titlePrefix: "افزودن", submitText: "ثبت" }, edit: { titlePrefix: "ویرایش", submitText: "ویرایش" } }, H = ke(null); function Ce({ item: e, mode: r }) { return e ? [r, e.rowId, e.entityId, e.id].filter(Boolean).join("-") : r; } function x({ required: e, validate: r, rules: t }) { const n = { ...t ?? {} }; return e && (n.required = typeof e == "string" ? e : "این فیلد الزامی است."), r && (n.validate = r), n; } function v() { const e = he(H); if (!e) throw new Error("Field باید داخل FormModal استفاده شود."); return e; } function U(e = []) { return e.map((r, t) => { if (typeof r != "object" || r === null) { const o = String(r); return { key: o, label: o, value: o, disabled: !1 }; } const n = r.value ?? r.id; return { key: String(r.key ?? n ?? t), label: r.label ?? r.name ?? n, value: String(n), disabled: !!r.disabled }; }); } function Ve({ options: e = [] }) { return e.map((r, t) => /* @__PURE__ */ l( "option", { value: r.value, disabled: r.disabled, children: r.label }, `${r.key}-${t}` )); } function F({ name: e, label: r, showWhen: t, children: n }) { var s; const { errors: o, control: u } = v(), c = Re({ control: u, name: t == null ? void 0 : t.name }); return m(() => t ? typeof t == "function" ? t({ value: c }) : c === t.value : !0, [t, c]) ? /* @__PURE__ */ R(ve, { isInvalid: !!o[e], children: [ r && /* @__PURE__ */ l(me, { fontSize: "sm", fontWeight: "bold", children: r }), n, /* @__PURE__ */ l(xe, { children: (s = o[e]) == null ? void 0 : s.message }) ] }) : null; } function Be({ name: e, label: r, required: t, validate: n, rules: o, showWhen: u, placeholder: c, ...i }) { const { register: s } = v(); return /* @__PURE__ */ l(F, { name: e, label: r, showWhen: u, children: /* @__PURE__ */ l( I, { borderRadius: "xl", placeholder: c, ...s(e, x({ required: t, validate: n, rules: o })), ...i } ) }); } function Ee({ name: e, label: r, required: t, validate: n, rules: o, showWhen: u, placeholder: c, ...i }) { const { register: s } = v(); return /* @__PURE__ */ l(F, { name: e, label: r, showWhen: u, children: /* @__PURE__ */ l( re, { borderRadius: "xl", placeholder: c, ...s(e, x({ required: t, validate: n, rules: o })), ...i } ) }); } function Ie({ name: e, label: r, required: t, validate: n, rules: o, showWhen: u, placeholder: c = "انتخاب کنید", options: i = [], onChange: s, isClearable: d = !0, ...b }) { const { control: f, setValue: a } = v(), M = m(() => U(i), [i]); return /* @__PURE__ */ l(F, { name: e, label: r, showWhen: u, children: /* @__PURE__ */ l( P, { name: e, control: f, rules: x({ required: t, validate: n, rules: o }), render: ({ field: g }) => /* @__PURE__ */ l( oe, { borderRadius: "xl", placeholder: d ? c : void 0, value: g.value ?? "", onChange: (C) => { const k = C.target.value; g.onChange(k), s == null || s({ value: k, setValue: a }); }, ...b, children: /* @__PURE__ */ l(Ve, { options: M }) } ) } ) }); } function Pe({ name: e, label: r, required: t, validate: n, rules: o, showWhen: u, options: c = [], onChange: i }) { const { control: s, setValue: d } = v(), b = U(c); return /* @__PURE__ */ l(F, { name: e, label: r, showWhen: u, children: /* @__PURE__ */ l( P, { name: e, control: s, rules: x({ required: t, validate: n, rules: o }), render: ({ field: f }) => /* @__PURE__ */ l( te, { value: f.value, onChange: (a) => { f.onChange(a), i == null || i({ value: a, setValue: d }); }, children: /* @__PURE__ */ l(le, { pt: "8px", spacing: 3, children: b.map((a) => /* @__PURE__ */ l(ne, { value: a.value, children: a.label }, a.value)) }) } ) } ) }); } function $e({ name: e, label: r, required: t, validate: n, rules: o, showWhen: u, children: c, onChange: i }) { const { control: s, setValue: d } = v(); return /* @__PURE__ */ l(F, { name: e, label: r, showWhen: u, children: /* @__PURE__ */ l( P, { name: e, control: s, rules: x({ required: t, validate: n, rules: o }), render: ({ field: b }) => /* @__PURE__ */ l( ee, { isChecked: !!b.value, onChange: (f) => { const a = f.target.checked; b.onChange(a), i == null || i({ value: a, setValue: d }); }, children: c ?? r } ) } ) }); } function ze({ name: e, label: r, required: t, validate: n, rules: o, showWhen: u, ...c }) { const { register: i } = v(); return /* @__PURE__ */ l(F, { name: e, label: r, showWhen: u, children: /* @__PURE__ */ l( I, { type: "file", borderRadius: "xl", ...i(e, x({ required: t, validate: n, rules: o })), ...c } ) }); } function De({ name: e, label: r, required: t, validate: n, rules: o, showWhen: u, ...c }) { const { register: i } = v(); return /* @__PURE__ */ l(F, { name: e, label: r, showWhen: u, children: /* @__PURE__ */ l( I, { type: "date", borderRadius: "xl", ...i(e, x({ required: t, validate: n, rules: o })), ...c } ) }); } const Ae = { Input: Be, Select: Ie, Radio: Pe, Textarea: Ee, Check: $e, Filepicker: ze, Datepicker: De, useForm: v }; function Ge({ isOpen: e, close: r, item: t = null, entityName: n = "آیتم", title: o, createTitle: u, editTitle: c, submitText: i, createSubmitText: s, editSubmitText: d, defaultValues: b = Me, getDefaultValues: f, resetKey: a, onSubmit: M, transformValues: g, children: C, isLoading: k = !1, size: _ = "lg", columns: Y = { base: 1, md: 2 } }) { const p = !!t, h = p ? "edit" : "create", w = m(() => o || (p ? c ?? `${y.edit.titlePrefix} ${n}` : u ?? `${y.create.titlePrefix} ${n}`), [o, c, u, n, p]), J = m(() => i || (p ? d ?? y.edit.submitText : s ?? y.create.submitText), [i, d, s, p]), S = m(() => typeof f == "function" ? f({ item: t, mode: h, isEdit: p }) : b, [f, b, t, h, p]), V = ge(S); G(() => { V.current = S; }, [S]); const K = m(() => a || Ce({ item: t, mode: h }), [a, t, h]), Q = ye({ defaultValues: S }), { handleSubmit: X, reset: B, register: $, control: z, setValue: D, watch: L, formState: { isSubmitting: Z, errors: O } } = Q; G(() => { e && B(V.current); }, [e, K, B]); const T = () => { B(V.current), r(); }, q = X(async (j) => { const W = typeof g == "function" ? g({ values: j, item: t, mode: h, isEdit: p }) : j; await M({ values: W, item: t, mode: h, isEdit: p }); }), N = m( () => ({ register: $, control: z, setValue: D, watch: L, errors: O }), [$, z, D, L, O] ); return /* @__PURE__ */ R(ie, { isOpen: e, onClose: T, isCentered: !0, size: _, children: [ /* @__PURE__ */ l(ce, { backdropFilter: "blur(6px)" }), /* @__PURE__ */ R( ue, { as: "form", onSubmit: q, borderRadius: "2xl", overflow: "visible", children: [ /* @__PURE__ */ l( se, { bgGradient: "linear(to-l, blue.600, facebook.500)", color: "white", fontSize: "md", fontWeight: "black", children: w } ), /* @__PURE__ */ l(ae, { color: "white" }), /* @__PURE__ */ l(de, { py: 5, children: /* @__PURE__ */ l(H.Provider, { value: N, children: /* @__PURE__ */ l(fe, { spacing: 4, alignItems: "stretch", children: /* @__PURE__ */ l(be, { columns: Y, spacing: 4, children: C }) }) }) }), /* @__PURE__ */ R(pe, { gap: 2, bg: "gray.50", children: [ /* @__PURE__ */ l(A, { type: "button", variant: "ghost", onClick: T, children: "انصراف" }), /* @__PURE__ */ l( A, { type: "submit", colorScheme: "blue", borderRadius: "xl", isLoading: Z || k, children: J } ) ] }) ] } ) ] }); } function He() { const { isOpen: e, onOpen: r, onClose: t } = Fe(), [n, o] = Se(null), u = E(() => { o(null), r(); }, [r]), c = E( (d) => { o(d), r(); }, [r] ), i = E(() => { o(null), t(); }, [t]), s = !!n; return m( () => ({ isOpen: e, item: n, isEdit: s, isCreate: !s, openCreate: u, openEdit: c, close: i }), [e, n, s, u, c, i] ); } export { Ae as Field, Ge as FormModal, He as useFormModal };