MRT logoMantine React Table

On This Page

    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

    OSS that Makes Mantine React Table Possible

    FAQs

    You can help make these docs better! PRs are Welcome
    Using Material-UI instead of Mantine?
    Check out Material React Table