Pressability: Support Rect or Numeric Size

Summary:
Introduces `Rect`, an (eventual) replacement for `EdgeInsetsProp`.

This new type is then used in `Pressability` to expand support such that `hitSlop` and `pressRectOffset` can be either a `Rect` or a numeric size.

Changelog:
[Internal]

Reviewed By: yungsters

Differential Revision: D18742616

fbshipit-source-id: 13dd360f68ab804839938fc950fa2f4b25d3ed8c

Libraries/Pressability/Pressability.js

@@ -13,7 +13,7 @@
 import {isHoverEnabled} from './HoverState.js';
 import invariant from 'invariant';
 import SoundManager from '../Components/Sound/SoundManager.js';
-import type {EdgeInsetsProp} from '../StyleSheet/EdgeInsetsPropType.js';
+import {normalizeRect, type RectOrSize} from '../StyleSheet/Rect.js';
 import type {
   BlurEvent,
   FocusEvent,
@@ -40,12 +40,12 @@ export type PressabilityConfig = $ReadOnly<{|
   /**
    * Amount to extend the `VisualRect` by to create `HitRect`.
    */
-  hitSlop?: ?EdgeInsetsProp,
+  hitSlop?: ?RectOrSize,
 
   /**
    * Amount to extend the `HitRect` by to create `PressRect`.
    */
-  pressRectOffset?: ?EdgeInsetsProp,
+  pressRectOffset?: ?RectOrSize,
 
   /**
    * Whether to disable the systemm sound when `onPress` fires on Android.
@@ -753,7 +753,8 @@ export default class Pressability {
       top: number,
     |}>,
   ): boolean {
-    const {hitSlop, pressRectOffset} = this._config;
+    const hitSlop = normalizeRect(this._config.hitSlop);
+    const pressRectOffset = normalizeRect(this._config.pressRectOffset);
 
     let regionBottom = responderRegion.bottom;
     let regionLeft = responderRegion.left;

Libraries/StyleSheet/EdgeInsetsPropType.js

@@ -10,9 +10,6 @@
 
 'use strict';
 
-export type EdgeInsetsProp = $ReadOnly<{|
+import type {Rect} from './Rect.js';
-  top?: ?number,
+
-  left?: ?number,
+export type EdgeInsetsProp = Rect;
-  bottom?: ?number,
-  right?: ?number,
-|}>;

Libraries/StyleSheet/Rect.js

@@ -0,0 +1,28 @@
+/**
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ * @format
+ * @flow strict
+ */
+
+'use strict';
+
+export type Rect = $ReadOnly<{|
+  bottom?: ?number,
+  left?: ?number,
+  right?: ?number,
+  top?: ?number,
+|}>;
+
+export type RectOrSize = Rect | number;
+
+export function createSquare(size: number): Rect {
+  return {bottom: size, left: size, right: size, top: size};
+}
+
+export function normalizeRect(rectOrSize: ?RectOrSize): ?Rect {
+  return typeof rectOrSize === 'number' ? createSquare(rectOrSize) : rectOrSize;
+}