Complex merged cells

Complex header structure

You can have multiple headers and merge cells across both columns and rows.

Sales performance matrix

Region	2024 Sales Data
	Q1		Q2		Q3
	Products	Services	Products	Services	Products	Services
North	$50k	$30k	$55k	$35k	$60k	$40k
South	$45k	$25k	$50k	$30k	$55k	$35k
East	$60k	$35k	$65k	$40k	$70k	$45k
West	$55k	$40k	$60k	$45k	$65k	$50k

MDX source

<ListTable headerRows={3} headerColumns={1} caption="Sales performance matrix" validation="strict">
- - [r3] Region
  - [c6] 2024 Sales Data
  - _
  - _
  - _
  - _
  - _
- - _
  - [c2] Q1
  - _
  - [c2] Q2
  - _
  - [c2] Q3
  - _
- - _
  - Products
  - Services
  - Products
  - Services
  - Products
  - Services
- - North
  - $50k
  - $30k
  - $55k
  - $35k
  - $60k
  - $40k
...
</ListTable>

Large merged cell

Combine rowspan and colspan with [r2c3] syntax for cells that span both dimensions.

Project status dashboard

PROJECT ALPHA		Status	Progress
		Active	75%
Phase	Task	Owner	Due Date
Development	Backend API	Alice	2024-02-15
Development	Frontend UI	Bob	2024-02-20
Testing	QA Testing	Carol	2024-02-25

MDX source

<ListTable headerRows={3} caption="Project status dashboard">
- - [r2c2] PROJECT ALPHA
  - _
  - Status
  - Progress
- - _
  - _
  - Active
  - 75%
...
</ListTable>

Mixed patterns

Complex scheduling table

Day	Morning		Afternoon
	Room A	Room B	Room A	Room B
Monday	Meeting	Workshop	Training	Review
	Presentation		Planning	Demo
Tuesday	Team Building		Conference
Wednesday	Review	Meeting	All-Hands
Thursday	Planning	Demo

MDX source

<ListTable headerRows={2} caption="Complex scheduling table">
- - [r2] Day
  - [c2] Morning
  - _
  - [c2] Afternoon
  - _
- - _
  - Room A
  - Room B
  - Room A
  - Room B
- - [r2] Monday
  - Meeting
  - [r2] Workshop
  - Training
  - Review
- - _
  - Presentation
  - _
  - Planning
  - Demo
- - Tuesday
  - [c2] Team Building
  - _
  - [c2] Conference
  - _
- - Wednesday
  - Review
  - Meeting
  - [r2c2] All-Hands
  - _
- - Thursday
  - Planning
  - Demo
  - _
  - _
</ListTable>

Notice how placeholders (_) are used:

• For cells occupied by rowspans from above
• For cells occupied by colspans from the left

The component automatically handles the cell positioning