react-native-gesture-handler 3.0.0-beta.1 → 3.0.0-beta.3

package/src/v3/hooks/utils/eventUtils.ts

@@ -1,21 +1,24 @@
-import { NativeSyntheticEvent } from 'react-native';
-import {
+import type { NativeSyntheticEvent } from 'react-native';
+
+import type { GestureTouchEvent } from '../../../handlers/gestureHandlerCommon';
+import { tagMessage } from '../../../utils';
+import type {
   AnimatedEvent,
   BaseGestureConfig,
   ChangeCalculatorType,
   DiffCalculatorType,
+  GestureEvent,
   GestureHandlerEventWithHandlerData,
   GestureStateChangeEventWithHandlerData,
   GestureUpdateEventWithHandlerData,
-  GestureEvent,
 } from '../../types';
-import { GestureTouchEvent } from '../../../handlers/gestureHandlerCommon';
-import { tagMessage } from '../../../utils';
 
-function isNativeEvent<THandlerData>(
-  event: GestureHandlerEventWithHandlerData<THandlerData>
+function isNativeEvent<THandlerData, TExtendedHandlerData extends THandlerData>(
+  event: GestureHandlerEventWithHandlerData<THandlerData, TExtendedHandlerData>
 ): event is
-  | NativeSyntheticEvent<GestureUpdateEventWithHandlerData<THandlerData>>
+  | NativeSyntheticEvent<
+      GestureUpdateEventWithHandlerData<TExtendedHandlerData>
+    >
   | NativeSyntheticEvent<GestureStateChangeEventWithHandlerData<THandlerData>>
   | NativeSyntheticEvent<GestureTouchEvent> {
   'worklet';
@@ -23,11 +26,14 @@ function isNativeEvent<THandlerData>(
   return 'nativeEvent' in event;
 }
 
-export function maybeExtractNativeEvent<THandlerData>(
-  event: GestureHandlerEventWithHandlerData<THandlerData>
+export function maybeExtractNativeEvent<
+  THandlerData,
+  TExtendedHandlerData extends THandlerData,
+>(
+  event: GestureHandlerEventWithHandlerData<THandlerData, TExtendedHandlerData>
 ):
   | GestureTouchEvent
-  | GestureUpdateEventWithHandlerData<THandlerData>
+  | GestureUpdateEventWithHandlerData<TExtendedHandlerData>
   | GestureStateChangeEventWithHandlerData<THandlerData> {
   'worklet';
 
@@ -44,9 +50,15 @@ export function flattenAndFilterEvent<THandlerData>(
   return { handlerTag: event.handlerTag, ...event.handlerData };
 }
 
-export function isEventForHandlerWithTag<THandlerData>(
+export function isEventForHandlerWithTag<
+  THandlerData,
+  TExtendedHandlerData extends THandlerData,
+>(
   handlerTag: number,
-  event: GestureUpdateEventWithHandlerData<THandlerData> | GestureTouchEvent
+  event:
+    | GestureStateChangeEventWithHandlerData<THandlerData>
+    | GestureUpdateEventWithHandlerData<TExtendedHandlerData>
+    | GestureTouchEvent
 ) {
   'worklet';
 
@@ -83,9 +95,11 @@ export function checkMappingForChangeProperties(animatedEvent: AnimatedEvent) {
   }
 }
 
-export function shouldHandleTouchEvents<THandlerData, TConfig>(
-  config: BaseGestureConfig<THandlerData, TConfig>
-) {
+export function shouldHandleTouchEvents<
+  TConfig,
+  THandlerData,
+  TExtendedHandlerData extends THandlerData,
+>(config: BaseGestureConfig<TConfig, THandlerData, TExtendedHandlerData>) {
   return (
     !!config.onTouchesDown ||
     !!config.onTouchesMove ||
@@ -94,13 +108,13 @@ export function shouldHandleTouchEvents<THandlerData, TConfig>(
   );
 }
 
-export function getChangeEventCalculator<THandlerData>(
-  diffCalculator: DiffCalculatorType<THandlerData>
-): ChangeCalculatorType<THandlerData> {
+export function getChangeEventCalculator<TExtendedHandlerData>(
+  diffCalculator: DiffCalculatorType<TExtendedHandlerData>
+): ChangeCalculatorType<TExtendedHandlerData> {
   'worklet';
   return (
-    current: GestureUpdateEventWithHandlerData<THandlerData>,
-    previous?: GestureUpdateEventWithHandlerData<THandlerData>
+    current: GestureUpdateEventWithHandlerData<TExtendedHandlerData>,
+    previous?: GestureUpdateEventWithHandlerData<TExtendedHandlerData>
   ) => {
     'worklet';
     const currentEventData = current.handlerData;
@@ -113,3 +127,31 @@ export function getChangeEventCalculator<THandlerData>(
     return current;
   };
 }
+
+export function isTouchEvent<
+  THandlerData,
+  TExtendedHandlerData extends THandlerData,
+>(
+  event:
+    | GestureStateChangeEventWithHandlerData<THandlerData>
+    | GestureUpdateEventWithHandlerData<TExtendedHandlerData>
+    | GestureTouchEvent
+): event is GestureTouchEvent {
+  'worklet';
+
+  return 'allTouches' in event;
+}
+
+export function isStateChangeEvent<
+  THandlerData,
+  TExtendedHandlerData extends THandlerData,
+>(
+  event:
+    | GestureStateChangeEventWithHandlerData<THandlerData>
+    | GestureUpdateEventWithHandlerData<TExtendedHandlerData>
+    | GestureTouchEvent
+): event is GestureStateChangeEventWithHandlerData<THandlerData> {
+  'worklet';
+
+  return 'oldState' in event && event.oldState !== undefined;
+}

package/src/v3/hooks/utils/index.ts

@@ -3,41 +3,36 @@ export {
   prepareConfigForNativeSide,
   useClonedAndRemappedConfig,
 } from './configUtils';
-
 export {
-  useMemoizedGestureCallbacks,
-  touchEventTypeToCallbackType,
   runCallback,
+  touchEventTypeToCallbackType,
+  useMemoizedGestureCallbacks,
 } from './eventHandlersUtils';
-
 export {
-  maybeExtractNativeEvent,
+  checkMappingForChangeProperties,
   flattenAndFilterEvent,
+  getChangeEventCalculator,
   isEventForHandlerWithTag,
   isNativeAnimatedEvent,
-  checkMappingForChangeProperties,
+  maybeExtractNativeEvent,
   shouldHandleTouchEvents,
-  getChangeEventCalculator,
 } from './eventUtils';
-
+export {
+  allowedNativeProps,
+  EMPTY_WHITE_LIST,
+  HandlerCallbacks,
+  NativeWrapperProps,
+  PropsToFilter,
+  PropsWhiteLists,
+} from './propsWhiteList';
 export {
   bindSharedValues,
-  unbindSharedValues,
   hasWorkletEventHandlers,
   maybeUnpackValue,
+  unbindSharedValues,
 } from './reanimatedUtils';
-
 export {
+  containsDuplicates,
   isComposedGesture,
   prepareRelations,
-  containsDuplicates,
 } from './relationUtils';
-
-export {
-  allowedNativeProps,
-  NativeWrapperProps,
-  HandlerCallbacks,
-  PropsToFilter,
-  PropsWhiteLists,
-  EMPTY_WHITE_LIST,
-} from './propsWhiteList';

package/src/v3/hooks/utils/propsWhiteList.ts

@@ -1,19 +1,19 @@
-import {
+import type {
   BaseGestureConfig,
   CommonGestureConfig,
   ExternalRelations,
   GestureCallbacks,
   HandlersPropsWhiteList,
   InternalConfigProps,
-  SingleGestureName,
 } from '../../types';
-import { NativeWrapperProperties } from '../../types/NativeWrapperType';
-import { FlingNativeProperties } from '../gestures/fling/FlingProperties';
-import { HoverNativeProperties } from '../gestures/hover/HoverProperties';
-import { LongPressNativeProperties } from '../gestures/longPress/LongPressProperties';
-import { NativeHandlerNativeProperties } from '../gestures/native/NativeProperties';
-import { PanNativeProperties } from '../gestures/pan/PanProperties';
-import { TapNativeProperties } from '../gestures/tap/TapProperties';
+import { SingleGestureName } from '../../types';
+import type { NativeWrapperProperties } from '../../types/NativeWrapperType';
+import { FlingNativeProperties } from '../gestures/fling/FlingTypes';
+import { HoverNativeProperties } from '../gestures/hover/HoverTypes';
+import { LongPressNativeProperties } from '../gestures/longPress/LongPressTypes';
+import { NativeHandlerNativeProperties } from '../gestures/native/NativeTypes';
+import { PanNativeProperties } from '../gestures/pan/PanTypes';
+import { TapNativeProperties } from '../gestures/tap/TapTypes';
 
 const CommonConfig = new Set<keyof CommonGestureConfig>([
   'enabled',
@@ -52,7 +52,7 @@ if (!__DEV__) {
 }
 
 export const HandlerCallbacks = new Set<
-  keyof Required<GestureCallbacks<unknown>>
+  keyof Required<GestureCallbacks<unknown, unknown>>
 >([
   'onBegin',
   'onActivate',
@@ -65,16 +65,25 @@ export const HandlerCallbacks = new Set<
   'onTouchesCancel',
 ]);
 
-export const PropsToFilter = new Set<BaseGestureConfig<unknown, unknown>>([
+export const PropsToFilter = new Set<
+  BaseGestureConfig<unknown, unknown, unknown>
+>([
   ...HandlerCallbacks,
   ...ExternalRelationsConfig,
 
   // Config props
+  'fillInDefaultValues',
   'changeEventCalculator',
   'disableReanimated',
   'shouldUseReanimatedDetector',
   'useAnimated',
   'runOnJS',
+
+  // Pan offset props before remapping:
+  'activeOffsetY',
+  'failOffsetX',
+  'failOffsetY',
+  'activeOffsetX',
 ]);
 
 export const PropsWhiteLists = new Map<
@@ -91,7 +100,9 @@ export const PropsWhiteLists = new Map<
 
 export const EMPTY_WHITE_LIST = new Set<string>();
 
-export const NativeWrapperProps = new Set<keyof NativeWrapperProperties>([
+export const NativeWrapperProps = new Set<
+  keyof NativeWrapperProperties<unknown>
+>([
   ...CommonConfig,
   ...HandlerCallbacks,
   ...NativeHandlerNativeProperties,

package/src/v3/hooks/utils/reanimatedUtils.ts

@@ -1,6 +1,6 @@
-import { NativeProxy } from '../../NativeProxy';
 import { Reanimated } from '../../../handlers/gestures/reanimatedWrapper';
-import {
+import { NativeProxy } from '../../NativeProxy';
+import type {
   BaseGestureConfig,
   GestureCallbacks,
   SharedValue,
@@ -26,8 +26,12 @@ const SHARED_VALUE_OFFSET = 1.618;
 // Don't transfer entire NativeProxy to the UI thread
 const { updateGestureHandlerConfig } = NativeProxy;
 
-export function bindSharedValues<THandlerData, TConfig>(
-  config: BaseGestureConfig<THandlerData, TConfig>,
+export function bindSharedValues<
+  TConfig,
+  THandlerData,
+  TExtendedHandlerData extends THandlerData,
+>(
+  config: BaseGestureConfig<TConfig, THandlerData, TExtendedHandlerData>,
   handlerTag: number
 ) {
   if (Reanimated === undefined) {
@@ -64,8 +68,12 @@ export function bindSharedValues<THandlerData, TConfig>(
   }
 }
 
-export function unbindSharedValues<THandlerData, TConfig>(
-  config: BaseGestureConfig<THandlerData, TConfig>,
+export function unbindSharedValues<
+  TConfig,
+  THandlerData,
+  TExtendedHandlerData extends THandlerData,
+>(
+  config: BaseGestureConfig<TConfig, THandlerData, TExtendedHandlerData>,
   handlerTag: number
 ) {
   if (Reanimated === undefined) {
@@ -88,12 +96,16 @@ export function unbindSharedValues<THandlerData, TConfig>(
   }
 }
 
-export function hasWorkletEventHandlers<THandlerData, TConfig>(
-  config: BaseGestureConfig<THandlerData, TConfig>
-) {
+export function hasWorkletEventHandlers<
+  TConfig,
+  THandlerData,
+  TExtendedHandlerData extends THandlerData,
+>(config: BaseGestureConfig<TConfig, THandlerData, TExtendedHandlerData>) {
   return Object.entries(config).some(
     ([key, value]) =>
-      HandlerCallbacks.has(key as keyof GestureCallbacks<unknown>) &&
+      HandlerCallbacks.has(
+        key as keyof GestureCallbacks<THandlerData, TExtendedHandlerData>
+      ) &&
       typeof value === 'function' &&
       '__workletHash' in value
   );

package/src/v3/hooks/utils/relationUtils.ts

@@ -1,12 +1,12 @@
-import {
+import type {
   ComposedGesture,
   ExternalRelations,
   Gesture,
   GestureRelations,
 } from '../../types';
 
-export function isComposedGesture<THandlerData, TConfig>(
-  gesture: Gesture<THandlerData, TConfig> | ComposedGesture
+export function isComposedGesture<TConfig, THandlerData>(
+  gesture: Gesture<TConfig, THandlerData> | ComposedGesture
 ): gesture is ComposedGesture {
   return 'handlerTags' in gesture;
 }

package/src/v3/index.ts

@@ -1,77 +1,83 @@
+export type {
+  BaseButtonProps,
+  BorderlessButtonProps,
+  RawButtonProps,
+  RectButtonProps,
+  TouchableProps,
+} from './components';
+export {
+  BaseButton,
+  BorderlessButton,
+  FlatList,
+  Pressable,
+  RawButton,
+  RectButton,
+  RefreshControl,
+  ScrollView,
+  Switch,
+  TextInput,
+  Touchable,
+} from './components';
 export type { GestureDetectorProps } from './detectors';
 export {
   GestureDetector,
-  VirtualGestureDetector,
-  InterceptingGestureDetector,
   GestureDetectorType,
+  InterceptingGestureDetector,
+  VirtualGestureDetector,
 } from './detectors';
-
+export { GestureStateManager } from './gestureStateManager';
 export type {
-  TapGesture,
-  TapGestureConfig,
-  TapGestureEvent,
   FlingGesture,
+  FlingGestureActiveEvent,
   FlingGestureConfig,
   FlingGestureEvent,
-  LongPressGesture,
-  LongPressGestureConfig,
-  LongPressGestureEvent,
-  PinchGesture,
-  PinchGestureConfig,
-  PinchGestureEvent,
-  RotationGesture,
-  RotationGestureConfig,
-  RotationGestureEvent,
   HoverGesture,
+  HoverGestureActiveEvent,
   HoverGestureConfig,
   HoverGestureEvent,
+  LongPressGesture,
+  LongPressGestureActiveEvent,
+  LongPressGestureConfig,
+  LongPressGestureEvent,
   ManualGesture,
+  ManualGestureActiveEvent,
   ManualGestureConfig,
   ManualGestureEvent,
   NativeGesture,
-  NativeViewGestureConfig,
+  NativeGestureActiveEvent,
+  NativeGestureConfig,
   NativeGestureEvent,
   PanGesture,
+  PanGestureActiveEvent,
   PanGestureConfig,
   PanGestureEvent,
+  PinchGesture,
+  PinchGestureActiveEvent,
+  PinchGestureConfig,
+  PinchGestureEvent,
+  RotationGesture,
+  RotationGestureActiveEvent,
+  RotationGestureConfig,
+  RotationGestureEvent,
   SingleGesture,
   SingleGestureEvent,
+  TapGesture,
+  TapGestureActiveEvent,
+  TapGestureConfig,
+  TapGestureEvent,
 } from './hooks';
 export {
-  useSimultaneousGestures,
-  useExclusiveGestures,
   useCompetingGestures,
-  useTapGesture,
+  useExclusiveGestures,
   useFlingGesture,
-  useLongPressGesture,
-  usePinchGesture,
-  useRotationGesture,
   useHoverGesture,
+  useLongPressGesture,
   useManualGesture,
   useNativeGesture,
   usePanGesture,
+  usePinchGesture,
+  useRotationGesture,
+  useSimultaneousGestures,
+  useTapGesture,
 } from './hooks';
-
-export type {
-  RawButtonProps,
-  BaseButtonProps,
-  RectButtonProps,
-  BorderlessButtonProps,
-} from './components';
-export {
-  RawButton,
-  BaseButton,
-  RectButton,
-  BorderlessButton,
-  PureNativeButton,
-  Pressable,
-  ScrollView,
-  Switch,
-  TextInput,
-  FlatList,
-  RefreshControl,
-} from './components';
-
 export type { ComposedGesture } from './types';
-
-export { GestureStateManager } from './gestureStateManager';

package/src/v3/types/ConfigTypes.ts

@@ -1,4 +1,4 @@
-import {
+import type {
   ActiveCursor,
   GestureTouchEvent,
   HitSlop,
@@ -6,34 +6,40 @@ import {
   TouchAction,
   UserSelect,
 } from '../../handlers/gestureHandlerCommon';
-import {
+import type {
   AnimatedEvent,
   ChangeCalculatorType,
+  GestureEndEvent,
   GestureEvent,
 } from './EventTypes';
-import { WithSharedValue } from './ReanimatedTypes';
+import type { WithSharedValue } from './ReanimatedTypes';
 
 export type GestureEventCallback<THandlerData> = (
   event: GestureEvent<THandlerData>
 ) => void;
 
-export type GestureEventCallbackWithDidSucceed<THandlerData> = (
-  event: GestureEvent<THandlerData>,
-  didSucceed: boolean
+export type GestureEndEventCallback<THandlerData> = (
+  event: GestureEndEvent<THandlerData>
 ) => void;
 
 export type GestureTouchEventCallback = (event: GestureTouchEvent) => void;
 
-export type GestureCallbacks<THandlerData> = {
-  onBegin?: GestureEventCallback<THandlerData>;
-  onActivate?: GestureEventCallback<THandlerData>;
-  onDeactivate?: GestureEventCallbackWithDidSucceed<THandlerData>;
-  onFinalize?: GestureEventCallbackWithDidSucceed<THandlerData>;
-  onUpdate?: GestureEventCallback<THandlerData> | AnimatedEvent;
-  onTouchesDown?: GestureTouchEventCallback;
-  onTouchesMove?: GestureTouchEventCallback;
-  onTouchesUp?: GestureTouchEventCallback;
-  onTouchesCancel?: GestureTouchEventCallback;
+export type GestureCallbacks<
+  THandlerData,
+  TExtendedHandlerData extends THandlerData = THandlerData,
+> = {
+  onBegin?: GestureEventCallback<THandlerData> | undefined;
+  onActivate?: GestureEventCallback<TExtendedHandlerData> | undefined;
+  onUpdate?:
+    | GestureEventCallback<TExtendedHandlerData>
+    | AnimatedEvent
+    | undefined;
+  onDeactivate?: GestureEndEventCallback<TExtendedHandlerData> | undefined;
+  onFinalize?: GestureEndEventCallback<THandlerData> | undefined;
+  onTouchesDown?: GestureTouchEventCallback | undefined;
+  onTouchesMove?: GestureTouchEventCallback | undefined;
+  onTouchesUp?: GestureTouchEventCallback | undefined;
+  onTouchesCancel?: GestureTouchEventCallback | undefined;
 };
 
 export type GestureRelations = {
@@ -42,31 +48,36 @@ export type GestureRelations = {
   blocksHandlers: number[];
 };
 
-export type InternalConfigProps<THandlerData> = {
-  shouldUseReanimatedDetector?: boolean;
-  dispatchesReanimatedEvents?: boolean;
-  dispatchesAnimatedEvents?: boolean;
-  needsPointerData?: boolean;
-  userSelect?: UserSelect;
-  touchAction?: TouchAction;
-  enableContextMenu?: boolean;
-  changeEventCalculator?: ChangeCalculatorType<THandlerData>;
+export type InternalConfigProps<TExtendedHandlerData> = {
+  shouldUseReanimatedDetector?: boolean | undefined;
+  dispatchesReanimatedEvents?: boolean | undefined;
+  dispatchesAnimatedEvents?: boolean | undefined;
+  needsPointerData?: boolean | undefined;
+  userSelect?: UserSelect | undefined;
+  touchAction?: TouchAction | undefined;
+  enableContextMenu?: boolean | undefined;
+  changeEventCalculator?:
+    | ChangeCalculatorType<TExtendedHandlerData>
+    | undefined;
+  fillInDefaultValues?:
+    | ((event: GestureEvent<TExtendedHandlerData>) => void)
+    | undefined;
 };
 
 export type CommonGestureConfig = {
-  disableReanimated?: boolean;
-  useAnimated?: boolean;
-  testID?: string;
+  disableReanimated?: boolean | undefined;
+  useAnimated?: boolean | undefined;
+  testID?: string | undefined;
 } & WithSharedValue<
   {
-    runOnJS?: boolean;
-    enabled?: boolean;
-    shouldCancelWhenOutside?: boolean;
-    hitSlop?: HitSlop;
-    activeCursor?: ActiveCursor;
-    mouseButton?: MouseButton;
-    cancelsTouchesInView?: boolean;
-    manualActivation?: boolean;
+    runOnJS?: boolean | undefined;
+    enabled?: boolean | undefined;
+    shouldCancelWhenOutside?: boolean | undefined;
+    hitSlop?: HitSlop | undefined;
+    activeCursor?: ActiveCursor | undefined;
+    mouseButton?: MouseButton | undefined;
+    cancelsTouchesInView?: boolean | undefined;
+    manualActivation?: boolean | undefined;
   },
   ActiveCursor | MouseButton
 >;

package/src/v3/types/DetectorTypes.ts

@@ -1,27 +1,49 @@
-import {
+import type {
+  TouchAction,
+  UserSelect,
+} from '../../handlers/gestureHandlerCommon';
+import type {
   AnimatedEvent,
-  GestureUpdateEventWithHandlerData,
   GestureHandlerEventWithHandlerData,
+  GestureUpdateEventWithHandlerData,
 } from './EventTypes';
 
-export type DetectorCallbacks<THandlerData> = {
+export type DetectorCallbacks<
+  THandlerData,
+  TExtendedHandlerData extends THandlerData = THandlerData,
+> = {
   jsEventHandler:
     | undefined
-    | ((event: GestureHandlerEventWithHandlerData<THandlerData>) => void);
+    | ((
+        event: GestureHandlerEventWithHandlerData<
+          THandlerData,
+          TExtendedHandlerData
+        >
+      ) => void);
   reanimatedEventHandler:
     | undefined
-    | ((event: GestureHandlerEventWithHandlerData<THandlerData>) => void);
+    | ((
+        event: GestureHandlerEventWithHandlerData<
+          THandlerData,
+          TExtendedHandlerData
+        >
+      ) => void);
   animatedEventHandler:
     | undefined
     | AnimatedEvent
-    | ((event: GestureUpdateEventWithHandlerData<THandlerData>) => void);
+    | ((
+        event: GestureUpdateEventWithHandlerData<TExtendedHandlerData>
+      ) => void);
 };
 
 export type VirtualChild = {
   viewTag: number;
   handlerTags: number[];
-  methods: DetectorCallbacks<unknown>;
+  methods: DetectorCallbacks<unknown, unknown>;
 
   // only set on web
   viewRef: unknown;
+  userSelect?: UserSelect | undefined;
+  touchAction?: TouchAction | undefined;
+  enableContextMenu?: boolean | undefined;
 };