- Simple - All of these examples use automatic state management, meaning, they don't hoist any state out of the table or manually control anything. Start here for understanding the basics about how to build your table UI.
- Basic
- Footers
- Sorting
- Filtering
- Grouping
- Grouping (Single Column)
- Pagination
- Row Selection
- Expanding
- Sub Components
- Editable Data
- Column Ordering
- Column Hiding
- Column Resizing
- Data-Driven Classes and Styles
- Row DnD
- Full Width Table (Table Elements with collapsible content)
- Full Width Resizable Table (via
useFlexLayout
)
- Complex
- The "Kitchen Sink"
- Controlled - These examples are more advanced because they demonstrate how to manually control and respond to the state of the table.
- Pagination (Controlled)
- UI & Rendering - These examples demonstrate how to use React Table with your favorite UI libraries or tools!
- Virtualized Rows (React-Window)
- Animated (Framer-Motion)
- Material-UI
- Material-UI Enhanced Table
- Styled-Components
- CSS
- Bootstrap
- Want to write one of these examples or add another? Submit a PR!