react-native-gesture-handler 2.17.1 → 2.18.0

package/src/components/GestureButtons.tsx

@@ -1,12 +1,5 @@
 import * as React from 'react';
-import {
-  Animated,
-  Platform,
-  processColor,
-  StyleSheet,
-  StyleProp,
-  ViewStyle,
-} from 'react-native';
+import { Animated, Platform, processColor, StyleSheet } from 'react-native';
 
 import createNativeWrapper from '../handlers/createNativeWrapper';
 import GestureHandlerButton from './GestureHandlerButton';
@@ -16,118 +9,15 @@ import {
   GestureEvent,
   HandlerStateChangeEvent,
 } from '../handlers/gestureHandlerCommon';
-import {
-  NativeViewGestureHandlerPayload,
-  NativeViewGestureHandlerProps,
-} from '../handlers/NativeViewGestureHandler';
-
-export interface RawButtonProps extends NativeViewGestureHandlerProps {
-  /**
-   * Defines if more than one button could be pressed simultaneously. By default
-   * set true.
-   */
-  exclusive?: boolean;
-  // TODO: we should transform props in `createNativeWrapper`
-
-  /**
-   * Android only.
-   *
-   * Defines color of native ripple animation used since API level 21.
-   */
-  rippleColor?: any; // it was present in BaseButtonProps before but is used here in code
-
-  /**
-   * Android only.
-   *
-   * Defines radius of native ripple animation used since API level 21.
-   */
-  rippleRadius?: number | null;
-
-  /**
-   * Android only.
-   *
-   * Set this to true if you want the ripple animation to render outside the view bounds.
-   */
-  borderless?: boolean;
-
-  /**
-   * Android only.
-   *
-   * Defines whether the ripple animation should be drawn on the foreground of the view.
-   */
-  foreground?: boolean;
-
-  /**
-   * Android only.
-   *
-   * Set this to true if you don't want the system to play sound when the button is pressed.
-   */
-  touchSoundDisabled?: boolean;
-}
-
-interface ButtonWithRefProps {
-  innerRef?: React.ForwardedRef<React.ComponentType<any>>;
-}
-
-export interface BaseButtonProps extends RawButtonProps {
-  /**
-   * Called when the button gets pressed (analogous to `onPress` in
-   * `TouchableHighlight` from RN core).
-   */
-  onPress?: (pointerInside: boolean) => void;
-
-  /**
-   * Called when the button gets pressed and is held for `delayLongPress`
-   * milliseconds.
-   */
-  onLongPress?: () => void;
-
-  /**
-   * Called when button changes from inactive to active and vice versa. It
-   * passes active state as a boolean variable as a first parameter for that
-   * method.
-   */
-  onActiveStateChange?: (active: boolean) => void;
-  style?: StyleProp<ViewStyle>;
-  testID?: string;
-
-  /**
-   * Delay, in milliseconds, after which the `onLongPress` callback gets called.
-   * Defaults to 600.
-   */
-  delayLongPress?: number;
-}
-
-interface BaseButtonWithRefProps extends BaseButtonProps, ButtonWithRefProps {}
-
-export interface RectButtonProps extends BaseButtonProps {
-  /**
-   * Background color that will be dimmed when button is in active state.
-   */
-  underlayColor?: string;
-
-  /**
-   * iOS only.
-   *
-   * Opacity applied to the underlay when button is in active state.
-   */
-  activeOpacity?: number;
-}
-
-interface RectButtonWithRefProps extends RectButtonProps, ButtonWithRefProps {}
-
-export interface BorderlessButtonProps extends BaseButtonProps {
-  /**
-   * iOS only.
-   *
-   * Opacity applied to the button when it is in an active state.
-   */
-  activeOpacity?: number;
-}
-
-interface BorderlessButtonWithRefProps
-  extends BorderlessButtonProps,
-    ButtonWithRefProps {}
+import type { NativeViewGestureHandlerPayload } from '../handlers/GestureHandlerEventPayload';
+import type {
+  BaseButtonWithRefProps,
+  BaseButtonProps,
+  RectButtonWithRefProps,
+  RectButtonProps,
+  BorderlessButtonWithRefProps,
+  BorderlessButtonProps,
+} from './GestureButtonsProps';
 
 export const RawButton = createNativeWrapper(GestureHandlerButton, {
   shouldCancelWhenOutside: false,
@@ -166,7 +56,7 @@ class InnerBaseButton extends React.Component<BaseButtonWithRefProps> {
       this.lastActive &&
       this.props.onPress
     ) {
-      this.props.onPress(active);
+      this.props.onPress(pointerInside);
     }
 
     if (
@@ -183,7 +73,7 @@ class InnerBaseButton extends React.Component<BaseButtonWithRefProps> {
         );
       }
     } else if (
-      // cancel longpress timeout if it's set and the finger moved out of the view
+      // Cancel longpress timeout if it's set and the finger moved out of the view
       state === State.ACTIVE &&
       !pointerInside &&
       this.longPressTimeout !== undefined
@@ -191,7 +81,7 @@ class InnerBaseButton extends React.Component<BaseButtonWithRefProps> {
       clearTimeout(this.longPressTimeout);
       this.longPressTimeout = undefined;
     } else if (
-      // cancel longpress timeout if it's set and the gesture has finished
+      // Cancel longpress timeout if it's set and the gesture has finished
       this.longPressTimeout !== undefined &&
       (state === State.END ||
         state === State.CANCELLED ||

package/src/components/GestureButtonsProps.ts

@@ -0,0 +1,115 @@
+import * as React from 'react';
+import { StyleProp, ViewStyle } from 'react-native';
+import type { NativeViewGestureHandlerProps } from '../handlers/NativeViewGestureHandler';
+
+export interface RawButtonProps extends NativeViewGestureHandlerProps {
+  /**
+   * Defines if more than one button could be pressed simultaneously. By default
+   * set true.
+   */
+  exclusive?: boolean;
+  // TODO: we should transform props in `createNativeWrapper`
+  /**
+   * Android only.
+   *
+   * Defines color of native ripple animation used since API level 21.
+   */
+  rippleColor?: any; // it was present in BaseButtonProps before but is used here in code
+
+  /**
+   * Android only.
+   *
+   * Defines radius of native ripple animation used since API level 21.
+   */
+  rippleRadius?: number | null;
+
+  /**
+   * Android only.
+   *
+   * Set this to true if you want the ripple animation to render outside the view bounds.
+   */
+  borderless?: boolean;
+
+  /**
+   * Android only.
+   *
+   * Defines whether the ripple animation should be drawn on the foreground of the view.
+   */
+  foreground?: boolean;
+
+  /**
+   * Android only.
+   *
+   * Set this to true if you don't want the system to play sound when the button is pressed.
+   */
+  touchSoundDisabled?: boolean;
+
+  /**
+   * Style object, use it to set additional styles.
+   */
+  style?: StyleProp<ViewStyle>;
+}
+interface ButtonWithRefProps {
+  innerRef?: React.ForwardedRef<React.ComponentType<any>>;
+}
+
+export interface BaseButtonProps extends RawButtonProps {
+  /**
+   * Called when the button gets pressed (analogous to `onPress` in
+   * `TouchableHighlight` from RN core).
+   */
+  onPress?: (pointerInside: boolean) => void;
+
+  /**
+   * Called when the button gets pressed and is held for `delayLongPress`
+   * milliseconds.
+   */
+  onLongPress?: () => void;
+
+  /**
+   * Called when button changes from inactive to active and vice versa. It
+   * passes active state as a boolean variable as a first parameter for that
+   * method.
+   */
+  onActiveStateChange?: (active: boolean) => void;
+  style?: StyleProp<ViewStyle>;
+  testID?: string;
+
+  /**
+   * Delay, in milliseconds, after which the `onLongPress` callback gets called.
+   * Defaults to 600.
+   */
+  delayLongPress?: number;
+}
+export interface BaseButtonWithRefProps
+  extends BaseButtonProps,
+    ButtonWithRefProps {}
+
+export interface RectButtonProps extends BaseButtonProps {
+  /**
+   * Background color that will be dimmed when button is in active state.
+   */
+  underlayColor?: string;
+
+  /**
+   * iOS only.
+   *
+   * Opacity applied to the underlay when button is in active state.
+   */
+  activeOpacity?: number;
+}
+export interface RectButtonWithRefProps
+  extends RectButtonProps,
+    ButtonWithRefProps {}
+
+export interface BorderlessButtonProps extends BaseButtonProps {
+  /**
+   * iOS only.
+   *
+   * Opacity applied to the button when it is in an active state.
+   */
+  activeOpacity?: number;
+}
+export interface BorderlessButtonWithRefProps
+  extends BorderlessButtonProps,
+    ButtonWithRefProps {}

package/src/components/GestureComponents.tsx

@@ -67,7 +67,7 @@ export const ScrollView = React.forwardRef<
     />
   );
 });
-// backward type compatibility with https://github.com/software-mansion/react-native-gesture-handler/blob/db78d3ca7d48e8ba57482d3fe9b0a15aa79d9932/react-native-gesture-handler.d.ts#L440-L457
+// Backward type compatibility with https://github.com/software-mansion/react-native-gesture-handler/blob/db78d3ca7d48e8ba57482d3fe9b0a15aa79d9932/react-native-gesture-handler.d.ts#L440-L457
 // include methods of wrapped components by creating an intersection type with the RN component instead of duplicating them.
 // eslint-disable-next-line @typescript-eslint/no-redeclare
 export type ScrollView = typeof GHScrollView & RNScrollView;

package/src/components/GestureHandlerButton.tsx

@@ -1,5 +1,5 @@
 import { HostComponent } from 'react-native';
-import { RawButtonProps } from './GestureButtons';
+import type { RawButtonProps } from './GestureButtonsProps';
 import RNGestureHandlerButtonNativeComponent from '../specs/RNGestureHandlerButtonNativeComponent';
 
 export default RNGestureHandlerButtonNativeComponent as HostComponent<RawButtonProps>;

package/src/components/GestureHandlerRootView.android.tsx

@@ -12,7 +12,7 @@ export default function GestureHandlerRootView({
   style,
   ...rest
 }: GestureHandlerRootViewProps) {
-  // try initialize fabric on the first render, at this point we can
+  // Try initialize fabric on the first render, at this point we can
   // reliably check if fabric is enabled (the function contains a flag
   // to make sure it's called only once)
   maybeInitializeFabric();

package/src/components/GestureHandlerRootView.tsx

@@ -11,7 +11,7 @@ export default function GestureHandlerRootView({
   style,
   ...rest
 }: GestureHandlerRootViewProps) {
-  // try initialize fabric on the first render, at this point we can
+  // Try initialize fabric on the first render, at this point we can
   // reliably check if fabric is enabled (the function contains a flag
   // to make sure it's called only once)
   maybeInitializeFabric();