cogsbox-state 0.5.483 → 0.5.485

package/src/Components.tsx

@@ -336,21 +336,28 @@ export function FormElementWrapper({
 
   const debouncedUpdate = useCallback(
     (newValue: any) => {
+      const liveTypeInfo =
+        getGlobalStore.getState().getShadowNode(stateKey, path)?._meta
+          ?.typeInfo ?? typeInfo;
+
       // Type conversion logic (keep existing)
-      if (typeInfo) {
-        if (typeInfo.type === 'number' && typeof newValue === 'string') {
+      if (liveTypeInfo) {
+        if (liveTypeInfo.type === 'number' && typeof newValue === 'string') {
           newValue =
             newValue === ''
-              ? typeInfo.nullable
+              ? liveTypeInfo.nullable
                 ? null
-                : (typeInfo.default ?? 0)
+                : (liveTypeInfo.default ?? 0)
               : Number(newValue);
         } else if (
-          typeInfo.type === 'boolean' &&
+          liveTypeInfo.type === 'boolean' &&
           typeof newValue === 'string'
         ) {
           newValue = newValue === 'true' || newValue === '1';
-        } else if (typeInfo.type === 'date' && typeof newValue === 'string') {
+        } else if (
+          liveTypeInfo.type === 'date' &&
+          typeof newValue === 'string'
+        ) {
           newValue = new Date(newValue);
         }
       } else {
@@ -476,10 +483,7 @@ export function FormElementWrapper({
       clearTimeout(debounceTimeoutRef.current);
       debounceTimeoutRef.current = null;
       isCurrentlyDebouncing.current = false;
-      setState(localValue, path, {
-        updateType: 'update',
-        validationTrigger: 'onBlur',
-      });
+      setState(localValue, path, { updateType: 'update' });
     }
 
     // Clear element's current activity
@@ -493,10 +497,26 @@ export function FormElementWrapper({
       meta?.clientActivityState?.elements?.get(componentId)?.currentActivity
         ?.startTime;
 
-    // Notify plugins
+    const validationOptions = getInitialOptions(stateKey)?.validation;
+    if (validationOptions?.onBlur) {
+      runValidation(
+        {
+          stateKey,
+          path,
+          newValue: localValue,
+          updateType: 'update',
+          timeStamp: Date.now(),
+          status: 'new',
+          oldValue: globalStateValue,
+        },
+        'onBlur'
+      );
+    }
+
+    // Refine / plugin validation runs after field validation so it wins on conflict
     notifyFormUpdate({
       stateKey,
-      activityType: 'blur', // Changed from 'type'
+      activityType: 'blur',
       path,
       timestamp: Date.now(),
       duration: focusStartTime ? Date.now() - focusStartTime : undefined,
@@ -504,21 +524,6 @@ export function FormElementWrapper({
         duration: focusStartTime ? Date.now() - focusStartTime : 0,
       },
     });
-
-    // Run validation if configured
-    const validationOptions = getInitialOptions(stateKey)?.validation;
-    if (validationOptions?.onBlur) {
-      const virtualOperation: UpdateTypeDetail = {
-        stateKey,
-        path,
-        newValue: localValue,
-        updateType: 'update',
-        timeStamp: Date.now(),
-        status: 'new',
-        oldValue: globalStateValue,
-      };
-      runValidation(virtualOperation, 'onBlur');
-    }
   }, [localValue, setState, path, stateKey, componentId, globalStateValue]);
 
   const baseState = rebuildStateShape({

package/src/PluginRunner.tsx

@@ -1,5 +1,6 @@
 import React, {
   useEffect,
+  useLayoutEffect,
   useMemo,
   useState,
   useRef,
@@ -75,7 +76,7 @@ const PluginInstance = React.memo(
     const lastProcessedOptionsRef = useRef<any>();
     const [isInitialTransform, setIsInitialTransform] = useState(true);
 
-    useEffect(() => {
+    useLayoutEffect(() => {
       if (plugin.transformState) {
         if (!isDeepEqual(options, lastProcessedOptionsRef.current)) {
           plugin.transformState({

package/src/plugins.ts

@@ -89,6 +89,7 @@ type DeconstructedCogsMethods<TStateSlice = any> = {
   initialiseShadowState: (data: any) => void;
   applyOperation: (patch: any, meta?: { dontUpdate?: boolean }) => void;
   addZodErrors: (errors: any[]) => void;
+  clearZodErrors: (paths: string[][]) => void;
   getState: () => TStateSlice;
   setOptions: (options: any) => void;
 };
@@ -104,6 +105,8 @@ export function toDeconstructedMethods(stateHandler: StateObject<any>) {
     applyOperation: (patch: any, meta?: { dontUpdate?: boolean }) =>
       stateHandler.$applyOperation(patch, meta),
     addZodErrors: (errors: any[]) => stateHandler.$addZodValidation(errors),
+    clearZodErrors: (paths: string[][]) =>
+      stateHandler.$clearZodValidationPaths(paths),
     getState: () => stateHandler.$get(),
     setOptions: (opts: any) => {
       stateHandler.$setOptions(opts);

package/src/store.ts

@@ -316,16 +316,25 @@ function getTypeFromZodSchema(
 
     const typeIdentifier = def.typeName || def.type || current._type;
 
-    // --- START: THE CRITICAL FIX FOR ZodUnion ---
     if (typeIdentifier === 'ZodUnion' || typeIdentifier === 'union') {
       if (def.options && def.options.length > 0) {
-        current = def.options[0]; // Proceed by analyzing the FIRST option of the union
-        continue; // Restart the loop with the new schema
+        const preferredOption = def.options.find((option: any) => {
+          const optionDef = option?.def || option?._def;
+          const optionType =
+            optionDef?.typeName || optionDef?.type || option?._type;
+          return (
+            optionType !== 'ZodNull' &&
+            optionType !== 'null' &&
+            optionType !== 'ZodUndefined' &&
+            optionType !== 'undefined'
+          );
+        });
+        current = preferredOption ?? def.options[0];
+        continue;
       } else {
-        break; // Union with no options, cannot determine type
+        break;
       }
     }
-    // --- END: THE CRITICAL FIX ---
 
     if (typeIdentifier === 'ZodOptional' || typeIdentifier === 'optional') {
       isOptional = true;
@@ -684,9 +693,10 @@ function getSchemaAtPath(schema: any, path: string[]): any {
     const typeIdentifier = def?.typeName || def?.type || containerSchema._type;
 
     if (typeIdentifier === 'ZodObject' || typeIdentifier === 'object') {
-      // VITAL FIX: Check for `shape` inside `def` first, then on the schema itself.
+      const rawShape =
+        def?.shape ?? containerSchema.shape ?? containerSchema._shape;
       const shape =
-        def?.shape || containerSchema.shape || containerSchema._shape;
+        typeof rawShape === 'function' ? rawShape() : rawShape;
       currentSchema = shape?.[segment];
     } else if (typeIdentifier === 'ZodArray' || typeIdentifier === 'array') {
       // For arrays, the next schema is always the element's schema.
@@ -1006,6 +1016,13 @@ export const getGlobalStore = create<CogsGlobalState>((set, get) => ({
 
     const storageKey = Array.isArray(initialState) ? `[${key}` : key;
     shadowStateStore.set(storageKey, newRoot);
+
+    const latestOptions = get().getInitialOptions(key);
+    if (latestOptions?.validation?.zodSchemaV4) {
+      updateShadowTypeInfo(key, latestOptions.validation.zodSchemaV4, 'zod4');
+    } else if (latestOptions?.validation?.zodSchemaV3) {
+      updateShadowTypeInfo(key, latestOptions.validation.zodSchemaV3, 'zod3');
+    }
   },
   getShadowNode: (key: string, path: string[]): ShadowNode | undefined => {
     let current: any =