@react-motion-router/stack 2.0.0-beta.sha-1c021e3 → 2.0.0-beta.sha-c1cce91

package/build/Navigation.d.ts

@@ -1,31 +1,32 @@
 import { NavigationBase } from '@react-motion-router/core';
-import { GoBackOptions, GoForwardOptions, NavigateOptions, NavigationBaseOptions, NavigationProps, StackRouterEventMap } from './common/types';
+import { GoBackOptions, GoForwardOptions, NavigateOptions, NavigationBaseOptions, NavigationProps, RouterEventMap } from './common/types';
 import { HistoryEntry } from './HistoryEntry';
 import { Router } from './Router';
-export declare class Navigation extends NavigationBase<StackRouterEventMap> {
+export declare class Navigation extends NavigationBase<RouterEventMap> {
     protected readonly router: Router;
     constructor(router: Router);
-    traverseTo(key: string): NavigationResult;
     replace(route: string, props?: NavigationProps, options?: NavigationBaseOptions): NavigationResult;
     push(route: string, props?: NavigationProps, options?: NavigationBaseOptions): NavigationResult;
     reload(props?: NavigationProps): NavigationResult;
+    traverseTo(key: string, options?: NavigationBaseOptions): NavigationResult;
     navigate(route: string, props?: NavigationProps, options?: NavigateOptions): NavigationResult;
     goBack(options?: GoBackOptions): NavigationResult | undefined;
     goForward(options?: GoForwardOptions): NavigationResult | undefined;
     private createBackEvent;
     private createForwardEvent;
     private createNavigateEvent;
-    get transition(): NavigationTransition | {
-        from: NavigationHistoryEntry | null;
-        finished: Promise<void>;
-        navigationType: "load";
-    } | null;
+    get committed(): Promise<NavigationHistoryEntry> | null;
+    get transition(): NavigationTransition | import("@react-motion-router/core").LoadNavigationTransition | null;
     get globalEntries(): NavigationHistoryEntry[];
     get entries(): HistoryEntry[];
     get index(): number;
     get previous(): HistoryEntry | null;
     get next(): HistoryEntry | null;
     get current(): HistoryEntry;
-    get canGoBack(): boolean;
-    get canGoForward(): boolean;
+    canGoBack(this: Navigation): this is Navigation & {
+        previous: HistoryEntry;
+    };
+    canGoForward(this: Navigation): this is Navigation & {
+        next: HistoryEntry;
+    };
 }

package/build/Router.d.ts

@@ -1,8 +1,8 @@
 import { RouterBase } from '@react-motion-router/core';
-import type { LoadEvent, NestedRouterContext, RouterBaseConfig, RouterBaseProps, RouterBaseState, ScreenChild } from '@react-motion-router/core';
+import type { ClonedElementType, LoadEvent, NestedRouterContext, RouterBaseConfig, RouterBaseProps, RouterBaseState, ScreenChild } from '@react-motion-router/core';
 import { Navigation } from './Navigation';
 import { ScreenProps, Screen, ScreenConfig } from './Screen';
-import { StackRouterEventMap, SwipeDirection } from './common/types';
+import { RouterEventMap, ScreenInternalProps, SwipeDirection } from './common/types';
 export interface RouterConfig extends RouterBaseConfig {
     screenConfig?: ScreenConfig;
     disableBrowserRouting?: boolean;
@@ -13,20 +13,22 @@ export interface RouterConfig extends RouterBaseConfig {
 export interface RouterProps extends RouterBaseProps<Screen> {
     config?: RouterConfig;
 }
+type InjectedScreenProps = Pick<ScreenInternalProps & ScreenProps, "config" | "id" | "resolvedPathname">;
 export interface RouterState extends RouterBaseState {
-    backNavigating: boolean;
     transition: NavigationTransition | LoadEvent["transition"] | null;
-    screenStack: ScreenChild<Screen>[];
+    screenStack: ClonedElementType<ScreenChild<Screen>, InjectedScreenProps>[];
     gestureDirection: SwipeDirection;
     gestureAreaWidth: number;
     gestureMinFlingVelocity: number;
     gestureHysteresis: number;
-    disableGesture: boolean;
+    gestureDisabled: boolean;
     fromKey: React.Key | null;
     destinationKey: React.Key | null;
     documentTitle?: string;
+    controller: AbortController | null;
 }
-export declare class Router extends RouterBase<RouterProps, RouterState, StackRouterEventMap> {
+export declare class Router extends RouterBase<RouterProps, RouterState, RouterEventMap> {
+    #private;
     readonly navigation: Navigation;
     constructor(props: RouterProps, context: React.ContextType<typeof NestedRouterContext>);
     static readonly defaultProps: Partial<RouterProps>;
@@ -35,16 +37,23 @@ export declare class Router extends RouterBase<RouterProps, RouterState, StackRo
         gestureAreaWidth: number;
         gestureMinFlingVelocity: number;
         gestureHysteresis: number;
-        disableGesture: boolean;
+        gestureDisabled: boolean;
         documentTitle: string | undefined;
     };
     componentDidMount(): void;
     shouldComponentUpdate(nextProps: Readonly<RouterProps>, nextState: Readonly<RouterState>): boolean;
     componentWillUnmount(): void;
+    private onNavigate;
+    private onCurrentEntryChange;
+    private onNavigateSuccess;
+    private onNavigateError;
+    private onGestureCancel;
     private canGestureNavigate;
     private onSwipeStart;
     private onSwipeEnd;
-    protected get screens(): import("react").CElement<ScreenProps, Screen>[];
+    get committed(): Promise<NavigationHistoryEntry> | null;
+    private get backNavigating();
+    protected get screens(): import("react").CElement<ScreenProps & Partial<InjectedScreenProps>, Screen & import("react").Component<ScreenProps & InjectedScreenProps, {}, any>>[];
     private screenChildFromPathname;
     private getScreenChildByPathname;
     private getScreenRefByKey;
@@ -57,3 +66,4 @@ export declare class Router extends RouterBase<RouterProps, RouterState, StackRo
     private dispatchLifecycleHandlers;
     private screenTransition;
 }
+export {};

package/build/Screen.d.ts

@@ -1,7 +1,7 @@
 import { ScreenBase } from '@react-motion-router/core';
 import type { PlainObject, RouterContext, ScreenBaseProps, ScreenBaseState, ScreenBaseComponentProps, ScreenBaseConfig } from '@react-motion-router/core';
 import { Navigation } from './Navigation';
-import { RouteProp, SwipeDirection } from './common/types';
+import { HistoryEntryState, RouteProp, ScreenInternalProps, SwipeDirection } from './common/types';
 import { Router } from './Router';
 export interface ScreenComponentProps<T extends PlainObject = {}> extends ScreenBaseComponentProps<RouteProp<T>, Navigation> {
 }
@@ -13,7 +13,7 @@ export interface ScreenConfig extends ScreenBaseConfig<RouteProp> {
     gestureAreaWidth?: number;
     gestureMinFlingVelocity?: number;
     gestureHysteresis?: number;
-    disableGesture?: boolean;
+    gestureDisabled?: boolean;
 }
 export interface ScreenProps extends ScreenBaseProps {
     config?: ScreenConfig;
@@ -21,44 +21,21 @@ export interface ScreenProps extends ScreenBaseProps {
 export interface ScreenState extends ScreenBaseState {
 }
 export declare class Screen extends ScreenBase<ScreenProps, ScreenState, RouteProp> {
-    readonly routeProp: {
-        setParams: (params: PlainObject) => void;
-        setConfig: (config: ScreenProps["config"]) => void;
-        readonly path: string;
-        readonly resolvedPathname: string | undefined;
-        readonly focused: boolean;
-        readonly config: {
-            header?: {
-                fallback?: React.ReactNode;
-                component: React.JSXElementConstructor<any> | import("@react-motion-router/core").LazyExoticComponent<any>;
-            };
-            footer?: {
-                fallback?: React.ReactNode;
-                component: React.JSXElementConstructor<any> | import("@react-motion-router/core").LazyExoticComponent<any>;
-            };
-            animation?: import("@react-motion-router/core").AnimationEffectFactory;
-            onEnter?: ((props: import("@react-motion-router/core").LifecycleProps<RouteProp<{}>, import("@react-motion-router/core").NavigationBase<import("@react-motion-router/core").RouterBaseEventMap>>) => void | Promise<void>) | ((props: import("@react-motion-router/core").LifecycleProps<import("@react-motion-router/core").RoutePropBase<{}, PlainObject<any>>, import("@react-motion-router/core").NavigationBase<import("@react-motion-router/core").RouterBaseEventMap>>) => void | Promise<void>) | undefined;
-            onExit?: ((props: import("@react-motion-router/core").LifecycleProps<RouteProp<{}>, import("@react-motion-router/core").NavigationBase<import("@react-motion-router/core").RouterBaseEventMap>>) => void | Promise<void>) | ((props: import("@react-motion-router/core").LifecycleProps<import("@react-motion-router/core").RoutePropBase<{}, PlainObject<any>>, import("@react-motion-router/core").NavigationBase<import("@react-motion-router/core").RouterBaseEventMap>>) => void | Promise<void>) | undefined;
-            onEntered?: ((props: import("@react-motion-router/core").LifecycleProps<RouteProp<{}>, import("@react-motion-router/core").NavigationBase<import("@react-motion-router/core").RouterBaseEventMap>>) => void | Promise<void>) | ((props: import("@react-motion-router/core").LifecycleProps<import("@react-motion-router/core").RoutePropBase<{}, PlainObject<any>>, import("@react-motion-router/core").NavigationBase<import("@react-motion-router/core").RouterBaseEventMap>>) => void | Promise<void>) | undefined;
-            onExited?: ((props: import("@react-motion-router/core").LifecycleProps<RouteProp<{}>, import("@react-motion-router/core").NavigationBase<import("@react-motion-router/core").RouterBaseEventMap>>) => void | Promise<void>) | ((props: import("@react-motion-router/core").LifecycleProps<import("@react-motion-router/core").RoutePropBase<{}, PlainObject<any>>, import("@react-motion-router/core").NavigationBase<import("@react-motion-router/core").RouterBaseEventMap>>) => void | Promise<void>) | undefined;
-            onLoad?: ((props: import("@react-motion-router/core").LifecycleProps<RouteProp<{}>, import("@react-motion-router/core").NavigationBase<import("@react-motion-router/core").RouterBaseEventMap>>) => void | Promise<void>) | ((props: import("@react-motion-router/core").LifecycleProps<import("@react-motion-router/core").RoutePropBase<{}, PlainObject<any>>, import("@react-motion-router/core").NavigationBase<import("@react-motion-router/core").RouterBaseEventMap>>) => void | Promise<void>) | undefined;
-            title?: string;
-            presentation?: "default" | "dialog" | "modal";
-            keepAlive?: boolean;
-            gestureDirection?: SwipeDirection;
-            gestureAreaWidth?: number;
-            gestureMinFlingVelocity?: number;
-            gestureHysteresis?: number;
-            disableGesture?: boolean;
-        };
-        readonly params: {
-            [x: string]: any;
-        };
-    };
+    #private;
     constructor(props: ScreenProps, context: React.ContextType<typeof RouterContext>);
     static getDerivedStateFromProps(props: ScreenProps): {
         elementType: string;
     };
+    protected setParams(params: PlainObject): void;
+    protected setConfig(config: NonNullable<ScreenProps["config"]>): void;
+    protected get router(): Router;
+    get internalProps(): ScreenInternalProps;
+    get resolvedPathname(): string;
+    get historyEntryState(): HistoryEntryState;
+    get id(): string;
+    get params(): {
+        [x: string]: any;
+    };
     get config(): {
         header?: {
             fallback?: React.ReactNode;
@@ -81,14 +58,43 @@ export declare class Screen extends ScreenBase<ScreenProps, ScreenState, RoutePr
         gestureAreaWidth?: number;
         gestureMinFlingVelocity?: number;
         gestureHysteresis?: number;
-        disableGesture?: boolean;
+        gestureDisabled?: boolean;
     };
-    get params(): {
-        [x: string]: any;
+    protected get routeProp(): {
+        setParams: (params: PlainObject) => void;
+        setConfig: (config: NonNullable<ScreenProps["config"]>) => void;
+        path: string;
+        resolvedPathname: string;
+        focused: boolean;
+        params: {
+            [x: string]: any;
+        };
+        config: {
+            header?: {
+                fallback?: React.ReactNode;
+                component: React.JSXElementConstructor<any> | import("@react-motion-router/core").LazyExoticComponent<any>;
+            };
+            footer?: {
+                fallback?: React.ReactNode;
+                component: React.JSXElementConstructor<any> | import("@react-motion-router/core").LazyExoticComponent<any>;
+            };
+            animation?: import("@react-motion-router/core").AnimationEffectFactory;
+            onEnter?: ((props: import("@react-motion-router/core").LifecycleProps<RouteProp<{}>, import("@react-motion-router/core").NavigationBase<import("@react-motion-router/core").RouterBaseEventMap>>) => void | Promise<void>) | ((props: import("@react-motion-router/core").LifecycleProps<import("@react-motion-router/core").RoutePropBase<{}, PlainObject<any>>, import("@react-motion-router/core").NavigationBase<import("@react-motion-router/core").RouterBaseEventMap>>) => void | Promise<void>) | undefined;
+            onExit?: ((props: import("@react-motion-router/core").LifecycleProps<RouteProp<{}>, import("@react-motion-router/core").NavigationBase<import("@react-motion-router/core").RouterBaseEventMap>>) => void | Promise<void>) | ((props: import("@react-motion-router/core").LifecycleProps<import("@react-motion-router/core").RoutePropBase<{}, PlainObject<any>>, import("@react-motion-router/core").NavigationBase<import("@react-motion-router/core").RouterBaseEventMap>>) => void | Promise<void>) | undefined;
+            onEntered?: ((props: import("@react-motion-router/core").LifecycleProps<RouteProp<{}>, import("@react-motion-router/core").NavigationBase<import("@react-motion-router/core").RouterBaseEventMap>>) => void | Promise<void>) | ((props: import("@react-motion-router/core").LifecycleProps<import("@react-motion-router/core").RoutePropBase<{}, PlainObject<any>>, import("@react-motion-router/core").NavigationBase<import("@react-motion-router/core").RouterBaseEventMap>>) => void | Promise<void>) | undefined;
+            onExited?: ((props: import("@react-motion-router/core").LifecycleProps<RouteProp<{}>, import("@react-motion-router/core").NavigationBase<import("@react-motion-router/core").RouterBaseEventMap>>) => void | Promise<void>) | ((props: import("@react-motion-router/core").LifecycleProps<import("@react-motion-router/core").RoutePropBase<{}, PlainObject<any>>, import("@react-motion-router/core").NavigationBase<import("@react-motion-router/core").RouterBaseEventMap>>) => void | Promise<void>) | undefined;
+            onLoad?: ((props: import("@react-motion-router/core").LifecycleProps<RouteProp<{}>, import("@react-motion-router/core").NavigationBase<import("@react-motion-router/core").RouterBaseEventMap>>) => void | Promise<void>) | ((props: import("@react-motion-router/core").LifecycleProps<import("@react-motion-router/core").RoutePropBase<{}, PlainObject<any>>, import("@react-motion-router/core").NavigationBase<import("@react-motion-router/core").RouterBaseEventMap>>) => void | Promise<void>) | undefined;
+            title?: string;
+            presentation?: "default" | "dialog" | "modal";
+            keepAlive?: boolean;
+            gestureDirection?: SwipeDirection;
+            gestureAreaWidth?: number;
+            gestureMinFlingVelocity?: number;
+            gestureHysteresis?: number;
+            gestureDisabled?: boolean;
+        };
     };
-    protected setParams(params: PlainObject): void;
-    protected setConfig(config: ScreenProps["config"]): void;
-    protected get router(): Router;
+    protected setHistoryState(newState: PlainObject): void;
     private onClickOutside;
     onEnter(signal: AbortSignal): Promise<void>;
     onExited(signal: AbortSignal): Promise<void>;

package/build/common/constants.d.ts

@@ -3,5 +3,5 @@ export declare const DEFAULT_GESTURE_CONFIG: {
     readonly gestureMinFlingVelocity: 400;
     readonly gestureAreaWidth: 100;
     readonly gestureDirection: "right";
-    readonly disableGesture: false;
+    readonly gestureDisabled: false;
 };

package/build/common/events.d.ts

@@ -6,23 +6,23 @@ export declare class NavigateEvent extends Event {
     readonly props: NavigationProps;
     readonly navigationType: NonNullable<NavigateOptions["type"]>;
     readonly signal: AbortSignal;
-    readonly result: NavigationResult;
+    readonly committed: Promise<NavigationHistoryEntry>;
     readonly transition: NavigationTransition;
-    constructor(routerId: string, route: string, props: NavigationProps, type: NavigateOptions["type"], signal: AbortSignal, result: NavigationResult, transition: NavigationTransition);
+    constructor(routerId: string, route: string, props: NavigationProps, type: NavigateOptions["type"], signal: AbortSignal, committed: Promise<NavigationHistoryEntry>, transition: NavigationTransition);
 }
 export declare class BackEvent extends Event {
     readonly routerId: string;
     readonly signal: AbortSignal;
-    readonly result: NavigationResult;
+    readonly committed: Promise<NavigationHistoryEntry>;
     readonly transition: NavigationTransition;
-    constructor(routerId: string, signal: AbortSignal, result: NavigationResult, transition: NavigationTransition);
+    constructor(routerId: string, signal: AbortSignal, committed: Promise<NavigationHistoryEntry>, transition: NavigationTransition);
 }
 export declare class ForwardEvent extends Event {
     readonly routerId: string;
     readonly signal: AbortSignal;
-    readonly result: NavigationResult;
+    readonly committed: Promise<NavigationHistoryEntry>;
     readonly transition: NavigationTransition;
-    constructor(routerId: string, signal: AbortSignal, result: NavigationResult, transition: NavigationTransition);
+    constructor(routerId: string, signal: AbortSignal, committed: Promise<NavigationHistoryEntry>, transition: NavigationTransition);
 }
 export declare class GestureStartEvent extends Event {
     readonly source: GestureEvent;

package/build/common/hooks.d.ts

@@ -1,6 +1,7 @@
+import { PlainObject } from "@react-motion-router/core";
 import { Navigation } from "../Navigation";
 import { Router } from "../Router";
 import { RouteProp } from "./types";
 export declare function useNavigation(): Navigation;
 export declare function useRouter(): Router;
-export declare function useRoute(): RouteProp<{}>;
+export declare function useRoute<T extends PlainObject = PlainObject>(): RouteProp<T>;

package/build/common/promise-wrapper.d.ts

@@ -0,0 +1,9 @@
+export declare class PromiseWrapper<T> {
+    promise: Promise<T>;
+    state: 'pending' | 'resolved' | 'rejected';
+    nativeResolve: ((value: T | PromiseLike<T>) => void) | null;
+    nativeReject: ((reason: any) => void) | null;
+    constructor();
+    resolve(value: T): void;
+    reject(reason: any): void;
+}

package/build/common/types.d.ts

@@ -25,7 +25,7 @@ export interface HistoryEntryState {
     params?: PlainObject;
 }
 export declare function isRefObject<T>(value?: React.LegacyRef<T>): value is RefObject<T>;
-export interface StackRouterEventMap extends RouterBaseEventMap {
+export interface RouterEventMap extends RouterBaseEventMap {
     "navigate": NavigateEvent;
     "back": BackEvent;
     "forward": ForwardEvent;
@@ -36,5 +36,14 @@ export interface StackRouterEventMap extends RouterBaseEventMap {
 export interface RouteProp<T extends PlainObject = {}> extends RoutePropBase<ScreenProps["config"], T> {
 }
 export type SwipeDirection = 'up' | 'down' | 'left' | 'right' | 'horizontal' | 'vertical';
-export declare function isVerticalDirection(direction: SwipeDirection): direction is 'up' | 'down' | 'vertical';
+export type Direction = Exclude<SwipeDirection, "horizontal" | "vertical">;
+export declare function isSupportedDirection(direction: Exclude<SwipeDirection, "horizontal" | "vertical">, supported: SwipeDirection): boolean;
+export declare function isOutOfBounds(direction: SwipeDirection, { x, y }: {
+    x: number;
+    y: number;
+}, clientRect: DOMRect, gestureAreaWidth: number): false | undefined;
 export declare function isHorizontalDirection(direction: SwipeDirection): direction is 'left' | 'right' | 'horizontal';
+export interface ScreenInternalProps {
+    resolvedPathname: string;
+    id: React.Key;
+}

package/build/common/utils.d.ts

@@ -1,7 +1,8 @@
 import { PlainObject } from "@react-motion-router/core";
-export declare function searchParamsToObject(searchPart: string): PlainObject<string> | undefined;
+export declare function searchParamsToObject(searchParams: URLSearchParams): PlainObject<string> | undefined;
 export declare function searchParamsFromObject(params: {
     [key: string]: any;
 }): string;
+export declare function isGesture(info?: unknown): boolean;
 export declare function isRollback(info?: unknown): boolean;
 export declare function deepEquals<T>(obj1: T, obj2: T): boolean;

package/build/index.d.ts

@@ -8,3 +8,4 @@ export * from './animation-configs/keyframe-options-presets';
 export * from './animation-configs/animation-presets';
 export * from './common/hooks';
 export * from './GestureRegion';
+export * from './HistoryEntry';