@arudovwen/form-builder-react 1.4.45 → 1.4.46

package/dist/form-builder.es.js

@@ -1,14 +1,14 @@
 import mi, { createContext as mo, useState as P, useMemo as oi, useEffect as I, forwardRef as ye, createElement as Sn, Fragment as Zi, useContext as ji, useRef as Di, useCallback as $, memo as an } from "react";
 import { v4 as Ai } from "uuid";
 import bo from "react-datepicker";
-import { Listbox as di, Transition as Bi, Combobox as Pi, ComboboxInput as vo, ComboboxButton as ho, ComboboxOptions as po, ComboboxOption as go } from "@headlessui/react";
+import { Listbox as di, Transition as Ei, Combobox as Pi, ComboboxInput as vo, ComboboxButton as ho, ComboboxOptions as po, ComboboxOption as go } from "@headlessui/react";
 import { toast as ki, Toaster as Ae } from "sonner";
 import Ii from "axios";
 import sn from "react-currency-input-field";
 import { createPortal as fo } from "react-dom";
-import { appendErrors as xo, useForm as En, useFieldArray as mn, useWatch as yo, FormProvider as Ao } from "react-hook-form";
+import { appendErrors as xo, useForm as Bn, useFieldArray as mn, useWatch as yo, FormProvider as Ao } from "react-hook-form";
 import { validateFieldsNatively as So, toNestErrors as No } from "@hookform/resolvers";
-import * as E from "yup";
+import * as B from "yup";
 import jo from "papaparse";
 import * as Xn from "xlsx";
 import { Link as ko } from "react-router-dom";
@@ -138,14 +138,14 @@ function Mo() {
         }
       return null;
     }
-    var D = Object.assign, G = 0, H, R, T, B, U, ci, ni;
+    var D = Object.assign, G = 0, H, R, T, E, U, ci, ni;
     function si() {
     }
     si.__reactDisabledLog = !0;
     function hi() {
       {
         if (G === 0) {
-          H = console.log, R = console.info, T = console.warn, B = console.error, U = console.group, ci = console.groupCollapsed, ni = console.groupEnd;
+          H = console.log, R = console.info, T = console.warn, E = console.error, U = console.group, ci = console.groupCollapsed, ni = console.groupEnd;
           var b = {
             configurable: !0,
             enumerable: !0,
@@ -184,7 +184,7 @@ function Mo() {
               value: T
             }),
             error: D({}, b, {
-              value: B
+              value: E
             }),
             group: D({}, b, {
               value: U
@@ -666,10 +666,10 @@ const gi = mo(void 0), oe = {
       );
       R && d(
         (T) => T == null ? void 0 : T.map(
-          (B) => B.id === G ? {
-            ...B,
-            questionData: B.questionData.filter((U) => R.type === "grid" ? U.gridId !== R.id && U.id !== R.id : U.id !== D)
-          } : B
+          (E) => E.id === G ? {
+            ...E,
+            questionData: E.questionData.filter((U) => R.type === "grid" ? U.gridId !== R.id && U.id !== R.id : U.id !== D)
+          } : E
         )
       );
     },
@@ -682,7 +682,7 @@ const gi = mo(void 0), oe = {
         (U) => U.id === D
       );
       if (R === -1) return;
-      const T = H.questionData[R], B = (U, ci = {}) => ({
+      const T = H.questionData[R], E = (U, ci = {}) => ({
         ...JSON.parse(JSON.stringify(U)),
         id: Ai(),
         ...ci
@@ -695,10 +695,10 @@ const gi = mo(void 0), oe = {
           if (T.type === "grid") {
             const hi = (si = ni == null ? void 0 : ni.map((li, pi) => ({ e: li, i: pi })).filter(
               ({ e: li }) => li.id === T.id || li.gridId === T.id
-            )) == null ? void 0 : si.map(({ i: li }) => li), vi = hi.length ? Math.max(...hi) + 1 : R + 1, w = Ai(), K = B(T, {});
+            )) == null ? void 0 : si.map(({ i: li }) => li), vi = hi.length ? Math.max(...hi) + 1 : R + 1, w = Ai(), K = E(T, {});
             K.id = w;
             const X = ni.filter((li) => li.gridId === T.id), ui = X == null ? void 0 : X.map(
-              (li) => B(li, { gridId: w })
+              (li) => E(li, { gridId: w })
             ), J = [
               ...ni.slice(0, vi),
               K,
@@ -707,7 +707,7 @@ const gi = mo(void 0), oe = {
             ];
             return { ...ci, questionData: J };
           } else {
-            const hi = B(
+            const hi = E(
               T,
               T.gridId ? { gridId: T.gridId } : {}
             ), vi = [
@@ -760,10 +760,10 @@ const gi = mo(void 0), oe = {
       d(
         (R) => R == null ? void 0 : R.map(
           (T) => {
-            var B;
+            var E;
             return T.id === H ? {
               ...T,
-              questionData: (B = T.questionData) == null ? void 0 : B.map(
+              questionData: (E = T.questionData) == null ? void 0 : E.map(
                 (U) => {
                   var ci;
                   return U.type === "grid" && U.gridData ? {
@@ -793,7 +793,7 @@ const gi = mo(void 0), oe = {
           return R.id === G ? {
             ...R,
             questionData: (T = R.questionData) == null ? void 0 : T.map(
-              (B) => B.id === D.id ? { ...B, ...D } : B
+              (E) => E.id === D.id ? { ...E, ...D } : E
             )
           } : R;
         }
@@ -806,7 +806,7 @@ const gi = mo(void 0), oe = {
         sectionId: H,
         targetIndex: R,
         targetId: T,
-        targetGridId: B,
+        targetGridId: E,
         targetCol: U
       } = D;
       d(
@@ -815,18 +815,18 @@ const gi = mo(void 0), oe = {
           const si = [...ni.questionData], hi = si.findIndex((w) => w.id === G);
           if (hi === -1) return ni;
           const vi = { ...si[hi] };
-          if (B !== void 0 && U !== void 0) {
+          if (E !== void 0 && U !== void 0) {
             if (vi.type === "grid") return ni;
             const w = si.findIndex(
               (X) => {
                 var ui;
-                return X.id !== G && X.gridId === B && ((ui = X.gridPosition) == null ? void 0 : ui.col) === U;
+                return X.id !== G && X.gridId === E && ((ui = X.gridPosition) == null ? void 0 : ui.col) === U;
               }
             );
             let K = si.map(
               (X) => X.id === G ? {
                 ...X,
-                gridId: B,
+                gridId: E,
                 gridPosition: { col: U }
               } : X
             );
@@ -836,13 +836,13 @@ const gi = mo(void 0), oe = {
               return delete J.gridId, delete J.gridPosition, J;
             })), { ...ni, questionData: K };
           }
-          if (vi.gridId && R !== void 0 && B === void 0) {
+          if (vi.gridId && R !== void 0 && E === void 0) {
             const w = { ...vi };
             delete w.gridId, delete w.gridPosition;
             const K = si.filter((ui) => ui.id !== G), X = Math.min(R, K.length);
             return K.splice(X, 0, w), { ...ni, questionData: K };
           }
-          if (!vi.gridId && R !== void 0 && B === void 0 && !T) {
+          if (!vi.gridId && R !== void 0 && E === void 0 && !T) {
             si.splice(hi, 1);
             const w = Math.min(R, si.length);
             return si.splice(w, 0, vi), { ...ni, questionData: si };
@@ -934,7 +934,7 @@ function q() {
   for (var i, e, o = 0, s = "", a = arguments.length; o < a; o++) (i = arguments[o]) && (e = Ne(i)) && (s && (s += " "), s += e);
   return s;
 }
-function Eo({ type: i = "calendar", className: e }) {
+function Bo({ type: i = "calendar", className: e }) {
   return /* @__PURE__ */ n.jsx(n.Fragment, { children: i === "calendar" ? /* @__PURE__ */ n.jsxs(
     "svg",
     {
@@ -1132,7 +1132,7 @@ const Nn = ({
     bo,
     {
       showIcon: !0,
-      icon: /* @__PURE__ */ n.jsx(Eo, { className: "react-datepicker__calendar-icon" }),
+      icon: /* @__PURE__ */ n.jsx(Bo, { className: "react-datepicker__calendar-icon" }),
       showPopperArrow: !1,
       dateFormat: s,
       disabled: o,
@@ -1149,7 +1149,7 @@ const Nn = ({
     }
   ) });
 };
-function Bo({
+function Eo({
   element: i,
   validationData: e
 }) {
@@ -1217,11 +1217,11 @@ const je = Object.freeze({
   rotate: 0,
   vFlip: !1,
   hFlip: !1
-}), Bn = Object.freeze({
+}), En = Object.freeze({
   ...je,
   ...nn
 }), jn = Object.freeze({
-  ...Bn,
+  ...En,
   body: "",
   hidden: !1
 });
@@ -1344,7 +1344,7 @@ const Te = /^[a-z0-9]+(-[a-z0-9]+)*$/, ln = (i, e, o, s = "") => {
   return null;
 }, $i = (i, e) => i ? !!((e && i.prefix === "" || i.prefix) && i.name) : !1;
 let Ui = !1;
-function Ee(i) {
+function Be(i) {
   return typeof i == "boolean" && (Ui = i), Ui;
 }
 function le(i) {
@@ -1376,11 +1376,11 @@ function Ko(i, e) {
   const s = Oi(e, o);
   return !!Me(s, i);
 }
-const Be = Object.freeze({
+const Ee = Object.freeze({
   width: null,
   height: null
 }), Le = Object.freeze({
-  ...Be,
+  ...Ee,
   ...nn
 }), Go = /(-?[0-9.]*[0-9]+[0-9.]*)/g, Ho = /^-?[0-9.]*[0-9]+[0-9.]*$/g;
 function de(i, e, o) {
@@ -1425,7 +1425,7 @@ function Wo(i, e, o) {
 const Uo = (i) => i === "unset" || i === "undefined" || i === "none";
 function zo(i, e) {
   const o = {
-    ...Bn,
+    ...En,
     ...i
   }, s = {
     ...Le,
@@ -1947,7 +1947,7 @@ function pa(i, e) {
   }));
 }
 const ga = (i, e) => {
-  const o = ta(i, !0, Ee()), s = ua(o);
+  const o = ta(i, !0, Be()), s = ua(o);
   if (!s.pending.length) {
     let d = !0;
     return e && setTimeout(() => {
@@ -1976,7 +1976,7 @@ function fa(i, e) {
   const o = { ...i };
   for (const s in e) {
     const a = e[s], l = typeof a;
-    s in Be ? (a === null || a && (l === "string" || l === "number")) && (o[s] = a) : l === typeof o[s] && (o[s] = s === "rotate" ? a % 4 : a);
+    s in Ee ? (a === null || a && (l === "string" || l === "number")) && (o[s] = a) : l === typeof o[s] && (o[s] = s === "rotate" ? a % 4 : a);
   }
   return o;
 }
@@ -2051,7 +2051,7 @@ const Re = {
   xmlnsXlink: "http://www.w3.org/1999/xlink",
   "aria-hidden": !0,
   role: "img"
-}, Ea = {
+}, Ba = {
   display: "inline-block"
 }, Mn = {
   backgroundColor: "currentColor"
@@ -2071,7 +2071,7 @@ for (const i in be) {
   for (const o in me)
     e[i + o] = me[o];
 }
-const Ba = {
+const Ea = {
   ...Re,
   inline: !0
 };
@@ -2079,7 +2079,7 @@ function ve(i) {
   return i + (i.match(/^[-0-9.]+$/) ? "px" : "");
 }
 const La = (i, e, o) => {
-  const s = e.inline ? Ba : Re, a = fa(s, e), l = e.mode || "svg", t = {}, u = e.style || {}, d = {
+  const s = e.inline ? Ea : Re, a = fa(s, e), l = e.mode || "svg", t = {}, u = e.style || {}, d = {
     ...l === "svg" ? Ta : {}
   };
   if (o) {
@@ -2164,12 +2164,12 @@ const La = (i, e, o) => {
     "--svg": ka(f),
     width: ve(c.width),
     height: ve(c.height),
-    ...Ea,
+    ...Ba,
     ...y ? Mn : De,
     ...u
   }, Sn("span", d);
 };
-Ee(!0);
+Be(!0);
 Zo("", aa);
 if (typeof document != "undefined" && typeof window != "undefined") {
   const i = window;
@@ -2259,7 +2259,7 @@ function Ie(i) {
   }, [i.icon, e]);
   const { name: h, data: v } = t;
   return v ? La({
-    ...Bn,
+    ...En,
     ...v
   }, i, h) : i.children ? i.children : i.fallback ? i.fallback : Sn("span", {});
 }
@@ -2327,7 +2327,7 @@ function Rn({
             ]
           }
         ),
-        /* @__PURE__ */ n.jsx(Bi, { as: Zi, leave: "custom-select__transition", children: /* @__PURE__ */ n.jsx(
+        /* @__PURE__ */ n.jsx(Ei, { as: Zi, leave: "custom-select__transition", children: /* @__PURE__ */ n.jsx(
           di.Options,
           {
             anchor: "bottom start",
@@ -2978,7 +2978,7 @@ const Ri = ({
             /* @__PURE__ */ n.jsx("span", { className: "absolute inset-y-0 right-0 flex items-center pr-2 pointer-events-none", children: /* @__PURE__ */ n.jsx(_, { icon: "lucide:chevron-down" }) })
           ] }),
           /* @__PURE__ */ n.jsx(
-            Bi,
+            Ei,
             {
               leave: "transition ease-in duration-100",
               leaveFrom: "opacity-100",
@@ -3816,7 +3816,7 @@ function bs({
             children: /* @__PURE__ */ n.jsxs("div", { className: "listbox-wrapper", children: [
               /* @__PURE__ */ n.jsx(di.Button, { className: "listbox-button", children: r.fieldType }),
               /* @__PURE__ */ n.jsx(
-                Bi,
+                Ei,
                 {
                   as: Zi,
                   leave: "transition ease-in duration-100",
@@ -3851,7 +3851,7 @@ function bs({
             children: /* @__PURE__ */ n.jsxs("div", { className: "listbox-wrapper", children: [
               /* @__PURE__ */ n.jsx(di.Button, { className: "listbox-button", children: r.operator.replace("_", " ") }),
               /* @__PURE__ */ n.jsx(
-                Bi,
+                Ei,
                 {
                   as: Zi,
                   leave: "transition ease-in duration-100",
@@ -3895,7 +3895,7 @@ function bs({
             children: /* @__PURE__ */ n.jsxs("div", { className: "listbox-wrapper", children: [
               /* @__PURE__ */ n.jsx(di.Button, { className: "listbox-button", children: r.fieldValue === !0 ? "True" : r.fieldValue === !1 ? "False" : "Select value" }),
               /* @__PURE__ */ n.jsx(
-                Bi,
+                Ei,
                 {
                   as: Zi,
                   leave: "transition ease-in duration-100",
@@ -3935,25 +3935,25 @@ function bs({
     }) })
   ] });
 }
-const vs = E.object().shape({
-  inputLabel: E.string().nullable(),
-  placeholder: E.string().nullable(),
-  description: E.string().nullable(),
-  isReadOnly: E.boolean(),
-  isDisabled: E.boolean(),
-  isRequired: E.boolean(),
-  requiredMessage: E.string().nullable(),
-  minLengthMessage: E.string().nullable(),
-  maxLengthMessage: E.string().nullable(),
-  maxLength: E.number().typeError("Expecting a number").nullable(),
-  minLength: E.number().typeError("Expecting a number").nullable(),
-  inputType: E.string().nullable(),
-  maxAmountMessage: E.string().nullable(),
-  maxAmount: E.string().nullable(),
-  options: E.array().of(
-    E.object().shape({
-      label: E.string().nullable(),
-      value: E.string().when("label", {
+const vs = B.object().shape({
+  inputLabel: B.string().nullable(),
+  placeholder: B.string().nullable(),
+  description: B.string().nullable(),
+  isReadOnly: B.boolean(),
+  isDisabled: B.boolean(),
+  isRequired: B.boolean(),
+  requiredMessage: B.string().nullable(),
+  minLengthMessage: B.string().nullable(),
+  maxLengthMessage: B.string().nullable(),
+  maxLength: B.number().typeError("Expecting a number").nullable(),
+  minLength: B.number().typeError("Expecting a number").nullable(),
+  inputType: B.string().nullable(),
+  maxAmountMessage: B.string().nullable(),
+  maxAmount: B.string().nullable(),
+  options: B.array().of(
+    B.object().shape({
+      label: B.string().nullable(),
+      value: B.string().when("label", {
         is: (i) => i && i.length > 0,
         then: (i) => i.required("Value is required when label is present"),
         otherwise: (i) => i.nullable()
@@ -3964,10 +3964,10 @@ const vs = E.object().shape({
     then: (i) => i.required("Options are required for radio or checkbox inputs"),
     otherwise: (i) => i.nullable()
   }),
-  options1: E.array().of(
-    E.object().shape({
-      label: E.string().nullable(),
-      value: E.string().when("label", {
+  options1: B.array().of(
+    B.object().shape({
+      label: B.string().nullable(),
+      value: B.string().when("label", {
         is: (i) => i && i.length > 0,
         then: (i) => i.required("Value is required when label is present"),
         otherwise: (i) => i.nullable()
@@ -3978,32 +3978,32 @@ const vs = E.object().shape({
     then: (i) => i.required("Options are required for radio or checkbox inputs"),
     otherwise: (i) => i.nullable()
   }),
-  prefix: E.string().nullable(),
-  url: E.string().nullable(),
-  method: E.string().nullable(),
-  denominators: E.mixed().nullable(),
-  responseType: E.string().nullable(),
-  minAmount: E.string().nullable(),
-  heading: E.string().nullable(),
-  minAmountMessage: E.string().nullable(),
-  columns: E.number().nullable().max(4).min(2),
-  value: E.mixed().nullable(),
-  customClass: E.string().nullable(),
-  elementClass: E.string().nullable(),
-  apiUrl: E.string().nullable(),
-  selectType: E.string().default("list"),
-  dateType: E.string().default("basic"),
-  validationUrl: E.string(),
-  signatureLink: E.string(),
-  minDate: E.string().nullable(),
-  maxDate: E.string().nullable(),
-  canHaveDateRange: E.boolean(),
-  allowYearPicker: E.boolean(),
-  isHidden: E.boolean(),
-  visibilityDependentFields: E.array().nullable(),
-  isMultiple: E.boolean(),
-  acceptedFiles: E.array(),
-  showState: E.boolean()
+  prefix: B.string().nullable(),
+  url: B.string().nullable(),
+  method: B.string().nullable(),
+  denominators: B.mixed().nullable(),
+  responseType: B.string().nullable(),
+  minAmount: B.string().nullable(),
+  heading: B.string().nullable(),
+  minAmountMessage: B.string().nullable(),
+  columns: B.number().nullable().max(4).min(2),
+  value: B.mixed().nullable(),
+  customClass: B.string().nullable(),
+  elementClass: B.string().nullable(),
+  apiUrl: B.string().nullable(),
+  selectType: B.string().default("list"),
+  dateType: B.string().default("basic"),
+  validationUrl: B.string(),
+  signatureLink: B.string(),
+  minDate: B.string().nullable(),
+  maxDate: B.string().nullable(),
+  canHaveDateRange: B.boolean(),
+  allowYearPicker: B.boolean(),
+  isHidden: B.boolean(),
+  visibilityDependentFields: B.array().nullable(),
+  isMultiple: B.boolean(),
+  acceptedFiles: B.array(),
+  showState: B.boolean()
 }), hs = [
   { title: "Configurations", key: "basic" },
   { title: "Validations", key: "validation" }
@@ -4023,7 +4023,7 @@ const vs = E.object().shape({
     trigger: p,
     formState: { errors: x, isSubmitting: j, isValid: S },
     reset: N
-  } = En({
+  } = Bn({
     resolver: Dn(vs),
     defaultValues: {
       ...o,
@@ -4056,7 +4056,7 @@ const vs = E.object().shape({
     headers: {
       Authorization: `Bearer ${xi("token")}`
     }
-  }, B = $(async () => {
+  }, E = $(async () => {
     var w, K, X;
     if (!A.apiUrl || !/^https?:\/\//.test(A.apiUrl)) {
       ki.info("Please provide a valid API URL");
@@ -4083,7 +4083,7 @@ const vs = E.object().shape({
     }
   }, [o.type, f, A.apiUrl]), U = ["manual", "api", "sheet"];
   function ci() {
-    r === "api" && B();
+    r === "api" && E();
   }
   const ni = () => /* @__PURE__ */ n.jsxs("div", { className: "flex flex-col justify-start gap-y-1", children: [
     /* @__PURE__ */ n.jsx("div", { className: "flex items-center mb-4 gap-x-5", children: U == null ? void 0 : U.map((w) => /* @__PURE__ */ n.jsxs("label", { className: "items-center text-base capitalize gap-x-3", children: [
@@ -5195,22 +5195,22 @@ function ys({
       if (!(!m || !p)) {
         d(!0);
         try {
-          let B;
+          let E;
           if (p.toLowerCase() === "get") {
             const U = `${m}?value=${k}`;
-            B = await Ii.get(U, S);
+            E = await Ii.get(U, S);
           } else if (p.toLowerCase() === "post")
-            B = await Ii.post(m, { value: k }, S);
+            E = await Ii.post(m, { value: k }, S);
           else
             throw new Error("Unsupported HTTP method");
-          B.status === 200 && ((((ii = (O = B == null ? void 0 : B.data) == null ? void 0 : O.data) == null ? void 0 : ii.status) || ((z = B == null ? void 0 : B.data) == null ? void 0 : z.status)) === !0 ? (c(!0), x === "string" ? v(
-            ((L = (Z = B == null ? void 0 : B.data) == null ? void 0 : Z.data) == null ? void 0 : L.description) || ((W = B == null ? void 0 : B.data) == null ? void 0 : W.description) || "Validation successful"
+          E.status === 200 && ((((ii = (O = E == null ? void 0 : E.data) == null ? void 0 : O.data) == null ? void 0 : ii.status) || ((z = E == null ? void 0 : E.data) == null ? void 0 : z.status)) === !0 ? (c(!0), x === "string" ? v(
+            ((L = (Z = E == null ? void 0 : E.data) == null ? void 0 : Z.data) == null ? void 0 : L.description) || ((W = E == null ? void 0 : E.data) == null ? void 0 : W.description) || "Validation successful"
           ) : f(
-            ((G = (D = B == null ? void 0 : B.data) == null ? void 0 : D.data) == null ? void 0 : G.description) || ((H = B == null ? void 0 : B.data) == null ? void 0 : H.description) || {}
+            ((G = (D = E == null ? void 0 : E.data) == null ? void 0 : D.data) == null ? void 0 : G.description) || ((H = E == null ? void 0 : E.data) == null ? void 0 : H.description) || {}
           )) : (console.error("Invalid input:", k), v("Unable to validate input"), c(!1)));
-        } catch (B) {
-          console.error("Error validating input:", B), v(
-            ((T = (R = B == null ? void 0 : B.response) == null ? void 0 : R.data) == null ? void 0 : T.message) || "Unable to validate input"
+        } catch (E) {
+          console.error("Error validating input:", E), v(
+            ((T = (R = E == null ? void 0 : E.response) == null ? void 0 : R.data) == null ? void 0 : T.message) || "Unable to validate input"
           ), c(!1);
         } finally {
           d(!1);
@@ -5527,7 +5527,7 @@ function Ms({
   ] });
 }
 const Ts = an(Ms);
-function Es({
+function Bs({
   value: i = [],
   onChange: e,
   isReadOnly: o = !1,
@@ -5639,7 +5639,7 @@ function Es({
     )
   ] });
 }
-function Bs({
+function Es({
   element: i,
   validationData: e
 }) {
@@ -5659,7 +5659,7 @@ function Bs({
     [i.id, s]
   );
   return /* @__PURE__ */ n.jsx(
-    Es,
+    Bs,
     {
       value: t,
       onChange: u,
@@ -5711,7 +5711,7 @@ const ge = ({
             /* @__PURE__ */ n.jsx("span", { className: "custom-select__icon", children: /* @__PURE__ */ n.jsx(_, { icon: "lucide:chevron-down" }) })
           ] }),
           /* @__PURE__ */ n.jsx(
-            Bi,
+            Ei,
             {
               as: mi.Fragment,
               leave: "custom-select__transition",
@@ -6433,13 +6433,13 @@ const He = {
   multiSelect: Rn,
   numberField: bn,
   amountField: gs,
-  date: Bo,
+  date: Eo,
   password: Ka,
   checkbox: Va,
   radio: Ga,
   email: bn,
   file: Oa,
-  dataGrid: Bs,
+  dataGrid: Es,
   section: Ha,
   validateInput: ys,
   tableInput: Ss,
@@ -6558,12 +6558,12 @@ const He = {
     var G, H, R;
     const k = S + 1, O = (H = (G = t.find((T) => T.id === e)) == null ? void 0 : G.questionData) == null ? void 0 : H.find(
       (T) => {
-        var B;
-        return T.gridId === i.id && ((B = T.gridPosition) == null ? void 0 : B.col) === k;
+        var E;
+        return T.gridId === i.id && ((E = T.gridPosition) == null ? void 0 : E.col) === k;
       }
     ), ii = (R = O == null ? void 0 : O.id) != null ? R : null, z = Array.isArray(o) && o.find((T) => {
-      var B;
-      return ((B = T == null ? void 0 : T.props) == null ? void 0 : B.col) === k;
+      var E;
+      return ((E = T == null ? void 0 : T.props) == null ? void 0 : E.col) === k;
     }), Z = c && g === S, L = !!z, W = c && !!l, D = L && ii && A === "edit" ? {
       draggable: !0,
       onDragStart: (T) => {
@@ -6830,11 +6830,11 @@ function Hs({ elementData: i, sectionId: e }) {
     })
   ] });
 }
-const Vs = an(Hs), Fs = E.object({
-  title: E.string(),
-  description: E.string(),
-  disabled: E.boolean().default(!1),
-  isHidden: E.boolean().default(!1)
+const Vs = an(Hs), Fs = B.object({
+  title: B.string(),
+  description: B.string(),
+  disabled: B.boolean().default(!1),
+  isHidden: B.boolean().default(!1)
 }).required(), yn = xi("config"), Ws = ({ isOpen: i, onClose: e, section: o }) => {
   const { updateSection: s } = mi.useContext(gi), {
     register: a,
@@ -6842,7 +6842,7 @@ const Vs = an(Hs), Fs = E.object({
     watch: t,
     formState: { errors: u, isSubmitting: d, isValid: r },
     reset: c
-  } = En({
+  } = Bn({
     resolver: Dn(Fs),
     defaultValues: o
   });
@@ -6969,7 +6969,7 @@ const Vs = an(Hs), Fs = E.object({
     "div",
     {
       ref: s,
-      className: "relative flex flex-col h-full px-6 pb-5 mx-auto gap-x-4",
+      className: "relative flex flex-col h-full pb-5 mx-auto gap-x-4",
       children: [
         i && /* @__PURE__ */ n.jsx(
           Ws,
@@ -6979,16 +6979,16 @@ const Vs = an(Hs), Fs = E.object({
             section: o.current
           }
         ),
-        /* @__PURE__ */ n.jsxs("div", { className: "relative flex flex-col flex-1 w-full py-4 gap-y-6", children: [
+        /* @__PURE__ */ n.jsxs("div", { className: "relative flex flex-col flex-1 w-full gap-y-4", children: [
           t == null ? void 0 : t.map(
             (m, p) => /* @__PURE__ */ n.jsx(
               "div",
               {
-                className: "bg-white group cursor-pointer rounded ",
+                className: "bg-white group cursor-pointer rounded-lg ",
                 children: /* @__PURE__ */ n.jsxs(
                   "div",
                   {
-                    className: `border border-gray-100 rounded  px-4 shadow-[rgba(149,157,165,0.2)_0px_2px_4px] transition-colors duration-200
+                    className: `bg-white border border-gray-100 rounded-lg  px-4 shadow-[rgba(149,157,165,0.2)_0px_2px_2px] transition-colors duration-200
                   ${r === m.id ? "border-dashed border-blue-400 bg-[#f7f8fa]" : ""} ${c.includes(p) ? "min-h-[300px] pb-6 " : ""}`,
                     children: [
                       /* @__PURE__ */ n.jsxs("div", { className: "flex items-center justify-between", children: [
@@ -7118,18 +7118,18 @@ function _s({
       console.error("Drop error:", d);
     }
   }, []);
-  return /* @__PURE__ */ n.jsxs("div", { className: "flex gap-4", children: [
+  return /* @__PURE__ */ n.jsxs("div", { className: "flex gap-x-6 h-full", children: [
     /* @__PURE__ */ n.jsx(
       "div",
       {
         onDragOver: (u) => u.preventDefault(),
         onDrop: (u) => t(u),
-        className: "bg-white p-4 border border-[#E4E7EC] shadow rounded-lg h-full overflow-y-auto no-scrollbar max-h-[calc(100vh-60px)] flex-1 form_builder",
+        className: " h-full overflow-y-auto no-scrollbar max-h-[calc(100vh-80px)] flex-1 form_builder",
         children: /* @__PURE__ */ n.jsx(Us, {})
       }
     ),
     /* @__PURE__ */ n.jsx(
-      Bi,
+      Ei,
       {
         show: l,
         as: "div",
@@ -7139,8 +7139,8 @@ function _s({
         leave: "transition-all duration-300 ease-in-out origin-right",
         leaveFrom: "opacity-100 w-2/5 translate-x-0",
         leaveTo: "opacity-0 w-0 translate-x-10 px-0 overflow-hidden border-transparent shadow-none",
-        className: "shrink-0 bg-white shadow border border-[#E4E7EC] rounded-lg h-full overflow-y-auto no-scrollbar max-h-[calc(100vh-60px)] form_preview w-2/5",
-        children: /* @__PURE__ */ n.jsx("div", { className: "py-4 px-2   min-w-[320px]", children: /* @__PURE__ */ n.jsx(zs, {}) })
+        className: "shrink-0    overflow-y-auto no-scrollbar max-h-[calc(100vh-70px)] form_preview w-2/5",
+        children: /* @__PURE__ */ n.jsx("div", { className: "px-2 shadow_box  min-w-[320px] bg-white border border-gray-100 rounded-lg", children: /* @__PURE__ */ n.jsx(zs, {}) })
       }
     )
   ] });
@@ -7187,7 +7187,7 @@ const An = [
     )
   })).filter((g) => g.elements.length > 0);
   return /* @__PURE__ */ n.jsxs("div", { className: "pt-4 pb-6", children: [
-    /* @__PURE__ */ n.jsx("div", { className: "px-5 mb-4", children: /* @__PURE__ */ n.jsx(
+    /* @__PURE__ */ n.jsx("div", { className: "px-5 mb-6", children: /* @__PURE__ */ n.jsx(
       "input",
       {
         className: "field-control",
@@ -7198,8 +7198,7 @@ const An = [
         id: "search"
       }
     ) }),
-    /* @__PURE__ */ n.jsx("hr", {}),
-    /* @__PURE__ */ n.jsx("div", { children: /* @__PURE__ */ n.jsx("ul", { className: "grid gap-y-5 mt-3 px-5 max-h-[80vh] overflow-y-auto no-scrollbar", children: v == null ? void 0 : v.map((g, y) => {
+    /* @__PURE__ */ n.jsx("div", { children: /* @__PURE__ */ n.jsx("ul", { className: "grid gap-y-5 mt-3 px-5 max-h-[85vh] overflow-y-auto no-scrollbar", children: v == null ? void 0 : v.map((g, y) => {
       var f;
       return /* @__PURE__ */ n.jsxs("li", { children: [
         /* @__PURE__ */ n.jsx("h4", { className: "mb-2 text-[11px] font-bold text-gray-500 uppercase", children: g.title }),
@@ -7235,7 +7234,7 @@ const An = [
       ] }, y);
     }) }) })
   ] });
-}, Ys = an(Js), Ei = ({
+}, Ys = an(Js), Bi = ({
   text: i = "",
   isDisabled: e = !1,
   isLoading: o = !1,
@@ -7420,7 +7419,7 @@ function Qs({
   function j() {
     g(!1), u && y !== i && u(y.trim());
   }
-  return /* @__PURE__ */ n.jsxs("div", { className: "px-[30px] py-3 flex justify-between items-center bg-[#F9F9FB] top_bar", children: [
+  return /* @__PURE__ */ n.jsxs("div", { className: "px-[30px] py-3 flex justify-between items-center bg-[#F9F9FB] top_bar h-full", children: [
     /* @__PURE__ */ n.jsxs("span", { className: "flex items-center gap-x-2", children: [
       e && /* @__PURE__ */ n.jsx(
         "button",
@@ -7463,7 +7462,7 @@ function Qs({
     ),
     /* @__PURE__ */ n.jsxs("div", { className: "flex justify-end text-xs gap-x-3", children: [
       /* @__PURE__ */ n.jsx(
-        Ei,
+        Bi,
         {
           onClick: () => r((S) => !S),
           text: "Preview",
@@ -7476,7 +7475,7 @@ function Qs({
         }
       ),
       /* @__PURE__ */ n.jsx(
-        Ei,
+        Bi,
         {
           onClick: p,
           text: "Save",
@@ -7489,7 +7488,7 @@ function Qs({
         }
       ),
       /* @__PURE__ */ n.jsx(
-        Ei,
+        Bi,
         {
           onClick: x,
           text: "Publish",
@@ -7527,25 +7526,25 @@ function Xs({
 }) {
   return /* @__PURE__ */ n.jsxs(Se, { children: [
     /* @__PURE__ */ n.jsx(Ae, { position: "top-right", richColors: !0, closeButton: !0 }),
-    /* @__PURE__ */ n.jsxs("div", { className: "w-full h-full bg-[#F8F9FC] flex flex-col", children: [
-      /* @__PURE__ */ n.jsx("div", { className: "border-b  bg-white  border-[#E4E7EC]", children: /* @__PURE__ */ n.jsx(
-        Qs,
-        {
-          title: o,
-          goBackUrl: s,
-          onSubmit: i,
-          onPublish: l,
-          previewLoading: t,
-          saveLoading: u,
-          publishLoading: d,
-          onTitleChange: r
-        }
-      ) }),
-      /* @__PURE__ */ n.jsxs("div", { className: "flex flex-1 ", children: [
-        /* @__PURE__ */ n.jsx("div", { children: /* @__PURE__ */ n.jsx("div", { className: "w-[270px]  h-[calc(100vh-64px)]  border-r border-[#E4E7EC] bg-white ", children: /* @__PURE__ */ n.jsx(Ys, {}) }) }),
-        /* @__PURE__ */ n.jsx("div", { className: "flex-1 h-full max-h-full z-[1] p-4", children: a ? /* @__PURE__ */ n.jsx(Ve, { loadingClass: "!w-full !h-[800px]" }) : /* @__PURE__ */ n.jsx(_s, { questionData: e, uploadUrl: c }) })
+    /* @__PURE__ */ n.jsx("div", { className: "w-full h-full bg-[#F8F9FC] flex flex-col", children: /* @__PURE__ */ n.jsxs("div", { className: "flex flex-1 ", children: [
+      /* @__PURE__ */ n.jsx("div", { children: /* @__PURE__ */ n.jsx("div", { className: "w-[270px]  h-screen  border-r border-[#E4E7EC] bg-white ", children: /* @__PURE__ */ n.jsx(Ys, {}) }) }),
+      /* @__PURE__ */ n.jsxs("div", { className: "flex-1 h-full max-h-full z-[1]", children: [
+        /* @__PURE__ */ n.jsx("div", { className: " h-[70px]", children: /* @__PURE__ */ n.jsx(
+          Qs,
+          {
+            title: o,
+            goBackUrl: s,
+            onSubmit: i,
+            onPublish: l,
+            previewLoading: t,
+            saveLoading: u,
+            publishLoading: d,
+            onTitleChange: r
+          }
+        ) }),
+        /* @__PURE__ */ n.jsx("div", { className: "p-6 h-[calc(100vh-70px)]", children: a ? /* @__PURE__ */ n.jsx(Ve, { loadingClass: "!w-full !h-[800px]" }) : /* @__PURE__ */ n.jsx(_s, { questionData: e, uploadUrl: c }) })
       ] })
-    ] })
+    ] }) })
   ] });
 }
 const Sl = ({
@@ -7591,19 +7590,19 @@ const Sl = ({
   minAmount: (i) => `Minimum amount is ${i}`,
   maxAmount: (i) => `Maximum amount is ${i}`
 }, il = (i) => ({
-  textField: E.string().nullable(),
-  longText: E.string().nullable(),
-  numberField: E.number().nullable().transform((o) => isNaN(o) ? null : o),
-  amountField: E.number().nullable().transform((o) => isNaN(o) ? null : o),
-  selectField: E.string().nullable(),
-  checkbox: E.mixed().nullable(),
-  radio: E.mixed().nullable(),
-  email: E.string().nullable().test("email-format", Mi.email, (o) => !o || o.trim() === "" ? !0 : /^[a-zA-Z0-9._%+\-]+@[a-zA-Z0-9.\-]+\.[a-zA-Z]{2,}$/.test(o)),
-  date: E.date().typeError("Invalid date").nullable(),
-  url: E.string().nullable().test("url-format", Mi.url, (o) => !o || o.trim() === "" ? !0 : /^(https?:\/\/)?([a-zA-Z0-9-]+\.)+[a-zA-Z]{2,}(\/.*)?$/.test(
+  textField: B.string().nullable(),
+  longText: B.string().nullable(),
+  numberField: B.number().nullable().transform((o) => isNaN(o) ? null : o),
+  amountField: B.number().nullable().transform((o) => isNaN(o) ? null : o),
+  selectField: B.string().nullable(),
+  checkbox: B.mixed().nullable(),
+  radio: B.mixed().nullable(),
+  email: B.string().nullable().test("email-format", Mi.email, (o) => !o || o.trim() === "" ? !0 : /^[a-zA-Z0-9._%+\-]+@[a-zA-Z0-9.\-]+\.[a-zA-Z]{2,}$/.test(o)),
+  date: B.date().typeError("Invalid date").nullable(),
+  url: B.string().nullable().test("url-format", Mi.url, (o) => !o || o.trim() === "" ? !0 : /^(https?:\/\/)?([a-zA-Z0-9-]+\.)+[a-zA-Z]{2,}(\/.*)?$/.test(
     o
   ))
-})[i] || E.mixed().nullable(), nl = (i, e, o) => e ? i.type === "boolean" ? i.oneOf([!0], o || Mi.required) : i.required(o || Mi.required) : i, el = (i, {
+})[i] || B.mixed().nullable(), nl = (i, e, o) => e ? i.type === "boolean" ? i.oneOf([!0], o || Mi.required) : i.required(o || Mi.required) : i, el = (i, {
   minLength: e,
   maxLength: o,
   minLengthMessage: s,
@@ -7650,7 +7649,7 @@ function al(i) {
         s
       )), e[a] = r;
     });
-  }), E.object().shape(e);
+  }), B.object().shape(e);
 }
 const en = ({ element: i, validationData: e }) => {
   const o = He[i.type], { answerData: s } = ji(gi), a = oi(
@@ -7870,7 +7869,7 @@ const ul = ({
   ), f = (ni = y == null ? void 0 : y.length) != null ? ni : 0, m = xi("config"), p = oi(
     () => al(y),
     [y]
-  ), x = En({
+  ), x = Bn({
     resolver: Dn(p),
     mode: "onSubmit",
     defaultValues: {}
@@ -7942,7 +7941,7 @@ const ul = ({
       Object.keys(z).length > 0 || s == null || s(li);
     },
     [z, y, s]
-  ), B = $(async () => {
+  ), E = $(async () => {
     var J, li;
     if (!o) {
       const pi = (li = (J = y == null ? void 0 : y[v]) == null ? void 0 : J.questionData) == null ? void 0 : li.map(
@@ -8015,29 +8014,32 @@ const ul = ({
             (ui = y == null ? void 0 : y[v]) == null ? void 0 : ui.id
           ) }),
           !d && /* @__PURE__ */ n.jsx("footer", { className: "flex items-center justify-end gap-4 footer flex-wrap", children: t === "multi" ? /* @__PURE__ */ n.jsxs(n.Fragment, { children: [
-            /* @__PURE__ */ n.jsxs("div", { className: "flex gap-x-4 justify-end navigation_container", children: [
-              v > 0 && /* @__PURE__ */ n.jsx(
-                Ei,
-                {
-                  type: "button",
-                  text: "Back",
-                  onClick: U,
-                  btnClass: "text-gray-700 back_btn text-sm border-[#98A2B3] !font-medium !py-[10px] px-10 bg-gray-200 rounded-lg"
-                }
-              ),
+            /* @__PURE__ */ n.jsxs("div", { className: "flex gap-x-4 justify-between navigation_container w-full", children: [
+              /* @__PURE__ */ n.jsxs("div", { children: [
+                " ",
+                v > 0 && /* @__PURE__ */ n.jsx(
+                  Bi,
+                  {
+                    type: "button",
+                    text: "Back",
+                    onClick: U,
+                    btnClass: "text-gray-700 back_btn text-sm border-[#98A2B3] !font-medium !py-[10px] px-10 bg-gray-200 rounded-lg"
+                  }
+                )
+              ] }),
               v < f - 1 && /* @__PURE__ */ n.jsx(
-                Ei,
+                Bi,
                 {
                   type: "button",
                   text: "Next",
-                  onClick: B,
+                  onClick: E,
                   style: { background: (m == null ? void 0 : m.buttonColor) || "#333" },
                   btnClass: "text-gray-700 next_btn text-sm border-[#98A2B3] !font-medium !py-[10px] px-10 bg-blue-600 text-white rounded-lg continue_btn"
                 }
               )
             ] }),
             (v === f - 1 || l) && !o && (u != null ? u : /* @__PURE__ */ n.jsx(
-              Ei,
+              Bi,
               {
                 isDisabled: Z || Object.keys(z).length > 0,
                 isLoading: Z,
@@ -8048,7 +8050,7 @@ const ul = ({
               }
             ))
           ] }) : !o && (u != null ? u : /* @__PURE__ */ n.jsx(
-            Ei,
+            Bi,
             {
               isDisabled: Z || Object.keys(z).length > 0,
               isLoading: Z,