fix: Invalid web LA keyframe processing when from/to offset is used (#8035)

## Summary

The previous implementation used an invalid type for the
`KeyframeDefinitions` type assuming that all keys in
`KeyframeDefinitions` are numbers. Because of that, it also converted
all keys to numbers via the `.map(Number)` mapping which gave `NaN`
offset values in the `offsets` array. As a result, the easing shift
didn't work properly as `NaN` aren't valid offsets so we were getting
`undefined` instead of the valid keyframe definition object.

## Example recordings

### Before


https://github.com/user-attachments/assets/1dd8933c-1811-41c7-ada1-4a87c29404c3

### After


https://github.com/user-attachments/assets/7b62f9ad-8d29-4e0f-99e4-89faf2cc19c6

Author: MatiPl01

packages/react-native-reanimated/src/layoutReanimation/web/config.ts

@@ -43,7 +43,10 @@ import type { AnimationData, AnimationStyle } from './animationParser';
 
 export type AnimationCallback = ((finished: boolean) => void) | null;
 
-export type KeyframeDefinitions = Record<number, AnimationStyle>;
+export type KeyframeDefinitions = Record<
+  `${number}` | 'from' | 'to',
+  AnimationStyle
+>;
 
 export type InitialValuesStyleProps = Omit<StyleProps, 'opacity'> & {
   opacity?: number;

packages/react-native-reanimated/src/layoutReanimation/web/createAnimation.ts

@@ -71,12 +71,14 @@ export function createCustomKeyFrameAnimation(
   // Move keyframe easings one keyframe up (our LA Keyframe definition is different
   // from the CSS keyframes and expects easing to be present in the keyframe to which
   // we animate instead of the keyframe we animate from)
-  const offsets = Object.keys(keyframeDefinitions).map(Number);
+  const offsets = Object.keys(
+    keyframeDefinitions
+  ) as (keyof KeyframeDefinitions)[];
 
   for (let i = 1; i < offsets.length; i++) {
     const style = keyframeDefinitions[offsets[i]];
     if (style.easing) {
-      keyframeDefinitions[i - 1].easing = style.easing;
+      keyframeDefinitions[offsets[i - 1]].easing = style.easing;
       delete style.easing;
     }
   }