UNPKG

@tanstack/react-router

Version:

Modern and scalable routing for React applications

1 lines 3.67 kB
{"version":3,"file":"useRouterState.cjs","names":[],"sources":["../../src/useRouterState.tsx"],"sourcesContent":["import { useStore } from '@tanstack/react-store'\nimport { useRef } from 'react'\nimport { replaceEqualDeep } from '@tanstack/router-core'\nimport { isServer } from '@tanstack/router-core/isServer'\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\n/**\n * Subscribe to the router's state store with optional selection and\n * structural sharing for render optimization.\n *\n * Options:\n * - `select`: Project the full router state to a derived slice\n * - `structuralSharing`: Replace-equal semantics for stable references\n * - `router`: Read state from a specific router instance instead of context\n *\n * @returns The selected router state (or the full state by default).\n * @link https://tanstack.com/router/latest/docs/framework/react/api/router/useRouterStateHook\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\n // During SSR we render exactly once and do not need reactivity.\n // Avoid subscribing to the store (and any structural sharing work) on the server.\n const _isServer = isServer ?? router.isServer\n if (_isServer) {\n const state = router.stores.__store.state as RouterState<\n TRouter['routeTree']\n >\n return (opts?.select ? opts.select(state) : state) as UseRouterStateResult<\n TRouter,\n TSelected\n >\n }\n\n const previousResult =\n // eslint-disable-next-line react-hooks/rules-of-hooks\n useRef<ValidateSelected<TRouter, TSelected, TStructuralSharing>>(undefined)\n\n // eslint-disable-next-line react-hooks/rules-of-hooks\n return useStore(router.stores.__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"],"mappings":";;;;;;;;;;;;;;;;;;;AA2CA,SAAgB,eAKd,MAC0C;CAC1C,MAAM,gBAAgB,kBAAA,UAAmB,EACvC,MAAM,MAAM,WAAW,KAAA,GACxB,CAAC;CACF,MAAM,SAAS,MAAM,UAAU;AAK/B,KADkB,+BAAA,YAAY,OAAO,UACtB;EACb,MAAM,QAAQ,OAAO,OAAO,QAAQ;AAGpC,SAAQ,MAAM,SAAS,KAAK,OAAO,MAAM,GAAG;;CAM9C,MAAM,kBAAA,GAAA,MAAA,QAE6D,KAAA,EAAU;AAG7E,SAAA,GAAA,sBAAA,UAAgB,OAAO,OAAO,UAAU,UAAU;AAChD,MAAI,MAAM,QAAQ;AAChB,OAAI,KAAK,qBAAqB,OAAO,QAAQ,0BAA0B;IACrE,MAAM,YAAA,GAAA,sBAAA,kBACJ,eAAe,SACf,KAAK,OAAO,MAAM,CACnB;AACD,mBAAe,UAAU;AACzB,WAAO;;AAET,UAAO,KAAK,OAAO,MAAM;;AAE3B,SAAO;GACP"}