Callbacks

Long press lifecycle callbacks

Structure

All callbacks (including main callback function) has the same structure.

Pseudocode

callbackFn(event, meta): void

TypeScript

type LongPressCallback<Target extends Element = Element, Context = unknown> = (
  event: LongPressEvent<Target>,
  meta: LongPressCallbackMeta<Context>
) => void

As a first argument callback receives React event from a proper handler (e.g. onMouseDown) and as second receives meta object with following structure:

Pseudocode

Pseudocode

{ [context: any], [reason: string] }

TypeScript

export type LongPressCallbackMeta<Context = unknown> = { 
    context?: Context; 
    reason?: LongPressCallbackReason 
};

Both object properties are optional.

Context

context will be present if you pass it to bind function. See context for more info.

Reason

reason will be present in onCancel callback to indicate why long press was cancelled.

Here is a list of all possible reason values

Javascript

'cancelled-by-movement' | 'cancelled-by-release' | 'cancelled-outside-element'

TypeScript

export enum LongPressCallbackReason {
  /**
   * Returned when mouse / touch / pointer was moved outside initial press area when _cancelOnMovement_ is active
   */
  CancelledByMovement = 'cancelled-by-movement',
  /**
   * Returned when click / tap / point was released before long press detection time threshold
   */
  CancelledByRelease = 'cancelled-by-release',
  /**
   * Returned when mouse / touch / pointer was moved outside element and _cancelOutsideElement_ option was set to `true`
   */
  CancelledOutsideElement = 'cancelled-outside-element',
}

Press started

On move

Press finished

Long press cancelled