Skip to content

Instantly share code, notes, and snippets.

@intergalacticspacehighway
Last active January 21, 2022 04:38
Show Gist options
  • Save intergalacticspacehighway/95e5dc6cc08f35d56a507146826e0c5f to your computer and use it in GitHub Desktop.
Save intergalacticspacehighway/95e5dc6cc08f35d56a507146826e0c5f to your computer and use it in GitHub Desktop.
React native flex gap patch - only works on iOS
diff --git a/node_modules/react-native/Libraries/Components/View/ReactNativeViewViewConfig.js b/node_modules/react-native/Libraries/Components/View/ReactNativeViewViewConfig.js
index 4d6f0dd..e120116 100644
--- a/node_modules/react-native/Libraries/Components/View/ReactNativeViewViewConfig.js
+++ b/node_modules/react-native/Libraries/Components/View/ReactNativeViewViewConfig.js
@@ -13,104 +13,104 @@ import ReactNativeViewViewConfigAndroid from './ReactNativeViewViewConfigAndroid
import {Platform} from 'react-native';
const ReactNativeViewConfig = {
- uiViewClassName: 'RCTView',
+ uiViewClassName: "RCTView",
baseModuleName: null,
- Manager: 'ViewManager',
- Commands: ({}: {...}),
- Constants: ({}: {...}),
+ Manager: "ViewManager",
+ Commands: ({}: { ... }),
+ Constants: ({}: { ... }),
bubblingEventTypes: {
...ReactNativeViewViewConfigAndroid.bubblingEventTypes,
topBlur: {
phasedRegistrationNames: {
- bubbled: 'onBlur',
- captured: 'onBlurCapture',
+ bubbled: "onBlur",
+ captured: "onBlurCapture",
},
},
topChange: {
phasedRegistrationNames: {
- bubbled: 'onChange',
- captured: 'onChangeCapture',
+ bubbled: "onChange",
+ captured: "onChangeCapture",
},
},
topEndEditing: {
phasedRegistrationNames: {
- bubbled: 'onEndEditing',
- captured: 'onEndEditingCapture',
+ bubbled: "onEndEditing",
+ captured: "onEndEditingCapture",
},
},
topFocus: {
phasedRegistrationNames: {
- bubbled: 'onFocus',
- captured: 'onFocusCapture',
+ bubbled: "onFocus",
+ captured: "onFocusCapture",
},
},
topKeyPress: {
phasedRegistrationNames: {
- bubbled: 'onKeyPress',
- captured: 'onKeyPressCapture',
+ bubbled: "onKeyPress",
+ captured: "onKeyPressCapture",
},
},
topPress: {
phasedRegistrationNames: {
- bubbled: 'onPress',
- captured: 'onPressCapture',
+ bubbled: "onPress",
+ captured: "onPressCapture",
},
},
topSubmitEditing: {
phasedRegistrationNames: {
- bubbled: 'onSubmitEditing',
- captured: 'onSubmitEditingCapture',
+ bubbled: "onSubmitEditing",
+ captured: "onSubmitEditingCapture",
},
},
topTouchCancel: {
phasedRegistrationNames: {
- bubbled: 'onTouchCancel',
- captured: 'onTouchCancelCapture',
+ bubbled: "onTouchCancel",
+ captured: "onTouchCancelCapture",
},
},
topTouchEnd: {
phasedRegistrationNames: {
- bubbled: 'onTouchEnd',
- captured: 'onTouchEndCapture',
+ bubbled: "onTouchEnd",
+ captured: "onTouchEndCapture",
},
},
topTouchMove: {
phasedRegistrationNames: {
- bubbled: 'onTouchMove',
- captured: 'onTouchMoveCapture',
+ bubbled: "onTouchMove",
+ captured: "onTouchMoveCapture",
},
},
topTouchStart: {
phasedRegistrationNames: {
- bubbled: 'onTouchStart',
- captured: 'onTouchStartCapture',
+ bubbled: "onTouchStart",
+ captured: "onTouchStartCapture",
},
},
},
directEventTypes: {
...ReactNativeViewViewConfigAndroid.directEventTypes,
topAccessibilityAction: {
- registrationName: 'onAccessibilityAction',
+ registrationName: "onAccessibilityAction",
},
topAccessibilityEscape: {
- registrationName: 'onAccessibilityEscape',
+ registrationName: "onAccessibilityEscape",
},
topAccessibilityTap: {
- registrationName: 'onAccessibilityTap',
+ registrationName: "onAccessibilityTap",
},
topLayout: {
- registrationName: 'onLayout',
+ registrationName: "onLayout",
},
topMagicTap: {
- registrationName: 'onMagicTap',
+ registrationName: "onMagicTap",
},
// Events for react-native-gesture-handler (T45765076)
// Remove once this library can handle JS View Configs
onGestureHandlerEvent: {
- registrationName: 'onGestureHandlerEvent',
+ registrationName: "onGestureHandlerEvent",
},
onGestureHandlerStateChange: {
- registrationName: 'onGestureHandlerStateChange',
+ registrationName: "onGestureHandlerStateChange",
},
},
validAttributes: {
@@ -132,25 +132,25 @@ const ReactNativeViewConfig = {
alignSelf: true,
aspectRatio: true,
backfaceVisibility: true,
- backgroundColor: {process: require('../../StyleSheet/processColor')},
- borderBottomColor: {process: require('../../StyleSheet/processColor')},
+ backgroundColor: { process: require("../../StyleSheet/processColor") },
+ borderBottomColor: { process: require("../../StyleSheet/processColor") },
borderBottomEndRadius: true,
borderBottomLeftRadius: true,
borderBottomRightRadius: true,
borderBottomStartRadius: true,
borderBottomWidth: true,
- borderColor: {process: require('../../StyleSheet/processColor')},
- borderEndColor: {process: require('../../StyleSheet/processColor')},
+ borderColor: { process: require("../../StyleSheet/processColor") },
+ borderEndColor: { process: require("../../StyleSheet/processColor") },
borderEndWidth: true,
- borderLeftColor: {process: require('../../StyleSheet/processColor')},
+ borderLeftColor: { process: require("../../StyleSheet/processColor") },
borderLeftWidth: true,
borderRadius: true,
- borderRightColor: {process: require('../../StyleSheet/processColor')},
+ borderRightColor: { process: require("../../StyleSheet/processColor") },
borderRightWidth: true,
- borderStartColor: {process: require('../../StyleSheet/processColor')},
+ borderStartColor: { process: require("../../StyleSheet/processColor") },
borderStartWidth: true,
borderStyle: true,
- borderTopColor: {process: require('../../StyleSheet/processColor')},
+ borderTopColor: { process: require("../../StyleSheet/processColor") },
borderTopEndRadius: true,
borderTopLeftRadius: true,
borderTopRightRadius: true,
@@ -170,8 +170,11 @@ const ReactNativeViewConfig = {
flexGrow: true,
flexShrink: true,
flexWrap: true,
+ rowGap: true,
+ columnGap: true,
+ gap: true,
height: true,
- hitSlop: {diff: (require('../../Utilities/differ/insetsDiffer'): any)},
+ hitSlop: { diff: (require("../../Utilities/differ/insetsDiffer"): any) },
importantForAccessibility: true,
justifyContent: true,
left: true,
@@ -214,8 +217,8 @@ const ReactNativeViewConfig = {
rotation: true,
scaleX: true,
scaleY: true,
- shadowColor: {process: require('../../StyleSheet/processColor')},
- shadowOffset: {diff: require('../../Utilities/differ/sizesDiffer')},
+ shadowColor: { process: require("../../StyleSheet/processColor") },
+ shadowOffset: { diff: require("../../Utilities/differ/sizesDiffer") },
shadowOpacity: true,
shadowRadius: true,
shouldRasterizeIOS: true,
@@ -226,25 +229,25 @@ const ReactNativeViewConfig = {
alignSelf: true,
aspectRatio: true,
backfaceVisibility: true,
- backgroundColor: {process: require('../../StyleSheet/processColor')},
- borderBottomColor: {process: require('../../StyleSheet/processColor')},
+ backgroundColor: { process: require("../../StyleSheet/processColor") },
+ borderBottomColor: { process: require("../../StyleSheet/processColor") },
borderBottomEndRadius: true,
borderBottomLeftRadius: true,
borderBottomRightRadius: true,
borderBottomStartRadius: true,
borderBottomWidth: true,
- borderColor: {process: require('../../StyleSheet/processColor')},
- borderEndColor: {process: require('../../StyleSheet/processColor')},
+ borderColor: { process: require("../../StyleSheet/processColor") },
+ borderEndColor: { process: require("../../StyleSheet/processColor") },
borderEndWidth: true,
- borderLeftColor: {process: require('../../StyleSheet/processColor')},
+ borderLeftColor: { process: require("../../StyleSheet/processColor") },
borderLeftWidth: true,
borderRadius: true,
- borderRightColor: {process: require('../../StyleSheet/processColor')},
+ borderRightColor: { process: require("../../StyleSheet/processColor") },
borderRightWidth: true,
- borderStartColor: {process: require('../../StyleSheet/processColor')},
+ borderStartColor: { process: require("../../StyleSheet/processColor") },
borderStartWidth: true,
borderStyle: true,
- borderTopColor: {process: require('../../StyleSheet/processColor')},
+ borderTopColor: { process: require("../../StyleSheet/processColor") },
borderTopEndRadius: true,
borderTopLeftRadius: true,
borderTopRightRadius: true,
@@ -252,7 +255,7 @@ const ReactNativeViewConfig = {
borderTopWidth: true,
borderWidth: true,
bottom: true,
- color: {process: require('../../StyleSheet/processColor')},
+ color: { process: require("../../StyleSheet/processColor") },
decomposedMatrix: true,
direction: true,
display: true,
@@ -264,6 +267,9 @@ const ReactNativeViewConfig = {
flexGrow: true,
flexShrink: true,
flexWrap: true,
+ rowGap: true,
+ columnGap: true,
+ gap: true,
fontFamily: true,
fontSize: true,
fontStyle: true,
@@ -290,7 +296,7 @@ const ReactNativeViewConfig = {
minWidth: true,
opacity: true,
overflow: true,
- overlayColor: {process: require('../../StyleSheet/processColor')},
+ overlayColor: { process: require("../../StyleSheet/processColor") },
padding: true,
paddingBottom: true,
paddingEnd: true,
@@ -306,25 +312,27 @@ const ReactNativeViewConfig = {
rotation: true,
scaleX: true,
scaleY: true,
- shadowColor: {process: require('../../StyleSheet/processColor')},
- shadowOffset: {diff: require('../../Utilities/differ/sizesDiffer')},
+ shadowColor: { process: require("../../StyleSheet/processColor") },
+ shadowOffset: { diff: require("../../Utilities/differ/sizesDiffer") },
shadowOpacity: true,
shadowRadius: true,
start: true,
textAlign: true,
textAlignVertical: true,
- textDecorationColor: {process: require('../../StyleSheet/processColor')},
+ textDecorationColor: {
+ process: require("../../StyleSheet/processColor"),
+ },
textDecorationLine: true,
textDecorationStyle: true,
- textShadowColor: {process: require('../../StyleSheet/processColor')},
+ textShadowColor: { process: require("../../StyleSheet/processColor") },
textShadowOffset: true,
textShadowRadius: true,
textTransform: true,
- tintColor: {process: require('../../StyleSheet/processColor')},
+ tintColor: { process: require("../../StyleSheet/processColor") },
top: true,
- transform: ((Platform.OS === 'ios'
- ? {diff: require('../../Utilities/differ/matricesDiffer')}
- : {process: require('../../StyleSheet/processTransform')}): any),
+ transform: ((Platform.OS === "ios"
+ ? { diff: require("../../Utilities/differ/matricesDiffer") }
+ : { process: require("../../StyleSheet/processTransform") }): any),
transformMatrix: true,
translateX: true,
translateY: true,
@@ -334,9 +342,9 @@ const ReactNativeViewConfig = {
},
testID: true,
top: true,
- transform: ((Platform.OS === 'ios'
- ? {diff: require('../../Utilities/differ/matricesDiffer')}
- : {process: require('../../StyleSheet/processTransform')}): any),
+ transform: ((Platform.OS === "ios"
+ ? { diff: require("../../Utilities/differ/matricesDiffer") }
+ : { process: require("../../StyleSheet/processTransform") }): any),
translateX: true,
translateY: true,
width: true,
diff --git a/node_modules/react-native/Libraries/DeprecatedPropTypes/DeprecatedLayoutPropTypes.js b/node_modules/react-native/Libraries/DeprecatedPropTypes/DeprecatedLayoutPropTypes.js
index 4d4488a..630fbf5 100644
--- a/node_modules/react-native/Libraries/DeprecatedPropTypes/DeprecatedLayoutPropTypes.js
+++ b/node_modules/react-native/Libraries/DeprecatedPropTypes/DeprecatedLayoutPropTypes.js
@@ -13,8 +13,8 @@
const ReactPropTypes = require('prop-types');
const LayoutPropTypes = {
- display: (ReactPropTypes.oneOf(['none', 'flex']): React$PropType$Primitive<
- 'none' | 'flex',
+ display: (ReactPropTypes.oneOf(["none", "flex"]): React$PropType$Primitive<
+ "none" | "flex"
>),
width: (ReactPropTypes.oneOfType([
ReactPropTypes.number,
@@ -144,76 +144,76 @@ const LayoutPropTypes = {
borderBottomWidth: ReactPropTypes.number,
borderLeftWidth: ReactPropTypes.number,
position: (ReactPropTypes.oneOf([
- 'absolute',
- 'relative',
- ]): React$PropType$Primitive<'absolute' | 'relative'>),
+ "absolute",
+ "relative",
+ ]): React$PropType$Primitive<"absolute" | "relative">),
flexDirection: (ReactPropTypes.oneOf([
- 'row',
- 'row-reverse',
- 'column',
- 'column-reverse',
+ "row",
+ "row-reverse",
+ "column",
+ "column-reverse",
]): React$PropType$Primitive<
- 'row' | 'row-reverse' | 'column' | 'column-reverse',
+ "row" | "row-reverse" | "column" | "column-reverse"
>),
flexWrap: (ReactPropTypes.oneOf([
- 'wrap',
- 'nowrap',
- 'wrap-reverse',
- ]): React$PropType$Primitive<'wrap' | 'nowrap' | 'wrap-reverse'>),
+ "wrap",
+ "nowrap",
+ "wrap-reverse",
+ ]): React$PropType$Primitive<"wrap" | "nowrap" | "wrap-reverse">),
justifyContent: (ReactPropTypes.oneOf([
- 'flex-start',
- 'flex-end',
- 'center',
- 'space-between',
- 'space-around',
- 'space-evenly',
+ "flex-start",
+ "flex-end",
+ "center",
+ "space-between",
+ "space-around",
+ "space-evenly",
]): React$PropType$Primitive<
- | 'flex-start'
- | 'flex-end'
- | 'center'
- | 'space-between'
- | 'space-around'
- | 'space-evenly',
+ | "flex-start"
+ | "flex-end"
+ | "center"
+ | "space-between"
+ | "space-around"
+ | "space-evenly"
>),
alignItems: (ReactPropTypes.oneOf([
- 'flex-start',
- 'flex-end',
- 'center',
- 'stretch',
- 'baseline',
+ "flex-start",
+ "flex-end",
+ "center",
+ "stretch",
+ "baseline",
]): React$PropType$Primitive<
- 'flex-start' | 'flex-end' | 'center' | 'stretch' | 'baseline',
+ "flex-start" | "flex-end" | "center" | "stretch" | "baseline"
>),
alignSelf: (ReactPropTypes.oneOf([
- 'auto',
- 'flex-start',
- 'flex-end',
- 'center',
- 'stretch',
- 'baseline',
+ "auto",
+ "flex-start",
+ "flex-end",
+ "center",
+ "stretch",
+ "baseline",
]): React$PropType$Primitive<
- 'auto' | 'flex-start' | 'flex-end' | 'center' | 'stretch' | 'baseline',
+ "auto" | "flex-start" | "flex-end" | "center" | "stretch" | "baseline"
>),
alignContent: (ReactPropTypes.oneOf([
- 'flex-start',
- 'flex-end',
- 'center',
- 'stretch',
- 'space-between',
- 'space-around',
+ "flex-start",
+ "flex-end",
+ "center",
+ "stretch",
+ "space-between",
+ "space-around",
]): React$PropType$Primitive<
- | 'flex-start'
- | 'flex-end'
- | 'center'
- | 'stretch'
- | 'space-between'
- | 'space-around',
+ | "flex-start"
+ | "flex-end"
+ | "center"
+ | "stretch"
+ | "space-between"
+ | "space-around"
>),
overflow: (ReactPropTypes.oneOf([
- 'visible',
- 'hidden',
- 'scroll',
- ]): React$PropType$Primitive<'visible' | 'hidden' | 'scroll'>),
+ "visible",
+ "hidden",
+ "scroll",
+ ]): React$PropType$Primitive<"visible" | "hidden" | "scroll">),
flex: ReactPropTypes.number,
flexGrow: ReactPropTypes.number,
flexShrink: ReactPropTypes.number,
@@ -221,13 +221,16 @@ const LayoutPropTypes = {
ReactPropTypes.number,
ReactPropTypes.string,
]): React$PropType$Primitive<number | string>),
+ rowGap: ReactPropTypes.number,
+ columnGap: ReactPropTypes.number,
+ gap: ReactPropTypes.number,
aspectRatio: ReactPropTypes.number,
zIndex: ReactPropTypes.number,
direction: (ReactPropTypes.oneOf([
- 'inherit',
- 'ltr',
- 'rtl',
- ]): React$PropType$Primitive<'inherit' | 'ltr' | 'rtl'>),
+ "inherit",
+ "ltr",
+ "rtl",
+ ]): React$PropType$Primitive<"inherit" | "ltr" | "rtl">),
};
module.exports = LayoutPropTypes;
diff --git a/node_modules/react-native/Libraries/StyleSheet/StyleSheetTypes.js b/node_modules/react-native/Libraries/StyleSheet/StyleSheetTypes.js
index 95ed2b8..4a34026 100644
--- a/node_modules/react-native/Libraries/StyleSheet/StyleSheetTypes.js
+++ b/node_modules/react-native/Libraries/StyleSheet/StyleSheetTypes.js
@@ -48,7 +48,7 @@ type ____LayoutStyle_Internal = $ReadOnly<{|
* It works similarly to `display` in CSS, but only support 'flex' and 'none'.
* 'flex' is the default.
*/
- display?: 'none' | 'flex',
+ display?: "none" | "flex",
/** `width` sets the width of this component.
*
@@ -330,7 +330,7 @@ type ____LayoutStyle_Internal = $ReadOnly<{|
* for more details on how `position` differs between React Native
* and CSS.
*/
- position?: 'absolute' | 'relative',
+ position?: "absolute" | "relative",
/** `flexDirection` controls which directions children of a container go.
* `row` goes left to right, `column` goes top to bottom, and you may
@@ -339,7 +339,7 @@ type ____LayoutStyle_Internal = $ReadOnly<{|
* See https://developer.mozilla.org/en-US/docs/Web/CSS/flex-direction
* for more details.
*/
- flexDirection?: 'row' | 'row-reverse' | 'column' | 'column-reverse',
+ flexDirection?: "row" | "row-reverse" | "column" | "column-reverse",
/** `flexWrap` controls whether children can wrap around after they
* hit the end of a flex container.
@@ -347,7 +347,7 @@ type ____LayoutStyle_Internal = $ReadOnly<{|
* See https://developer.mozilla.org/en-US/docs/Web/CSS/flex-wrap
* for more details.
*/
- flexWrap?: 'wrap' | 'nowrap' | 'wrap-reverse',
+ flexWrap?: "wrap" | "nowrap" | "wrap-reverse",
/** `justifyContent` aligns children in the main direction.
* For example, if children are flowing vertically, `justifyContent`
@@ -357,12 +357,12 @@ type ____LayoutStyle_Internal = $ReadOnly<{|
* for more details.
*/
justifyContent?:
- | 'flex-start'
- | 'flex-end'
- | 'center'
- | 'space-between'
- | 'space-around'
- | 'space-evenly',
+ | "flex-start"
+ | "flex-end"
+ | "center"
+ | "space-between"
+ | "space-around"
+ | "space-evenly",
/** `alignItems` aligns children in the cross direction.
* For example, if children are flowing vertically, `alignItems`
@@ -371,7 +371,7 @@ type ____LayoutStyle_Internal = $ReadOnly<{|
* See https://developer.mozilla.org/en-US/docs/Web/CSS/align-items
* for more details.
*/
- alignItems?: 'flex-start' | 'flex-end' | 'center' | 'stretch' | 'baseline',
+ alignItems?: "flex-start" | "flex-end" | "center" | "stretch" | "baseline",
/** `alignSelf` controls how a child aligns in the cross direction,
* overriding the `alignItems` of the parent. It works like `align-self`
@@ -380,12 +380,12 @@ type ____LayoutStyle_Internal = $ReadOnly<{|
* for more details.
*/
alignSelf?:
- | 'auto'
- | 'flex-start'
- | 'flex-end'
- | 'center'
- | 'stretch'
- | 'baseline',
+ | "auto"
+ | "flex-start"
+ | "flex-end"
+ | "center"
+ | "stretch"
+ | "baseline",
/** `alignContent` controls how rows align in the cross direction,
* overriding the `alignContent` of the parent.
@@ -393,12 +393,12 @@ type ____LayoutStyle_Internal = $ReadOnly<{|
* for more details.
*/
alignContent?:
- | 'flex-start'
- | 'flex-end'
- | 'center'
- | 'stretch'
- | 'space-between'
- | 'space-around',
+ | "flex-start"
+ | "flex-end"
+ | "center"
+ | "stretch"
+ | "space-between"
+ | "space-around",
/** `overflow` controls how children are measured and displayed.
* `overflow: hidden` causes views to be clipped while `overflow: scroll`
@@ -409,7 +409,7 @@ type ____LayoutStyle_Internal = $ReadOnly<{|
* `overflow: visible` only works on iOS. On Android, all views will clip
* their children.
*/
- overflow?: 'visible' | 'hidden' | 'scroll',
+ overflow?: "visible" | "hidden" | "scroll",
/** In React Native `flex` does not work the same way that it does in CSS.
* `flex` is a number rather than a string, and it works
@@ -434,6 +434,9 @@ type ____LayoutStyle_Internal = $ReadOnly<{|
flexGrow?: number,
flexShrink?: number,
flexBasis?: number | string,
+ rowGap?: number,
+ columnGap?: number,
+ gap?: number,
/**
* Aspect ratio control the size of the undefined dimension of a node. Aspect ratio is a
@@ -471,7 +474,7 @@ type ____LayoutStyle_Internal = $ReadOnly<{|
* for more details.
* @platform ios
*/
- direction?: 'inherit' | 'ltr' | 'rtl',
+ direction?: "inherit" | "ltr" | "rtl",
|}>;
type ____TransformStyle_Internal = $ReadOnly<{|
diff --git a/node_modules/react-native/Libraries/StyleSheet/splitLayoutProps.js b/node_modules/react-native/Libraries/StyleSheet/splitLayoutProps.js
index 2c6fd33..110a3ff 100644
--- a/node_modules/react-native/Libraries/StyleSheet/splitLayoutProps.js
+++ b/node_modules/react-native/Libraries/StyleSheet/splitLayoutProps.js
@@ -24,6 +24,9 @@ const OUTER_PROPS = Object.assign(Object.create(null), {
flexGrow: true,
flexShrink: true,
flexBasis: true,
+ rowGap: true,
+ columnGap: true,
+ gap: true,
alignSelf: true,
height: true,
minHeight: true,
diff --git a/node_modules/react-native/React/Views/RCTShadowView.h b/node_modules/react-native/React/Views/RCTShadowView.h
index 4696b14..bae0a51 100644
--- a/node_modules/react-native/React/Views/RCTShadowView.h
+++ b/node_modules/react-native/React/Views/RCTShadowView.h
@@ -152,6 +152,9 @@ typedef void (^RCTApplierBlock)(NSDictionary<NSNumber *, UIView *> *viewRegistry
@property (nonatomic, assign) float flexGrow;
@property (nonatomic, assign) float flexShrink;
@property (nonatomic, assign) YGValue flexBasis;
+@property (nonatomic, assign) float rowGap;
+@property (nonatomic, assign) float columnGap;
+@property (nonatomic, assign) float gap;
@property (nonatomic, assign) float aspectRatio;
diff --git a/node_modules/react-native/React/Views/RCTShadowView.m b/node_modules/react-native/React/Views/RCTShadowView.m
index 61894cd..9495bca 100644
--- a/node_modules/react-native/React/Views/RCTShadowView.m
+++ b/node_modules/react-native/React/Views/RCTShadowView.m
@@ -641,6 +641,22 @@ - (YGValue)flexBasis
return YGNodeStyleGetFlexBasis(_yogaNode);
}
+
+#define RCT_GAP_PROPERTY(setProp, getProp, cssProp, type, gap) \
+ -(void)set##setProp : (type)value \
+ { \
+ YGNodeStyleSet##cssProp(_yogaNode, gap, value); \
+ } \
+ -(type)getProp \
+ { \
+ return YGNodeStyleGet##cssProp(_yogaNode, gap); \
+ }
+
+RCT_GAP_PROPERTY(RowGap, rowGap, Gap, float, YGGapRow);
+RCT_GAP_PROPERTY(ColumnGap, columnGap, Gap, float, YGGapColumn);
+RCT_GAP_PROPERTY(Gap, gap, Gap, float, YGGapAll);
+
+
#define RCT_STYLE_PROPERTY(setProp, getProp, cssProp, type) \
-(void)set##setProp : (type)value \
{ \
diff --git a/node_modules/react-native/React/Views/RCTViewManager.m b/node_modules/react-native/React/Views/RCTViewManager.m
index 48dcd0a..c278287 100644
--- a/node_modules/react-native/React/Views/RCTViewManager.m
+++ b/node_modules/react-native/React/Views/RCTViewManager.m
@@ -391,6 +391,9 @@ - (RCTShadowView *)shadowView
RCT_EXPORT_SHADOW_PROPERTY(alignContent, YGAlign)
RCT_EXPORT_SHADOW_PROPERTY(position, YGPositionType)
RCT_EXPORT_SHADOW_PROPERTY(aspectRatio, float)
+RCT_EXPORT_SHADOW_PROPERTY(rowGap, float)
+RCT_EXPORT_SHADOW_PROPERTY(columnGap, float)
+RCT_EXPORT_SHADOW_PROPERTY(gap, float)
RCT_EXPORT_SHADOW_PROPERTY(overflow, YGOverflow)
RCT_EXPORT_SHADOW_PROPERTY(display, YGDisplay)
diff --git a/node_modules/react-native/ReactCommon/react/renderer/components/view/YogaStylableProps.cpp b/node_modules/react-native/ReactCommon/react/renderer/components/view/YogaStylableProps.cpp
index 8fe909a..4da756a 100644
--- a/node_modules/react-native/ReactCommon/react/renderer/components/view/YogaStylableProps.cpp
+++ b/node_modules/react-native/ReactCommon/react/renderer/components/view/YogaStylableProps.cpp
@@ -67,6 +67,12 @@ SharedDebugStringConvertibleList YogaStylableProps::getDebugProps() const {
"flexShrink", yogaStyle.flexShrink(), defaultYogaStyle.flexShrink()),
debugStringConvertibleItem(
"flexBasis", yogaStyle.flexBasis(), defaultYogaStyle.flexBasis()),
+ debugStringConvertibleItem(
+ "rowGap", yogaStyle.gap()[YGGapRow], defaultYogaStyle.gap()[YGGapRow]),
+ debugStringConvertibleItem(
+ "columnGap", yogaStyle.gap()[YGGapColumn], defaultYogaStyle.gap()[YGGapColumn]),
+ debugStringConvertibleItem(
+ "gap", yogaStyle.gap()[YGGapAll], defaultYogaStyle.gap()[YGGapAll]),
debugStringConvertibleItem(
"margin", yogaStyle.margin(), defaultYogaStyle.margin()),
debugStringConvertibleItem(
diff --git a/node_modules/react-native/ReactCommon/react/renderer/components/view/propsConversions.h b/node_modules/react-native/ReactCommon/react/renderer/components/view/propsConversions.h
index 89acb27..35a615f 100644
--- a/node_modules/react-native/ReactCommon/react/renderer/components/view/propsConversions.h
+++ b/node_modules/react-native/ReactCommon/react/renderer/components/view/propsConversions.h
@@ -179,6 +179,13 @@ static inline YGStyle convertRawProp(
convertRawProp(rawProps, sourceValue.position(), yogaStyle.position());
yogaStyle.padding() = convertRawProp(
rawProps, "padding", "", sourceValue.padding(), yogaStyle.padding());
+
+ yogaStyle.gap()[YGGapRow] = convertRawProp(context, rawProps, "rowGap", sourceValue.gap()[YGGapRow], yogaStyle.gap()[YGGapRow]);
+
+ yogaStyle.gap()[YGGapColumn] = convertRawProp(context, rawProps, "columnGap", sourceValue.gap()[YGGapColumn], yogaStyle.gap()[YGGapColumn]);
+
+ yogaStyle.gap()[YGGapAll] = convertRawProp(context, rawProps, "gap", sourceValue.gap()[YGGapAll], yogaStyle.gap()[YGGapAll]);
+
yogaStyle.border() = convertRawProp(
rawProps, "border", "Width", sourceValue.border(), yogaStyle.border());
yogaStyle.dimensions() = convertRawProp(
diff --git a/node_modules/react-native/ReactCommon/react/renderer/mounting/tests/shadowTreeGeneration.h b/node_modules/react-native/ReactCommon/react/renderer/mounting/tests/shadowTreeGeneration.h
index 8a2c326..6eb9091 100644
--- a/node_modules/react-native/ReactCommon/react/renderer/mounting/tests/shadowTreeGeneration.h
+++ b/node_modules/react-native/ReactCommon/react/renderer/mounting/tests/shadowTreeGeneration.h
@@ -181,6 +181,7 @@ static inline ShadowNode::Unshared messWithYogaStyles(
"marginRight", "marginBottom", "paddingLeft", "paddingTop",
"paddingRight", "paddingBottom", "width", "height",
"maxWidth", "maxHeight", "minWidth", "minHeight",
+ "rowGap", "columnGap", "gap",
};
for (auto const &property : properties) {
diff --git a/node_modules/react-native/ReactCommon/yoga/yoga/YGEnums.cpp b/node_modules/react-native/ReactCommon/yoga/yoga/YGEnums.cpp
index c01d3d9..607dad7 100644
--- a/node_modules/react-native/ReactCommon/yoga/yoga/YGEnums.cpp
+++ b/node_modules/react-native/ReactCommon/yoga/yoga/YGEnums.cpp
@@ -107,6 +107,18 @@ const char* YGFlexDirectionToString(const YGFlexDirection value) {
return "unknown";
}
+const char* YGFlexDirectionToString(const YGGap value) {
+ switch (value) {
+ case YGGapRow:
+ return "row";
+ case YGGapColumn:
+ return "column";
+ case YGGapAll:
+ return "all";
+ }
+ return "unknown";
+}
+
const char* YGJustifyToString(const YGJustify value) {
switch (value) {
case YGJustifyFlexStart:
diff --git a/node_modules/react-native/ReactCommon/yoga/yoga/YGEnums.h b/node_modules/react-native/ReactCommon/yoga/yoga/YGEnums.h
index 3dc458d..1c3b29e 100644
--- a/node_modules/react-native/ReactCommon/yoga/yoga/YGEnums.h
+++ b/node_modules/react-native/ReactCommon/yoga/yoga/YGEnums.h
@@ -96,6 +96,12 @@ YG_ENUM_SEQ_DECL(
YGFlexDirectionRow,
YGFlexDirectionRowReverse)
+YG_ENUM_SEQ_DECL(
+ YGGap,
+ YGGapRow,
+ YGGapColumn,
+ YGGapAll)
+
YG_ENUM_SEQ_DECL(
YGJustify,
YGJustifyFlexStart,
diff --git a/node_modules/react-native/ReactCommon/yoga/yoga/YGNode.cpp b/node_modules/react-native/ReactCommon/yoga/yoga/YGNode.cpp
index 1ee1bde..7e23dca 100644
--- a/node_modules/react-native/ReactCommon/yoga/yoga/YGNode.cpp
+++ b/node_modules/react-native/ReactCommon/yoga/yoga/YGNode.cpp
@@ -50,89 +50,135 @@ void YGNode::print(void* printContext) {
}
}
-YGFloatOptional YGNode::getLeadingPosition(
- const YGFlexDirection axis,
- const float axisSize) const {
- if (YGFlexDirectionIsRow(axis)) {
- auto leadingPosition = YGComputedEdgeValue(
- style_.position(), YGEdgeStart, CompactValue::ofUndefined());
- if (!leadingPosition.isUndefined()) {
- return YGResolveValue(leadingPosition, axisSize);
- }
+CompactValue YGNode::computeEdgeValueForRow(
+ const YGStyle::Edges& edges,
+ YGEdge rowEdge,
+ YGEdge edge,
+ CompactValue defaultValue) {
+ if (!edges[rowEdge].isUndefined()) {
+ return edges[rowEdge];
+ } else if (!edges[edge].isUndefined()) {
+ return edges[edge];
+ } else if (!edges[YGEdgeHorizontal].isUndefined()) {
+ return edges[YGEdgeHorizontal];
+ } else if (!edges[YGEdgeAll].isUndefined()) {
+ return edges[YGEdgeAll];
+ } else {
+ return defaultValue;
}
+}
- auto leadingPosition = YGComputedEdgeValue(
- style_.position(), leading[axis], CompactValue::ofUndefined());
+CompactValue YGNode::computeEdgeValueForColumn(
+ const YGStyle::Edges& edges,
+ YGEdge edge,
+ CompactValue defaultValue) {
+ if (!edges[edge].isUndefined()) {
+ return edges[edge];
+ } else if (!edges[YGEdgeVertical].isUndefined()) {
+ return edges[YGEdgeVertical];
+ } else if (!edges[YGEdgeAll].isUndefined()) {
+ return edges[YGEdgeAll];
+ } else {
+ return defaultValue;
+ }
+}
- return leadingPosition.isUndefined()
- ? YGFloatOptional{0}
- : YGResolveValue(leadingPosition, axisSize);
+CompactValue YGNode::computeRowGap(
+ const YGStyle::Gaps& gaps,
+ CompactValue defaultValue) {
+ if (!gaps[YGGapRow].isUndefined()) {
+ return gaps[YGGapRow];
+ } else if (!gaps[YGGapAll].isUndefined()) {
+ return gaps[YGGapAll];
+ } else {
+ return defaultValue;
+ }
}
-YGFloatOptional YGNode::getTrailingPosition(
- const YGFlexDirection axis,
- const float axisSize) const {
- if (YGFlexDirectionIsRow(axis)) {
- auto trailingPosition = YGComputedEdgeValue(
- style_.position(), YGEdgeEnd, CompactValue::ofUndefined());
- if (!trailingPosition.isUndefined()) {
- return YGResolveValue(trailingPosition, axisSize);
- }
+CompactValue YGNode::computeColumnGap(
+ const YGStyle::Gaps& gaps,
+ CompactValue defaultValue) {
+ if (!gaps[YGGapColumn].isUndefined()) {
+ return gaps[YGGapColumn];
+ } else if (!gaps[YGGapAll].isUndefined()) {
+ return gaps[YGGapAll];
+ } else {
+ return defaultValue;
}
+}
- auto trailingPosition = YGComputedEdgeValue(
- style_.position(), trailing[axis], CompactValue::ofUndefined());
+YGFloatOptional YGNode::getLeadingPosition(
+ const YGFlexDirection axis,
+ const float axisSize) const {
+ auto leadingPosition = YGFlexDirectionIsRow(axis)
+ ? computeEdgeValueForRow(
+ style_.position(),
+ YGEdgeStart,
+ leading[axis],
+ CompactValue::ofZero())
+ : computeEdgeValueForColumn(
+ style_.position(), leading[axis], CompactValue::ofZero());
+ return YGResolveValue(leadingPosition, axisSize);
+}
- return trailingPosition.isUndefined()
- ? YGFloatOptional{0}
- : YGResolveValue(trailingPosition, axisSize);
+YGFloatOptional YGNode::getTrailingPosition(
+ const YGFlexDirection axis,
+ const float axisSize) const {
+ auto trailingPosition = YGFlexDirectionIsRow(axis)
+ ? computeEdgeValueForRow(
+ style_.position(),
+ YGEdgeEnd,
+ trailing[axis],
+ CompactValue::ofZero())
+ : computeEdgeValueForColumn(
+ style_.position(), trailing[axis], CompactValue::ofZero());
+ return YGResolveValue(trailingPosition, axisSize);
}
bool YGNode::isLeadingPositionDefined(const YGFlexDirection axis) const {
- return (YGFlexDirectionIsRow(axis) &&
- !YGComputedEdgeValue(
- style_.position(), YGEdgeStart, CompactValue::ofUndefined())
- .isUndefined()) ||
- !YGComputedEdgeValue(
- style_.position(), leading[axis], CompactValue::ofUndefined())
- .isUndefined();
+ auto leadingPosition = YGFlexDirectionIsRow(axis)
+ ? computeEdgeValueForRow(
+ style_.position(),
+ YGEdgeStart,
+ leading[axis],
+ CompactValue::ofUndefined())
+ : computeEdgeValueForColumn(
+ style_.position(), leading[axis], CompactValue::ofUndefined());
+ return !leadingPosition.isUndefined();
}
bool YGNode::isTrailingPosDefined(const YGFlexDirection axis) const {
- return (YGFlexDirectionIsRow(axis) &&
- !YGComputedEdgeValue(
- style_.position(), YGEdgeEnd, CompactValue::ofUndefined())
- .isUndefined()) ||
- !YGComputedEdgeValue(
- style_.position(), trailing[axis], CompactValue::ofUndefined())
- .isUndefined();
+ auto trailingPosition = YGFlexDirectionIsRow(axis)
+ ? computeEdgeValueForRow(
+ style_.position(),
+ YGEdgeEnd,
+ trailing[axis],
+ CompactValue::ofUndefined())
+ : computeEdgeValueForColumn(
+ style_.position(), trailing[axis], CompactValue::ofUndefined());
+ return !trailingPosition.isUndefined();
}
YGFloatOptional YGNode::getLeadingMargin(
const YGFlexDirection axis,
const float widthSize) const {
- if (YGFlexDirectionIsRow(axis) &&
- !style_.margin()[YGEdgeStart].isUndefined()) {
- return YGResolveValueMargin(style_.margin()[YGEdgeStart], widthSize);
- }
-
- return YGResolveValueMargin(
- YGComputedEdgeValue(
- style_.margin(), leading[axis], CompactValue::ofZero()),
- widthSize);
+ auto leadingMargin = YGFlexDirectionIsRow(axis)
+ ? computeEdgeValueForRow(
+ style_.margin(), YGEdgeStart, leading[axis], CompactValue::ofZero())
+ : computeEdgeValueForColumn(
+ style_.margin(), leading[axis], CompactValue::ofZero());
+ return YGResolveValueMargin(leadingMargin, widthSize);
}
YGFloatOptional YGNode::getTrailingMargin(
const YGFlexDirection axis,
const float widthSize) const {
- if (YGFlexDirectionIsRow(axis) && !style_.margin()[YGEdgeEnd].isUndefined()) {
- return YGResolveValueMargin(style_.margin()[YGEdgeEnd], widthSize);
- }
-
- return YGResolveValueMargin(
- YGComputedEdgeValue(
- style_.margin(), trailing[axis], CompactValue::ofZero()),
- widthSize);
+ auto trailingMargin = YGFlexDirectionIsRow(axis)
+ ? computeEdgeValueForRow(
+ style_.margin(), YGEdgeEnd, trailing[axis], CompactValue::ofZero())
+ : computeEdgeValueForColumn(
+ style_.margin(), trailing[axis], CompactValue::ofZero());
+ return YGResolveValueMargin(trailingMargin, widthSize);
}
YGFloatOptional YGNode::getMarginForAxis(
@@ -141,13 +187,21 @@ YGFloatOptional YGNode::getMarginForAxis(
return getLeadingMargin(axis, widthSize) + getTrailingMargin(axis, widthSize);
}
+YGFloatOptional YGNode::getGapForAxis(
+ const YGFlexDirection axis,
+ const float widthSize) const {
+ auto gap = YGFlexDirectionIsRow(axis)
+ ? computeColumnGap(style_.gap(), CompactValue::ofZero())
+ : computeRowGap(style_.gap(), CompactValue::ofZero());
+ return YGResolveValue(gap, widthSize);
+}
+
YGSize YGNode::measure(
float width,
YGMeasureMode widthMode,
float height,
YGMeasureMode heightMode,
void* layoutContext) {
-
return facebook::yoga::detail::getBooleanData(flags, measureUsesContext_)
? measure_.withContext(
this, width, widthMode, height, heightMode, layoutContext)
@@ -448,68 +502,48 @@ bool YGNode::isNodeFlexible() {
}
float YGNode::getLeadingBorder(const YGFlexDirection axis) const {
- YGValue leadingBorder;
- if (YGFlexDirectionIsRow(axis) &&
- !style_.border()[YGEdgeStart].isUndefined()) {
- leadingBorder = style_.border()[YGEdgeStart];
- if (leadingBorder.value >= 0) {
- return leadingBorder.value;
- }
- }
-
- leadingBorder = YGComputedEdgeValue(
- style_.border(), leading[axis], CompactValue::ofZero());
- return YGFloatMax(leadingBorder.value, 0.0f);
+ YGValue leadingBorder = YGFlexDirectionIsRow(axis)
+ ? computeEdgeValueForRow(
+ style_.border(), YGEdgeStart, leading[axis], CompactValue::ofZero())
+ : computeEdgeValueForColumn(
+ style_.border(), leading[axis], CompactValue::ofZero());
+ return fmaxf(leadingBorder.value, 0.0f);
}
-float YGNode::getTrailingBorder(const YGFlexDirection flexDirection) const {
- YGValue trailingBorder;
- if (YGFlexDirectionIsRow(flexDirection) &&
- !style_.border()[YGEdgeEnd].isUndefined()) {
- trailingBorder = style_.border()[YGEdgeEnd];
- if (trailingBorder.value >= 0.0f) {
- return trailingBorder.value;
- }
- }
-
- trailingBorder = YGComputedEdgeValue(
- style_.border(), trailing[flexDirection], CompactValue::ofZero());
- return YGFloatMax(trailingBorder.value, 0.0f);
+float YGNode::getTrailingBorder(const YGFlexDirection axis) const {
+ YGValue trailingBorder = YGFlexDirectionIsRow(axis)
+ ? computeEdgeValueForRow(
+ style_.border(), YGEdgeEnd, trailing[axis], CompactValue::ofZero())
+ : computeEdgeValueForColumn(
+ style_.border(), trailing[axis], CompactValue::ofZero());
+ return fmaxf(trailingBorder.value, 0.0f);
}
YGFloatOptional YGNode::getLeadingPadding(
const YGFlexDirection axis,
const float widthSize) const {
- const YGFloatOptional paddingEdgeStart =
- YGResolveValue(style_.padding()[YGEdgeStart], widthSize);
- if (YGFlexDirectionIsRow(axis) &&
- !style_.padding()[YGEdgeStart].isUndefined() &&
- !paddingEdgeStart.isUndefined() && paddingEdgeStart.unwrap() >= 0.0f) {
- return paddingEdgeStart;
- }
-
- YGFloatOptional resolvedValue = YGResolveValue(
- YGComputedEdgeValue(
- style_.padding(), leading[axis], CompactValue::ofZero()),
- widthSize);
- return YGFloatOptionalMax(resolvedValue, YGFloatOptional(0.0f));
+ auto leadingPadding = YGFlexDirectionIsRow(axis)
+ ? computeEdgeValueForRow(
+ style_.padding(),
+ YGEdgeStart,
+ leading[axis],
+ CompactValue::ofZero())
+ : computeEdgeValueForColumn(
+ style_.padding(), leading[axis], CompactValue::ofZero());
+ return YGFloatOptionalMax(
+ YGResolveValue(leadingPadding, widthSize), YGFloatOptional(0.0f));
}
YGFloatOptional YGNode::getTrailingPadding(
const YGFlexDirection axis,
const float widthSize) const {
- const YGFloatOptional paddingEdgeEnd =
- YGResolveValue(style_.padding()[YGEdgeEnd], widthSize);
- if (YGFlexDirectionIsRow(axis) && paddingEdgeEnd >= YGFloatOptional{0.0f}) {
- return paddingEdgeEnd;
- }
-
- YGFloatOptional resolvedValue = YGResolveValue(
- YGComputedEdgeValue(
- style_.padding(), trailing[axis], CompactValue::ofZero()),
- widthSize);
-
- return YGFloatOptionalMax(resolvedValue, YGFloatOptional(0.0f));
+ auto trailingPadding = YGFlexDirectionIsRow(axis)
+ ? computeEdgeValueForRow(
+ style_.padding(), YGEdgeEnd, trailing[axis], CompactValue::ofZero())
+ : computeEdgeValueForColumn(
+ style_.padding(), trailing[axis], CompactValue::ofZero());
+ return YGFloatOptionalMax(
+ YGResolveValue(trailingPadding, widthSize), YGFloatOptional(0.0f));
}
YGFloatOptional YGNode::getLeadingPaddingAndBorder(
diff --git a/node_modules/react-native/ReactCommon/yoga/yoga/YGNode.h b/node_modules/react-native/ReactCommon/yoga/yoga/YGNode.h
index 63d98fe..b8dbac6 100644
--- a/node_modules/react-native/ReactCommon/yoga/yoga/YGNode.h
+++ b/node_modules/react-native/ReactCommon/yoga/yoga/YGNode.h
@@ -193,6 +193,25 @@ public:
return resolvedDimensions_[index];
}
+ static CompactValue computeEdgeValueForColumn(
+ const YGStyle::Edges& edges,
+ YGEdge edge,
+ CompactValue defaultValue);
+
+ static CompactValue computeEdgeValueForRow(
+ const YGStyle::Edges& edges,
+ YGEdge rowEdge,
+ YGEdge edge,
+ CompactValue defaultValue);
+
+ static CompactValue computeRowGap(
+ const YGStyle::Gaps& gaps,
+ CompactValue defaultValue);
+
+ static CompactValue computeColumnGap(
+ const YGStyle::Gaps& gaps,
+ CompactValue defaultValue);
+
// Methods related to positions, margin, padding and border
YGFloatOptional getLeadingPosition(
const YGFlexDirection axis,
@@ -225,6 +244,9 @@ public:
YGFloatOptional getMarginForAxis(
const YGFlexDirection axis,
const float widthSize) const;
+ YGFloatOptional getGapForAxis(
+ const YGFlexDirection axis,
+ const float widthSize) const;
// Setters
void setContext(void* context) { context_ = context; }
diff --git a/node_modules/react-native/ReactCommon/yoga/yoga/YGNodePrint.cpp b/node_modules/react-native/ReactCommon/yoga/yoga/YGNodePrint.cpp
index 26efa48..7864373 100644
--- a/node_modules/react-native/ReactCommon/yoga/yoga/YGNodePrint.cpp
+++ b/node_modules/react-native/ReactCommon/yoga/yoga/YGNodePrint.cpp
@@ -104,10 +104,13 @@ static void appendEdgeIfNotUndefined(
const string& str,
const YGStyle::Edges& edges,
const YGEdge edge) {
- appendNumberIfNotUndefined(
- base,
- str,
- YGComputedEdgeValue(edges, edge, detail::CompactValue::ofUndefined()));
+ // TODO: this doesn't take RTL / YGEdgeStart / YGEdgeEnd into account
+ auto value = (edge == YGEdgeLeft || edge == YGEdgeRight)
+ ? YGNode::computeEdgeValueForRow(
+ edges, edge, edge, detail::CompactValue::ofUndefined())
+ : YGNode::computeEdgeValueForColumn(
+ edges, edge, detail::CompactValue::ofUndefined());
+ appendNumberIfNotUndefined(base, str, value);
}
void YGNodeToString(
@@ -181,6 +184,15 @@ void YGNodeToString(
appendEdges(str, "padding", style.padding());
appendEdges(str, "border", style.border());
+ if (YGNode::computeColumnGap(style.gap(), detail::CompactValue::ofUndefined()) !=
+ YGNode::computeColumnGap(YGNode().getStyle().gap(), detail::CompactValue::ofUndefined())) {
+ appendNumberIfNotUndefined(str, "column-gap", style.gap()[YGGapRow]);
+ }
+ if (YGNode::computeRowGap(style.gap(), detail::CompactValue::ofUndefined()) !=
+ YGNode::computeRowGap(YGNode().getStyle().gap(), detail::CompactValue::ofUndefined())) {
+ appendNumberIfNotUndefined(str, "row-gap", style.gap()[YGGapRow]);
+ }
+
appendNumberIfNotAuto(str, "width", style.dimensions()[YGDimensionWidth]);
appendNumberIfNotAuto(str, "height", style.dimensions()[YGDimensionHeight]);
appendNumberIfNotAuto(
diff --git a/node_modules/react-native/ReactCommon/yoga/yoga/YGStyle.cpp b/node_modules/react-native/ReactCommon/yoga/yoga/YGStyle.cpp
index e8033bd..4c53a7d 100644
--- a/node_modules/react-native/ReactCommon/yoga/yoga/YGStyle.cpp
+++ b/node_modules/react-native/ReactCommon/yoga/yoga/YGStyle.cpp
@@ -20,8 +20,11 @@ bool operator==(const YGStyle& lhs, const YGStyle& rhs) {
lhs.flexWrap() == rhs.flexWrap() && lhs.overflow() == rhs.overflow() &&
lhs.display() == rhs.display() &&
YGValueEqual(lhs.flexBasis(), rhs.flexBasis()) &&
- lhs.margin() == rhs.margin() && lhs.position() == rhs.position() &&
- lhs.padding() == rhs.padding() && lhs.border() == rhs.border() &&
+ lhs.margin() == rhs.margin() &&
+ lhs.position() == rhs.position() &&
+ lhs.padding() == rhs.padding() &&
+ lhs.border() == rhs.border() &&
+ lhs.gap() == rhs.gap() &&
lhs.dimensions() == rhs.dimensions() &&
lhs.minDimensions() == rhs.minDimensions() &&
lhs.maxDimensions() == rhs.maxDimensions();
diff --git a/node_modules/react-native/ReactCommon/yoga/yoga/YGStyle.h b/node_modules/react-native/ReactCommon/yoga/yoga/YGStyle.h
index aab7599..d89488e 100644
--- a/node_modules/react-native/ReactCommon/yoga/yoga/YGStyle.h
+++ b/node_modules/react-native/ReactCommon/yoga/yoga/YGStyle.h
@@ -29,6 +29,7 @@ class YOGA_EXPORT YGStyle {
public:
using Dimensions = Values<YGDimension>;
using Edges = Values<YGEdge>;
+ using Gaps = Values<YGGap>;
template <typename T>
struct BitfieldRef {
@@ -113,6 +114,7 @@ private:
Edges position_ = {};
Edges padding_ = {};
Edges border_ = {};
+ Gaps gap_ = {};
Dimensions dimensions_{CompactValue::ofAuto()};
Dimensions minDimensions_ = {};
Dimensions maxDimensions_ = {};
@@ -210,6 +212,9 @@ public:
const Edges& border() const { return border_; }
IdxRef<YGEdge, &YGStyle::border_> border() { return {*this}; }
+ const Gaps& gap() const { return gap_; }
+ IdxRef<YGGap, &YGStyle::gap_> gap() { return {*this}; }
+
const Dimensions& dimensions() const { return dimensions_; }
IdxRef<YGDimension, &YGStyle::dimensions_> dimensions() { return {*this}; }
diff --git a/node_modules/react-native/ReactCommon/yoga/yoga/Yoga.cpp b/node_modules/react-native/ReactCommon/yoga/yoga/Yoga.cpp
index 97e6407..6f62c8e 100644
--- a/node_modules/react-native/ReactCommon/yoga/yoga/Yoga.cpp
+++ b/node_modules/react-native/ReactCommon/yoga/yoga/Yoga.cpp
@@ -106,38 +106,12 @@ static int YGDefaultLog(
#undef YG_UNUSED
#endif
-YOGA_EXPORT bool YGFloatIsUndefined(const float value) {
+static inline bool YGDoubleIsUndefined(const double value) {
return facebook::yoga::isUndefined(value);
}
-detail::CompactValue YGComputedEdgeValue(
- const YGStyle::Edges& edges,
- YGEdge edge,
- detail::CompactValue defaultValue) {
- if (!edges[edge].isUndefined()) {
- return edges[edge];
- }
-
- if ((edge == YGEdgeTop || edge == YGEdgeBottom) &&
- !edges[YGEdgeVertical].isUndefined()) {
- return edges[YGEdgeVertical];
- }
-
- if ((edge == YGEdgeLeft || edge == YGEdgeRight || edge == YGEdgeStart ||
- edge == YGEdgeEnd) &&
- !edges[YGEdgeHorizontal].isUndefined()) {
- return edges[YGEdgeHorizontal];
- }
-
- if (!edges[YGEdgeAll].isUndefined()) {
- return edges[YGEdgeAll];
- }
-
- if (edge == YGEdgeStart || edge == YGEdgeEnd) {
- return detail::CompactValue::ofUndefined();
- }
-
- return defaultValue;
+YOGA_EXPORT bool YGFloatIsUndefined(const float value) {
+ return facebook::yoga::isUndefined(value);
}
YOGA_EXPORT void* YGNodeGetContext(YGNodeRef node) {
@@ -823,6 +797,28 @@ YOGA_EXPORT float YGNodeStyleGetBorder(
return static_cast<YGValue>(border).value;
}
+YOGA_EXPORT void YGNodeStyleSetGap(
+ const YGNodeRef node,
+ const YGGap gap,
+ const float gapValue) {
+ auto value = detail::CompactValue::ofMaybe<YGUnitPoint>(gapValue);
+ updateIndexedStyleProp<MSVC_HINT(gap)>(
+ node, &YGStyle::gap, gap, value);
+}
+
+YOGA_EXPORT float YGNodeStyleGetGap(
+ const YGNodeConstRef node,
+ const YGGap gap) {
+ auto gapValue = node->getStyle().gap()[gap];
+ if (gapValue.isUndefined() || gapValue.isAuto()) {
+ // TODO(T26792433): Rather than returning YGUndefined, change the api to
+ // return YGFloatOptional.
+ return YGUndefined;
+ }
+
+ return static_cast<YGValue>(gapValue).value;
+}
+
// Yoga specific properties, not compatible with flexbox specification
// TODO(T26792433): Change the API to accept YGFloatOptional.
@@ -1681,40 +1677,33 @@ static void YGNodeWithMeasureFuncSetMeasuredDimensions(
availableHeight = YGUndefined;
}
- const float paddingAndBorderAxisRow =
- YGNodePaddingAndBorderForAxis(node, YGFlexDirectionRow, ownerWidth);
- const float paddingAndBorderAxisColumn =
- YGNodePaddingAndBorderForAxis(node, YGFlexDirectionColumn, ownerWidth);
- const float marginAxisRow =
- node->getMarginForAxis(YGFlexDirectionRow, ownerWidth).unwrap();
- const float marginAxisColumn =
- node->getMarginForAxis(YGFlexDirectionColumn, ownerWidth).unwrap();
+ const auto& padding = node->getLayout().padding;
+ const auto& border = node->getLayout().border;
+ const float paddingAndBorderAxisRow = padding[YGEdgeLeft] +
+ padding[YGEdgeRight] + border[YGEdgeLeft] + border[YGEdgeRight];
+ const float paddingAndBorderAxisColumn = padding[YGEdgeTop] +
+ padding[YGEdgeBottom] + border[YGEdgeTop] + border[YGEdgeBottom];
// We want to make sure we don't call measure with negative size
const float innerWidth = YGFloatIsUndefined(availableWidth)
? availableWidth
- : YGFloatMax(0, availableWidth - marginAxisRow - paddingAndBorderAxisRow);
+ : YGFloatMax(0, availableWidth - paddingAndBorderAxisRow);
const float innerHeight = YGFloatIsUndefined(availableHeight)
? availableHeight
- : YGFloatMax(
- 0, availableHeight - marginAxisColumn - paddingAndBorderAxisColumn);
+ : YGFloatMax(0, availableHeight - paddingAndBorderAxisColumn);
if (widthMeasureMode == YGMeasureModeExactly &&
heightMeasureMode == YGMeasureModeExactly) {
// Don't bother sizing the text if both dimensions are already defined.
node->setLayoutMeasuredDimension(
YGNodeBoundAxis(
- node,
- YGFlexDirectionRow,
- availableWidth - marginAxisRow,
- ownerWidth,
- ownerWidth),
+ node, YGFlexDirectionRow, availableWidth, ownerWidth, ownerWidth),
YGDimensionWidth);
node->setLayoutMeasuredDimension(
YGNodeBoundAxis(
node,
YGFlexDirectionColumn,
- availableHeight - marginAxisColumn,
+ availableHeight,
ownerHeight,
ownerWidth),
YGDimensionHeight);
@@ -1751,7 +1740,7 @@ static void YGNodeWithMeasureFuncSetMeasuredDimensions(
(widthMeasureMode == YGMeasureModeUndefined ||
widthMeasureMode == YGMeasureModeAtMost)
? measuredSize.width + paddingAndBorderAxisRow
- : availableWidth - marginAxisRow,
+ : availableWidth,
ownerWidth,
ownerWidth),
YGDimensionWidth);
@@ -1763,7 +1752,7 @@ static void YGNodeWithMeasureFuncSetMeasuredDimensions(
(heightMeasureMode == YGMeasureModeUndefined ||
heightMeasureMode == YGMeasureModeAtMost)
? measuredSize.height + paddingAndBorderAxisColumn
- : availableHeight - marginAxisColumn,
+ : availableHeight,
ownerHeight,
ownerWidth),
YGDimensionHeight);
@@ -1780,37 +1769,28 @@ static void YGNodeEmptyContainerSetMeasuredDimensions(
const YGMeasureMode heightMeasureMode,
const float ownerWidth,
const float ownerHeight) {
- const float paddingAndBorderAxisRow =
- YGNodePaddingAndBorderForAxis(node, YGFlexDirectionRow, ownerWidth);
- const float paddingAndBorderAxisColumn =
- YGNodePaddingAndBorderForAxis(node, YGFlexDirectionColumn, ownerWidth);
- const float marginAxisRow =
- node->getMarginForAxis(YGFlexDirectionRow, ownerWidth).unwrap();
- const float marginAxisColumn =
- node->getMarginForAxis(YGFlexDirectionColumn, ownerWidth).unwrap();
-
+ const auto& padding = node->getLayout().padding;
+ const auto& border = node->getLayout().border;
+
+ float width = availableWidth;
+ if (widthMeasureMode == YGMeasureModeUndefined ||
+ widthMeasureMode == YGMeasureModeAtMost) {
+ width = padding[YGEdgeLeft] + padding[YGEdgeRight] + border[YGEdgeLeft] +
+ border[YGEdgeRight];
+ }
node->setLayoutMeasuredDimension(
- YGNodeBoundAxis(
- node,
- YGFlexDirectionRow,
- (widthMeasureMode == YGMeasureModeUndefined ||
- widthMeasureMode == YGMeasureModeAtMost)
- ? paddingAndBorderAxisRow
- : availableWidth - marginAxisRow,
- ownerWidth,
- ownerWidth),
+ YGNodeBoundAxis(node, YGFlexDirectionRow, width, ownerWidth, ownerWidth),
YGDimensionWidth);
+ float height = availableHeight;
+ if (heightMeasureMode == YGMeasureModeUndefined ||
+ heightMeasureMode == YGMeasureModeAtMost) {
+ height = padding[YGEdgeTop] + padding[YGEdgeBottom] + border[YGEdgeTop] +
+ border[YGEdgeBottom];
+ }
node->setLayoutMeasuredDimension(
YGNodeBoundAxis(
- node,
- YGFlexDirectionColumn,
- (heightMeasureMode == YGMeasureModeUndefined ||
- heightMeasureMode == YGMeasureModeAtMost)
- ? paddingAndBorderAxisColumn
- : availableHeight - marginAxisColumn,
- ownerHeight,
- ownerWidth),
+ node, YGFlexDirectionColumn, height, ownerHeight, ownerWidth),
YGDimensionHeight);
}
@@ -1828,11 +1808,6 @@ static bool YGNodeFixedSizeSetMeasuredDimensions(
heightMeasureMode == YGMeasureModeAtMost && availableHeight <= 0.0f) ||
(widthMeasureMode == YGMeasureModeExactly &&
heightMeasureMode == YGMeasureModeExactly)) {
- auto marginAxisColumn =
- node->getMarginForAxis(YGFlexDirectionColumn, ownerWidth).unwrap();
- auto marginAxisRow =
- node->getMarginForAxis(YGFlexDirectionRow, ownerWidth).unwrap();
-
node->setLayoutMeasuredDimension(
YGNodeBoundAxis(
node,
@@ -1841,7 +1816,7 @@ static bool YGNodeFixedSizeSetMeasuredDimensions(
(widthMeasureMode == YGMeasureModeAtMost &&
availableWidth < 0.0f)
? 0.0f
- : availableWidth - marginAxisRow,
+ : availableWidth,
ownerWidth,
ownerWidth),
YGDimensionWidth);
@@ -1854,7 +1829,7 @@ static bool YGNodeFixedSizeSetMeasuredDimensions(
(heightMeasureMode == YGMeasureModeAtMost &&
availableHeight < 0.0f)
? 0.0f
- : availableHeight - marginAxisColumn,
+ : availableHeight,
ownerHeight,
ownerWidth),
YGDimensionHeight);
@@ -1878,21 +1853,11 @@ static void YGZeroOutLayoutRecursivly(
static float YGNodeCalculateAvailableInnerDim(
const YGNodeConstRef node,
- YGFlexDirection axis,
- float availableDim,
- float ownerDim,
- float ownerDimForMarginPadding) {
- YGFlexDirection direction =
- YGFlexDirectionIsRow(axis) ? YGFlexDirectionRow : YGFlexDirectionColumn;
- YGDimension dimension =
- YGFlexDirectionIsRow(axis) ? YGDimensionWidth : YGDimensionHeight;
-
- const float margin =
- node->getMarginForAxis(direction, ownerDimForMarginPadding).unwrap();
- const float paddingAndBorder =
- YGNodePaddingAndBorderForAxis(node, direction, ownerDimForMarginPadding);
-
- float availableInnerDim = availableDim - margin - paddingAndBorder;
+ const YGDimension dimension,
+ const float availableDim,
+ const float paddingAndBorder,
+ const float ownerDim) {
+ float availableInnerDim = availableDim - paddingAndBorder;
// Max dimension overrides predefined dimension value; Min dimension in turn
// overrides both of the above
if (!YGFloatIsUndefined(availableInnerDim)) {
@@ -2029,6 +1994,7 @@ static YGCollectFlexItemsRowValues YGCalculateCollectFlexItemsRowValues(
const YGFlexDirection mainAxis = YGResolveFlexDirection(
node->getStyle().flexDirection(), node->resolveDirection(ownerDirection));
const bool isNodeFlexWrap = node->getStyle().flexWrap() != YGWrapNoWrap;
+ const float gap = node->getGapForAxis(mainAxis, availableInnerWidth).unwrap();
// Add items to the current line until it's full or we run out of items.
uint32_t endOfLineIndex = startOfLineIndex;
@@ -2038,9 +2004,13 @@ static YGCollectFlexItemsRowValues YGCalculateCollectFlexItemsRowValues(
child->getStyle().positionType() == YGPositionTypeAbsolute) {
continue;
}
+
+ const int32_t elementInLineIndex = endOfLineIndex - startOfLineIndex;
+
child->setLineIndex(lineCount);
const float childMarginMainAxis =
child->getMarginForAxis(mainAxis, availableInnerWidth).unwrap();
+ const float childLeadingGapMainAxis = elementInLineIndex != 0 ? gap : 0.0f;
const float flexBasisWithMinAndMaxConstraints =
YGNodeBoundAxisWithinMinAndMax(
child,
@@ -2053,16 +2023,16 @@ static YGCollectFlexItemsRowValues YGCalculateCollectFlexItemsRowValues(
// size, we've hit the end of the current line. Break out of the loop and
// lay out the current line.
if (sizeConsumedOnCurrentLineIncludingMinConstraint +
- flexBasisWithMinAndMaxConstraints + childMarginMainAxis >
+ flexBasisWithMinAndMaxConstraints + childMarginMainAxis + childLeadingGapMainAxis >
availableInnerMainDim &&
isNodeFlexWrap && flexAlgoRowMeasurement.itemsOnLine > 0) {
break;
}
sizeConsumedOnCurrentLineIncludingMinConstraint +=
- flexBasisWithMinAndMaxConstraints + childMarginMainAxis;
+ flexBasisWithMinAndMaxConstraints + childMarginMainAxis + childLeadingGapMainAxis;
flexAlgoRowMeasurement.sizeConsumedOnCurrentLine +=
- flexBasisWithMinAndMaxConstraints + childMarginMainAxis;
+ flexBasisWithMinAndMaxConstraints + childMarginMainAxis + childLeadingGapMainAxis;
flexAlgoRowMeasurement.itemsOnLine++;
if (child->isNodeFlexible()) {
@@ -2472,6 +2442,7 @@ static void YGJustifyMainAxis(
node->getLeadingPaddingAndBorder(mainAxis, ownerWidth).unwrap();
const float trailingPaddingAndBorderMain =
node->getTrailingPaddingAndBorder(mainAxis, ownerWidth).unwrap();
+ const float gap = node->getGapForAxis(mainAxis, ownerWidth).unwrap();
// If we are using "at most" rules in the main axis, make sure that
// remainingFreeSpace is 0 when min main dimension is not given
if (measureModeMainDim == YGMeasureModeAtMost &&
@@ -2519,7 +2490,7 @@ static void YGJustifyMainAxis(
// The space between the beginning and the first element and the space between
// each two elements.
float leadingMainDim = 0;
- float betweenMainDim = 0;
+ float betweenMainDim = gap;
const YGJustify justifyContent = node->getStyle().justifyContent();
if (numberOfAutoMarginsOnCurrentLine == 0) {
@@ -2532,24 +2503,23 @@ static void YGJustifyMainAxis(
break;
case YGJustifySpaceBetween:
if (collectedFlexItemsValues.itemsOnLine > 1) {
- betweenMainDim =
+ betweenMainDim +=
YGFloatMax(collectedFlexItemsValues.remainingFreeSpace, 0) /
(collectedFlexItemsValues.itemsOnLine - 1);
- } else {
- betweenMainDim = 0;
}
break;
case YGJustifySpaceEvenly:
// Space is distributed evenly across all elements
- betweenMainDim = collectedFlexItemsValues.remainingFreeSpace /
+ leadingMainDim = collectedFlexItemsValues.remainingFreeSpace /
(collectedFlexItemsValues.itemsOnLine + 1);
- leadingMainDim = betweenMainDim;
+ betweenMainDim += leadingMainDim;
break;
case YGJustifySpaceAround:
// Space on the edges is half of the space between elements
- betweenMainDim = collectedFlexItemsValues.remainingFreeSpace /
+ leadingMainDim = 0.5 *
+ collectedFlexItemsValues.remainingFreeSpace /
collectedFlexItemsValues.itemsOnLine;
- leadingMainDim = betweenMainDim / 2;
+ betweenMainDim += leadingMainDim * 2;
break;
case YGJustifyFlexStart:
break;
@@ -2779,16 +2749,22 @@ static void YGNodelayoutImpl(
const YGEdge startEdge =
direction == YGDirectionLTR ? YGEdgeLeft : YGEdgeRight;
const YGEdge endEdge = direction == YGDirectionLTR ? YGEdgeRight : YGEdgeLeft;
- node->setLayoutMargin(
- node->getLeadingMargin(flexRowDirection, ownerWidth).unwrap(), startEdge);
- node->setLayoutMargin(
- node->getTrailingMargin(flexRowDirection, ownerWidth).unwrap(), endEdge);
- node->setLayoutMargin(
- node->getLeadingMargin(flexColumnDirection, ownerWidth).unwrap(),
- YGEdgeTop);
- node->setLayoutMargin(
- node->getTrailingMargin(flexColumnDirection, ownerWidth).unwrap(),
- YGEdgeBottom);
+
+ const float marginRowLeading =
+ node->getLeadingMargin(flexRowDirection, ownerWidth).unwrap();
+ node->setLayoutMargin(marginRowLeading, startEdge);
+ const float marginRowTrailing =
+ node->getTrailingMargin(flexRowDirection, ownerWidth).unwrap();
+ node->setLayoutMargin(marginRowTrailing, endEdge);
+ const float marginColumnLeading =
+ node->getLeadingMargin(flexColumnDirection, ownerWidth).unwrap();
+ node->setLayoutMargin(marginColumnLeading, YGEdgeTop);
+ const float marginColumnTrailing =
+ node->getTrailingMargin(flexColumnDirection, ownerWidth).unwrap();
+ node->setLayoutMargin(marginColumnTrailing, YGEdgeBottom);
+
+ const float marginAxisRow = marginRowLeading + marginRowTrailing;
+ const float marginAxisColumn = marginColumnLeading + marginColumnTrailing;
node->setLayoutBorder(node->getLeadingBorder(flexRowDirection), startEdge);
node->setLayoutBorder(node->getTrailingBorder(flexRowDirection), endEdge);
@@ -2811,8 +2787,8 @@ static void YGNodelayoutImpl(
if (node->hasMeasureFunc()) {
YGNodeWithMeasureFuncSetMeasuredDimensions(
node,
- availableWidth,
- availableHeight,
+ availableWidth - marginAxisRow,
+ availableHeight - marginAxisColumn,
widthMeasureMode,
heightMeasureMode,
ownerWidth,
@@ -2827,8 +2803,8 @@ static void YGNodelayoutImpl(
if (childCount == 0) {
YGNodeEmptyContainerSetMeasuredDimensions(
node,
- availableWidth,
- availableHeight,
+ availableWidth - marginAxisRow,
+ availableHeight - marginAxisColumn,
widthMeasureMode,
heightMeasureMode,
ownerWidth,
@@ -2841,8 +2817,8 @@ static void YGNodelayoutImpl(
if (!performLayout &&
YGNodeFixedSizeSetMeasuredDimensions(
node,
- availableWidth,
- availableHeight,
+ availableWidth - marginAxisRow,
+ availableHeight - marginAxisColumn,
widthMeasureMode,
heightMeasureMode,
ownerWidth,
@@ -2866,12 +2842,14 @@ static void YGNodelayoutImpl(
const float mainAxisownerSize = isMainAxisRow ? ownerWidth : ownerHeight;
const float crossAxisownerSize = isMainAxisRow ? ownerHeight : ownerWidth;
- const float leadingPaddingAndBorderCross =
- node->getLeadingPaddingAndBorder(crossAxis, ownerWidth).unwrap();
const float paddingAndBorderAxisMain =
YGNodePaddingAndBorderForAxis(node, mainAxis, ownerWidth);
+ const float leadingPaddingAndBorderCross =
+ node->getLeadingPaddingAndBorder(crossAxis, ownerWidth).unwrap();
+ const float trailingPaddingAndBorderCross =
+ node->getTrailingPaddingAndBorder(crossAxis, ownerWidth).unwrap();
const float paddingAndBorderAxisCross =
- YGNodePaddingAndBorderForAxis(node, crossAxis, ownerWidth);
+ leadingPaddingAndBorderCross + trailingPaddingAndBorderCross;
YGMeasureMode measureModeMainDim =
isMainAxisRow ? widthMeasureMode : heightMeasureMode;
@@ -2883,35 +2861,20 @@ static void YGNodelayoutImpl(
const float paddingAndBorderAxisColumn =
isMainAxisRow ? paddingAndBorderAxisCross : paddingAndBorderAxisMain;
- const float marginAxisRow =
- node->getMarginForAxis(YGFlexDirectionRow, ownerWidth).unwrap();
- const float marginAxisColumn =
- node->getMarginForAxis(YGFlexDirectionColumn, ownerWidth).unwrap();
-
- const auto& minDimensions = node->getStyle().minDimensions();
- const auto& maxDimensions = node->getStyle().maxDimensions();
- const float minInnerWidth =
- YGResolveValue(minDimensions[YGDimensionWidth], ownerWidth).unwrap() -
- paddingAndBorderAxisRow;
- const float maxInnerWidth =
- YGResolveValue(maxDimensions[YGDimensionWidth], ownerWidth).unwrap() -
- paddingAndBorderAxisRow;
- const float minInnerHeight =
- YGResolveValue(minDimensions[YGDimensionHeight], ownerHeight).unwrap() -
- paddingAndBorderAxisColumn;
- const float maxInnerHeight =
- YGResolveValue(maxDimensions[YGDimensionHeight], ownerHeight).unwrap() -
- paddingAndBorderAxisColumn;
-
- const float minInnerMainDim = isMainAxisRow ? minInnerWidth : minInnerHeight;
- const float maxInnerMainDim = isMainAxisRow ? maxInnerWidth : maxInnerHeight;
-
// STEP 2: DETERMINE AVAILABLE SIZE IN MAIN AND CROSS DIRECTIONS
float availableInnerWidth = YGNodeCalculateAvailableInnerDim(
- node, YGFlexDirectionRow, availableWidth, ownerWidth, ownerWidth);
+ node,
+ YGDimensionWidth,
+ availableWidth - marginAxisRow,
+ paddingAndBorderAxisRow,
+ ownerWidth);
float availableInnerHeight = YGNodeCalculateAvailableInnerDim(
- node, YGFlexDirectionColumn, availableHeight, ownerHeight, ownerWidth);
+ node,
+ YGDimensionHeight,
+ availableHeight - marginAxisColumn,
+ paddingAndBorderAxisColumn,
+ ownerHeight);
float availableInnerMainDim =
isMainAxisRow ? availableInnerWidth : availableInnerHeight;
@@ -2954,6 +2917,8 @@ static void YGNodelayoutImpl(
// Accumulated cross dimensions of all lines so far.
float totalLineCrossDim = 0;
+ const float crossAxisGap = node->getGapForAxis(crossAxis, availableInnerCrossDim).unwrap();
+
// Max main dimension of all the lines.
float maxLineMainDim = 0;
YGCollectFlexItemsRowValues collectedFlexItemsValues;
@@ -2983,6 +2948,28 @@ static void YGNodelayoutImpl(
// If we don't measure with exact main dimension we want to ensure we don't
// violate min and max
if (measureModeMainDim != YGMeasureModeExactly) {
+ const auto& minDimensions = node->getStyle().minDimensions();
+ const auto& maxDimensions = node->getStyle().maxDimensions();
+ const float minInnerWidth =
+ YGResolveValue(minDimensions[YGDimensionWidth], ownerWidth).unwrap() -
+ paddingAndBorderAxisRow;
+ const float maxInnerWidth =
+ YGResolveValue(maxDimensions[YGDimensionWidth], ownerWidth).unwrap() -
+ paddingAndBorderAxisRow;
+ const float minInnerHeight =
+ YGResolveValue(minDimensions[YGDimensionHeight], ownerHeight)
+ .unwrap() -
+ paddingAndBorderAxisColumn;
+ const float maxInnerHeight =
+ YGResolveValue(maxDimensions[YGDimensionHeight], ownerHeight)
+ .unwrap() -
+ paddingAndBorderAxisColumn;
+
+ const float minInnerMainDim =
+ isMainAxisRow ? minInnerWidth : minInnerHeight;
+ const float maxInnerMainDim =
+ isMainAxisRow ? maxInnerWidth : maxInnerHeight;
+
if (!YGFloatIsUndefined(minInnerMainDim) &&
collectedFlexItemsValues.sizeConsumedOnCurrentLine <
minInnerMainDim) {
@@ -3251,7 +3238,8 @@ static void YGNodelayoutImpl(
}
}
- totalLineCrossDim += collectedFlexItemsValues.crossDim;
+ const float appliedCrossGap = lineCount != 0 ? crossAxisGap : 0.0f;
+ totalLineCrossDim += collectedFlexItemsValues.crossDim + appliedCrossGap;
maxLineMainDim =
YGFloatMax(maxLineMainDim, collectedFlexItemsValues.mainDim);
}
@@ -3346,6 +3334,7 @@ static void YGNodelayoutImpl(
}
endIndex = ii;
lineHeight += crossDimLead;
+ currentLead += i != 0 ? crossAxisGap : 0;
if (performLayout) {
for (ii = startIndex; ii < endIndex; ii++) {
@@ -3531,8 +3520,8 @@ static void YGNodelayoutImpl(
YGNodeBoundAxisWithinMinAndMax(
node,
crossAxis,
- YGFloatOptional{totalLineCrossDim +
- paddingAndBorderAxisCross},
+ YGFloatOptional{
+ totalLineCrossDim + paddingAndBorderAxisCross},
crossAxisownerSize)
.unwrap()),
paddingAndBorderAxisCross),
@@ -3557,7 +3546,8 @@ static void YGNodelayoutImpl(
if (performLayout) {
// STEP 10: SIZING AND POSITIONING ABSOLUTE CHILDREN
for (auto child : node->getChildren()) {
- if (child->getStyle().positionType() != YGPositionTypeAbsolute) {
+ if (child->getStyle().display() == YGDisplayNone ||
+ child->getStyle().positionType() != YGPositionTypeAbsolute) {
continue;
}
YGNodeAbsoluteLayoutChild(
@@ -3665,10 +3655,10 @@ YOGA_EXPORT float YGRoundValueToPixelGrid(
const double pointScaleFactor,
const bool forceCeil,
const bool forceFloor) {
- double scaledValue = ((double) value) * pointScaleFactor;
+ double scaledValue = value * pointScaleFactor;
// We want to calculate `fractial` such that `floor(scaledValue) = scaledValue
// - fractial`.
- double fractial = fmod(scaledValue, 1.0f);
+ double fractial = fmod(scaledValue, 1.0);
if (fractial < 0) {
// This branch is for handling negative numbers for `value`.
//
@@ -3690,25 +3680,25 @@ YOGA_EXPORT float YGRoundValueToPixelGrid(
if (YGDoubleEqual(fractial, 0)) {
// First we check if the value is already rounded
scaledValue = scaledValue - fractial;
- } else if (YGDoubleEqual(fractial, 1.0f)) {
- scaledValue = scaledValue - fractial + 1.0f;
+ } else if (YGDoubleEqual(fractial, 1.0)) {
+ scaledValue = scaledValue - fractial + 1.0;
} else if (forceCeil) {
// Next we check if we need to use forced rounding
- scaledValue = scaledValue - fractial + 1.0f;
+ scaledValue = scaledValue - fractial + 1.0;
} else if (forceFloor) {
scaledValue = scaledValue - fractial;
} else {
// Finally we just round the value
scaledValue = scaledValue - fractial +
- (!YGFloatIsUndefined(fractial) &&
- (fractial > 0.5f || YGDoubleEqual(fractial, 0.5f))
- ? 1.0f
- : 0.0f);
+ (!YGDoubleIsUndefined(fractial) &&
+ (fractial > 0.5 || YGDoubleEqual(fractial, 0.5))
+ ? 1.0
+ : 0.0);
}
- return (YGFloatIsUndefined(scaledValue) ||
- YGFloatIsUndefined(pointScaleFactor))
+ return (YGDoubleIsUndefined(scaledValue) ||
+ YGDoubleIsUndefined(pointScaleFactor))
? YGUndefined
- : scaledValue / pointScaleFactor;
+ : (float) (scaledValue / pointScaleFactor);
}
YOGA_EXPORT bool YGNodeCanUseCachedMeasurement(
@@ -4235,9 +4225,7 @@ YOGA_EXPORT void YGNodeCalculateLayoutWithContext(
if (node->getConfig()->printTree) {
YGNodePrint(
node,
- (YGPrintOptions)(
- YGPrintOptionsLayout | YGPrintOptionsChildren |
- YGPrintOptionsStyle));
+ (YGPrintOptions) (YGPrintOptionsLayout | YGPrintOptionsChildren | YGPrintOptionsStyle));
}
#endif
}
@@ -4297,9 +4285,7 @@ YOGA_EXPORT void YGNodeCalculateLayoutWithContext(
if (nodeWithoutLegacyFlag->getConfig()->printTree) {
YGNodePrint(
nodeWithoutLegacyFlag,
- (YGPrintOptions)(
- YGPrintOptionsLayout | YGPrintOptionsChildren |
- YGPrintOptionsStyle));
+ (YGPrintOptions) (YGPrintOptionsLayout | YGPrintOptionsChildren | YGPrintOptionsStyle));
}
#endif
}
diff --git a/node_modules/react-native/ReactCommon/yoga/yoga/Yoga.h b/node_modules/react-native/ReactCommon/yoga/yoga/Yoga.h
index 87901a2..40b0edf 100644
--- a/node_modules/react-native/ReactCommon/yoga/yoga/Yoga.h
+++ b/node_modules/react-native/ReactCommon/yoga/yoga/Yoga.h
@@ -107,7 +107,7 @@ WIN_EXPORT void YGNodeMarkDirty(YGNodeRef node);
// Marks the current node and all its descendants as dirty.
//
-// Intended to be used for Uoga benchmarks. Don't use in production, as calling
+// Intended to be used for Yoga benchmarks. Don't use in production, as calling
// `YGCalculateLayout` will cause the recalculation of each and every node.
WIN_EXPORT void YGNodeMarkDirtyAndPropogateToDescendants(YGNodeRef node);
@@ -232,6 +232,9 @@ WIN_EXPORT YGValue YGNodeStyleGetPadding(YGNodeConstRef node, YGEdge edge);
WIN_EXPORT void YGNodeStyleSetBorder(YGNodeRef node, YGEdge edge, float border);
WIN_EXPORT float YGNodeStyleGetBorder(YGNodeConstRef node, YGEdge edge);
+WIN_EXPORT void YGNodeStyleSetGap(YGNodeRef node, YGGap gap, float gapValue);
+WIN_EXPORT float YGNodeStyleGetGap(YGNodeConstRef node, YGGap gap);
+
WIN_EXPORT void YGNodeStyleSetWidth(YGNodeRef node, float width);
WIN_EXPORT void YGNodeStyleSetWidthPercent(YGNodeRef node, float width);
WIN_EXPORT void YGNodeStyleSetWidthAuto(YGNodeRef node);
diff --git a/node_modules/react-native/scripts/.packager.env b/node_modules/react-native/scripts/.packager.env
new file mode 100644
index 0000000..361f5fb
--- /dev/null
+++ b/node_modules/react-native/scripts/.packager.env
@@ -0,0 +1 @@
+export RCT_METRO_PORT=8081
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment