@notmrabhi/flowforge 0.1.20 → 0.1.21

package/dist/SchemaBuilderDrawer-157p-2Vj.js

@@ -1,1136 +0,0 @@
-import { useMemo as P, useState as T, useRef as M, useEffect as de, useCallback as te } from "react";
-import { useFormik as ke } from "formik";
-import { k as pe, C as Ne, g as oe, a as ue, b as ie, v as se, E as ze, d as Te, V as we } from "./index-BU09HbVh.js";
-import { jsxs as t, Fragment as q, jsx as e } from "react/jsx-runtime";
-import { Box as n, Collapse as Ie, Tooltip as A, Dialog as he, Typography as S, IconButton as Y, Stepper as Fe, Step as Oe, StepLabel as Re, Drawer as Ee, Chip as We, Divider as Ae } from "@mui/material";
-import { MdCheck as G, MdClose as _, MdAdd as J, MdArrowBack as fe, MdEdit as De, MdDeleteOutline as Pe, MdSettings as be, MdArrowForward as Me } from "react-icons/md";
-import { FaWpforms as _e } from "react-icons/fa6";
-function sl({
-  schema: l,
-  initialValues: o,
-  onSubmit: p,
-  showErrorsImmediately: c = !1
-}) {
-  const a = l.fields ?? [], i = P(
-    () => pe(a),
-    [a]
-  ), h = P(() => {
-    if (c)
-      return a.reduce((f, C) => {
-        const g = Ne(C);
-        return g && (f[g] = !0), f;
-      }, {});
-  }, [a, c]), [s, d] = T({}), [x, y] = T({}), N = M(o);
-  de(() => {
-    N.current !== o && (N.current = o, d({}), y({}));
-  }, [o]);
-  const u = ke({
-    initialValues: o,
-    validationSchema: i,
-    initialTouched: h,
-    validateOnMount: c,
-    validateOnChange: !0,
-    validateOnBlur: !0,
-    enableReinitialize: !0,
-    onSubmit: async (f) => {
-      const C = oe({ values: f, conditionConfig: x });
-      await p(f, C);
-    }
-  }), r = te(() => {
-    u.submitForm();
-  }, [u]), b = te((f) => {
-    u.resetForm(f ? { values: f } : void 0), d({}), y({});
-  }, [u]);
-  return {
-    values: u.values,
-    errors: u.errors,
-    isValid: u.isValid,
-    isDirty: u.dirty,
-    isSubmitting: u.isSubmitting,
-    formulaConfig: s,
-    conditionConfig: x,
-    submit: r,
-    reset: b,
-    setFieldValue: u.setFieldValue,
-    // Internals for DynamicFormRenderer
-    _schema: l,
-    _formik: u,
-    _formulaConfig: s,
-    _onFormulaConfigChange: d,
-    _conditionConfig: x,
-    _onConditionConfigChange: y
-  };
-}
-const je = ue.getTypeOptions(), v = "form-control font-14", m = "text-14 text-dark fw-medium mb-1 align-items-center d-flex gap-1", R = {
-  fontSize: 10,
-  fontWeight: 700,
-  color: "#94a3b8",
-  textTransform: "uppercase",
-  letterSpacing: 0.6,
-  marginBottom: 8,
-  display: "block"
-}, Le = [
-  { value: "text", label: "Text" },
-  { value: "number", label: "Number" },
-  { value: "email", label: "Email" },
-  { value: "url", label: "URL" },
-  { value: "password", label: "Password" },
-  { value: "select", label: "Select" },
-  { value: "object", label: "Object (sub-fields)" },
-  { value: "array", label: "Array (nested)" }
-], Ve = [
-  { value: 3, label: "1/4" },
-  { value: 4, label: "1/3" },
-  { value: 6, label: "1/2" },
-  { value: 8, label: "2/3" },
-  { value: 12, label: "Full" }
-];
-function $e({ value: l, onChange: o }) {
-  const p = l ?? 12;
-  return /* @__PURE__ */ t(n, { children: [
-    /* @__PURE__ */ e("span", { className: m, children: "Column width" }),
-    /* @__PURE__ */ e(n, { sx: { display: "flex", gap: 0.5 }, children: Ve.map((c) => /* @__PURE__ */ e(A, { title: `colSpan: ${c.value}`, placement: "top", children: /* @__PURE__ */ e(
-      n,
-      {
-        component: "button",
-        onClick: () => o(c.value),
-        sx: {
-          flex: 1,
-          border: "1px solid",
-          borderColor: p === c.value ? "#6366f1" : "#dee2e6",
-          borderRadius: "6px",
-          cursor: "pointer",
-          bgcolor: p === c.value ? "#eef2ff" : "#fff",
-          color: p === c.value ? "#6366f1" : "#6c757d",
-          fontSize: 11,
-          fontWeight: 600,
-          py: 0.6,
-          px: 0,
-          "&:hover": { borderColor: "#6366f1", bgcolor: "#f5f3ff" }
-        },
-        children: c.label
-      }
-    ) }, c.value)) }),
-    /* @__PURE__ */ e(n, { sx: { display: "flex", gap: "3px", mt: 0.75 }, children: Array.from({ length: 12 }).map((c, a) => /* @__PURE__ */ e(n, { sx: { flex: 1, height: 4, borderRadius: "2px", bgcolor: a < p ? "#6366f1" : "#e2e8f0", transition: "background 0.12s" } }, a)) })
-  ] });
-}
-function me({ options: l = [], onChange: o }) {
-  function p(c, a, i) {
-    o(l.map((h, s) => s === c ? { ...h, [a]: i } : h));
-  }
-  return /* @__PURE__ */ t(n, { children: [
-    /* @__PURE__ */ t("span", { className: m, children: [
-      "Options ",
-      /* @__PURE__ */ e("span", { style: { color: "#dc3545" }, children: "*" })
-    ] }),
-    /* @__PURE__ */ e(n, { sx: { display: "flex", flexDirection: "column", gap: 0.5, mb: 0.75 }, children: l.map((c, a) => /* @__PURE__ */ t(n, { sx: { display: "flex", gap: 0.5, alignItems: "center" }, children: [
-      /* @__PURE__ */ e("input", { className: v, style: { flex: 1 }, placeholder: "Label", value: c.label, onChange: (i) => p(a, "label", i.target.value) }),
-      /* @__PURE__ */ e("input", { className: v, style: { flex: 1 }, placeholder: "Value", value: c.value, onChange: (i) => p(a, "value", i.target.value) }),
-      /* @__PURE__ */ e(n, { component: "button", onClick: () => o(l.filter((i, h) => h !== a)), sx: { background: "none", border: "none", cursor: "pointer", color: "#94a3b8", display: "flex", p: 0.25, "&:hover": { color: "#dc2626" } }, children: /* @__PURE__ */ e(_, { size: 13 }) })
-    ] }, a)) }),
-    /* @__PURE__ */ t(n, { component: "button", onClick: () => o([...l, { label: "", value: "" }]), sx: { display: "flex", alignItems: "center", gap: 0.5, background: "none", border: "1px dashed #dee2e6", cursor: "pointer", fontSize: 11, fontWeight: 600, px: 1, py: 0.5, borderRadius: "6px", color: "#6366f1", width: "100%", "&:hover": { borderColor: "#6366f1", bgcolor: "#f5f3ff" } }, children: [
-      /* @__PURE__ */ e(J, { size: 13 }),
-      " Add option"
-    ] })
-  ] });
-}
-const xe = [
-  { value: "operator", label: "Operator (predefined)" },
-  { value: "select", label: "Select" },
-  { value: "text", label: "Text" }
-];
-function Be({ col: l, onChange: o, onDelete: p }) {
-  const c = l.type === "select", a = l.type === "operator";
-  return /* @__PURE__ */ t(n, { sx: { border: "1px solid #e2e8f0", borderRadius: "7px", p: 1.25, bgcolor: "#fff", display: "flex", flexDirection: "column", gap: 1 }, children: [
-    /* @__PURE__ */ t(n, { sx: { display: "flex", alignItems: "center", gap: 0.75 }, children: [
-      /* @__PURE__ */ e(n, { sx: { fontSize: 10, fontWeight: 700, px: 0.75, py: 0.2, borderRadius: "4px", bgcolor: a ? "#fef9c3" : "#eef2ff", color: a ? "#92400e" : "#6366f1", flexShrink: 0 }, children: a ? "OPERATOR" : l.type.toUpperCase() }),
-      /* @__PURE__ */ e(n, { sx: { fontSize: 12, fontWeight: 600, color: "#0f172a", flex: 1 }, children: l.label || l.id || "Unnamed" }),
-      /* @__PURE__ */ e(n, { component: "button", onClick: p, sx: { background: "none", border: "none", cursor: "pointer", color: "#94a3b8", display: "flex", p: 0.25, "&:hover": { color: "#dc2626" } }, children: /* @__PURE__ */ e(_, { size: 13 }) })
-    ] }),
-    /* @__PURE__ */ t(n, { sx: { display: "grid", gridTemplateColumns: "1fr 1fr", gap: 1 }, children: [
-      /* @__PURE__ */ t(n, { children: [
-        /* @__PURE__ */ e("label", { className: m, children: "Column type" }),
-        /* @__PURE__ */ e("select", { value: l.type, onChange: (i) => o({ ...l, type: i.target.value, options: void 0 }), className: v, style: { cursor: "pointer" }, children: xe.map((i) => /* @__PURE__ */ e("option", { value: i.value, children: i.label }, i.value)) })
-      ] }),
-      /* @__PURE__ */ t(n, { children: [
-        /* @__PURE__ */ t("label", { className: m, children: [
-          "Column key ",
-          /* @__PURE__ */ e("span", { style: { color: "#dc3545" }, children: "*" })
-        ] }),
-        /* @__PURE__ */ e("input", { className: `${v} ${l.id ? "" : "border-danger"}`, value: l.id, onChange: (i) => o({ ...l, id: i.target.value }), placeholder: "e.g. field, operator, value" }),
-        !l.id && /* @__PURE__ */ e("span", { style: { fontSize: 10, color: "#dc3545" }, children: "Required — used as data key" })
-      ] })
-    ] }),
-    !a && /* @__PURE__ */ t(n, { sx: { display: "grid", gridTemplateColumns: "1fr 1fr", gap: 1 }, children: [
-      /* @__PURE__ */ t(n, { children: [
-        /* @__PURE__ */ e("label", { className: m, children: "Label" }),
-        /* @__PURE__ */ e("input", { className: v, value: l.label ?? "", onChange: (i) => o({ ...l, label: i.target.value || void 0 }), placeholder: "Column label" })
-      ] }),
-      /* @__PURE__ */ t(n, { children: [
-        /* @__PURE__ */ e("label", { className: m, children: "Placeholder" }),
-        /* @__PURE__ */ e("input", { className: v, value: l.placeholder ?? "", onChange: (i) => o({ ...l, placeholder: i.target.value || void 0 }), placeholder: "Hint…" })
-      ] })
-    ] }),
-    c && /* @__PURE__ */ e(me, { options: l.options ?? [], onChange: (i) => o({ ...l, options: i }) }),
-    a && /* @__PURE__ */ e(n, { sx: { bgcolor: "#fefce8", border: "1px solid #fef08a", borderRadius: "6px", px: 1.25, py: 0.75 }, children: /* @__PURE__ */ e(n, { sx: { fontSize: 11, color: "#78350f" }, children: "Predefined: equals, not equals, contains, starts with, ends with, is present, is not present, greater than, less than…" }) }),
-    !a && /* @__PURE__ */ t(n, { sx: { display: "flex", alignItems: "center", gap: 0.75 }, children: [
-      /* @__PURE__ */ e("input", { type: "checkbox", id: `formula-${l.id}`, checked: !!l.formula, onChange: (i) => o({ ...l, formula: i.target.checked || void 0 }), style: { cursor: "pointer", width: 14, height: 14 } }),
-      /* @__PURE__ */ e("label", { htmlFor: `formula-${l.id}`, className: m, style: { margin: 0, cursor: "pointer" }, children: "Formula input (chip editor)" })
-    ] })
-  ] });
-}
-function He({ condition: l, onChange: o }) {
-  const p = !!l;
-  function c() {
-    o(p ? void 0 : { fields: [] });
-  }
-  function a(s) {
-    if (!l) return;
-    const d = s === "operator" ? "operator" : l.fields.filter((x) => x.type !== "operator").length === 0 ? "field" : "value";
-    o({ ...l, fields: [...l.fields, { id: d, type: s }] });
-  }
-  function i(s, d) {
-    if (!l) return;
-    const x = [...l.fields];
-    x[s] = d, o({ ...l, fields: x });
-  }
-  function h(s) {
-    l && o({ ...l, fields: l.fields.filter((d, x) => x !== s) });
-  }
-  return /* @__PURE__ */ t(n, { sx: { borderTop: "1px solid #e2e8f0", pt: 1.5 }, children: [
-    /* @__PURE__ */ t(n, { sx: { display: "flex", alignItems: "center", gap: 0.75, mb: p ? 1.25 : 0 }, children: [
-      /* @__PURE__ */ e("input", { type: "checkbox", id: "enable-condition", checked: p, onChange: c, style: { cursor: "pointer", width: 14, height: 14 } }),
-      /* @__PURE__ */ e("span", { style: { ...R, margin: 0, color: p ? "#6366f1" : "#94a3b8" }, children: "Condition row" })
-    ] }),
-    p && l && /* @__PURE__ */ t(n, { sx: { display: "flex", flexDirection: "column", gap: 1 }, children: [
-      l.fields.map((s, d) => /* @__PURE__ */ e(Be, { col: s, onChange: (x) => i(d, x), onDelete: () => h(d) }, d)),
-      /* @__PURE__ */ e(n, { sx: { display: "flex", gap: 0.5 }, children: xe.map((s) => /* @__PURE__ */ t(n, { component: "button", onClick: () => a(s.value), sx: { flex: 1, background: "none", border: "1px dashed #dee2e6", cursor: "pointer", fontSize: 11, fontWeight: 600, py: 0.5, borderRadius: "6px", color: s.value === "operator" ? "#92400e" : "#6366f1", "&:hover": { borderColor: "#6366f1", bgcolor: "#f5f3ff" } }, children: [
-        "+ ",
-        s.value === "operator" ? "Operator" : s.label.split(" ")[0]
-      ] }, s.value)) }),
-      /* @__PURE__ */ t(n, { sx: { display: "flex", alignItems: "center", gap: 2, flexWrap: "wrap" }, children: [
-        /* @__PURE__ */ t(n, { sx: { display: "flex", alignItems: "center", gap: 0.75 }, children: [
-          /* @__PURE__ */ e("input", { type: "checkbox", id: "allow-groups", checked: !!l.allowGroups, onChange: (s) => o({ ...l, allowGroups: s.target.checked || void 0 }), style: { cursor: "pointer", width: 14, height: 14 } }),
-          /* @__PURE__ */ e("label", { htmlFor: "allow-groups", className: m, style: { margin: 0, cursor: "pointer" }, children: "Allow nested groups" })
-        ] }),
-        l.allowGroups && /* @__PURE__ */ t(n, { sx: { display: "flex", alignItems: "center", gap: 0.75 }, children: [
-          /* @__PURE__ */ e("label", { className: m, style: { margin: 0 }, children: "Max depth" }),
-          /* @__PURE__ */ e("input", { type: "number", min: 1, max: 5, className: v, style: { width: 60, textAlign: "center" }, value: l.maxGroupDepth ?? "", onChange: (s) => o({ ...l, maxGroupDepth: s.target.value ? Number(s.target.value) : void 0 }), placeholder: "∞" })
-        ] })
-      ] })
-    ] })
-  ] });
-}
-function D({ id: l, label: o, checked: p, onChange: c }) {
-  return /* @__PURE__ */ t(n, { sx: { display: "flex", alignItems: "center", gap: 0.75 }, children: [
-    /* @__PURE__ */ e("input", { type: "checkbox", id: l, checked: p, onChange: (a) => c(a.target.checked), style: { cursor: "pointer", width: 14, height: 14, flexShrink: 0 } }),
-    /* @__PURE__ */ e("label", { htmlFor: l, className: m, style: { margin: 0, cursor: "pointer" }, children: o })
-  ] });
-}
-function Ue({ views: l = [], onChange: o }) {
-  function p(a, i, h) {
-    o(l.map((s, d) => d === a ? { ...s, [i]: h } : s));
-  }
-  function c() {
-    const a = `tab${l.length + 1}`;
-    o([...l, { id: a, label: `Tab ${l.length + 1}` }]);
-  }
-  return /* @__PURE__ */ t(n, { children: [
-    /* @__PURE__ */ e("span", { className: m, children: "Views" }),
-    /* @__PURE__ */ e(n, { sx: { display: "flex", flexDirection: "column", gap: 0.5, mb: 0.75 }, children: l.map((a, i) => /* @__PURE__ */ t(n, { sx: { display: "flex", gap: 0.5, alignItems: "center" }, children: [
-      /* @__PURE__ */ e("input", { className: v, style: { flex: 1 }, placeholder: "Label", value: a.label, onChange: (h) => p(i, "label", h.target.value) }),
-      /* @__PURE__ */ e("input", { className: v, style: { flex: 1 }, placeholder: "ID (no spaces)", value: a.id, onChange: (h) => p(i, "id", h.target.value.replace(/\s/g, "_")) }),
-      /* @__PURE__ */ e(n, { component: "button", onClick: () => o(l.filter((h, s) => s !== i)), sx: { background: "none", border: "none", cursor: "pointer", color: "#94a3b8", display: "flex", p: 0.25, "&:hover": { color: "#dc2626" } }, children: /* @__PURE__ */ e(_, { size: 13 }) })
-    ] }, i)) }),
-    /* @__PURE__ */ t(n, { component: "button", onClick: c, sx: { display: "flex", alignItems: "center", gap: 0.5, background: "none", border: "1px dashed #dee2e6", cursor: "pointer", fontSize: 11, fontWeight: 600, px: 1, py: 0.5, borderRadius: "6px", color: "#6366f1", width: "100%", "&:hover": { borderColor: "#6366f1", bgcolor: "#f5f3ff" } }, children: [
-      /* @__PURE__ */ e(J, { size: 13 }),
-      " Add view"
-    ] })
-  ] });
-}
-function B({ label: l, value: o, options: p, onChange: c }) {
-  return /* @__PURE__ */ t(n, { children: [
-    /* @__PURE__ */ e("span", { className: m, children: l }),
-    /* @__PURE__ */ e(n, { sx: { display: "flex", border: "1px solid #dee2e6", borderRadius: "7px", overflow: "hidden" }, children: p.map((a) => /* @__PURE__ */ e(
-      n,
-      {
-        component: "button",
-        onClick: () => c(a.value),
-        sx: {
-          flex: 1,
-          border: "none",
-          borderRight: "1px solid #dee2e6",
-          cursor: "pointer",
-          fontSize: 12,
-          fontWeight: 600,
-          py: 0.6,
-          bgcolor: o === a.value ? "#eef2ff" : "#fff",
-          color: o === a.value ? "#6366f1" : "#6c757d",
-          "&:last-child": { borderRight: "none" },
-          "&:hover": { bgcolor: "#f5f3ff" }
-        },
-        children: a.label
-      },
-      a.value
-    )) })
-  ] });
-}
-function ge({ field: l, onChange: o, onSave: p, onCancel: c, noFooter: a }) {
-  const [i, h] = T(!1), s = l.id ?? l.name ?? "", d = l, x = l.type === "select" || l.type === "descriptive-select" || l.type === "radio-group", y = ue.get(l.type), N = y == null ? void 0 : y.configSchema;
-  function u(r, b) {
-    o({ ...l, [r]: b });
-  }
-  return /* @__PURE__ */ t(q, { children: [
-    /* @__PURE__ */ t(n, { sx: { flex: 1, overflowY: "auto", px: 2.5, py: 2, display: "flex", flexDirection: "column", gap: 1.75 }, children: [
-      /* @__PURE__ */ t(n, { children: [
-        /* @__PURE__ */ e("span", { style: R, children: "Required" }),
-        /* @__PURE__ */ t(n, { sx: { display: "flex", flexDirection: "column", gap: 1 }, children: [
-          /* @__PURE__ */ t(n, { children: [
-            /* @__PURE__ */ e("label", { className: m, children: "Type" }),
-            /* @__PURE__ */ e("select", { value: l.type, onChange: (r) => u("type", r.target.value), className: v, style: { cursor: "pointer" }, children: je.map((r) => /* @__PURE__ */ e("option", { value: r.value, children: r.label }, r.value)) })
-          ] }),
-          /* @__PURE__ */ t(n, { sx: { display: "grid", gridTemplateColumns: l.type === "tabs" ? "1fr" : "1fr 1fr", gap: 1 }, children: [
-            /* @__PURE__ */ t(n, { children: [
-              /* @__PURE__ */ t("label", { className: m, children: [
-                "Field ID ",
-                /* @__PURE__ */ e("span", { style: { color: "#dc3545" }, children: "*" })
-              ] }),
-              /* @__PURE__ */ e("input", { className: v, value: l.id ?? l.name ?? "", onChange: (r) => u("id", r.target.value), placeholder: "e.g. email" })
-            ] }),
-            l.type !== "tabs" && /* @__PURE__ */ t(n, { children: [
-              /* @__PURE__ */ t("label", { className: m, children: [
-                "Label ",
-                /* @__PURE__ */ e("span", { style: { color: "#dc3545" }, children: "*" })
-              ] }),
-              /* @__PURE__ */ e("input", { className: v, value: l.label ?? "", onChange: (r) => u("label", r.target.value), placeholder: "Display label" })
-            ] })
-          ] }),
-          l.type !== "tabs" && /* @__PURE__ */ e($e, { value: l.colSpan, onChange: (r) => u("colSpan", r === 12 ? void 0 : r) })
-        ] })
-      ] }),
-      N && /* @__PURE__ */ t(n, { sx: { borderTop: "1px solid #e2e8f0", pt: 1.5 }, children: [
-        /* @__PURE__ */ e("span", { style: R, children: "Specific Settings" }),
-        /* @__PURE__ */ e(
-          ie,
-          {
-            schema: { layout: "flat", compact: !0, fields: N.fields },
-            initialValues: l,
-            onValuesChange: (r) => o({ ...l, ...r }),
-            onSubmit: () => {
-            }
-          }
-        )
-      ] }),
-      l.type === "tabs" && /* @__PURE__ */ t(n, { sx: { borderTop: "1px solid #e2e8f0", pt: 1.5, display: "flex", flexDirection: "column", gap: 1.5 }, children: [
-        /* @__PURE__ */ e("span", { style: R, children: "Content" }),
-        /* @__PURE__ */ e(
-          Ue,
-          {
-            views: (d.tabs ?? []).map((r) => ({ id: r.id, label: r.label })),
-            onChange: (r) => {
-              const b = d.tabs ?? [], f = r.map((C) => {
-                const g = b.find((I) => I.id === C.id);
-                return g ? { ...g, ...C } : { ...C, fields: [] };
-              });
-              o({ ...l, tabs: f });
-            }
-          }
-        ),
-        /* @__PURE__ */ e("span", { style: { ...R, marginTop: 4 }, children: "Interaction" }),
-        /* @__PURE__ */ t(n, { children: [
-          /* @__PURE__ */ e("label", { className: m, children: "Disabled" }),
-          /* @__PURE__ */ e("input", { className: v, value: d.disabledExpr ?? "", onChange: (r) => o({ ...l, disabledExpr: r.target.value || void 0 }), placeholder: "false" })
-        ] }),
-        /* @__PURE__ */ e("span", { style: { ...R, marginTop: 4 }, children: "Appearance" }),
-        /* @__PURE__ */ e(
-          B,
-          {
-            label: "Alignment",
-            value: d.alignment ?? "left",
-            options: [
-              { value: "left", label: "|←" },
-              { value: "center-left", label: "←|" },
-              { value: "center", label: "|·|" },
-              { value: "center-right", label: "|→" },
-              { value: "right", label: "→|" }
-            ],
-            onChange: (r) => o({ ...l, alignment: r })
-          }
-        ),
-        /* @__PURE__ */ t(n, { children: [
-          /* @__PURE__ */ e("label", { className: m, children: "Hidden" }),
-          /* @__PURE__ */ e("input", { className: v, value: d.hiddenExpr ?? "", onChange: (r) => o({ ...l, hiddenExpr: r.target.value || void 0 }), placeholder: "false" })
-        ] }),
-        /* @__PURE__ */ e(
-          B,
-          {
-            label: "Variant",
-            value: d.variant ?? "line",
-            options: [{ value: "pill", label: "Pill" }, { value: "line", label: "Line" }],
-            onChange: (r) => o({ ...l, variant: r })
-          }
-        ),
-        /* @__PURE__ */ t(n, { sx: { display: "grid", gridTemplateColumns: "1fr 1fr 1fr", gap: 1 }, children: [
-          /* @__PURE__ */ t(n, { children: [
-            /* @__PURE__ */ e("label", { className: m, children: "Active color" }),
-            /* @__PURE__ */ t(n, { sx: { display: "flex", alignItems: "center", gap: 0.5 }, children: [
-              /* @__PURE__ */ e("input", { type: "color", value: d.activeColor ?? "#6366f1", onChange: (r) => o({ ...l, activeColor: r.target.value }), style: { width: 28, height: 28, border: "1px solid #dee2e6", borderRadius: 6, cursor: "pointer", padding: 2, background: "#fff" } }),
-              /* @__PURE__ */ e("input", { className: v, value: d.activeColor ?? "", onChange: (r) => o({ ...l, activeColor: r.target.value || void 0 }), placeholder: "#6366f1", style: { flex: 1 } })
-            ] })
-          ] }),
-          /* @__PURE__ */ t(n, { children: [
-            /* @__PURE__ */ e("label", { className: m, children: "Active text" }),
-            /* @__PURE__ */ t(n, { sx: { display: "flex", alignItems: "center", gap: 0.5 }, children: [
-              /* @__PURE__ */ e("input", { type: "color", value: d.activeTextColor ?? "#ffffff", onChange: (r) => o({ ...l, activeTextColor: r.target.value }), style: { width: 28, height: 28, border: "1px solid #dee2e6", borderRadius: 6, cursor: "pointer", padding: 2, background: "#fff" } }),
-              /* @__PURE__ */ e("input", { className: v, value: d.activeTextColor ?? "", onChange: (r) => o({ ...l, activeTextColor: r.target.value || void 0 }), placeholder: "auto", style: { flex: 1 } })
-            ] })
-          ] }),
-          /* @__PURE__ */ t(n, { children: [
-            /* @__PURE__ */ e("label", { className: m, children: "Inactive text" }),
-            /* @__PURE__ */ t(n, { sx: { display: "flex", alignItems: "center", gap: 0.5 }, children: [
-              /* @__PURE__ */ e("input", { type: "color", value: d.inactiveTextColor ?? "#64748b", onChange: (r) => o({ ...l, inactiveTextColor: r.target.value }), style: { width: 28, height: 28, border: "1px solid #dee2e6", borderRadius: 6, cursor: "pointer", padding: 2, background: "#fff" } }),
-              /* @__PURE__ */ e("input", { className: v, value: d.inactiveTextColor ?? "", onChange: (r) => o({ ...l, inactiveTextColor: r.target.value || void 0 }), placeholder: "#64748b", style: { flex: 1 } })
-            ] })
-          ] })
-        ] }),
-        /* @__PURE__ */ t(n, { children: [
-          /* @__PURE__ */ e("label", { className: m, children: "Styles" }),
-          /* @__PURE__ */ e("input", { className: v, value: d.styles ?? "", onChange: (r) => o({ ...l, styles: r.target.value || void 0 }), placeholder: "None" })
-        ] }),
-        /* @__PURE__ */ e("span", { style: { ...R, marginTop: 4 }, children: "Spacing" }),
-        /* @__PURE__ */ e(
-          B,
-          {
-            label: "Height",
-            value: d.height ?? "auto",
-            options: [{ value: "auto", label: "Auto" }, { value: "fixed", label: "Fixed" }],
-            onChange: (r) => o({ ...l, height: r })
-          }
-        ),
-        /* @__PURE__ */ e(
-          B,
-          {
-            label: "Margin",
-            value: d.margin ?? "normal",
-            options: [{ value: "normal", label: "Normal" }, { value: "none", label: "None" }],
-            onChange: (r) => o({ ...l, margin: r })
-          }
-        )
-      ] }),
-      x && /* @__PURE__ */ t(n, { sx: { borderTop: "1px solid #e2e8f0", pt: 1.5 }, children: [
-        /* @__PURE__ */ e("span", { style: R, children: "Options" }),
-        /* @__PURE__ */ e(me, { options: d.options ?? [], onChange: (r) => o({ ...l, options: r }) })
-      ] }),
-      l.type === "array" && /* @__PURE__ */ t(n, { sx: { borderTop: "1px solid #e2e8f0", pt: 1.5, display: "flex", flexDirection: "column", gap: 1 }, children: [
-        /* @__PURE__ */ e("span", { style: R, children: "Array settings" }),
-        /* @__PURE__ */ t(n, { children: [
-          /* @__PURE__ */ e("label", { className: m, children: "Item type" }),
-          /* @__PURE__ */ e("select", { className: v, style: { cursor: "pointer" }, value: d.itemType ?? "text", onChange: (r) => o({ ...l, itemType: r.target.value }), children: Le.map((r) => /* @__PURE__ */ e("option", { value: r.value, children: r.label }, r.value)) })
-        ] }),
-        /* @__PURE__ */ t(n, { sx: { display: "grid", gridTemplateColumns: "1fr 1fr", gap: 1 }, children: [
-          /* @__PURE__ */ t(n, { children: [
-            /* @__PURE__ */ e("label", { className: m, children: "Item label" }),
-            /* @__PURE__ */ e("input", { className: v, value: d.itemLabel ?? "", onChange: (r) => o({ ...l, itemLabel: r.target.value || void 0 }), placeholder: 'e.g. "Member"' })
-          ] }),
-          /* @__PURE__ */ t(n, { children: [
-            /* @__PURE__ */ e("label", { className: m, children: "Add button label" }),
-            /* @__PURE__ */ e("input", { className: v, value: d.addLabel ?? "", onChange: (r) => o({ ...l, addLabel: r.target.value || void 0 }), placeholder: "Add item" })
-          ] })
-        ] }),
-        /* @__PURE__ */ t(n, { sx: { display: "grid", gridTemplateColumns: "1fr 1fr", gap: 1 }, children: [
-          /* @__PURE__ */ t(n, { children: [
-            /* @__PURE__ */ e("label", { className: m, children: "Min items" }),
-            /* @__PURE__ */ e("input", { type: "number", min: 0, className: v, value: d.minItems ?? "", onChange: (r) => o({ ...l, minItems: r.target.value ? Number(r.target.value) : void 0 }), placeholder: "0" })
-          ] }),
-          /* @__PURE__ */ t(n, { children: [
-            /* @__PURE__ */ e("label", { className: m, children: "Max items" }),
-            /* @__PURE__ */ e("input", { type: "number", min: 1, className: v, value: d.maxItems ?? "", onChange: (r) => o({ ...l, maxItems: r.target.value ? Number(r.target.value) : void 0 }), placeholder: "∞" })
-          ] })
-        ] }),
-        !["object", "array", "select"].includes(d.itemType ?? "text") && /* @__PURE__ */ t(n, { children: [
-          /* @__PURE__ */ e("label", { className: m, children: "Item placeholder" }),
-          /* @__PURE__ */ e("input", { className: v, value: d.itemPlaceholder ?? "", onChange: (r) => o({ ...l, itemPlaceholder: r.target.value || void 0 }), placeholder: "Enter value…" })
-        ] })
-      ] }),
-      /* @__PURE__ */ e(
-        He,
-        {
-          condition: l.condition,
-          onChange: (r) => o({ ...l, condition: r })
-        }
-      ),
-      /* @__PURE__ */ t(n, { sx: { borderTop: "1px solid #e2e8f0", pt: 1.5 }, children: [
-        /* @__PURE__ */ e(n, { component: "button", onClick: () => h((r) => !r), sx: { background: "none", border: "none", cursor: "pointer", display: "flex", alignItems: "center", gap: 0.5, p: 0, mb: i ? 1.25 : 0 }, children: /* @__PURE__ */ t("span", { style: { ...R, margin: 0, color: i ? "#6366f1" : "#94a3b8" }, children: [
-          i ? "▾" : "▸",
-          " Optional settings"
-        ] }) }),
-        /* @__PURE__ */ e(Ie, { in: i, children: /* @__PURE__ */ t(n, { sx: { display: "flex", flexDirection: "column", gap: 1.25 }, children: [
-          /* @__PURE__ */ t(n, { sx: { display: "grid", gridTemplateColumns: "1fr 1fr", gap: 1 }, children: [
-            /* @__PURE__ */ t(n, { children: [
-              /* @__PURE__ */ e("label", { className: m, children: "Placeholder" }),
-              /* @__PURE__ */ e("input", { className: v, value: l.placeholder ?? "", onChange: (r) => u("placeholder", r.target.value || void 0), placeholder: "Hint text…" })
-            ] }),
-            /* @__PURE__ */ t(n, { children: [
-              /* @__PURE__ */ e("label", { className: m, children: "Helper text" }),
-              /* @__PURE__ */ e("input", { className: v, value: l.helperText ?? "", onChange: (r) => u("helperText", r.target.value || void 0), placeholder: "Description…" })
-            ] })
-          ] }),
-          /* @__PURE__ */ t(n, { children: [
-            /* @__PURE__ */ e("label", { className: m, children: "Info tooltip" }),
-            /* @__PURE__ */ e("input", { className: v, value: l.info ?? "", onChange: (r) => u("info", r.target.value || void 0), placeholder: "Shown in ℹ tooltip" })
-          ] }),
-          /* @__PURE__ */ t(n, { sx: { display: "flex", flexWrap: "wrap", gap: 1.5 }, children: [
-            /* @__PURE__ */ e(D, { id: `${s}-req`, label: "Required", checked: !!l.required, onChange: (r) => u("required", r || void 0) }),
-            /* @__PURE__ */ e(D, { id: `${s}-dis`, label: "Disabled", checked: !!l.disabled, onChange: (r) => u("disabled", r || void 0) }),
-            /* @__PURE__ */ e(D, { id: `${s}-hid`, label: "Hidden", checked: !!l.hidden, onChange: (r) => u("hidden", r || void 0) }),
-            /* @__PURE__ */ e(D, { id: `${s}-opt`, label: "Show optional", checked: !!l.showOptional, onChange: (r) => u("showOptional", r || void 0) }),
-            /* @__PURE__ */ e(D, { id: `${s}-div`, label: "Divider after", checked: !!l.dividerAfter, onChange: (r) => u("dividerAfter", r || void 0) }),
-            /* @__PURE__ */ e(D, { id: `${s}-frm`, label: "Formula input", checked: !!l.formula, onChange: (r) => u("formula", r || void 0) })
-          ] })
-        ] }) })
-      ] })
-    ] }),
-    !a && /* @__PURE__ */ t(n, { sx: { borderTop: "1px solid #e2e8f0", px: 2.5, py: 1.5, display: "flex", gap: 1, justifyContent: "flex-end", bgcolor: "#f8fafc", flexShrink: 0 }, children: [
-      /* @__PURE__ */ e(n, { component: "button", onClick: c, sx: { background: "none", border: "1px solid #dee2e6", cursor: "pointer", fontSize: 13, fontWeight: 500, px: 2, py: 0.75, borderRadius: "7px", color: "#6c757d", "&:hover": { bgcolor: "#f8f9fa" } }, children: "Cancel" }),
-      /* @__PURE__ */ t(n, { component: "button", onClick: p, sx: { border: "none", cursor: "pointer", fontSize: 13, fontWeight: 600, px: 2.5, py: 0.75, borderRadius: "7px", bgcolor: "#6366f1", color: "#fff", display: "flex", alignItems: "center", gap: 0.75, "&:hover": { bgcolor: "#4f46e5" } }, children: [
-        /* @__PURE__ */ e(G, { size: 15 }),
-        " Save"
-      ] })
-    ] })
-  ] });
-}
-const H = {
-  text: "#0f172a",
-  textMuted: "#64748b",
-  borderInput: "rgba(0,0,0,0.23)",
-  bg: "#ffffff"
-}, qe = {
-  md: "6px"
-}, ve = {
-  sm: 11,
-  md: 13
-}, ne = {
-  width: "100%",
-  fontSize: ve.md,
-  fontFamily: "inherit",
-  padding: "8px 12px",
-  border: `1px solid ${H.borderInput}`,
-  borderRadius: qe.md,
-  outline: "none",
-  background: H.bg,
-  color: H.text,
-  boxSizing: "border-box",
-  transition: "border-color 0.15s, box-shadow 0.15s"
-};
-function ce() {
-  return { type: "text", id: "", label: "", colSpan: 12 };
-}
-function Ye(l) {
-  return l.type === "object" || l.type === "array" || l.type === "schema";
-}
-function Ge(l) {
-  if (l.type === "object") return "Child Fields";
-  if (l.type === "schema") return "Schema Fields";
-  const o = l.itemType ?? "text";
-  return o === "object" ? "Item Fields" : o === "select" ? "Item Options" : "Item Config";
-}
-function Je({ field: l, onChange: o }) {
-  var a;
-  const p = l, c = p.itemType ?? "text";
-  if (l.type === "object")
-    return /* @__PURE__ */ t(n, { sx: { p: 2.5 }, children: [
-      /* @__PURE__ */ e(S, { sx: { fontSize: 12, color: "#64748b", mb: 2 }, children: "Define the fields nested inside this object. Each child field can itself be an object or array." }),
-      /* @__PURE__ */ e(
-        U,
-        {
-          value: l.children ?? [],
-          onChange: (i) => o({ ...l, children: i }),
-          label: "Child fields"
-        }
-      )
-    ] });
-  if (l.type === "schema")
-    return /* @__PURE__ */ t(n, { sx: { p: 2.5 }, children: [
-      /* @__PURE__ */ e(S, { sx: { fontSize: 12, color: "#64748b", mb: 2 }, children: "Define the fields inside this schema. When the form is filled, their values are collected into a single object as this field's value." }),
-      /* @__PURE__ */ e(
-        U,
-        {
-          value: l.children ?? [],
-          onChange: (i) => o({ ...l, children: i }),
-          label: "Schema fields"
-        }
-      )
-    ] });
-  if (l.type === "array") {
-    if (c === "object")
-      return /* @__PURE__ */ t(n, { sx: { p: 2.5 }, children: [
-        /* @__PURE__ */ e(S, { sx: { fontSize: 12, color: "#64748b", mb: 2 }, children: "Define the fields for each item in the array. Each item will be an object with these fields." }),
-        /* @__PURE__ */ e(
-          U,
-          {
-            value: p.itemFields ?? [],
-            onChange: (i) => o({ ...l, itemFields: i }),
-            label: "Item fields"
-          }
-        )
-      ] });
-    if (c === "select") {
-      const i = p.itemOptions ?? [];
-      return /* @__PURE__ */ t(n, { sx: { p: 2.5 }, children: [
-        /* @__PURE__ */ e(S, { sx: { fontSize: 12, color: "#64748b", mb: 2 }, children: "Options available in each select item." }),
-        /* @__PURE__ */ e(n, { sx: { display: "flex", flexDirection: "column", gap: 0.5, mb: 0.75 }, children: i.map((h, s) => /* @__PURE__ */ t(n, { sx: { display: "flex", gap: 0.5, alignItems: "center" }, children: [
-          /* @__PURE__ */ e(
-            "input",
-            {
-              style: { ...ne, flex: 1, padding: "6px 10px" },
-              placeholder: "Label",
-              value: h.label,
-              onChange: (d) => {
-                const x = i.map((y, N) => N === s ? { ...y, label: d.target.value } : y);
-                o({ ...l, itemOptions: x });
-              }
-            }
-          ),
-          /* @__PURE__ */ e(
-            "input",
-            {
-              style: { ...ne, flex: 1, padding: "6px 10px" },
-              placeholder: "Value",
-              value: h.value,
-              onChange: (d) => {
-                const x = i.map((y, N) => N === s ? { ...y, value: d.target.value } : y);
-                o({ ...l, itemOptions: x });
-              }
-            }
-          ),
-          /* @__PURE__ */ e(
-            n,
-            {
-              component: "button",
-              onClick: () => o({ ...l, itemOptions: i.filter((d, x) => x !== s) }),
-              sx: { background: "none", border: "none", cursor: "pointer", color: "#94a3b8", display: "flex", p: 0.25, "&:hover": { color: "#dc2626" } },
-              children: "✕"
-            }
-          )
-        ] }, s)) }),
-        /* @__PURE__ */ e(
-          n,
-          {
-            component: "button",
-            onClick: () => o({ ...l, itemOptions: [...i, { label: "", value: "" }] }),
-            sx: { display: "flex", alignItems: "center", gap: 0.5, background: "none", border: "1px dashed #dee2e6", cursor: "pointer", fontSize: 11, fontWeight: 600, px: 1, py: 0.5, borderRadius: "6px", color: "#6366f1", width: "100%", justifyContent: "center", "&:hover": { borderColor: "#6366f1", bgcolor: "#f5f3ff" } },
-            children: "+ Add option"
-          }
-        )
-      ] });
-    }
-    if (c === "array") {
-      const i = ((a = p.itemSchema) == null ? void 0 : a.itemType) ?? "text", h = [
-        { value: "text", label: "Text" },
-        { value: "number", label: "Number" },
-        { value: "email", label: "Email" },
-        { value: "url", label: "URL" },
-        { value: "password", label: "Password" },
-        { value: "select", label: "Select" },
-        { value: "object", label: "Object" }
-      ];
-      return /* @__PURE__ */ t(n, { sx: { p: 2.5 }, children: [
-        /* @__PURE__ */ e(S, { sx: { fontSize: 12, color: "#64748b", mb: 2 }, children: "Each item is itself an array. Configure the type of items inside the nested array." }),
-        /* @__PURE__ */ e("label", { style: { fontSize: ve.sm, fontWeight: 600, color: H.textMuted, display: "block", marginBottom: 3 }, children: "Nested item type" }),
-        /* @__PURE__ */ e(
-          "select",
-          {
-            style: { ...ne, padding: "6px 10px", cursor: "pointer" },
-            value: i,
-            onChange: (s) => o({ ...l, itemSchema: { ...p.itemSchema ?? {}, itemType: s.target.value } }),
-            children: h.map((s) => /* @__PURE__ */ e("option", { value: s.value, children: s.label }, s.value))
-          }
-        )
-      ] });
-    }
-    return /* @__PURE__ */ e(n, { sx: { p: 2.5 }, children: /* @__PURE__ */ t(n, { sx: { border: "1.5px dashed #e2e8f0", borderRadius: "8px", py: 3, textAlign: "center" }, children: [
-      /* @__PURE__ */ t(S, { sx: { fontSize: 13, color: "#94a3b8" }, children: [
-        "No extra configuration needed for ",
-        /* @__PURE__ */ e("strong", { children: c }),
-        " items."
-      ] }),
-      /* @__PURE__ */ e(S, { sx: { fontSize: 11, color: "#cbd5e1", mt: 0.5 }, children: "Item placeholder and labels are set in the previous step." })
-    ] }) });
-  }
-  return null;
-}
-function Ke({ field: l }) {
-  var h;
-  const [o, p] = T({}), c = l.id ?? l.name ?? "preview", a = [
-    { value: 3, label: "1/4" },
-    { value: 4, label: "1/3" },
-    { value: 6, label: "1/2" },
-    { value: 8, label: "2/3" },
-    { value: 12, label: "Full" }
-  ], i = l.colSpan && l.colSpan < 12 ? ((h = a.find((s) => s.value === l.colSpan)) == null ? void 0 : h.label) ?? l.colSpan : "Full";
-  return /* @__PURE__ */ t(n, { sx: { p: 2.5 }, children: [
-    /* @__PURE__ */ t(n, { sx: { display: "flex", alignItems: "center", mb: 2, px: 1.25, py: 0.75, bgcolor: "#f0fdf4", border: "1px solid #bbf7d0", borderRadius: "7px" }, children: [
-      /* @__PURE__ */ e(S, { sx: { fontSize: 11, color: "#15803d", fontWeight: 500, flex: 1 }, children: "Live preview — interact to test the field" }),
-      /* @__PURE__ */ t(S, { sx: { fontSize: 11, color: "#64748b" }, children: [
-        "Width: ",
-        i
-      ] })
-    ] }),
-    /* @__PURE__ */ e(
-      ie,
-      {
-        schema: { layout: "flat", fields: [l] },
-        initialValues: { [c]: l.type === "array" ? [] : l.type === "object" || l.type === "schema" ? {} : "" },
-        onSubmit: () => {
-        },
-        conditionConfig: o,
-        onConditionConfigChange: p
-      }
-    )
-  ] });
-}
-function re({ open: l, initial: o, onSave: p, onClose: c, editMode: a = !1 }) {
-  const [i, h] = T(1), [s, d] = T(() => o ?? ce());
-  function x() {
-    d(o ?? ce()), h(1);
-  }
-  const y = Ye(s), N = y ? 3 : 2, u = y ? ["Configure", Ge(s), "Preview"] : ["Configure", "Preview"], r = !!(s.id || s.name) && !!s.type;
-  function b() {
-    h((z) => Math.min(z + 1, N));
-  }
-  function f() {
-    h((z) => Math.max(z - 1, 1));
-  }
-  function C() {
-    p(s), c();
-  }
-  const g = i - 1, I = i === N, w = y && i === 3 || !y && i === 2;
-  return /* @__PURE__ */ t(
-    he,
-    {
-      open: l,
-      onClose: c,
-      TransitionProps: { onEnter: x },
-      maxWidth: "sm",
-      fullWidth: !0,
-      PaperProps: { sx: { borderRadius: "12px", overflow: "hidden", display: "flex", flexDirection: "column", maxHeight: "90vh" } },
-      children: [
-        /* @__PURE__ */ t(n, { sx: { px: 2.5, pt: 1.75, pb: 0, borderBottom: "1px solid #e2e8f0", flexShrink: 0 }, children: [
-          /* @__PURE__ */ t(n, { sx: { display: "flex", alignItems: "center", mb: 1.5 }, children: [
-            /* @__PURE__ */ e(S, { sx: { fontSize: 14, fontWeight: 700, color: "#0f172a", flex: 1 }, children: a ? "Edit Field" : "Add Field" }),
-            /* @__PURE__ */ e(Y, { size: "small", onClick: c, sx: { color: "#94a3b8" }, children: /* @__PURE__ */ e(_, { size: 17 }) })
-          ] }),
-          /* @__PURE__ */ e(Fe, { activeStep: g, sx: { pb: 1.5 }, children: u.map((z, E) => /* @__PURE__ */ e(Oe, { completed: g > E, children: /* @__PURE__ */ e(Re, { children: z }) }, z)) })
-        ] }),
-        /* @__PURE__ */ t(n, { sx: { flex: 1, overflowY: "auto" }, children: [
-          i === 1 && /* @__PURE__ */ e(ge, { field: s, onChange: d, onSave: b, onCancel: c, noFooter: !0 }),
-          i === 2 && y && /* @__PURE__ */ e(Je, { field: s, onChange: d }),
-          w && /* @__PURE__ */ e(Ke, { field: s })
-        ] }),
-        /* @__PURE__ */ t(n, { sx: { borderTop: "1px solid #e2e8f0", px: 2.5, py: 1.5, display: "flex", alignItems: "center", gap: 1, flexShrink: 0, bgcolor: "#f8fafc" }, children: [
-          i > 1 && /* @__PURE__ */ t(n, { component: "button", onClick: f, sx: { display: "flex", alignItems: "center", gap: 0.5, background: "none", border: "none", cursor: "pointer", fontSize: 13, fontWeight: 500, color: "#6c757d", px: 0, "&:hover": { color: "#0f172a" } }, children: [
-            /* @__PURE__ */ e(fe, { size: 14 }),
-            " Back"
-          ] }),
-          /* @__PURE__ */ e(n, { sx: { flex: 1 } }),
-          /* @__PURE__ */ e(n, { component: "button", onClick: c, sx: { background: "none", border: "1px solid #dee2e6", cursor: "pointer", fontSize: 13, fontWeight: 500, px: 2, py: 0.75, borderRadius: "7px", color: "#6c757d", "&:hover": { bgcolor: "#f8f9fa" } }, children: "Cancel" }),
-          I ? /* @__PURE__ */ t(n, { component: "button", onClick: C, sx: { border: "none", cursor: "pointer", fontSize: 13, fontWeight: 600, px: 2.5, py: 0.75, borderRadius: "7px", bgcolor: "#6366f1", color: "#fff", display: "flex", alignItems: "center", gap: 0.75, "&:hover": { bgcolor: "#4f46e5" } }, children: [
-            /* @__PURE__ */ e(G, { size: 15 }),
-            " ",
-            a ? "Save changes" : "Add field"
-          ] }) : /* @__PURE__ */ e(n, { component: "button", onClick: b, disabled: !r, sx: { border: "none", cursor: r ? "pointer" : "not-allowed", fontSize: 13, fontWeight: 600, px: 2.5, py: 0.75, borderRadius: "7px", bgcolor: r ? "#6366f1" : "#c7d2fe", color: "#fff", "&:hover": { bgcolor: r ? "#4f46e5" : "#c7d2fe" } }, children: "Next →" })
-        ] })
-      ]
-    }
-  );
-}
-function Xe({ field: l, index: o, total: p, onEdit: c, onDelete: a, onMoveUp: i, onMoveDown: h }) {
-  const s = l.label || l.id || l.name || "Untitled", d = l.id ?? l.name ?? "";
-  return /* @__PURE__ */ t(n, { sx: { display: "flex", alignItems: "center", gap: 1, px: 1.5, py: 1, border: "1px solid #e2e8f0", borderRadius: "8px", bgcolor: "#fff" }, children: [
-    /* @__PURE__ */ t(n, { sx: { display: "flex", flexDirection: "column", gap: 0.25, color: "#cbd5e1" }, children: [
-      /* @__PURE__ */ e(n, { component: "button", onClick: i, disabled: o === 0, sx: { background: "none", border: "none", p: 0, cursor: o === 0 ? "default" : "pointer", color: o === 0 ? "#e2e8f0" : "#94a3b8", lineHeight: 1, fontSize: 10, "&:hover": { color: o === 0 ? "#e2e8f0" : "#475569" } }, children: "▲" }),
-      /* @__PURE__ */ e(n, { component: "button", onClick: h, disabled: o === p - 1, sx: { background: "none", border: "none", p: 0, cursor: o === p - 1 ? "default" : "pointer", color: o === p - 1 ? "#e2e8f0" : "#94a3b8", lineHeight: 1, fontSize: 10, "&:hover": { color: o === p - 1 ? "#e2e8f0" : "#475569" } }, children: "▼" })
-    ] }),
-    /* @__PURE__ */ e(n, { sx: { fontSize: 10, fontWeight: 700, px: 0.75, py: 0.2, borderRadius: "4px", bgcolor: "#eef2ff", color: "#6366f1", flexShrink: 0 }, children: l.type }),
-    /* @__PURE__ */ t(n, { sx: { flex: 1, minWidth: 0 }, children: [
-      /* @__PURE__ */ t(S, { sx: { fontSize: 13, fontWeight: 600, color: "#0f172a", overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" }, children: [
-        s,
-        l.required && /* @__PURE__ */ e(n, { component: "span", sx: { color: "#dc3545", ml: 0.25 }, children: "*" })
-      ] }),
-      /* @__PURE__ */ e(S, { sx: { fontSize: 11, color: "#94a3b8", fontFamily: "monospace" }, children: d })
-    ] }),
-    /* @__PURE__ */ e(A, { title: "Edit field", placement: "top", children: /* @__PURE__ */ e(n, { component: "button", onClick: c, sx: { background: "none", border: "none", cursor: "pointer", display: "flex", alignItems: "center", justifyContent: "center", width: 28, height: 28, borderRadius: "6px", p: 0, color: "#94a3b8", "&:hover": { bgcolor: "#f1f5f9", color: "#475569" } }, children: /* @__PURE__ */ e(De, { size: 14 }) }) }),
-    /* @__PURE__ */ e(A, { title: "Remove field", placement: "top", children: /* @__PURE__ */ e(n, { component: "button", onClick: a, sx: { background: "none", border: "none", cursor: "pointer", display: "flex", alignItems: "center", justifyContent: "center", width: 28, height: 28, borderRadius: "6px", p: 0, color: "#94a3b8", "&:hover": { bgcolor: "#fee2e2", color: "#dc2626" } }, children: /* @__PURE__ */ e(Pe, { size: 16 }) }) })
-  ] });
-}
-function Ze({ open: l, value: o, onSave: p, onClose: c }) {
-  const [a, i] = T(o), [h, s] = T(null);
-  function d() {
-    i(o), s(null);
-  }
-  function x(b) {
-    i((f) => f.filter((C, g) => g !== b));
-  }
-  function y(b, f) {
-    i((C) => {
-      const g = [...C], I = b + f;
-      return I < 0 || I >= g.length ? C : ([g[b], g[I]] = [g[I], g[b]], g);
-    });
-  }
-  function N(b) {
-    h !== null && (i((f) => {
-      const C = [...f];
-      return C[h] = b, C;
-    }), s(null));
-  }
-  function u() {
-    p(a), c();
-  }
-  const r = JSON.stringify(a) !== JSON.stringify(o);
-  return /* @__PURE__ */ t(q, { children: [
-    /* @__PURE__ */ t(
-      he,
-      {
-        open: l,
-        onClose: c,
-        TransitionProps: { onEnter: d },
-        maxWidth: "sm",
-        fullWidth: !0,
-        PaperProps: { sx: { borderRadius: "12px", overflow: "hidden", display: "flex", flexDirection: "column", maxHeight: "85vh" } },
-        children: [
-          /* @__PURE__ */ t(n, { sx: { display: "flex", alignItems: "center", px: 2.5, py: 1.75, borderBottom: "1px solid #e2e8f0", flexShrink: 0 }, children: [
-            /* @__PURE__ */ t(n, { sx: { flex: 1 }, children: [
-              /* @__PURE__ */ e(S, { sx: { fontSize: 14, fontWeight: 700, color: "#0f172a" }, children: "Edit Schema" }),
-              /* @__PURE__ */ t(S, { sx: { fontSize: 11, color: "#94a3b8" }, children: [
-                a.length,
-                " field",
-                a.length !== 1 ? "s" : "",
-                " defined"
-              ] })
-            ] }),
-            /* @__PURE__ */ e(Y, { size: "small", onClick: c, sx: { color: "#94a3b8" }, children: /* @__PURE__ */ e(_, { size: 17 }) })
-          ] }),
-          /* @__PURE__ */ e(n, { sx: { flex: 1, overflowY: "auto", p: 2.5 }, children: a.length === 0 ? /* @__PURE__ */ e(n, { sx: { border: "1.5px dashed rgba(0,0,0,0.12)", borderRadius: "8px", py: 4, textAlign: "center" }, children: /* @__PURE__ */ e(S, { sx: { fontSize: 13, color: "#94a3b8" }, children: "No fields defined yet" }) }) : /* @__PURE__ */ e(n, { sx: { display: "flex", flexDirection: "column", gap: 0.75 }, children: a.map((b, f) => /* @__PURE__ */ e(
-            Xe,
-            {
-              field: b,
-              index: f,
-              total: a.length,
-              onEdit: () => s(f),
-              onDelete: () => x(f),
-              onMoveUp: () => y(f, -1),
-              onMoveDown: () => y(f, 1)
-            },
-            `${b.id ?? b.name}-${f}`
-          )) }) }),
-          /* @__PURE__ */ t(n, { sx: { borderTop: "1px solid #e2e8f0", px: 2.5, py: 1.5, display: "flex", alignItems: "center", gap: 1, flexShrink: 0, bgcolor: "#f8fafc" }, children: [
-            r ? /* @__PURE__ */ e(S, { sx: { fontSize: 11, color: "#f59e0b", fontWeight: 500, flex: 1 }, children: "Unsaved changes" }) : /* @__PURE__ */ e(n, { sx: { flex: 1 } }),
-            /* @__PURE__ */ e(n, { component: "button", onClick: c, sx: { background: "none", border: "1px solid #dee2e6", cursor: "pointer", fontSize: 13, fontWeight: 500, px: 2, py: 0.75, borderRadius: "7px", color: "#6c757d", "&:hover": { bgcolor: "#f8f9fa" } }, children: "Cancel" }),
-            /* @__PURE__ */ t(n, { component: "button", onClick: u, sx: { border: "none", cursor: "pointer", fontSize: 13, fontWeight: 600, px: 2.5, py: 0.75, borderRadius: "7px", bgcolor: "#6366f1", color: "#fff", display: "flex", alignItems: "center", gap: 0.75, "&:hover": { bgcolor: "#4f46e5" } }, children: [
-              /* @__PURE__ */ e(G, { size: 15 }),
-              " Done"
-            ] })
-          ] })
-        ]
-      }
-    ),
-    h !== null && /* @__PURE__ */ e(
-      re,
-      {
-        open: h !== null,
-        initial: a[h],
-        onSave: N,
-        onClose: () => s(null),
-        editMode: !0
-      }
-    )
-  ] });
-}
-function ye(l) {
-  const o = {};
-  for (const p of l) {
-    const c = p.id ?? p.name ?? "";
-    c && (p.type === "array" ? o[c] = [] : p.type === "object" || p.type === "schema" ? o[c] = ye(p.children ?? []) : o[c] = "");
-  }
-  return o;
-}
-function U({
-  value: l,
-  onChange: o,
-  suggestions: p,
-  label: c = "Fields",
-  onPayload: a,
-  validate: i = !0,
-  onValidityChange: h,
-  variableGroups: s,
-  initialValues: d,
-  initialFormulaConfig: x,
-  initialConditionConfig: y
-}) {
-  const [N, u] = T(!1), [r, b] = T(!1), [f, C] = T(null), [g, I] = T(x ?? {}), [w, z] = T(y ?? {}), E = M(d ?? {}), j = P(() => ye(l), [l]), K = P(
-    () => d && Object.keys(d).length > 0 ? { ...j, ...d } : j,
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-    [j, d]
-  ), L = P(
-    () => i ? pe(l) : void 0,
-    [i, l]
-  );
-  de(() => {
-    a && a({
-      schema: l,
-      formulaConfig: g,
-      conditionConfig: w,
-      conditionExpressions: se(w),
-      values: E.current,
-      evaluationPayload: oe({ values: E.current, conditionConfig: w })
-    });
-  }, [w, g, l]);
-  const X = te((F) => {
-    E.current = F, a && a({
-      schema: l,
-      formulaConfig: g,
-      conditionConfig: w,
-      conditionExpressions: se(w),
-      values: F,
-      evaluationPayload: oe({ values: F, conditionConfig: w })
-    });
-  }, [l, g, w, a]);
-  function $(F) {
-    o([...l, F]);
-  }
-  function Z(F) {
-    if (!f) return;
-    const { containerFieldId: V, tabId: Q } = f, ee = l.map((O) => {
-      if ((O.id ?? O.name) !== V) return O;
-      const le = O.tabs ?? [];
-      return {
-        ...O,
-        tabs: le.map(
-          (W) => W.id === Q ? { ...W, fields: [...W.fields ?? [], F] } : W
-        )
-      };
-    });
-    o(ee), C(null);
-  }
-  function k(F, V, Q) {
-    const ee = l.map((O) => {
-      if ((O.id ?? O.name) !== F) return O;
-      const le = O.tabs ?? [];
-      return {
-        ...O,
-        tabs: le.map(
-          (W) => W.id === V ? { ...W, fields: (W.fields ?? []).filter((el, Se) => Se !== Q) } : W
-        )
-      };
-    });
-    o(ee);
-  }
-  const Ce = P(() => ({
-    openAddFieldDialog: (F, V) => C({ containerFieldId: F, tabId: V }),
-    removeFieldFromTab: k
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }), [l, o]), ae = /* @__PURE__ */ t("div", { className: "schema-builder-root", children: [
-    l.length > 0 && /* @__PURE__ */ e("div", { className: "schema-builder-header", children: /* @__PURE__ */ t("div", { className: "schema-builder-actions", children: [
-      /* @__PURE__ */ e(A, { title: "Edit schema", placement: "top", children: /* @__PURE__ */ t(
-        "button",
-        {
-          className: "sb-btn sb-btn-outline",
-          onClick: () => b(!0),
-          children: [
-            /* @__PURE__ */ e(be, { size: 13 }),
-            " Edit Schema"
-          ]
-        }
-      ) }),
-      /* @__PURE__ */ e(A, { title: "Add a new field", placement: "top", children: /* @__PURE__ */ t(
-        "button",
-        {
-          className: "sb-btn sb-btn-primary",
-          onClick: () => u(!0),
-          children: [
-            /* @__PURE__ */ e(J, { size: 14 }),
-            " Add Field"
-          ]
-        }
-      ) })
-    ] }) }),
-    l.length > 0 ? /* @__PURE__ */ e(ze.Provider, { value: Ce, children: /* @__PURE__ */ e(
-      ie,
-      {
-        schema: { layout: "flat", fields: l },
-        initialValues: K,
-        onSubmit: () => {
-        },
-        validationSchema: L,
-        onValidityChange: h,
-        onValuesChange: a ? X : void 0,
-        formulaConfig: g,
-        onFormulaConfigChange: I,
-        conditionConfig: w,
-        onConditionConfigChange: z
-      }
-    ) }) : /* @__PURE__ */ t("div", { className: "schema-builder-empty-state", children: [
-      /* @__PURE__ */ e(_e, { size: 40, className: "schema-builder-empty-icon" }),
-      /* @__PURE__ */ e("p", { className: "schema-builder-empty-title", children: "Tell us what fields should be in the list, and assign values to them." }),
-      /* @__PURE__ */ e("div", { className: "schema-builder-empty-actions", children: /* @__PURE__ */ e(
-        "button",
-        {
-          className: "btn",
-          onClick: () => u(!0),
-          children: "Add field"
-        }
-      ) })
-    ] }),
-    /* @__PURE__ */ e(
-      re,
-      {
-        open: N,
-        onSave: $,
-        onClose: () => u(!1)
-      }
-    ),
-    /* @__PURE__ */ e(
-      Ze,
-      {
-        open: r,
-        value: l,
-        onSave: o,
-        onClose: () => b(!1)
-      }
-    ),
-    /* @__PURE__ */ e(
-      re,
-      {
-        open: !!f,
-        onSave: Z,
-        onClose: () => C(null)
-      }
-    )
-  ] });
-  return s ? /* @__PURE__ */ t(Te, { groups: s, children: [
-    /* @__PURE__ */ e(we, { width: 260, mode: "popover" }),
-    ae
-  ] }) : ae;
-}
-function Qe({ fields: l, onOpen: o }) {
-  return /* @__PURE__ */ t(n, { sx: { border: "1px solid #e2e8f0", borderRadius: "8px", bgcolor: "#fff", overflow: "hidden" }, children: [
-    l.length > 0 ? /* @__PURE__ */ e(n, { sx: { px: 1.5, py: 1.25, display: "flex", flexWrap: "wrap", gap: 0.5 }, children: l.map((p, c) => {
-      const a = p.id ?? p.name ?? "";
-      return /* @__PURE__ */ e(A, { title: `${p.type} · ${a}`, placement: "top", children: /* @__PURE__ */ e(
-        We,
-        {
-          label: p.label || a,
-          size: "small",
-          sx: { fontSize: 11, fontWeight: 500, height: 22, bgcolor: "#f1f5f9", color: "#334155", border: "1px solid #e2e8f0", "& .MuiChip-label": { px: 1 } }
-        }
-      ) }, c);
-    }) }) : /* @__PURE__ */ e(n, { sx: { px: 1.5, py: 1.5 }, children: /* @__PURE__ */ e(S, { sx: { fontSize: 12, color: "#94a3b8" }, children: "No fields defined yet" }) }),
-    /* @__PURE__ */ e(Ae, { sx: { borderColor: "#f1f5f9" } }),
-    /* @__PURE__ */ t(n, { onClick: o, sx: { display: "flex", alignItems: "center", gap: 0.75, px: 1.5, py: 1, cursor: "pointer", "&:hover": { bgcolor: "#f8fafc" }, transition: "background 0.12s" }, children: [
-      l.length === 0 ? /* @__PURE__ */ e(J, { size: 14, color: "#6366f1" }) : /* @__PURE__ */ e(be, { size: 13, color: "#6366f1" }),
-      /* @__PURE__ */ e(S, { sx: { fontSize: 12, fontWeight: 600, color: "#6366f1", flex: 1 }, children: l.length === 0 ? "Add fields" : "Configure fields" }),
-      /* @__PURE__ */ e(Me, { size: 13, color: "#94a3b8" })
-    ] })
-  ] });
-}
-function cl({
-  value: l,
-  onChange: o,
-  suggestions: p,
-  onPayload: c,
-  onDone: a,
-  validate: i,
-  onValidityChange: h,
-  label: s = "Fields",
-  drawerTitle: d = "Configure Fields",
-  drawerWidth: x = 580
-}) {
-  const [y, N] = T(!1), [u, r] = T({ type: "list" }), [b, f] = T(l), C = M(null), g = M(void 0), I = M(void 0), w = M(void 0), [z, E] = T(null);
-  function j() {
-    f(l), r({ type: "list" }), N(!0);
-  }
-  function K() {
-    const k = C.current;
-    k && (g.current = k.values, I.current = k.formulaConfig, w.current = k.conditionConfig), o(b), N(!1), a == null || a(b, k);
-  }
-  function L() {
-    const k = C.current;
-    k && (g.current = k.values, I.current = k.formulaConfig, w.current = k.conditionConfig), f(l), N(!1);
-  }
-  function X() {
-    if (u.type !== "edit" || !z) return;
-    const k = [...b];
-    k[u.index] = z, f(k), r({ type: "list" }), E(null);
-  }
-  function $() {
-    r({ type: "list" }), E(null);
-  }
-  const Z = JSON.stringify(b) !== JSON.stringify(l);
-  return u.type === "edit" && b[u.index], /* @__PURE__ */ t(q, { children: [
-    /* @__PURE__ */ t(n, { children: [
-      /* @__PURE__ */ e(S, { sx: { fontSize: 12, fontWeight: 700, color: "#64748b", textTransform: "uppercase", letterSpacing: 0.5, mb: 0.75 }, children: s }),
-      /* @__PURE__ */ e(Qe, { fields: l, onOpen: j })
-    ] }),
-    /* @__PURE__ */ t(
-      Ee,
-      {
-        anchor: "right",
-        open: y,
-        onClose: L,
-        PaperProps: { sx: { width: x, display: "flex", flexDirection: "column", boxShadow: "-4px 0 24px rgba(0,0,0,0.12)", overflow: "hidden" } },
-        children: [
-          /* @__PURE__ */ t(n, { sx: { display: "flex", alignItems: "center", px: 2, py: 1.5, borderBottom: "1px solid #e2e8f0", flexShrink: 0, gap: 1 }, children: [
-            u.type === "edit" && /* @__PURE__ */ e(A, { title: "Back to fields", placement: "bottom", children: /* @__PURE__ */ e(Y, { size: "small", onClick: $, sx: { color: "#64748b" }, children: /* @__PURE__ */ e(fe, { size: 17 }) }) }),
-            /* @__PURE__ */ t(n, { sx: { flex: 1 }, children: [
-              /* @__PURE__ */ e(S, { sx: { fontSize: 14, fontWeight: 700, color: "#0f172a" }, children: u.type === "edit" ? (z == null ? void 0 : z.label) || (z == null ? void 0 : z.id) || "Edit field" : d }),
-              /* @__PURE__ */ e(S, { sx: { fontSize: 11, color: "#94a3b8" }, children: u.type === "edit" ? "Configure field properties" : `${b.length} field${b.length !== 1 ? "s" : ""} defined` })
-            ] }),
-            u.type === "list" && /* @__PURE__ */ e(A, { title: "Close", placement: "bottom", children: /* @__PURE__ */ e(Y, { size: "small", onClick: L, sx: { color: "#94a3b8" }, children: /* @__PURE__ */ e(_, { size: 17 }) }) })
-          ] }),
-          u.type === "list" && /* @__PURE__ */ t(q, { children: [
-            /* @__PURE__ */ e(n, { sx: { flex: 1, overflowY: "auto", p: 2.5 }, children: /* @__PURE__ */ e(
-              U,
-              {
-                value: b,
-                onChange: f,
-                suggestions: p,
-                onPayload: (k) => {
-                  C.current = k, g.current = k.values, I.current = k.formulaConfig, w.current = k.conditionConfig, c == null || c(k);
-                },
-                validate: i,
-                onValidityChange: h,
-                label: s,
-                initialValues: g.current,
-                initialFormulaConfig: I.current,
-                initialConditionConfig: w.current
-              }
-            ) }),
-            /* @__PURE__ */ t(n, { sx: { borderTop: "1px solid #e2e8f0", px: 2.5, py: 1.5, display: "flex", alignItems: "center", gap: 1, flexShrink: 0, bgcolor: "#f8fafc" }, children: [
-              Z ? /* @__PURE__ */ e(S, { sx: { fontSize: 11, color: "#f59e0b", fontWeight: 500, flex: 1 }, children: "Unsaved changes" }) : /* @__PURE__ */ e(n, { sx: { flex: 1 } }),
-              /* @__PURE__ */ e(n, { component: "button", onClick: L, sx: { background: "none", border: "1px solid #dee2e6", cursor: "pointer", fontSize: 13, fontWeight: 500, px: 2, py: 0.75, borderRadius: "7px", color: "#6c757d", "&:hover": { bgcolor: "#f8f9fa" } }, children: "Cancel" }),
-              /* @__PURE__ */ t(n, { component: "button", onClick: K, sx: { border: "none", cursor: "pointer", fontSize: 13, fontWeight: 600, px: 2.5, py: 0.75, borderRadius: "7px", bgcolor: "#6366f1", color: "#fff", display: "flex", alignItems: "center", gap: 0.75, "&:hover": { bgcolor: "#4f46e5" } }, children: [
-                /* @__PURE__ */ e(G, { size: 15 }),
-                " Done"
-              ] })
-            ] })
-          ] }),
-          u.type === "edit" && z && /* @__PURE__ */ e(
-            ge,
-            {
-              field: z,
-              onChange: E,
-              onSave: X,
-              onCancel: $
-            }
-          )
-        ]
-      }
-    )
-  ] });
-}
-export {
-  je as F,
-  U as S,
-  cl as a,
-  sl as u
-};