<Table columns={[
{ key: "id", title: "ID", dataKey: "id" },
{ key: "region", title: "Region", dataKey: "region" },
{ key: "cpu", title: "CPU", dataKey: "cpu", render: (v) => v + "%" },
]} data={[
{ id: "svc_001", region: "us-east-1", cpu: 42 },
{ id: "svc_002", region: "eu-central-1", cpu: 73 },
{ id: "svc_003", region: "ap-south-1", cpu: 18 },
]} rowKey={"id"} />Table<T extends object>
src/components/data-display.tsx
Import
import { Table } from "@ossrandom/design-system";Examples
API
extends BaseProps
| Prop | Type |
|---|---|
columns required |
readonly TableColumn<T>[] |
data required |
readonly T[] |
rowKey required |
keyof T | ((row: T) => string | number); readonly density?: Density; readonly bordered?: boolean; readonly striped?: boolean; readonly stickyHeader?: boolean; readonly loading?: boolean; readonly empty?: ReactNode; readonly selection?: "none" | "single" | "multi"; readonly selectedKeys?: readonly (string | number)[]; readonly onSelectionChange?: (keys: readonly (string | number)[]) => void; readonly onSort?: (key: string, dir: "asc" | "desc") => void; readonly onRowClick?: (row: T, index: number) => void; |