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
- Reporting tables whose rows carry in-cell bars, sparklines or heat cells beside the figures
- Performance reviews that weigh each record against a target, a plan or a prior period
- Review queues and record lists with create, edit, delete and undo, each row opening a tabbed sheet
When not to use
- A rule builder on its own, to narrow a list or table you already have: use the Filters component
- A plain sortable table of text cells, assembled from parts in your own layout: use the Data Grid component
- Values typed into the cells themselves, with validation and a save or discard bar: use the Editing blocks
Agent notes
- Rows live in a client store hook whose
create,updateandremovechange only browser state; back them with your API - Search, filters and sort run in the browser over every row before
useTablesees them; move that query to your API at scale - Each page.tsx wraps the block in a
min-h-svhmain with padding, amax-w-7xlwidth and an sr-onlyh1; drop that wrapper inside an app shell
Third-party API docs
- TanStack Table v9: API reference, docs, used by 8 of 8 blocks
- Sonner v2: API reference, docs, used by 8 of 8 blocks
- Recharts v3: API reference, docs, used by 3 of 8 blocks
- React DayPicker v9: API reference, docs, used by 3 of 8 blocks
- Motion v12: API reference, docs, used by 1 of 8 blocks (the docs follow the latest Motion, with no React API break since v12)
- Shiki v4: API reference, docs, used by 1 of 8 blocks
https://web.dev.reui.io/blocks/data-grid/advanced.mdsearch({ query: "advanced", type: "block", category: "advanced" })Shadcn Data Grid Blocks with In-Cell Charts and KPI Rollups
A report stops being readable when every column is a bare number. The campaign grid draws the shape beside the value: a 30-day conversions sparkline whose end dot marks today, a ROAS bullet bar with a tick at each campaign's target on one shared axis, and a new buyer share bar. Every chart column still sorts, and a campaign with no prior period sorts below every decline.
Above the grid a KPI band rolls up the rows in view, so spend, CPA, ROAS and the count below target follow the search and the ReUI Filters builder. Create, edit, pause, duplicate and delete each come with an Undo that restores only the rows it touched, and a floating Sheet opens a campaign in Overview, Performance and Audience tabs.
A store P&L reads by place before it reads by row. The store grid turns its flat list into a tree of Global, market, sub-region and state, each place rolling up net sales, profit and plan attainment, with a depth control that opens it to markets, sub-regions or every store. Region cards filter the rows, a Profit vs FY25 header spans loss and gain bars, and a floating Sheet steps through stores across 3 tabs.
A target review reads in the gap, not the total. The campaign target grid sets each ROAS and CPA actual beside its target and a vs Target bar that fills one half for a miss and the other for a beat, 0 on the line between. Rows merge into channel bands, a filter row under the headers gives each column a text field, a select or a Slider range, and a floating Sheet steps through campaigns with J and K across 5 tabs.
SLO budgets only compare at one yardstick. The SLO grid lists 18 SLOs with 90 day trend cells beside a lollipop chart of budget left, worst first, and a Measure at select and a window toggle can hold them all to one objective and window, re-measuring the grid, the chart and the Exhausted, At Risk and Healthy tabs together. Hovering a stem lights its row, and a floating Sheet opens an SLO in Overview, Burn Rate, Events and Settings tabs.
An onboarding decision waits on every store, not just the account. The wholesale review grid lists 24 retailer applications, and an account with several doors opens into door rows aligned to the grid's columns, each with its own ship date, 4 onboarding checks and readiness, closed by a rollup row. Decision, terms and each check change from a menu in the cell, credit limits are typed into the cell, and 4 queue tiles narrow the list to applications in review, shipping soon, short on credit or blocked. Bulk approve and hold, a CSV export with a line per door and a floating Sheet with Overview, Doors, Checks and Activity tabs complete the review.
A stock plan reads across its categories, not down a list. The stock mix grid sets 8 product categories as columns between a pinned parameter column and a pinned Total, with 8 rows from target over actual share, supplier and tolerance down to case cost, value and the suggested order, all read against the Winter, Spring, Summer or Autumn plan. Cells copy, paste and fill across a selected range, a value outside its row's range or on a held category is refused, and every write, from one cell to a submitted set of orders, carries an Undo. Stage Orders queues every suggested order in one press, Submit Orders stays off until the targets sum to 100% and the staged orders fit the week's budget, and a floating Sheet opens a category in Overview, Cost Log and History tabs.
A rental deal stands or falls on each year's bottom line, not on the rent roll. The pro forma grid rolls a fourplex's rent, vacancy, 2 income lines and 6 expense lines up to Gross Income, Total Expenses, NOI, Net Cash Flow and Total Return, each section folding its lines under its subtotal, over a 5, 10, 15 or 20 year horizon with a Total ROI footer pinned to the bottom. Blue figures are the inputs, edited with a click or a pasted range, and the price, down payment, closing costs, rate and loan term above the grid re-run debt service, equity accrued and every return. A row menu adds, edits, duplicates, resets and removes lines, a plus on a section row adds one in place, and a floating Sheet sets a line's name, basis and amount.
A service plan breaks on the day nobody booked, not on the visits that went to plan. The planner sets 18 restaurant kitchens against a 21 day matrix where each day shows a visit as Missed, Awaiting, Confirmed or Done, or an Unbooked marker where a service's cycle comes due within 28 days with nothing booked, and a Coverage column sorts the riskiest kitchens first. A day opens a Popover with the crew, vendor call and email links and the steps its status allows (confirm, reschedule on a Calendar, sign off with a report number), and Book All books every unbooked day in the window with the least loaded certified technician. A floating Sheet holds each kitchen's Plan and History tabs with a CSV of its signed-off visits, and every write carries an Undo.
All Advanced Blocks
Open any block on its own page for a live preview, the components it is built from, and the install command.
- Ad Campaign Performance Campaign performance grid with in-cell sparklines, ROAS bullet charts and new buyer share bars
- Regional Store P&L Store P&L grid with a geography tree, plan attainment bars and profit vs FY25 loss and gain cells
- Campaign Target Review Campaign target grid with diverging ROAS and CPA bars, channel-grouped rows and a column filter row
- SLO Reliability Index SLO error budget grid and linked lollipop chart with a shared objective and window override
- Wholesale Onboarding Wholesale application review grid with quick-update cells and expandable door rows
- Stock Mix Retail Stock Mix Sheet With Categories as Columns, Pinned Totals and Range Editing
- Fourplex Pro Forma Rental Property Pro Forma Grid With Section Subtotals, Pinned Returns and Line Editing
- Service Visit Planner Kitchen service visit planner with a three week day matrix and unbooked due markers
What the Advanced blocks cover
Data Grid screens, each a full block with fixture data:
- Campaign performance grid with in-cell sparklines, ROAS bullet charts and new buyer share bars
- Store P&L grid with a geography tree, plan attainment bars and profit vs FY25 loss and gain cells
- Campaign target grid with diverging ROAS and CPA bars, channel-grouped rows and a column filter row
- SLO error budget grid with 90 day trend cells, a linked lollipop chart and a shared objective and window override
- Wholesale application review grid with quick-update cells and expandable door rows
- Stock mix grid with categories as columns between pinned parameter and total columns, target over actual shares and range paste and fill
- Rental pro forma grid with section subtotals, a pinned Total ROI footer and a 5 to 20 year horizon
- Kitchen service planner with a 21 day visit matrix, unbooked due markers and a coverage column
Built from
- shadcn/ui components Chart, Sheet, Tabs, Slider, Toggle Group, Alert Dialog, Popover, Calendar, Dropdown Menu, 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
Do in-cell charts slow the grid down?
Does the KPI band follow the filters?
Can I undo an edit or a delete?
Can I compare SLOs that have different objectives?
Can one account hold several stores?
How do paste and fill work in the stock mix and pro forma grids?
How do I install an Advanced block?
Is a license needed?
Start building with ReUI Pro today.
Every Pro block, every style, and every future addition, with one license for unlimited projects.
From $249, once. Lifetime updates.