@digiform/wizard 0.3.1 → 0.3.3

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,63 @@
 "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 d } from "react/jsx-runtime";
+import { wizardDefaultRenderer as u } 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 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 { formWizardQueryClient as g } from "../../../../../ui/src/lib/queryClient.js";
+import { QueryClientProvider as y } from "@tanstack/react-query";
+import { memo as C, useMemo as s } from "react";
+import F from "./FormWizard.module.css.js";
+import v from "../components/FormStep/FormStep.js";
+import S from "../components/StepProgressIndicator/StepProgressIndicator.js";
+import { ThemeProvider as M, useThemeConfig as z } from "../../../../../ui/src/theme/ThemeProvider.js";
+import { useFormMachineProvider as P, FormMachineContext as N } from "../../state-management/machines/useFormMachine.js";
+import W from "../../../../../ui/src/lib/error-boundaries/FormWizardErrorBoundary.js";
+import { FormEditingProvider as E } from "../../../../../ui/src/lib/providers/FormEditingContext.js";
+import i from "../../../../../ui/src/lib/error-boundaries/ComponentErrorBoundary.js";
+import { ActionManager as x } from "../../trigger-action-system/components/ActionManager.js";
+import { registerRenderComponent as L } from "../../../../../ui/src/component-registry/renderComponent.js";
+import { ValidationEngine as w } from "../../validation-system/validation/ValidationEngine.js";
+import { Heading as I } from "@rijkshuisstijl-community/components-react";
+L(u);
+const p = C(
   ({
-    config: r,
-    initialData: a = {},
-    onSubmit: C,
-    queryClient: y = E
+    config: e,
+    initialData: o = {},
+    onSubmit: l,
+    queryClient: c = g
   }) => {
-    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(() => {
-      (async () => {
-        try {
-          if (f(null), P(r)) {
-            const o = await T(r);
-            d(o);
-          } else
-            d(r);
-        } 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;
+    const n = s(() => new w({
+      messageStyle: e.validationMessageStyle || "withLabel"
+    }), [e.validationMessageStyle]), f = s(() => ({
+      ...e,
+      steps: e.steps.map((a) => {
+        const t = a;
         return {
-          ...o,
-          schema: o.schema || p.getStepSchema(o)
+          ...t,
+          schema: t.schema || n.getStepSchema(t)
         };
       })
-    } : null, [t, p]), F = b({
-      config: S || r,
-      // Fallback to original config if resolution fails
-      initialData: a,
-      onSubmit: C
+    }), [e, n]), h = P({
+      config: f,
+      initialData: o,
+      onSubmit: l
     });
-    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 /* @__PURE__ */ r(y, { client: c, children: /* @__PURE__ */ r(W, { formId: e.id, children: /* @__PURE__ */ r(E, { children: /* @__PURE__ */ d(N.Provider, { value: h, children: [
+      /* @__PURE__ */ r(i, { componentName: "ActionManager", children: /* @__PURE__ */ r(x, {}) }),
+      /* @__PURE__ */ d(m, { className: F.formLayout, children: [
+        /* @__PURE__ */ r(m.Title, { children: /* @__PURE__ */ r(I, { level: 1, children: e.title }) }),
+        /* @__PURE__ */ r(m.LeftColumn, { children: /* @__PURE__ */ r(i, { componentName: "StepProgressIndicator", children: /* @__PURE__ */ r(S, {}) }) }),
+        /* @__PURE__ */ r(i, { componentName: "FormStep", children: /* @__PURE__ */ r(v, {}) })
       ] })
-    ] }) }) }) }) : /* @__PURE__ */ e("div", { className: g("form-wizard-loading", n.loadingState), children: /* @__PURE__ */ e("div", { className: n.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 }) });
+p.displayName = "FormWizardCore";
+const T = (e) => {
+  const o = z();
+  return /* @__PURE__ */ r(M, { config: o, children: /* @__PURE__ */ r(p, { ...e }) });
 };
-B.displayName = "FormWizard";
+T.displayName = "FormWizard";
 export {
-  B as default
+  T as default
 };

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

@@ -1,16 +1,8 @@
 "use client";
-const o = "fb-errorState_khSRW", t = "fb-errorHeading_dGdN2", e = "fb-loadingState_Pdhds", r = "fb-loadingPulse_QIw08", a = "fb-formLayout_JzC8E", n = {
-  errorState: o,
-  errorHeading: t,
-  loadingState: e,
-  loadingPulse: r,
-  formLayout: a
+const o = "fb-formLayout_JzC8E", t = {
+  formLayout: o
 };
 export {
-  n as default,
-  t as errorHeading,
-  o as errorState,
-  a as formLayout,
-  r as loadingPulse,
-  e as loadingState
+  t as default,
+  o as formLayout
 };

package/wizard/src/features/form-runtime/components/FormFooter.js

@@ -1,209 +1,78 @@
 "use client";
-import { jsx as f, jsxs as p } from "react/jsx-runtime";
-import { clsx as S } from "clsx";
+import { jsx as h, jsxs as F } from "react/jsx-runtime";
+import { clsx as b } from "clsx";
 /* empty css                               */
-import { useFormContext as V } from "../hooks/useFormContext.js";
-import { useFormEditing as y } from "../../../../../ui/src/lib/providers/FormEditingContext.js";
-import { useFormMachine as v } from "../../state-management/machines/useFormMachine.js";
-import { Button as E } from "@rijkshuisstijl-community/components-react";
-const M = ({
-  navigation: l,
-  children: d,
-  isDisplayOnly: a = !1,
-  onNext: g,
-  isLastStep: m = !1,
+import { useFormContext as S } from "../hooks/useFormContext.js";
+import { useFormEditing as g } from "../../../../../ui/src/lib/providers/FormEditingContext.js";
+import { useFormMachine as N } from "../../state-management/machines/useFormMachine.js";
+import { Button as A } from "@rijkshuisstijl-community/components-react";
+const I = ({
+  navigation: r,
+  children: a,
+  isDisplayOnly: e = !1,
+  onNext: c,
+  isLastStep: p = !1,
   isDisabled: n = !1,
-  ...r
+  labels: i,
+  ...o
 }) => {
-  const u = () => {
-    a || n || g?.();
-  };
-  return /* @__PURE__ */ p(
+  const l = () => {
+    e || n || c?.();
+  }, m = r?.next?.label || (p ? i?.finish ?? "Voltooien" : i?.next ?? "Volgende");
+  return /* @__PURE__ */ F(
     "div",
     {
-      className: S(
-        (n || a) && "opacity-50",
-        r.className
+      className: b(
+        (n || e) && "opacity-50",
+        o.className
       ),
-      ...r,
+      ...o,
       children: [
-        d,
-        l?.next?.enabled !== !1 && /* @__PURE__ */ f(
-          E,
+        a,
+        r?.next?.enabled !== !1 && /* @__PURE__ */ h(
+          A,
           {
             appearance: "primary-action-button",
-            onClick: u,
-            disabled: n || a,
-            children: l?.next?.label || (m ? "Voltooien" : "Volgende")
+            onClick: l,
+            disabled: n || e,
+            children: m
           }
         )
       ]
     }
   );
-}, A = ({ children: l, ...d }) => {
-  const { isEditing: a } = y(), [g, m, n] = v(), { currentStep: r, isLastStep: u } = n, { navigation: b } = r, e = V();
-  return /* @__PURE__ */ f(
-    M,
+}, k = ({ children: r, labels: a, ...e }) => {
+  const { isEditing: c } = g(), [p, n, i] = N(), { currentStep: o, isLastStep: l, nextStep: m } = i, { navigation: u } = o, s = S(), x = () => {
+    const d = Object.keys(s.state.fieldMeta).filter((f) => {
+      const t = s.state.fieldMeta[f];
+      return !t.isValid && t.errors?.length > 0;
+    });
+    d.length > 0 && n({ type: "TRIGGER_STEP_VALIDATION", fieldIds: d });
+  };
+  return /* @__PURE__ */ h(
+    I,
     {
-      navigation: b,
+      navigation: u,
       onNext: async () => {
+        if (!s.state.canSubmit) {
+          x();
+          return;
+        }
+        const f = (o.actions ?? []).some((t) => t.trigger === "onStepFinish");
         try {
-          const c = r.actions || [], h = c.some(
-            (s) => s.trigger === "onStepFinish"
-          );
-          if (console.log("🔍 [FormFooter] Starting form submission check:", {
-            stepId: r.id,
-            stepActions: c.length,
-            hasFinishActions: h
-          }), h) {
-            const s = Object.keys(e.state.fieldMeta).map(
-              (t) => {
-                const o = e.state.fieldMeta[t], i = e.getFieldValue(t);
-                return {
-                  fieldId: t,
-                  value: i,
-                  isValid: o.isValid,
-                  isDirty: o.isDirty,
-                  isTouched: o.isTouched,
-                  errors: o.errors,
-                  errorCount: o.errors?.length || 0
-                };
-              }
-            );
-            if (console.log(
-              "🔍 [FormFooter] Step has finish actions - checking form state:",
-              {
-                canSubmit: e.state.canSubmit,
-                isValid: e.state.isValid,
-                isSubmitting: e.state.isSubmitting,
-                fieldCount: Object.keys(e.state.fieldMeta).length,
-                fieldAnalysis: s,
-                formErrors: e.state.formErrors
-              }
-            ), console.log("📋 [FormFooter] Detailed field analysis:"), s.forEach((t, o) => {
-              console.log(`  Field ${o + 1}:`, {
-                fieldId: t.fieldId,
-                value: t.value,
-                isValid: t.isValid,
-                isDirty: t.isDirty,
-                isTouched: t.isTouched,
-                errors: t.errors,
-                errorCount: t.errorCount
-              });
-            }), e.state.canSubmit)
-              await e.handleSubmit();
-            else {
-              console.log(
-                "🚫 [FormFooter] Form validation failed for step with finish actions, triggering error display:",
-                {
-                  canSubmit: e.state.canSubmit,
-                  isValid: e.state.isValid,
-                  isSubmitting: e.state.isSubmitting,
-                  fieldMeta: e.state.fieldMeta,
-                  formErrors: e.state.formErrors
-                }
-              );
-              const t = Object.keys(e.state.fieldMeta).filter(
-                (o) => {
-                  const i = e.state.fieldMeta[o];
-                  return !i.isValid && i.errors?.length > 0;
-                }
-              );
-              t.length > 0 && (console.log(
-                `🔍 [FormFooter] Triggering error display for ${t.length} invalid fields:`,
-                t
-              ), window.dispatchEvent(
-                new CustomEvent("triggerStepValidation", {
-                  detail: { fieldIds: t }
-                })
-              ));
-            }
-          } else {
-            const s = Object.keys(e.state.fieldMeta).map(
-              (t) => {
-                const o = e.state.fieldMeta[t], i = e.getFieldValue(t);
-                return {
-                  fieldId: t,
-                  value: i,
-                  isValid: o.isValid,
-                  isDirty: o.isDirty,
-                  isTouched: o.isTouched,
-                  errors: o.errors,
-                  errorCount: o.errors?.length || 0
-                };
-              }
-            );
-            if (console.log(
-              "🔍 [FormFooter] Step has no finish actions - checking form state:",
-              {
-                canSubmit: e.state.canSubmit,
-                isValid: e.state.isValid,
-                isSubmitting: e.state.isSubmitting,
-                fieldCount: Object.keys(e.state.fieldMeta).length,
-                fieldAnalysis: s,
-                formErrors: e.state.formErrors
-              }
-            ), console.log("📋 [FormFooter] Detailed field analysis:"), s.forEach((t, o) => {
-              console.log(`  Field ${o + 1}:`, {
-                fieldId: t.fieldId,
-                value: t.value,
-                isValid: t.isValid,
-                isDirty: t.isDirty,
-                isTouched: t.isTouched,
-                errors: t.errors,
-                errorCount: t.errorCount
-              });
-            }), e.state.canSubmit) {
-              const t = e.state.values, o = {};
-              console.log("🔄 [FormFooter] Preparing form values for navigation:", {
-                formValues: t,
-                fieldIds: Object.keys(t)
-              }), Object.keys(t).forEach((i) => {
-                const F = e.getFieldValue(i);
-                o[i] = F, console.log(`🔄 [FormFooter] Prepared field ${i}:`, F);
-              }), m({
-                type: "REQUEST_NAVIGATION",
-                navigationType: "next"
-              });
-            } else {
-              console.log(
-                "🚫 [FormFooter] Form cannot be submitted (validation failed or form is submitting), triggering error display:",
-                {
-                  canSubmit: e.state.canSubmit,
-                  isValid: e.state.isValid,
-                  isSubmitting: e.state.isSubmitting,
-                  fieldMeta: e.state.fieldMeta,
-                  formErrors: e.state.formErrors,
-                  values: e.state.values
-                }
-              );
-              const t = Object.keys(e.state.fieldMeta).filter(
-                (o) => {
-                  const i = e.state.fieldMeta[o];
-                  return !i.isValid && i.errors?.length > 0;
-                }
-              );
-              t.length > 0 && (console.log(
-                `🔍 [FormFooter] Triggering error display for ${t.length} invalid fields:`,
-                t
-              ), window.dispatchEvent(
-                new CustomEvent("triggerStepValidation", {
-                  detail: { fieldIds: t }
-                })
-              ));
-            }
-          }
-        } catch (c) {
-          console.log("🚫 [FormFooter] Form submission failed:", c);
+          f ? await s.handleSubmit() : m();
+        } catch (t) {
+          console.error("Form submission failed:", t);
         }
       },
-      isLastStep: u,
-      isDisabled: a,
-      ...d,
-      children: /* @__PURE__ */ f(e.Subscribe, { children: l })
+      isLastStep: l,
+      isDisabled: c,
+      labels: a,
+      ...e,
+      children: /* @__PURE__ */ h(s.Subscribe, { children: r })
     }
   );
 };
 export {
-  A as default
+  k as default
 };