Add equality operators to CSS data types (#48989)

Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/48989

tsia

Also added a quick helper to CSSColor used later.

Changelog: [Internal]

Reviewed By: joevilches

Differential Revision: D68741768

fbshipit-source-id: e0b4c75c15891e4957c7e05a7a89820c1bea72c3

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

@@ -20,6 +20,8 @@ namespace facebook::react {
  */
 struct CSSAngle {
   float degrees{};
+
+  constexpr bool operator==(const CSSAngle& rhs) const = default;
 };
 
 template <>

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

@@ -25,6 +25,12 @@ struct CSSColor {
   uint8_t g{};
   uint8_t b{};
   uint8_t a{};
+
+  constexpr bool operator==(const CSSColor& rhs) const = default;
+
+  static constexpr CSSColor black() {
+    return {0, 0, 0, 255};
+  }
 };
 
 template <>

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

@@ -73,10 +73,11 @@ concept CSSValidDataTypeParser = CSSFunctionBlockSink<T, ReturnT> ||
     CSSSimplePreservedTokenSink<T, ReturnT>;
 
 /**
- * Concrete representation for a CSS data type, or keywords
+ * Concrete representation for a CSS data type
  */
 template <typename T>
 concept CSSDataType =
-    CSSValidDataTypeParser<CSSDataTypeParser<T>, std::optional<T>>;
+    CSSValidDataTypeParser<CSSDataTypeParser<T>, std::optional<T>> &&
+    std::equality_comparable<T>;
 
 } // namespace facebook::react

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

@@ -21,6 +21,8 @@ namespace facebook::react {
 struct CSSLength {
   float value{};
   CSSLengthUnit unit{CSSLengthUnit::Px};
+
+  constexpr bool operator==(const CSSLength& rhs) const = default;
 };
 
 template <>

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

@@ -19,6 +19,8 @@ namespace facebook::react {
  */
 struct CSSNumber {
   float value{};
+
+  constexpr bool operator==(const CSSNumber& rhs) const = default;
 };
 
 template <>

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

@@ -19,6 +19,8 @@ namespace facebook::react {
  */
 struct CSSPercentage {
   float value{};
+
+  constexpr bool operator==(const CSSPercentage& rhs) const = default;
 };
 
 template <>

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

@@ -24,6 +24,8 @@ struct CSSRatio {
   float numerator{};
   float denominator{};
 
+  constexpr bool operator==(const CSSRatio& rhs) const = default;
+
   constexpr bool isDegenerate() const {
     // If either number in the <ratio> is 0 or infinite, it represents a
     // degenerate ratio (and, generally, won’t do anything).