1. What does the component do?
- Structured display of data within a table.
2. When should the component be used?
- It is used for displaying data, not for structuring content.
- Tables should be structured so that they grow vertically (lines) when data sets are added.
- Table cells may contain just information (e.g. text, person, status display, icon) or interaction elements (e.g. text field, select, button).
- Various actions can be positioned per line (e.g. buttons, icon buttons, links).
- Every column must have a header (text or icon).
- Headers can be single or multi-line.
- Header and line content may be left-aligned, right-aligned or centred within the table cell: Text left-aligned, icons centred, numbers right-aligned
- Units of measurement in content are ideally entered on the second line of the column header. Alternatively, they can appear directly next to the column header name in round brackets.
- Horizontal scrolling should be avoided as far as possible.
- When hovering over lines, actions can be provided in the elements using icons.
- Columns can be put into logical groups. There is no dividing line between grouped columns.
4. Variants and statuses
The component has the following statuses:
This variant has the following statuses: