Skip to main content

Restrict supportedCountries when you can

If your integration only serves specific markets, restrict the country dropdown. Shoppers see fewer choices; when autocomplete is enabled, suggestions are limited to those countries.

Hide line2 only when you must

Leaving line2 visible helps shoppers with apartment numbers, suites, and units. Hide it only when your fulfilment pipeline literally cannot use it:

Use autocomplete for consumer flows

Address autocomplete dramatically reduces typing and errors on consumer checkouts. Enable it with your own Google Maps API key:
See Address autocomplete for provider setup, CSP entries, and graceful-failure behavior.

Gate your Pay button on complete

Address validation completes when every visible atom passes its schema. If you enable the fullName slot, both halves must pass; if you enable companyName, its schema must pass.

Reuse the billing element for shipping

Both elements share the same field set and options. If your form collects both, configure them the same way:
Inside Checkout, when both are configured, a “Same as shipping” toggle appears on the billing section (default checked). The shopper unchecks it to enter a different billing address.

Preserve shopper input on updates

element.update(partialOptions) reconciles per-field configuration without wiping shopper input. Prefer .update(...) over unmount() + mount() when reconfiguring at runtime.

See also

Last modified on July 17, 2026