mantinedev / mantine

A fully featured React components library
https://mantine.dev
MIT License
26.67k stars 1.89k forks source link

DataGrid component #276

Closed dukesx closed 2 years ago

dukesx commented 3 years ago

I was scrolling through, just to encounter a few libraries i needed to use for an admin panel i am developing currently. i needed data tables to show data. so i came across these two:

  1. Revo Grid
  2. React Data Grid

Two of the most lightest and actually "data" centered tables that i have seen by far. Now i am not sure if they go with CSS in JS or emotion but worth a try if anyone from the community is willing to work on it. Its probably a needful implementation considering that data tables are very commonly used. Both libraries have been updated constantly, according to OpenBase Graph, active team.

rtivital commented 3 years ago

I'll be working on data grid package some time next year, most likely it will be built with react-table – https://react-table.tanstack.com/

dukesx commented 3 years ago

I'll be working on data grid package some time next year, most likely it will be built with react-table – https://react-table.tanstack.com/

Well, isn't this library going to take an immense amount of time ? i like the fact that it's headless and has hooks but implementation seems complex somewhat.

rtivital commented 3 years ago

Well, isn't this library going to take an immense amount of time

Why? react-table handles all complex cases. Headless approach will allow us to customize styles to match other components while handling all crazy stuff like columns resizing.

esistgut commented 2 years ago

Any update on this? The lack of a data table component is a massive blocker for any kind of CRUD application.

wapenshaw commented 2 years ago

I'd like to add a suggestion regarding datatables and datagrids, please make them responsive, i.e. the columns stack into rows on mobile screen sizes. Example

There are very few libraries in the react ecosystem that offer this functionality (afaik, primereact, elasticui) Last time I checked even Ant Design didn't have responsive tables (they can hide/show columns based on breakpoints but thats it)

If you look at ElasticUI, all their tables and grid components offer this feature but EUI is not nearly as flexible as mantine

https://elastic.github.io/eui/#/tabular-content/tables#a-basic-table << check this page on a mobile screen width to see the stacking

alexkreidler commented 2 years ago

Personally I really love this project: https://github.com/glideapps/glide-data-grid, which uses React but renders using Canvas instead of regular HTML, which may limit some the styling customization options.