Fix Max update depth exceeded with useAutoAnimate

formkit · Nov 3, 2023 · 3cd8cae · 3cd8cae
1 parent 8e4626a
commit 3cd8cae
Showing 1 changed file with 4 additions and 3 deletions.
diff --git a/src/react/index.ts b/src/react/index.ts
@@ -1,4 +1,4 @@
-import { useState, useCallback, RefCallback } from "react"
+import { useState, useCallback, RefCallback, useMemo } from "react"
 import autoAnimate, {
   AutoAnimateOptions,
   AutoAnimationPlugin,
@@ -16,15 +16,16 @@ export function useAutoAnimate<T extends Element>(
   const [controller, setController] = useState<
     AnimationController | undefined
   >()
+  const memoizedOptions = useMemo(() => options, [])
   const element = useCallback(
     (node: T) => {
       if (node instanceof HTMLElement) {
-        setController(autoAnimate(node, options))
+        setController(autoAnimate(node, memoizedOptions))
       } else {
         setController(undefined)
       }
     },
-    [options]
+    [memoizedOptions]
   )
   const setEnabled = useCallback(
     (enabled: boolean) => {