diff --git a/packages/react-native/ReactCommon/yoga/yoga/algorithm/CalculateLayout.cpp b/packages/react-native/ReactCommon/yoga/yoga/algorithm/CalculateLayout.cpp index 0335f471da5edb..18ff78e25a31c8 100644 --- a/packages/react-native/ReactCommon/yoga/yoga/algorithm/CalculateLayout.cpp +++ b/packages/react-native/ReactCommon/yoga/yoga/algorithm/CalculateLayout.cpp @@ -88,7 +88,7 @@ static void computeFlexBasisForChild( SizingMode childHeightSizingMode; const FloatOptional resolvedFlexBasis = - child->resolveFlexBasisPtr().resolve(mainAxisownerSize); + child->resolveFlexBasis(direction, mainAxis, mainAxisownerSize); const bool isRowStyleDimDefined = child->hasDefiniteLength(Dimension::Width, ownerWidth); const bool isColumnStyleDimDefined = diff --git a/packages/react-native/ReactCommon/yoga/yoga/node/Node.cpp b/packages/react-native/ReactCommon/yoga/yoga/node/Node.cpp index 83e47bd6335156..1491d295ce9012 100644 --- a/packages/react-native/ReactCommon/yoga/yoga/node/Node.cpp +++ b/packages/react-native/ReactCommon/yoga/yoga/node/Node.cpp @@ -9,6 +9,7 @@ #include #include +#include #include #include #include @@ -281,7 +282,7 @@ void Node::setPosition( crossAxisTrailingEdge); } -Style::Length Node::resolveFlexBasisPtr() const { +Style::Length Node::processFlexBasis() const { Style::Length flexBasis = style_.flexBasis(); if (flexBasis.unit() != Unit::Auto && flexBasis.unit() != Unit::Undefined) { return flexBasis; @@ -292,6 +293,25 @@ Style::Length Node::resolveFlexBasisPtr() const { return value::ofAuto(); } +FloatOptional Node::resolveFlexBasis( + Direction direction, + FlexDirection flexDirection, + float referenceLength) const { + FloatOptional value = processFlexBasis().resolve(referenceLength); + if (style_.boxSizing() == BoxSizing::BorderBox) { + return value; + } + + Dimension dim = dimension(flexDirection); + FloatOptional dimensionPaddingAndBorder = + FloatOptional{style_.computePaddingAndBorderForDimension( + direction, dim, referenceLength)}; + + return value + + (dimensionPaddingAndBorder.isDefined() ? dimensionPaddingAndBorder + : FloatOptional{0.0}); +} + void Node::processDimensions() { for (auto dim : {Dimension::Width, Dimension::Height}) { if (style_.maxDimension(dim).isDefined() && diff --git a/packages/react-native/ReactCommon/yoga/yoga/node/Node.h b/packages/react-native/ReactCommon/yoga/yoga/node/Node.h index 8d7ac32046360e..b15a01607eec26 100644 --- a/packages/react-native/ReactCommon/yoga/yoga/node/Node.h +++ b/packages/react-native/ReactCommon/yoga/yoga/node/Node.h @@ -247,7 +247,11 @@ class YG_EXPORT Node : public ::YGNode { void setPosition(Direction direction, float ownerWidth, float ownerHeight); // Other methods - Style::Length resolveFlexBasisPtr() const; + Style::Length processFlexBasis() const; + FloatOptional resolveFlexBasis( + Direction direction, + FlexDirection flexDirection, + float referenceLength) const; void processDimensions(); Direction resolveDirection(Direction ownerDirection); void clearChildren();