@pinnacle0/react-stack-router - npm Package Compare versions

Comparing version 0.1.3-beta.48 to 0.1.3-beta.49

dist/hook.d.ts

@@ -12,3 +12,3 @@ import { RouterContext } from "./context";
 export declare const useParams: <T extends Record<string, string>>() => T;
-export declare const useLocationState: <T extends LocationState>() => readonly [T, (newState: T | ((current: T) => T)) => void];
+export declare const useLocationState: <T extends LocationState>() => readonly [Partial<T>, (newState: Partial<T> | ((current: Partial<T>) => T)) => void];
 export declare const useHash: () => readonly [string, (hash: string) => void];
@@ -15,0 +15,0 @@ export declare const useSearchParams: <T extends Record<string, string>>() => readonly [T, (newParams: T | ((current: T) => T)) => void];

dist/stackRouter/index.d.ts

@@ -36,3 +36,3 @@ import { Route } from "../route";
     push(to: To, option?: PushOption): Promise<void>;
-    pop(t?: number): Promise<void>;
+    pop(times?: number): Promise<void>;
     replace(to: To, option?: ReplaceOption): void;
@@ -39,0 +39,0 @@ replaceSearchParams<T extends Record<string, string> = Record<string, string>>(newParam: T | ((current: T) => T)): void;

dist/stackRouter/index.js

@@ -27,2 +27,3 @@ import { Action } from "history";
         const { pathname, hash, search } = window.location;
+        const defaultState = this.stackHistory.location.state;
         const matched = this.matchRoute(pathname);
@@ -48,3 +49,7 @@ let numOfParentComponent = 0;
         }
-        return Promise.all(stack.map((to, index) => (index === 0 ? this.replace(to) : this.push(to, { transitionType: "exiting" }))));
+        return Promise.all(stack.map((to, index) => {
+            // need to re-write the key of last state
+            const state = index === stack.length - 1 ? { ...defaultState, $key: this.createKey() } : {};
+            return index === 0 ? this.replace(to, { state }) : this.push(to, { transitionType: "exiting", state });
+        }));
     }
@@ -71,4 +76,3 @@ updateRoute(route) {
     }
-    async pop(t) {
-        const times = typeof t === "number" ? t : 1;
+    async pop(times = 1) {
         if (times <= 0)
@@ -75,0 +79,0 @@ return;

dist/stackRouter/stackHistory.js

@@ -6,4 +6,15 @@ import { Action } from "history";
     let currentLocation = history.location;
+    const createLocation = (location) => {
+        return {
+            ...location,
+            get state() {
+                if (typeof location.state === "object" && location.state !== null && "userState" in location.state) {
+                    return location.state.userState;
+                }
+                return {};
+            },
+        };
+    };
     const createInternalState = (state, createAt) => {
-        return { __createAt: createAt ?? timestamp++, ...(state ?? {}) };
+        return { __createAt: createAt ?? timestamp++, userState: state ?? {} };
     };
@@ -40,3 +51,3 @@ const push = (to, state) => {
     const handler = (update) => {
-        const location = update.location;
+        const location = createLocation(update.location);
         switch (update.action) {
@@ -47,3 +58,3 @@ case Action.Push:
             case Action.Pop:
-                notify(isForwardPop(location) ? Action.Push : Action.Pop, location);
+                notify(isForwardPop(update.location) ? Action.Push : Action.Pop, location);
                 break;
@@ -54,3 +65,3 @@ case Action.Replace:
         }
-        currentLocation = location;
+        currentLocation = update.location;
     };
@@ -64,3 +75,3 @@ history.listen(handler);
         get location() {
-            return currentLocation;
+            return createLocation(history.location);
         },
@@ -67,0 +78,0 @@ };

dist/type.d.ts

@@ -9,6 +9,6 @@ import type React from "react";
 export type Location<S extends Record<string, any> = Record<string, any>> = Omit<HistoryLocation, "state"> & {
-    state: S;
+    state: Partial<S>;
 };
 export interface PushOption {
-    state?: LocationState;
+    state?: LocationState | undefined;
     transitionType?: TransitionType;
@@ -18,7 +18,4 @@ transitionDuration?: number;
 export interface ReplaceOption {
-    state?: LocationState;
+    state?: LocationState | undefined;
 }
-export interface ReplaceOption {
-    state?: LocationState;
-}
 export interface Router {
@@ -25,0 +22,0 @@ Root: React.ComponentType<React.PropsWithChildren>;

package.json

 {
   "name": "@pinnacle0/react-stack-router",
-  "version": "0.1.3-beta.48",
+  "version": "0.1.3-beta.49",
   "author": "Pinnacle",
@@ -5,0 +5,0 @@ "license": "MIT",

src/hook.ts

@@ -31,4 +31,4 @@ import {useCallback, useContext, useEffect, useLayoutEffect, useMemo, useRef} from "react";
     const {replaceLocationState} = useNavigate();
-    const setState = useCallback((newState: T | ((current: T) => T)) => replaceLocationState(newState), [replaceLocationState]);
-    return [state as T, setState] as const;
+    const setState = useCallback((newState: Partial<T> | ((current: Partial<T>) => T)) => replaceLocationState(newState), [replaceLocationState]);
+    return [state as Partial<T>, setState] as const;
 };
@@ -35,0 +35,0 @@

src/stackRouter/index.ts

@@ -64,2 +64,3 @@ import {Action} from "history";
         const {pathname, hash, search} = window.location;
+        const defaultState = this.stackHistory.location.state;
         const matched = this.matchRoute(pathname);
@@ -89,3 +90,9 @@
 
-        return Promise.all(stack.map((to, index) => (index === 0 ? this.replace(to) : this.push(to, {transitionType: "exiting"}))));
+        return Promise.all(
+            stack.map((to, index) => {
+                // need to re-write the key of last state
+                const state = index === stack.length - 1 ? {...defaultState, $key: this.createKey()} : {};
+                return index === 0 ? this.replace(to, {state}) : this.push(to, {transitionType: "exiting", state});
+            })
+        );
     }
@@ -118,4 +125,3 @@
 
-    async pop(t?: number): Promise<void> {
-        const times = typeof t === "number" ? t : 1;
+    async pop(times = 1): Promise<void> {
         if (times <= 0) return;
@@ -122,0 +128,0 @@

src/stackRouter/stackHistory.ts

 import {Action} from "history";
-import type {History, To, Update} from "history";
+import type {History, To, Update, Location as HistoryLocation} from "history";
 import type {Location} from "../type";
@@ -7,3 +7,3 @@
     __createAt: number;
-    [key: string]: unknown;
+    userState: Record<string, any>;
 }
@@ -26,4 +26,16 @@
 
+    const createLocation = (location: HistoryLocation): Location<S> => {
+        return {
+            ...location,
+            get state(): Partial<S> {
+                if (typeof location.state === "object" && location.state !== null && "userState" in location.state) {
+                    return location.state.userState as Partial<S>;
+                }
+                return {} as Partial<S>;
+            },
+        };
+    };
+
     const createInternalState = (state?: S, createAt?: number): InternalState => {
-        return {__createAt: createAt ?? timestamp++, ...(state ?? {})};
+        return {__createAt: createAt ?? timestamp++, userState: state ?? {}};
     };
@@ -55,3 +67,3 @@
      */
-    const isForwardPop = (next: Location<S>): boolean => {
+    const isForwardPop = (next: HistoryLocation): boolean => {
         if (!currentLocation.state) return false;
@@ -67,3 +79,3 @@ const currentState = currentLocation.state as any;
     const handler = (update: Update) => {
-        const location = update.location as any;
+        const location = createLocation(update.location);
         switch (update.action) {
@@ -74,3 +86,3 @@ case Action.Push:
             case Action.Pop:
-                notify(isForwardPop(location) ? Action.Push : Action.Pop, location);
+                notify(isForwardPop(update.location) ? Action.Push : Action.Pop, location);
                 break;
@@ -81,3 +93,3 @@ case Action.Replace:
         }
-        currentLocation = location;
+        currentLocation = update.location;
     };
@@ -93,3 +105,3 @@
         get location(): Location<S> {
-            return currentLocation as any;
+            return createLocation(history.location);
         },
@@ -96,0 +108,0 @@ };

src/type.ts

@@ -11,7 +11,7 @@ import type React from "react";
 export type Location<S extends Record<string, any> = Record<string, any>> = Omit<HistoryLocation, "state"> & {
-    state: S;
+    state: Partial<S>;
 };
 
 export interface PushOption {
-    state?: LocationState;
+    state?: LocationState | undefined;
     transitionType?: TransitionType;
@@ -22,9 +22,5 @@ transitionDuration?: number;
 export interface ReplaceOption {
-    state?: LocationState;
+    state?: LocationState | undefined;
 }
 
-export interface ReplaceOption {
-    state?: LocationState;
-}
-
 export interface Router {
@@ -31,0 +27,0 @@ Root: React.ComponentType<React.PropsWithChildren>;

No alert changes

Improved metrics

Total package byte prevSize

163244

increased by1.18%

Lines of code

2549

increased by1.03%

No dependency changes