diff --git a/ReactCommon/yoga/yoga/Utils.cpp b/ReactCommon/yoga/yoga/Utils.cpp
index c57e5af3f..8c6e91cce 100644
--- a/ReactCommon/yoga/yoga/Utils.cpp
+++ b/ReactCommon/yoga/yoga/Utils.cpp
@@ -57,3 +57,9 @@ float YGFloatSanitize(const float& val) {
 float YGUnwrapFloatOptional(const YGFloatOptional& op) {
   return op.isUndefined ? YGUndefined : op.value;
 }
+
+bool YGFloatOptionalFloatEquals(
+    const YGFloatOptional& optional,
+    const float& val) {
+  return YGUnwrapFloatOptional(optional) == val;
+}
diff --git a/ReactCommon/yoga/yoga/Utils.h b/ReactCommon/yoga/yoga/Utils.h
index 6fbd33a44..311030e23 100644
--- a/ReactCommon/yoga/yoga/Utils.h
+++ b/ReactCommon/yoga/yoga/Utils.h
@@ -94,6 +94,12 @@ float YGFloatSanitize(const float& val);
 // TODO: Get rid off this function
 float YGUnwrapFloatOptional(const YGFloatOptional& op);
 
+// This function returns true if val and optional both are undefined or if val
+// and optional.val is true, otherwise its false.
+bool YGFloatOptionalFloatEquals(
+    const YGFloatOptional& optional,
+    const float& val);
+
 YGFlexDirection YGFlexDirectionCross(
     const YGFlexDirection flexDirection,
     const YGDirection direction);
diff --git a/ReactCommon/yoga/yoga/YGNode.cpp b/ReactCommon/yoga/yoga/YGNode.cpp
index 6b02eeb45..e7b1472aa 100644
--- a/ReactCommon/yoga/yoga/YGNode.cpp
+++ b/ReactCommon/yoga/yoga/YGNode.cpp
@@ -500,7 +500,7 @@ YGValue YGNode::resolveFlexBasisPtr() const {
   if (flexBasis.unit != YGUnitAuto && flexBasis.unit != YGUnitUndefined) {
     return flexBasis;
   }
-  if (!YGFloatIsUndefined(style_.flex) && style_.flex > 0.0f) {
+  if (!style_.flex.isUndefined && style_.flex.value > 0.0f) {
     return config_->useWebDefaults ? YGValueAuto : YGValueZero;
   }
   return YGValueAuto;
@@ -595,8 +595,8 @@ float YGNode::resolveFlexGrow() {
   if (!YGFloatIsUndefined(style_.flexGrow)) {
     return style_.flexGrow;
   }
-  if (!YGFloatIsUndefined(style_.flex) && style_.flex > 0.0f) {
-    return style_.flex;
+  if (!style_.flex.isUndefined && style_.flex.value > 0.0f) {
+    return style_.flex.value;
   }
   return kDefaultFlexGrow;
 }
@@ -608,9 +608,9 @@ float YGNode::resolveFlexShrink() {
   if (!YGFloatIsUndefined(style_.flexShrink)) {
     return style_.flexShrink;
   }
-  if (!config_->useWebDefaults && !YGFloatIsUndefined(style_.flex) &&
-      style_.flex < 0.0f) {
-    return -style_.flex;
+  if (!config_->useWebDefaults && !style_.flex.isUndefined &&
+      style_.flex.value < 0.0f) {
+    return -style_.flex.value;
   }
   return config_->useWebDefaults ? kWebDefaultFlexShrink : kDefaultFlexShrink;
 }
diff --git a/ReactCommon/yoga/yoga/YGNodePrint.cpp b/ReactCommon/yoga/yoga/YGNodePrint.cpp
index 395fe1819..2a7a11df8 100644
--- a/ReactCommon/yoga/yoga/YGNodePrint.cpp
+++ b/ReactCommon/yoga/yoga/YGNodePrint.cpp
@@ -39,6 +39,15 @@ static void appendFormatedString(string* str, const char* fmt, ...) {
   str->append(result);
 }
 
+static void appendFloatOptionalIfDefined(
+    string* base,
+    const string key,
+    const YGFloatOptional num) {
+  if (!num.isUndefined) {
+    appendFormatedString(base, "%s: %g; ", key.c_str(), num.value);
+  }
+}
+
 static void
 appendFloatIfNotUndefined(string* base, const string key, const float num) {
   if (!YGFloatIsUndefined(num)) {
@@ -155,7 +164,7 @@ void YGNodeToString(
     appendFloatIfNotUndefined(str, "flex-grow", node->getStyle().flexGrow);
     appendFloatIfNotUndefined(str, "flex-shrink", node->getStyle().flexShrink);
     appendNumberIfNotAuto(str, "flex-basis", node->getStyle().flexBasis);
-    appendFloatIfNotUndefined(str, "flex", node->getStyle().flex);
+    appendFloatOptionalIfDefined(str, "flex", node->getStyle().flex);
 
     if (node->getStyle().flexWrap != YGNode().getStyle().flexWrap) {
       appendFormatedString(
diff --git a/ReactCommon/yoga/yoga/YGStyle.cpp b/ReactCommon/yoga/yoga/YGStyle.cpp
index c4ccf7770..2ac3da93e 100644
--- a/ReactCommon/yoga/yoga/YGStyle.cpp
+++ b/ReactCommon/yoga/yoga/YGStyle.cpp
@@ -7,6 +7,9 @@
 
 #include "YGStyle.h"
 
+#define YGFloatOptionalUndefined \
+  { true, 0 }
+
 const YGValue kYGValueUndefined = {0, YGUnitUndefined};
 
 const YGValue kYGValueAuto = {YGUndefined, YGUnitAuto};
@@ -39,7 +42,7 @@ YGStyle::YGStyle()
       flexWrap(YGWrapNoWrap),
       overflow(YGOverflowVisible),
       display(YGDisplayFlex),
-      flex(YGUndefined),
+      flex(YGFloatOptionalUndefined),
       flexGrow(YGUndefined),
       flexShrink(YGUndefined),
       flexBasis(kYGValueAuto),
@@ -69,8 +72,11 @@ bool YGStyle::operator==(const YGStyle& style) {
       YGValueArrayEqual(minDimensions, style.minDimensions) &&
       YGValueArrayEqual(maxDimensions, style.maxDimensions);
 
-  if (!(YGFloatIsUndefined(flex) && YGFloatIsUndefined(style.flex))) {
-    areNonFloatValuesEqual = areNonFloatValuesEqual && flex == style.flex;
+  areNonFloatValuesEqual =
+      areNonFloatValuesEqual && flex.isUndefined == style.flex.isUndefined;
+  if (areNonFloatValuesEqual && !flex.isUndefined && !style.flex.isUndefined) {
+    areNonFloatValuesEqual =
+        areNonFloatValuesEqual && flex.value == style.flex.value;
   }
 
   if (!(YGFloatIsUndefined(flexGrow) && YGFloatIsUndefined(style.flexGrow))) {
diff --git a/ReactCommon/yoga/yoga/YGStyle.h b/ReactCommon/yoga/yoga/YGStyle.h
index 74b9d6e0b..99e1f18cf 100644
--- a/ReactCommon/yoga/yoga/YGStyle.h
+++ b/ReactCommon/yoga/yoga/YGStyle.h
@@ -20,7 +20,7 @@ struct YGStyle {
   YGWrap flexWrap;
   YGOverflow overflow;
   YGDisplay display;
-  float flex;
+  YGFloatOptional flex;
   float flexGrow;
   float flexShrink;
   YGValue flexBasis;
diff --git a/ReactCommon/yoga/yoga/Yoga.cpp b/ReactCommon/yoga/yoga/Yoga.cpp
index 7b4719f3a..bc80a6367 100644
--- a/ReactCommon/yoga/yoga/Yoga.cpp
+++ b/ReactCommon/yoga/yoga/Yoga.cpp
@@ -752,7 +752,26 @@ YG_NODE_STYLE_PROPERTY_IMPL(YGWrap, FlexWrap, flexWrap, flexWrap);
 YG_NODE_STYLE_PROPERTY_IMPL(YGOverflow, Overflow, overflow, overflow);
 YG_NODE_STYLE_PROPERTY_IMPL(YGDisplay, Display, display, display);
 
-YG_NODE_STYLE_PROPERTY_IMPL(float, Flex, flex, flex);
+// TODO(T26792433): Change the API to accept YGFloatOptional.
+void YGNodeStyleSetFlex(const YGNodeRef node, const float flex) {
+  if (!YGFloatOptionalFloatEquals(node->getStyle().flex, flex)) {
+    YGStyle style = node->getStyle();
+    if (YGFloatIsUndefined(flex)) {
+      style.flex = {true, 0};
+    } else {
+      style.flex = {false, flex};
+    }
+    node->setStyle(style);
+    node->markDirtyAndPropogate();
+  }
+}
+
+// TODO(T26792433): Change the API to accept YGFloatOptional.
+float YGNodeStyleGetFlex(const YGNodeRef node) {
+  return node->getStyle().flex.isUndefined ? YGUndefined
+                                           : node->getStyle().flex.value;
+}
+
 YG_NODE_STYLE_PROPERTY_SETTER_IMPL(float, FlexGrow, flexGrow, flexGrow);
 YG_NODE_STYLE_PROPERTY_SETTER_IMPL(float, FlexShrink, flexShrink, flexShrink);
 YG_NODE_STYLE_PROPERTY_UNIT_AUTO_IMPL(YGValue, FlexBasis, flexBasis, flexBasis);
@@ -762,7 +781,7 @@ YG_NODE_STYLE_EDGE_PROPERTY_UNIT_IMPL(YGValue, Margin, margin, margin);
 YG_NODE_STYLE_EDGE_PROPERTY_UNIT_AUTO_IMPL(YGValue, Margin, margin);
 YG_NODE_STYLE_EDGE_PROPERTY_UNIT_IMPL(YGValue, Padding, padding, padding);
 
-// TODO: Change the API to accept YGFloatOptional.
+// TODO(T26792433): Change the API to accept YGFloatOptional.
 void YGNodeStyleSetBorder(
     const YGNodeRef node,
     const YGEdge edge,
@@ -783,8 +802,8 @@ void YGNodeStyleSetBorder(
 
 float YGNodeStyleGetBorder(const YGNodeRef node, const YGEdge edge) {
   if (node->getStyle().border[edge].unit == YGUnitUndefined) {
-    // TODO: Rather than returning YGUndefined, change the api to return
-    // YGFloatOptional.
+    // TODO(T26792433): Rather than returning YGUndefined, change the api to
+    // return YGFloatOptional.
     return YGUndefined;
   }
 
diff --git a/ReactCommon/yoga/yoga/Yoga.h b/ReactCommon/yoga/yoga/Yoga.h
index 56fe95ff2..baeb28e22 100644
--- a/ReactCommon/yoga/yoga/Yoga.h
+++ b/ReactCommon/yoga/yoga/Yoga.h
@@ -195,7 +195,6 @@ YG_NODE_STYLE_PROPERTY(YGPositionType, PositionType, positionType);
 YG_NODE_STYLE_PROPERTY(YGWrap, FlexWrap, flexWrap);
 YG_NODE_STYLE_PROPERTY(YGOverflow, Overflow, overflow);
 YG_NODE_STYLE_PROPERTY(YGDisplay, Display, display);
-
 YG_NODE_STYLE_PROPERTY(float, Flex, flex);
 YG_NODE_STYLE_PROPERTY(float, FlexGrow, flexGrow);
 YG_NODE_STYLE_PROPERTY(float, FlexShrink, flexShrink);