[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"skill-tanstack-vue-router":3,"mdc--ugymbt-key":52,"related-org-tanstack-vue-router":5235,"related-repo-tanstack-vue-router":5377},{"slug":4,"name":4,"fn":5,"description":6,"org":7,"tags":11,"stars":26,"repoUrl":27,"updatedAt":28,"license":29,"forks":30,"topics":31,"repo":47,"sourceUrl":50,"mdContent":51},"vue-router","implement TanStack Router in Vue applications","Vue bindings for TanStack Router: RouterProvider, useRouter, useRouterState, useMatch, useMatches, useLocation, useSearch, useParams, useNavigate, useLoaderData, useLoaderDeps, useRouteContext, useBlocker, useCanGoBack, Link, Navigate, Outlet, CatchBoundary, ErrorComponent, Html, Body. Vue-specific patterns with Ref\u003CT> returns, defineComponent, h() render functions, provide\u002Finject, and computed refs.",{"slug":8,"name":9,"logoUrl":10,"githubOrg":9},"tanstack","TanStack","https:\u002F\u002Fpexgzepcugksgbtrxkhf.supabase.co\u002Fstorage\u002Fv1\u002Fobject\u002Fpublic\u002Forg-logos\u002Ftanstack.png",[12,16,19,22,23],{"name":13,"slug":14,"type":15},"TanStack Router","tanstack-router","tag",{"name":17,"slug":18,"type":15},"Vue","vue",{"name":20,"slug":21,"type":15},"Routing","routing",{"name":9,"slug":8,"type":15},{"name":24,"slug":25,"type":15},"Frontend","frontend",14787,"https:\u002F\u002Fgithub.com\u002FTanStack\u002Frouter","2026-07-30T05:27:12.497972",null,1761,[32,33,34,35,36,37,21,38,39,40,41,42,43,44,45,46],"framework","fullstack","javascript","react","route","router","rpc","search","searchparams","server-functions","ssr","state-management","typesafe","typescript","url",{"repoUrl":27,"stars":26,"forks":30,"topics":48,"description":49},[32,33,34,35,36,37,21,38,39,40,41,42,43,44,45,46],"🤖 A client-first, server-capable, fully type-safe router and full-stack framework for the web (React and more).","https:\u002F\u002Fgithub.com\u002FTanStack\u002Frouter\u002Ftree\u002FHEAD\u002Fpackages\u002Fvue-router\u002Fskills\u002Fvue-router","---\nname: vue-router\ndescription: >-\n Vue bindings for TanStack Router: RouterProvider, useRouter,\n useRouterState, useMatch, useMatches, useLocation, useSearch,\n useParams, useNavigate, useLoaderData, useLoaderDeps,\n useRouteContext, useBlocker, useCanGoBack, Link, Navigate,\n Outlet, CatchBoundary, ErrorComponent, Html, Body.\n Vue-specific patterns with Ref\u003CT> returns, defineComponent,\n h() render functions, provide\u002Finject, and computed refs.\nmetadata:\n type: framework\n library: tanstack-router\n library_version: '1.166.2'\n framework: vue\nrequires:\n - router-core\nsources:\n - TanStack\u002Frouter:packages\u002Fvue-router\u002Fsrc\n---\n\n# Vue Router (`@tanstack\u002Fvue-router`)\n\nThis skill builds on router-core. Read [router-core](..\u002F..\u002F..\u002Frouter-core\u002Fskills\u002Frouter-core\u002FSKILL.md) first for foundational concepts.\n\nThis skill covers the Vue-specific bindings, components, composables, and setup for TanStack Router.\n\n> **CRITICAL**: TanStack Router types are FULLY INFERRED. Never cast, never annotate inferred values.\n\n> **CRITICAL**: TanStack Router is CLIENT-FIRST. Loaders run on the client by default, not on the server.\n\n> **CRITICAL**: Most composables return `Ref\u003CT>` — access via `.value` in script, auto-unwrapped in templates. This is the #1 difference from the React version.\n\n> **CRITICAL**: Do not confuse `@tanstack\u002Fvue-router` with `vue-router` (the official Vue router). They are completely different libraries with different APIs.\n\n## Full Setup: File-Based Routing with Vite\n\n### 1. Install Dependencies\n\n```bash\nnpm install @tanstack\u002Fvue-router\nnpm install -D @tanstack\u002Frouter-plugin @vitejs\u002Fplugin-vue-jsx\n```\n\n### 2. Configure Vite Plugin\n\n```ts\n\u002F\u002F vite.config.ts\nimport { defineConfig } from 'vite'\nimport vue from '@vitejs\u002Fplugin-vue'\nimport vueJsx from '@vitejs\u002Fplugin-vue-jsx'\nimport { tanstackRouter } from '@tanstack\u002Frouter-plugin\u002Fvite'\n\nexport default defineConfig({\n plugins: [\n \u002F\u002F MUST come before vue()\n tanstackRouter({\n target: 'vue',\n autoCodeSplitting: true,\n }),\n vue(),\n vueJsx(), \u002F\u002F Required for JSX\u002FTSX route files\n ],\n})\n```\n\n### 3. Create Root Route\n\n```tsx\n\u002F\u002F src\u002Froutes\u002F__root.tsx\nimport { createRootRoute, Link, Outlet } from '@tanstack\u002Fvue-router'\n\nexport const Route = createRootRoute({\n component: RootLayout,\n})\n\nfunction RootLayout() {\n return (\n \u003C>\n \u003Cnav>\n \u003CLink to=\"\u002F\" activeProps={{ class: 'font-bold' }}>\n Home\n \u003C\u002FLink>\n \u003CLink to=\"\u002Fabout\" activeProps={{ class: 'font-bold' }}>\n About\n \u003C\u002FLink>\n \u003C\u002Fnav>\n \u003Chr \u002F>\n \u003COutlet \u002F>\n \u003C\u002F>\n )\n}\n```\n\n### 4. Create Route Files\n\n```tsx\n\u002F\u002F src\u002Froutes\u002Findex.tsx\nimport { createFileRoute } from '@tanstack\u002Fvue-router'\n\nexport const Route = createFileRoute('\u002F')({\n component: HomePage,\n})\n\nfunction HomePage() {\n return \u003Ch1>Welcome Home\u003C\u002Fh1>\n}\n```\n\n### 5. Create Router Instance and Register Types\n\n```tsx\n\u002F\u002F src\u002Fmain.tsx\nimport { createApp } from 'vue'\nimport { RouterProvider, createRouter } from '@tanstack\u002Fvue-router'\nimport { routeTree } from '.\u002FrouteTree.gen'\n\nconst router = createRouter({ routeTree })\n\n\u002F\u002F REQUIRED — without this, Link\u002FuseNavigate\u002FuseSearch have no type safety\ndeclare module '@tanstack\u002Fvue-router' {\n interface Register {\n router: typeof router\n }\n}\n\nconst app = createApp(RouterProvider, { router })\napp.mount('#root')\n```\n\n## Composables Reference\n\nAll composables imported from `@tanstack\u002Fvue-router`. Most return `Ref\u003CT>` — access via `.value` in script or auto-unwrap in templates.\n\n### `useRouter()` — returns `TRouter` (NOT a Ref)\n\n```tsx\nimport { useRouter } from '@tanstack\u002Fvue-router'\n\nconst router = useRouter()\nrouter.invalidate()\n```\n\n### `useRouterState()` — returns `Ref\u003CT>`\n\nSubscribe to router state changes. Exposes the entire state and thus incurs\na performance cost. For matches or location favor `useMatches` and `useLocation`.\n\n```tsx\nimport { useRouterState } from '@tanstack\u002Fvue-router'\n\nconst isLoading = useRouterState({ select: (s) => s.isLoading })\n\u002F\u002F Access: isLoading.value\n```\n\n### `useNavigate()` — returns a function (NOT a Ref)\n\n```tsx\nimport { useNavigate } from '@tanstack\u002Fvue-router'\n\nconst navigate = useNavigate()\n\nasync function handleSubmit() {\n await saveData()\n navigate({ to: '\u002Fposts\u002F$postId', params: { postId: '123' } })\n}\n```\n\n### `useSearch({ from })` — returns `Ref\u003CT>`\n\n```tsx\nimport { useSearch } from '@tanstack\u002Fvue-router'\n\nconst search = useSearch({ from: '\u002Fproducts' })\n\u002F\u002F Access: search.value.page\n```\n\n### `useParams({ from })` — returns `Ref\u003CT>`\n\n```tsx\nimport { useParams } from '@tanstack\u002Fvue-router'\n\nconst params = useParams({ from: '\u002Fposts\u002F$postId' })\n\u002F\u002F Access: params.value.postId\n```\n\n### `useLoaderData({ from })` — returns `Ref\u003CT>`\n\n```tsx\nimport { useLoaderData } from '@tanstack\u002Fvue-router'\n\nconst data = useLoaderData({ from: '\u002Fposts\u002F$postId' })\n\u002F\u002F Access: data.value.post.content\n```\n\n### `useMatch({ from })` — returns `Ref\u003CT>`\n\n```tsx\nimport { useMatch } from '@tanstack\u002Fvue-router'\n\nconst match = useMatch({ from: '\u002Fposts\u002F$postId' })\n\u002F\u002F Access: match.value.loaderData.post.title\n```\n\n### Other Composables\n\n- **`useMatches()`** — `Ref\u003CArray\u003CMatch>>`, all active route matches\n- **`useRouteContext({ from })`** — `Ref\u003CT>`, context from `beforeLoad`\n- **`useBlocker({ shouldBlockFn })`** — blocks navigation for unsaved changes\n- **`useCanGoBack()`** — `Ref\u003Cboolean>`\n- **`useLocation()`** — `Ref\u003CParsedLocation>`\n- **`useLoaderDeps({ from })`** — `Ref\u003CT>`, loader dependency values\n- **`useLinkProps()`** — returns `LinkHTMLAttributes`\n- **`useMatchRoute()`** — returns a function; calling it returns `Ref\u003Cfalse | Params>`\n\n## Components Reference\n\n### `RouterProvider`\n\n```tsx\nimport { RouterProvider } from '@tanstack\u002Fvue-router'\n\u002F\u002F In createApp or template\n\u003CRouterProvider :router=\"router\" \u002F>\n```\n\n### `Link`\n\nType-safe navigation link with scoped slot for active state:\n\n```vue\n\u003CLink to=\"\u002Fposts\u002F$postId\" :params=\"{ postId: '42' }\">\n View Post\n\u003C\u002FLink>\n\n\u003C!-- Scoped slot for active state -->\n\u003CLink to=\"\u002Fabout\">\n \u003Ctemplate #default=\"{ isActive }\">\n \u003Cspan :class=\"{ active: isActive }\">About\u003C\u002Fspan>\n \u003C\u002Ftemplate>\n\u003C\u002FLink>\n```\n\n### `Outlet`\n\nRenders the matched child route component.\n\n### `Navigate`\n\nDeclarative redirect (triggers navigation in `onMounted`).\n\n### `Await`\n\nAsync setup component for deferred data — use with Vue's `\u003CSuspense>`.\n\n### `CatchBoundary`\n\nError boundary using Vue's `onErrorCaptured`.\n\n### `Html` and `Body`\n\nVue-specific SSR shell components:\n\n```tsx\nfunction RootComponent() {\n return (\n \u003CHtml>\n \u003Chead>\n \u003CHeadContent \u002F>\n \u003C\u002Fhead>\n \u003CBody>\n \u003COutlet \u002F>\n \u003CScripts \u002F>\n \u003C\u002FBody>\n \u003C\u002FHtml>\n )\n}\n```\n\n### `ClientOnly`\n\nRenders children only after `onMounted` (hydration complete):\n\n```tsx\n\u003CClientOnly fallback={\u003Cdiv>Loading...\u003C\u002Fdiv>}>\n \u003CBrowserOnlyWidget \u002F>\n\u003C\u002FClientOnly>\n```\n\n## Vue-Specific Patterns\n\n### Custom Link Component with `createLink`\n\n```tsx\nimport { createLink } from '@tanstack\u002Fvue-router'\nimport { defineComponent, h } from 'vue'\n\nconst StyledLinkComponent = defineComponent({\n setup(props, { slots, attrs }) {\n return () => h('a', { ...attrs, class: 'styled-link' }, slots.default?.())\n },\n})\n\nconst StyledLink = createLink(StyledLinkComponent)\n```\n\n### Render Functions (h())\n\nAll components in `@tanstack\u002Fvue-router` use `h()` render functions internally. Route components can use either SFC templates or render functions:\n\nSFC template (most common for user code) in `MyRoute.component.vue`:\n\n```vue\n\u003Ctemplate>\n \u003Cdiv>{{ data.title }}\u003C\u002Fdiv>\n\u003C\u002Ftemplate>\n\n\u003Cscript setup>\nimport { useLoaderData } from '@tanstack\u002Fvue-router'\nconst data = useLoaderData({ from: '\u002Fposts\u002F$postId' })\n\u003C\u002Fscript>\n```\n\n### Auth with Router Context\n\n```tsx\nimport { createRootRouteWithContext } from '@tanstack\u002Fvue-router'\n\nconst rootRoute = createRootRouteWithContext\u003C{ auth: AuthState }>()({\n component: RootComponent,\n})\n\nconst router = createRouter({\n routeTree,\n context: { auth: authState },\n})\n\n\u002F\u002F In a route — access via beforeLoad\nbeforeLoad: ({ context }) => {\n if (!context.auth.isAuthenticated) {\n throw redirect({ to: '\u002Flogin' })\n }\n}\n```\n\n### Vue File Conventions for Code Splitting\n\nWith `autoCodeSplitting`, Vue routes can optionally use split-file conventions. These are NOT required — single-file `.tsx` routes work fine. Split files are useful for separating route config from components:\n\n- `myRoute.ts` — route configuration (search params, loader, beforeLoad)\n- `myRoute.component.vue` — route component (lazy-loaded)\n- `myRoute.errorComponent.vue` — error component (lazy-loaded)\n- `myRoute.notFoundComponent.vue` — not-found component (lazy-loaded)\n- `myRoute.lazy.ts` — lazy-loaded route options\n\n## Common Mistakes\n\n### 1. CRITICAL: Forgetting .value in script blocks\n\nComposables return `Ref\u003CT>` — access via `.value` in `\u003Cscript>`. Templates auto-unwrap.\n\n```tsx\n\u002F\u002F WRONG — accessing Ref without .value in script\nconst params = useParams({ from: '\u002Fposts\u002F$postId' })\nconsole.log(params.postId) \u002F\u002F undefined!\n\n\u002F\u002F CORRECT — use .value\nconst params = useParams({ from: '\u002Fposts\u002F$postId' })\nconsole.log(params.value.postId)\n```\n\n### 2. HIGH: Confusing with vue-router (official)\n\n`@tanstack\u002Fvue-router` is NOT `vue-router`. Do not use `\u003Crouter-view>`, `\u003Crouter-link>`, `useRoute()`, `useRouter()` from `vue-router`.\n\n```ts\n\u002F\u002F WRONG — official vue-router imports\nimport { useRoute, useRouter } from 'vue-router'\n\n\u002F\u002F CORRECT — TanStack Vue Router imports\nimport { useMatch, useRouter } from '@tanstack\u002Fvue-router'\n```\n\n### 3. HIGH: Using Vue hooks in beforeLoad or loader\n\n`beforeLoad` and `loader` are NOT component setup functions — they are plain async functions. Vue composables cannot be used in them. Pass state via router context instead.\n\n### 4. MEDIUM: Wrong plugin target\n\nMust set `target: 'vue'` in the router plugin config. Default is `'react'`.\n\n## Cross-References\n\n- [router-core\u002FSKILL.md](..\u002F..\u002F..\u002Frouter-core\u002Fskills\u002Frouter-core\u002FSKILL.md) — all sub-skills for domain-specific patterns (search params, data loading, navigation, auth, SSR, etc.)\n",{"data":53,"body":60},{"name":4,"description":6,"metadata":54,"requires":56,"sources":58},{"type":32,"library":14,"library_version":55,"framework":18},"1.166.2",[57],"router-core",[59],"TanStack\u002Frouter:packages\u002Fvue-router\u002Fsrc",{"type":61,"children":62},"root",[63,81,95,100,115,127,155,181,188,195,256,262,649,655,1130,1136,1345,1351,1723,1729,1754,1774,1868,1884,1904,2041,2053,2272,2288,2403,2419,2533,2549,2663,2679,2793,2799,2963,2969,2979,3046,3055,3060,3266,3275,3280,3290,3303,3313,3325,3335,3347,3364,3369,3561,3571,3583,3670,3676,3688,4018,4024,4044,4056,4259,4265,4650,4656,4677,4735,4741,4747,4773,4986,4992,5044,5161,5167,5184,5190,5210,5216,5229],{"type":64,"tag":65,"props":66,"children":68},"element","h1",{"id":67},"vue-router-tanstackvue-router",[69,72,79],{"type":70,"value":71},"text","Vue Router (",{"type":64,"tag":73,"props":74,"children":76},"code",{"className":75},[],[77],{"type":70,"value":78},"@tanstack\u002Fvue-router",{"type":70,"value":80},")",{"type":64,"tag":82,"props":83,"children":84},"p",{},[85,87,93],{"type":70,"value":86},"This skill builds on router-core. Read ",{"type":64,"tag":88,"props":89,"children":91},"a",{"href":90},"..\u002F..\u002F..\u002Frouter-core\u002Fskills\u002Frouter-core\u002FSKILL.md",[92],{"type":70,"value":57},{"type":70,"value":94}," first for foundational concepts.",{"type":64,"tag":82,"props":96,"children":97},{},[98],{"type":70,"value":99},"This skill covers the Vue-specific bindings, components, composables, and setup for TanStack Router.",{"type":64,"tag":101,"props":102,"children":103},"blockquote",{},[104],{"type":64,"tag":82,"props":105,"children":106},{},[107,113],{"type":64,"tag":108,"props":109,"children":110},"strong",{},[111],{"type":70,"value":112},"CRITICAL",{"type":70,"value":114},": TanStack Router types are FULLY INFERRED. Never cast, never annotate inferred values.",{"type":64,"tag":101,"props":116,"children":117},{},[118],{"type":64,"tag":82,"props":119,"children":120},{},[121,125],{"type":64,"tag":108,"props":122,"children":123},{},[124],{"type":70,"value":112},{"type":70,"value":126},": TanStack Router is CLIENT-FIRST. Loaders run on the client by default, not on the server.",{"type":64,"tag":101,"props":128,"children":129},{},[130],{"type":64,"tag":82,"props":131,"children":132},{},[133,137,139,145,147,153],{"type":64,"tag":108,"props":134,"children":135},{},[136],{"type":70,"value":112},{"type":70,"value":138},": Most composables return ",{"type":64,"tag":73,"props":140,"children":142},{"className":141},[],[143],{"type":70,"value":144},"Ref\u003CT>",{"type":70,"value":146}," — access via ",{"type":64,"tag":73,"props":148,"children":150},{"className":149},[],[151],{"type":70,"value":152},".value",{"type":70,"value":154}," in script, auto-unwrapped in templates. This is the #1 difference from the React version.",{"type":64,"tag":101,"props":156,"children":157},{},[158],{"type":64,"tag":82,"props":159,"children":160},{},[161,165,167,172,174,179],{"type":64,"tag":108,"props":162,"children":163},{},[164],{"type":70,"value":112},{"type":70,"value":166},": Do not confuse ",{"type":64,"tag":73,"props":168,"children":170},{"className":169},[],[171],{"type":70,"value":78},{"type":70,"value":173}," with ",{"type":64,"tag":73,"props":175,"children":177},{"className":176},[],[178],{"type":70,"value":4},{"type":70,"value":180}," (the official Vue router). They are completely different libraries with different APIs.",{"type":64,"tag":182,"props":183,"children":185},"h2",{"id":184},"full-setup-file-based-routing-with-vite",[186],{"type":70,"value":187},"Full Setup: File-Based Routing with Vite",{"type":64,"tag":189,"props":190,"children":192},"h3",{"id":191},"_1-install-dependencies",[193],{"type":70,"value":194},"1. Install Dependencies",{"type":64,"tag":196,"props":197,"children":202},"pre",{"className":198,"code":199,"language":200,"meta":201,"style":201},"language-bash shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","npm install @tanstack\u002Fvue-router\nnpm install -D @tanstack\u002Frouter-plugin @vitejs\u002Fplugin-vue-jsx\n","bash","",[203],{"type":64,"tag":73,"props":204,"children":205},{"__ignoreMap":201},[206,229],{"type":64,"tag":207,"props":208,"children":211},"span",{"class":209,"line":210},"line",1,[212,218,224],{"type":64,"tag":207,"props":213,"children":215},{"style":214},"--shiki-light:#E2931D;--shiki-default:#FFCB6B;--shiki-dark:#FFCB6B",[216],{"type":70,"value":217},"npm",{"type":64,"tag":207,"props":219,"children":221},{"style":220},"--shiki-light:#91B859;--shiki-default:#C3E88D;--shiki-dark:#C3E88D",[222],{"type":70,"value":223}," install",{"type":64,"tag":207,"props":225,"children":226},{"style":220},[227],{"type":70,"value":228}," @tanstack\u002Fvue-router\n",{"type":64,"tag":207,"props":230,"children":232},{"class":209,"line":231},2,[233,237,241,246,251],{"type":64,"tag":207,"props":234,"children":235},{"style":214},[236],{"type":70,"value":217},{"type":64,"tag":207,"props":238,"children":239},{"style":220},[240],{"type":70,"value":223},{"type":64,"tag":207,"props":242,"children":243},{"style":220},[244],{"type":70,"value":245}," -D",{"type":64,"tag":207,"props":247,"children":248},{"style":220},[249],{"type":70,"value":250}," @tanstack\u002Frouter-plugin",{"type":64,"tag":207,"props":252,"children":253},{"style":220},[254],{"type":70,"value":255}," @vitejs\u002Fplugin-vue-jsx\n",{"type":64,"tag":189,"props":257,"children":259},{"id":258},"_2-configure-vite-plugin",[260],{"type":70,"value":261},"2. Configure Vite Plugin",{"type":64,"tag":196,"props":263,"children":267},{"className":264,"code":265,"language":266,"meta":201,"style":201},"language-ts shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","\u002F\u002F vite.config.ts\nimport { defineConfig } from 'vite'\nimport vue from '@vitejs\u002Fplugin-vue'\nimport vueJsx from '@vitejs\u002Fplugin-vue-jsx'\nimport { tanstackRouter } from '@tanstack\u002Frouter-plugin\u002Fvite'\n\nexport default defineConfig({\n plugins: [\n \u002F\u002F MUST come before vue()\n tanstackRouter({\n target: 'vue',\n autoCodeSplitting: true,\n }),\n vue(),\n vueJsx(), \u002F\u002F Required for JSX\u002FTSX route files\n ],\n})\n","ts",[268],{"type":64,"tag":73,"props":269,"children":270},{"__ignoreMap":201},[271,280,326,357,387,425,435,464,484,493,510,541,564,581,599,622,635],{"type":64,"tag":207,"props":272,"children":273},{"class":209,"line":210},[274],{"type":64,"tag":207,"props":275,"children":277},{"style":276},"--shiki-light:#90A4AE;--shiki-light-font-style:italic;--shiki-default:#546E7A;--shiki-default-font-style:italic;--shiki-dark:#676E95;--shiki-dark-font-style:italic",[278],{"type":70,"value":279},"\u002F\u002F vite.config.ts\n",{"type":64,"tag":207,"props":281,"children":282},{"class":209,"line":231},[283,289,295,301,306,311,316,321],{"type":64,"tag":207,"props":284,"children":286},{"style":285},"--shiki-light:#39ADB5;--shiki-light-font-style:italic;--shiki-default:#89DDFF;--shiki-default-font-style:italic;--shiki-dark:#89DDFF;--shiki-dark-font-style:italic",[287],{"type":70,"value":288},"import",{"type":64,"tag":207,"props":290,"children":292},{"style":291},"--shiki-light:#39ADB5;--shiki-default:#89DDFF;--shiki-dark:#89DDFF",[293],{"type":70,"value":294}," {",{"type":64,"tag":207,"props":296,"children":298},{"style":297},"--shiki-light:#90A4AE;--shiki-default:#EEFFFF;--shiki-dark:#BABED8",[299],{"type":70,"value":300}," defineConfig",{"type":64,"tag":207,"props":302,"children":303},{"style":291},[304],{"type":70,"value":305}," }",{"type":64,"tag":207,"props":307,"children":308},{"style":285},[309],{"type":70,"value":310}," from",{"type":64,"tag":207,"props":312,"children":313},{"style":291},[314],{"type":70,"value":315}," '",{"type":64,"tag":207,"props":317,"children":318},{"style":220},[319],{"type":70,"value":320},"vite",{"type":64,"tag":207,"props":322,"children":323},{"style":291},[324],{"type":70,"value":325},"'\n",{"type":64,"tag":207,"props":327,"children":329},{"class":209,"line":328},3,[330,334,339,344,348,353],{"type":64,"tag":207,"props":331,"children":332},{"style":285},[333],{"type":70,"value":288},{"type":64,"tag":207,"props":335,"children":336},{"style":297},[337],{"type":70,"value":338}," vue ",{"type":64,"tag":207,"props":340,"children":341},{"style":285},[342],{"type":70,"value":343},"from",{"type":64,"tag":207,"props":345,"children":346},{"style":291},[347],{"type":70,"value":315},{"type":64,"tag":207,"props":349,"children":350},{"style":220},[351],{"type":70,"value":352},"@vitejs\u002Fplugin-vue",{"type":64,"tag":207,"props":354,"children":355},{"style":291},[356],{"type":70,"value":325},{"type":64,"tag":207,"props":358,"children":360},{"class":209,"line":359},4,[361,365,370,374,378,383],{"type":64,"tag":207,"props":362,"children":363},{"style":285},[364],{"type":70,"value":288},{"type":64,"tag":207,"props":366,"children":367},{"style":297},[368],{"type":70,"value":369}," vueJsx ",{"type":64,"tag":207,"props":371,"children":372},{"style":285},[373],{"type":70,"value":343},{"type":64,"tag":207,"props":375,"children":376},{"style":291},[377],{"type":70,"value":315},{"type":64,"tag":207,"props":379,"children":380},{"style":220},[381],{"type":70,"value":382},"@vitejs\u002Fplugin-vue-jsx",{"type":64,"tag":207,"props":384,"children":385},{"style":291},[386],{"type":70,"value":325},{"type":64,"tag":207,"props":388,"children":390},{"class":209,"line":389},5,[391,395,399,404,408,412,416,421],{"type":64,"tag":207,"props":392,"children":393},{"style":285},[394],{"type":70,"value":288},{"type":64,"tag":207,"props":396,"children":397},{"style":291},[398],{"type":70,"value":294},{"type":64,"tag":207,"props":400,"children":401},{"style":297},[402],{"type":70,"value":403}," tanstackRouter",{"type":64,"tag":207,"props":405,"children":406},{"style":291},[407],{"type":70,"value":305},{"type":64,"tag":207,"props":409,"children":410},{"style":285},[411],{"type":70,"value":310},{"type":64,"tag":207,"props":413,"children":414},{"style":291},[415],{"type":70,"value":315},{"type":64,"tag":207,"props":417,"children":418},{"style":220},[419],{"type":70,"value":420},"@tanstack\u002Frouter-plugin\u002Fvite",{"type":64,"tag":207,"props":422,"children":423},{"style":291},[424],{"type":70,"value":325},{"type":64,"tag":207,"props":426,"children":428},{"class":209,"line":427},6,[429],{"type":64,"tag":207,"props":430,"children":432},{"emptyLinePlaceholder":431},true,[433],{"type":70,"value":434},"\n",{"type":64,"tag":207,"props":436,"children":438},{"class":209,"line":437},7,[439,444,449,454,459],{"type":64,"tag":207,"props":440,"children":441},{"style":285},[442],{"type":70,"value":443},"export",{"type":64,"tag":207,"props":445,"children":446},{"style":285},[447],{"type":70,"value":448}," default",{"type":64,"tag":207,"props":450,"children":452},{"style":451},"--shiki-light:#6182B8;--shiki-default:#82AAFF;--shiki-dark:#82AAFF",[453],{"type":70,"value":300},{"type":64,"tag":207,"props":455,"children":456},{"style":297},[457],{"type":70,"value":458},"(",{"type":64,"tag":207,"props":460,"children":461},{"style":291},[462],{"type":70,"value":463},"{\n",{"type":64,"tag":207,"props":465,"children":467},{"class":209,"line":466},8,[468,474,479],{"type":64,"tag":207,"props":469,"children":471},{"style":470},"--shiki-light:#E53935;--shiki-default:#F07178;--shiki-dark:#F07178",[472],{"type":70,"value":473}," plugins",{"type":64,"tag":207,"props":475,"children":476},{"style":291},[477],{"type":70,"value":478},":",{"type":64,"tag":207,"props":480,"children":481},{"style":297},[482],{"type":70,"value":483}," [\n",{"type":64,"tag":207,"props":485,"children":487},{"class":209,"line":486},9,[488],{"type":64,"tag":207,"props":489,"children":490},{"style":276},[491],{"type":70,"value":492}," \u002F\u002F MUST come before vue()\n",{"type":64,"tag":207,"props":494,"children":496},{"class":209,"line":495},10,[497,502,506],{"type":64,"tag":207,"props":498,"children":499},{"style":451},[500],{"type":70,"value":501}," tanstackRouter",{"type":64,"tag":207,"props":503,"children":504},{"style":297},[505],{"type":70,"value":458},{"type":64,"tag":207,"props":507,"children":508},{"style":291},[509],{"type":70,"value":463},{"type":64,"tag":207,"props":511,"children":513},{"class":209,"line":512},11,[514,519,523,527,531,536],{"type":64,"tag":207,"props":515,"children":516},{"style":470},[517],{"type":70,"value":518}," target",{"type":64,"tag":207,"props":520,"children":521},{"style":291},[522],{"type":70,"value":478},{"type":64,"tag":207,"props":524,"children":525},{"style":291},[526],{"type":70,"value":315},{"type":64,"tag":207,"props":528,"children":529},{"style":220},[530],{"type":70,"value":18},{"type":64,"tag":207,"props":532,"children":533},{"style":291},[534],{"type":70,"value":535},"'",{"type":64,"tag":207,"props":537,"children":538},{"style":291},[539],{"type":70,"value":540},",\n",{"type":64,"tag":207,"props":542,"children":544},{"class":209,"line":543},12,[545,550,554,560],{"type":64,"tag":207,"props":546,"children":547},{"style":470},[548],{"type":70,"value":549}," autoCodeSplitting",{"type":64,"tag":207,"props":551,"children":552},{"style":291},[553],{"type":70,"value":478},{"type":64,"tag":207,"props":555,"children":557},{"style":556},"--shiki-light:#FF5370;--shiki-default:#FF9CAC;--shiki-dark:#FF9CAC",[558],{"type":70,"value":559}," true",{"type":64,"tag":207,"props":561,"children":562},{"style":291},[563],{"type":70,"value":540},{"type":64,"tag":207,"props":565,"children":567},{"class":209,"line":566},13,[568,573,577],{"type":64,"tag":207,"props":569,"children":570},{"style":291},[571],{"type":70,"value":572}," }",{"type":64,"tag":207,"props":574,"children":575},{"style":297},[576],{"type":70,"value":80},{"type":64,"tag":207,"props":578,"children":579},{"style":291},[580],{"type":70,"value":540},{"type":64,"tag":207,"props":582,"children":584},{"class":209,"line":583},14,[585,590,595],{"type":64,"tag":207,"props":586,"children":587},{"style":451},[588],{"type":70,"value":589}," vue",{"type":64,"tag":207,"props":591,"children":592},{"style":297},[593],{"type":70,"value":594},"()",{"type":64,"tag":207,"props":596,"children":597},{"style":291},[598],{"type":70,"value":540},{"type":64,"tag":207,"props":600,"children":602},{"class":209,"line":601},15,[603,608,612,617],{"type":64,"tag":207,"props":604,"children":605},{"style":451},[606],{"type":70,"value":607}," vueJsx",{"type":64,"tag":207,"props":609,"children":610},{"style":297},[611],{"type":70,"value":594},{"type":64,"tag":207,"props":613,"children":614},{"style":291},[615],{"type":70,"value":616},",",{"type":64,"tag":207,"props":618,"children":619},{"style":276},[620],{"type":70,"value":621}," \u002F\u002F Required for JSX\u002FTSX route files\n",{"type":64,"tag":207,"props":623,"children":625},{"class":209,"line":624},16,[626,631],{"type":64,"tag":207,"props":627,"children":628},{"style":297},[629],{"type":70,"value":630}," ]",{"type":64,"tag":207,"props":632,"children":633},{"style":291},[634],{"type":70,"value":540},{"type":64,"tag":207,"props":636,"children":638},{"class":209,"line":637},17,[639,644],{"type":64,"tag":207,"props":640,"children":641},{"style":291},[642],{"type":70,"value":643},"}",{"type":64,"tag":207,"props":645,"children":646},{"style":297},[647],{"type":70,"value":648},")\n",{"type":64,"tag":189,"props":650,"children":652},{"id":651},"_3-create-root-route",[653],{"type":70,"value":654},"3. Create Root Route",{"type":64,"tag":196,"props":656,"children":660},{"className":657,"code":658,"language":659,"meta":201,"style":201},"language-tsx shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","\u002F\u002F src\u002Froutes\u002F__root.tsx\nimport { createRootRoute, Link, Outlet } from '@tanstack\u002Fvue-router'\n\nexport const Route = createRootRoute({\n component: RootLayout,\n})\n\nfunction RootLayout() {\n return (\n \u003C>\n \u003Cnav>\n \u003CLink to=\"\u002F\" activeProps={{ class: 'font-bold' }}>\n Home\n \u003C\u002FLink>\n \u003CLink to=\"\u002Fabout\" activeProps={{ class: 'font-bold' }}>\n About\n \u003C\u002FLink>\n \u003C\u002Fnav>\n \u003Chr \u002F>\n \u003COutlet \u002F>\n \u003C\u002F>\n )\n}\n","tsx",[661],{"type":64,"tag":73,"props":662,"children":663},{"__ignoreMap":201},[664,672,726,733,768,789,800,807,828,841,849,867,940,948,964,1028,1036,1051,1068,1086,1103,1112,1121],{"type":64,"tag":207,"props":665,"children":666},{"class":209,"line":210},[667],{"type":64,"tag":207,"props":668,"children":669},{"style":276},[670],{"type":70,"value":671},"\u002F\u002F src\u002Froutes\u002F__root.tsx\n",{"type":64,"tag":207,"props":673,"children":674},{"class":209,"line":231},[675,679,683,688,692,697,701,706,710,714,718,722],{"type":64,"tag":207,"props":676,"children":677},{"style":285},[678],{"type":70,"value":288},{"type":64,"tag":207,"props":680,"children":681},{"style":291},[682],{"type":70,"value":294},{"type":64,"tag":207,"props":684,"children":685},{"style":297},[686],{"type":70,"value":687}," createRootRoute",{"type":64,"tag":207,"props":689,"children":690},{"style":291},[691],{"type":70,"value":616},{"type":64,"tag":207,"props":693,"children":694},{"style":297},[695],{"type":70,"value":696}," Link",{"type":64,"tag":207,"props":698,"children":699},{"style":291},[700],{"type":70,"value":616},{"type":64,"tag":207,"props":702,"children":703},{"style":297},[704],{"type":70,"value":705}," Outlet",{"type":64,"tag":207,"props":707,"children":708},{"style":291},[709],{"type":70,"value":305},{"type":64,"tag":207,"props":711,"children":712},{"style":285},[713],{"type":70,"value":310},{"type":64,"tag":207,"props":715,"children":716},{"style":291},[717],{"type":70,"value":315},{"type":64,"tag":207,"props":719,"children":720},{"style":220},[721],{"type":70,"value":78},{"type":64,"tag":207,"props":723,"children":724},{"style":291},[725],{"type":70,"value":325},{"type":64,"tag":207,"props":727,"children":728},{"class":209,"line":328},[729],{"type":64,"tag":207,"props":730,"children":731},{"emptyLinePlaceholder":431},[732],{"type":70,"value":434},{"type":64,"tag":207,"props":734,"children":735},{"class":209,"line":359},[736,740,746,751,756,760,764],{"type":64,"tag":207,"props":737,"children":738},{"style":285},[739],{"type":70,"value":443},{"type":64,"tag":207,"props":741,"children":743},{"style":742},"--shiki-light:#9C3EDA;--shiki-default:#C792EA;--shiki-dark:#C792EA",[744],{"type":70,"value":745}," const",{"type":64,"tag":207,"props":747,"children":748},{"style":297},[749],{"type":70,"value":750}," Route ",{"type":64,"tag":207,"props":752,"children":753},{"style":291},[754],{"type":70,"value":755},"=",{"type":64,"tag":207,"props":757,"children":758},{"style":451},[759],{"type":70,"value":687},{"type":64,"tag":207,"props":761,"children":762},{"style":297},[763],{"type":70,"value":458},{"type":64,"tag":207,"props":765,"children":766},{"style":291},[767],{"type":70,"value":463},{"type":64,"tag":207,"props":769,"children":770},{"class":209,"line":389},[771,776,780,785],{"type":64,"tag":207,"props":772,"children":773},{"style":470},[774],{"type":70,"value":775}," component",{"type":64,"tag":207,"props":777,"children":778},{"style":291},[779],{"type":70,"value":478},{"type":64,"tag":207,"props":781,"children":782},{"style":297},[783],{"type":70,"value":784}," RootLayout",{"type":64,"tag":207,"props":786,"children":787},{"style":291},[788],{"type":70,"value":540},{"type":64,"tag":207,"props":790,"children":791},{"class":209,"line":427},[792,796],{"type":64,"tag":207,"props":793,"children":794},{"style":291},[795],{"type":70,"value":643},{"type":64,"tag":207,"props":797,"children":798},{"style":297},[799],{"type":70,"value":648},{"type":64,"tag":207,"props":801,"children":802},{"class":209,"line":437},[803],{"type":64,"tag":207,"props":804,"children":805},{"emptyLinePlaceholder":431},[806],{"type":70,"value":434},{"type":64,"tag":207,"props":808,"children":809},{"class":209,"line":466},[810,815,819,823],{"type":64,"tag":207,"props":811,"children":812},{"style":742},[813],{"type":70,"value":814},"function",{"type":64,"tag":207,"props":816,"children":817},{"style":451},[818],{"type":70,"value":784},{"type":64,"tag":207,"props":820,"children":821},{"style":291},[822],{"type":70,"value":594},{"type":64,"tag":207,"props":824,"children":825},{"style":291},[826],{"type":70,"value":827}," {\n",{"type":64,"tag":207,"props":829,"children":830},{"class":209,"line":486},[831,836],{"type":64,"tag":207,"props":832,"children":833},{"style":285},[834],{"type":70,"value":835}," return",{"type":64,"tag":207,"props":837,"children":838},{"style":470},[839],{"type":70,"value":840}," (\n",{"type":64,"tag":207,"props":842,"children":843},{"class":209,"line":495},[844],{"type":64,"tag":207,"props":845,"children":846},{"style":291},[847],{"type":70,"value":848}," \u003C>\n",{"type":64,"tag":207,"props":850,"children":851},{"class":209,"line":512},[852,857,862],{"type":64,"tag":207,"props":853,"children":854},{"style":291},[855],{"type":70,"value":856}," \u003C",{"type":64,"tag":207,"props":858,"children":859},{"style":470},[860],{"type":70,"value":861},"nav",{"type":64,"tag":207,"props":863,"children":864},{"style":291},[865],{"type":70,"value":866},">\n",{"type":64,"tag":207,"props":868,"children":869},{"class":209,"line":543},[870,875,880,885,889,894,899,903,908,913,918,922,926,931,935],{"type":64,"tag":207,"props":871,"children":872},{"style":291},[873],{"type":70,"value":874}," \u003C",{"type":64,"tag":207,"props":876,"children":877},{"style":214},[878],{"type":70,"value":879},"Link",{"type":64,"tag":207,"props":881,"children":882},{"style":742},[883],{"type":70,"value":884}," to",{"type":64,"tag":207,"props":886,"children":887},{"style":291},[888],{"type":70,"value":755},{"type":64,"tag":207,"props":890,"children":891},{"style":291},[892],{"type":70,"value":893},"\"",{"type":64,"tag":207,"props":895,"children":896},{"style":220},[897],{"type":70,"value":898},"\u002F",{"type":64,"tag":207,"props":900,"children":901},{"style":291},[902],{"type":70,"value":893},{"type":64,"tag":207,"props":904,"children":905},{"style":742},[906],{"type":70,"value":907}," activeProps",{"type":64,"tag":207,"props":909,"children":910},{"style":291},[911],{"type":70,"value":912},"={{",{"type":64,"tag":207,"props":914,"children":915},{"style":470},[916],{"type":70,"value":917}," class",{"type":64,"tag":207,"props":919,"children":920},{"style":291},[921],{"type":70,"value":478},{"type":64,"tag":207,"props":923,"children":924},{"style":291},[925],{"type":70,"value":315},{"type":64,"tag":207,"props":927,"children":928},{"style":220},[929],{"type":70,"value":930},"font-bold",{"type":64,"tag":207,"props":932,"children":933},{"style":291},[934],{"type":70,"value":535},{"type":64,"tag":207,"props":936,"children":937},{"style":291},[938],{"type":70,"value":939}," }}>\n",{"type":64,"tag":207,"props":941,"children":942},{"class":209,"line":566},[943],{"type":64,"tag":207,"props":944,"children":945},{"style":297},[946],{"type":70,"value":947}," Home\n",{"type":64,"tag":207,"props":949,"children":950},{"class":209,"line":583},[951,956,960],{"type":64,"tag":207,"props":952,"children":953},{"style":291},[954],{"type":70,"value":955}," \u003C\u002F",{"type":64,"tag":207,"props":957,"children":958},{"style":214},[959],{"type":70,"value":879},{"type":64,"tag":207,"props":961,"children":962},{"style":291},[963],{"type":70,"value":866},{"type":64,"tag":207,"props":965,"children":966},{"class":209,"line":601},[967,971,975,979,983,987,992,996,1000,1004,1008,1012,1016,1020,1024],{"type":64,"tag":207,"props":968,"children":969},{"style":291},[970],{"type":70,"value":874},{"type":64,"tag":207,"props":972,"children":973},{"style":214},[974],{"type":70,"value":879},{"type":64,"tag":207,"props":976,"children":977},{"style":742},[978],{"type":70,"value":884},{"type":64,"tag":207,"props":980,"children":981},{"style":291},[982],{"type":70,"value":755},{"type":64,"tag":207,"props":984,"children":985},{"style":291},[986],{"type":70,"value":893},{"type":64,"tag":207,"props":988,"children":989},{"style":220},[990],{"type":70,"value":991},"\u002Fabout",{"type":64,"tag":207,"props":993,"children":994},{"style":291},[995],{"type":70,"value":893},{"type":64,"tag":207,"props":997,"children":998},{"style":742},[999],{"type":70,"value":907},{"type":64,"tag":207,"props":1001,"children":1002},{"style":291},[1003],{"type":70,"value":912},{"type":64,"tag":207,"props":1005,"children":1006},{"style":470},[1007],{"type":70,"value":917},{"type":64,"tag":207,"props":1009,"children":1010},{"style":291},[1011],{"type":70,"value":478},{"type":64,"tag":207,"props":1013,"children":1014},{"style":291},[1015],{"type":70,"value":315},{"type":64,"tag":207,"props":1017,"children":1018},{"style":220},[1019],{"type":70,"value":930},{"type":64,"tag":207,"props":1021,"children":1022},{"style":291},[1023],{"type":70,"value":535},{"type":64,"tag":207,"props":1025,"children":1026},{"style":291},[1027],{"type":70,"value":939},{"type":64,"tag":207,"props":1029,"children":1030},{"class":209,"line":624},[1031],{"type":64,"tag":207,"props":1032,"children":1033},{"style":297},[1034],{"type":70,"value":1035}," About\n",{"type":64,"tag":207,"props":1037,"children":1038},{"class":209,"line":637},[1039,1043,1047],{"type":64,"tag":207,"props":1040,"children":1041},{"style":291},[1042],{"type":70,"value":955},{"type":64,"tag":207,"props":1044,"children":1045},{"style":214},[1046],{"type":70,"value":879},{"type":64,"tag":207,"props":1048,"children":1049},{"style":291},[1050],{"type":70,"value":866},{"type":64,"tag":207,"props":1052,"children":1054},{"class":209,"line":1053},18,[1055,1060,1064],{"type":64,"tag":207,"props":1056,"children":1057},{"style":291},[1058],{"type":70,"value":1059}," \u003C\u002F",{"type":64,"tag":207,"props":1061,"children":1062},{"style":470},[1063],{"type":70,"value":861},{"type":64,"tag":207,"props":1065,"children":1066},{"style":291},[1067],{"type":70,"value":866},{"type":64,"tag":207,"props":1069,"children":1071},{"class":209,"line":1070},19,[1072,1076,1081],{"type":64,"tag":207,"props":1073,"children":1074},{"style":291},[1075],{"type":70,"value":856},{"type":64,"tag":207,"props":1077,"children":1078},{"style":470},[1079],{"type":70,"value":1080},"hr",{"type":64,"tag":207,"props":1082,"children":1083},{"style":291},[1084],{"type":70,"value":1085}," \u002F>\n",{"type":64,"tag":207,"props":1087,"children":1089},{"class":209,"line":1088},20,[1090,1094,1099],{"type":64,"tag":207,"props":1091,"children":1092},{"style":291},[1093],{"type":70,"value":856},{"type":64,"tag":207,"props":1095,"children":1096},{"style":214},[1097],{"type":70,"value":1098},"Outlet",{"type":64,"tag":207,"props":1100,"children":1101},{"style":291},[1102],{"type":70,"value":1085},{"type":64,"tag":207,"props":1104,"children":1106},{"class":209,"line":1105},21,[1107],{"type":64,"tag":207,"props":1108,"children":1109},{"style":291},[1110],{"type":70,"value":1111}," \u003C\u002F>\n",{"type":64,"tag":207,"props":1113,"children":1115},{"class":209,"line":1114},22,[1116],{"type":64,"tag":207,"props":1117,"children":1118},{"style":470},[1119],{"type":70,"value":1120}," )\n",{"type":64,"tag":207,"props":1122,"children":1124},{"class":209,"line":1123},23,[1125],{"type":64,"tag":207,"props":1126,"children":1127},{"style":291},[1128],{"type":70,"value":1129},"}\n",{"type":64,"tag":189,"props":1131,"children":1133},{"id":1132},"_4-create-route-files",[1134],{"type":70,"value":1135},"4. Create Route Files",{"type":64,"tag":196,"props":1137,"children":1139},{"className":657,"code":1138,"language":659,"meta":201,"style":201},"\u002F\u002F src\u002Froutes\u002Findex.tsx\nimport { createFileRoute } from '@tanstack\u002Fvue-router'\n\nexport const Route = createFileRoute('\u002F')({\n component: HomePage,\n})\n\nfunction HomePage() {\n return \u003Ch1>Welcome Home\u003C\u002Fh1>\n}\n",[1140],{"type":64,"tag":73,"props":1141,"children":1142},{"__ignoreMap":201},[1143,1151,1187,1194,1242,1262,1273,1280,1299,1338],{"type":64,"tag":207,"props":1144,"children":1145},{"class":209,"line":210},[1146],{"type":64,"tag":207,"props":1147,"children":1148},{"style":276},[1149],{"type":70,"value":1150},"\u002F\u002F src\u002Froutes\u002Findex.tsx\n",{"type":64,"tag":207,"props":1152,"children":1153},{"class":209,"line":231},[1154,1158,1162,1167,1171,1175,1179,1183],{"type":64,"tag":207,"props":1155,"children":1156},{"style":285},[1157],{"type":70,"value":288},{"type":64,"tag":207,"props":1159,"children":1160},{"style":291},[1161],{"type":70,"value":294},{"type":64,"tag":207,"props":1163,"children":1164},{"style":297},[1165],{"type":70,"value":1166}," createFileRoute",{"type":64,"tag":207,"props":1168,"children":1169},{"style":291},[1170],{"type":70,"value":305},{"type":64,"tag":207,"props":1172,"children":1173},{"style":285},[1174],{"type":70,"value":310},{"type":64,"tag":207,"props":1176,"children":1177},{"style":291},[1178],{"type":70,"value":315},{"type":64,"tag":207,"props":1180,"children":1181},{"style":220},[1182],{"type":70,"value":78},{"type":64,"tag":207,"props":1184,"children":1185},{"style":291},[1186],{"type":70,"value":325},{"type":64,"tag":207,"props":1188,"children":1189},{"class":209,"line":328},[1190],{"type":64,"tag":207,"props":1191,"children":1192},{"emptyLinePlaceholder":431},[1193],{"type":70,"value":434},{"type":64,"tag":207,"props":1195,"children":1196},{"class":209,"line":359},[1197,1201,1205,1209,1213,1217,1221,1225,1229,1233,1238],{"type":64,"tag":207,"props":1198,"children":1199},{"style":285},[1200],{"type":70,"value":443},{"type":64,"tag":207,"props":1202,"children":1203},{"style":742},[1204],{"type":70,"value":745},{"type":64,"tag":207,"props":1206,"children":1207},{"style":297},[1208],{"type":70,"value":750},{"type":64,"tag":207,"props":1210,"children":1211},{"style":291},[1212],{"type":70,"value":755},{"type":64,"tag":207,"props":1214,"children":1215},{"style":451},[1216],{"type":70,"value":1166},{"type":64,"tag":207,"props":1218,"children":1219},{"style":297},[1220],{"type":70,"value":458},{"type":64,"tag":207,"props":1222,"children":1223},{"style":291},[1224],{"type":70,"value":535},{"type":64,"tag":207,"props":1226,"children":1227},{"style":220},[1228],{"type":70,"value":898},{"type":64,"tag":207,"props":1230,"children":1231},{"style":291},[1232],{"type":70,"value":535},{"type":64,"tag":207,"props":1234,"children":1235},{"style":297},[1236],{"type":70,"value":1237},")(",{"type":64,"tag":207,"props":1239,"children":1240},{"style":291},[1241],{"type":70,"value":463},{"type":64,"tag":207,"props":1243,"children":1244},{"class":209,"line":389},[1245,1249,1253,1258],{"type":64,"tag":207,"props":1246,"children":1247},{"style":470},[1248],{"type":70,"value":775},{"type":64,"tag":207,"props":1250,"children":1251},{"style":291},[1252],{"type":70,"value":478},{"type":64,"tag":207,"props":1254,"children":1255},{"style":297},[1256],{"type":70,"value":1257}," HomePage",{"type":64,"tag":207,"props":1259,"children":1260},{"style":291},[1261],{"type":70,"value":540},{"type":64,"tag":207,"props":1263,"children":1264},{"class":209,"line":427},[1265,1269],{"type":64,"tag":207,"props":1266,"children":1267},{"style":291},[1268],{"type":70,"value":643},{"type":64,"tag":207,"props":1270,"children":1271},{"style":297},[1272],{"type":70,"value":648},{"type":64,"tag":207,"props":1274,"children":1275},{"class":209,"line":437},[1276],{"type":64,"tag":207,"props":1277,"children":1278},{"emptyLinePlaceholder":431},[1279],{"type":70,"value":434},{"type":64,"tag":207,"props":1281,"children":1282},{"class":209,"line":466},[1283,1287,1291,1295],{"type":64,"tag":207,"props":1284,"children":1285},{"style":742},[1286],{"type":70,"value":814},{"type":64,"tag":207,"props":1288,"children":1289},{"style":451},[1290],{"type":70,"value":1257},{"type":64,"tag":207,"props":1292,"children":1293},{"style":291},[1294],{"type":70,"value":594},{"type":64,"tag":207,"props":1296,"children":1297},{"style":291},[1298],{"type":70,"value":827},{"type":64,"tag":207,"props":1300,"children":1301},{"class":209,"line":486},[1302,1306,1311,1315,1320,1325,1330,1334],{"type":64,"tag":207,"props":1303,"children":1304},{"style":285},[1305],{"type":70,"value":835},{"type":64,"tag":207,"props":1307,"children":1308},{"style":291},[1309],{"type":70,"value":1310}," \u003C",{"type":64,"tag":207,"props":1312,"children":1313},{"style":470},[1314],{"type":70,"value":65},{"type":64,"tag":207,"props":1316,"children":1317},{"style":291},[1318],{"type":70,"value":1319},">",{"type":64,"tag":207,"props":1321,"children":1322},{"style":297},[1323],{"type":70,"value":1324},"Welcome Home",{"type":64,"tag":207,"props":1326,"children":1327},{"style":291},[1328],{"type":70,"value":1329},"\u003C\u002F",{"type":64,"tag":207,"props":1331,"children":1332},{"style":470},[1333],{"type":70,"value":65},{"type":64,"tag":207,"props":1335,"children":1336},{"style":291},[1337],{"type":70,"value":866},{"type":64,"tag":207,"props":1339,"children":1340},{"class":209,"line":495},[1341],{"type":64,"tag":207,"props":1342,"children":1343},{"style":291},[1344],{"type":70,"value":1129},{"type":64,"tag":189,"props":1346,"children":1348},{"id":1347},"_5-create-router-instance-and-register-types",[1349],{"type":70,"value":1350},"5. Create Router Instance and Register Types",{"type":64,"tag":196,"props":1352,"children":1354},{"className":657,"code":1353,"language":659,"meta":201,"style":201},"\u002F\u002F src\u002Fmain.tsx\nimport { createApp } from 'vue'\nimport { RouterProvider, createRouter } from '@tanstack\u002Fvue-router'\nimport { routeTree } from '.\u002FrouteTree.gen'\n\nconst router = createRouter({ routeTree })\n\n\u002F\u002F REQUIRED — without this, Link\u002FuseNavigate\u002FuseSearch have no type safety\ndeclare module '@tanstack\u002Fvue-router' {\n interface Register {\n router: typeof router\n }\n}\n\nconst app = createApp(RouterProvider, { router })\napp.mount('#root')\n",[1355],{"type":64,"tag":73,"props":1356,"children":1357},{"__ignoreMap":201},[1358,1366,1402,1447,1484,1491,1534,1541,1549,1578,1595,1617,1625,1632,1639,1684],{"type":64,"tag":207,"props":1359,"children":1360},{"class":209,"line":210},[1361],{"type":64,"tag":207,"props":1362,"children":1363},{"style":276},[1364],{"type":70,"value":1365},"\u002F\u002F src\u002Fmain.tsx\n",{"type":64,"tag":207,"props":1367,"children":1368},{"class":209,"line":231},[1369,1373,1377,1382,1386,1390,1394,1398],{"type":64,"tag":207,"props":1370,"children":1371},{"style":285},[1372],{"type":70,"value":288},{"type":64,"tag":207,"props":1374,"children":1375},{"style":291},[1376],{"type":70,"value":294},{"type":64,"tag":207,"props":1378,"children":1379},{"style":297},[1380],{"type":70,"value":1381}," createApp",{"type":64,"tag":207,"props":1383,"children":1384},{"style":291},[1385],{"type":70,"value":305},{"type":64,"tag":207,"props":1387,"children":1388},{"style":285},[1389],{"type":70,"value":310},{"type":64,"tag":207,"props":1391,"children":1392},{"style":291},[1393],{"type":70,"value":315},{"type":64,"tag":207,"props":1395,"children":1396},{"style":220},[1397],{"type":70,"value":18},{"type":64,"tag":207,"props":1399,"children":1400},{"style":291},[1401],{"type":70,"value":325},{"type":64,"tag":207,"props":1403,"children":1404},{"class":209,"line":328},[1405,1409,1413,1418,1422,1427,1431,1435,1439,1443],{"type":64,"tag":207,"props":1406,"children":1407},{"style":285},[1408],{"type":70,"value":288},{"type":64,"tag":207,"props":1410,"children":1411},{"style":291},[1412],{"type":70,"value":294},{"type":64,"tag":207,"props":1414,"children":1415},{"style":297},[1416],{"type":70,"value":1417}," RouterProvider",{"type":64,"tag":207,"props":1419,"children":1420},{"style":291},[1421],{"type":70,"value":616},{"type":64,"tag":207,"props":1423,"children":1424},{"style":297},[1425],{"type":70,"value":1426}," createRouter",{"type":64,"tag":207,"props":1428,"children":1429},{"style":291},[1430],{"type":70,"value":305},{"type":64,"tag":207,"props":1432,"children":1433},{"style":285},[1434],{"type":70,"value":310},{"type":64,"tag":207,"props":1436,"children":1437},{"style":291},[1438],{"type":70,"value":315},{"type":64,"tag":207,"props":1440,"children":1441},{"style":220},[1442],{"type":70,"value":78},{"type":64,"tag":207,"props":1444,"children":1445},{"style":291},[1446],{"type":70,"value":325},{"type":64,"tag":207,"props":1448,"children":1449},{"class":209,"line":359},[1450,1454,1458,1463,1467,1471,1475,1480],{"type":64,"tag":207,"props":1451,"children":1452},{"style":285},[1453],{"type":70,"value":288},{"type":64,"tag":207,"props":1455,"children":1456},{"style":291},[1457],{"type":70,"value":294},{"type":64,"tag":207,"props":1459,"children":1460},{"style":297},[1461],{"type":70,"value":1462}," routeTree",{"type":64,"tag":207,"props":1464,"children":1465},{"style":291},[1466],{"type":70,"value":305},{"type":64,"tag":207,"props":1468,"children":1469},{"style":285},[1470],{"type":70,"value":310},{"type":64,"tag":207,"props":1472,"children":1473},{"style":291},[1474],{"type":70,"value":315},{"type":64,"tag":207,"props":1476,"children":1477},{"style":220},[1478],{"type":70,"value":1479},".\u002FrouteTree.gen",{"type":64,"tag":207,"props":1481,"children":1482},{"style":291},[1483],{"type":70,"value":325},{"type":64,"tag":207,"props":1485,"children":1486},{"class":209,"line":389},[1487],{"type":64,"tag":207,"props":1488,"children":1489},{"emptyLinePlaceholder":431},[1490],{"type":70,"value":434},{"type":64,"tag":207,"props":1492,"children":1493},{"class":209,"line":427},[1494,1499,1504,1508,1512,1516,1521,1526,1530],{"type":64,"tag":207,"props":1495,"children":1496},{"style":742},[1497],{"type":70,"value":1498},"const",{"type":64,"tag":207,"props":1500,"children":1501},{"style":297},[1502],{"type":70,"value":1503}," router ",{"type":64,"tag":207,"props":1505,"children":1506},{"style":291},[1507],{"type":70,"value":755},{"type":64,"tag":207,"props":1509,"children":1510},{"style":451},[1511],{"type":70,"value":1426},{"type":64,"tag":207,"props":1513,"children":1514},{"style":297},[1515],{"type":70,"value":458},{"type":64,"tag":207,"props":1517,"children":1518},{"style":291},[1519],{"type":70,"value":1520},"{",{"type":64,"tag":207,"props":1522,"children":1523},{"style":297},[1524],{"type":70,"value":1525}," routeTree ",{"type":64,"tag":207,"props":1527,"children":1528},{"style":291},[1529],{"type":70,"value":643},{"type":64,"tag":207,"props":1531,"children":1532},{"style":297},[1533],{"type":70,"value":648},{"type":64,"tag":207,"props":1535,"children":1536},{"class":209,"line":437},[1537],{"type":64,"tag":207,"props":1538,"children":1539},{"emptyLinePlaceholder":431},[1540],{"type":70,"value":434},{"type":64,"tag":207,"props":1542,"children":1543},{"class":209,"line":466},[1544],{"type":64,"tag":207,"props":1545,"children":1546},{"style":276},[1547],{"type":70,"value":1548},"\u002F\u002F REQUIRED — without this, Link\u002FuseNavigate\u002FuseSearch have no type safety\n",{"type":64,"tag":207,"props":1550,"children":1551},{"class":209,"line":486},[1552,1557,1562,1566,1570,1574],{"type":64,"tag":207,"props":1553,"children":1554},{"style":742},[1555],{"type":70,"value":1556},"declare",{"type":64,"tag":207,"props":1558,"children":1559},{"style":742},[1560],{"type":70,"value":1561}," module",{"type":64,"tag":207,"props":1563,"children":1564},{"style":291},[1565],{"type":70,"value":315},{"type":64,"tag":207,"props":1567,"children":1568},{"style":220},[1569],{"type":70,"value":78},{"type":64,"tag":207,"props":1571,"children":1572},{"style":291},[1573],{"type":70,"value":535},{"type":64,"tag":207,"props":1575,"children":1576},{"style":291},[1577],{"type":70,"value":827},{"type":64,"tag":207,"props":1579,"children":1580},{"class":209,"line":495},[1581,1586,1591],{"type":64,"tag":207,"props":1582,"children":1583},{"style":742},[1584],{"type":70,"value":1585}," interface",{"type":64,"tag":207,"props":1587,"children":1588},{"style":214},[1589],{"type":70,"value":1590}," Register",{"type":64,"tag":207,"props":1592,"children":1593},{"style":291},[1594],{"type":70,"value":827},{"type":64,"tag":207,"props":1596,"children":1597},{"class":209,"line":512},[1598,1603,1607,1612],{"type":64,"tag":207,"props":1599,"children":1600},{"style":470},[1601],{"type":70,"value":1602}," router",{"type":64,"tag":207,"props":1604,"children":1605},{"style":291},[1606],{"type":70,"value":478},{"type":64,"tag":207,"props":1608,"children":1609},{"style":291},[1610],{"type":70,"value":1611}," typeof",{"type":64,"tag":207,"props":1613,"children":1614},{"style":297},[1615],{"type":70,"value":1616}," router\n",{"type":64,"tag":207,"props":1618,"children":1619},{"class":209,"line":543},[1620],{"type":64,"tag":207,"props":1621,"children":1622},{"style":291},[1623],{"type":70,"value":1624}," }\n",{"type":64,"tag":207,"props":1626,"children":1627},{"class":209,"line":566},[1628],{"type":64,"tag":207,"props":1629,"children":1630},{"style":291},[1631],{"type":70,"value":1129},{"type":64,"tag":207,"props":1633,"children":1634},{"class":209,"line":583},[1635],{"type":64,"tag":207,"props":1636,"children":1637},{"emptyLinePlaceholder":431},[1638],{"type":70,"value":434},{"type":64,"tag":207,"props":1640,"children":1641},{"class":209,"line":601},[1642,1646,1651,1655,1659,1664,1668,1672,1676,1680],{"type":64,"tag":207,"props":1643,"children":1644},{"style":742},[1645],{"type":70,"value":1498},{"type":64,"tag":207,"props":1647,"children":1648},{"style":297},[1649],{"type":70,"value":1650}," app ",{"type":64,"tag":207,"props":1652,"children":1653},{"style":291},[1654],{"type":70,"value":755},{"type":64,"tag":207,"props":1656,"children":1657},{"style":451},[1658],{"type":70,"value":1381},{"type":64,"tag":207,"props":1660,"children":1661},{"style":297},[1662],{"type":70,"value":1663},"(RouterProvider",{"type":64,"tag":207,"props":1665,"children":1666},{"style":291},[1667],{"type":70,"value":616},{"type":64,"tag":207,"props":1669,"children":1670},{"style":291},[1671],{"type":70,"value":294},{"type":64,"tag":207,"props":1673,"children":1674},{"style":297},[1675],{"type":70,"value":1503},{"type":64,"tag":207,"props":1677,"children":1678},{"style":291},[1679],{"type":70,"value":643},{"type":64,"tag":207,"props":1681,"children":1682},{"style":297},[1683],{"type":70,"value":648},{"type":64,"tag":207,"props":1685,"children":1686},{"class":209,"line":624},[1687,1692,1697,1702,1706,1710,1715,1719],{"type":64,"tag":207,"props":1688,"children":1689},{"style":297},[1690],{"type":70,"value":1691},"app",{"type":64,"tag":207,"props":1693,"children":1694},{"style":291},[1695],{"type":70,"value":1696},".",{"type":64,"tag":207,"props":1698,"children":1699},{"style":451},[1700],{"type":70,"value":1701},"mount",{"type":64,"tag":207,"props":1703,"children":1704},{"style":297},[1705],{"type":70,"value":458},{"type":64,"tag":207,"props":1707,"children":1708},{"style":291},[1709],{"type":70,"value":535},{"type":64,"tag":207,"props":1711,"children":1712},{"style":220},[1713],{"type":70,"value":1714},"#root",{"type":64,"tag":207,"props":1716,"children":1717},{"style":291},[1718],{"type":70,"value":535},{"type":64,"tag":207,"props":1720,"children":1721},{"style":297},[1722],{"type":70,"value":648},{"type":64,"tag":182,"props":1724,"children":1726},{"id":1725},"composables-reference",[1727],{"type":70,"value":1728},"Composables Reference",{"type":64,"tag":82,"props":1730,"children":1731},{},[1732,1734,1739,1741,1746,1747,1752],{"type":70,"value":1733},"All composables imported from ",{"type":64,"tag":73,"props":1735,"children":1737},{"className":1736},[],[1738],{"type":70,"value":78},{"type":70,"value":1740},". Most return ",{"type":64,"tag":73,"props":1742,"children":1744},{"className":1743},[],[1745],{"type":70,"value":144},{"type":70,"value":146},{"type":64,"tag":73,"props":1748,"children":1750},{"className":1749},[],[1751],{"type":70,"value":152},{"type":70,"value":1753}," in script or auto-unwrap in templates.",{"type":64,"tag":189,"props":1755,"children":1757},{"id":1756},"userouter-returns-trouter-not-a-ref",[1758,1764,1766,1772],{"type":64,"tag":73,"props":1759,"children":1761},{"className":1760},[],[1762],{"type":70,"value":1763},"useRouter()",{"type":70,"value":1765}," — returns ",{"type":64,"tag":73,"props":1767,"children":1769},{"className":1768},[],[1770],{"type":70,"value":1771},"TRouter",{"type":70,"value":1773}," (NOT a Ref)",{"type":64,"tag":196,"props":1775,"children":1777},{"className":657,"code":1776,"language":659,"meta":201,"style":201},"import { useRouter } from '@tanstack\u002Fvue-router'\n\nconst router = useRouter()\nrouter.invalidate()\n",[1778],{"type":64,"tag":73,"props":1779,"children":1780},{"__ignoreMap":201},[1781,1817,1824,1848],{"type":64,"tag":207,"props":1782,"children":1783},{"class":209,"line":210},[1784,1788,1792,1797,1801,1805,1809,1813],{"type":64,"tag":207,"props":1785,"children":1786},{"style":285},[1787],{"type":70,"value":288},{"type":64,"tag":207,"props":1789,"children":1790},{"style":291},[1791],{"type":70,"value":294},{"type":64,"tag":207,"props":1793,"children":1794},{"style":297},[1795],{"type":70,"value":1796}," useRouter",{"type":64,"tag":207,"props":1798,"children":1799},{"style":291},[1800],{"type":70,"value":305},{"type":64,"tag":207,"props":1802,"children":1803},{"style":285},[1804],{"type":70,"value":310},{"type":64,"tag":207,"props":1806,"children":1807},{"style":291},[1808],{"type":70,"value":315},{"type":64,"tag":207,"props":1810,"children":1811},{"style":220},[1812],{"type":70,"value":78},{"type":64,"tag":207,"props":1814,"children":1815},{"style":291},[1816],{"type":70,"value":325},{"type":64,"tag":207,"props":1818,"children":1819},{"class":209,"line":231},[1820],{"type":64,"tag":207,"props":1821,"children":1822},{"emptyLinePlaceholder":431},[1823],{"type":70,"value":434},{"type":64,"tag":207,"props":1825,"children":1826},{"class":209,"line":328},[1827,1831,1835,1839,1843],{"type":64,"tag":207,"props":1828,"children":1829},{"style":742},[1830],{"type":70,"value":1498},{"type":64,"tag":207,"props":1832,"children":1833},{"style":297},[1834],{"type":70,"value":1503},{"type":64,"tag":207,"props":1836,"children":1837},{"style":291},[1838],{"type":70,"value":755},{"type":64,"tag":207,"props":1840,"children":1841},{"style":451},[1842],{"type":70,"value":1796},{"type":64,"tag":207,"props":1844,"children":1845},{"style":297},[1846],{"type":70,"value":1847},"()\n",{"type":64,"tag":207,"props":1849,"children":1850},{"class":209,"line":359},[1851,1855,1859,1864],{"type":64,"tag":207,"props":1852,"children":1853},{"style":297},[1854],{"type":70,"value":37},{"type":64,"tag":207,"props":1856,"children":1857},{"style":291},[1858],{"type":70,"value":1696},{"type":64,"tag":207,"props":1860,"children":1861},{"style":451},[1862],{"type":70,"value":1863},"invalidate",{"type":64,"tag":207,"props":1865,"children":1866},{"style":297},[1867],{"type":70,"value":1847},{"type":64,"tag":189,"props":1869,"children":1871},{"id":1870},"userouterstate-returns-reft",[1872,1878,1879],{"type":64,"tag":73,"props":1873,"children":1875},{"className":1874},[],[1876],{"type":70,"value":1877},"useRouterState()",{"type":70,"value":1765},{"type":64,"tag":73,"props":1880,"children":1882},{"className":1881},[],[1883],{"type":70,"value":144},{"type":64,"tag":82,"props":1885,"children":1886},{},[1887,1889,1895,1897,1903],{"type":70,"value":1888},"Subscribe to router state changes. Exposes the entire state and thus incurs\na performance cost. For matches or location favor ",{"type":64,"tag":73,"props":1890,"children":1892},{"className":1891},[],[1893],{"type":70,"value":1894},"useMatches",{"type":70,"value":1896}," and ",{"type":64,"tag":73,"props":1898,"children":1900},{"className":1899},[],[1901],{"type":70,"value":1902},"useLocation",{"type":70,"value":1696},{"type":64,"tag":196,"props":1905,"children":1907},{"className":657,"code":1906,"language":659,"meta":201,"style":201},"import { useRouterState } from '@tanstack\u002Fvue-router'\n\nconst isLoading = useRouterState({ select: (s) => s.isLoading })\n\u002F\u002F Access: isLoading.value\n",[1908],{"type":64,"tag":73,"props":1909,"children":1910},{"__ignoreMap":201},[1911,1947,1954,2033],{"type":64,"tag":207,"props":1912,"children":1913},{"class":209,"line":210},[1914,1918,1922,1927,1931,1935,1939,1943],{"type":64,"tag":207,"props":1915,"children":1916},{"style":285},[1917],{"type":70,"value":288},{"type":64,"tag":207,"props":1919,"children":1920},{"style":291},[1921],{"type":70,"value":294},{"type":64,"tag":207,"props":1923,"children":1924},{"style":297},[1925],{"type":70,"value":1926}," useRouterState",{"type":64,"tag":207,"props":1928,"children":1929},{"style":291},[1930],{"type":70,"value":305},{"type":64,"tag":207,"props":1932,"children":1933},{"style":285},[1934],{"type":70,"value":310},{"type":64,"tag":207,"props":1936,"children":1937},{"style":291},[1938],{"type":70,"value":315},{"type":64,"tag":207,"props":1940,"children":1941},{"style":220},[1942],{"type":70,"value":78},{"type":64,"tag":207,"props":1944,"children":1945},{"style":291},[1946],{"type":70,"value":325},{"type":64,"tag":207,"props":1948,"children":1949},{"class":209,"line":231},[1950],{"type":64,"tag":207,"props":1951,"children":1952},{"emptyLinePlaceholder":431},[1953],{"type":70,"value":434},{"type":64,"tag":207,"props":1955,"children":1956},{"class":209,"line":328},[1957,1961,1966,1970,1974,1978,1982,1987,1991,1996,2002,2006,2011,2016,2020,2025,2029],{"type":64,"tag":207,"props":1958,"children":1959},{"style":742},[1960],{"type":70,"value":1498},{"type":64,"tag":207,"props":1962,"children":1963},{"style":297},[1964],{"type":70,"value":1965}," isLoading ",{"type":64,"tag":207,"props":1967,"children":1968},{"style":291},[1969],{"type":70,"value":755},{"type":64,"tag":207,"props":1971,"children":1972},{"style":451},[1973],{"type":70,"value":1926},{"type":64,"tag":207,"props":1975,"children":1976},{"style":297},[1977],{"type":70,"value":458},{"type":64,"tag":207,"props":1979,"children":1980},{"style":291},[1981],{"type":70,"value":1520},{"type":64,"tag":207,"props":1983,"children":1984},{"style":451},[1985],{"type":70,"value":1986}," select",{"type":64,"tag":207,"props":1988,"children":1989},{"style":291},[1990],{"type":70,"value":478},{"type":64,"tag":207,"props":1992,"children":1993},{"style":291},[1994],{"type":70,"value":1995}," (",{"type":64,"tag":207,"props":1997,"children":1999},{"style":1998},"--shiki-light:#90A4AE;--shiki-light-font-style:italic;--shiki-default:#EEFFFF;--shiki-default-font-style:italic;--shiki-dark:#BABED8;--shiki-dark-font-style:italic",[2000],{"type":70,"value":2001},"s",{"type":64,"tag":207,"props":2003,"children":2004},{"style":291},[2005],{"type":70,"value":80},{"type":64,"tag":207,"props":2007,"children":2008},{"style":742},[2009],{"type":70,"value":2010}," =>",{"type":64,"tag":207,"props":2012,"children":2013},{"style":297},[2014],{"type":70,"value":2015}," s",{"type":64,"tag":207,"props":2017,"children":2018},{"style":291},[2019],{"type":70,"value":1696},{"type":64,"tag":207,"props":2021,"children":2022},{"style":297},[2023],{"type":70,"value":2024},"isLoading ",{"type":64,"tag":207,"props":2026,"children":2027},{"style":291},[2028],{"type":70,"value":643},{"type":64,"tag":207,"props":2030,"children":2031},{"style":297},[2032],{"type":70,"value":648},{"type":64,"tag":207,"props":2034,"children":2035},{"class":209,"line":359},[2036],{"type":64,"tag":207,"props":2037,"children":2038},{"style":276},[2039],{"type":70,"value":2040},"\u002F\u002F Access: isLoading.value\n",{"type":64,"tag":189,"props":2042,"children":2044},{"id":2043},"usenavigate-returns-a-function-not-a-ref",[2045,2051],{"type":64,"tag":73,"props":2046,"children":2048},{"className":2047},[],[2049],{"type":70,"value":2050},"useNavigate()",{"type":70,"value":2052}," — returns a function (NOT a Ref)",{"type":64,"tag":196,"props":2054,"children":2056},{"className":657,"code":2055,"language":659,"meta":201,"style":201},"import { useNavigate } from '@tanstack\u002Fvue-router'\n\nconst navigate = useNavigate()\n\nasync function handleSubmit() {\n await saveData()\n navigate({ to: '\u002Fposts\u002F$postId', params: { postId: '123' } })\n}\n",[2057],{"type":64,"tag":73,"props":2058,"children":2059},{"__ignoreMap":201},[2060,2096,2103,2127,2134,2160,2177,2265],{"type":64,"tag":207,"props":2061,"children":2062},{"class":209,"line":210},[2063,2067,2071,2076,2080,2084,2088,2092],{"type":64,"tag":207,"props":2064,"children":2065},{"style":285},[2066],{"type":70,"value":288},{"type":64,"tag":207,"props":2068,"children":2069},{"style":291},[2070],{"type":70,"value":294},{"type":64,"tag":207,"props":2072,"children":2073},{"style":297},[2074],{"type":70,"value":2075}," useNavigate",{"type":64,"tag":207,"props":2077,"children":2078},{"style":291},[2079],{"type":70,"value":305},{"type":64,"tag":207,"props":2081,"children":2082},{"style":285},[2083],{"type":70,"value":310},{"type":64,"tag":207,"props":2085,"children":2086},{"style":291},[2087],{"type":70,"value":315},{"type":64,"tag":207,"props":2089,"children":2090},{"style":220},[2091],{"type":70,"value":78},{"type":64,"tag":207,"props":2093,"children":2094},{"style":291},[2095],{"type":70,"value":325},{"type":64,"tag":207,"props":2097,"children":2098},{"class":209,"line":231},[2099],{"type":64,"tag":207,"props":2100,"children":2101},{"emptyLinePlaceholder":431},[2102],{"type":70,"value":434},{"type":64,"tag":207,"props":2104,"children":2105},{"class":209,"line":328},[2106,2110,2115,2119,2123],{"type":64,"tag":207,"props":2107,"children":2108},{"style":742},[2109],{"type":70,"value":1498},{"type":64,"tag":207,"props":2111,"children":2112},{"style":297},[2113],{"type":70,"value":2114}," navigate ",{"type":64,"tag":207,"props":2116,"children":2117},{"style":291},[2118],{"type":70,"value":755},{"type":64,"tag":207,"props":2120,"children":2121},{"style":451},[2122],{"type":70,"value":2075},{"type":64,"tag":207,"props":2124,"children":2125},{"style":297},[2126],{"type":70,"value":1847},{"type":64,"tag":207,"props":2128,"children":2129},{"class":209,"line":359},[2130],{"type":64,"tag":207,"props":2131,"children":2132},{"emptyLinePlaceholder":431},[2133],{"type":70,"value":434},{"type":64,"tag":207,"props":2135,"children":2136},{"class":209,"line":389},[2137,2142,2147,2152,2156],{"type":64,"tag":207,"props":2138,"children":2139},{"style":742},[2140],{"type":70,"value":2141},"async",{"type":64,"tag":207,"props":2143,"children":2144},{"style":742},[2145],{"type":70,"value":2146}," function",{"type":64,"tag":207,"props":2148,"children":2149},{"style":451},[2150],{"type":70,"value":2151}," handleSubmit",{"type":64,"tag":207,"props":2153,"children":2154},{"style":291},[2155],{"type":70,"value":594},{"type":64,"tag":207,"props":2157,"children":2158},{"style":291},[2159],{"type":70,"value":827},{"type":64,"tag":207,"props":2161,"children":2162},{"class":209,"line":427},[2163,2168,2173],{"type":64,"tag":207,"props":2164,"children":2165},{"style":285},[2166],{"type":70,"value":2167}," await",{"type":64,"tag":207,"props":2169,"children":2170},{"style":451},[2171],{"type":70,"value":2172}," saveData",{"type":64,"tag":207,"props":2174,"children":2175},{"style":470},[2176],{"type":70,"value":1847},{"type":64,"tag":207,"props":2178,"children":2179},{"class":209,"line":437},[2180,2185,2189,2193,2197,2201,2205,2210,2214,2218,2223,2227,2231,2236,2240,2244,2249,2253,2257,2261],{"type":64,"tag":207,"props":2181,"children":2182},{"style":451},[2183],{"type":70,"value":2184}," navigate",{"type":64,"tag":207,"props":2186,"children":2187},{"style":470},[2188],{"type":70,"value":458},{"type":64,"tag":207,"props":2190,"children":2191},{"style":291},[2192],{"type":70,"value":1520},{"type":64,"tag":207,"props":2194,"children":2195},{"style":470},[2196],{"type":70,"value":884},{"type":64,"tag":207,"props":2198,"children":2199},{"style":291},[2200],{"type":70,"value":478},{"type":64,"tag":207,"props":2202,"children":2203},{"style":291},[2204],{"type":70,"value":315},{"type":64,"tag":207,"props":2206,"children":2207},{"style":220},[2208],{"type":70,"value":2209},"\u002Fposts\u002F$postId",{"type":64,"tag":207,"props":2211,"children":2212},{"style":291},[2213],{"type":70,"value":535},{"type":64,"tag":207,"props":2215,"children":2216},{"style":291},[2217],{"type":70,"value":616},{"type":64,"tag":207,"props":2219,"children":2220},{"style":470},[2221],{"type":70,"value":2222}," params",{"type":64,"tag":207,"props":2224,"children":2225},{"style":291},[2226],{"type":70,"value":478},{"type":64,"tag":207,"props":2228,"children":2229},{"style":291},[2230],{"type":70,"value":294},{"type":64,"tag":207,"props":2232,"children":2233},{"style":470},[2234],{"type":70,"value":2235}," postId",{"type":64,"tag":207,"props":2237,"children":2238},{"style":291},[2239],{"type":70,"value":478},{"type":64,"tag":207,"props":2241,"children":2242},{"style":291},[2243],{"type":70,"value":315},{"type":64,"tag":207,"props":2245,"children":2246},{"style":220},[2247],{"type":70,"value":2248},"123",{"type":64,"tag":207,"props":2250,"children":2251},{"style":291},[2252],{"type":70,"value":535},{"type":64,"tag":207,"props":2254,"children":2255},{"style":291},[2256],{"type":70,"value":305},{"type":64,"tag":207,"props":2258,"children":2259},{"style":291},[2260],{"type":70,"value":305},{"type":64,"tag":207,"props":2262,"children":2263},{"style":470},[2264],{"type":70,"value":648},{"type":64,"tag":207,"props":2266,"children":2267},{"class":209,"line":466},[2268],{"type":64,"tag":207,"props":2269,"children":2270},{"style":291},[2271],{"type":70,"value":1129},{"type":64,"tag":189,"props":2273,"children":2275},{"id":2274},"usesearch-from-returns-reft",[2276,2282,2283],{"type":64,"tag":73,"props":2277,"children":2279},{"className":2278},[],[2280],{"type":70,"value":2281},"useSearch({ from })",{"type":70,"value":1765},{"type":64,"tag":73,"props":2284,"children":2286},{"className":2285},[],[2287],{"type":70,"value":144},{"type":64,"tag":196,"props":2289,"children":2291},{"className":657,"code":2290,"language":659,"meta":201,"style":201},"import { useSearch } from '@tanstack\u002Fvue-router'\n\nconst search = useSearch({ from: '\u002Fproducts' })\n\u002F\u002F Access: search.value.page\n",[2292],{"type":64,"tag":73,"props":2293,"children":2294},{"__ignoreMap":201},[2295,2331,2338,2395],{"type":64,"tag":207,"props":2296,"children":2297},{"class":209,"line":210},[2298,2302,2306,2311,2315,2319,2323,2327],{"type":64,"tag":207,"props":2299,"children":2300},{"style":285},[2301],{"type":70,"value":288},{"type":64,"tag":207,"props":2303,"children":2304},{"style":291},[2305],{"type":70,"value":294},{"type":64,"tag":207,"props":2307,"children":2308},{"style":297},[2309],{"type":70,"value":2310}," useSearch",{"type":64,"tag":207,"props":2312,"children":2313},{"style":291},[2314],{"type":70,"value":305},{"type":64,"tag":207,"props":2316,"children":2317},{"style":285},[2318],{"type":70,"value":310},{"type":64,"tag":207,"props":2320,"children":2321},{"style":291},[2322],{"type":70,"value":315},{"type":64,"tag":207,"props":2324,"children":2325},{"style":220},[2326],{"type":70,"value":78},{"type":64,"tag":207,"props":2328,"children":2329},{"style":291},[2330],{"type":70,"value":325},{"type":64,"tag":207,"props":2332,"children":2333},{"class":209,"line":231},[2334],{"type":64,"tag":207,"props":2335,"children":2336},{"emptyLinePlaceholder":431},[2337],{"type":70,"value":434},{"type":64,"tag":207,"props":2339,"children":2340},{"class":209,"line":328},[2341,2345,2350,2354,2358,2362,2366,2370,2374,2378,2383,2387,2391],{"type":64,"tag":207,"props":2342,"children":2343},{"style":742},[2344],{"type":70,"value":1498},{"type":64,"tag":207,"props":2346,"children":2347},{"style":297},[2348],{"type":70,"value":2349}," search ",{"type":64,"tag":207,"props":2351,"children":2352},{"style":291},[2353],{"type":70,"value":755},{"type":64,"tag":207,"props":2355,"children":2356},{"style":451},[2357],{"type":70,"value":2310},{"type":64,"tag":207,"props":2359,"children":2360},{"style":297},[2361],{"type":70,"value":458},{"type":64,"tag":207,"props":2363,"children":2364},{"style":291},[2365],{"type":70,"value":1520},{"type":64,"tag":207,"props":2367,"children":2368},{"style":470},[2369],{"type":70,"value":310},{"type":64,"tag":207,"props":2371,"children":2372},{"style":291},[2373],{"type":70,"value":478},{"type":64,"tag":207,"props":2375,"children":2376},{"style":291},[2377],{"type":70,"value":315},{"type":64,"tag":207,"props":2379,"children":2380},{"style":220},[2381],{"type":70,"value":2382},"\u002Fproducts",{"type":64,"tag":207,"props":2384,"children":2385},{"style":291},[2386],{"type":70,"value":535},{"type":64,"tag":207,"props":2388,"children":2389},{"style":291},[2390],{"type":70,"value":305},{"type":64,"tag":207,"props":2392,"children":2393},{"style":297},[2394],{"type":70,"value":648},{"type":64,"tag":207,"props":2396,"children":2397},{"class":209,"line":359},[2398],{"type":64,"tag":207,"props":2399,"children":2400},{"style":276},[2401],{"type":70,"value":2402},"\u002F\u002F Access: search.value.page\n",{"type":64,"tag":189,"props":2404,"children":2406},{"id":2405},"useparams-from-returns-reft",[2407,2413,2414],{"type":64,"tag":73,"props":2408,"children":2410},{"className":2409},[],[2411],{"type":70,"value":2412},"useParams({ from })",{"type":70,"value":1765},{"type":64,"tag":73,"props":2415,"children":2417},{"className":2416},[],[2418],{"type":70,"value":144},{"type":64,"tag":196,"props":2420,"children":2422},{"className":657,"code":2421,"language":659,"meta":201,"style":201},"import { useParams } from '@tanstack\u002Fvue-router'\n\nconst params = useParams({ from: '\u002Fposts\u002F$postId' })\n\u002F\u002F Access: params.value.postId\n",[2423],{"type":64,"tag":73,"props":2424,"children":2425},{"__ignoreMap":201},[2426,2462,2469,2525],{"type":64,"tag":207,"props":2427,"children":2428},{"class":209,"line":210},[2429,2433,2437,2442,2446,2450,2454,2458],{"type":64,"tag":207,"props":2430,"children":2431},{"style":285},[2432],{"type":70,"value":288},{"type":64,"tag":207,"props":2434,"children":2435},{"style":291},[2436],{"type":70,"value":294},{"type":64,"tag":207,"props":2438,"children":2439},{"style":297},[2440],{"type":70,"value":2441}," useParams",{"type":64,"tag":207,"props":2443,"children":2444},{"style":291},[2445],{"type":70,"value":305},{"type":64,"tag":207,"props":2447,"children":2448},{"style":285},[2449],{"type":70,"value":310},{"type":64,"tag":207,"props":2451,"children":2452},{"style":291},[2453],{"type":70,"value":315},{"type":64,"tag":207,"props":2455,"children":2456},{"style":220},[2457],{"type":70,"value":78},{"type":64,"tag":207,"props":2459,"children":2460},{"style":291},[2461],{"type":70,"value":325},{"type":64,"tag":207,"props":2463,"children":2464},{"class":209,"line":231},[2465],{"type":64,"tag":207,"props":2466,"children":2467},{"emptyLinePlaceholder":431},[2468],{"type":70,"value":434},{"type":64,"tag":207,"props":2470,"children":2471},{"class":209,"line":328},[2472,2476,2481,2485,2489,2493,2497,2501,2505,2509,2513,2517,2521],{"type":64,"tag":207,"props":2473,"children":2474},{"style":742},[2475],{"type":70,"value":1498},{"type":64,"tag":207,"props":2477,"children":2478},{"style":297},[2479],{"type":70,"value":2480}," params ",{"type":64,"tag":207,"props":2482,"children":2483},{"style":291},[2484],{"type":70,"value":755},{"type":64,"tag":207,"props":2486,"children":2487},{"style":451},[2488],{"type":70,"value":2441},{"type":64,"tag":207,"props":2490,"children":2491},{"style":297},[2492],{"type":70,"value":458},{"type":64,"tag":207,"props":2494,"children":2495},{"style":291},[2496],{"type":70,"value":1520},{"type":64,"tag":207,"props":2498,"children":2499},{"style":470},[2500],{"type":70,"value":310},{"type":64,"tag":207,"props":2502,"children":2503},{"style":291},[2504],{"type":70,"value":478},{"type":64,"tag":207,"props":2506,"children":2507},{"style":291},[2508],{"type":70,"value":315},{"type":64,"tag":207,"props":2510,"children":2511},{"style":220},[2512],{"type":70,"value":2209},{"type":64,"tag":207,"props":2514,"children":2515},{"style":291},[2516],{"type":70,"value":535},{"type":64,"tag":207,"props":2518,"children":2519},{"style":291},[2520],{"type":70,"value":305},{"type":64,"tag":207,"props":2522,"children":2523},{"style":297},[2524],{"type":70,"value":648},{"type":64,"tag":207,"props":2526,"children":2527},{"class":209,"line":359},[2528],{"type":64,"tag":207,"props":2529,"children":2530},{"style":276},[2531],{"type":70,"value":2532},"\u002F\u002F Access: params.value.postId\n",{"type":64,"tag":189,"props":2534,"children":2536},{"id":2535},"useloaderdata-from-returns-reft",[2537,2543,2544],{"type":64,"tag":73,"props":2538,"children":2540},{"className":2539},[],[2541],{"type":70,"value":2542},"useLoaderData({ from })",{"type":70,"value":1765},{"type":64,"tag":73,"props":2545,"children":2547},{"className":2546},[],[2548],{"type":70,"value":144},{"type":64,"tag":196,"props":2550,"children":2552},{"className":657,"code":2551,"language":659,"meta":201,"style":201},"import { useLoaderData } from '@tanstack\u002Fvue-router'\n\nconst data = useLoaderData({ from: '\u002Fposts\u002F$postId' })\n\u002F\u002F Access: data.value.post.content\n",[2553],{"type":64,"tag":73,"props":2554,"children":2555},{"__ignoreMap":201},[2556,2592,2599,2655],{"type":64,"tag":207,"props":2557,"children":2558},{"class":209,"line":210},[2559,2563,2567,2572,2576,2580,2584,2588],{"type":64,"tag":207,"props":2560,"children":2561},{"style":285},[2562],{"type":70,"value":288},{"type":64,"tag":207,"props":2564,"children":2565},{"style":291},[2566],{"type":70,"value":294},{"type":64,"tag":207,"props":2568,"children":2569},{"style":297},[2570],{"type":70,"value":2571}," useLoaderData",{"type":64,"tag":207,"props":2573,"children":2574},{"style":291},[2575],{"type":70,"value":305},{"type":64,"tag":207,"props":2577,"children":2578},{"style":285},[2579],{"type":70,"value":310},{"type":64,"tag":207,"props":2581,"children":2582},{"style":291},[2583],{"type":70,"value":315},{"type":64,"tag":207,"props":2585,"children":2586},{"style":220},[2587],{"type":70,"value":78},{"type":64,"tag":207,"props":2589,"children":2590},{"style":291},[2591],{"type":70,"value":325},{"type":64,"tag":207,"props":2593,"children":2594},{"class":209,"line":231},[2595],{"type":64,"tag":207,"props":2596,"children":2597},{"emptyLinePlaceholder":431},[2598],{"type":70,"value":434},{"type":64,"tag":207,"props":2600,"children":2601},{"class":209,"line":328},[2602,2606,2611,2615,2619,2623,2627,2631,2635,2639,2643,2647,2651],{"type":64,"tag":207,"props":2603,"children":2604},{"style":742},[2605],{"type":70,"value":1498},{"type":64,"tag":207,"props":2607,"children":2608},{"style":297},[2609],{"type":70,"value":2610}," data ",{"type":64,"tag":207,"props":2612,"children":2613},{"style":291},[2614],{"type":70,"value":755},{"type":64,"tag":207,"props":2616,"children":2617},{"style":451},[2618],{"type":70,"value":2571},{"type":64,"tag":207,"props":2620,"children":2621},{"style":297},[2622],{"type":70,"value":458},{"type":64,"tag":207,"props":2624,"children":2625},{"style":291},[2626],{"type":70,"value":1520},{"type":64,"tag":207,"props":2628,"children":2629},{"style":470},[2630],{"type":70,"value":310},{"type":64,"tag":207,"props":2632,"children":2633},{"style":291},[2634],{"type":70,"value":478},{"type":64,"tag":207,"props":2636,"children":2637},{"style":291},[2638],{"type":70,"value":315},{"type":64,"tag":207,"props":2640,"children":2641},{"style":220},[2642],{"type":70,"value":2209},{"type":64,"tag":207,"props":2644,"children":2645},{"style":291},[2646],{"type":70,"value":535},{"type":64,"tag":207,"props":2648,"children":2649},{"style":291},[2650],{"type":70,"value":305},{"type":64,"tag":207,"props":2652,"children":2653},{"style":297},[2654],{"type":70,"value":648},{"type":64,"tag":207,"props":2656,"children":2657},{"class":209,"line":359},[2658],{"type":64,"tag":207,"props":2659,"children":2660},{"style":276},[2661],{"type":70,"value":2662},"\u002F\u002F Access: data.value.post.content\n",{"type":64,"tag":189,"props":2664,"children":2666},{"id":2665},"usematch-from-returns-reft",[2667,2673,2674],{"type":64,"tag":73,"props":2668,"children":2670},{"className":2669},[],[2671],{"type":70,"value":2672},"useMatch({ from })",{"type":70,"value":1765},{"type":64,"tag":73,"props":2675,"children":2677},{"className":2676},[],[2678],{"type":70,"value":144},{"type":64,"tag":196,"props":2680,"children":2682},{"className":657,"code":2681,"language":659,"meta":201,"style":201},"import { useMatch } from '@tanstack\u002Fvue-router'\n\nconst match = useMatch({ from: '\u002Fposts\u002F$postId' })\n\u002F\u002F Access: match.value.loaderData.post.title\n",[2683],{"type":64,"tag":73,"props":2684,"children":2685},{"__ignoreMap":201},[2686,2722,2729,2785],{"type":64,"tag":207,"props":2687,"children":2688},{"class":209,"line":210},[2689,2693,2697,2702,2706,2710,2714,2718],{"type":64,"tag":207,"props":2690,"children":2691},{"style":285},[2692],{"type":70,"value":288},{"type":64,"tag":207,"props":2694,"children":2695},{"style":291},[2696],{"type":70,"value":294},{"type":64,"tag":207,"props":2698,"children":2699},{"style":297},[2700],{"type":70,"value":2701}," useMatch",{"type":64,"tag":207,"props":2703,"children":2704},{"style":291},[2705],{"type":70,"value":305},{"type":64,"tag":207,"props":2707,"children":2708},{"style":285},[2709],{"type":70,"value":310},{"type":64,"tag":207,"props":2711,"children":2712},{"style":291},[2713],{"type":70,"value":315},{"type":64,"tag":207,"props":2715,"children":2716},{"style":220},[2717],{"type":70,"value":78},{"type":64,"tag":207,"props":2719,"children":2720},{"style":291},[2721],{"type":70,"value":325},{"type":64,"tag":207,"props":2723,"children":2724},{"class":209,"line":231},[2725],{"type":64,"tag":207,"props":2726,"children":2727},{"emptyLinePlaceholder":431},[2728],{"type":70,"value":434},{"type":64,"tag":207,"props":2730,"children":2731},{"class":209,"line":328},[2732,2736,2741,2745,2749,2753,2757,2761,2765,2769,2773,2777,2781],{"type":64,"tag":207,"props":2733,"children":2734},{"style":742},[2735],{"type":70,"value":1498},{"type":64,"tag":207,"props":2737,"children":2738},{"style":297},[2739],{"type":70,"value":2740}," match ",{"type":64,"tag":207,"props":2742,"children":2743},{"style":291},[2744],{"type":70,"value":755},{"type":64,"tag":207,"props":2746,"children":2747},{"style":451},[2748],{"type":70,"value":2701},{"type":64,"tag":207,"props":2750,"children":2751},{"style":297},[2752],{"type":70,"value":458},{"type":64,"tag":207,"props":2754,"children":2755},{"style":291},[2756],{"type":70,"value":1520},{"type":64,"tag":207,"props":2758,"children":2759},{"style":470},[2760],{"type":70,"value":310},{"type":64,"tag":207,"props":2762,"children":2763},{"style":291},[2764],{"type":70,"value":478},{"type":64,"tag":207,"props":2766,"children":2767},{"style":291},[2768],{"type":70,"value":315},{"type":64,"tag":207,"props":2770,"children":2771},{"style":220},[2772],{"type":70,"value":2209},{"type":64,"tag":207,"props":2774,"children":2775},{"style":291},[2776],{"type":70,"value":535},{"type":64,"tag":207,"props":2778,"children":2779},{"style":291},[2780],{"type":70,"value":305},{"type":64,"tag":207,"props":2782,"children":2783},{"style":297},[2784],{"type":70,"value":648},{"type":64,"tag":207,"props":2786,"children":2787},{"class":209,"line":359},[2788],{"type":64,"tag":207,"props":2789,"children":2790},{"style":276},[2791],{"type":70,"value":2792},"\u002F\u002F Access: match.value.loaderData.post.title\n",{"type":64,"tag":189,"props":2794,"children":2796},{"id":2795},"other-composables",[2797],{"type":70,"value":2798},"Other Composables",{"type":64,"tag":2800,"props":2801,"children":2802},"ul",{},[2803,2826,2852,2866,2885,2904,2924,2943],{"type":64,"tag":2804,"props":2805,"children":2806},"li",{},[2807,2816,2818,2824],{"type":64,"tag":108,"props":2808,"children":2809},{},[2810],{"type":64,"tag":73,"props":2811,"children":2813},{"className":2812},[],[2814],{"type":70,"value":2815},"useMatches()",{"type":70,"value":2817}," — ",{"type":64,"tag":73,"props":2819,"children":2821},{"className":2820},[],[2822],{"type":70,"value":2823},"Ref\u003CArray\u003CMatch>>",{"type":70,"value":2825},", all active route matches",{"type":64,"tag":2804,"props":2827,"children":2828},{},[2829,2838,2839,2844,2846],{"type":64,"tag":108,"props":2830,"children":2831},{},[2832],{"type":64,"tag":73,"props":2833,"children":2835},{"className":2834},[],[2836],{"type":70,"value":2837},"useRouteContext({ from })",{"type":70,"value":2817},{"type":64,"tag":73,"props":2840,"children":2842},{"className":2841},[],[2843],{"type":70,"value":144},{"type":70,"value":2845},", context from ",{"type":64,"tag":73,"props":2847,"children":2849},{"className":2848},[],[2850],{"type":70,"value":2851},"beforeLoad",{"type":64,"tag":2804,"props":2853,"children":2854},{},[2855,2864],{"type":64,"tag":108,"props":2856,"children":2857},{},[2858],{"type":64,"tag":73,"props":2859,"children":2861},{"className":2860},[],[2862],{"type":70,"value":2863},"useBlocker({ shouldBlockFn })",{"type":70,"value":2865}," — blocks navigation for unsaved changes",{"type":64,"tag":2804,"props":2867,"children":2868},{},[2869,2878,2879],{"type":64,"tag":108,"props":2870,"children":2871},{},[2872],{"type":64,"tag":73,"props":2873,"children":2875},{"className":2874},[],[2876],{"type":70,"value":2877},"useCanGoBack()",{"type":70,"value":2817},{"type":64,"tag":73,"props":2880,"children":2882},{"className":2881},[],[2883],{"type":70,"value":2884},"Ref\u003Cboolean>",{"type":64,"tag":2804,"props":2886,"children":2887},{},[2888,2897,2898],{"type":64,"tag":108,"props":2889,"children":2890},{},[2891],{"type":64,"tag":73,"props":2892,"children":2894},{"className":2893},[],[2895],{"type":70,"value":2896},"useLocation()",{"type":70,"value":2817},{"type":64,"tag":73,"props":2899,"children":2901},{"className":2900},[],[2902],{"type":70,"value":2903},"Ref\u003CParsedLocation>",{"type":64,"tag":2804,"props":2905,"children":2906},{},[2907,2916,2917,2922],{"type":64,"tag":108,"props":2908,"children":2909},{},[2910],{"type":64,"tag":73,"props":2911,"children":2913},{"className":2912},[],[2914],{"type":70,"value":2915},"useLoaderDeps({ from })",{"type":70,"value":2817},{"type":64,"tag":73,"props":2918,"children":2920},{"className":2919},[],[2921],{"type":70,"value":144},{"type":70,"value":2923},", loader dependency values",{"type":64,"tag":2804,"props":2925,"children":2926},{},[2927,2936,2937],{"type":64,"tag":108,"props":2928,"children":2929},{},[2930],{"type":64,"tag":73,"props":2931,"children":2933},{"className":2932},[],[2934],{"type":70,"value":2935},"useLinkProps()",{"type":70,"value":1765},{"type":64,"tag":73,"props":2938,"children":2940},{"className":2939},[],[2941],{"type":70,"value":2942},"LinkHTMLAttributes",{"type":64,"tag":2804,"props":2944,"children":2945},{},[2946,2955,2957],{"type":64,"tag":108,"props":2947,"children":2948},{},[2949],{"type":64,"tag":73,"props":2950,"children":2952},{"className":2951},[],[2953],{"type":70,"value":2954},"useMatchRoute()",{"type":70,"value":2956}," — returns a function; calling it returns ",{"type":64,"tag":73,"props":2958,"children":2960},{"className":2959},[],[2961],{"type":70,"value":2962},"Ref\u003Cfalse | Params>",{"type":64,"tag":182,"props":2964,"children":2966},{"id":2965},"components-reference",[2967],{"type":70,"value":2968},"Components Reference",{"type":64,"tag":189,"props":2970,"children":2972},{"id":2971},"routerprovider",[2973],{"type":64,"tag":73,"props":2974,"children":2976},{"className":2975},[],[2977],{"type":70,"value":2978},"RouterProvider",{"type":64,"tag":196,"props":2980,"children":2982},{"className":657,"code":2981,"language":659,"meta":201,"style":201},"import { RouterProvider } from '@tanstack\u002Fvue-router'\n\u002F\u002F In createApp or template\n\u003CRouterProvider :router=\"router\" \u002F>\n",[2983],{"type":64,"tag":73,"props":2984,"children":2985},{"__ignoreMap":201},[2986,3021,3029],{"type":64,"tag":207,"props":2987,"children":2988},{"class":209,"line":210},[2989,2993,2997,3001,3005,3009,3013,3017],{"type":64,"tag":207,"props":2990,"children":2991},{"style":285},[2992],{"type":70,"value":288},{"type":64,"tag":207,"props":2994,"children":2995},{"style":291},[2996],{"type":70,"value":294},{"type":64,"tag":207,"props":2998,"children":2999},{"style":297},[3000],{"type":70,"value":1417},{"type":64,"tag":207,"props":3002,"children":3003},{"style":291},[3004],{"type":70,"value":305},{"type":64,"tag":207,"props":3006,"children":3007},{"style":285},[3008],{"type":70,"value":310},{"type":64,"tag":207,"props":3010,"children":3011},{"style":291},[3012],{"type":70,"value":315},{"type":64,"tag":207,"props":3014,"children":3015},{"style":220},[3016],{"type":70,"value":78},{"type":64,"tag":207,"props":3018,"children":3019},{"style":291},[3020],{"type":70,"value":325},{"type":64,"tag":207,"props":3022,"children":3023},{"class":209,"line":231},[3024],{"type":64,"tag":207,"props":3025,"children":3026},{"style":276},[3027],{"type":70,"value":3028},"\u002F\u002F In createApp or template\n",{"type":64,"tag":207,"props":3030,"children":3031},{"class":209,"line":328},[3032,3037,3041],{"type":64,"tag":207,"props":3033,"children":3034},{"style":291},[3035],{"type":70,"value":3036},"\u003C",{"type":64,"tag":207,"props":3038,"children":3039},{"style":214},[3040],{"type":70,"value":2978},{"type":64,"tag":207,"props":3042,"children":3043},{"style":291},[3044],{"type":70,"value":3045}," :router=\"router\" \u002F>\n",{"type":64,"tag":189,"props":3047,"children":3049},{"id":3048},"link",[3050],{"type":64,"tag":73,"props":3051,"children":3053},{"className":3052},[],[3054],{"type":70,"value":879},{"type":64,"tag":82,"props":3056,"children":3057},{},[3058],{"type":70,"value":3059},"Type-safe navigation link with scoped slot for active state:",{"type":64,"tag":196,"props":3061,"children":3064},{"className":3062,"code":3063,"language":18,"meta":201,"style":201},"language-vue shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","\u003CLink to=\"\u002Fposts\u002F$postId\" :params=\"{ postId: '42' }\">\n View Post\n\u003C\u002FLink>\n\n\u003C!-- Scoped slot for active state -->\n\u003CLink to=\"\u002Fabout\">\n \u003Ctemplate #default=\"{ isActive }\">\n \u003Cspan :class=\"{ active: isActive }\">About\u003C\u002Fspan>\n \u003C\u002Ftemplate>\n\u003C\u002FLink>\n",[3065],{"type":64,"tag":73,"props":3066,"children":3067},{"__ignoreMap":201},[3068,3154,3162,3177,3184,3192,3227,3235,3243,3251],{"type":64,"tag":207,"props":3069,"children":3070},{"class":209,"line":210},[3071,3075,3079,3083,3087,3091,3095,3099,3104,3109,3113,3117,3121,3125,3129,3133,3138,3142,3146,3150],{"type":64,"tag":207,"props":3072,"children":3073},{"style":291},[3074],{"type":70,"value":3036},{"type":64,"tag":207,"props":3076,"children":3077},{"style":470},[3078],{"type":70,"value":879},{"type":64,"tag":207,"props":3080,"children":3081},{"style":742},[3082],{"type":70,"value":884},{"type":64,"tag":207,"props":3084,"children":3085},{"style":291},[3086],{"type":70,"value":755},{"type":64,"tag":207,"props":3088,"children":3089},{"style":291},[3090],{"type":70,"value":893},{"type":64,"tag":207,"props":3092,"children":3093},{"style":220},[3094],{"type":70,"value":2209},{"type":64,"tag":207,"props":3096,"children":3097},{"style":291},[3098],{"type":70,"value":893},{"type":64,"tag":207,"props":3100,"children":3101},{"style":291},[3102],{"type":70,"value":3103}," :",{"type":64,"tag":207,"props":3105,"children":3106},{"style":742},[3107],{"type":70,"value":3108},"params",{"type":64,"tag":207,"props":3110,"children":3111},{"style":291},[3112],{"type":70,"value":755},{"type":64,"tag":207,"props":3114,"children":3115},{"style":291},[3116],{"type":70,"value":893},{"type":64,"tag":207,"props":3118,"children":3119},{"style":291},[3120],{"type":70,"value":1520},{"type":64,"tag":207,"props":3122,"children":3123},{"style":470},[3124],{"type":70,"value":2235},{"type":64,"tag":207,"props":3126,"children":3127},{"style":291},[3128],{"type":70,"value":478},{"type":64,"tag":207,"props":3130,"children":3131},{"style":291},[3132],{"type":70,"value":315},{"type":64,"tag":207,"props":3134,"children":3135},{"style":220},[3136],{"type":70,"value":3137},"42",{"type":64,"tag":207,"props":3139,"children":3140},{"style":291},[3141],{"type":70,"value":535},{"type":64,"tag":207,"props":3143,"children":3144},{"style":291},[3145],{"type":70,"value":305},{"type":64,"tag":207,"props":3147,"children":3148},{"style":291},[3149],{"type":70,"value":893},{"type":64,"tag":207,"props":3151,"children":3152},{"style":291},[3153],{"type":70,"value":866},{"type":64,"tag":207,"props":3155,"children":3156},{"class":209,"line":231},[3157],{"type":64,"tag":207,"props":3158,"children":3159},{"style":297},[3160],{"type":70,"value":3161}," View Post\n",{"type":64,"tag":207,"props":3163,"children":3164},{"class":209,"line":328},[3165,3169,3173],{"type":64,"tag":207,"props":3166,"children":3167},{"style":291},[3168],{"type":70,"value":1329},{"type":64,"tag":207,"props":3170,"children":3171},{"style":470},[3172],{"type":70,"value":879},{"type":64,"tag":207,"props":3174,"children":3175},{"style":291},[3176],{"type":70,"value":866},{"type":64,"tag":207,"props":3178,"children":3179},{"class":209,"line":359},[3180],{"type":64,"tag":207,"props":3181,"children":3182},{"emptyLinePlaceholder":431},[3183],{"type":70,"value":434},{"type":64,"tag":207,"props":3185,"children":3186},{"class":209,"line":389},[3187],{"type":64,"tag":207,"props":3188,"children":3189},{"style":276},[3190],{"type":70,"value":3191},"\u003C!-- Scoped slot for active state -->\n",{"type":64,"tag":207,"props":3193,"children":3194},{"class":209,"line":427},[3195,3199,3203,3207,3211,3215,3219,3223],{"type":64,"tag":207,"props":3196,"children":3197},{"style":291},[3198],{"type":70,"value":3036},{"type":64,"tag":207,"props":3200,"children":3201},{"style":470},[3202],{"type":70,"value":879},{"type":64,"tag":207,"props":3204,"children":3205},{"style":742},[3206],{"type":70,"value":884},{"type":64,"tag":207,"props":3208,"children":3209},{"style":291},[3210],{"type":70,"value":755},{"type":64,"tag":207,"props":3212,"children":3213},{"style":291},[3214],{"type":70,"value":893},{"type":64,"tag":207,"props":3216,"children":3217},{"style":220},[3218],{"type":70,"value":991},{"type":64,"tag":207,"props":3220,"children":3221},{"style":291},[3222],{"type":70,"value":893},{"type":64,"tag":207,"props":3224,"children":3225},{"style":291},[3226],{"type":70,"value":866},{"type":64,"tag":207,"props":3228,"children":3229},{"class":209,"line":437},[3230],{"type":64,"tag":207,"props":3231,"children":3232},{"style":297},[3233],{"type":70,"value":3234}," \u003Ctemplate #default=\"{ isActive }\">\n",{"type":64,"tag":207,"props":3236,"children":3237},{"class":209,"line":466},[3238],{"type":64,"tag":207,"props":3239,"children":3240},{"style":297},[3241],{"type":70,"value":3242}," \u003Cspan :class=\"{ active: isActive }\">About\u003C\u002Fspan>\n",{"type":64,"tag":207,"props":3244,"children":3245},{"class":209,"line":486},[3246],{"type":64,"tag":207,"props":3247,"children":3248},{"style":297},[3249],{"type":70,"value":3250}," \u003C\u002Ftemplate>\n",{"type":64,"tag":207,"props":3252,"children":3253},{"class":209,"line":495},[3254,3258,3262],{"type":64,"tag":207,"props":3255,"children":3256},{"style":291},[3257],{"type":70,"value":1329},{"type":64,"tag":207,"props":3259,"children":3260},{"style":470},[3261],{"type":70,"value":879},{"type":64,"tag":207,"props":3263,"children":3264},{"style":291},[3265],{"type":70,"value":866},{"type":64,"tag":189,"props":3267,"children":3269},{"id":3268},"outlet",[3270],{"type":64,"tag":73,"props":3271,"children":3273},{"className":3272},[],[3274],{"type":70,"value":1098},{"type":64,"tag":82,"props":3276,"children":3277},{},[3278],{"type":70,"value":3279},"Renders the matched child route component.",{"type":64,"tag":189,"props":3281,"children":3283},{"id":3282},"navigate",[3284],{"type":64,"tag":73,"props":3285,"children":3287},{"className":3286},[],[3288],{"type":70,"value":3289},"Navigate",{"type":64,"tag":82,"props":3291,"children":3292},{},[3293,3295,3301],{"type":70,"value":3294},"Declarative redirect (triggers navigation in ",{"type":64,"tag":73,"props":3296,"children":3298},{"className":3297},[],[3299],{"type":70,"value":3300},"onMounted",{"type":70,"value":3302},").",{"type":64,"tag":189,"props":3304,"children":3306},{"id":3305},"await",[3307],{"type":64,"tag":73,"props":3308,"children":3310},{"className":3309},[],[3311],{"type":70,"value":3312},"Await",{"type":64,"tag":82,"props":3314,"children":3315},{},[3316,3318,3324],{"type":70,"value":3317},"Async setup component for deferred data — use with Vue's ",{"type":64,"tag":73,"props":3319,"children":3321},{"className":3320},[],[3322],{"type":70,"value":3323},"\u003CSuspense>",{"type":70,"value":1696},{"type":64,"tag":189,"props":3326,"children":3328},{"id":3327},"catchboundary",[3329],{"type":64,"tag":73,"props":3330,"children":3332},{"className":3331},[],[3333],{"type":70,"value":3334},"CatchBoundary",{"type":64,"tag":82,"props":3336,"children":3337},{},[3338,3340,3346],{"type":70,"value":3339},"Error boundary using Vue's ",{"type":64,"tag":73,"props":3341,"children":3343},{"className":3342},[],[3344],{"type":70,"value":3345},"onErrorCaptured",{"type":70,"value":1696},{"type":64,"tag":189,"props":3348,"children":3350},{"id":3349},"html-and-body",[3351,3357,3358],{"type":64,"tag":73,"props":3352,"children":3354},{"className":3353},[],[3355],{"type":70,"value":3356},"Html",{"type":70,"value":1896},{"type":64,"tag":73,"props":3359,"children":3361},{"className":3360},[],[3362],{"type":70,"value":3363},"Body",{"type":64,"tag":82,"props":3365,"children":3366},{},[3367],{"type":70,"value":3368},"Vue-specific SSR shell components:",{"type":64,"tag":196,"props":3370,"children":3372},{"className":657,"code":3371,"language":659,"meta":201,"style":201},"function RootComponent() {\n return (\n \u003CHtml>\n \u003Chead>\n \u003CHeadContent \u002F>\n \u003C\u002Fhead>\n \u003CBody>\n \u003COutlet \u002F>\n \u003CScripts \u002F>\n \u003C\u002FBody>\n \u003C\u002FHtml>\n )\n}\n",[3373],{"type":64,"tag":73,"props":3374,"children":3375},{"__ignoreMap":201},[3376,3396,3407,3423,3439,3455,3470,3485,3500,3516,3531,3547,3554],{"type":64,"tag":207,"props":3377,"children":3378},{"class":209,"line":210},[3379,3383,3388,3392],{"type":64,"tag":207,"props":3380,"children":3381},{"style":742},[3382],{"type":70,"value":814},{"type":64,"tag":207,"props":3384,"children":3385},{"style":451},[3386],{"type":70,"value":3387}," RootComponent",{"type":64,"tag":207,"props":3389,"children":3390},{"style":291},[3391],{"type":70,"value":594},{"type":64,"tag":207,"props":3393,"children":3394},{"style":291},[3395],{"type":70,"value":827},{"type":64,"tag":207,"props":3397,"children":3398},{"class":209,"line":231},[3399,3403],{"type":64,"tag":207,"props":3400,"children":3401},{"style":285},[3402],{"type":70,"value":835},{"type":64,"tag":207,"props":3404,"children":3405},{"style":470},[3406],{"type":70,"value":840},{"type":64,"tag":207,"props":3408,"children":3409},{"class":209,"line":328},[3410,3415,3419],{"type":64,"tag":207,"props":3411,"children":3412},{"style":291},[3413],{"type":70,"value":3414}," \u003C",{"type":64,"tag":207,"props":3416,"children":3417},{"style":214},[3418],{"type":70,"value":3356},{"type":64,"tag":207,"props":3420,"children":3421},{"style":291},[3422],{"type":70,"value":866},{"type":64,"tag":207,"props":3424,"children":3425},{"class":209,"line":359},[3426,3430,3435],{"type":64,"tag":207,"props":3427,"children":3428},{"style":291},[3429],{"type":70,"value":856},{"type":64,"tag":207,"props":3431,"children":3432},{"style":470},[3433],{"type":70,"value":3434},"head",{"type":64,"tag":207,"props":3436,"children":3437},{"style":291},[3438],{"type":70,"value":866},{"type":64,"tag":207,"props":3440,"children":3441},{"class":209,"line":389},[3442,3446,3451],{"type":64,"tag":207,"props":3443,"children":3444},{"style":291},[3445],{"type":70,"value":874},{"type":64,"tag":207,"props":3447,"children":3448},{"style":214},[3449],{"type":70,"value":3450},"HeadContent",{"type":64,"tag":207,"props":3452,"children":3453},{"style":291},[3454],{"type":70,"value":1085},{"type":64,"tag":207,"props":3456,"children":3457},{"class":209,"line":427},[3458,3462,3466],{"type":64,"tag":207,"props":3459,"children":3460},{"style":291},[3461],{"type":70,"value":1059},{"type":64,"tag":207,"props":3463,"children":3464},{"style":470},[3465],{"type":70,"value":3434},{"type":64,"tag":207,"props":3467,"children":3468},{"style":291},[3469],{"type":70,"value":866},{"type":64,"tag":207,"props":3471,"children":3472},{"class":209,"line":437},[3473,3477,3481],{"type":64,"tag":207,"props":3474,"children":3475},{"style":291},[3476],{"type":70,"value":856},{"type":64,"tag":207,"props":3478,"children":3479},{"style":214},[3480],{"type":70,"value":3363},{"type":64,"tag":207,"props":3482,"children":3483},{"style":291},[3484],{"type":70,"value":866},{"type":64,"tag":207,"props":3486,"children":3487},{"class":209,"line":466},[3488,3492,3496],{"type":64,"tag":207,"props":3489,"children":3490},{"style":291},[3491],{"type":70,"value":874},{"type":64,"tag":207,"props":3493,"children":3494},{"style":214},[3495],{"type":70,"value":1098},{"type":64,"tag":207,"props":3497,"children":3498},{"style":291},[3499],{"type":70,"value":1085},{"type":64,"tag":207,"props":3501,"children":3502},{"class":209,"line":486},[3503,3507,3512],{"type":64,"tag":207,"props":3504,"children":3505},{"style":291},[3506],{"type":70,"value":874},{"type":64,"tag":207,"props":3508,"children":3509},{"style":214},[3510],{"type":70,"value":3511},"Scripts",{"type":64,"tag":207,"props":3513,"children":3514},{"style":291},[3515],{"type":70,"value":1085},{"type":64,"tag":207,"props":3517,"children":3518},{"class":209,"line":495},[3519,3523,3527],{"type":64,"tag":207,"props":3520,"children":3521},{"style":291},[3522],{"type":70,"value":1059},{"type":64,"tag":207,"props":3524,"children":3525},{"style":214},[3526],{"type":70,"value":3363},{"type":64,"tag":207,"props":3528,"children":3529},{"style":291},[3530],{"type":70,"value":866},{"type":64,"tag":207,"props":3532,"children":3533},{"class":209,"line":512},[3534,3539,3543],{"type":64,"tag":207,"props":3535,"children":3536},{"style":291},[3537],{"type":70,"value":3538}," \u003C\u002F",{"type":64,"tag":207,"props":3540,"children":3541},{"style":214},[3542],{"type":70,"value":3356},{"type":64,"tag":207,"props":3544,"children":3545},{"style":291},[3546],{"type":70,"value":866},{"type":64,"tag":207,"props":3548,"children":3549},{"class":209,"line":543},[3550],{"type":64,"tag":207,"props":3551,"children":3552},{"style":470},[3553],{"type":70,"value":1120},{"type":64,"tag":207,"props":3555,"children":3556},{"class":209,"line":566},[3557],{"type":64,"tag":207,"props":3558,"children":3559},{"style":291},[3560],{"type":70,"value":1129},{"type":64,"tag":189,"props":3562,"children":3564},{"id":3563},"clientonly",[3565],{"type":64,"tag":73,"props":3566,"children":3568},{"className":3567},[],[3569],{"type":70,"value":3570},"ClientOnly",{"type":64,"tag":82,"props":3572,"children":3573},{},[3574,3576,3581],{"type":70,"value":3575},"Renders children only after ",{"type":64,"tag":73,"props":3577,"children":3579},{"className":3578},[],[3580],{"type":70,"value":3300},{"type":70,"value":3582}," (hydration complete):",{"type":64,"tag":196,"props":3584,"children":3586},{"className":657,"code":3585,"language":659,"meta":201,"style":201},"\u003CClientOnly fallback={\u003Cdiv>Loading...\u003C\u002Fdiv>}>\n \u003CBrowserOnlyWidget \u002F>\n\u003C\u002FClientOnly>\n",[3587],{"type":64,"tag":73,"props":3588,"children":3589},{"__ignoreMap":201},[3590,3638,3655],{"type":64,"tag":207,"props":3591,"children":3592},{"class":209,"line":210},[3593,3597,3601,3606,3611,3616,3620,3625,3629,3633],{"type":64,"tag":207,"props":3594,"children":3595},{"style":291},[3596],{"type":70,"value":3036},{"type":64,"tag":207,"props":3598,"children":3599},{"style":214},[3600],{"type":70,"value":3570},{"type":64,"tag":207,"props":3602,"children":3603},{"style":742},[3604],{"type":70,"value":3605}," fallback",{"type":64,"tag":207,"props":3607,"children":3608},{"style":291},[3609],{"type":70,"value":3610},"={\u003C",{"type":64,"tag":207,"props":3612,"children":3613},{"style":470},[3614],{"type":70,"value":3615},"div",{"type":64,"tag":207,"props":3617,"children":3618},{"style":291},[3619],{"type":70,"value":1319},{"type":64,"tag":207,"props":3621,"children":3622},{"style":297},[3623],{"type":70,"value":3624},"Loading...",{"type":64,"tag":207,"props":3626,"children":3627},{"style":291},[3628],{"type":70,"value":1329},{"type":64,"tag":207,"props":3630,"children":3631},{"style":470},[3632],{"type":70,"value":3615},{"type":64,"tag":207,"props":3634,"children":3635},{"style":291},[3636],{"type":70,"value":3637},">}>\n",{"type":64,"tag":207,"props":3639,"children":3640},{"class":209,"line":231},[3641,3646,3651],{"type":64,"tag":207,"props":3642,"children":3643},{"style":291},[3644],{"type":70,"value":3645}," \u003C",{"type":64,"tag":207,"props":3647,"children":3648},{"style":214},[3649],{"type":70,"value":3650},"BrowserOnlyWidget",{"type":64,"tag":207,"props":3652,"children":3653},{"style":291},[3654],{"type":70,"value":1085},{"type":64,"tag":207,"props":3656,"children":3657},{"class":209,"line":328},[3658,3662,3666],{"type":64,"tag":207,"props":3659,"children":3660},{"style":291},[3661],{"type":70,"value":1329},{"type":64,"tag":207,"props":3663,"children":3664},{"style":214},[3665],{"type":70,"value":3570},{"type":64,"tag":207,"props":3667,"children":3668},{"style":291},[3669],{"type":70,"value":866},{"type":64,"tag":182,"props":3671,"children":3673},{"id":3672},"vue-specific-patterns",[3674],{"type":70,"value":3675},"Vue-Specific Patterns",{"type":64,"tag":189,"props":3677,"children":3679},{"id":3678},"custom-link-component-with-createlink",[3680,3682],{"type":70,"value":3681},"Custom Link Component with ",{"type":64,"tag":73,"props":3683,"children":3685},{"className":3684},[],[3686],{"type":70,"value":3687},"createLink",{"type":64,"tag":196,"props":3689,"children":3691},{"className":657,"code":3690,"language":659,"meta":201,"style":201},"import { createLink } from '@tanstack\u002Fvue-router'\nimport { defineComponent, h } from 'vue'\n\nconst StyledLinkComponent = defineComponent({\n setup(props, { slots, attrs }) {\n return () => h('a', { ...attrs, class: 'styled-link' }, slots.default?.())\n },\n})\n\nconst StyledLink = createLink(StyledLinkComponent)\n",[3692],{"type":64,"tag":73,"props":3693,"children":3694},{"__ignoreMap":201},[3695,3731,3776,3783,3811,3859,3967,3975,3986,3993],{"type":64,"tag":207,"props":3696,"children":3697},{"class":209,"line":210},[3698,3702,3706,3711,3715,3719,3723,3727],{"type":64,"tag":207,"props":3699,"children":3700},{"style":285},[3701],{"type":70,"value":288},{"type":64,"tag":207,"props":3703,"children":3704},{"style":291},[3705],{"type":70,"value":294},{"type":64,"tag":207,"props":3707,"children":3708},{"style":297},[3709],{"type":70,"value":3710}," createLink",{"type":64,"tag":207,"props":3712,"children":3713},{"style":291},[3714],{"type":70,"value":305},{"type":64,"tag":207,"props":3716,"children":3717},{"style":285},[3718],{"type":70,"value":310},{"type":64,"tag":207,"props":3720,"children":3721},{"style":291},[3722],{"type":70,"value":315},{"type":64,"tag":207,"props":3724,"children":3725},{"style":220},[3726],{"type":70,"value":78},{"type":64,"tag":207,"props":3728,"children":3729},{"style":291},[3730],{"type":70,"value":325},{"type":64,"tag":207,"props":3732,"children":3733},{"class":209,"line":231},[3734,3738,3742,3747,3751,3756,3760,3764,3768,3772],{"type":64,"tag":207,"props":3735,"children":3736},{"style":285},[3737],{"type":70,"value":288},{"type":64,"tag":207,"props":3739,"children":3740},{"style":291},[3741],{"type":70,"value":294},{"type":64,"tag":207,"props":3743,"children":3744},{"style":297},[3745],{"type":70,"value":3746}," defineComponent",{"type":64,"tag":207,"props":3748,"children":3749},{"style":291},[3750],{"type":70,"value":616},{"type":64,"tag":207,"props":3752,"children":3753},{"style":297},[3754],{"type":70,"value":3755}," h",{"type":64,"tag":207,"props":3757,"children":3758},{"style":291},[3759],{"type":70,"value":305},{"type":64,"tag":207,"props":3761,"children":3762},{"style":285},[3763],{"type":70,"value":310},{"type":64,"tag":207,"props":3765,"children":3766},{"style":291},[3767],{"type":70,"value":315},{"type":64,"tag":207,"props":3769,"children":3770},{"style":220},[3771],{"type":70,"value":18},{"type":64,"tag":207,"props":3773,"children":3774},{"style":291},[3775],{"type":70,"value":325},{"type":64,"tag":207,"props":3777,"children":3778},{"class":209,"line":328},[3779],{"type":64,"tag":207,"props":3780,"children":3781},{"emptyLinePlaceholder":431},[3782],{"type":70,"value":434},{"type":64,"tag":207,"props":3784,"children":3785},{"class":209,"line":359},[3786,3790,3795,3799,3803,3807],{"type":64,"tag":207,"props":3787,"children":3788},{"style":742},[3789],{"type":70,"value":1498},{"type":64,"tag":207,"props":3791,"children":3792},{"style":297},[3793],{"type":70,"value":3794}," StyledLinkComponent ",{"type":64,"tag":207,"props":3796,"children":3797},{"style":291},[3798],{"type":70,"value":755},{"type":64,"tag":207,"props":3800,"children":3801},{"style":451},[3802],{"type":70,"value":3746},{"type":64,"tag":207,"props":3804,"children":3805},{"style":297},[3806],{"type":70,"value":458},{"type":64,"tag":207,"props":3808,"children":3809},{"style":291},[3810],{"type":70,"value":463},{"type":64,"tag":207,"props":3812,"children":3813},{"class":209,"line":389},[3814,3819,3823,3828,3832,3836,3841,3845,3850,3855],{"type":64,"tag":207,"props":3815,"children":3816},{"style":470},[3817],{"type":70,"value":3818}," setup",{"type":64,"tag":207,"props":3820,"children":3821},{"style":291},[3822],{"type":70,"value":458},{"type":64,"tag":207,"props":3824,"children":3825},{"style":1998},[3826],{"type":70,"value":3827},"props",{"type":64,"tag":207,"props":3829,"children":3830},{"style":291},[3831],{"type":70,"value":616},{"type":64,"tag":207,"props":3833,"children":3834},{"style":291},[3835],{"type":70,"value":294},{"type":64,"tag":207,"props":3837,"children":3838},{"style":1998},[3839],{"type":70,"value":3840}," slots",{"type":64,"tag":207,"props":3842,"children":3843},{"style":291},[3844],{"type":70,"value":616},{"type":64,"tag":207,"props":3846,"children":3847},{"style":1998},[3848],{"type":70,"value":3849}," attrs",{"type":64,"tag":207,"props":3851,"children":3852},{"style":291},[3853],{"type":70,"value":3854}," })",{"type":64,"tag":207,"props":3856,"children":3857},{"style":291},[3858],{"type":70,"value":827},{"type":64,"tag":207,"props":3860,"children":3861},{"class":209,"line":427},[3862,3867,3872,3876,3880,3884,3888,3892,3896,3900,3904,3909,3914,3918,3922,3926,3930,3935,3939,3944,3948,3952,3957,3962],{"type":64,"tag":207,"props":3863,"children":3864},{"style":285},[3865],{"type":70,"value":3866}," return",{"type":64,"tag":207,"props":3868,"children":3869},{"style":291},[3870],{"type":70,"value":3871}," ()",{"type":64,"tag":207,"props":3873,"children":3874},{"style":742},[3875],{"type":70,"value":2010},{"type":64,"tag":207,"props":3877,"children":3878},{"style":451},[3879],{"type":70,"value":3755},{"type":64,"tag":207,"props":3881,"children":3882},{"style":470},[3883],{"type":70,"value":458},{"type":64,"tag":207,"props":3885,"children":3886},{"style":291},[3887],{"type":70,"value":535},{"type":64,"tag":207,"props":3889,"children":3890},{"style":220},[3891],{"type":70,"value":88},{"type":64,"tag":207,"props":3893,"children":3894},{"style":291},[3895],{"type":70,"value":535},{"type":64,"tag":207,"props":3897,"children":3898},{"style":291},[3899],{"type":70,"value":616},{"type":64,"tag":207,"props":3901,"children":3902},{"style":291},[3903],{"type":70,"value":294},{"type":64,"tag":207,"props":3905,"children":3906},{"style":291},[3907],{"type":70,"value":3908}," ...",{"type":64,"tag":207,"props":3910,"children":3911},{"style":297},[3912],{"type":70,"value":3913},"attrs",{"type":64,"tag":207,"props":3915,"children":3916},{"style":291},[3917],{"type":70,"value":616},{"type":64,"tag":207,"props":3919,"children":3920},{"style":470},[3921],{"type":70,"value":917},{"type":64,"tag":207,"props":3923,"children":3924},{"style":291},[3925],{"type":70,"value":478},{"type":64,"tag":207,"props":3927,"children":3928},{"style":291},[3929],{"type":70,"value":315},{"type":64,"tag":207,"props":3931,"children":3932},{"style":220},[3933],{"type":70,"value":3934},"styled-link",{"type":64,"tag":207,"props":3936,"children":3937},{"style":291},[3938],{"type":70,"value":535},{"type":64,"tag":207,"props":3940,"children":3941},{"style":291},[3942],{"type":70,"value":3943}," },",{"type":64,"tag":207,"props":3945,"children":3946},{"style":297},[3947],{"type":70,"value":3840},{"type":64,"tag":207,"props":3949,"children":3950},{"style":291},[3951],{"type":70,"value":1696},{"type":64,"tag":207,"props":3953,"children":3954},{"style":451},[3955],{"type":70,"value":3956},"default",{"type":64,"tag":207,"props":3958,"children":3959},{"style":291},[3960],{"type":70,"value":3961},"?.",{"type":64,"tag":207,"props":3963,"children":3964},{"style":470},[3965],{"type":70,"value":3966},"())\n",{"type":64,"tag":207,"props":3968,"children":3969},{"class":209,"line":437},[3970],{"type":64,"tag":207,"props":3971,"children":3972},{"style":291},[3973],{"type":70,"value":3974}," },\n",{"type":64,"tag":207,"props":3976,"children":3977},{"class":209,"line":466},[3978,3982],{"type":64,"tag":207,"props":3979,"children":3980},{"style":291},[3981],{"type":70,"value":643},{"type":64,"tag":207,"props":3983,"children":3984},{"style":297},[3985],{"type":70,"value":648},{"type":64,"tag":207,"props":3987,"children":3988},{"class":209,"line":486},[3989],{"type":64,"tag":207,"props":3990,"children":3991},{"emptyLinePlaceholder":431},[3992],{"type":70,"value":434},{"type":64,"tag":207,"props":3994,"children":3995},{"class":209,"line":495},[3996,4000,4005,4009,4013],{"type":64,"tag":207,"props":3997,"children":3998},{"style":742},[3999],{"type":70,"value":1498},{"type":64,"tag":207,"props":4001,"children":4002},{"style":297},[4003],{"type":70,"value":4004}," StyledLink ",{"type":64,"tag":207,"props":4006,"children":4007},{"style":291},[4008],{"type":70,"value":755},{"type":64,"tag":207,"props":4010,"children":4011},{"style":451},[4012],{"type":70,"value":3710},{"type":64,"tag":207,"props":4014,"children":4015},{"style":297},[4016],{"type":70,"value":4017},"(StyledLinkComponent)\n",{"type":64,"tag":189,"props":4019,"children":4021},{"id":4020},"render-functions-h",[4022],{"type":70,"value":4023},"Render Functions (h())",{"type":64,"tag":82,"props":4025,"children":4026},{},[4027,4029,4034,4036,4042],{"type":70,"value":4028},"All components in ",{"type":64,"tag":73,"props":4030,"children":4032},{"className":4031},[],[4033],{"type":70,"value":78},{"type":70,"value":4035}," use ",{"type":64,"tag":73,"props":4037,"children":4039},{"className":4038},[],[4040],{"type":70,"value":4041},"h()",{"type":70,"value":4043}," render functions internally. Route components can use either SFC templates or render functions:",{"type":64,"tag":82,"props":4045,"children":4046},{},[4047,4049,4055],{"type":70,"value":4048},"SFC template (most common for user code) in ",{"type":64,"tag":73,"props":4050,"children":4052},{"className":4051},[],[4053],{"type":70,"value":4054},"MyRoute.component.vue",{"type":70,"value":478},{"type":64,"tag":196,"props":4057,"children":4059},{"className":3062,"code":4058,"language":18,"meta":201,"style":201},"\u003Ctemplate>\n \u003Cdiv>{{ data.title }}\u003C\u002Fdiv>\n\u003C\u002Ftemplate>\n\n\u003Cscript setup>\nimport { useLoaderData } from '@tanstack\u002Fvue-router'\nconst data = useLoaderData({ from: '\u002Fposts\u002F$postId' })\n\u003C\u002Fscript>\n",[4060],{"type":64,"tag":73,"props":4061,"children":4062},{"__ignoreMap":201},[4063,4079,4111,4126,4133,4154,4189,4244],{"type":64,"tag":207,"props":4064,"children":4065},{"class":209,"line":210},[4066,4070,4075],{"type":64,"tag":207,"props":4067,"children":4068},{"style":291},[4069],{"type":70,"value":3036},{"type":64,"tag":207,"props":4071,"children":4072},{"style":470},[4073],{"type":70,"value":4074},"template",{"type":64,"tag":207,"props":4076,"children":4077},{"style":291},[4078],{"type":70,"value":866},{"type":64,"tag":207,"props":4080,"children":4081},{"class":209,"line":231},[4082,4086,4090,4094,4099,4103,4107],{"type":64,"tag":207,"props":4083,"children":4084},{"style":291},[4085],{"type":70,"value":3645},{"type":64,"tag":207,"props":4087,"children":4088},{"style":470},[4089],{"type":70,"value":3615},{"type":64,"tag":207,"props":4091,"children":4092},{"style":291},[4093],{"type":70,"value":1319},{"type":64,"tag":207,"props":4095,"children":4096},{"style":297},[4097],{"type":70,"value":4098},"{{ data.title }}",{"type":64,"tag":207,"props":4100,"children":4101},{"style":291},[4102],{"type":70,"value":1329},{"type":64,"tag":207,"props":4104,"children":4105},{"style":470},[4106],{"type":70,"value":3615},{"type":64,"tag":207,"props":4108,"children":4109},{"style":291},[4110],{"type":70,"value":866},{"type":64,"tag":207,"props":4112,"children":4113},{"class":209,"line":328},[4114,4118,4122],{"type":64,"tag":207,"props":4115,"children":4116},{"style":291},[4117],{"type":70,"value":1329},{"type":64,"tag":207,"props":4119,"children":4120},{"style":470},[4121],{"type":70,"value":4074},{"type":64,"tag":207,"props":4123,"children":4124},{"style":291},[4125],{"type":70,"value":866},{"type":64,"tag":207,"props":4127,"children":4128},{"class":209,"line":359},[4129],{"type":64,"tag":207,"props":4130,"children":4131},{"emptyLinePlaceholder":431},[4132],{"type":70,"value":434},{"type":64,"tag":207,"props":4134,"children":4135},{"class":209,"line":389},[4136,4140,4145,4150],{"type":64,"tag":207,"props":4137,"children":4138},{"style":291},[4139],{"type":70,"value":3036},{"type":64,"tag":207,"props":4141,"children":4142},{"style":470},[4143],{"type":70,"value":4144},"script",{"type":64,"tag":207,"props":4146,"children":4147},{"style":742},[4148],{"type":70,"value":4149}," setup",{"type":64,"tag":207,"props":4151,"children":4152},{"style":291},[4153],{"type":70,"value":866},{"type":64,"tag":207,"props":4155,"children":4156},{"class":209,"line":427},[4157,4161,4165,4169,4173,4177,4181,4185],{"type":64,"tag":207,"props":4158,"children":4159},{"style":285},[4160],{"type":70,"value":288},{"type":64,"tag":207,"props":4162,"children":4163},{"style":291},[4164],{"type":70,"value":294},{"type":64,"tag":207,"props":4166,"children":4167},{"style":297},[4168],{"type":70,"value":2571},{"type":64,"tag":207,"props":4170,"children":4171},{"style":291},[4172],{"type":70,"value":305},{"type":64,"tag":207,"props":4174,"children":4175},{"style":285},[4176],{"type":70,"value":310},{"type":64,"tag":207,"props":4178,"children":4179},{"style":291},[4180],{"type":70,"value":315},{"type":64,"tag":207,"props":4182,"children":4183},{"style":220},[4184],{"type":70,"value":78},{"type":64,"tag":207,"props":4186,"children":4187},{"style":291},[4188],{"type":70,"value":325},{"type":64,"tag":207,"props":4190,"children":4191},{"class":209,"line":437},[4192,4196,4200,4204,4208,4212,4216,4220,4224,4228,4232,4236,4240],{"type":64,"tag":207,"props":4193,"children":4194},{"style":742},[4195],{"type":70,"value":1498},{"type":64,"tag":207,"props":4197,"children":4198},{"style":297},[4199],{"type":70,"value":2610},{"type":64,"tag":207,"props":4201,"children":4202},{"style":291},[4203],{"type":70,"value":755},{"type":64,"tag":207,"props":4205,"children":4206},{"style":451},[4207],{"type":70,"value":2571},{"type":64,"tag":207,"props":4209,"children":4210},{"style":297},[4211],{"type":70,"value":458},{"type":64,"tag":207,"props":4213,"children":4214},{"style":291},[4215],{"type":70,"value":1520},{"type":64,"tag":207,"props":4217,"children":4218},{"style":470},[4219],{"type":70,"value":310},{"type":64,"tag":207,"props":4221,"children":4222},{"style":291},[4223],{"type":70,"value":478},{"type":64,"tag":207,"props":4225,"children":4226},{"style":291},[4227],{"type":70,"value":315},{"type":64,"tag":207,"props":4229,"children":4230},{"style":220},[4231],{"type":70,"value":2209},{"type":64,"tag":207,"props":4233,"children":4234},{"style":291},[4235],{"type":70,"value":535},{"type":64,"tag":207,"props":4237,"children":4238},{"style":291},[4239],{"type":70,"value":305},{"type":64,"tag":207,"props":4241,"children":4242},{"style":297},[4243],{"type":70,"value":648},{"type":64,"tag":207,"props":4245,"children":4246},{"class":209,"line":466},[4247,4251,4255],{"type":64,"tag":207,"props":4248,"children":4249},{"style":291},[4250],{"type":70,"value":1329},{"type":64,"tag":207,"props":4252,"children":4253},{"style":470},[4254],{"type":70,"value":4144},{"type":64,"tag":207,"props":4256,"children":4257},{"style":291},[4258],{"type":70,"value":866},{"type":64,"tag":189,"props":4260,"children":4262},{"id":4261},"auth-with-router-context",[4263],{"type":70,"value":4264},"Auth with Router Context",{"type":64,"tag":196,"props":4266,"children":4268},{"className":657,"code":4267,"language":659,"meta":201,"style":201},"import { createRootRouteWithContext } from '@tanstack\u002Fvue-router'\n\nconst rootRoute = createRootRouteWithContext\u003C{ auth: AuthState }>()({\n component: RootComponent,\n})\n\nconst router = createRouter({\n routeTree,\n context: { auth: authState },\n})\n\n\u002F\u002F In a route — access via beforeLoad\nbeforeLoad: ({ context }) => {\n if (!context.auth.isAuthenticated) {\n throw redirect({ to: '\u002Flogin' })\n }\n}\n",[4269],{"type":64,"tag":73,"props":4270,"children":4271},{"__ignoreMap":201},[4272,4308,4315,4368,4387,4398,4405,4432,4444,4478,4489,4496,4504,4537,4586,4636,4643],{"type":64,"tag":207,"props":4273,"children":4274},{"class":209,"line":210},[4275,4279,4283,4288,4292,4296,4300,4304],{"type":64,"tag":207,"props":4276,"children":4277},{"style":285},[4278],{"type":70,"value":288},{"type":64,"tag":207,"props":4280,"children":4281},{"style":291},[4282],{"type":70,"value":294},{"type":64,"tag":207,"props":4284,"children":4285},{"style":297},[4286],{"type":70,"value":4287}," createRootRouteWithContext",{"type":64,"tag":207,"props":4289,"children":4290},{"style":291},[4291],{"type":70,"value":305},{"type":64,"tag":207,"props":4293,"children":4294},{"style":285},[4295],{"type":70,"value":310},{"type":64,"tag":207,"props":4297,"children":4298},{"style":291},[4299],{"type":70,"value":315},{"type":64,"tag":207,"props":4301,"children":4302},{"style":220},[4303],{"type":70,"value":78},{"type":64,"tag":207,"props":4305,"children":4306},{"style":291},[4307],{"type":70,"value":325},{"type":64,"tag":207,"props":4309,"children":4310},{"class":209,"line":231},[4311],{"type":64,"tag":207,"props":4312,"children":4313},{"emptyLinePlaceholder":431},[4314],{"type":70,"value":434},{"type":64,"tag":207,"props":4316,"children":4317},{"class":209,"line":328},[4318,4322,4327,4331,4335,4340,4345,4349,4354,4359,4364],{"type":64,"tag":207,"props":4319,"children":4320},{"style":742},[4321],{"type":70,"value":1498},{"type":64,"tag":207,"props":4323,"children":4324},{"style":297},[4325],{"type":70,"value":4326}," rootRoute ",{"type":64,"tag":207,"props":4328,"children":4329},{"style":291},[4330],{"type":70,"value":755},{"type":64,"tag":207,"props":4332,"children":4333},{"style":451},[4334],{"type":70,"value":4287},{"type":64,"tag":207,"props":4336,"children":4337},{"style":291},[4338],{"type":70,"value":4339},"\u003C{",{"type":64,"tag":207,"props":4341,"children":4342},{"style":470},[4343],{"type":70,"value":4344}," auth",{"type":64,"tag":207,"props":4346,"children":4347},{"style":291},[4348],{"type":70,"value":478},{"type":64,"tag":207,"props":4350,"children":4351},{"style":214},[4352],{"type":70,"value":4353}," AuthState",{"type":64,"tag":207,"props":4355,"children":4356},{"style":291},[4357],{"type":70,"value":4358}," }>",{"type":64,"tag":207,"props":4360,"children":4361},{"style":297},[4362],{"type":70,"value":4363},"()(",{"type":64,"tag":207,"props":4365,"children":4366},{"style":291},[4367],{"type":70,"value":463},{"type":64,"tag":207,"props":4369,"children":4370},{"class":209,"line":359},[4371,4375,4379,4383],{"type":64,"tag":207,"props":4372,"children":4373},{"style":470},[4374],{"type":70,"value":775},{"type":64,"tag":207,"props":4376,"children":4377},{"style":291},[4378],{"type":70,"value":478},{"type":64,"tag":207,"props":4380,"children":4381},{"style":297},[4382],{"type":70,"value":3387},{"type":64,"tag":207,"props":4384,"children":4385},{"style":291},[4386],{"type":70,"value":540},{"type":64,"tag":207,"props":4388,"children":4389},{"class":209,"line":389},[4390,4394],{"type":64,"tag":207,"props":4391,"children":4392},{"style":291},[4393],{"type":70,"value":643},{"type":64,"tag":207,"props":4395,"children":4396},{"style":297},[4397],{"type":70,"value":648},{"type":64,"tag":207,"props":4399,"children":4400},{"class":209,"line":427},[4401],{"type":64,"tag":207,"props":4402,"children":4403},{"emptyLinePlaceholder":431},[4404],{"type":70,"value":434},{"type":64,"tag":207,"props":4406,"children":4407},{"class":209,"line":437},[4408,4412,4416,4420,4424,4428],{"type":64,"tag":207,"props":4409,"children":4410},{"style":742},[4411],{"type":70,"value":1498},{"type":64,"tag":207,"props":4413,"children":4414},{"style":297},[4415],{"type":70,"value":1503},{"type":64,"tag":207,"props":4417,"children":4418},{"style":291},[4419],{"type":70,"value":755},{"type":64,"tag":207,"props":4421,"children":4422},{"style":451},[4423],{"type":70,"value":1426},{"type":64,"tag":207,"props":4425,"children":4426},{"style":297},[4427],{"type":70,"value":458},{"type":64,"tag":207,"props":4429,"children":4430},{"style":291},[4431],{"type":70,"value":463},{"type":64,"tag":207,"props":4433,"children":4434},{"class":209,"line":466},[4435,4440],{"type":64,"tag":207,"props":4436,"children":4437},{"style":297},[4438],{"type":70,"value":4439}," routeTree",{"type":64,"tag":207,"props":4441,"children":4442},{"style":291},[4443],{"type":70,"value":540},{"type":64,"tag":207,"props":4445,"children":4446},{"class":209,"line":486},[4447,4452,4456,4460,4464,4468,4473],{"type":64,"tag":207,"props":4448,"children":4449},{"style":470},[4450],{"type":70,"value":4451}," context",{"type":64,"tag":207,"props":4453,"children":4454},{"style":291},[4455],{"type":70,"value":478},{"type":64,"tag":207,"props":4457,"children":4458},{"style":291},[4459],{"type":70,"value":294},{"type":64,"tag":207,"props":4461,"children":4462},{"style":470},[4463],{"type":70,"value":4344},{"type":64,"tag":207,"props":4465,"children":4466},{"style":291},[4467],{"type":70,"value":478},{"type":64,"tag":207,"props":4469,"children":4470},{"style":297},[4471],{"type":70,"value":4472}," authState ",{"type":64,"tag":207,"props":4474,"children":4475},{"style":291},[4476],{"type":70,"value":4477},"},\n",{"type":64,"tag":207,"props":4479,"children":4480},{"class":209,"line":495},[4481,4485],{"type":64,"tag":207,"props":4482,"children":4483},{"style":291},[4484],{"type":70,"value":643},{"type":64,"tag":207,"props":4486,"children":4487},{"style":297},[4488],{"type":70,"value":648},{"type":64,"tag":207,"props":4490,"children":4491},{"class":209,"line":512},[4492],{"type":64,"tag":207,"props":4493,"children":4494},{"emptyLinePlaceholder":431},[4495],{"type":70,"value":434},{"type":64,"tag":207,"props":4497,"children":4498},{"class":209,"line":543},[4499],{"type":64,"tag":207,"props":4500,"children":4501},{"style":276},[4502],{"type":70,"value":4503},"\u002F\u002F In a route — access via beforeLoad\n",{"type":64,"tag":207,"props":4505,"children":4506},{"class":209,"line":566},[4507,4511,4515,4520,4525,4529,4533],{"type":64,"tag":207,"props":4508,"children":4509},{"style":214},[4510],{"type":70,"value":2851},{"type":64,"tag":207,"props":4512,"children":4513},{"style":291},[4514],{"type":70,"value":478},{"type":64,"tag":207,"props":4516,"children":4517},{"style":291},[4518],{"type":70,"value":4519}," ({",{"type":64,"tag":207,"props":4521,"children":4522},{"style":1998},[4523],{"type":70,"value":4524}," context",{"type":64,"tag":207,"props":4526,"children":4527},{"style":291},[4528],{"type":70,"value":3854},{"type":64,"tag":207,"props":4530,"children":4531},{"style":742},[4532],{"type":70,"value":2010},{"type":64,"tag":207,"props":4534,"children":4535},{"style":291},[4536],{"type":70,"value":827},{"type":64,"tag":207,"props":4538,"children":4539},{"class":209,"line":583},[4540,4545,4549,4554,4559,4563,4568,4572,4577,4582],{"type":64,"tag":207,"props":4541,"children":4542},{"style":285},[4543],{"type":70,"value":4544}," if",{"type":64,"tag":207,"props":4546,"children":4547},{"style":470},[4548],{"type":70,"value":1995},{"type":64,"tag":207,"props":4550,"children":4551},{"style":291},[4552],{"type":70,"value":4553},"!",{"type":64,"tag":207,"props":4555,"children":4556},{"style":297},[4557],{"type":70,"value":4558},"context",{"type":64,"tag":207,"props":4560,"children":4561},{"style":291},[4562],{"type":70,"value":1696},{"type":64,"tag":207,"props":4564,"children":4565},{"style":297},[4566],{"type":70,"value":4567},"auth",{"type":64,"tag":207,"props":4569,"children":4570},{"style":291},[4571],{"type":70,"value":1696},{"type":64,"tag":207,"props":4573,"children":4574},{"style":297},[4575],{"type":70,"value":4576},"isAuthenticated",{"type":64,"tag":207,"props":4578,"children":4579},{"style":470},[4580],{"type":70,"value":4581},") ",{"type":64,"tag":207,"props":4583,"children":4584},{"style":291},[4585],{"type":70,"value":463},{"type":64,"tag":207,"props":4587,"children":4588},{"class":209,"line":601},[4589,4594,4599,4603,4607,4611,4615,4619,4624,4628,4632],{"type":64,"tag":207,"props":4590,"children":4591},{"style":285},[4592],{"type":70,"value":4593}," throw",{"type":64,"tag":207,"props":4595,"children":4596},{"style":451},[4597],{"type":70,"value":4598}," redirect",{"type":64,"tag":207,"props":4600,"children":4601},{"style":470},[4602],{"type":70,"value":458},{"type":64,"tag":207,"props":4604,"children":4605},{"style":291},[4606],{"type":70,"value":1520},{"type":64,"tag":207,"props":4608,"children":4609},{"style":470},[4610],{"type":70,"value":884},{"type":64,"tag":207,"props":4612,"children":4613},{"style":291},[4614],{"type":70,"value":478},{"type":64,"tag":207,"props":4616,"children":4617},{"style":291},[4618],{"type":70,"value":315},{"type":64,"tag":207,"props":4620,"children":4621},{"style":220},[4622],{"type":70,"value":4623},"\u002Flogin",{"type":64,"tag":207,"props":4625,"children":4626},{"style":291},[4627],{"type":70,"value":535},{"type":64,"tag":207,"props":4629,"children":4630},{"style":291},[4631],{"type":70,"value":305},{"type":64,"tag":207,"props":4633,"children":4634},{"style":470},[4635],{"type":70,"value":648},{"type":64,"tag":207,"props":4637,"children":4638},{"class":209,"line":624},[4639],{"type":64,"tag":207,"props":4640,"children":4641},{"style":291},[4642],{"type":70,"value":1624},{"type":64,"tag":207,"props":4644,"children":4645},{"class":209,"line":637},[4646],{"type":64,"tag":207,"props":4647,"children":4648},{"style":291},[4649],{"type":70,"value":1129},{"type":64,"tag":189,"props":4651,"children":4653},{"id":4652},"vue-file-conventions-for-code-splitting",[4654],{"type":70,"value":4655},"Vue File Conventions for Code Splitting",{"type":64,"tag":82,"props":4657,"children":4658},{},[4659,4661,4667,4669,4675],{"type":70,"value":4660},"With ",{"type":64,"tag":73,"props":4662,"children":4664},{"className":4663},[],[4665],{"type":70,"value":4666},"autoCodeSplitting",{"type":70,"value":4668},", Vue routes can optionally use split-file conventions. These are NOT required — single-file ",{"type":64,"tag":73,"props":4670,"children":4672},{"className":4671},[],[4673],{"type":70,"value":4674},".tsx",{"type":70,"value":4676}," routes work fine. Split files are useful for separating route config from components:",{"type":64,"tag":2800,"props":4678,"children":4679},{},[4680,4691,4702,4713,4724],{"type":64,"tag":2804,"props":4681,"children":4682},{},[4683,4689],{"type":64,"tag":73,"props":4684,"children":4686},{"className":4685},[],[4687],{"type":70,"value":4688},"myRoute.ts",{"type":70,"value":4690}," — route configuration (search params, loader, beforeLoad)",{"type":64,"tag":2804,"props":4692,"children":4693},{},[4694,4700],{"type":64,"tag":73,"props":4695,"children":4697},{"className":4696},[],[4698],{"type":70,"value":4699},"myRoute.component.vue",{"type":70,"value":4701}," — route component (lazy-loaded)",{"type":64,"tag":2804,"props":4703,"children":4704},{},[4705,4711],{"type":64,"tag":73,"props":4706,"children":4708},{"className":4707},[],[4709],{"type":70,"value":4710},"myRoute.errorComponent.vue",{"type":70,"value":4712}," — error component (lazy-loaded)",{"type":64,"tag":2804,"props":4714,"children":4715},{},[4716,4722],{"type":64,"tag":73,"props":4717,"children":4719},{"className":4718},[],[4720],{"type":70,"value":4721},"myRoute.notFoundComponent.vue",{"type":70,"value":4723}," — not-found component (lazy-loaded)",{"type":64,"tag":2804,"props":4725,"children":4726},{},[4727,4733],{"type":64,"tag":73,"props":4728,"children":4730},{"className":4729},[],[4731],{"type":70,"value":4732},"myRoute.lazy.ts",{"type":70,"value":4734}," — lazy-loaded route options",{"type":64,"tag":182,"props":4736,"children":4738},{"id":4737},"common-mistakes",[4739],{"type":70,"value":4740},"Common Mistakes",{"type":64,"tag":189,"props":4742,"children":4744},{"id":4743},"_1-critical-forgetting-value-in-script-blocks",[4745],{"type":70,"value":4746},"1. CRITICAL: Forgetting .value in script blocks",{"type":64,"tag":82,"props":4748,"children":4749},{},[4750,4752,4757,4758,4763,4765,4771],{"type":70,"value":4751},"Composables return ",{"type":64,"tag":73,"props":4753,"children":4755},{"className":4754},[],[4756],{"type":70,"value":144},{"type":70,"value":146},{"type":64,"tag":73,"props":4759,"children":4761},{"className":4760},[],[4762],{"type":70,"value":152},{"type":70,"value":4764}," in ",{"type":64,"tag":73,"props":4766,"children":4768},{"className":4767},[],[4769],{"type":70,"value":4770},"\u003Cscript>",{"type":70,"value":4772},". Templates auto-unwrap.",{"type":64,"tag":196,"props":4774,"children":4776},{"className":657,"code":4775,"language":659,"meta":201,"style":201},"\u002F\u002F WRONG — accessing Ref without .value in script\nconst params = useParams({ from: '\u002Fposts\u002F$postId' })\nconsole.log(params.postId) \u002F\u002F undefined!\n\n\u002F\u002F CORRECT — use .value\nconst params = useParams({ from: '\u002Fposts\u002F$postId' })\nconsole.log(params.value.postId)\n",[4777],{"type":64,"tag":73,"props":4778,"children":4779},{"__ignoreMap":201},[4780,4788,4843,4879,4886,4894,4949],{"type":64,"tag":207,"props":4781,"children":4782},{"class":209,"line":210},[4783],{"type":64,"tag":207,"props":4784,"children":4785},{"style":276},[4786],{"type":70,"value":4787},"\u002F\u002F WRONG — accessing Ref without .value in script\n",{"type":64,"tag":207,"props":4789,"children":4790},{"class":209,"line":231},[4791,4795,4799,4803,4807,4811,4815,4819,4823,4827,4831,4835,4839],{"type":64,"tag":207,"props":4792,"children":4793},{"style":742},[4794],{"type":70,"value":1498},{"type":64,"tag":207,"props":4796,"children":4797},{"style":297},[4798],{"type":70,"value":2480},{"type":64,"tag":207,"props":4800,"children":4801},{"style":291},[4802],{"type":70,"value":755},{"type":64,"tag":207,"props":4804,"children":4805},{"style":451},[4806],{"type":70,"value":2441},{"type":64,"tag":207,"props":4808,"children":4809},{"style":297},[4810],{"type":70,"value":458},{"type":64,"tag":207,"props":4812,"children":4813},{"style":291},[4814],{"type":70,"value":1520},{"type":64,"tag":207,"props":4816,"children":4817},{"style":470},[4818],{"type":70,"value":310},{"type":64,"tag":207,"props":4820,"children":4821},{"style":291},[4822],{"type":70,"value":478},{"type":64,"tag":207,"props":4824,"children":4825},{"style":291},[4826],{"type":70,"value":315},{"type":64,"tag":207,"props":4828,"children":4829},{"style":220},[4830],{"type":70,"value":2209},{"type":64,"tag":207,"props":4832,"children":4833},{"style":291},[4834],{"type":70,"value":535},{"type":64,"tag":207,"props":4836,"children":4837},{"style":291},[4838],{"type":70,"value":305},{"type":64,"tag":207,"props":4840,"children":4841},{"style":297},[4842],{"type":70,"value":648},{"type":64,"tag":207,"props":4844,"children":4845},{"class":209,"line":328},[4846,4851,4855,4860,4865,4869,4874],{"type":64,"tag":207,"props":4847,"children":4848},{"style":297},[4849],{"type":70,"value":4850},"console",{"type":64,"tag":207,"props":4852,"children":4853},{"style":291},[4854],{"type":70,"value":1696},{"type":64,"tag":207,"props":4856,"children":4857},{"style":451},[4858],{"type":70,"value":4859},"log",{"type":64,"tag":207,"props":4861,"children":4862},{"style":297},[4863],{"type":70,"value":4864},"(params",{"type":64,"tag":207,"props":4866,"children":4867},{"style":291},[4868],{"type":70,"value":1696},{"type":64,"tag":207,"props":4870,"children":4871},{"style":297},[4872],{"type":70,"value":4873},"postId) ",{"type":64,"tag":207,"props":4875,"children":4876},{"style":276},[4877],{"type":70,"value":4878},"\u002F\u002F undefined!\n",{"type":64,"tag":207,"props":4880,"children":4881},{"class":209,"line":359},[4882],{"type":64,"tag":207,"props":4883,"children":4884},{"emptyLinePlaceholder":431},[4885],{"type":70,"value":434},{"type":64,"tag":207,"props":4887,"children":4888},{"class":209,"line":389},[4889],{"type":64,"tag":207,"props":4890,"children":4891},{"style":276},[4892],{"type":70,"value":4893},"\u002F\u002F CORRECT — use .value\n",{"type":64,"tag":207,"props":4895,"children":4896},{"class":209,"line":427},[4897,4901,4905,4909,4913,4917,4921,4925,4929,4933,4937,4941,4945],{"type":64,"tag":207,"props":4898,"children":4899},{"style":742},[4900],{"type":70,"value":1498},{"type":64,"tag":207,"props":4902,"children":4903},{"style":297},[4904],{"type":70,"value":2480},{"type":64,"tag":207,"props":4906,"children":4907},{"style":291},[4908],{"type":70,"value":755},{"type":64,"tag":207,"props":4910,"children":4911},{"style":451},[4912],{"type":70,"value":2441},{"type":64,"tag":207,"props":4914,"children":4915},{"style":297},[4916],{"type":70,"value":458},{"type":64,"tag":207,"props":4918,"children":4919},{"style":291},[4920],{"type":70,"value":1520},{"type":64,"tag":207,"props":4922,"children":4923},{"style":470},[4924],{"type":70,"value":310},{"type":64,"tag":207,"props":4926,"children":4927},{"style":291},[4928],{"type":70,"value":478},{"type":64,"tag":207,"props":4930,"children":4931},{"style":291},[4932],{"type":70,"value":315},{"type":64,"tag":207,"props":4934,"children":4935},{"style":220},[4936],{"type":70,"value":2209},{"type":64,"tag":207,"props":4938,"children":4939},{"style":291},[4940],{"type":70,"value":535},{"type":64,"tag":207,"props":4942,"children":4943},{"style":291},[4944],{"type":70,"value":305},{"type":64,"tag":207,"props":4946,"children":4947},{"style":297},[4948],{"type":70,"value":648},{"type":64,"tag":207,"props":4950,"children":4951},{"class":209,"line":437},[4952,4956,4960,4964,4968,4972,4977,4981],{"type":64,"tag":207,"props":4953,"children":4954},{"style":297},[4955],{"type":70,"value":4850},{"type":64,"tag":207,"props":4957,"children":4958},{"style":291},[4959],{"type":70,"value":1696},{"type":64,"tag":207,"props":4961,"children":4962},{"style":451},[4963],{"type":70,"value":4859},{"type":64,"tag":207,"props":4965,"children":4966},{"style":297},[4967],{"type":70,"value":4864},{"type":64,"tag":207,"props":4969,"children":4970},{"style":291},[4971],{"type":70,"value":1696},{"type":64,"tag":207,"props":4973,"children":4974},{"style":297},[4975],{"type":70,"value":4976},"value",{"type":64,"tag":207,"props":4978,"children":4979},{"style":291},[4980],{"type":70,"value":1696},{"type":64,"tag":207,"props":4982,"children":4983},{"style":297},[4984],{"type":70,"value":4985},"postId)\n",{"type":64,"tag":189,"props":4987,"children":4989},{"id":4988},"_2-high-confusing-with-vue-router-official",[4990],{"type":70,"value":4991},"2. HIGH: Confusing with vue-router (official)",{"type":64,"tag":82,"props":4993,"children":4994},{},[4995,5000,5002,5007,5009,5015,5017,5023,5024,5030,5031,5036,5038,5043],{"type":64,"tag":73,"props":4996,"children":4998},{"className":4997},[],[4999],{"type":70,"value":78},{"type":70,"value":5001}," is NOT ",{"type":64,"tag":73,"props":5003,"children":5005},{"className":5004},[],[5006],{"type":70,"value":4},{"type":70,"value":5008},". Do not use ",{"type":64,"tag":73,"props":5010,"children":5012},{"className":5011},[],[5013],{"type":70,"value":5014},"\u003Crouter-view>",{"type":70,"value":5016},", ",{"type":64,"tag":73,"props":5018,"children":5020},{"className":5019},[],[5021],{"type":70,"value":5022},"\u003Crouter-link>",{"type":70,"value":5016},{"type":64,"tag":73,"props":5025,"children":5027},{"className":5026},[],[5028],{"type":70,"value":5029},"useRoute()",{"type":70,"value":5016},{"type":64,"tag":73,"props":5032,"children":5034},{"className":5033},[],[5035],{"type":70,"value":1763},{"type":70,"value":5037}," from ",{"type":64,"tag":73,"props":5039,"children":5041},{"className":5040},[],[5042],{"type":70,"value":4},{"type":70,"value":1696},{"type":64,"tag":196,"props":5045,"children":5047},{"className":264,"code":5046,"language":266,"meta":201,"style":201},"\u002F\u002F WRONG — official vue-router imports\nimport { useRoute, useRouter } from 'vue-router'\n\n\u002F\u002F CORRECT — TanStack Vue Router imports\nimport { useMatch, useRouter } from '@tanstack\u002Fvue-router'\n",[5048],{"type":64,"tag":73,"props":5049,"children":5050},{"__ignoreMap":201},[5051,5059,5103,5110,5118],{"type":64,"tag":207,"props":5052,"children":5053},{"class":209,"line":210},[5054],{"type":64,"tag":207,"props":5055,"children":5056},{"style":276},[5057],{"type":70,"value":5058},"\u002F\u002F WRONG — official vue-router imports\n",{"type":64,"tag":207,"props":5060,"children":5061},{"class":209,"line":231},[5062,5066,5070,5075,5079,5083,5087,5091,5095,5099],{"type":64,"tag":207,"props":5063,"children":5064},{"style":285},[5065],{"type":70,"value":288},{"type":64,"tag":207,"props":5067,"children":5068},{"style":291},[5069],{"type":70,"value":294},{"type":64,"tag":207,"props":5071,"children":5072},{"style":297},[5073],{"type":70,"value":5074}," useRoute",{"type":64,"tag":207,"props":5076,"children":5077},{"style":291},[5078],{"type":70,"value":616},{"type":64,"tag":207,"props":5080,"children":5081},{"style":297},[5082],{"type":70,"value":1796},{"type":64,"tag":207,"props":5084,"children":5085},{"style":291},[5086],{"type":70,"value":305},{"type":64,"tag":207,"props":5088,"children":5089},{"style":285},[5090],{"type":70,"value":310},{"type":64,"tag":207,"props":5092,"children":5093},{"style":291},[5094],{"type":70,"value":315},{"type":64,"tag":207,"props":5096,"children":5097},{"style":220},[5098],{"type":70,"value":4},{"type":64,"tag":207,"props":5100,"children":5101},{"style":291},[5102],{"type":70,"value":325},{"type":64,"tag":207,"props":5104,"children":5105},{"class":209,"line":328},[5106],{"type":64,"tag":207,"props":5107,"children":5108},{"emptyLinePlaceholder":431},[5109],{"type":70,"value":434},{"type":64,"tag":207,"props":5111,"children":5112},{"class":209,"line":359},[5113],{"type":64,"tag":207,"props":5114,"children":5115},{"style":276},[5116],{"type":70,"value":5117},"\u002F\u002F CORRECT — TanStack Vue Router imports\n",{"type":64,"tag":207,"props":5119,"children":5120},{"class":209,"line":389},[5121,5125,5129,5133,5137,5141,5145,5149,5153,5157],{"type":64,"tag":207,"props":5122,"children":5123},{"style":285},[5124],{"type":70,"value":288},{"type":64,"tag":207,"props":5126,"children":5127},{"style":291},[5128],{"type":70,"value":294},{"type":64,"tag":207,"props":5130,"children":5131},{"style":297},[5132],{"type":70,"value":2701},{"type":64,"tag":207,"props":5134,"children":5135},{"style":291},[5136],{"type":70,"value":616},{"type":64,"tag":207,"props":5138,"children":5139},{"style":297},[5140],{"type":70,"value":1796},{"type":64,"tag":207,"props":5142,"children":5143},{"style":291},[5144],{"type":70,"value":305},{"type":64,"tag":207,"props":5146,"children":5147},{"style":285},[5148],{"type":70,"value":310},{"type":64,"tag":207,"props":5150,"children":5151},{"style":291},[5152],{"type":70,"value":315},{"type":64,"tag":207,"props":5154,"children":5155},{"style":220},[5156],{"type":70,"value":78},{"type":64,"tag":207,"props":5158,"children":5159},{"style":291},[5160],{"type":70,"value":325},{"type":64,"tag":189,"props":5162,"children":5164},{"id":5163},"_3-high-using-vue-hooks-in-beforeload-or-loader",[5165],{"type":70,"value":5166},"3. HIGH: Using Vue hooks in beforeLoad or loader",{"type":64,"tag":82,"props":5168,"children":5169},{},[5170,5175,5176,5182],{"type":64,"tag":73,"props":5171,"children":5173},{"className":5172},[],[5174],{"type":70,"value":2851},{"type":70,"value":1896},{"type":64,"tag":73,"props":5177,"children":5179},{"className":5178},[],[5180],{"type":70,"value":5181},"loader",{"type":70,"value":5183}," are NOT component setup functions — they are plain async functions. Vue composables cannot be used in them. Pass state via router context instead.",{"type":64,"tag":189,"props":5185,"children":5187},{"id":5186},"_4-medium-wrong-plugin-target",[5188],{"type":70,"value":5189},"4. MEDIUM: Wrong plugin target",{"type":64,"tag":82,"props":5191,"children":5192},{},[5193,5195,5201,5203,5209],{"type":70,"value":5194},"Must set ",{"type":64,"tag":73,"props":5196,"children":5198},{"className":5197},[],[5199],{"type":70,"value":5200},"target: 'vue'",{"type":70,"value":5202}," in the router plugin config. Default is ",{"type":64,"tag":73,"props":5204,"children":5206},{"className":5205},[],[5207],{"type":70,"value":5208},"'react'",{"type":70,"value":1696},{"type":64,"tag":182,"props":5211,"children":5213},{"id":5212},"cross-references",[5214],{"type":70,"value":5215},"Cross-References",{"type":64,"tag":2800,"props":5217,"children":5218},{},[5219],{"type":64,"tag":2804,"props":5220,"children":5221},{},[5222,5227],{"type":64,"tag":88,"props":5223,"children":5224},{"href":90},[5225],{"type":70,"value":5226},"router-core\u002FSKILL.md",{"type":70,"value":5228}," — all sub-skills for domain-specific patterns (search params, data loading, navigation, auth, SSR, etc.)",{"type":64,"tag":5230,"props":5231,"children":5232},"style",{},[5233],{"type":70,"value":5234},"html .light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html.light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html .default .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html.dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}",{"items":5236,"total":5376},[5237,5251,5263,5275,5290,5302,5312,5322,5335,5345,5356,5366],{"slug":5238,"name":5238,"fn":5239,"description":5240,"org":5241,"tags":5242,"stars":5248,"repoUrl":5249,"updatedAt":5250},"aggregation","perform data aggregation in TanStack Table","Aggregate TanStack Table columns independently of grouping, including grand totals, caller-selected row totals, multiple keyed aggregations, custom context-based definitions, grouped merges, manual values, and worker constraints.\n",{"slug":8,"name":9,"logoUrl":10,"githubOrg":9},[5243,5246,5247],{"name":5244,"slug":5245,"type":15},"Data Analysis","data-analysis",{"name":24,"slug":25,"type":15},{"name":9,"slug":8,"type":15},28175,"https:\u002F\u002Fgithub.com\u002FTanStack\u002Ftable","2026-07-30T05:25:59.429787",{"slug":5252,"name":5252,"fn":5253,"description":5254,"org":5255,"tags":5256,"stars":5248,"repoUrl":5249,"updatedAt":5262},"api-not-found","diagnose TanStack Table API errors","Diagnose missing TanStack Table v9 exports, options, state slices, and instance methods. Load before inventing an API when code sees a type error, undefined feature method, absent object key, adapter mismatch, or v8-shaped example.\n",{"slug":8,"name":9,"logoUrl":10,"githubOrg":9},[5257,5260,5261],{"name":5258,"slug":5259,"type":15},"Debugging","debugging",{"name":24,"slug":25,"type":15},{"name":9,"slug":8,"type":15},"2026-07-30T05:26:05.418735",{"slug":5264,"name":5264,"fn":5265,"description":5266,"org":5267,"tags":5268,"stars":5248,"repoUrl":5249,"updatedAt":5274},"cell-selection","select rectangular cell ranges in tables","Select rectangular cell ranges with cellSelectionFeature: two-corner range state keyed by row and column id, mousedown\u002Fmouseenter handlers, selection edges, render-order resolution under pinning, and autoResetCellSelection. Load when ranges widen unexpectedly after sorting or column reordering, when a drag re-renders the whole table, or when building copy-to-clipboard from a selection.\n",{"slug":8,"name":9,"logoUrl":10,"githubOrg":9},[5269,5270,5271],{"name":5244,"slug":5245,"type":15},{"name":9,"slug":8,"type":15},{"name":5272,"slug":5273,"type":15},"UI Components","ui-components","2026-07-30T05:25:38.403427",{"slug":5276,"name":5276,"fn":5277,"description":5278,"org":5279,"tags":5280,"stars":5248,"repoUrl":5249,"updatedAt":5289},"client-vs-server","manage TanStack Table data pipelines","Choose client or server ownership for filtering, grouping, sorting, expanding, and pagination in TanStack Table v9. Load for manual* flags, mixed pipelines, server counts, or deciding which dataset each row-model stage receives.\n",{"slug":8,"name":9,"logoUrl":10,"githubOrg":9},[5281,5284,5285,5288],{"name":5282,"slug":5283,"type":15},"Data Pipeline","data-pipeline",{"name":24,"slug":25,"type":15},{"name":5286,"slug":5287,"type":15},"Performance","performance",{"name":9,"slug":8,"type":15},"2026-07-30T05:25:45.400104",{"slug":5291,"name":5291,"fn":5292,"description":5293,"org":5294,"tags":5295,"stars":5248,"repoUrl":5249,"updatedAt":5301},"column-faceting","build faceted filter UIs","Build faceted filter UIs with columnFacetingFeature, facetedRowModel, facetedUniqueValues, and facetedMinMaxValues. Load for facet counts, numeric ranges, own-filter exclusion, or server-page facet completeness.\n",{"slug":8,"name":9,"logoUrl":10,"githubOrg":9},[5296,5299,5300],{"name":5297,"slug":5298,"type":15},"Data Visualization","data-visualization",{"name":24,"slug":25,"type":15},{"name":9,"slug":8,"type":15},"2026-07-30T05:25:41.397257",{"slug":5303,"name":5303,"fn":5304,"description":5305,"org":5306,"tags":5307,"stars":5248,"repoUrl":5249,"updatedAt":5311},"column-filtering","implement column filtering in TanStack Table","Filter columns with columnFilteringFeature, filteredRowModel, filterFns, filterMeta, nested-row direction, and manualFiltering. Load for accessor compatibility, controlled filter updaters, fuzzy metadata, or client\u002Fserver ownership.\n",{"slug":8,"name":9,"logoUrl":10,"githubOrg":9},[5308,5309,5310],{"name":5244,"slug":5245,"type":15},{"name":24,"slug":25,"type":15},{"name":9,"slug":8,"type":15},"2026-07-30T05:25:53.391632",{"slug":5313,"name":5313,"fn":5314,"description":5315,"org":5316,"tags":5317,"stars":5248,"repoUrl":5249,"updatedAt":5321},"column-ordering","manage TanStack Table column ordering","Control TanStack Table v9 leaf columnOrder with stable IDs while accounting for pinning regions, visibility, and groupedColumnMode precedence. Load for drag-and-drop columns or rendered order that differs from state.\n",{"slug":8,"name":9,"logoUrl":10,"githubOrg":9},[5318,5319,5320],{"name":24,"slug":25,"type":15},{"name":9,"slug":8,"type":15},{"name":5272,"slug":5273,"type":15},"2026-07-30T05:26:03.37801",{"slug":5323,"name":5323,"fn":5324,"description":5325,"org":5326,"tags":5327,"stars":5248,"repoUrl":5249,"updatedAt":5334},"column-pinning","configure column pinning in TanStack Table","Pin columns into logical start, center, and end regions with columnPinningFeature and renderer-owned sticky CSS. Load for RTL offsets, z-index, backgrounds, overflow, widths, gaps, or overlaps.\n",{"slug":8,"name":9,"logoUrl":10,"githubOrg":9},[5328,5331,5332,5333],{"name":5329,"slug":5330,"type":15},"CSS","css",{"name":24,"slug":25,"type":15},{"name":9,"slug":8,"type":15},{"name":5272,"slug":5273,"type":15},"2026-07-30T05:25:55.377366",{"slug":5336,"name":5336,"fn":5337,"description":5338,"org":5339,"tags":5340,"stars":5248,"repoUrl":5249,"updatedAt":5344},"column-resizing","implement column resizing in TanStack Table","Wire columnResizingFeature, header.getResizeHandler, resize mode and direction, pointer or touch events, and performant CSS-variable updates. Load when resize state changes but widths do not, or large tables resize slowly.\n",{"slug":8,"name":9,"logoUrl":10,"githubOrg":9},[5341,5342,5343],{"name":24,"slug":25,"type":15},{"name":9,"slug":8,"type":15},{"name":5272,"slug":5273,"type":15},"2026-07-30T05:25:51.400011",{"slug":5346,"name":5346,"fn":5347,"description":5348,"org":5349,"tags":5350,"stars":5248,"repoUrl":5249,"updatedAt":5355},"column-sizing","configure column sizing in TanStack Table","Use columnSizingFeature numeric size, minSize, maxSize, getSize, getStart, getAfter, and total-size APIs in table, grid, or flex CSS. Load for auto or percentage misconceptions and sizing\u002Fpinning layout mismatch.\n",{"slug":8,"name":9,"logoUrl":10,"githubOrg":9},[5351,5352,5353,5354],{"name":5329,"slug":5330,"type":15},{"name":24,"slug":25,"type":15},{"name":9,"slug":8,"type":15},{"name":5272,"slug":5273,"type":15},"2026-07-30T05:25:48.703799",{"slug":5357,"name":5357,"fn":5358,"description":5359,"org":5360,"tags":5361,"stars":5248,"repoUrl":5249,"updatedAt":5365},"column-visibility","manage column visibility in TanStack Table","Hide columns with columnVisibilityFeature while rendering visibility-aware header, column, and cell collections. Load when hidden columns remain in the DOM, false-versus-absent state is confused, or enableHiding is misunderstood.\n",{"slug":8,"name":9,"logoUrl":10,"githubOrg":9},[5362,5363,5364],{"name":24,"slug":25,"type":15},{"name":9,"slug":8,"type":15},{"name":5272,"slug":5273,"type":15},"2026-07-30T05:25:47.367943",{"slug":5367,"name":5367,"fn":5368,"description":5369,"org":5370,"tags":5371,"stars":5248,"repoUrl":5249,"updatedAt":5375},"core","build data grids with TanStack Table","Use TanStack Table v9 as a headless data-grid state and row-processing engine. Load for first-table architecture, stable data and columns, row numbering with getDisplayIndex, semantic rendering, framework adapter choice, or deciding what Table owns versus the renderer.\n",{"slug":8,"name":9,"logoUrl":10,"githubOrg":9},[5372,5373,5374],{"name":5244,"slug":5245,"type":15},{"name":24,"slug":25,"type":15},{"name":5272,"slug":5273,"type":15},"2026-07-30T05:25:52.366295",125,{"items":5378,"total":5478},[5379,5392,5407,5421,5434,5453,5464],{"slug":5380,"name":5380,"fn":5381,"description":5382,"org":5383,"tags":5384,"stars":26,"repoUrl":27,"updatedAt":5391},"auth-and-guards","implement route protection in TanStack Router","Route protection with beforeLoad, redirect()\u002Fthrow redirect(), isRedirect helper, authenticated layout routes (_authenticated), non-redirect auth (inline login), RBAC with roles and permissions, auth provider integration (Auth0, Clerk, Supabase), router context for auth state.",{"slug":8,"name":9,"logoUrl":10,"githubOrg":9},[5385,5387,5388,5389,5390],{"name":5386,"slug":4567,"type":15},"Auth",{"name":24,"slug":25,"type":15},{"name":20,"slug":21,"type":15},{"name":9,"slug":8,"type":15},{"name":13,"slug":14,"type":15},"2026-07-30T05:27:07.639032",{"slug":5393,"name":5393,"fn":5394,"description":5395,"org":5396,"tags":5397,"stars":26,"repoUrl":27,"updatedAt":5406},"auth-server-primitives","implement server-side authentication primitives","Server-side authentication primitives for TanStack Start: session cookies (HttpOnly, Secure, SameSite, __Host- prefix), session read\u002Fissue\u002Fdestroy via createServerFn and middleware, OAuth authorization-code flow with state and PKCE, password-reset enumeration defense, CSRF for non-GET RPCs, rate limiting auth endpoints, session rotation on privilege change. Pairs with router-core\u002Fauth-and-guards for the routing side.",{"slug":8,"name":9,"logoUrl":10,"githubOrg":9},[5398,5399,5402,5405],{"name":5386,"slug":4567,"type":15},{"name":5400,"slug":5401,"type":15},"OAuth","oauth",{"name":5403,"slug":5404,"type":15},"Security","security",{"name":9,"slug":8,"type":15},"2026-07-30T05:26:59.504396",{"slug":5408,"name":5408,"fn":5409,"description":5410,"org":5411,"tags":5412,"stars":26,"repoUrl":27,"updatedAt":5420},"code-splitting","configure code splitting in TanStack Router","Automatic code splitting (autoCodeSplitting), .lazy.tsx convention, createLazyFileRoute, createLazyRoute, lazyRouteComponent, getRouteApi for typed hooks in split files, codeSplitGroupings per-route override, splitBehavior programmatic config, critical vs non-critical properties.",{"slug":8,"name":9,"logoUrl":10,"githubOrg":9},[5413,5416,5417,5418,5419],{"name":5414,"slug":5415,"type":15},"Engineering","engineering",{"name":24,"slug":25,"type":15},{"name":5286,"slug":5287,"type":15},{"name":9,"slug":8,"type":15},{"name":13,"slug":14,"type":15},"2026-07-30T05:27:11.494406",{"slug":5422,"name":5422,"fn":5423,"description":5424,"org":5425,"tags":5426,"stars":26,"repoUrl":27,"updatedAt":5433},"data-loading","manage data loading in TanStack Router","Route loader option, loaderDeps for cache keys, staleTime\u002FgcTime\u002F defaultPreloadStaleTime SWR caching, pendingComponent\u002FpendingMs\u002F pendingMinMs, errorComponent\u002FonError\u002FonCatch, beforeLoad, router context and createRootRouteWithContext DI pattern, router.invalidate, Await component, deferred data loading with unawaited promises.",{"slug":8,"name":9,"logoUrl":10,"githubOrg":9},[5427,5430,5431,5432],{"name":5428,"slug":5429,"type":15},"Caching","caching",{"name":5286,"slug":5287,"type":15},{"name":9,"slug":8,"type":15},{"name":13,"slug":14,"type":15},"2026-07-30T05:26:54.487943",{"slug":5435,"name":5435,"fn":5436,"description":5437,"org":5438,"tags":5439,"stars":26,"repoUrl":27,"updatedAt":5452},"deployment","deploy TanStack Start applications","Deploy to Cloudflare Workers, Netlify, Vercel, Node.js\u002FDocker, Bun, Railway. Selective SSR (ssr option per route), SPA mode, static prerendering, ISR with Cache-Control headers, SEO and head management.",{"slug":8,"name":9,"logoUrl":10,"githubOrg":9},[5440,5443,5445,5448,5449],{"name":5441,"slug":5442,"type":15},"Cloudflare","cloudflare",{"name":5444,"slug":5435,"type":15},"Deployment",{"name":5446,"slug":5447,"type":15},"Netlify","netlify",{"name":9,"slug":8,"type":15},{"name":5450,"slug":5451,"type":15},"Vercel","vercel","2026-07-30T05:26:50.509927",{"slug":5454,"name":5454,"fn":5455,"description":5456,"org":5457,"tags":5458,"stars":26,"repoUrl":27,"updatedAt":5463},"execution-model","manage isomorphic execution models","Isomorphic-by-default principle, environment boundary functions (createServerFn, createServerOnlyFn, createClientOnlyFn, createIsomorphicFn), ClientOnly component, useHydrated hook, import protection, dead code elimination, environment variable safety (VITE_ prefix, process.env).",{"slug":8,"name":9,"logoUrl":10,"githubOrg":9},[5459,5462],{"name":5460,"slug":5461,"type":15},"Architecture","architecture",{"name":9,"slug":8,"type":15},"2026-07-30T05:27:04.558441",{"slug":5465,"name":5465,"fn":5466,"description":5467,"org":5468,"tags":5469,"stars":26,"repoUrl":27,"updatedAt":5477},"middleware","implement TanStack Router middleware","createMiddleware, request middleware (.server only), server function middleware (.client + .server), context passing via next({ context }), sendContext for client-server transfer, global middleware via createStart in src\u002Fstart.ts, middleware factories, method order enforcement, fetch override precedence.",{"slug":8,"name":9,"logoUrl":10,"githubOrg":9},[5470,5473,5474,5476],{"name":5471,"slug":5472,"type":15},"Backend","backend",{"name":24,"slug":25,"type":15},{"name":5475,"slug":5465,"type":15},"Middleware",{"name":9,"slug":8,"type":15},"2026-07-30T05:26:58.546019",30]