About - Mantine React Table

Q: Is Mantine React Table free to use?

Yes , as stated above , Mantine React Table uses the MIT License and is free to use for either personal or enterprise projects.

Q: Is Mantine React Table the same as Material React Table?

Kind of. Mantine React Table is a fork of Material React Table. About 80% of their code is the same, since both are built on TanStack Table. But Mantine React Table uses Mantine for the front-end instead of Material UI. Both libraries pretty much offer the same features.

Q: Should I use Mantine React Table?

It depends. If you are already using Mantine for other components in your project, and are looking for a efficient and fully featured data grid component to drop in, this may be the perfect library for you. MRT is not necessarily the lightest weight table library out there, but it has a much smaller bundle size than large data grid libraries like AG Grid. Though, if you are looking for the most powerful data grid possible, AG Grid is still recommended above MRT as long as you do not care about bundle size.

About Mantine React Table

Mantine React Table is a fully featured Mantine implementation of TanStack React Table V8, forked from Material React Table.

What is Mantine React Table?

Mantine React Table (MRT) is a fully-featured data grid/table component library for React built on TanStack Table V8's powerful API. MRT is meant to work best in projects already using Mantine components, but it is not necessarily required. However, be aware that Mantine and Emotion are required as peer dependencies for MRT to work.

MRT is built from the ground up in TypeScript, and is designed to have a great type-safe dev experience with generics that react to the data structures you pass in. TypeScript is not at all required to use MRT, but it is recommended for the best and fasted developer experience, especially when defining columns.

Motivation

Mantine React Table started as a fork of Material React Table after it became successful. I have used Material UI for years, and consider it a workhorse. But Material Design itself is starting to look dated, and some of the quality of the MUI components are starting to suffer. Mantine is a relatively new React UI library that is easy to fall in love with. As soon I found Mantine and discovered that it is built with some of the same tech and patterns as MUI already is, I knew I could easily port the Material React Table codebase to Mantine. Mantine has been a joy to work with, and I hope you enjoy using it as much as I do. A powerful data grid component seemed to be missing from the Mantine ecosystem, so I decided to create Mantine React Table.

License

Mantine React Table is licensed under the MIT License and is free to use in both personal and commercial projects.

Features

✅ < 45kb gzipped - Bundlephobia

✅ Advanced TypeScript Generics Support (TypeScript Optional)

✅ Aggregation and Grouping (Sum, Average, Count, etc.)

✅ Click To Copy Cell Values

✅ Column Action Dropdown Menu

✅ Column Hiding

✅ Column Ordering via Drag'n'Drop

✅ Column Pinning (Freeze Columns)

✅ Column Resizing

✅ Customize Icons

✅ Customize Styling of internal Mantine Components

✅ Data Editing (4 different editing modes)

✅ Density Toggle

✅ Detail Panels (Expansion)

✅ Filtering (supports client-side and server-side)

✅ Filter Match Highlighting

✅ Full Screen Mode

✅ Global Filtering (Search across all columns, rank by best match)

✅ Header Groups & Footers

✅ Localization (i18n) support

✅ Manage your own state or let the table manage it internally for you

✅ Pagination (supports client-side and server-side)

✅ Row Actions (Your Custom Action Buttons)

✅ Row Numbers

✅ Row Ordering via Drag'n'Drop

✅ Row Selection (Checkboxes)

✅ SSR compatible

✅ Sorting (supports client-side and server-side)

✅ Theming (Respects your Mantine Theme)

✅ Toolbars (Add your own action buttons)

✅ Tree Data / Expanding Sub-rows

✅ Virtualization (react-virtual)

Contribute

If you would like to contribute code to the project, please read the Contributing Guide to learn how to get started.

Support the Project

If you enjoy this library, please consider supporting the project by leaving a ⭐️ on the GitHub repository.

Also consider sponsoring me on GitHub to help cover the costs of maintaining the project.

Nothing financial is required at all to support this library. The greatest help of all, actually, is to get involved in the project and community. Submitting issues, pull requests, and helping others in the Discord Server are all great ways to help out.

If you see any inaccuracies in the documentation, there is a "Suggest an Edit For This Page on GitHub" button at the bottom of every page that will take you directly to the page's markdown file on GitHub. You can then edit the file and submit a pull request to fix any issues.

Join the Development Discussion

Want to join the development discussion? Join the Discord server to ask questions or talk about the general direction of the project(s).

Contributors

Kevin Van Cott

Maintainer, Developer

Ryan Kholousi

UI/UX Designer

Daniel Humphrey

UI/UX, Technical Writer

OSS that Makes Mantine React Table Possible

Mantine - Components!
TanStack - React Table and React Virtual are key underlying technologies of MRT.
Vercel - Next.js, Domains, and Hosting
Docsearch - High quality search for static websites, free for open source projects
Plausible Analytics - Anonymous and privacy-friendly analytics (no tracking or cookies!). View the MRT Plausible Analytics Dashboard yourself.
EthicalAds - Ethical ads for open source projects (no tracking or cookies!)