@tanstack/react-router 1.20.1 → 1.20.3-alpha.1
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.
- package/README.md +31 -0
- package/dist/cjs/Asset.cjs +41 -0
- package/dist/cjs/Asset.cjs.map +1 -0
- package/dist/cjs/Asset.d.cts +2 -0
- package/dist/cjs/CatchBoundary.cjs +16 -12
- package/dist/cjs/CatchBoundary.cjs.map +1 -1
- package/dist/cjs/CatchBoundary.d.cts +8 -32
- package/dist/cjs/ClientOnly.cjs +20 -0
- package/dist/cjs/ClientOnly.cjs.map +1 -0
- package/dist/cjs/ClientOnly.d.cts +29 -0
- package/dist/cjs/HeadContent.cjs +155 -0
- package/dist/cjs/HeadContent.cjs.map +1 -0
- package/dist/cjs/HeadContent.d.cts +7 -0
- package/dist/cjs/Match.cjs +252 -0
- package/dist/cjs/Match.cjs.map +1 -0
- package/dist/cjs/Match.d.cts +8 -0
- package/dist/cjs/Matches.cjs +39 -287
- package/dist/cjs/Matches.cjs.map +1 -1
- package/dist/cjs/Matches.d.cts +23 -83
- package/dist/cjs/RouterProvider.cjs +17 -140
- package/dist/cjs/RouterProvider.cjs.map +1 -1
- package/dist/cjs/RouterProvider.d.cts +8 -27
- package/dist/cjs/SafeFragment.cjs +8 -0
- package/dist/cjs/SafeFragment.cjs.map +1 -0
- package/dist/cjs/SafeFragment.d.cts +1 -0
- package/dist/cjs/ScriptOnce.cjs +28 -0
- package/dist/cjs/ScriptOnce.cjs.map +1 -0
- package/dist/cjs/ScriptOnce.d.cts +5 -0
- package/dist/cjs/Scripts.cjs +51 -0
- package/dist/cjs/Scripts.cjs.map +1 -0
- package/dist/cjs/Scripts.d.cts +1 -0
- package/dist/cjs/ScrollRestoration.cjs +39 -0
- package/dist/cjs/ScrollRestoration.cjs.map +1 -0
- package/dist/cjs/ScrollRestoration.d.cts +14 -0
- package/dist/cjs/Transitioner.cjs +115 -0
- package/dist/cjs/Transitioner.cjs.map +1 -0
- package/dist/cjs/Transitioner.d.cts +1 -0
- package/dist/cjs/awaited.cjs +12 -65
- package/dist/cjs/awaited.cjs.map +1 -1
- package/dist/cjs/awaited.d.cts +4 -4
- package/dist/cjs/fileRoute.cjs +41 -15
- package/dist/cjs/fileRoute.cjs.map +1 -1
- package/dist/cjs/fileRoute.d.cts +33 -108
- package/dist/cjs/history.d.cts +1 -0
- package/dist/cjs/index.cjs +216 -73
- package/dist/cjs/index.cjs.map +1 -1
- package/dist/cjs/index.d.cts +52 -29
- package/dist/cjs/lazyRouteComponent.cjs +40 -29
- package/dist/cjs/lazyRouteComponent.cjs.map +1 -1
- package/dist/cjs/lazyRouteComponent.d.cts +1 -1
- package/dist/cjs/link.cjs +212 -106
- package/dist/cjs/link.cjs.map +1 -1
- package/dist/cjs/link.d.cts +41 -86
- package/dist/cjs/matchContext.cjs +27 -0
- package/dist/cjs/matchContext.cjs.map +1 -0
- package/dist/cjs/matchContext.d.cts +3 -0
- package/dist/cjs/not-found.cjs +9 -15
- package/dist/cjs/not-found.cjs.map +1 -1
- package/dist/cjs/not-found.d.cts +5 -22
- package/dist/cjs/renderRouteNotFound.cjs +22 -0
- package/dist/cjs/renderRouteNotFound.cjs.map +1 -0
- package/dist/cjs/renderRouteNotFound.d.cts +2 -0
- package/dist/cjs/route.cjs +110 -79
- package/dist/cjs/route.cjs.map +1 -1
- package/dist/cjs/route.d.cts +64 -361
- package/dist/cjs/router.cjs +12 -1237
- package/dist/cjs/router.cjs.map +1 -1
- package/dist/cjs/router.d.cts +69 -237
- package/dist/cjs/routerContext.cjs +1 -1
- package/dist/cjs/routerContext.cjs.map +1 -1
- package/dist/cjs/routerContext.d.cts +7 -2
- package/dist/cjs/scroll-restoration.cjs +16 -177
- package/dist/cjs/scroll-restoration.cjs.map +1 -1
- package/dist/cjs/scroll-restoration.d.cts +1 -18
- package/dist/cjs/serializer.d.cts +6 -0
- package/dist/cjs/structuralSharing.d.cts +8 -0
- package/dist/cjs/typePrimitives.d.cts +16 -0
- package/dist/cjs/useBlocker.cjs +138 -9
- package/dist/cjs/useBlocker.cjs.map +1 -1
- package/dist/cjs/useBlocker.d.cts +64 -7
- package/dist/cjs/useCanGoBack.cjs +8 -0
- package/dist/cjs/useCanGoBack.cjs.map +1 -0
- package/dist/cjs/useCanGoBack.d.cts +1 -0
- package/dist/cjs/useLoaderData.cjs +15 -0
- package/dist/cjs/useLoaderData.cjs.map +1 -0
- package/dist/cjs/useLoaderData.d.cts +8 -0
- package/dist/cjs/useLoaderDeps.cjs +14 -0
- package/dist/cjs/useLoaderDeps.cjs.map +1 -0
- package/dist/cjs/useLoaderDeps.d.cts +8 -0
- package/dist/cjs/useLocation.cjs +10 -0
- package/dist/cjs/useLocation.cjs.map +1 -0
- package/dist/cjs/useLocation.d.cts +7 -0
- package/dist/cjs/useMatch.cjs +47 -0
- package/dist/cjs/useMatch.cjs.map +1 -0
- package/dist/cjs/useMatch.d.cts +10 -0
- package/dist/cjs/useNavigate.cjs +18 -19
- package/dist/cjs/useNavigate.cjs.map +1 -1
- package/dist/cjs/useNavigate.d.cts +4 -8
- package/dist/cjs/useParams.cjs +8 -8
- package/dist/cjs/useParams.cjs.map +1 -1
- package/dist/cjs/useParams.d.cts +9 -8
- package/dist/cjs/useRouteContext.cjs +3 -3
- package/dist/cjs/useRouteContext.cjs.map +1 -1
- package/dist/cjs/useRouteContext.d.cts +3 -7
- package/dist/cjs/useRouter.cjs.map +1 -1
- package/dist/cjs/useRouter.d.cts +3 -4
- package/dist/cjs/useRouterState.cjs +18 -1
- package/dist/cjs/useRouterState.cjs.map +1 -1
- package/dist/cjs/useRouterState.d.cts +8 -6
- package/dist/cjs/useSearch.cjs +7 -4
- package/dist/cjs/useSearch.cjs.map +1 -1
- package/dist/cjs/useSearch.d.cts +9 -7
- package/dist/cjs/utils.cjs +40 -122
- package/dist/cjs/utils.cjs.map +1 -1
- package/dist/cjs/utils.d.cts +46 -50
- package/dist/esm/Asset.d.ts +2 -0
- package/dist/esm/Asset.js +41 -0
- package/dist/esm/Asset.js.map +1 -0
- package/dist/esm/CatchBoundary.d.ts +8 -32
- package/dist/esm/CatchBoundary.js +16 -12
- package/dist/esm/CatchBoundary.js.map +1 -1
- package/dist/esm/ClientOnly.d.ts +29 -0
- package/dist/esm/ClientOnly.js +20 -0
- package/dist/esm/ClientOnly.js.map +1 -0
- package/dist/esm/HeadContent.d.ts +7 -0
- package/dist/esm/HeadContent.js +139 -0
- package/dist/esm/HeadContent.js.map +1 -0
- package/dist/esm/Match.d.ts +8 -0
- package/dist/esm/Match.js +235 -0
- package/dist/esm/Match.js.map +1 -0
- package/dist/esm/Matches.d.ts +23 -83
- package/dist/esm/Matches.js +36 -284
- package/dist/esm/Matches.js.map +1 -1
- package/dist/esm/RouterProvider.d.ts +8 -27
- package/dist/esm/RouterProvider.js +20 -126
- package/dist/esm/RouterProvider.js.map +1 -1
- package/dist/esm/SafeFragment.d.ts +1 -0
- package/dist/esm/SafeFragment.js +8 -0
- package/dist/esm/SafeFragment.js.map +1 -0
- package/dist/esm/ScriptOnce.d.ts +5 -0
- package/dist/esm/ScriptOnce.js +28 -0
- package/dist/esm/ScriptOnce.js.map +1 -0
- package/dist/esm/Scripts.d.ts +1 -0
- package/dist/esm/Scripts.js +51 -0
- package/dist/esm/Scripts.js.map +1 -0
- package/dist/esm/ScrollRestoration.d.ts +14 -0
- package/dist/esm/ScrollRestoration.js +39 -0
- package/dist/esm/ScrollRestoration.js.map +1 -0
- package/dist/esm/Transitioner.d.ts +1 -0
- package/dist/esm/Transitioner.js +98 -0
- package/dist/esm/Transitioner.js.map +1 -0
- package/dist/esm/awaited.d.ts +4 -4
- package/dist/esm/awaited.js +12 -65
- package/dist/esm/awaited.js.map +1 -1
- package/dist/esm/fileRoute.d.ts +33 -108
- package/dist/esm/fileRoute.js +38 -12
- package/dist/esm/fileRoute.js.map +1 -1
- package/dist/esm/history.d.ts +1 -0
- package/dist/esm/index.d.ts +52 -29
- package/dist/esm/index.js +41 -29
- package/dist/esm/index.js.map +1 -1
- package/dist/esm/lazyRouteComponent.d.ts +1 -1
- package/dist/esm/lazyRouteComponent.js +40 -29
- package/dist/esm/lazyRouteComponent.js.map +1 -1
- package/dist/esm/link.d.ts +41 -86
- package/dist/esm/link.js +212 -106
- package/dist/esm/link.js.map +1 -1
- package/dist/esm/matchContext.d.ts +3 -0
- package/dist/esm/matchContext.js +10 -0
- package/dist/esm/matchContext.js.map +1 -0
- package/dist/esm/not-found.d.ts +5 -22
- package/dist/esm/not-found.js +9 -15
- package/dist/esm/not-found.js.map +1 -1
- package/dist/esm/renderRouteNotFound.d.ts +2 -0
- package/dist/esm/renderRouteNotFound.js +22 -0
- package/dist/esm/renderRouteNotFound.js.map +1 -0
- package/dist/esm/route.d.ts +64 -361
- package/dist/esm/route.js +103 -72
- package/dist/esm/route.js.map +1 -1
- package/dist/esm/router.d.ts +69 -237
- package/dist/esm/router.js +13 -1238
- package/dist/esm/router.js.map +1 -1
- package/dist/esm/routerContext.d.ts +7 -2
- package/dist/esm/routerContext.js +1 -1
- package/dist/esm/routerContext.js.map +1 -1
- package/dist/esm/scroll-restoration.d.ts +1 -18
- package/dist/esm/scroll-restoration.js +17 -161
- package/dist/esm/scroll-restoration.js.map +1 -1
- package/dist/esm/serializer.d.ts +6 -0
- package/dist/esm/structuralSharing.d.ts +8 -0
- package/dist/esm/typePrimitives.d.ts +16 -0
- package/dist/esm/useBlocker.d.ts +64 -7
- package/dist/esm/useBlocker.js +138 -9
- package/dist/esm/useBlocker.js.map +1 -1
- package/dist/esm/useCanGoBack.d.ts +1 -0
- package/dist/esm/useCanGoBack.js +8 -0
- package/dist/esm/useCanGoBack.js.map +1 -0
- package/dist/esm/useLoaderData.d.ts +8 -0
- package/dist/esm/useLoaderData.js +15 -0
- package/dist/esm/useLoaderData.js.map +1 -0
- package/dist/esm/useLoaderDeps.d.ts +8 -0
- package/dist/esm/useLoaderDeps.js +14 -0
- package/dist/esm/useLoaderDeps.js.map +1 -0
- package/dist/esm/useLocation.d.ts +7 -0
- package/dist/esm/useLocation.js +10 -0
- package/dist/esm/useLocation.js.map +1 -0
- package/dist/esm/useMatch.d.ts +10 -0
- package/dist/esm/useMatch.js +30 -0
- package/dist/esm/useMatch.js.map +1 -0
- package/dist/esm/useNavigate.d.ts +4 -8
- package/dist/esm/useNavigate.js +18 -19
- package/dist/esm/useNavigate.js.map +1 -1
- package/dist/esm/useParams.d.ts +9 -8
- package/dist/esm/useParams.js +8 -8
- package/dist/esm/useParams.js.map +1 -1
- package/dist/esm/useRouteContext.d.ts +3 -7
- package/dist/esm/useRouteContext.js +2 -2
- package/dist/esm/useRouteContext.js.map +1 -1
- package/dist/esm/useRouter.d.ts +3 -4
- package/dist/esm/useRouter.js.map +1 -1
- package/dist/esm/useRouterState.d.ts +8 -6
- package/dist/esm/useRouterState.js +18 -1
- package/dist/esm/useRouterState.js.map +1 -1
- package/dist/esm/useSearch.d.ts +9 -7
- package/dist/esm/useSearch.js +6 -3
- package/dist/esm/useSearch.js.map +1 -1
- package/dist/esm/utils.d.ts +46 -50
- package/dist/esm/utils.js +41 -123
- package/dist/esm/utils.js.map +1 -1
- package/package.json +30 -31
- package/src/Asset.tsx +40 -0
- package/src/CatchBoundary.tsx +35 -19
- package/src/ClientOnly.tsx +68 -0
- package/src/HeadContent.tsx +174 -0
- package/src/Match.tsx +330 -0
- package/src/Matches.tsx +149 -558
- package/src/RouterProvider.tsx +58 -212
- package/src/SafeFragment.tsx +5 -0
- package/src/ScriptOnce.tsx +32 -0
- package/src/Scripts.tsx +65 -0
- package/src/ScrollRestoration.tsx +69 -0
- package/src/Transitioner.tsx +130 -0
- package/src/awaited.tsx +16 -87
- package/src/fileRoute.ts +145 -248
- package/src/history.ts +2 -1
- package/src/index.tsx +368 -30
- package/src/lazyRouteComponent.tsx +68 -54
- package/src/link.tsx +397 -522
- package/src/matchContext.tsx +8 -0
- package/src/not-found.tsx +13 -34
- package/src/renderRouteNotFound.tsx +27 -0
- package/src/route.tsx +572 -0
- package/src/router.ts +99 -2067
- package/src/routerContext.tsx +8 -2
- package/src/scroll-restoration.tsx +23 -224
- package/src/serializer.ts +7 -0
- package/src/structuralSharing.ts +47 -0
- package/src/typePrimitives.ts +84 -0
- package/src/useBlocker.tsx +297 -15
- package/src/useCanGoBack.ts +5 -0
- package/src/useLoaderData.tsx +80 -0
- package/src/useLoaderDeps.tsx +58 -0
- package/src/useLocation.tsx +41 -0
- package/src/useMatch.tsx +119 -0
- package/src/useNavigate.tsx +41 -61
- package/src/useParams.tsx +88 -23
- package/src/useRouteContext.ts +24 -18
- package/src/useRouter.tsx +4 -5
- package/src/useRouterState.tsx +52 -10
- package/src/useSearch.tsx +87 -24
- package/src/utils.ts +97 -312
- package/dist/cjs/createServerFn.cjs +0 -40
- package/dist/cjs/createServerFn.cjs.map +0 -1
- package/dist/cjs/createServerFn.d.cts +0 -44
- package/dist/cjs/defer.cjs +0 -30
- package/dist/cjs/defer.cjs.map +0 -1
- package/dist/cjs/defer.d.cts +0 -25
- package/dist/cjs/location.d.cts +0 -12
- package/dist/cjs/path.cjs +0 -213
- package/dist/cjs/path.cjs.map +0 -1
- package/dist/cjs/path.d.cts +0 -24
- package/dist/cjs/qss.cjs +0 -45
- package/dist/cjs/qss.cjs.map +0 -1
- package/dist/cjs/qss.d.cts +0 -2
- package/dist/cjs/redirects.cjs +0 -16
- package/dist/cjs/redirects.cjs.map +0 -1
- package/dist/cjs/redirects.d.cts +0 -18
- package/dist/cjs/routeInfo.d.cts +0 -31
- package/dist/cjs/searchParams.cjs +0 -63
- package/dist/cjs/searchParams.cjs.map +0 -1
- package/dist/cjs/searchParams.d.cts +0 -7
- package/dist/esm/createServerFn.d.ts +0 -44
- package/dist/esm/createServerFn.js +0 -40
- package/dist/esm/createServerFn.js.map +0 -1
- package/dist/esm/defer.d.ts +0 -25
- package/dist/esm/defer.js +0 -30
- package/dist/esm/defer.js.map +0 -1
- package/dist/esm/location.d.ts +0 -12
- package/dist/esm/path.d.ts +0 -24
- package/dist/esm/path.js +0 -213
- package/dist/esm/path.js.map +0 -1
- package/dist/esm/qss.d.ts +0 -2
- package/dist/esm/qss.js +0 -45
- package/dist/esm/qss.js.map +0 -1
- package/dist/esm/redirects.d.ts +0 -18
- package/dist/esm/redirects.js +0 -16
- package/dist/esm/redirects.js.map +0 -1
- package/dist/esm/routeInfo.d.ts +0 -31
- package/dist/esm/searchParams.d.ts +0 -7
- package/dist/esm/searchParams.js +0 -63
- package/dist/esm/searchParams.js.map +0 -1
- package/src/createServerFn.ts +0 -107
- package/src/defer.ts +0 -70
- package/src/location.ts +0 -13
- package/src/path.ts +0 -280
- package/src/qss.ts +0 -53
- package/src/redirects.ts +0 -56
- package/src/route.ts +0 -1356
- package/src/routeInfo.ts +0 -63
- package/src/searchParams.ts +0 -79
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useRouterState.js","sources":["../../src/useRouterState.tsx"],"sourcesContent":["import { useStore } from '@tanstack/react-store'\nimport {
|
|
1
|
+
{"version":3,"file":"useRouterState.js","sources":["../../src/useRouterState.tsx"],"sourcesContent":["import { useStore } from '@tanstack/react-store'\nimport { useRef } from 'react'\nimport { replaceEqualDeep } from '@tanstack/router-core'\nimport { useRouter } from './useRouter'\nimport type {\n AnyRouter,\n RegisteredRouter,\n RouterState,\n} from '@tanstack/router-core'\nimport type {\n StructuralSharingOption,\n ValidateSelected,\n} from './structuralSharing'\n\nexport type UseRouterStateOptions<\n TRouter extends AnyRouter,\n TSelected,\n TStructuralSharing,\n> = {\n router?: TRouter\n select?: (\n state: RouterState<TRouter['routeTree']>,\n ) => ValidateSelected<TRouter, TSelected, TStructuralSharing>\n} & StructuralSharingOption<TRouter, TSelected, TStructuralSharing>\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 TStructuralSharing extends boolean = boolean,\n>(\n opts?: UseRouterStateOptions<TRouter, TSelected, TStructuralSharing>,\n): UseRouterStateResult<TRouter, TSelected> {\n const contextRouter = useRouter<TRouter>({\n warn: opts?.router === undefined,\n })\n const router = opts?.router || contextRouter\n const previousResult =\n useRef<ValidateSelected<TRouter, TSelected, TStructuralSharing>>(undefined)\n\n return useStore(router.__store, (state) => {\n if (opts?.select) {\n if (opts.structuralSharing ?? router.options.defaultStructuralSharing) {\n const newSlice = replaceEqualDeep(\n previousResult.current,\n opts.select(state),\n )\n previousResult.current = newSlice\n return newSlice\n }\n return opts.select(state)\n }\n return state\n }) as UseRouterStateResult<TRouter, TSelected>\n}\n"],"names":[],"mappings":";;;;AA8BO,SAAS,eAKd,MAC0C;AAC1C,QAAM,gBAAgB,UAAmB;AAAA,IACvC,OAAM,6BAAM,YAAW;AAAA,EAAA,CACxB;AACK,QAAA,UAAS,6BAAM,WAAU;AACzB,QAAA,iBACJ,OAAiE,MAAS;AAE5E,SAAO,SAAS,OAAO,SAAS,CAAC,UAAU;AACzC,QAAI,6BAAM,QAAQ;AAChB,UAAI,KAAK,qBAAqB,OAAO,QAAQ,0BAA0B;AACrE,cAAM,WAAW;AAAA,UACf,eAAe;AAAA,UACf,KAAK,OAAO,KAAK;AAAA,QACnB;AACA,uBAAe,UAAU;AAClB,eAAA;AAAA,MAAA;AAEF,aAAA,KAAK,OAAO,KAAK;AAAA,IAAA;AAEnB,WAAA;AAAA,EAAA,CACR;AACH;"}
|
package/dist/esm/useSearch.d.ts
CHANGED
|
@@ -1,7 +1,9 @@
|
|
|
1
|
-
import {
|
|
2
|
-
import {
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
1
|
+
import { StructuralSharingOption, ValidateSelected } from './structuralSharing.js';
|
|
2
|
+
import { AnyRouter, RegisteredRouter, ResolveUseSearch, StrictOrFrom, ThrowConstraint, ThrowOrOptional, UseSearchResult } from '@tanstack/router-core';
|
|
3
|
+
export interface UseSearchBaseOptions<TRouter extends AnyRouter, TFrom, TStrict extends boolean, TThrow extends boolean, TSelected, TStructuralSharing> {
|
|
4
|
+
select?: (state: ResolveUseSearch<TRouter, TFrom, TStrict>) => ValidateSelected<TRouter, TSelected, TStructuralSharing>;
|
|
5
|
+
shouldThrow?: TThrow;
|
|
6
|
+
}
|
|
7
|
+
export type UseSearchOptions<TRouter extends AnyRouter, TFrom, TStrict extends boolean, TThrow extends boolean, TSelected, TStructuralSharing> = StrictOrFrom<TRouter, TFrom, TStrict> & UseSearchBaseOptions<TRouter, TFrom, TStrict, TThrow, TSelected, TStructuralSharing> & StructuralSharingOption<TRouter, TSelected, TStructuralSharing>;
|
|
8
|
+
export type UseSearchRoute<out TFrom> = <TRouter extends AnyRouter = RegisteredRouter, TSelected = unknown, TStructuralSharing extends boolean = boolean>(opts?: UseSearchBaseOptions<TRouter, TFrom, true, true, TSelected, TStructuralSharing> & StructuralSharingOption<TRouter, TSelected, TStructuralSharing>) => UseSearchResult<TRouter, TFrom, true, TSelected>;
|
|
9
|
+
export declare function useSearch<TRouter extends AnyRouter = RegisteredRouter, const TFrom extends string | undefined = undefined, TStrict extends boolean = true, TThrow extends boolean = true, TSelected = unknown, TStructuralSharing extends boolean = boolean>(opts: UseSearchOptions<TRouter, TFrom, TStrict, ThrowConstraint<TStrict, TThrow>, TSelected, TStructuralSharing>): ThrowOrOptional<UseSearchResult<TRouter, TFrom, TStrict, TSelected>, TThrow>;
|
package/dist/esm/useSearch.js
CHANGED
|
@@ -1,9 +1,12 @@
|
|
|
1
|
-
import { useMatch } from "./
|
|
1
|
+
import { useMatch } from "./useMatch.js";
|
|
2
2
|
function useSearch(opts) {
|
|
3
3
|
return useMatch({
|
|
4
|
-
|
|
4
|
+
from: opts.from,
|
|
5
|
+
strict: opts.strict,
|
|
6
|
+
shouldThrow: opts.shouldThrow,
|
|
7
|
+
structuralSharing: opts.structuralSharing,
|
|
5
8
|
select: (match) => {
|
|
6
|
-
return
|
|
9
|
+
return opts.select ? opts.select(match.search) : match.search;
|
|
7
10
|
}
|
|
8
11
|
});
|
|
9
12
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useSearch.js","sources":["../../src/useSearch.tsx"],"sourcesContent":["import {
|
|
1
|
+
{"version":3,"file":"useSearch.js","sources":["../../src/useSearch.tsx"],"sourcesContent":["import { useMatch } from './useMatch'\nimport type {\n StructuralSharingOption,\n ValidateSelected,\n} from './structuralSharing'\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 TStructuralSharing,\n> {\n select?: (\n state: ResolveUseSearch<TRouter, TFrom, TStrict>,\n ) => ValidateSelected<TRouter, TSelected, TStructuralSharing>\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 TStructuralSharing,\n> = StrictOrFrom<TRouter, TFrom, TStrict> &\n UseSearchBaseOptions<\n TRouter,\n TFrom,\n TStrict,\n TThrow,\n TSelected,\n TStructuralSharing\n > &\n StructuralSharingOption<TRouter, TSelected, TStructuralSharing>\n\nexport type UseSearchRoute<out TFrom> = <\n TRouter extends AnyRouter = RegisteredRouter,\n TSelected = unknown,\n TStructuralSharing extends boolean = boolean,\n>(\n opts?: UseSearchBaseOptions<\n TRouter,\n TFrom,\n /* TStrict */ true,\n /* TThrow */ true,\n TSelected,\n TStructuralSharing\n > &\n StructuralSharingOption<TRouter, TSelected, TStructuralSharing>,\n) => 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 TStructuralSharing extends boolean = boolean,\n>(\n opts: UseSearchOptions<\n TRouter,\n TFrom,\n TStrict,\n ThrowConstraint<TStrict, TThrow>,\n TSelected,\n TStructuralSharing\n >,\n): ThrowOrOptional<\n UseSearchResult<TRouter, TFrom, TStrict, TSelected>,\n TThrow\n> {\n return useMatch({\n from: opts.from!,\n strict: opts.strict,\n shouldThrow: opts.shouldThrow,\n structuralSharing: opts.structuralSharing,\n select: (match: any) => {\n return opts.select ? opts.select(match.search) : match.search\n },\n }) as any\n}\n"],"names":[],"mappings":";AA+DO,SAAS,UAQd,MAWA;AACA,SAAO,SAAS;AAAA,IACd,MAAM,KAAK;AAAA,IACX,QAAQ,KAAK;AAAA,IACb,aAAa,KAAK;AAAA,IAClB,mBAAmB,KAAK;AAAA,IACxB,QAAQ,CAAC,UAAe;AACtB,aAAO,KAAK,SAAS,KAAK,OAAO,MAAM,MAAM,IAAI,MAAM;AAAA,IAAA;AAAA,EACzD,CACD;AACH;"}
|
package/dist/esm/utils.d.ts
CHANGED
|
@@ -1,53 +1,49 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
|
-
export
|
|
3
|
-
export
|
|
4
|
-
export type PickAsRequired<T, K extends keyof T> = Omit<T, K> & Required<Pick<T, K>>;
|
|
5
|
-
export type PickRequired<T> = {
|
|
6
|
-
[K in keyof T as undefined extends T[K] ? never : K]: T[K];
|
|
7
|
-
};
|
|
8
|
-
export type WithoutEmpty<T> = T extends T ? ({} extends T ? never : T) : never;
|
|
9
|
-
export type Expand<T> = T extends object ? T extends infer O ? {
|
|
10
|
-
[K in keyof O]: O[K];
|
|
11
|
-
} : never : T;
|
|
12
|
-
export type UnionToIntersection<U> = (U extends any ? (k: U) => void : never) extends (k: infer I) => any ? I : never;
|
|
13
|
-
export type DeepOptional<T, K extends keyof T> = Pick<DeepPartial<T>, K> & Omit<T, K>;
|
|
14
|
-
export type DeepPartial<T> = T extends object ? {
|
|
15
|
-
[P in keyof T]?: DeepPartial<T[P]>;
|
|
16
|
-
} : T;
|
|
17
|
-
export type MakeDifferenceOptional<T, U> = Omit<U, keyof T> & Partial<Pick<U, keyof T & keyof U>> & PickRequired<Omit<U, keyof PickRequired<T>>>;
|
|
18
|
-
export type IsUnion<T, U extends T = T> = (T extends any ? (U extends T ? false : true) : never) extends false ? false : true;
|
|
19
|
-
export type Assign<Left, Right> = Omit<Left, keyof Right> & Right;
|
|
20
|
-
export type AssignAll<T extends any[]> = T extends [infer Left, ...infer Right] ? Right extends any[] ? Assign<Left, AssignAll<Right>> : Left : {};
|
|
21
|
-
export type Timeout = ReturnType<typeof setTimeout>;
|
|
22
|
-
export type Updater<TPrevious, TResult = TPrevious> = TResult | ((prev?: TPrevious) => TResult);
|
|
23
|
-
export type NonNullableUpdater<TPrevious, TResult = TPrevious> = TResult | ((prev: TPrevious) => TResult);
|
|
24
|
-
type LastInUnion<U> = UnionToIntersection<U extends unknown ? (x: U) => 0 : never> extends (x: infer L) => 0 ? L : never;
|
|
25
|
-
export type UnionToTuple<U, Last = LastInUnion<U>> = [U] extends [never] ? [] : [...UnionToTuple<Exclude<U, Last>>, Last];
|
|
26
|
-
export declare const isServer: boolean;
|
|
27
|
-
export declare function last<T>(arr: T[]): T | undefined;
|
|
28
|
-
export declare function functionalUpdate<TResult>(updater: Updater<TResult> | NonNullableUpdater<TResult>, previous: TResult): TResult;
|
|
29
|
-
export declare function pick<T, K extends keyof T>(parent: T, keys: K[]): Pick<T, K>;
|
|
2
|
+
export declare function useStableCallback<T extends (...args: Array<any>) => any>(fn: T): T;
|
|
3
|
+
export declare const useLayoutEffect: typeof React.useEffect;
|
|
30
4
|
/**
|
|
31
|
-
*
|
|
32
|
-
* If not, it will replace any deeply equal children of `b` with those of `a`.
|
|
33
|
-
* This can be used for structural sharing between immutable JSON values for example.
|
|
34
|
-
* Do not use this with signals
|
|
5
|
+
* Taken from https://www.developerway.com/posts/implementing-advanced-use-previous-hook#part3
|
|
35
6
|
*/
|
|
36
|
-
export declare function
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
7
|
+
export declare function usePrevious<T>(value: T): T | null;
|
|
8
|
+
/**
|
|
9
|
+
* React hook to wrap `IntersectionObserver`.
|
|
10
|
+
*
|
|
11
|
+
* This hook will create an `IntersectionObserver` and observe the ref passed to it.
|
|
12
|
+
*
|
|
13
|
+
* When the intersection changes, the callback will be called with the `IntersectionObserverEntry`.
|
|
14
|
+
*
|
|
15
|
+
* @param ref - The ref to observe
|
|
16
|
+
* @param intersectionObserverOptions - The options to pass to the IntersectionObserver
|
|
17
|
+
* @param options - The options to pass to the hook
|
|
18
|
+
* @param callback - The callback to call when the intersection changes
|
|
19
|
+
* @returns The IntersectionObserver instance
|
|
20
|
+
* @example
|
|
21
|
+
* ```tsx
|
|
22
|
+
* const MyComponent = () => {
|
|
23
|
+
* const ref = React.useRef<HTMLDivElement>(null)
|
|
24
|
+
* useIntersectionObserver(
|
|
25
|
+
* ref,
|
|
26
|
+
* (entry) => { doSomething(entry) },
|
|
27
|
+
* { rootMargin: '10px' },
|
|
28
|
+
* { disabled: false }
|
|
29
|
+
* )
|
|
30
|
+
* return <div ref={ref} />
|
|
31
|
+
* ```
|
|
32
|
+
*/
|
|
33
|
+
export declare function useIntersectionObserver<T extends Element>(ref: React.RefObject<T | null>, callback: (entry: IntersectionObserverEntry | undefined) => void, intersectionObserverOptions?: IntersectionObserverInit, options?: {
|
|
34
|
+
disabled?: boolean;
|
|
35
|
+
}): IntersectionObserver | null;
|
|
36
|
+
/**
|
|
37
|
+
* React hook to take a `React.ForwardedRef` and returns a `ref` that can be used on a DOM element.
|
|
38
|
+
*
|
|
39
|
+
* @param ref - The forwarded ref
|
|
40
|
+
* @returns The inner ref returned by `useRef`
|
|
41
|
+
* @example
|
|
42
|
+
* ```tsx
|
|
43
|
+
* const MyComponent = React.forwardRef((props, ref) => {
|
|
44
|
+
* const innerRef = useForwardedRef(ref)
|
|
45
|
+
* return <div ref={innerRef} />
|
|
46
|
+
* })
|
|
47
|
+
* ```
|
|
48
|
+
*/
|
|
49
|
+
export declare function useForwardedRef<T>(ref?: React.ForwardedRef<T>): React.RefObject<T | null>;
|
package/dist/esm/utils.js
CHANGED
|
@@ -1,137 +1,55 @@
|
|
|
1
1
|
import * as React from "react";
|
|
2
|
-
const isServer = typeof document === "undefined";
|
|
3
|
-
function last(arr) {
|
|
4
|
-
return arr[arr.length - 1];
|
|
5
|
-
}
|
|
6
|
-
function isFunction(d) {
|
|
7
|
-
return typeof d === "function";
|
|
8
|
-
}
|
|
9
|
-
function functionalUpdate(updater, previous) {
|
|
10
|
-
if (isFunction(updater)) {
|
|
11
|
-
return updater(previous);
|
|
12
|
-
}
|
|
13
|
-
return updater;
|
|
14
|
-
}
|
|
15
|
-
function pick(parent, keys) {
|
|
16
|
-
return keys.reduce((obj, key) => {
|
|
17
|
-
obj[key] = parent[key];
|
|
18
|
-
return obj;
|
|
19
|
-
}, {});
|
|
20
|
-
}
|
|
21
|
-
function replaceEqualDeep(prev, _next) {
|
|
22
|
-
if (prev === _next) {
|
|
23
|
-
return prev;
|
|
24
|
-
}
|
|
25
|
-
const next = _next;
|
|
26
|
-
const array = isPlainArray(prev) && isPlainArray(next);
|
|
27
|
-
if (array || isPlainObject(prev) && isPlainObject(next)) {
|
|
28
|
-
const prevItems = array ? prev : Object.keys(prev);
|
|
29
|
-
const prevSize = prevItems.length;
|
|
30
|
-
const nextItems = array ? next : Object.keys(next);
|
|
31
|
-
const nextSize = nextItems.length;
|
|
32
|
-
const copy = array ? [] : {};
|
|
33
|
-
let equalItems = 0;
|
|
34
|
-
for (let i = 0; i < nextSize; i++) {
|
|
35
|
-
const key = array ? i : nextItems[i];
|
|
36
|
-
if (!array && prev[key] === void 0 && next[key] === void 0 && prevItems.includes(key)) {
|
|
37
|
-
copy[key] = void 0;
|
|
38
|
-
equalItems++;
|
|
39
|
-
} else {
|
|
40
|
-
copy[key] = replaceEqualDeep(prev[key], next[key]);
|
|
41
|
-
if (copy[key] === prev[key] && prev[key] !== void 0) {
|
|
42
|
-
equalItems++;
|
|
43
|
-
}
|
|
44
|
-
}
|
|
45
|
-
}
|
|
46
|
-
return prevSize === nextSize && equalItems === prevSize ? prev : copy;
|
|
47
|
-
}
|
|
48
|
-
return next;
|
|
49
|
-
}
|
|
50
|
-
function isPlainObject(o) {
|
|
51
|
-
if (!hasObjectPrototype(o)) {
|
|
52
|
-
return false;
|
|
53
|
-
}
|
|
54
|
-
const ctor = o.constructor;
|
|
55
|
-
if (typeof ctor === "undefined") {
|
|
56
|
-
return true;
|
|
57
|
-
}
|
|
58
|
-
const prot = ctor.prototype;
|
|
59
|
-
if (!hasObjectPrototype(prot)) {
|
|
60
|
-
return false;
|
|
61
|
-
}
|
|
62
|
-
if (!prot.hasOwnProperty("isPrototypeOf")) {
|
|
63
|
-
return false;
|
|
64
|
-
}
|
|
65
|
-
return true;
|
|
66
|
-
}
|
|
67
|
-
function hasObjectPrototype(o) {
|
|
68
|
-
return Object.prototype.toString.call(o) === "[object Object]";
|
|
69
|
-
}
|
|
70
|
-
function isPlainArray(value) {
|
|
71
|
-
return Array.isArray(value) && value.length === Object.keys(value).length;
|
|
72
|
-
}
|
|
73
|
-
function deepEqual(a, b, partial = false) {
|
|
74
|
-
if (a === b) {
|
|
75
|
-
return true;
|
|
76
|
-
}
|
|
77
|
-
if (typeof a !== typeof b) {
|
|
78
|
-
return false;
|
|
79
|
-
}
|
|
80
|
-
if (isPlainObject(a) && isPlainObject(b)) {
|
|
81
|
-
const aKeys = Object.keys(a);
|
|
82
|
-
const bKeys = Object.keys(b);
|
|
83
|
-
if (!partial && aKeys.length !== bKeys.length) {
|
|
84
|
-
return false;
|
|
85
|
-
}
|
|
86
|
-
return !bKeys.some(
|
|
87
|
-
(key) => !(key in a) || !deepEqual(a[key], b[key], partial)
|
|
88
|
-
);
|
|
89
|
-
}
|
|
90
|
-
if (Array.isArray(a) && Array.isArray(b)) {
|
|
91
|
-
return !a.some((item, index) => !deepEqual(item, b[index], partial));
|
|
92
|
-
}
|
|
93
|
-
return false;
|
|
94
|
-
}
|
|
95
2
|
function useStableCallback(fn) {
|
|
96
3
|
const fnRef = React.useRef(fn);
|
|
97
4
|
fnRef.current = fn;
|
|
98
5
|
const ref = React.useRef((...args) => fnRef.current(...args));
|
|
99
6
|
return ref.current;
|
|
100
7
|
}
|
|
101
|
-
function shallow(objA, objB) {
|
|
102
|
-
if (Object.is(objA, objB)) {
|
|
103
|
-
return true;
|
|
104
|
-
}
|
|
105
|
-
if (typeof objA !== "object" || objA === null || typeof objB !== "object" || objB === null) {
|
|
106
|
-
return false;
|
|
107
|
-
}
|
|
108
|
-
const keysA = Object.keys(objA);
|
|
109
|
-
if (keysA.length !== Object.keys(objB).length) {
|
|
110
|
-
return false;
|
|
111
|
-
}
|
|
112
|
-
for (let i = 0; i < keysA.length; i++) {
|
|
113
|
-
if (!Object.prototype.hasOwnProperty.call(objB, keysA[i]) || !Object.is(objA[keysA[i]], objB[keysA[i]])) {
|
|
114
|
-
return false;
|
|
115
|
-
}
|
|
116
|
-
}
|
|
117
|
-
return true;
|
|
118
|
-
}
|
|
119
8
|
const useLayoutEffect = typeof window !== "undefined" ? React.useLayoutEffect : React.useEffect;
|
|
120
|
-
function
|
|
121
|
-
|
|
9
|
+
function usePrevious(value) {
|
|
10
|
+
const ref = React.useRef({
|
|
11
|
+
value,
|
|
12
|
+
prev: null
|
|
13
|
+
});
|
|
14
|
+
const current = ref.current.value;
|
|
15
|
+
if (value !== current) {
|
|
16
|
+
ref.current = {
|
|
17
|
+
value,
|
|
18
|
+
prev: current
|
|
19
|
+
};
|
|
20
|
+
}
|
|
21
|
+
return ref.current.prev;
|
|
22
|
+
}
|
|
23
|
+
function useIntersectionObserver(ref, callback, intersectionObserverOptions = {}, options = {}) {
|
|
24
|
+
const isIntersectionObserverAvailable = React.useRef(
|
|
25
|
+
typeof IntersectionObserver === "function"
|
|
26
|
+
);
|
|
27
|
+
const observerRef = React.useRef(null);
|
|
28
|
+
React.useEffect(() => {
|
|
29
|
+
if (!ref.current || !isIntersectionObserverAvailable.current || options.disabled) {
|
|
30
|
+
return;
|
|
31
|
+
}
|
|
32
|
+
observerRef.current = new IntersectionObserver(([entry]) => {
|
|
33
|
+
callback(entry);
|
|
34
|
+
}, intersectionObserverOptions);
|
|
35
|
+
observerRef.current.observe(ref.current);
|
|
36
|
+
return () => {
|
|
37
|
+
var _a;
|
|
38
|
+
(_a = observerRef.current) == null ? void 0 : _a.disconnect();
|
|
39
|
+
};
|
|
40
|
+
}, [callback, intersectionObserverOptions, options.disabled, ref]);
|
|
41
|
+
return observerRef.current;
|
|
42
|
+
}
|
|
43
|
+
function useForwardedRef(ref) {
|
|
44
|
+
const innerRef = React.useRef(null);
|
|
45
|
+
React.useImperativeHandle(ref, () => innerRef.current, []);
|
|
46
|
+
return innerRef;
|
|
122
47
|
}
|
|
123
48
|
export {
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
functionalUpdate,
|
|
127
|
-
isPlainArray,
|
|
128
|
-
isPlainObject,
|
|
129
|
-
isServer,
|
|
130
|
-
last,
|
|
131
|
-
pick,
|
|
132
|
-
replaceEqualDeep,
|
|
133
|
-
shallow,
|
|
49
|
+
useForwardedRef,
|
|
50
|
+
useIntersectionObserver,
|
|
134
51
|
useLayoutEffect,
|
|
52
|
+
usePrevious,
|
|
135
53
|
useStableCallback
|
|
136
54
|
};
|
|
137
55
|
//# sourceMappingURL=utils.js.map
|
package/dist/esm/utils.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"utils.js","sources":["../../src/utils.ts"],"sourcesContent":["import * as React from 'react'\n\nexport type NoInfer<T> = [T][T extends any ? 0 : never]\nexport type IsAny<T, Y, N = T> = 1 extends 0 & T ? Y : N\nexport type PickAsRequired<T, K extends keyof T> = Omit<T, K> &\n Required<Pick<T, K>>\n\nexport type PickRequired<T> = {\n [K in keyof T as undefined extends T[K] ? never : K]: T[K]\n}\n\n// from https://stackoverflow.com/a/76458160\nexport type WithoutEmpty<T> = T extends T ? ({} extends T ? never : T) : never\n\n// export type Expand<T> = T\nexport type Expand<T> = T extends object\n ? T extends infer O\n ? { [K in keyof O]: O[K] }\n : never\n : T\n\nexport type UnionToIntersection<U> = (\n U extends any ? (k: U) => void : never\n) extends (k: infer I) => any\n ? I\n : never\n\nexport type DeepOptional<T, K extends keyof T> = Pick<DeepPartial<T>, K> &\n Omit<T, K>\n\nexport type DeepPartial<T> = T extends object\n ? {\n [P in keyof T]?: DeepPartial<T[P]>\n }\n : T\n\nexport type MakeDifferenceOptional<T, U> = Omit<U, keyof T> &\n Partial<Pick<U, keyof T & keyof U>> &\n PickRequired<Omit<U, keyof PickRequired<T>>>\n\n// from https://stackoverflow.com/a/53955431\nexport type IsUnion<T, U extends T = T> = (\n T extends any ? (U extends T ? false : true) : never\n) extends false\n ? false\n : true\n\n// type Compute<T> = { [K in keyof T]: T[K] } | never\n\n// type AllKeys<T> = T extends any ? keyof T : never\n\n// export type MergeUnion<T, Keys extends keyof T = keyof T> = Compute<\n// {\n// [K in Keys]: T[Keys]\n// } & {\n// [K in AllKeys<T>]?: T extends any\n// ? K extends keyof T\n// ? T[K]\n// : never\n// : never\n// }\n// >\n\nexport type Assign<Left, Right> = Omit<Left, keyof Right> & Right\n\nexport type AssignAll<T extends any[]> = T extends [infer Left, ...infer Right]\n ? Right extends any[]\n ? Assign<Left, AssignAll<Right>>\n : Left\n : {}\n\n// // Sample types to merge\n// type TypeA = {\n// shared: string\n// onlyInA: string\n// nested: {\n// shared: string\n// aProp: string\n// }\n// array: string[]\n// }\n\n// type TypeB = {\n// shared: number\n// onlyInB: number\n// nested: {\n// shared: number\n// bProp: number\n// }\n// array: number[]\n// }\n\n// type TypeC = {\n// shared: boolean\n// onlyInC: boolean\n// nested: {\n// shared: boolean\n// cProp: boolean\n// }\n// array: boolean[]\n// }\n\n// type Test = Expand<Assign<TypeA, TypeB>>\n\n// // Using DeepMerge to merge TypeA and TypeB\n// type MergedType = Expand<AssignAll<[TypeA, TypeB, TypeC]>>\n\nexport type Timeout = ReturnType<typeof setTimeout>\n\nexport type Updater<TPrevious, TResult = TPrevious> =\n | TResult\n | ((prev?: TPrevious) => TResult)\n\nexport type NonNullableUpdater<TPrevious, TResult = TPrevious> =\n | TResult\n | ((prev: TPrevious) => TResult)\n\n// from https://github.com/type-challenges/type-challenges/issues/737\ntype LastInUnion<U> =\n UnionToIntersection<U extends unknown ? (x: U) => 0 : never> extends (\n x: infer L,\n ) => 0\n ? L\n : never\nexport type UnionToTuple<U, Last = LastInUnion<U>> = [U] extends [never]\n ? []\n : [...UnionToTuple<Exclude<U, Last>>, Last]\n\n//\n\nexport const isServer = typeof document === 'undefined'\n\nexport function last<T>(arr: T[]) {\n return arr[arr.length - 1]\n}\n\nfunction isFunction(d: any): d is Function {\n return typeof d === 'function'\n}\n\nexport function functionalUpdate<TResult>(\n updater: Updater<TResult> | NonNullableUpdater<TResult>,\n previous: TResult,\n): TResult {\n if (isFunction(updater)) {\n return updater(previous as TResult)\n }\n\n return updater\n}\n\nexport function pick<T, K extends keyof T>(parent: T, keys: K[]): Pick<T, K> {\n return keys.reduce((obj: any, key: K) => {\n obj[key] = parent[key]\n return obj\n }, {} as any)\n}\n\n/**\n * This function returns `prev` if `_next` is deeply equal.\n * If not, it will replace any deeply equal children of `b` with those of `a`.\n * This can be used for structural sharing between immutable JSON values for example.\n * Do not use this with signals\n */\nexport function replaceEqualDeep<T>(prev: any, _next: T): T {\n if (prev === _next) {\n return prev\n }\n\n const next = _next as any\n\n const array = isPlainArray(prev) && isPlainArray(next)\n\n if (array || (isPlainObject(prev) && isPlainObject(next))) {\n const prevItems = array ? prev : Object.keys(prev)\n const prevSize = prevItems.length\n const nextItems = array ? next : Object.keys(next)\n const nextSize = nextItems.length\n const copy: any = array ? [] : {}\n\n let equalItems = 0\n\n for (let i = 0; i < nextSize; i++) {\n const key = array ? i : nextItems[i]\n if (\n !array &&\n prev[key] === undefined &&\n next[key] === undefined &&\n prevItems.includes(key)\n ) {\n copy[key] = undefined\n equalItems++\n } else {\n copy[key] = replaceEqualDeep(prev[key], next[key])\n if (copy[key] === prev[key] && prev[key] !== undefined) {\n equalItems++\n }\n }\n }\n\n return prevSize === nextSize && equalItems === prevSize ? prev : copy\n }\n\n return next\n}\n\n// Copied from: https://github.com/jonschlinkert/is-plain-object\nexport function isPlainObject(o: any) {\n if (!hasObjectPrototype(o)) {\n return false\n }\n\n // If has modified constructor\n const ctor = o.constructor\n if (typeof ctor === 'undefined') {\n return true\n }\n\n // If has modified prototype\n const prot = ctor.prototype\n if (!hasObjectPrototype(prot)) {\n return false\n }\n\n // If constructor does not have an Object-specific method\n if (!prot.hasOwnProperty('isPrototypeOf')) {\n return false\n }\n\n // Most likely a plain Object\n return true\n}\n\nfunction hasObjectPrototype(o: any) {\n return Object.prototype.toString.call(o) === '[object Object]'\n}\n\nexport function isPlainArray(value: unknown) {\n return Array.isArray(value) && value.length === Object.keys(value).length\n}\n\nexport function deepEqual(a: any, b: any, partial: boolean = false): boolean {\n if (a === b) {\n return true\n }\n\n if (typeof a !== typeof b) {\n return false\n }\n\n if (isPlainObject(a) && isPlainObject(b)) {\n const aKeys = Object.keys(a)\n const bKeys = Object.keys(b)\n\n if (!partial && aKeys.length !== bKeys.length) {\n return false\n }\n\n return !bKeys.some(\n (key) => !(key in a) || !deepEqual(a[key], b[key], partial),\n )\n }\n\n if (Array.isArray(a) && Array.isArray(b)) {\n return !a.some((item, index) => !deepEqual(item, b[index], partial))\n }\n\n return false\n}\n\nexport function useStableCallback<T extends (...args: any[]) => any>(fn: T): T {\n const fnRef = React.useRef(fn)\n fnRef.current = fn\n\n const ref = React.useRef((...args: any[]) => fnRef.current(...args))\n return ref.current as T\n}\n\nexport function shallow<T>(objA: T, objB: T) {\n if (Object.is(objA, objB)) {\n return true\n }\n\n if (\n typeof objA !== 'object' ||\n objA === null ||\n typeof objB !== 'object' ||\n objB === null\n ) {\n return false\n }\n\n const keysA = Object.keys(objA)\n if (keysA.length !== Object.keys(objB).length) {\n return false\n }\n\n for (let i = 0; i < keysA.length; i++) {\n if (\n !Object.prototype.hasOwnProperty.call(objB, keysA[i] as string) ||\n !Object.is(objA[keysA[i] as keyof T], objB[keysA[i] as keyof T])\n ) {\n return false\n }\n }\n return true\n}\n\nexport type StringLiteral<T> = T extends string\n ? string extends T\n ? string\n : T\n : never\n\nexport type StrictOrFrom<TFrom, TReturnIntersection extends boolean = false> =\n | {\n from: StringLiteral<TFrom> | TFrom\n strict?: true\n }\n | {\n from?: never\n strict: false\n experimental_returnIntersection?: TReturnIntersection\n }\n\nexport const useLayoutEffect =\n typeof window !== 'undefined' ? React.useLayoutEffect : React.useEffect\n\nexport function escapeJSON(jsonString: string) {\n return jsonString\n .replace(/\\\\/g, '\\\\\\\\') // Escape backslashes\n .replace(/'/g, \"\\\\'\") // Escape single quotes\n .replace(/\"/g, '\\\\\"') // Escape double quotes\n}\n"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"utils.js","sources":["../../src/utils.ts"],"sourcesContent":["import * as React from 'react'\n\nexport function useStableCallback<T extends (...args: Array<any>) => any>(\n fn: T,\n): T {\n const fnRef = React.useRef(fn)\n fnRef.current = fn\n\n const ref = React.useRef((...args: Array<any>) => fnRef.current(...args))\n return ref.current as T\n}\n\nexport const useLayoutEffect =\n typeof window !== 'undefined' ? React.useLayoutEffect : React.useEffect\n\n/**\n * Taken from https://www.developerway.com/posts/implementing-advanced-use-previous-hook#part3\n */\nexport function usePrevious<T>(value: T): T | null {\n // initialise the ref with previous and current values\n const ref = React.useRef<{ value: T; prev: T | null }>({\n value: value,\n prev: null,\n })\n\n const current = ref.current.value\n\n // if the value passed into hook doesn't match what we store as \"current\"\n // move the \"current\" to the \"previous\"\n // and store the passed value as \"current\"\n if (value !== current) {\n ref.current = {\n value: value,\n prev: current,\n }\n }\n\n // return the previous value only\n return ref.current.prev\n}\n\n/**\n * React hook to wrap `IntersectionObserver`.\n *\n * This hook will create an `IntersectionObserver` and observe the ref passed to it.\n *\n * When the intersection changes, the callback will be called with the `IntersectionObserverEntry`.\n *\n * @param ref - The ref to observe\n * @param intersectionObserverOptions - The options to pass to the IntersectionObserver\n * @param options - The options to pass to the hook\n * @param callback - The callback to call when the intersection changes\n * @returns The IntersectionObserver instance\n * @example\n * ```tsx\n * const MyComponent = () => {\n * const ref = React.useRef<HTMLDivElement>(null)\n * useIntersectionObserver(\n * ref,\n * (entry) => { doSomething(entry) },\n * { rootMargin: '10px' },\n * { disabled: false }\n * )\n * return <div ref={ref} />\n * ```\n */\nexport function useIntersectionObserver<T extends Element>(\n ref: React.RefObject<T | null>,\n callback: (entry: IntersectionObserverEntry | undefined) => void,\n intersectionObserverOptions: IntersectionObserverInit = {},\n options: { disabled?: boolean } = {},\n): IntersectionObserver | null {\n const isIntersectionObserverAvailable = React.useRef(\n typeof IntersectionObserver === 'function',\n )\n\n const observerRef = React.useRef<IntersectionObserver | null>(null)\n\n React.useEffect(() => {\n if (\n !ref.current ||\n !isIntersectionObserverAvailable.current ||\n options.disabled\n ) {\n return\n }\n\n observerRef.current = new IntersectionObserver(([entry]) => {\n callback(entry)\n }, intersectionObserverOptions)\n\n observerRef.current.observe(ref.current)\n\n return () => {\n observerRef.current?.disconnect()\n }\n }, [callback, intersectionObserverOptions, options.disabled, ref])\n\n return observerRef.current\n}\n\n/**\n * React hook to take a `React.ForwardedRef` and returns a `ref` that can be used on a DOM element.\n *\n * @param ref - The forwarded ref\n * @returns The inner ref returned by `useRef`\n * @example\n * ```tsx\n * const MyComponent = React.forwardRef((props, ref) => {\n * const innerRef = useForwardedRef(ref)\n * return <div ref={innerRef} />\n * })\n * ```\n */\nexport function useForwardedRef<T>(ref?: React.ForwardedRef<T>) {\n const innerRef = React.useRef<T>(null)\n React.useImperativeHandle(ref, () => innerRef.current!, [])\n return innerRef\n}\n"],"names":[],"mappings":";AAEO,SAAS,kBACd,IACG;AACG,QAAA,QAAQ,MAAM,OAAO,EAAE;AAC7B,QAAM,UAAU;AAEV,QAAA,MAAM,MAAM,OAAO,IAAI,SAAqB,MAAM,QAAQ,GAAG,IAAI,CAAC;AACxE,SAAO,IAAI;AACb;AAEO,MAAM,kBACX,OAAO,WAAW,cAAc,MAAM,kBAAkB,MAAM;AAKzD,SAAS,YAAe,OAAoB;AAE3C,QAAA,MAAM,MAAM,OAAqC;AAAA,IACrD;AAAA,IACA,MAAM;AAAA,EAAA,CACP;AAEK,QAAA,UAAU,IAAI,QAAQ;AAK5B,MAAI,UAAU,SAAS;AACrB,QAAI,UAAU;AAAA,MACZ;AAAA,MACA,MAAM;AAAA,IACR;AAAA,EAAA;AAIF,SAAO,IAAI,QAAQ;AACrB;AA2BgB,SAAA,wBACd,KACA,UACA,8BAAwD,CACxD,GAAA,UAAkC,IACL;AAC7B,QAAM,kCAAkC,MAAM;AAAA,IAC5C,OAAO,yBAAyB;AAAA,EAClC;AAEM,QAAA,cAAc,MAAM,OAAoC,IAAI;AAElE,QAAM,UAAU,MAAM;AACpB,QACE,CAAC,IAAI,WACL,CAAC,gCAAgC,WACjC,QAAQ,UACR;AACA;AAAA,IAAA;AAGF,gBAAY,UAAU,IAAI,qBAAqB,CAAC,CAAC,KAAK,MAAM;AAC1D,eAAS,KAAK;AAAA,OACb,2BAA2B;AAElB,gBAAA,QAAQ,QAAQ,IAAI,OAAO;AAEvC,WAAO,MAAM;;AACX,wBAAY,YAAZ,mBAAqB;AAAA,IACvB;AAAA,EAAA,GACC,CAAC,UAAU,6BAA6B,QAAQ,UAAU,GAAG,CAAC;AAEjE,SAAO,YAAY;AACrB;AAeO,SAAS,gBAAmB,KAA6B;AACxD,QAAA,WAAW,MAAM,OAAU,IAAI;AACrC,QAAM,oBAAoB,KAAK,MAAM,SAAS,SAAU,CAAA,CAAE;AACnD,SAAA;AACT;"}
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@tanstack/react-router",
|
|
3
|
-
"version": "1.20.1",
|
|
4
|
-
"description": "",
|
|
3
|
+
"version": "1.20.3-alpha.1",
|
|
4
|
+
"description": "Modern and scalable routing for React applications",
|
|
5
5
|
"author": "Tanner Linsley",
|
|
6
6
|
"license": "MIT",
|
|
7
7
|
"repository": {
|
|
@@ -14,6 +14,15 @@
|
|
|
14
14
|
"type": "github",
|
|
15
15
|
"url": "https://github.com/sponsors/tannerlinsley"
|
|
16
16
|
},
|
|
17
|
+
"keywords": [
|
|
18
|
+
"react",
|
|
19
|
+
"location",
|
|
20
|
+
"router",
|
|
21
|
+
"routing",
|
|
22
|
+
"async",
|
|
23
|
+
"async router",
|
|
24
|
+
"typescript"
|
|
25
|
+
],
|
|
17
26
|
"type": "module",
|
|
18
27
|
"types": "dist/esm/index.d.ts",
|
|
19
28
|
"main": "dist/cjs/index.cjs",
|
|
@@ -32,44 +41,34 @@
|
|
|
32
41
|
"./package.json": "./package.json"
|
|
33
42
|
},
|
|
34
43
|
"sideEffects": false,
|
|
35
|
-
"keywords": [
|
|
36
|
-
"react",
|
|
37
|
-
"location",
|
|
38
|
-
"router",
|
|
39
|
-
"routing",
|
|
40
|
-
"async",
|
|
41
|
-
"async router",
|
|
42
|
-
"typescript"
|
|
43
|
-
],
|
|
44
|
-
"engines": {
|
|
45
|
-
"node": ">=12"
|
|
46
|
-
},
|
|
47
44
|
"files": [
|
|
48
45
|
"dist",
|
|
49
46
|
"src"
|
|
50
47
|
],
|
|
48
|
+
"engines": {
|
|
49
|
+
"node": ">=12"
|
|
50
|
+
},
|
|
51
51
|
"dependencies": {
|
|
52
|
-
"@tanstack/react-store": "^0.
|
|
53
|
-
"
|
|
52
|
+
"@tanstack/react-store": "^0.7.0",
|
|
53
|
+
"jsesc": "^3.1.0",
|
|
54
|
+
"tiny-invariant": "^1.3.3",
|
|
54
55
|
"tiny-warning": "^1.0.3",
|
|
55
|
-
"@tanstack/history": "1.
|
|
56
|
+
"@tanstack/history": "1.20.3-alpha.1",
|
|
57
|
+
"@tanstack/router-core": "1.20.3-alpha.1"
|
|
56
58
|
},
|
|
57
59
|
"devDependencies": {
|
|
58
|
-
"@
|
|
59
|
-
"react": "^
|
|
60
|
-
"
|
|
61
|
-
"
|
|
60
|
+
"@testing-library/jest-dom": "^6.6.3",
|
|
61
|
+
"@testing-library/react": "^16.2.0",
|
|
62
|
+
"@types/jsesc": "^3.0.3",
|
|
63
|
+
"@vitejs/plugin-react": "^4.3.4",
|
|
64
|
+
"combinate": "^1.1.11",
|
|
65
|
+
"react": "^19.0.0",
|
|
66
|
+
"react-dom": "^19.0.0",
|
|
67
|
+
"zod": "^3.24.2"
|
|
62
68
|
},
|
|
63
69
|
"peerDependencies": {
|
|
64
|
-
"react": ">=
|
|
65
|
-
"react-dom": ">=
|
|
70
|
+
"react": ">=18.0.0 || >=19.0.0",
|
|
71
|
+
"react-dom": ">=18.0.0 || >=19.0.0"
|
|
66
72
|
},
|
|
67
|
-
"scripts": {
|
|
68
|
-
"clean": "rimraf ./dist && rimraf ./coverage",
|
|
69
|
-
"test:types": "tsc",
|
|
70
|
-
"test:lib": "vitest",
|
|
71
|
-
"test:lib:dev": "pnpm run test:lib --watch",
|
|
72
|
-
"test:build": "publint --strict",
|
|
73
|
-
"build": "vite build"
|
|
74
|
-
}
|
|
73
|
+
"scripts": {}
|
|
75
74
|
}
|
package/src/Asset.tsx
ADDED
|
@@ -0,0 +1,40 @@
|
|
|
1
|
+
import type { RouterManagedTag } from '@tanstack/router-core'
|
|
2
|
+
|
|
3
|
+
export function Asset({ tag, attrs, children }: RouterManagedTag): any {
|
|
4
|
+
switch (tag) {
|
|
5
|
+
case 'title':
|
|
6
|
+
return (
|
|
7
|
+
<title {...attrs} suppressHydrationWarning>
|
|
8
|
+
{children}
|
|
9
|
+
</title>
|
|
10
|
+
)
|
|
11
|
+
case 'meta':
|
|
12
|
+
return <meta {...attrs} suppressHydrationWarning />
|
|
13
|
+
case 'link':
|
|
14
|
+
return <link {...attrs} suppressHydrationWarning />
|
|
15
|
+
case 'style':
|
|
16
|
+
return (
|
|
17
|
+
<style
|
|
18
|
+
{...attrs}
|
|
19
|
+
dangerouslySetInnerHTML={{ __html: children as any }}
|
|
20
|
+
/>
|
|
21
|
+
)
|
|
22
|
+
case 'script':
|
|
23
|
+
if ((attrs as any) && (attrs as any).src) {
|
|
24
|
+
return <script {...attrs} suppressHydrationWarning />
|
|
25
|
+
}
|
|
26
|
+
if (typeof children === 'string')
|
|
27
|
+
return (
|
|
28
|
+
<script
|
|
29
|
+
{...attrs}
|
|
30
|
+
dangerouslySetInnerHTML={{
|
|
31
|
+
__html: children,
|
|
32
|
+
}}
|
|
33
|
+
suppressHydrationWarning
|
|
34
|
+
/>
|
|
35
|
+
)
|
|
36
|
+
return null
|
|
37
|
+
default:
|
|
38
|
+
return null
|
|
39
|
+
}
|
|
40
|
+
}
|
package/src/CatchBoundary.tsx
CHANGED
|
@@ -1,10 +1,12 @@
|
|
|
1
1
|
import * as React from 'react'
|
|
2
|
+
import type { ErrorRouteComponent } from './route'
|
|
3
|
+
import type { ErrorInfo } from 'react'
|
|
2
4
|
|
|
3
5
|
export function CatchBoundary(props: {
|
|
4
|
-
getResetKey: () => string
|
|
5
|
-
children:
|
|
6
|
-
errorComponent?:
|
|
7
|
-
onCatch?: (error:
|
|
6
|
+
getResetKey: () => number | string
|
|
7
|
+
children: React.ReactNode
|
|
8
|
+
errorComponent?: ErrorRouteComponent
|
|
9
|
+
onCatch?: (error: Error, errorInfo: ErrorInfo) => void
|
|
8
10
|
}) {
|
|
9
11
|
const errorComponent = props.errorComponent ?? ErrorComponent
|
|
10
12
|
|
|
@@ -12,10 +14,11 @@ export function CatchBoundary(props: {
|
|
|
12
14
|
<CatchBoundaryImpl
|
|
13
15
|
getResetKey={props.getResetKey}
|
|
14
16
|
onCatch={props.onCatch}
|
|
15
|
-
children={({ error }) => {
|
|
17
|
+
children={({ error, reset }) => {
|
|
16
18
|
if (error) {
|
|
17
19
|
return React.createElement(errorComponent, {
|
|
18
20
|
error,
|
|
21
|
+
reset,
|
|
19
22
|
})
|
|
20
23
|
}
|
|
21
24
|
|
|
@@ -25,39 +28,52 @@ export function CatchBoundary(props: {
|
|
|
25
28
|
)
|
|
26
29
|
}
|
|
27
30
|
|
|
28
|
-
|
|
29
|
-
getResetKey
|
|
30
|
-
children: (props: {
|
|
31
|
-
|
|
31
|
+
class CatchBoundaryImpl extends React.Component<{
|
|
32
|
+
getResetKey: () => number | string
|
|
33
|
+
children: (props: {
|
|
34
|
+
error: Error | null
|
|
35
|
+
reset: () => void
|
|
36
|
+
}) => React.ReactNode
|
|
37
|
+
onCatch?: (error: Error, errorInfo: ErrorInfo) => void
|
|
32
38
|
}> {
|
|
33
|
-
state = { error: null } as
|
|
39
|
+
state = { error: null } as { error: Error | null; resetKey: string }
|
|
34
40
|
static getDerivedStateFromProps(props: any) {
|
|
35
|
-
return { resetKey: props.getResetKey
|
|
41
|
+
return { resetKey: props.getResetKey() }
|
|
36
42
|
}
|
|
37
|
-
static getDerivedStateFromError(error:
|
|
43
|
+
static getDerivedStateFromError(error: Error) {
|
|
38
44
|
return { error }
|
|
39
45
|
}
|
|
46
|
+
reset() {
|
|
47
|
+
this.setState({ error: null })
|
|
48
|
+
}
|
|
40
49
|
componentDidUpdate(
|
|
41
50
|
prevProps: Readonly<{
|
|
42
|
-
getResetKey
|
|
51
|
+
getResetKey: () => string
|
|
43
52
|
children: (props: { error: any; reset: () => void }) => any
|
|
44
53
|
onCatch?: ((error: any, info: any) => void) | undefined
|
|
45
54
|
}>,
|
|
46
55
|
prevState: any,
|
|
47
56
|
): void {
|
|
48
57
|
if (prevState.error && prevState.resetKey !== this.state.resetKey) {
|
|
49
|
-
this.
|
|
58
|
+
this.reset()
|
|
50
59
|
}
|
|
51
60
|
}
|
|
52
|
-
componentDidCatch(error:
|
|
61
|
+
componentDidCatch(error: Error, errorInfo: ErrorInfo) {
|
|
53
62
|
if (this.props.onCatch) {
|
|
54
|
-
this.props.onCatch
|
|
55
|
-
} else {
|
|
56
|
-
console.error(error)
|
|
63
|
+
this.props.onCatch(error, errorInfo)
|
|
57
64
|
}
|
|
58
65
|
}
|
|
59
66
|
render() {
|
|
60
|
-
|
|
67
|
+
// If the resetKey has changed, don't render the error
|
|
68
|
+
return this.props.children({
|
|
69
|
+
error:
|
|
70
|
+
this.state.resetKey !== this.props.getResetKey()
|
|
71
|
+
? null
|
|
72
|
+
: this.state.error,
|
|
73
|
+
reset: () => {
|
|
74
|
+
this.reset()
|
|
75
|
+
},
|
|
76
|
+
})
|
|
61
77
|
}
|
|
62
78
|
}
|
|
63
79
|
|