Implement offsetX/offsetY properties on the PointerEvent interface

Summary:
Changelog: [iOS][Internal] - Implement offsetX/offsetY properties on the PointerEvent interface

Simple diff implementing the offsetX/offsetY properties on PointerEvent — thankfully the touch events already kept track of these so it was mostly a matter of forwarding that data to the pointer events.

Reviewed By: lunaleaps

Differential Revision: D37830139

fbshipit-source-id: 77f33a99393350d32cbe449e6a009bdeb2a12d08

Author: vincentriemer

React/Fabric/RCTSurfaceTouchHandler.mm

@@ -258,6 +258,7 @@ static PointerEvent CreatePointerEventFromActiveTouch(ActiveTouch activeTouch, R
   event.pointerType = PointerTypeCStringFromUITouchType(activeTouch.touchType);
   event.clientPoint = touch.pagePoint;
   event.screenPoint = touch.screenPoint;
+  event.offsetPoint = touch.offsetPoint;
 
   CGFloat pointerSize = activeTouch.majorRadius * 2.0;
   if (@available(iOS 13.4, *)) {
@@ -292,6 +293,7 @@ static PointerEvent CreatePointerEventFromIncompleteHoverData(
     UIView *view,
     CGPoint clientLocation,
     CGPoint screenLocation,
+    CGPoint offsetLocation,
     NSTimeInterval timestamp)
 {
   PointerEvent event = {};
@@ -303,6 +305,7 @@ static PointerEvent CreatePointerEventFromIncompleteHoverData(
   event.pointerType = "mouse";
   event.clientPoint = RCTPointFromCGPoint(clientLocation);
   event.screenPoint = RCTPointFromCGPoint(screenLocation);
+  event.offsetPoint = RCTPointFromCGPoint(offsetLocation);
   event.width = 1.0;
   event.height = 1.0;
   event.tiltX = 0;
@@ -690,6 +693,8 @@ - (void)hovering:(UIHoverGestureRecognizer *)recognizer API_AVAILABLE(ios(13.0))
   targetView = FindClosestFabricManagedTouchableView(targetView);
   UIView *prevTargetView = [_currentlyHoveredViews firstObject];
 
+  CGPoint offsetLocation = [recognizer locationInView:targetView];
+
   NSOrderedSet *eventPathViews = GetTouchableViewsInPathToRoot(targetView);
 
   NSTimeInterval timestamp = CACurrentMediaTime();
@@ -701,8 +706,8 @@ - (void)hovering:(UIHoverGestureRecognizer *)recognizer API_AVAILABLE(ios(13.0))
     BOOL shouldEmitOverEvent = IsAnyViewInPathListeningToEvent(eventPathViews, ViewEvents::Offset::PointerOver);
     SharedTouchEventEmitter eventEmitter = GetTouchEmitterFromView(targetView, [recognizer locationInView:targetView]);
     if (shouldEmitOverEvent && eventEmitter != nil) {
-      PointerEvent event =
-          CreatePointerEventFromIncompleteHoverData(targetView, clientLocation, screenLocation, timestamp);
+      PointerEvent event = CreatePointerEventFromIncompleteHoverData(
+          targetView, clientLocation, screenLocation, offsetLocation, timestamp);
       eventEmitter->onPointerOver(event);
     }
   }
@@ -724,8 +729,8 @@ - (void)hovering:(UIHoverGestureRecognizer *)recognizer API_AVAILABLE(ios(13.0))
       SharedTouchEventEmitter eventEmitter =
           GetTouchEmitterFromView(componentView, [recognizer locationInView:componentView]);
       if (eventEmitter != nil) {
-        PointerEvent event =
-            CreatePointerEventFromIncompleteHoverData(componentView, clientLocation, screenLocation, timestamp);
+        PointerEvent event = CreatePointerEventFromIncompleteHoverData(
+            componentView, clientLocation, screenLocation, offsetLocation, timestamp);
         eventEmitter->onPointerEnter(event);
       }
     }
@@ -743,8 +748,8 @@ - (void)hovering:(UIHoverGestureRecognizer *)recognizer API_AVAILABLE(ios(13.0))
   if (hasMoveListenerInEventPath) {
     SharedTouchEventEmitter eventEmitter = GetTouchEmitterFromView(targetView, [recognizer locationInView:targetView]);
     if (eventEmitter != nil) {
-      PointerEvent event =
-          CreatePointerEventFromIncompleteHoverData(targetView, clientLocation, screenLocation, timestamp);
+      PointerEvent event = CreatePointerEventFromIncompleteHoverData(
+          targetView, clientLocation, screenLocation, offsetLocation, timestamp);
       eventEmitter->onPointerMove(event);
     }
   }
@@ -755,8 +760,8 @@ - (void)hovering:(UIHoverGestureRecognizer *)recognizer API_AVAILABLE(ios(13.0))
     SharedTouchEventEmitter eventEmitter =
         GetTouchEmitterFromView(prevTargetView, [recognizer locationInView:prevTargetView]);
     if (shouldEmitOutEvent && eventEmitter != nil) {
-      PointerEvent event =
-          CreatePointerEventFromIncompleteHoverData(prevTargetView, clientLocation, screenLocation, timestamp);
+      PointerEvent event = CreatePointerEventFromIncompleteHoverData(
+          prevTargetView, clientLocation, screenLocation, offsetLocation, timestamp);
       eventEmitter->onPointerOut(event);
     }
   }
@@ -787,8 +792,8 @@ - (void)hovering:(UIHoverGestureRecognizer *)recognizer API_AVAILABLE(ios(13.0))
     SharedTouchEventEmitter eventEmitter =
         GetTouchEmitterFromView(componentView, [recognizer locationInView:componentView]);
     if (eventEmitter != nil) {
-      PointerEvent event =
-          CreatePointerEventFromIncompleteHoverData(componentView, clientLocation, screenLocation, timestamp);
+      PointerEvent event = CreatePointerEventFromIncompleteHoverData(
+          componentView, clientLocation, screenLocation, offsetLocation, timestamp);
       eventEmitter->onPointerLeave(event);
     }
   }

ReactCommon/react/renderer/components/view/PointerEvent.cpp

@@ -25,6 +25,7 @@ std::vector<DebugStringConvertibleObject> getDebugProps(
       {"pointerType", getDebugDescription(pointerEvent.pointerType, options)},
       {"clientPoint", getDebugDescription(pointerEvent.clientPoint, options)},
       {"screenPoint", getDebugDescription(pointerEvent.screenPoint, options)},
+      {"offsetPoint", getDebugDescription(pointerEvent.offsetPoint, options)},
       {"width", getDebugDescription(pointerEvent.width, options)},
       {"height", getDebugDescription(pointerEvent.height, options)},
       {"tiltX", getDebugDescription(pointerEvent.tiltX, options)},

ReactCommon/react/renderer/components/view/PointerEvent.h

@@ -38,6 +38,11 @@ struct PointerEvent {
    * The X/Y coordinate of the pointer in global (screen) coordinates.
    */
   Point screenPoint;
+  /*
+   * The X/Y coordinate of the pointer relative to the position of the padding
+   * edge of the target node.
+   */
+  Point offsetPoint;
   /*
    * The width (magnitude on the X axis), in CSS pixels, of the contact geometry
    * of the pointer

ReactCommon/react/renderer/components/view/TouchEventEmitter.cpp

@@ -77,6 +77,8 @@ static jsi::Value pointerEventPayload(
   object.setProperty(runtime, "pageY", event.clientPoint.y);
   object.setProperty(runtime, "screenX", event.screenPoint.x);
   object.setProperty(runtime, "screenY", event.screenPoint.y);
+  object.setProperty(runtime, "offsetX", event.offsetPoint.x);
+  object.setProperty(runtime, "offsetY", event.offsetPoint.y);
   object.setProperty(runtime, "width", event.width);
   object.setProperty(runtime, "height", event.height);
   object.setProperty(runtime, "tiltX", event.tiltX);