chore: stricter TS check for transform style (#38348)

Summary:
This improves the strictness of TS typings for `transform` on `View`'s `style` prop. Consider the following example, with what TS reports in case of errors, using RN 0.72.3. The ❌ / ✅ symbols indicate whether TS is happy with the code

```tsx
❌ <View style={{ transform: [{ scale: undefined }] }} />              //  TS2769: No overload matches this call.
❌ <View style={{ transform: [{ something: 1 }] }} />                  //  TS2769: No overload matches this call.
✅ <View style={{ transform: [{ scale: 1 }, { rotate: '90deg' }] }} />
✅ <View style={{ transform: [{ scale: 1, translateX: 1 }] }} /> // this is WRONG, corrected in the next row
✅ <View style={{ transform: [{ scale: 1 }, { translateX: 1 }] }} />
```

With this change, TS will report an error even for line 4

```tsx
❌ <View style={{ transform: [{ scale: undefined }] }} />              //  TS2769: No overload matches this call.
❌ <View style={{ transform: [{ something: 1 }] }} />                  //  TS2769: No overload matches this call.
✅ <View style={{ transform: [{ scale: 1 }, { rotate: '90deg' }] }} />
❌ <View style={{ transform: [{ scale: 1, translateX: 1 }] }} />      //  TS2769: No overload matches this call.
✅ <View style={{ transform: [{ scale: 1 }, { translateX: 1 }] }} />
```

## Changelog:

<!-- Help reviewers and the release process by writing your own changelog entry.

[GENERAL] [CHANGED] - stricter TS check for transform style

For more details, see:
https://reactnative.dev/contributing/changelogs-in-pull-requests

Pull Request resolved: #38348

Test Plan: tested locally with the example given above; also added a TS type test

Reviewed By: rshest

Differential Revision: D47526366

Pulled By: NickGerleman

fbshipit-source-id: 5bd007ce29509ccdfce74c3864dee24290d9a175

packages/react-native/Libraries/StyleSheet/StyleSheetTypes.d.ts

@@ -173,23 +173,27 @@ interface MatrixTransform {
   matrix: AnimatableNumericValue[];
 }
 
+type MaximumOneOf<T, K extends keyof T = keyof T> = K extends keyof T
+  ? {[P in K]: T[K]} & {[P in Exclude<keyof T, K>]?: never}
+  : never;
+
 export interface TransformsStyle {
   transform?:
-    | (
-        | PerpectiveTransform
-        | RotateTransform
-        | RotateXTransform
-        | RotateYTransform
-        | RotateZTransform
-        | ScaleTransform
-        | ScaleXTransform
-        | ScaleYTransform
-        | TranslateXTransform
-        | TranslateYTransform
-        | SkewXTransform
-        | SkewYTransform
-        | MatrixTransform
-      )[]
+    | MaximumOneOf<
+        PerpectiveTransform &
+          RotateTransform &
+          RotateXTransform &
+          RotateYTransform &
+          RotateZTransform &
+          ScaleTransform &
+          ScaleXTransform &
+          ScaleYTransform &
+          TranslateXTransform &
+          TranslateYTransform &
+          SkewXTransform &
+          SkewYTransform &
+          MatrixTransform
+      >[]
     | string
     | undefined;
   /**

packages/react-native/types/__typetests__/animated.tsx

@@ -237,6 +237,8 @@ function TestAnimatedAPI() {
         }}
       />
       ;
+      {/* @ts-expect-error the transform object must contain only one key-value pair */}
+      <Animated.View style={{transform: [{scale: 1, translateX: 20}]}} />;
     </View>
   );
 }