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