TanStack

T

TanStack

TanStack is a community of passionate software engineers striving for high-quality, open-source software for web devs

Join

react-query-questions

solid-query-questions

table-questions

virtual-questions

router-questions

react-charts-questions

ranger-questions

vue-query-questions

svelte-query-questions

bling-questions

form-questions

angular-query-questions

start-questions

db-questions

start-showcase

router-showcase

📣-announcements

like-gold
like-gold6/12/2025

Expand Event triggers when table data is empty (filter gets applied and no data is found)

Hi, i have a situation where i want to emit a stateChange event whenever something happens in the table. In case i apply a filter i emit this change. For some reason when i apply a filter condition and the onColumnnFilterChange triggers the onExpandChange also triggers. Resulting in two emits....
No description
fascinating-indigo
fascinating-indigo6/10/2025

Cursor pagination with tanstack table

Looked online and on the discord to see if theres a straightforward way to implement tanstack table using cursor pagination. Right now my backend returns a next and previous cursor (item id), along with the query total and some other information. Seems like I need to implement manual pagination to convert the cursor information to a pageIndex. Want to see if anyone else had thoughts!...
extended-salmon
extended-salmon6/6/2025

Examples of table + query + shadcn + drizzle?

Heya, amazing libraries from tanstack - love em. Does anyone know of any example repos, blog posts that go over this specific combo for making reusable data tables? Also thinking of this post - https://www.trevorlasn.com/blog/fetching-data-for-complex-next-and-react-apps
rising-crimson
rising-crimson6/6/2025

Keep row pinning in place + sort on server side

Hello, My data is sorted correctly on the server, and the sorting displays properly in the table. However, I’m having trouble figuring out how to keep the pinned row visible when using server-side (manual) sorting. Pinned rows work as expected with client-side sorting. Current behaviour is that on sorting the pinned row is affected ...
extended-salmon
extended-salmon6/6/2025

enable sort removal except for one column

i'm trying to get a table ux where: - subset of columns are sortable - a single column is the default sort (date) (this is the shape the data is loaded in) - all columns other than the default sort have sort removal enabled ...
extended-salmon
extended-salmon6/6/2025

table hook re-use across routes

follow up from: https://discord.com/channels/719702312431386674/1003326939899113492/1380046393439293530 cc @KevinVandy could you explain more what you mean about re-using hooks? i have a page component that queries some data and passes it down to a table component that instantiates and renders the table...
fascinating-indigo
fascinating-indigo5/30/2025

Virtualized Table with expandable rows

Hello! Does anyone have a working example of both TanStack Virtualized rows + expandable rows together using react?
quickest-silver
quickest-silver5/30/2025

Column drag resizing not matching cursor's movement

Hello! I am a TanStack table begginer using React. I have implemented a custom resizer handle. I feel confusing that the amount of distance that the mouse is moved does not match the column size. I don't know how to explain it properly, but in the gif you can see that the column ends in a smaller position than it should be, it does not fully follow the cursor... Is this behaviour customizable?...
No description
rising-crimson
rising-crimson5/28/2025

Look up row index from ID

How can I look up the actual rendered row index (after sorting, filtering etc) for a row? I can't see any other solution than calling (a potentially slow) findIndex on table.getRowModel(), since the index field on the row unfortunately corresponds to the index in the original passed-in data array. Is there no API for this?...
conventional-tan
conventional-tan5/23/2025

Is anyone using the alpha version with svelte?

Is anyone here using the alpha version of tabel with svelte 5? I switched to alpha because I am using svelte 5 but all the discussions on github are old, is it stable enough to use? has there been any updates lately? The latest issue I am running into is that I am rendering my headers like this ```svelte {#each table.getHeaderGroups() as headerGroup}...
harsh-harlequin
harsh-harlequin5/21/2025

Why AppFieldExtendedReactFormApi type is not exported?

While we have fieldComponents & formComponents, we might need also formCallbacks or at least exported AppFieldExtendedReactFormApi type. In our application form has effect in whole page, so in v0 of Forms i put created form to a context and used in many places, avoiding prop drilling. Now useAppForm returns value of AppFieldExtendedReactFormApi type. And I need to redeclare it locally. What was the reason to not exporting AppFieldExtendedReactFormApi?...
automatic-azure
automatic-azure5/20/2025

Filter columns based on the value of a formatted cell.

Hey all, using shadcn table for a side project. Having some trouble with filtering a column that has been formatted as the value within in each cell is pretty different from the default. Is there a property im missing here? I would ideally like to filter based off the formatted value and not the original.
genetic-orange
genetic-orange5/16/2025

Updating ColumnDefs question

Hi, our ColumnDefs change as a result of a state change - useReactTable does not seem to be applying the new ColumnDef instances after the initial create. What is the recommended way to apply updated ColumnDef settings. I could store as a custom property on the meta and and provide a setter for this. a sample setting is if the column is editable or not....
rival-black
rival-black5/15/2025

Anyone know how to stop flexRender from messing up Shadcn dialog/form tab order?

If I place my column header or cell impl directly in the table the tab order isn't messed up. I asked a similar question in Shadcn general: https://github.com/shadcn-ui/ui/discussions/7325#discussioncomment-13045899
rising-crimson
rising-crimson5/15/2025

Selecting rows with keyboard

If I want to allow shift/ctrl-arrow etc to select one or more rows in a TanStack Table, are there any goto libraries for that? Or should I just roll my own?
foreign-sapphire
foreign-sapphire5/7/2025

Column dynamic width

In these docs (https://tanstack.com/table/v8/docs/framework/react/examples/virtualized-rows) columns resize depending on width, but when I copied entire snippet to my project it doesn't? I'm ending up with what you can see on the screenshot. I'm using same version as in the docs. What I need is table which takes full width with certain columns wider than the rest
No description
sensitive-blue
sensitive-blue5/2/2025

Disable auto resetting pageSize (similar to page index, but only for page size)

It appears that on data change, the pageSize is automatically reset to the initial state. Is theer a way to prevent this, similar to the autoResetPageIndex option? Thanks!...
flat-fuchsia
flat-fuchsia4/29/2025

Help me please understand how to populate faceted filters on first render

Hey there. Im struggling to make react-select to work with faceted filters on the first render. When app loads options from faceted filters from the table computation are not present in react-select. Once refresh table (re-render) clicked the options show up. How can I make it so it they will show in 1st render too. https://codesandbox.io/p/devbox/zen-joana-rz6fg5?workspaceId=ws_G2A9pv9f8cYKfsXyvYJaKX...
flat-fuchsia
flat-fuchsia4/23/2025

custom filterFn typescript type

How do I extend filterFn types with my custom filter?? i defnied my new custom filter in filterFns but typescript yells at me when I use it in the column definitions. Nothing in the docs shows how to exted the interface.
absent-sapphire
absent-sapphire4/22/2025

How to Retrieve and Set a Consolidated Schema for User action in Table for Filters, Sorts and more ?

I wanted to check if it's possible to define a table schema that captures all user interactions such as filtering and sorting for each column. Specifically, in scenarios where users apply both sorting and filtering across multiple columns simultaneously, is there a way to retrieve a complete and structured summary of all the actions performed—per column? For example, if a user filters and sorts on the "size" and "name" columns, I'd like to receive a consolidated schema or data object that includes the applied filters, their logical connectors (e.g., AND/OR), and sorting directions for each column. [...