Table styles a native <table> for plain tabular content. Its children are ordinary caption, colgroup, thead, tbody, tfoot, tr, th and td elements, so a Markdown renderer can map table to Table and leave the rest alone. It has no columns or data API, sorting or selection.

#Demos

#Basic

Header cells in thead get the header style; a caption names the table above it.

#Size

#Bordered

bordered={false} drops the frame. Without a frame, bottomBordered={false} also drops the divider under the last row.

#Column dividers

singleLine is on by default and divides rows only; singleLine={false} divides the columns as well.

#Single column

singleColumn removes the dividers between body rows.

#Striped

#Alignment

A cell’s align attribute, which GFM emits for :---, :---: and ---:, and an inline text-align both win over the table’s start alignment.

#Wide tables

A table wider than its container scrolls sideways in its wrapper, a ScrollArea, instead of overflowing the page. While it overflows, the wrapper is a region named by scrollRegionLabel and a tab stop, so keyboard users can scroll it with the arrow keys. Text in body cells wraps; header cells stay on one line. Inside a flex or grid item, give that item min-width: 0, or it grows to fit the table instead of letting it scroll.

#Markdown

The elements a Markdown renderer emits for a GFM table, with table mapped to Table. Inline code, links and emphasis keep the surrounding prose styles.

#Table Props

Every other prop, className, style and ref go to the <table> element. The wrapper has the class r-table-wrapper; put spacing such as a Markdown block margin on it.

Inside it, use the native thead, tr, th and other table elements.