@digiform/wizard 0.3.1 → 0.3.2

package/wizard/src/features/dialog-system/components/ActionDialog/ActionDialog.js

@@ -1,54 +1,50 @@
 "use client";
-import { jsx as e, jsxs as r } from "react/jsx-runtime";
+import { jsx as e, jsxs as l } from "react/jsx-runtime";
 /* empty css                                  */
 import { Button as N } from "../../../../../../ui/src/components/button/button.js";
-import { Dialog as g, DialogContent as D, DialogHeader as S, DialogTitle as f, DialogDescription as I } from "../../../../../../ui/src/components/dialog/dialog.js";
-import { Sheet as T, SheetContent as M, SheetHeader as _, SheetTitle as B } from "../../../../../../ui/src/components/sheet/sheet.js";
-import { memo as H, useState as x } from "react";
+import { Dialog as f, DialogContent as g, DialogHeader as D, DialogTitle as S, DialogDescription as T } from "../../../../../../ui/src/components/dialog/dialog.js";
+import { Sheet as I, SheetContent as _, SheetHeader as B, SheetTitle as H } from "../../../../../../ui/src/components/sheet/sheet.js";
+import { memo as M, useState as x } from "react";
 import { ConfirmationDialog as $ } from "../ConfirmationDialog/ConfirmationDialog.js";
 import { EmailVerificationDialog as b } from "../EmailVerificationDialog/EmailVerificationDialog.js";
-import l from "./ActionDialog.module.css.js";
-const w = H(
-  ({ config: t, formData: n, onButtonClick: s, onClose: o, isOpen: i }) => {
+import r from "./ActionDialog.module.css.js";
+const w = M(
+  ({ config: a, formData: n, onButtonClick: s, onClose: o, isOpen: i }) => {
     const [c, h] = x(!1);
-    if (!t) return null;
-    if (console.log("🔍 ActionDialog config:", {
-      config: t,
-      typeId: t.templateMetadata?.typeId,
-      title: t.title
-    }), t.templateMetadata?.typeId === "verify-dialog")
+    if (!a) return null;
+    if (a.templateMetadata?.typeId === "verify-dialog")
       return /* @__PURE__ */ e(
         b,
         {
-          config: t,
+          config: a,
           formData: n,
           onButtonClick: s,
           onClose: o,
           isOpen: i
         }
       );
-    if (t.templateMetadata?.typeId === "confirmation-dialog")
+    if (a.templateMetadata?.typeId === "confirmation-dialog")
       return /* @__PURE__ */ e(
         $,
         {
-          config: t,
+          config: a,
           formData: n,
           onButtonClick: s,
           onClose: o,
           isOpen: i
         }
       );
-    const y = async (a) => {
+    const y = async (t) => {
       h(!0);
       try {
-        s(a.action);
+        s(t.action);
       } finally {
         h(!1);
       }
     }, u = () => {
-      t.dismissible !== !1 && !c && o();
-    }, v = (a) => {
-      switch (a) {
+      a.dismissible !== !1 && !c && o();
+    }, v = (t) => {
+      switch (t) {
         case "primary":
           return "default";
         case "secondary":
@@ -58,53 +54,53 @@ const w = H(
         default:
           return "secondary";
       }
-    }, d = t.content.replace(
+    }, d = a.content.replace(
       /\$\{data\.([^}]+)\}/g,
-      (a, C) => {
+      (t, C) => {
         const p = n[C];
-        return p != null ? String(p) : a;
+        return p != null ? String(p) : t;
       }
-    ), m = () => /* @__PURE__ */ e("div", { className: l.buttonRow, children: t.buttons.map((a) => /* @__PURE__ */ e(
+    ), m = () => /* @__PURE__ */ e("div", { className: r.buttonRow, children: a.buttons.map((t) => /* @__PURE__ */ e(
       N,
       {
-        variant: v(a.variant),
-        onClick: () => y(a),
+        variant: v(t.variant),
+        onClick: () => y(t),
         disabled: c,
-        className: l.minWidthButton,
-        children: a.label
+        className: r.minWidthButton,
+        children: t.label
       },
-      `${a.label}-${a.action}`
+      `${t.label}-${t.action}`
     )) });
-    return t.type === "toast" ? i ? /* @__PURE__ */ e("div", { className: l.toastContainer, children: /* @__PURE__ */ r("div", { className: l.toastCard, children: [
-      /* @__PURE__ */ r("div", { children: [
-        /* @__PURE__ */ e("h3", { className: l.toastTitle, children: t.title }),
+    return a.type === "toast" ? i ? /* @__PURE__ */ e("div", { className: r.toastContainer, children: /* @__PURE__ */ l("div", { className: r.toastCard, children: [
+      /* @__PURE__ */ l("div", { children: [
+        /* @__PURE__ */ e("h3", { className: r.toastTitle, children: a.title }),
         /* @__PURE__ */ e(
           "div",
           {
-            className: l.toastContent,
+            className: r.toastContent,
             dangerouslySetInnerHTML: { __html: d }
           }
         )
       ] }),
       /* @__PURE__ */ e(m, {})
-    ] }) }) : null : t.type === "sidebar" ? /* @__PURE__ */ e(T, { open: i, onOpenChange: (a) => !a && u(), children: /* @__PURE__ */ r(M, { className: l.sheetContent, children: [
-      /* @__PURE__ */ e(_, { children: /* @__PURE__ */ e(B, { children: t.title }) }),
-      /* @__PURE__ */ r("div", { className: l.sheetBody, children: [
+    ] }) }) : null : a.type === "sidebar" ? /* @__PURE__ */ e(I, { open: i, onOpenChange: (t) => !t && u(), children: /* @__PURE__ */ l(_, { className: r.sheetContent, children: [
+      /* @__PURE__ */ e(B, { children: /* @__PURE__ */ e(H, { children: a.title }) }),
+      /* @__PURE__ */ l("div", { className: r.sheetBody, children: [
         /* @__PURE__ */ e(
           "div",
           {
-            className: l.sheetText,
+            className: r.sheetText,
             dangerouslySetInnerHTML: { __html: d }
           }
         ),
         /* @__PURE__ */ e(m, {})
       ] })
-    ] }) }) : /* @__PURE__ */ e(g, { open: i, onOpenChange: (a) => !a && u(), children: /* @__PURE__ */ r(D, { className: l[`size-${t.size || "medium"}`], children: [
-      /* @__PURE__ */ r(S, { children: [
-        /* @__PURE__ */ e(f, { children: t.title }),
-        /* @__PURE__ */ e(I, { asChild: !0, children: /* @__PURE__ */ e("div", { dangerouslySetInnerHTML: { __html: d } }) })
+    ] }) }) : /* @__PURE__ */ e(f, { open: i, onOpenChange: (t) => !t && u(), children: /* @__PURE__ */ l(g, { className: r[`size-${a.size || "medium"}`], children: [
+      /* @__PURE__ */ l(D, { children: [
+        /* @__PURE__ */ e(S, { children: a.title }),
+        /* @__PURE__ */ e(T, { asChild: !0, children: /* @__PURE__ */ e("div", { dangerouslySetInnerHTML: { __html: d } }) })
       ] }),
-      /* @__PURE__ */ e("div", { className: l.modalButtonRow, children: /* @__PURE__ */ e(m, {}) })
+      /* @__PURE__ */ e("div", { className: r.modalButtonRow, children: /* @__PURE__ */ e(m, {}) })
     ] }) });
   }
 );

package/wizard/src/features/dialog-system/components/ConfirmationDialog/ConfirmationDialog.js

@@ -1,64 +1,60 @@
 "use client";
-import { jsx as o, jsxs as a, Fragment as f } from "react/jsx-runtime";
+import { jsx as e, jsxs as t, Fragment as h } from "react/jsx-runtime";
 /* empty css                                  */
-import { Button as p } from "../../../../../../ui/src/components/button/button.js";
-import { Dialog as h, DialogContent as u, DialogHeader as C, DialogTitle as c, DialogDescription as s } from "../../../../../../ui/src/components/dialog/dialog.js";
-import { HelpCircle as m, Info as D, AlertTriangle as N } from "lucide-react";
+import { Button as f } from "../../../../../../ui/src/components/button/button.js";
+import { Dialog as u, DialogContent as g, DialogHeader as C, DialogTitle as l, DialogDescription as c } from "../../../../../../ui/src/components/dialog/dialog.js";
+import { HelpCircle as s, Info as N, AlertTriangle as D } from "lucide-react";
 import { memo as v } from "react";
-import e from "./ConfirmationDialog.module.css.js";
-const y = v(
+import n from "./ConfirmationDialog.module.css.js";
+const I = v(
   ({
     config: i,
-    formData: I,
-    onButtonClick: d,
-    onClose: w,
-    isOpen: t
+    formData: w,
+    onButtonClick: m,
+    onClose: y,
+    isOpen: d
   }) => {
-    console.log("🔍 ConfirmationDialog rendering!", { isOpen: t, config: i });
-    const l = i.templateMetadata, g = (n) => {
-      console.log("🔥 ConfirmationDialog: Button clicked with action:", n), console.log("🔥 ConfirmationDialog: Action type:", n.type), console.log(
-        "🔥 ConfirmationDialog: Action details:",
-        JSON.stringify(n, null, 2)
-      ), d(n), console.log("🔥 ConfirmationDialog: onButtonClick called");
+    const o = i.templateMetadata, p = (a) => {
+      m(a);
     }, r = (() => {
-      if (!l?.showIcon) return null;
-      switch (l?.iconType) {
+      if (!o?.showIcon) return null;
+      switch (o?.iconType) {
         case "warning":
-          return /* @__PURE__ */ o(N, { className: e.iconWarning });
+          return /* @__PURE__ */ e(D, { className: n.iconWarning });
         case "question":
-          return /* @__PURE__ */ o(m, { className: e.iconInfo });
+          return /* @__PURE__ */ e(s, { className: n.iconInfo });
         case "info":
-          return /* @__PURE__ */ o(D, { className: e.iconInfo });
+          return /* @__PURE__ */ e(N, { className: n.iconInfo });
         default:
-          return /* @__PURE__ */ o(m, { className: e.iconInfo });
+          return /* @__PURE__ */ e(s, { className: n.iconInfo });
       }
     })();
-    return /* @__PURE__ */ o(h, { open: t, onOpenChange: () => !1, children: /* @__PURE__ */ a(u, { className: e.dialogContent, children: [
-      /* @__PURE__ */ o(C, { children: r ? /* @__PURE__ */ a("div", { className: e.iconRow, children: [
-        /* @__PURE__ */ o("div", { className: e.iconCircle, children: r }),
-        /* @__PURE__ */ a("div", { children: [
-          /* @__PURE__ */ o(c, { children: i.title }),
-          /* @__PURE__ */ o(s, { className: e.descriptionSpaced, children: i.content })
+    return /* @__PURE__ */ e(u, { open: d, onOpenChange: () => !1, children: /* @__PURE__ */ t(g, { className: n.dialogContent, children: [
+      /* @__PURE__ */ e(C, { children: r ? /* @__PURE__ */ t("div", { className: n.iconRow, children: [
+        /* @__PURE__ */ e("div", { className: n.iconCircle, children: r }),
+        /* @__PURE__ */ t("div", { children: [
+          /* @__PURE__ */ e(l, { children: i.title }),
+          /* @__PURE__ */ e(c, { className: n.descriptionSpaced, children: i.content })
         ] })
-      ] }) : /* @__PURE__ */ a(f, { children: [
-        /* @__PURE__ */ o(c, { children: i.title }),
-        /* @__PURE__ */ o(s, { children: i.content })
+      ] }) : /* @__PURE__ */ t(h, { children: [
+        /* @__PURE__ */ e(l, { children: i.title }),
+        /* @__PURE__ */ e(c, { children: i.content })
       ] }) }),
-      /* @__PURE__ */ o("div", { className: e.buttonRow, children: i.buttons.map((n) => /* @__PURE__ */ o(
-        p,
+      /* @__PURE__ */ e("div", { className: n.buttonRow, children: i.buttons.map((a) => /* @__PURE__ */ e(
+        f,
         {
-          variant: n.variant === "danger" ? "destructive" : n.variant === "secondary" ? "outline" : "default",
-          onClick: () => g(n.action),
-          className: e.minWidthButton,
-          children: n.label
+          variant: a.variant === "danger" ? "destructive" : a.variant === "secondary" ? "outline" : "default",
+          onClick: () => p(a.action),
+          className: n.minWidthButton,
+          children: a.label
         },
-        n.id
+        a.id
       )) })
     ] }) });
   }
 );
-y.displayName = "ConfirmationDialog";
+I.displayName = "ConfirmationDialog";
 export {
-  y as ConfirmationDialog,
-  y as default
+  I as ConfirmationDialog,
+  I as default
 };

package/wizard/src/features/dialog-system/components/EmailVerificationDialog/EmailVerificationDialog.js

@@ -1,50 +1,49 @@
 "use client";
-import { jsx as e, jsxs as o } from "react/jsx-runtime";
+import { jsx as e, jsxs as a } from "react/jsx-runtime";
 /* empty css                                  */
 import { Alert as E, AlertDescription as $ } from "../../../../../../ui/src/components/alert/alert.js";
 import { Button as m } from "../../../../../../ui/src/components/button/button.js";
-import { Dialog as D, DialogContent as V, DialogHeader as x, DialogTitle as A, DialogDescription as L } from "../../../../../../ui/src/components/dialog/dialog.js";
+import { Dialog as x, DialogContent as D, DialogHeader as V, DialogTitle as A, DialogDescription as L } from "../../../../../../ui/src/components/dialog/dialog.js";
 import { ValidationCode as P } from "../../../../../../ui/src/components/ValidationCode/ValidationCode.js";
 import { CheckCircle as _, Mail as j, AlertCircle as q } from "lucide-react";
-import { memo as H, useState as f, useEffect as I, useCallback as W } from "react";
+import { memo as H, useState as f, useEffect as I, useCallback as O } from "react";
 import i from "./EmailVerificationDialog.module.css.js";
-const Y = H(
+const W = H(
   ({
     config: h,
-    formData: z,
-    onButtonClick: g,
-    onClose: F,
-    isOpen: u
+    formData: Y,
+    onButtonClick: u,
+    onClose: z,
+    isOpen: C
   }) => {
-    console.log("🔥 EmailVerificationDialog rendering!", { isOpen: u, config: h });
-    const t = h.templateMetadata, [c, C] = f(""), [n, r] = f("idle"), [p, l] = f(""), [d, v] = f(0), [b, k] = f(0);
+    const t = h.templateMetadata, [c, p] = f(""), [n, s] = f("idle"), [g, l] = f(""), [d, v] = f(0), [b, k] = f(0);
     I(() => {
       if (d > 0) {
-        const a = setTimeout(() => v(d - 1), 1e3);
-        return () => clearTimeout(a);
+        const o = setTimeout(() => v(d - 1), 1e3);
+        return () => clearTimeout(o);
       }
     }, [d]);
-    const N = W(async () => {
-      r("verifying");
-      const a = b + 1;
-      k(a);
+    const N = O(async () => {
+      s("verifying");
+      const o = b + 1;
+      k(o);
       try {
-        if (await new Promise((s) => setTimeout(s, 1500)), c === "123456" || c === "000000" || c === "111111")
-          r("success");
+        if (await new Promise((r) => setTimeout(r, 1500)), c === "123456" || c === "000000" || c === "111111")
+          s("success");
         else {
-          const s = t?.maxAttempts;
-          if (s && a >= s)
-            r("blocked"), l(
+          const r = t?.maxAttempts;
+          if (r && o >= r)
+            s("blocked"), l(
               "Maximum verification attempts exceeded. Please request a new verification code."
             );
           else {
-            r("error");
-            const M = s ? s - a : null, R = t?.errorMessage || "Invalid code. Please try again.", S = M ? ` (${M} attempts remaining)` : "";
+            s("error");
+            const M = r ? r - o : null, R = t?.errorMessage || "Invalid code. Please try again.", S = M ? ` (${M} attempts remaining)` : "";
             l(R + S);
           }
         }
       } catch {
-        r("error"), l(
+        s("error"), l(
           t?.errorMessage || "Verification failed. Please try again."
         );
       }
@@ -53,18 +52,18 @@ const Y = H(
       t?.errorMessage,
       t?.maxAttempts,
       b
-    ]), w = (a) => {
-      C(a), (n === "error" || n === "blocked") && (r("idle"), l(""));
-    }, T = (a) => {
-      console.log("completedCode", a), t?.enableAutoSubmit && n === "idle" && N();
+    ]), w = (o) => {
+      p(o), (n === "error" || n === "blocked") && (s("idle"), l(""));
+    }, T = (o) => {
+      t?.enableAutoSubmit && n === "idle" && N();
     }, y = () => {
-      v(t?.resendTimer || 60), C(""), r("idle"), l(""), k(0);
+      v(t?.resendTimer || 60), p(""), s("idle"), l(""), k(0);
     }, B = () => {
-      g({ type: "close" });
+      u({ type: "close" });
     };
-    return n === "success" ? /* @__PURE__ */ e(D, { open: u, onOpenChange: () => !1, children: /* @__PURE__ */ o(V, { className: i.dialogContent, children: [
-      /* @__PURE__ */ o(x, { children: [
-        /* @__PURE__ */ o("div", { className: i.headerRow, children: [
+    return n === "success" ? /* @__PURE__ */ e(x, { open: C, onOpenChange: () => !1, children: /* @__PURE__ */ a(D, { className: i.dialogContent, children: [
+      /* @__PURE__ */ a(V, { children: [
+        /* @__PURE__ */ a("div", { className: i.headerRow, children: [
           /* @__PURE__ */ e(_, { className: `${i.iconMd} ${i.iconSuccess}` }),
           /* @__PURE__ */ e(A, { children: t?.successTitle || "Verification Successful" })
         ] }),
@@ -73,7 +72,7 @@ const Y = H(
       /* @__PURE__ */ e("div", { className: i.successButtonRow, children: /* @__PURE__ */ e(
         m,
         {
-          onClick: () => g(
+          onClick: () => u(
             t?.onVerifiedAction || {
               type: "navigate",
               direction: "next"
@@ -83,16 +82,16 @@ const Y = H(
           children: t?.continueButtonLabel || "Continue"
         }
       ) })
-    ] }) }) : /* @__PURE__ */ e(D, { open: u, onOpenChange: () => !1, children: /* @__PURE__ */ o(V, { className: i.dialogContent, children: [
-      /* @__PURE__ */ o(x, { children: [
-        /* @__PURE__ */ o("div", { className: i.headerRow, children: [
+    ] }) }) : /* @__PURE__ */ e(x, { open: C, onOpenChange: () => !1, children: /* @__PURE__ */ a(D, { className: i.dialogContent, children: [
+      /* @__PURE__ */ a(V, { children: [
+        /* @__PURE__ */ a("div", { className: i.headerRow, children: [
           /* @__PURE__ */ e(j, { className: `${i.iconMd} ${i.iconMail}` }),
           /* @__PURE__ */ e(A, { children: h.title })
         ] }),
         /* @__PURE__ */ e(L, { children: h.content })
       ] }),
-      /* @__PURE__ */ o("div", { className: i.formContent, children: [
-        /* @__PURE__ */ o("div", { className: i.codeSection, children: [
+      /* @__PURE__ */ a("div", { className: i.formContent, children: [
+        /* @__PURE__ */ a("div", { className: i.codeSection, children: [
           /* @__PURE__ */ e("div", { className: i.codeLabel, children: "Verification Code" }),
           /* @__PURE__ */ e("div", { className: i.codeCenter, children: /* @__PURE__ */ e(
             P,
@@ -105,9 +104,9 @@ const Y = H(
             }
           ) })
         ] }),
-        (n === "error" || n === "blocked") && p && /* @__PURE__ */ o(E, { variant: "destructive", children: [
+        (n === "error" || n === "blocked") && g && /* @__PURE__ */ a(E, { variant: "destructive", children: [
           /* @__PURE__ */ e(q, { className: i.iconSm }),
-          /* @__PURE__ */ e($, { children: p })
+          /* @__PURE__ */ e($, { children: g })
         ] }),
         t?.enableResend && n !== "blocked" && /* @__PURE__ */ e("div", { className: i.resendText, children: d > 0 ? `Resend code in ${d}s` : /* @__PURE__ */ e(
           m,
@@ -128,7 +127,7 @@ const Y = H(
           }
         ) })
       ] }),
-      /* @__PURE__ */ o("div", { className: i.footerButtonRow, children: [
+      /* @__PURE__ */ a("div", { className: i.footerButtonRow, children: [
         /* @__PURE__ */ e(m, { variant: "secondary", onClick: B, children: t?.cancelButtonLabel || "Cancel" }),
         /* @__PURE__ */ e(
           m,
@@ -142,8 +141,8 @@ const Y = H(
     ] }) });
   }
 );
-Y.displayName = "EmailVerificationDialog";
+W.displayName = "EmailVerificationDialog";
 export {
-  Y as EmailVerificationDialog,
-  Y as default
+  W as EmailVerificationDialog,
+  W as default
 };

package/wizard/src/features/form-runtime/FormWizard/FormWizard.js

@@ -1,110 +1,85 @@
 "use client";
-import { jsx as e, jsxs as l } from "react/jsx-runtime";
-import { wizardDefaultRenderer as z } from "../../../renderer/wizardRenderer.js";
+import { jsx as r, jsxs as a } from "react/jsx-runtime";
+import { wizardDefaultRenderer as E } from "../../../renderer/wizardRenderer.js";
 /* empty css                               */
-import { FormLayout as m } from "../../../../../ui/src/components/FormLayout/FormLayout.js";
-import { formWizardQueryClient as E } from "../../../../../ui/src/lib/queryClient.js";
-import { QueryClientProvider as M } from "@tanstack/react-query";
-import { clsx as g } from "clsx";
-import { memo as N, useState as h, useEffect as w, useMemo as u } from "react";
-import n from "./FormWizard.module.css.js";
+import { FormLayout as s } from "../../../../../ui/src/components/FormLayout/FormLayout.js";
+import { formWizardQueryClient as z } from "../../../../../ui/src/lib/queryClient.js";
+import { QueryClientProvider as N } from "@tanstack/react-query";
+import { clsx as u } from "clsx";
+import { memo as M, useState as h, useEffect as P, useMemo as g } from "react";
+import t from "./FormWizard.module.css.js";
 import W from "../components/FormStep/FormStep.js";
-import L from "../components/StepProgressIndicator/StepProgressIndicator.js";
-import { hasTemplateSteps as P, resolveFormWizardConfig as T } from "../config/configResolver.js";
-import { ThemeProvider as I, useThemeConfig as x } from "../../../../../ui/src/theme/ThemeProvider.js";
-import { useFormMachineProvider as b, FormMachineContext as U } from "../../state-management/machines/useFormMachine.js";
-import j from "../../../../../ui/src/lib/error-boundaries/FormWizardErrorBoundary.js";
-import { FormEditingProvider as O } from "../../../../../ui/src/lib/providers/FormEditingContext.js";
-import s from "../../../../../ui/src/lib/error-boundaries/ComponentErrorBoundary.js";
-import { ActionManager as R } from "../../trigger-action-system/components/ActionManager.js";
-import { registerRenderComponent as V } from "../../../../../ui/src/component-registry/renderComponent.js";
-import { ValidationEngine as k } from "../../validation-system/validation/ValidationEngine.js";
-import { Heading as A } from "@rijkshuisstijl-community/components-react";
-V(z);
-const v = N(
+import w from "../components/StepProgressIndicator/StepProgressIndicator.js";
+import { hasTemplateSteps as x, resolveFormWizardConfig as L } from "../config/configResolver.js";
+import { ThemeProvider as T, useThemeConfig as I } from "../../../../../ui/src/theme/ThemeProvider.js";
+import { useFormMachineProvider as R, FormMachineContext as j } from "../../state-management/machines/useFormMachine.js";
+import A from "../../../../../ui/src/lib/error-boundaries/FormWizardErrorBoundary.js";
+import { FormEditingProvider as B } from "../../../../../ui/src/lib/providers/FormEditingContext.js";
+import l from "../../../../../ui/src/lib/error-boundaries/ComponentErrorBoundary.js";
+import { ActionManager as H } from "../../trigger-action-system/components/ActionManager.js";
+import { registerRenderComponent as Q } from "../../../../../ui/src/component-registry/renderComponent.js";
+import { ValidationEngine as b } from "../../validation-system/validation/ValidationEngine.js";
+import { Heading as D } from "@rijkshuisstijl-community/components-react";
+Q(E);
+const v = M(
   ({
-    config: r,
-    initialData: a = {},
+    config: e,
+    initialData: n = {},
     onSubmit: C,
-    queryClient: y = E
+    queryClient: y = z
   }) => {
-    console.log(
-      "🏁 [FormWizard] FormWizardCore component MOUNTING with config:",
-      {
-        configId: r.id,
-        configTitle: r.title,
-        stepCount: r.steps?.length,
-        validationMessageStyle: r.validationMessageStyle,
-        hasInitialData: Object.keys(a).length > 0
-      }
-    ), typeof window < "u" && setTimeout(() => {
-      console.log(
-        "🚨 [FormWizard] MOUNTED SUCCESSFULLY - Check console for detailed logs"
-      );
-    }, 100);
-    const [t, d] = h(null), [c, f] = h(null);
-    w(() => {
+    const [i, d] = h(null), [c, f] = h(null);
+    P(() => {
       (async () => {
         try {
-          if (f(null), P(r)) {
-            const o = await T(r);
+          if (f(null), x(e)) {
+            const o = await L(e);
             d(o);
           } else
-            d(r);
+            d(e);
         } catch (o) {
           f(
             o instanceof Error ? o.message : "Failed to resolve configuration"
           ), console.error("Error resolving form configuration:", o);
         }
       })();
-    }, [r]);
-    const p = u(() => {
-      console.log(
-        "🚀 [FormWizard] Creating ValidationEngine with messageStyle:",
-        r.validationMessageStyle || "withLabel"
-      );
-      const i = new k({
-        messageStyle: r.validationMessageStyle || "withLabel"
-      });
-      return console.log("✅ [FormWizard] ValidationEngine created:", {
-        engine: !!i,
-        validateField: typeof i.validateField,
-        messageStyle: r.validationMessageStyle || "withLabel"
-      }), i;
-    }, [r.validationMessageStyle]), S = u(() => t ? {
-      ...t,
-      steps: t.steps.map((i) => {
-        const o = i;
+    }, [e]);
+    const p = g(() => new b({
+      messageStyle: e.validationMessageStyle || "withLabel"
+    }), [e.validationMessageStyle]), S = g(() => i ? {
+      ...i,
+      steps: i.steps.map((m) => {
+        const o = m;
         return {
           ...o,
           schema: o.schema || p.getStepSchema(o)
         };
       })
-    } : null, [t, p]), F = b({
-      config: S || r,
+    } : null, [i, p]), F = R({
+      config: S || e,
       // Fallback to original config if resolution fails
-      initialData: a,
+      initialData: n,
       onSubmit: C
     });
-    return c ? /* @__PURE__ */ l("div", { className: g("form-wizard-error", n.errorState), children: [
-      /* @__PURE__ */ e("h3", { className: n.errorHeading, children: "Configuration Error" }),
-      /* @__PURE__ */ e("p", { children: c })
-    ] }) : t ? /* @__PURE__ */ e(M, { client: y, children: /* @__PURE__ */ e(j, { formId: r.id, children: /* @__PURE__ */ e(O, { children: /* @__PURE__ */ l(U.Provider, { value: F, children: [
-      /* @__PURE__ */ e(s, { componentName: "ActionManager", children: /* @__PURE__ */ e(R, {}) }),
-      /* @__PURE__ */ l(m, { className: n.formLayout, children: [
-        /* @__PURE__ */ e(m.Title, { children: /* @__PURE__ */ e(A, { level: 1, children: r.title }) }),
-        /* @__PURE__ */ e(m.LeftColumn, { children: /* @__PURE__ */ e(s, { componentName: "StepProgressIndicator", children: /* @__PURE__ */ e(L, {}) }) }),
-        /* @__PURE__ */ e(s, { componentName: "FormStep", children: /* @__PURE__ */ e(W, {}) })
+    return c ? /* @__PURE__ */ a("div", { className: u("form-wizard-error", t.errorState), children: [
+      /* @__PURE__ */ r("h3", { className: t.errorHeading, children: "Configuration Error" }),
+      /* @__PURE__ */ r("p", { children: c })
+    ] }) : i ? /* @__PURE__ */ r(N, { client: y, children: /* @__PURE__ */ r(A, { formId: e.id, children: /* @__PURE__ */ r(B, { children: /* @__PURE__ */ a(j.Provider, { value: F, children: [
+      /* @__PURE__ */ r(l, { componentName: "ActionManager", children: /* @__PURE__ */ r(H, {}) }),
+      /* @__PURE__ */ a(s, { className: t.formLayout, children: [
+        /* @__PURE__ */ r(s.Title, { children: /* @__PURE__ */ r(D, { level: 1, children: e.title }) }),
+        /* @__PURE__ */ r(s.LeftColumn, { children: /* @__PURE__ */ r(l, { componentName: "StepProgressIndicator", children: /* @__PURE__ */ r(w, {}) }) }),
+        /* @__PURE__ */ r(l, { componentName: "FormStep", children: /* @__PURE__ */ r(W, {}) })
       ] })
-    ] }) }) }) }) : /* @__PURE__ */ e("div", { className: g("form-wizard-loading", n.loadingState), children: /* @__PURE__ */ e("div", { className: n.loadingPulse, children: "Loading form templates..." }) });
+    ] }) }) }) }) : /* @__PURE__ */ r("div", { className: u("form-wizard-loading", t.loadingState), children: /* @__PURE__ */ r("div", { className: t.loadingPulse, children: "Loading form templates..." }) });
   }
 );
 v.displayName = "FormWizardCore";
-const B = (r) => {
-  const a = x();
-  return /* @__PURE__ */ e(I, { config: a, children: /* @__PURE__ */ e(v, { ...r }) });
+const V = (e) => {
+  const n = I();
+  return /* @__PURE__ */ r(T, { config: n, children: /* @__PURE__ */ r(v, { ...e }) });
 };
-B.displayName = "FormWizard";
+V.displayName = "FormWizard";
 export {
-  B as default
+  V as default
 };