@amazon-devices/react-native-gesture-handler 4.0.0 → 4.0.2

package/lib/commonjs/components/Pressable/Pressable.js

@@ -1,274 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var _react = _interopRequireWildcard(require("react"));
-var _gestureObjects = require("../../handlers/gestures/gestureObjects");
-var _GestureDetector = require("../../handlers/gestures/GestureDetector");
-var _reactNative = require("react-native");
-var _GestureHandlerButton = _interopRequireDefault(require("../GestureHandlerButton"));
-var _utils = require("./utils");
-var _PressabilityDebugView = require("../../handlers/PressabilityDebugView");
-var _utils2 = require("../../utils");
-var _utils3 = require("../utils");
-var _stateDefinitions = require("./stateDefinitions");
-var _StateMachine = require("./StateMachine");
-var _jsxRuntime = require("react/jsx-runtime");
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
-const DEFAULT_LONG_PRESS_DURATION = 500;
-const IS_TEST_ENV = (0, _utils2.isTestEnv)();
-let IS_FABRIC = null;
-const Pressable = props => {
-  const {
-    testOnly_pressed,
-    hitSlop,
-    pressRetentionOffset,
-    delayHoverIn,
-    delayHoverOut,
-    delayLongPress,
-    unstable_pressDelay,
-    onHoverIn,
-    onHoverOut,
-    onPress,
-    onPressIn,
-    onPressOut,
-    onLongPress,
-    onLayout,
-    style,
-    children,
-    android_disableSound,
-    android_ripple,
-    disabled,
-    accessible,
-    simultaneousWithExternalGesture,
-    requireExternalGestureToFail,
-    blocksExternalGesture,
-    ...remainingProps
-  } = props;
-  const relationProps = {
-    simultaneousWithExternalGesture,
-    requireExternalGestureToFail,
-    blocksExternalGesture
-  };
-  const [pressedState, setPressedState] = (0, _react.useState)(testOnly_pressed ?? false);
-  const longPressTimeoutRef = (0, _react.useRef)(null);
-  const pressDelayTimeoutRef = (0, _react.useRef)(null);
-  const isOnPressAllowed = (0, _react.useRef)(true);
-  const isCurrentlyPressed = (0, _react.useRef)(false);
-  const dimensions = (0, _react.useRef)({
-    width: 0,
-    height: 0
-  });
-  const normalizedHitSlop = (0, _react.useMemo)(() => typeof hitSlop === 'number' ? (0, _utils.numberAsInset)(hitSlop) : hitSlop ?? {}, [hitSlop]);
-  const normalizedPressRetentionOffset = (0, _react.useMemo)(() => typeof pressRetentionOffset === 'number' ? (0, _utils.numberAsInset)(pressRetentionOffset) : pressRetentionOffset ?? {}, [pressRetentionOffset]);
-  const appliedHitSlop = (0, _utils.addInsets)(normalizedHitSlop, normalizedPressRetentionOffset);
-  const cancelLongPress = (0, _react.useCallback)(() => {
-    if (longPressTimeoutRef.current) {
-      clearTimeout(longPressTimeoutRef.current);
-      longPressTimeoutRef.current = null;
-      isOnPressAllowed.current = true;
-    }
-  }, []);
-  const cancelDelayedPress = (0, _react.useCallback)(() => {
-    if (pressDelayTimeoutRef.current) {
-      clearTimeout(pressDelayTimeoutRef.current);
-      pressDelayTimeoutRef.current = null;
-    }
-  }, []);
-  const startLongPress = (0, _react.useCallback)(event => {
-    if (onLongPress) {
-      cancelLongPress();
-      longPressTimeoutRef.current = setTimeout(() => {
-        isOnPressAllowed.current = false;
-        onLongPress(event);
-      }, delayLongPress ?? DEFAULT_LONG_PRESS_DURATION);
-    }
-  }, [onLongPress, cancelLongPress, delayLongPress]);
-  const innerHandlePressIn = (0, _react.useCallback)(event => {
-    onPressIn?.(event);
-    startLongPress(event);
-    setPressedState(true);
-    if (pressDelayTimeoutRef.current) {
-      clearTimeout(pressDelayTimeoutRef.current);
-      pressDelayTimeoutRef.current = null;
-    }
-  }, [onPressIn, startLongPress]);
-  const handleFinalize = (0, _react.useCallback)(() => {
-    isCurrentlyPressed.current = false;
-    cancelLongPress();
-    cancelDelayedPress();
-    setPressedState(false);
-  }, [cancelDelayedPress, cancelLongPress]);
-  const handlePressIn = (0, _react.useCallback)(event => {
-    if (!(0, _utils.isTouchWithinInset)(dimensions.current, normalizedHitSlop, event.nativeEvent.changedTouches.at(-1))) {
-      // Ignoring pressIn within pressRetentionOffset
-      return;
-    }
-    isCurrentlyPressed.current = true;
-    if (unstable_pressDelay) {
-      pressDelayTimeoutRef.current = setTimeout(() => {
-        innerHandlePressIn(event);
-      }, unstable_pressDelay);
-    } else {
-      innerHandlePressIn(event);
-    }
-  }, [innerHandlePressIn, normalizedHitSlop, unstable_pressDelay]);
-  const handlePressOut = (0, _react.useCallback)((event, success = true) => {
-    if (!isCurrentlyPressed.current) {
-      // Some prop configurations may lead to handlePressOut being called mutliple times.
-      return;
-    }
-    isCurrentlyPressed.current = false;
-    if (pressDelayTimeoutRef.current) {
-      innerHandlePressIn(event);
-    }
-    onPressOut?.(event);
-    if (isOnPressAllowed.current && success) {
-      onPress?.(event);
-    }
-    handleFinalize();
-  }, [handleFinalize, innerHandlePressIn, onPress, onPressOut]);
-  const stateMachine = (0, _react.useMemo)(() => new _StateMachine.PressableStateMachine(), []);
-  (0, _react.useEffect)(() => {
-    const configuration = (0, _stateDefinitions.getStatesConfig)(handlePressIn, handlePressOut);
-    stateMachine.setStates(configuration);
-  }, [handlePressIn, handlePressOut, stateMachine]);
-  const hoverInTimeout = (0, _react.useRef)(null);
-  const hoverOutTimeout = (0, _react.useRef)(null);
-  const hoverGesture = (0, _react.useMemo)(() => _gestureObjects.GestureObjects.Hover().manualActivation(true) // Prevents Hover blocking Gesture.Native() on web
-  .cancelsTouchesInView(false).onBegin(event => {
-    if (hoverOutTimeout.current) {
-      clearTimeout(hoverOutTimeout.current);
-    }
-    if (delayHoverIn) {
-      hoverInTimeout.current = setTimeout(() => onHoverIn?.((0, _utils.gestureToPressableEvent)(event)), delayHoverIn);
-      return;
-    }
-    onHoverIn?.((0, _utils.gestureToPressableEvent)(event));
-  }).onFinalize(event => {
-    if (hoverInTimeout.current) {
-      clearTimeout(hoverInTimeout.current);
-    }
-    if (delayHoverOut) {
-      hoverOutTimeout.current = setTimeout(() => onHoverOut?.((0, _utils.gestureToPressableEvent)(event)), delayHoverOut);
-      return;
-    }
-    onHoverOut?.((0, _utils.gestureToPressableEvent)(event));
-  }), [delayHoverIn, delayHoverOut, onHoverIn, onHoverOut]);
-  const pressAndTouchGesture = (0, _react.useMemo)(() => _gestureObjects.GestureObjects.LongPress().minDuration(_utils2.INT32_MAX) // Stops long press from blocking Gesture.Native()
-  .maxDistance(_utils2.INT32_MAX) // Stops long press from cancelling on touch move
-  .cancelsTouchesInView(false).onTouchesDown(event => {
-    const pressableEvent = (0, _utils.gestureTouchToPressableEvent)(event);
-    stateMachine.handleEvent(_stateDefinitions.StateMachineEvent.LONG_PRESS_TOUCHES_DOWN, pressableEvent);
-  }).onTouchesUp(() => {
-    if (_reactNative.Platform.OS === 'android') {
-      // Prevents potential soft-locks
-      stateMachine.reset();
-      handleFinalize();
-    }
-  }).onTouchesCancelled(event => {
-    const pressableEvent = (0, _utils.gestureTouchToPressableEvent)(event);
-    stateMachine.reset();
-    handlePressOut(pressableEvent, false);
-  }).onFinalize((_event, success) => {
-    if (_reactNative.Platform.OS === 'web') {
-      if (success) {
-        stateMachine.handleEvent(_stateDefinitions.StateMachineEvent.FINALIZE);
-      } else {
-        stateMachine.handleEvent(_stateDefinitions.StateMachineEvent.CANCEL);
-      }
-      handleFinalize();
-    }
-  }), [stateMachine, handleFinalize, handlePressOut]);
-
-  // RNButton is placed inside ButtonGesture to enable Android's ripple and to capture non-propagating events
-  const buttonGesture = (0, _react.useMemo)(() => _gestureObjects.GestureObjects.Native().onTouchesCancelled(event => {
-    if (_reactNative.Platform.OS !== 'macos' && _reactNative.Platform.OS !== 'web') {
-      // On MacOS cancel occurs in middle of gesture
-      // On Web cancel occurs on mouse move, which is unwanted
-      const pressableEvent = (0, _utils.gestureTouchToPressableEvent)(event);
-      stateMachine.reset();
-      handlePressOut(pressableEvent, false);
-    }
-  }).onBegin(() => {
-    stateMachine.handleEvent(_stateDefinitions.StateMachineEvent.NATIVE_BEGIN);
-  }).onStart(() => {
-    if (_reactNative.Platform.OS !== 'android') {
-      // Gesture.Native().onStart() is broken with Android + hitSlop
-      stateMachine.handleEvent(_stateDefinitions.StateMachineEvent.NATIVE_START);
-    }
-  }).onFinalize((_event, success) => {
-    if (_reactNative.Platform.OS !== 'web') {
-      // On Web we use LongPress().onFinalize() instead of Native().onFinalize(),
-      // as Native cancels on mouse move, and LongPress does not.
-      if (success) {
-        stateMachine.handleEvent(_stateDefinitions.StateMachineEvent.FINALIZE);
-      } else {
-        stateMachine.handleEvent(_stateDefinitions.StateMachineEvent.CANCEL);
-      }
-      handleFinalize();
-    }
-  }), [stateMachine, handlePressOut, handleFinalize]);
-  const isPressableEnabled = disabled !== true;
-  const gestures = [buttonGesture, pressAndTouchGesture, hoverGesture];
-  for (const gesture of gestures) {
-    gesture.enabled(isPressableEnabled);
-    gesture.runOnJS(true);
-    gesture.hitSlop(appliedHitSlop);
-    gesture.shouldCancelWhenOutside(_reactNative.Platform.OS !== 'web');
-    Object.entries(relationProps).forEach(([relationName, relation]) => {
-      (0, _utils3.applyRelationProp)(gesture, relationName, relation);
-    });
-  }
-  const gesture = _gestureObjects.GestureObjects.Simultaneous(...gestures);
-
-  // `cursor: 'pointer'` on `RNButton` crashes iOS
-  const pointerStyle = _reactNative.Platform.OS === 'web' ? {
-    cursor: 'pointer'
-  } : {};
-  const styleProp = typeof style === 'function' ? style({
-    pressed: pressedState
-  }) : style;
-  const childrenProp = typeof children === 'function' ? children({
-    pressed: pressedState
-  }) : children;
-  const rippleColor = (0, _react.useMemo)(() => {
-    if (IS_FABRIC === null) {
-      IS_FABRIC = (0, _utils2.isFabric)();
-    }
-    const defaultRippleColor = android_ripple ? undefined : 'transparent';
-    const unprocessedRippleColor = android_ripple?.color ?? defaultRippleColor;
-    return IS_FABRIC ? unprocessedRippleColor : (0, _reactNative.processColor)(unprocessedRippleColor);
-  }, [android_ripple]);
-  const setDimensions = (0, _react.useCallback)(event => {
-    onLayout?.(event);
-    dimensions.current = event.nativeEvent.layout;
-  }, [onLayout]);
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_GestureDetector.GestureDetector, {
-    gesture: gesture,
-    children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_GestureHandlerButton.default, {
-      ...remainingProps,
-      onLayout: setDimensions,
-      accessible: accessible !== false,
-      hitSlop: appliedHitSlop,
-      enabled: isPressableEnabled,
-      touchSoundDisabled: android_disableSound ?? undefined,
-      rippleColor: rippleColor,
-      rippleRadius: android_ripple?.radius ?? undefined,
-      style: [pointerStyle, styleProp],
-      testOnly_onPress: IS_TEST_ENV ? onPress : undefined,
-      testOnly_onPressIn: IS_TEST_ENV ? onPressIn : undefined,
-      testOnly_onPressOut: IS_TEST_ENV ? onPressOut : undefined,
-      testOnly_onLongPress: IS_TEST_ENV ? onLongPress : undefined,
-      children: [childrenProp, __DEV__ ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_PressabilityDebugView.PressabilityDebugView, {
-        color: "red",
-        hitSlop: normalizedHitSlop
-      }) : null]
-    })
-  });
-};
-var _default = exports.default = Pressable;
-//# sourceMappingURL=Pressable.js.map

package/lib/commonjs/components/Pressable/PressableProps.js

@@ -1,6 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-//# sourceMappingURL=PressableProps.js.map

package/lib/commonjs/components/Pressable/StateMachine.js

@@ -1,44 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.PressableStateMachine = void 0;
-class PressableStateMachine {
-  constructor() {
-    this.states = null;
-    this.currentStepIndex = 0;
-    this.eventPayload = null;
-  }
-  setStates(states) {
-    this.states = states;
-  }
-  reset() {
-    this.currentStepIndex = 0;
-    this.eventPayload = null;
-  }
-  handleEvent(eventName, eventPayload) {
-    if (!this.states) {
-      return;
-    }
-    const step = this.states[this.currentStepIndex];
-    this.eventPayload = eventPayload || this.eventPayload;
-    if (step.eventName !== eventName) {
-      if (this.currentStepIndex > 0) {
-        // retry with position at index 0
-        this.reset();
-        this.handleEvent(eventName, eventPayload);
-      }
-      return;
-    }
-    if (this.eventPayload && step.callback) {
-      step.callback(this.eventPayload);
-    }
-    this.currentStepIndex++;
-    if (this.currentStepIndex === this.states.length) {
-      this.reset();
-    }
-  }
-}
-exports.PressableStateMachine = PressableStateMachine;
-//# sourceMappingURL=StateMachine.js.map

package/lib/commonjs/components/Pressable/index.js

@@ -1,14 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-Object.defineProperty(exports, "default", {
-  enumerable: true,
-  get: function () {
-    return _Pressable.default;
-  }
-});
-var _Pressable = _interopRequireDefault(require("./Pressable"));
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-//# sourceMappingURL=index.js.map

package/lib/commonjs/components/Pressable/stateDefinitions.js

@@ -1,88 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.StateMachineEvent = void 0;
-exports.getStatesConfig = getStatesConfig;
-var _reactNative = require("react-native");
-let StateMachineEvent = exports.StateMachineEvent = /*#__PURE__*/function (StateMachineEvent) {
-  StateMachineEvent["NATIVE_BEGIN"] = "nativeBegin";
-  StateMachineEvent["NATIVE_START"] = "nativeStart";
-  StateMachineEvent["FINALIZE"] = "finalize";
-  StateMachineEvent["LONG_PRESS_TOUCHES_DOWN"] = "longPressTouchesDown";
-  StateMachineEvent["CANCEL"] = "cancel";
-  return StateMachineEvent;
-}({});
-function getAndroidStatesConfig(handlePressIn, handlePressOut) {
-  return [{
-    eventName: StateMachineEvent.NATIVE_BEGIN
-  }, {
-    eventName: StateMachineEvent.LONG_PRESS_TOUCHES_DOWN,
-    callback: handlePressIn
-  }, {
-    eventName: StateMachineEvent.FINALIZE,
-    callback: handlePressOut
-  }];
-}
-function getIosStatesConfig(handlePressIn, handlePressOut) {
-  return [{
-    eventName: StateMachineEvent.LONG_PRESS_TOUCHES_DOWN
-  }, {
-    eventName: StateMachineEvent.NATIVE_START,
-    callback: handlePressIn
-  }, {
-    eventName: StateMachineEvent.FINALIZE,
-    callback: handlePressOut
-  }];
-}
-function getWebStatesConfig(handlePressIn, handlePressOut) {
-  return [{
-    eventName: StateMachineEvent.NATIVE_BEGIN
-  }, {
-    eventName: StateMachineEvent.NATIVE_START
-  }, {
-    eventName: StateMachineEvent.LONG_PRESS_TOUCHES_DOWN,
-    callback: handlePressIn
-  }, {
-    eventName: StateMachineEvent.FINALIZE,
-    callback: handlePressOut
-  }];
-}
-function getMacosStatesConfig(handlePressIn, handlePressOut) {
-  return [{
-    eventName: StateMachineEvent.LONG_PRESS_TOUCHES_DOWN
-  }, {
-    eventName: StateMachineEvent.NATIVE_BEGIN,
-    callback: handlePressIn
-  }, {
-    eventName: StateMachineEvent.NATIVE_START
-  }, {
-    eventName: StateMachineEvent.FINALIZE,
-    callback: handlePressOut
-  }];
-}
-function getUniversalStatesConfig(handlePressIn, handlePressOut) {
-  return [{
-    eventName: StateMachineEvent.FINALIZE,
-    callback: event => {
-      handlePressIn(event);
-      handlePressOut(event);
-    }
-  }];
-}
-function getStatesConfig(handlePressIn, handlePressOut) {
-  if (_reactNative.Platform.OS === 'android') {
-    return getAndroidStatesConfig(handlePressIn, handlePressOut);
-  } else if (_reactNative.Platform.OS === 'ios') {
-    return getIosStatesConfig(handlePressIn, handlePressOut);
-  } else if (_reactNative.Platform.OS === 'web') {
-    return getWebStatesConfig(handlePressIn, handlePressOut);
-  } else if (_reactNative.Platform.OS === 'macos') {
-    return getMacosStatesConfig(handlePressIn, handlePressOut);
-  } else {
-    // Unknown platform - using minimal universal setup.
-    return getUniversalStatesConfig(handlePressIn, handlePressOut);
-  }
-}
-//# sourceMappingURL=stateDefinitions.js.map

package/lib/commonjs/components/Pressable/utils.js

@@ -1,92 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.numberAsInset = exports.isTouchWithinInset = exports.gestureTouchToPressableEvent = exports.gestureToPressableEvent = exports.addInsets = void 0;
-const numberAsInset = value => ({
-  left: value,
-  right: value,
-  top: value,
-  bottom: value
-});
-exports.numberAsInset = numberAsInset;
-const addInsets = (a, b) => ({
-  left: (a.left ?? 0) + (b.left ?? 0),
-  right: (a.right ?? 0) + (b.right ?? 0),
-  top: (a.top ?? 0) + (b.top ?? 0),
-  bottom: (a.bottom ?? 0) + (b.bottom ?? 0)
-});
-exports.addInsets = addInsets;
-const touchDataToPressEvent = (data, timestamp, targetId) => ({
-  identifier: data.id,
-  locationX: data.x,
-  locationY: data.y,
-  pageX: data.absoluteX,
-  pageY: data.absoluteY,
-  target: targetId,
-  timestamp: timestamp,
-  touches: [],
-  // Always empty - legacy compatibility
-  changedTouches: [] // Always empty - legacy compatibility
-});
-const gestureToPressEvent = (event, timestamp, targetId) => ({
-  identifier: event.handlerTag,
-  locationX: event.x,
-  locationY: event.y,
-  pageX: event.absoluteX,
-  pageY: event.absoluteY,
-  target: targetId,
-  timestamp: timestamp,
-  touches: [],
-  // Always empty - legacy compatibility
-  changedTouches: [] // Always empty - legacy compatibility
-});
-const isTouchWithinInset = (dimensions, inset, touch) => (touch?.locationX ?? 0) < (inset.right ?? 0) + dimensions.width && (touch?.locationY ?? 0) < (inset.bottom ?? 0) + dimensions.height && (touch?.locationX ?? 0) > -(inset.left ?? 0) && (touch?.locationY ?? 0) > -(inset.top ?? 0);
-exports.isTouchWithinInset = isTouchWithinInset;
-const gestureToPressableEvent = event => {
-  const timestamp = Date.now();
-
-  // As far as I can see, there isn't a conventional way of getting targetId with the data we get
-  const targetId = 0;
-  const pressEvent = gestureToPressEvent(event, timestamp, targetId);
-  return {
-    nativeEvent: {
-      touches: [pressEvent],
-      changedTouches: [pressEvent],
-      identifier: pressEvent.identifier,
-      locationX: event.x,
-      locationY: event.y,
-      pageX: event.absoluteX,
-      pageY: event.absoluteY,
-      target: targetId,
-      timestamp: timestamp,
-      force: undefined
-    }
-  };
-};
-exports.gestureToPressableEvent = gestureToPressableEvent;
-const gestureTouchToPressableEvent = event => {
-  const timestamp = Date.now();
-
-  // As far as I can see, there isn't a conventional way of getting targetId with the data we get
-  const targetId = 0;
-  const touchesList = event.allTouches.map(touch => touchDataToPressEvent(touch, timestamp, targetId));
-  const changedTouchesList = event.changedTouches.map(touch => touchDataToPressEvent(touch, timestamp, targetId));
-  return {
-    nativeEvent: {
-      touches: touchesList,
-      changedTouches: changedTouchesList,
-      identifier: event.handlerTag,
-      locationX: event.allTouches.at(0)?.x ?? -1,
-      locationY: event.allTouches.at(0)?.y ?? -1,
-      pageX: event.allTouches.at(0)?.absoluteX ?? -1,
-      pageY: event.allTouches.at(0)?.absoluteY ?? -1,
-      target: targetId,
-      timestamp: timestamp,
-      force: undefined
-    }
-  };
-};
-exports.gestureTouchToPressableEvent = gestureTouchToPressableEvent;
-//# sourceMappingURL=utils.js.map