V1 to V2

[BREAKING CHANGE] Context support

Now hook returns function which can be called with any context in order to access it in callbacks

Before

const bind = useLongPress(() => console.log('Long pressed'));
// ...
return <button {...bind}>Click me</button>;

After

const bind = useLongPress((event, { context }) => console.log('Long pressed with', context));
// ...
return <button {...bind('I am context')}>Click me</button>;
// Or just empty function call if you don't want to pass any context
return <button {...bind()}>Click me</button>;

[NEW] Reason for cancellation

Now onCancel receives cancellation context which can be either:

  • LongPressEventReason.CANCELED_BY_TIMEOUT ('canceled-by-timeout')

  • LongPressEventReason.CANCELED_BY_MOVEMENT ('canceled-by-movement')

You can access it like this:

const bind = useLongPress(() => console.log('Long pressed'), {
  onCancel: (event, { reason }) => console.log('Cancellation reason:', reason) 
})

Last updated