@get-asset/react
AssetExpensesCard
Drop-in styled card for the period's expenses and the change versus the prior period. A decrease reads as a positive tone; an increase as negative. Period defaults to the AssetProvider's year/month.
Built on the headless ExpensesCard compound from @get-asset/sdk.
Preview
Expenses
$78,000.00
9%
from prior period
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. |
month | number | null | — | Month (1-12). When set the card shows that month vs. the previous month; null explicitly forces a whole-year range. Falls back to the AssetProvider's month (default: no month). |
expenses | number | — | Override fetched expenses. Skips the API call. |
previousExpenses | number | — | Override fetched prior-period expenses. |
state | "loading" | "error" | — | Force a specific state for testing. |
locked | boolean | — | Gate the report for a viewer who isn't entitled to it. Activates the SDK's Locked state: the metric renders blurred and inert as a teaser behind a lock and the upgrade CTA. No live fetch runs while locked — the teaser shows built-in placeholder data (an `expenses` 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. |
States
Loading
Expenses
from prior period
SuccessYear-over-year decrease (positive tone).
Expenses
$78,000.00
9%
from prior period
Error
Expenses
We couldn't load your Expenses. Refresh the page or click try again.
LockedViewer isn't entitled to the report — a built-in placeholder teaser renders blurred behind the upgrade prompt. Pass `upsell` to customize the copy and wire `onUpgrade`.