react-native-screen-transitions 3.6.0-alpha.1 → 3.6.0-alpha.2

package/src/shared/stores/bounds/types.ts

@@ -7,6 +7,9 @@ import type {
 } from "../../utils/bounds/types/options";
 
 export type TagID = string;
+export type LinkKey = string;
+export type GroupKey = string;
+export type ScreenPairKey = string;
 export type { ScreenKey } from "../../types/screen.types";
 
 export type BoundaryConfig = {
@@ -37,6 +40,7 @@ export type ScreenIdentifier = {
 };
 
 export type TagLink = {
+	group?: GroupKey;
 	source: ScreenIdentifier & MeasuredEntry;
 	/** Destination side once attached; null while the source is still pending. */
 	destination: (ScreenIdentifier & MeasuredEntry) | null;
@@ -64,14 +68,20 @@ export type ResolvedTransitionPair = {
 
 export type ScreenEntry = Entry;
 
-export type TagState = {
+export type BoundaryState = {
 	screens: Record<ScreenKey, ScreenEntry>;
-	linkStack: TagLink[];
 };
 
-export type GroupState = {
-	/** Latest requested group member id from mounted grouped bounds. */
-	activeId: string;
-	/** Group member id that started the current linked transition. */
-	initialId?: string;
+export type LinkGroupState = {
+	activeId: LinkKey;
+	initialId?: LinkKey;
 };
+
+export type LinkPairState = {
+	links: Record<LinkKey, TagLink>;
+	groups: Record<GroupKey, LinkGroupState>;
+};
+
+export type LinkPairsState = Record<ScreenPairKey, LinkPairState>;
+
+export type TagState = BoundaryState;

package/src/shared/stores/gesture.store.ts

@@ -23,6 +23,7 @@ export type GestureStoreMap = {
 	y: SharedValue<number>;
 	normX: SharedValue<number>;
 	normY: SharedValue<number>;
+	velocity: SharedValue<number>;
 	scale: SharedValue<number>;
 	normScale: SharedValue<number>;
 	focalX: SharedValue<number>;
@@ -68,6 +69,7 @@ function createGestureBag(): GestureStoreMap {
 		y: makeMutable(0),
 		normX,
 		normY,
+		velocity: makeMutable(0),
 		scale,
 		normScale,
 		focalX: makeMutable(0),
@@ -108,6 +110,7 @@ export const GestureStore = createStore<GestureStoreMap>({
 		cancelAnimation(bag.y);
 		cancelAnimation(bag.normX);
 		cancelAnimation(bag.normY);
+		cancelAnimation(bag.velocity);
 		cancelAnimation(bag.scale);
 		cancelAnimation(bag.normScale);
 		cancelAnimation(bag.focalX);

package/src/shared/types/animation.types.ts

@@ -175,10 +175,6 @@ export type ScreenTransitionDepthTarget = {
 
 export type ScreenTransitionTarget = ScreenTransitionDepthTarget;
 
-export type ScreenTransitionAccessor = (
-	target?: ScreenTransitionTarget,
-) => ScreenInterpolationProps | null;
-
 export interface ScreenInterpolationProps {
 	/**
 	 * Values for the screen that came before the current one in the navigation stack.
@@ -239,20 +235,6 @@ export interface ScreenInterpolationProps {
 	 */
 	bounds: BoundsAccessor;
 
-	/**
-	 * Resolves interpolation props for this screen's transition timeline or an
-	 * ancestor transition timeline.
-	 *
-	 * Calling without a target returns the current transition.
-	 * `transition({ depth: -1 })` returns the immediate parent transition.
-	 * `transition({ depth: 1 })` returns the immediate child transition.
-	 * `transition({ depth: 0 })` returns the current transition.
-	 *
-	 * When called from a returned transition scope, targets are resolved relative
-	 * to that scope.
-	 */
-	transition: ScreenTransitionAccessor;
-
 	/**
 	 * The screen state that is currently driving the transition (either current or next, whichever is focused).
 	 */
@@ -309,11 +291,6 @@ export type TransitionSlotStyle = AnimatedViewStyle | TransitionSlotDefinition;
  */
 export type TransitionInterpolatorOptions = ScreenTransitionOptions;
 
-/**
- * @deprecated Use `TransitionInterpolatorOptions`.
- */
-export type TransitionInterpolatorConfig = TransitionInterpolatorOptions;
-
 /**
  * Internal normalized slot format.
  * Always uses the explicit `{ style, props }` shape (with Reanimated's full StyleProps).

package/src/shared/types/gesture.types.ts

@@ -66,8 +66,6 @@ export enum GestureActivationState {
 	FAILED,
 }
 
-export { GestureActivationState as GestureOffsetState };
-
 export type GestureActivationArea = ActivationArea | SideActivation;
 
 /**
@@ -107,6 +105,14 @@ export type GestureValues = {
 	 * The live normalized vertical translation of the gesture (-1 to 1).
 	 */
 	normY: number;
+	/**
+	 * A 0-1 scalar derived from the pan velocity magnitude, normalized against
+	 * a screen-relative full-flick threshold.
+	 *
+	 * This is live while dragging, frozen at release during dismiss animations,
+	 * and reset to 0 while idle or settling from a cancelled gesture.
+	 */
+	velocity: number;
 	/**
 	 * The live pinch scale after `gestureSensitivity` is applied.
 	 */

package/src/shared/types/index.ts

@@ -4,13 +4,9 @@ export type {
 	AnimationConfig,
 	ScreenInterpolationProps,
 	ScreenStyleInterpolator,
-	ScreenTransitionAccessor,
-	ScreenTransitionDepthTarget,
 	ScreenTransitionOptions,
 	ScreenTransitionState,
-	ScreenTransitionTarget,
 	TransitionInterpolatedStyle,
-	TransitionInterpolatorConfig,
 	TransitionInterpolatorOptions,
 	TransitionSlotStyle,
 	TransitionSpec,

package/src/shared/utils/bounds/helpers/create-bounds-accessor-core.ts

@@ -58,6 +58,7 @@ const createBoundsAccessorParts = ({
 		const computed = prepareBoundStyles({
 			props,
 			options,
+			syncGroupActiveId: true,
 		});
 		const scopedTag = tag ?? "";
 		const target = Object.isExtensible(computed) ? computed : { ...computed };

package/src/shared/utils/bounds/helpers/create-link-accessor.ts

@@ -1,5 +1,5 @@
 import { getEntry } from "../../../stores/bounds/internals/entries";
-import { resolveGroupLink } from "../../../stores/bounds/internals/groups";
+import { getResolvedLink } from "../../../stores/bounds/internals/links";
 import type {
 	MeasuredEntry,
 	ResolvedTransitionPair,
@@ -12,6 +12,7 @@ import type {
 } from "../../../types/bounds.types";
 import type { BoundId, BoundsOptionsResult } from "../types/options";
 import { prepareBoundStyles } from "./prepare-bound-styles";
+import { resolveBoundsPairKey } from "./resolve-bounds-pair-key";
 
 type GetProps = () => BoundsInterpolationProps;
 
@@ -52,11 +53,10 @@ export const createLinkAccessor = (getProps: GetProps): LinkAccessor => {
 		"worklet";
 		const props = getProps();
 		const stringTag = String(tag);
-		const screenKey = props.current?.route.key;
-		const resolved = resolveGroupLink({
-			tag: stringTag,
-			screenKey,
-		});
+		const pairKey = resolveBoundsPairKey(props);
+		const resolved = pairKey
+			? getResolvedLink(pairKey, stringTag)
+			: { tag: stringTag, link: null };
 		const selectedTag = resolved.tag;
 		const link = resolved.link;
 

package/src/shared/utils/bounds/helpers/prepare-bound-styles.ts

@@ -1,8 +1,5 @@
 import { getEntry } from "../../../stores/bounds/internals/entries";
-import {
-	getGroupActiveId,
-	setGroupActiveId,
-} from "../../../stores/bounds/internals/groups";
+import { setActiveGroupId } from "../../../stores/bounds/internals/links";
 import type { ResolvedTransitionPair } from "../../../stores/bounds/types";
 import type { BoundsInterpolationProps } from "../../../types/bounds.types";
 import { DEFAULT_BOUNDS_OPTIONS } from "../constants";
@@ -12,6 +9,7 @@ import type {
 	BoundsOptionsResult,
 } from "../types/options";
 import { createBoundTag } from "./create-bound-tag";
+import { resolveBoundsPairKey } from "./resolve-bounds-pair-key";
 import { computeBoundStyles } from "./styles/compute";
 
 type BaseInterpolatorProps = BoundsInterpolationProps;
@@ -57,25 +55,36 @@ const buildBoundsOptions = ({
 	return resolved;
 };
 
-const syncGroupActiveMember = (group?: string, id?: BoundId) => {
+const syncActiveGroupId = (params: {
+	props: BoundsInterpolationProps;
+	id?: BoundId;
+	group?: string;
+}) => {
 	"worklet";
-	if (!group || id == null || id === "") return;
-
-	const normalizedId = String(id);
+	const { props, id, group } = params;
+	if (id == null || id === "" || !group) return;
 
-	if (getGroupActiveId(group) === normalizedId) return;
+	const pairKey = resolveBoundsPairKey(props);
+	if (!pairKey) return;
 
-	setGroupActiveId(group, normalizedId);
+	setActiveGroupId(pairKey, group, String(id));
 };
 
 export const prepareBoundStyles = <T extends BoundsOptions>({
 	props,
 	options,
 	resolvedPair,
+	syncGroupActiveId = false,
 }: ComputeResolvedBoundsStylesParams<T>): BoundsOptionsResult<T> => {
 	"worklet";
 
-	syncGroupActiveMember(options.group, options.id);
+	if (syncGroupActiveId) {
+		syncActiveGroupId({
+			props,
+			id: options.id,
+			group: options.group,
+		});
+	}
 
 	const resolved = buildBoundsOptions({
 		props,

package/src/shared/utils/bounds/helpers/resolve-bounds-pair-key.ts

@@ -0,0 +1,22 @@
+import { createScreenPairKey } from "../../../stores/bounds/helpers/link-pairs.helpers";
+import type { ScreenPairKey } from "../../../stores/bounds/types";
+import type { BoundsInterpolationProps } from "../../../types/bounds.types";
+
+export const resolveBoundsPairKey = (
+	props: BoundsInterpolationProps,
+): ScreenPairKey | null => {
+	"worklet";
+	const currentScreenKey = props.current?.route.key;
+	const previousScreenKey = props.previous?.route.key;
+	const nextScreenKey = props.next?.route.key;
+
+	if (nextScreenKey && currentScreenKey) {
+		return createScreenPairKey(currentScreenKey, nextScreenKey);
+	}
+
+	if (previousScreenKey && currentScreenKey) {
+		return createScreenPairKey(previousScreenKey, currentScreenKey);
+	}
+
+	return null;
+};