react-native-tvos 0.73.7-1 → 0.74.0-0

package/ReactCommon/react/renderer/css/tests/CSSParserTest.cpp

@@ -0,0 +1,317 @@
+/*
+ * 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.
+ */
+
+#include <gtest/gtest.h>
+#include <react/renderer/css/CSSParser.h>
+
+namespace facebook::react {
+
+TEST(CSSParser, keyword_values) {
+  auto emptyValue = parseCSSComponentValue<CSSWideKeyword, CSSKeyword>("");
+  EXPECT_EQ(emptyValue.type(), CSSValueType::CSSWideKeyword);
+  EXPECT_EQ(emptyValue.getCSSWideKeyword(), CSSWideKeyword::Unset);
+
+  auto autoValue = parseCSSComponentValue<CSSWideKeyword, CSSKeyword>("auto");
+  EXPECT_EQ(autoValue.type(), CSSValueType::Keyword);
+  EXPECT_EQ(autoValue.getKeyword(), CSSKeyword::Auto);
+
+  auto autoCapsValue =
+      parseCSSComponentValue<CSSWideKeyword, CSSKeyword>("AuTO");
+  EXPECT_EQ(autoCapsValue.type(), CSSValueType::Keyword);
+  EXPECT_EQ(autoCapsValue.getKeyword(), CSSKeyword::Auto);
+
+  auto autoDisallowedValue = parseCSSComponentValue<CSSWideKeyword>("auto");
+  EXPECT_EQ(autoDisallowedValue.type(), CSSValueType::CSSWideKeyword);
+  EXPECT_EQ(autoDisallowedValue.getCSSWideKeyword(), CSSWideKeyword::Unset);
+
+  auto whitespaceValue =
+      parseCSSComponentValue<CSSWideKeyword, CSSKeyword>(" flex-start   ");
+  EXPECT_EQ(whitespaceValue.type(), CSSValueType::Keyword);
+  EXPECT_EQ(whitespaceValue.getKeyword(), CSSKeyword::FlexStart);
+
+  auto badIdentValue =
+      parseCSSComponentValue<CSSWideKeyword, CSSKeyword>("bad");
+  EXPECT_EQ(badIdentValue.type(), CSSValueType::CSSWideKeyword);
+  EXPECT_EQ(badIdentValue.getCSSWideKeyword(), CSSWideKeyword::Unset);
+
+  auto pxValue = parseCSSComponentValue<CSSWideKeyword>("20px");
+  EXPECT_EQ(pxValue.type(), CSSValueType::CSSWideKeyword);
+  EXPECT_EQ(pxValue.getCSSWideKeyword(), CSSWideKeyword::Unset);
+
+  auto multiValue = parseCSSComponentValue<CSSWideKeyword>("auto flex-start");
+  EXPECT_EQ(multiValue.type(), CSSValueType::CSSWideKeyword);
+  EXPECT_EQ(multiValue.getCSSWideKeyword(), CSSWideKeyword::Unset);
+}
+
+TEST(CSSParser, length_values) {
+  auto emptyValue = parseCSSComponentValue<CSSWideKeyword, CSSLength>("");
+  EXPECT_EQ(emptyValue.type(), CSSValueType::CSSWideKeyword);
+  EXPECT_EQ(emptyValue.getCSSWideKeyword(), CSSWideKeyword::Unset);
+
+  auto autoValue =
+      parseCSSComponentValue<CSSWideKeyword, CSSKeyword, CSSLength>("auto");
+  EXPECT_EQ(autoValue.type(), CSSValueType::Keyword);
+  EXPECT_EQ(autoValue.getKeyword(), CSSKeyword::Auto);
+
+  auto pxValue = parseCSSComponentValue<CSSWideKeyword, CSSLength>("20px");
+  EXPECT_EQ(pxValue.type(), CSSValueType::Length);
+  EXPECT_EQ(pxValue.getLength().value, 20.0f);
+  EXPECT_EQ(pxValue.getLength().unit, CSSLengthUnit::Px);
+
+  auto cmValue = parseCSSComponentValue<CSSWideKeyword, CSSLength>("453cm");
+  EXPECT_EQ(cmValue.type(), CSSValueType::Length);
+  EXPECT_EQ(cmValue.getLength().value, 453.0f);
+  EXPECT_EQ(cmValue.getLength().unit, CSSLengthUnit::Cm);
+
+  auto unitlessZeroValue =
+      parseCSSComponentValue<CSSWideKeyword, CSSLength>("0");
+  EXPECT_EQ(unitlessZeroValue.type(), CSSValueType::Length);
+  EXPECT_EQ(unitlessZeroValue.getLength().value, 0.0f);
+  EXPECT_EQ(unitlessZeroValue.getLength().unit, CSSLengthUnit::Px);
+
+  auto unitlessNonzeroValue =
+      parseCSSComponentValue<CSSWideKeyword, CSSLength>("123");
+  EXPECT_EQ(unitlessNonzeroValue.type(), CSSValueType::CSSWideKeyword);
+  EXPECT_EQ(unitlessNonzeroValue.getCSSWideKeyword(), CSSWideKeyword::Unset);
+
+  auto pctValue = parseCSSComponentValue<CSSWideKeyword, CSSLength>("-40%");
+  EXPECT_EQ(pctValue.type(), CSSValueType::CSSWideKeyword);
+  EXPECT_EQ(pctValue.getCSSWideKeyword(), CSSWideKeyword::Unset);
+}
+
+TEST(CSSParser, length_percentage_values) {
+  auto emptyValue =
+      parseCSSComponentValue<CSSWideKeyword, CSSLength, CSSPercentage>("");
+  EXPECT_EQ(emptyValue.type(), CSSValueType::CSSWideKeyword);
+  EXPECT_EQ(emptyValue.getCSSWideKeyword(), CSSWideKeyword::Unset);
+
+  auto autoValue = parseCSSComponentValue<
+      CSSWideKeyword,
+      CSSKeyword,
+      CSSLength,
+      CSSPercentage>("auto");
+  EXPECT_EQ(autoValue.type(), CSSValueType::Keyword);
+  EXPECT_EQ(autoValue.getKeyword(), CSSKeyword::Auto);
+
+  auto pxValue =
+      parseCSSComponentValue<CSSWideKeyword, CSSLength, CSSPercentage>("20px");
+  EXPECT_EQ(pxValue.type(), CSSValueType::Length);
+  EXPECT_EQ(pxValue.getLength().value, 20.0f);
+  EXPECT_EQ(pxValue.getLength().unit, CSSLengthUnit::Px);
+
+  auto pctValue =
+      parseCSSComponentValue<CSSWideKeyword, CSSLength, CSSPercentage>("-40%");
+  EXPECT_EQ(pctValue.type(), CSSValueType::Percentage);
+  EXPECT_EQ(pctValue.getPercentage().value, -40.0f);
+}
+
+TEST(CSSParser, number_values) {
+  auto emptyValue = parseCSSComponentValue<CSSWideKeyword, CSSNumber>("");
+  EXPECT_EQ(emptyValue.type(), CSSValueType::CSSWideKeyword);
+  EXPECT_EQ(emptyValue.getCSSWideKeyword(), CSSWideKeyword::Unset);
+
+  auto inheritValue =
+      parseCSSComponentValue<CSSWideKeyword, CSSNumber>("inherit");
+  EXPECT_EQ(inheritValue.type(), CSSValueType::CSSWideKeyword);
+  EXPECT_EQ(inheritValue.getCSSWideKeyword(), CSSWideKeyword::Inherit);
+
+  auto pxValue =
+      parseCSSComponentValue<CSSWideKeyword, CSSKeyword, CSSNumber>("20px");
+  EXPECT_EQ(pxValue.type(), CSSValueType::CSSWideKeyword);
+  EXPECT_EQ(pxValue.getCSSWideKeyword(), CSSWideKeyword::Unset);
+
+  auto numberValue =
+      parseCSSComponentValue<CSSWideKeyword, CSSKeyword, CSSNumber>("123.456");
+  EXPECT_EQ(numberValue.type(), CSSValueType::Number);
+  EXPECT_EQ(numberValue.getNumber().value, 123.456f);
+
+  auto unitlessZeroValue =
+      parseCSSComponentValue<CSSWideKeyword, CSSLength, CSSNumber>("0");
+  EXPECT_EQ(unitlessZeroValue.type(), CSSValueType::Number);
+  EXPECT_EQ(unitlessZeroValue.getNumber().value, 0.0f);
+}
+
+TEST(CSSParser, ratio_values) {
+  auto emptyValue = parseCSSComponentValue<CSSWideKeyword, CSSRatio>("");
+  EXPECT_EQ(emptyValue.type(), CSSValueType::CSSWideKeyword);
+  EXPECT_EQ(emptyValue.getCSSWideKeyword(), CSSWideKeyword::Unset);
+
+  auto validRatio = parseCSSComponentValue<CSSWideKeyword, CSSRatio>("16/9");
+  EXPECT_EQ(validRatio.type(), CSSValueType::Ratio);
+  EXPECT_EQ(validRatio.getRatio().numerator, 16.0f);
+  EXPECT_EQ(validRatio.getRatio().denominator, 9.0f);
+
+  auto validRatioWithWhitespace =
+      parseCSSComponentValue<CSSWideKeyword, CSSRatio>("16 / 9");
+  EXPECT_EQ(validRatioWithWhitespace.type(), CSSValueType::Ratio);
+  EXPECT_EQ(validRatioWithWhitespace.getRatio().numerator, 16.0f);
+  EXPECT_EQ(validRatioWithWhitespace.getRatio().denominator, 9.0f);
+
+  auto singleNumberRatio =
+      parseCSSComponentValue<CSSWideKeyword, CSSRatio>("16");
+  EXPECT_EQ(singleNumberRatio.type(), CSSValueType::Ratio);
+  EXPECT_EQ(singleNumberRatio.getRatio().numerator, 16.0f);
+  EXPECT_EQ(singleNumberRatio.getRatio().denominator, 1.0f);
+
+  auto fractionalNumber =
+      parseCSSComponentValue<CSSWideKeyword, CSSRatio>("16.5");
+  EXPECT_EQ(fractionalNumber.type(), CSSValueType::Ratio);
+  EXPECT_EQ(fractionalNumber.getRatio().numerator, 16.5f);
+  EXPECT_EQ(fractionalNumber.getRatio().denominator, 1.0f);
+
+  auto negativeNumber = parseCSSComponentValue<CSSWideKeyword, CSSRatio>("-16");
+  EXPECT_EQ(negativeNumber.type(), CSSValueType::CSSWideKeyword);
+  EXPECT_EQ(negativeNumber.getCSSWideKeyword(), CSSWideKeyword::Unset);
+
+  auto missingDenominator =
+      parseCSSComponentValue<CSSWideKeyword, CSSRatio>("16/");
+  EXPECT_EQ(missingDenominator.type(), CSSValueType::CSSWideKeyword);
+  EXPECT_EQ(missingDenominator.getCSSWideKeyword(), CSSWideKeyword::Unset);
+
+  auto negativeNumerator =
+      parseCSSComponentValue<CSSWideKeyword, CSSRatio>("-16/9");
+  EXPECT_EQ(negativeNumerator.type(), CSSValueType::CSSWideKeyword);
+  EXPECT_EQ(negativeNumerator.getCSSWideKeyword(), CSSWideKeyword::Unset);
+
+  auto negativeDenominator =
+      parseCSSComponentValue<CSSWideKeyword, CSSRatio>("16/-9");
+  EXPECT_EQ(negativeDenominator.type(), CSSValueType::CSSWideKeyword);
+  EXPECT_EQ(negativeDenominator.getCSSWideKeyword(), CSSWideKeyword::Unset);
+
+  auto fractionalNumerator =
+      parseCSSComponentValue<CSSWideKeyword, CSSRatio>("16.5/9");
+  EXPECT_EQ(fractionalNumerator.type(), CSSValueType::Ratio);
+  EXPECT_EQ(fractionalNumerator.getRatio().numerator, 16.5f);
+  EXPECT_EQ(fractionalNumerator.getRatio().denominator, 9.0f);
+
+  auto fractionalDenominator =
+      parseCSSComponentValue<CSSWideKeyword, CSSRatio>("16/9.5");
+  EXPECT_EQ(fractionalDenominator.type(), CSSValueType::Ratio);
+  EXPECT_EQ(fractionalDenominator.getRatio().numerator, 16.0f);
+  EXPECT_EQ(fractionalDenominator.getRatio().denominator, 9.5f);
+
+  auto degenerateRatio = parseCSSComponentValue<CSSWideKeyword, CSSRatio>("0");
+  EXPECT_EQ(degenerateRatio.type(), CSSValueType::CSSWideKeyword);
+  EXPECT_EQ(degenerateRatio.getCSSWideKeyword(), CSSWideKeyword::Unset);
+}
+
+TEST(CSSParser, number_ratio_values) {
+  auto emptyValue =
+      parseCSSComponentValue<CSSWideKeyword, CSSNumber, CSSRatio>("");
+  EXPECT_EQ(emptyValue.type(), CSSValueType::CSSWideKeyword);
+  EXPECT_EQ(emptyValue.getCSSWideKeyword(), CSSWideKeyword::Unset);
+
+  auto validRatio =
+      parseCSSComponentValue<CSSWideKeyword, CSSNumber, CSSRatio>("16/9");
+  EXPECT_EQ(validRatio.type(), CSSValueType::Ratio);
+  EXPECT_EQ(validRatio.getRatio().numerator, 16.0f);
+  EXPECT_EQ(validRatio.getRatio().denominator, 9.0f);
+
+  auto validRatioWithWhitespace =
+      parseCSSComponentValue<CSSWideKeyword, CSSNumber, CSSRatio>("16 / 9");
+  EXPECT_EQ(validRatioWithWhitespace.type(), CSSValueType::Ratio);
+  EXPECT_EQ(validRatioWithWhitespace.getRatio().numerator, 16.0f);
+  EXPECT_EQ(validRatioWithWhitespace.getRatio().denominator, 9.0f);
+
+  auto singleNumberRatio =
+      parseCSSComponentValue<CSSWideKeyword, CSSNumber, CSSRatio>("16");
+  EXPECT_EQ(singleNumberRatio.type(), CSSValueType::Ratio);
+  EXPECT_EQ(singleNumberRatio.getRatio().numerator, 16.0f);
+  EXPECT_EQ(singleNumberRatio.getRatio().denominator, 1.0f);
+
+  auto fractionalNumber =
+      parseCSSComponentValue<CSSWideKeyword, CSSNumber, CSSRatio>("16.5");
+  EXPECT_EQ(fractionalNumber.type(), CSSValueType::Ratio);
+  EXPECT_EQ(fractionalNumber.getRatio().numerator, 16.5f);
+  EXPECT_EQ(singleNumberRatio.getRatio().denominator, 1.0f);
+
+  auto negativeNumber =
+      parseCSSComponentValue<CSSWideKeyword, CSSNumber, CSSRatio>("-16");
+  EXPECT_EQ(negativeNumber.type(), CSSValueType::Number);
+  EXPECT_EQ(negativeNumber.getNumber().value, -16.0f);
+
+  auto missingDenominator =
+      parseCSSComponentValue<CSSWideKeyword, CSSNumber, CSSRatio>("16/");
+  EXPECT_EQ(missingDenominator.type(), CSSValueType::CSSWideKeyword);
+  EXPECT_EQ(missingDenominator.getCSSWideKeyword(), CSSWideKeyword::Unset);
+
+  auto negativeNumerator =
+      parseCSSComponentValue<CSSWideKeyword, CSSNumber, CSSRatio>("-16/9");
+  EXPECT_EQ(negativeNumerator.type(), CSSValueType::CSSWideKeyword);
+  EXPECT_EQ(negativeNumerator.getCSSWideKeyword(), CSSWideKeyword::Unset);
+
+  auto negativeDenominator =
+      parseCSSComponentValue<CSSWideKeyword, CSSNumber, CSSRatio>("16/-9");
+  EXPECT_EQ(negativeDenominator.type(), CSSValueType::CSSWideKeyword);
+  EXPECT_EQ(negativeDenominator.getCSSWideKeyword(), CSSWideKeyword::Unset);
+
+  auto fractionalNumerator =
+      parseCSSComponentValue<CSSWideKeyword, CSSNumber, CSSRatio>("16.5/9");
+  EXPECT_EQ(fractionalNumerator.type(), CSSValueType::Ratio);
+  EXPECT_EQ(fractionalNumerator.getRatio().numerator, 16.5f);
+  EXPECT_EQ(fractionalNumerator.getRatio().denominator, 9.0f);
+
+  auto fractionalDenominator =
+      parseCSSComponentValue<CSSWideKeyword, CSSNumber, CSSRatio>("16/9.5");
+  EXPECT_EQ(fractionalDenominator.type(), CSSValueType::Ratio);
+  EXPECT_EQ(fractionalDenominator.getRatio().numerator, 16.0f);
+  EXPECT_EQ(fractionalDenominator.getRatio().denominator, 9.5f);
+
+  auto degenerateRatio =
+      parseCSSComponentValue<CSSWideKeyword, CSSNumber, CSSRatio>("0");
+  EXPECT_EQ(degenerateRatio.type(), CSSValueType::Number);
+  EXPECT_EQ(degenerateRatio.getNumber().value, 0.0f);
+}
+
+TEST(CSSParser, parse_prop) {
+  auto emptyValue = parseCSSProp<CSSProp::Width>("");
+  EXPECT_EQ(emptyValue.type(), CSSValueType::CSSWideKeyword);
+  EXPECT_EQ(emptyValue.getCSSWideKeyword(), CSSWideKeyword::Unset);
+
+  auto numberWidthValue = parseCSSProp<CSSProp::Width>("50px");
+  EXPECT_EQ(numberWidthValue.type(), CSSValueType::Length);
+  EXPECT_EQ(numberWidthValue.getLength().value, 50.0f);
+  EXPECT_EQ(numberWidthValue.getLength().unit, CSSLengthUnit::Px);
+
+  auto percentWidthValue = parseCSSProp<CSSProp::Width>("50%");
+  EXPECT_EQ(percentWidthValue.type(), CSSValueType::Percentage);
+  EXPECT_EQ(percentWidthValue.getPercentage().value, 50.0f);
+
+  auto autoWidthValue = parseCSSProp<CSSProp::Width>("auto");
+  EXPECT_EQ(autoWidthValue.type(), CSSValueType::Keyword);
+  EXPECT_EQ(
+      autoWidthValue.getKeyword(), CSSAllowedKeywords<CSSProp::Width>::Auto);
+
+  auto invalidWidthValue = parseCSSProp<CSSProp::Width>("50");
+  EXPECT_EQ(invalidWidthValue.type(), CSSValueType::CSSWideKeyword);
+  EXPECT_EQ(invalidWidthValue.getCSSWideKeyword(), CSSWideKeyword::Unset);
+
+  auto invalidKeywordValue = parseCSSProp<CSSProp::Width>("flex-start");
+  EXPECT_EQ(invalidKeywordValue.type(), CSSValueType::CSSWideKeyword);
+  EXPECT_EQ(invalidKeywordValue.getCSSWideKeyword(), CSSWideKeyword::Unset);
+
+  auto keywordlessValue = parseCSSProp<CSSProp::BorderRadius>("50px");
+  EXPECT_EQ(keywordlessValue.type(), CSSValueType::Length);
+  EXPECT_EQ(keywordlessValue.getLength().value, 50.0f);
+  EXPECT_EQ(keywordlessValue.getLength().unit, CSSLengthUnit::Px);
+}
+
+TEST(CSSParser, parse_keyword_prop_constexpr) {
+  constexpr auto rowValue = parseCSSProp<CSSProp::FlexDirection>("row");
+  EXPECT_EQ(rowValue.type(), CSSValueType::Keyword);
+  EXPECT_EQ(
+      rowValue.getKeyword(), CSSAllowedKeywords<CSSProp::FlexDirection>::Row);
+}
+
+TEST(CSSParser, parse_length_prop_constexpr) {
+  constexpr auto pxValue = parseCSSProp<CSSProp::BorderWidth>("2px");
+  EXPECT_EQ(pxValue.type(), CSSValueType::Length);
+  EXPECT_EQ(pxValue.getLength().value, 2.0f);
+  EXPECT_EQ(pxValue.getLength().unit, CSSLengthUnit::Px);
+}
+
+} // namespace facebook::react

package/ReactCommon/react/renderer/css/tests/CSSTokenizerTest.cpp

@@ -0,0 +1,154 @@
+/*
+ * 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.
+ */
+
+#include <gtest/gtest.h>
+#include <react/renderer/css/CSSTokenizer.h>
+
+namespace facebook::react {
+
+static void expectTokens(
+    std::string_view characters,
+    std::initializer_list<CSSToken> expectedTokens) {
+  CSSTokenizer tokenizer{characters};
+
+  for (const auto& expectedToken : expectedTokens) {
+    auto nextToken = tokenizer.next();
+    EXPECT_EQ(nextToken.type(), expectedToken.type());
+    EXPECT_EQ(nextToken.stringValue(), expectedToken.stringValue());
+    EXPECT_EQ(nextToken.numericValue(), expectedToken.numericValue());
+    EXPECT_EQ(nextToken.unit(), expectedToken.unit());
+    EXPECT_EQ(nextToken, expectedToken);
+  }
+}
+
+TEST(CSSTokenizer, eof_values) {
+  expectTokens("", {CSSToken{CSSTokenType::EndOfFile}});
+}
+
+TEST(CSSTokenizer, whitespace_values) {
+  expectTokens(
+      " ",
+      {CSSToken{CSSTokenType::WhiteSpace}, CSSToken{CSSTokenType::EndOfFile}});
+  expectTokens(
+      " \t",
+      {CSSToken{CSSTokenType::WhiteSpace}, CSSToken{CSSTokenType::EndOfFile}});
+  expectTokens(
+      "\n   \t",
+      {CSSToken{CSSTokenType::WhiteSpace}, CSSToken{CSSTokenType::EndOfFile}});
+}
+
+TEST(CSSTokenizer, ident_values) {
+  expectTokens(
+      "auto",
+      {CSSToken{CSSTokenType::Ident, "auto"},
+       CSSToken{CSSTokenType::EndOfFile}});
+
+  expectTokens(
+      "inset auto left",
+      {CSSToken{CSSTokenType::Ident, "inset"},
+       CSSToken{CSSTokenType::WhiteSpace},
+       CSSToken{CSSTokenType::Ident, "auto"},
+       CSSToken{CSSTokenType::WhiteSpace},
+       CSSToken{CSSTokenType::Ident, "left"},
+       CSSToken{CSSTokenType::EndOfFile}});
+}
+
+TEST(CSSTokenizer, number_values) {
+  expectTokens(
+      "12",
+      {CSSToken{CSSTokenType::Number, 12.0f},
+       CSSToken{CSSTokenType::EndOfFile}});
+
+  expectTokens(
+      "-5",
+      {CSSToken{CSSTokenType::Number, -5.0f},
+       CSSToken{CSSTokenType::EndOfFile}});
+
+  expectTokens(
+      "123.0",
+      {CSSToken{CSSTokenType::Number, 123.0f},
+       CSSToken{CSSTokenType::EndOfFile}});
+
+  expectTokens(
+      "4.2E-1",
+      {CSSToken{CSSTokenType::Number, 4.2e-1},
+       CSSToken{CSSTokenType::EndOfFile}});
+
+  expectTokens(
+      "6e-10",
+      {CSSToken{CSSTokenType::Number, 6e-10f},
+       CSSToken{CSSTokenType::EndOfFile}});
+
+  expectTokens(
+      "+81.07e+0",
+      {CSSToken{CSSTokenType::Number, +81.07e+0},
+       CSSToken{CSSTokenType::EndOfFile}});
+}
+
+TEST(CSSTokenizer, dimension_values) {
+  expectTokens(
+      "12px",
+      {CSSToken{CSSTokenType::Dimension, 12.0f, "px"},
+       CSSToken{CSSTokenType::EndOfFile}});
+
+  expectTokens(
+      "463.2abc",
+      {CSSToken{CSSTokenType::Dimension, 463.2, "abc"},
+       CSSToken{CSSTokenType::EndOfFile}});
+}
+
+TEST(CSSTokenizer, percent_values) {
+  expectTokens(
+      "12%",
+      {CSSToken{CSSTokenType::Percentage, 12.0f},
+       CSSToken{CSSTokenType::EndOfFile}});
+
+  expectTokens(
+      "-28.5%",
+      {CSSToken{CSSTokenType::Percentage, -28.5f},
+       CSSToken{CSSTokenType::EndOfFile}});
+}
+
+TEST(CSSTokenizer, mixed_values) {
+  expectTokens(
+      "12px   -100vh",
+      {CSSToken{CSSTokenType::Dimension, 12.0f, "px"},
+       CSSToken{CSSTokenType::WhiteSpace},
+       CSSToken{CSSTokenType::Dimension, -100.0f, "vh"},
+       CSSToken{CSSTokenType::EndOfFile}});
+}
+
+TEST(CSSTokenizer, ratio_values) {
+  expectTokens(
+      "16 / 9",
+      {CSSToken{CSSTokenType::Number, 16.0f},
+       CSSToken{CSSTokenType::WhiteSpace},
+       CSSToken{CSSTokenType::Delim, "/"},
+       CSSToken{CSSTokenType::WhiteSpace},
+       CSSToken{CSSTokenType::Number, 9.0f},
+       CSSToken{CSSTokenType::EndOfFile}});
+}
+
+TEST(CSSTokenizer, invalid_values) {
+  expectTokens(
+      "100*",
+      {CSSToken{CSSTokenType::Number, 100.0f},
+       CSSToken{CSSTokenType::Delim, "*"},
+       CSSToken{CSSTokenType::EndOfFile}});
+
+  expectTokens(
+      "+",
+      {CSSToken{CSSTokenType::Delim, "+"}, CSSToken{CSSTokenType::EndOfFile}});
+
+  expectTokens(
+      "(%",
+      {CSSToken{CSSTokenType::Delim, "("},
+       CSSToken{CSSTokenType::Delim, "%"},
+       CSSToken{CSSTokenType::EndOfFile}});
+}
+
+} // namespace facebook::react

package/ReactCommon/react/renderer/debug/CMakeLists.txt

@@ -12,7 +12,6 @@ add_compile_options(
         -std=c++20
         -Wall
         -Wpedantic
-        -Wno-gnu-zero-variadic-macro-arguments
         -DLOG_TAG=\"Fabric\")
 
 file(GLOB react_render_debug_SRC CONFIGURE_DEPENDS *.cpp)

package/ReactCommon/react/renderer/debug/React-rendererdebug.podspec

@@ -16,8 +16,9 @@ else
   source[:tag] = "v#{version}"
 end
 
-folly_compiler_flags = '-DFOLLY_NO_CONFIG -DFOLLY_MOBILE=1 -DFOLLY_USE_LIBCPP=1 -DFOLLY_CFG_NO_COROUTINES=1 -Wno-comma -Wno-shorten-64-to-32'
-folly_version = '2022.05.16.00'
+folly_config = get_folly_config()
+folly_compiler_flags = folly_config[:compiler_flags]
+folly_version = folly_config[:version]
 
 header_search_paths = [
     "\"$(PODS_ROOT)/RCT-Folly\"",
@@ -56,6 +57,6 @@ Pod::Spec.new do |s|
 
   s.dependency "RCT-Folly", folly_version
   s.dependency "DoubleConversion"
-  s.dependency 'fmt' , '~> 6.2.1'
+  s.dependency "fmt", "9.1.0"
   add_dependency(s, "React-debug")
 end

package/ReactCommon/react/renderer/debug/flags.h

@@ -46,7 +46,3 @@
 // are logged to console before the `assert` is fired. More useful on Android vs
 // other platforms.
 //#define STUB_VIEW_TREE_VERBOSE 1
-
-// Verbose logging for certain Yoga-related things in the RN codebase (not Yoga
-// codebase). Useful for debugging layout.
-//#define RN_DEBUG_YOGA_LOGGER 1

package/ReactCommon/react/renderer/element/CMakeLists.txt

@@ -12,7 +12,6 @@ add_compile_options(
         -std=c++20
         -Wall
         -Wpedantic
-        -Wno-gnu-zero-variadic-macro-arguments
         -DLOG_TAG=\"Fabric\")
 
 file(GLOB react_render_element_SRC CONFIGURE_DEPENDS *.cpp)

package/ReactCommon/react/renderer/graphics/CMakeLists.txt

@@ -12,7 +12,6 @@ add_compile_options(
         -std=c++20
         -Wall
         -Wpedantic
-        -Wno-gnu-zero-variadic-macro-arguments
         -DLOG_TAG=\"Fabric\")
 
 file(GLOB react_render_graphics_SRC CONFIGURE_DEPENDS *.cpp)

package/ReactCommon/react/renderer/graphics/Color.h

@@ -25,13 +25,15 @@ namespace facebook::react {
  */
 class SharedColor {
  public:
-  static const Color UndefinedColor = HostPlatformColor::UndefinedColor;
-
-  SharedColor() : color_(UndefinedColor) {}
+  SharedColor() : color_(HostPlatformColor::UndefinedColor) {}
 
   SharedColor(Color color) : color_(color) {}
 
-  Color operator*() const {
+  Color& operator*() {
+    return color_;
+  }
+
+  const Color& operator*() const {
     return color_;
   }
 
@@ -44,7 +46,7 @@ class SharedColor {
   }
 
   operator bool() const {
-    return color_ != UndefinedColor;
+    return color_ != HostPlatformColor::UndefinedColor;
   }
 
  private:
@@ -63,7 +65,7 @@ SharedColor whiteColor();
 
 template <>
 struct std::hash<facebook::react::SharedColor> {
-  size_t operator()(facebook::react::SharedColor color) const {
-    return std::hash<decltype(*color)>{}(*color);
+  size_t operator()(const facebook::react::SharedColor& color) const {
+    return std::hash<facebook::react::Color>{}(*color);
   }
 };

package/ReactCommon/react/renderer/graphics/React-graphics.podspec

@@ -16,8 +16,10 @@ else
   source[:tag] = "v#{version}"
 end
 
-folly_compiler_flags = '-DFOLLY_NO_CONFIG -DFOLLY_MOBILE=1 -DFOLLY_USE_LIBCPP=1 -DFOLLY_CFG_NO_COROUTINES=1 -Wno-comma -Wno-shorten-64-to-32'
-folly_version = '2022.05.16.00'
+folly_config = get_folly_config()
+folly_compiler_flags = folly_config[:compiler_flags]
+folly_version = folly_config[:version]
+
 boost_compiler_flags = '-Wno-documentation'
 
 Pod::Spec.new do |s|
@@ -26,6 +28,8 @@ Pod::Spec.new do |s|
     "\"$(PODS_ROOT)/boost\"",
     "\"$(PODS_TARGET_SRCROOT)/../../../\"",
     "\"$(PODS_ROOT)/RCT-Folly\"",
+    "\"$(PODS_ROOT)/DoubleConversion\"",
+    "\"$(PODS_ROOT)/fmt/include\""
   ]
 
   s.name                   = "React-graphics"
@@ -40,7 +44,8 @@ Pod::Spec.new do |s|
   s.source_files           = source_files
   s.exclude_files          = "tests",
                              "platform/android",
-                             "platform/cxx"
+                             "platform/cxx",
+                             "platform/windows",
   s.header_dir             = "react/renderer/graphics"
 
   if ENV['USE_FRAMEWORKS']
@@ -58,4 +63,6 @@ Pod::Spec.new do |s|
   s.dependency "RCT-Folly/Fabric", folly_version
   s.dependency "React-Core/Default", version
   s.dependency "React-utils"
+  s.dependency "DoubleConversion"
+  s.dependency "fmt", "9.1.0"
 end

package/ReactCommon/react/renderer/graphics/fromRawValueShared.h

@@ -0,0 +1,50 @@
+/*
+ * 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.
+ */
+
+#include <react/debug/react_native_expect.h>
+#include <react/renderer/core/RawValue.h>
+#include <react/renderer/graphics/Color.h>
+#include <react/utils/ContextContainer.h>
+
+#pragma once
+
+namespace facebook::react {
+using parsePlatformColorFn =
+    SharedColor (*)(const ContextContainer&, int32_t, const RawValue&);
+
+inline void fromRawValueShared(
+    const ContextContainer& contextContainer,
+    int32_t surfaceId,
+    const RawValue& value,
+    SharedColor& result,
+    parsePlatformColorFn parsePlatformColor) {
+  ColorComponents colorComponents = {0, 0, 0, 0};
+
+  if (value.hasType<int>()) {
+    auto argb = (int64_t)value;
+    auto ratio = 255.f;
+    colorComponents.alpha = ((argb >> 24) & 0xFF) / ratio;
+    colorComponents.red = ((argb >> 16) & 0xFF) / ratio;
+    colorComponents.green = ((argb >> 8) & 0xFF) / ratio;
+    colorComponents.blue = (argb & 0xFF) / ratio;
+
+    result = colorFromComponents(colorComponents);
+  } else if (value.hasType<std::vector<float>>()) {
+    auto items = (std::vector<float>)value;
+    auto length = items.size();
+    react_native_expect(length == 3 || length == 4);
+    colorComponents.red = items.at(0);
+    colorComponents.green = items.at(1);
+    colorComponents.blue = items.at(2);
+    colorComponents.alpha = length == 4 ? items.at(3) : 1.0f;
+
+    result = colorFromComponents(colorComponents);
+  } else {
+    result = parsePlatformColor(contextContainer, surfaceId, value);
+  }
+}
+} // namespace facebook::react