KB-116 · EXCHANGE/PANEL
Exchange Panel
Two units, one clean swap — the edited side is live, the computed side carry-rolls after a debounce, and swapping keeps focus while contents trade places.
KB-116 · EXCHANGE/PANEL
To amount
1.82751.8275
RATE1 USD ≈ 0.917431 EUR
FEE (0.40%)0.00730.0073
Type either side · swap mid-edit
Install
One command — the source lands in your repo. Or copy it from the Code tab.
$ pnpm dlx shadcn@latest add @kinetiq/exchange-panel
Props
- units
- ExchangeUnit[] | ExchangeGroup[]
- default —
- Linear factors to a shared base unit; groups render a grouped select.
- feeRate
- number
- default 0
- Fraction applied to the converted side, shown as a fee row.
- onChange / onDirectionChange
- (state) => void / (from, to) => void
- default —
- Conversion updates and swap events.
- debounceMs
- number
- default 200
- Delay before the computed side rolls.
| Prop | Type | Default | Description |
|---|---|---|---|
| units | ExchangeUnit[] | ExchangeGroup[] | — | Linear factors to a shared base unit; groups render a grouped select. |
| feeRate | number | 0 | Fraction applied to the converted side, shown as a fee row. |
| onChange / onDirectionChange | (state) => void / (from, to) => void | — | Conversion updates and swap events. |
| debounceMs | number | 200 | Delay before the computed side rolls. |