Table | Mineral UI

Selectable Rows

Allow users to select rows with the selectable prop. Rows with a disabled property set to true will render a disabled checkbox. You can set the initially selected rows with the defaultSelectedRows prop. onToggleRow and onToggleAllRows callbacks are also available.

Foods of the World
Deselect all rows	Fruits	Vegetables	Grains	Dairy	Protein
Select row	Pomello	Bok Choi	Chia	Pule	Crickets
Deselect row	Starfruit	Romanesco	Sorghum	Casu marzu	Barnacles
Select row	Durian	Ramps	Teff	Vieux Lille	Inca nuts

() => {
  const data = [
    sharedData[0],
    sharedData[1],
    { ...sharedData[2], disabled: true }
  ];

  return (
    <Table
      selectable
      defaultSelectedRows={[data[1]]}
      data={data}
      rowKey="Fruits"
      title="Foods of the World"
      hideTitle />
  );
}