Row actions column
View sourceA pinned-right action column auto-injected by <BcEditGrid> and <BcServerGrid>. Edit / Delete / Discard ship by default; per-row gating via canEdit / canDelete keeps the chrome consistent without fragile cellRenderer code.
Hover any row to reveal the auto-injected action column on the right.No action yet
Try this
The action column lives at the right edge — pinned, auto-injected, no consumer wiring.
- Hover any row — the action chrome reveals on the right.
- Click Edit — fires
onEdit(row); the demo logs to the bar. - Click Delete — fires
onDelete(row)and removes the row from local state. - The Delete button is greyed-out for active orders — that's
canDelete(row)in action. - Hover a row, then press Shift+E to invoke Edit, Shift+Delete for Delete — built-in keyboard shortcuts.
Why an injected column
Pre-bc-grid wrappers in bsncraft hand-rolled the same actions column over and over per grid — ~40 LOC each, all subtly different. Lifting it to the grid solves three problems at once: consistent visual + keyboard chrome across all grids, server-grid parity (the column ships on <BcServerGrid> too), and per-row gating colocated with the row data.
Available props
- onEdit / onDelete. Required (one or both) to mount the column. Each receives the row.
- canEdit / canDelete. Per-row gates returning boolean. Disabled buttons render but don't fire the handler.
- editLabel / deleteLabel. Custom button labels. Defaults "Edit" / "Delete".
- onDiscardRowEdits. Adds a Discard action that rolls back pending row edits — typically
(rowId) => apiRef.current?.discardRowEdits(rowId). - onInsertRow / onDuplicateRow.
<BcEditGrid>specific. Wires up insert + duplicate row affordances in the toolbar / context menu.
Keyboard shortcuts
- Shift+E — invoke Edit on the focused row
- Shift+Delete or Shift+Backspace — invoke Delete on the focused row