@akanjs/next 0.9.5 → 0.9.7

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -513,9 +513,15 @@ const useCsrValues = (rootRouteGuide, pathRoutes) => {
513
513
  const onBack = (0, import_react2.useRef)({});
514
514
  const frameRootRef = (0, import_react2.useRef)(null);
515
515
  const { getLocation } = (0, import_useLocation.useLocation)({ rootRouteGuide });
516
- const { history, setHistoryForward, setHistoryBack, getCurrentLocation, getPrevLocation, getScrollTop } = (0, import_useHistory.useHistory)([
517
- getLocation(window.location.pathname)
518
- ]);
516
+ const {
517
+ history,
518
+ setHistoryForward,
519
+ setHistoryBack,
520
+ getNextLocation,
521
+ getCurrentLocation,
522
+ getPrevLocation,
523
+ getScrollTop
524
+ } = (0, import_useHistory.useHistory)([getLocation(window.location.href.replace(window.location.origin, ""))]);
519
525
  const [{ location, prevLocation }, setLocationState] = (0, import_react2.useState)({
520
526
  location: getCurrentLocation(),
521
527
  prevLocation: getPrevLocation()
@@ -524,12 +530,24 @@ const useCsrValues = (rootRouteGuide, pathRoutes) => {
524
530
  const router3 = {
525
531
  push: (href, { scrollToTop } = {}) => {
526
532
  const location2 = getCurrentLocation();
533
+ if (location2.href === href) {
534
+ if (!pageContentRef.current)
535
+ return;
536
+ pageContentRef.current.scrollTop = getScrollTop(location2);
537
+ return;
538
+ }
527
539
  const scrollTop = pageContentRef.current?.scrollTop ?? 0;
528
540
  setHistoryForward({ type: "push", location: getLocation(href), scrollTop, scrollToTop });
529
541
  setLocationState({ location: getCurrentLocation(), prevLocation: location2 });
530
542
  window.history.pushState({}, "", href);
531
543
  },
532
544
  replace: (href, { scrollToTop } = {}) => {
545
+ if (location.href === href) {
546
+ if (!pageContentRef.current)
547
+ return;
548
+ pageContentRef.current.scrollTop = getScrollTop(location);
549
+ return;
550
+ }
533
551
  const scrollTop = pageContentRef.current?.scrollTop ?? 0;
534
552
  setHistoryForward({ type: "replace", location: getLocation(href), scrollTop, scrollToTop });
535
553
  setLocationState({ location: getCurrentLocation(), prevLocation });
@@ -548,7 +566,8 @@ const useCsrValues = (rootRouteGuide, pathRoutes) => {
548
566
  }
549
567
  };
550
568
  window.onpopstate = async (ev) => {
551
- const routeType = window.location.pathname === getCurrentLocation().pathname && history.current.type !== "back" ? "forward" : window.location.pathname === getPrevLocation()?.pathname ? "back" : null;
569
+ const href = window.location.href.replace(window.location.origin, "");
570
+ const routeType = href === getNextLocation()?.href ? "forward" : href === getPrevLocation()?.href ? "back" : null;
552
571
  const scrollTop = pageContentRef.current?.scrollTop ?? 0;
553
572
  if (!routeType)
554
573
  return;
@@ -594,16 +613,16 @@ const useCsrValues = (rootRouteGuide, pathRoutes) => {
594
613
  };
595
614
  (0, import_react2.useEffect)(() => {
596
615
  if (pageContentRef.current)
597
- pageContentRef.current.scrollTop = getScrollTop(location.pathname);
616
+ pageContentRef.current.scrollTop = getScrollTop(location);
598
617
  if (prevPageContentRef.current)
599
- prevPageContentRef.current.scrollTop = prevLocation ? getScrollTop(prevLocation.pathname) : 0;
618
+ prevPageContentRef.current.scrollTop = prevLocation ? getScrollTop(prevLocation) : 0;
600
619
  void import_app.App.addListener("backButton", () => {
601
620
  router2.back();
602
621
  });
603
622
  return () => {
604
623
  void import_app.App.removeAllListeners();
605
624
  };
606
- }, [location.pathname]);
625
+ }, [location.href]);
607
626
  return {
608
627
  ...routeState,
609
628
  ...useCsrTransitionMap[location.pathRoute.pageState.transition]
package/cjs/useHistory.js CHANGED
@@ -34,11 +34,11 @@ const useHistory = (locations = []) => {
34
34
  const setHistoryForward = (0, import_react.useCallback)(({ type, location, scrollTop = 0, scrollToTop = false }) => {
35
35
  const currentLocation = history.current.locations[history.current.idx];
36
36
  if (currentLocation)
37
- history.current.scrollMap.set(currentLocation.pathname, scrollTop);
37
+ history.current.scrollMap.set(currentLocation.href, scrollTop);
38
38
  if (scrollToTop)
39
- history.current.scrollMap.set(location.pathname, 0);
39
+ history.current.scrollMap.set(location.href, 0);
40
40
  history.current.type = "forward";
41
- history.current.idxMap.set(location.pathname, history.current.idx);
41
+ history.current.idxMap.set(location.href, history.current.idx);
42
42
  if (type === "push")
43
43
  history.current.locations = [...history.current.locations.slice(0, history.current.idx + 1), location];
44
44
  else if (type === "replace")
@@ -53,20 +53,35 @@ const useHistory = (locations = []) => {
53
53
  if (prevLocation && scrollToTop)
54
54
  history.current.scrollMap.set(prevLocation.pathname, 0);
55
55
  history.current.type = "back";
56
- history.current.scrollMap.set(location.pathname, scrollTop);
57
- history.current.idxMap.set(location.pathname, history.current.idx);
56
+ history.current.scrollMap.set(location.href, scrollTop);
57
+ history.current.idxMap.set(location.href, history.current.idx);
58
58
  if (location.pathRoute.pageState.cache)
59
59
  history.current.cachedLocationMap.set(location.pathRoute.path, location);
60
60
  history.current.idx--;
61
61
  }, []);
62
+ const getNextLocation = (0, import_react.useCallback)(() => {
63
+ return history.current.locations[history.current.idx + 1] ?? null;
64
+ }, []);
62
65
  const getCurrentLocation = (0, import_react.useCallback)(() => {
63
66
  return history.current.locations[history.current.idx];
64
67
  }, []);
65
68
  const getPrevLocation = (0, import_react.useCallback)(() => {
66
69
  return history.current.locations[history.current.idx - 1] ?? null;
67
70
  }, []);
68
- const getScrollTop = (0, import_react.useCallback)((pathname = history.current.locations[history.current.idx]?.pathname ?? "/") => {
69
- return history.current.scrollMap.get(pathname) ?? 0;
71
+ const getScrollTop = (0, import_react.useCallback)((location) => {
72
+ if (location.hash) {
73
+ const element = window.document.getElementById(location.hash);
74
+ return element?.offsetTop ?? 0;
75
+ }
76
+ return history.current.scrollMap.get(location.href) ?? 0;
70
77
  }, []);
71
- return { history, setHistoryForward, setHistoryBack, getCurrentLocation, getPrevLocation, getScrollTop };
78
+ return {
79
+ history,
80
+ setHistoryForward,
81
+ setHistoryBack,
82
+ getNextLocation,
83
+ getCurrentLocation,
84
+ getPrevLocation,
85
+ getScrollTop
86
+ };
72
87
  };
@@ -68,11 +68,13 @@ const useLocation = ({ rootRouteGuide }) => {
68
68
  {}
69
69
  );
70
70
  };
71
- const [pathname, search] = href.split("?");
71
+ const hrefWithoutOrigin = href.replace(window.location.origin, "");
72
+ const [hrefWithoutHash, hash = ""] = hrefWithoutOrigin.split("#");
73
+ const [pathname, search] = hrefWithoutHash.split("?");
72
74
  const pathRoute = getPathRoute(pathname);
73
75
  const params = getParams(pathname, pathRoute);
74
76
  const searchParams = getSearchParams(search);
75
- return { pathname, search, params, searchParams, pathRoute };
77
+ return { pathname, search, params, searchParams, pathRoute, hash, href };
76
78
  }, []);
77
79
  return { getLocation };
78
80
  };
@@ -495,9 +495,15 @@ const useCsrValues = (rootRouteGuide, pathRoutes) => {
495
495
  const onBack = useRef({});
496
496
  const frameRootRef = useRef(null);
497
497
  const { getLocation } = useLocation({ rootRouteGuide });
498
- const { history, setHistoryForward, setHistoryBack, getCurrentLocation, getPrevLocation, getScrollTop } = useHistory([
499
- getLocation(window.location.pathname)
500
- ]);
498
+ const {
499
+ history,
500
+ setHistoryForward,
501
+ setHistoryBack,
502
+ getNextLocation,
503
+ getCurrentLocation,
504
+ getPrevLocation,
505
+ getScrollTop
506
+ } = useHistory([getLocation(window.location.href.replace(window.location.origin, ""))]);
501
507
  const [{ location, prevLocation }, setLocationState] = useState({
502
508
  location: getCurrentLocation(),
503
509
  prevLocation: getPrevLocation()
@@ -506,12 +512,24 @@ const useCsrValues = (rootRouteGuide, pathRoutes) => {
506
512
  const router3 = {
507
513
  push: (href, { scrollToTop } = {}) => {
508
514
  const location2 = getCurrentLocation();
515
+ if (location2.href === href) {
516
+ if (!pageContentRef.current)
517
+ return;
518
+ pageContentRef.current.scrollTop = getScrollTop(location2);
519
+ return;
520
+ }
509
521
  const scrollTop = pageContentRef.current?.scrollTop ?? 0;
510
522
  setHistoryForward({ type: "push", location: getLocation(href), scrollTop, scrollToTop });
511
523
  setLocationState({ location: getCurrentLocation(), prevLocation: location2 });
512
524
  window.history.pushState({}, "", href);
513
525
  },
514
526
  replace: (href, { scrollToTop } = {}) => {
527
+ if (location.href === href) {
528
+ if (!pageContentRef.current)
529
+ return;
530
+ pageContentRef.current.scrollTop = getScrollTop(location);
531
+ return;
532
+ }
515
533
  const scrollTop = pageContentRef.current?.scrollTop ?? 0;
516
534
  setHistoryForward({ type: "replace", location: getLocation(href), scrollTop, scrollToTop });
517
535
  setLocationState({ location: getCurrentLocation(), prevLocation });
@@ -530,7 +548,8 @@ const useCsrValues = (rootRouteGuide, pathRoutes) => {
530
548
  }
531
549
  };
532
550
  window.onpopstate = async (ev) => {
533
- const routeType = window.location.pathname === getCurrentLocation().pathname && history.current.type !== "back" ? "forward" : window.location.pathname === getPrevLocation()?.pathname ? "back" : null;
551
+ const href = window.location.href.replace(window.location.origin, "");
552
+ const routeType = href === getNextLocation()?.href ? "forward" : href === getPrevLocation()?.href ? "back" : null;
534
553
  const scrollTop = pageContentRef.current?.scrollTop ?? 0;
535
554
  if (!routeType)
536
555
  return;
@@ -576,16 +595,16 @@ const useCsrValues = (rootRouteGuide, pathRoutes) => {
576
595
  };
577
596
  useEffect(() => {
578
597
  if (pageContentRef.current)
579
- pageContentRef.current.scrollTop = getScrollTop(location.pathname);
598
+ pageContentRef.current.scrollTop = getScrollTop(location);
580
599
  if (prevPageContentRef.current)
581
- prevPageContentRef.current.scrollTop = prevLocation ? getScrollTop(prevLocation.pathname) : 0;
600
+ prevPageContentRef.current.scrollTop = prevLocation ? getScrollTop(prevLocation) : 0;
582
601
  void App.addListener("backButton", () => {
583
602
  router2.back();
584
603
  });
585
604
  return () => {
586
605
  void App.removeAllListeners();
587
606
  };
588
- }, [location.pathname]);
607
+ }, [location.href]);
589
608
  return {
590
609
  ...routeState,
591
610
  ...useCsrTransitionMap[location.pathRoute.pageState.transition]
package/esm/useHistory.js CHANGED
@@ -12,11 +12,11 @@ const useHistory = (locations = []) => {
12
12
  const setHistoryForward = useCallback(({ type, location, scrollTop = 0, scrollToTop = false }) => {
13
13
  const currentLocation = history.current.locations[history.current.idx];
14
14
  if (currentLocation)
15
- history.current.scrollMap.set(currentLocation.pathname, scrollTop);
15
+ history.current.scrollMap.set(currentLocation.href, scrollTop);
16
16
  if (scrollToTop)
17
- history.current.scrollMap.set(location.pathname, 0);
17
+ history.current.scrollMap.set(location.href, 0);
18
18
  history.current.type = "forward";
19
- history.current.idxMap.set(location.pathname, history.current.idx);
19
+ history.current.idxMap.set(location.href, history.current.idx);
20
20
  if (type === "push")
21
21
  history.current.locations = [...history.current.locations.slice(0, history.current.idx + 1), location];
22
22
  else if (type === "replace")
@@ -31,22 +31,37 @@ const useHistory = (locations = []) => {
31
31
  if (prevLocation && scrollToTop)
32
32
  history.current.scrollMap.set(prevLocation.pathname, 0);
33
33
  history.current.type = "back";
34
- history.current.scrollMap.set(location.pathname, scrollTop);
35
- history.current.idxMap.set(location.pathname, history.current.idx);
34
+ history.current.scrollMap.set(location.href, scrollTop);
35
+ history.current.idxMap.set(location.href, history.current.idx);
36
36
  if (location.pathRoute.pageState.cache)
37
37
  history.current.cachedLocationMap.set(location.pathRoute.path, location);
38
38
  history.current.idx--;
39
39
  }, []);
40
+ const getNextLocation = useCallback(() => {
41
+ return history.current.locations[history.current.idx + 1] ?? null;
42
+ }, []);
40
43
  const getCurrentLocation = useCallback(() => {
41
44
  return history.current.locations[history.current.idx];
42
45
  }, []);
43
46
  const getPrevLocation = useCallback(() => {
44
47
  return history.current.locations[history.current.idx - 1] ?? null;
45
48
  }, []);
46
- const getScrollTop = useCallback((pathname = history.current.locations[history.current.idx]?.pathname ?? "/") => {
47
- return history.current.scrollMap.get(pathname) ?? 0;
49
+ const getScrollTop = useCallback((location) => {
50
+ if (location.hash) {
51
+ const element = window.document.getElementById(location.hash);
52
+ return element?.offsetTop ?? 0;
53
+ }
54
+ return history.current.scrollMap.get(location.href) ?? 0;
48
55
  }, []);
49
- return { history, setHistoryForward, setHistoryBack, getCurrentLocation, getPrevLocation, getScrollTop };
56
+ return {
57
+ history,
58
+ setHistoryForward,
59
+ setHistoryBack,
60
+ getNextLocation,
61
+ getCurrentLocation,
62
+ getPrevLocation,
63
+ getScrollTop
64
+ };
50
65
  };
51
66
  export {
52
67
  useHistory
@@ -46,11 +46,13 @@ const useLocation = ({ rootRouteGuide }) => {
46
46
  {}
47
47
  );
48
48
  };
49
- const [pathname, search] = href.split("?");
49
+ const hrefWithoutOrigin = href.replace(window.location.origin, "");
50
+ const [hrefWithoutHash, hash = ""] = hrefWithoutOrigin.split("#");
51
+ const [pathname, search] = hrefWithoutHash.split("?");
50
52
  const pathRoute = getPathRoute(pathname);
51
53
  const params = getParams(pathname, pathRoute);
52
54
  const searchParams = getSearchParams(search);
53
- return { pathname, search, params, searchParams, pathRoute };
55
+ return { pathname, search, params, searchParams, pathRoute, hash, href };
54
56
  }, []);
55
57
  return { getLocation };
56
58
  };
@@ -25,7 +25,7 @@ export declare const makePageProto: <Locale extends {
25
25
  qrydesc<ModelKey extends keyof Locale>(model: ModelKey, queryKey: keyof Locale[ModelKey]): string;
26
26
  qarg<ModelKey extends keyof Locale>(model: ModelKey, queryKey: keyof Locale[ModelKey], arg: string): string;
27
27
  qargdesc<ModelKey extends keyof Locale>(model: ModelKey, queryKey: keyof Locale[ModelKey], arg: string): string;
28
- trans(translation: Record<"en" | "ko" | (string & {}), ReactNode>): ReactNode;
28
+ trans<Returns extends ReactNode>(translation: Record<"en" | "ko" | (string & {}), Returns>): Returns extends string ? string : Returns;
29
29
  };
30
30
  lang: string;
31
31
  };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@akanjs/next",
3
- "version": "0.9.5",
3
+ "version": "0.9.7",
4
4
  "sourceType": "module",
5
5
  "publishConfig": {
6
6
  "access": "public"
package/useHistory.d.ts CHANGED
@@ -15,8 +15,9 @@ export declare const useHistory: (locations?: Location[]) => {
15
15
  history: import("react").MutableRefObject<History>;
16
16
  setHistoryForward: ({ type, location, scrollTop, scrollToTop }: setForwardOptions) => void;
17
17
  setHistoryBack: ({ location, scrollTop, scrollToTop }: setBackOptions) => void;
18
+ getNextLocation: () => Location | null;
18
19
  getCurrentLocation: () => Location;
19
20
  getPrevLocation: () => Location | null;
20
- getScrollTop: (pathname?: string) => number;
21
+ getScrollTop: (location: Location) => number;
21
22
  };
22
23
  export {};
package/usePage.d.ts CHANGED
@@ -68,7 +68,7 @@ export declare const usePage: () => {
68
68
  [key: string]: Translation;
69
69
  };
70
70
  }[ModelKey], arg: string): string;
71
- trans(translation: Record<"en" | "ko" | (string & {}), import("react").ReactNode>): import("react").ReactNode;
71
+ trans<Returns extends import("react").ReactNode>(translation: Record<(string & {}) | "en" | "ko", Returns>): Returns extends string ? string : Returns;
72
72
  };
73
73
  lang: string;
74
74
  };