How does TanStack/react-table compare to a spreadsheet?

[lancepollard]

I am in the process of searching for a spreadsheet like UI in React, so we can implement things like:

• copy cells
• cut cells
• paste cells
• undo paste/edit (ctrl+z)
• redo paste/edit (ctrl+shift+z)
• resize column
• move columns around
• drag to highlight cells
• sort columns
• keyboard navigation (arrow keys to go around cells, etc.)
• enter or double click to edit
• style cells however we want, while still being able to edit/paste/etc..

Does react-table feature this sort of functionality, or is a lot simpler than this? It doesn't need to look like a spreadsheet; in fact we are looking to customize the UI entirely, but we are looking for something with the same functionality as a spreadsheet.

I found react-table through https://jspreadsheets.com, which also linked to https://handsontable.com/demo, but it is a paid-for product unfortunately. How does react-table compare to that?

At first glance it appears react-table doesn't offer the functionality of a spreadsheet, but I can't quite tell. Looking for some clarification. Thank you so much!

[KevinVandy]

@tanstack/react-table is mostly focussed on the headless logic for displaying data in columns, rows, pagination, grouping, expanding, filtering, searching, etc. You can easily build on editing and all of the other stuff you mentioned, but you have to implement it yourself. Though react-table will give you a pretty good base for it.

Here's an example of a double click to edit example using react-table I've done. https://www.material-react-table.dev/?path=/story/features-editing-examples--editing-enabled-edit-mode-cell

[lancepollard]

Thanks for the info!