react-native-screen-transitions 1.0.1 → 1.0.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (8) hide show
  1. package/README.md +4 -4
  2. package/dist/index.d.mts +5 -5
  3. package/dist/index.d.ts +5 -5
  4. package/dist/index.js +205 -216
  5. package/dist/index.js.map +1 -1
  6. package/dist/index.mjs +192 -203
  7. package/dist/index.mjs.map +1 -1
  8. package/package.json +3 -1
package/README.md CHANGED
@@ -4,11 +4,11 @@
4
4
  | iOS | Android |
5
5
  |---------|---------|
6
6
  |<video src="https://github.com/user-attachments/assets/8a7b8006-f165-4a78-b0f9-c94cddd948b9" width="300" controls></video>|<video src="https://github.com/user-attachments/assets/ddebdaa8-a929-43ab-b857-08a00e142343" width="300" controls></video>|
7
-
7
+
8
8
 
9
9
  **WIP**: This package is a work-in-progress. It provides customizable screen transition animations for React Native apps, primarily designed for use with `expo-router` and `react-navigation`. It supports gestures, predefined presets, and custom animations, making it easy to add polished transitions to your navigation flows.
10
10
 
11
- This library is inspired by the transition system in `@react-navigation/stack` (not the native stack). If you're familiar with how transitions work there (e.g., using interpolators), you'll find this similar.
11
+ This library is inspired by the transition system in `@react-navigation/stack` (not the native stack). If you're familiar with how transitions work there (e.g., using interpolators), you'll find this similar.
12
12
 
13
13
 
14
14
 
@@ -334,11 +334,11 @@ export default function B() {
334
334
  ### Known Issues and Roadmap
335
335
  This is a WIP package, so expect improvements. Current known issues:
336
336
  - **Gestures with ScrollViews**: Gestures can be wonky when combined with scrollable content. For example, if a screen defines vertical dismissal gestures and contains a vertical `ScrollView`, the gesture may not trigger reliably (conflicts with scroll handling).
337
+ - **Gestures Dismisall with Nested Navigators**: When using nested navigators with gesture dismissal enabled, dismissing a nested screen via gesture may cause the transparent modal to appear dismissed while remaining open. This affects the visual state but not the actual navigation state.
337
338
  - **Web Support**: Not intended or tested for web—focus is on mobile (iOS/Android). Web may have issues with gestures and animations.
338
- - **Other**: Limited testing in complex nested navigators; potential edge cases with rapid transitions.
339
339
 
340
340
 
341
- ### Note:
341
+ ### Note:
342
342
 
343
343
  This package is something I'll work on in my freetime. However, you can see the roadmap I plan on following in the coming future.
344
344
 
package/dist/index.d.mts CHANGED
@@ -61,7 +61,7 @@ interface ScreenInterpolationProps {
61
61
  };
62
62
  /** The safe area insets for the screen. */
63
63
  insets: EdgeInsets;
64
- /** A flag indicating if the current route is in the process of closing. */
64
+ /** A flag indicating if the current screen is in the process of closing. */
65
65
  closing: boolean;
66
66
  }
67
67
  type GestureValues = {
@@ -152,7 +152,7 @@ declare const _default: {
152
152
  id?: string | react_native_reanimated.SharedValue<string | undefined> | undefined;
153
153
  needsOffscreenAlphaCompositing?: boolean | react_native_reanimated.SharedValue<boolean | undefined> | undefined;
154
154
  onLayout?: ((event: react_native.LayoutChangeEvent) => void) | react_native_reanimated.SharedValue<((event: react_native.LayoutChangeEvent) => void) | undefined> | undefined;
155
- pointerEvents?: "box-none" | "none" | "box-only" | "auto" | react_native_reanimated.SharedValue<"box-none" | "none" | "box-only" | "auto" | undefined> | undefined;
155
+ pointerEvents?: "auto" | "none" | "box-none" | "box-only" | react_native_reanimated.SharedValue<"auto" | "none" | "box-none" | "box-only" | undefined> | undefined;
156
156
  removeClippedSubviews?: boolean | react_native_reanimated.SharedValue<boolean | undefined> | undefined;
157
157
  testID?: string | react_native_reanimated.SharedValue<string | undefined> | undefined;
158
158
  nativeID?: string | react_native_reanimated.SharedValue<string | undefined> | undefined;
@@ -254,7 +254,7 @@ declare const _default: {
254
254
  id?: string | react_native_reanimated.SharedValue<string | undefined> | undefined;
255
255
  needsOffscreenAlphaCompositing?: boolean | react_native_reanimated.SharedValue<boolean | undefined> | undefined;
256
256
  onLayout?: ((event: react_native.LayoutChangeEvent) => void) | react_native_reanimated.SharedValue<((event: react_native.LayoutChangeEvent) => void) | undefined> | undefined;
257
- pointerEvents?: "box-none" | "none" | "box-only" | "auto" | react_native_reanimated.SharedValue<"box-none" | "none" | "box-only" | "auto" | undefined> | undefined;
257
+ pointerEvents?: "auto" | "none" | "box-none" | "box-only" | react_native_reanimated.SharedValue<"auto" | "none" | "box-none" | "box-only" | undefined> | undefined;
258
258
  removeClippedSubviews?: boolean | react_native_reanimated.SharedValue<boolean | undefined> | undefined;
259
259
  testID?: string | react_native_reanimated.SharedValue<string | undefined> | undefined;
260
260
  nativeID?: string | react_native_reanimated.SharedValue<string | undefined> | undefined;
@@ -357,7 +357,7 @@ declare const _default: {
357
357
  id?: string | react_native_reanimated.SharedValue<string | undefined> | undefined;
358
358
  needsOffscreenAlphaCompositing?: boolean | react_native_reanimated.SharedValue<boolean | undefined> | undefined;
359
359
  onLayout?: ((event: react_native.LayoutChangeEvent) => void) | react_native_reanimated.SharedValue<((event: react_native.LayoutChangeEvent) => void) | undefined> | undefined;
360
- pointerEvents?: "box-none" | "none" | "box-only" | "auto" | react_native_reanimated.SharedValue<"box-none" | "none" | "box-only" | "auto" | undefined> | undefined;
360
+ pointerEvents?: "auto" | "none" | "box-none" | "box-only" | react_native_reanimated.SharedValue<"auto" | "none" | "box-none" | "box-only" | undefined> | undefined;
361
361
  removeClippedSubviews?: boolean | react_native_reanimated.SharedValue<boolean | undefined> | undefined;
362
362
  testID?: string | react_native_reanimated.SharedValue<string | undefined> | undefined;
363
363
  nativeID?: string | react_native_reanimated.SharedValue<string | undefined> | undefined;
@@ -479,7 +479,7 @@ declare const _default: {
479
479
  id?: string | react_native_reanimated.SharedValue<string | undefined> | undefined;
480
480
  needsOffscreenAlphaCompositing?: boolean | react_native_reanimated.SharedValue<boolean | undefined> | undefined;
481
481
  onLayout?: ((event: react_native.LayoutChangeEvent) => void) | react_native_reanimated.SharedValue<((event: react_native.LayoutChangeEvent) => void) | undefined> | undefined;
482
- pointerEvents?: "box-none" | "none" | "box-only" | "auto" | react_native_reanimated.SharedValue<"box-none" | "none" | "box-only" | "auto" | undefined> | undefined;
482
+ pointerEvents?: "auto" | "none" | "box-none" | "box-only" | react_native_reanimated.SharedValue<"auto" | "none" | "box-none" | "box-only" | undefined> | undefined;
483
483
  removeClippedSubviews?: boolean | react_native_reanimated.SharedValue<boolean | undefined> | undefined;
484
484
  testID?: string | react_native_reanimated.SharedValue<string | undefined> | undefined;
485
485
  nativeID?: string | react_native_reanimated.SharedValue<string | undefined> | undefined;
package/dist/index.d.ts CHANGED
@@ -61,7 +61,7 @@ interface ScreenInterpolationProps {
61
61
  };
62
62
  /** The safe area insets for the screen. */
63
63
  insets: EdgeInsets;
64
- /** A flag indicating if the current route is in the process of closing. */
64
+ /** A flag indicating if the current screen is in the process of closing. */
65
65
  closing: boolean;
66
66
  }
67
67
  type GestureValues = {
@@ -152,7 +152,7 @@ declare const _default: {
152
152
  id?: string | react_native_reanimated.SharedValue<string | undefined> | undefined;
153
153
  needsOffscreenAlphaCompositing?: boolean | react_native_reanimated.SharedValue<boolean | undefined> | undefined;
154
154
  onLayout?: ((event: react_native.LayoutChangeEvent) => void) | react_native_reanimated.SharedValue<((event: react_native.LayoutChangeEvent) => void) | undefined> | undefined;
155
- pointerEvents?: "box-none" | "none" | "box-only" | "auto" | react_native_reanimated.SharedValue<"box-none" | "none" | "box-only" | "auto" | undefined> | undefined;
155
+ pointerEvents?: "auto" | "none" | "box-none" | "box-only" | react_native_reanimated.SharedValue<"auto" | "none" | "box-none" | "box-only" | undefined> | undefined;
156
156
  removeClippedSubviews?: boolean | react_native_reanimated.SharedValue<boolean | undefined> | undefined;
157
157
  testID?: string | react_native_reanimated.SharedValue<string | undefined> | undefined;
158
158
  nativeID?: string | react_native_reanimated.SharedValue<string | undefined> | undefined;
@@ -254,7 +254,7 @@ declare const _default: {
254
254
  id?: string | react_native_reanimated.SharedValue<string | undefined> | undefined;
255
255
  needsOffscreenAlphaCompositing?: boolean | react_native_reanimated.SharedValue<boolean | undefined> | undefined;
256
256
  onLayout?: ((event: react_native.LayoutChangeEvent) => void) | react_native_reanimated.SharedValue<((event: react_native.LayoutChangeEvent) => void) | undefined> | undefined;
257
- pointerEvents?: "box-none" | "none" | "box-only" | "auto" | react_native_reanimated.SharedValue<"box-none" | "none" | "box-only" | "auto" | undefined> | undefined;
257
+ pointerEvents?: "auto" | "none" | "box-none" | "box-only" | react_native_reanimated.SharedValue<"auto" | "none" | "box-none" | "box-only" | undefined> | undefined;
258
258
  removeClippedSubviews?: boolean | react_native_reanimated.SharedValue<boolean | undefined> | undefined;
259
259
  testID?: string | react_native_reanimated.SharedValue<string | undefined> | undefined;
260
260
  nativeID?: string | react_native_reanimated.SharedValue<string | undefined> | undefined;
@@ -357,7 +357,7 @@ declare const _default: {
357
357
  id?: string | react_native_reanimated.SharedValue<string | undefined> | undefined;
358
358
  needsOffscreenAlphaCompositing?: boolean | react_native_reanimated.SharedValue<boolean | undefined> | undefined;
359
359
  onLayout?: ((event: react_native.LayoutChangeEvent) => void) | react_native_reanimated.SharedValue<((event: react_native.LayoutChangeEvent) => void) | undefined> | undefined;
360
- pointerEvents?: "box-none" | "none" | "box-only" | "auto" | react_native_reanimated.SharedValue<"box-none" | "none" | "box-only" | "auto" | undefined> | undefined;
360
+ pointerEvents?: "auto" | "none" | "box-none" | "box-only" | react_native_reanimated.SharedValue<"auto" | "none" | "box-none" | "box-only" | undefined> | undefined;
361
361
  removeClippedSubviews?: boolean | react_native_reanimated.SharedValue<boolean | undefined> | undefined;
362
362
  testID?: string | react_native_reanimated.SharedValue<string | undefined> | undefined;
363
363
  nativeID?: string | react_native_reanimated.SharedValue<string | undefined> | undefined;
@@ -479,7 +479,7 @@ declare const _default: {
479
479
  id?: string | react_native_reanimated.SharedValue<string | undefined> | undefined;
480
480
  needsOffscreenAlphaCompositing?: boolean | react_native_reanimated.SharedValue<boolean | undefined> | undefined;
481
481
  onLayout?: ((event: react_native.LayoutChangeEvent) => void) | react_native_reanimated.SharedValue<((event: react_native.LayoutChangeEvent) => void) | undefined> | undefined;
482
- pointerEvents?: "box-none" | "none" | "box-only" | "auto" | react_native_reanimated.SharedValue<"box-none" | "none" | "box-only" | "auto" | undefined> | undefined;
482
+ pointerEvents?: "auto" | "none" | "box-none" | "box-only" | react_native_reanimated.SharedValue<"auto" | "none" | "box-none" | "box-only" | undefined> | undefined;
483
483
  removeClippedSubviews?: boolean | react_native_reanimated.SharedValue<boolean | undefined> | undefined;
484
484
  testID?: string | react_native_reanimated.SharedValue<string | undefined> | undefined;
485
485
  nativeID?: string | react_native_reanimated.SharedValue<string | undefined> | undefined;