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 USD0.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

PropTypeDefaultDescription
unitsExchangeUnit[] | ExchangeGroup[]Linear factors to a shared base unit; groups render a grouped select.
feeRatenumber0Fraction applied to the converted side, shown as a fee row.
onChange / onDirectionChange(state) => void / (from, to) => voidConversion updates and swap events.
debounceMsnumber200Delay before the computed side rolls.