Table

Free

Enhanced table component with multiple variants, sorting, selection, and responsive behavior. Perfect for displaying structured data with modern styling and interactions.

Installation

Install via CLI

moonui add table

Usage

A list of your recent invoices.
Invoice
Status
Method
Amount
INV001PaidCredit Card$250.00
INV002PendingPayPal$150.00
INV003UnpaidBank Transfer$350.00
INV004PaidCredit Card$450.00
INV005PaidPayPal$550.00

Examples

Basic Table

Simple table with header, body and caption

A list of your recent invoices.
Invoice
Status
Method
Amount
INV001PaidCredit Card$250.00
INV002PendingPayPal$150.00
INV003UnpaidBank Transfer$350.00
INV004PaidCredit Card$450.00
INV005PaidPayPal$550.00

With Status Badges

Table with status badges for visual indicators

Name
Email
Status
Role
John Doejohn@example.com
Active
Admin
Jane Smithjane@example.com
Active
User
Bob Johnsonbob@example.com
Inactive
User
Alice Brownalice@example.com
Active
Editor
Charlie Wilsoncharlie@example.com
Pending
User

With Actions

Table with action dropdown menus

Name
Email
Role
Actions
John Doejohn@example.comAdmin
Jane Smithjane@example.comUser
Bob Johnsonbob@example.comUser

Sortable Table

Click column headers to sort

Name
Email
Status
Role
John Doejohn@example.com
Active
Admin
Jane Smithjane@example.com
Active
User
Bob Johnsonbob@example.com
Inactive
User
Alice Brownalice@example.com
Active
Editor
Charlie Wilsoncharlie@example.com
Pending
User

Selectable Rows

Table with checkbox selection

Name
Email
Status
Role
John Doejohn@example.com
Active
Admin
Jane Smithjane@example.com
Active
User
Bob Johnsonbob@example.com
Inactive
User
Alice Brownalice@example.com
Active
Editor
Charlie Wilsoncharlie@example.com
Pending
User

Responsive Table

Horizontal scroll on smaller screens

Name
Email
Status
Role
Department
Location
Actions
John Doejohn@example.com
Active
AdminEngineeringSan Francisco
Jane Smithjane@example.com
Active
UserEngineeringSan Francisco
Bob Johnsonbob@example.com
Inactive
UserEngineeringSan Francisco
Alice Brownalice@example.com
Active
EditorEngineeringSan Francisco
Charlie Wilsoncharlie@example.com
Pending
UserEngineeringSan Francisco