Skip to content

Commit

Permalink
Do not expose aggregate style edges (facebook#41610)
Browse files Browse the repository at this point in the history 
Summary:

X-link: facebook/yoga#1477

A reland of the main change in D50998164, moving away from exposing compound edge arrays directly.

Changelog: [Internal]

Reviewed By: joevilches

Differential Revision: D51512611
  • Loading branch information
@NickGerleman @facebook-github-bot
NickGerleman authored and facebook-github-bot committed Nov 22, 2023
1 parent 3f2aa2d commit e4a326e
Show file tree
Hide file tree
Showing 16 changed files with 681 additions and 660 deletions.
16 changes: 8 additions & 8 deletions packages/react-native/React/Tests/Text/RCTParagraphComponentViewTests.mm
View file
Original file line number Diff line number Diff line change
Expand Up @@ -134,8 +134,8 @@ - (void)setUp
props.accessible = true;
auto &yogaStyle = props.yogaStyle;
yogaStyle.positionType() = yoga::PositionType::Absolute;
yogaStyle.position()[YGEdgeLeft] = YGValue{0, YGUnitPoint};
yogaStyle.position()[YGEdgeTop] = YGValue{0, YGUnitPoint};
yogaStyle.setPosition(YGEdgeLeft, yoga::CompactValue::of<YGUnitPoint>(0));
yogaStyle.setPosition(YGEdgeTop, yoga::CompactValue::of<YGUnitPoint>(0));
yogaStyle.setDimension(yoga::Dimension::Width, yoga::CompactValue::of<YGUnitPoint>(200));
yogaStyle.setDimension(yoga::Dimension::Height, yoga::CompactValue::of<YGUnitPoint>(200));
return sharedProps;
Expand Down Expand Up @@ -214,8 +214,8 @@ - (void)setUp
props.accessible = true;
auto &yogaStyle = props.yogaStyle;
yogaStyle.positionType() = yoga::PositionType::Absolute;
yogaStyle.position()[YGEdgeLeft] = YGValue{0, YGUnitPoint};
yogaStyle.position()[YGEdgeTop] = YGValue{30, YGUnitPoint};
yogaStyle.setPosition(YGEdgeLeft, yoga::CompactValue::of<YGUnitPoint>(0));
yogaStyle.setPosition(YGEdgeTop, yoga::CompactValue::of<YGUnitPoint>(30));
yogaStyle.setDimension(yoga::Dimension::Width, yoga::CompactValue::of<YGUnitPoint>(200));
yogaStyle.setDimension(yoga::Dimension::Height, yoga::CompactValue::of<YGUnitPoint>(50));
return sharedProps;
Expand Down Expand Up @@ -258,8 +258,8 @@ - (void)setUp
props.accessible = true;
auto &yogaStyle = props.yogaStyle;
yogaStyle.positionType() = yoga::PositionType::Absolute;
yogaStyle.position()[YGEdgeLeft] = YGValue{0, YGUnitPoint};
yogaStyle.position()[YGEdgeTop] = YGValue{90, YGUnitPoint};
yogaStyle.setPosition(YGEdgeLeft, yoga::CompactValue::of<YGUnitPoint>(0));
yogaStyle.setPosition(YGEdgeTop, yoga::CompactValue::of<YGUnitPoint>(90));
yogaStyle.setDimension(yoga::Dimension::Width, yoga::CompactValue::of<YGUnitPoint>(200));
yogaStyle.setDimension(yoga::Dimension::Height, yoga::CompactValue::of<YGUnitPoint>(50));
return sharedProps;
Expand Down Expand Up @@ -432,8 +432,8 @@ - (void)testEntireParagraphLink
props.accessibilityTraits = AccessibilityTraits::Link;
auto &yogaStyle = props.yogaStyle;
yogaStyle.positionType() = yoga::PositionType::Absolute;
yogaStyle.position()[YGEdgeLeft] = YGValue{0, YGUnitPoint};
yogaStyle.position()[YGEdgeTop] = YGValue{0, YGUnitPoint};
yogaStyle.setPosition(YGEdgeLeft, yoga::CompactValue::of<YGUnitPoint>(0));
yogaStyle.setPosition(YGEdgeTop, yoga::CompactValue::of<YGUnitPoint>(0));
yogaStyle.setDimension(yoga::Dimension::Width, yoga::CompactValue::of<YGUnitPoint>(200));
yogaStyle.setDimension(yoga::Dimension::Height, yoga::CompactValue::of<YGUnitPoint>(20));
return sharedProps;
Expand Down
20 changes: 10 additions & 10 deletions ...extinput/react/renderer/components/androidtextinput/AndroidTextInputComponentDescriptor.h
View file
Original file line number Diff line number Diff line change
Expand Up @@ -106,27 +106,27 @@ class AndroidTextInputComponentDescriptor final
!textInputProps.hasPaddingLeft &&
!textInputProps.hasPaddingHorizontal) {
changedPadding = true;
style.padding()[YGEdgeStart] =
yoga::CompactValue::of<YGUnitPoint>(theme.start);
style.setPadding(
YGEdgeStart, yoga::CompactValue::of<YGUnitPoint>(theme.start));
}
if (!textInputProps.hasPadding && !textInputProps.hasPaddingEnd &&
!textInputProps.hasPaddingRight &&
!textInputProps.hasPaddingHorizontal) {
changedPadding = true;
style.padding()[YGEdgeEnd] =
yoga::CompactValue::of<YGUnitPoint>(theme.end);
style.setPadding(
YGEdgeEnd, yoga::CompactValue::of<YGUnitPoint>(theme.end));
}
if (!textInputProps.hasPadding && !textInputProps.hasPaddingTop &&
!textInputProps.hasPaddingVertical) {
changedPadding = true;
style.padding()[YGEdgeTop] =
yoga::CompactValue::of<YGUnitPoint>(theme.top);
style.setPadding(
YGEdgeTop, yoga::CompactValue::of<YGUnitPoint>(theme.top));
}
if (!textInputProps.hasPadding && !textInputProps.hasPaddingBottom &&
!textInputProps.hasPaddingVertical) {
changedPadding = true;
style.padding()[YGEdgeBottom] =
yoga::CompactValue::of<YGUnitPoint>(theme.bottom);
style.setPadding(
YGEdgeBottom, yoga::CompactValue::of<YGUnitPoint>(theme.bottom));
}

// If the TextInput initially does not have paddingLeft or paddingStart, a
Expand All @@ -137,12 +137,12 @@ class AndroidTextInputComponentDescriptor final
if ((textInputProps.hasPadding || textInputProps.hasPaddingLeft ||
textInputProps.hasPaddingHorizontal) &&
!textInputProps.hasPaddingStart) {
style.padding()[YGEdgeStart] = yoga::CompactValue::ofUndefined();
style.setPadding(YGEdgeStart, yoga::CompactValue::ofUndefined());
}
if ((textInputProps.hasPadding || textInputProps.hasPaddingRight ||
textInputProps.hasPaddingHorizontal) &&
!textInputProps.hasPaddingEnd) {
style.padding()[YGEdgeEnd] = yoga::CompactValue::ofUndefined();
style.setPadding(YGEdgeEnd, yoga::CompactValue::ofUndefined());
}

// Note that this is expensive: on every adopt, we need to set the Yoga
Expand Down
18 changes: 9 additions & 9 deletions packages/react-native/ReactCommon/react/renderer/components/view/BaseViewProps.cpp
View file
Original file line number Diff line number Diff line change
Expand Up @@ -358,20 +358,20 @@ BorderMetrics BaseViewProps::resolveBorderMetrics(
bool{layoutMetrics.layoutDirection == LayoutDirection::RightToLeft};

auto borderWidths = CascadedBorderWidths{
/* .left = */ optionalFloatFromYogaValue(yogaStyle.border()[YGEdgeLeft]),
/* .top = */ optionalFloatFromYogaValue(yogaStyle.border()[YGEdgeTop]),
/* .left = */ optionalFloatFromYogaValue(yogaStyle.border(YGEdgeLeft)),
/* .top = */ optionalFloatFromYogaValue(yogaStyle.border(YGEdgeTop)),
/* .right = */
optionalFloatFromYogaValue(yogaStyle.border()[YGEdgeRight]),
optionalFloatFromYogaValue(yogaStyle.border(YGEdgeRight)),
/* .bottom = */
optionalFloatFromYogaValue(yogaStyle.border()[YGEdgeBottom]),
optionalFloatFromYogaValue(yogaStyle.border(YGEdgeBottom)),
/* .start = */
optionalFloatFromYogaValue(yogaStyle.border()[YGEdgeStart]),
/* .end = */ optionalFloatFromYogaValue(yogaStyle.border()[YGEdgeEnd]),
optionalFloatFromYogaValue(yogaStyle.border(YGEdgeStart)),
/* .end = */ optionalFloatFromYogaValue(yogaStyle.border(YGEdgeEnd)),
/* .horizontal = */
optionalFloatFromYogaValue(yogaStyle.border()[YGEdgeHorizontal]),
optionalFloatFromYogaValue(yogaStyle.border(YGEdgeHorizontal)),
/* .vertical = */
optionalFloatFromYogaValue(yogaStyle.border()[YGEdgeVertical]),
/* .all = */ optionalFloatFromYogaValue(yogaStyle.border()[YGEdgeAll]),
optionalFloatFromYogaValue(yogaStyle.border(YGEdgeVertical)),
/* .all = */ optionalFloatFromYogaValue(yogaStyle.border(YGEdgeAll)),
};

return {
Expand Down
2 changes: 1 addition & 1 deletion packages/react-native/ReactCommon/react/renderer/components/view/ViewShadowNode.cpp
View file
Original file line number Diff line number Diff line change
Expand Up @@ -41,7 +41,7 @@ void ViewShadowNode::initialize() noexcept {

auto hasBorder = [&]() {
for (auto edge : yoga::ordinals<yoga::Edge>()) {
if (viewProps.yogaStyle.border()[yoga::unscopedEnum(edge)].isDefined()) {
if (viewProps.yogaStyle.border(yoga::unscopedEnum(edge)).isDefined()) {
return true;
}
}
Expand Down
142 changes: 68 additions & 74 deletions ...ages/react-native/ReactCommon/react/renderer/components/view/YogaLayoutableShadowNode.cpp
View file
Original file line number Diff line number Diff line change
Expand Up @@ -391,55 +391,55 @@ void YogaLayoutableShadowNode::updateYogaProps() {
yoga::Style result{baseStyle};

// Aliases with precedence
if (!props.insetInlineEnd.isUndefined()) {
result.position()[YGEdgeEnd] = props.insetInlineEnd;
if (props.insetInlineEnd.isDefined()) {
result.setPosition(YGEdgeEnd, props.insetInlineEnd);
}
if (!props.insetInlineStart.isUndefined()) {
result.position()[YGEdgeStart] = props.insetInlineStart;
if (props.insetInlineStart.isDefined()) {
result.setPosition(YGEdgeStart, props.insetInlineStart);
}
if (!props.marginInline.isUndefined()) {
result.margin()[YGEdgeHorizontal] = props.marginInline;
if (props.marginInline.isDefined()) {
result.setMargin(YGEdgeHorizontal, props.marginInline);
}
if (!props.marginInlineStart.isUndefined()) {
result.margin()[YGEdgeStart] = props.marginInlineStart;
if (props.marginInlineStart.isDefined()) {
result.setMargin(YGEdgeStart, props.marginInlineStart);
}
if (!props.marginInlineEnd.isUndefined()) {
result.margin()[YGEdgeEnd] = props.marginInlineEnd;
if (props.marginInlineEnd.isDefined()) {
result.setMargin(YGEdgeEnd, props.marginInlineEnd);
}
if (!props.marginBlock.isUndefined()) {
result.margin()[YGEdgeVertical] = props.marginBlock;
if (props.marginBlock.isDefined()) {
result.setMargin(YGEdgeVertical, props.marginBlock);
}
if (!props.paddingInline.isUndefined()) {
result.padding()[YGEdgeHorizontal] = props.paddingInline;
if (props.paddingInline.isDefined()) {
result.setPadding(YGEdgeHorizontal, props.paddingInline);
}
if (!props.paddingInlineStart.isUndefined()) {
result.padding()[YGEdgeStart] = props.paddingInlineStart;
if (props.paddingInlineStart.isDefined()) {
result.setPadding(YGEdgeStart, props.paddingInlineStart);
}
if (!props.paddingInlineEnd.isUndefined()) {
result.padding()[YGEdgeEnd] = props.paddingInlineEnd;
if (props.paddingInlineEnd.isDefined()) {
result.setPadding(YGEdgeEnd, props.paddingInlineEnd);
}
if (!props.paddingBlock.isUndefined()) {
result.padding()[YGEdgeVertical] = props.paddingBlock;
if (props.paddingBlock.isDefined()) {
result.setPadding(YGEdgeVertical, props.paddingBlock);
}

// Aliases without precedence
if (CompactValue(result.position()[YGEdgeBottom]).isUndefined()) {
result.position()[YGEdgeBottom] = props.insetBlockEnd;
if (result.position(YGEdgeBottom).isUndefined()) {
result.setPosition(YGEdgeBottom, props.insetBlockEnd);
}
if (CompactValue(result.position()[YGEdgeTop]).isUndefined()) {
result.position()[YGEdgeTop] = props.insetBlockStart;
if (result.position(YGEdgeTop).isUndefined()) {
result.setPosition(YGEdgeTop, props.insetBlockStart);
}
if (CompactValue(result.margin()[YGEdgeTop]).isUndefined()) {
result.margin()[YGEdgeTop] = props.marginBlockStart;
if (result.margin(YGEdgeTop).isUndefined()) {
result.setMargin(YGEdgeTop, props.marginBlockStart);
}
if (CompactValue(result.margin()[YGEdgeBottom]).isUndefined()) {
result.margin()[YGEdgeBottom] = props.marginBlockEnd;
if (result.margin(YGEdgeBottom).isUndefined()) {
result.setMargin(YGEdgeBottom, props.marginBlockEnd);
}
if (CompactValue(result.padding()[YGEdgeTop]).isUndefined()) {
result.padding()[YGEdgeTop] = props.paddingBlockStart;
if (result.padding(YGEdgeTop).isUndefined()) {
result.setPadding(YGEdgeTop, props.paddingBlockStart);
}
if (CompactValue(result.padding()[YGEdgeBottom]).isUndefined()) {
result.padding()[YGEdgeBottom] = props.paddingBlockEnd;
if (result.padding(YGEdgeBottom).isUndefined()) {
result.setPadding(YGEdgeBottom, props.paddingBlockEnd);
}

return result;
Expand Down Expand Up @@ -549,18 +549,18 @@ void YogaLayoutableShadowNode::setPadding(RectangleEdges<Float> padding) const {
auto rightPadding = yoga::CompactValue::ofMaybe<YGUnitPoint>(padding.right);
auto bottomPadding = yoga::CompactValue::ofMaybe<YGUnitPoint>(padding.bottom);

if (leftPadding != style.padding()[YGEdgeLeft] ||
topPadding != style.padding()[YGEdgeTop] ||
rightPadding != style.padding()[YGEdgeRight] ||
bottomPadding != style.padding()[YGEdgeBottom]) {
style.padding()[YGEdgeTop] =
yoga::CompactValue::ofMaybe<YGUnitPoint>(padding.top);
style.padding()[YGEdgeLeft] =
yoga::CompactValue::ofMaybe<YGUnitPoint>(padding.left);
style.padding()[YGEdgeRight] =
yoga::CompactValue::ofMaybe<YGUnitPoint>(padding.right);
style.padding()[YGEdgeBottom] =
yoga::CompactValue::ofMaybe<YGUnitPoint>(padding.bottom);
if (leftPadding != style.padding(YGEdgeLeft) ||
topPadding != style.padding(YGEdgeTop) ||
rightPadding != style.padding(YGEdgeRight) ||
bottomPadding != style.padding(YGEdgeBottom)) {
style.setPadding(
YGEdgeTop, yoga::CompactValue::ofMaybe<YGUnitPoint>(padding.top));
style.setPadding(
YGEdgeLeft, yoga::CompactValue::ofMaybe<YGUnitPoint>(padding.left));
style.setPadding(
YGEdgeRight, yoga::CompactValue::ofMaybe<YGUnitPoint>(padding.right));
style.setPadding(
YGEdgeBottom, yoga::CompactValue::ofMaybe<YGUnitPoint>(padding.bottom));
yogaNode_.setStyle(style);
yogaNode_.setDirty(true);
}
Expand Down Expand Up @@ -883,40 +883,36 @@ void YogaLayoutableShadowNode::swapLeftAndRightInYogaStyleProps(
const YogaLayoutableShadowNode& shadowNode) {
auto yogaStyle = shadowNode.yogaNode_.getStyle();

const yoga::Style::Edges& position = yogaStyle.position();
const yoga::Style::Edges& padding = yogaStyle.padding();
const yoga::Style::Edges& margin = yogaStyle.margin();

// Swap Yoga node values, position, padding and margin.

if (yogaStyle.position()[YGEdgeLeft] != YGValueUndefined) {
yogaStyle.position()[YGEdgeStart] = position[YGEdgeLeft];
yogaStyle.position()[YGEdgeLeft] = YGValueUndefined;
if (yogaStyle.position(YGEdgeLeft).isDefined()) {
yogaStyle.setPosition(YGEdgeStart, yogaStyle.position(YGEdgeLeft));
yogaStyle.setPosition(YGEdgeLeft, yoga::CompactValue::ofUndefined());
}

if (yogaStyle.position()[YGEdgeRight] != YGValueUndefined) {
yogaStyle.position()[YGEdgeEnd] = position[YGEdgeRight];
yogaStyle.position()[YGEdgeRight] = YGValueUndefined;
if (yogaStyle.position(YGEdgeRight).isDefined()) {
yogaStyle.setPosition(YGEdgeEnd, yogaStyle.position(YGEdgeRight));
yogaStyle.setPosition(YGEdgeRight, yoga::CompactValue::ofUndefined());
}

if (yogaStyle.padding()[YGEdgeLeft] != YGValueUndefined) {
yogaStyle.padding()[YGEdgeStart] = padding[YGEdgeLeft];
yogaStyle.padding()[YGEdgeLeft] = YGValueUndefined;
if (yogaStyle.padding(YGEdgeLeft).isDefined()) {
yogaStyle.setPadding(YGEdgeStart, yogaStyle.padding(YGEdgeLeft));
yogaStyle.setPadding(YGEdgeLeft, yoga::CompactValue::ofUndefined());
}

if (yogaStyle.padding()[YGEdgeRight] != YGValueUndefined) {
yogaStyle.padding()[YGEdgeEnd] = padding[YGEdgeRight];
yogaStyle.padding()[YGEdgeRight] = YGValueUndefined;
if (yogaStyle.padding(YGEdgeRight).isDefined()) {
yogaStyle.setPadding(YGEdgeEnd, yogaStyle.padding(YGEdgeRight));
yogaStyle.setPadding(YGEdgeRight, yoga::CompactValue::ofUndefined());
}

if (yogaStyle.margin()[YGEdgeLeft] != YGValueUndefined) {
yogaStyle.margin()[YGEdgeStart] = margin[YGEdgeLeft];
yogaStyle.margin()[YGEdgeLeft] = YGValueUndefined;
if (yogaStyle.margin(YGEdgeLeft).isDefined()) {
yogaStyle.setMargin(YGEdgeStart, yogaStyle.margin(YGEdgeLeft));
yogaStyle.setMargin(YGEdgeLeft, yoga::CompactValue::ofUndefined());
}

if (yogaStyle.margin()[YGEdgeRight] != YGValueUndefined) {
yogaStyle.margin()[YGEdgeEnd] = margin[YGEdgeRight];
yogaStyle.margin()[YGEdgeRight] = YGValueUndefined;
if (yogaStyle.margin(YGEdgeRight).isDefined()) {
yogaStyle.setMargin(YGEdgeEnd, yogaStyle.margin(YGEdgeRight));
yogaStyle.setMargin(YGEdgeRight, yoga::CompactValue::ofUndefined());
}

shadowNode.yogaNode_.setStyle(yogaStyle);
Expand Down Expand Up @@ -969,16 +965,14 @@ void YogaLayoutableShadowNode::swapLeftAndRightInViewProps(
props.borderStyles.right.reset();
}

const yoga::Style::Edges& border = props.yogaStyle.border();

if (props.yogaStyle.border()[YGEdgeLeft] != YGValueUndefined) {
props.yogaStyle.border()[YGEdgeStart] = border[YGEdgeLeft];
props.yogaStyle.border()[YGEdgeLeft] = YGValueUndefined;
if (props.yogaStyle.border(YGEdgeLeft).isDefined()) {
props.yogaStyle.setBorder(YGEdgeStart, props.yogaStyle.border(YGEdgeLeft));
props.yogaStyle.setBorder(YGEdgeLeft, yoga::CompactValue::ofUndefined());
}

if (props.yogaStyle.border()[YGEdgeRight] != YGValueUndefined) {
props.yogaStyle.border()[YGEdgeEnd] = border[YGEdgeRight];
props.yogaStyle.border()[YGEdgeRight] = YGValueUndefined;
if (props.yogaStyle.border(YGEdgeRight).isDefined()) {
props.yogaStyle.setBorder(YGEdgeEnd, props.yogaStyle.border(YGEdgeRight));
props.yogaStyle.setBorder(YGEdgeRight, yoga::CompactValue::ofUndefined());
}
}

Expand Down
Loading

0 comments on commit e4a326e

Please sign in to comment.