Data Table
Powerful table and datagrids built using TanStack Table. This follows the official shadcn/ui data table guide.
Basic Table
A simple table displaying data with basic styling.
| Invoice | Status | Method | Amount |
|---|---|---|---|
| INV001 | Paid | Credit Card | $250.00 |
| INV002 | Pending | PayPal | $150.00 |
| INV003 | Unpaid | Bank Transfer | $350.00 |
| INV004 | Paid | Credit Card | $450.00 |
| INV005 | Paid | PayPal | $550.00 |
Sortable Table
A table with sortable columns for better data organization.
| Status | ||
|---|---|---|
success | $316.00 | |
success | $242.00 | |
processing | $837.00 | |
success | $874.00 | |
failed | $721.00 |
Filterable Table
A table with filtering capabilities to search through data.
| Name | Status | |
|---|---|---|
| John Doe | [email protected] | Active |
| Jane Smith | [email protected] | Inactive |
| Bob Johnson | [email protected] | Active |
| Alice Brown | [email protected] | Pending |
Paginated Table
A table with pagination for handling large datasets.
| Name | Role | |
|---|---|---|
| User 1 | [email protected] | Admin |
| User 2 | [email protected] | User |
| User 3 | [email protected] | Editor |
Showing 1 to 3 of 10 entries
Page 1 of 4
Row Selection
A table with selectable rows for bulk operations.
| Task | Status | Priority | |
|---|---|---|---|
| Task 1 | Completed | High | |
| Task 2 | In Progress | Medium | |
| Task 3 | Pending | Low | |
| Task 4 | Completed | High |
Column Visibility
A table with toggleable column visibility controls.
| Name | Department | Salary | |
|---|---|---|---|
| John Doe | [email protected] | Engineering | $75,000 |
| Jane Smith | [email protected] | Marketing | $65,000 |
| Bob Johnson | [email protected] | Sales | $70,000 |
Complete Example
A comprehensive table with all features combined.
Select | Actions | |||||
|---|---|---|---|---|---|---|
| John Doe | [email protected] | Admin | active | 5/1/2023 | ||
| Jane Smith | [email protected] | User | active | 5/2/2023 | ||
| Robert Johnson | [email protected] | Editor | inactive | 4/15/2023 | ||
| Emily Davis | [email protected] | User | active | 5/3/2023 | ||
| Michael Wilson | [email protected] | User | pending | 4/28/2023 |
Page 1 of 3
Showing 5 of 12 results