[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"skill-tanstack-table-state":3,"mdc-5nezgp-key":51,"related-repo-tanstack-table-state":2557,"related-org-tanstack-table-state":2643},{"slug":4,"name":4,"fn":5,"description":6,"org":7,"tags":11,"stars":22,"repoUrl":23,"updatedAt":24,"license":25,"forks":26,"topics":27,"repo":46,"sourceUrl":49,"mdContent":50},"table-state","manage reactive Vue table state","Read Vue-backed table.atoms\u002Fstore in templates, computed, watch, or table.Subscribe; own slices with refs\u002Fcomputed or external Vue Store atoms; and apply updater callbacks while preserving reactive option shapes.\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],{"name":13,"slug":14,"type":15},"Vue","vue","tag",{"name":17,"slug":18,"type":15},"Frontend","frontend",{"name":20,"slug":21,"type":15},"State Management","state-management",28175,"https:\u002F\u002Fgithub.com\u002FTanStack\u002Ftable","2026-07-30T05:25:54.405912",null,3539,[28,29,30,31,32,33,34,35,36,37,38,39,40,41,42,43,44,45,14],"datagrid","datagrids","datatable","filtering","grid","grouping","hooks","javascript","pagination","react","reactjs","solid","solidjs","sorting","svelte","sveltejs","table","typescript",{"repoUrl":23,"stars":22,"forks":26,"topics":47,"description":48},[28,29,30,31,32,33,34,35,36,37,38,39,40,41,42,43,44,45,14],"🤖 Headless UI for building powerful tables & datagrids for TS\u002FJS -  React-Table, Vue-Table, Solid-Table, Svelte-Table","https:\u002F\u002Fgithub.com\u002FTanStack\u002Ftable\u002Ftree\u002FHEAD\u002Fpackages\u002Fvue-table\u002Fskills\u002Ftable-state","---\nname: table-state\ndescription: >\n  Read Vue-backed table.atoms\u002Fstore in templates, computed, watch, or table.Subscribe; own slices with refs\u002Fcomputed or external Vue Store atoms; and apply updater callbacks while preserving reactive option shapes.\nmetadata:\n  type: framework\n  library: '@tanstack\u002Fvue-table'\n  framework: vue\n  library_version: '9.0.0-beta.59'\nrequires:\n  - '@tanstack\u002Ftable-core#core'\n  - getting-started\nsources:\n  - 'TanStack\u002Ftable:docs\u002Fframework\u002Fvue\u002Fguide\u002Ftable-state.md'\n  - 'TanStack\u002Ftable:examples\u002Fvue\u002Fbasic-external-state'\n  - 'TanStack\u002Ftable:packages\u002Fvue-table\u002Fsrc\u002FuseTable.ts'\n---\n\nThis skill builds on `@tanstack\u002Ftable-core#core` and `getting-started`. Read them first for state ownership and Vue construction.\n\n## State Mental Model\n\nTanStack Table is primarily a state coordinator. Keep state internal unless another system needs to read, persist, or drive it. Without `initialState`, `atoms`, `state`, or `on[State]Change`, the table owns every registered slice.\n\n- `table.baseAtoms` are internal writable atoms created from resolved initial state.\n- `table.atoms` are readonly derived atoms for the active owner of each registered slice.\n- `table.store` combines those atoms into one readonly flat store.\n\nThe Vue adapter backs atoms with refs\u002Fcomputed values and tracks reactive table options. Atom reads become reactive inside templates, `computed`, `watch`, or `table.Subscribe`; a read cached outside tracking is only a snapshot. State is feature-based, so a missing pagination atom or option means `rowPaginationFeature` was not registered. Keep `features` and `columns` stable; pass reactive `data` as a ref\u002Fcomputed instead of recreating arrays in table options.\n\n## Setup\n\n```ts\nimport { computed, ref } from 'vue'\nimport {\n  rowPaginationFeature,\n  tableFeatures,\n  useTable,\n} from '@tanstack\u002Fvue-table'\n\nconst features = tableFeatures({ rowPaginationFeature })\nconst data = ref([{ name: 'Ada' }])\nconst columns = [{ accessorKey: 'name' }]\nconst table = useTable({ features, columns, data })\nconst pageIndex = computed(() => table.atoms.pagination.get().pageIndex)\n```\n\nInternal state is usually enough. Atom reads are reactive only when Vue evaluates them in a tracked template, computed, watch, or render boundary.\n\n## Core Patterns\n\n### Control a slice without losing updater semantics\n\n```ts\nimport { computed, ref } from 'vue'\nimport type { PaginationState } from '@tanstack\u002Fvue-table'\n\nconst pagination = ref\u003CPaginationState>({ pageIndex: 0, pageSize: 20 })\nconst controlledState = computed(() => ({ pagination: pagination.value }))\nconst onPaginationChange = (\n  next: PaginationState | ((old: PaginationState) => PaginationState),\n) => {\n  pagination.value = typeof next === 'function' ? next(pagination.value) : next\n}\n```\n\nPass `state: controlledState` and `onPaginationChange` to `useTable`.\n\n### Use Subscribe as a render boundary\n\n```tsx\ntable.Subscribe({\n  children: (atoms) => \u003Cspan>{atoms.pagination.get().pageIndex + 1}\u003C\u002Fspan>,\n})\n```\n\nIn Vue JSX, `children` is an explicit prop, not a slot child.\n\n## Choose State Ownership\n\nUse exactly one owner per slice:\n\n- Prefer internal state and feature methods for table-local behavior.\n- Use `initialState` for starting\u002Freset values; changing it later does not reset current state.\n- Prefer a stable `@tanstack\u002Fvue-store` atom in `atoms` for cross-system ownership. Feature APIs update it directly, so omit `on[State]Change`.\n- Use a ref\u002Fcomputed `state` value plus the matching callback for simple controlled state. Preserve the reactive wrapper and resolve raw values and updater functions.\n\nExternal atoms take precedence over external `state`, which syncs into the internal base atom. Do not configure multiple owners. The global v8 `onStateChange` option is gone; observe `table.store` if all state changes matter.\n\n## Initialize, Update, and Reset\n\nUse feature methods such as `setSorting`, `nextPage`, `toggleVisibility`, and `toggleSelected`. Direct `baseAtoms` writes are a rare escape hatch for internally owned state; write the external atom when it owns the slice.\n\n```ts\ntable.resetSorting()\ntable.resetPagination()\ntable.resetPagination(true)\n```\n\nFeature resets use `table.initialState` unless `true` requests the feature default and can update external owners. Core `table.reset()` only resets internal base atoms. Use slice types such as `PaginationState`; use `TableState\u003Ctypeof features>` for the complete feature-inferred state.\n\n## Common Mistakes\n\n### HIGH Reading an untracked snapshot\n\nWrong:\n\n```ts\nconst pageIndex = table.atoms.pagination.get().pageIndex\n```\n\nCorrect:\n\n```ts\nconst pageIndex = computed(() => table.atoms.pagination.get().pageIndex)\n```\n\nThe first read is current but does not make its consumer reactive.\n\nSource: `docs\u002Fframework\u002Fvue\u002Fguide\u002Ftable-state.md`\n\n### HIGH Passing state.value once\n\nWrong:\n\n```ts\nconst table = useTable({\n  features,\n  columns,\n  data,\n  state: controlledState.value,\n})\n```\n\nCorrect:\n\n```ts\nconst table = useTable({ features, columns, data, state: controlledState })\n```\n\nThe adapter watches the computed ref; a one-time `.value` breaks future option synchronization.\n\nSource: `packages\u002Fvue-table\u002Fsrc\u002FuseTable.ts`\n\n### HIGH Assigning updater functions as values\n\nWrong:\n\n```ts\nconst onPaginationChange = (next) => {\n  pagination.value = next\n}\n```\n\nCorrect:\n\n```ts\nconst onPaginationChange = (next) => {\n  pagination.value = typeof next === 'function' ? next(pagination.value) : next\n}\n```\n\nTable callbacks accept either a value or a function of the previous value.\n\nSource: `examples\u002Fvue\u002Fbasic-external-state\u002Fsrc\u002FApp.tsx`\n\n### MEDIUM Supplying JSX children as a slot\n\nWrong:\n\n```tsx\n\u003Ctable.Subscribe>\n  {(atoms) => \u003Cspan>{atoms.pagination.get().pageIndex}\u003C\u002Fspan>}\n\u003C\u002Ftable.Subscribe>\n```\n\nCorrect:\n\n```tsx\n\u003Ctable.Subscribe\n  children={(atoms) => \u003Cspan>{atoms.pagination.get().pageIndex}\u003C\u002Fspan>}\n\u002F>\n```\n\nThe Vue adapter declares `Subscribe(props: { children })` and expects the explicit prop.\n\nSource: `packages\u002Fvue-table\u002Fsrc\u002FuseTable.ts`\n\n## API Discovery\n\nInspect `node_modules\u002F@tanstack\u002Fvue-table\u002Fdist\u002FuseTable.d.ts` and `reactivity.d.ts`; inspect the exact state slice in the installed core feature directory.\n",{"data":52,"body":64},{"name":4,"description":6,"metadata":53,"requires":57,"sources":60},{"type":54,"library":55,"framework":14,"library_version":56},"framework","@tanstack\u002Fvue-table","9.0.0-beta.59",[58,59],"@tanstack\u002Ftable-core#core","getting-started",[61,62,63],"TanStack\u002Ftable:docs\u002Fframework\u002Fvue\u002Fguide\u002Ftable-state.md","TanStack\u002Ftable:examples\u002Fvue\u002Fbasic-external-state","TanStack\u002Ftable:packages\u002Fvue-table\u002Fsrc\u002FuseTable.ts",{"type":65,"children":66},"root",[67,90,97,133,171,229,235,703,708,714,721,1174,1201,1207,1351,1364,1370,1375,1433,1460,1466,1509,1586,1629,1635,1641,1646,1709,1714,1792,1797,1808,1814,1818,1928,1932,2012,2025,2035,2041,2045,2118,2122,2250,2255,2265,2271,2275,2392,2396,2503,2516,2525,2531,2551],{"type":68,"tag":69,"props":70,"children":71},"element","p",{},[72,75,81,83,88],{"type":73,"value":74},"text","This skill builds on ",{"type":68,"tag":76,"props":77,"children":79},"code",{"className":78},[],[80],{"type":73,"value":58},{"type":73,"value":82}," and ",{"type":68,"tag":76,"props":84,"children":86},{"className":85},[],[87],{"type":73,"value":59},{"type":73,"value":89},". Read them first for state ownership and Vue construction.",{"type":68,"tag":91,"props":92,"children":94},"h2",{"id":93},"state-mental-model",[95],{"type":73,"value":96},"State Mental Model",{"type":68,"tag":69,"props":98,"children":99},{},[100,102,108,110,116,117,123,125,131],{"type":73,"value":101},"TanStack Table is primarily a state coordinator. Keep state internal unless another system needs to read, persist, or drive it. Without ",{"type":68,"tag":76,"props":103,"children":105},{"className":104},[],[106],{"type":73,"value":107},"initialState",{"type":73,"value":109},", ",{"type":68,"tag":76,"props":111,"children":113},{"className":112},[],[114],{"type":73,"value":115},"atoms",{"type":73,"value":109},{"type":68,"tag":76,"props":118,"children":120},{"className":119},[],[121],{"type":73,"value":122},"state",{"type":73,"value":124},", or ",{"type":68,"tag":76,"props":126,"children":128},{"className":127},[],[129],{"type":73,"value":130},"on[State]Change",{"type":73,"value":132},", the table owns every registered slice.",{"type":68,"tag":134,"props":135,"children":136},"ul",{},[137,149,160],{"type":68,"tag":138,"props":139,"children":140},"li",{},[141,147],{"type":68,"tag":76,"props":142,"children":144},{"className":143},[],[145],{"type":73,"value":146},"table.baseAtoms",{"type":73,"value":148}," are internal writable atoms created from resolved initial state.",{"type":68,"tag":138,"props":150,"children":151},{},[152,158],{"type":68,"tag":76,"props":153,"children":155},{"className":154},[],[156],{"type":73,"value":157},"table.atoms",{"type":73,"value":159}," are readonly derived atoms for the active owner of each registered slice.",{"type":68,"tag":138,"props":161,"children":162},{},[163,169],{"type":68,"tag":76,"props":164,"children":166},{"className":165},[],[167],{"type":73,"value":168},"table.store",{"type":73,"value":170}," combines those atoms into one readonly flat store.",{"type":68,"tag":69,"props":172,"children":173},{},[174,176,182,183,189,190,196,198,204,206,212,213,219,221,227],{"type":73,"value":175},"The Vue adapter backs atoms with refs\u002Fcomputed values and tracks reactive table options. Atom reads become reactive inside templates, ",{"type":68,"tag":76,"props":177,"children":179},{"className":178},[],[180],{"type":73,"value":181},"computed",{"type":73,"value":109},{"type":68,"tag":76,"props":184,"children":186},{"className":185},[],[187],{"type":73,"value":188},"watch",{"type":73,"value":124},{"type":68,"tag":76,"props":191,"children":193},{"className":192},[],[194],{"type":73,"value":195},"table.Subscribe",{"type":73,"value":197},"; a read cached outside tracking is only a snapshot. State is feature-based, so a missing pagination atom or option means ",{"type":68,"tag":76,"props":199,"children":201},{"className":200},[],[202],{"type":73,"value":203},"rowPaginationFeature",{"type":73,"value":205}," was not registered. Keep ",{"type":68,"tag":76,"props":207,"children":209},{"className":208},[],[210],{"type":73,"value":211},"features",{"type":73,"value":82},{"type":68,"tag":76,"props":214,"children":216},{"className":215},[],[217],{"type":73,"value":218},"columns",{"type":73,"value":220}," stable; pass reactive ",{"type":68,"tag":76,"props":222,"children":224},{"className":223},[],[225],{"type":73,"value":226},"data",{"type":73,"value":228}," as a ref\u002Fcomputed instead of recreating arrays in table options.",{"type":68,"tag":91,"props":230,"children":232},{"id":231},"setup",[233],{"type":73,"value":234},"Setup",{"type":68,"tag":236,"props":237,"children":242},"pre",{"className":238,"code":239,"language":240,"meta":241,"style":241},"language-ts shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","import { computed, ref } from 'vue'\nimport {\n  rowPaginationFeature,\n  tableFeatures,\n  useTable,\n} from '@tanstack\u002Fvue-table'\n\nconst features = tableFeatures({ rowPaginationFeature })\nconst data = ref([{ name: 'Ada' }])\nconst columns = [{ accessorKey: 'name' }]\nconst table = useTable({ features, columns, data })\nconst pageIndex = computed(() => table.atoms.pagination.get().pageIndex)\n","ts","",[243],{"type":68,"tag":76,"props":244,"children":245},{"__ignoreMap":241},[246,305,318,332,345,358,383,393,443,507,564,624],{"type":68,"tag":247,"props":248,"children":251},"span",{"class":249,"line":250},"line",1,[252,258,264,270,275,280,285,290,295,300],{"type":68,"tag":247,"props":253,"children":255},{"style":254},"--shiki-light:#39ADB5;--shiki-light-font-style:italic;--shiki-default:#89DDFF;--shiki-default-font-style:italic;--shiki-dark:#89DDFF;--shiki-dark-font-style:italic",[256],{"type":73,"value":257},"import",{"type":68,"tag":247,"props":259,"children":261},{"style":260},"--shiki-light:#39ADB5;--shiki-default:#89DDFF;--shiki-dark:#89DDFF",[262],{"type":73,"value":263}," {",{"type":68,"tag":247,"props":265,"children":267},{"style":266},"--shiki-light:#90A4AE;--shiki-default:#EEFFFF;--shiki-dark:#BABED8",[268],{"type":73,"value":269}," computed",{"type":68,"tag":247,"props":271,"children":272},{"style":260},[273],{"type":73,"value":274},",",{"type":68,"tag":247,"props":276,"children":277},{"style":266},[278],{"type":73,"value":279}," ref",{"type":68,"tag":247,"props":281,"children":282},{"style":260},[283],{"type":73,"value":284}," }",{"type":68,"tag":247,"props":286,"children":287},{"style":254},[288],{"type":73,"value":289}," from",{"type":68,"tag":247,"props":291,"children":292},{"style":260},[293],{"type":73,"value":294}," '",{"type":68,"tag":247,"props":296,"children":298},{"style":297},"--shiki-light:#91B859;--shiki-default:#C3E88D;--shiki-dark:#C3E88D",[299],{"type":73,"value":14},{"type":68,"tag":247,"props":301,"children":302},{"style":260},[303],{"type":73,"value":304},"'\n",{"type":68,"tag":247,"props":306,"children":308},{"class":249,"line":307},2,[309,313],{"type":68,"tag":247,"props":310,"children":311},{"style":254},[312],{"type":73,"value":257},{"type":68,"tag":247,"props":314,"children":315},{"style":260},[316],{"type":73,"value":317}," {\n",{"type":68,"tag":247,"props":319,"children":321},{"class":249,"line":320},3,[322,327],{"type":68,"tag":247,"props":323,"children":324},{"style":266},[325],{"type":73,"value":326},"  rowPaginationFeature",{"type":68,"tag":247,"props":328,"children":329},{"style":260},[330],{"type":73,"value":331},",\n",{"type":68,"tag":247,"props":333,"children":335},{"class":249,"line":334},4,[336,341],{"type":68,"tag":247,"props":337,"children":338},{"style":266},[339],{"type":73,"value":340},"  tableFeatures",{"type":68,"tag":247,"props":342,"children":343},{"style":260},[344],{"type":73,"value":331},{"type":68,"tag":247,"props":346,"children":348},{"class":249,"line":347},5,[349,354],{"type":68,"tag":247,"props":350,"children":351},{"style":266},[352],{"type":73,"value":353},"  useTable",{"type":68,"tag":247,"props":355,"children":356},{"style":260},[357],{"type":73,"value":331},{"type":68,"tag":247,"props":359,"children":361},{"class":249,"line":360},6,[362,367,371,375,379],{"type":68,"tag":247,"props":363,"children":364},{"style":260},[365],{"type":73,"value":366},"}",{"type":68,"tag":247,"props":368,"children":369},{"style":254},[370],{"type":73,"value":289},{"type":68,"tag":247,"props":372,"children":373},{"style":260},[374],{"type":73,"value":294},{"type":68,"tag":247,"props":376,"children":377},{"style":297},[378],{"type":73,"value":55},{"type":68,"tag":247,"props":380,"children":381},{"style":260},[382],{"type":73,"value":304},{"type":68,"tag":247,"props":384,"children":386},{"class":249,"line":385},7,[387],{"type":68,"tag":247,"props":388,"children":390},{"emptyLinePlaceholder":389},true,[391],{"type":73,"value":392},"\n",{"type":68,"tag":247,"props":394,"children":396},{"class":249,"line":395},8,[397,403,408,413,419,424,429,434,438],{"type":68,"tag":247,"props":398,"children":400},{"style":399},"--shiki-light:#9C3EDA;--shiki-default:#C792EA;--shiki-dark:#C792EA",[401],{"type":73,"value":402},"const",{"type":68,"tag":247,"props":404,"children":405},{"style":266},[406],{"type":73,"value":407}," features ",{"type":68,"tag":247,"props":409,"children":410},{"style":260},[411],{"type":73,"value":412},"=",{"type":68,"tag":247,"props":414,"children":416},{"style":415},"--shiki-light:#6182B8;--shiki-default:#82AAFF;--shiki-dark:#82AAFF",[417],{"type":73,"value":418}," tableFeatures",{"type":68,"tag":247,"props":420,"children":421},{"style":266},[422],{"type":73,"value":423},"(",{"type":68,"tag":247,"props":425,"children":426},{"style":260},[427],{"type":73,"value":428},"{",{"type":68,"tag":247,"props":430,"children":431},{"style":266},[432],{"type":73,"value":433}," rowPaginationFeature ",{"type":68,"tag":247,"props":435,"children":436},{"style":260},[437],{"type":73,"value":366},{"type":68,"tag":247,"props":439,"children":440},{"style":266},[441],{"type":73,"value":442},")\n",{"type":68,"tag":247,"props":444,"children":446},{"class":249,"line":445},9,[447,451,456,460,464,469,473,479,484,488,493,498,502],{"type":68,"tag":247,"props":448,"children":449},{"style":399},[450],{"type":73,"value":402},{"type":68,"tag":247,"props":452,"children":453},{"style":266},[454],{"type":73,"value":455}," data ",{"type":68,"tag":247,"props":457,"children":458},{"style":260},[459],{"type":73,"value":412},{"type":68,"tag":247,"props":461,"children":462},{"style":415},[463],{"type":73,"value":279},{"type":68,"tag":247,"props":465,"children":466},{"style":266},[467],{"type":73,"value":468},"([",{"type":68,"tag":247,"props":470,"children":471},{"style":260},[472],{"type":73,"value":428},{"type":68,"tag":247,"props":474,"children":476},{"style":475},"--shiki-light:#E53935;--shiki-default:#F07178;--shiki-dark:#F07178",[477],{"type":73,"value":478}," name",{"type":68,"tag":247,"props":480,"children":481},{"style":260},[482],{"type":73,"value":483},":",{"type":68,"tag":247,"props":485,"children":486},{"style":260},[487],{"type":73,"value":294},{"type":68,"tag":247,"props":489,"children":490},{"style":297},[491],{"type":73,"value":492},"Ada",{"type":68,"tag":247,"props":494,"children":495},{"style":260},[496],{"type":73,"value":497},"'",{"type":68,"tag":247,"props":499,"children":500},{"style":260},[501],{"type":73,"value":284},{"type":68,"tag":247,"props":503,"children":504},{"style":266},[505],{"type":73,"value":506},"])\n",{"type":68,"tag":247,"props":508,"children":510},{"class":249,"line":509},10,[511,515,520,524,529,533,538,542,546,551,555,559],{"type":68,"tag":247,"props":512,"children":513},{"style":399},[514],{"type":73,"value":402},{"type":68,"tag":247,"props":516,"children":517},{"style":266},[518],{"type":73,"value":519}," columns ",{"type":68,"tag":247,"props":521,"children":522},{"style":260},[523],{"type":73,"value":412},{"type":68,"tag":247,"props":525,"children":526},{"style":266},[527],{"type":73,"value":528}," [",{"type":68,"tag":247,"props":530,"children":531},{"style":260},[532],{"type":73,"value":428},{"type":68,"tag":247,"props":534,"children":535},{"style":475},[536],{"type":73,"value":537}," accessorKey",{"type":68,"tag":247,"props":539,"children":540},{"style":260},[541],{"type":73,"value":483},{"type":68,"tag":247,"props":543,"children":544},{"style":260},[545],{"type":73,"value":294},{"type":68,"tag":247,"props":547,"children":548},{"style":297},[549],{"type":73,"value":550},"name",{"type":68,"tag":247,"props":552,"children":553},{"style":260},[554],{"type":73,"value":497},{"type":68,"tag":247,"props":556,"children":557},{"style":260},[558],{"type":73,"value":284},{"type":68,"tag":247,"props":560,"children":561},{"style":266},[562],{"type":73,"value":563},"]\n",{"type":68,"tag":247,"props":565,"children":567},{"class":249,"line":566},11,[568,572,577,581,586,590,594,599,603,608,612,616,620],{"type":68,"tag":247,"props":569,"children":570},{"style":399},[571],{"type":73,"value":402},{"type":68,"tag":247,"props":573,"children":574},{"style":266},[575],{"type":73,"value":576}," table ",{"type":68,"tag":247,"props":578,"children":579},{"style":260},[580],{"type":73,"value":412},{"type":68,"tag":247,"props":582,"children":583},{"style":415},[584],{"type":73,"value":585}," useTable",{"type":68,"tag":247,"props":587,"children":588},{"style":266},[589],{"type":73,"value":423},{"type":68,"tag":247,"props":591,"children":592},{"style":260},[593],{"type":73,"value":428},{"type":68,"tag":247,"props":595,"children":596},{"style":266},[597],{"type":73,"value":598}," features",{"type":68,"tag":247,"props":600,"children":601},{"style":260},[602],{"type":73,"value":274},{"type":68,"tag":247,"props":604,"children":605},{"style":266},[606],{"type":73,"value":607}," columns",{"type":68,"tag":247,"props":609,"children":610},{"style":260},[611],{"type":73,"value":274},{"type":68,"tag":247,"props":613,"children":614},{"style":266},[615],{"type":73,"value":455},{"type":68,"tag":247,"props":617,"children":618},{"style":260},[619],{"type":73,"value":366},{"type":68,"tag":247,"props":621,"children":622},{"style":266},[623],{"type":73,"value":442},{"type":68,"tag":247,"props":625,"children":627},{"class":249,"line":626},12,[628,632,637,641,645,649,654,659,664,669,673,677,681,685,690,694,698],{"type":68,"tag":247,"props":629,"children":630},{"style":399},[631],{"type":73,"value":402},{"type":68,"tag":247,"props":633,"children":634},{"style":266},[635],{"type":73,"value":636}," pageIndex ",{"type":68,"tag":247,"props":638,"children":639},{"style":260},[640],{"type":73,"value":412},{"type":68,"tag":247,"props":642,"children":643},{"style":415},[644],{"type":73,"value":269},{"type":68,"tag":247,"props":646,"children":647},{"style":266},[648],{"type":73,"value":423},{"type":68,"tag":247,"props":650,"children":651},{"style":260},[652],{"type":73,"value":653},"()",{"type":68,"tag":247,"props":655,"children":656},{"style":399},[657],{"type":73,"value":658}," =>",{"type":68,"tag":247,"props":660,"children":661},{"style":266},[662],{"type":73,"value":663}," table",{"type":68,"tag":247,"props":665,"children":666},{"style":260},[667],{"type":73,"value":668},".",{"type":68,"tag":247,"props":670,"children":671},{"style":266},[672],{"type":73,"value":115},{"type":68,"tag":247,"props":674,"children":675},{"style":260},[676],{"type":73,"value":668},{"type":68,"tag":247,"props":678,"children":679},{"style":266},[680],{"type":73,"value":36},{"type":68,"tag":247,"props":682,"children":683},{"style":260},[684],{"type":73,"value":668},{"type":68,"tag":247,"props":686,"children":687},{"style":415},[688],{"type":73,"value":689},"get",{"type":68,"tag":247,"props":691,"children":692},{"style":266},[693],{"type":73,"value":653},{"type":68,"tag":247,"props":695,"children":696},{"style":260},[697],{"type":73,"value":668},{"type":68,"tag":247,"props":699,"children":700},{"style":266},[701],{"type":73,"value":702},"pageIndex)\n",{"type":68,"tag":69,"props":704,"children":705},{},[706],{"type":73,"value":707},"Internal state is usually enough. Atom reads are reactive only when Vue evaluates them in a tracked template, computed, watch, or render boundary.",{"type":68,"tag":91,"props":709,"children":711},{"id":710},"core-patterns",[712],{"type":73,"value":713},"Core Patterns",{"type":68,"tag":715,"props":716,"children":718},"h3",{"id":717},"control-a-slice-without-losing-updater-semantics",[719],{"type":73,"value":720},"Control a slice without losing updater semantics",{"type":68,"tag":236,"props":722,"children":724},{"className":238,"code":723,"language":240,"meta":241,"style":241},"import { computed, ref } from 'vue'\nimport type { PaginationState } from '@tanstack\u002Fvue-table'\n\nconst pagination = ref\u003CPaginationState>({ pageIndex: 0, pageSize: 20 })\nconst controlledState = computed(() => ({ pagination: pagination.value }))\nconst onPaginationChange = (\n  next: PaginationState | ((old: PaginationState) => PaginationState),\n) => {\n  pagination.value = typeof next === 'function' ? next(pagination.value) : next\n}\n",[725],{"type":68,"tag":76,"props":726,"children":727},{"__ignoreMap":241},[728,771,812,819,904,976,997,1061,1078,1166],{"type":68,"tag":247,"props":729,"children":730},{"class":249,"line":250},[731,735,739,743,747,751,755,759,763,767],{"type":68,"tag":247,"props":732,"children":733},{"style":254},[734],{"type":73,"value":257},{"type":68,"tag":247,"props":736,"children":737},{"style":260},[738],{"type":73,"value":263},{"type":68,"tag":247,"props":740,"children":741},{"style":266},[742],{"type":73,"value":269},{"type":68,"tag":247,"props":744,"children":745},{"style":260},[746],{"type":73,"value":274},{"type":68,"tag":247,"props":748,"children":749},{"style":266},[750],{"type":73,"value":279},{"type":68,"tag":247,"props":752,"children":753},{"style":260},[754],{"type":73,"value":284},{"type":68,"tag":247,"props":756,"children":757},{"style":254},[758],{"type":73,"value":289},{"type":68,"tag":247,"props":760,"children":761},{"style":260},[762],{"type":73,"value":294},{"type":68,"tag":247,"props":764,"children":765},{"style":297},[766],{"type":73,"value":14},{"type":68,"tag":247,"props":768,"children":769},{"style":260},[770],{"type":73,"value":304},{"type":68,"tag":247,"props":772,"children":773},{"class":249,"line":307},[774,778,783,787,792,796,800,804,808],{"type":68,"tag":247,"props":775,"children":776},{"style":254},[777],{"type":73,"value":257},{"type":68,"tag":247,"props":779,"children":780},{"style":254},[781],{"type":73,"value":782}," type",{"type":68,"tag":247,"props":784,"children":785},{"style":260},[786],{"type":73,"value":263},{"type":68,"tag":247,"props":788,"children":789},{"style":266},[790],{"type":73,"value":791}," PaginationState",{"type":68,"tag":247,"props":793,"children":794},{"style":260},[795],{"type":73,"value":284},{"type":68,"tag":247,"props":797,"children":798},{"style":254},[799],{"type":73,"value":289},{"type":68,"tag":247,"props":801,"children":802},{"style":260},[803],{"type":73,"value":294},{"type":68,"tag":247,"props":805,"children":806},{"style":297},[807],{"type":73,"value":55},{"type":68,"tag":247,"props":809,"children":810},{"style":260},[811],{"type":73,"value":304},{"type":68,"tag":247,"props":813,"children":814},{"class":249,"line":320},[815],{"type":68,"tag":247,"props":816,"children":817},{"emptyLinePlaceholder":389},[818],{"type":73,"value":392},{"type":68,"tag":247,"props":820,"children":821},{"class":249,"line":334},[822,826,831,835,839,844,850,855,859,863,868,872,878,882,887,891,896,900],{"type":68,"tag":247,"props":823,"children":824},{"style":399},[825],{"type":73,"value":402},{"type":68,"tag":247,"props":827,"children":828},{"style":266},[829],{"type":73,"value":830}," pagination ",{"type":68,"tag":247,"props":832,"children":833},{"style":260},[834],{"type":73,"value":412},{"type":68,"tag":247,"props":836,"children":837},{"style":415},[838],{"type":73,"value":279},{"type":68,"tag":247,"props":840,"children":841},{"style":260},[842],{"type":73,"value":843},"\u003C",{"type":68,"tag":247,"props":845,"children":847},{"style":846},"--shiki-light:#E2931D;--shiki-default:#FFCB6B;--shiki-dark:#FFCB6B",[848],{"type":73,"value":849},"PaginationState",{"type":68,"tag":247,"props":851,"children":852},{"style":260},[853],{"type":73,"value":854},">",{"type":68,"tag":247,"props":856,"children":857},{"style":266},[858],{"type":73,"value":423},{"type":68,"tag":247,"props":860,"children":861},{"style":260},[862],{"type":73,"value":428},{"type":68,"tag":247,"props":864,"children":865},{"style":475},[866],{"type":73,"value":867}," pageIndex",{"type":68,"tag":247,"props":869,"children":870},{"style":260},[871],{"type":73,"value":483},{"type":68,"tag":247,"props":873,"children":875},{"style":874},"--shiki-light:#F76D47;--shiki-default:#F78C6C;--shiki-dark:#F78C6C",[876],{"type":73,"value":877}," 0",{"type":68,"tag":247,"props":879,"children":880},{"style":260},[881],{"type":73,"value":274},{"type":68,"tag":247,"props":883,"children":884},{"style":475},[885],{"type":73,"value":886}," pageSize",{"type":68,"tag":247,"props":888,"children":889},{"style":260},[890],{"type":73,"value":483},{"type":68,"tag":247,"props":892,"children":893},{"style":874},[894],{"type":73,"value":895}," 20",{"type":68,"tag":247,"props":897,"children":898},{"style":260},[899],{"type":73,"value":284},{"type":68,"tag":247,"props":901,"children":902},{"style":266},[903],{"type":73,"value":442},{"type":68,"tag":247,"props":905,"children":906},{"class":249,"line":347},[907,911,916,920,924,928,932,936,941,945,950,954,958,962,967,971],{"type":68,"tag":247,"props":908,"children":909},{"style":399},[910],{"type":73,"value":402},{"type":68,"tag":247,"props":912,"children":913},{"style":266},[914],{"type":73,"value":915}," controlledState ",{"type":68,"tag":247,"props":917,"children":918},{"style":260},[919],{"type":73,"value":412},{"type":68,"tag":247,"props":921,"children":922},{"style":415},[923],{"type":73,"value":269},{"type":68,"tag":247,"props":925,"children":926},{"style":266},[927],{"type":73,"value":423},{"type":68,"tag":247,"props":929,"children":930},{"style":260},[931],{"type":73,"value":653},{"type":68,"tag":247,"props":933,"children":934},{"style":399},[935],{"type":73,"value":658},{"type":68,"tag":247,"props":937,"children":938},{"style":266},[939],{"type":73,"value":940}," (",{"type":68,"tag":247,"props":942,"children":943},{"style":260},[944],{"type":73,"value":428},{"type":68,"tag":247,"props":946,"children":947},{"style":475},[948],{"type":73,"value":949}," pagination",{"type":68,"tag":247,"props":951,"children":952},{"style":260},[953],{"type":73,"value":483},{"type":68,"tag":247,"props":955,"children":956},{"style":266},[957],{"type":73,"value":949},{"type":68,"tag":247,"props":959,"children":960},{"style":260},[961],{"type":73,"value":668},{"type":68,"tag":247,"props":963,"children":964},{"style":266},[965],{"type":73,"value":966},"value ",{"type":68,"tag":247,"props":968,"children":969},{"style":260},[970],{"type":73,"value":366},{"type":68,"tag":247,"props":972,"children":973},{"style":266},[974],{"type":73,"value":975},"))\n",{"type":68,"tag":247,"props":977,"children":978},{"class":249,"line":360},[979,983,988,992],{"type":68,"tag":247,"props":980,"children":981},{"style":399},[982],{"type":73,"value":402},{"type":68,"tag":247,"props":984,"children":985},{"style":266},[986],{"type":73,"value":987}," onPaginationChange ",{"type":68,"tag":247,"props":989,"children":990},{"style":260},[991],{"type":73,"value":412},{"type":68,"tag":247,"props":993,"children":994},{"style":266},[995],{"type":73,"value":996}," (\n",{"type":68,"tag":247,"props":998,"children":999},{"class":249,"line":385},[1000,1006,1010,1014,1019,1023,1027,1032,1036,1040,1045,1049,1053,1057],{"type":68,"tag":247,"props":1001,"children":1003},{"style":1002},"--shiki-light:#90A4AE;--shiki-light-font-style:italic;--shiki-default:#EEFFFF;--shiki-default-font-style:italic;--shiki-dark:#BABED8;--shiki-dark-font-style:italic",[1004],{"type":73,"value":1005},"  next",{"type":68,"tag":247,"props":1007,"children":1008},{"style":260},[1009],{"type":73,"value":483},{"type":68,"tag":247,"props":1011,"children":1012},{"style":846},[1013],{"type":73,"value":791},{"type":68,"tag":247,"props":1015,"children":1016},{"style":260},[1017],{"type":73,"value":1018}," |",{"type":68,"tag":247,"props":1020,"children":1021},{"style":266},[1022],{"type":73,"value":940},{"type":68,"tag":247,"props":1024,"children":1025},{"style":260},[1026],{"type":73,"value":423},{"type":68,"tag":247,"props":1028,"children":1029},{"style":1002},[1030],{"type":73,"value":1031},"old",{"type":68,"tag":247,"props":1033,"children":1034},{"style":260},[1035],{"type":73,"value":483},{"type":68,"tag":247,"props":1037,"children":1038},{"style":846},[1039],{"type":73,"value":791},{"type":68,"tag":247,"props":1041,"children":1042},{"style":260},[1043],{"type":73,"value":1044},")",{"type":68,"tag":247,"props":1046,"children":1047},{"style":399},[1048],{"type":73,"value":658},{"type":68,"tag":247,"props":1050,"children":1051},{"style":846},[1052],{"type":73,"value":791},{"type":68,"tag":247,"props":1054,"children":1055},{"style":266},[1056],{"type":73,"value":1044},{"type":68,"tag":247,"props":1058,"children":1059},{"style":260},[1060],{"type":73,"value":331},{"type":68,"tag":247,"props":1062,"children":1063},{"class":249,"line":395},[1064,1069,1074],{"type":68,"tag":247,"props":1065,"children":1066},{"style":266},[1067],{"type":73,"value":1068},") ",{"type":68,"tag":247,"props":1070,"children":1071},{"style":399},[1072],{"type":73,"value":1073},"=>",{"type":68,"tag":247,"props":1075,"children":1076},{"style":260},[1077],{"type":73,"value":317},{"type":68,"tag":247,"props":1079,"children":1080},{"class":249,"line":445},[1081,1086,1090,1095,1100,1105,1110,1115,1119,1124,1128,1133,1137,1141,1145,1149,1153,1157,1161],{"type":68,"tag":247,"props":1082,"children":1083},{"style":266},[1084],{"type":73,"value":1085},"  pagination",{"type":68,"tag":247,"props":1087,"children":1088},{"style":260},[1089],{"type":73,"value":668},{"type":68,"tag":247,"props":1091,"children":1092},{"style":266},[1093],{"type":73,"value":1094},"value",{"type":68,"tag":247,"props":1096,"children":1097},{"style":260},[1098],{"type":73,"value":1099}," =",{"type":68,"tag":247,"props":1101,"children":1102},{"style":260},[1103],{"type":73,"value":1104}," typeof",{"type":68,"tag":247,"props":1106,"children":1107},{"style":266},[1108],{"type":73,"value":1109}," next",{"type":68,"tag":247,"props":1111,"children":1112},{"style":260},[1113],{"type":73,"value":1114}," ===",{"type":68,"tag":247,"props":1116,"children":1117},{"style":260},[1118],{"type":73,"value":294},{"type":68,"tag":247,"props":1120,"children":1121},{"style":297},[1122],{"type":73,"value":1123},"function",{"type":68,"tag":247,"props":1125,"children":1126},{"style":260},[1127],{"type":73,"value":497},{"type":68,"tag":247,"props":1129,"children":1130},{"style":260},[1131],{"type":73,"value":1132}," ?",{"type":68,"tag":247,"props":1134,"children":1135},{"style":415},[1136],{"type":73,"value":1109},{"type":68,"tag":247,"props":1138,"children":1139},{"style":475},[1140],{"type":73,"value":423},{"type":68,"tag":247,"props":1142,"children":1143},{"style":266},[1144],{"type":73,"value":36},{"type":68,"tag":247,"props":1146,"children":1147},{"style":260},[1148],{"type":73,"value":668},{"type":68,"tag":247,"props":1150,"children":1151},{"style":266},[1152],{"type":73,"value":1094},{"type":68,"tag":247,"props":1154,"children":1155},{"style":475},[1156],{"type":73,"value":1068},{"type":68,"tag":247,"props":1158,"children":1159},{"style":260},[1160],{"type":73,"value":483},{"type":68,"tag":247,"props":1162,"children":1163},{"style":266},[1164],{"type":73,"value":1165}," next\n",{"type":68,"tag":247,"props":1167,"children":1168},{"class":249,"line":509},[1169],{"type":68,"tag":247,"props":1170,"children":1171},{"style":260},[1172],{"type":73,"value":1173},"}\n",{"type":68,"tag":69,"props":1175,"children":1176},{},[1177,1179,1185,1186,1192,1194,1200],{"type":73,"value":1178},"Pass ",{"type":68,"tag":76,"props":1180,"children":1182},{"className":1181},[],[1183],{"type":73,"value":1184},"state: controlledState",{"type":73,"value":82},{"type":68,"tag":76,"props":1187,"children":1189},{"className":1188},[],[1190],{"type":73,"value":1191},"onPaginationChange",{"type":73,"value":1193}," to ",{"type":68,"tag":76,"props":1195,"children":1197},{"className":1196},[],[1198],{"type":73,"value":1199},"useTable",{"type":73,"value":668},{"type":68,"tag":715,"props":1202,"children":1204},{"id":1203},"use-subscribe-as-a-render-boundary",[1205],{"type":73,"value":1206},"Use Subscribe as a render boundary",{"type":68,"tag":236,"props":1208,"children":1212},{"className":1209,"code":1210,"language":1211,"meta":241,"style":241},"language-tsx shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","table.Subscribe({\n  children: (atoms) => \u003Cspan>{atoms.pagination.get().pageIndex + 1}\u003C\u002Fspan>,\n})\n","tsx",[1213],{"type":68,"tag":76,"props":1214,"children":1215},{"__ignoreMap":241},[1216,1241,1340],{"type":68,"tag":247,"props":1217,"children":1218},{"class":249,"line":250},[1219,1223,1227,1232,1236],{"type":68,"tag":247,"props":1220,"children":1221},{"style":266},[1222],{"type":73,"value":44},{"type":68,"tag":247,"props":1224,"children":1225},{"style":260},[1226],{"type":73,"value":668},{"type":68,"tag":247,"props":1228,"children":1229},{"style":415},[1230],{"type":73,"value":1231},"Subscribe",{"type":68,"tag":247,"props":1233,"children":1234},{"style":266},[1235],{"type":73,"value":423},{"type":68,"tag":247,"props":1237,"children":1238},{"style":260},[1239],{"type":73,"value":1240},"{\n",{"type":68,"tag":247,"props":1242,"children":1243},{"class":249,"line":307},[1244,1249,1253,1257,1261,1265,1269,1274,1278,1283,1287,1291,1295,1299,1303,1307,1311,1316,1321,1326,1331,1335],{"type":68,"tag":247,"props":1245,"children":1246},{"style":415},[1247],{"type":73,"value":1248},"  children",{"type":68,"tag":247,"props":1250,"children":1251},{"style":260},[1252],{"type":73,"value":483},{"type":68,"tag":247,"props":1254,"children":1255},{"style":260},[1256],{"type":73,"value":940},{"type":68,"tag":247,"props":1258,"children":1259},{"style":1002},[1260],{"type":73,"value":115},{"type":68,"tag":247,"props":1262,"children":1263},{"style":260},[1264],{"type":73,"value":1044},{"type":68,"tag":247,"props":1266,"children":1267},{"style":399},[1268],{"type":73,"value":658},{"type":68,"tag":247,"props":1270,"children":1271},{"style":260},[1272],{"type":73,"value":1273}," \u003C",{"type":68,"tag":247,"props":1275,"children":1276},{"style":475},[1277],{"type":73,"value":247},{"type":68,"tag":247,"props":1279,"children":1280},{"style":260},[1281],{"type":73,"value":1282},">{",{"type":68,"tag":247,"props":1284,"children":1285},{"style":266},[1286],{"type":73,"value":115},{"type":68,"tag":247,"props":1288,"children":1289},{"style":260},[1290],{"type":73,"value":668},{"type":68,"tag":247,"props":1292,"children":1293},{"style":266},[1294],{"type":73,"value":36},{"type":68,"tag":247,"props":1296,"children":1297},{"style":260},[1298],{"type":73,"value":668},{"type":68,"tag":247,"props":1300,"children":1301},{"style":415},[1302],{"type":73,"value":689},{"type":68,"tag":247,"props":1304,"children":1305},{"style":266},[1306],{"type":73,"value":653},{"type":68,"tag":247,"props":1308,"children":1309},{"style":260},[1310],{"type":73,"value":668},{"type":68,"tag":247,"props":1312,"children":1313},{"style":266},[1314],{"type":73,"value":1315},"pageIndex ",{"type":68,"tag":247,"props":1317,"children":1318},{"style":260},[1319],{"type":73,"value":1320},"+",{"type":68,"tag":247,"props":1322,"children":1323},{"style":874},[1324],{"type":73,"value":1325}," 1",{"type":68,"tag":247,"props":1327,"children":1328},{"style":260},[1329],{"type":73,"value":1330},"}\u003C\u002F",{"type":68,"tag":247,"props":1332,"children":1333},{"style":475},[1334],{"type":73,"value":247},{"type":68,"tag":247,"props":1336,"children":1337},{"style":260},[1338],{"type":73,"value":1339},">,\n",{"type":68,"tag":247,"props":1341,"children":1342},{"class":249,"line":320},[1343,1347],{"type":68,"tag":247,"props":1344,"children":1345},{"style":260},[1346],{"type":73,"value":366},{"type":68,"tag":247,"props":1348,"children":1349},{"style":266},[1350],{"type":73,"value":442},{"type":68,"tag":69,"props":1352,"children":1353},{},[1354,1356,1362],{"type":73,"value":1355},"In Vue JSX, ",{"type":68,"tag":76,"props":1357,"children":1359},{"className":1358},[],[1360],{"type":73,"value":1361},"children",{"type":73,"value":1363}," is an explicit prop, not a slot child.",{"type":68,"tag":91,"props":1365,"children":1367},{"id":1366},"choose-state-ownership",[1368],{"type":73,"value":1369},"Choose State Ownership",{"type":68,"tag":69,"props":1371,"children":1372},{},[1373],{"type":73,"value":1374},"Use exactly one owner per slice:",{"type":68,"tag":134,"props":1376,"children":1377},{},[1378,1383,1395,1421],{"type":68,"tag":138,"props":1379,"children":1380},{},[1381],{"type":73,"value":1382},"Prefer internal state and feature methods for table-local behavior.",{"type":68,"tag":138,"props":1384,"children":1385},{},[1386,1388,1393],{"type":73,"value":1387},"Use ",{"type":68,"tag":76,"props":1389,"children":1391},{"className":1390},[],[1392],{"type":73,"value":107},{"type":73,"value":1394}," for starting\u002Freset values; changing it later does not reset current state.",{"type":68,"tag":138,"props":1396,"children":1397},{},[1398,1400,1406,1408,1413,1415,1420],{"type":73,"value":1399},"Prefer a stable ",{"type":68,"tag":76,"props":1401,"children":1403},{"className":1402},[],[1404],{"type":73,"value":1405},"@tanstack\u002Fvue-store",{"type":73,"value":1407}," atom in ",{"type":68,"tag":76,"props":1409,"children":1411},{"className":1410},[],[1412],{"type":73,"value":115},{"type":73,"value":1414}," for cross-system ownership. Feature APIs update it directly, so omit ",{"type":68,"tag":76,"props":1416,"children":1418},{"className":1417},[],[1419],{"type":73,"value":130},{"type":73,"value":668},{"type":68,"tag":138,"props":1422,"children":1423},{},[1424,1426,1431],{"type":73,"value":1425},"Use a ref\u002Fcomputed ",{"type":68,"tag":76,"props":1427,"children":1429},{"className":1428},[],[1430],{"type":73,"value":122},{"type":73,"value":1432}," value plus the matching callback for simple controlled state. Preserve the reactive wrapper and resolve raw values and updater functions.",{"type":68,"tag":69,"props":1434,"children":1435},{},[1436,1438,1443,1445,1451,1453,1458],{"type":73,"value":1437},"External atoms take precedence over external ",{"type":68,"tag":76,"props":1439,"children":1441},{"className":1440},[],[1442],{"type":73,"value":122},{"type":73,"value":1444},", which syncs into the internal base atom. Do not configure multiple owners. The global v8 ",{"type":68,"tag":76,"props":1446,"children":1448},{"className":1447},[],[1449],{"type":73,"value":1450},"onStateChange",{"type":73,"value":1452}," option is gone; observe ",{"type":68,"tag":76,"props":1454,"children":1456},{"className":1455},[],[1457],{"type":73,"value":168},{"type":73,"value":1459}," if all state changes matter.",{"type":68,"tag":91,"props":1461,"children":1463},{"id":1462},"initialize-update-and-reset",[1464],{"type":73,"value":1465},"Initialize, Update, and Reset",{"type":68,"tag":69,"props":1467,"children":1468},{},[1469,1471,1477,1478,1484,1485,1491,1493,1499,1501,1507],{"type":73,"value":1470},"Use feature methods such as ",{"type":68,"tag":76,"props":1472,"children":1474},{"className":1473},[],[1475],{"type":73,"value":1476},"setSorting",{"type":73,"value":109},{"type":68,"tag":76,"props":1479,"children":1481},{"className":1480},[],[1482],{"type":73,"value":1483},"nextPage",{"type":73,"value":109},{"type":68,"tag":76,"props":1486,"children":1488},{"className":1487},[],[1489],{"type":73,"value":1490},"toggleVisibility",{"type":73,"value":1492},", and ",{"type":68,"tag":76,"props":1494,"children":1496},{"className":1495},[],[1497],{"type":73,"value":1498},"toggleSelected",{"type":73,"value":1500},". Direct ",{"type":68,"tag":76,"props":1502,"children":1504},{"className":1503},[],[1505],{"type":73,"value":1506},"baseAtoms",{"type":73,"value":1508}," writes are a rare escape hatch for internally owned state; write the external atom when it owns the slice.",{"type":68,"tag":236,"props":1510,"children":1512},{"className":238,"code":1511,"language":240,"meta":241,"style":241},"table.resetSorting()\ntable.resetPagination()\ntable.resetPagination(true)\n",[1513],{"type":68,"tag":76,"props":1514,"children":1515},{"__ignoreMap":241},[1516,1537,1557],{"type":68,"tag":247,"props":1517,"children":1518},{"class":249,"line":250},[1519,1523,1527,1532],{"type":68,"tag":247,"props":1520,"children":1521},{"style":266},[1522],{"type":73,"value":44},{"type":68,"tag":247,"props":1524,"children":1525},{"style":260},[1526],{"type":73,"value":668},{"type":68,"tag":247,"props":1528,"children":1529},{"style":415},[1530],{"type":73,"value":1531},"resetSorting",{"type":68,"tag":247,"props":1533,"children":1534},{"style":266},[1535],{"type":73,"value":1536},"()\n",{"type":68,"tag":247,"props":1538,"children":1539},{"class":249,"line":307},[1540,1544,1548,1553],{"type":68,"tag":247,"props":1541,"children":1542},{"style":266},[1543],{"type":73,"value":44},{"type":68,"tag":247,"props":1545,"children":1546},{"style":260},[1547],{"type":73,"value":668},{"type":68,"tag":247,"props":1549,"children":1550},{"style":415},[1551],{"type":73,"value":1552},"resetPagination",{"type":68,"tag":247,"props":1554,"children":1555},{"style":266},[1556],{"type":73,"value":1536},{"type":68,"tag":247,"props":1558,"children":1559},{"class":249,"line":320},[1560,1564,1568,1572,1576,1582],{"type":68,"tag":247,"props":1561,"children":1562},{"style":266},[1563],{"type":73,"value":44},{"type":68,"tag":247,"props":1565,"children":1566},{"style":260},[1567],{"type":73,"value":668},{"type":68,"tag":247,"props":1569,"children":1570},{"style":415},[1571],{"type":73,"value":1552},{"type":68,"tag":247,"props":1573,"children":1574},{"style":266},[1575],{"type":73,"value":423},{"type":68,"tag":247,"props":1577,"children":1579},{"style":1578},"--shiki-light:#FF5370;--shiki-default:#FF9CAC;--shiki-dark:#FF9CAC",[1580],{"type":73,"value":1581},"true",{"type":68,"tag":247,"props":1583,"children":1584},{"style":266},[1585],{"type":73,"value":442},{"type":68,"tag":69,"props":1587,"children":1588},{},[1589,1591,1597,1599,1604,1606,1612,1614,1619,1621,1627],{"type":73,"value":1590},"Feature resets use ",{"type":68,"tag":76,"props":1592,"children":1594},{"className":1593},[],[1595],{"type":73,"value":1596},"table.initialState",{"type":73,"value":1598}," unless ",{"type":68,"tag":76,"props":1600,"children":1602},{"className":1601},[],[1603],{"type":73,"value":1581},{"type":73,"value":1605}," requests the feature default and can update external owners. Core ",{"type":68,"tag":76,"props":1607,"children":1609},{"className":1608},[],[1610],{"type":73,"value":1611},"table.reset()",{"type":73,"value":1613}," only resets internal base atoms. Use slice types such as ",{"type":68,"tag":76,"props":1615,"children":1617},{"className":1616},[],[1618],{"type":73,"value":849},{"type":73,"value":1620},"; use ",{"type":68,"tag":76,"props":1622,"children":1624},{"className":1623},[],[1625],{"type":73,"value":1626},"TableState\u003Ctypeof features>",{"type":73,"value":1628}," for the complete feature-inferred state.",{"type":68,"tag":91,"props":1630,"children":1632},{"id":1631},"common-mistakes",[1633],{"type":73,"value":1634},"Common Mistakes",{"type":68,"tag":715,"props":1636,"children":1638},{"id":1637},"high-reading-an-untracked-snapshot",[1639],{"type":73,"value":1640},"HIGH Reading an untracked snapshot",{"type":68,"tag":69,"props":1642,"children":1643},{},[1644],{"type":73,"value":1645},"Wrong:",{"type":68,"tag":236,"props":1647,"children":1649},{"className":238,"code":1648,"language":240,"meta":241,"style":241},"const pageIndex = table.atoms.pagination.get().pageIndex\n",[1650],{"type":68,"tag":76,"props":1651,"children":1652},{"__ignoreMap":241},[1653],{"type":68,"tag":247,"props":1654,"children":1655},{"class":249,"line":250},[1656,1660,1664,1668,1672,1676,1680,1684,1688,1692,1696,1700,1704],{"type":68,"tag":247,"props":1657,"children":1658},{"style":399},[1659],{"type":73,"value":402},{"type":68,"tag":247,"props":1661,"children":1662},{"style":266},[1663],{"type":73,"value":636},{"type":68,"tag":247,"props":1665,"children":1666},{"style":260},[1667],{"type":73,"value":412},{"type":68,"tag":247,"props":1669,"children":1670},{"style":266},[1671],{"type":73,"value":663},{"type":68,"tag":247,"props":1673,"children":1674},{"style":260},[1675],{"type":73,"value":668},{"type":68,"tag":247,"props":1677,"children":1678},{"style":266},[1679],{"type":73,"value":115},{"type":68,"tag":247,"props":1681,"children":1682},{"style":260},[1683],{"type":73,"value":668},{"type":68,"tag":247,"props":1685,"children":1686},{"style":266},[1687],{"type":73,"value":36},{"type":68,"tag":247,"props":1689,"children":1690},{"style":260},[1691],{"type":73,"value":668},{"type":68,"tag":247,"props":1693,"children":1694},{"style":415},[1695],{"type":73,"value":689},{"type":68,"tag":247,"props":1697,"children":1698},{"style":266},[1699],{"type":73,"value":653},{"type":68,"tag":247,"props":1701,"children":1702},{"style":260},[1703],{"type":73,"value":668},{"type":68,"tag":247,"props":1705,"children":1706},{"style":266},[1707],{"type":73,"value":1708},"pageIndex\n",{"type":68,"tag":69,"props":1710,"children":1711},{},[1712],{"type":73,"value":1713},"Correct:",{"type":68,"tag":236,"props":1715,"children":1717},{"className":238,"code":1716,"language":240,"meta":241,"style":241},"const pageIndex = computed(() => table.atoms.pagination.get().pageIndex)\n",[1718],{"type":68,"tag":76,"props":1719,"children":1720},{"__ignoreMap":241},[1721],{"type":68,"tag":247,"props":1722,"children":1723},{"class":249,"line":250},[1724,1728,1732,1736,1740,1744,1748,1752,1756,1760,1764,1768,1772,1776,1780,1784,1788],{"type":68,"tag":247,"props":1725,"children":1726},{"style":399},[1727],{"type":73,"value":402},{"type":68,"tag":247,"props":1729,"children":1730},{"style":266},[1731],{"type":73,"value":636},{"type":68,"tag":247,"props":1733,"children":1734},{"style":260},[1735],{"type":73,"value":412},{"type":68,"tag":247,"props":1737,"children":1738},{"style":415},[1739],{"type":73,"value":269},{"type":68,"tag":247,"props":1741,"children":1742},{"style":266},[1743],{"type":73,"value":423},{"type":68,"tag":247,"props":1745,"children":1746},{"style":260},[1747],{"type":73,"value":653},{"type":68,"tag":247,"props":1749,"children":1750},{"style":399},[1751],{"type":73,"value":658},{"type":68,"tag":247,"props":1753,"children":1754},{"style":266},[1755],{"type":73,"value":663},{"type":68,"tag":247,"props":1757,"children":1758},{"style":260},[1759],{"type":73,"value":668},{"type":68,"tag":247,"props":1761,"children":1762},{"style":266},[1763],{"type":73,"value":115},{"type":68,"tag":247,"props":1765,"children":1766},{"style":260},[1767],{"type":73,"value":668},{"type":68,"tag":247,"props":1769,"children":1770},{"style":266},[1771],{"type":73,"value":36},{"type":68,"tag":247,"props":1773,"children":1774},{"style":260},[1775],{"type":73,"value":668},{"type":68,"tag":247,"props":1777,"children":1778},{"style":415},[1779],{"type":73,"value":689},{"type":68,"tag":247,"props":1781,"children":1782},{"style":266},[1783],{"type":73,"value":653},{"type":68,"tag":247,"props":1785,"children":1786},{"style":260},[1787],{"type":73,"value":668},{"type":68,"tag":247,"props":1789,"children":1790},{"style":266},[1791],{"type":73,"value":702},{"type":68,"tag":69,"props":1793,"children":1794},{},[1795],{"type":73,"value":1796},"The first read is current but does not make its consumer reactive.",{"type":68,"tag":69,"props":1798,"children":1799},{},[1800,1802],{"type":73,"value":1801},"Source: ",{"type":68,"tag":76,"props":1803,"children":1805},{"className":1804},[],[1806],{"type":73,"value":1807},"docs\u002Fframework\u002Fvue\u002Fguide\u002Ftable-state.md",{"type":68,"tag":715,"props":1809,"children":1811},{"id":1810},"high-passing-statevalue-once",[1812],{"type":73,"value":1813},"HIGH Passing state.value once",{"type":68,"tag":69,"props":1815,"children":1816},{},[1817],{"type":73,"value":1645},{"type":68,"tag":236,"props":1819,"children":1821},{"className":238,"code":1820,"language":240,"meta":241,"style":241},"const table = useTable({\n  features,\n  columns,\n  data,\n  state: controlledState.value,\n})\n",[1822],{"type":68,"tag":76,"props":1823,"children":1824},{"__ignoreMap":241},[1825,1852,1864,1876,1888,1917],{"type":68,"tag":247,"props":1826,"children":1827},{"class":249,"line":250},[1828,1832,1836,1840,1844,1848],{"type":68,"tag":247,"props":1829,"children":1830},{"style":399},[1831],{"type":73,"value":402},{"type":68,"tag":247,"props":1833,"children":1834},{"style":266},[1835],{"type":73,"value":576},{"type":68,"tag":247,"props":1837,"children":1838},{"style":260},[1839],{"type":73,"value":412},{"type":68,"tag":247,"props":1841,"children":1842},{"style":415},[1843],{"type":73,"value":585},{"type":68,"tag":247,"props":1845,"children":1846},{"style":266},[1847],{"type":73,"value":423},{"type":68,"tag":247,"props":1849,"children":1850},{"style":260},[1851],{"type":73,"value":1240},{"type":68,"tag":247,"props":1853,"children":1854},{"class":249,"line":307},[1855,1860],{"type":68,"tag":247,"props":1856,"children":1857},{"style":266},[1858],{"type":73,"value":1859},"  features",{"type":68,"tag":247,"props":1861,"children":1862},{"style":260},[1863],{"type":73,"value":331},{"type":68,"tag":247,"props":1865,"children":1866},{"class":249,"line":320},[1867,1872],{"type":68,"tag":247,"props":1868,"children":1869},{"style":266},[1870],{"type":73,"value":1871},"  columns",{"type":68,"tag":247,"props":1873,"children":1874},{"style":260},[1875],{"type":73,"value":331},{"type":68,"tag":247,"props":1877,"children":1878},{"class":249,"line":334},[1879,1884],{"type":68,"tag":247,"props":1880,"children":1881},{"style":266},[1882],{"type":73,"value":1883},"  data",{"type":68,"tag":247,"props":1885,"children":1886},{"style":260},[1887],{"type":73,"value":331},{"type":68,"tag":247,"props":1889,"children":1890},{"class":249,"line":347},[1891,1896,1900,1905,1909,1913],{"type":68,"tag":247,"props":1892,"children":1893},{"style":475},[1894],{"type":73,"value":1895},"  state",{"type":68,"tag":247,"props":1897,"children":1898},{"style":260},[1899],{"type":73,"value":483},{"type":68,"tag":247,"props":1901,"children":1902},{"style":266},[1903],{"type":73,"value":1904}," controlledState",{"type":68,"tag":247,"props":1906,"children":1907},{"style":260},[1908],{"type":73,"value":668},{"type":68,"tag":247,"props":1910,"children":1911},{"style":266},[1912],{"type":73,"value":1094},{"type":68,"tag":247,"props":1914,"children":1915},{"style":260},[1916],{"type":73,"value":331},{"type":68,"tag":247,"props":1918,"children":1919},{"class":249,"line":360},[1920,1924],{"type":68,"tag":247,"props":1921,"children":1922},{"style":260},[1923],{"type":73,"value":366},{"type":68,"tag":247,"props":1925,"children":1926},{"style":266},[1927],{"type":73,"value":442},{"type":68,"tag":69,"props":1929,"children":1930},{},[1931],{"type":73,"value":1713},{"type":68,"tag":236,"props":1933,"children":1935},{"className":238,"code":1934,"language":240,"meta":241,"style":241},"const table = useTable({ features, columns, data, state: controlledState })\n",[1936],{"type":68,"tag":76,"props":1937,"children":1938},{"__ignoreMap":241},[1939],{"type":68,"tag":247,"props":1940,"children":1941},{"class":249,"line":250},[1942,1946,1950,1954,1958,1962,1966,1970,1974,1978,1982,1987,1991,1996,2000,2004,2008],{"type":68,"tag":247,"props":1943,"children":1944},{"style":399},[1945],{"type":73,"value":402},{"type":68,"tag":247,"props":1947,"children":1948},{"style":266},[1949],{"type":73,"value":576},{"type":68,"tag":247,"props":1951,"children":1952},{"style":260},[1953],{"type":73,"value":412},{"type":68,"tag":247,"props":1955,"children":1956},{"style":415},[1957],{"type":73,"value":585},{"type":68,"tag":247,"props":1959,"children":1960},{"style":266},[1961],{"type":73,"value":423},{"type":68,"tag":247,"props":1963,"children":1964},{"style":260},[1965],{"type":73,"value":428},{"type":68,"tag":247,"props":1967,"children":1968},{"style":266},[1969],{"type":73,"value":598},{"type":68,"tag":247,"props":1971,"children":1972},{"style":260},[1973],{"type":73,"value":274},{"type":68,"tag":247,"props":1975,"children":1976},{"style":266},[1977],{"type":73,"value":607},{"type":68,"tag":247,"props":1979,"children":1980},{"style":260},[1981],{"type":73,"value":274},{"type":68,"tag":247,"props":1983,"children":1984},{"style":266},[1985],{"type":73,"value":1986}," data",{"type":68,"tag":247,"props":1988,"children":1989},{"style":260},[1990],{"type":73,"value":274},{"type":68,"tag":247,"props":1992,"children":1993},{"style":475},[1994],{"type":73,"value":1995}," state",{"type":68,"tag":247,"props":1997,"children":1998},{"style":260},[1999],{"type":73,"value":483},{"type":68,"tag":247,"props":2001,"children":2002},{"style":266},[2003],{"type":73,"value":915},{"type":68,"tag":247,"props":2005,"children":2006},{"style":260},[2007],{"type":73,"value":366},{"type":68,"tag":247,"props":2009,"children":2010},{"style":266},[2011],{"type":73,"value":442},{"type":68,"tag":69,"props":2013,"children":2014},{},[2015,2017,2023],{"type":73,"value":2016},"The adapter watches the computed ref; a one-time ",{"type":68,"tag":76,"props":2018,"children":2020},{"className":2019},[],[2021],{"type":73,"value":2022},".value",{"type":73,"value":2024}," breaks future option synchronization.",{"type":68,"tag":69,"props":2026,"children":2027},{},[2028,2029],{"type":73,"value":1801},{"type":68,"tag":76,"props":2030,"children":2032},{"className":2031},[],[2033],{"type":73,"value":2034},"packages\u002Fvue-table\u002Fsrc\u002FuseTable.ts",{"type":68,"tag":715,"props":2036,"children":2038},{"id":2037},"high-assigning-updater-functions-as-values",[2039],{"type":73,"value":2040},"HIGH Assigning updater functions as values",{"type":68,"tag":69,"props":2042,"children":2043},{},[2044],{"type":73,"value":1645},{"type":68,"tag":236,"props":2046,"children":2048},{"className":238,"code":2047,"language":240,"meta":241,"style":241},"const onPaginationChange = (next) => {\n  pagination.value = next\n}\n",[2049],{"type":68,"tag":76,"props":2050,"children":2051},{"__ignoreMap":241},[2052,2088,2111],{"type":68,"tag":247,"props":2053,"children":2054},{"class":249,"line":250},[2055,2059,2063,2067,2071,2076,2080,2084],{"type":68,"tag":247,"props":2056,"children":2057},{"style":399},[2058],{"type":73,"value":402},{"type":68,"tag":247,"props":2060,"children":2061},{"style":266},[2062],{"type":73,"value":987},{"type":68,"tag":247,"props":2064,"children":2065},{"style":260},[2066],{"type":73,"value":412},{"type":68,"tag":247,"props":2068,"children":2069},{"style":260},[2070],{"type":73,"value":940},{"type":68,"tag":247,"props":2072,"children":2073},{"style":1002},[2074],{"type":73,"value":2075},"next",{"type":68,"tag":247,"props":2077,"children":2078},{"style":260},[2079],{"type":73,"value":1044},{"type":68,"tag":247,"props":2081,"children":2082},{"style":399},[2083],{"type":73,"value":658},{"type":68,"tag":247,"props":2085,"children":2086},{"style":260},[2087],{"type":73,"value":317},{"type":68,"tag":247,"props":2089,"children":2090},{"class":249,"line":307},[2091,2095,2099,2103,2107],{"type":68,"tag":247,"props":2092,"children":2093},{"style":266},[2094],{"type":73,"value":1085},{"type":68,"tag":247,"props":2096,"children":2097},{"style":260},[2098],{"type":73,"value":668},{"type":68,"tag":247,"props":2100,"children":2101},{"style":266},[2102],{"type":73,"value":1094},{"type":68,"tag":247,"props":2104,"children":2105},{"style":260},[2106],{"type":73,"value":1099},{"type":68,"tag":247,"props":2108,"children":2109},{"style":266},[2110],{"type":73,"value":1165},{"type":68,"tag":247,"props":2112,"children":2113},{"class":249,"line":320},[2114],{"type":68,"tag":247,"props":2115,"children":2116},{"style":260},[2117],{"type":73,"value":1173},{"type":68,"tag":69,"props":2119,"children":2120},{},[2121],{"type":73,"value":1713},{"type":68,"tag":236,"props":2123,"children":2125},{"className":238,"code":2124,"language":240,"meta":241,"style":241},"const onPaginationChange = (next) => {\n  pagination.value = typeof next === 'function' ? next(pagination.value) : next\n}\n",[2126],{"type":68,"tag":76,"props":2127,"children":2128},{"__ignoreMap":241},[2129,2164,2243],{"type":68,"tag":247,"props":2130,"children":2131},{"class":249,"line":250},[2132,2136,2140,2144,2148,2152,2156,2160],{"type":68,"tag":247,"props":2133,"children":2134},{"style":399},[2135],{"type":73,"value":402},{"type":68,"tag":247,"props":2137,"children":2138},{"style":266},[2139],{"type":73,"value":987},{"type":68,"tag":247,"props":2141,"children":2142},{"style":260},[2143],{"type":73,"value":412},{"type":68,"tag":247,"props":2145,"children":2146},{"style":260},[2147],{"type":73,"value":940},{"type":68,"tag":247,"props":2149,"children":2150},{"style":1002},[2151],{"type":73,"value":2075},{"type":68,"tag":247,"props":2153,"children":2154},{"style":260},[2155],{"type":73,"value":1044},{"type":68,"tag":247,"props":2157,"children":2158},{"style":399},[2159],{"type":73,"value":658},{"type":68,"tag":247,"props":2161,"children":2162},{"style":260},[2163],{"type":73,"value":317},{"type":68,"tag":247,"props":2165,"children":2166},{"class":249,"line":307},[2167,2171,2175,2179,2183,2187,2191,2195,2199,2203,2207,2211,2215,2219,2223,2227,2231,2235,2239],{"type":68,"tag":247,"props":2168,"children":2169},{"style":266},[2170],{"type":73,"value":1085},{"type":68,"tag":247,"props":2172,"children":2173},{"style":260},[2174],{"type":73,"value":668},{"type":68,"tag":247,"props":2176,"children":2177},{"style":266},[2178],{"type":73,"value":1094},{"type":68,"tag":247,"props":2180,"children":2181},{"style":260},[2182],{"type":73,"value":1099},{"type":68,"tag":247,"props":2184,"children":2185},{"style":260},[2186],{"type":73,"value":1104},{"type":68,"tag":247,"props":2188,"children":2189},{"style":266},[2190],{"type":73,"value":1109},{"type":68,"tag":247,"props":2192,"children":2193},{"style":260},[2194],{"type":73,"value":1114},{"type":68,"tag":247,"props":2196,"children":2197},{"style":260},[2198],{"type":73,"value":294},{"type":68,"tag":247,"props":2200,"children":2201},{"style":297},[2202],{"type":73,"value":1123},{"type":68,"tag":247,"props":2204,"children":2205},{"style":260},[2206],{"type":73,"value":497},{"type":68,"tag":247,"props":2208,"children":2209},{"style":260},[2210],{"type":73,"value":1132},{"type":68,"tag":247,"props":2212,"children":2213},{"style":415},[2214],{"type":73,"value":1109},{"type":68,"tag":247,"props":2216,"children":2217},{"style":475},[2218],{"type":73,"value":423},{"type":68,"tag":247,"props":2220,"children":2221},{"style":266},[2222],{"type":73,"value":36},{"type":68,"tag":247,"props":2224,"children":2225},{"style":260},[2226],{"type":73,"value":668},{"type":68,"tag":247,"props":2228,"children":2229},{"style":266},[2230],{"type":73,"value":1094},{"type":68,"tag":247,"props":2232,"children":2233},{"style":475},[2234],{"type":73,"value":1068},{"type":68,"tag":247,"props":2236,"children":2237},{"style":260},[2238],{"type":73,"value":483},{"type":68,"tag":247,"props":2240,"children":2241},{"style":266},[2242],{"type":73,"value":1165},{"type":68,"tag":247,"props":2244,"children":2245},{"class":249,"line":320},[2246],{"type":68,"tag":247,"props":2247,"children":2248},{"style":260},[2249],{"type":73,"value":1173},{"type":68,"tag":69,"props":2251,"children":2252},{},[2253],{"type":73,"value":2254},"Table callbacks accept either a value or a function of the previous value.",{"type":68,"tag":69,"props":2256,"children":2257},{},[2258,2259],{"type":73,"value":1801},{"type":68,"tag":76,"props":2260,"children":2262},{"className":2261},[],[2263],{"type":73,"value":2264},"examples\u002Fvue\u002Fbasic-external-state\u002Fsrc\u002FApp.tsx",{"type":68,"tag":715,"props":2266,"children":2268},{"id":2267},"medium-supplying-jsx-children-as-a-slot",[2269],{"type":73,"value":2270},"MEDIUM Supplying JSX children as a slot",{"type":68,"tag":69,"props":2272,"children":2273},{},[2274],{"type":73,"value":1645},{"type":68,"tag":236,"props":2276,"children":2278},{"className":1209,"code":2277,"language":1211,"meta":241,"style":241},"\u003Ctable.Subscribe>\n  {(atoms) => \u003Cspan>{atoms.pagination.get().pageIndex}\u003C\u002Fspan>}\n\u003C\u002Ftable.Subscribe>\n",[2279],{"type":68,"tag":76,"props":2280,"children":2281},{"__ignoreMap":241},[2282,2298,2376],{"type":68,"tag":247,"props":2283,"children":2284},{"class":249,"line":250},[2285,2289,2293],{"type":68,"tag":247,"props":2286,"children":2287},{"style":260},[2288],{"type":73,"value":843},{"type":68,"tag":247,"props":2290,"children":2291},{"style":846},[2292],{"type":73,"value":195},{"type":68,"tag":247,"props":2294,"children":2295},{"style":260},[2296],{"type":73,"value":2297},">\n",{"type":68,"tag":247,"props":2299,"children":2300},{"class":249,"line":307},[2301,2306,2310,2314,2318,2322,2326,2330,2334,2338,2342,2346,2350,2354,2358,2363,2367,2371],{"type":68,"tag":247,"props":2302,"children":2303},{"style":260},[2304],{"type":73,"value":2305},"  {(",{"type":68,"tag":247,"props":2307,"children":2308},{"style":1002},[2309],{"type":73,"value":115},{"type":68,"tag":247,"props":2311,"children":2312},{"style":260},[2313],{"type":73,"value":1044},{"type":68,"tag":247,"props":2315,"children":2316},{"style":399},[2317],{"type":73,"value":658},{"type":68,"tag":247,"props":2319,"children":2320},{"style":260},[2321],{"type":73,"value":1273},{"type":68,"tag":247,"props":2323,"children":2324},{"style":475},[2325],{"type":73,"value":247},{"type":68,"tag":247,"props":2327,"children":2328},{"style":260},[2329],{"type":73,"value":1282},{"type":68,"tag":247,"props":2331,"children":2332},{"style":266},[2333],{"type":73,"value":115},{"type":68,"tag":247,"props":2335,"children":2336},{"style":260},[2337],{"type":73,"value":668},{"type":68,"tag":247,"props":2339,"children":2340},{"style":266},[2341],{"type":73,"value":36},{"type":68,"tag":247,"props":2343,"children":2344},{"style":260},[2345],{"type":73,"value":668},{"type":68,"tag":247,"props":2347,"children":2348},{"style":415},[2349],{"type":73,"value":689},{"type":68,"tag":247,"props":2351,"children":2352},{"style":266},[2353],{"type":73,"value":653},{"type":68,"tag":247,"props":2355,"children":2356},{"style":260},[2357],{"type":73,"value":668},{"type":68,"tag":247,"props":2359,"children":2360},{"style":266},[2361],{"type":73,"value":2362},"pageIndex",{"type":68,"tag":247,"props":2364,"children":2365},{"style":260},[2366],{"type":73,"value":1330},{"type":68,"tag":247,"props":2368,"children":2369},{"style":475},[2370],{"type":73,"value":247},{"type":68,"tag":247,"props":2372,"children":2373},{"style":260},[2374],{"type":73,"value":2375},">}\n",{"type":68,"tag":247,"props":2377,"children":2378},{"class":249,"line":320},[2379,2384,2388],{"type":68,"tag":247,"props":2380,"children":2381},{"style":260},[2382],{"type":73,"value":2383},"\u003C\u002F",{"type":68,"tag":247,"props":2385,"children":2386},{"style":846},[2387],{"type":73,"value":195},{"type":68,"tag":247,"props":2389,"children":2390},{"style":260},[2391],{"type":73,"value":2297},{"type":68,"tag":69,"props":2393,"children":2394},{},[2395],{"type":73,"value":1713},{"type":68,"tag":236,"props":2397,"children":2399},{"className":1209,"code":2398,"language":1211,"meta":241,"style":241},"\u003Ctable.Subscribe\n  children={(atoms) => \u003Cspan>{atoms.pagination.get().pageIndex}\u003C\u002Fspan>}\n\u002F>\n",[2400],{"type":68,"tag":76,"props":2401,"children":2402},{"__ignoreMap":241},[2403,2415,2495],{"type":68,"tag":247,"props":2404,"children":2405},{"class":249,"line":250},[2406,2410],{"type":68,"tag":247,"props":2407,"children":2408},{"style":260},[2409],{"type":73,"value":843},{"type":68,"tag":247,"props":2411,"children":2412},{"style":846},[2413],{"type":73,"value":2414},"table.Subscribe\n",{"type":68,"tag":247,"props":2416,"children":2417},{"class":249,"line":307},[2418,2422,2427,2431,2435,2439,2443,2447,2451,2455,2459,2463,2467,2471,2475,2479,2483,2487,2491],{"type":68,"tag":247,"props":2419,"children":2420},{"style":399},[2421],{"type":73,"value":1248},{"type":68,"tag":247,"props":2423,"children":2424},{"style":260},[2425],{"type":73,"value":2426},"={(",{"type":68,"tag":247,"props":2428,"children":2429},{"style":1002},[2430],{"type":73,"value":115},{"type":68,"tag":247,"props":2432,"children":2433},{"style":260},[2434],{"type":73,"value":1044},{"type":68,"tag":247,"props":2436,"children":2437},{"style":399},[2438],{"type":73,"value":658},{"type":68,"tag":247,"props":2440,"children":2441},{"style":260},[2442],{"type":73,"value":1273},{"type":68,"tag":247,"props":2444,"children":2445},{"style":475},[2446],{"type":73,"value":247},{"type":68,"tag":247,"props":2448,"children":2449},{"style":260},[2450],{"type":73,"value":1282},{"type":68,"tag":247,"props":2452,"children":2453},{"style":266},[2454],{"type":73,"value":115},{"type":68,"tag":247,"props":2456,"children":2457},{"style":260},[2458],{"type":73,"value":668},{"type":68,"tag":247,"props":2460,"children":2461},{"style":266},[2462],{"type":73,"value":36},{"type":68,"tag":247,"props":2464,"children":2465},{"style":260},[2466],{"type":73,"value":668},{"type":68,"tag":247,"props":2468,"children":2469},{"style":415},[2470],{"type":73,"value":689},{"type":68,"tag":247,"props":2472,"children":2473},{"style":266},[2474],{"type":73,"value":653},{"type":68,"tag":247,"props":2476,"children":2477},{"style":260},[2478],{"type":73,"value":668},{"type":68,"tag":247,"props":2480,"children":2481},{"style":266},[2482],{"type":73,"value":2362},{"type":68,"tag":247,"props":2484,"children":2485},{"style":260},[2486],{"type":73,"value":1330},{"type":68,"tag":247,"props":2488,"children":2489},{"style":475},[2490],{"type":73,"value":247},{"type":68,"tag":247,"props":2492,"children":2493},{"style":260},[2494],{"type":73,"value":2375},{"type":68,"tag":247,"props":2496,"children":2497},{"class":249,"line":320},[2498],{"type":68,"tag":247,"props":2499,"children":2500},{"style":260},[2501],{"type":73,"value":2502},"\u002F>\n",{"type":68,"tag":69,"props":2504,"children":2505},{},[2506,2508,2514],{"type":73,"value":2507},"The Vue adapter declares ",{"type":68,"tag":76,"props":2509,"children":2511},{"className":2510},[],[2512],{"type":73,"value":2513},"Subscribe(props: { children })",{"type":73,"value":2515}," and expects the explicit prop.",{"type":68,"tag":69,"props":2517,"children":2518},{},[2519,2520],{"type":73,"value":1801},{"type":68,"tag":76,"props":2521,"children":2523},{"className":2522},[],[2524],{"type":73,"value":2034},{"type":68,"tag":91,"props":2526,"children":2528},{"id":2527},"api-discovery",[2529],{"type":73,"value":2530},"API Discovery",{"type":68,"tag":69,"props":2532,"children":2533},{},[2534,2536,2542,2543,2549],{"type":73,"value":2535},"Inspect ",{"type":68,"tag":76,"props":2537,"children":2539},{"className":2538},[],[2540],{"type":73,"value":2541},"node_modules\u002F@tanstack\u002Fvue-table\u002Fdist\u002FuseTable.d.ts",{"type":73,"value":82},{"type":68,"tag":76,"props":2544,"children":2546},{"className":2545},[],[2547],{"type":73,"value":2548},"reactivity.d.ts",{"type":73,"value":2550},"; inspect the exact state slice in the installed core feature directory.",{"type":68,"tag":2552,"props":2553,"children":2554},"style",{},[2555],{"type":73,"value":2556},"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":2558,"total":2642},[2559,2571,2583,2595,2610,2622,2632],{"slug":2560,"name":2560,"fn":2561,"description":2562,"org":2563,"tags":2564,"stars":22,"repoUrl":23,"updatedAt":2570},"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},[2565,2568,2569],{"name":2566,"slug":2567,"type":15},"Data Analysis","data-analysis",{"name":17,"slug":18,"type":15},{"name":9,"slug":8,"type":15},"2026-07-30T05:25:59.429787",{"slug":2572,"name":2572,"fn":2573,"description":2574,"org":2575,"tags":2576,"stars":22,"repoUrl":23,"updatedAt":2582},"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},[2577,2580,2581],{"name":2578,"slug":2579,"type":15},"Debugging","debugging",{"name":17,"slug":18,"type":15},{"name":9,"slug":8,"type":15},"2026-07-30T05:26:05.418735",{"slug":2584,"name":2584,"fn":2585,"description":2586,"org":2587,"tags":2588,"stars":22,"repoUrl":23,"updatedAt":2594},"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},[2589,2590,2591],{"name":2566,"slug":2567,"type":15},{"name":9,"slug":8,"type":15},{"name":2592,"slug":2593,"type":15},"UI Components","ui-components","2026-07-30T05:25:38.403427",{"slug":2596,"name":2596,"fn":2597,"description":2598,"org":2599,"tags":2600,"stars":22,"repoUrl":23,"updatedAt":2609},"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},[2601,2604,2605,2608],{"name":2602,"slug":2603,"type":15},"Data Pipeline","data-pipeline",{"name":17,"slug":18,"type":15},{"name":2606,"slug":2607,"type":15},"Performance","performance",{"name":9,"slug":8,"type":15},"2026-07-30T05:25:45.400104",{"slug":2611,"name":2611,"fn":2612,"description":2613,"org":2614,"tags":2615,"stars":22,"repoUrl":23,"updatedAt":2621},"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},[2616,2619,2620],{"name":2617,"slug":2618,"type":15},"Data Visualization","data-visualization",{"name":17,"slug":18,"type":15},{"name":9,"slug":8,"type":15},"2026-07-30T05:25:41.397257",{"slug":2623,"name":2623,"fn":2624,"description":2625,"org":2626,"tags":2627,"stars":22,"repoUrl":23,"updatedAt":2631},"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},[2628,2629,2630],{"name":2566,"slug":2567,"type":15},{"name":17,"slug":18,"type":15},{"name":9,"slug":8,"type":15},"2026-07-30T05:25:53.391632",{"slug":2633,"name":2633,"fn":2634,"description":2635,"org":2636,"tags":2637,"stars":22,"repoUrl":23,"updatedAt":2641},"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},[2638,2639,2640],{"name":17,"slug":18,"type":15},{"name":9,"slug":8,"type":15},{"name":2592,"slug":2593,"type":15},"2026-07-30T05:26:03.37801",30,{"items":2644,"total":2742},[2645,2651,2657,2663,2670,2676,2682,2688,2701,2711,2722,2732],{"slug":2560,"name":2560,"fn":2561,"description":2562,"org":2646,"tags":2647,"stars":22,"repoUrl":23,"updatedAt":2570},{"slug":8,"name":9,"logoUrl":10,"githubOrg":9},[2648,2649,2650],{"name":2566,"slug":2567,"type":15},{"name":17,"slug":18,"type":15},{"name":9,"slug":8,"type":15},{"slug":2572,"name":2572,"fn":2573,"description":2574,"org":2652,"tags":2653,"stars":22,"repoUrl":23,"updatedAt":2582},{"slug":8,"name":9,"logoUrl":10,"githubOrg":9},[2654,2655,2656],{"name":2578,"slug":2579,"type":15},{"name":17,"slug":18,"type":15},{"name":9,"slug":8,"type":15},{"slug":2584,"name":2584,"fn":2585,"description":2586,"org":2658,"tags":2659,"stars":22,"repoUrl":23,"updatedAt":2594},{"slug":8,"name":9,"logoUrl":10,"githubOrg":9},[2660,2661,2662],{"name":2566,"slug":2567,"type":15},{"name":9,"slug":8,"type":15},{"name":2592,"slug":2593,"type":15},{"slug":2596,"name":2596,"fn":2597,"description":2598,"org":2664,"tags":2665,"stars":22,"repoUrl":23,"updatedAt":2609},{"slug":8,"name":9,"logoUrl":10,"githubOrg":9},[2666,2667,2668,2669],{"name":2602,"slug":2603,"type":15},{"name":17,"slug":18,"type":15},{"name":2606,"slug":2607,"type":15},{"name":9,"slug":8,"type":15},{"slug":2611,"name":2611,"fn":2612,"description":2613,"org":2671,"tags":2672,"stars":22,"repoUrl":23,"updatedAt":2621},{"slug":8,"name":9,"logoUrl":10,"githubOrg":9},[2673,2674,2675],{"name":2617,"slug":2618,"type":15},{"name":17,"slug":18,"type":15},{"name":9,"slug":8,"type":15},{"slug":2623,"name":2623,"fn":2624,"description":2625,"org":2677,"tags":2678,"stars":22,"repoUrl":23,"updatedAt":2631},{"slug":8,"name":9,"logoUrl":10,"githubOrg":9},[2679,2680,2681],{"name":2566,"slug":2567,"type":15},{"name":17,"slug":18,"type":15},{"name":9,"slug":8,"type":15},{"slug":2633,"name":2633,"fn":2634,"description":2635,"org":2683,"tags":2684,"stars":22,"repoUrl":23,"updatedAt":2641},{"slug":8,"name":9,"logoUrl":10,"githubOrg":9},[2685,2686,2687],{"name":17,"slug":18,"type":15},{"name":9,"slug":8,"type":15},{"name":2592,"slug":2593,"type":15},{"slug":2689,"name":2689,"fn":2690,"description":2691,"org":2692,"tags":2693,"stars":22,"repoUrl":23,"updatedAt":2700},"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},[2694,2697,2698,2699],{"name":2695,"slug":2696,"type":15},"CSS","css",{"name":17,"slug":18,"type":15},{"name":9,"slug":8,"type":15},{"name":2592,"slug":2593,"type":15},"2026-07-30T05:25:55.377366",{"slug":2702,"name":2702,"fn":2703,"description":2704,"org":2705,"tags":2706,"stars":22,"repoUrl":23,"updatedAt":2710},"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},[2707,2708,2709],{"name":17,"slug":18,"type":15},{"name":9,"slug":8,"type":15},{"name":2592,"slug":2593,"type":15},"2026-07-30T05:25:51.400011",{"slug":2712,"name":2712,"fn":2713,"description":2714,"org":2715,"tags":2716,"stars":22,"repoUrl":23,"updatedAt":2721},"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},[2717,2718,2719,2720],{"name":2695,"slug":2696,"type":15},{"name":17,"slug":18,"type":15},{"name":9,"slug":8,"type":15},{"name":2592,"slug":2593,"type":15},"2026-07-30T05:25:48.703799",{"slug":2723,"name":2723,"fn":2724,"description":2725,"org":2726,"tags":2727,"stars":22,"repoUrl":23,"updatedAt":2731},"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},[2728,2729,2730],{"name":17,"slug":18,"type":15},{"name":9,"slug":8,"type":15},{"name":2592,"slug":2593,"type":15},"2026-07-30T05:25:47.367943",{"slug":2733,"name":2733,"fn":2734,"description":2735,"org":2736,"tags":2737,"stars":22,"repoUrl":23,"updatedAt":2741},"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},[2738,2739,2740],{"name":2566,"slug":2567,"type":15},{"name":17,"slug":18,"type":15},{"name":2592,"slug":2593,"type":15},"2026-07-30T05:25:52.366295",125]