@akanjs/next 0.9.4 → 0.9.6

package/cjs/useCsrValues.js

@@ -513,42 +513,61 @@ const useCsrValues = (rootRouteGuide, pathRoutes) => {
   const onBack = (0, import_react2.useRef)({});
   const frameRootRef = (0, import_react2.useRef)(null);
   const { getLocation } = (0, import_useLocation.useLocation)({ rootRouteGuide });
-  const { history, setHistoryForward, setHistoryBack, getCurrentLocation, getPrevLocation, getScrollTop } = (0, import_useHistory.useHistory)([
-    getLocation(window.location.pathname)
-  ]);
+  const {
+    history,
+    setHistoryForward,
+    setHistoryBack,
+    getNextLocation,
+    getCurrentLocation,
+    getPrevLocation,
+    getScrollTop
+  } = (0, import_useHistory.useHistory)([getLocation(window.location.href.replace(window.location.origin, ""))]);
   const [{ location, prevLocation }, setLocationState] = (0, import_react2.useState)({
     location: getCurrentLocation(),
     prevLocation: getPrevLocation()
   });
   const getRouter = (0, import_react2.useCallback)(() => {
     const router3 = {
-      push: (href) => {
+      push: (href, { scrollToTop } = {}) => {
         const location2 = getCurrentLocation();
+        if (location2.href === href) {
+          if (!pageContentRef.current)
+            return;
+          pageContentRef.current.scrollTop = getScrollTop(location2);
+          return;
+        }
         const scrollTop = pageContentRef.current?.scrollTop ?? 0;
-        setHistoryForward({ type: "push", location: getLocation(href), scrollTop });
+        setHistoryForward({ type: "push", location: getLocation(href), scrollTop, scrollToTop });
         setLocationState({ location: getCurrentLocation(), prevLocation: location2 });
         window.history.pushState({}, "", href);
       },
-      replace: (href) => {
+      replace: (href, { scrollToTop } = {}) => {
+        if (location.href === href) {
+          if (!pageContentRef.current)
+            return;
+          pageContentRef.current.scrollTop = getScrollTop(location);
+          return;
+        }
         const scrollTop = pageContentRef.current?.scrollTop ?? 0;
-        setHistoryForward({ type: "replace", location: getLocation(href), scrollTop });
+        setHistoryForward({ type: "replace", location: getLocation(href), scrollTop, scrollToTop });
         setLocationState({ location: getCurrentLocation(), prevLocation });
         window.history.replaceState({}, "", href);
       },
       refresh: () => {
         window.location.reload();
       },
-      back: async () => {
+      back: async ({ scrollToTop } = {}) => {
         const location2 = getCurrentLocation();
         await onBack.current[location2.pathRoute.pageState.transition]?.();
         const scrollTop = pageContentRef.current?.scrollTop ?? 0;
-        setHistoryBack({ type: "back", location: location2, scrollTop });
+        setHistoryBack({ type: "back", location: location2, scrollTop, scrollToTop });
         setLocationState({ location: getCurrentLocation(), prevLocation: getPrevLocation() });
         window.history.back();
       }
     };
     window.onpopstate = async (ev) => {
-      const routeType = window.location.pathname === getCurrentLocation().pathname && history.current.type !== "back" ? "forward" : window.location.pathname === getPrevLocation()?.pathname ? "back" : null;
+      const href = window.location.href.replace(window.location.origin, "");
+      const routeType = href === getNextLocation()?.href ? "forward" : href === getPrevLocation()?.href ? "back" : null;
       const scrollTop = pageContentRef.current?.scrollTop ?? 0;
       if (!routeType)
         return;
@@ -594,16 +613,16 @@ const useCsrValues = (rootRouteGuide, pathRoutes) => {
   };
   (0, import_react2.useEffect)(() => {
     if (pageContentRef.current)
-      pageContentRef.current.scrollTop = getScrollTop(location.pathname);
+      pageContentRef.current.scrollTop = getScrollTop(location);
     if (prevPageContentRef.current)
-      prevPageContentRef.current.scrollTop = prevLocation ? getScrollTop(prevLocation.pathname) : 0;
+      prevPageContentRef.current.scrollTop = prevLocation ? getScrollTop(prevLocation) : 0;
     void import_app.App.addListener("backButton", () => {
       router2.back();
     });
     return () => {
       void import_app.App.removeAllListeners();
     };
-  }, [location.pathname]);
+  }, [location.href]);
   return {
     ...routeState,
     ...useCsrTransitionMap[location.pathRoute.pageState.transition]

package/cjs/useHistory.js

@@ -31,10 +31,14 @@ const useHistory = (locations = []) => {
     cachedLocationMap: /* @__PURE__ */ new Map(),
     idx: 0
   });
-  const setHistoryForward = (0, import_react.useCallback)(({ type, location, scrollTop = 0 }) => {
+  const setHistoryForward = (0, import_react.useCallback)(({ type, location, scrollTop = 0, scrollToTop = false }) => {
+    const currentLocation = history.current.locations[history.current.idx];
+    if (currentLocation)
+      history.current.scrollMap.set(currentLocation.href, scrollTop);
+    if (scrollToTop)
+      history.current.scrollMap.set(location.href, 0);
     history.current.type = "forward";
-    history.current.scrollMap.set(location.pathname, scrollTop);
-    history.current.idxMap.set(location.pathname, history.current.idx);
+    history.current.idxMap.set(location.href, history.current.idx);
     if (type === "push")
       history.current.locations = [...history.current.locations.slice(0, history.current.idx + 1), location];
     else if (type === "replace")
@@ -44,22 +48,40 @@ const useHistory = (locations = []) => {
     if (type === "push" || type === "popForward")
       history.current.idx++;
   }, []);
-  const setHistoryBack = (0, import_react.useCallback)(({ location, scrollTop = 0 }) => {
+  const setHistoryBack = (0, import_react.useCallback)(({ location, scrollTop = 0, scrollToTop = false }) => {
+    const prevLocation = history.current.locations[history.current.idx - 1];
+    if (prevLocation && scrollToTop)
+      history.current.scrollMap.set(prevLocation.pathname, 0);
     history.current.type = "back";
-    history.current.scrollMap.set(location.pathname, scrollTop);
-    history.current.idxMap.set(location.pathname, history.current.idx);
+    history.current.scrollMap.set(location.href, scrollTop);
+    history.current.idxMap.set(location.href, history.current.idx);
     if (location.pathRoute.pageState.cache)
       history.current.cachedLocationMap.set(location.pathRoute.path, location);
     history.current.idx--;
   }, []);
+  const getNextLocation = (0, import_react.useCallback)(() => {
+    return history.current.locations[history.current.idx + 1] ?? null;
+  }, []);
   const getCurrentLocation = (0, import_react.useCallback)(() => {
     return history.current.locations[history.current.idx];
   }, []);
   const getPrevLocation = (0, import_react.useCallback)(() => {
     return history.current.locations[history.current.idx - 1] ?? null;
   }, []);
-  const getScrollTop = (0, import_react.useCallback)((pathname = history.current.locations[history.current.idx]?.pathname ?? "/") => {
-    return history.current.scrollMap.get(pathname) ?? 0;
+  const getScrollTop = (0, import_react.useCallback)((location) => {
+    if (location.hash) {
+      const element = window.document.getElementById(location.hash);
+      return element?.offsetTop ?? 0;
+    }
+    return history.current.scrollMap.get(location.href) ?? 0;
   }, []);
-  return { history, setHistoryForward, setHistoryBack, getCurrentLocation, getPrevLocation, getScrollTop };
+  return {
+    history,
+    setHistoryForward,
+    setHistoryBack,
+    getNextLocation,
+    getCurrentLocation,
+    getPrevLocation,
+    getScrollTop
+  };
 };

package/cjs/useLocation.js

@@ -68,11 +68,13 @@ const useLocation = ({ rootRouteGuide }) => {
         {}
       );
     };
-    const [pathname, search] = href.split("?");
+    const hrefWithoutOrigin = href.replace(window.location.origin, "");
+    const [hrefWithoutHash, hash = ""] = hrefWithoutOrigin.split("#");
+    const [pathname, search] = hrefWithoutHash.split("?");
     const pathRoute = getPathRoute(pathname);
     const params = getParams(pathname, pathRoute);
     const searchParams = getSearchParams(search);
-    return { pathname, search, params, searchParams, pathRoute };
+    return { pathname, search, params, searchParams, pathRoute, hash, href };
   }, []);
   return { getLocation };
 };

package/esm/useCsrValues.js

@@ -495,42 +495,61 @@ const useCsrValues = (rootRouteGuide, pathRoutes) => {
   const onBack = useRef({});
   const frameRootRef = useRef(null);
   const { getLocation } = useLocation({ rootRouteGuide });
-  const { history, setHistoryForward, setHistoryBack, getCurrentLocation, getPrevLocation, getScrollTop } = useHistory([
-    getLocation(window.location.pathname)
-  ]);
+  const {
+    history,
+    setHistoryForward,
+    setHistoryBack,
+    getNextLocation,
+    getCurrentLocation,
+    getPrevLocation,
+    getScrollTop
+  } = useHistory([getLocation(window.location.href.replace(window.location.origin, ""))]);
   const [{ location, prevLocation }, setLocationState] = useState({
     location: getCurrentLocation(),
     prevLocation: getPrevLocation()
   });
   const getRouter = useCallback(() => {
     const router3 = {
-      push: (href) => {
+      push: (href, { scrollToTop } = {}) => {
         const location2 = getCurrentLocation();
+        if (location2.href === href) {
+          if (!pageContentRef.current)
+            return;
+          pageContentRef.current.scrollTop = getScrollTop(location2);
+          return;
+        }
         const scrollTop = pageContentRef.current?.scrollTop ?? 0;
-        setHistoryForward({ type: "push", location: getLocation(href), scrollTop });
+        setHistoryForward({ type: "push", location: getLocation(href), scrollTop, scrollToTop });
         setLocationState({ location: getCurrentLocation(), prevLocation: location2 });
         window.history.pushState({}, "", href);
       },
-      replace: (href) => {
+      replace: (href, { scrollToTop } = {}) => {
+        if (location.href === href) {
+          if (!pageContentRef.current)
+            return;
+          pageContentRef.current.scrollTop = getScrollTop(location);
+          return;
+        }
         const scrollTop = pageContentRef.current?.scrollTop ?? 0;
-        setHistoryForward({ type: "replace", location: getLocation(href), scrollTop });
+        setHistoryForward({ type: "replace", location: getLocation(href), scrollTop, scrollToTop });
         setLocationState({ location: getCurrentLocation(), prevLocation });
         window.history.replaceState({}, "", href);
       },
       refresh: () => {
         window.location.reload();
       },
-      back: async () => {
+      back: async ({ scrollToTop } = {}) => {
         const location2 = getCurrentLocation();
         await onBack.current[location2.pathRoute.pageState.transition]?.();
         const scrollTop = pageContentRef.current?.scrollTop ?? 0;
-        setHistoryBack({ type: "back", location: location2, scrollTop });
+        setHistoryBack({ type: "back", location: location2, scrollTop, scrollToTop });
         setLocationState({ location: getCurrentLocation(), prevLocation: getPrevLocation() });
         window.history.back();
       }
     };
     window.onpopstate = async (ev) => {
-      const routeType = window.location.pathname === getCurrentLocation().pathname && history.current.type !== "back" ? "forward" : window.location.pathname === getPrevLocation()?.pathname ? "back" : null;
+      const href = window.location.href.replace(window.location.origin, "");
+      const routeType = href === getNextLocation()?.href ? "forward" : href === getPrevLocation()?.href ? "back" : null;
       const scrollTop = pageContentRef.current?.scrollTop ?? 0;
       if (!routeType)
         return;
@@ -576,16 +595,16 @@ const useCsrValues = (rootRouteGuide, pathRoutes) => {
   };
   useEffect(() => {
     if (pageContentRef.current)
-      pageContentRef.current.scrollTop = getScrollTop(location.pathname);
+      pageContentRef.current.scrollTop = getScrollTop(location);
     if (prevPageContentRef.current)
-      prevPageContentRef.current.scrollTop = prevLocation ? getScrollTop(prevLocation.pathname) : 0;
+      prevPageContentRef.current.scrollTop = prevLocation ? getScrollTop(prevLocation) : 0;
     void App.addListener("backButton", () => {
       router2.back();
     });
     return () => {
       void App.removeAllListeners();
     };
-  }, [location.pathname]);
+  }, [location.href]);
   return {
     ...routeState,
     ...useCsrTransitionMap[location.pathRoute.pageState.transition]

package/esm/useHistory.js

@@ -9,10 +9,14 @@ const useHistory = (locations = []) => {
     cachedLocationMap: /* @__PURE__ */ new Map(),
     idx: 0
   });
-  const setHistoryForward = useCallback(({ type, location, scrollTop = 0 }) => {
+  const setHistoryForward = useCallback(({ type, location, scrollTop = 0, scrollToTop = false }) => {
+    const currentLocation = history.current.locations[history.current.idx];
+    if (currentLocation)
+      history.current.scrollMap.set(currentLocation.href, scrollTop);
+    if (scrollToTop)
+      history.current.scrollMap.set(location.href, 0);
     history.current.type = "forward";
-    history.current.scrollMap.set(location.pathname, scrollTop);
-    history.current.idxMap.set(location.pathname, history.current.idx);
+    history.current.idxMap.set(location.href, history.current.idx);
     if (type === "push")
       history.current.locations = [...history.current.locations.slice(0, history.current.idx + 1), location];
     else if (type === "replace")
@@ -22,24 +26,42 @@ const useHistory = (locations = []) => {
     if (type === "push" || type === "popForward")
       history.current.idx++;
   }, []);
-  const setHistoryBack = useCallback(({ location, scrollTop = 0 }) => {
+  const setHistoryBack = useCallback(({ location, scrollTop = 0, scrollToTop = false }) => {
+    const prevLocation = history.current.locations[history.current.idx - 1];
+    if (prevLocation && scrollToTop)
+      history.current.scrollMap.set(prevLocation.pathname, 0);
     history.current.type = "back";
-    history.current.scrollMap.set(location.pathname, scrollTop);
-    history.current.idxMap.set(location.pathname, history.current.idx);
+    history.current.scrollMap.set(location.href, scrollTop);
+    history.current.idxMap.set(location.href, history.current.idx);
     if (location.pathRoute.pageState.cache)
       history.current.cachedLocationMap.set(location.pathRoute.path, location);
     history.current.idx--;
   }, []);
+  const getNextLocation = useCallback(() => {
+    return history.current.locations[history.current.idx + 1] ?? null;
+  }, []);
   const getCurrentLocation = useCallback(() => {
     return history.current.locations[history.current.idx];
   }, []);
   const getPrevLocation = useCallback(() => {
     return history.current.locations[history.current.idx - 1] ?? null;
   }, []);
-  const getScrollTop = useCallback((pathname = history.current.locations[history.current.idx]?.pathname ?? "/") => {
-    return history.current.scrollMap.get(pathname) ?? 0;
+  const getScrollTop = useCallback((location) => {
+    if (location.hash) {
+      const element = window.document.getElementById(location.hash);
+      return element?.offsetTop ?? 0;
+    }
+    return history.current.scrollMap.get(location.href) ?? 0;
   }, []);
-  return { history, setHistoryForward, setHistoryBack, getCurrentLocation, getPrevLocation, getScrollTop };
+  return {
+    history,
+    setHistoryForward,
+    setHistoryBack,
+    getNextLocation,
+    getCurrentLocation,
+    getPrevLocation,
+    getScrollTop
+  };
 };
 export {
   useHistory

package/esm/useLocation.js

@@ -46,11 +46,13 @@ const useLocation = ({ rootRouteGuide }) => {
         {}
       );
     };
-    const [pathname, search] = href.split("?");
+    const hrefWithoutOrigin = href.replace(window.location.origin, "");
+    const [hrefWithoutHash, hash = ""] = hrefWithoutOrigin.split("#");
+    const [pathname, search] = hrefWithoutHash.split("?");
     const pathRoute = getPathRoute(pathname);
     const params = getParams(pathname, pathRoute);
     const searchParams = getSearchParams(search);
-    return { pathname, search, params, searchParams, pathRoute };
+    return { pathname, search, params, searchParams, pathRoute, hash, href };
   }, []);
   return { getLocation };
 };

package/makePageProto.d.ts

@@ -25,7 +25,7 @@ export declare const makePageProto: <Locale extends {
         qrydesc<ModelKey extends keyof Locale>(model: ModelKey, queryKey: keyof Locale[ModelKey]): string;
         qarg<ModelKey extends keyof Locale>(model: ModelKey, queryKey: keyof Locale[ModelKey], arg: string): string;
         qargdesc<ModelKey extends keyof Locale>(model: ModelKey, queryKey: keyof Locale[ModelKey], arg: string): string;
-        trans(translation: Record<"en" | "ko" | (string & {}), ReactNode>): ReactNode;
+        trans<Returns extends ReactNode>(translation: Record<"en" | "ko" | (string & {}), Returns>): Returns extends string ? string : Returns;
     };
     lang: string;
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@akanjs/next",
-  "version": "0.9.4",
+  "version": "0.9.6",
   "sourceType": "module",
   "publishConfig": {
     "access": "public"

package/useHistory.d.ts

@@ -3,18 +3,21 @@ interface setForwardOptions {
     type: "push" | "replace" | "popForward";
     location: Location;
     scrollTop?: number;
+    scrollToTop?: boolean;
 }
 interface setBackOptions {
     type: "back" | "popBack";
     location: Location;
     scrollTop?: number;
+    scrollToTop?: boolean;
 }
 export declare const useHistory: (locations?: Location[]) => {
     history: import("react").MutableRefObject<History>;
-    setHistoryForward: ({ type, location, scrollTop }: setForwardOptions) => void;
-    setHistoryBack: ({ location, scrollTop }: setBackOptions) => void;
+    setHistoryForward: ({ type, location, scrollTop, scrollToTop }: setForwardOptions) => void;
+    setHistoryBack: ({ location, scrollTop, scrollToTop }: setBackOptions) => void;
+    getNextLocation: () => Location | null;
     getCurrentLocation: () => Location;
     getPrevLocation: () => Location | null;
-    getScrollTop: (pathname?: string) => number;
+    getScrollTop: (location: Location) => number;
 };
 export {};

package/usePage.d.ts

@@ -68,7 +68,7 @@ export declare const usePage: () => {
                 [key: string]: Translation;
             };
         }[ModelKey], arg: string): string;
-        trans(translation: Record<"en" | "ko" | (string & {}), import("react").ReactNode>): import("react").ReactNode;
+        trans<Returns extends import("react").ReactNode>(translation: Record<(string & {}) | "en" | "ko", Returns>): Returns extends string ? string : Returns;
     };
     lang: string;
 };