import { FXRateGrid } from "@nodus/design-system/finance"Loading demo…
Props
| Prop | Type | Default | Description |
|---|---|---|---|
ratesreq | FXRate[] | — | Array of FX rate data ({ base, quote, bid, ask, midRate?, change?, sparkData? }) |
columns | "auto" | 2 | 3 | 4 | — | Grid columns: auto (responsive) or fixed count |
precision | number | 4 | Rate precision |
breakpoints | ThresholdBreakpoints | — | Custom severity breakpoints |
density | "default" | "compact" | — | Display density |
locale | string | — | BCP 47 locale override |
ratesrequiredType
FXRate[]Default —Array of FX rate data ({ base, quote, bid, ask, midRate?, change?, sparkData? })
columnsType
"auto" | 2 | 3 | 4Default —Grid columns: auto (responsive) or fixed count
precisionType
numberDefault 4Rate precision
breakpointsType
ThresholdBreakpointsDefault —Custom severity breakpoints
densityType
"default" | "compact"Default —Display density
localeType
stringDefault —BCP 47 locale override
MobileStacks / Scroll
Rate grid activates horizontal scroll on narrow viewports. Consider showing a subset of currencies on mobile.
Design Rationale
This component was designed to express:
Explore Related
Was this helpful?