Skip to main content

Simple tables

The most basic usage of ListTable creates a standard table from nested lists.

Basic table with headers

Employee directory
NameDepartmentLocation
Alice JohnsonEngineeringSan Francisco
Bob SmithDesignNew York
Carol WhiteMarketingAustin

MDX source

<ListTable headerRows={1} caption="Employee directory">
- - Name
- Department
- Location
- - Alice Johnson
- Engineering
- San Francisco
- - Bob Smith
- Design
- New York
- - Carol White
- Marketing
- Austin
</ListTable>
Monthly sales
MonthRevenueExpenses
January$10,000$7,000
February$12,000$8,000
March$11,000$7,500
Total$33,000$22,500

MDX source

<ListTable headerRows={1} footerRows={1} caption="Monthly sales">
- - Month
- Revenue
- Expenses
- - January
- $10,000
- $7,000
- - February
- $12,000
- $8,000
- - March
- $11,000
- $7,500
- - Total
- $33,000
- $22,500
</ListTable>

No headers

Tables don't need to have headers:

Simple data
A1B1C1
A2B2C2
A3B3C3

MDX source

<ListTable caption="Simple data">
- - A1
- B1
- C1
- - A2
- B2
- C2
- - A3
- B3
- C3
</ListTable>