DEV Community πŸ‘©β€πŸ’»πŸ‘¨β€πŸ’»

Cover image for Introducing Mantine DataTable
Ionut-Cristian Florescu
Ionut-Cristian Florescu

Posted on

Introducing Mantine DataTable

Mantine DataTable brings datagrid-like functionality to your data-rich user interfaces.

I've been working for a while with Mantine.dev and I believe that, at the moment, it is one of the best React UI frameworks out there. But it was missing a very useful functionality, which many people in the community kept asking about, and that was a data-table/data-grid component. So, being a keen supporter of open-source and the idea that we each should contribute to the development of beautiful, useful projects, I decided to build Mantine DataTable and release it under MIT license.

The entire codebase is written in TypeScript, component properties are well typed and documented with JSDoc, so you can build type safe applications with confidence. The component supports asynchronous data loading, pagination, multiple rows selection, column sorting, custom cell data rendering, row context menu, global application dark theme, and more.

Head over to the project's website for a quick start and to learn how to use it and configure it for various scenarios by browsing through the comprehensive list of examples.

Also, if you find the project useful, it would help a lot if you could star the GitHub repository, spread the word or hire my services to build front-end/full-stack stuff.

Oldest comments (1)

Collapse
 
badreddine profile image
Badr Eddine

is there a way to add an HTML tag for every record, for example I want to add data-cy="equipment-item" to every item rendered by the DataTable component so that i can get it in cypress

DEV

Thank you.

Β 
Thanks for visiting DEV, we’ve worked really hard to cultivate this great community and would love to have you join us. If you’d like to create an account, you can sign up here.