Table · @behivetech · Behive Tech Registry

Edit the code and the preview updates as you type. Every registry export is in scope — Table from this package, plus React hooks and every other component in the registry.

Playground

interface Invoice {
  id: string;
  customer: string;
  amount: number;
  status: "paid" | "overdue";
}

const invoices: Invoice[] = [
  { id: "inv-1", customer: "Acme Co", amount: 240, status: "paid" },
  { id: "inv-2", customer: "Globex", amount: 90, status: "overdue" },
  { id: "inv-3", customer: "Initech", amount: 512, status: "paid" },
];

const basicColumns: TableColumn<Invoice>[] = [
  { key: "customer", title: "Customer", dataIndex: "customer" },
  { key: "amount", title: "Amount", dataIndex: "amount" },
];

const BasicTable = () => (
  <Table columns={basicColumns} data={invoices} rowKey={(row) => row.id} />
);

render(<BasicTable />);