Founding price: $35, then $99 after 23:59 UTC on 4 November, then $99
Get ProStops a form from being sent twice: the button locks while the request runs, Enter in a field is ignored during that time, and an idempotency key travels with the request so a retry after a timeout cannot create a second record. Use this when duplicates cost money or trust.
This item has no props to tune. Use the lens above to change theme, density, direction and more.
Submitting twice would create two orders, two charges or two emails, and people do double-click, press Enter twice and retry after a timeout.
Do not use it when: The idempotency key only helps if your server stores it and returns the first result for a repeated key. A disabled button alone is not protection.
This item is part of tealmac UI Pro
The source for this item installs with a Pro licence key. Log in with your key to see the install command, or read the Pro setup page.
| Prop | Type | Description |
|---|---|---|
submit | (values, idempotencyKey) => Promise<void> | Send the idempotency key in a header (Idempotency-Key) or a field and store it on the server. |
aria-busy, and the quantity input becomes read-only (not disabled, so it keeps its place in the focus order).The pattern ships with a Testing Library test (double-submit-guard.test.tsx) that covers: its main behaviour, the keyboard path and the error or empty states.