Components
Bothsrc/components/payment-dialog.tsx

Payment Dialog

The in-app payment sheet for a transactional charge: a known amount due now (an outstanding balance, a late-cancel fee). Built on the same picker as /checkout (shared payment-fields). Two things checkout doesn’t have: a card on file (the default; Use a different card reveals the same fields), and a result step, where the charge resolves onto a success or error screen, not a snackbar. Click to open; the demo charge succeeds unless noted.

Pay an outstanding balance: itemized, card on file

No card on file: collect a card (a Klarna enrollee)

Result step: a declined charge

A single flat charge: no line items, one ‘Amount due’ row

A longer ledger: the list scrolls, the sheet keeps its height