Material React Table

Material React Table is a fully featured Material UI V5 implementation of TanStack React Table V8, written from the ground up in TypeScript.

Material 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 Material UI components, but it is not necessarily required. However, be aware that Material UI and Emotion are required as peer dependencies for MRT to work.

If you are a Tailwind or native CSS user, check out Mantine React Table instead, which is a sister library to MRT that uses Mantine components instead of Material UI and is a bit more Tailwind friendly.

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.

Material React Table has a sister library, Mantine React Table that uses Mantine components instead of Material UI, but otherwise has the same API. Check it out if you're looking for a Material UI alternative.

Material React Table started out as an attempt to upgrade the once popular material-table library to Material UI v5 and TypeScript, since that project seemed to have become abandoned. However, after a few frustrating weeks, it was discovered that it would be easier and more fun to write a new advanced Material UI table library from scratch. React Table naturally seemed like a great basis for the underlying API and therefore was chosen as the foundation for the project.

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

✅ < 47kb 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 Mui 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 Material UI Theme)

✅ Toolbars (Add your own action buttons)

✅ Tree Data / Expanding Sub-rows

✅ Virtualization (react-virtual)

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

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.

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

Kevin Van Cott

Maintainer, Developer

Daniel Humphrey

UI/UX, Technical Writer

Ryan Kholousi

UI/UX Designer

• Material UI - 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!)