DataTable

import { DataTable } from "mizu-ui";

export function Example() {
  const rows = [
    { id: "a", name: "WaveText", size: 4.2 },
    { id: "b", name: "Button", size: 1.8 },
    { id: "c", name: "Signal", size: 3.1 },
  ];
  return (
    <DataTable
      label="Illustrative module records"
      rows={rows}
      getRowId={(r) => r.id}
      columns={[
        {
          id: "name",
          header: "Name",
          render: (r) => r.name,
          sortValue: (r) => r.name,
        },
        {
          id: "size",
          header: "Example KiB",
          render: (r) => r.size,
          sortValue: (r) => r.size,
          align: "right",
        },
      ]}
    />
  );
}