react-native-tvos 0.85.3-1 → 0.86.0-0

package/ReactCommon/yoga/yoga/algorithm/AbsoluteLayout.cpp

@@ -23,7 +23,11 @@ static inline void setFlexStartLayoutPosition(
                        axis, direction, containingBlockWidth) +
       parent->getLayout().border(flexStartEdge(axis));
 
-  if (!child->hasErrata(Errata::AbsolutePositionWithoutInsetsExcludesPadding)) {
+  // https://www.w3.org/TR/css-grid-1/#abspos
+  // absolute positioned grid items are positioned relative to the padding edge
+  // of the grid container
+  if (!child->hasErrata(Errata::AbsolutePositionWithoutInsetsExcludesPadding) &&
+      parent->style().display() != Display::Grid) {
     position += parent->getLayout().padding(flexStartEdge(axis));
   }
 
@@ -40,7 +44,11 @@ static inline void setFlexEndLayoutPosition(
       child->style().computeFlexEndMargin(
           axis, direction, containingBlockWidth);
 
-  if (!child->hasErrata(Errata::AbsolutePositionWithoutInsetsExcludesPadding)) {
+  // https://www.w3.org/TR/css-grid-1/#abspos
+  // absolute positioned grid items are positioned relative to the padding edge
+  // of the grid container
+  if (!child->hasErrata(Errata::AbsolutePositionWithoutInsetsExcludesPadding) &&
+      parent->style().display() != Display::Grid) {
     flexEndPosition += parent->getLayout().padding(flexEndEdge(axis));
   }
 
@@ -60,7 +68,11 @@ static inline void setCenterLayoutPosition(
       parent->getLayout().border(flexStartEdge(axis)) -
       parent->getLayout().border(flexEndEdge(axis));
 
-  if (!child->hasErrata(Errata::AbsolutePositionWithoutInsetsExcludesPadding)) {
+  // https://www.w3.org/TR/css-grid-1/#abspos
+  // absolute positioned grid items are positioned relative to the padding edge
+  // of the grid container
+  if (!child->hasErrata(Errata::AbsolutePositionWithoutInsetsExcludesPadding) &&
+      parent->style().display() != Display::Grid) {
     parentContentBoxSize -= parent->getLayout().padding(flexStartEdge(axis));
     parentContentBoxSize -= parent->getLayout().padding(flexEndEdge(axis));
   }
@@ -74,7 +86,11 @@ static inline void setCenterLayoutPosition(
       child->style().computeFlexStartMargin(
           axis, direction, containingBlockWidth);
 
-  if (!child->hasErrata(Errata::AbsolutePositionWithoutInsetsExcludesPadding)) {
+  // https://www.w3.org/TR/css-grid-1/#abspos
+  // absolute positioned grid items are positioned relative to the padding edge
+  // of the grid container
+  if (!child->hasErrata(Errata::AbsolutePositionWithoutInsetsExcludesPadding) &&
+      parent->style().display() != Display::Grid) {
     position += parent->getLayout().padding(flexStartEdge(axis));
   }
 
@@ -87,13 +103,19 @@ static void justifyAbsoluteChild(
     const Direction direction,
     const FlexDirection mainAxis,
     const float containingBlockWidth) {
-  const Justify parentJustifyContent = parent->style().justifyContent();
-  switch (parentJustifyContent) {
+  const Justify justify = parent->style().display() == Display::Grid
+      ? resolveChildJustification(parent, child)
+      : parent->style().justifyContent();
+  switch (justify) {
+    case Justify::Start:
+    case Justify::Auto:
+    case Justify::Stretch:
     case Justify::FlexStart:
     case Justify::SpaceBetween:
       setFlexStartLayoutPosition(
           parent, child, direction, mainAxis, containingBlockWidth);
       break;
+    case Justify::End:
     case Justify::FlexEnd:
       setFlexEndLayoutPosition(
           parent, child, direction, mainAxis, containingBlockWidth);
@@ -124,6 +146,7 @@ static void alignAbsoluteChild(
   }
 
   switch (itemAlign) {
+    case Align::Start:
     case Align::Auto:
     case Align::FlexStart:
     case Align::Baseline:
@@ -134,6 +157,7 @@ static void alignAbsoluteChild(
       setFlexStartLayoutPosition(
           parent, child, direction, crossAxis, containingBlockWidth);
       break;
+    case Align::End:
     case Align::FlexEnd:
       setFlexEndLayoutPosition(
           parent, child, direction, crossAxis, containingBlockWidth);
@@ -234,9 +258,15 @@ void layoutAbsoluteChild(
     LayoutData& layoutMarkerData,
     const uint32_t depth,
     const uint32_t generationCount) {
-  const FlexDirection mainAxis =
-      resolveDirection(node->style().flexDirection(), direction);
-  const FlexDirection crossAxis = resolveCrossDirection(mainAxis, direction);
+  // For grid containers, use inline (Row) and block (Column) axes for
+  // positioning, since grid alignment properties (justify-self, align-self)
+  // operate on inline/block axes, not main/cross axes based on flex-direction.
+  const FlexDirection mainAxis = node->style().display() == Display::Grid
+      ? resolveDirection(FlexDirection::Row, direction)
+      : resolveDirection(node->style().flexDirection(), direction);
+  const FlexDirection crossAxis = node->style().display() == Display::Grid
+      ? FlexDirection::Column
+      : resolveCrossDirection(mainAxis, direction);
   const bool isMainAxisRow = isRow(mainAxis);
 
   float childWidth = YGUndefined;
@@ -528,6 +558,7 @@ bool layoutAbsoluteDescendants(
       // we need to mutate these descendents. Make sure the path of
       // nodes to them is mutable before positioning.
       child->cloneChildrenIfNeeded();
+      cleanupContentsNodesRecursively(child);
       const Direction childDirection =
           child->resolveDirection(currentNodeDirection);
       // By now all descendants of the containing block that are not absolute

package/ReactCommon/yoga/yoga/algorithm/Align.h

@@ -20,12 +20,23 @@ inline Align resolveChildAlignment(
   const Align align = child->style().alignSelf() == Align::Auto
       ? node->style().alignItems()
       : child->style().alignSelf();
-  if (align == Align::Baseline && isColumn(node->style().flexDirection())) {
+
+  if (node->style().display() == Display::Flex && align == Align::Baseline &&
+      isColumn(node->style().flexDirection())) {
     return Align::FlexStart;
   }
+
   return align;
 }
 
+inline Justify resolveChildJustification(
+    const yoga::Node* node,
+    const yoga::Node* child) {
+  return child->style().justifySelf() == Justify::Auto
+      ? node->style().justifyItems()
+      : child->style().justifySelf();
+}
+
 /**
  * Fallback alignment to use on overflow
  * https://www.w3.org/TR/css-align-3/#distribution-values

package/ReactCommon/yoga/yoga/algorithm/CalculateLayout.cpp

@@ -35,7 +35,7 @@ namespace facebook::yoga {
 
 std::atomic<uint32_t> gCurrentGenerationCount(0);
 
-static void constrainMaxSizeForMode(
+void constrainMaxSizeForMode(
     const yoga::Node* node,
     Direction direction,
     FlexDirection axis,
@@ -94,7 +94,18 @@ static void computeFlexBasisForChild(
   const bool isColumnStyleDimDefined =
       child->hasDefiniteLength(Dimension::Height, ownerHeight);
 
-  if (resolvedFlexBasis.isDefined() && yoga::isDefined(mainAxisSize)) {
+  const bool fixFlexBasisFitContent =
+      node->getConfig()->isExperimentalFeatureEnabled(
+          ExperimentalFeature::FixFlexBasisFitContent);
+
+  bool useResolvedFlexBasis =
+      resolvedFlexBasis.isDefined() && yoga::isDefined(mainAxisSize);
+  if (fixFlexBasisFitContent && resolvedFlexBasis.isDefined() &&
+      resolvedFlexBasis.unwrap() > 0) {
+    useResolvedFlexBasis = true;
+  }
+
+  if (useResolvedFlexBasis) {
     if (child->getLayout().computedFlexBasis.isUndefined() ||
         (child->getConfig()->isExperimentalFeatureEnabled(
              ExperimentalFeature::WebFlexBasis) &&
@@ -164,12 +175,27 @@ static void computeFlexBasisForChild(
       }
     }
 
-    if ((isMainAxisRow && node->style().overflow() == Overflow::Scroll) ||
-        node->style().overflow() != Overflow::Scroll) {
-      if (yoga::isUndefined(childHeight) && yoga::isDefined(height)) {
-        childHeight = height;
-        childHeightSizingMode = SizingMode::FitContent;
-      }
+    // For height in the main axis (column direction): when the
+    // FixFlexBasisFitContent feature is enabled, skip FitContent for
+    // non-measure container children. This makes the flex basis independent
+    // of the parent's content-determined height, preventing unnecessary
+    // re-measurement cascades when a sibling changes size in a ScrollView.
+    //
+    // We only optimize the height (column) axis because text wrapping depends
+    // on width constraints propagating through container nodes. Removing
+    // FitContent from the width axis would cause text inside nested
+    // containers to stop wrapping.
+    bool applyHeightFitContent =
+        isMainAxisRow || node->style().overflow() != Overflow::Scroll;
+    if (fixFlexBasisFitContent) {
+      applyHeightFitContent = isMainAxisRow ||
+          (child->hasMeasureFunc() &&
+           node->style().overflow() != Overflow::Scroll);
+    }
+    if (applyHeightFitContent && yoga::isUndefined(childHeight) &&
+        yoga::isDefined(height)) {
+      childHeight = height;
+      childHeightSizingMode = SizingMode::FitContent;
     }
 
     const auto& childStyle = child->style();
@@ -468,7 +494,7 @@ static bool measureNodeWithFixedSize(
   return false;
 }
 
-static void zeroOutLayoutRecursively(yoga::Node* const node) {
+void zeroOutLayoutRecursively(yoga::Node* const node) {
   node->getLayout() = {};
   node->setLayoutDimension(0, Dimension::Width);
   node->setLayoutDimension(0, Dimension::Height);
@@ -480,7 +506,7 @@ static void zeroOutLayoutRecursively(yoga::Node* const node) {
   }
 }
 
-static void cleanupContentsNodesRecursively(yoga::Node* const node) {
+void cleanupContentsNodesRecursively(yoga::Node* const node) {
   if (node->hasContentsChildren()) [[unlikely]] {
     node->cloneContentsChildrenIfNeeded();
     for (auto child : node->getChildren()) {
@@ -498,7 +524,7 @@ static void cleanupContentsNodesRecursively(yoga::Node* const node) {
   }
 }
 
-static float calculateAvailableInnerDimension(
+float calculateAvailableInnerDimension(
     const yoga::Node* const node,
     const Direction direction,
     const Dimension dimension,
@@ -537,6 +563,8 @@ static float computeFlexBasisForChildren(
     yoga::Node* const node,
     const float availableInnerWidth,
     const float availableInnerHeight,
+    const float ownerWidth,
+    const float ownerHeight,
     SizingMode widthSizingMode,
     SizingMode heightSizingMode,
     Direction direction,
@@ -598,8 +626,8 @@ static float computeFlexBasisForChildren(
           availableInnerWidth,
           widthSizingMode,
           availableInnerHeight,
-          availableInnerWidth,
-          availableInnerHeight,
+          ownerWidth,
+          ownerHeight,
           heightSizingMode,
           direction,
           layoutMarkerData,
@@ -1046,6 +1074,14 @@ static void justifyMainAxis(
 
   if (flexLine.numberOfAutoMargins == 0) {
     switch (justifyContent) {
+      case Justify::Start:
+      case Justify::End:
+      case Justify::Auto:
+        // No-Op
+        break;
+      case Justify::Stretch:
+        // No-Op
+        break;
       case Justify::Center:
         leadingMainDim = flexLine.layout.remainingFreeSpace / 2;
         break;
@@ -1113,7 +1149,14 @@ static void justifyMainAxis(
       // dimensionWithMargin.
       flexLine.layout.mainDim +=
           child->style().computeMarginForAxis(mainAxis, availableInnerWidth) +
-          childLayout.computedFlexBasis.unwrap();
+          boundAxisWithinMinAndMax(
+              child,
+              direction,
+              mainAxis,
+              childLayout.computedFlexBasis,
+              mainAxisOwnerSize,
+              ownerWidth)
+              .unwrap();
       flexLine.layout.crossDim = availableInnerCrossDim;
     } else {
       // The main dimension is the sum of all the elements dimension plus
@@ -1421,12 +1464,53 @@ static void calculateLayoutImpl(
 
   // STEP 3: DETERMINE FLEX BASIS FOR EACH ITEM
 
+  // When this node is measured with MaxContent (FixFlexBasisFitContent
+  // behavior), availableInnerHeight is NaN.
+  // To preserve percentage resolution for descendants, derive a definite
+  // owner-size from the parent-provided ownerHeight.
+  float ownerWidthForChildren = availableInnerWidth;
+  float ownerHeightForChildren = availableInnerHeight;
+
+  if (node->getConfig()->isExperimentalFeatureEnabled(
+          ExperimentalFeature::FixFlexBasisFitContent)) {
+    const auto* owner = node->getOwner();
+    const bool isChildOfScrollContainer =
+        owner != nullptr && owner->style().overflow() == Overflow::Scroll;
+
+    if (!isChildOfScrollContainer) {
+      if (yoga::isUndefined(ownerWidthForChildren) &&
+          yoga::isDefined(ownerWidth)) {
+        ownerWidthForChildren = calculateAvailableInnerDimension(
+            node,
+            direction,
+            Dimension::Width,
+            ownerWidth - marginAxisRow,
+            paddingAndBorderAxisRow,
+            ownerWidth,
+            ownerWidth);
+      }
+      if (yoga::isUndefined(ownerHeightForChildren) &&
+          yoga::isDefined(ownerHeight)) {
+        ownerHeightForChildren = calculateAvailableInnerDimension(
+            node,
+            direction,
+            Dimension::Height,
+            ownerHeight - marginAxisColumn,
+            paddingAndBorderAxisColumn,
+            ownerHeight,
+            ownerWidth);
+      }
+    }
+  }
+
   // Computed basis + margins + gap
   float totalMainDim = 0;
   totalMainDim += computeFlexBasisForChildren(
       node,
       availableInnerWidth,
       availableInnerHeight,
+      ownerWidthForChildren,
+      ownerHeightForChildren,
       widthSizingMode,
       heightSizingMode,
       direction,
@@ -1799,6 +1883,10 @@ static void calculateLayoutImpl(
         : fallbackAlignment(node->style().alignContent());
 
     switch (alignContent) {
+      case Align::Start:
+      case Align::End:
+        // No-Op
+        break;
       case Align::FlexEnd:
         currentLead += remainingAlignContentDim;
         break;
@@ -1886,6 +1974,10 @@ static void calculateLayoutImpl(
         }
         if (child->style().positionType() != PositionType::Absolute) {
           switch (resolveChildAlignment(node, child)) {
+            case Align::Start:
+            case Align::End:
+              // Not yet implemented
+              break;
             case Align::FlexStart: {
               child->setLayoutPosition(
                   currentLead +

package/ReactCommon/yoga/yoga/algorithm/CalculateLayout.h

@@ -35,4 +35,26 @@ bool calculateLayoutInternal(
     uint32_t depth,
     uint32_t generationCount);
 
+void constrainMaxSizeForMode(
+    const yoga::Node* node,
+    Direction direction,
+    FlexDirection axis,
+    float ownerAxisSize,
+    float ownerWidth,
+    /*in_out*/ SizingMode* mode,
+    /*in_out*/ float* size);
+
+float calculateAvailableInnerDimension(
+    const yoga::Node* const node,
+    const Direction direction,
+    const Dimension dimension,
+    const float availableDim,
+    float paddingAndBorder,
+    const float ownerDim,
+    const float ownerWidth);
+
+void zeroOutLayoutRecursively(yoga::Node* const node);
+
+void cleanupContentsNodesRecursively(yoga::Node* const node);
+
 } // namespace facebook::yoga

package/ReactCommon/yoga/yoga/enums/Align.h

@@ -25,11 +25,13 @@ enum class Align : uint8_t {
   SpaceBetween = YGAlignSpaceBetween,
   SpaceAround = YGAlignSpaceAround,
   SpaceEvenly = YGAlignSpaceEvenly,
+  Start = YGAlignStart,
+  End = YGAlignEnd,
 };
 
 template <>
 constexpr int32_t ordinalCount<Align>() {
-  return 9;
+  return 11;
 }
 
 constexpr Align scopedEnum(YGAlign unscoped) {

package/ReactCommon/yoga/yoga/enums/Display.h

@@ -19,11 +19,12 @@ enum class Display : uint8_t {
   Flex = YGDisplayFlex,
   None = YGDisplayNone,
   Contents = YGDisplayContents,
+  Grid = YGDisplayGrid,
 };
 
 template <>
 constexpr int32_t ordinalCount<Display>() {
-  return 3;
+  return 4;
 }
 
 constexpr Display scopedEnum(YGDisplay unscoped) {

package/ReactCommon/yoga/yoga/enums/ExperimentalFeature.h

@@ -17,11 +17,12 @@ namespace facebook::yoga {
 
 enum class ExperimentalFeature : uint8_t {
   WebFlexBasis = YGExperimentalFeatureWebFlexBasis,
+  FixFlexBasisFitContent = YGExperimentalFeatureFixFlexBasisFitContent,
 };
 
 template <>
 constexpr int32_t ordinalCount<ExperimentalFeature>() {
-  return 1;
+  return 2;
 }
 
 constexpr ExperimentalFeature scopedEnum(YGExperimentalFeature unscoped) {

package/ReactCommon/yoga/yoga/enums/GridTrackType.h

@@ -0,0 +1,43 @@
+/*
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+// @generated by enums.py
+// clang-format off
+#pragma once
+
+#include <cstdint>
+#include <yoga/YGEnums.h>
+#include <yoga/enums/YogaEnums.h>
+
+namespace facebook::yoga {
+
+enum class GridTrackType : uint8_t {
+  Auto = YGGridTrackTypeAuto,
+  Points = YGGridTrackTypePoints,
+  Percent = YGGridTrackTypePercent,
+  Fr = YGGridTrackTypeFr,
+  Minmax = YGGridTrackTypeMinmax,
+};
+
+template <>
+constexpr int32_t ordinalCount<GridTrackType>() {
+  return 5;
+}
+
+constexpr GridTrackType scopedEnum(YGGridTrackType unscoped) {
+  return static_cast<GridTrackType>(unscoped);
+}
+
+constexpr YGGridTrackType unscopedEnum(GridTrackType scoped) {
+  return static_cast<YGGridTrackType>(scoped);
+}
+
+inline const char* toString(GridTrackType e) {
+  return YGGridTrackTypeToString(unscopedEnum(e));
+}
+
+} // namespace facebook::yoga

package/ReactCommon/yoga/yoga/enums/Justify.h

@@ -16,17 +16,21 @@
 namespace facebook::yoga {
 
 enum class Justify : uint8_t {
+  Auto = YGJustifyAuto,
   FlexStart = YGJustifyFlexStart,
   Center = YGJustifyCenter,
   FlexEnd = YGJustifyFlexEnd,
   SpaceBetween = YGJustifySpaceBetween,
   SpaceAround = YGJustifySpaceAround,
   SpaceEvenly = YGJustifySpaceEvenly,
+  Stretch = YGJustifyStretch,
+  Start = YGJustifyStart,
+  End = YGJustifyEnd,
 };
 
 template <>
 constexpr int32_t ordinalCount<Justify>() {
-  return 6;
+  return 10;
 }
 
 constexpr Justify scopedEnum(YGJustify unscoped) {

package/ReactCommon/yoga/yoga/event/event.cpp

@@ -29,6 +29,8 @@ const char* LayoutPassReasonToString(const LayoutPassReason value) {
       return "abs_measure";
     case LayoutPassReason::kFlexMeasure:
       return "flex_measure";
+    case LayoutPassReason::kGridLayout:
+      return "grid_layout";
     default:
       return "unknown";
   }

package/ReactCommon/yoga/yoga/event/event.h

@@ -32,6 +32,7 @@ enum struct LayoutPassReason : int {
   kMeasureChild = 5,
   kAbsMeasureChild = 6,
   kFlexMeasure = 7,
+  kGridLayout = 8,
   COUNT
 };
 

package/ReactCommon/yoga/yoga/node/Node.cpp

@@ -392,7 +392,12 @@ void Node::cloneChildrenIfNeeded() {
       child = resolveRef(config_->cloneNode(child, this, i));
       child->setOwner(this);
 
-      if (child->hasContentsChildren()) [[unlikely]] {
+      if (child->style().display() == Display::Contents) [[unlikely]] {
+        // The contents node's children are treated as children of the
+        // contents node's parent for layout purposes, so they need
+        // to be cloned as well.
+        child->cloneChildrenIfNeeded();
+      } else if (child->hasContentsChildren()) [[unlikely]] {
         child->cloneContentsChildrenIfNeeded();
       }
     }

package/ReactCommon/yoga/yoga/node/Node.h

@@ -294,15 +294,15 @@ class YG_EXPORT Node : public ::YGNode {
   bool isNodeFlexible();
   void reset();
 
- private:
-  // Used to allow resetting the node
-  Node& operator=(Node&&) noexcept = default;
-
   float relativePosition(
       FlexDirection axis,
       Direction direction,
       float axisSize) const;
 
+ private:
+  // Used to allow resetting the node
+  Node& operator=(Node&&) noexcept = default;
+
   void useWebDefaults() {
     style_.setFlexDirection(FlexDirection::Row);
     style_.setAlignContent(Align::Stretch);

package/ReactCommon/yoga/yoga/style/GridLine.h

@@ -0,0 +1,53 @@
+/*
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+#pragma once
+
+#include <cstdint>
+
+namespace facebook::yoga {
+
+// https://www.w3.org/TR/css-grid-1/#typedef-grid-row-start-grid-line
+enum class GridLineType : uint8_t {
+  Auto,
+  Integer,
+  Span,
+};
+
+struct GridLine {
+  GridLineType type{};
+  // Line position (1, 2, -1, -2, etc)
+  int32_t integer{};
+
+  constexpr static GridLine auto_() {
+    return GridLine{.type = GridLineType::Auto, .integer = 0};
+  }
+
+  constexpr static GridLine fromInteger(int32_t value) {
+    return GridLine{.type = GridLineType::Integer, .integer = value};
+  }
+
+  constexpr static GridLine span(int32_t value) {
+    return GridLine{.type = GridLineType::Span, .integer = value};
+  }
+
+  constexpr bool isAuto() const {
+    return type == GridLineType::Auto;
+  }
+
+  constexpr bool isInteger() const {
+    return type == GridLineType::Integer;
+  }
+
+  constexpr bool isSpan() const {
+    return type == GridLineType::Span;
+  }
+
+  bool operator==(const GridLine& other) const = default;
+};
+
+} // namespace facebook::yoga

package/ReactCommon/yoga/yoga/style/GridTrack.h

@@ -0,0 +1,63 @@
+/*
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+#pragma once
+
+#include <yoga/style/StyleSizeLength.h>
+#include <vector>
+
+namespace facebook::yoga {
+// https://www.w3.org/TR/css-grid-1/#typedef-track-size
+struct GridTrackSize {
+  StyleSizeLength minSizingFunction;
+  StyleSizeLength maxSizingFunction;
+
+  // These are used in the grid layout algorithm when distributing spaces among
+  // tracks
+  // TODO: maybe move them to TrackSizing since these are track states
+  float baseSize = 0.0f;
+  float growthLimit = 0.0f;
+  bool infinitelyGrowable = false;
+
+  // Static factory methods for common cases
+  constexpr static GridTrackSize auto_() {
+    return GridTrackSize{
+        .minSizingFunction = StyleSizeLength::ofAuto(),
+        .maxSizingFunction = StyleSizeLength::ofAuto()};
+  }
+
+  constexpr static GridTrackSize length(float points) {
+    auto len = StyleSizeLength::points(points);
+    return GridTrackSize{.minSizingFunction = len, .maxSizingFunction = len};
+  }
+
+  constexpr static GridTrackSize fr(float fraction) {
+    // Flex sizing function is always a max sizing function
+    return GridTrackSize{
+        .minSizingFunction = StyleSizeLength::ofAuto(),
+        .maxSizingFunction = StyleSizeLength::stretch(fraction)};
+  }
+
+  constexpr static GridTrackSize percent(float percentage) {
+    return GridTrackSize{
+        .minSizingFunction = StyleSizeLength::percent(percentage),
+        .maxSizingFunction = StyleSizeLength::percent(percentage)};
+  }
+
+  constexpr static GridTrackSize minmax(
+      StyleSizeLength min,
+      StyleSizeLength max) {
+    return GridTrackSize{.minSizingFunction = min, .maxSizingFunction = max};
+  }
+
+  bool operator==(const GridTrackSize& other) const = default;
+};
+
+// Grid track list for grid-template-rows/columns properties
+using GridTrackList = std::vector<GridTrackSize>;
+
+} // namespace facebook::yoga