Cards

Payment recovery panel

Review a failed invoice and choose a saved payment method before retrying the sample payment.

Payment recovery panel

Review a failed invoice and choose a saved payment method before retrying the sample payment.

Payment needs attention

Invoice INV-1098

Amount due

$842.40

The original payment method was declined. Choose a saved method to retry.

Payment method

Attempts1

Use the bank account to complete this local recovery example.

Using Payment recovery panel

Review a failed invoice and choose a saved payment method before retrying the sample payment.

Review a failed invoice and choose a saved payment method before retrying the sample payment. For controlled React use, pass value and onChange; onAction receives the action and resulting state. Use defaultValue for a local draft.

The sample Visa fails again. Choose the bank account and retry to mark the invoice paid. This example only updates local draft state.

Amounts and decisions are illustrative local data. No charge, subscription change, or financial transaction is sent; the host must validate prices and persist the result.

Props: accent, status

How does the application receive changes?

For controlled React use, pass value and onChange; onAction receives the action and resulting state. Use defaultValue for a local draft.

Which frameworks are available?

The catalog lists these versions: react, vue, svelte, astro, html. The live preview on this page runs React.

How do I access the implementation?

Source, ports, install and the props panel are included with Fieldbook Pro. The live preview is open to everyone.

Connect your agent

Nearby

1762Anchored site previewCardsA hover preview whose side, alignment and offset can be dialled in, with a pointing arrow that tracks the anchor and flips with it when there is no room.

1841Bevel Edge Panel CardCardsA card with a one-pixel inner bevel that makes it look pressed into the page, and a frame mode that groups stacked sub-panels.

1844Bouncing Photo FanCardsA row of overlapping square photo tiles that pop in with an elastic overshoot, then shove each other aside when one is hovered.

1845Brushed Metal PassCardsAn access-pass card whose brushed metal face carries a specular band that swings with the pointer, over a rippled noise surface and a fine grain.

1846Card Shuffle StackCardsA fanned stack of panels that cycles on a timer: the front panel drops away, the rest step forward, and the dropped one swings in at the back.

2856Credit balance ledgerData displayInspect account credits and apply an eligible balance to an open invoice with a ledger entry.