For AI Agents
Hand your agent this brief or the ReUI MCP, not a screenshot. Installs with a ReUI Pro or Ultimate license.
When to use
- Admin tables whose values are typed into cells or rows, validated, then saved or discarded
- Spreadsheet work over long lists: cell ranges, paste, drag to fill and undo
- Small catalogs such as labels or pricing plans, where one record is edited and saved at a time
When not to use
- Cell editing added to a table you already build from parts in your own layout: use the Data Grid component
- Rows that are only browsed, filtered and paged, with no values changed in the cells: use the Base blocks
- A plain list reordered by drag, with no form to add or rename its items: use the Sortable component
Agent notes
- Every page.tsx renders an sr-only
h1inside a centeredmin-h-svhmain; remove that wrapper when the view sits in your own page - Rows start from a data file constant held in
useStateoruseReducer, and nothing reaches a server; call your API where each edit or save commits
Third-party API docs
- TanStack Table v9: API reference, docs, used by 5 of 6 blocks
- Sonner v2: API reference, docs, used by 5 of 6 blocks
- TanStack Virtual v3: API reference, docs, used by 1 of 6 blocks
- dnd kit v6: API reference, docs, used by 1 of 6 blocks (these are the Legacy docs; dndkit.com's default docs cover the newer @dnd-kit/react, a different API)
- React DayPicker v9: API reference, docs, used by 1 of 6 blocks
- React Hook Form v7: API reference, docs, used by 1 of 6 blocks
- React Hook Form resolvers v5: API reference, docs, used by 1 of 6 blocks
- Zod v4: API reference, docs, used by 1 of 6 blocks
Markdown
https://web.dev.reui.io/blocks/data-grid/editing.mdMCP
search({ query: "editing", type: "block", category: "editing" })Shadcn Data Grid Blocks for Inline Editing, Create and Delete
The ReUI Data Grid has a full editing API: cell selection, clipboard, drag-to-fill, built-in editors and per-row editability. These blocks show it as product screens that between them cover the editors a real dataset needs, a quick add-row, a bulk edit bar for the selection, and the delete confirmation nobody wants to write twice.
Validation runs per cell and per row, and the undo batch derives from the change payload, so a mistake is one keystroke away from gone.
All Editing Blocks
Open any block on its own page for a live preview, the components it is built from, and the install command.
- Label Manager Labels manager list with inline create and edit form, color picker, and drag-to-reorder rows
- Product Inventory Inline-editable product inventory data grid with per-cell validation and a dirty-state save bar
- Project Intake Inline-editable project intake data grid with dirty-state Save and Discard bar
- Pricing Plan Editor Pricing Plan Editor With Per-Row Edit Mode and Inline Validation
- Task Spreadsheet Spreadsheet Task Grid With Cell Range Editing, Custom Cell Controls, and Undo
- Stock Reorder Plan Spreadsheet Reorder Plan With On-Demand Column Filter Row and Summary Footer
What the Editing blocks cover
Data Grid screens, each a full block with fixture data:
- Labels manager list with inline create and edit form, color picker, and drag-to-reorder rows
- Inline-editable product inventory data grid with per-cell validation and a dirty-state save bar
- Inline-editable project intake data grid with dirty-state Save and Discard bar
- Pricing Plan Editor With Per-Row Edit Mode and Inline Validation
- Spreadsheet Task Grid With Cell Range Editing, Custom Cell Controls, and Undo
- Spreadsheet Reorder Plan With On-Demand Column Filter Row and Summary Footer
Built from
- shadcn/ui components Alert Dialog, Button, Dropdown Menu, Input, Input Group, Select, Switch, Tooltip, the same components your project already owns.
- Both twins, every style Each block ships on Base UI and on Radix, in 8 design styles, and names every part it composes on its page.
All Shadcn Block Groups
Browse the full ReUI Shadcn blocks library by product surface. Each group bundles category-level blocks you can mix and match across your project.
- Shadcn Application Blocks (303) Browse 303 Shadcn Application blocks across 23 categories.
- Shadcn Data Grid Blocks (47) Browse 47 Shadcn Data Grid blocks across 9 categories.
- Shadcn Charts Blocks (52) Browse 52 Shadcn Charts blocks across 10 categories.
- Shadcn Solutions Blocks (76) Browse 76 Shadcn Solutions blocks across 11 categories.
- Shadcn AI & Agents Blocks (22) Browse 22 Shadcn AI & Agents blocks across 3 categories.
- Shadcn eCommerce Blocks (87) Browse 87 Shadcn eCommerce blocks across 13 categories.
- Shadcn Marketing Blocks (67) Browse 67 Shadcn Marketing blocks across 8 categories.
Frequently Asked Questions
Which editors are built in?
Text, number, select, combobox, date and checkbox editors ship with the Data Grid; the blocks add domain editors such as a team combobox and a status select.
Can I lock some rows or cells?
Yes. Editability accepts a function of the row, so archived or locked rows stay read-only across typing, paste, fill and clear.
How do I install an Editing block?
Open the block on its page, copy the install command (the shadcn CLI with the @reui registry and your license key) or the AI prompt, and run it in your project. The block, its fixtures and every ReUI and shadcn dependency land in one command.
Is a license needed?
Editing blocks are part of ReUI Pro: one payment, lifetime updates, every block in every style. The ReUI primitives and the free examples they build on install with no license.
Start building with ReUI Pro today.
Every Pro block, every style, and every future addition, with one license for unlimited projects.
Get All-Access
From $249, once. Lifetime updates.