@get-asset/react
AssetCashflowSummaryCard
Styled card showing twelve months of cash in (green, upward) and cash out (purple, downward) for a fiscal year, diverging from a central $0 axis, with the monthly net cashflowdrawn as a line on top (green where positive, purple where negative). The header surfaces the year's net cashflow, money in and money out totals. Pass insights(shown in the preview) to render the AI insights panel to the left of the chart — it answers the listed questions from the cash-flow insights endpoint automatically, and an “Ask something else” input lets people type their own question for the same structured answer. The chart always shows 12 months — the AssetProvider's month is ignored.
Built on the headless CashflowSummaryCard compound from @get-asset/sdk.
Preview
Cashflow Summary
Required scopes
The access token used by AssetProvider must include this scope for this primitive to fetch data successfully:
report:read
API reference
Root props
| Prop | Type | Default | Description |
|---|---|---|---|
year | number | — | Fiscal year to report on. Falls back to the AssetProvider's year. The chart always shows 12 months for the year (the provider's month is ignored). |
months | CashflowSummaryMonthOverride[] | — | Override fetched data. Each entry: { month, moneyIn, moneyOut } (moneyOut positive). Skips the API call. |
scale | number | — | Override the +/- bound for the bar chart scale. |
state | "loading" | "error" | "empty" | — | Force a specific state for testing. |
insights | boolean | { questions?, ask? } | — | Show the AI insights panel to the left of the chart. Pass `true` and it fetches answers from the cash-flow insights endpoint automatically for the year on screen. Alongside the starter questions, an “Ask something else” input lets people type their own — it runs through the same endpoint and returns the same structured answer. Optionally override the starter `questions`, or inject `ask` to mock answers in docs / tests (this preview uses it). |
locked | boolean | — | Gate the report for a viewer who isn't entitled to it. Activates the SDK's Locked state: the metrics and chart render blurred and inert as a teaser behind a lock and the upgrade CTA; the insights panel is omitted. No live fetch runs while locked — the teaser shows built-in placeholder data (a `months` override still wins). |
upsell | { title?, description?, ctaLabel?, onUpgrade? } | — | Customize the locked state's copy and action. `ctaLabel` and `onUpgrade` are the tenant's upgrade wording and handler; `title` / `description` default per report. |
className | string | — | Forwarded to the outer card element. |