Insight cards
A React component in Beamline's Dashboard category.
Findings from an agent, one per page: the sentence, the series it is about with their change, a chart to scrub that names each point, and a follow-up question.
Use it for
- Agent-generated findings with a supporting chart and a next question.
Not for
- Plain KPIs (metric-card).
Anatomy
- header (count, previous, next)
- summary
- series legend with change
- chart (lanes, scrub guide)
- question button
States
- page
- scrubbing
Keyboard
- ← → on the chart read points
- arrows buttons page
Motion
Pages slide 16 px and fade.
Props
| Prop | Type | Default | Description |
|---|---|---|---|
pages | { id, summary, series: { label, change, amount?, points, color? }[], labels?, format?, question? }[] | — | |
index / defaultIndex / onIndexChange | number | — | |
onAsk | (question, page) => void | — | |
classNames | InsightCardsClassNames | — | |
style / ref | CSSProperties / Ref<HTMLElement> | — | Visual root styles and native root ref. |
Dependencies
lucide-react, motion
Import
import { InsightCards } from "@/components/insight-cards/insight-cards";Get it
Insight cards is part of Beamline: 190 React components and screens your coding agent (Claude Code, Codex, Cursor or any MCP client) installs into your app through Beamline's MCP server, as a ready-built package or as plain React source you can change. $49 one payment (regular $200), no subscription, a year of updates, one licence for your whole team. Get Beamline · Connect your agent
More in Dashboard
- App shell: The frame for every app screen: collapsible sidebar with grouped navigation, top bar and page.
- Bar list: Ranked horizontal bars with label inside and value at the end — top pages, sources, customers.
- Category bar: One bar split into labelled ranges with an optional marker that names its range.
- Metric card: A KPI: label, a value that rolls to each new number, the change with arrow, sign and tone, a trend line and context; unmeasured values are hatched, never…
- Tracker: A row of status blocks for uptime, job runs or daily checks, with tooltips and a legend.