react-swipe-hook
TypeScript icon, indicating that this package has built-in type declarations

0.1.2 • Public • Published

react-swipe-hook

A hook for running callbacks on swipe

Api

Params

  1. minimumDistance
  2. onSwipeUp
  3. onSwipeRight
  4. onSwipeDown
  5. onSwipeLeft

Returns

Array of onTouchStart and onTouchEnd event handlers.

Example usage

const ExampleComp = () => {
  const [output, setOutput] = useState('no output')
  const [onTouchStart, onTouchEnd] = useSwipeCallback(
    40, //the minimum swipe distance
    () => setOutput('The user swiped up!'),
    () => setOutput('The user swiped right!'),
    () => setOutput('The user swiped down!'),
    () => setOutput('The user swiped left!')
  )
 
  return (
    <>
      <div
        data-testid="swipe-area"
        onTouchStart={onTouchStart}
        onTouchEnd={onTouchEnd}
      />
      <div data-testid="test-output">{output}</div>
    </>
  )
}

Readme

Keywords

none

Package Sidebar

Install

npm i react-swipe-hook

Weekly Downloads

2

Version

0.1.2

License

MIT

Unpacked Size

13.9 kB

Total Files

10

Last publish

Collaborators

  • eric.lambrecht