Skip to content
Qirava lowercase logo

Quill docs

Table

A semantic native table with sortable headers and optional selection support in the headless layer.

Preview#

This preview is server-rendered from the real qquill-design builder; the page ships the component CSS that builder returns, so the docs cannot drift from the crate API.

Recent tenants
TenantStatusCapacity
acmeactive2 thr / 4 GB
northwindpending4 thr / 8 GB

Design-system contract#

  • BUILT: renders real `<table>`, `<caption>`, `<thead>`, and `<tbody>` markup.
  • BUILT: sortable headers and selection semantics are modelled in qquill-ui without invalid native-table ARIA.
  • Use Table for data grids where native table semantics are enough; only build role=grid when keyboard grid behavior is truly needed.

Code#

Construct the component with its builder:

Table::new(3, 2)
    .caption(text("Recent tenants"))
    .header(HeaderCell::sortable(text("Tenant")))
    .row(vec![text("acme"), text("active"), text("2 thr / 4 GB")])
    .render()