Component Examples
Table Component
A responsive table component.
Basic Table
| 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 |
| INV006 | Pending | Bank Transfer | $200.00 |
| INV007 | Unpaid | Credit Card | $300.00 |
| Total | $2,500.00 | ||
Table with Badges
| 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 |
| INV006 | Pending | Bank Transfer | $200.00 |
| INV007 | Unpaid | Credit Card | $300.00 |
Table with Actions
| Name | Role | Status | Joined | Actions | |
|---|---|---|---|---|---|
| John Doe | john@example.com | Admin | Active | Jan 15, 2024 | |
| Jane Smith | jane@example.com | User | Active | Feb 20, 2024 | |
| Bob Johnson | bob@example.com | User | Inactive | Mar 10, 2024 | |
| Alice Brown | alice@example.com | Moderator | Active | Apr 5, 2024 |
Striped Table
| Product | Category | Price | Stock |
|---|---|---|---|
| Laptop | Electronics | $999 | 15 |
| Coffee Maker | Appliances | $79 | 32 |
| Desk Chair | Furniture | $249 | 8 |
| Notebook | Stationery | $5 | 150 |
| Water Bottle | Accessories | $19 | 45 |
Compact Table
| Task | Priority | Due Date |
|---|---|---|
| Complete project proposal | High | Tomorrow |
| Review code changes | Medium | Today |
| Update documentation | Low | Next week |
| Fix reported bugs | High | Today |