@digiform/wizard 0.3.0 → 0.3.2

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 { useFormMachine as V } from "../../state-management/machines/useFormMachine.js";
-import { useFormContext as y } from "../hooks/useFormContext.js";
-import { useFormEditing as v } from "../../../../../ui/src/lib/providers/FormEditingContext.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 } = v(), [g, m, n] = V(), { currentStep: r, isLastStep: u } = n, { navigation: b } = r, e = y();
-  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
 };