Fixed wrong logic in fallback of commit method

Author: inokawa

src/hooks/core.ts

@@ -1,4 +1,4 @@
-import { noop } from "../utils";
+import { getKeys, noop, uniqBy } from "../utils";
 
 export type AnimatableCSSProperties = Omit<
   React.CSSProperties,
@@ -25,6 +25,9 @@ export interface AnimationOptions
   easing?: TypedEasing;
 }
 
+export const getKeyframeKeys = (keyframes: TypedKeyframe[]): string[] =>
+  uniqBy(keyframes.flatMap((k) => getKeys(k)));
+
 export const createAnimation = (
   el: HTMLElement | null,
   keyframes: Keyframe[] | null,

src/hooks/useAnimation.ts

@@ -1,15 +1,10 @@
 import { createRef, useEffect, useLayoutEffect, useRef, useState } from "react";
-import {
-  getKeys,
-  isSameObject,
-  isSameObjectArray,
-  toArray,
-  uniqBy,
-} from "../utils";
+import { isSameObject, isSameObjectArray, toArray } from "../utils";
 import {
   AnimationOptions,
   createAnimation,
   createHandle,
+  getKeyframeKeys,
   TypedKeyframe,
 } from "./core";
 
@@ -104,7 +99,7 @@ export const useAnimation = (
           handle._commit(
             getAnimation(),
             getTarget()!,
-            uniqBy(getKeys(getKeyframes()))
+            getKeyframeKeys(getKeyframes())
           );
           return externalHandle;
         },

src/hooks/useAnimations.ts

@@ -1,15 +1,10 @@
 import { createRef, useEffect, useLayoutEffect, useRef, useState } from "react";
-import {
-  getKeys,
-  isSameObject,
-  isSameObjectArray,
-  toArray,
-  uniqBy,
-} from "../utils";
+import { isSameObject, isSameObjectArray, toArray } from "../utils";
 import {
   AnimationOptions,
   createAnimation,
   createHandle,
+  getKeyframeKeys,
   TypedKeyframe,
 } from "./core";
 import type { WithRef } from "./useAnimation";
@@ -106,7 +101,7 @@ export const useAnimations = <ID extends string>(
         handle._commit(
           getAnimation(name),
           getTarget()!,
-          uniqBy(getKeys(toArray(getKeyframesAndOptions(name)[0])))
+          getKeyframeKeys(toArray(getKeyframesAndOptions(name)[0]))
         );
         return externalHandle;
       },