@tamagui/react-native-use-pressable 1.116.1 → 1.116.3

package/dist/cjs/PressResponder.js

@@ -0,0 +1,234 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: !0 });
+}, __copyProps = (to, from, except, desc) => {
+  if (from && typeof from == "object" || typeof from == "function")
+    for (let key of __getOwnPropNames(from))
+      !__hasOwnProp.call(to, key) && key !== except && __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: !0 }), mod);
+var PressResponder_exports = {};
+__export(PressResponder_exports, {
+  default: () => PressResponder
+});
+module.exports = __toCommonJS(PressResponder_exports);
+const DELAY = "DELAY", ERROR = "ERROR", LONG_PRESS_DETECTED = "LONG_PRESS_DETECTED", NOT_RESPONDER = "NOT_RESPONDER", RESPONDER_ACTIVE_LONG_PRESS_START = "RESPONDER_ACTIVE_LONG_PRESS_START", RESPONDER_ACTIVE_PRESS_START = "RESPONDER_ACTIVE_PRESS_START", RESPONDER_INACTIVE_PRESS_START = "RESPONDER_INACTIVE_PRESS_START", RESPONDER_GRANT = "RESPONDER_GRANT", RESPONDER_RELEASE = "RESPONDER_RELEASE", RESPONDER_TERMINATED = "RESPONDER_TERMINATED", Transitions = Object.freeze({
+  NOT_RESPONDER: {
+    DELAY: ERROR,
+    RESPONDER_GRANT: RESPONDER_INACTIVE_PRESS_START,
+    RESPONDER_RELEASE: ERROR,
+    RESPONDER_TERMINATED: ERROR,
+    LONG_PRESS_DETECTED: ERROR
+  },
+  RESPONDER_INACTIVE_PRESS_START: {
+    DELAY: RESPONDER_ACTIVE_PRESS_START,
+    RESPONDER_GRANT: ERROR,
+    RESPONDER_RELEASE: NOT_RESPONDER,
+    RESPONDER_TERMINATED: NOT_RESPONDER,
+    LONG_PRESS_DETECTED: ERROR
+  },
+  RESPONDER_ACTIVE_PRESS_START: {
+    DELAY: ERROR,
+    RESPONDER_GRANT: ERROR,
+    RESPONDER_RELEASE: NOT_RESPONDER,
+    RESPONDER_TERMINATED: NOT_RESPONDER,
+    LONG_PRESS_DETECTED: RESPONDER_ACTIVE_LONG_PRESS_START
+  },
+  RESPONDER_ACTIVE_LONG_PRESS_START: {
+    DELAY: ERROR,
+    RESPONDER_GRANT: ERROR,
+    RESPONDER_RELEASE: NOT_RESPONDER,
+    RESPONDER_TERMINATED: NOT_RESPONDER,
+    LONG_PRESS_DETECTED: RESPONDER_ACTIVE_LONG_PRESS_START
+  },
+  ERROR: {
+    DELAY: NOT_RESPONDER,
+    RESPONDER_GRANT: RESPONDER_INACTIVE_PRESS_START,
+    RESPONDER_RELEASE: NOT_RESPONDER,
+    RESPONDER_TERMINATED: NOT_RESPONDER,
+    LONG_PRESS_DETECTED: NOT_RESPONDER
+  }
+}), isActiveSignal = (signal) => signal === RESPONDER_ACTIVE_PRESS_START || signal === RESPONDER_ACTIVE_LONG_PRESS_START, isButtonRole = (element) => element.getAttribute("role") === "button", isPressStartSignal = (signal) => signal === RESPONDER_INACTIVE_PRESS_START || signal === RESPONDER_ACTIVE_PRESS_START || signal === RESPONDER_ACTIVE_LONG_PRESS_START, isTerminalSignal = (signal) => signal === RESPONDER_TERMINATED || signal === RESPONDER_RELEASE, isValidKeyPress = (event) => {
+  const key = event.key, role = event.target.getAttribute("role");
+  return key === "Enter" || (key === " " || key === "Spacebar") && role === "button";
+}, DEFAULT_LONG_PRESS_DELAY_MS = 450, DEFAULT_PRESS_DELAY_MS = 50;
+class PressResponder {
+  _touchActivatePosition = null;
+  _pressDelayTimeout = 0;
+  _selectionTerminated = !1;
+  _isPointerTouch = !1;
+  _longPressDelayTimeout = 0;
+  _longPressDispatched = !1;
+  _pressOutDelayTimeout = 0;
+  _touchState = NOT_RESPONDER;
+  _config = null;
+  _eventHandlers = null;
+  constructor(config) {
+    this.configure(config);
+  }
+  configure(config) {
+    this._config = config;
+  }
+  /**
+   * Resets any pending timers. This should be called on unmount.
+   */
+  reset() {
+    this._cancelLongPressDelayTimeout(), this._cancelPressDelayTimeout(), this._cancelPressOutDelayTimeout();
+  }
+  /**
+   * Returns a set of props to spread into the interactive element.
+   */
+  getEventHandlers() {
+    return this._eventHandlers == null && (this._eventHandlers = this._createEventHandlers()), this._eventHandlers;
+  }
+  _createEventHandlers() {
+    const start = (event, shouldDelay) => {
+      event.persist(), this._cancelPressOutDelayTimeout(), this._longPressDispatched = !1, this._selectionTerminated = !1, this._touchState = NOT_RESPONDER, this._isPointerTouch = event.nativeEvent.type === "touchstart", this._receiveSignal(RESPONDER_GRANT, event);
+      const delayPressStart = normalizeDelay(
+        this._config.delayPressStart,
+        0,
+        DEFAULT_PRESS_DELAY_MS
+      );
+      shouldDelay !== !1 && delayPressStart > 0 ? this._pressDelayTimeout = setTimeout(() => {
+        this._receiveSignal(DELAY, event);
+      }, delayPressStart) : this._receiveSignal(DELAY, event);
+      const delayLongPress = normalizeDelay(
+        this._config.delayLongPress,
+        10,
+        DEFAULT_LONG_PRESS_DELAY_MS
+      );
+      this._longPressDelayTimeout = setTimeout(() => {
+        this._handleLongPress(event);
+      }, delayLongPress + delayPressStart);
+    }, end = (event) => {
+      this._receiveSignal(RESPONDER_RELEASE, event);
+    }, keyupHandler = (event) => {
+      const onPress = this._config.onPress, target = event.target;
+      if (this._touchState !== NOT_RESPONDER && isValidKeyPress(event)) {
+        end(event), document.removeEventListener("keyup", keyupHandler);
+        const role = target.getAttribute("role"), elementType = target.tagName.toLowerCase(), isNativeInteractiveElement = role === "link" || elementType === "a" || elementType === "button" || elementType === "input" || elementType === "select" || elementType === "textarea";
+        onPress != null && !isNativeInteractiveElement && onPress(event);
+      }
+    };
+    return {
+      onStartShouldSetResponder: (event) => {
+        const disabled = this._config.disabled;
+        return disabled && isButtonRole(event.currentTarget) && event.stopPropagation(), disabled == null ? !0 : !disabled;
+      },
+      onKeyDown: (event) => {
+        const disabled = this._config.disabled, key = event.key, target = event.target;
+        if (!disabled && isValidKeyPress(event)) {
+          this._touchState === NOT_RESPONDER && (start(event, !1), document.addEventListener("keyup", keyupHandler));
+          const role = target.getAttribute("role");
+          (key === " " || key === "Spacebar") && (role === "button" || role === "menuitem") && event.preventDefault(), event.stopPropagation();
+        }
+      },
+      onResponderGrant: (event) => start(event),
+      onResponderMove: (event) => {
+        this._config.onPressMove != null && this._config.onPressMove(event);
+        const touch = getTouchFromResponderEvent(event);
+        if (this._touchActivatePosition != null) {
+          const deltaX = this._touchActivatePosition.pageX - touch.pageX, deltaY = this._touchActivatePosition.pageY - touch.pageY;
+          Math.hypot(deltaX, deltaY) > 10 && this._cancelLongPressDelayTimeout();
+        }
+      },
+      onResponderRelease: (event) => end(event),
+      onResponderTerminate: (event) => {
+        event.nativeEvent.type === "selectionchange" && (this._selectionTerminated = !0), this._receiveSignal(RESPONDER_TERMINATED, event);
+      },
+      onResponderTerminationRequest: (event) => {
+        const _this$_config = this._config, cancelable = _this$_config.cancelable, disabled = _this$_config.disabled, onLongPress = _this$_config.onLongPress;
+        return !disabled && onLongPress != null && this._isPointerTouch && event.nativeEvent.type === "contextmenu" ? !1 : cancelable ?? !0;
+      },
+      // NOTE: this diverges from react-native in 3 significant ways:
+      // * The `onPress` callback is not connected to the responder system (the native
+      //  `click` event must be used but is dispatched in many scenarios where no pointers
+      //   are on the screen.) Therefore, it's possible for `onPress` to be called without
+      //   `onPress{Start,End}` being called first.
+      // * The `onPress` callback is only be called on the first ancestor of the native
+      //   `click` target that is using the PressResponder.
+      // * The event's `nativeEvent` is a `MouseEvent` not a `TouchEvent`.
+      onClick: (event) => {
+        const _this$_config2 = this._config, disabled = _this$_config2.disabled, onPress = _this$_config2.onPress;
+        disabled ? isButtonRole(event.currentTarget) && event.stopPropagation() : (event.stopPropagation(), this._longPressDispatched || this._selectionTerminated ? event.preventDefault() : onPress != null && event.altKey === !1 && onPress(event));
+      },
+      // If `onLongPress` is provided and a touch pointer is being used, prevent the
+      // default context menu from opening.
+      onContextMenu: (event) => {
+        const _this$_config3 = this._config, disabled = _this$_config3.disabled, onLongPress = _this$_config3.onLongPress;
+        disabled ? isButtonRole(event.currentTarget) && event.stopPropagation() : onLongPress != null && this._isPointerTouch && !event.defaultPrevented && (event.preventDefault(), event.stopPropagation());
+      }
+    };
+  }
+  /**
+   * Receives a state machine signal, performs side effects of the transition
+   * and stores the new state. Validates the transition as well.
+   */
+  _receiveSignal(signal, event) {
+    const prevState = this._touchState;
+    let nextState = null;
+    Transitions[prevState] != null && (nextState = Transitions[prevState][signal]), !(this._touchState === NOT_RESPONDER && signal === RESPONDER_RELEASE) && (nextState == null || nextState === ERROR ? console.error(
+      `PressResponder: Invalid signal ${signal} for state ${prevState} on responder`
+    ) : prevState !== nextState && (this._performTransitionSideEffects(prevState, nextState, signal, event), this._touchState = nextState));
+  }
+  /**
+   * Performs a transition between touchable states and identify any activations
+   * or deactivations (and callback invocations).
+   */
+  _performTransitionSideEffects(prevState, nextState, signal, event) {
+    if (isTerminalSignal(signal) && (setTimeout(() => {
+      this._isPointerTouch = !1;
+    }, 0), this._touchActivatePosition = null, this._cancelLongPressDelayTimeout()), isPressStartSignal(prevState) && signal === LONG_PRESS_DETECTED) {
+      const onLongPress = this._config.onLongPress;
+      onLongPress != null && event.nativeEvent.key == null && (onLongPress(event), this._longPressDispatched = !0);
+    }
+    const isPrevActive = isActiveSignal(prevState), isNextActive = isActiveSignal(nextState);
+    if (!isPrevActive && isNextActive ? this._activate(event) : isPrevActive && !isNextActive && this._deactivate(event), isPressStartSignal(prevState) && signal === RESPONDER_RELEASE) {
+      const _this$_config4 = this._config, _onLongPress = _this$_config4.onLongPress;
+      _this$_config4.onPress != null && (_onLongPress != null && prevState === RESPONDER_ACTIVE_LONG_PRESS_START || isNextActive || isPrevActive || (this._activate(event), this._deactivate(event)));
+    }
+    this._cancelPressDelayTimeout();
+  }
+  _activate(event) {
+    const _this$_config5 = this._config, onPressChange = _this$_config5.onPressChange, onPressStart = _this$_config5.onPressStart, touch = getTouchFromResponderEvent(event);
+    this._touchActivatePosition = {
+      pageX: touch.pageX,
+      pageY: touch.pageY
+    }, onPressStart?.(event), onPressChange?.(!0);
+  }
+  _deactivate(event) {
+    const _this$_config6 = this._config, onPressChange = _this$_config6.onPressChange, onPressEnd = _this$_config6.onPressEnd;
+    function end() {
+      onPressEnd?.(event), onPressChange?.(!1);
+    }
+    const delayPressEnd = normalizeDelay(this._config.delayPressEnd);
+    delayPressEnd > 0 ? this._pressOutDelayTimeout = setTimeout(() => {
+      end();
+    }, delayPressEnd) : end();
+  }
+  _handleLongPress(event) {
+    (this._touchState === RESPONDER_ACTIVE_PRESS_START || this._touchState === RESPONDER_ACTIVE_LONG_PRESS_START) && this._receiveSignal(LONG_PRESS_DETECTED, event);
+  }
+  _cancelLongPressDelayTimeout() {
+    this._longPressDelayTimeout != null && (clearTimeout(this._longPressDelayTimeout), this._longPressDelayTimeout = null);
+  }
+  _cancelPressDelayTimeout() {
+    this._pressDelayTimeout != null && (clearTimeout(this._pressDelayTimeout), this._pressDelayTimeout = null);
+  }
+  _cancelPressOutDelayTimeout() {
+    this._pressOutDelayTimeout != null && (clearTimeout(this._pressOutDelayTimeout), this._pressOutDelayTimeout = null);
+  }
+}
+function normalizeDelay(delay, min, fallback) {
+  return min === void 0 && (min = 0), fallback === void 0 && (fallback = 0), Math.max(min, delay ?? fallback);
+}
+function getTouchFromResponderEvent(event) {
+  const _event$nativeEvent = event.nativeEvent, changedTouches = _event$nativeEvent.changedTouches, touches = _event$nativeEvent.touches;
+  return touches != null && touches.length > 0 ? touches[0] : changedTouches != null && changedTouches.length > 0 ? changedTouches[0] : event.nativeEvent;
+}
+//# sourceMappingURL=PressResponder.js.map

package/dist/cjs/index.js

@@ -0,0 +1,39 @@
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf, __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: !0 });
+}, __copyProps = (to, from, except, desc) => {
+  if (from && typeof from == "object" || typeof from == "function")
+    for (let key of __getOwnPropNames(from))
+      !__hasOwnProp.call(to, key) && key !== except && __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: !0 }) : target,
+  mod
+)), __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: !0 }), mod);
+var src_exports = {};
+__export(src_exports, {
+  usePressEvents: () => usePressEvents
+});
+module.exports = __toCommonJS(src_exports);
+var import_react = __toESM(require("react")), import_PressResponder = __toESM(require("./PressResponder"));
+function usePressEvents(_, config) {
+  const pressResponderRef = import_react.default.useRef(null);
+  pressResponderRef.current == null && (pressResponderRef.current = new import_PressResponder.default(config));
+  const pressResponder = pressResponderRef.current;
+  return import_react.default.useEffect(() => {
+    pressResponder.configure(config);
+  }, [config, pressResponder]), import_react.default.useEffect(() => () => {
+    pressResponder.reset();
+  }, [pressResponder]), import_react.default.useDebugValue(config), pressResponder.getEventHandlers();
+}
+//# sourceMappingURL=index.js.map

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tamagui/react-native-use-pressable",
-  "version": "1.116.1",
+  "version": "1.116.3",
   "types": "./types/index.d.ts",
   "main": "dist/cjs",
   "module": "dist/esm",
@@ -29,7 +29,7 @@
     }
   },
   "devDependencies": {
-    "@tamagui/build": "1.116.1",
+    "@tamagui/build": "1.116.3",
     "react": "^18.2.0 || ^19.0.0"
   },
   "publishConfig": {