@vtex/faststore 0.0.10 → 0.0.11

package/dist/matter/billing-address/billing-address.js

@@ -1,14 +1,20 @@
 "use client";
 import { defineComponent } from "../../core/dist/define-component.js";
+import { defineContentType } from "../../core/dist/define-content-type.js";
 import "../../core/dist/index.js";
+import { useStorefrontFormatters } from "../../sdk/format/client.js";
+import { useMessageFormatter } from "../../sdk/i18n/use-message-formatter.js";
 import { Checkbox } from "../../particles/checkbox/checkbox.js";
 import { Field } from "../../particles/field/field.js";
 import { useActionsOverride } from "../../sdk/actions/actions-override-context.js";
-import { resolveAuthoredCopy } from "../../utils/resolve-authored-copy.js";
+import { formatErrorCode } from "../../sdk/i18n/format-error-code.js";
+import { countryDisplayName } from "../../sdk/address/country-display.js";
 import { Select } from "../../particles/select/select.js";
 import { Icon } from "../../particles/icon/icon.js";
 import { usePayment } from "../payment/payment.js";
-import { getAvailableCountries, getCountryDescriptor, satisfiesFieldPattern } from "../shipping-address/country-descriptors.js";
+import { normalizeAddressField, pickActiveTextFields } from "../shipping-address/address-payload.js";
+import { LIBRARY_COUNTRIES, useLibraryCountryDescriptors } from "../shipping-address/library-country-descriptors.js";
+import { getAvailableCountries, getCountryDescriptor, satisfiesFieldRule } from "../shipping-address/country-descriptors.js";
 import { useEffect, useId, useMemo, useState } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 //#region src/matter/billing-address/billing-address.tsx
@@ -18,29 +24,42 @@ const OMITTED_FORM_FIELD_NAMES = /* @__PURE__ */ new Set(["recipientName"]);
 /** Descriptor field names the custom-address form renders but never marks required, even while
 * "different" is selected (PR #544 N1 item 1 — the engineer's own rule, verbatim: "if the person says
 * the address is different, the new address fields must be required"). `complement` is the one
-* exception: `complementLabel`'s own default already labels it optional ("Complement (optional)"),
+* exception: the `complementLabel` message labels it optional ("Complement (optional)"),
 * and neither a real-world address nor the server's own write contract treats it as load-bearing.
 * Shared between the `required` attribute below and `isBillingAddressFormValid`, so the two never
-* drift apart. An authored `complementLabel` that drops the "(optional)" suffix loses that visual cue
+* drift apart. A `complementLabel` message that drops the "(optional)" suffix loses that visual cue
 * without changing this set — the two are independent (R7, billing-address.md). */
 const OPTIONAL_FORM_FIELD_NAMES = /* @__PURE__ */ new Set(["complement"]);
 /**
-* English override for the descriptor's own country display names (`'Brasil'`, `'United States'`), because
-* the Brazilian entry's name is Portuguese. This map is a stopgap: copy a country's form speaks belongs on
-* its descriptor in `country-descriptors.ts`, as `countryLabel` and `requiredSuffix` already do. Put a new
-* string there, not in another English override map here. T31
-* (specs/make-the-payment-components-authored-copy.md, Decision 5) turned the eight *field* labels into
-* schema props but left this one a plain map: a prop per ISO code does not scale the way eight named
-* field-label props do. Keyed by the descriptor's own ISO code.
+* The message field that labels each descriptor field, by canonical field name. `recipientName` is listed
+* though the form never renders it (`OMITTED_FORM_FIELD_NAMES`). A field a library-backed descriptor adds
+* with no entry here shows its canonical name.
 */
-const COUNTRY_LABELS_EN = {
-	BRA: "Brazil",
-	USA: "United States"
+const LABEL_FIELDS = {
+	recipientName: "recipientNameLabel",
+	street: "streetLabel",
+	number: "numberLabel",
+	complement: "complementLabel",
+	neighborhood: "neighborhoodLabel",
+	city: "cityLabel",
+	state: "stateLabel",
+	postalCode: "postalCodeLabel"
 };
-/** Resolves a country's English display name, falling back to the descriptor's own label (then the
-* raw ISO code) for a country this map does not yet cover. */
-function getCountryLabel(iso) {
-	return COUNTRY_LABELS_EN[iso] ?? getCountryDescriptor(iso)?.label ?? iso;
+function labelFieldOf(name) {
+	return Object.hasOwn(LABEL_FIELDS, name) ? LABEL_FIELDS[name] : void 0;
+}
+function countryNameOf(iso, displayName) {
+	return countryDisplayName(iso, displayName) ?? iso;
+}
+/** `defaultCountry` when it has a descriptor or is library-backed, else the first available country. */
+function initialCountryOf(defaultCountry) {
+	if (getCountryDescriptor(defaultCountry) || LIBRARY_COUNTRIES.includes(defaultCountry)) return defaultCountry;
+	return getAvailableCountries()[0] ?? defaultCountry;
+}
+/** The field's label message, or its descriptor name when no message field covers it. */
+function fieldLabelOf(name, formatLabel) {
+	const labelField = labelFieldOf(name);
+	return labelField ? formatLabel(labelField) : name;
 }
 /**
 * Whether the toggle reads as "same as delivery" — `true` whenever the published flag is `null`
@@ -56,26 +75,23 @@ function resolveSameAsDelivery(billingAddressDifferent) {
 * `isBillingAddressFormValid`) and the per-field error (the `issue` computed per field in the render), so the
 * two can never disagree (T38 Decision 8). Blank (after
 * trim) wins over format: `complement` (`OPTIONAL_FORM_FIELD_NAMES`) may be blank, every other field may
-* not. A non-blank value is tested raw against the descriptor's `rule.pattern` — the same
-* predicate the delivery form's react-hook-form rule applies, so a surrounding space is a format error
-* in both. A whitespace-only value is the one divergence: it is blank here (`required`), where the
-* delivery form would run the pattern on it (see `satisfiesFieldPattern`). No postal format is defined
-* here: the descriptor's `rule.pattern` is the only definition.
+* not. A non-blank value is tested raw against the descriptor's `rule.pattern` and its function-valued
+* `rule.validate` (`satisfiesFieldRule`) — the same predicates the delivery form's react-hook-form rule
+* applies, so a surrounding space is a format error in both for a pattern. A whitespace-only value is the
+* one divergence: it is blank here (`required`), where the delivery form would run the pattern on it (see
+* `satisfiesFieldPattern`). No postal format is defined here: the descriptor's `rule` is the only definition.
 */
 function getFieldIssue(field, value) {
 	if (value.trim().length === 0) return OPTIONAL_FORM_FIELD_NAMES.has(field.name) ? null : "required";
-	return satisfiesFieldPattern(field, value) ? null : "format";
+	return satisfiesFieldRule(field, value) ? null : "format";
 }
 /**
-* The message under a field whose verdict is `format`. `postalCode` keeps the authored
-* `postalCodeInvalidMessage` (already resolved by the caller, so it always has an English default); every
-* other field speaks with its own descriptor `rule.pattern.message`, the one the delivery form shows for the
-* same rule, so a pattern a descriptor gains later never surfaces the postal-code copy. A field with no
-* pattern never reaches a `format` verdict, so the empty string is not a message anyone sees.
+* The message under a field whose verdict is `format`. Only the postal code has a format today, and it reads
+* the formatted `postalCodeInvalidMessage`, so a format a descriptor gives another field later never surfaces
+* the postal-code copy: that field needs a message field of its own, and shows none until it has one.
 */
 function getFieldFormatMessage(field, postalCodeMessage) {
-	if (field.name === "postalCode") return postalCodeMessage;
-	return field.rule?.pattern?.message ?? "";
+	return field.name === "postalCode" ? postalCodeMessage : "";
 }
 /** The descriptor's fields the custom-address form renders: everything but `OMITTED_FORM_FIELD_NAMES`. */
 function getRenderableFields(descriptor) {
@@ -153,138 +169,200 @@ function focusNextBillingControl(panel, renderableFields, onFieldFocused) {
 	if (landed && fieldName) onFieldFocused(fieldName);
 	return landed;
 }
+const BillingAddressContent = defineContentType({
+	id: "billing-address",
+	title: "Billing Address",
+	description: "Copy of the billing address toggle, its notices, the custom-address form and its messages.",
+	schema: {
+		type: "object",
+		additionalProperties: false,
+		properties: {
+			sameAsDeliveryLabel: {
+				type: "string",
+				title: "Same-as-delivery toggle label",
+				format: "icu-message",
+				messageSource: "Billing address same as delivery address"
+			},
+			countryLabel: {
+				type: "string",
+				title: "Country field label",
+				format: "icu-message",
+				messageSource: "Country"
+			},
+			submitLabel: {
+				type: "string",
+				title: "Submit button label",
+				format: "icu-message",
+				messageSource: "Save billing address"
+			},
+			submitPendingLabel: {
+				type: "string",
+				title: "Submit button pending label",
+				format: "icu-message",
+				messageSource: "Saving..."
+			},
+			requiredNoticeLabel: {
+				type: "string",
+				title: "Required-billing-address notice",
+				description: "Shown when the selected method's validator marks a billing address required.",
+				format: "icu-message",
+				messageSource: "This payment method requires a billing address."
+			},
+			unsavedAddressNoticeLabel: {
+				type: "string",
+				title: "Unsaved-address notice",
+				description: "Shown while the form is open and no address has been saved yet.",
+				format: "icu-message",
+				messageSource: "No billing address has been saved yet — the delivery address will be used unless you save one below."
+			},
+			billingMatchNoticeLabel: {
+				type: "string",
+				title: "Billing-match disclaimer",
+				description: "Always on unless billingMatchNoticeVisible is false; blank shows no disclaimer.",
+				format: "icu-message",
+				messageSource: "Your billing address must match the one on your card or bank statement, or your bank may decline the order."
+			},
+			recipientNameLabel: {
+				type: "string",
+				title: "Recipient name field label",
+				description: "Not rendered today: the billing write has no recipient name.",
+				format: "icu-message",
+				messageSource: "Recipient's name"
+			},
+			streetLabel: {
+				type: "string",
+				title: "Street field label",
+				format: "icu-message",
+				messageSource: "Street"
+			},
+			numberLabel: {
+				type: "string",
+				title: "Number field label",
+				format: "icu-message",
+				messageSource: "Number"
+			},
+			complementLabel: {
+				type: "string",
+				title: "Complement field label",
+				description: "Its \"(optional)\" is the only sign the field is optional.",
+				format: "icu-message",
+				messageSource: "Complement (optional)"
+			},
+			neighborhoodLabel: {
+				type: "string",
+				title: "Neighborhood field label",
+				format: "icu-message",
+				messageSource: "Neighborhood"
+			},
+			cityLabel: {
+				type: "string",
+				title: "City field label",
+				format: "icu-message",
+				messageSource: "City"
+			},
+			stateLabel: {
+				type: "string",
+				title: "State field label",
+				format: "icu-message",
+				messageSource: "State"
+			},
+			postalCodeLabel: {
+				type: "string",
+				title: "Postal code field label",
+				format: "icu-message",
+				messageSource: "Postal code"
+			},
+			fieldRequiredMessage: {
+				type: "string",
+				title: "Field required message",
+				description: "Shown under a required field left blank.",
+				format: "icu-message",
+				messageSource: "This field is required."
+			},
+			postalCodeInvalidMessage: {
+				type: "string",
+				title: "Postal code format message",
+				description: "Shown under a postal code not in the selected country's format. Never contains the typed value.",
+				format: "icu-message",
+				messageSource: "Enter a valid postal code."
+			},
+			missingFieldsMessage: {
+				type: "string",
+				title: "Missing address fields message",
+				description: "Shown when the server refuses an address without a postal code or a country.",
+				format: "icu-message",
+				messageSource: "Fill in the postal code and the country of your billing address."
+			},
+			invalidCountryMessage: {
+				type: "string",
+				title: "Invalid country message",
+				description: "Shown when the server refuses the selected country.",
+				format: "icu-message",
+				messageSource: "Choose a valid country for your billing address."
+			},
+			genericErrorMessage: {
+				type: "string",
+				title: "Save failure message",
+				description: "Shown when the save fails: a network failure or a fault the shopper cannot fix.",
+				format: "icu-message",
+				messageSource: "Unable to save your billing address. Please try again."
+			}
+		}
+	}
+});
+/**
+* The message for each code an address write can return. A missing field and a refused country are ones
+* the shopper can fix; the rest, and a code this map does not know, share one message.
+*/
+const BILLING_ADDRESS_ERROR_FIELDS = {
+	MISSING_CART_CONTEXT: "genericErrorMessage",
+	CART_NOT_FOUND: "genericErrorMessage",
+	MISSING_BILLING_ADDRESS_FIELDS: "missingFieldsMessage",
+	INVALID_COUNTRY_CODE: "invalidCountryMessage",
+	NETWORK_ERROR: "genericErrorMessage"
+};
 const BillingAddressDefinition = defineComponent({
 	name: "BillingAddress",
 	importPath: "@vtex/faststore/components",
 	component: BillingAddress,
 	requiresContext: "payment",
 	actions: { payment: ["setBillingAddress"] },
+	content: BillingAddressContent,
 	editor: {
 		label: "Billing Address",
 		category: "commerce"
 	},
 	schema: {
-		sameAsDeliveryLabel: {
-			type: "string",
-			default: "Billing address same as delivery address",
-			label: "Same-as-delivery toggle label"
-		},
 		defaultCountry: {
 			type: "string",
 			default: "BRA",
 			label: "Default country (ISO-3)"
 		},
-		countryLabel: {
-			type: "string",
-			default: "Country",
-			label: "Country field label"
-		},
-		submitLabel: {
-			type: "string",
-			default: "Save billing address",
-			label: "Submit button label"
-		},
-		submitPendingLabel: {
-			type: "string",
-			default: "Saving...",
-			label: "Submit button pending label"
-		},
-		requiredNoticeLabel: {
-			type: "string",
-			default: "This payment method requires a billing address.",
-			label: "Required-billing-address notice label"
-		},
-		unsavedAddressNoticeLabel: {
-			type: "string",
-			default: "No billing address has been saved yet — the delivery address will be used unless you save one below.",
-			label: "Unsaved-address notice label"
-		},
-		billingMatchNoticeLabel: {
-			type: "string",
-			default: "Your billing address must match the one on your card or bank statement, or your bank may decline the order.",
-			label: "Billing-match disclaimer"
-		},
 		billingMatchNoticeVisible: {
 			type: "boolean",
 			default: true,
 			label: "Show the billing-match disclaimer"
 		},
-		recipientNameLabel: {
-			type: "string",
-			default: "Recipient's name",
-			label: "Recipient name field label"
-		},
-		streetLabel: {
-			type: "string",
-			default: "Street",
-			label: "Street field label"
-		},
-		numberLabel: {
-			type: "string",
-			default: "Number",
-			label: "Number field label"
-		},
-		complementLabel: {
-			type: "string",
-			default: "Complement (optional)",
-			label: "Complement field label"
-		},
-		neighborhoodLabel: {
-			type: "string",
-			default: "Neighborhood",
-			label: "Neighborhood field label"
-		},
-		cityLabel: {
-			type: "string",
-			default: "City",
-			label: "City field label"
-		},
-		stateLabel: {
-			type: "string",
-			default: "State",
-			label: "State field label"
-		},
-		postalCodeLabel: {
-			type: "string",
-			default: "Postal code",
-			label: "Postal code field label"
-		},
-		fieldRequiredMessage: {
-			type: "string",
-			default: "This field is required.",
-			label: "Field required message"
-		},
-		postalCodeInvalidMessage: {
-			type: "string",
-			default: "Enter a valid postal code.",
-			label: "Postal code format message"
-		},
 		disabled: {
 			type: "boolean",
 			default: false,
 			label: "Disabled"
 		}
 	},
-	guideline: "Same-as-delivery toggle (default on) for the billing address; when off, mounts a country-specific address form (reusing shipping-address's country descriptors) and persists it via $actions.payment.setBillingAddress on an explicit submit control. Re-checking the toggle dispatches sameAsDelivery: true only once an address was actually persisted (otherwise it's a local no-op — there's nothing on the server to revert). Publishes only a boolean (never the address) onto the shared payment draft for usePlaceOrder to read. While the form is open and nothing has been saved yet, renders an inline status notice — the required attribute on the form's own fields is not a submit gate; Place Order can still complete billed to the delivery address if the shopper never saves. Must be inside a PaymentSectionRoot or PaymentSectionController; place as a sibling of CardEntry/SavedCards/Installments/SaveCard/PlaceOrder, never nested inside any of them. See billing-address.md."
+	guideline: "Same-as-delivery toggle (default on) for the billing address; when off, mounts a country-specific address form (reusing shipping-address's country descriptors) and persists it via $actions.payment.setBillingAddress on an explicit submit control. Re-checking the toggle dispatches sameAsDelivery: true only once an address was actually persisted (otherwise it's a local no-op — there's nothing on the server to revert). Publishes only a boolean (never the address) onto the shared payment draft for usePlaceOrder to read. Every label, notice and message is a $content field; country names follow the store locale. While the form is open and nothing has been saved yet, renders an inline status notice — the required attribute on the form's own fields is not a submit gate; Place Order can still complete billed to the delivery address if the shopper never saves. Must be inside a PaymentSectionRoot or PaymentSectionController; place as a sibling of CardEntry/SavedCards/Installments/SaveCard/PlaceOrder, never nested inside any of them. See billing-address.md."
 });
-function BillingAddress({ sameAsDeliveryLabel = "Billing address same as delivery address", defaultCountry = "BRA", countryLabel = "Country", submitLabel = "Save billing address", submitPendingLabel = "Saving...", requiredNoticeLabel = "This payment method requires a billing address.", unsavedAddressNoticeLabel = "No billing address has been saved yet — the delivery address will be used unless you save one below.", billingMatchNoticeLabel = "Your billing address must match the one on your card or bank statement, or your bank may decline the order.", billingMatchNoticeVisible = true, recipientNameLabel = "Recipient's name", streetLabel = "Street", numberLabel = "Number", complementLabel = "Complement (optional)", neighborhoodLabel = "Neighborhood", cityLabel = "City", stateLabel = "State", postalCodeLabel = "Postal code", fieldRequiredMessage, postalCodeInvalidMessage, disabled = false, className, $actions: $actionsProp, ...props }) {
+function BillingAddress({ defaultCountry = "BRA", billingMatchNoticeVisible = true, disabled = false, className, $actions: $actionsProp, $content, $locale, ...props }) {
 	const $actions = useActionsOverride($actionsProp);
-	const fieldLabels = {
-		recipientName: recipientNameLabel,
-		street: streetLabel,
-		number: numberLabel,
-		complement: complementLabel,
-		neighborhood: neighborhoodLabel,
-		city: cityLabel,
-		state: stateLabel,
-		postalCode: postalCodeLabel
-	};
+	const { format } = useMessageFormatter(BillingAddressContent, $content);
+	const { displayName } = useStorefrontFormatters();
+	const countryName = (iso) => countryNameOf(iso, displayName);
+	const fieldLabel = (name) => fieldLabelOf(name, (labelField) => format(labelField));
 	const { draft, selectedMethod, setDraftBillingAddressDifferent, setDraftBillingAddressUnsaved, placing, cardPaymentCollapsed, registerRefusalFocus } = usePayment();
 	const instanceKey = useId();
 	const panelId = useId();
 	const [formDraft, setFormDraft] = useState(() => ({
 		postalCode: "",
-		country: getCountryDescriptor(defaultCountry) ? defaultCountry : getAvailableCountries()[0] ?? defaultCountry,
+		country: initialCountryOf(defaultCountry),
 		street: "",
 		number: "",
 		complement: "",
@@ -310,8 +388,8 @@ function BillingAddress({ sameAsDeliveryLabel = "Billing address same as deliver
 		setDraftBillingAddressUnsaved
 	]);
 	const canTakeFocus = !cardPaymentCollapsed && formOpen;
-	const draftCountry = formDraft.country;
-	const draftDescriptor = useMemo(() => getCountryDescriptor(draftCountry), [draftCountry]);
+	useLibraryCountryDescriptors();
+	const draftDescriptor = getCountryDescriptor(formDraft.country);
 	const renderableFields = useMemo(() => draftDescriptor ? getRenderableFields(draftDescriptor) : [], [draftDescriptor]);
 	useEffect(() => {
 		if (!canTakeFocus) return;
@@ -325,8 +403,6 @@ function BillingAddress({ sameAsDeliveryLabel = "Billing address same as deliver
 	]);
 	const billingAddressRequired = selectedMethod?.validator.billingAddressRequired ?? false;
 	const fieldsDisabled = disabled || pending;
-	const requiredMessage = resolveAuthoredCopy(fieldRequiredMessage, "This field is required.");
-	const invalidMessage = resolveAuthoredCopy(postalCodeInvalidMessage, "Enter a valid postal code.");
 	async function handleSameAsDeliveryChange(nextSameAsDelivery) {
 		setError(null);
 		if (!nextSameAsDelivery) {
@@ -342,7 +418,7 @@ function BillingAddress({ sameAsDeliveryLabel = "Billing address same as deliver
 		setPending(true);
 		try {
 			const [firstError] = await setBillingAddress({ sameAsDelivery: true });
-			if (firstError) setError(firstError.message);
+			if (firstError) setError(firstError);
 			else {
 				setDraftBillingAddressDifferent(false);
 				setFormOpen(false);
@@ -372,27 +448,22 @@ function BillingAddress({ sameAsDeliveryLabel = "Billing address same as deliver
 		const setBillingAddress = $actions?.payment?.setBillingAddress;
 		setError(null);
 		if (!setBillingAddress) return;
-		const isFieldActive = (name) => renderableFields.some((field) => field.name === name);
 		setPending(true);
 		try {
 			const [firstError] = await setBillingAddress({
 				sameAsDelivery: false,
-				postalCode: formDraft.postalCode,
+				postalCode: normalizeAddressField(renderableFields, "postalCode", formDraft.postalCode),
 				country: formDraft.country,
-				...isFieldActive("street") ? { street: formDraft.street } : {},
-				...isFieldActive("number") ? { number: formDraft.number } : {},
-				...isFieldActive("complement") ? { complement: formDraft.complement } : {},
-				...isFieldActive("neighborhood") ? { neighborhood: formDraft.neighborhood } : {},
-				...isFieldActive("city") ? { city: formDraft.city } : {},
-				...isFieldActive("state") ? { state: formDraft.state } : {}
+				...pickActiveTextFields(renderableFields, formDraft)
 			});
-			if (firstError) setError(firstError.message);
+			if (firstError) setError(firstError);
 			else setDraftBillingAddressDifferent(true);
 		} finally {
 			setPending(false);
 		}
 	}
 	if (cardPaymentCollapsed) return null;
+	const billingMatchNotice = billingMatchNoticeVisible ? format("billingMatchNoticeLabel") : "";
 	return /* @__PURE__ */ jsxs("div", {
 		...props,
 		className,
@@ -403,9 +474,9 @@ function BillingAddress({ sameAsDeliveryLabel = "Billing address same as deliver
 		...pending ? { "data-fs-billing-address-pending": "" } : {},
 		...sameAsDelivery ? { "data-fs-billing-address-same-as-delivery": "" } : {},
 		children: [
-			billingMatchNoticeVisible && billingMatchNoticeLabel.trim() ? /* @__PURE__ */ jsx("p", {
+			billingMatchNotice.trim() ? /* @__PURE__ */ jsx("p", {
 				"data-fs-billing-address-match-notice": "",
-				children: billingMatchNoticeLabel
+				children: billingMatchNotice
 			}) : null,
 			/* @__PURE__ */ jsxs("div", {
 				"data-fs-billing-address-toggle-field": "",
@@ -418,10 +489,10 @@ function BillingAddress({ sameAsDeliveryLabel = "Billing address same as deliver
 						disabled: fieldsDisabled,
 						"aria-controls": panelId,
 						children: /* @__PURE__ */ jsx(Checkbox.Indicator, { children: /* @__PURE__ */ jsx(Icon, { name: "checked" }) })
-					}), sameAsDeliveryLabel] })
+					}), format("sameAsDeliveryLabel")] })
 				}), billingAddressRequired ? /* @__PURE__ */ jsx("p", {
 					"data-fs-billing-address-required-note": "",
-					children: requiredNoticeLabel
+					children: format("requiredNoticeLabel")
 				}) : null]
 			}),
 			/* @__PURE__ */ jsx("div", {
@@ -434,19 +505,19 @@ function BillingAddress({ sameAsDeliveryLabel = "Billing address same as deliver
 						unsavedAddressNoticeVisible ? /* @__PURE__ */ jsx("p", {
 							role: "status",
 							"data-fs-billing-address-unsaved-notice": "",
-							children: unsavedAddressNoticeLabel
+							children: format("unsavedAddressNoticeLabel")
 						}) : null,
 						/* @__PURE__ */ jsxs(Field.Root, {
 							disabled: fieldsDisabled,
 							"data-fs-field-root": "",
 							"data-fs-billing-address-field": "country",
-							children: [/* @__PURE__ */ jsx(Field.Label, { children: countryLabel }), /* @__PURE__ */ jsxs(Select.Root, {
+							children: [/* @__PURE__ */ jsx(Field.Label, { children: format("countryLabel") }), /* @__PURE__ */ jsxs(Select.Root, {
 								value: formDraft.country,
 								onValueChange: handleCountryChange,
 								disabled: fieldsDisabled,
 								required: true,
-								children: [/* @__PURE__ */ jsxs(Select.Trigger, { children: [/* @__PURE__ */ jsx(Select.Value, { children: (value) => value ? getCountryLabel(value) : value }), /* @__PURE__ */ jsx(Select.Icon, { children: "▾" })] }), /* @__PURE__ */ jsx(Select.Portal, { children: /* @__PURE__ */ jsx(Select.Positioner, { children: /* @__PURE__ */ jsx(Select.Popup, { children: /* @__PURE__ */ jsx(Select.List, { children: getAvailableCountries().map((iso) => {
-									const label = getCountryLabel(iso);
+								children: [/* @__PURE__ */ jsxs(Select.Trigger, { children: [/* @__PURE__ */ jsx(Select.Value, { children: (value) => value ? countryName(value) : value }), /* @__PURE__ */ jsx(Select.Icon, { children: "▾" })] }), /* @__PURE__ */ jsx(Select.Portal, { children: /* @__PURE__ */ jsx(Select.Positioner, { children: /* @__PURE__ */ jsx(Select.Popup, { children: /* @__PURE__ */ jsx(Select.List, { children: getAvailableCountries().map((iso) => {
+									const label = countryName(iso);
 									return /* @__PURE__ */ jsx(Select.Item, {
 										value: iso,
 										label,
@@ -464,7 +535,7 @@ function BillingAddress({ sameAsDeliveryLabel = "Billing address same as deliver
 								"data-fs-field-root": "",
 								"data-fs-billing-address-field": field.name,
 								children: [
-									/* @__PURE__ */ jsx(Field.Label, { children: fieldLabels[field.name] || field.label }),
+									/* @__PURE__ */ jsx(Field.Label, { children: fieldLabel(field.name) }),
 									/* @__PURE__ */ jsx(Field.Control, {
 										value: formDraft[field.name] ?? "",
 										onChange: (event) => handleFieldChange(field.name, event.currentTarget.value),
@@ -474,7 +545,7 @@ function BillingAddress({ sameAsDeliveryLabel = "Billing address same as deliver
 									}),
 									invalid ? /* @__PURE__ */ jsx(Field.Error, {
 										match: true,
-										children: issue === "format" ? getFieldFormatMessage(field, invalidMessage) : requiredMessage
+										children: issue === "format" ? getFieldFormatMessage(field, format("postalCodeInvalidMessage")) : format("fieldRequiredMessage")
 									}) : null
 								]
 							}, field.name);
@@ -484,7 +555,7 @@ function BillingAddress({ sameAsDeliveryLabel = "Billing address same as deliver
 							onClick: handleSubmit,
 							disabled: fieldsDisabled || !canSaveBillingDraft(draftDescriptor, renderableFields, formDraft),
 							"data-fs-billing-address-submit": "",
-							children: pending ? submitPendingLabel : submitLabel
+							children: format(pending ? "submitPendingLabel" : "submitLabel")
 						})
 					]
 				})
@@ -492,12 +563,12 @@ function BillingAddress({ sameAsDeliveryLabel = "Billing address same as deliver
 			error ? /* @__PURE__ */ jsx("div", {
 				role: "alert",
 				"data-fs-billing-address-error": "",
-				children: error
+				children: formatErrorCode(BillingAddressContent, BILLING_ADDRESS_ERROR_FIELDS, error, format, "genericErrorMessage")
 			}) : null
 		]
 	});
 }
 //#endregion
-export { BillingAddress, BillingAddressDefinition, getFieldFormatMessage, isBillingAddressFormValid, resolveSameAsDelivery };
+export { BILLING_ADDRESS_ERROR_FIELDS, BillingAddress, BillingAddressContent, BillingAddressDefinition, getFieldFormatMessage, isBillingAddressFormValid, resolveSameAsDelivery };
 
 //# sourceMappingURL=billing-address.js.map