Data table

Sortable rows over the plain table. aria-sort on headers.


Strategy	2
Identity	4
Digital	6

Install

npx raster add data-table

Markup

<table class="rs-table"><thead><tr><th><button class="rs-datatable-sort">Phase</button></th><th>Weeks</th></tr></thead><tbody><tr><td>Identity</td><td>4</td></tr><tr><td>Strategy</td><td>2</td></tr></tbody></table>

React

import { DataTable } from "@/components/raster/data-table";

<DataTable
  columns={[
    { key: "phase", header: "Phase", sortable: true },
    { key: "weeks", header: "Weeks", sortable: true },
  ]}
  rows={rows}
/>

Classes

.rs-datatable-sort.rs-datatable-empty

Depends on

/table