fix(react): flush effect sync

chakra-ui · Mar 8, 2025 · f8ac71e · f8ac71e
1 parent 9e3d225
commit f8ac71e
Show file tree

Hide file tree

Showing 2 changed files with 8 additions and 3 deletions.
diff --git a/.changeset/long-snakes-shout.md b/.changeset/long-snakes-shout.md
@@ -0,0 +1,5 @@
+---
+"@zag-js/react": patch
+---
+
+Flush effects synchronously rather than within a microtask
diff --git a/packages/frameworks/react/src/machine.ts b/packages/frameworks/react/src/machine.ts
@@ -217,10 +217,10 @@ export function useMachine<T extends MachineSchema>(
     const fns = effects.current
     return () => {
       hydratedStateRef.current = state.ref.current
+      fns.forEach((fn) => fn?.())
+      effects.current = new Map()
+      transitionRef.current = null
       queueMicrotask(() => {
-        fns.forEach((fn) => fn?.())
-        effects.current = new Map()
-        transitionRef.current = null
         action(machine.exit)
       })
     }