Refine StyleSheet Flow types
Summary:
Nice addition of the recent Flow types for style props in 9c29ee1504
, however I think there are some slight issues in the definition.
`type Styles = {[key: string]: Object}` makes sense, as it's referring to the set of named style groups a user creates a `StyleSheet` from, e.g.
```javascript
const styles: StyleSheet = StyleSheet.create({
container: {
height: 20
},
text: {
color: '#999',
fontSize: 12,
},
}: Styles)
```
However `type StyleValue = {[key: string]: Object}` doesn't make sense. You actually want only the `Object` portion of that definition, presuming it's meant to be used like below:
```javascript
type MyTextProps = {
style: StyleProp,
}
<MyText style={{ color: '#999', fontSize: 12 }}>Hello</Text>
```
---
I've also added `void` to the `StyleValue`, as undefined seems to be handled fine, and can be a useful shorthand in JSX.
---
And finally, I've allowed nesting of style prop arrays, by making StyleProp self-referencing, as RN seems to flatten those without issue. This can be important if you're passing in a style prop quite high up the component tree, and sticking it in an array with other styles at several points while it's passed down.
N/A (These types aren't referenced anywhere else)
[INTERNAL] [MINOR] [StyleSheet] - Refine Flow types
Closes https://github.com/facebook/react-native/pull/16741
Reviewed By: frantic
Differential Revision: D6278010
Pulled By: TheSavior
fbshipit-source-id: 0170a233ab71d29f445786f5e695463f9730db3a
This commit is contained in:
parent
e5a4ea97d9
commit
820cfa1f3b
|
@ -20,8 +20,8 @@ const flatten = require('flattenStyle');
|
|||
|
||||
export type Styles = {[key: string]: Object};
|
||||
export type StyleSheet<S: Styles> = {[key: $Keys<S>]: number};
|
||||
export type StyleValue = {[key: string]: Object} | number | false | null;
|
||||
export type StyleProp = StyleValue | Array<StyleValue>;
|
||||
export type StyleValue = Object | number | false | null | void | '';
|
||||
export type StyleProp = StyleValue | Array<StyleProp>;
|
||||
|
||||
let hairlineWidth = PixelRatio.roundToNearestPixel(0.4);
|
||||
if (hairlineWidth === 0) {
|
||||
|
|
Loading…
Reference in New Issue