Welcome To
Mantine React Table
Built with MantineV7 and TanStack TableV8
The Best of Both Worlds
Combine TanStack Table's Extensive API With Mantine's Awesome Pre-Built Components!
Efficient Bundle Size
33-47 KB depending on components imported.
Import the recommended MantineReactTable
component, or optionally import lighter weight MRT sub-components that only include the UI you need.
Pre-Built or 100% Custom
Use the pre-built single component data grid with the <MantineReactTable />
component.
Or build your own markup from scratch using the useMantineReactTable
hook.
All internal MRT components are exported for you to use as "lego blocks" to build your own custom tables.
Easy Customization
Just about everything is customizable or overridable in Mantine React Table. Pass in custom props or styles to all internal components. Use simple enable*
props to easily enable or disable features.
Powerful Features
Mantine React Table has most of the features you would expect from a modern table library including Pagination, Sorting, Filtering, Row Selection, Row Expansion, Column Resizing, Column Reordering, etc.
However, Mantine React Table also has advanced features that you may not find in other table libraries such as Virtualization, Aggregation and Grouping, Advanced Filter UIs, Fuzzy Search, Full Editing (CRUD), Column Pinning, Row Numbers, Click to Copy, and more.
30+ i18n Locales
The MRT Community has contributed over 30 Locales for everyone to import and use.
Popular Docs
Examples to Get You Started
Is <MantineReactTable /> Right For Your Project?
Let's Compare
Library | Free or Licensed | Bundle Size | Description |
---|---|---|---|
Mantine React Table | Free MIT | Built on top of TanStack Table V8 and Mantine V6, Mantine React Table (MRT) is a batteries-included React table library that attempts to provide all the table features you need while trying to stay highly performant and relatively lightweight. Customization is treated as a top priority to let you override any styles you need to change. Mantine React Table was forked from Material React Table and is being built in 2023. | |
Mantine DataTable | Free MIT | A very close to stock feeling Mantine Data Table component. It is a pretty lightweight library and is more so an extra wrapper for Mantine's built-in Table component, but with way more props, features, and styles built-in. Even though it is so lightweight, the filtering, pagination, sorting, and selection features that come with it might be enough for a lot of projects. | |
Mantine Data Grid | Free MIT | Mantine Data Grid is another project that is being built on top of both Mantine and TanStack Table. It seems to be a smaller project, and it is unclear if it will be as feature-rich or viable as other options on this list, but it is worth keeping an eye on. | |
TanStack Table (React Table) | Free MIT | TanStack Table (formerly React Table) is a lightweight Headless UI library for building powerful tables and datagrids. No CSS or components included. You use logic from the useReactTable hook to build your own table components. No batteries included, but you get total control of your markup and styles (Mantine React Table is built on top of TanStack Table). | |
AG Grid Community/Enterprise | MIT or Paid License | If you are looking for the best data grid/table library possible, look no further than AG Grid. It may not exactly be lightweight or made from Mantine components, but it is the best of the best. It does have some drawbacks, as it has a very large bundle size and depending on your feature needs, it may require a paid license. |
Feature Comparison
Feature | Mantine React Table | Mantine DataTable |
---|---|---|
Click to copy | ✅ | ❌ |
Column Action Dropdown | ✅ | ❌ |
Column Hiding | ✅ | ✅ |
Column Ordering (DnD) | ✅ | ✅ |
Column Pinning (Freezing) | ✅ | ❌ |
Column Resizing | ✅ | ✅ |
Column Spanning | ❌ | ❌ |
Column Virtualization | ✅ | ❌ |
Column/Row Grouping and Aggregation | ✅ | ❌ |
Custom Icons | ✅ | ✅ |
Customize Toolbars | ✅ | ⚠️ |
Data Editing | ✅ | ✅ |
Density Toggle | ✅ | ✅ |
Detail Panels | ✅ | ✅ |
Expanding Rows (Tree Data) | ✅ | ✅ |
Export to CSV | ✅ | ✅ |
Filter Modes | ✅ | ❌ |
Filtering | ✅ | ✅ |
Fullscreen Mode | ✅ | ❌ |
Global Filtering Search | ✅ | ✅ |
Header Groups and Footers | ✅ | ✅ |
Localization (i18n) | ✅ | ✅ |
Manage your own state | ✅ | ✅ |
Pagination | ✅ | ✅ |
Row Action Buttons | ✅ | ✅ |
Row Context Menu | ❌ | ✅ |
Row Numbers | ✅ | ❌ |
Row Ordering (DnD) | ✅ | ❌ |
Row Selection | ✅ | ✅ |
Sorting | ✅ | ✅ |
SSR Compatibility | ✅ | ✅ |
Theming | ✅ | ✅ |
Virtualization | ✅ | ❌ |
*If you see any inaccuracies in this table, PRs are welcome!
Maintainers and Contributors
Important Links
Using Material-UI instead of Mantine?
Check out Material React Table