[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"skill-tanstack-meta-framework":3,"mdc-y4m7iu-key":37,"related-repo-tanstack-meta-framework":5552,"related-org-tanstack-meta-framework":5644},{"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":32,"sourceUrl":35,"mdContent":36},"meta-framework","integrate TanStack DB with meta-frameworks","Integrating TanStack DB with meta-frameworks (TanStack Start, Next.js, Remix, Nuxt, SvelteKit). Client-side only: SSR is NOT supported — routes must disable SSR. Preloading eager collections in route loaders with collection.preload(). On-demand Query Collections require preloading the live query because source collection preload is a no-op. Multiple collection preloading with Promise.all. Framework-specific loader APIs.\n",{"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,25],{"name":13,"slug":14,"type":15},"Nuxt","nuxt","tag",{"name":17,"slug":18,"type":15},"SvelteKit","sveltekit",{"name":20,"slug":21,"type":15},"Next.js","next-js",{"name":23,"slug":24,"type":15},"Database","database",{"name":9,"slug":8,"type":15},3811,"https:\u002F\u002Fgithub.com\u002FTanStack\u002Fdb","2026-07-26T05:48:59.452568",null,245,[],{"repoUrl":27,"stars":26,"forks":30,"topics":33,"description":34},[],"The reactive client store for your API.","https:\u002F\u002Fgithub.com\u002FTanStack\u002Fdb\u002Ftree\u002FHEAD\u002Fpackages\u002Fdb\u002Fskills\u002Fmeta-framework","---\nname: meta-framework\ndescription: >\n  Integrating TanStack DB with meta-frameworks (TanStack Start, Next.js,\n  Remix, Nuxt, SvelteKit). Client-side only: SSR is NOT supported — routes\n  must disable SSR. Preloading eager collections in route loaders with\n  collection.preload(). On-demand Query Collections require preloading the\n  live query because source collection preload is a no-op. Multiple collection\n  preloading with Promise.all. Framework-specific loader APIs.\ntype: composition\nlibrary: db\nlibrary_version: '0.6.0'\nrequires:\n  - db-core\n  - db-core\u002Fcollection-setup\nsources:\n  - 'TanStack\u002Fdb:examples\u002Freact\u002Ftodo\u002Fsrc\u002Froutes\u002Felectric.tsx'\n  - 'TanStack\u002Fdb:examples\u002Freact\u002Ftodo\u002Fsrc\u002Froutes\u002Fquery.tsx'\n  - 'TanStack\u002Fdb:examples\u002Freact\u002Ftodo\u002Fsrc\u002Fstart.tsx'\n---\n\nThis skill builds on db-core. Read it first for collection setup and query builder.\n\n# TanStack DB — Meta-Framework Integration\n\n## Setup\n\nTanStack DB collections are **client-side only**. SSR is not implemented. Routes using TanStack DB **must disable SSR**. The setup pattern is:\n\n1. Set `ssr: false` on the route\n2. Preload the eager collection, or preload the live query for an on-demand source\n3. Use `useLiveQuery` in the component\n\n## TanStack Start\n\n### Global SSR disable\n\n```ts\n\u002F\u002F start.tsx\nimport { createStart } from '@tanstack\u002Freact-start'\n\nexport const startInstance = createStart(() => {\n  return {\n    defaultSsr: false,\n  }\n})\n```\n\n### Per-route SSR disable + preload\n\n```tsx\nimport { createFileRoute } from '@tanstack\u002Freact-router'\nimport { useLiveQuery } from '@tanstack\u002Freact-db'\n\nexport const Route = createFileRoute('\u002Ftodos')({\n  ssr: false,\n  loader: async () => {\n    await todoCollection.preload()\n    return null\n  },\n  component: TodoPage,\n})\n\nfunction TodoPage() {\n  const { data: todos } = useLiveQuery((q) => q.from({ todo: todoCollection }))\n  return (\n    \u003Cul>\n      {todos.map((t) => (\n        \u003Cli key={t.id}>{t.text}\u003C\u002Fli>\n      ))}\n    \u003C\u002Ful>\n  )\n}\n```\n\n### On-demand Query Collection preload\n\nCalling `preload()` on an on-demand source collection is a no-op. Define the\nlive query once, preload it in the loader, and pass that same collection to the\nframework hook:\n\n```tsx\nimport { createLiveQueryCollection, eq } from '@tanstack\u002Fdb'\nimport { useLiveQuery } from '@tanstack\u002Freact-db'\n\nconst activeTodos = createLiveQueryCollection((q) =>\n  q\n    .from({ todo: todoCollection })\n    .where(({ todo }) => eq(todo.completed, false)),\n)\n\nexport const Route = createFileRoute('\u002Ftodos')({\n  ssr: false,\n  loader: async () => {\n    await activeTodos.preload()\n    return null\n  },\n  component: () => {\n    const { data } = useLiveQuery(activeTodos)\n    \u002F\u002F ...\n  },\n})\n```\n\n### Multiple collection preloading\n\n```tsx\nexport const Route = createFileRoute('\u002Felectric')({\n  ssr: false,\n  loader: async () => {\n    await Promise.all([todoCollection.preload(), configCollection.preload()])\n    return null\n  },\n  component: ElectricPage,\n})\n```\n\n## Next.js (App Router)\n\n### Client component with preloading\n\n```tsx\n\u002F\u002F app\u002Ftodos\u002Fpage.tsx\n'use client'\n\nimport { useEffect, useState } from 'react'\nimport { useLiveQuery } from '@tanstack\u002Freact-db'\n\nexport default function TodoPage() {\n  const { data: todos, isLoading } = useLiveQuery((q) =>\n    q.from({ todo: todoCollection }),\n  )\n\n  if (isLoading) return \u003Cdiv>Loading...\u003C\u002Fdiv>\n  return (\n    \u003Cul>\n      {todos.map((t) => (\n        \u003Cli key={t.id}>{t.text}\u003C\u002Fli>\n      ))}\n    \u003C\u002Ful>\n  )\n}\n```\n\nNext.js App Router components using TanStack DB must be client components (`'use client'`). There is no server-side preloading — collections sync on mount.\n\n### With route-level preloading (experimental)\n\n```tsx\n\u002F\u002F app\u002Ftodos\u002Fpage.tsx\n'use client'\n\nimport { useEffect } from 'react'\nimport { useLiveQuery } from '@tanstack\u002Freact-db'\n\n\u002F\u002F Trigger preload immediately when module is loaded\nconst preloadPromise = todoCollection.preload()\n\nexport default function TodoPage() {\n  const { data: todos } = useLiveQuery((q) => q.from({ todo: todoCollection }))\n  return (\n    \u003Cul>\n      {todos.map((t) => (\n        \u003Cli key={t.id}>{t.text}\u003C\u002Fli>\n      ))}\n    \u003C\u002Ful>\n  )\n}\n```\n\n## Remix\n\n### Client loader pattern\n\n```tsx\n\u002F\u002F app\u002Froutes\u002Ftodos.tsx\nimport { useLiveQuery } from '@tanstack\u002Freact-db'\nimport type { ClientLoaderFunctionArgs } from '@remix-run\u002Freact'\n\nexport const clientLoader = async ({ request }: ClientLoaderFunctionArgs) => {\n  await todoCollection.preload()\n  return null\n}\n\n\u002F\u002F Prevent server loader from running\nexport const loader = () => null\n\nexport default function TodoPage() {\n  const { data: todos } = useLiveQuery((q) => q.from({ todo: todoCollection }))\n  return (\n    \u003Cul>\n      {todos.map((t) => (\n        \u003Cli key={t.id}>{t.text}\u003C\u002Fli>\n      ))}\n    \u003C\u002Ful>\n  )\n}\n```\n\n## Nuxt\n\n### Client-only component\n\n```vue\n\u003C!-- pages\u002Ftodos.vue -->\n\u003Cscript setup lang=\"ts\">\nimport { useLiveQuery } from '@tanstack\u002Fvue-db'\n\nconst { data: todos, isLoading } = useLiveQuery((q) =>\n  q.from({ todo: todoCollection }),\n)\n\u003C\u002Fscript>\n\n\u003Ctemplate>\n  \u003CClientOnly>\n    \u003Cdiv v-if=\"isLoading\">Loading...\u003C\u002Fdiv>\n    \u003Cul v-else>\n      \u003Cli v-for=\"todo in todos\" :key=\"todo.id\">{{ todo.text }}\u003C\u002Fli>\n    \u003C\u002Ful>\n  \u003C\u002FClientOnly>\n\u003C\u002Ftemplate>\n```\n\nWrap TanStack DB components in `\u003CClientOnly>` to prevent SSR.\n\n## SvelteKit\n\n### Client-side only page\n\n```svelte\n\u003C!-- src\u002Froutes\u002Ftodos\u002F+page.svelte -->\n\u003Cscript lang=\"ts\">\n  import { browser } from '$app\u002Fenvironment'\n  import { useLiveQuery } from '@tanstack\u002Fsvelte-db'\n\n  const todosQuery = browser\n    ? useLiveQuery((q) => q.from({ todo: todoCollection }))\n    : null\n\u003C\u002Fscript>\n\n{#if todosQuery}\n  {#each todosQuery.data as todo (todo.id)}\n    \u003Cli>{todo.text}\u003C\u002Fli>\n  {\u002Feach}\n{\u002Fif}\n```\n\nOr disable SSR for the route:\n\n```ts\n\u002F\u002F src\u002Froutes\u002Ftodos\u002F+page.ts\nexport const ssr = false\n```\n\n## Core Patterns\n\n### What preload() does\n\nFor eager collections, `collection.preload()` starts the sync process and\nreturns a promise that resolves when the collection reaches \"ready\" status.\nThis means:\n\n1. The sync function connects to the backend\n2. Initial data is fetched and written to the collection\n3. `markReady()` is called by the adapter\n4. The promise resolves\n\nSubsequent calls to `preload()` on an already-ready collection return immediately.\n\nFor on-demand collections, source `collection.preload()` warns and does\nnothing because no subset has been requested. Create the required live query\nand await `liveQuery.preload()`.\n\n### Collection module pattern\n\nDefine collections in a shared module, import in both loaders and components:\n\n```ts\n\u002F\u002F lib\u002Fcollections.ts\nimport { createCollection, queryCollectionOptions } from '@tanstack\u002Freact-db'\n\nexport const todoCollection = createCollection(\n  queryCollectionOptions({ ... })\n)\n```\n\n```tsx\n\u002F\u002F routes\u002Ftodos.tsx — loader uses the same collection instance\nimport { todoCollection } from '..\u002Flib\u002Fcollections'\n\nexport const Route = createFileRoute('\u002Ftodos')({\n  ssr: false,\n  loader: async () => {\n    await todoCollection.preload()\n    return null\n  },\n  component: () => {\n    const { data } = useLiveQuery((q) => q.from({ todo: todoCollection }))\n    \u002F\u002F ...\n  },\n})\n```\n\n## Server-Side Integration\n\nThis skill covers the **client-side** read path only (preloading, live queries). For server-side concerns:\n\n- **Electric proxy route** (forwarding shape requests to Electric) — see the [Electric adapter reference](..\u002Fdb-core\u002Fcollection-setup\u002Freferences\u002Felectric-adapter.md)\n- **Mutation endpoints** (`createServerFn` in TanStack Start, API routes in Next.js\u002FRemix) — implement using your framework's server function pattern. See the Electric adapter reference for the txid handshake that mutations must return.\n\n## Common Mistakes\n\n### CRITICAL Enabling SSR with TanStack DB\n\nWrong:\n\n```tsx\nexport const Route = createFileRoute('\u002Ftodos')({\n  loader: async () => {\n    await todoCollection.preload()\n    return null\n  },\n})\n```\n\nCorrect:\n\n```tsx\nexport const Route = createFileRoute('\u002Ftodos')({\n  ssr: false,\n  loader: async () => {\n    await todoCollection.preload()\n    return null\n  },\n})\n```\n\nTanStack DB collections are client-side only. Without `ssr: false`, the route loader runs on the server where collections cannot sync, causing hangs or errors.\n\nSource: examples\u002Freact\u002Ftodo\u002Fsrc\u002Fstart.tsx\n\n### HIGH Forgetting to preload in route loader\n\nWrong:\n\n```tsx\nexport const Route = createFileRoute('\u002Ftodos')({\n  ssr: false,\n  component: TodoPage,\n})\n```\n\nCorrect:\n\n```tsx\nexport const Route = createFileRoute('\u002Ftodos')({\n  ssr: false,\n  loader: async () => {\n    await todoCollection.preload()\n    return null\n  },\n  component: TodoPage,\n})\n```\n\nWithout preloading, the collection starts syncing only when the component mounts, causing a loading flash. Preloading in the route loader starts sync during navigation, making data available immediately when the component renders.\n\n### MEDIUM Creating separate collection instances\n\nWrong:\n\n```tsx\n\u002F\u002F routes\u002Ftodos.tsx\nconst todoCollection = createCollection(queryCollectionOptions({ ... }))\n\nexport const Route = createFileRoute('\u002Ftodos')({\n  ssr: false,\n  loader: async () => { await todoCollection.preload() },\n  component: () => {\n    const { data } = useLiveQuery((q) => q.from({ todo: todoCollection }))\n  },\n})\n```\n\nCorrect:\n\n```ts\n\u002F\u002F lib\u002Fcollections.ts — single shared instance\nexport const todoCollection = createCollection(queryCollectionOptions({ ... }))\n```\n\nCollections are singletons. Creating multiple instances for the same data causes duplicate syncs, wasted bandwidth, and inconsistent state between components.\n\nSee also: react-db\u002FSKILL.md, vue-db\u002FSKILL.md, svelte-db\u002FSKILL.md, solid-db\u002FSKILL.md, angular-db\u002FSKILL.md — for framework-specific hook usage.\n\nSee also: db-core\u002Fcollection-setup\u002FSKILL.md — for collection creation and adapter selection.\n",{"data":38,"body":49},{"name":4,"description":6,"type":39,"library":40,"library_version":41,"requires":42,"sources":45},"composition","db","0.6.0",[43,44],"db-core","db-core\u002Fcollection-setup",[46,47,48],"TanStack\u002Fdb:examples\u002Freact\u002Ftodo\u002Fsrc\u002Froutes\u002Felectric.tsx","TanStack\u002Fdb:examples\u002Freact\u002Ftodo\u002Fsrc\u002Froutes\u002Fquery.tsx","TanStack\u002Fdb:examples\u002Freact\u002Ftodo\u002Fsrc\u002Fstart.tsx",{"type":50,"children":51},"root",[52,60,67,74,94,131,137,144,337,343,950,956,969,1464,1470,1686,1692,1698,2208,2221,2227,2677,2683,2689,3229,3233,3239,3712,3725,3729,3735,3862,3867,3907,3913,3919,3932,3961,3973,3992,3998,4003,4134,4461,4467,4479,4516,4522,4528,4533,4666,4671,4823,4835,4840,4846,4850,4953,4957,5128,5133,5139,5143,5461,5465,5531,5536,5541,5546],{"type":53,"tag":54,"props":55,"children":56},"element","p",{},[57],{"type":58,"value":59},"text","This skill builds on db-core. Read it first for collection setup and query builder.",{"type":53,"tag":61,"props":62,"children":64},"h1",{"id":63},"tanstack-db-meta-framework-integration",[65],{"type":58,"value":66},"TanStack DB — Meta-Framework Integration",{"type":53,"tag":68,"props":69,"children":71},"h2",{"id":70},"setup",[72],{"type":58,"value":73},"Setup",{"type":53,"tag":54,"props":75,"children":76},{},[77,79,85,87,92],{"type":58,"value":78},"TanStack DB collections are ",{"type":53,"tag":80,"props":81,"children":82},"strong",{},[83],{"type":58,"value":84},"client-side only",{"type":58,"value":86},". SSR is not implemented. Routes using TanStack DB ",{"type":53,"tag":80,"props":88,"children":89},{},[90],{"type":58,"value":91},"must disable SSR",{"type":58,"value":93},". The setup pattern is:",{"type":53,"tag":95,"props":96,"children":97},"ol",{},[98,113,118],{"type":53,"tag":99,"props":100,"children":101},"li",{},[102,104,111],{"type":58,"value":103},"Set ",{"type":53,"tag":105,"props":106,"children":108},"code",{"className":107},[],[109],{"type":58,"value":110},"ssr: false",{"type":58,"value":112}," on the route",{"type":53,"tag":99,"props":114,"children":115},{},[116],{"type":58,"value":117},"Preload the eager collection, or preload the live query for an on-demand source",{"type":53,"tag":99,"props":119,"children":120},{},[121,123,129],{"type":58,"value":122},"Use ",{"type":53,"tag":105,"props":124,"children":126},{"className":125},[],[127],{"type":58,"value":128},"useLiveQuery",{"type":58,"value":130}," in the component",{"type":53,"tag":68,"props":132,"children":134},{"id":133},"tanstack-start",[135],{"type":58,"value":136},"TanStack Start",{"type":53,"tag":138,"props":139,"children":141},"h3",{"id":140},"global-ssr-disable",[142],{"type":58,"value":143},"Global SSR disable",{"type":53,"tag":145,"props":146,"children":151},"pre",{"className":147,"code":148,"language":149,"meta":150,"style":150},"language-ts shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","\u002F\u002F start.tsx\nimport { createStart } from '@tanstack\u002Freact-start'\n\nexport const startInstance = createStart(() => {\n  return {\n    defaultSsr: false,\n  }\n})\n","ts","",[152],{"type":53,"tag":105,"props":153,"children":154},{"__ignoreMap":150},[155,167,215,225,275,288,314,323],{"type":53,"tag":156,"props":157,"children":160},"span",{"class":158,"line":159},"line",1,[161],{"type":53,"tag":156,"props":162,"children":164},{"style":163},"--shiki-light:#90A4AE;--shiki-light-font-style:italic;--shiki-default:#546E7A;--shiki-default-font-style:italic;--shiki-dark:#676E95;--shiki-dark-font-style:italic",[165],{"type":58,"value":166},"\u002F\u002F start.tsx\n",{"type":53,"tag":156,"props":168,"children":170},{"class":158,"line":169},2,[171,177,183,189,194,199,204,210],{"type":53,"tag":156,"props":172,"children":174},{"style":173},"--shiki-light:#39ADB5;--shiki-light-font-style:italic;--shiki-default:#89DDFF;--shiki-default-font-style:italic;--shiki-dark:#89DDFF;--shiki-dark-font-style:italic",[175],{"type":58,"value":176},"import",{"type":53,"tag":156,"props":178,"children":180},{"style":179},"--shiki-light:#39ADB5;--shiki-default:#89DDFF;--shiki-dark:#89DDFF",[181],{"type":58,"value":182}," {",{"type":53,"tag":156,"props":184,"children":186},{"style":185},"--shiki-light:#90A4AE;--shiki-default:#EEFFFF;--shiki-dark:#BABED8",[187],{"type":58,"value":188}," createStart",{"type":53,"tag":156,"props":190,"children":191},{"style":179},[192],{"type":58,"value":193}," }",{"type":53,"tag":156,"props":195,"children":196},{"style":173},[197],{"type":58,"value":198}," from",{"type":53,"tag":156,"props":200,"children":201},{"style":179},[202],{"type":58,"value":203}," '",{"type":53,"tag":156,"props":205,"children":207},{"style":206},"--shiki-light:#91B859;--shiki-default:#C3E88D;--shiki-dark:#C3E88D",[208],{"type":58,"value":209},"@tanstack\u002Freact-start",{"type":53,"tag":156,"props":211,"children":212},{"style":179},[213],{"type":58,"value":214},"'\n",{"type":53,"tag":156,"props":216,"children":218},{"class":158,"line":217},3,[219],{"type":53,"tag":156,"props":220,"children":222},{"emptyLinePlaceholder":221},true,[223],{"type":58,"value":224},"\n",{"type":53,"tag":156,"props":226,"children":228},{"class":158,"line":227},4,[229,234,240,245,250,255,260,265,270],{"type":53,"tag":156,"props":230,"children":231},{"style":173},[232],{"type":58,"value":233},"export",{"type":53,"tag":156,"props":235,"children":237},{"style":236},"--shiki-light:#9C3EDA;--shiki-default:#C792EA;--shiki-dark:#C792EA",[238],{"type":58,"value":239}," const",{"type":53,"tag":156,"props":241,"children":242},{"style":185},[243],{"type":58,"value":244}," startInstance ",{"type":53,"tag":156,"props":246,"children":247},{"style":179},[248],{"type":58,"value":249},"=",{"type":53,"tag":156,"props":251,"children":253},{"style":252},"--shiki-light:#6182B8;--shiki-default:#82AAFF;--shiki-dark:#82AAFF",[254],{"type":58,"value":188},{"type":53,"tag":156,"props":256,"children":257},{"style":185},[258],{"type":58,"value":259},"(",{"type":53,"tag":156,"props":261,"children":262},{"style":179},[263],{"type":58,"value":264},"()",{"type":53,"tag":156,"props":266,"children":267},{"style":236},[268],{"type":58,"value":269}," =>",{"type":53,"tag":156,"props":271,"children":272},{"style":179},[273],{"type":58,"value":274}," {\n",{"type":53,"tag":156,"props":276,"children":278},{"class":158,"line":277},5,[279,284],{"type":53,"tag":156,"props":280,"children":281},{"style":173},[282],{"type":58,"value":283},"  return",{"type":53,"tag":156,"props":285,"children":286},{"style":179},[287],{"type":58,"value":274},{"type":53,"tag":156,"props":289,"children":291},{"class":158,"line":290},6,[292,298,303,309],{"type":53,"tag":156,"props":293,"children":295},{"style":294},"--shiki-light:#E53935;--shiki-default:#F07178;--shiki-dark:#F07178",[296],{"type":58,"value":297},"    defaultSsr",{"type":53,"tag":156,"props":299,"children":300},{"style":179},[301],{"type":58,"value":302},":",{"type":53,"tag":156,"props":304,"children":306},{"style":305},"--shiki-light:#FF5370;--shiki-default:#FF9CAC;--shiki-dark:#FF9CAC",[307],{"type":58,"value":308}," false",{"type":53,"tag":156,"props":310,"children":311},{"style":179},[312],{"type":58,"value":313},",\n",{"type":53,"tag":156,"props":315,"children":317},{"class":158,"line":316},7,[318],{"type":53,"tag":156,"props":319,"children":320},{"style":179},[321],{"type":58,"value":322},"  }\n",{"type":53,"tag":156,"props":324,"children":326},{"class":158,"line":325},8,[327,332],{"type":53,"tag":156,"props":328,"children":329},{"style":179},[330],{"type":58,"value":331},"}",{"type":53,"tag":156,"props":333,"children":334},{"style":185},[335],{"type":58,"value":336},")\n",{"type":53,"tag":138,"props":338,"children":340},{"id":339},"per-route-ssr-disable-preload",[341],{"type":58,"value":342},"Per-route SSR disable + preload",{"type":53,"tag":145,"props":344,"children":348},{"className":345,"code":346,"language":347,"meta":150,"style":150},"language-tsx shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","import { createFileRoute } from '@tanstack\u002Freact-router'\nimport { useLiveQuery } from '@tanstack\u002Freact-db'\n\nexport const Route = createFileRoute('\u002Ftodos')({\n  ssr: false,\n  loader: async () => {\n    await todoCollection.preload()\n    return null\n  },\n  component: TodoPage,\n})\n\nfunction TodoPage() {\n  const { data: todos } = useLiveQuery((q) => q.from({ todo: todoCollection }))\n  return (\n    \u003Cul>\n      {todos.map((t) => (\n        \u003Cli key={t.id}>{t.text}\u003C\u002Fli>\n      ))}\n    \u003C\u002Ful>\n  )\n}\n","tsx",[349],{"type":53,"tag":105,"props":350,"children":351},{"__ignoreMap":150},[352,389,426,433,485,505,535,563,576,585,607,619,627,648,756,769,788,836,902,916,933,942],{"type":53,"tag":156,"props":353,"children":354},{"class":158,"line":159},[355,359,363,368,372,376,380,385],{"type":53,"tag":156,"props":356,"children":357},{"style":173},[358],{"type":58,"value":176},{"type":53,"tag":156,"props":360,"children":361},{"style":179},[362],{"type":58,"value":182},{"type":53,"tag":156,"props":364,"children":365},{"style":185},[366],{"type":58,"value":367}," createFileRoute",{"type":53,"tag":156,"props":369,"children":370},{"style":179},[371],{"type":58,"value":193},{"type":53,"tag":156,"props":373,"children":374},{"style":173},[375],{"type":58,"value":198},{"type":53,"tag":156,"props":377,"children":378},{"style":179},[379],{"type":58,"value":203},{"type":53,"tag":156,"props":381,"children":382},{"style":206},[383],{"type":58,"value":384},"@tanstack\u002Freact-router",{"type":53,"tag":156,"props":386,"children":387},{"style":179},[388],{"type":58,"value":214},{"type":53,"tag":156,"props":390,"children":391},{"class":158,"line":169},[392,396,400,405,409,413,417,422],{"type":53,"tag":156,"props":393,"children":394},{"style":173},[395],{"type":58,"value":176},{"type":53,"tag":156,"props":397,"children":398},{"style":179},[399],{"type":58,"value":182},{"type":53,"tag":156,"props":401,"children":402},{"style":185},[403],{"type":58,"value":404}," useLiveQuery",{"type":53,"tag":156,"props":406,"children":407},{"style":179},[408],{"type":58,"value":193},{"type":53,"tag":156,"props":410,"children":411},{"style":173},[412],{"type":58,"value":198},{"type":53,"tag":156,"props":414,"children":415},{"style":179},[416],{"type":58,"value":203},{"type":53,"tag":156,"props":418,"children":419},{"style":206},[420],{"type":58,"value":421},"@tanstack\u002Freact-db",{"type":53,"tag":156,"props":423,"children":424},{"style":179},[425],{"type":58,"value":214},{"type":53,"tag":156,"props":427,"children":428},{"class":158,"line":217},[429],{"type":53,"tag":156,"props":430,"children":431},{"emptyLinePlaceholder":221},[432],{"type":58,"value":224},{"type":53,"tag":156,"props":434,"children":435},{"class":158,"line":227},[436,440,444,449,453,457,461,466,471,475,480],{"type":53,"tag":156,"props":437,"children":438},{"style":173},[439],{"type":58,"value":233},{"type":53,"tag":156,"props":441,"children":442},{"style":236},[443],{"type":58,"value":239},{"type":53,"tag":156,"props":445,"children":446},{"style":185},[447],{"type":58,"value":448}," Route ",{"type":53,"tag":156,"props":450,"children":451},{"style":179},[452],{"type":58,"value":249},{"type":53,"tag":156,"props":454,"children":455},{"style":252},[456],{"type":58,"value":367},{"type":53,"tag":156,"props":458,"children":459},{"style":185},[460],{"type":58,"value":259},{"type":53,"tag":156,"props":462,"children":463},{"style":179},[464],{"type":58,"value":465},"'",{"type":53,"tag":156,"props":467,"children":468},{"style":206},[469],{"type":58,"value":470},"\u002Ftodos",{"type":53,"tag":156,"props":472,"children":473},{"style":179},[474],{"type":58,"value":465},{"type":53,"tag":156,"props":476,"children":477},{"style":185},[478],{"type":58,"value":479},")(",{"type":53,"tag":156,"props":481,"children":482},{"style":179},[483],{"type":58,"value":484},"{\n",{"type":53,"tag":156,"props":486,"children":487},{"class":158,"line":277},[488,493,497,501],{"type":53,"tag":156,"props":489,"children":490},{"style":294},[491],{"type":58,"value":492},"  ssr",{"type":53,"tag":156,"props":494,"children":495},{"style":179},[496],{"type":58,"value":302},{"type":53,"tag":156,"props":498,"children":499},{"style":305},[500],{"type":58,"value":308},{"type":53,"tag":156,"props":502,"children":503},{"style":179},[504],{"type":58,"value":313},{"type":53,"tag":156,"props":506,"children":507},{"class":158,"line":290},[508,513,517,522,527,531],{"type":53,"tag":156,"props":509,"children":510},{"style":252},[511],{"type":58,"value":512},"  loader",{"type":53,"tag":156,"props":514,"children":515},{"style":179},[516],{"type":58,"value":302},{"type":53,"tag":156,"props":518,"children":519},{"style":236},[520],{"type":58,"value":521}," async",{"type":53,"tag":156,"props":523,"children":524},{"style":179},[525],{"type":58,"value":526}," ()",{"type":53,"tag":156,"props":528,"children":529},{"style":236},[530],{"type":58,"value":269},{"type":53,"tag":156,"props":532,"children":533},{"style":179},[534],{"type":58,"value":274},{"type":53,"tag":156,"props":536,"children":537},{"class":158,"line":316},[538,543,548,553,558],{"type":53,"tag":156,"props":539,"children":540},{"style":173},[541],{"type":58,"value":542},"    await",{"type":53,"tag":156,"props":544,"children":545},{"style":185},[546],{"type":58,"value":547}," todoCollection",{"type":53,"tag":156,"props":549,"children":550},{"style":179},[551],{"type":58,"value":552},".",{"type":53,"tag":156,"props":554,"children":555},{"style":252},[556],{"type":58,"value":557},"preload",{"type":53,"tag":156,"props":559,"children":560},{"style":294},[561],{"type":58,"value":562},"()\n",{"type":53,"tag":156,"props":564,"children":565},{"class":158,"line":325},[566,571],{"type":53,"tag":156,"props":567,"children":568},{"style":173},[569],{"type":58,"value":570},"    return",{"type":53,"tag":156,"props":572,"children":573},{"style":179},[574],{"type":58,"value":575}," null\n",{"type":53,"tag":156,"props":577,"children":579},{"class":158,"line":578},9,[580],{"type":53,"tag":156,"props":581,"children":582},{"style":179},[583],{"type":58,"value":584},"  },\n",{"type":53,"tag":156,"props":586,"children":588},{"class":158,"line":587},10,[589,594,598,603],{"type":53,"tag":156,"props":590,"children":591},{"style":294},[592],{"type":58,"value":593},"  component",{"type":53,"tag":156,"props":595,"children":596},{"style":179},[597],{"type":58,"value":302},{"type":53,"tag":156,"props":599,"children":600},{"style":185},[601],{"type":58,"value":602}," TodoPage",{"type":53,"tag":156,"props":604,"children":605},{"style":179},[606],{"type":58,"value":313},{"type":53,"tag":156,"props":608,"children":610},{"class":158,"line":609},11,[611,615],{"type":53,"tag":156,"props":612,"children":613},{"style":179},[614],{"type":58,"value":331},{"type":53,"tag":156,"props":616,"children":617},{"style":185},[618],{"type":58,"value":336},{"type":53,"tag":156,"props":620,"children":622},{"class":158,"line":621},12,[623],{"type":53,"tag":156,"props":624,"children":625},{"emptyLinePlaceholder":221},[626],{"type":58,"value":224},{"type":53,"tag":156,"props":628,"children":630},{"class":158,"line":629},13,[631,636,640,644],{"type":53,"tag":156,"props":632,"children":633},{"style":236},[634],{"type":58,"value":635},"function",{"type":53,"tag":156,"props":637,"children":638},{"style":252},[639],{"type":58,"value":602},{"type":53,"tag":156,"props":641,"children":642},{"style":179},[643],{"type":58,"value":264},{"type":53,"tag":156,"props":645,"children":646},{"style":179},[647],{"type":58,"value":274},{"type":53,"tag":156,"props":649,"children":651},{"class":158,"line":650},14,[652,657,661,666,670,675,679,684,688,692,696,702,707,711,716,720,725,729,734,739,743,747,751],{"type":53,"tag":156,"props":653,"children":654},{"style":236},[655],{"type":58,"value":656},"  const",{"type":53,"tag":156,"props":658,"children":659},{"style":179},[660],{"type":58,"value":182},{"type":53,"tag":156,"props":662,"children":663},{"style":294},[664],{"type":58,"value":665}," data",{"type":53,"tag":156,"props":667,"children":668},{"style":179},[669],{"type":58,"value":302},{"type":53,"tag":156,"props":671,"children":672},{"style":185},[673],{"type":58,"value":674}," todos",{"type":53,"tag":156,"props":676,"children":677},{"style":179},[678],{"type":58,"value":193},{"type":53,"tag":156,"props":680,"children":681},{"style":179},[682],{"type":58,"value":683}," =",{"type":53,"tag":156,"props":685,"children":686},{"style":252},[687],{"type":58,"value":404},{"type":53,"tag":156,"props":689,"children":690},{"style":294},[691],{"type":58,"value":259},{"type":53,"tag":156,"props":693,"children":694},{"style":179},[695],{"type":58,"value":259},{"type":53,"tag":156,"props":697,"children":699},{"style":698},"--shiki-light:#90A4AE;--shiki-light-font-style:italic;--shiki-default:#EEFFFF;--shiki-default-font-style:italic;--shiki-dark:#BABED8;--shiki-dark-font-style:italic",[700],{"type":58,"value":701},"q",{"type":53,"tag":156,"props":703,"children":704},{"style":179},[705],{"type":58,"value":706},")",{"type":53,"tag":156,"props":708,"children":709},{"style":236},[710],{"type":58,"value":269},{"type":53,"tag":156,"props":712,"children":713},{"style":185},[714],{"type":58,"value":715}," q",{"type":53,"tag":156,"props":717,"children":718},{"style":179},[719],{"type":58,"value":552},{"type":53,"tag":156,"props":721,"children":722},{"style":252},[723],{"type":58,"value":724},"from",{"type":53,"tag":156,"props":726,"children":727},{"style":294},[728],{"type":58,"value":259},{"type":53,"tag":156,"props":730,"children":731},{"style":179},[732],{"type":58,"value":733},"{",{"type":53,"tag":156,"props":735,"children":736},{"style":294},[737],{"type":58,"value":738}," todo",{"type":53,"tag":156,"props":740,"children":741},{"style":179},[742],{"type":58,"value":302},{"type":53,"tag":156,"props":744,"children":745},{"style":185},[746],{"type":58,"value":547},{"type":53,"tag":156,"props":748,"children":749},{"style":179},[750],{"type":58,"value":193},{"type":53,"tag":156,"props":752,"children":753},{"style":294},[754],{"type":58,"value":755},"))\n",{"type":53,"tag":156,"props":757,"children":759},{"class":158,"line":758},15,[760,764],{"type":53,"tag":156,"props":761,"children":762},{"style":173},[763],{"type":58,"value":283},{"type":53,"tag":156,"props":765,"children":766},{"style":294},[767],{"type":58,"value":768}," (\n",{"type":53,"tag":156,"props":770,"children":772},{"class":158,"line":771},16,[773,778,783],{"type":53,"tag":156,"props":774,"children":775},{"style":179},[776],{"type":58,"value":777},"    \u003C",{"type":53,"tag":156,"props":779,"children":780},{"style":294},[781],{"type":58,"value":782},"ul",{"type":53,"tag":156,"props":784,"children":785},{"style":179},[786],{"type":58,"value":787},">\n",{"type":53,"tag":156,"props":789,"children":791},{"class":158,"line":790},17,[792,797,802,806,811,815,819,824,828,832],{"type":53,"tag":156,"props":793,"children":794},{"style":179},[795],{"type":58,"value":796},"      {",{"type":53,"tag":156,"props":798,"children":799},{"style":185},[800],{"type":58,"value":801},"todos",{"type":53,"tag":156,"props":803,"children":804},{"style":179},[805],{"type":58,"value":552},{"type":53,"tag":156,"props":807,"children":808},{"style":252},[809],{"type":58,"value":810},"map",{"type":53,"tag":156,"props":812,"children":813},{"style":185},[814],{"type":58,"value":259},{"type":53,"tag":156,"props":816,"children":817},{"style":179},[818],{"type":58,"value":259},{"type":53,"tag":156,"props":820,"children":821},{"style":698},[822],{"type":58,"value":823},"t",{"type":53,"tag":156,"props":825,"children":826},{"style":179},[827],{"type":58,"value":706},{"type":53,"tag":156,"props":829,"children":830},{"style":236},[831],{"type":58,"value":269},{"type":53,"tag":156,"props":833,"children":834},{"style":185},[835],{"type":58,"value":768},{"type":53,"tag":156,"props":837,"children":839},{"class":158,"line":838},18,[840,845,849,854,859,863,867,872,877,881,885,889,894,898],{"type":53,"tag":156,"props":841,"children":842},{"style":179},[843],{"type":58,"value":844},"        \u003C",{"type":53,"tag":156,"props":846,"children":847},{"style":294},[848],{"type":58,"value":99},{"type":53,"tag":156,"props":850,"children":851},{"style":236},[852],{"type":58,"value":853}," key",{"type":53,"tag":156,"props":855,"children":856},{"style":179},[857],{"type":58,"value":858},"={",{"type":53,"tag":156,"props":860,"children":861},{"style":185},[862],{"type":58,"value":823},{"type":53,"tag":156,"props":864,"children":865},{"style":179},[866],{"type":58,"value":552},{"type":53,"tag":156,"props":868,"children":869},{"style":185},[870],{"type":58,"value":871},"id",{"type":53,"tag":156,"props":873,"children":874},{"style":179},[875],{"type":58,"value":876},"}>{",{"type":53,"tag":156,"props":878,"children":879},{"style":185},[880],{"type":58,"value":823},{"type":53,"tag":156,"props":882,"children":883},{"style":179},[884],{"type":58,"value":552},{"type":53,"tag":156,"props":886,"children":887},{"style":185},[888],{"type":58,"value":58},{"type":53,"tag":156,"props":890,"children":891},{"style":179},[892],{"type":58,"value":893},"}\u003C\u002F",{"type":53,"tag":156,"props":895,"children":896},{"style":294},[897],{"type":58,"value":99},{"type":53,"tag":156,"props":899,"children":900},{"style":179},[901],{"type":58,"value":787},{"type":53,"tag":156,"props":903,"children":905},{"class":158,"line":904},19,[906,911],{"type":53,"tag":156,"props":907,"children":908},{"style":185},[909],{"type":58,"value":910},"      ))",{"type":53,"tag":156,"props":912,"children":913},{"style":179},[914],{"type":58,"value":915},"}\n",{"type":53,"tag":156,"props":917,"children":919},{"class":158,"line":918},20,[920,925,929],{"type":53,"tag":156,"props":921,"children":922},{"style":179},[923],{"type":58,"value":924},"    \u003C\u002F",{"type":53,"tag":156,"props":926,"children":927},{"style":294},[928],{"type":58,"value":782},{"type":53,"tag":156,"props":930,"children":931},{"style":179},[932],{"type":58,"value":787},{"type":53,"tag":156,"props":934,"children":936},{"class":158,"line":935},21,[937],{"type":53,"tag":156,"props":938,"children":939},{"style":294},[940],{"type":58,"value":941},"  )\n",{"type":53,"tag":156,"props":943,"children":945},{"class":158,"line":944},22,[946],{"type":53,"tag":156,"props":947,"children":948},{"style":179},[949],{"type":58,"value":915},{"type":53,"tag":138,"props":951,"children":953},{"id":952},"on-demand-query-collection-preload",[954],{"type":58,"value":955},"On-demand Query Collection preload",{"type":53,"tag":54,"props":957,"children":958},{},[959,961,967],{"type":58,"value":960},"Calling ",{"type":53,"tag":105,"props":962,"children":964},{"className":963},[],[965],{"type":58,"value":966},"preload()",{"type":58,"value":968}," on an on-demand source collection is a no-op. Define the\nlive query once, preload it in the loader, and pass that same collection to the\nframework hook:",{"type":53,"tag":145,"props":970,"children":972},{"className":345,"code":971,"language":347,"meta":150,"style":150},"import { createLiveQueryCollection, eq } from '@tanstack\u002Fdb'\nimport { useLiveQuery } from '@tanstack\u002Freact-db'\n\nconst activeTodos = createLiveQueryCollection((q) =>\n  q\n    .from({ todo: todoCollection })\n    .where(({ todo }) => eq(todo.completed, false)),\n)\n\nexport const Route = createFileRoute('\u002Ftodos')({\n  ssr: false,\n  loader: async () => {\n    await activeTodos.preload()\n    return null\n  },\n  component: () => {\n    const { data } = useLiveQuery(activeTodos)\n    \u002F\u002F ...\n  },\n})\n",[973],{"type":53,"tag":105,"props":974,"children":975},{"__ignoreMap":150},[976,1023,1058,1065,1107,1115,1156,1225,1232,1239,1286,1305,1332,1356,1367,1374,1397,1438,1446,1453],{"type":53,"tag":156,"props":977,"children":978},{"class":158,"line":159},[979,983,987,992,997,1002,1006,1010,1014,1019],{"type":53,"tag":156,"props":980,"children":981},{"style":173},[982],{"type":58,"value":176},{"type":53,"tag":156,"props":984,"children":985},{"style":179},[986],{"type":58,"value":182},{"type":53,"tag":156,"props":988,"children":989},{"style":185},[990],{"type":58,"value":991}," createLiveQueryCollection",{"type":53,"tag":156,"props":993,"children":994},{"style":179},[995],{"type":58,"value":996},",",{"type":53,"tag":156,"props":998,"children":999},{"style":185},[1000],{"type":58,"value":1001}," eq",{"type":53,"tag":156,"props":1003,"children":1004},{"style":179},[1005],{"type":58,"value":193},{"type":53,"tag":156,"props":1007,"children":1008},{"style":173},[1009],{"type":58,"value":198},{"type":53,"tag":156,"props":1011,"children":1012},{"style":179},[1013],{"type":58,"value":203},{"type":53,"tag":156,"props":1015,"children":1016},{"style":206},[1017],{"type":58,"value":1018},"@tanstack\u002Fdb",{"type":53,"tag":156,"props":1020,"children":1021},{"style":179},[1022],{"type":58,"value":214},{"type":53,"tag":156,"props":1024,"children":1025},{"class":158,"line":169},[1026,1030,1034,1038,1042,1046,1050,1054],{"type":53,"tag":156,"props":1027,"children":1028},{"style":173},[1029],{"type":58,"value":176},{"type":53,"tag":156,"props":1031,"children":1032},{"style":179},[1033],{"type":58,"value":182},{"type":53,"tag":156,"props":1035,"children":1036},{"style":185},[1037],{"type":58,"value":404},{"type":53,"tag":156,"props":1039,"children":1040},{"style":179},[1041],{"type":58,"value":193},{"type":53,"tag":156,"props":1043,"children":1044},{"style":173},[1045],{"type":58,"value":198},{"type":53,"tag":156,"props":1047,"children":1048},{"style":179},[1049],{"type":58,"value":203},{"type":53,"tag":156,"props":1051,"children":1052},{"style":206},[1053],{"type":58,"value":421},{"type":53,"tag":156,"props":1055,"children":1056},{"style":179},[1057],{"type":58,"value":214},{"type":53,"tag":156,"props":1059,"children":1060},{"class":158,"line":217},[1061],{"type":53,"tag":156,"props":1062,"children":1063},{"emptyLinePlaceholder":221},[1064],{"type":58,"value":224},{"type":53,"tag":156,"props":1066,"children":1067},{"class":158,"line":227},[1068,1073,1078,1082,1086,1090,1094,1098,1102],{"type":53,"tag":156,"props":1069,"children":1070},{"style":236},[1071],{"type":58,"value":1072},"const",{"type":53,"tag":156,"props":1074,"children":1075},{"style":185},[1076],{"type":58,"value":1077}," activeTodos ",{"type":53,"tag":156,"props":1079,"children":1080},{"style":179},[1081],{"type":58,"value":249},{"type":53,"tag":156,"props":1083,"children":1084},{"style":252},[1085],{"type":58,"value":991},{"type":53,"tag":156,"props":1087,"children":1088},{"style":185},[1089],{"type":58,"value":259},{"type":53,"tag":156,"props":1091,"children":1092},{"style":179},[1093],{"type":58,"value":259},{"type":53,"tag":156,"props":1095,"children":1096},{"style":698},[1097],{"type":58,"value":701},{"type":53,"tag":156,"props":1099,"children":1100},{"style":179},[1101],{"type":58,"value":706},{"type":53,"tag":156,"props":1103,"children":1104},{"style":236},[1105],{"type":58,"value":1106}," =>\n",{"type":53,"tag":156,"props":1108,"children":1109},{"class":158,"line":277},[1110],{"type":53,"tag":156,"props":1111,"children":1112},{"style":185},[1113],{"type":58,"value":1114},"  q\n",{"type":53,"tag":156,"props":1116,"children":1117},{"class":158,"line":290},[1118,1123,1127,1131,1135,1139,1143,1148,1152],{"type":53,"tag":156,"props":1119,"children":1120},{"style":179},[1121],{"type":58,"value":1122},"    .",{"type":53,"tag":156,"props":1124,"children":1125},{"style":252},[1126],{"type":58,"value":724},{"type":53,"tag":156,"props":1128,"children":1129},{"style":185},[1130],{"type":58,"value":259},{"type":53,"tag":156,"props":1132,"children":1133},{"style":179},[1134],{"type":58,"value":733},{"type":53,"tag":156,"props":1136,"children":1137},{"style":294},[1138],{"type":58,"value":738},{"type":53,"tag":156,"props":1140,"children":1141},{"style":179},[1142],{"type":58,"value":302},{"type":53,"tag":156,"props":1144,"children":1145},{"style":185},[1146],{"type":58,"value":1147}," todoCollection ",{"type":53,"tag":156,"props":1149,"children":1150},{"style":179},[1151],{"type":58,"value":331},{"type":53,"tag":156,"props":1153,"children":1154},{"style":185},[1155],{"type":58,"value":336},{"type":53,"tag":156,"props":1157,"children":1158},{"class":158,"line":316},[1159,1163,1168,1172,1177,1181,1186,1190,1194,1199,1203,1208,1212,1216,1221],{"type":53,"tag":156,"props":1160,"children":1161},{"style":179},[1162],{"type":58,"value":1122},{"type":53,"tag":156,"props":1164,"children":1165},{"style":252},[1166],{"type":58,"value":1167},"where",{"type":53,"tag":156,"props":1169,"children":1170},{"style":185},[1171],{"type":58,"value":259},{"type":53,"tag":156,"props":1173,"children":1174},{"style":179},[1175],{"type":58,"value":1176},"({",{"type":53,"tag":156,"props":1178,"children":1179},{"style":698},[1180],{"type":58,"value":738},{"type":53,"tag":156,"props":1182,"children":1183},{"style":179},[1184],{"type":58,"value":1185}," })",{"type":53,"tag":156,"props":1187,"children":1188},{"style":236},[1189],{"type":58,"value":269},{"type":53,"tag":156,"props":1191,"children":1192},{"style":252},[1193],{"type":58,"value":1001},{"type":53,"tag":156,"props":1195,"children":1196},{"style":185},[1197],{"type":58,"value":1198},"(todo",{"type":53,"tag":156,"props":1200,"children":1201},{"style":179},[1202],{"type":58,"value":552},{"type":53,"tag":156,"props":1204,"children":1205},{"style":185},[1206],{"type":58,"value":1207},"completed",{"type":53,"tag":156,"props":1209,"children":1210},{"style":179},[1211],{"type":58,"value":996},{"type":53,"tag":156,"props":1213,"children":1214},{"style":305},[1215],{"type":58,"value":308},{"type":53,"tag":156,"props":1217,"children":1218},{"style":185},[1219],{"type":58,"value":1220},"))",{"type":53,"tag":156,"props":1222,"children":1223},{"style":179},[1224],{"type":58,"value":313},{"type":53,"tag":156,"props":1226,"children":1227},{"class":158,"line":325},[1228],{"type":53,"tag":156,"props":1229,"children":1230},{"style":185},[1231],{"type":58,"value":336},{"type":53,"tag":156,"props":1233,"children":1234},{"class":158,"line":578},[1235],{"type":53,"tag":156,"props":1236,"children":1237},{"emptyLinePlaceholder":221},[1238],{"type":58,"value":224},{"type":53,"tag":156,"props":1240,"children":1241},{"class":158,"line":587},[1242,1246,1250,1254,1258,1262,1266,1270,1274,1278,1282],{"type":53,"tag":156,"props":1243,"children":1244},{"style":173},[1245],{"type":58,"value":233},{"type":53,"tag":156,"props":1247,"children":1248},{"style":236},[1249],{"type":58,"value":239},{"type":53,"tag":156,"props":1251,"children":1252},{"style":185},[1253],{"type":58,"value":448},{"type":53,"tag":156,"props":1255,"children":1256},{"style":179},[1257],{"type":58,"value":249},{"type":53,"tag":156,"props":1259,"children":1260},{"style":252},[1261],{"type":58,"value":367},{"type":53,"tag":156,"props":1263,"children":1264},{"style":185},[1265],{"type":58,"value":259},{"type":53,"tag":156,"props":1267,"children":1268},{"style":179},[1269],{"type":58,"value":465},{"type":53,"tag":156,"props":1271,"children":1272},{"style":206},[1273],{"type":58,"value":470},{"type":53,"tag":156,"props":1275,"children":1276},{"style":179},[1277],{"type":58,"value":465},{"type":53,"tag":156,"props":1279,"children":1280},{"style":185},[1281],{"type":58,"value":479},{"type":53,"tag":156,"props":1283,"children":1284},{"style":179},[1285],{"type":58,"value":484},{"type":53,"tag":156,"props":1287,"children":1288},{"class":158,"line":609},[1289,1293,1297,1301],{"type":53,"tag":156,"props":1290,"children":1291},{"style":294},[1292],{"type":58,"value":492},{"type":53,"tag":156,"props":1294,"children":1295},{"style":179},[1296],{"type":58,"value":302},{"type":53,"tag":156,"props":1298,"children":1299},{"style":305},[1300],{"type":58,"value":308},{"type":53,"tag":156,"props":1302,"children":1303},{"style":179},[1304],{"type":58,"value":313},{"type":53,"tag":156,"props":1306,"children":1307},{"class":158,"line":621},[1308,1312,1316,1320,1324,1328],{"type":53,"tag":156,"props":1309,"children":1310},{"style":252},[1311],{"type":58,"value":512},{"type":53,"tag":156,"props":1313,"children":1314},{"style":179},[1315],{"type":58,"value":302},{"type":53,"tag":156,"props":1317,"children":1318},{"style":236},[1319],{"type":58,"value":521},{"type":53,"tag":156,"props":1321,"children":1322},{"style":179},[1323],{"type":58,"value":526},{"type":53,"tag":156,"props":1325,"children":1326},{"style":236},[1327],{"type":58,"value":269},{"type":53,"tag":156,"props":1329,"children":1330},{"style":179},[1331],{"type":58,"value":274},{"type":53,"tag":156,"props":1333,"children":1334},{"class":158,"line":629},[1335,1339,1344,1348,1352],{"type":53,"tag":156,"props":1336,"children":1337},{"style":173},[1338],{"type":58,"value":542},{"type":53,"tag":156,"props":1340,"children":1341},{"style":185},[1342],{"type":58,"value":1343}," activeTodos",{"type":53,"tag":156,"props":1345,"children":1346},{"style":179},[1347],{"type":58,"value":552},{"type":53,"tag":156,"props":1349,"children":1350},{"style":252},[1351],{"type":58,"value":557},{"type":53,"tag":156,"props":1353,"children":1354},{"style":294},[1355],{"type":58,"value":562},{"type":53,"tag":156,"props":1357,"children":1358},{"class":158,"line":650},[1359,1363],{"type":53,"tag":156,"props":1360,"children":1361},{"style":173},[1362],{"type":58,"value":570},{"type":53,"tag":156,"props":1364,"children":1365},{"style":179},[1366],{"type":58,"value":575},{"type":53,"tag":156,"props":1368,"children":1369},{"class":158,"line":758},[1370],{"type":53,"tag":156,"props":1371,"children":1372},{"style":179},[1373],{"type":58,"value":584},{"type":53,"tag":156,"props":1375,"children":1376},{"class":158,"line":771},[1377,1381,1385,1389,1393],{"type":53,"tag":156,"props":1378,"children":1379},{"style":252},[1380],{"type":58,"value":593},{"type":53,"tag":156,"props":1382,"children":1383},{"style":179},[1384],{"type":58,"value":302},{"type":53,"tag":156,"props":1386,"children":1387},{"style":179},[1388],{"type":58,"value":526},{"type":53,"tag":156,"props":1390,"children":1391},{"style":236},[1392],{"type":58,"value":269},{"type":53,"tag":156,"props":1394,"children":1395},{"style":179},[1396],{"type":58,"value":274},{"type":53,"tag":156,"props":1398,"children":1399},{"class":158,"line":790},[1400,1405,1409,1413,1417,1421,1425,1429,1434],{"type":53,"tag":156,"props":1401,"children":1402},{"style":236},[1403],{"type":58,"value":1404},"    const",{"type":53,"tag":156,"props":1406,"children":1407},{"style":179},[1408],{"type":58,"value":182},{"type":53,"tag":156,"props":1410,"children":1411},{"style":185},[1412],{"type":58,"value":665},{"type":53,"tag":156,"props":1414,"children":1415},{"style":179},[1416],{"type":58,"value":193},{"type":53,"tag":156,"props":1418,"children":1419},{"style":179},[1420],{"type":58,"value":683},{"type":53,"tag":156,"props":1422,"children":1423},{"style":252},[1424],{"type":58,"value":404},{"type":53,"tag":156,"props":1426,"children":1427},{"style":294},[1428],{"type":58,"value":259},{"type":53,"tag":156,"props":1430,"children":1431},{"style":185},[1432],{"type":58,"value":1433},"activeTodos",{"type":53,"tag":156,"props":1435,"children":1436},{"style":294},[1437],{"type":58,"value":336},{"type":53,"tag":156,"props":1439,"children":1440},{"class":158,"line":838},[1441],{"type":53,"tag":156,"props":1442,"children":1443},{"style":163},[1444],{"type":58,"value":1445},"    \u002F\u002F ...\n",{"type":53,"tag":156,"props":1447,"children":1448},{"class":158,"line":904},[1449],{"type":53,"tag":156,"props":1450,"children":1451},{"style":179},[1452],{"type":58,"value":584},{"type":53,"tag":156,"props":1454,"children":1455},{"class":158,"line":918},[1456,1460],{"type":53,"tag":156,"props":1457,"children":1458},{"style":179},[1459],{"type":58,"value":331},{"type":53,"tag":156,"props":1461,"children":1462},{"style":185},[1463],{"type":58,"value":336},{"type":53,"tag":138,"props":1465,"children":1467},{"id":1466},"multiple-collection-preloading",[1468],{"type":58,"value":1469},"Multiple collection preloading",{"type":53,"tag":145,"props":1471,"children":1473},{"className":345,"code":1472,"language":347,"meta":150,"style":150},"export const Route = createFileRoute('\u002Felectric')({\n  ssr: false,\n  loader: async () => {\n    await Promise.all([todoCollection.preload(), configCollection.preload()])\n    return null\n  },\n  component: ElectricPage,\n})\n",[1474],{"type":53,"tag":105,"props":1475,"children":1476},{"__ignoreMap":150},[1477,1525,1544,1571,1637,1648,1655,1675],{"type":53,"tag":156,"props":1478,"children":1479},{"class":158,"line":159},[1480,1484,1488,1492,1496,1500,1504,1508,1513,1517,1521],{"type":53,"tag":156,"props":1481,"children":1482},{"style":173},[1483],{"type":58,"value":233},{"type":53,"tag":156,"props":1485,"children":1486},{"style":236},[1487],{"type":58,"value":239},{"type":53,"tag":156,"props":1489,"children":1490},{"style":185},[1491],{"type":58,"value":448},{"type":53,"tag":156,"props":1493,"children":1494},{"style":179},[1495],{"type":58,"value":249},{"type":53,"tag":156,"props":1497,"children":1498},{"style":252},[1499],{"type":58,"value":367},{"type":53,"tag":156,"props":1501,"children":1502},{"style":185},[1503],{"type":58,"value":259},{"type":53,"tag":156,"props":1505,"children":1506},{"style":179},[1507],{"type":58,"value":465},{"type":53,"tag":156,"props":1509,"children":1510},{"style":206},[1511],{"type":58,"value":1512},"\u002Felectric",{"type":53,"tag":156,"props":1514,"children":1515},{"style":179},[1516],{"type":58,"value":465},{"type":53,"tag":156,"props":1518,"children":1519},{"style":185},[1520],{"type":58,"value":479},{"type":53,"tag":156,"props":1522,"children":1523},{"style":179},[1524],{"type":58,"value":484},{"type":53,"tag":156,"props":1526,"children":1527},{"class":158,"line":169},[1528,1532,1536,1540],{"type":53,"tag":156,"props":1529,"children":1530},{"style":294},[1531],{"type":58,"value":492},{"type":53,"tag":156,"props":1533,"children":1534},{"style":179},[1535],{"type":58,"value":302},{"type":53,"tag":156,"props":1537,"children":1538},{"style":305},[1539],{"type":58,"value":308},{"type":53,"tag":156,"props":1541,"children":1542},{"style":179},[1543],{"type":58,"value":313},{"type":53,"tag":156,"props":1545,"children":1546},{"class":158,"line":217},[1547,1551,1555,1559,1563,1567],{"type":53,"tag":156,"props":1548,"children":1549},{"style":252},[1550],{"type":58,"value":512},{"type":53,"tag":156,"props":1552,"children":1553},{"style":179},[1554],{"type":58,"value":302},{"type":53,"tag":156,"props":1556,"children":1557},{"style":236},[1558],{"type":58,"value":521},{"type":53,"tag":156,"props":1560,"children":1561},{"style":179},[1562],{"type":58,"value":526},{"type":53,"tag":156,"props":1564,"children":1565},{"style":236},[1566],{"type":58,"value":269},{"type":53,"tag":156,"props":1568,"children":1569},{"style":179},[1570],{"type":58,"value":274},{"type":53,"tag":156,"props":1572,"children":1573},{"class":158,"line":227},[1574,1578,1584,1588,1593,1598,1603,1607,1611,1615,1619,1624,1628,1632],{"type":53,"tag":156,"props":1575,"children":1576},{"style":173},[1577],{"type":58,"value":542},{"type":53,"tag":156,"props":1579,"children":1581},{"style":1580},"--shiki-light:#E2931D;--shiki-default:#FFCB6B;--shiki-dark:#FFCB6B",[1582],{"type":58,"value":1583}," Promise",{"type":53,"tag":156,"props":1585,"children":1586},{"style":179},[1587],{"type":58,"value":552},{"type":53,"tag":156,"props":1589,"children":1590},{"style":252},[1591],{"type":58,"value":1592},"all",{"type":53,"tag":156,"props":1594,"children":1595},{"style":294},[1596],{"type":58,"value":1597},"([",{"type":53,"tag":156,"props":1599,"children":1600},{"style":185},[1601],{"type":58,"value":1602},"todoCollection",{"type":53,"tag":156,"props":1604,"children":1605},{"style":179},[1606],{"type":58,"value":552},{"type":53,"tag":156,"props":1608,"children":1609},{"style":252},[1610],{"type":58,"value":557},{"type":53,"tag":156,"props":1612,"children":1613},{"style":294},[1614],{"type":58,"value":264},{"type":53,"tag":156,"props":1616,"children":1617},{"style":179},[1618],{"type":58,"value":996},{"type":53,"tag":156,"props":1620,"children":1621},{"style":185},[1622],{"type":58,"value":1623}," configCollection",{"type":53,"tag":156,"props":1625,"children":1626},{"style":179},[1627],{"type":58,"value":552},{"type":53,"tag":156,"props":1629,"children":1630},{"style":252},[1631],{"type":58,"value":557},{"type":53,"tag":156,"props":1633,"children":1634},{"style":294},[1635],{"type":58,"value":1636},"()])\n",{"type":53,"tag":156,"props":1638,"children":1639},{"class":158,"line":277},[1640,1644],{"type":53,"tag":156,"props":1641,"children":1642},{"style":173},[1643],{"type":58,"value":570},{"type":53,"tag":156,"props":1645,"children":1646},{"style":179},[1647],{"type":58,"value":575},{"type":53,"tag":156,"props":1649,"children":1650},{"class":158,"line":290},[1651],{"type":53,"tag":156,"props":1652,"children":1653},{"style":179},[1654],{"type":58,"value":584},{"type":53,"tag":156,"props":1656,"children":1657},{"class":158,"line":316},[1658,1662,1666,1671],{"type":53,"tag":156,"props":1659,"children":1660},{"style":294},[1661],{"type":58,"value":593},{"type":53,"tag":156,"props":1663,"children":1664},{"style":179},[1665],{"type":58,"value":302},{"type":53,"tag":156,"props":1667,"children":1668},{"style":185},[1669],{"type":58,"value":1670}," ElectricPage",{"type":53,"tag":156,"props":1672,"children":1673},{"style":179},[1674],{"type":58,"value":313},{"type":53,"tag":156,"props":1676,"children":1677},{"class":158,"line":325},[1678,1682],{"type":53,"tag":156,"props":1679,"children":1680},{"style":179},[1681],{"type":58,"value":331},{"type":53,"tag":156,"props":1683,"children":1684},{"style":185},[1685],{"type":58,"value":336},{"type":53,"tag":68,"props":1687,"children":1689},{"id":1688},"nextjs-app-router",[1690],{"type":58,"value":1691},"Next.js (App Router)",{"type":53,"tag":138,"props":1693,"children":1695},{"id":1694},"client-component-with-preloading",[1696],{"type":58,"value":1697},"Client component with preloading",{"type":53,"tag":145,"props":1699,"children":1701},{"className":345,"code":1700,"language":347,"meta":150,"style":150},"\u002F\u002F app\u002Ftodos\u002Fpage.tsx\n'use client'\n\nimport { useEffect, useState } from 'react'\nimport { useLiveQuery } from '@tanstack\u002Freact-db'\n\nexport default function TodoPage() {\n  const { data: todos, isLoading } = useLiveQuery((q) =>\n    q.from({ todo: todoCollection }),\n  )\n\n  if (isLoading) return \u003Cdiv>Loading...\u003C\u002Fdiv>\n  return (\n    \u003Cul>\n      {todos.map((t) => (\n        \u003Cli key={t.id}>{t.text}\u003C\u002Fli>\n      ))}\n    \u003C\u002Ful>\n  )\n}\n",[1702],{"type":53,"tag":105,"props":1703,"children":1704},{"__ignoreMap":150},[1705,1713,1729,1736,1782,1817,1824,1853,1917,1965,1972,1979,2040,2051,2066,2109,2168,2179,2194,2201],{"type":53,"tag":156,"props":1706,"children":1707},{"class":158,"line":159},[1708],{"type":53,"tag":156,"props":1709,"children":1710},{"style":163},[1711],{"type":58,"value":1712},"\u002F\u002F app\u002Ftodos\u002Fpage.tsx\n",{"type":53,"tag":156,"props":1714,"children":1715},{"class":158,"line":169},[1716,1720,1725],{"type":53,"tag":156,"props":1717,"children":1718},{"style":179},[1719],{"type":58,"value":465},{"type":53,"tag":156,"props":1721,"children":1722},{"style":206},[1723],{"type":58,"value":1724},"use client",{"type":53,"tag":156,"props":1726,"children":1727},{"style":179},[1728],{"type":58,"value":214},{"type":53,"tag":156,"props":1730,"children":1731},{"class":158,"line":217},[1732],{"type":53,"tag":156,"props":1733,"children":1734},{"emptyLinePlaceholder":221},[1735],{"type":58,"value":224},{"type":53,"tag":156,"props":1737,"children":1738},{"class":158,"line":227},[1739,1743,1747,1752,1756,1761,1765,1769,1773,1778],{"type":53,"tag":156,"props":1740,"children":1741},{"style":173},[1742],{"type":58,"value":176},{"type":53,"tag":156,"props":1744,"children":1745},{"style":179},[1746],{"type":58,"value":182},{"type":53,"tag":156,"props":1748,"children":1749},{"style":185},[1750],{"type":58,"value":1751}," useEffect",{"type":53,"tag":156,"props":1753,"children":1754},{"style":179},[1755],{"type":58,"value":996},{"type":53,"tag":156,"props":1757,"children":1758},{"style":185},[1759],{"type":58,"value":1760}," useState",{"type":53,"tag":156,"props":1762,"children":1763},{"style":179},[1764],{"type":58,"value":193},{"type":53,"tag":156,"props":1766,"children":1767},{"style":173},[1768],{"type":58,"value":198},{"type":53,"tag":156,"props":1770,"children":1771},{"style":179},[1772],{"type":58,"value":203},{"type":53,"tag":156,"props":1774,"children":1775},{"style":206},[1776],{"type":58,"value":1777},"react",{"type":53,"tag":156,"props":1779,"children":1780},{"style":179},[1781],{"type":58,"value":214},{"type":53,"tag":156,"props":1783,"children":1784},{"class":158,"line":277},[1785,1789,1793,1797,1801,1805,1809,1813],{"type":53,"tag":156,"props":1786,"children":1787},{"style":173},[1788],{"type":58,"value":176},{"type":53,"tag":156,"props":1790,"children":1791},{"style":179},[1792],{"type":58,"value":182},{"type":53,"tag":156,"props":1794,"children":1795},{"style":185},[1796],{"type":58,"value":404},{"type":53,"tag":156,"props":1798,"children":1799},{"style":179},[1800],{"type":58,"value":193},{"type":53,"tag":156,"props":1802,"children":1803},{"style":173},[1804],{"type":58,"value":198},{"type":53,"tag":156,"props":1806,"children":1807},{"style":179},[1808],{"type":58,"value":203},{"type":53,"tag":156,"props":1810,"children":1811},{"style":206},[1812],{"type":58,"value":421},{"type":53,"tag":156,"props":1814,"children":1815},{"style":179},[1816],{"type":58,"value":214},{"type":53,"tag":156,"props":1818,"children":1819},{"class":158,"line":290},[1820],{"type":53,"tag":156,"props":1821,"children":1822},{"emptyLinePlaceholder":221},[1823],{"type":58,"value":224},{"type":53,"tag":156,"props":1825,"children":1826},{"class":158,"line":316},[1827,1831,1836,1841,1845,1849],{"type":53,"tag":156,"props":1828,"children":1829},{"style":173},[1830],{"type":58,"value":233},{"type":53,"tag":156,"props":1832,"children":1833},{"style":173},[1834],{"type":58,"value":1835}," default",{"type":53,"tag":156,"props":1837,"children":1838},{"style":236},[1839],{"type":58,"value":1840}," function",{"type":53,"tag":156,"props":1842,"children":1843},{"style":252},[1844],{"type":58,"value":602},{"type":53,"tag":156,"props":1846,"children":1847},{"style":179},[1848],{"type":58,"value":264},{"type":53,"tag":156,"props":1850,"children":1851},{"style":179},[1852],{"type":58,"value":274},{"type":53,"tag":156,"props":1854,"children":1855},{"class":158,"line":325},[1856,1860,1864,1868,1872,1876,1880,1885,1889,1893,1897,1901,1905,1909,1913],{"type":53,"tag":156,"props":1857,"children":1858},{"style":236},[1859],{"type":58,"value":656},{"type":53,"tag":156,"props":1861,"children":1862},{"style":179},[1863],{"type":58,"value":182},{"type":53,"tag":156,"props":1865,"children":1866},{"style":294},[1867],{"type":58,"value":665},{"type":53,"tag":156,"props":1869,"children":1870},{"style":179},[1871],{"type":58,"value":302},{"type":53,"tag":156,"props":1873,"children":1874},{"style":185},[1875],{"type":58,"value":674},{"type":53,"tag":156,"props":1877,"children":1878},{"style":179},[1879],{"type":58,"value":996},{"type":53,"tag":156,"props":1881,"children":1882},{"style":185},[1883],{"type":58,"value":1884}," isLoading",{"type":53,"tag":156,"props":1886,"children":1887},{"style":179},[1888],{"type":58,"value":193},{"type":53,"tag":156,"props":1890,"children":1891},{"style":179},[1892],{"type":58,"value":683},{"type":53,"tag":156,"props":1894,"children":1895},{"style":252},[1896],{"type":58,"value":404},{"type":53,"tag":156,"props":1898,"children":1899},{"style":294},[1900],{"type":58,"value":259},{"type":53,"tag":156,"props":1902,"children":1903},{"style":179},[1904],{"type":58,"value":259},{"type":53,"tag":156,"props":1906,"children":1907},{"style":698},[1908],{"type":58,"value":701},{"type":53,"tag":156,"props":1910,"children":1911},{"style":179},[1912],{"type":58,"value":706},{"type":53,"tag":156,"props":1914,"children":1915},{"style":236},[1916],{"type":58,"value":1106},{"type":53,"tag":156,"props":1918,"children":1919},{"class":158,"line":578},[1920,1925,1929,1933,1937,1941,1945,1949,1953,1957,1961],{"type":53,"tag":156,"props":1921,"children":1922},{"style":185},[1923],{"type":58,"value":1924},"    q",{"type":53,"tag":156,"props":1926,"children":1927},{"style":179},[1928],{"type":58,"value":552},{"type":53,"tag":156,"props":1930,"children":1931},{"style":252},[1932],{"type":58,"value":724},{"type":53,"tag":156,"props":1934,"children":1935},{"style":294},[1936],{"type":58,"value":259},{"type":53,"tag":156,"props":1938,"children":1939},{"style":179},[1940],{"type":58,"value":733},{"type":53,"tag":156,"props":1942,"children":1943},{"style":294},[1944],{"type":58,"value":738},{"type":53,"tag":156,"props":1946,"children":1947},{"style":179},[1948],{"type":58,"value":302},{"type":53,"tag":156,"props":1950,"children":1951},{"style":185},[1952],{"type":58,"value":547},{"type":53,"tag":156,"props":1954,"children":1955},{"style":179},[1956],{"type":58,"value":193},{"type":53,"tag":156,"props":1958,"children":1959},{"style":294},[1960],{"type":58,"value":706},{"type":53,"tag":156,"props":1962,"children":1963},{"style":179},[1964],{"type":58,"value":313},{"type":53,"tag":156,"props":1966,"children":1967},{"class":158,"line":587},[1968],{"type":53,"tag":156,"props":1969,"children":1970},{"style":294},[1971],{"type":58,"value":941},{"type":53,"tag":156,"props":1973,"children":1974},{"class":158,"line":609},[1975],{"type":53,"tag":156,"props":1976,"children":1977},{"emptyLinePlaceholder":221},[1978],{"type":58,"value":224},{"type":53,"tag":156,"props":1980,"children":1981},{"class":158,"line":621},[1982,1987,1992,1997,2002,2007,2012,2017,2022,2027,2032,2036],{"type":53,"tag":156,"props":1983,"children":1984},{"style":173},[1985],{"type":58,"value":1986},"  if",{"type":53,"tag":156,"props":1988,"children":1989},{"style":294},[1990],{"type":58,"value":1991}," (",{"type":53,"tag":156,"props":1993,"children":1994},{"style":185},[1995],{"type":58,"value":1996},"isLoading",{"type":53,"tag":156,"props":1998,"children":1999},{"style":294},[2000],{"type":58,"value":2001},") ",{"type":53,"tag":156,"props":2003,"children":2004},{"style":173},[2005],{"type":58,"value":2006},"return",{"type":53,"tag":156,"props":2008,"children":2009},{"style":179},[2010],{"type":58,"value":2011}," \u003C",{"type":53,"tag":156,"props":2013,"children":2014},{"style":294},[2015],{"type":58,"value":2016},"div",{"type":53,"tag":156,"props":2018,"children":2019},{"style":179},[2020],{"type":58,"value":2021},">",{"type":53,"tag":156,"props":2023,"children":2024},{"style":185},[2025],{"type":58,"value":2026},"Loading...",{"type":53,"tag":156,"props":2028,"children":2029},{"style":179},[2030],{"type":58,"value":2031},"\u003C\u002F",{"type":53,"tag":156,"props":2033,"children":2034},{"style":294},[2035],{"type":58,"value":2016},{"type":53,"tag":156,"props":2037,"children":2038},{"style":179},[2039],{"type":58,"value":787},{"type":53,"tag":156,"props":2041,"children":2042},{"class":158,"line":629},[2043,2047],{"type":53,"tag":156,"props":2044,"children":2045},{"style":173},[2046],{"type":58,"value":283},{"type":53,"tag":156,"props":2048,"children":2049},{"style":294},[2050],{"type":58,"value":768},{"type":53,"tag":156,"props":2052,"children":2053},{"class":158,"line":650},[2054,2058,2062],{"type":53,"tag":156,"props":2055,"children":2056},{"style":179},[2057],{"type":58,"value":777},{"type":53,"tag":156,"props":2059,"children":2060},{"style":294},[2061],{"type":58,"value":782},{"type":53,"tag":156,"props":2063,"children":2064},{"style":179},[2065],{"type":58,"value":787},{"type":53,"tag":156,"props":2067,"children":2068},{"class":158,"line":758},[2069,2073,2077,2081,2085,2089,2093,2097,2101,2105],{"type":53,"tag":156,"props":2070,"children":2071},{"style":179},[2072],{"type":58,"value":796},{"type":53,"tag":156,"props":2074,"children":2075},{"style":185},[2076],{"type":58,"value":801},{"type":53,"tag":156,"props":2078,"children":2079},{"style":179},[2080],{"type":58,"value":552},{"type":53,"tag":156,"props":2082,"children":2083},{"style":252},[2084],{"type":58,"value":810},{"type":53,"tag":156,"props":2086,"children":2087},{"style":185},[2088],{"type":58,"value":259},{"type":53,"tag":156,"props":2090,"children":2091},{"style":179},[2092],{"type":58,"value":259},{"type":53,"tag":156,"props":2094,"children":2095},{"style":698},[2096],{"type":58,"value":823},{"type":53,"tag":156,"props":2098,"children":2099},{"style":179},[2100],{"type":58,"value":706},{"type":53,"tag":156,"props":2102,"children":2103},{"style":236},[2104],{"type":58,"value":269},{"type":53,"tag":156,"props":2106,"children":2107},{"style":185},[2108],{"type":58,"value":768},{"type":53,"tag":156,"props":2110,"children":2111},{"class":158,"line":771},[2112,2116,2120,2124,2128,2132,2136,2140,2144,2148,2152,2156,2160,2164],{"type":53,"tag":156,"props":2113,"children":2114},{"style":179},[2115],{"type":58,"value":844},{"type":53,"tag":156,"props":2117,"children":2118},{"style":294},[2119],{"type":58,"value":99},{"type":53,"tag":156,"props":2121,"children":2122},{"style":236},[2123],{"type":58,"value":853},{"type":53,"tag":156,"props":2125,"children":2126},{"style":179},[2127],{"type":58,"value":858},{"type":53,"tag":156,"props":2129,"children":2130},{"style":185},[2131],{"type":58,"value":823},{"type":53,"tag":156,"props":2133,"children":2134},{"style":179},[2135],{"type":58,"value":552},{"type":53,"tag":156,"props":2137,"children":2138},{"style":185},[2139],{"type":58,"value":871},{"type":53,"tag":156,"props":2141,"children":2142},{"style":179},[2143],{"type":58,"value":876},{"type":53,"tag":156,"props":2145,"children":2146},{"style":185},[2147],{"type":58,"value":823},{"type":53,"tag":156,"props":2149,"children":2150},{"style":179},[2151],{"type":58,"value":552},{"type":53,"tag":156,"props":2153,"children":2154},{"style":185},[2155],{"type":58,"value":58},{"type":53,"tag":156,"props":2157,"children":2158},{"style":179},[2159],{"type":58,"value":893},{"type":53,"tag":156,"props":2161,"children":2162},{"style":294},[2163],{"type":58,"value":99},{"type":53,"tag":156,"props":2165,"children":2166},{"style":179},[2167],{"type":58,"value":787},{"type":53,"tag":156,"props":2169,"children":2170},{"class":158,"line":790},[2171,2175],{"type":53,"tag":156,"props":2172,"children":2173},{"style":185},[2174],{"type":58,"value":910},{"type":53,"tag":156,"props":2176,"children":2177},{"style":179},[2178],{"type":58,"value":915},{"type":53,"tag":156,"props":2180,"children":2181},{"class":158,"line":838},[2182,2186,2190],{"type":53,"tag":156,"props":2183,"children":2184},{"style":179},[2185],{"type":58,"value":924},{"type":53,"tag":156,"props":2187,"children":2188},{"style":294},[2189],{"type":58,"value":782},{"type":53,"tag":156,"props":2191,"children":2192},{"style":179},[2193],{"type":58,"value":787},{"type":53,"tag":156,"props":2195,"children":2196},{"class":158,"line":904},[2197],{"type":53,"tag":156,"props":2198,"children":2199},{"style":294},[2200],{"type":58,"value":941},{"type":53,"tag":156,"props":2202,"children":2203},{"class":158,"line":918},[2204],{"type":53,"tag":156,"props":2205,"children":2206},{"style":179},[2207],{"type":58,"value":915},{"type":53,"tag":54,"props":2209,"children":2210},{},[2211,2213,2219],{"type":58,"value":2212},"Next.js App Router components using TanStack DB must be client components (",{"type":53,"tag":105,"props":2214,"children":2216},{"className":2215},[],[2217],{"type":58,"value":2218},"'use client'",{"type":58,"value":2220},"). There is no server-side preloading — collections sync on mount.",{"type":53,"tag":138,"props":2222,"children":2224},{"id":2223},"with-route-level-preloading-experimental",[2225],{"type":58,"value":2226},"With route-level preloading (experimental)",{"type":53,"tag":145,"props":2228,"children":2230},{"className":345,"code":2229,"language":347,"meta":150,"style":150},"\u002F\u002F app\u002Ftodos\u002Fpage.tsx\n'use client'\n\nimport { useEffect } from 'react'\nimport { useLiveQuery } from '@tanstack\u002Freact-db'\n\n\u002F\u002F Trigger preload immediately when module is loaded\nconst preloadPromise = todoCollection.preload()\n\nexport default function TodoPage() {\n  const { data: todos } = useLiveQuery((q) => q.from({ todo: todoCollection }))\n  return (\n    \u003Cul>\n      {todos.map((t) => (\n        \u003Cli key={t.id}>{t.text}\u003C\u002Fli>\n      ))}\n    \u003C\u002Ful>\n  )\n}\n",[2231],{"type":53,"tag":105,"props":2232,"children":2233},{"__ignoreMap":150},[2234,2241,2256,2263,2298,2333,2340,2348,2380,2387,2414,2509,2520,2535,2578,2637,2648,2663,2670],{"type":53,"tag":156,"props":2235,"children":2236},{"class":158,"line":159},[2237],{"type":53,"tag":156,"props":2238,"children":2239},{"style":163},[2240],{"type":58,"value":1712},{"type":53,"tag":156,"props":2242,"children":2243},{"class":158,"line":169},[2244,2248,2252],{"type":53,"tag":156,"props":2245,"children":2246},{"style":179},[2247],{"type":58,"value":465},{"type":53,"tag":156,"props":2249,"children":2250},{"style":206},[2251],{"type":58,"value":1724},{"type":53,"tag":156,"props":2253,"children":2254},{"style":179},[2255],{"type":58,"value":214},{"type":53,"tag":156,"props":2257,"children":2258},{"class":158,"line":217},[2259],{"type":53,"tag":156,"props":2260,"children":2261},{"emptyLinePlaceholder":221},[2262],{"type":58,"value":224},{"type":53,"tag":156,"props":2264,"children":2265},{"class":158,"line":227},[2266,2270,2274,2278,2282,2286,2290,2294],{"type":53,"tag":156,"props":2267,"children":2268},{"style":173},[2269],{"type":58,"value":176},{"type":53,"tag":156,"props":2271,"children":2272},{"style":179},[2273],{"type":58,"value":182},{"type":53,"tag":156,"props":2275,"children":2276},{"style":185},[2277],{"type":58,"value":1751},{"type":53,"tag":156,"props":2279,"children":2280},{"style":179},[2281],{"type":58,"value":193},{"type":53,"tag":156,"props":2283,"children":2284},{"style":173},[2285],{"type":58,"value":198},{"type":53,"tag":156,"props":2287,"children":2288},{"style":179},[2289],{"type":58,"value":203},{"type":53,"tag":156,"props":2291,"children":2292},{"style":206},[2293],{"type":58,"value":1777},{"type":53,"tag":156,"props":2295,"children":2296},{"style":179},[2297],{"type":58,"value":214},{"type":53,"tag":156,"props":2299,"children":2300},{"class":158,"line":277},[2301,2305,2309,2313,2317,2321,2325,2329],{"type":53,"tag":156,"props":2302,"children":2303},{"style":173},[2304],{"type":58,"value":176},{"type":53,"tag":156,"props":2306,"children":2307},{"style":179},[2308],{"type":58,"value":182},{"type":53,"tag":156,"props":2310,"children":2311},{"style":185},[2312],{"type":58,"value":404},{"type":53,"tag":156,"props":2314,"children":2315},{"style":179},[2316],{"type":58,"value":193},{"type":53,"tag":156,"props":2318,"children":2319},{"style":173},[2320],{"type":58,"value":198},{"type":53,"tag":156,"props":2322,"children":2323},{"style":179},[2324],{"type":58,"value":203},{"type":53,"tag":156,"props":2326,"children":2327},{"style":206},[2328],{"type":58,"value":421},{"type":53,"tag":156,"props":2330,"children":2331},{"style":179},[2332],{"type":58,"value":214},{"type":53,"tag":156,"props":2334,"children":2335},{"class":158,"line":290},[2336],{"type":53,"tag":156,"props":2337,"children":2338},{"emptyLinePlaceholder":221},[2339],{"type":58,"value":224},{"type":53,"tag":156,"props":2341,"children":2342},{"class":158,"line":316},[2343],{"type":53,"tag":156,"props":2344,"children":2345},{"style":163},[2346],{"type":58,"value":2347},"\u002F\u002F Trigger preload immediately when module is loaded\n",{"type":53,"tag":156,"props":2349,"children":2350},{"class":158,"line":325},[2351,2355,2360,2364,2368,2372,2376],{"type":53,"tag":156,"props":2352,"children":2353},{"style":236},[2354],{"type":58,"value":1072},{"type":53,"tag":156,"props":2356,"children":2357},{"style":185},[2358],{"type":58,"value":2359}," preloadPromise ",{"type":53,"tag":156,"props":2361,"children":2362},{"style":179},[2363],{"type":58,"value":249},{"type":53,"tag":156,"props":2365,"children":2366},{"style":185},[2367],{"type":58,"value":547},{"type":53,"tag":156,"props":2369,"children":2370},{"style":179},[2371],{"type":58,"value":552},{"type":53,"tag":156,"props":2373,"children":2374},{"style":252},[2375],{"type":58,"value":557},{"type":53,"tag":156,"props":2377,"children":2378},{"style":185},[2379],{"type":58,"value":562},{"type":53,"tag":156,"props":2381,"children":2382},{"class":158,"line":578},[2383],{"type":53,"tag":156,"props":2384,"children":2385},{"emptyLinePlaceholder":221},[2386],{"type":58,"value":224},{"type":53,"tag":156,"props":2388,"children":2389},{"class":158,"line":587},[2390,2394,2398,2402,2406,2410],{"type":53,"tag":156,"props":2391,"children":2392},{"style":173},[2393],{"type":58,"value":233},{"type":53,"tag":156,"props":2395,"children":2396},{"style":173},[2397],{"type":58,"value":1835},{"type":53,"tag":156,"props":2399,"children":2400},{"style":236},[2401],{"type":58,"value":1840},{"type":53,"tag":156,"props":2403,"children":2404},{"style":252},[2405],{"type":58,"value":602},{"type":53,"tag":156,"props":2407,"children":2408},{"style":179},[2409],{"type":58,"value":264},{"type":53,"tag":156,"props":2411,"children":2412},{"style":179},[2413],{"type":58,"value":274},{"type":53,"tag":156,"props":2415,"children":2416},{"class":158,"line":609},[2417,2421,2425,2429,2433,2437,2441,2445,2449,2453,2457,2461,2465,2469,2473,2477,2481,2485,2489,2493,2497,2501,2505],{"type":53,"tag":156,"props":2418,"children":2419},{"style":236},[2420],{"type":58,"value":656},{"type":53,"tag":156,"props":2422,"children":2423},{"style":179},[2424],{"type":58,"value":182},{"type":53,"tag":156,"props":2426,"children":2427},{"style":294},[2428],{"type":58,"value":665},{"type":53,"tag":156,"props":2430,"children":2431},{"style":179},[2432],{"type":58,"value":302},{"type":53,"tag":156,"props":2434,"children":2435},{"style":185},[2436],{"type":58,"value":674},{"type":53,"tag":156,"props":2438,"children":2439},{"style":179},[2440],{"type":58,"value":193},{"type":53,"tag":156,"props":2442,"children":2443},{"style":179},[2444],{"type":58,"value":683},{"type":53,"tag":156,"props":2446,"children":2447},{"style":252},[2448],{"type":58,"value":404},{"type":53,"tag":156,"props":2450,"children":2451},{"style":294},[2452],{"type":58,"value":259},{"type":53,"tag":156,"props":2454,"children":2455},{"style":179},[2456],{"type":58,"value":259},{"type":53,"tag":156,"props":2458,"children":2459},{"style":698},[2460],{"type":58,"value":701},{"type":53,"tag":156,"props":2462,"children":2463},{"style":179},[2464],{"type":58,"value":706},{"type":53,"tag":156,"props":2466,"children":2467},{"style":236},[2468],{"type":58,"value":269},{"type":53,"tag":156,"props":2470,"children":2471},{"style":185},[2472],{"type":58,"value":715},{"type":53,"tag":156,"props":2474,"children":2475},{"style":179},[2476],{"type":58,"value":552},{"type":53,"tag":156,"props":2478,"children":2479},{"style":252},[2480],{"type":58,"value":724},{"type":53,"tag":156,"props":2482,"children":2483},{"style":294},[2484],{"type":58,"value":259},{"type":53,"tag":156,"props":2486,"children":2487},{"style":179},[2488],{"type":58,"value":733},{"type":53,"tag":156,"props":2490,"children":2491},{"style":294},[2492],{"type":58,"value":738},{"type":53,"tag":156,"props":2494,"children":2495},{"style":179},[2496],{"type":58,"value":302},{"type":53,"tag":156,"props":2498,"children":2499},{"style":185},[2500],{"type":58,"value":547},{"type":53,"tag":156,"props":2502,"children":2503},{"style":179},[2504],{"type":58,"value":193},{"type":53,"tag":156,"props":2506,"children":2507},{"style":294},[2508],{"type":58,"value":755},{"type":53,"tag":156,"props":2510,"children":2511},{"class":158,"line":621},[2512,2516],{"type":53,"tag":156,"props":2513,"children":2514},{"style":173},[2515],{"type":58,"value":283},{"type":53,"tag":156,"props":2517,"children":2518},{"style":294},[2519],{"type":58,"value":768},{"type":53,"tag":156,"props":2521,"children":2522},{"class":158,"line":629},[2523,2527,2531],{"type":53,"tag":156,"props":2524,"children":2525},{"style":179},[2526],{"type":58,"value":777},{"type":53,"tag":156,"props":2528,"children":2529},{"style":294},[2530],{"type":58,"value":782},{"type":53,"tag":156,"props":2532,"children":2533},{"style":179},[2534],{"type":58,"value":787},{"type":53,"tag":156,"props":2536,"children":2537},{"class":158,"line":650},[2538,2542,2546,2550,2554,2558,2562,2566,2570,2574],{"type":53,"tag":156,"props":2539,"children":2540},{"style":179},[2541],{"type":58,"value":796},{"type":53,"tag":156,"props":2543,"children":2544},{"style":185},[2545],{"type":58,"value":801},{"type":53,"tag":156,"props":2547,"children":2548},{"style":179},[2549],{"type":58,"value":552},{"type":53,"tag":156,"props":2551,"children":2552},{"style":252},[2553],{"type":58,"value":810},{"type":53,"tag":156,"props":2555,"children":2556},{"style":185},[2557],{"type":58,"value":259},{"type":53,"tag":156,"props":2559,"children":2560},{"style":179},[2561],{"type":58,"value":259},{"type":53,"tag":156,"props":2563,"children":2564},{"style":698},[2565],{"type":58,"value":823},{"type":53,"tag":156,"props":2567,"children":2568},{"style":179},[2569],{"type":58,"value":706},{"type":53,"tag":156,"props":2571,"children":2572},{"style":236},[2573],{"type":58,"value":269},{"type":53,"tag":156,"props":2575,"children":2576},{"style":185},[2577],{"type":58,"value":768},{"type":53,"tag":156,"props":2579,"children":2580},{"class":158,"line":758},[2581,2585,2589,2593,2597,2601,2605,2609,2613,2617,2621,2625,2629,2633],{"type":53,"tag":156,"props":2582,"children":2583},{"style":179},[2584],{"type":58,"value":844},{"type":53,"tag":156,"props":2586,"children":2587},{"style":294},[2588],{"type":58,"value":99},{"type":53,"tag":156,"props":2590,"children":2591},{"style":236},[2592],{"type":58,"value":853},{"type":53,"tag":156,"props":2594,"children":2595},{"style":179},[2596],{"type":58,"value":858},{"type":53,"tag":156,"props":2598,"children":2599},{"style":185},[2600],{"type":58,"value":823},{"type":53,"tag":156,"props":2602,"children":2603},{"style":179},[2604],{"type":58,"value":552},{"type":53,"tag":156,"props":2606,"children":2607},{"style":185},[2608],{"type":58,"value":871},{"type":53,"tag":156,"props":2610,"children":2611},{"style":179},[2612],{"type":58,"value":876},{"type":53,"tag":156,"props":2614,"children":2615},{"style":185},[2616],{"type":58,"value":823},{"type":53,"tag":156,"props":2618,"children":2619},{"style":179},[2620],{"type":58,"value":552},{"type":53,"tag":156,"props":2622,"children":2623},{"style":185},[2624],{"type":58,"value":58},{"type":53,"tag":156,"props":2626,"children":2627},{"style":179},[2628],{"type":58,"value":893},{"type":53,"tag":156,"props":2630,"children":2631},{"style":294},[2632],{"type":58,"value":99},{"type":53,"tag":156,"props":2634,"children":2635},{"style":179},[2636],{"type":58,"value":787},{"type":53,"tag":156,"props":2638,"children":2639},{"class":158,"line":771},[2640,2644],{"type":53,"tag":156,"props":2641,"children":2642},{"style":185},[2643],{"type":58,"value":910},{"type":53,"tag":156,"props":2645,"children":2646},{"style":179},[2647],{"type":58,"value":915},{"type":53,"tag":156,"props":2649,"children":2650},{"class":158,"line":790},[2651,2655,2659],{"type":53,"tag":156,"props":2652,"children":2653},{"style":179},[2654],{"type":58,"value":924},{"type":53,"tag":156,"props":2656,"children":2657},{"style":294},[2658],{"type":58,"value":782},{"type":53,"tag":156,"props":2660,"children":2661},{"style":179},[2662],{"type":58,"value":787},{"type":53,"tag":156,"props":2664,"children":2665},{"class":158,"line":838},[2666],{"type":53,"tag":156,"props":2667,"children":2668},{"style":294},[2669],{"type":58,"value":941},{"type":53,"tag":156,"props":2671,"children":2672},{"class":158,"line":904},[2673],{"type":53,"tag":156,"props":2674,"children":2675},{"style":179},[2676],{"type":58,"value":915},{"type":53,"tag":68,"props":2678,"children":2680},{"id":2679},"remix",[2681],{"type":58,"value":2682},"Remix",{"type":53,"tag":138,"props":2684,"children":2686},{"id":2685},"client-loader-pattern",[2687],{"type":58,"value":2688},"Client loader pattern",{"type":53,"tag":145,"props":2690,"children":2692},{"className":345,"code":2691,"language":347,"meta":150,"style":150},"\u002F\u002F app\u002Froutes\u002Ftodos.tsx\nimport { useLiveQuery } from '@tanstack\u002Freact-db'\nimport type { ClientLoaderFunctionArgs } from '@remix-run\u002Freact'\n\nexport const clientLoader = async ({ request }: ClientLoaderFunctionArgs) => {\n  await todoCollection.preload()\n  return null\n}\n\n\u002F\u002F Prevent server loader from running\nexport const loader = () => null\n\nexport default function TodoPage() {\n  const { data: todos } = useLiveQuery((q) => q.from({ todo: todoCollection }))\n  return (\n    \u003Cul>\n      {todos.map((t) => (\n        \u003Cli key={t.id}>{t.text}\u003C\u002Fli>\n      ))}\n    \u003C\u002Ful>\n  )\n}\n",[2693],{"type":53,"tag":105,"props":2694,"children":2695},{"__ignoreMap":150},[2696,2704,2739,2781,2788,2843,2867,2878,2885,2892,2900,2932,2939,2966,3061,3072,3087,3130,3189,3200,3215,3222],{"type":53,"tag":156,"props":2697,"children":2698},{"class":158,"line":159},[2699],{"type":53,"tag":156,"props":2700,"children":2701},{"style":163},[2702],{"type":58,"value":2703},"\u002F\u002F app\u002Froutes\u002Ftodos.tsx\n",{"type":53,"tag":156,"props":2705,"children":2706},{"class":158,"line":169},[2707,2711,2715,2719,2723,2727,2731,2735],{"type":53,"tag":156,"props":2708,"children":2709},{"style":173},[2710],{"type":58,"value":176},{"type":53,"tag":156,"props":2712,"children":2713},{"style":179},[2714],{"type":58,"value":182},{"type":53,"tag":156,"props":2716,"children":2717},{"style":185},[2718],{"type":58,"value":404},{"type":53,"tag":156,"props":2720,"children":2721},{"style":179},[2722],{"type":58,"value":193},{"type":53,"tag":156,"props":2724,"children":2725},{"style":173},[2726],{"type":58,"value":198},{"type":53,"tag":156,"props":2728,"children":2729},{"style":179},[2730],{"type":58,"value":203},{"type":53,"tag":156,"props":2732,"children":2733},{"style":206},[2734],{"type":58,"value":421},{"type":53,"tag":156,"props":2736,"children":2737},{"style":179},[2738],{"type":58,"value":214},{"type":53,"tag":156,"props":2740,"children":2741},{"class":158,"line":217},[2742,2746,2751,2755,2760,2764,2768,2772,2777],{"type":53,"tag":156,"props":2743,"children":2744},{"style":173},[2745],{"type":58,"value":176},{"type":53,"tag":156,"props":2747,"children":2748},{"style":173},[2749],{"type":58,"value":2750}," type",{"type":53,"tag":156,"props":2752,"children":2753},{"style":179},[2754],{"type":58,"value":182},{"type":53,"tag":156,"props":2756,"children":2757},{"style":185},[2758],{"type":58,"value":2759}," ClientLoaderFunctionArgs",{"type":53,"tag":156,"props":2761,"children":2762},{"style":179},[2763],{"type":58,"value":193},{"type":53,"tag":156,"props":2765,"children":2766},{"style":173},[2767],{"type":58,"value":198},{"type":53,"tag":156,"props":2769,"children":2770},{"style":179},[2771],{"type":58,"value":203},{"type":53,"tag":156,"props":2773,"children":2774},{"style":206},[2775],{"type":58,"value":2776},"@remix-run\u002Freact",{"type":53,"tag":156,"props":2778,"children":2779},{"style":179},[2780],{"type":58,"value":214},{"type":53,"tag":156,"props":2782,"children":2783},{"class":158,"line":227},[2784],{"type":53,"tag":156,"props":2785,"children":2786},{"emptyLinePlaceholder":221},[2787],{"type":58,"value":224},{"type":53,"tag":156,"props":2789,"children":2790},{"class":158,"line":277},[2791,2795,2799,2804,2808,2812,2817,2822,2827,2831,2835,2839],{"type":53,"tag":156,"props":2792,"children":2793},{"style":173},[2794],{"type":58,"value":233},{"type":53,"tag":156,"props":2796,"children":2797},{"style":236},[2798],{"type":58,"value":239},{"type":53,"tag":156,"props":2800,"children":2801},{"style":185},[2802],{"type":58,"value":2803}," clientLoader ",{"type":53,"tag":156,"props":2805,"children":2806},{"style":179},[2807],{"type":58,"value":249},{"type":53,"tag":156,"props":2809,"children":2810},{"style":236},[2811],{"type":58,"value":521},{"type":53,"tag":156,"props":2813,"children":2814},{"style":179},[2815],{"type":58,"value":2816}," ({",{"type":53,"tag":156,"props":2818,"children":2819},{"style":698},[2820],{"type":58,"value":2821}," request",{"type":53,"tag":156,"props":2823,"children":2824},{"style":179},[2825],{"type":58,"value":2826}," }:",{"type":53,"tag":156,"props":2828,"children":2829},{"style":1580},[2830],{"type":58,"value":2759},{"type":53,"tag":156,"props":2832,"children":2833},{"style":179},[2834],{"type":58,"value":706},{"type":53,"tag":156,"props":2836,"children":2837},{"style":236},[2838],{"type":58,"value":269},{"type":53,"tag":156,"props":2840,"children":2841},{"style":179},[2842],{"type":58,"value":274},{"type":53,"tag":156,"props":2844,"children":2845},{"class":158,"line":290},[2846,2851,2855,2859,2863],{"type":53,"tag":156,"props":2847,"children":2848},{"style":173},[2849],{"type":58,"value":2850},"  await",{"type":53,"tag":156,"props":2852,"children":2853},{"style":185},[2854],{"type":58,"value":547},{"type":53,"tag":156,"props":2856,"children":2857},{"style":179},[2858],{"type":58,"value":552},{"type":53,"tag":156,"props":2860,"children":2861},{"style":252},[2862],{"type":58,"value":557},{"type":53,"tag":156,"props":2864,"children":2865},{"style":294},[2866],{"type":58,"value":562},{"type":53,"tag":156,"props":2868,"children":2869},{"class":158,"line":316},[2870,2874],{"type":53,"tag":156,"props":2871,"children":2872},{"style":173},[2873],{"type":58,"value":283},{"type":53,"tag":156,"props":2875,"children":2876},{"style":179},[2877],{"type":58,"value":575},{"type":53,"tag":156,"props":2879,"children":2880},{"class":158,"line":325},[2881],{"type":53,"tag":156,"props":2882,"children":2883},{"style":179},[2884],{"type":58,"value":915},{"type":53,"tag":156,"props":2886,"children":2887},{"class":158,"line":578},[2888],{"type":53,"tag":156,"props":2889,"children":2890},{"emptyLinePlaceholder":221},[2891],{"type":58,"value":224},{"type":53,"tag":156,"props":2893,"children":2894},{"class":158,"line":587},[2895],{"type":53,"tag":156,"props":2896,"children":2897},{"style":163},[2898],{"type":58,"value":2899},"\u002F\u002F Prevent server loader from running\n",{"type":53,"tag":156,"props":2901,"children":2902},{"class":158,"line":609},[2903,2907,2911,2916,2920,2924,2928],{"type":53,"tag":156,"props":2904,"children":2905},{"style":173},[2906],{"type":58,"value":233},{"type":53,"tag":156,"props":2908,"children":2909},{"style":236},[2910],{"type":58,"value":239},{"type":53,"tag":156,"props":2912,"children":2913},{"style":185},[2914],{"type":58,"value":2915}," loader ",{"type":53,"tag":156,"props":2917,"children":2918},{"style":179},[2919],{"type":58,"value":249},{"type":53,"tag":156,"props":2921,"children":2922},{"style":179},[2923],{"type":58,"value":526},{"type":53,"tag":156,"props":2925,"children":2926},{"style":236},[2927],{"type":58,"value":269},{"type":53,"tag":156,"props":2929,"children":2930},{"style":179},[2931],{"type":58,"value":575},{"type":53,"tag":156,"props":2933,"children":2934},{"class":158,"line":621},[2935],{"type":53,"tag":156,"props":2936,"children":2937},{"emptyLinePlaceholder":221},[2938],{"type":58,"value":224},{"type":53,"tag":156,"props":2940,"children":2941},{"class":158,"line":629},[2942,2946,2950,2954,2958,2962],{"type":53,"tag":156,"props":2943,"children":2944},{"style":173},[2945],{"type":58,"value":233},{"type":53,"tag":156,"props":2947,"children":2948},{"style":173},[2949],{"type":58,"value":1835},{"type":53,"tag":156,"props":2951,"children":2952},{"style":236},[2953],{"type":58,"value":1840},{"type":53,"tag":156,"props":2955,"children":2956},{"style":252},[2957],{"type":58,"value":602},{"type":53,"tag":156,"props":2959,"children":2960},{"style":179},[2961],{"type":58,"value":264},{"type":53,"tag":156,"props":2963,"children":2964},{"style":179},[2965],{"type":58,"value":274},{"type":53,"tag":156,"props":2967,"children":2968},{"class":158,"line":650},[2969,2973,2977,2981,2985,2989,2993,2997,3001,3005,3009,3013,3017,3021,3025,3029,3033,3037,3041,3045,3049,3053,3057],{"type":53,"tag":156,"props":2970,"children":2971},{"style":236},[2972],{"type":58,"value":656},{"type":53,"tag":156,"props":2974,"children":2975},{"style":179},[2976],{"type":58,"value":182},{"type":53,"tag":156,"props":2978,"children":2979},{"style":294},[2980],{"type":58,"value":665},{"type":53,"tag":156,"props":2982,"children":2983},{"style":179},[2984],{"type":58,"value":302},{"type":53,"tag":156,"props":2986,"children":2987},{"style":185},[2988],{"type":58,"value":674},{"type":53,"tag":156,"props":2990,"children":2991},{"style":179},[2992],{"type":58,"value":193},{"type":53,"tag":156,"props":2994,"children":2995},{"style":179},[2996],{"type":58,"value":683},{"type":53,"tag":156,"props":2998,"children":2999},{"style":252},[3000],{"type":58,"value":404},{"type":53,"tag":156,"props":3002,"children":3003},{"style":294},[3004],{"type":58,"value":259},{"type":53,"tag":156,"props":3006,"children":3007},{"style":179},[3008],{"type":58,"value":259},{"type":53,"tag":156,"props":3010,"children":3011},{"style":698},[3012],{"type":58,"value":701},{"type":53,"tag":156,"props":3014,"children":3015},{"style":179},[3016],{"type":58,"value":706},{"type":53,"tag":156,"props":3018,"children":3019},{"style":236},[3020],{"type":58,"value":269},{"type":53,"tag":156,"props":3022,"children":3023},{"style":185},[3024],{"type":58,"value":715},{"type":53,"tag":156,"props":3026,"children":3027},{"style":179},[3028],{"type":58,"value":552},{"type":53,"tag":156,"props":3030,"children":3031},{"style":252},[3032],{"type":58,"value":724},{"type":53,"tag":156,"props":3034,"children":3035},{"style":294},[3036],{"type":58,"value":259},{"type":53,"tag":156,"props":3038,"children":3039},{"style":179},[3040],{"type":58,"value":733},{"type":53,"tag":156,"props":3042,"children":3043},{"style":294},[3044],{"type":58,"value":738},{"type":53,"tag":156,"props":3046,"children":3047},{"style":179},[3048],{"type":58,"value":302},{"type":53,"tag":156,"props":3050,"children":3051},{"style":185},[3052],{"type":58,"value":547},{"type":53,"tag":156,"props":3054,"children":3055},{"style":179},[3056],{"type":58,"value":193},{"type":53,"tag":156,"props":3058,"children":3059},{"style":294},[3060],{"type":58,"value":755},{"type":53,"tag":156,"props":3062,"children":3063},{"class":158,"line":758},[3064,3068],{"type":53,"tag":156,"props":3065,"children":3066},{"style":173},[3067],{"type":58,"value":283},{"type":53,"tag":156,"props":3069,"children":3070},{"style":294},[3071],{"type":58,"value":768},{"type":53,"tag":156,"props":3073,"children":3074},{"class":158,"line":771},[3075,3079,3083],{"type":53,"tag":156,"props":3076,"children":3077},{"style":179},[3078],{"type":58,"value":777},{"type":53,"tag":156,"props":3080,"children":3081},{"style":294},[3082],{"type":58,"value":782},{"type":53,"tag":156,"props":3084,"children":3085},{"style":179},[3086],{"type":58,"value":787},{"type":53,"tag":156,"props":3088,"children":3089},{"class":158,"line":790},[3090,3094,3098,3102,3106,3110,3114,3118,3122,3126],{"type":53,"tag":156,"props":3091,"children":3092},{"style":179},[3093],{"type":58,"value":796},{"type":53,"tag":156,"props":3095,"children":3096},{"style":185},[3097],{"type":58,"value":801},{"type":53,"tag":156,"props":3099,"children":3100},{"style":179},[3101],{"type":58,"value":552},{"type":53,"tag":156,"props":3103,"children":3104},{"style":252},[3105],{"type":58,"value":810},{"type":53,"tag":156,"props":3107,"children":3108},{"style":185},[3109],{"type":58,"value":259},{"type":53,"tag":156,"props":3111,"children":3112},{"style":179},[3113],{"type":58,"value":259},{"type":53,"tag":156,"props":3115,"children":3116},{"style":698},[3117],{"type":58,"value":823},{"type":53,"tag":156,"props":3119,"children":3120},{"style":179},[3121],{"type":58,"value":706},{"type":53,"tag":156,"props":3123,"children":3124},{"style":236},[3125],{"type":58,"value":269},{"type":53,"tag":156,"props":3127,"children":3128},{"style":185},[3129],{"type":58,"value":768},{"type":53,"tag":156,"props":3131,"children":3132},{"class":158,"line":838},[3133,3137,3141,3145,3149,3153,3157,3161,3165,3169,3173,3177,3181,3185],{"type":53,"tag":156,"props":3134,"children":3135},{"style":179},[3136],{"type":58,"value":844},{"type":53,"tag":156,"props":3138,"children":3139},{"style":294},[3140],{"type":58,"value":99},{"type":53,"tag":156,"props":3142,"children":3143},{"style":236},[3144],{"type":58,"value":853},{"type":53,"tag":156,"props":3146,"children":3147},{"style":179},[3148],{"type":58,"value":858},{"type":53,"tag":156,"props":3150,"children":3151},{"style":185},[3152],{"type":58,"value":823},{"type":53,"tag":156,"props":3154,"children":3155},{"style":179},[3156],{"type":58,"value":552},{"type":53,"tag":156,"props":3158,"children":3159},{"style":185},[3160],{"type":58,"value":871},{"type":53,"tag":156,"props":3162,"children":3163},{"style":179},[3164],{"type":58,"value":876},{"type":53,"tag":156,"props":3166,"children":3167},{"style":185},[3168],{"type":58,"value":823},{"type":53,"tag":156,"props":3170,"children":3171},{"style":179},[3172],{"type":58,"value":552},{"type":53,"tag":156,"props":3174,"children":3175},{"style":185},[3176],{"type":58,"value":58},{"type":53,"tag":156,"props":3178,"children":3179},{"style":179},[3180],{"type":58,"value":893},{"type":53,"tag":156,"props":3182,"children":3183},{"style":294},[3184],{"type":58,"value":99},{"type":53,"tag":156,"props":3186,"children":3187},{"style":179},[3188],{"type":58,"value":787},{"type":53,"tag":156,"props":3190,"children":3191},{"class":158,"line":904},[3192,3196],{"type":53,"tag":156,"props":3193,"children":3194},{"style":185},[3195],{"type":58,"value":910},{"type":53,"tag":156,"props":3197,"children":3198},{"style":179},[3199],{"type":58,"value":915},{"type":53,"tag":156,"props":3201,"children":3202},{"class":158,"line":918},[3203,3207,3211],{"type":53,"tag":156,"props":3204,"children":3205},{"style":179},[3206],{"type":58,"value":924},{"type":53,"tag":156,"props":3208,"children":3209},{"style":294},[3210],{"type":58,"value":782},{"type":53,"tag":156,"props":3212,"children":3213},{"style":179},[3214],{"type":58,"value":787},{"type":53,"tag":156,"props":3216,"children":3217},{"class":158,"line":935},[3218],{"type":53,"tag":156,"props":3219,"children":3220},{"style":294},[3221],{"type":58,"value":941},{"type":53,"tag":156,"props":3223,"children":3224},{"class":158,"line":944},[3225],{"type":53,"tag":156,"props":3226,"children":3227},{"style":179},[3228],{"type":58,"value":915},{"type":53,"tag":68,"props":3230,"children":3231},{"id":14},[3232],{"type":58,"value":13},{"type":53,"tag":138,"props":3234,"children":3236},{"id":3235},"client-only-component",[3237],{"type":58,"value":3238},"Client-only component",{"type":53,"tag":145,"props":3240,"children":3244},{"className":3241,"code":3242,"language":3243,"meta":150,"style":150},"language-vue shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","\u003C!-- pages\u002Ftodos.vue -->\n\u003Cscript setup lang=\"ts\">\nimport { useLiveQuery } from '@tanstack\u002Fvue-db'\n\nconst { data: todos, isLoading } = useLiveQuery((q) =>\n  q.from({ todo: todoCollection }),\n)\n\u003C\u002Fscript>\n\n\u003Ctemplate>\n  \u003CClientOnly>\n    \u003Cdiv v-if=\"isLoading\">Loading...\u003C\u002Fdiv>\n    \u003Cul v-else>\n      \u003Cli v-for=\"todo in todos\" :key=\"todo.id\">{{ todo.text }}\u003C\u002Fli>\n    \u003C\u002Ful>\n  \u003C\u002FClientOnly>\n\u003C\u002Ftemplate>\n","vue",[3245],{"type":53,"tag":105,"props":3246,"children":3247},{"__ignoreMap":150},[3248,3256,3300,3336,3343,3407,3455,3462,3477,3484,3500,3517,3569,3589,3666,3681,3697],{"type":53,"tag":156,"props":3249,"children":3250},{"class":158,"line":159},[3251],{"type":53,"tag":156,"props":3252,"children":3253},{"style":163},[3254],{"type":58,"value":3255},"\u003C!-- pages\u002Ftodos.vue -->\n",{"type":53,"tag":156,"props":3257,"children":3258},{"class":158,"line":169},[3259,3264,3269,3274,3279,3283,3288,3292,3296],{"type":53,"tag":156,"props":3260,"children":3261},{"style":179},[3262],{"type":58,"value":3263},"\u003C",{"type":53,"tag":156,"props":3265,"children":3266},{"style":294},[3267],{"type":58,"value":3268},"script",{"type":53,"tag":156,"props":3270,"children":3271},{"style":236},[3272],{"type":58,"value":3273}," setup",{"type":53,"tag":156,"props":3275,"children":3276},{"style":236},[3277],{"type":58,"value":3278}," lang",{"type":53,"tag":156,"props":3280,"children":3281},{"style":179},[3282],{"type":58,"value":249},{"type":53,"tag":156,"props":3284,"children":3285},{"style":179},[3286],{"type":58,"value":3287},"\"",{"type":53,"tag":156,"props":3289,"children":3290},{"style":206},[3291],{"type":58,"value":149},{"type":53,"tag":156,"props":3293,"children":3294},{"style":179},[3295],{"type":58,"value":3287},{"type":53,"tag":156,"props":3297,"children":3298},{"style":179},[3299],{"type":58,"value":787},{"type":53,"tag":156,"props":3301,"children":3302},{"class":158,"line":217},[3303,3307,3311,3315,3319,3323,3327,3332],{"type":53,"tag":156,"props":3304,"children":3305},{"style":173},[3306],{"type":58,"value":176},{"type":53,"tag":156,"props":3308,"children":3309},{"style":179},[3310],{"type":58,"value":182},{"type":53,"tag":156,"props":3312,"children":3313},{"style":185},[3314],{"type":58,"value":404},{"type":53,"tag":156,"props":3316,"children":3317},{"style":179},[3318],{"type":58,"value":193},{"type":53,"tag":156,"props":3320,"children":3321},{"style":173},[3322],{"type":58,"value":198},{"type":53,"tag":156,"props":3324,"children":3325},{"style":179},[3326],{"type":58,"value":203},{"type":53,"tag":156,"props":3328,"children":3329},{"style":206},[3330],{"type":58,"value":3331},"@tanstack\u002Fvue-db",{"type":53,"tag":156,"props":3333,"children":3334},{"style":179},[3335],{"type":58,"value":214},{"type":53,"tag":156,"props":3337,"children":3338},{"class":158,"line":227},[3339],{"type":53,"tag":156,"props":3340,"children":3341},{"emptyLinePlaceholder":221},[3342],{"type":58,"value":224},{"type":53,"tag":156,"props":3344,"children":3345},{"class":158,"line":277},[3346,3350,3354,3358,3362,3366,3370,3375,3379,3383,3387,3391,3395,3399,3403],{"type":53,"tag":156,"props":3347,"children":3348},{"style":236},[3349],{"type":58,"value":1072},{"type":53,"tag":156,"props":3351,"children":3352},{"style":179},[3353],{"type":58,"value":182},{"type":53,"tag":156,"props":3355,"children":3356},{"style":294},[3357],{"type":58,"value":665},{"type":53,"tag":156,"props":3359,"children":3360},{"style":179},[3361],{"type":58,"value":302},{"type":53,"tag":156,"props":3363,"children":3364},{"style":185},[3365],{"type":58,"value":674},{"type":53,"tag":156,"props":3367,"children":3368},{"style":179},[3369],{"type":58,"value":996},{"type":53,"tag":156,"props":3371,"children":3372},{"style":185},[3373],{"type":58,"value":3374}," isLoading ",{"type":53,"tag":156,"props":3376,"children":3377},{"style":179},[3378],{"type":58,"value":331},{"type":53,"tag":156,"props":3380,"children":3381},{"style":179},[3382],{"type":58,"value":683},{"type":53,"tag":156,"props":3384,"children":3385},{"style":252},[3386],{"type":58,"value":404},{"type":53,"tag":156,"props":3388,"children":3389},{"style":185},[3390],{"type":58,"value":259},{"type":53,"tag":156,"props":3392,"children":3393},{"style":179},[3394],{"type":58,"value":259},{"type":53,"tag":156,"props":3396,"children":3397},{"style":698},[3398],{"type":58,"value":701},{"type":53,"tag":156,"props":3400,"children":3401},{"style":179},[3402],{"type":58,"value":706},{"type":53,"tag":156,"props":3404,"children":3405},{"style":236},[3406],{"type":58,"value":1106},{"type":53,"tag":156,"props":3408,"children":3409},{"class":158,"line":290},[3410,3415,3419,3423,3427,3431,3435,3439,3443,3447,3451],{"type":53,"tag":156,"props":3411,"children":3412},{"style":185},[3413],{"type":58,"value":3414},"  q",{"type":53,"tag":156,"props":3416,"children":3417},{"style":179},[3418],{"type":58,"value":552},{"type":53,"tag":156,"props":3420,"children":3421},{"style":252},[3422],{"type":58,"value":724},{"type":53,"tag":156,"props":3424,"children":3425},{"style":185},[3426],{"type":58,"value":259},{"type":53,"tag":156,"props":3428,"children":3429},{"style":179},[3430],{"type":58,"value":733},{"type":53,"tag":156,"props":3432,"children":3433},{"style":294},[3434],{"type":58,"value":738},{"type":53,"tag":156,"props":3436,"children":3437},{"style":179},[3438],{"type":58,"value":302},{"type":53,"tag":156,"props":3440,"children":3441},{"style":185},[3442],{"type":58,"value":1147},{"type":53,"tag":156,"props":3444,"children":3445},{"style":179},[3446],{"type":58,"value":331},{"type":53,"tag":156,"props":3448,"children":3449},{"style":185},[3450],{"type":58,"value":706},{"type":53,"tag":156,"props":3452,"children":3453},{"style":179},[3454],{"type":58,"value":313},{"type":53,"tag":156,"props":3456,"children":3457},{"class":158,"line":316},[3458],{"type":53,"tag":156,"props":3459,"children":3460},{"style":185},[3461],{"type":58,"value":336},{"type":53,"tag":156,"props":3463,"children":3464},{"class":158,"line":325},[3465,3469,3473],{"type":53,"tag":156,"props":3466,"children":3467},{"style":179},[3468],{"type":58,"value":2031},{"type":53,"tag":156,"props":3470,"children":3471},{"style":294},[3472],{"type":58,"value":3268},{"type":53,"tag":156,"props":3474,"children":3475},{"style":179},[3476],{"type":58,"value":787},{"type":53,"tag":156,"props":3478,"children":3479},{"class":158,"line":578},[3480],{"type":53,"tag":156,"props":3481,"children":3482},{"emptyLinePlaceholder":221},[3483],{"type":58,"value":224},{"type":53,"tag":156,"props":3485,"children":3486},{"class":158,"line":587},[3487,3491,3496],{"type":53,"tag":156,"props":3488,"children":3489},{"style":179},[3490],{"type":58,"value":3263},{"type":53,"tag":156,"props":3492,"children":3493},{"style":294},[3494],{"type":58,"value":3495},"template",{"type":53,"tag":156,"props":3497,"children":3498},{"style":179},[3499],{"type":58,"value":787},{"type":53,"tag":156,"props":3501,"children":3502},{"class":158,"line":609},[3503,3508,3513],{"type":53,"tag":156,"props":3504,"children":3505},{"style":179},[3506],{"type":58,"value":3507},"  \u003C",{"type":53,"tag":156,"props":3509,"children":3510},{"style":294},[3511],{"type":58,"value":3512},"ClientOnly",{"type":53,"tag":156,"props":3514,"children":3515},{"style":179},[3516],{"type":58,"value":787},{"type":53,"tag":156,"props":3518,"children":3519},{"class":158,"line":621},[3520,3524,3528,3533,3537,3541,3545,3549,3553,3557,3561,3565],{"type":53,"tag":156,"props":3521,"children":3522},{"style":179},[3523],{"type":58,"value":777},{"type":53,"tag":156,"props":3525,"children":3526},{"style":294},[3527],{"type":58,"value":2016},{"type":53,"tag":156,"props":3529,"children":3530},{"style":236},[3531],{"type":58,"value":3532}," v-if",{"type":53,"tag":156,"props":3534,"children":3535},{"style":179},[3536],{"type":58,"value":249},{"type":53,"tag":156,"props":3538,"children":3539},{"style":179},[3540],{"type":58,"value":3287},{"type":53,"tag":156,"props":3542,"children":3543},{"style":206},[3544],{"type":58,"value":1996},{"type":53,"tag":156,"props":3546,"children":3547},{"style":179},[3548],{"type":58,"value":3287},{"type":53,"tag":156,"props":3550,"children":3551},{"style":179},[3552],{"type":58,"value":2021},{"type":53,"tag":156,"props":3554,"children":3555},{"style":185},[3556],{"type":58,"value":2026},{"type":53,"tag":156,"props":3558,"children":3559},{"style":179},[3560],{"type":58,"value":2031},{"type":53,"tag":156,"props":3562,"children":3563},{"style":294},[3564],{"type":58,"value":2016},{"type":53,"tag":156,"props":3566,"children":3567},{"style":179},[3568],{"type":58,"value":787},{"type":53,"tag":156,"props":3570,"children":3571},{"class":158,"line":629},[3572,3576,3580,3585],{"type":53,"tag":156,"props":3573,"children":3574},{"style":179},[3575],{"type":58,"value":777},{"type":53,"tag":156,"props":3577,"children":3578},{"style":294},[3579],{"type":58,"value":782},{"type":53,"tag":156,"props":3581,"children":3582},{"style":236},[3583],{"type":58,"value":3584}," v-else",{"type":53,"tag":156,"props":3586,"children":3587},{"style":179},[3588],{"type":58,"value":787},{"type":53,"tag":156,"props":3590,"children":3591},{"class":158,"line":650},[3592,3597,3601,3606,3610,3614,3619,3623,3628,3632,3636,3641,3645,3649,3654,3658,3662],{"type":53,"tag":156,"props":3593,"children":3594},{"style":179},[3595],{"type":58,"value":3596},"      \u003C",{"type":53,"tag":156,"props":3598,"children":3599},{"style":294},[3600],{"type":58,"value":99},{"type":53,"tag":156,"props":3602,"children":3603},{"style":236},[3604],{"type":58,"value":3605}," v-for",{"type":53,"tag":156,"props":3607,"children":3608},{"style":179},[3609],{"type":58,"value":249},{"type":53,"tag":156,"props":3611,"children":3612},{"style":179},[3613],{"type":58,"value":3287},{"type":53,"tag":156,"props":3615,"children":3616},{"style":206},[3617],{"type":58,"value":3618},"todo in todos",{"type":53,"tag":156,"props":3620,"children":3621},{"style":179},[3622],{"type":58,"value":3287},{"type":53,"tag":156,"props":3624,"children":3625},{"style":236},[3626],{"type":58,"value":3627}," :key",{"type":53,"tag":156,"props":3629,"children":3630},{"style":179},[3631],{"type":58,"value":249},{"type":53,"tag":156,"props":3633,"children":3634},{"style":179},[3635],{"type":58,"value":3287},{"type":53,"tag":156,"props":3637,"children":3638},{"style":206},[3639],{"type":58,"value":3640},"todo.id",{"type":53,"tag":156,"props":3642,"children":3643},{"style":179},[3644],{"type":58,"value":3287},{"type":53,"tag":156,"props":3646,"children":3647},{"style":179},[3648],{"type":58,"value":2021},{"type":53,"tag":156,"props":3650,"children":3651},{"style":185},[3652],{"type":58,"value":3653},"{{ todo.text }}",{"type":53,"tag":156,"props":3655,"children":3656},{"style":179},[3657],{"type":58,"value":2031},{"type":53,"tag":156,"props":3659,"children":3660},{"style":294},[3661],{"type":58,"value":99},{"type":53,"tag":156,"props":3663,"children":3664},{"style":179},[3665],{"type":58,"value":787},{"type":53,"tag":156,"props":3667,"children":3668},{"class":158,"line":758},[3669,3673,3677],{"type":53,"tag":156,"props":3670,"children":3671},{"style":179},[3672],{"type":58,"value":924},{"type":53,"tag":156,"props":3674,"children":3675},{"style":294},[3676],{"type":58,"value":782},{"type":53,"tag":156,"props":3678,"children":3679},{"style":179},[3680],{"type":58,"value":787},{"type":53,"tag":156,"props":3682,"children":3683},{"class":158,"line":771},[3684,3689,3693],{"type":53,"tag":156,"props":3685,"children":3686},{"style":179},[3687],{"type":58,"value":3688},"  \u003C\u002F",{"type":53,"tag":156,"props":3690,"children":3691},{"style":294},[3692],{"type":58,"value":3512},{"type":53,"tag":156,"props":3694,"children":3695},{"style":179},[3696],{"type":58,"value":787},{"type":53,"tag":156,"props":3698,"children":3699},{"class":158,"line":790},[3700,3704,3708],{"type":53,"tag":156,"props":3701,"children":3702},{"style":179},[3703],{"type":58,"value":2031},{"type":53,"tag":156,"props":3705,"children":3706},{"style":294},[3707],{"type":58,"value":3495},{"type":53,"tag":156,"props":3709,"children":3710},{"style":179},[3711],{"type":58,"value":787},{"type":53,"tag":54,"props":3713,"children":3714},{},[3715,3717,3723],{"type":58,"value":3716},"Wrap TanStack DB components in ",{"type":53,"tag":105,"props":3718,"children":3720},{"className":3719},[],[3721],{"type":58,"value":3722},"\u003CClientOnly>",{"type":58,"value":3724}," to prevent SSR.",{"type":53,"tag":68,"props":3726,"children":3727},{"id":18},[3728],{"type":58,"value":17},{"type":53,"tag":138,"props":3730,"children":3732},{"id":3731},"client-side-only-page",[3733],{"type":58,"value":3734},"Client-side only page",{"type":53,"tag":145,"props":3736,"children":3740},{"className":3737,"code":3738,"language":3739,"meta":150,"style":150},"language-svelte shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","\u003C!-- src\u002Froutes\u002Ftodos\u002F+page.svelte -->\n\u003Cscript lang=\"ts\">\n  import { browser } from '$app\u002Fenvironment'\n  import { useLiveQuery } from '@tanstack\u002Fsvelte-db'\n\n  const todosQuery = browser\n    ? useLiveQuery((q) => q.from({ todo: todoCollection }))\n    : null\n\u003C\u002Fscript>\n\n{#if todosQuery}\n  {#each todosQuery.data as todo (todo.id)}\n    \u003Cli>{todo.text}\u003C\u002Fli>\n  {\u002Feach}\n{\u002Fif}\n","svelte",[3741],{"type":53,"tag":105,"props":3742,"children":3743},{"__ignoreMap":150},[3744,3752,3760,3768,3776,3783,3791,3799,3807,3815,3822,3830,3838,3846,3854],{"type":53,"tag":156,"props":3745,"children":3746},{"class":158,"line":159},[3747],{"type":53,"tag":156,"props":3748,"children":3749},{},[3750],{"type":58,"value":3751},"\u003C!-- src\u002Froutes\u002Ftodos\u002F+page.svelte -->\n",{"type":53,"tag":156,"props":3753,"children":3754},{"class":158,"line":169},[3755],{"type":53,"tag":156,"props":3756,"children":3757},{},[3758],{"type":58,"value":3759},"\u003Cscript lang=\"ts\">\n",{"type":53,"tag":156,"props":3761,"children":3762},{"class":158,"line":217},[3763],{"type":53,"tag":156,"props":3764,"children":3765},{},[3766],{"type":58,"value":3767},"  import { browser } from '$app\u002Fenvironment'\n",{"type":53,"tag":156,"props":3769,"children":3770},{"class":158,"line":227},[3771],{"type":53,"tag":156,"props":3772,"children":3773},{},[3774],{"type":58,"value":3775},"  import { useLiveQuery } from '@tanstack\u002Fsvelte-db'\n",{"type":53,"tag":156,"props":3777,"children":3778},{"class":158,"line":277},[3779],{"type":53,"tag":156,"props":3780,"children":3781},{"emptyLinePlaceholder":221},[3782],{"type":58,"value":224},{"type":53,"tag":156,"props":3784,"children":3785},{"class":158,"line":290},[3786],{"type":53,"tag":156,"props":3787,"children":3788},{},[3789],{"type":58,"value":3790},"  const todosQuery = browser\n",{"type":53,"tag":156,"props":3792,"children":3793},{"class":158,"line":316},[3794],{"type":53,"tag":156,"props":3795,"children":3796},{},[3797],{"type":58,"value":3798},"    ? useLiveQuery((q) => q.from({ todo: todoCollection }))\n",{"type":53,"tag":156,"props":3800,"children":3801},{"class":158,"line":325},[3802],{"type":53,"tag":156,"props":3803,"children":3804},{},[3805],{"type":58,"value":3806},"    : null\n",{"type":53,"tag":156,"props":3808,"children":3809},{"class":158,"line":578},[3810],{"type":53,"tag":156,"props":3811,"children":3812},{},[3813],{"type":58,"value":3814},"\u003C\u002Fscript>\n",{"type":53,"tag":156,"props":3816,"children":3817},{"class":158,"line":587},[3818],{"type":53,"tag":156,"props":3819,"children":3820},{"emptyLinePlaceholder":221},[3821],{"type":58,"value":224},{"type":53,"tag":156,"props":3823,"children":3824},{"class":158,"line":609},[3825],{"type":53,"tag":156,"props":3826,"children":3827},{},[3828],{"type":58,"value":3829},"{#if todosQuery}\n",{"type":53,"tag":156,"props":3831,"children":3832},{"class":158,"line":621},[3833],{"type":53,"tag":156,"props":3834,"children":3835},{},[3836],{"type":58,"value":3837},"  {#each todosQuery.data as todo (todo.id)}\n",{"type":53,"tag":156,"props":3839,"children":3840},{"class":158,"line":629},[3841],{"type":53,"tag":156,"props":3842,"children":3843},{},[3844],{"type":58,"value":3845},"    \u003Cli>{todo.text}\u003C\u002Fli>\n",{"type":53,"tag":156,"props":3847,"children":3848},{"class":158,"line":650},[3849],{"type":53,"tag":156,"props":3850,"children":3851},{},[3852],{"type":58,"value":3853},"  {\u002Feach}\n",{"type":53,"tag":156,"props":3855,"children":3856},{"class":158,"line":758},[3857],{"type":53,"tag":156,"props":3858,"children":3859},{},[3860],{"type":58,"value":3861},"{\u002Fif}\n",{"type":53,"tag":54,"props":3863,"children":3864},{},[3865],{"type":58,"value":3866},"Or disable SSR for the route:",{"type":53,"tag":145,"props":3868,"children":3870},{"className":147,"code":3869,"language":149,"meta":150,"style":150},"\u002F\u002F src\u002Froutes\u002Ftodos\u002F+page.ts\nexport const ssr = false\n",[3871],{"type":53,"tag":105,"props":3872,"children":3873},{"__ignoreMap":150},[3874,3882],{"type":53,"tag":156,"props":3875,"children":3876},{"class":158,"line":159},[3877],{"type":53,"tag":156,"props":3878,"children":3879},{"style":163},[3880],{"type":58,"value":3881},"\u002F\u002F src\u002Froutes\u002Ftodos\u002F+page.ts\n",{"type":53,"tag":156,"props":3883,"children":3884},{"class":158,"line":169},[3885,3889,3893,3898,3902],{"type":53,"tag":156,"props":3886,"children":3887},{"style":173},[3888],{"type":58,"value":233},{"type":53,"tag":156,"props":3890,"children":3891},{"style":236},[3892],{"type":58,"value":239},{"type":53,"tag":156,"props":3894,"children":3895},{"style":185},[3896],{"type":58,"value":3897}," ssr ",{"type":53,"tag":156,"props":3899,"children":3900},{"style":179},[3901],{"type":58,"value":249},{"type":53,"tag":156,"props":3903,"children":3904},{"style":305},[3905],{"type":58,"value":3906}," false\n",{"type":53,"tag":68,"props":3908,"children":3910},{"id":3909},"core-patterns",[3911],{"type":58,"value":3912},"Core Patterns",{"type":53,"tag":138,"props":3914,"children":3916},{"id":3915},"what-preload-does",[3917],{"type":58,"value":3918},"What preload() does",{"type":53,"tag":54,"props":3920,"children":3921},{},[3922,3924,3930],{"type":58,"value":3923},"For eager collections, ",{"type":53,"tag":105,"props":3925,"children":3927},{"className":3926},[],[3928],{"type":58,"value":3929},"collection.preload()",{"type":58,"value":3931}," starts the sync process and\nreturns a promise that resolves when the collection reaches \"ready\" status.\nThis means:",{"type":53,"tag":95,"props":3933,"children":3934},{},[3935,3940,3945,3956],{"type":53,"tag":99,"props":3936,"children":3937},{},[3938],{"type":58,"value":3939},"The sync function connects to the backend",{"type":53,"tag":99,"props":3941,"children":3942},{},[3943],{"type":58,"value":3944},"Initial data is fetched and written to the collection",{"type":53,"tag":99,"props":3946,"children":3947},{},[3948,3954],{"type":53,"tag":105,"props":3949,"children":3951},{"className":3950},[],[3952],{"type":58,"value":3953},"markReady()",{"type":58,"value":3955}," is called by the adapter",{"type":53,"tag":99,"props":3957,"children":3958},{},[3959],{"type":58,"value":3960},"The promise resolves",{"type":53,"tag":54,"props":3962,"children":3963},{},[3964,3966,3971],{"type":58,"value":3965},"Subsequent calls to ",{"type":53,"tag":105,"props":3967,"children":3969},{"className":3968},[],[3970],{"type":58,"value":966},{"type":58,"value":3972}," on an already-ready collection return immediately.",{"type":53,"tag":54,"props":3974,"children":3975},{},[3976,3978,3983,3985,3991],{"type":58,"value":3977},"For on-demand collections, source ",{"type":53,"tag":105,"props":3979,"children":3981},{"className":3980},[],[3982],{"type":58,"value":3929},{"type":58,"value":3984}," warns and does\nnothing because no subset has been requested. Create the required live query\nand await ",{"type":53,"tag":105,"props":3986,"children":3988},{"className":3987},[],[3989],{"type":58,"value":3990},"liveQuery.preload()",{"type":58,"value":552},{"type":53,"tag":138,"props":3993,"children":3995},{"id":3994},"collection-module-pattern",[3996],{"type":58,"value":3997},"Collection module pattern",{"type":53,"tag":54,"props":3999,"children":4000},{},[4001],{"type":58,"value":4002},"Define collections in a shared module, import in both loaders and components:",{"type":53,"tag":145,"props":4004,"children":4006},{"className":147,"code":4005,"language":149,"meta":150,"style":150},"\u002F\u002F lib\u002Fcollections.ts\nimport { createCollection, queryCollectionOptions } from '@tanstack\u002Freact-db'\n\nexport const todoCollection = createCollection(\n  queryCollectionOptions({ ... })\n)\n",[4007],{"type":53,"tag":105,"props":4008,"children":4009},{"__ignoreMap":150},[4010,4018,4063,4070,4098,4127],{"type":53,"tag":156,"props":4011,"children":4012},{"class":158,"line":159},[4013],{"type":53,"tag":156,"props":4014,"children":4015},{"style":163},[4016],{"type":58,"value":4017},"\u002F\u002F lib\u002Fcollections.ts\n",{"type":53,"tag":156,"props":4019,"children":4020},{"class":158,"line":169},[4021,4025,4029,4034,4038,4043,4047,4051,4055,4059],{"type":53,"tag":156,"props":4022,"children":4023},{"style":173},[4024],{"type":58,"value":176},{"type":53,"tag":156,"props":4026,"children":4027},{"style":179},[4028],{"type":58,"value":182},{"type":53,"tag":156,"props":4030,"children":4031},{"style":185},[4032],{"type":58,"value":4033}," createCollection",{"type":53,"tag":156,"props":4035,"children":4036},{"style":179},[4037],{"type":58,"value":996},{"type":53,"tag":156,"props":4039,"children":4040},{"style":185},[4041],{"type":58,"value":4042}," queryCollectionOptions",{"type":53,"tag":156,"props":4044,"children":4045},{"style":179},[4046],{"type":58,"value":193},{"type":53,"tag":156,"props":4048,"children":4049},{"style":173},[4050],{"type":58,"value":198},{"type":53,"tag":156,"props":4052,"children":4053},{"style":179},[4054],{"type":58,"value":203},{"type":53,"tag":156,"props":4056,"children":4057},{"style":206},[4058],{"type":58,"value":421},{"type":53,"tag":156,"props":4060,"children":4061},{"style":179},[4062],{"type":58,"value":214},{"type":53,"tag":156,"props":4064,"children":4065},{"class":158,"line":217},[4066],{"type":53,"tag":156,"props":4067,"children":4068},{"emptyLinePlaceholder":221},[4069],{"type":58,"value":224},{"type":53,"tag":156,"props":4071,"children":4072},{"class":158,"line":227},[4073,4077,4081,4085,4089,4093],{"type":53,"tag":156,"props":4074,"children":4075},{"style":173},[4076],{"type":58,"value":233},{"type":53,"tag":156,"props":4078,"children":4079},{"style":236},[4080],{"type":58,"value":239},{"type":53,"tag":156,"props":4082,"children":4083},{"style":185},[4084],{"type":58,"value":1147},{"type":53,"tag":156,"props":4086,"children":4087},{"style":179},[4088],{"type":58,"value":249},{"type":53,"tag":156,"props":4090,"children":4091},{"style":252},[4092],{"type":58,"value":4033},{"type":53,"tag":156,"props":4094,"children":4095},{"style":185},[4096],{"type":58,"value":4097},"(\n",{"type":53,"tag":156,"props":4099,"children":4100},{"class":158,"line":277},[4101,4106,4110,4114,4119,4123],{"type":53,"tag":156,"props":4102,"children":4103},{"style":252},[4104],{"type":58,"value":4105},"  queryCollectionOptions",{"type":53,"tag":156,"props":4107,"children":4108},{"style":185},[4109],{"type":58,"value":259},{"type":53,"tag":156,"props":4111,"children":4112},{"style":179},[4113],{"type":58,"value":733},{"type":53,"tag":156,"props":4115,"children":4116},{"style":179},[4117],{"type":58,"value":4118}," ...",{"type":53,"tag":156,"props":4120,"children":4121},{"style":179},[4122],{"type":58,"value":193},{"type":53,"tag":156,"props":4124,"children":4125},{"style":185},[4126],{"type":58,"value":336},{"type":53,"tag":156,"props":4128,"children":4129},{"class":158,"line":290},[4130],{"type":53,"tag":156,"props":4131,"children":4132},{"style":185},[4133],{"type":58,"value":336},{"type":53,"tag":145,"props":4135,"children":4137},{"className":345,"code":4136,"language":347,"meta":150,"style":150},"\u002F\u002F routes\u002Ftodos.tsx — loader uses the same collection instance\nimport { todoCollection } from '..\u002Flib\u002Fcollections'\n\nexport const Route = createFileRoute('\u002Ftodos')({\n  ssr: false,\n  loader: async () => {\n    await todoCollection.preload()\n    return null\n  },\n  component: () => {\n    const { data } = useLiveQuery((q) => q.from({ todo: todoCollection }))\n    \u002F\u002F ...\n  },\n})\n",[4138],{"type":53,"tag":105,"props":4139,"children":4140},{"__ignoreMap":150},[4141,4149,4185,4192,4239,4258,4285,4308,4319,4326,4349,4436,4443,4450],{"type":53,"tag":156,"props":4142,"children":4143},{"class":158,"line":159},[4144],{"type":53,"tag":156,"props":4145,"children":4146},{"style":163},[4147],{"type":58,"value":4148},"\u002F\u002F routes\u002Ftodos.tsx — loader uses the same collection instance\n",{"type":53,"tag":156,"props":4150,"children":4151},{"class":158,"line":169},[4152,4156,4160,4164,4168,4172,4176,4181],{"type":53,"tag":156,"props":4153,"children":4154},{"style":173},[4155],{"type":58,"value":176},{"type":53,"tag":156,"props":4157,"children":4158},{"style":179},[4159],{"type":58,"value":182},{"type":53,"tag":156,"props":4161,"children":4162},{"style":185},[4163],{"type":58,"value":547},{"type":53,"tag":156,"props":4165,"children":4166},{"style":179},[4167],{"type":58,"value":193},{"type":53,"tag":156,"props":4169,"children":4170},{"style":173},[4171],{"type":58,"value":198},{"type":53,"tag":156,"props":4173,"children":4174},{"style":179},[4175],{"type":58,"value":203},{"type":53,"tag":156,"props":4177,"children":4178},{"style":206},[4179],{"type":58,"value":4180},"..\u002Flib\u002Fcollections",{"type":53,"tag":156,"props":4182,"children":4183},{"style":179},[4184],{"type":58,"value":214},{"type":53,"tag":156,"props":4186,"children":4187},{"class":158,"line":217},[4188],{"type":53,"tag":156,"props":4189,"children":4190},{"emptyLinePlaceholder":221},[4191],{"type":58,"value":224},{"type":53,"tag":156,"props":4193,"children":4194},{"class":158,"line":227},[4195,4199,4203,4207,4211,4215,4219,4223,4227,4231,4235],{"type":53,"tag":156,"props":4196,"children":4197},{"style":173},[4198],{"type":58,"value":233},{"type":53,"tag":156,"props":4200,"children":4201},{"style":236},[4202],{"type":58,"value":239},{"type":53,"tag":156,"props":4204,"children":4205},{"style":185},[4206],{"type":58,"value":448},{"type":53,"tag":156,"props":4208,"children":4209},{"style":179},[4210],{"type":58,"value":249},{"type":53,"tag":156,"props":4212,"children":4213},{"style":252},[4214],{"type":58,"value":367},{"type":53,"tag":156,"props":4216,"children":4217},{"style":185},[4218],{"type":58,"value":259},{"type":53,"tag":156,"props":4220,"children":4221},{"style":179},[4222],{"type":58,"value":465},{"type":53,"tag":156,"props":4224,"children":4225},{"style":206},[4226],{"type":58,"value":470},{"type":53,"tag":156,"props":4228,"children":4229},{"style":179},[4230],{"type":58,"value":465},{"type":53,"tag":156,"props":4232,"children":4233},{"style":185},[4234],{"type":58,"value":479},{"type":53,"tag":156,"props":4236,"children":4237},{"style":179},[4238],{"type":58,"value":484},{"type":53,"tag":156,"props":4240,"children":4241},{"class":158,"line":277},[4242,4246,4250,4254],{"type":53,"tag":156,"props":4243,"children":4244},{"style":294},[4245],{"type":58,"value":492},{"type":53,"tag":156,"props":4247,"children":4248},{"style":179},[4249],{"type":58,"value":302},{"type":53,"tag":156,"props":4251,"children":4252},{"style":305},[4253],{"type":58,"value":308},{"type":53,"tag":156,"props":4255,"children":4256},{"style":179},[4257],{"type":58,"value":313},{"type":53,"tag":156,"props":4259,"children":4260},{"class":158,"line":290},[4261,4265,4269,4273,4277,4281],{"type":53,"tag":156,"props":4262,"children":4263},{"style":252},[4264],{"type":58,"value":512},{"type":53,"tag":156,"props":4266,"children":4267},{"style":179},[4268],{"type":58,"value":302},{"type":53,"tag":156,"props":4270,"children":4271},{"style":236},[4272],{"type":58,"value":521},{"type":53,"tag":156,"props":4274,"children":4275},{"style":179},[4276],{"type":58,"value":526},{"type":53,"tag":156,"props":4278,"children":4279},{"style":236},[4280],{"type":58,"value":269},{"type":53,"tag":156,"props":4282,"children":4283},{"style":179},[4284],{"type":58,"value":274},{"type":53,"tag":156,"props":4286,"children":4287},{"class":158,"line":316},[4288,4292,4296,4300,4304],{"type":53,"tag":156,"props":4289,"children":4290},{"style":173},[4291],{"type":58,"value":542},{"type":53,"tag":156,"props":4293,"children":4294},{"style":185},[4295],{"type":58,"value":547},{"type":53,"tag":156,"props":4297,"children":4298},{"style":179},[4299],{"type":58,"value":552},{"type":53,"tag":156,"props":4301,"children":4302},{"style":252},[4303],{"type":58,"value":557},{"type":53,"tag":156,"props":4305,"children":4306},{"style":294},[4307],{"type":58,"value":562},{"type":53,"tag":156,"props":4309,"children":4310},{"class":158,"line":325},[4311,4315],{"type":53,"tag":156,"props":4312,"children":4313},{"style":173},[4314],{"type":58,"value":570},{"type":53,"tag":156,"props":4316,"children":4317},{"style":179},[4318],{"type":58,"value":575},{"type":53,"tag":156,"props":4320,"children":4321},{"class":158,"line":578},[4322],{"type":53,"tag":156,"props":4323,"children":4324},{"style":179},[4325],{"type":58,"value":584},{"type":53,"tag":156,"props":4327,"children":4328},{"class":158,"line":587},[4329,4333,4337,4341,4345],{"type":53,"tag":156,"props":4330,"children":4331},{"style":252},[4332],{"type":58,"value":593},{"type":53,"tag":156,"props":4334,"children":4335},{"style":179},[4336],{"type":58,"value":302},{"type":53,"tag":156,"props":4338,"children":4339},{"style":179},[4340],{"type":58,"value":526},{"type":53,"tag":156,"props":4342,"children":4343},{"style":236},[4344],{"type":58,"value":269},{"type":53,"tag":156,"props":4346,"children":4347},{"style":179},[4348],{"type":58,"value":274},{"type":53,"tag":156,"props":4350,"children":4351},{"class":158,"line":609},[4352,4356,4360,4364,4368,4372,4376,4380,4384,4388,4392,4396,4400,4404,4408,4412,4416,4420,4424,4428,4432],{"type":53,"tag":156,"props":4353,"children":4354},{"style":236},[4355],{"type":58,"value":1404},{"type":53,"tag":156,"props":4357,"children":4358},{"style":179},[4359],{"type":58,"value":182},{"type":53,"tag":156,"props":4361,"children":4362},{"style":185},[4363],{"type":58,"value":665},{"type":53,"tag":156,"props":4365,"children":4366},{"style":179},[4367],{"type":58,"value":193},{"type":53,"tag":156,"props":4369,"children":4370},{"style":179},[4371],{"type":58,"value":683},{"type":53,"tag":156,"props":4373,"children":4374},{"style":252},[4375],{"type":58,"value":404},{"type":53,"tag":156,"props":4377,"children":4378},{"style":294},[4379],{"type":58,"value":259},{"type":53,"tag":156,"props":4381,"children":4382},{"style":179},[4383],{"type":58,"value":259},{"type":53,"tag":156,"props":4385,"children":4386},{"style":698},[4387],{"type":58,"value":701},{"type":53,"tag":156,"props":4389,"children":4390},{"style":179},[4391],{"type":58,"value":706},{"type":53,"tag":156,"props":4393,"children":4394},{"style":236},[4395],{"type":58,"value":269},{"type":53,"tag":156,"props":4397,"children":4398},{"style":185},[4399],{"type":58,"value":715},{"type":53,"tag":156,"props":4401,"children":4402},{"style":179},[4403],{"type":58,"value":552},{"type":53,"tag":156,"props":4405,"children":4406},{"style":252},[4407],{"type":58,"value":724},{"type":53,"tag":156,"props":4409,"children":4410},{"style":294},[4411],{"type":58,"value":259},{"type":53,"tag":156,"props":4413,"children":4414},{"style":179},[4415],{"type":58,"value":733},{"type":53,"tag":156,"props":4417,"children":4418},{"style":294},[4419],{"type":58,"value":738},{"type":53,"tag":156,"props":4421,"children":4422},{"style":179},[4423],{"type":58,"value":302},{"type":53,"tag":156,"props":4425,"children":4426},{"style":185},[4427],{"type":58,"value":547},{"type":53,"tag":156,"props":4429,"children":4430},{"style":179},[4431],{"type":58,"value":193},{"type":53,"tag":156,"props":4433,"children":4434},{"style":294},[4435],{"type":58,"value":755},{"type":53,"tag":156,"props":4437,"children":4438},{"class":158,"line":621},[4439],{"type":53,"tag":156,"props":4440,"children":4441},{"style":163},[4442],{"type":58,"value":1445},{"type":53,"tag":156,"props":4444,"children":4445},{"class":158,"line":629},[4446],{"type":53,"tag":156,"props":4447,"children":4448},{"style":179},[4449],{"type":58,"value":584},{"type":53,"tag":156,"props":4451,"children":4452},{"class":158,"line":650},[4453,4457],{"type":53,"tag":156,"props":4454,"children":4455},{"style":179},[4456],{"type":58,"value":331},{"type":53,"tag":156,"props":4458,"children":4459},{"style":185},[4460],{"type":58,"value":336},{"type":53,"tag":68,"props":4462,"children":4464},{"id":4463},"server-side-integration",[4465],{"type":58,"value":4466},"Server-Side Integration",{"type":53,"tag":54,"props":4468,"children":4469},{},[4470,4472,4477],{"type":58,"value":4471},"This skill covers the ",{"type":53,"tag":80,"props":4473,"children":4474},{},[4475],{"type":58,"value":4476},"client-side",{"type":58,"value":4478}," read path only (preloading, live queries). For server-side concerns:",{"type":53,"tag":782,"props":4480,"children":4481},{},[4482,4499],{"type":53,"tag":99,"props":4483,"children":4484},{},[4485,4490,4492],{"type":53,"tag":80,"props":4486,"children":4487},{},[4488],{"type":58,"value":4489},"Electric proxy route",{"type":58,"value":4491}," (forwarding shape requests to Electric) — see the ",{"type":53,"tag":4493,"props":4494,"children":4496},"a",{"href":4495},"..\u002Fdb-core\u002Fcollection-setup\u002Freferences\u002Felectric-adapter.md",[4497],{"type":58,"value":4498},"Electric adapter reference",{"type":53,"tag":99,"props":4500,"children":4501},{},[4502,4507,4508,4514],{"type":53,"tag":80,"props":4503,"children":4504},{},[4505],{"type":58,"value":4506},"Mutation endpoints",{"type":58,"value":1991},{"type":53,"tag":105,"props":4509,"children":4511},{"className":4510},[],[4512],{"type":58,"value":4513},"createServerFn",{"type":58,"value":4515}," in TanStack Start, API routes in Next.js\u002FRemix) — implement using your framework's server function pattern. See the Electric adapter reference for the txid handshake that mutations must return.",{"type":53,"tag":68,"props":4517,"children":4519},{"id":4518},"common-mistakes",[4520],{"type":58,"value":4521},"Common Mistakes",{"type":53,"tag":138,"props":4523,"children":4525},{"id":4524},"critical-enabling-ssr-with-tanstack-db",[4526],{"type":58,"value":4527},"CRITICAL Enabling SSR with TanStack DB",{"type":53,"tag":54,"props":4529,"children":4530},{},[4531],{"type":58,"value":4532},"Wrong:",{"type":53,"tag":145,"props":4534,"children":4536},{"className":345,"code":4535,"language":347,"meta":150,"style":150},"export const Route = createFileRoute('\u002Ftodos')({\n  loader: async () => {\n    await todoCollection.preload()\n    return null\n  },\n})\n",[4537],{"type":53,"tag":105,"props":4538,"children":4539},{"__ignoreMap":150},[4540,4587,4614,4637,4648,4655],{"type":53,"tag":156,"props":4541,"children":4542},{"class":158,"line":159},[4543,4547,4551,4555,4559,4563,4567,4571,4575,4579,4583],{"type":53,"tag":156,"props":4544,"children":4545},{"style":173},[4546],{"type":58,"value":233},{"type":53,"tag":156,"props":4548,"children":4549},{"style":236},[4550],{"type":58,"value":239},{"type":53,"tag":156,"props":4552,"children":4553},{"style":185},[4554],{"type":58,"value":448},{"type":53,"tag":156,"props":4556,"children":4557},{"style":179},[4558],{"type":58,"value":249},{"type":53,"tag":156,"props":4560,"children":4561},{"style":252},[4562],{"type":58,"value":367},{"type":53,"tag":156,"props":4564,"children":4565},{"style":185},[4566],{"type":58,"value":259},{"type":53,"tag":156,"props":4568,"children":4569},{"style":179},[4570],{"type":58,"value":465},{"type":53,"tag":156,"props":4572,"children":4573},{"style":206},[4574],{"type":58,"value":470},{"type":53,"tag":156,"props":4576,"children":4577},{"style":179},[4578],{"type":58,"value":465},{"type":53,"tag":156,"props":4580,"children":4581},{"style":185},[4582],{"type":58,"value":479},{"type":53,"tag":156,"props":4584,"children":4585},{"style":179},[4586],{"type":58,"value":484},{"type":53,"tag":156,"props":4588,"children":4589},{"class":158,"line":169},[4590,4594,4598,4602,4606,4610],{"type":53,"tag":156,"props":4591,"children":4592},{"style":252},[4593],{"type":58,"value":512},{"type":53,"tag":156,"props":4595,"children":4596},{"style":179},[4597],{"type":58,"value":302},{"type":53,"tag":156,"props":4599,"children":4600},{"style":236},[4601],{"type":58,"value":521},{"type":53,"tag":156,"props":4603,"children":4604},{"style":179},[4605],{"type":58,"value":526},{"type":53,"tag":156,"props":4607,"children":4608},{"style":236},[4609],{"type":58,"value":269},{"type":53,"tag":156,"props":4611,"children":4612},{"style":179},[4613],{"type":58,"value":274},{"type":53,"tag":156,"props":4615,"children":4616},{"class":158,"line":217},[4617,4621,4625,4629,4633],{"type":53,"tag":156,"props":4618,"children":4619},{"style":173},[4620],{"type":58,"value":542},{"type":53,"tag":156,"props":4622,"children":4623},{"style":185},[4624],{"type":58,"value":547},{"type":53,"tag":156,"props":4626,"children":4627},{"style":179},[4628],{"type":58,"value":552},{"type":53,"tag":156,"props":4630,"children":4631},{"style":252},[4632],{"type":58,"value":557},{"type":53,"tag":156,"props":4634,"children":4635},{"style":294},[4636],{"type":58,"value":562},{"type":53,"tag":156,"props":4638,"children":4639},{"class":158,"line":227},[4640,4644],{"type":53,"tag":156,"props":4641,"children":4642},{"style":173},[4643],{"type":58,"value":570},{"type":53,"tag":156,"props":4645,"children":4646},{"style":179},[4647],{"type":58,"value":575},{"type":53,"tag":156,"props":4649,"children":4650},{"class":158,"line":277},[4651],{"type":53,"tag":156,"props":4652,"children":4653},{"style":179},[4654],{"type":58,"value":584},{"type":53,"tag":156,"props":4656,"children":4657},{"class":158,"line":290},[4658,4662],{"type":53,"tag":156,"props":4659,"children":4660},{"style":179},[4661],{"type":58,"value":331},{"type":53,"tag":156,"props":4663,"children":4664},{"style":185},[4665],{"type":58,"value":336},{"type":53,"tag":54,"props":4667,"children":4668},{},[4669],{"type":58,"value":4670},"Correct:",{"type":53,"tag":145,"props":4672,"children":4674},{"className":345,"code":4673,"language":347,"meta":150,"style":150},"export const Route = createFileRoute('\u002Ftodos')({\n  ssr: false,\n  loader: async () => {\n    await todoCollection.preload()\n    return null\n  },\n})\n",[4675],{"type":53,"tag":105,"props":4676,"children":4677},{"__ignoreMap":150},[4678,4725,4744,4771,4794,4805,4812],{"type":53,"tag":156,"props":4679,"children":4680},{"class":158,"line":159},[4681,4685,4689,4693,4697,4701,4705,4709,4713,4717,4721],{"type":53,"tag":156,"props":4682,"children":4683},{"style":173},[4684],{"type":58,"value":233},{"type":53,"tag":156,"props":4686,"children":4687},{"style":236},[4688],{"type":58,"value":239},{"type":53,"tag":156,"props":4690,"children":4691},{"style":185},[4692],{"type":58,"value":448},{"type":53,"tag":156,"props":4694,"children":4695},{"style":179},[4696],{"type":58,"value":249},{"type":53,"tag":156,"props":4698,"children":4699},{"style":252},[4700],{"type":58,"value":367},{"type":53,"tag":156,"props":4702,"children":4703},{"style":185},[4704],{"type":58,"value":259},{"type":53,"tag":156,"props":4706,"children":4707},{"style":179},[4708],{"type":58,"value":465},{"type":53,"tag":156,"props":4710,"children":4711},{"style":206},[4712],{"type":58,"value":470},{"type":53,"tag":156,"props":4714,"children":4715},{"style":179},[4716],{"type":58,"value":465},{"type":53,"tag":156,"props":4718,"children":4719},{"style":185},[4720],{"type":58,"value":479},{"type":53,"tag":156,"props":4722,"children":4723},{"style":179},[4724],{"type":58,"value":484},{"type":53,"tag":156,"props":4726,"children":4727},{"class":158,"line":169},[4728,4732,4736,4740],{"type":53,"tag":156,"props":4729,"children":4730},{"style":294},[4731],{"type":58,"value":492},{"type":53,"tag":156,"props":4733,"children":4734},{"style":179},[4735],{"type":58,"value":302},{"type":53,"tag":156,"props":4737,"children":4738},{"style":305},[4739],{"type":58,"value":308},{"type":53,"tag":156,"props":4741,"children":4742},{"style":179},[4743],{"type":58,"value":313},{"type":53,"tag":156,"props":4745,"children":4746},{"class":158,"line":217},[4747,4751,4755,4759,4763,4767],{"type":53,"tag":156,"props":4748,"children":4749},{"style":252},[4750],{"type":58,"value":512},{"type":53,"tag":156,"props":4752,"children":4753},{"style":179},[4754],{"type":58,"value":302},{"type":53,"tag":156,"props":4756,"children":4757},{"style":236},[4758],{"type":58,"value":521},{"type":53,"tag":156,"props":4760,"children":4761},{"style":179},[4762],{"type":58,"value":526},{"type":53,"tag":156,"props":4764,"children":4765},{"style":236},[4766],{"type":58,"value":269},{"type":53,"tag":156,"props":4768,"children":4769},{"style":179},[4770],{"type":58,"value":274},{"type":53,"tag":156,"props":4772,"children":4773},{"class":158,"line":227},[4774,4778,4782,4786,4790],{"type":53,"tag":156,"props":4775,"children":4776},{"style":173},[4777],{"type":58,"value":542},{"type":53,"tag":156,"props":4779,"children":4780},{"style":185},[4781],{"type":58,"value":547},{"type":53,"tag":156,"props":4783,"children":4784},{"style":179},[4785],{"type":58,"value":552},{"type":53,"tag":156,"props":4787,"children":4788},{"style":252},[4789],{"type":58,"value":557},{"type":53,"tag":156,"props":4791,"children":4792},{"style":294},[4793],{"type":58,"value":562},{"type":53,"tag":156,"props":4795,"children":4796},{"class":158,"line":277},[4797,4801],{"type":53,"tag":156,"props":4798,"children":4799},{"style":173},[4800],{"type":58,"value":570},{"type":53,"tag":156,"props":4802,"children":4803},{"style":179},[4804],{"type":58,"value":575},{"type":53,"tag":156,"props":4806,"children":4807},{"class":158,"line":290},[4808],{"type":53,"tag":156,"props":4809,"children":4810},{"style":179},[4811],{"type":58,"value":584},{"type":53,"tag":156,"props":4813,"children":4814},{"class":158,"line":316},[4815,4819],{"type":53,"tag":156,"props":4816,"children":4817},{"style":179},[4818],{"type":58,"value":331},{"type":53,"tag":156,"props":4820,"children":4821},{"style":185},[4822],{"type":58,"value":336},{"type":53,"tag":54,"props":4824,"children":4825},{},[4826,4828,4833],{"type":58,"value":4827},"TanStack DB collections are client-side only. Without ",{"type":53,"tag":105,"props":4829,"children":4831},{"className":4830},[],[4832],{"type":58,"value":110},{"type":58,"value":4834},", the route loader runs on the server where collections cannot sync, causing hangs or errors.",{"type":53,"tag":54,"props":4836,"children":4837},{},[4838],{"type":58,"value":4839},"Source: examples\u002Freact\u002Ftodo\u002Fsrc\u002Fstart.tsx",{"type":53,"tag":138,"props":4841,"children":4843},{"id":4842},"high-forgetting-to-preload-in-route-loader",[4844],{"type":58,"value":4845},"HIGH Forgetting to preload in route loader",{"type":53,"tag":54,"props":4847,"children":4848},{},[4849],{"type":58,"value":4532},{"type":53,"tag":145,"props":4851,"children":4853},{"className":345,"code":4852,"language":347,"meta":150,"style":150},"export const Route = createFileRoute('\u002Ftodos')({\n  ssr: false,\n  component: TodoPage,\n})\n",[4854],{"type":53,"tag":105,"props":4855,"children":4856},{"__ignoreMap":150},[4857,4904,4923,4942],{"type":53,"tag":156,"props":4858,"children":4859},{"class":158,"line":159},[4860,4864,4868,4872,4876,4880,4884,4888,4892,4896,4900],{"type":53,"tag":156,"props":4861,"children":4862},{"style":173},[4863],{"type":58,"value":233},{"type":53,"tag":156,"props":4865,"children":4866},{"style":236},[4867],{"type":58,"value":239},{"type":53,"tag":156,"props":4869,"children":4870},{"style":185},[4871],{"type":58,"value":448},{"type":53,"tag":156,"props":4873,"children":4874},{"style":179},[4875],{"type":58,"value":249},{"type":53,"tag":156,"props":4877,"children":4878},{"style":252},[4879],{"type":58,"value":367},{"type":53,"tag":156,"props":4881,"children":4882},{"style":185},[4883],{"type":58,"value":259},{"type":53,"tag":156,"props":4885,"children":4886},{"style":179},[4887],{"type":58,"value":465},{"type":53,"tag":156,"props":4889,"children":4890},{"style":206},[4891],{"type":58,"value":470},{"type":53,"tag":156,"props":4893,"children":4894},{"style":179},[4895],{"type":58,"value":465},{"type":53,"tag":156,"props":4897,"children":4898},{"style":185},[4899],{"type":58,"value":479},{"type":53,"tag":156,"props":4901,"children":4902},{"style":179},[4903],{"type":58,"value":484},{"type":53,"tag":156,"props":4905,"children":4906},{"class":158,"line":169},[4907,4911,4915,4919],{"type":53,"tag":156,"props":4908,"children":4909},{"style":294},[4910],{"type":58,"value":492},{"type":53,"tag":156,"props":4912,"children":4913},{"style":179},[4914],{"type":58,"value":302},{"type":53,"tag":156,"props":4916,"children":4917},{"style":305},[4918],{"type":58,"value":308},{"type":53,"tag":156,"props":4920,"children":4921},{"style":179},[4922],{"type":58,"value":313},{"type":53,"tag":156,"props":4924,"children":4925},{"class":158,"line":217},[4926,4930,4934,4938],{"type":53,"tag":156,"props":4927,"children":4928},{"style":294},[4929],{"type":58,"value":593},{"type":53,"tag":156,"props":4931,"children":4932},{"style":179},[4933],{"type":58,"value":302},{"type":53,"tag":156,"props":4935,"children":4936},{"style":185},[4937],{"type":58,"value":602},{"type":53,"tag":156,"props":4939,"children":4940},{"style":179},[4941],{"type":58,"value":313},{"type":53,"tag":156,"props":4943,"children":4944},{"class":158,"line":227},[4945,4949],{"type":53,"tag":156,"props":4946,"children":4947},{"style":179},[4948],{"type":58,"value":331},{"type":53,"tag":156,"props":4950,"children":4951},{"style":185},[4952],{"type":58,"value":336},{"type":53,"tag":54,"props":4954,"children":4955},{},[4956],{"type":58,"value":4670},{"type":53,"tag":145,"props":4958,"children":4960},{"className":345,"code":4959,"language":347,"meta":150,"style":150},"export const Route = createFileRoute('\u002Ftodos')({\n  ssr: false,\n  loader: async () => {\n    await todoCollection.preload()\n    return null\n  },\n  component: TodoPage,\n})\n",[4961],{"type":53,"tag":105,"props":4962,"children":4963},{"__ignoreMap":150},[4964,5011,5030,5057,5080,5091,5098,5117],{"type":53,"tag":156,"props":4965,"children":4966},{"class":158,"line":159},[4967,4971,4975,4979,4983,4987,4991,4995,4999,5003,5007],{"type":53,"tag":156,"props":4968,"children":4969},{"style":173},[4970],{"type":58,"value":233},{"type":53,"tag":156,"props":4972,"children":4973},{"style":236},[4974],{"type":58,"value":239},{"type":53,"tag":156,"props":4976,"children":4977},{"style":185},[4978],{"type":58,"value":448},{"type":53,"tag":156,"props":4980,"children":4981},{"style":179},[4982],{"type":58,"value":249},{"type":53,"tag":156,"props":4984,"children":4985},{"style":252},[4986],{"type":58,"value":367},{"type":53,"tag":156,"props":4988,"children":4989},{"style":185},[4990],{"type":58,"value":259},{"type":53,"tag":156,"props":4992,"children":4993},{"style":179},[4994],{"type":58,"value":465},{"type":53,"tag":156,"props":4996,"children":4997},{"style":206},[4998],{"type":58,"value":470},{"type":53,"tag":156,"props":5000,"children":5001},{"style":179},[5002],{"type":58,"value":465},{"type":53,"tag":156,"props":5004,"children":5005},{"style":185},[5006],{"type":58,"value":479},{"type":53,"tag":156,"props":5008,"children":5009},{"style":179},[5010],{"type":58,"value":484},{"type":53,"tag":156,"props":5012,"children":5013},{"class":158,"line":169},[5014,5018,5022,5026],{"type":53,"tag":156,"props":5015,"children":5016},{"style":294},[5017],{"type":58,"value":492},{"type":53,"tag":156,"props":5019,"children":5020},{"style":179},[5021],{"type":58,"value":302},{"type":53,"tag":156,"props":5023,"children":5024},{"style":305},[5025],{"type":58,"value":308},{"type":53,"tag":156,"props":5027,"children":5028},{"style":179},[5029],{"type":58,"value":313},{"type":53,"tag":156,"props":5031,"children":5032},{"class":158,"line":217},[5033,5037,5041,5045,5049,5053],{"type":53,"tag":156,"props":5034,"children":5035},{"style":252},[5036],{"type":58,"value":512},{"type":53,"tag":156,"props":5038,"children":5039},{"style":179},[5040],{"type":58,"value":302},{"type":53,"tag":156,"props":5042,"children":5043},{"style":236},[5044],{"type":58,"value":521},{"type":53,"tag":156,"props":5046,"children":5047},{"style":179},[5048],{"type":58,"value":526},{"type":53,"tag":156,"props":5050,"children":5051},{"style":236},[5052],{"type":58,"value":269},{"type":53,"tag":156,"props":5054,"children":5055},{"style":179},[5056],{"type":58,"value":274},{"type":53,"tag":156,"props":5058,"children":5059},{"class":158,"line":227},[5060,5064,5068,5072,5076],{"type":53,"tag":156,"props":5061,"children":5062},{"style":173},[5063],{"type":58,"value":542},{"type":53,"tag":156,"props":5065,"children":5066},{"style":185},[5067],{"type":58,"value":547},{"type":53,"tag":156,"props":5069,"children":5070},{"style":179},[5071],{"type":58,"value":552},{"type":53,"tag":156,"props":5073,"children":5074},{"style":252},[5075],{"type":58,"value":557},{"type":53,"tag":156,"props":5077,"children":5078},{"style":294},[5079],{"type":58,"value":562},{"type":53,"tag":156,"props":5081,"children":5082},{"class":158,"line":277},[5083,5087],{"type":53,"tag":156,"props":5084,"children":5085},{"style":173},[5086],{"type":58,"value":570},{"type":53,"tag":156,"props":5088,"children":5089},{"style":179},[5090],{"type":58,"value":575},{"type":53,"tag":156,"props":5092,"children":5093},{"class":158,"line":290},[5094],{"type":53,"tag":156,"props":5095,"children":5096},{"style":179},[5097],{"type":58,"value":584},{"type":53,"tag":156,"props":5099,"children":5100},{"class":158,"line":316},[5101,5105,5109,5113],{"type":53,"tag":156,"props":5102,"children":5103},{"style":294},[5104],{"type":58,"value":593},{"type":53,"tag":156,"props":5106,"children":5107},{"style":179},[5108],{"type":58,"value":302},{"type":53,"tag":156,"props":5110,"children":5111},{"style":185},[5112],{"type":58,"value":602},{"type":53,"tag":156,"props":5114,"children":5115},{"style":179},[5116],{"type":58,"value":313},{"type":53,"tag":156,"props":5118,"children":5119},{"class":158,"line":325},[5120,5124],{"type":53,"tag":156,"props":5121,"children":5122},{"style":179},[5123],{"type":58,"value":331},{"type":53,"tag":156,"props":5125,"children":5126},{"style":185},[5127],{"type":58,"value":336},{"type":53,"tag":54,"props":5129,"children":5130},{},[5131],{"type":58,"value":5132},"Without preloading, the collection starts syncing only when the component mounts, causing a loading flash. Preloading in the route loader starts sync during navigation, making data available immediately when the component renders.",{"type":53,"tag":138,"props":5134,"children":5136},{"id":5135},"medium-creating-separate-collection-instances",[5137],{"type":58,"value":5138},"MEDIUM Creating separate collection instances",{"type":53,"tag":54,"props":5140,"children":5141},{},[5142],{"type":58,"value":4532},{"type":53,"tag":145,"props":5144,"children":5146},{"className":345,"code":5145,"language":347,"meta":150,"style":150},"\u002F\u002F routes\u002Ftodos.tsx\nconst todoCollection = createCollection(queryCollectionOptions({ ... }))\n\nexport const Route = createFileRoute('\u002Ftodos')({\n  ssr: false,\n  loader: async () => { await todoCollection.preload() },\n  component: () => {\n    const { data } = useLiveQuery((q) => q.from({ todo: todoCollection }))\n  },\n})\n",[5147],{"type":53,"tag":105,"props":5148,"children":5149},{"__ignoreMap":150},[5150,5158,5206,5213,5260,5279,5333,5356,5443,5450],{"type":53,"tag":156,"props":5151,"children":5152},{"class":158,"line":159},[5153],{"type":53,"tag":156,"props":5154,"children":5155},{"style":163},[5156],{"type":58,"value":5157},"\u002F\u002F routes\u002Ftodos.tsx\n",{"type":53,"tag":156,"props":5159,"children":5160},{"class":158,"line":169},[5161,5165,5169,5173,5177,5181,5186,5190,5194,5198,5202],{"type":53,"tag":156,"props":5162,"children":5163},{"style":236},[5164],{"type":58,"value":1072},{"type":53,"tag":156,"props":5166,"children":5167},{"style":185},[5168],{"type":58,"value":1147},{"type":53,"tag":156,"props":5170,"children":5171},{"style":179},[5172],{"type":58,"value":249},{"type":53,"tag":156,"props":5174,"children":5175},{"style":252},[5176],{"type":58,"value":4033},{"type":53,"tag":156,"props":5178,"children":5179},{"style":185},[5180],{"type":58,"value":259},{"type":53,"tag":156,"props":5182,"children":5183},{"style":252},[5184],{"type":58,"value":5185},"queryCollectionOptions",{"type":53,"tag":156,"props":5187,"children":5188},{"style":185},[5189],{"type":58,"value":259},{"type":53,"tag":156,"props":5191,"children":5192},{"style":179},[5193],{"type":58,"value":733},{"type":53,"tag":156,"props":5195,"children":5196},{"style":179},[5197],{"type":58,"value":4118},{"type":53,"tag":156,"props":5199,"children":5200},{"style":179},[5201],{"type":58,"value":193},{"type":53,"tag":156,"props":5203,"children":5204},{"style":185},[5205],{"type":58,"value":755},{"type":53,"tag":156,"props":5207,"children":5208},{"class":158,"line":217},[5209],{"type":53,"tag":156,"props":5210,"children":5211},{"emptyLinePlaceholder":221},[5212],{"type":58,"value":224},{"type":53,"tag":156,"props":5214,"children":5215},{"class":158,"line":227},[5216,5220,5224,5228,5232,5236,5240,5244,5248,5252,5256],{"type":53,"tag":156,"props":5217,"children":5218},{"style":173},[5219],{"type":58,"value":233},{"type":53,"tag":156,"props":5221,"children":5222},{"style":236},[5223],{"type":58,"value":239},{"type":53,"tag":156,"props":5225,"children":5226},{"style":185},[5227],{"type":58,"value":448},{"type":53,"tag":156,"props":5229,"children":5230},{"style":179},[5231],{"type":58,"value":249},{"type":53,"tag":156,"props":5233,"children":5234},{"style":252},[5235],{"type":58,"value":367},{"type":53,"tag":156,"props":5237,"children":5238},{"style":185},[5239],{"type":58,"value":259},{"type":53,"tag":156,"props":5241,"children":5242},{"style":179},[5243],{"type":58,"value":465},{"type":53,"tag":156,"props":5245,"children":5246},{"style":206},[5247],{"type":58,"value":470},{"type":53,"tag":156,"props":5249,"children":5250},{"style":179},[5251],{"type":58,"value":465},{"type":53,"tag":156,"props":5253,"children":5254},{"style":185},[5255],{"type":58,"value":479},{"type":53,"tag":156,"props":5257,"children":5258},{"style":179},[5259],{"type":58,"value":484},{"type":53,"tag":156,"props":5261,"children":5262},{"class":158,"line":277},[5263,5267,5271,5275],{"type":53,"tag":156,"props":5264,"children":5265},{"style":294},[5266],{"type":58,"value":492},{"type":53,"tag":156,"props":5268,"children":5269},{"style":179},[5270],{"type":58,"value":302},{"type":53,"tag":156,"props":5272,"children":5273},{"style":305},[5274],{"type":58,"value":308},{"type":53,"tag":156,"props":5276,"children":5277},{"style":179},[5278],{"type":58,"value":313},{"type":53,"tag":156,"props":5280,"children":5281},{"class":158,"line":290},[5282,5286,5290,5294,5298,5302,5306,5311,5315,5319,5323,5328],{"type":53,"tag":156,"props":5283,"children":5284},{"style":252},[5285],{"type":58,"value":512},{"type":53,"tag":156,"props":5287,"children":5288},{"style":179},[5289],{"type":58,"value":302},{"type":53,"tag":156,"props":5291,"children":5292},{"style":236},[5293],{"type":58,"value":521},{"type":53,"tag":156,"props":5295,"children":5296},{"style":179},[5297],{"type":58,"value":526},{"type":53,"tag":156,"props":5299,"children":5300},{"style":236},[5301],{"type":58,"value":269},{"type":53,"tag":156,"props":5303,"children":5304},{"style":179},[5305],{"type":58,"value":182},{"type":53,"tag":156,"props":5307,"children":5308},{"style":173},[5309],{"type":58,"value":5310}," await",{"type":53,"tag":156,"props":5312,"children":5313},{"style":185},[5314],{"type":58,"value":547},{"type":53,"tag":156,"props":5316,"children":5317},{"style":179},[5318],{"type":58,"value":552},{"type":53,"tag":156,"props":5320,"children":5321},{"style":252},[5322],{"type":58,"value":557},{"type":53,"tag":156,"props":5324,"children":5325},{"style":294},[5326],{"type":58,"value":5327},"() ",{"type":53,"tag":156,"props":5329,"children":5330},{"style":179},[5331],{"type":58,"value":5332},"},\n",{"type":53,"tag":156,"props":5334,"children":5335},{"class":158,"line":316},[5336,5340,5344,5348,5352],{"type":53,"tag":156,"props":5337,"children":5338},{"style":252},[5339],{"type":58,"value":593},{"type":53,"tag":156,"props":5341,"children":5342},{"style":179},[5343],{"type":58,"value":302},{"type":53,"tag":156,"props":5345,"children":5346},{"style":179},[5347],{"type":58,"value":526},{"type":53,"tag":156,"props":5349,"children":5350},{"style":236},[5351],{"type":58,"value":269},{"type":53,"tag":156,"props":5353,"children":5354},{"style":179},[5355],{"type":58,"value":274},{"type":53,"tag":156,"props":5357,"children":5358},{"class":158,"line":325},[5359,5363,5367,5371,5375,5379,5383,5387,5391,5395,5399,5403,5407,5411,5415,5419,5423,5427,5431,5435,5439],{"type":53,"tag":156,"props":5360,"children":5361},{"style":236},[5362],{"type":58,"value":1404},{"type":53,"tag":156,"props":5364,"children":5365},{"style":179},[5366],{"type":58,"value":182},{"type":53,"tag":156,"props":5368,"children":5369},{"style":185},[5370],{"type":58,"value":665},{"type":53,"tag":156,"props":5372,"children":5373},{"style":179},[5374],{"type":58,"value":193},{"type":53,"tag":156,"props":5376,"children":5377},{"style":179},[5378],{"type":58,"value":683},{"type":53,"tag":156,"props":5380,"children":5381},{"style":252},[5382],{"type":58,"value":404},{"type":53,"tag":156,"props":5384,"children":5385},{"style":294},[5386],{"type":58,"value":259},{"type":53,"tag":156,"props":5388,"children":5389},{"style":179},[5390],{"type":58,"value":259},{"type":53,"tag":156,"props":5392,"children":5393},{"style":698},[5394],{"type":58,"value":701},{"type":53,"tag":156,"props":5396,"children":5397},{"style":179},[5398],{"type":58,"value":706},{"type":53,"tag":156,"props":5400,"children":5401},{"style":236},[5402],{"type":58,"value":269},{"type":53,"tag":156,"props":5404,"children":5405},{"style":185},[5406],{"type":58,"value":715},{"type":53,"tag":156,"props":5408,"children":5409},{"style":179},[5410],{"type":58,"value":552},{"type":53,"tag":156,"props":5412,"children":5413},{"style":252},[5414],{"type":58,"value":724},{"type":53,"tag":156,"props":5416,"children":5417},{"style":294},[5418],{"type":58,"value":259},{"type":53,"tag":156,"props":5420,"children":5421},{"style":179},[5422],{"type":58,"value":733},{"type":53,"tag":156,"props":5424,"children":5425},{"style":294},[5426],{"type":58,"value":738},{"type":53,"tag":156,"props":5428,"children":5429},{"style":179},[5430],{"type":58,"value":302},{"type":53,"tag":156,"props":5432,"children":5433},{"style":185},[5434],{"type":58,"value":547},{"type":53,"tag":156,"props":5436,"children":5437},{"style":179},[5438],{"type":58,"value":193},{"type":53,"tag":156,"props":5440,"children":5441},{"style":294},[5442],{"type":58,"value":755},{"type":53,"tag":156,"props":5444,"children":5445},{"class":158,"line":578},[5446],{"type":53,"tag":156,"props":5447,"children":5448},{"style":179},[5449],{"type":58,"value":584},{"type":53,"tag":156,"props":5451,"children":5452},{"class":158,"line":587},[5453,5457],{"type":53,"tag":156,"props":5454,"children":5455},{"style":179},[5456],{"type":58,"value":331},{"type":53,"tag":156,"props":5458,"children":5459},{"style":185},[5460],{"type":58,"value":336},{"type":53,"tag":54,"props":5462,"children":5463},{},[5464],{"type":58,"value":4670},{"type":53,"tag":145,"props":5466,"children":5468},{"className":147,"code":5467,"language":149,"meta":150,"style":150},"\u002F\u002F lib\u002Fcollections.ts — single shared instance\nexport const todoCollection = createCollection(queryCollectionOptions({ ... }))\n",[5469],{"type":53,"tag":105,"props":5470,"children":5471},{"__ignoreMap":150},[5472,5480],{"type":53,"tag":156,"props":5473,"children":5474},{"class":158,"line":159},[5475],{"type":53,"tag":156,"props":5476,"children":5477},{"style":163},[5478],{"type":58,"value":5479},"\u002F\u002F lib\u002Fcollections.ts — single shared instance\n",{"type":53,"tag":156,"props":5481,"children":5482},{"class":158,"line":169},[5483,5487,5491,5495,5499,5503,5507,5511,5515,5519,5523,5527],{"type":53,"tag":156,"props":5484,"children":5485},{"style":173},[5486],{"type":58,"value":233},{"type":53,"tag":156,"props":5488,"children":5489},{"style":236},[5490],{"type":58,"value":239},{"type":53,"tag":156,"props":5492,"children":5493},{"style":185},[5494],{"type":58,"value":1147},{"type":53,"tag":156,"props":5496,"children":5497},{"style":179},[5498],{"type":58,"value":249},{"type":53,"tag":156,"props":5500,"children":5501},{"style":252},[5502],{"type":58,"value":4033},{"type":53,"tag":156,"props":5504,"children":5505},{"style":185},[5506],{"type":58,"value":259},{"type":53,"tag":156,"props":5508,"children":5509},{"style":252},[5510],{"type":58,"value":5185},{"type":53,"tag":156,"props":5512,"children":5513},{"style":185},[5514],{"type":58,"value":259},{"type":53,"tag":156,"props":5516,"children":5517},{"style":179},[5518],{"type":58,"value":733},{"type":53,"tag":156,"props":5520,"children":5521},{"style":179},[5522],{"type":58,"value":4118},{"type":53,"tag":156,"props":5524,"children":5525},{"style":179},[5526],{"type":58,"value":193},{"type":53,"tag":156,"props":5528,"children":5529},{"style":185},[5530],{"type":58,"value":755},{"type":53,"tag":54,"props":5532,"children":5533},{},[5534],{"type":58,"value":5535},"Collections are singletons. Creating multiple instances for the same data causes duplicate syncs, wasted bandwidth, and inconsistent state between components.",{"type":53,"tag":54,"props":5537,"children":5538},{},[5539],{"type":58,"value":5540},"See also: react-db\u002FSKILL.md, vue-db\u002FSKILL.md, svelte-db\u002FSKILL.md, solid-db\u002FSKILL.md, angular-db\u002FSKILL.md — for framework-specific hook usage.",{"type":53,"tag":54,"props":5542,"children":5543},{},[5544],{"type":58,"value":5545},"See also: db-core\u002Fcollection-setup\u002FSKILL.md — for collection creation and adapter selection.",{"type":53,"tag":5547,"props":5548,"children":5549},"style",{},[5550],{"type":58,"value":5551},"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":5553,"total":629},[5554,5568,5579,5589,5602,5615,5628],{"slug":5555,"name":5555,"fn":5556,"description":5557,"org":5558,"tags":5559,"stars":26,"repoUrl":27,"updatedAt":5567},"angular-db","integrate TanStack DB with Angular","Angular bindings for TanStack DB. injectLiveQuery inject function with Angular signals (Signal\u003CT>) for all return values. Reactive params pattern ({ params: () => T, query: ({ params, q }) => QueryBuilder }) for dynamic queries. Must be called in injection context. Angular 17+ control flow (@if, @for) and signal inputs supported. Import from @tanstack\u002Fangular-db (re-exports all of @tanstack\u002Fdb).\n",{"slug":8,"name":9,"logoUrl":10,"githubOrg":9},[5560,5563,5564],{"name":5561,"slug":5562,"type":15},"Angular","angular",{"name":23,"slug":24,"type":15},{"name":5565,"slug":5566,"type":15},"TypeScript","typescript","2026-07-16T06:01:16.345046",{"slug":43,"name":43,"fn":5569,"description":5570,"org":5571,"tags":5572,"stars":26,"repoUrl":27,"updatedAt":5578},"manage database collections with TanStack DB","TanStack DB core concepts: createCollection with queryCollectionOptions, electricCollectionOptions, powerSyncCollectionOptions, rxdbCollectionOptions, trailbaseCollectionOptions, localOnlyCollectionOptions. Live queries via query builder (from, where, join, select, groupBy, orderBy, limit). Optimistic mutations with draft proxy (collection.insert, collection.update, collection.delete). createOptimisticAction, createTransaction, createPacedMutations. Entry point for all TanStack DB skills.\n",{"slug":8,"name":9,"logoUrl":10,"githubOrg":9},[5573,5576,5577],{"name":5574,"slug":5575,"type":15},"Data Modeling","data-modeling",{"name":23,"slug":24,"type":15},{"name":9,"slug":8,"type":15},"2026-07-17T06:06:40.214285",{"slug":5580,"name":44,"fn":5581,"description":5582,"org":5583,"tags":5584,"stars":26,"repoUrl":27,"updatedAt":5588},"db-corecollection-setup","set up typed collections in TanStack DB","Creating typed collections with createCollection. Adapter selection: queryCollectionOptions (REST\u002FTanStack Query), electricCollectionOptions (ElectricSQL real-time sync), powerSyncCollectionOptions (PowerSync SQLite), rxdbCollectionOptions (RxDB), trailbaseCollectionOptions (TrailBase), localOnlyCollectionOptions, localStorageCollectionOptions. CollectionConfig options: getKey, schema, sync, gcTime, autoIndex (default off), defaultIndexType, syncMode (eager\u002Fon-demand, plus progressive for Electric). StandardSchema validation with Zod\u002FValibot\u002FArkType. Collection lifecycle (idle\u002Floading\u002Fready\u002Ferror). Adapter-specific sync patterns including Electric txid tracking, Query direct writes, and PowerSync query-driven sync with onLoad\u002FonLoadSubset hooks.\n",{"slug":8,"name":9,"logoUrl":10,"githubOrg":9},[5585,5586,5587],{"name":5574,"slug":5575,"type":15},{"name":23,"slug":24,"type":15},{"name":9,"slug":8,"type":15},"2026-07-26T05:48:58.321777",{"slug":5590,"name":5591,"fn":5592,"description":5593,"org":5594,"tags":5595,"stars":26,"repoUrl":27,"updatedAt":5601},"db-corecustom-adapter","db-core\u002Fcustom-adapter","build custom TanStack collection adapters","Building custom collection adapters for new backends. SyncConfig interface: sync function receiving begin, write, commit, markReady, truncate, metadata primitives. ChangeMessage format (insert, update, delete). loadSubset for on-demand sync. LoadSubsetOptions (where, orderBy, limit, cursor). Expression parsing: parseWhereExpression, parseOrderByExpression, extractSimpleComparisons, parseLoadSubsetOptions. Collection options creator pattern. rowUpdateMode (partial vs full). Subscription lifecycle and cleanup functions. Persisted sync metadata API (metadata.row and metadata.collection) for storing per-row and per-collection adapter state.\n",{"slug":8,"name":9,"logoUrl":10,"githubOrg":9},[5596,5597,5600],{"name":23,"slug":24,"type":15},{"name":5598,"slug":5599,"type":15},"Engineering","engineering",{"name":9,"slug":8,"type":15},"2026-07-16T06:04:06.862485",{"slug":5603,"name":5604,"fn":5605,"description":5606,"org":5607,"tags":5608,"stars":26,"repoUrl":27,"updatedAt":5614},"db-corelive-queries","db-core\u002Flive-queries","build live queries with TanStack DB","Query builder fluent API: from, where, join, leftJoin, rightJoin, innerJoin, fullJoin, select, fn.select, groupBy, having, orderBy, limit, offset, distinct, findOne. Operators: eq, gt, gte, lt, lte, like, ilike, inArray, isNull, isUndefined, and, or, not. Aggregates: count, sum, avg, min, max. String functions: upper, lower, length, concat. Utility: coalesce, caseWhen. Math: add. $selected namespace. createLiveQueryCollection. Derived collections. Predicate push-down. Incremental view maintenance via differential dataflow (d2ts). Virtual properties ($synced, $origin, $key, $collectionId). Includes subqueries for hierarchical data. toArray and concat(toArray(...)) scalar includes. queryOnce for one-shot queries. createEffect for reactive side effects (onEnter, onUpdate, onExit, onBatch).\n",{"slug":8,"name":9,"logoUrl":10,"githubOrg":9},[5609,5610,5613],{"name":23,"slug":24,"type":15},{"name":5611,"slug":5612,"type":15},"SQL","sql",{"name":9,"slug":8,"type":15},"2026-07-16T06:04:08.757365",{"slug":5616,"name":5617,"fn":5618,"description":5619,"org":5620,"tags":5621,"stars":26,"repoUrl":27,"updatedAt":5627},"db-coremutations-optimistic","db-core\u002Fmutations-optimistic","manage optimistic mutations in TanStack DB","collection.insert, collection.update (Immer-style draft proxy), collection.delete. createOptimisticAction (onMutate + mutationFn). createPacedMutations with debounceStrategy, throttleStrategy, queueStrategy. createTransaction, getActiveTransaction, ambient transaction context. Transaction lifecycle (pending\u002Fpersisting\u002Fcompleted\u002Ffailed). Mutation merging. onInsert\u002FonUpdate\u002FonDelete handlers. PendingMutation type. Transaction.isPersisted.\n",{"slug":8,"name":9,"logoUrl":10,"githubOrg":9},[5622,5623,5626],{"name":23,"slug":24,"type":15},{"name":5624,"slug":5625,"type":15},"Frontend","frontend",{"name":9,"slug":8,"type":15},"2026-07-26T05:48:57.301803",{"slug":5629,"name":5630,"fn":5631,"description":5632,"org":5633,"tags":5634,"stars":26,"repoUrl":27,"updatedAt":5643},"db-corepersistence","db-core\u002Fpersistence","implement SQLite-backed persistence for TanStack DB","SQLite-backed persistence for TanStack DB collections. persistedCollectionOptions wraps any adapter (Electric, Query, PowerSync, or local-only) with durable local storage. Platform adapters: browser (WA-SQLite OPFS), React Native (op-sqlite), Expo (expo-sqlite), Electron (IPC), Node (better-sqlite3), Capacitor, Tauri, Cloudflare Durable Objects. Multi-tab\u002Fmulti-process coordination via BrowserCollectionCoordinator \u002F ElectronCollectionCoordinator \u002F SingleProcessCoordinator. schemaVersion for migration resets. Local-only mode for offline-first without a server.\n",{"slug":8,"name":9,"logoUrl":10,"githubOrg":9},[5635,5636,5639,5642],{"name":23,"slug":24,"type":15},{"name":5637,"slug":5638,"type":15},"Persistence","persistence",{"name":5640,"slug":5641,"type":15},"SQLite","sqlite",{"name":9,"slug":8,"type":15},"2026-07-17T06:06:39.182084",{"items":5645,"total":5785},[5646,5660,5672,5684,5699,5711,5721,5731,5744,5754,5765,5775],{"slug":5647,"name":5647,"fn":5648,"description":5649,"org":5650,"tags":5651,"stars":5657,"repoUrl":5658,"updatedAt":5659},"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},[5652,5655,5656],{"name":5653,"slug":5654,"type":15},"Data Analysis","data-analysis",{"name":5624,"slug":5625,"type":15},{"name":9,"slug":8,"type":15},28175,"https:\u002F\u002Fgithub.com\u002FTanStack\u002Ftable","2026-07-30T05:25:59.429787",{"slug":5661,"name":5661,"fn":5662,"description":5663,"org":5664,"tags":5665,"stars":5657,"repoUrl":5658,"updatedAt":5671},"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},[5666,5669,5670],{"name":5667,"slug":5668,"type":15},"Debugging","debugging",{"name":5624,"slug":5625,"type":15},{"name":9,"slug":8,"type":15},"2026-07-30T05:26:05.418735",{"slug":5673,"name":5673,"fn":5674,"description":5675,"org":5676,"tags":5677,"stars":5657,"repoUrl":5658,"updatedAt":5683},"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},[5678,5679,5680],{"name":5653,"slug":5654,"type":15},{"name":9,"slug":8,"type":15},{"name":5681,"slug":5682,"type":15},"UI Components","ui-components","2026-07-30T05:25:38.403427",{"slug":5685,"name":5685,"fn":5686,"description":5687,"org":5688,"tags":5689,"stars":5657,"repoUrl":5658,"updatedAt":5698},"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},[5690,5693,5694,5697],{"name":5691,"slug":5692,"type":15},"Data Pipeline","data-pipeline",{"name":5624,"slug":5625,"type":15},{"name":5695,"slug":5696,"type":15},"Performance","performance",{"name":9,"slug":8,"type":15},"2026-07-30T05:25:45.400104",{"slug":5700,"name":5700,"fn":5701,"description":5702,"org":5703,"tags":5704,"stars":5657,"repoUrl":5658,"updatedAt":5710},"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},[5705,5708,5709],{"name":5706,"slug":5707,"type":15},"Data Visualization","data-visualization",{"name":5624,"slug":5625,"type":15},{"name":9,"slug":8,"type":15},"2026-07-30T05:25:41.397257",{"slug":5712,"name":5712,"fn":5713,"description":5714,"org":5715,"tags":5716,"stars":5657,"repoUrl":5658,"updatedAt":5720},"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},[5717,5718,5719],{"name":5653,"slug":5654,"type":15},{"name":5624,"slug":5625,"type":15},{"name":9,"slug":8,"type":15},"2026-07-30T05:25:53.391632",{"slug":5722,"name":5722,"fn":5723,"description":5724,"org":5725,"tags":5726,"stars":5657,"repoUrl":5658,"updatedAt":5730},"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},[5727,5728,5729],{"name":5624,"slug":5625,"type":15},{"name":9,"slug":8,"type":15},{"name":5681,"slug":5682,"type":15},"2026-07-30T05:26:03.37801",{"slug":5732,"name":5732,"fn":5733,"description":5734,"org":5735,"tags":5736,"stars":5657,"repoUrl":5658,"updatedAt":5743},"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},[5737,5740,5741,5742],{"name":5738,"slug":5739,"type":15},"CSS","css",{"name":5624,"slug":5625,"type":15},{"name":9,"slug":8,"type":15},{"name":5681,"slug":5682,"type":15},"2026-07-30T05:25:55.377366",{"slug":5745,"name":5745,"fn":5746,"description":5747,"org":5748,"tags":5749,"stars":5657,"repoUrl":5658,"updatedAt":5753},"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},[5750,5751,5752],{"name":5624,"slug":5625,"type":15},{"name":9,"slug":8,"type":15},{"name":5681,"slug":5682,"type":15},"2026-07-30T05:25:51.400011",{"slug":5755,"name":5755,"fn":5756,"description":5757,"org":5758,"tags":5759,"stars":5657,"repoUrl":5658,"updatedAt":5764},"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},[5760,5761,5762,5763],{"name":5738,"slug":5739,"type":15},{"name":5624,"slug":5625,"type":15},{"name":9,"slug":8,"type":15},{"name":5681,"slug":5682,"type":15},"2026-07-30T05:25:48.703799",{"slug":5766,"name":5766,"fn":5767,"description":5768,"org":5769,"tags":5770,"stars":5657,"repoUrl":5658,"updatedAt":5774},"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},[5771,5772,5773],{"name":5624,"slug":5625,"type":15},{"name":9,"slug":8,"type":15},{"name":5681,"slug":5682,"type":15},"2026-07-30T05:25:47.367943",{"slug":5776,"name":5776,"fn":5777,"description":5778,"org":5779,"tags":5780,"stars":5657,"repoUrl":5658,"updatedAt":5784},"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},[5781,5782,5783],{"name":5653,"slug":5654,"type":15},{"name":5624,"slug":5625,"type":15},{"name":5681,"slug":5682,"type":15},"2026-07-30T05:25:52.366295",125]