Skip to content

Commit 619a0db

Browse files
j-piaseckireact-native-bot
j-piasecki
authored and
react-native-bot
committed
Update transform types to preserve behavior in TypeScript (#51115)
Summary: Pull Request resolved: #51115 Changelog: [Internal] Reviewed By: huntie Differential Revision: D74229819 fbshipit-source-id: 08e363ae58c29ca910601b2f078153b8ff30103c
1 parent 241b1a6 commit 619a0db

2 files changed

Lines changed: 93 additions & 42 deletions

File tree

‎packages/react-native/Libraries/StyleSheet/private/_TransformStyle.js‎

Lines changed: 49 additions & 21 deletions
Original file line numberDiff line numberDiff line change
@@ -10,6 +10,25 @@
1010

1111
import type AnimatedNode from '../../Animated/nodes/AnimatedNode';
1212

13+
// Helper types to enforce that a single key is used in a transform object
14+
// after generating a TypeScript definition file from the Flow types.
15+
// $FlowExpectedError[unclear-type]
16+
type KeysOfUnion<T> = T extends any ? $Keys<T> : empty;
17+
// $FlowExpectedError[unclear-type]
18+
type ValueOfUnion<T, K> = T extends any
19+
? K extends $Keys<T>
20+
? T[K]
21+
: empty
22+
: empty;
23+
type MergeUnion<T> = {
24+
[K in KeysOfUnion<T>]?: ValueOfUnion<T, K>,
25+
};
26+
type MaximumOneOf<T: {...}> = $Values<{
27+
[K in keyof T]: $Exact<{
28+
[P in keyof T]?: P extends K ? T[P] : empty,
29+
}>,
30+
}>;
31+
1332
export type ____TransformStyle_Internal = $ReadOnly<{
1433
/**
1534
* `transform` accepts an array of transformation objects. Each object specifies
@@ -29,27 +48,36 @@ export type ____TransformStyle_Internal = $ReadOnly<{
2948
*/
3049
transform?:
3150
| $ReadOnlyArray<
32-
| {+perspective: number | AnimatedNode}
33-
| {+rotate: string | AnimatedNode}
34-
| {+rotateX: string | AnimatedNode}
35-
| {+rotateY: string | AnimatedNode}
36-
| {+rotateZ: string | AnimatedNode}
37-
| {+scale: number | AnimatedNode}
38-
| {+scaleX: number | AnimatedNode}
39-
| {+scaleY: number | AnimatedNode}
40-
| {+translateX: number | string | AnimatedNode}
41-
| {+translateY: number | string | AnimatedNode}
42-
| {
43-
+translate:
44-
| [number | string | AnimatedNode, number | string | AnimatedNode]
45-
| AnimatedNode,
46-
}
47-
| {+skewX: string | AnimatedNode}
48-
| {+skewY: string | AnimatedNode}
49-
// TODO: what is the actual type it expects?
50-
| {
51-
+matrix: $ReadOnlyArray<number | AnimatedNode> | AnimatedNode,
52-
},
51+
$ReadOnly<
52+
MaximumOneOf<
53+
MergeUnion<
54+
| {+perspective: number | AnimatedNode}
55+
| {+rotate: string | AnimatedNode}
56+
| {+rotateX: string | AnimatedNode}
57+
| {+rotateY: string | AnimatedNode}
58+
| {+rotateZ: string | AnimatedNode}
59+
| {+scale: number | AnimatedNode}
60+
| {+scaleX: number | AnimatedNode}
61+
| {+scaleY: number | AnimatedNode}
62+
| {+translateX: number | string | AnimatedNode}
63+
| {+translateY: number | string | AnimatedNode}
64+
| {
65+
+translate:
66+
| [
67+
number | string | AnimatedNode,
68+
number | string | AnimatedNode,
69+
]
70+
| AnimatedNode,
71+
}
72+
| {+skewX: string | AnimatedNode}
73+
| {+skewY: string | AnimatedNode}
74+
// TODO: what is the actual type it expects?
75+
| {
76+
+matrix: $ReadOnlyArray<number | AnimatedNode> | AnimatedNode,
77+
},
78+
>,
79+
>,
80+
>,
5381
>
5482
| string,
5583
/**

‎packages/react-native/Libraries/__tests__/__snapshots__/public-api-test.js.snap‎

Lines changed: 44 additions & 21 deletions
Original file line numberDiff line numberDiff line change
@@ -7593,29 +7593,52 @@ export type ____ViewStyle_InternalOverrides = $ReadOnly<{}>;
75937593
`;
75947594

75957595
exports[`public API should not change unintentionally Libraries/StyleSheet/private/_TransformStyle.js 1`] = `
7596-
"export type ____TransformStyle_Internal = $ReadOnly<{
7596+
"type KeysOfUnion<T> = T extends any ? $Keys<T> : empty;
7597+
type ValueOfUnion<T, K> = T extends any
7598+
? K extends $Keys<T>
7599+
? T[K]
7600+
: empty
7601+
: empty;
7602+
type MergeUnion<T> = {
7603+
[K in KeysOfUnion<T>]?: ValueOfUnion<T, K>,
7604+
};
7605+
type MaximumOneOf<T: { ... }> = $Values<{
7606+
[K in keyof T]: $Exact<{
7607+
[P in keyof T]?: P extends K ? T[P] : empty,
7608+
}>,
7609+
}>;
7610+
export type ____TransformStyle_Internal = $ReadOnly<{
75977611
transform?:
75987612
| $ReadOnlyArray<
7599-
| { +perspective: number | AnimatedNode }
7600-
| { +rotate: string | AnimatedNode }
7601-
| { +rotateX: string | AnimatedNode }
7602-
| { +rotateY: string | AnimatedNode }
7603-
| { +rotateZ: string | AnimatedNode }
7604-
| { +scale: number | AnimatedNode }
7605-
| { +scaleX: number | AnimatedNode }
7606-
| { +scaleY: number | AnimatedNode }
7607-
| { +translateX: number | string | AnimatedNode }
7608-
| { +translateY: number | string | AnimatedNode }
7609-
| {
7610-
+translate:
7611-
| [number | string | AnimatedNode, number | string | AnimatedNode]
7612-
| AnimatedNode,
7613-
}
7614-
| { +skewX: string | AnimatedNode }
7615-
| { +skewY: string | AnimatedNode }
7616-
| {
7617-
+matrix: $ReadOnlyArray<number | AnimatedNode> | AnimatedNode,
7618-
},
7613+
$ReadOnly<
7614+
MaximumOneOf<
7615+
MergeUnion<
7616+
| { +perspective: number | AnimatedNode }
7617+
| { +rotate: string | AnimatedNode }
7618+
| { +rotateX: string | AnimatedNode }
7619+
| { +rotateY: string | AnimatedNode }
7620+
| { +rotateZ: string | AnimatedNode }
7621+
| { +scale: number | AnimatedNode }
7622+
| { +scaleX: number | AnimatedNode }
7623+
| { +scaleY: number | AnimatedNode }
7624+
| { +translateX: number | string | AnimatedNode }
7625+
| { +translateY: number | string | AnimatedNode }
7626+
| {
7627+
+translate:
7628+
| [
7629+
number | string | AnimatedNode,
7630+
number | string | AnimatedNode,
7631+
]
7632+
| AnimatedNode,
7633+
}
7634+
| { +skewX: string | AnimatedNode }
7635+
| { +skewY: string | AnimatedNode }
7636+
| {
7637+
+matrix: $ReadOnlyArray<number | AnimatedNode> | AnimatedNode,
7638+
},
7639+
>,
7640+
>,
7641+
>,
76197642
>
76207643
| string,
76217644
transformOrigin?:

0 commit comments

Comments
 (0)