Payments and checkout

Let people catch the extra zero before money moves.

Add amount readbacks, duplicate-submit protection and recipient checks to the moments where a small form mistake is expensive.

A small safety layer for one real flow.

Amount Input
Flags an amount that is far from the expected value and spells it out.
View component
Duplicate Payment Guard
Stops a second payment submission while the first one is still in flight.
View component
Payee Check
Makes the recipient visible before a transfer is confirmed.
View component

One command for this flow

Start with the related components, then edit the copied source in your own product.

$ npx shadcn@latest add @bollard/fintech-pack

Add the Bollard namespace once

Merge this into your project's components.json. Then every Bollard install can use the short command.

{
  "registries": {
    "@bollard": "https://bollard-ui.vercel.app/r/{name}.json"
  }
}