Skip to content
BigBang

Popular

    ↑↓Navigate↵OpenEscClose
    TR

    Components

    Table

    Shows small, read-only data in a semantic HTML table.

    Storybook
    Storybook
    Source
    Source

    Added

    • First version: Table with the Table.Header, Table.Body, Table.Footer, Table.Row, Table.HeaderCell, Table.RowHeader and Table.Cell parts; tableStyles is exported.
    • The root is a named, focusable scroll region (scrollable); caption is required and captionHidden hides it.
    • density (compact 6 px, comfortable 12 px), striped, stickyHeader, hoverable and dividers (rows, none).
    • numeric, align and truncate cell options; selected row.
    • table.* component tokens: header, row backgrounds, border and cell padding.
    • The part prop types are exported: TableHeaderProps, TableBodyProps, TableFooterProps, TableRowProps, TableHeaderCellProps, TableRowHeaderProps, TableCellProps.

    Changed

    • The header is transparent with small labels (label-sm) and a darker rule under it (table-header-border); a sticky header sits on the raised fill.
    • The minimum row height is 32, 40 and 48 px by density (table-row-height-*).