OddApp Design

DataGrid

@oddapp/ui · Tier 2

Sortable, filterable table with virtual scrolling for large data sets. (Aspirational — not yet exported by @oddapp/ui.)

Default

DataGrid — preview renders in browser when component is exported from @oddapp/ui
import { DataGrid } from '@oddapp/ui'

const columns = [
  { key: 'name', header: 'Name', sortable: true },
  { key: 'status', header: 'Status' },
  { key: 'amount', header: 'Amount', align: 'right' },
]

<DataGrid columns={columns} rows={rows} onSort={(col, dir) => setSort({ col, dir })} />