react-native-screen-transitions 4.0.0-alpha.7 → 4.0.0-alpha.8

package/src/types/screen.types.ts

@@ -6,12 +6,10 @@ import type {
 	TransitionSpec,
 } from "./animation.types";
 import type {
-	GestureActivationArea,
 	GestureDirectionOption,
-	GestureProgressMode,
 	ScrollMetadataState,
 } from "./gesture.types";
-import type { OverlayProps } from "./overlay.types";
+import type { OverlayComponent } from "./overlay.types";
 
 export type Layout = {
 	width: number;
@@ -245,15 +243,6 @@ export type ScreenTransitionConfig = {
 	 */
 	gestureVelocityImpact?: number;
 
-	/**
-	 * How much velocity affects snap point targeting. Lower values make snapping
-	 * feel more deliberate (iOS-like), higher values make it more responsive to flicks.
-	 *
-	 * @deprecated Use `gestureSnapVelocityImpact` instead.
-	 * @default 0.1
-	 */
-	snapVelocityImpact?: number;
-
 	/**
 	 * How much velocity affects snap point targeting. Lower values make snapping
 	 * feel more deliberate (iOS-like), higher values make it more responsive to flicks.
@@ -266,65 +255,13 @@ export type ScreenTransitionConfig = {
 	 * Multiplies gesture release velocity used for gesture reset/handoff energy.
 	 *
 	 * This does NOT affect dismissal threshold decisions (`gestureVelocityImpact`)
-	 * or snap target selection (`snapVelocityImpact`). It changes the release
+	 * or snap target selection (`gestureSnapVelocityImpact`). It changes the release
 	 * impulse used by gesture values and interpolator handoff values.
 	 *
 	 * @default 1
 	 */
 	gestureReleaseVelocityScale?: number;
 
-	/**
-	 * Deprecated compatibility option.
-	 *
-	 * This option is no longer read by the runtime transition options. Use
-	 * `gestureReleaseVelocityScale` to tune post-release spring energy.
-	 *
-	 * @deprecated v3 compatibility only.
-	 */
-	gestureReleaseVelocityMax?: number;
-
-	/**
-	 * Deprecated compatibility option.
-	 *
-	 * Overrides the default edge-start distance when `gestureDirection` uses
-	 * `area: "edge"`. Prefer a numeric `area` on each `gestureDirection` entry.
-	 *
-	 * @example
-	 * gestureDirection: { gesture: "horizontal", area: 24 }
-	 *
-	 * @deprecated Use numeric `gestureDirection` entry `area` instead.
-	 */
-	gestureResponseDistance?: number;
-
-	/**
-	 * Deprecated compatibility option.
-	 *
-	 * Gesture movement now always contributes to `progress`. Use `transitionProgress`
-	 * in interpolators when you need transition progress without live gesture
-	 * contribution.
-	 *
-	 * @deprecated Use `transitionProgress` from interpolation state instead.
-	 */
-	gestureProgressMode?: GestureProgressMode;
-
-	/**
-	 * Deprecated compatibility alias for `gestureProgressMode`.
-	 *
-	 * Gesture movement now always contributes to `progress`. Use `transitionProgress`
-	 * in interpolators when you need transition progress without live gesture
-	 * contribution.
-	 *
-	 * @deprecated Use `transitionProgress` from interpolation state instead.
-	 */
-	gestureDrivesProgress?: boolean;
-
-	/**
-	 * The area of the screen where the gesture is activated.
-	 *
-	 * @deprecated Use `gestureDirection` entries with per-direction `area`.
-	 */
-	gestureActivationArea?: GestureActivationArea;
-
 	/**
 	 * Custom metadata passed through to animation props.
 	 *
@@ -336,7 +273,7 @@ export type ScreenTransitionConfig = {
 	/**
 	 * Function that returns a React Element to display as an overlay.
 	 */
-	overlay?: (props: OverlayProps) => React.ReactNode;
+	overlay?: OverlayComponent;
 
 	/**
 	 * Whether to show the overlay. The overlay is shown by default when `overlay` is provided.
@@ -406,15 +343,6 @@ export type ScreenTransitionConfig = {
 	 */
 	sheetScrollGestureBehavior?: SheetScrollGestureBehavior;
 
-	/**
-	 * @deprecated Use `sheetScrollGestureBehavior` instead.
-	 *
-	 * Mapping:
-	 * - `true` -> `"expand-and-collapse"`
-	 * - `false` -> `"collapse-only"`
-	 */
-	expandViaScrollView?: boolean;
-
 	/**
 	 * Locks gesture-based snap movement to the current snap point.
 	 *
@@ -478,8 +406,6 @@ export type ScreenTransitionConfig = {
 	 * a function component can receive `{ styles, props, pointerEvents, children }`
 	 * and decide how to render the layer.
 	 *
-	 * `contentComponent` replaces `surfaceComponent` for custom screen shells.
-	 *
 	 * @example
 	 * contentComponent: ({ styles, props, pointerEvents, children }) => (
 	 *   <AnimatedSquircleView
@@ -494,30 +420,4 @@ export type ScreenTransitionConfig = {
 	 * @default undefined
 	 */
 	contentComponent?: ScreenContentComponent;
-
-	/**
-	 * Custom component to render as the screen's surface layer.
-	 *
-	 * Renders inside the content animation scope (moves with the screen) as an
-	 * absolutely-positioned layer behind the screen's children.
-	 *
-	 * The library wraps this component with `Animated.createAnimatedComponent` internally.
-	 * Animated styles and props are driven by the `surface` slot in the interpolator return value.
-	 *
-	 * @example
-	 * surfaceComponent: SquircleView,
-	 * screenStyleInterpolator: ({ progress }) => {
-	 *   "worklet";
-	 *   return {
-	 *     surface: {
-	 *       style: { opacity: interpolate(progress, [0, 1], [0, 1]) },
-	 *       props: { cornerRadius: 24, cornerSmoothing: 0.7 },
-	 *     },
-	 *   };
-	 * }
-	 *
-	 * @default undefined
-	 * @deprecated Use `contentComponent` instead.
-	 */
-	surfaceComponent?: React.ComponentType<any>;
 };

package/src/types/stack.types.ts

@@ -1,5 +1,9 @@
 import type { ScreenTransitionConfig } from "./screen.types";
 
+export type StackTransitionOptions = ScreenTransitionConfig & {
+	enableTransitions?: boolean;
+};
+
 /**
  * Minimal route shape for navigation utilities.
  * Used as a generic constraint across route comparison functions.
@@ -9,7 +13,7 @@ export interface RouteWithKey {
 }
 
 /**
- * Base route interface - minimal contract all stacks satisfy.
+ * Minimal route contract shared by BlankStack and the native-stack adapter.
  * Uses `object` for params to be compatible with React Navigation's `Readonly<object | undefined>`.
  */
 export interface BaseStackRoute {
@@ -21,8 +25,7 @@ export interface BaseStackRoute {
 export type StackSceneActivity = "active" | "inert" | "inactive" | "closing";
 
 /**
- * Base navigation interface - minimal contract for gesture handling.
- * Both React Navigation helpers and ComponentNavigation satisfy this.
+ * Minimal navigation contract used by transition lifecycle code.
  */
 export interface BaseStackNavigation {
 	getState: () => {
@@ -36,27 +39,20 @@ export interface BaseStackNavigation {
 }
 
 /**
- * Base descriptor interface - generic over route, navigation, and options.
- * All stack descriptors (BlankStack, NativeStack) extend this.
+ * Descriptor contract consumed by the shared transition renderer.
  */
 export interface BaseStackDescriptor<
 	TRoute extends BaseStackRoute = BaseStackRoute,
 	TNavigation extends BaseStackNavigation = BaseStackNavigation,
-	TOptions extends ScreenTransitionConfig = ScreenTransitionConfig,
 > {
 	route: TRoute;
 	navigation: TNavigation;
-	options: TOptions;
+	options: StackTransitionOptions;
 	render?: () => React.JSX.Element | null;
 }
 
-export type StackDescriptorSource<
-	TDescriptor extends BaseStackDescriptor = BaseStackDescriptor,
-> = TDescriptor;
-
 /**
- * Base scene interface - route + descriptor pair.
- * Used by all stack views to iterate over screens.
+ * Route and descriptor pair consumed by the shared transition renderer.
  */
 export interface BaseStackScene<
 	TDescriptor extends BaseStackDescriptor = BaseStackDescriptor,
@@ -69,8 +65,7 @@ export interface BaseStackScene<
 }
 
 /**
- * Base state interface - routes array with index.
- * Common structure across all navigation states.
+ * Minimal navigation state accepted by BlankStack.
  */
 export interface BaseStackState<
 	TRoute extends BaseStackRoute = BaseStackRoute,
@@ -79,19 +74,3 @@ export interface BaseStackState<
 	index: number;
 	key: string;
 }
-
-/**
- * Generic descriptor map - keyed by route key.
- * Use this instead of defining stack-specific DescriptorMap types.
- */
-export type DescriptorMap<
-	TDescriptor extends BaseStackDescriptor = BaseStackDescriptor,
-> = {
-	[key: string]: TDescriptor;
-};
-
-export enum StackType {
-	NATIVE = "native",
-	BLANK = "blank",
-	COMPONENT = "component",
-}

package/src/utils/bounds/constants.ts

@@ -1,4 +1,4 @@
-import type { BoundsOptions } from "./types/options";
+import type { BoundsInternalOptions } from "./types/options";
 
 export const DEFAULT_BOUNDS_OPTIONS = {
 	target: "bound",
@@ -7,4 +7,4 @@ export const DEFAULT_BOUNDS_OPTIONS = {
 	scaleMode: "match",
 	anchor: "center",
 	raw: false,
-} as const satisfies Omit<BoundsOptions, "id" | "group" | "gestures">;
+} as const satisfies Omit<BoundsInternalOptions, "id" | "group" | "gestures">;

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

@@ -81,12 +81,6 @@ const createBoundsAccessorParts = ({
 				}) as BoundsStyleResult;
 			},
 			values: getValues,
-			math: <T extends BoundsComputeOptions = BoundsComputeOptions>(
-				options?: T,
-			) => {
-				"worklet";
-				return getValues(options);
-			},
 			link: (id?: BoundsIdentityInput) => {
 				"worklet";
 				const linkIdentity =

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

@@ -8,7 +8,7 @@ import type { BoundsInterpolationProps } from "../../../types/bounds.types";
 import { DEFAULT_BOUNDS_OPTIONS } from "../constants";
 import type {
 	BoundId,
-	BoundsOptions,
+	BoundsInternalOptions,
 	BoundsOptionsResult,
 } from "../types/options";
 import { createBoundTag } from "./create-bound-tag";
@@ -17,7 +17,7 @@ import { computeBoundStyles } from "./styles/compute";
 
 type BaseInterpolatorProps = BoundsInterpolationProps;
 
-type ComputeResolvedBoundsStylesParams<T extends BoundsOptions> = {
+type ComputeResolvedBoundsStylesParams<T extends BoundsInternalOptions> = {
 	props: BaseInterpolatorProps;
 	options: T;
 	resolvedPair?: ResolvedTransitionPair;
@@ -27,7 +27,7 @@ type BuildBoundsOptionsParams = {
 	props: BoundsInterpolationProps;
 	id?: BoundId;
 	group?: string;
-	overrides?: Partial<BoundsOptions>;
+	overrides?: Partial<BoundsInternalOptions>;
 };
 
 const buildBoundsOptions = ({
@@ -35,7 +35,7 @@ const buildBoundsOptions = ({
 	id,
 	group,
 	overrides,
-}: BuildBoundsOptionsParams): BoundsOptions => {
+}: BuildBoundsOptionsParams): BoundsInternalOptions => {
 	"worklet";
 
 	const tag = createBoundTag({ id, group });
@@ -75,7 +75,7 @@ export const syncActiveGroupId = (params: {
 	setActiveGroupId(pairKey, group, activeId);
 };
 
-export const prepareBoundStyles = <T extends BoundsOptions>({
+export const prepareBoundStyles = <T extends BoundsInternalOptions>({
 	props,
 	options,
 	resolvedPair,

package/src/utils/bounds/helpers/styles/composers.ts

@@ -13,8 +13,8 @@ import type {
 } from "../../types/geometry";
 import type {
 	BoundsAnchor,
+	BoundsInternalOptions,
 	BoundsMotionTransform,
-	BoundsOptions,
 } from "../../types/options";
 
 /**
@@ -29,7 +29,7 @@ export type ElementComposeParams = {
 	geometry: RelativeGeometry;
 	progress: number;
 	ranges: readonly [number, number];
-	computeOptions: BoundsOptions;
+	computeOptions: BoundsInternalOptions;
 	interpolationProps: BoundsInterpolationProps;
 };
 
@@ -46,7 +46,7 @@ type ContentComposeParams = {
 	geometry: ContentTransformGeometry;
 	progress: number;
 	ranges: readonly [number, number];
-	computeOptions: BoundsOptions;
+	computeOptions: BoundsInternalOptions;
 	interpolationProps: BoundsInterpolationProps;
 };
 
@@ -157,7 +157,7 @@ const resolveMotionTransform = ({
 	end,
 	current,
 }: {
-	computeOptions: BoundsOptions;
+	computeOptions: BoundsInternalOptions;
 	interpolationProps: BoundsInterpolationProps;
 	progress: number;
 	ranges: readonly [number, number];
@@ -496,8 +496,8 @@ export function composeTransformRelative(
 				Extrapolation.CLAMP,
 			);
 
-	const offsetX = computeOptions.offset?.x ?? computeOptions.gestures?.x ?? 0;
-	const offsetY = computeOptions.offset?.y ?? computeOptions.gestures?.y ?? 0;
+	const offsetX = computeOptions.offset?.x ?? 0;
+	const offsetY = computeOptions.offset?.y ?? 0;
 	const currentScale = getUniformScale(scaleX, scaleY);
 	const motion = resolveMotionTransform({
 		computeOptions,

package/src/utils/bounds/helpers/styles/compute.ts

@@ -14,7 +14,7 @@ import type { Layout } from "../../../../types/screen.types";
 import type {
 	BoundId,
 	BoundsComputeParams,
-	BoundsOptions,
+	BoundsInternalOptions,
 } from "../../types/options";
 import {
 	computeContentTransformGeometry,
@@ -37,7 +37,7 @@ const resolveStartEnd = (params: {
 	next?: ScreenTransitionState;
 	toRect?: Partial<MeasuredDimensions>;
 	dimensions: Layout;
-	computeOptions: BoundsOptions;
+	computeOptions: BoundsInternalOptions;
 	resolvedPair?: ResolvedTransitionPair;
 }) => {
 	"worklet";
@@ -133,7 +133,7 @@ export const computeBoundStyles = (
 		dimensions,
 		interpolationProps,
 	}: BoundsComputeParams,
-	computeOptions: BoundsOptions = { id: "bound-id" },
+	computeOptions: BoundsInternalOptions = { id: "bound-id" },
 	resolvedPair?: ResolvedTransitionPair,
 ) => {
 	"worklet";

package/src/utils/bounds/navigation/reveal/build.ts

@@ -92,7 +92,7 @@ export function buildRevealStyles({
 
 	const liveGesture = props.active.gesture;
 	const gestureHandoff = liveGesture.handoff;
-	const initialGesture = gestureHandoff.active ?? gestureHandoff.direction;
+	const initialGesture = gestureHandoff.active;
 
 	const isHorizontalDismiss =
 		initialGesture === "horizontal" || initialGesture === "horizontal-inverted";

package/src/utils/bounds/types/options.ts

@@ -141,17 +141,18 @@ type RawContentReturn = RawMotionRotation & {
 };
 
 // Conditional return type based on options
-export type BoundsOptionsResult<T extends BoundsOptions> = T["raw"] extends true
-	? T["method"] extends "size"
-		? T["space"] extends "absolute"
-			? RawSizeAbsoluteReturn
-			: RawSizeRelativeReturn
-		: T["method"] extends "content"
-			? RawContentReturn
-			: T["space"] extends "absolute"
-				? RawTransformAbsoluteReturn
-				: RawTransformRelativeReturn
-	: StyleProps;
+export type BoundsOptionsResult<T extends BoundsInternalOptions> =
+	T["raw"] extends true
+		? T["method"] extends "size"
+			? T["space"] extends "absolute"
+				? RawSizeAbsoluteReturn
+				: RawSizeRelativeReturn
+			: T["method"] extends "content"
+				? RawContentReturn
+				: T["space"] extends "absolute"
+					? RawTransformAbsoluteReturn
+					: RawTransformRelativeReturn
+		: StyleProps;
 
 export type BoundsOptions = {
 	/**
@@ -207,13 +208,6 @@ export type BoundsOptions = {
 	 */
 	progress?: number;
 
-	/**
-	 * The x/y offsets to apply to the bounds.
-	 *
-	 * @deprecated Use `offset` instead.
-	 */
-	gestures?: { x?: number; y?: number };
-
 	/**
 	 * How the bounds should be scaled between each other.
 	 * @default "match"
@@ -234,16 +228,10 @@ export type BoundsOptions = {
 	 * returned `scale` is applied to the generated width and height.
 	 */
 	motion?: BoundsMotion;
-
-	/**
-	 * If true, the raw values will be returned instead of the computed values.
-	 *
-	 * @deprecated Use `bounds(id).values(options)` instead of passing `raw`.
-	 * @default false
-	 */
-	raw?: boolean;
 };
 
+export type BoundsInternalOptions = BoundsOptions & { raw?: boolean };
+
 export type BoundsIdentity = {
 	id: BoundId;
 	group?: string;
@@ -251,17 +239,10 @@ export type BoundsIdentity = {
 
 export type BoundsIdentityInput = BoundId | BoundsIdentity;
 
-export type BoundsComputeOptions = Omit<BoundsOptions, "group" | "id" | "raw">;
+export type BoundsComputeOptions = Omit<BoundsOptions, "group" | "id">;
 
 export type BoundsStyleResult = StyleProps;
 
 export type BoundsValuesResult<
 	T extends BoundsComputeOptions = BoundsComputeOptions,
 > = BoundsOptionsResult<T & { id: BoundId; raw: true }>;
-
-/**
- * @deprecated Use {@linkcode BoundsValuesResult}.
- */
-export type BoundsMathResult<
-	T extends BoundsComputeOptions = BoundsComputeOptions,
-> = BoundsValuesResult<T>;