commerce-ui setup

Styles

Import them once, in the stylesheet where you load Tailwind:

@import "@evolve-storefront/commerce-ui/styles.css";

Translations

The package ships its texts in @evolve-storefront/commerce-ui/messages. evolve messages merges them into your message files and never overwrites a text you changed.

AddressConfigProvider

Supplies the country list, field config and layout overrides to AddressForm. Optional by design — useAddressConfig() resolves defaults, so an unconfigured consumer keeps working exactly as before.

import { AddressConfigProvider } from "@evolve-storefront/commerce-ui/address-form";

Prop	Type	Description
children	ReactNode
countries?	readonly string[]	Selectable countries, as ISO-3166-1 alpha-2 codes. Defaults to every ISO region, and this is the only thing standing between a customer and any of them — the field is a select, so narrowing here is what a merchant shipping to three countries reaches for, not a hint.
fields?	AddressFieldConfig	Per-field on/off + requiredness. Unlisted fields keep their default.
layout?	Record<string, AddressLayout>	Extra or replacement layouts, keyed by country code.
defaultCountry?	string	The country a new address starts in, typically the store's own. Defaults to the only country when countries lists one. An address that carries a country keeps its own.
preferredCountries?	readonly string[]	Countries listed first in the country select, in this order, such as the store's own; the rest follow by name. One not in countries is ignored.
addressLookup?	AddressLookupConfig	Fill in the street and city from the postal code and house number, in the countries it covers. Off without one.
fieldsOnRequest?	readonly OnRequestField[]	Optional fields hidden behind an "Add …" button until the shopper asks for one, or the address already has a value. A field the config requires stays visible.