Handle "transparent" color ident

Summary:
`transparent` is specced as a special `<named-color>` outside the table the others were derived from. Let's add it, since it is supported today by `normalizeColor`.

https://www.w3.org/TR/css-color-4/#named-colors

Changelog: [Internal]

Differential Revision: D68246770

packages/react-native/ReactCommon/react/renderer/css/CSSColorUtils.h

@@ -12,6 +12,7 @@
 #include <optional>
 
 namespace facebook::react {
+
 // https://www.w3.org/TR/css-color-4/#named-colors
 template <typename CSSValueT>
 constexpr std::optional<CSSValueT> parseCSSNamedColor(std::string_view name) {
@@ -298,6 +299,8 @@ constexpr std::optional<CSSValueT> parseCSSNamedColor(std::string_view name) {
       return CSSValueT::color(216, 191, 216, 255);
     case fnv1a("tomato"):
       return CSSValueT::color(255, 99, 71, 255);
+    case fnv1a("transparent"):
+      return CSSValueT::color(0, 0, 0, 0);
     case fnv1a("turquoise"):
       return CSSValueT::color(64, 224, 208, 255);
     case fnv1a("violet"):

packages/react-native/ReactCommon/react/renderer/css/CSSValue.h

@@ -82,6 +82,10 @@ struct CSSAngle {
   float degrees{};
 };
 
+/**
+ * Representation of CSS <color> data type
+ * https://www.w3.org/TR/css-color-5/#typedef-color
+ */
 struct CSSColor {
   uint8_t r{};
   uint8_t g{};

packages/react-native/ReactCommon/react/renderer/css/tests/CSSValueParserTest.cpp

@@ -415,5 +415,14 @@ TEST(CSSValueParser, named_colors) {
   EXPECT_EQ(namedColorMixedCaseTestValue.getColor().g, 255);
   EXPECT_EQ(namedColorMixedCaseTestValue.getColor().b, 127);
   EXPECT_EQ(namedColorMixedCaseTestValue.getColor().a, 255);
+
+  auto transparentColor =
+      parseCSSValue<CSSWideKeyword, CSSColor>("transparent");
+  EXPECT_EQ(transparentColor.type(), CSSValueType::Color);
+  EXPECT_EQ(transparentColor.getColor().r, 0);
+  EXPECT_EQ(transparentColor.getColor().g, 0);
+  EXPECT_EQ(transparentColor.getColor().b, 0);
+  EXPECT_EQ(transparentColor.getColor().a, 0);
 }
+
 } // namespace facebook::react