@tanstack/vue-router 1.167.0 → 1.167.2

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.
Files changed (99) hide show
  1. package/dist/esm/Asset.js +107 -151
  2. package/dist/esm/Asset.js.map +1 -1
  3. package/dist/esm/Body.js +15 -24
  4. package/dist/esm/Body.js.map +1 -1
  5. package/dist/esm/CatchBoundary.js +112 -130
  6. package/dist/esm/CatchBoundary.js.map +1 -1
  7. package/dist/esm/ClientOnly.js +59 -29
  8. package/dist/esm/ClientOnly.js.map +1 -1
  9. package/dist/esm/HeadContent.dev.js +29 -23
  10. package/dist/esm/HeadContent.dev.js.map +1 -1
  11. package/dist/esm/HeadContent.js +21 -16
  12. package/dist/esm/HeadContent.js.map +1 -1
  13. package/dist/esm/Html.js +42 -61
  14. package/dist/esm/Html.js.map +1 -1
  15. package/dist/esm/Match.js +238 -319
  16. package/dist/esm/Match.js.map +1 -1
  17. package/dist/esm/Matches.js +127 -170
  18. package/dist/esm/Matches.js.map +1 -1
  19. package/dist/esm/RouterProvider.js +50 -65
  20. package/dist/esm/RouterProvider.js.map +1 -1
  21. package/dist/esm/ScriptOnce.js +31 -36
  22. package/dist/esm/ScriptOnce.js.map +1 -1
  23. package/dist/esm/Scripts.js +79 -101
  24. package/dist/esm/Scripts.js.map +1 -1
  25. package/dist/esm/ScrollRestoration.js +25 -29
  26. package/dist/esm/ScrollRestoration.js.map +1 -1
  27. package/dist/esm/Transitioner.js +146 -164
  28. package/dist/esm/Transitioner.js.map +1 -1
  29. package/dist/esm/awaited.js +27 -34
  30. package/dist/esm/awaited.js.map +1 -1
  31. package/dist/esm/fileRoute.js +90 -92
  32. package/dist/esm/fileRoute.js.map +1 -1
  33. package/dist/esm/headContentUtils.js +92 -123
  34. package/dist/esm/headContentUtils.js.map +1 -1
  35. package/dist/esm/index.dev.js +16 -118
  36. package/dist/esm/index.js +18 -119
  37. package/dist/esm/lazyRouteComponent.js +69 -82
  38. package/dist/esm/lazyRouteComponent.js.map +1 -1
  39. package/dist/esm/link.js +364 -385
  40. package/dist/esm/link.js.map +1 -1
  41. package/dist/esm/matchContext.js +16 -11
  42. package/dist/esm/matchContext.js.map +1 -1
  43. package/dist/esm/not-found.js +30 -40
  44. package/dist/esm/not-found.js.map +1 -1
  45. package/dist/esm/renderRouteNotFound.js +20 -15
  46. package/dist/esm/renderRouteNotFound.js.map +1 -1
  47. package/dist/esm/route.js +196 -174
  48. package/dist/esm/route.js.map +1 -1
  49. package/dist/esm/router.js +11 -11
  50. package/dist/esm/router.js.map +1 -1
  51. package/dist/esm/routerContext.js +10 -7
  52. package/dist/esm/routerContext.js.map +1 -1
  53. package/dist/esm/scroll-restoration.js +39 -50
  54. package/dist/esm/scroll-restoration.js.map +1 -1
  55. package/dist/esm/ssr/RouterClient.js +29 -43
  56. package/dist/esm/ssr/RouterClient.js.map +1 -1
  57. package/dist/esm/ssr/RouterServer.js +29 -32
  58. package/dist/esm/ssr/RouterServer.js.map +1 -1
  59. package/dist/esm/ssr/client.js +1 -4
  60. package/dist/esm/ssr/defaultRenderHandler.js +11 -13
  61. package/dist/esm/ssr/defaultRenderHandler.js.map +1 -1
  62. package/dist/esm/ssr/defaultStreamHandler.js +12 -15
  63. package/dist/esm/ssr/defaultStreamHandler.js.map +1 -1
  64. package/dist/esm/ssr/renderRouterToStream.js +47 -65
  65. package/dist/esm/ssr/renderRouterToStream.js.map +1 -1
  66. package/dist/esm/ssr/renderRouterToString.js +24 -32
  67. package/dist/esm/ssr/renderRouterToString.js.map +1 -1
  68. package/dist/esm/ssr/server.js +3 -10
  69. package/dist/esm/useBlocker.js +243 -287
  70. package/dist/esm/useBlocker.js.map +1 -1
  71. package/dist/esm/useCanGoBack.js +6 -5
  72. package/dist/esm/useCanGoBack.js.map +1 -1
  73. package/dist/esm/useLoaderData.js +12 -11
  74. package/dist/esm/useLoaderData.js.map +1 -1
  75. package/dist/esm/useLoaderDeps.js +12 -14
  76. package/dist/esm/useLoaderDeps.js.map +1 -1
  77. package/dist/esm/useLocation.js +6 -7
  78. package/dist/esm/useLocation.js.map +1 -1
  79. package/dist/esm/useMatch.js +27 -35
  80. package/dist/esm/useMatch.js.map +1 -1
  81. package/dist/esm/useNavigate.js +18 -24
  82. package/dist/esm/useNavigate.js.map +1 -1
  83. package/dist/esm/useParams.js +13 -12
  84. package/dist/esm/useParams.js.map +1 -1
  85. package/dist/esm/useRouteContext.js +9 -8
  86. package/dist/esm/useRouteContext.js.map +1 -1
  87. package/dist/esm/useRouter.js +9 -8
  88. package/dist/esm/useRouter.js.map +1 -1
  89. package/dist/esm/useRouterState.js +18 -22
  90. package/dist/esm/useRouterState.js.map +1 -1
  91. package/dist/esm/useSearch.js +13 -12
  92. package/dist/esm/useSearch.js.map +1 -1
  93. package/dist/esm/utils.js +59 -38
  94. package/dist/esm/utils.js.map +1 -1
  95. package/package.json +3 -3
  96. package/dist/esm/index.dev.js.map +0 -1
  97. package/dist/esm/index.js.map +0 -1
  98. package/dist/esm/ssr/client.js.map +0 -1
  99. package/dist/esm/ssr/server.js.map +0 -1
@@ -1,8 +1,9 @@
1
1
  import { useRouterState } from "./useRouterState.js";
2
+ //#region src/useCanGoBack.ts
2
3
  function useCanGoBack() {
3
- return useRouterState({ select: (s) => s.location.state.__TSR_index !== 0 });
4
+ return useRouterState({ select: (s) => s.location.state.__TSR_index !== 0 });
4
5
  }
5
- export {
6
- useCanGoBack
7
- };
8
- //# sourceMappingURL=useCanGoBack.js.map
6
+ //#endregion
7
+ export { useCanGoBack };
8
+
9
+ //# sourceMappingURL=useCanGoBack.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"useCanGoBack.js","sources":["../../src/useCanGoBack.ts"],"sourcesContent":["import { useRouterState } from './useRouterState'\n\nexport function useCanGoBack() {\n return useRouterState({ select: (s) => s.location.state.__TSR_index !== 0 })\n}\n"],"names":[],"mappings":";AAEO,SAAS,eAAe;AAC7B,SAAO,eAAe,EAAE,QAAQ,CAAC,MAAM,EAAE,SAAS,MAAM,gBAAgB,GAAG;AAC7E;"}
1
+ {"version":3,"file":"useCanGoBack.js","names":[],"sources":["../../src/useCanGoBack.ts"],"sourcesContent":["import { useRouterState } from './useRouterState'\n\nexport function useCanGoBack() {\n return useRouterState({ select: (s) => s.location.state.__TSR_index !== 0 })\n}\n"],"mappings":";;AAEA,SAAgB,eAAe;AAC7B,QAAO,eAAe,EAAE,SAAS,MAAM,EAAE,SAAS,MAAM,gBAAgB,GAAG,CAAC"}
@@ -1,14 +1,15 @@
1
1
  import { useMatch } from "./useMatch.js";
2
+ //#region src/useLoaderData.tsx
2
3
  function useLoaderData(opts) {
3
- return useMatch({
4
- from: opts.from,
5
- strict: opts.strict,
6
- select: (s) => {
7
- return opts.select ? opts.select(s.loaderData) : s.loaderData;
8
- }
9
- });
4
+ return useMatch({
5
+ from: opts.from,
6
+ strict: opts.strict,
7
+ select: (s) => {
8
+ return opts.select ? opts.select(s.loaderData) : s.loaderData;
9
+ }
10
+ });
10
11
  }
11
- export {
12
- useLoaderData
13
- };
14
- //# sourceMappingURL=useLoaderData.js.map
12
+ //#endregion
13
+ export { useLoaderData };
14
+
15
+ //# sourceMappingURL=useLoaderData.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"useLoaderData.js","sources":["../../src/useLoaderData.tsx"],"sourcesContent":["import { useMatch } from './useMatch'\nimport type * as Vue from 'vue'\nimport type {\n AnyRouter,\n RegisteredRouter,\n ResolveUseLoaderData,\n StrictOrFrom,\n UseLoaderDataResult,\n} from '@tanstack/router-core'\n\nexport interface UseLoaderDataBaseOptions<\n TRouter extends AnyRouter,\n TFrom,\n TStrict extends boolean,\n TSelected,\n> {\n select?: (match: ResolveUseLoaderData<TRouter, TFrom, TStrict>) => TSelected\n}\n\nexport type UseLoaderDataOptions<\n TRouter extends AnyRouter,\n TFrom extends string | undefined,\n TStrict extends boolean,\n TSelected,\n> = StrictOrFrom<TRouter, TFrom, TStrict> &\n UseLoaderDataBaseOptions<TRouter, TFrom, TStrict, TSelected>\n\nexport type UseLoaderDataRoute<out TId> = <\n TRouter extends AnyRouter = RegisteredRouter,\n TSelected = unknown,\n>(\n opts?: UseLoaderDataBaseOptions<TRouter, TId, true, TSelected>,\n) => Vue.Ref<UseLoaderDataResult<TRouter, TId, true, TSelected>>\n\nexport function useLoaderData<\n TRouter extends AnyRouter = RegisteredRouter,\n const TFrom extends string | undefined = undefined,\n TStrict extends boolean = true,\n TSelected = unknown,\n>(\n opts: UseLoaderDataOptions<TRouter, TFrom, TStrict, TSelected>,\n): Vue.Ref<UseLoaderDataResult<TRouter, TFrom, TStrict, TSelected>> {\n return useMatch({\n from: opts.from!,\n strict: opts.strict,\n select: (s: any) => {\n return opts.select ? opts.select(s.loaderData) : s.loaderData\n },\n } as any) as any\n}\n"],"names":["useLoaderData","opts","useMatch","from","strict","select","s","loaderData"],"mappings":";AAkCO,SAASA,cAMdC,MACkE;AAClE,SAAOC,SAAS;AAAA,IACdC,MAAMF,KAAKE;AAAAA,IACXC,QAAQH,KAAKG;AAAAA,IACbC,QAASC,OAAW;AAClB,aAAOL,KAAKI,SAASJ,KAAKI,OAAOC,EAAEC,UAAU,IAAID,EAAEC;AAAAA,IACrD;AAAA,EACF,CAAQ;AACV;"}
1
+ {"version":3,"file":"useLoaderData.js","names":["useMatch","useLoaderData","opts","from","strict","select","s","loaderData"],"sources":["../../src/useLoaderData.tsx"],"sourcesContent":["import { useMatch } from './useMatch'\nimport type * as Vue from 'vue'\nimport type {\n AnyRouter,\n RegisteredRouter,\n ResolveUseLoaderData,\n StrictOrFrom,\n UseLoaderDataResult,\n} from '@tanstack/router-core'\n\nexport interface UseLoaderDataBaseOptions<\n TRouter extends AnyRouter,\n TFrom,\n TStrict extends boolean,\n TSelected,\n> {\n select?: (match: ResolveUseLoaderData<TRouter, TFrom, TStrict>) => TSelected\n}\n\nexport type UseLoaderDataOptions<\n TRouter extends AnyRouter,\n TFrom extends string | undefined,\n TStrict extends boolean,\n TSelected,\n> = StrictOrFrom<TRouter, TFrom, TStrict> &\n UseLoaderDataBaseOptions<TRouter, TFrom, TStrict, TSelected>\n\nexport type UseLoaderDataRoute<out TId> = <\n TRouter extends AnyRouter = RegisteredRouter,\n TSelected = unknown,\n>(\n opts?: UseLoaderDataBaseOptions<TRouter, TId, true, TSelected>,\n) => Vue.Ref<UseLoaderDataResult<TRouter, TId, true, TSelected>>\n\nexport function useLoaderData<\n TRouter extends AnyRouter = RegisteredRouter,\n const TFrom extends string | undefined = undefined,\n TStrict extends boolean = true,\n TSelected = unknown,\n>(\n opts: UseLoaderDataOptions<TRouter, TFrom, TStrict, TSelected>,\n): Vue.Ref<UseLoaderDataResult<TRouter, TFrom, TStrict, TSelected>> {\n return useMatch({\n from: opts.from!,\n strict: opts.strict,\n select: (s: any) => {\n return opts.select ? opts.select(s.loaderData) : s.loaderData\n },\n } as any) as any\n}\n"],"mappings":";;AAkCA,SAAgBC,cAMdC,MACkE;AAClE,QAAOF,SAAS;EACdG,MAAMD,KAAKC;EACXC,QAAQF,KAAKE;EACbC,SAASC,MAAW;AAClB,UAAOJ,KAAKG,SAASH,KAAKG,OAAOC,EAAEC,WAAW,GAAGD,EAAEC;;EAE/C,CAAC"}
@@ -1,17 +1,15 @@
1
1
  import { useMatch } from "./useMatch.js";
2
+ //#region src/useLoaderDeps.tsx
2
3
  function useLoaderDeps(opts) {
3
- const {
4
- select,
5
- ...rest
6
- } = opts;
7
- return useMatch({
8
- ...rest,
9
- select: (s) => {
10
- return select ? select(s.loaderDeps) : s.loaderDeps;
11
- }
12
- });
4
+ const { select, ...rest } = opts;
5
+ return useMatch({
6
+ ...rest,
7
+ select: (s) => {
8
+ return select ? select(s.loaderDeps) : s.loaderDeps;
9
+ }
10
+ });
13
11
  }
14
- export {
15
- useLoaderDeps
16
- };
17
- //# sourceMappingURL=useLoaderDeps.js.map
12
+ //#endregion
13
+ export { useLoaderDeps };
14
+
15
+ //# sourceMappingURL=useLoaderDeps.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"useLoaderDeps.js","sources":["../../src/useLoaderDeps.tsx"],"sourcesContent":["import { useMatch } from './useMatch'\nimport type {\n AnyRouter,\n RegisteredRouter,\n ResolveUseLoaderDeps,\n StrictOrFrom,\n UseLoaderDepsResult,\n} from '@tanstack/router-core'\n\nexport interface UseLoaderDepsBaseOptions<\n TRouter extends AnyRouter,\n TFrom,\n TSelected,\n> {\n select?: (deps: ResolveUseLoaderDeps<TRouter, TFrom>) => TSelected\n}\n\nexport type UseLoaderDepsOptions<\n TRouter extends AnyRouter,\n TFrom extends string | undefined,\n TSelected,\n> = StrictOrFrom<TRouter, TFrom> &\n UseLoaderDepsBaseOptions<TRouter, TFrom, TSelected>\n\nexport type UseLoaderDepsRoute<out TId> = <\n TRouter extends AnyRouter = RegisteredRouter,\n TSelected = unknown,\n>(\n opts?: UseLoaderDepsBaseOptions<TRouter, TId, TSelected>,\n) => UseLoaderDepsResult<TRouter, TId, TSelected>\n\nexport function useLoaderDeps<\n TRouter extends AnyRouter = RegisteredRouter,\n const TFrom extends string | undefined = undefined,\n TSelected = unknown,\n>(\n opts: UseLoaderDepsOptions<TRouter, TFrom, TSelected>,\n): UseLoaderDepsResult<TRouter, TFrom, TSelected> {\n const { select, ...rest } = opts\n return useMatch({\n ...rest,\n select: (s) => {\n return select ? select(s.loaderDeps) : s.loaderDeps\n },\n }) as UseLoaderDepsResult<TRouter, TFrom, TSelected>\n}\n"],"names":["useLoaderDeps","opts","select","rest","useMatch","s","loaderDeps"],"mappings":";AA+BO,SAASA,cAKdC,MACgD;AAChD,QAAM;AAAA,IAAEC;AAAAA,IAAQ,GAAGC;AAAAA,EAAK,IAAIF;AAC5B,SAAOG,SAAS;AAAA,IACd,GAAGD;AAAAA,IACHD,QAASG,OAAM;AACb,aAAOH,SAASA,OAAOG,EAAEC,UAAU,IAAID,EAAEC;AAAAA,IAC3C;AAAA,EACF,CAAC;AACH;"}
1
+ {"version":3,"file":"useLoaderDeps.js","names":["useMatch","useLoaderDeps","opts","select","rest","s","loaderDeps"],"sources":["../../src/useLoaderDeps.tsx"],"sourcesContent":["import { useMatch } from './useMatch'\nimport type {\n AnyRouter,\n RegisteredRouter,\n ResolveUseLoaderDeps,\n StrictOrFrom,\n UseLoaderDepsResult,\n} from '@tanstack/router-core'\n\nexport interface UseLoaderDepsBaseOptions<\n TRouter extends AnyRouter,\n TFrom,\n TSelected,\n> {\n select?: (deps: ResolveUseLoaderDeps<TRouter, TFrom>) => TSelected\n}\n\nexport type UseLoaderDepsOptions<\n TRouter extends AnyRouter,\n TFrom extends string | undefined,\n TSelected,\n> = StrictOrFrom<TRouter, TFrom> &\n UseLoaderDepsBaseOptions<TRouter, TFrom, TSelected>\n\nexport type UseLoaderDepsRoute<out TId> = <\n TRouter extends AnyRouter = RegisteredRouter,\n TSelected = unknown,\n>(\n opts?: UseLoaderDepsBaseOptions<TRouter, TId, TSelected>,\n) => UseLoaderDepsResult<TRouter, TId, TSelected>\n\nexport function useLoaderDeps<\n TRouter extends AnyRouter = RegisteredRouter,\n const TFrom extends string | undefined = undefined,\n TSelected = unknown,\n>(\n opts: UseLoaderDepsOptions<TRouter, TFrom, TSelected>,\n): UseLoaderDepsResult<TRouter, TFrom, TSelected> {\n const { select, ...rest } = opts\n return useMatch({\n ...rest,\n select: (s) => {\n return select ? select(s.loaderDeps) : s.loaderDeps\n },\n }) as UseLoaderDepsResult<TRouter, TFrom, TSelected>\n}\n"],"mappings":";;AA+BA,SAAgBC,cAKdC,MACgD;CAChD,MAAM,EAAEC,QAAQ,GAAGC,SAASF;AAC5B,QAAOF,SAAS;EACd,GAAGI;EACHD,SAASE,MAAM;AACb,UAAOF,SAASA,OAAOE,EAAEC,WAAW,GAAGD,EAAEC;;EAE5C,CAAC"}
@@ -1,10 +1,9 @@
1
1
  import { useRouterState } from "./useRouterState.js";
2
+ //#region src/useLocation.tsx
2
3
  function useLocation(opts) {
3
- return useRouterState({
4
- select: (state) => opts?.select ? opts.select(state.location) : state.location
5
- });
4
+ return useRouterState({ select: (state) => opts?.select ? opts.select(state.location) : state.location });
6
5
  }
7
- export {
8
- useLocation
9
- };
10
- //# sourceMappingURL=useLocation.js.map
6
+ //#endregion
7
+ export { useLocation };
8
+
9
+ //# sourceMappingURL=useLocation.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"useLocation.js","sources":["../../src/useLocation.tsx"],"sourcesContent":["import { useRouterState } from './useRouterState'\nimport type {\n AnyRouter,\n RegisteredRouter,\n RouterState,\n} from '@tanstack/router-core'\nimport type * as Vue from 'vue'\n\nexport interface UseLocationBaseOptions<TRouter extends AnyRouter, TSelected> {\n select?: (state: RouterState<TRouter['routeTree']>['location']) => TSelected\n}\n\nexport type UseLocationResult<\n TRouter extends AnyRouter,\n TSelected,\n> = unknown extends TSelected\n ? RouterState<TRouter['routeTree']>['location']\n : TSelected\n\nexport function useLocation<\n TRouter extends AnyRouter = RegisteredRouter,\n TSelected = unknown,\n>(\n opts?: UseLocationBaseOptions<TRouter, TSelected>,\n): Vue.Ref<UseLocationResult<TRouter, TSelected>> {\n return useRouterState({\n select: (state: any) =>\n opts?.select ? opts.select(state.location) : state.location,\n } as any) as Vue.Ref<UseLocationResult<TRouter, TSelected>>\n}\n"],"names":["useLocation","opts","useRouterState","select","state","location"],"mappings":";AAmBO,SAASA,YAIdC,MACgD;AAChD,SAAOC,eAAe;AAAA,IACpBC,QAASC,WACPH,MAAME,SAASF,KAAKE,OAAOC,MAAMC,QAAQ,IAAID,MAAMC;AAAAA,EACvD,CAAQ;AACV;"}
1
+ {"version":3,"file":"useLocation.js","names":["useRouterState","useLocation","opts","select","state","location"],"sources":["../../src/useLocation.tsx"],"sourcesContent":["import { useRouterState } from './useRouterState'\nimport type {\n AnyRouter,\n RegisteredRouter,\n RouterState,\n} from '@tanstack/router-core'\nimport type * as Vue from 'vue'\n\nexport interface UseLocationBaseOptions<TRouter extends AnyRouter, TSelected> {\n select?: (state: RouterState<TRouter['routeTree']>['location']) => TSelected\n}\n\nexport type UseLocationResult<\n TRouter extends AnyRouter,\n TSelected,\n> = unknown extends TSelected\n ? RouterState<TRouter['routeTree']>['location']\n : TSelected\n\nexport function useLocation<\n TRouter extends AnyRouter = RegisteredRouter,\n TSelected = unknown,\n>(\n opts?: UseLocationBaseOptions<TRouter, TSelected>,\n): Vue.Ref<UseLocationResult<TRouter, TSelected>> {\n return useRouterState({\n select: (state: any) =>\n opts?.select ? opts.select(state.location) : state.location,\n } as any) as Vue.Ref<UseLocationResult<TRouter, TSelected>>\n}\n"],"mappings":";;AAmBA,SAAgBC,YAIdC,MACgD;AAChD,QAAOF,eAAe,EACpBG,SAASC,UACPF,MAAMC,SAASD,KAAKC,OAAOC,MAAMC,SAAS,GAAGD,MAAMC,UAC/C,CAAC"}
@@ -1,39 +1,31 @@
1
- import * as Vue from "vue";
2
1
  import { useRouterState } from "./useRouterState.js";
3
2
  import { injectDummyMatch, injectMatch } from "./matchContext.js";
3
+ import * as Vue from "vue";
4
+ //#region src/useMatch.tsx
4
5
  function useMatch(opts) {
5
- const nearestMatchId = opts.from ? injectDummyMatch() : injectMatch();
6
- const pendingError = Vue.ref(null);
7
- const matchSelection = useRouterState({
8
- select: (state) => {
9
- const match = state.matches.find((d) => opts.from ? opts.from === d.routeId : d.id === nearestMatchId.value);
10
- if (match === void 0) {
11
- const pendingMatch = state.pendingMatches?.find((d) => opts.from ? opts.from === d.routeId : d.id === nearestMatchId.value);
12
- if (pendingMatch || state.isTransitioning) {
13
- pendingError.value = null;
14
- return void 0;
15
- }
16
- if (opts.shouldThrow ?? true) {
17
- pendingError.value = new Error(`Invariant failed: Could not find ${opts.from ? `an active match from "${opts.from}"` : "a nearest match!"}`);
18
- }
19
- return void 0;
20
- }
21
- pendingError.value = null;
22
- return opts.select ? opts.select(match) : match;
23
- }
24
- });
25
- const result = Vue.computed(() => {
26
- if (pendingError.value) {
27
- throw pendingError.value;
28
- }
29
- return matchSelection.value;
30
- });
31
- if (pendingError.value) {
32
- throw pendingError.value;
33
- }
34
- return result;
6
+ const nearestMatchId = opts.from ? injectDummyMatch() : injectMatch();
7
+ const pendingError = Vue.ref(null);
8
+ const matchSelection = useRouterState({ select: (state) => {
9
+ const match = state.matches.find((d) => opts.from ? opts.from === d.routeId : d.id === nearestMatchId.value);
10
+ if (match === void 0) {
11
+ if (state.pendingMatches?.find((d) => opts.from ? opts.from === d.routeId : d.id === nearestMatchId.value) || state.isTransitioning) {
12
+ pendingError.value = null;
13
+ return;
14
+ }
15
+ if (opts.shouldThrow ?? true) pendingError.value = /* @__PURE__ */ new Error(`Invariant failed: Could not find ${opts.from ? `an active match from "${opts.from}"` : "a nearest match!"}`);
16
+ return;
17
+ }
18
+ pendingError.value = null;
19
+ return opts.select ? opts.select(match) : match;
20
+ } });
21
+ const result = Vue.computed(() => {
22
+ if (pendingError.value) throw pendingError.value;
23
+ return matchSelection.value;
24
+ });
25
+ if (pendingError.value) throw pendingError.value;
26
+ return result;
35
27
  }
36
- export {
37
- useMatch
38
- };
39
- //# sourceMappingURL=useMatch.js.map
28
+ //#endregion
29
+ export { useMatch };
30
+
31
+ //# sourceMappingURL=useMatch.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"useMatch.js","sources":["../../src/useMatch.tsx"],"sourcesContent":["import * as Vue from 'vue'\nimport { useRouterState } from './useRouterState'\nimport { injectDummyMatch, injectMatch } from './matchContext'\nimport type {\n AnyRouter,\n MakeRouteMatch,\n MakeRouteMatchUnion,\n RegisteredRouter,\n StrictOrFrom,\n ThrowConstraint,\n ThrowOrOptional,\n} from '@tanstack/router-core'\n\nexport interface UseMatchBaseOptions<\n TRouter extends AnyRouter,\n TFrom,\n TStrict extends boolean,\n TThrow extends boolean,\n TSelected,\n> {\n select?: (\n match: MakeRouteMatch<TRouter['routeTree'], TFrom, TStrict>,\n ) => TSelected\n shouldThrow?: TThrow\n}\n\nexport type UseMatchRoute<out TFrom> = <\n TRouter extends AnyRouter = RegisteredRouter,\n TSelected = unknown,\n>(\n opts?: UseMatchBaseOptions<TRouter, TFrom, true, true, TSelected>,\n) => Vue.Ref<UseMatchResult<TRouter, TFrom, true, TSelected>>\n\nexport type UseMatchOptions<\n TRouter extends AnyRouter,\n TFrom extends string | undefined,\n TStrict extends boolean,\n TThrow extends boolean,\n TSelected,\n> = StrictOrFrom<TRouter, TFrom, TStrict> &\n UseMatchBaseOptions<TRouter, TFrom, TStrict, TThrow, TSelected>\n\nexport type UseMatchResult<\n TRouter extends AnyRouter,\n TFrom,\n TStrict extends boolean,\n TSelected,\n> = unknown extends TSelected\n ? TStrict extends true\n ? MakeRouteMatch<TRouter['routeTree'], TFrom, TStrict>\n : MakeRouteMatchUnion<TRouter>\n : TSelected\n\nexport function useMatch<\n TRouter extends AnyRouter = RegisteredRouter,\n const TFrom extends string | undefined = undefined,\n TStrict extends boolean = true,\n TThrow extends boolean = true,\n TSelected = unknown,\n>(\n opts: UseMatchOptions<\n TRouter,\n TFrom,\n TStrict,\n ThrowConstraint<TStrict, TThrow>,\n TSelected\n >,\n): Vue.Ref<\n ThrowOrOptional<UseMatchResult<TRouter, TFrom, TStrict, TSelected>, TThrow>\n> {\n const nearestMatchId = opts.from ? injectDummyMatch() : injectMatch()\n\n // Store to track pending error for deferred throwing\n const pendingError = Vue.ref<Error | null>(null)\n\n // Select the match from router state\n const matchSelection = useRouterState({\n select: (state: any) => {\n const match = state.matches.find((d: any) =>\n opts.from ? opts.from === d.routeId : d.id === nearestMatchId.value,\n )\n\n if (match === undefined) {\n // During navigation transitions, check if the match exists in pendingMatches\n const pendingMatch = state.pendingMatches?.find((d: any) =>\n opts.from ? opts.from === d.routeId : d.id === nearestMatchId.value,\n )\n\n // If there's a pending match or we're transitioning, return undefined without throwing\n if (pendingMatch || state.isTransitioning) {\n pendingError.value = null\n return undefined\n }\n\n // Store the error to throw later if shouldThrow is enabled\n if (opts.shouldThrow ?? true) {\n pendingError.value = new Error(\n `Invariant failed: Could not find ${opts.from ? `an active match from \"${opts.from}\"` : 'a nearest match!'}`,\n )\n }\n\n return undefined\n }\n\n pendingError.value = null\n return opts.select ? opts.select(match) : match\n },\n } as any)\n\n // Throw the error if we have one - this happens after the selector runs\n // Using a computed so the error is thrown when the return value is accessed\n const result = Vue.computed(() => {\n // Check for pending error first\n if (pendingError.value) {\n throw pendingError.value\n }\n return matchSelection.value\n })\n\n // Also immediately throw if there's already an error from initial render\n // This ensures errors are thrown even if the returned ref is never accessed\n if (pendingError.value) {\n throw pendingError.value\n }\n\n return result as any\n}\n"],"names":["useMatch","opts","nearestMatchId","from","injectDummyMatch","injectMatch","pendingError","Vue","ref","matchSelection","useRouterState","select","state","match","matches","find","d","routeId","id","value","undefined","pendingMatch","pendingMatches","isTransitioning","shouldThrow","Error","result","computed"],"mappings":";;;AAqDO,SAASA,SAOdC,MASA;AACA,QAAMC,iBAAiBD,KAAKE,OAAOC,iBAAgB,IAAKC,YAAW;AAGnE,QAAMC,eAAeC,IAAIC,IAAkB,IAAI;AAG/C,QAAMC,iBAAiBC,eAAe;AAAA,IACpCC,QAASC,WAAe;AACtB,YAAMC,QAAQD,MAAME,QAAQC,KAAMC,OAChCf,KAAKE,OAAOF,KAAKE,SAASa,EAAEC,UAAUD,EAAEE,OAAOhB,eAAeiB,KAChE;AAEA,UAAIN,UAAUO,QAAW;AAEvB,cAAMC,eAAeT,MAAMU,gBAAgBP,KAAMC,OAC/Cf,KAAKE,OAAOF,KAAKE,SAASa,EAAEC,UAAUD,EAAEE,OAAOhB,eAAeiB,KAChE;AAGA,YAAIE,gBAAgBT,MAAMW,iBAAiB;AACzCjB,uBAAaa,QAAQ;AACrB,iBAAOC;AAAAA,QACT;AAGA,YAAInB,KAAKuB,eAAe,MAAM;AAC5BlB,uBAAaa,QAAQ,IAAIM,MACvB,oCAAoCxB,KAAKE,OAAO,yBAAyBF,KAAKE,IAAI,MAAM,kBAAkB,EAC5G;AAAA,QACF;AAEA,eAAOiB;AAAAA,MACT;AAEAd,mBAAaa,QAAQ;AACrB,aAAOlB,KAAKU,SAASV,KAAKU,OAAOE,KAAK,IAAIA;AAAAA,IAC5C;AAAA,EACF,CAAQ;AAIR,QAAMa,SAASnB,IAAIoB,SAAS,MAAM;AAEhC,QAAIrB,aAAaa,OAAO;AACtB,YAAMb,aAAaa;AAAAA,IACrB;AACA,WAAOV,eAAeU;AAAAA,EACxB,CAAC;AAID,MAAIb,aAAaa,OAAO;AACtB,UAAMb,aAAaa;AAAAA,EACrB;AAEA,SAAOO;AACT;"}
1
+ {"version":3,"file":"useMatch.js","names":["Vue","useRouterState","injectDummyMatch","injectMatch","useMatch","opts","nearestMatchId","from","pendingError","ref","matchSelection","select","state","match","matches","find","d","routeId","id","value","undefined","pendingMatch","pendingMatches","isTransitioning","shouldThrow","Error","result","computed"],"sources":["../../src/useMatch.tsx"],"sourcesContent":["import * as Vue from 'vue'\nimport { useRouterState } from './useRouterState'\nimport { injectDummyMatch, injectMatch } from './matchContext'\nimport type {\n AnyRouter,\n MakeRouteMatch,\n MakeRouteMatchUnion,\n RegisteredRouter,\n StrictOrFrom,\n ThrowConstraint,\n ThrowOrOptional,\n} from '@tanstack/router-core'\n\nexport interface UseMatchBaseOptions<\n TRouter extends AnyRouter,\n TFrom,\n TStrict extends boolean,\n TThrow extends boolean,\n TSelected,\n> {\n select?: (\n match: MakeRouteMatch<TRouter['routeTree'], TFrom, TStrict>,\n ) => TSelected\n shouldThrow?: TThrow\n}\n\nexport type UseMatchRoute<out TFrom> = <\n TRouter extends AnyRouter = RegisteredRouter,\n TSelected = unknown,\n>(\n opts?: UseMatchBaseOptions<TRouter, TFrom, true, true, TSelected>,\n) => Vue.Ref<UseMatchResult<TRouter, TFrom, true, TSelected>>\n\nexport type UseMatchOptions<\n TRouter extends AnyRouter,\n TFrom extends string | undefined,\n TStrict extends boolean,\n TThrow extends boolean,\n TSelected,\n> = StrictOrFrom<TRouter, TFrom, TStrict> &\n UseMatchBaseOptions<TRouter, TFrom, TStrict, TThrow, TSelected>\n\nexport type UseMatchResult<\n TRouter extends AnyRouter,\n TFrom,\n TStrict extends boolean,\n TSelected,\n> = unknown extends TSelected\n ? TStrict extends true\n ? MakeRouteMatch<TRouter['routeTree'], TFrom, TStrict>\n : MakeRouteMatchUnion<TRouter>\n : TSelected\n\nexport function useMatch<\n TRouter extends AnyRouter = RegisteredRouter,\n const TFrom extends string | undefined = undefined,\n TStrict extends boolean = true,\n TThrow extends boolean = true,\n TSelected = unknown,\n>(\n opts: UseMatchOptions<\n TRouter,\n TFrom,\n TStrict,\n ThrowConstraint<TStrict, TThrow>,\n TSelected\n >,\n): Vue.Ref<\n ThrowOrOptional<UseMatchResult<TRouter, TFrom, TStrict, TSelected>, TThrow>\n> {\n const nearestMatchId = opts.from ? injectDummyMatch() : injectMatch()\n\n // Store to track pending error for deferred throwing\n const pendingError = Vue.ref<Error | null>(null)\n\n // Select the match from router state\n const matchSelection = useRouterState({\n select: (state: any) => {\n const match = state.matches.find((d: any) =>\n opts.from ? opts.from === d.routeId : d.id === nearestMatchId.value,\n )\n\n if (match === undefined) {\n // During navigation transitions, check if the match exists in pendingMatches\n const pendingMatch = state.pendingMatches?.find((d: any) =>\n opts.from ? opts.from === d.routeId : d.id === nearestMatchId.value,\n )\n\n // If there's a pending match or we're transitioning, return undefined without throwing\n if (pendingMatch || state.isTransitioning) {\n pendingError.value = null\n return undefined\n }\n\n // Store the error to throw later if shouldThrow is enabled\n if (opts.shouldThrow ?? true) {\n pendingError.value = new Error(\n `Invariant failed: Could not find ${opts.from ? `an active match from \"${opts.from}\"` : 'a nearest match!'}`,\n )\n }\n\n return undefined\n }\n\n pendingError.value = null\n return opts.select ? opts.select(match) : match\n },\n } as any)\n\n // Throw the error if we have one - this happens after the selector runs\n // Using a computed so the error is thrown when the return value is accessed\n const result = Vue.computed(() => {\n // Check for pending error first\n if (pendingError.value) {\n throw pendingError.value\n }\n return matchSelection.value\n })\n\n // Also immediately throw if there's already an error from initial render\n // This ensures errors are thrown even if the returned ref is never accessed\n if (pendingError.value) {\n throw pendingError.value\n }\n\n return result as any\n}\n"],"mappings":";;;;AAqDA,SAAgBI,SAOdC,MASA;CACA,MAAMC,iBAAiBD,KAAKE,OAAOL,kBAAkB,GAAGC,aAAa;CAGrE,MAAMK,eAAeR,IAAIS,IAAkB,KAAK;CAGhD,MAAMC,iBAAiBT,eAAe,EACpCU,SAASC,UAAe;EACtB,MAAMC,QAAQD,MAAME,QAAQC,MAAMC,MAChCX,KAAKE,OAAOF,KAAKE,SAASS,EAAEC,UAAUD,EAAEE,OAAOZ,eAAea,MAC/D;AAED,MAAIN,UAAUO,KAAAA,GAAW;AAOvB,OALqBR,MAAMU,gBAAgBP,MAAMC,MAC/CX,KAAKE,OAAOF,KAAKE,SAASS,EAAEC,UAAUD,EAAEE,OAAOZ,eAAea,MAC/D,IAGmBP,MAAMW,iBAAiB;AACzCf,iBAAaW,QAAQ;AACrB;;AAIF,OAAId,KAAKmB,eAAe,KACtBhB,cAAaW,wBAAQ,IAAIM,MACvB,oCAAoCpB,KAAKE,OAAO,yBAAyBF,KAAKE,KAAI,KAAM,qBACzF;AAGH;;AAGFC,eAAaW,QAAQ;AACrB,SAAOd,KAAKM,SAASN,KAAKM,OAAOE,MAAM,GAAGA;IAEtC,CAAC;CAIT,MAAMa,SAAS1B,IAAI2B,eAAe;AAEhC,MAAInB,aAAaW,MACf,OAAMX,aAAaW;AAErB,SAAOT,eAAeS;GACtB;AAIF,KAAIX,aAAaW,MACf,OAAMX,aAAaW;AAGrB,QAAOO"}
@@ -1,29 +1,23 @@
1
- import * as Vue from "vue";
2
1
  import { useRouter } from "./useRouter.js";
2
+ import * as Vue from "vue";
3
+ //#region src/useNavigate.tsx
3
4
  function useNavigate(_defaultOpts) {
4
- const {
5
- navigate
6
- } = useRouter();
7
- return (options) => {
8
- return navigate({
9
- from: _defaultOpts?.from,
10
- ...options
11
- });
12
- };
5
+ const { navigate } = useRouter();
6
+ return (options) => {
7
+ return navigate({
8
+ from: _defaultOpts?.from,
9
+ ...options
10
+ });
11
+ };
13
12
  }
14
13
  function Navigate(props) {
15
- const {
16
- navigate
17
- } = useRouter();
18
- Vue.onMounted(() => {
19
- navigate({
20
- ...props
21
- });
22
- });
23
- return null;
14
+ const { navigate } = useRouter();
15
+ Vue.onMounted(() => {
16
+ navigate({ ...props });
17
+ });
18
+ return null;
24
19
  }
25
- export {
26
- Navigate,
27
- useNavigate
28
- };
29
- //# sourceMappingURL=useNavigate.js.map
20
+ //#endregion
21
+ export { Navigate, useNavigate };
22
+
23
+ //# sourceMappingURL=useNavigate.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"useNavigate.js","sources":["../../src/useNavigate.tsx"],"sourcesContent":["import * as Vue from 'vue'\nimport { useRouter } from './useRouter'\nimport type {\n AnyRouter,\n FromPathOption,\n NavigateOptions,\n RegisteredRouter,\n UseNavigateResult,\n} from '@tanstack/router-core'\n\nexport function useNavigate<\n TRouter extends AnyRouter = RegisteredRouter,\n TDefaultFrom extends string = string,\n>(_defaultOpts?: {\n from?: FromPathOption<TRouter, TDefaultFrom>\n}): UseNavigateResult<TDefaultFrom> {\n const { navigate } = useRouter()\n\n return ((options: NavigateOptions) => {\n return navigate({ from: _defaultOpts?.from, ...options })\n }) as UseNavigateResult<TDefaultFrom>\n}\n\nexport function Navigate<\n TRouter extends AnyRouter = RegisteredRouter,\n const TFrom extends string = string,\n const TTo extends string | undefined = undefined,\n const TMaskFrom extends string = TFrom,\n const TMaskTo extends string = '',\n>(props: NavigateOptions<TRouter, TFrom, TTo, TMaskFrom, TMaskTo>): null {\n const { navigate } = useRouter()\n\n Vue.onMounted(() => {\n navigate({\n ...props,\n })\n })\n\n return null\n}\n"],"names":["useNavigate","_defaultOpts","navigate","useRouter","options","from","Navigate","props","Vue","onMounted"],"mappings":";;AAUO,SAASA,YAGdC,cAEkC;AAClC,QAAM;AAAA,IAAEC;AAAAA,MAAaC,UAAS;AAE9B,SAASC,aAA6B;AACpC,WAAOF,SAAS;AAAA,MAAEG,MAAMJ,cAAcI;AAAAA,MAAM,GAAGD;AAAAA,IAAQ,CAAC;AAAA,EAC1D;AACF;AAEO,SAASE,SAMdC,OAAuE;AACvE,QAAM;AAAA,IAAEL;AAAAA,MAAaC,UAAS;AAE9BK,MAAIC,UAAU,MAAM;AAClBP,aAAS;AAAA,MACP,GAAGK;AAAAA,IACL,CAAC;AAAA,EACH,CAAC;AAED,SAAO;AACT;"}
1
+ {"version":3,"file":"useNavigate.js","names":["Vue","useRouter","useNavigate","_defaultOpts","navigate","options","from","Navigate","props","onMounted"],"sources":["../../src/useNavigate.tsx"],"sourcesContent":["import * as Vue from 'vue'\nimport { useRouter } from './useRouter'\nimport type {\n AnyRouter,\n FromPathOption,\n NavigateOptions,\n RegisteredRouter,\n UseNavigateResult,\n} from '@tanstack/router-core'\n\nexport function useNavigate<\n TRouter extends AnyRouter = RegisteredRouter,\n TDefaultFrom extends string = string,\n>(_defaultOpts?: {\n from?: FromPathOption<TRouter, TDefaultFrom>\n}): UseNavigateResult<TDefaultFrom> {\n const { navigate } = useRouter()\n\n return ((options: NavigateOptions) => {\n return navigate({ from: _defaultOpts?.from, ...options })\n }) as UseNavigateResult<TDefaultFrom>\n}\n\nexport function Navigate<\n TRouter extends AnyRouter = RegisteredRouter,\n const TFrom extends string = string,\n const TTo extends string | undefined = undefined,\n const TMaskFrom extends string = TFrom,\n const TMaskTo extends string = '',\n>(props: NavigateOptions<TRouter, TFrom, TTo, TMaskFrom, TMaskTo>): null {\n const { navigate } = useRouter()\n\n Vue.onMounted(() => {\n navigate({\n ...props,\n })\n })\n\n return null\n}\n"],"mappings":";;;AAUA,SAAgBE,YAGdC,cAEkC;CAClC,MAAM,EAAEC,aAAaH,WAAW;AAEhC,SAASI,YAA6B;AACpC,SAAOD,SAAS;GAAEE,MAAMH,cAAcG;GAAM,GAAGD;GAAS,CAAC;;;AAI7D,SAAgBE,SAMdC,OAAuE;CACvE,MAAM,EAAEJ,aAAaH,WAAW;AAEhCD,KAAIS,gBAAgB;AAClBL,WAAS,EACP,GAAGI,OACJ,CAAC;GACF;AAEF,QAAO"}
@@ -1,15 +1,16 @@
1
1
  import { useMatch } from "./useMatch.js";
2
+ //#region src/useParams.tsx
2
3
  function useParams(opts) {
3
- return useMatch({
4
- from: opts.from,
5
- strict: opts.strict,
6
- shouldThrow: opts.shouldThrow,
7
- select: (match) => {
8
- return opts.select ? opts.select(match.params) : match.params;
9
- }
10
- });
4
+ return useMatch({
5
+ from: opts.from,
6
+ strict: opts.strict,
7
+ shouldThrow: opts.shouldThrow,
8
+ select: (match) => {
9
+ return opts.select ? opts.select(match.params) : match.params;
10
+ }
11
+ });
11
12
  }
12
- export {
13
- useParams
14
- };
15
- //# sourceMappingURL=useParams.js.map
13
+ //#endregion
14
+ export { useParams };
15
+
16
+ //# sourceMappingURL=useParams.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"useParams.js","sources":["../../src/useParams.tsx"],"sourcesContent":["import { useMatch } from './useMatch'\nimport type * as Vue from 'vue'\nimport type {\n AnyRouter,\n RegisteredRouter,\n ResolveUseParams,\n StrictOrFrom,\n ThrowConstraint,\n ThrowOrOptional,\n UseParamsResult,\n} from '@tanstack/router-core'\n\nexport interface UseParamsBaseOptions<\n TRouter extends AnyRouter,\n TFrom,\n TStrict extends boolean,\n TThrow extends boolean,\n TSelected,\n> {\n select?: (params: ResolveUseParams<TRouter, TFrom, TStrict>) => TSelected\n shouldThrow?: TThrow\n}\n\nexport type UseParamsOptions<\n TRouter extends AnyRouter,\n TFrom extends string | undefined,\n TStrict extends boolean,\n TThrow extends boolean,\n TSelected,\n> = StrictOrFrom<TRouter, TFrom, TStrict> &\n UseParamsBaseOptions<TRouter, TFrom, TStrict, TThrow, TSelected>\n\nexport type UseParamsRoute<out TFrom> = <\n TRouter extends AnyRouter = RegisteredRouter,\n TSelected = unknown,\n>(\n opts?: UseParamsBaseOptions<\n TRouter,\n TFrom,\n /* TStrict */ true,\n /* TThrow */ true,\n TSelected\n >,\n) => Vue.Ref<UseParamsResult<TRouter, TFrom, true, TSelected>>\n\nexport function useParams<\n TRouter extends AnyRouter = RegisteredRouter,\n const TFrom extends string | undefined = undefined,\n TStrict extends boolean = true,\n TThrow extends boolean = true,\n TSelected = unknown,\n>(\n opts: UseParamsOptions<\n TRouter,\n TFrom,\n TStrict,\n ThrowConstraint<TStrict, TThrow>,\n TSelected\n >,\n): Vue.Ref<\n ThrowOrOptional<UseParamsResult<TRouter, TFrom, TStrict, TSelected>, TThrow>\n> {\n return useMatch({\n from: opts.from!,\n strict: opts.strict,\n shouldThrow: opts.shouldThrow,\n select: (match: any) => {\n return opts.select ? opts.select(match.params) : match.params\n },\n } as any) as any\n}\n"],"names":["useParams","opts","useMatch","from","strict","shouldThrow","select","match","params"],"mappings":";AA6CO,SAASA,UAOdC,MASA;AACA,SAAOC,SAAS;AAAA,IACdC,MAAMF,KAAKE;AAAAA,IACXC,QAAQH,KAAKG;AAAAA,IACbC,aAAaJ,KAAKI;AAAAA,IAClBC,QAASC,WAAe;AACtB,aAAON,KAAKK,SAASL,KAAKK,OAAOC,MAAMC,MAAM,IAAID,MAAMC;AAAAA,IACzD;AAAA,EACF,CAAQ;AACV;"}
1
+ {"version":3,"file":"useParams.js","names":["useMatch","useParams","opts","from","strict","shouldThrow","select","match","params"],"sources":["../../src/useParams.tsx"],"sourcesContent":["import { useMatch } from './useMatch'\nimport type * as Vue from 'vue'\nimport type {\n AnyRouter,\n RegisteredRouter,\n ResolveUseParams,\n StrictOrFrom,\n ThrowConstraint,\n ThrowOrOptional,\n UseParamsResult,\n} from '@tanstack/router-core'\n\nexport interface UseParamsBaseOptions<\n TRouter extends AnyRouter,\n TFrom,\n TStrict extends boolean,\n TThrow extends boolean,\n TSelected,\n> {\n select?: (params: ResolveUseParams<TRouter, TFrom, TStrict>) => TSelected\n shouldThrow?: TThrow\n}\n\nexport type UseParamsOptions<\n TRouter extends AnyRouter,\n TFrom extends string | undefined,\n TStrict extends boolean,\n TThrow extends boolean,\n TSelected,\n> = StrictOrFrom<TRouter, TFrom, TStrict> &\n UseParamsBaseOptions<TRouter, TFrom, TStrict, TThrow, TSelected>\n\nexport type UseParamsRoute<out TFrom> = <\n TRouter extends AnyRouter = RegisteredRouter,\n TSelected = unknown,\n>(\n opts?: UseParamsBaseOptions<\n TRouter,\n TFrom,\n /* TStrict */ true,\n /* TThrow */ true,\n TSelected\n >,\n) => Vue.Ref<UseParamsResult<TRouter, TFrom, true, TSelected>>\n\nexport function useParams<\n TRouter extends AnyRouter = RegisteredRouter,\n const TFrom extends string | undefined = undefined,\n TStrict extends boolean = true,\n TThrow extends boolean = true,\n TSelected = unknown,\n>(\n opts: UseParamsOptions<\n TRouter,\n TFrom,\n TStrict,\n ThrowConstraint<TStrict, TThrow>,\n TSelected\n >,\n): Vue.Ref<\n ThrowOrOptional<UseParamsResult<TRouter, TFrom, TStrict, TSelected>, TThrow>\n> {\n return useMatch({\n from: opts.from!,\n strict: opts.strict,\n shouldThrow: opts.shouldThrow,\n select: (match: any) => {\n return opts.select ? opts.select(match.params) : match.params\n },\n } as any) as any\n}\n"],"mappings":";;AA6CA,SAAgBC,UAOdC,MASA;AACA,QAAOF,SAAS;EACdG,MAAMD,KAAKC;EACXC,QAAQF,KAAKE;EACbC,aAAaH,KAAKG;EAClBC,SAASC,UAAe;AACtB,UAAOL,KAAKI,SAASJ,KAAKI,OAAOC,MAAMC,OAAO,GAAGD,MAAMC;;EAEnD,CAAC"}
@@ -1,11 +1,12 @@
1
1
  import { useMatch } from "./useMatch.js";
2
+ //#region src/useRouteContext.ts
2
3
  function useRouteContext(opts) {
3
- return useMatch({
4
- ...opts,
5
- select: (match) => opts.select ? opts.select(match.context) : match.context
6
- });
4
+ return useMatch({
5
+ ...opts,
6
+ select: (match) => opts.select ? opts.select(match.context) : match.context
7
+ });
7
8
  }
8
- export {
9
- useRouteContext
10
- };
11
- //# sourceMappingURL=useRouteContext.js.map
9
+ //#endregion
10
+ export { useRouteContext };
11
+
12
+ //# sourceMappingURL=useRouteContext.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"useRouteContext.js","sources":["../../src/useRouteContext.ts"],"sourcesContent":["import { useMatch } from './useMatch'\nimport type * as Vue from 'vue'\nimport type {\n AnyRouter,\n RegisteredRouter,\n UseRouteContextBaseOptions,\n UseRouteContextOptions,\n UseRouteContextResult,\n} from '@tanstack/router-core'\n\nexport type UseRouteContextRoute<out TFrom> = <\n TRouter extends AnyRouter = RegisteredRouter,\n TSelected = unknown,\n>(\n opts?: UseRouteContextBaseOptions<TRouter, TFrom, true, TSelected>,\n) => Vue.Ref<UseRouteContextResult<TRouter, TFrom, true, TSelected>>\n\nexport function useRouteContext<\n TRouter extends AnyRouter = RegisteredRouter,\n const TFrom extends string | undefined = undefined,\n TStrict extends boolean = true,\n TSelected = unknown,\n>(\n opts: UseRouteContextOptions<TRouter, TFrom, TStrict, TSelected>,\n): Vue.Ref<UseRouteContextResult<TRouter, TFrom, TStrict, TSelected>> {\n return useMatch({\n ...(opts as any),\n select: (match) =>\n opts.select ? opts.select(match.context) : match.context,\n }) as any\n}\n"],"names":[],"mappings":";AAiBO,SAAS,gBAMd,MACoE;AACpE,SAAO,SAAS;AAAA,IACd,GAAI;AAAA,IACJ,QAAQ,CAAC,UACP,KAAK,SAAS,KAAK,OAAO,MAAM,OAAO,IAAI,MAAM;AAAA,EAAA,CACpD;AACH;"}
1
+ {"version":3,"file":"useRouteContext.js","names":[],"sources":["../../src/useRouteContext.ts"],"sourcesContent":["import { useMatch } from './useMatch'\nimport type * as Vue from 'vue'\nimport type {\n AnyRouter,\n RegisteredRouter,\n UseRouteContextBaseOptions,\n UseRouteContextOptions,\n UseRouteContextResult,\n} from '@tanstack/router-core'\n\nexport type UseRouteContextRoute<out TFrom> = <\n TRouter extends AnyRouter = RegisteredRouter,\n TSelected = unknown,\n>(\n opts?: UseRouteContextBaseOptions<TRouter, TFrom, true, TSelected>,\n) => Vue.Ref<UseRouteContextResult<TRouter, TFrom, true, TSelected>>\n\nexport function useRouteContext<\n TRouter extends AnyRouter = RegisteredRouter,\n const TFrom extends string | undefined = undefined,\n TStrict extends boolean = true,\n TSelected = unknown,\n>(\n opts: UseRouteContextOptions<TRouter, TFrom, TStrict, TSelected>,\n): Vue.Ref<UseRouteContextResult<TRouter, TFrom, TStrict, TSelected>> {\n return useMatch({\n ...(opts as any),\n select: (match) =>\n opts.select ? opts.select(match.context) : match.context,\n }) as any\n}\n"],"mappings":";;AAiBA,SAAgB,gBAMd,MACoE;AACpE,QAAO,SAAS;EACd,GAAI;EACJ,SAAS,UACP,KAAK,SAAS,KAAK,OAAO,MAAM,QAAQ,GAAG,MAAM;EACpD,CAAC"}
@@ -1,12 +1,13 @@
1
+ import { routerContext } from "./routerContext.js";
1
2
  import * as Vue from "vue";
2
3
  import warning from "tiny-warning";
3
- import { routerContext } from "./routerContext.js";
4
+ //#region src/useRouter.tsx
4
5
  function useRouter(opts) {
5
- const value = Vue.inject(routerContext, null);
6
- warning(!((opts?.warn ?? true) && !value), "useRouter must be used inside a <RouterProvider> component!");
7
- return value;
6
+ const value = Vue.inject(routerContext, null);
7
+ warning(!((opts?.warn ?? true) && !value), "useRouter must be used inside a <RouterProvider> component!");
8
+ return value;
8
9
  }
9
- export {
10
- useRouter
11
- };
12
- //# sourceMappingURL=useRouter.js.map
10
+ //#endregion
11
+ export { useRouter };
12
+
13
+ //# sourceMappingURL=useRouter.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"useRouter.js","sources":["../../src/useRouter.tsx"],"sourcesContent":["import * as Vue from 'vue'\nimport warning from 'tiny-warning'\nimport { routerContext } from './routerContext'\nimport type { AnyRouter, RegisteredRouter } from '@tanstack/router-core'\n\nexport function useRouter<TRouter extends AnyRouter = RegisteredRouter>(opts?: {\n warn?: boolean\n}): TRouter {\n const value = Vue.inject(routerContext as any, null)\n warning(\n !((opts?.warn ?? true) && !value),\n 'useRouter must be used inside a <RouterProvider> component!',\n )\n return value as any\n}\n"],"names":["useRouter","opts","value","Vue","inject","routerContext","warning","warn"],"mappings":";;;AAKO,SAASA,UAAwDC,MAE5D;AACV,QAAMC,QAAQC,IAAIC,OAAOC,eAAsB,IAAI;AACnDC,UACE,GAAGL,MAAMM,QAAQ,SAAS,CAACL,QAC3B,6DACF;AACA,SAAOA;AACT;"}
1
+ {"version":3,"file":"useRouter.js","names":["Vue","warning","routerContext","useRouter","opts","value","inject","warn"],"sources":["../../src/useRouter.tsx"],"sourcesContent":["import * as Vue from 'vue'\nimport warning from 'tiny-warning'\nimport { routerContext } from './routerContext'\nimport type { AnyRouter, RegisteredRouter } from '@tanstack/router-core'\n\nexport function useRouter<TRouter extends AnyRouter = RegisteredRouter>(opts?: {\n warn?: boolean\n}): TRouter {\n const value = Vue.inject(routerContext as any, null)\n warning(\n !((opts?.warn ?? true) && !value),\n 'useRouter must be used inside a <RouterProvider> component!',\n )\n return value as any\n}\n"],"mappings":";;;;AAKA,SAAgBG,UAAwDC,MAE5D;CACV,MAAMC,QAAQL,IAAIM,OAAOJ,eAAsB,KAAK;AACpDD,SACE,GAAGG,MAAMG,QAAQ,SAAS,CAACF,QAC3B,8DACD;AACD,QAAOA"}
@@ -1,26 +1,22 @@
1
- import { useStore } from "@tanstack/vue-store";
1
+ import { useRouter } from "./useRouter.js";
2
2
  import * as Vue from "vue";
3
+ import { useStore } from "@tanstack/vue-store";
3
4
  import { isServer } from "@tanstack/router-core/isServer";
4
- import { useRouter } from "./useRouter.js";
5
+ //#region src/useRouterState.tsx
5
6
  function useRouterState(opts) {
6
- const contextRouter = useRouter({
7
- warn: opts?.router === void 0
8
- });
9
- const router = opts?.router || contextRouter;
10
- if (!router || !router.__store) {
11
- return Vue.ref(void 0);
12
- }
13
- const _isServer = isServer ?? router.isServer;
14
- if (_isServer) {
15
- const state = router.state;
16
- return Vue.ref(opts?.select ? opts.select(state) : state);
17
- }
18
- return useStore(router.__store, (state) => {
19
- if (opts?.select) return opts.select(state);
20
- return state;
21
- });
7
+ const contextRouter = useRouter({ warn: opts?.router === void 0 });
8
+ const router = opts?.router || contextRouter;
9
+ if (!router || !router.__store) return Vue.ref(void 0);
10
+ if (isServer ?? router.isServer) {
11
+ const state = router.state;
12
+ return Vue.ref(opts?.select ? opts.select(state) : state);
13
+ }
14
+ return useStore(router.__store, (state) => {
15
+ if (opts?.select) return opts.select(state);
16
+ return state;
17
+ });
22
18
  }
23
- export {
24
- useRouterState
25
- };
26
- //# sourceMappingURL=useRouterState.js.map
19
+ //#endregion
20
+ export { useRouterState };
21
+
22
+ //# sourceMappingURL=useRouterState.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"useRouterState.js","sources":["../../src/useRouterState.tsx"],"sourcesContent":["import { useStore } from '@tanstack/vue-store'\nimport * as Vue from 'vue'\nimport { isServer } from '@tanstack/router-core/isServer'\nimport { useRouter } from './useRouter'\nimport type {\n AnyRouter,\n RegisteredRouter,\n RouterState,\n} from '@tanstack/router-core'\n\nexport type UseRouterStateOptions<TRouter extends AnyRouter, TSelected> = {\n router?: TRouter\n select?: (state: RouterState<TRouter['routeTree']>) => TSelected\n}\n\nexport type UseRouterStateResult<\n TRouter extends AnyRouter,\n TSelected,\n> = unknown extends TSelected ? RouterState<TRouter['routeTree']> : TSelected\n\nexport function useRouterState<\n TRouter extends AnyRouter = RegisteredRouter,\n TSelected = unknown,\n>(\n opts?: UseRouterStateOptions<TRouter, TSelected>,\n): Vue.Ref<UseRouterStateResult<TRouter, TSelected>> {\n const contextRouter = useRouter<TRouter>({\n warn: opts?.router === undefined,\n })\n const router = opts?.router || contextRouter\n\n // Return a safe default if router is undefined\n if (!router || !router.__store) {\n return Vue.ref(undefined) as Vue.Ref<\n UseRouterStateResult<TRouter, TSelected>\n >\n }\n\n // During SSR we render exactly once and do not need reactivity.\n // Avoid subscribing to the store on the server since the server store\n // implementation does not provide subscribe() semantics.\n const _isServer = isServer ?? router.isServer\n\n if (_isServer) {\n const state = router.state as RouterState<TRouter['routeTree']>\n return Vue.ref(opts?.select ? opts.select(state) : state) as Vue.Ref<\n UseRouterStateResult<TRouter, TSelected>\n >\n }\n\n return useStore(router.__store, (state) => {\n if (opts?.select) return opts.select(state)\n\n return state\n }) as Vue.Ref<UseRouterStateResult<TRouter, TSelected>>\n}\n"],"names":["useRouterState","opts","contextRouter","useRouter","warn","router","undefined","__store","Vue","ref","_isServer","isServer","state","select","useStore"],"mappings":";;;;AAoBO,SAASA,eAIdC,MACmD;AACnD,QAAMC,gBAAgBC,UAAmB;AAAA,IACvCC,MAAMH,MAAMI,WAAWC;AAAAA,EACzB,CAAC;AACD,QAAMD,SAASJ,MAAMI,UAAUH;AAG/B,MAAI,CAACG,UAAU,CAACA,OAAOE,SAAS;AAC9B,WAAOC,IAAIC,IAAIH,MAAS;AAAA,EAG1B;AAKA,QAAMI,YAAYC,YAAYN,OAAOM;AAErC,MAAID,WAAW;AACb,UAAME,QAAQP,OAAOO;AACrB,WAAOJ,IAAIC,IAAIR,MAAMY,SAASZ,KAAKY,OAAOD,KAAK,IAAIA,KAAK;AAAA,EAG1D;AAEA,SAAOE,SAAST,OAAOE,SAAUK,WAAU;AACzC,QAAIX,MAAMY,OAAQ,QAAOZ,KAAKY,OAAOD,KAAK;AAE1C,WAAOA;AAAAA,EACT,CAAC;AACH;"}
1
+ {"version":3,"file":"useRouterState.js","names":["useStore","Vue","isServer","useRouter","useRouterState","opts","contextRouter","warn","router","undefined","__store","ref","_isServer","state","select"],"sources":["../../src/useRouterState.tsx"],"sourcesContent":["import { useStore } from '@tanstack/vue-store'\nimport * as Vue from 'vue'\nimport { isServer } from '@tanstack/router-core/isServer'\nimport { useRouter } from './useRouter'\nimport type {\n AnyRouter,\n RegisteredRouter,\n RouterState,\n} from '@tanstack/router-core'\n\nexport type UseRouterStateOptions<TRouter extends AnyRouter, TSelected> = {\n router?: TRouter\n select?: (state: RouterState<TRouter['routeTree']>) => TSelected\n}\n\nexport type UseRouterStateResult<\n TRouter extends AnyRouter,\n TSelected,\n> = unknown extends TSelected ? RouterState<TRouter['routeTree']> : TSelected\n\nexport function useRouterState<\n TRouter extends AnyRouter = RegisteredRouter,\n TSelected = unknown,\n>(\n opts?: UseRouterStateOptions<TRouter, TSelected>,\n): Vue.Ref<UseRouterStateResult<TRouter, TSelected>> {\n const contextRouter = useRouter<TRouter>({\n warn: opts?.router === undefined,\n })\n const router = opts?.router || contextRouter\n\n // Return a safe default if router is undefined\n if (!router || !router.__store) {\n return Vue.ref(undefined) as Vue.Ref<\n UseRouterStateResult<TRouter, TSelected>\n >\n }\n\n // During SSR we render exactly once and do not need reactivity.\n // Avoid subscribing to the store on the server since the server store\n // implementation does not provide subscribe() semantics.\n const _isServer = isServer ?? router.isServer\n\n if (_isServer) {\n const state = router.state as RouterState<TRouter['routeTree']>\n return Vue.ref(opts?.select ? opts.select(state) : state) as Vue.Ref<\n UseRouterStateResult<TRouter, TSelected>\n >\n }\n\n return useStore(router.__store, (state) => {\n if (opts?.select) return opts.select(state)\n\n return state\n }) as Vue.Ref<UseRouterStateResult<TRouter, TSelected>>\n}\n"],"mappings":";;;;;AAoBA,SAAgBI,eAIdC,MACmD;CACnD,MAAMC,gBAAgBH,UAAmB,EACvCI,MAAMF,MAAMG,WAAWC,KAAAA,GACxB,CAAC;CACF,MAAMD,SAASH,MAAMG,UAAUF;AAG/B,KAAI,CAACE,UAAU,CAACA,OAAOE,QACrB,QAAOT,IAAIU,IAAIF,KAAAA,EAAU;AAU3B,KAFkBP,YAAYM,OAAON,UAEtB;EACb,MAAMW,QAAQL,OAAOK;AACrB,SAAOZ,IAAIU,IAAIN,MAAMS,SAAST,KAAKS,OAAOD,MAAM,GAAGA,MAAM;;AAK3D,QAAOb,SAASQ,OAAOE,UAAUG,UAAU;AACzC,MAAIR,MAAMS,OAAQ,QAAOT,KAAKS,OAAOD,MAAM;AAE3C,SAAOA;GACP"}
@@ -1,15 +1,16 @@
1
1
  import { useMatch } from "./useMatch.js";
2
+ //#region src/useSearch.tsx
2
3
  function useSearch(opts) {
3
- return useMatch({
4
- from: opts.from,
5
- strict: opts.strict,
6
- shouldThrow: opts.shouldThrow,
7
- select: (match) => {
8
- return opts.select ? opts.select(match.search) : match.search;
9
- }
10
- });
4
+ return useMatch({
5
+ from: opts.from,
6
+ strict: opts.strict,
7
+ shouldThrow: opts.shouldThrow,
8
+ select: (match) => {
9
+ return opts.select ? opts.select(match.search) : match.search;
10
+ }
11
+ });
11
12
  }
12
- export {
13
- useSearch
14
- };
15
- //# sourceMappingURL=useSearch.js.map
13
+ //#endregion
14
+ export { useSearch };
15
+
16
+ //# sourceMappingURL=useSearch.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"useSearch.js","sources":["../../src/useSearch.tsx"],"sourcesContent":["import { useMatch } from './useMatch'\nimport type * as Vue from 'vue'\nimport type {\n AnyRouter,\n RegisteredRouter,\n ResolveUseSearch,\n StrictOrFrom,\n ThrowConstraint,\n ThrowOrOptional,\n UseSearchResult,\n} from '@tanstack/router-core'\n\nexport interface UseSearchBaseOptions<\n TRouter extends AnyRouter,\n TFrom,\n TStrict extends boolean,\n TThrow extends boolean,\n TSelected,\n> {\n select?: (state: ResolveUseSearch<TRouter, TFrom, TStrict>) => TSelected\n shouldThrow?: TThrow\n}\n\nexport type UseSearchOptions<\n TRouter extends AnyRouter,\n TFrom,\n TStrict extends boolean,\n TThrow extends boolean,\n TSelected,\n> = StrictOrFrom<TRouter, TFrom, TStrict> &\n UseSearchBaseOptions<TRouter, TFrom, TStrict, TThrow, TSelected>\n\nexport type UseSearchRoute<out TFrom> = <\n TRouter extends AnyRouter = RegisteredRouter,\n TSelected = unknown,\n>(\n opts?: UseSearchBaseOptions<\n TRouter,\n TFrom,\n /* TStrict */ true,\n /* TThrow */ true,\n TSelected\n >,\n) => Vue.Ref<UseSearchResult<TRouter, TFrom, true, TSelected>>\n\nexport function useSearch<\n TRouter extends AnyRouter = RegisteredRouter,\n const TFrom extends string | undefined = undefined,\n TStrict extends boolean = true,\n TThrow extends boolean = true,\n TSelected = unknown,\n>(\n opts: UseSearchOptions<\n TRouter,\n TFrom,\n TStrict,\n ThrowConstraint<TStrict, TThrow>,\n TSelected\n >,\n): Vue.Ref<\n ThrowOrOptional<UseSearchResult<TRouter, TFrom, TStrict, TSelected>, TThrow>\n> {\n return useMatch({\n from: opts.from!,\n strict: opts.strict,\n shouldThrow: opts.shouldThrow,\n select: (match: any) => {\n return opts.select ? opts.select(match.search) : match.search\n },\n }) as any\n}\n"],"names":["useSearch","opts","useMatch","from","strict","shouldThrow","select","match","search"],"mappings":";AA6CO,SAASA,UAOdC,MASA;AACA,SAAOC,SAAS;AAAA,IACdC,MAAMF,KAAKE;AAAAA,IACXC,QAAQH,KAAKG;AAAAA,IACbC,aAAaJ,KAAKI;AAAAA,IAClBC,QAASC,WAAe;AACtB,aAAON,KAAKK,SAASL,KAAKK,OAAOC,MAAMC,MAAM,IAAID,MAAMC;AAAAA,IACzD;AAAA,EACF,CAAC;AACH;"}
1
+ {"version":3,"file":"useSearch.js","names":["useMatch","useSearch","opts","from","strict","shouldThrow","select","match","search"],"sources":["../../src/useSearch.tsx"],"sourcesContent":["import { useMatch } from './useMatch'\nimport type * as Vue from 'vue'\nimport type {\n AnyRouter,\n RegisteredRouter,\n ResolveUseSearch,\n StrictOrFrom,\n ThrowConstraint,\n ThrowOrOptional,\n UseSearchResult,\n} from '@tanstack/router-core'\n\nexport interface UseSearchBaseOptions<\n TRouter extends AnyRouter,\n TFrom,\n TStrict extends boolean,\n TThrow extends boolean,\n TSelected,\n> {\n select?: (state: ResolveUseSearch<TRouter, TFrom, TStrict>) => TSelected\n shouldThrow?: TThrow\n}\n\nexport type UseSearchOptions<\n TRouter extends AnyRouter,\n TFrom,\n TStrict extends boolean,\n TThrow extends boolean,\n TSelected,\n> = StrictOrFrom<TRouter, TFrom, TStrict> &\n UseSearchBaseOptions<TRouter, TFrom, TStrict, TThrow, TSelected>\n\nexport type UseSearchRoute<out TFrom> = <\n TRouter extends AnyRouter = RegisteredRouter,\n TSelected = unknown,\n>(\n opts?: UseSearchBaseOptions<\n TRouter,\n TFrom,\n /* TStrict */ true,\n /* TThrow */ true,\n TSelected\n >,\n) => Vue.Ref<UseSearchResult<TRouter, TFrom, true, TSelected>>\n\nexport function useSearch<\n TRouter extends AnyRouter = RegisteredRouter,\n const TFrom extends string | undefined = undefined,\n TStrict extends boolean = true,\n TThrow extends boolean = true,\n TSelected = unknown,\n>(\n opts: UseSearchOptions<\n TRouter,\n TFrom,\n TStrict,\n ThrowConstraint<TStrict, TThrow>,\n TSelected\n >,\n): Vue.Ref<\n ThrowOrOptional<UseSearchResult<TRouter, TFrom, TStrict, TSelected>, TThrow>\n> {\n return useMatch({\n from: opts.from!,\n strict: opts.strict,\n shouldThrow: opts.shouldThrow,\n select: (match: any) => {\n return opts.select ? opts.select(match.search) : match.search\n },\n }) as any\n}\n"],"mappings":";;AA6CA,SAAgBC,UAOdC,MASA;AACA,QAAOF,SAAS;EACdG,MAAMD,KAAKC;EACXC,QAAQF,KAAKE;EACbC,aAAaH,KAAKG;EAClBC,SAASC,UAAe;AACtB,UAAOL,KAAKI,SAASJ,KAAKI,OAAOC,MAAMC,OAAO,GAAGD,MAAMC;;EAE1D,CAAC"}
package/dist/esm/utils.js CHANGED
@@ -1,42 +1,63 @@
1
1
  import * as Vue from "vue";
2
- const usePrevious = (fn) => {
3
- return Vue.computed(
4
- (prev = {
5
- current: null,
6
- previous: null
7
- }) => {
8
- const current = fn();
9
- if (prev.current !== current) {
10
- prev.previous = prev.current;
11
- prev.current = current;
12
- }
13
- return prev;
14
- }
15
- );
2
+ typeof window !== "undefined" ? Vue.effect : Vue.effect;
3
+ var usePrevious = (fn) => {
4
+ return Vue.computed((prev = {
5
+ current: null,
6
+ previous: null
7
+ }) => {
8
+ const current = fn();
9
+ if (prev.current !== current) {
10
+ prev.previous = prev.current;
11
+ prev.current = current;
12
+ }
13
+ return prev;
14
+ });
16
15
  };
16
+ /**
17
+ * React hook to wrap `IntersectionObserver`.
18
+ *
19
+ * This hook will create an `IntersectionObserver` and observe the ref passed to it.
20
+ *
21
+ * When the intersection changes, the callback will be called with the `IntersectionObserverEntry`.
22
+ *
23
+ * @param ref - The ref to observe
24
+ * @param intersectionObserverOptions - The options to pass to the IntersectionObserver
25
+ * @param options - The options to pass to the hook
26
+ * @param callback - The callback to call when the intersection changes
27
+ * @returns The IntersectionObserver instance
28
+ * @example
29
+ * ```tsx
30
+ * const MyComponent = () => {
31
+ * const ref = React.useRef<HTMLDivElement>(null)
32
+ * useIntersectionObserver(
33
+ * ref,
34
+ * (entry) => { doSomething(entry) },
35
+ * { rootMargin: '10px' },
36
+ * { disabled: false }
37
+ * )
38
+ * return <div ref={ref} />
39
+ * ```
40
+ */
17
41
  function useIntersectionObserver(ref, callback, intersectionObserverOptions = {}, options = {}) {
18
- const isIntersectionObserverAvailable = typeof IntersectionObserver === "function";
19
- const observerRef = Vue.ref(null);
20
- Vue.watchEffect((onCleanup) => {
21
- const r = ref.value;
22
- const isDisabled = typeof options.disabled === "function" ? options.disabled() : options.disabled;
23
- if (!r || !isIntersectionObserverAvailable || isDisabled) {
24
- return;
25
- }
26
- const observer = new IntersectionObserver(([entry]) => {
27
- callback(entry);
28
- }, intersectionObserverOptions);
29
- observerRef.value = observer;
30
- observer.observe(r);
31
- onCleanup(() => {
32
- observer.disconnect();
33
- observerRef.value = null;
34
- });
35
- });
36
- return observerRef;
42
+ const isIntersectionObserverAvailable = typeof IntersectionObserver === "function";
43
+ const observerRef = Vue.ref(null);
44
+ Vue.watchEffect((onCleanup) => {
45
+ const r = ref.value;
46
+ const isDisabled = typeof options.disabled === "function" ? options.disabled() : options.disabled;
47
+ if (!r || !isIntersectionObserverAvailable || isDisabled) return;
48
+ const observer = new IntersectionObserver(([entry]) => {
49
+ callback(entry);
50
+ }, intersectionObserverOptions);
51
+ observerRef.value = observer;
52
+ observer.observe(r);
53
+ onCleanup(() => {
54
+ observer.disconnect();
55
+ observerRef.value = null;
56
+ });
57
+ });
58
+ return observerRef;
37
59
  }
38
- export {
39
- useIntersectionObserver,
40
- usePrevious
41
- };
42
- //# sourceMappingURL=utils.js.map
60
+ //#endregion
61
+ export { useIntersectionObserver, usePrevious };
62
+
63
+ //# sourceMappingURL=utils.js.map