For AI Agents
Hand your agent this brief or the ReUI MCP, not a screenshot. Installs with a ReUI Pro or Ultimate license.
Best for: A spending feed with colored category icons for deposits, groceries, bills, dining and interest, above View More
When to use
- A dashboard side panel of KPIs, funds, coins, investments or movers with a figure on every row
- A short wallet or crypto transaction history with a signed credit or debit amount on each row
- An integrations directory or picker with a connect or add button on every row
When not to use
- A crypto feed with an up or down arrow tile per row and no header or footer: use the Crypto Activity Feed block
- On chain transfers that show a sender or recipient address and swap legs: use the Wallet Transfers block
- Records or metrics laid out as separate tiles in a grid, one tile per record: use the Card blocks
- A single row layout of media, title and actions to compose a list of your own: use the Item component
- Headline metrics that each need an actions menu, a progress bar or a segmented gauge: use the Stats blocks
Agent notes
- Replace
transactionPeriodsin data.tsx; the tabs read only its 1W and 1Y entries, so the 1D and 1M entries are never shown - Each category tile takes its colour from
iconClassName, and atoneof #0B5C22 renders a green amount while any other value renders red - The View More
Buttonhas no click handler; point it at your full activity page - Each page.tsx centers the block in a padded
min-h-svhwrapper; drop it when the list goes into your own dashboard layout - Every root component takes no props and renders constants from its
datamodule; add props to pass in your own rows - Every
FramePanelpins its padding with an important utility, so changing the Framespacingprop leaves those insets as they are
https://web.dev.reui.io/blocks/application/list/list-7.mdget_block("list-7")npx shadcn@latest add @reui/list-7Shadcn Spending Feed Block
Wallet Transactions List with Period Tabs and Color-Coded Category Icons. Part of the ReUI Shadcn Application List blocks collection.
Transaction card with Weekly and All Time tabs; each row pairs a colored category icon with title, date, and a signed amount tinted green for credits or red for debits. ReUI Frame, shadcn Tabs, Item, Button. For wallet, banking, fintech feeds.
It is composed from Button, Frame, Item, Separator, Tabs, so every part of it is a primitive you can restyle with your own design tokens.
What You Can Build With the Spending Feed Block
- Install it with the ReUI registry command in the toolbar above, then swap the placeholder content, data wiring, and business logic for your own.
- Compare it across all eight ReUI styles and both the Base UI and Radix bases in the customizer before committing to one direction.
- Combine it with the other Shadcn Application List blocks to assemble a full screen instead of a single section.
All Shadcn Application List Blocks
The rest of this category, each on its own page with a live preview, the components it is built from, and the install command.
- Order KPI List Order Metrics List Card with Icon Tiles and Up Down Trend Badges
- Fund Leaderboard Capital inflows fund leaderboard list with logo badges and a range filter select
- Capital Inflows Capital Inflows Card with Period Tabs and Ranked Fund List Showing Amount and Share
- Crypto Portfolio Crypto Portfolio Snapshot List with Period Tabs and Per-Asset Trend Badges
- Crypto Activity Feed Crypto Transactions List with Color-Coded Credit and Debit Amounts
- Wallet Transfers Crypto transaction list card with period tabs and dual-token swap amounts
- Integrations Directory Integrations directory list with brand logos and per-row Connect buttons
- Capability Modules Manual integrations picker list with icon tiles, per-row add buttons, and Browse More footer
- Recent Investments Recent Investments Card with Searchable Gain-Loss Table and Company Logos
- Top Movers Top movers list table with company logos, status badges, and up/down trend values
Related Shadcn Application Block Categories
- App Shell (35) App shell layouts with sidebar, rail, or top bar navigation for dashboards, settings panels, and multi-page apps.
- Auth (20) Login, register, forgot password, and two-factor authentication page layouts.
- Card (43) Card components for content display, data summaries, and interactive elements.
- Dashboard (8) Dashboard components and layouts that combine stats, charts, and tables into a complete overview screen.
- Dialog (14) Dialog components for modal windows, alerts, confirmations, and content overlays.
- Empty State (14) Empty state screens and no-data placeholders with recovery actions, onboarding prompts, and contextual guidance.
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
When should I use the Spending Feed block?
Use it for a spending feed with colored category icons for deposits, groceries, bills, dining and interest, above View More.
The List category fits:
- A dashboard side panel of KPIs, funds, coins, investments or movers with a figure on every row
- A short wallet or crypto transaction history with a signed credit or debit amount on each row
- An integrations directory or picker with a connect or add button on every row
For a crypto feed with an up or down arrow tile per row and no header or footer, use the Crypto Activity Feed block. For on chain transfers that show a sender or recipient address and swap legs, use the Wallet Transfers block. For records or metrics laid out as separate tiles in a grid, one tile per record, use the Card blocks. For a single row layout of media, title and actions to compose a list of your own, use the Item component. For headline metrics that each need an actions menu, a progress bar or a segmented gauge, use the Stats blocks.
What is the Spending Feed block built with?
Can I restyle the Spending Feed block?
How should I use Shadcn list blocks in a real project?
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.