dillon1000/react
Commit
Browse files [react-events] Tap responder (#16628)
This is a partial replacement for the 'Press' responder: 1. `useTap` is scoped to pointers (no keyboard support). Our current thinking is that "responders" should be limited to working with pointers, and that they can be combined with 'useKeyboard' in user-space. For example, we might create a 'usePress' hook in user-space that combines 'useTap' with 'useKeyboard' to react to both pointers and keyboard interactions. 2. `useTap` cancels the gesture once the pointer moves over an element that is not within the responder target's subtree. This differs from `usePress` (and React Native), where the gesture remains active after the pointer exits the target's subtree and is restarted once the pointer reenters. One of the drawbacks with the `usePress` behavior is that it requires repeatedly measuring DOM elements (which can cause jank) to perform hit region tests. `useTap` avoids doing this and relies on `document.elementFromPoint` only to support the TouchEvent fallbacks. 3. `useTap` calls `onTapUpdate` when the active gesture's state changes, `onTapEnd` when the gesture successfully completes. and `onTapCancel` when it fails. There is no `onTap` callback. `usePress` did not explicitly report back when the gesture failed, and product developers were confused about the difference between `onPress` and `onPressEnd`. 4. `useTap` explicitly separates the PointerEvent implementation from the MouseEvent/TouchEvent fallback. 5. `useTap` has better unit test coverage . All pointer types and the fallback environment are tested. The shape of the gesture state object is also defined and tested.
Changed paths14 files
First-parent comparisonpackages/react-dom/src/events/DOMEventResponderSystem.js ModifiedA packages/react-events/npm/tap.js AddedM packages/react-events/package.json ModifiedM packages/react-events/src/dom/Press.js ModifiedA packages/react-events/src/dom/Tap.js AddedA packages/react-events/src/dom/__tests__/Tap-test.internal.js AddedA packages/react-events/src/dom/shared/index.js AddedM packages/react-events/src/dom/testing-library/domEnvironment.js ModifiedM packages/react-events/src/dom/testing-library/domEventSequences.js ModifiedM packages/react-events/src/dom/testing-library/domEvents.js ModifiedM packages/react-events/src/dom/testing-library/index.js ModifiedA packages/react-events/tap.js AddedM packages/shared/ReactDOMTypes.js ModifiedM scripts/rollup/bundles.js ModifiedPatch
Files changed
Rendering syntax-highlighted changes…