Sorting, filtering, editing, formulas, clipboard, virtual scroll. For React. MIT licensed.
Radix and Fluent UI packages share the same hooks, props, and grid concepts.
import { OGrid } from '@alaarab/ogrid-react-radix';
const columns = [
{ columnId: 'name', name: 'Name', sortable: true },
{ columnId: 'role', name: 'Role', filterable: { type: 'multiSelect' } },
{ columnId: 'salary', name: 'Salary', editable: true,
valueFormatter: (v) => `$${v.toLocaleString()}` },
];
function App() {
return (
<OGrid
columns={columns}
data={employees}
getRowId={(e) => e.id}
editable
cellSelection
statusBar
/>
);
}
Trading terminals, monitoring dashboards, and operational tables need constant updates. OGrid keeps the grid responsive while the data keeps moving.
Every package has the same API. Drop it in, configure columns, done.