react-native-screen-transitions 4.1.0-alpha.0 → 4.1.0-beta.0

package/src/components/screen-lifecycle/index.tsx

@@ -1,44 +0,0 @@
-import { useDescriptorsStore } from "../../providers/screen/descriptors";
-import { AnimationStore } from "../../stores/animation.store";
-import { SystemStore } from "../../stores/system.store";
-import { useScreenHistory } from "./hooks/history/use-screen-history";
-import { useCloseCompletion } from "./hooks/use-close-completion";
-import { useCloseTransitionIntent } from "./hooks/use-close-transition-intent";
-import { useOpenTransitionIntent } from "./hooks/use-open-transition-intent";
-import { useTransitionStartController } from "./hooks/use-transition-start-controller";
-
-interface Props {
-	children: React.ReactNode;
-}
-
-/**
- * Unified lifecycle controller for all stack types.
- * Reads current/previous descriptors from DescriptorsProvider context.
- */
-export const ScreenLifecycle = ({ children }: Props) => {
-	const current = useDescriptorsStore((store) => store.descriptors.current);
-	const previous = useDescriptorsStore((store) => store.descriptors.previous);
-
-	const animations = AnimationStore.getBag(current.route.key);
-	const system = SystemStore.getBag(current.route.key);
-
-	const { completeClose } = useCloseTransitionIntent(current);
-
-	useOpenTransitionIntent(current, animations, system);
-
-	useTransitionStartController({
-		current,
-		animations,
-		system,
-	});
-
-	useCloseCompletion({
-		closing: animations.closing,
-		animationProgress: system.animationProgress,
-		onComplete: completeClose,
-	});
-
-	useScreenHistory(current, previous, animations);
-
-	return children;
-};

package/src/components/stack-view.tsx

@@ -1,79 +0,0 @@
-import { memo } from "react";
-import { ScreenComposer } from "../providers/screen/screen-composer";
-import {
-	BlankStackProvider,
-	useBlankStackStore,
-} from "../providers/stack/blank-stack.provider";
-import {
-	type StackCoreConfig,
-	StackCoreProvider,
-} from "../providers/stack/core.provider";
-import type { BlankStackProviderProps } from "../types/providers/blank-stack-provider.types";
-import { ActivityContainer, ActivityScreen } from "./activity";
-import { PortalProvider } from "./boundary/portal";
-import { Overlay } from "./overlay";
-
-interface RouteKeyProps {
-	routeKey: string;
-}
-
-const BlankSceneContent = memo(function BlankSceneContent({
-	routeKey,
-}: RouteKeyProps) {
-	const render = useBlankStackStore(
-		(store) => store?.scenesByKey[routeKey]?.descriptor.render,
-	);
-
-	return render?.();
-});
-
-const BlankSceneRow = memo(function BlankSceneRow({ routeKey }: RouteKeyProps) {
-	return (
-		<ActivityScreen routeKey={routeKey}>
-			<ScreenComposer routeKey={routeKey}>
-				<BlankSceneContent routeKey={routeKey} />
-			</ScreenComposer>
-		</ActivityScreen>
-	);
-});
-
-const StackViewContent = memo(function StackViewContent() {
-	const routeKeys = useBlankStackStore((store) => store?.routeKeys);
-
-	return (
-		<PortalProvider>
-			<Overlay.Float />
-
-			<ActivityContainer>
-				{routeKeys.map((routeKey) => (
-					<BlankSceneRow key={routeKey} routeKey={routeKey} />
-				))}
-			</ActivityContainer>
-		</PortalProvider>
-	);
-});
-
-type StackViewProps = BlankStackProviderProps & StackCoreConfig;
-
-export const StackView = memo(function StackView({
-	TRANSITIONS_ALWAYS_ON,
-	state,
-	navigation,
-	descriptors,
-}: StackViewProps) {
-	return (
-		<StackCoreProvider
-			config={{
-				TRANSITIONS_ALWAYS_ON: TRANSITIONS_ALWAYS_ON ?? true,
-			}}
-		>
-			<BlankStackProvider
-				state={state}
-				navigation={navigation}
-				descriptors={descriptors}
-			>
-				<StackViewContent />
-			</BlankStackProvider>
-		</StackCoreProvider>
-	);
-});

package/src/custom-navigator.ts

@@ -1,25 +0,0 @@
-export {
-	BlankStackHost,
-	type BlankStackHostProps,
-} from "./components/blank-stack-host";
-export {
-	BlankStackRuntime,
-	type BlankStackRuntimeProps,
-} from "./components/blank-stack-runtime";
-export {
-	BlankStackScene,
-	type BlankStackSceneProps,
-} from "./components/blank-stack-scene";
-export {
-	type BlankStackState,
-	useBlankStackState,
-} from "./hooks/navigation/use-blank-stack-state";
-export type { BlankStackStandardNavigatorProps } from "./navigators/create-blank-stack-navigator";
-export {
-	type StackTransition,
-	useStackTransition,
-} from "./providers/stack/stack-transition";
-export type {
-	BlankStackNavigationEventMap,
-	BlankStackNavigationOptions,
-} from "./types/blank-stack.types";

package/src/hooks/navigation/use-blank-stack-state.ts

@@ -1,24 +0,0 @@
-import { useMemo } from "react";
-import { useBlankStackStore } from "../../providers/stack/blank-stack.provider";
-import type { BlankStackStoreValue } from "../../types/providers/blank-stack-provider.types";
-
-export type BlankStackState = Pick<
-	BlankStackStoreValue,
-	"focusedIndex" | "routeKeys" | "routes" | "scenes"
->;
-
-/**
- * Reads the durable scene state produced by Blank Stack without prescribing
- * how those scenes are presented.
- */
-export const useBlankStackState = (): BlankStackState => {
-	const focusedIndex = useBlankStackStore((store) => store.focusedIndex);
-	const routeKeys = useBlankStackStore((store) => store.routeKeys);
-	const routes = useBlankStackStore((store) => store.routes);
-	const scenes = useBlankStackStore((store) => store.scenes);
-
-	return useMemo(
-		() => ({ focusedIndex, routeKeys, routes, scenes }),
-		[focusedIndex, routeKeys, routes, scenes],
-	);
-};

package/src/providers/helpers/measured-bounds-writes.ts

@@ -1,73 +0,0 @@
-import type { MeasuredDimensions, StyleProps } from "react-native-reanimated";
-import { setEntry } from "../../stores/bounds/internals/entries";
-import { setDestination, setSource } from "../../stores/bounds/internals/links";
-import type { ScreenPairKey } from "../../stores/bounds/types";
-
-type LinkWrite =
-	| {
-			type: "source";
-			pairKey: ScreenPairKey;
-	  }
-	| {
-			type: "destination";
-			pairKey: ScreenPairKey;
-	  };
-
-type ApplyMeasuredBoundsWritesParams = {
-	entryTag: string;
-	linkId: string;
-	group?: string;
-	currentScreenKey: string;
-	measured: MeasuredDimensions;
-	preparedStyles: StyleProps;
-	linkWrite?: LinkWrite;
-	handoff?: boolean;
-	escapeClipping?: boolean;
-};
-
-export const applyMeasuredBoundsWrites = (
-	params: ApplyMeasuredBoundsWritesParams,
-) => {
-	"worklet";
-	const {
-		entryTag,
-		linkId,
-		group,
-		currentScreenKey,
-		measured,
-		preparedStyles,
-		linkWrite,
-		handoff,
-		escapeClipping,
-	} = params;
-
-	// Set the bounds entry on every measure to avoid any stale measurements
-	// for the public read API.
-	setEntry(entryTag, currentScreenKey, {
-		bounds: measured,
-	});
-
-	if (linkWrite?.type === "source") {
-		setSource(
-			linkWrite.pairKey,
-			linkId,
-			currentScreenKey,
-			measured,
-			preparedStyles,
-			group,
-			{ handoff, escapeClipping },
-		);
-	}
-
-	if (linkWrite?.type === "destination") {
-		setDestination(
-			linkWrite.pairKey,
-			linkId,
-			currentScreenKey,
-			measured,
-			preparedStyles,
-			group,
-			{ handoff },
-		);
-	}
-};

package/src/providers/screen/animation/animation.provider.tsx

@@ -1,54 +0,0 @@
-import { type ReactNode, useMemo } from "react";
-import type { BoundsAccessor } from "../../../types/bounds.types";
-import { createBoundsAccessor } from "../../../utils/bounds";
-import createProvider from "../../../utils/create-provider";
-import { useBlankStackStore } from "../../stack/blank-stack.provider";
-import { useDescriptorsStore } from "../descriptors";
-import { useScreenAnimationPipeline } from "./helpers/pipeline";
-
-type Props = {
-	children: ReactNode;
-};
-
-export type ScreenAnimationContextValue = ReturnType<
-	typeof useScreenAnimationPipeline
-> & {
-	boundsAccessor: BoundsAccessor;
-};
-
-export const {
-	StoreProvider: ScreenAnimationStoreProvider,
-	ScreenAnimationProvider,
-	useOptionalScreenAnimationStore,
-	useScreenAnimationStore,
-} = createProvider("ScreenAnimation", {
-	global: true,
-})<Props, ScreenAnimationContextValue>(() => {
-	const currentScreenKey = useDescriptorsStore(
-		(store) => store.derivations.currentScreenKey,
-	);
-	const isClosing = useBlankStackStore(
-		(store) => store.scenesByKey[currentScreenKey]?.activity === "closing",
-	);
-	const pipeline = useScreenAnimationPipeline();
-
-	const { screenInterpolatorProps } = pipeline;
-
-	const boundsAccessor = useMemo(
-		() =>
-			createBoundsAccessor(() => {
-				"worklet";
-				return screenInterpolatorProps.get();
-			}),
-		[screenInterpolatorProps],
-	);
-
-	return {
-		key: currentScreenKey,
-		unregisterOnCleanup: isClosing,
-		value: {
-			...pipeline,
-			boundsAccessor,
-		},
-	};
-});

package/src/providers/screen/animation/helpers/build-screen-transition-options.ts

@@ -1,27 +0,0 @@
-import type {
-	ScreenTransitionConfig,
-	ScreenTransitionOptions,
-} from "../../../../types";
-import { resolveSheetScrollGestureBehavior } from "../../../../utils/resolve-screen-transition-options";
-
-export const buildScreenTransitionOptions = (
-	options: ScreenTransitionConfig,
-): ScreenTransitionOptions => {
-	return {
-		navigationMaskEnabled: options.navigationMaskEnabled,
-		gestureEnabled: options.gestureEnabled,
-		gestureTracking: options.gestureTracking,
-		gestureDirection: options.gestureDirection,
-		gestureSensitivity: options.gestureSensitivity,
-		gestureVelocityImpact: options.gestureVelocityImpact,
-		gestureSnapVelocityImpact: options.gestureSnapVelocityImpact,
-		gestureReleaseVelocityScale: options.gestureReleaseVelocityScale,
-		gestureSnapLocked: options.gestureSnapLocked,
-		sheetSnapBehavior: options.sheetSnapBehavior,
-		sheetScrollGestureBehavior:
-			options.sheetScrollGestureBehavior !== undefined
-				? resolveSheetScrollGestureBehavior(options)
-				: undefined,
-		backdropBehavior: options.backdropBehavior,
-	};
-};

package/src/providers/screen/animation/helpers/has-transitions-enabled.ts

@@ -1,14 +0,0 @@
-import type { ScreenTransitionConfig } from "../../../../types";
-
-/**
- * Helper for compatibility with NativeStack. Native stack integration requires
- * the `enableTransitions` prop for creating custom animations, however, blank
- * stack animations are always on.
- */
-export const hasTransitionsEnabled = (
-	options: ScreenTransitionConfig | undefined,
-	alwaysOn: boolean,
-) => {
-	if (alwaysOn) return true;
-	return !!(options as any)?.enableTransitions;
-};

package/src/providers/screen/animation/helpers/hydrate-transition-state/gesture-progress.ts

@@ -1,192 +0,0 @@
-import { clamp } from "react-native-reanimated";
-import { DEFAULT_GESTURE_DIRECTION, EPSILON } from "../../../../../constants";
-import type {
-	GestureDirectionOption,
-	GestureValues,
-} from "../../../../../types/gesture.types";
-import type { SheetSnapBehavior } from "../../../../../types/screen.types";
-import {
-	getPanActivationDirections,
-	getPanSnapAxisConfigForDirection,
-	getPanSnapAxisDirections,
-	getPinchGestureDirections,
-	getSnapPinchDirectionConfig,
-	isResolvedPanGestureDirection,
-} from "../../../gestures/shared/directions";
-import { resolveStepSnapProgress } from "../../../gestures/shared/snap-points";
-import type { SnapBounds } from "./types";
-
-type PanProgressDelta = {
-	x: number;
-	y: number;
-};
-
-const resolvePanGestureAffectedProgress = (
-	transitionProgress: number,
-	gesture: GestureValues,
-	progressDelta: PanProgressDelta,
-	gestureDirection: GestureDirectionOption,
-	hasSnapPoints: boolean,
-	snapBounds: SnapBounds | null,
-	snapPoints: number[],
-	sheetSnapBehavior: SheetSnapBehavior,
-) => {
-	"worklet";
-
-	if (hasSnapPoints) {
-		const activeGesture =
-			gesture.initiator === "none" ? null : gesture.initiator;
-		const activeAxis = isResolvedPanGestureDirection(activeGesture)
-			? getPanSnapAxisConfigForDirection(
-					getPanSnapAxisDirections(gestureDirection),
-					activeGesture,
-				)
-			: null;
-
-		if (!activeAxis || !snapBounds) {
-			return transitionProgress;
-		}
-
-		const axisValue =
-			activeAxis.axis === "horizontal" ? progressDelta.x : progressDelta.y;
-		const signedProgressDelta = activeAxis.config.progressSign * axisValue;
-		if (sheetSnapBehavior === "step") {
-			return resolveStepSnapProgress({
-				baseline: transitionProgress,
-				normalizedDelta: signedProgressDelta,
-				snapPoints,
-			});
-		}
-
-		return clamp(
-			transitionProgress + signedProgressDelta,
-			snapBounds.min,
-			snapBounds.max,
-		);
-	}
-
-	const directions = getPanActivationDirections({
-		gestureDirection,
-		hasSnapPoints: false,
-	});
-	let progressOffset = 0;
-
-	if (directions.horizontal && progressDelta.x > 0) {
-		progressOffset = Math.max(progressOffset, progressDelta.x);
-	}
-
-	if (directions.horizontalInverted && progressDelta.x < 0) {
-		progressOffset = Math.max(progressOffset, -progressDelta.x);
-	}
-
-	if (directions.vertical && progressDelta.y > 0) {
-		progressOffset = Math.max(progressOffset, progressDelta.y);
-	}
-
-	if (directions.verticalInverted && progressDelta.y < 0) {
-		progressOffset = Math.max(progressOffset, -progressDelta.y);
-	}
-
-	return clamp(transitionProgress - progressOffset, 0, transitionProgress);
-};
-
-const resolvePinchGestureAffectedProgress = (
-	transitionProgress: number,
-	gesture: GestureValues,
-	gestureDirection: GestureDirectionOption,
-	hasSnapPoints: boolean,
-	snapBounds: SnapBounds | null,
-	snapPoints: number[],
-	sheetSnapBehavior: SheetSnapBehavior,
-) => {
-	"worklet";
-	const pinchDirection =
-		gesture.normScale < 0
-			? "pinch-in"
-			: gesture.normScale > 0
-				? "pinch-out"
-				: null;
-
-	if (!pinchDirection) {
-		return transitionProgress;
-	}
-
-	if (hasSnapPoints) {
-		const snapDirections = getSnapPinchDirectionConfig(gestureDirection);
-		if (!snapDirections || !snapBounds) {
-			return transitionProgress;
-		}
-
-		const progressDelta =
-			snapDirections.collapse === pinchDirection
-				? -Math.abs(gesture.normScale)
-				: Math.abs(gesture.normScale);
-		if (sheetSnapBehavior === "step") {
-			return resolveStepSnapProgress({
-				baseline: transitionProgress,
-				normalizedDelta: progressDelta,
-				snapPoints,
-			});
-		}
-
-		return clamp(
-			transitionProgress + progressDelta,
-			snapBounds.min,
-			snapBounds.max,
-		);
-	}
-
-	const pinchDirections = getPinchGestureDirections(gestureDirection);
-	if (!pinchDirections.includes(pinchDirection)) {
-		return transitionProgress;
-	}
-
-	return clamp(
-		transitionProgress - Math.abs(gesture.normScale),
-		0,
-		transitionProgress,
-	);
-};
-
-export const resolveGestureAffectedProgress = (
-	transitionProgress: number,
-	gesture: GestureValues,
-	panProgressDelta: PanProgressDelta,
-	gestureDirection: GestureDirectionOption | undefined,
-	snapBounds: SnapBounds | null,
-	snapPoints: number[] = [],
-	sheetSnapBehavior: SheetSnapBehavior = "continuous",
-) => {
-	"worklet";
-	const resolvedGestureDirection =
-		gestureDirection ?? DEFAULT_GESTURE_DIRECTION;
-
-	const hasSnapPoints = snapBounds !== null;
-
-	if (
-		gesture.initiator === "pinch-in" ||
-		gesture.initiator === "pinch-out" ||
-		Math.abs(gesture.normScale) > EPSILON
-	) {
-		return resolvePinchGestureAffectedProgress(
-			transitionProgress,
-			gesture,
-			resolvedGestureDirection,
-			hasSnapPoints,
-			snapBounds,
-			snapPoints,
-			sheetSnapBehavior,
-		);
-	}
-
-	return resolvePanGestureAffectedProgress(
-		transitionProgress,
-		gesture,
-		panProgressDelta,
-		resolvedGestureDirection,
-		hasSnapPoints,
-		snapBounds,
-		snapPoints,
-		sheetSnapBehavior,
-	);
-};