[add] support for CSS grid properties (experimental)

Allow people to experiment with using CSS grid in react-native. (No
support for shorthand properties.)
This commit is contained in:
Nicolas Gallagher
2017-04-22 10:34:43 -07:00
parent 4822cf4620
commit 227971d22c
3 changed files with 38 additions and 4 deletions
+17 -1
View File
@@ -186,7 +186,7 @@ Controls whether the View can be the target of touch events. The enhanced
+ `borderRightWidth`
+ `borderTopWidth`
+ `bottom`
+ `boxShadow`
+ `boxShadow` ‡
+ `boxSizing`
+ `clip` ‡
+ `cursor` ‡
@@ -198,6 +198,18 @@ Controls whether the View can be the target of touch events. The enhanced
+ `flexGrow`
+ `flexShrink`
+ `flexWrap`
+ `gridAutoColumns` ‡
+ `gridAutoFlow` ‡
+ `gridAutoRows` ‡
+ `gridColumnEnd` ‡
+ `gridColumnGap` ‡
+ `gridColumnStart` ‡
+ `gridRowEnd` ‡
+ `gridRowGap` ‡
+ `gridRowStart` ‡
+ `gridTemplateColumns` ‡
+ `gridTemplateRows` ‡
+ `gridTemplateAreas` ‡
+ `height`
+ `justifyContent`
+ `left`
@@ -230,6 +242,10 @@ Controls whether the View can be the target of touch events. The enhanced
+ `perspectiveOrigin` ‡
+ `position`
+ `right`
+ `shadowColor`
+ `shadowOffset`
+ `shadowOpacity`
+ `shadowRadius`
+ `top`
+ `transform`
+ `transformOrigin` ‡
+1 -1
View File
@@ -18,7 +18,7 @@ module.exports = {
* @platform unsupported
*/
elevation: number,
/*
/**
* @platform web
*/
backgroundAttachment: string,
+20 -2
View File
@@ -14,7 +14,6 @@ const LayoutPropTypes = {
]),
alignItems: oneOf(['baseline', 'center', 'flex-end', 'flex-start', 'stretch']),
alignSelf: oneOf(['auto', 'baseline', 'center', 'flex-end', 'flex-start', 'stretch']),
aspectRatio: number,
backfaceVisibility: hiddenOrVisible,
borderWidth: numberOrString,
borderBottomWidth: numberOrString,
@@ -61,7 +60,26 @@ const LayoutPropTypes = {
top: numberOrString,
visibility: hiddenOrVisible,
width: numberOrString,
zIndex: number
zIndex: number,
/**
* @platform unsupported
*/
aspectRatio: number,
/**
* @platform web
*/
gridAutoColumns: string,
gridAutoFlow: string,
gridAutoRows: string,
gridColumnEnd: string,
gridColumnGap: string,
gridColumnStart: string,
gridRowEnd: string,
gridRowGap: string,
gridRowStart: string,
gridTemplateColumns: string,
gridTemplateRows: string,
gridTemplateAreas: string
};
module.exports = LayoutPropTypes;