SpreadIndicator
Bid-ask spread display with basis point calculation and severity coloring
import { SpreadIndicator } from "@danagraph/design-system/finance"Loading demo…
Props
| Prop | Type | Default | Description |
|---|---|---|---|
bidreq | number | — | Bid price |
askreq | number | — | Ask price |
pair | string | — | Currency pair for context (e.g. EUR/USD) |
precision | number | 4 | Rate precision for bid/ask display |
breakpoints | ThresholdBreakpoints | — | Custom breakpoints for spread severity (in bps) |
density | "default" | "compact" | — | Display density |
locale | string | — | BCP 47 locale override |
bidrequiredType
numberDefault —Bid price
askrequiredType
numberDefault —Ask price
pairType
stringDefault —Currency pair for context (e.g. EUR/USD)
precisionType
numberDefault 4Rate precision for bid/ask display
breakpointsType
ThresholdBreakpointsDefault —Custom breakpoints for spread severity (in bps)
densityType
"default" | "compact"Default —Display density
localeType
stringDefault —BCP 47 locale override
MobileWorks As-Is
Design Rationale
This component was designed to express:
Explore Related
Was this helpful?