Fabric: Definition of the rest <View> props on C++ side

Summary:
Just definition; we don't have an implementation on the native view layer yet.
And we don't have `transform` prop yet (because it's quite complex).

Reviewed By: fkgozali

Differential Revision: D8344058

fbshipit-source-id: 3b7b41480be8295cbc90b95ebe8562e52c6f81d7

ReactCommon/fabric/view/ViewProps.cpp

@@ -10,6 +10,7 @@
 #include <fabric/core/propsConversions.h>
 #include <fabric/debug/debugStringConvertibleUtils.h>
 #include <fabric/graphics/conversions.h>
+#include <fabric/view/conversions.h>
 
 namespace facebook {
 namespace react {
@@ -20,10 +21,22 @@ ViewProps::ViewProps(const YGStyle &yogaStyle):
 ViewProps::ViewProps(const ViewProps &sourceProps, const RawProps &rawProps):
   Props(sourceProps, rawProps),
   YogaStylableProps(sourceProps, rawProps),
-  zIndex(convertRawProp(rawProps, "zIndex", sourceProps.zIndex)),
   opacity(convertRawProp(rawProps, "opacity", sourceProps.opacity)),
-  foregroundColor(convertRawProp(rawProps, "color", sourceProps.foregroundColor)),
-  backgroundColor(convertRawProp(rawProps, "backgroundColor", sourceProps.backgroundColor)) {};
+  foregroundColor(convertRawProp(rawProps, "foregroundColor", sourceProps.foregroundColor)),
+  backgroundColor(convertRawProp(rawProps, "backgroundColor", sourceProps.backgroundColor)),
+  borderWidth(convertRawProp(rawProps, "borderWidth", sourceProps.borderWidth)),
+  borderRadus(convertRawProp(rawProps, "borderRadus", sourceProps.borderRadus)),
+  borderColor(convertRawProp(rawProps, "borderColor", sourceProps.borderColor)),
+  borderStyle(convertRawProp(rawProps, "borderStyle", sourceProps.borderStyle)),
+  shadowColor(convertRawProp(rawProps, "shadowColor", sourceProps.shadowColor)),
+  shadowOffset(convertRawProp(rawProps, "shadowOffset", sourceProps.shadowOffset)),
+  shadowOpacity(convertRawProp(rawProps, "shadowOpacity", sourceProps.shadowOpacity)),
+  shadowRadius(convertRawProp(rawProps, "shadowRadius", sourceProps.shadowRadius)),
+  backfaceVisibility(convertRawProp(rawProps, "backfaceVisibility", sourceProps.backfaceVisibility)),
+  shouldRasterize(convertRawProp(rawProps, "shouldRasterize", sourceProps.shouldRasterize)),
+  zIndex(convertRawProp(rawProps, "zIndex", sourceProps.zIndex)),
+  pointerEvents(convertRawProp(rawProps, "pointerEvents", sourceProps.pointerEvents)),
+  hitSlop(convertRawProp(rawProps, "hitSlop", sourceProps.hitSlop)) {};
 
 #pragma mark - DebugStringConvertible
 

ReactCommon/fabric/view/ViewProps.h

@@ -10,8 +10,9 @@
 #include <fabric/core/Props.h>
 #include <fabric/graphics/Geometry.h>
 #include <fabric/graphics/Color.h>
-#include <fabric/view/YogaStylableProps.h>
 #include <fabric/view/AccessibilityProps.h>
+#include <fabric/view/primitives.h>
+#include <fabric/view/YogaStylableProps.h>
 
 namespace facebook {
 namespace react {
@@ -33,14 +34,31 @@ public:
 
 #pragma mark - Props
 
-  const int zIndex {0};
+  // Color
   const Float opacity {1};
-
   const SharedColor foregroundColor {nullptr};
   const SharedColor backgroundColor {nullptr};
 
+  // Borders
+  const EdgeInsets borderWidth {};
+  const CornerInsets borderRadus {};
+  const SharedColor borderColor {};
+  const BorderStyle borderStyle {};
+
+  // Shadow
   const SharedColor shadowColor {nullptr};
-  const Point shadowOffset {};
+  const Size shadowOffset {};
+  const Float shadowOpacity {};
+  const Float shadowRadius {};
+
+  // Transform
+  const bool backfaceVisibility {false};
+  const bool shouldRasterize {false};
+  const int zIndex {0};
+
+  // Events
+  const PointerEventsMode pointerEvents {};
+  const EdgeInsets hitSlop {};
 
 #pragma mark - DebugStringConvertible
 

ReactCommon/fabric/view/conversions.h

@@ -9,6 +9,7 @@
 
 #include <fabric/core/LayoutMetrics.h>
 #include <fabric/graphics/Geometry.h>
+#include <fabric/view/primitives.h>
 #include <folly/dynamic.h>
 #include <folly/Conv.h>
 #include <yoga/Yoga.h>
@@ -226,6 +227,25 @@ inline void fromDynamic(const folly::dynamic &value, YGFloatOptional &result) {
   abort();
 }
 
+inline void fromDynamic(const folly::dynamic &value, PointerEventsMode &result) {
+  assert(value.isString());
+  auto stringValue = value.asString();
+  if (stringValue == "auto") { result = PointerEventsMode::Auto; return; }
+  if (stringValue == "none") { result = PointerEventsMode::None; return; }
+  if (stringValue == "box-none") { result = PointerEventsMode::BoxNone; return; }
+  if (stringValue == "box-only") { result = PointerEventsMode::BoxOnly; return; }
+  abort();
+}
+
+inline void fromDynamic(const folly::dynamic &value, BorderStyle &result) {
+  assert(value.isString());
+  auto stringValue = value.asString();
+  if (stringValue == "solid") { result = BorderStyle::Solid; return; }
+  if (stringValue == "dotted") { result = BorderStyle::Dotted; return; }
+  if (stringValue == "dashed") { result = BorderStyle::Dashed; return; }
+  abort();
+}
+
 inline std::string toString(const std::array<float, YGDimensionCount> &dimensions) {
   return "{" + folly::to<std::string>(dimensions[0]) + ", " + folly::to<std::string>(dimensions[1]) + "}";
 }

ReactCommon/fabric/view/primitives.h

@@ -0,0 +1,29 @@
+/**
+ * Copyright (c) 2015-present, Facebook, Inc.
+ *
+ * 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 <cmath>
+
+namespace facebook {
+namespace react {
+
+enum class PointerEventsMode {
+  Auto,
+  None,
+  BoxNone,
+  BoxOnly
+};
+
+enum class BorderStyle {
+  Solid,
+  Dotted,
+  Dashed
+};
+
+} // namespace react
+} // namespace facebook