@digiform/wizard 0.3.1 → 0.3.2

package/wizard/src/features/form-runtime/hooks/useFieldEventHandlers.js

@@ -1,61 +1,47 @@
 "use client";
-import { useCallback as g } from "react";
-import { markFieldAsUserInteracted as u } from "../utils/validationUX.js";
+import { useCallback as m } from "react";
+import { markFieldAsUserInteracted as o } from "../utils/validationUX.js";
 import { useComponentTriggers as B } from "./useComponentTriggers.js";
-import { useFormMachine as F } from "../../state-management/machines/useFormMachine.js";
-const E = ({
-  componentId: s,
-  hasIsDirtyTriggers: r,
-  originalValueFromMachine: i,
+import { useFormMachine as k } from "../../state-management/machines/useFormMachine.js";
+const b = ({
+  componentId: r,
+  hasIsDirtyTriggers: i,
+  originalValueFromMachine: l,
   getEnhancedIsDirty: n,
   resetValidationState: f
 }) => {
-  const [, , d] = F(), { setData: h } = d, t = B({ componentId: s }), C = g(
-    (a) => (e) => {
-      const l = a.state.value;
-      if (console.log(
-        `🔍 [useFieldEventHandlers] handleChange for ${s}:`,
-        {
-          oldValue: l,
-          newValue: e,
-          valueType: typeof e,
-          isSameValue: l === e
-        }
-      ), u(s), a.handleChange(e), console.log(
-        `🔍 [useFieldEventHandlers] AFTER field.handleChange for ${s}:`,
-        {
-          fieldStateValue: a.state.value,
-          fieldStateMeta: a.state.meta
-        }
-      ), l !== e && h(s, e), f(), r && i !== void 0) {
-        const c = n(
-          l,
-          a.state.meta.isDirty
-        ), o = e !== i;
-        o !== c && (o ? t.evaluateTriggers("valueChange", e) : t.dismissAlert());
+  const [, , u] = k(), { setData: h } = u, s = B({ componentId: r }), C = m(
+    (t) => (e) => {
+      const a = t.state.value;
+      if (o(r), t.handleChange(e), a !== e && h(r, e), f(), i && l !== void 0) {
+        const d = n(
+          a,
+          t.state.meta.isDirty
+        ), g = e !== l;
+        g !== d && (g ? s.evaluateTriggers("valueChange", e) : s.dismissAlert());
       }
-      t.hasTriggers && !r && l !== e && t.handleValueChange(e);
+      s.hasTriggers && !i && a !== e && s.handleValueChange(e);
     },
     [
-      s,
+      r,
       h,
       f,
-      r,
       i,
+      l,
       n,
-      t
+      s
     ]
-  ), m = g(
-    (a) => () => {
-      u(s), a.handleBlur(), t.hasTriggers && t.handleBlur();
+  ), c = m(
+    (t) => () => {
+      o(r), t.handleBlur(), s.hasTriggers && s.handleBlur();
     },
-    [s, t]
+    [r, s]
   );
   return {
     handleChange: C,
-    handleBlur: m
+    handleBlur: c
   };
 };
 export {
-  E as useFieldEventHandlers
+  b as useFieldEventHandlers
 };

package/wizard/src/features/form-runtime/hooks/useValidationEvents.js

@@ -1,37 +1,34 @@
 "use client";
-import { useState as s, useRef as u, useCallback as c, useEffect as f } from "react";
+import { useState as c, useCallback as f, useMemo as u, useEffect as r } from "react";
+import { useFormMachine as V } from "../../state-management/machines/useFormMachine.js";
 const w = ({
-  componentId: t
+  componentId: e
 }) => {
-  const [d, i] = s(!1), a = u(null), o = c(() => {
-    i(!1);
-  }, []);
-  return f(() => {
-    const r = (n) => {
-      const { fieldId: e } = n.detail;
-      e === t && i(!0);
-    }, l = (n) => {
-      const { fieldIds: e } = n.detail;
-      Array.isArray(e) && e.includes(t) && i(!0);
+  const [i] = V(), [n, t] = c(!1), s = f(() => {
+    t(!1);
+  }, []), a = u(
+    () => i.context.forcedValidationFields.includes(e),
+    [i.context.forcedValidationFields, e]
+  );
+  return r(() => {
+    a && t(!0);
+  }, [a]), r(() => {
+    const o = (d) => {
+      const { fieldId: l } = d.detail;
+      l === e && t(!0);
     };
-    return a.current = r, window.addEventListener(
+    return window.addEventListener(
       "triggerFieldValidation",
-      r
-    ), window.addEventListener(
-      "triggerStepValidation",
-      l
+      o
     ), () => {
       window.removeEventListener(
         "triggerFieldValidation",
-        r
-      ), window.removeEventListener(
-        "triggerStepValidation",
-        l
-      ), a.current = null;
+        o
+      );
     };
-  }, [t]), {
-    forceShowValidation: d,
-    resetValidationState: o
+  }, [e]), {
+    forceShowValidation: n,
+    resetValidationState: s
   };
 };
 export {

package/wizard/src/features/form-runtime/utils/formDirtyStateSync.js

@@ -1,50 +1,39 @@
 "use client";
-function n(u, f = {}) {
-  const t = u, { updatedFields: a, debug: r = !1 } = f;
-  r && console.log("🔄 [formDirtyStateSync] Starting dirty state reset:", {
-    updatedFields: a,
-    formState: {
-      isDirty: t.state.isDirty,
-      dirtyFields: t.state.dirtyFields,
-      values: t.state.values
-    }
-  });
+function n(a, u = {}) {
+  const e = a, { updatedFields: c, debug: o = !1 } = u;
   try {
-    const i = Object.keys(t.state.values), c = a || i;
-    r && console.log("🔄 [formDirtyStateSync] Fields to reset:", c), c.forEach((e) => {
-      const s = t.getFieldValue(e), o = t.getFieldMeta(e);
-      if (r && console.log(`🔄 [formDirtyStateSync] Resetting field ${e}:`, {
-        currentValue: s,
-        isDirtyBefore: o?.isDirty,
-        isTouchedBefore: o?.isTouched,
-        isDefaultValueBefore: o?.isDefaultValue
-      }), t.resetField(e), s != null && s !== "" && t.setFieldValue(e, s, {
+    const s = Object.keys(e.state.values);
+    (c || s).forEach((t) => {
+      const r = e.getFieldValue(t), i = e.getFieldMeta(t);
+      if (o && console.log(`[formDirtyStateSync] Field ${t} before reset:`, {
+        currentValue: r,
+        isDirtyBefore: i?.isDirty,
+        isTouchedBefore: i?.isTouched,
+        isDefaultValueBefore: i?.isDefaultValue
+      }), e.resetField(t), r != null && r !== "" && e.setFieldValue(t, r, {
         dontUpdateMeta: !0
         // This prevents updating isDirty/isTouched flags
-      }), r) {
-        const l = t.getFieldMeta(e);
-        console.log(
-          `✅ [formDirtyStateSync] Field ${e} reset complete:`,
-          {
-            isDirtyAfter: l?.isDirty,
-            isTouchedAfter: l?.isTouched,
-            isDefaultValueAfter: l?.isDefaultValue,
-            currentValueAfter: t.getFieldValue(e)
-          }
-        );
+      }), o) {
+        const l = e.getFieldMeta(t);
+        console.log(`[formDirtyStateSync] Field ${t} reset complete:`, {
+          isDirtyAfter: l?.isDirty,
+          isTouchedAfter: l?.isTouched,
+          isDefaultValueAfter: l?.isDefaultValue,
+          currentValueAfter: e.getFieldValue(t)
+        });
       }
-    }), r && console.log("✅ [formDirtyStateSync] Dirty state reset complete:", {
+    }), o && console.log("[formDirtyStateSync] Reset complete:", {
       formStateAfter: {
-        isDirty: t.state.isDirty,
-        dirtyFields: t.state.dirtyFields,
-        values: t.state.values
+        isDirty: e.state.isDirty,
+        dirtyFields: e.state.dirtyFields,
+        values: e.state.values
       }
     });
-  } catch (i) {
+  } catch (s) {
     throw console.error(
       "❌ [formDirtyStateSync] Error during dirty state reset:",
-      i
-    ), i;
+      s
+    ), s;
   }
 }
 export {

package/wizard/src/features/form-runtime/utils/logger.js

@@ -39,13 +39,13 @@ class n {
    * Debug level logging
    */
   debug(e, o) {
-    this.config.enabled && console.log(`🔧 [FormField] ${e}`, o);
+    this.config.enabled && console.log(`[FormField] ${e}`, ...o !== void 0 ? [o] : []);
   }
   /**
    * Info level logging
    */
   info(e, o) {
-    this.config.enabled && console.log(`ℹ️ [FormField] ${e}`, o);
+    this.config.enabled && console.log(`[FormField] ${e}`, ...o !== void 0 ? [o] : []);
   }
   /**
    * Warning level logging
@@ -69,43 +69,43 @@ class n {
    * Validation specific logging
    */
   validation(e, o) {
-    this.config.enabled && console.log(`🔍 [FormField] ${e}`, o);
+    this.config.enabled && console.log(`[FormField:validation] ${e}`, ...o !== void 0 ? [o] : []);
   }
   /**
    * State management specific logging
    */
   state(e, o) {
-    this.config.enabled && console.log(`📋 [FormField] ${e}`, o);
+    this.config.enabled && console.log(`[FormField:state] ${e}`, ...o !== void 0 ? [o] : []);
   }
   /**
    * Component lifecycle logging
    */
   lifecycle(e, o) {
-    this.config.enabled && console.log(`🏁 [FormField] ${e}`, o);
+    this.config.enabled && console.log(`[FormField:lifecycle] ${e}`, ...o !== void 0 ? [o] : []);
   }
   /**
    * Change event logging
    */
   change(e, o) {
-    this.config.enabled && console.log(`🔄 [FormField] ${e}`, o);
+    this.config.enabled && console.log(`[FormField:change] ${e}`, ...o !== void 0 ? [o] : []);
   }
   /**
    * Test/experimental logging
    */
   test(e, o) {
-    this.config.enabled && console.log(`🧪 [FormField] ${e}`, o);
+    this.config.enabled && console.log(`[FormField:test] ${e}`, ...o !== void 0 ? [o] : []);
   }
 }
-const i = new n(), l = () => i.setEnabled(!0), t = () => i.setEnabled(!1), d = () => i.isEnabled();
+const i = new n(), l = () => i.setEnabled(!0), d = () => i.setEnabled(!1), t = () => i.isEnabled();
 typeof window < "u" && (window.formFieldLogger = {
   enable: l,
-  disable: t,
-  isEnabled: d,
+  disable: d,
+  isEnabled: t,
   logger: i
 });
 export {
-  t as disableFormFieldLogging,
+  d as disableFormFieldLogging,
   l as enableFormFieldLogging,
-  d as isFormFieldLoggingEnabled,
+  t as isFormFieldLoggingEnabled,
   i as logger
 };

package/wizard/src/features/state-management/machines/actions/navigationActions.js

@@ -12,7 +12,8 @@ t({
     );
     return e.config.steps[n]?.id || "";
   },
-  pendingNavigation: null
+  pendingNavigation: null,
+  forcedValidationFields: []
 });
 t({
   currentStepIndex: ({ context: e }) => Math.max(e.currentStepIndex - 1, 0),
@@ -20,18 +21,20 @@ t({
     const n = Math.max(e.currentStepIndex - 1, 0);
     return e.config.steps[n]?.id || "";
   },
-  pendingNavigation: null
+  pendingNavigation: null,
+  forcedValidationFields: []
 });
 t({
   currentStepIndex: ({ context: e, event: n }) => {
     if (n.type !== "GO_TO_STEP") return e.currentStepIndex;
     const i = e.config.steps.findIndex(
-      (r) => r.id === n.stepId
+      (a) => a.id === n.stepId
     );
     return i >= 0 ? i : e.currentStepIndex;
   },
   currentStepId: ({ context: e, event: n }) => n.type !== "GO_TO_STEP" ? e.currentStepId : n.stepId,
-  pendingNavigation: null
+  pendingNavigation: null,
+  forcedValidationFields: []
 });
 t({
   currentStepIndex: ({ context: e }) => {
@@ -42,7 +45,8 @@ t({
   },
   currentStepId: ({ context: e }) => e.pendingNavigation?.stepId || e.currentStepId,
   pendingNavigation: null,
-  canNavigate: !0
+  canNavigate: !0,
+  forcedValidationFields: []
 });
 t({
   pendingNavigation: { type: "next" }
@@ -95,9 +99,10 @@ t({
     activeWarnings: [],
     pendingVerifications: [],
     verificationResults: {}
-  }
+  },
+  forcedValidationFields: []
 });
-const p = ({
+const d = ({
   context: e,
   self: n
 }) => {
@@ -118,5 +123,5 @@ const p = ({
     }
 };
 export {
-  p as executePendingNavigation
+  d as executePendingNavigation
 };