@fluid-app/portal-sdk 0.1.351 → 0.1.352

package/dist/{AddressAutocompleteInput-CgOFJKwF.mjs → AddressAutocompleteInput-Dds2GjGt.mjs}

@@ -1,4 +1,4 @@
-import { z as useAddressAutocompleteApi } from "./FluidProvider-B4Za_Bnw.mjs";
+import { B as useAddressAutocompleteApi, z as useAddressFieldsApiOptional } from "./FluidProvider-tPt9UpYz.mjs";
 import { a as useActiveLocale, n as createDomainTranslations, r as useDomainDict, t as createStaticDictAdapter } from "./static-dict-adapter-DRBq3ndO.mjs";
 import { t as createTranslationContext } from "./translation-api-context-factory-DFr9yJ6Q.mjs";
 import { B as DropdownMenuContent, C as SelectContent, E as SelectValue, G as DropdownMenuSeparator, On as useZodForm, Q as DialogContent, R as Label, S as Select, T as SelectTrigger, V as DropdownMenuItem, X as Dialog, Y as DropdownMenuTrigger, Z as DialogClose, a as Textarea, et as DialogFooter, it as DialogTitle, k as Input, kn as cn, tt as DialogHeader, w as SelectItem, wn as Button, z as DropdownMenu } from "./src-CJw6JbdS.mjs";
@@ -1284,8 +1284,58 @@ const addressFormSchema = z.object({
 	country_code: z.string().min(1, "Country is required"),
 	default: z.boolean()
 });
-function AddressFormDialog({ isOpen, onClose, selectedAddress, onSubmit, isSubmitting, countries = [], error, renderAddressAutocomplete, fetchStates, t, onDelete, isDeleting = false, defaultCountry = "US" }) {
+const STATIC_FIELD_ORDER = [
+	"first_name",
+	"last_name",
+	"address1",
+	"address2",
+	"city",
+	"state",
+	"postal_code"
+];
+const STATIC_LABELS = {
+	first_name: "first_name",
+	last_name: "last_name",
+	address1: "address_line_1",
+	address2: "address_line_2",
+	city: "city",
+	state: "state",
+	postal_code: "zip_code"
+};
+function groupFields(fields) {
+	const groups = [];
+	let i = 0;
+	while (i < fields.length) {
+		const current = fields[i];
+		const next = fields[i + 1];
+		if (current === "first_name" && next === "last_name" || current === "last_name" && next === "first_name") {
+			groups.push([current, next]);
+			i += 2;
+			continue;
+		}
+		const locationFields = new Set([
+			"city",
+			"state",
+			"postal_code"
+		]);
+		if (locationFields.has(current)) {
+			const group = [current];
+			while (i + group.length < fields.length && locationFields.has(fields[i + group.length])) group.push(fields[i + group.length]);
+			if (group.length > 1) {
+				groups.push(group);
+				i += group.length;
+				continue;
+			}
+		}
+		groups.push([current]);
+		i++;
+	}
+	return groups;
+}
+function AddressFormDialog({ isOpen, onClose, selectedAddress, onSubmit, isSubmitting, countries = [], error, renderAddressAutocomplete, fetchStates, t, onDelete, isDeleting = false, defaultCountry = "US", languageIso }) {
 	const [confirmDelete, setConfirmDelete] = useState(false);
+	const addressFieldsApi = useAddressFieldsApiOptional();
+	const [bffFields, setBffFields] = useState(null);
 	useEffect(() => {
 		if (!isOpen) setConfirmDelete(false);
 	}, [isOpen]);
@@ -1323,6 +1373,40 @@ function AddressFormDialog({ isOpen, onClose, selectedAddress, onSubmit, isSubmi
 		name: "default"
 	});
 	const { stateOptions, config, handleCountryChange } = useCountryStates();
+	useEffect(() => {
+		if (!addressFieldsApi || !selectedCountryCode) return;
+		let cancelled = false;
+		setBffFields(null);
+		addressFieldsApi.fetchAddressFields(selectedCountryCode, languageIso).then((response) => {
+			if (!cancelled) setBffFields([...response.address_fields.fields]);
+		}).catch(() => {
+			if (!cancelled) setBffFields(null);
+		});
+		return () => {
+			cancelled = true;
+		};
+	}, [
+		addressFieldsApi,
+		selectedCountryCode,
+		languageIso
+	]);
+	const fieldOrder = useMemo(() => {
+		if (!bffFields) return STATIC_FIELD_ORDER;
+		const bffOrder = bffFields.map((f) => f.field).filter((f) => STATIC_FIELD_ORDER.includes(f));
+		const missing = STATIC_FIELD_ORDER.filter((f) => !bffOrder.includes(f));
+		return [...bffOrder, ...missing];
+	}, [bffFields]);
+	const fieldGroups = useMemo(() => groupFields(fieldOrder), [fieldOrder]);
+	const getFieldLabel = (fieldName) => {
+		if (bffFields) {
+			const bffField = bffFields.find((f) => f.field === fieldName);
+			if (bffField) return bffField.label;
+		}
+		if (fieldName === "state" && config?.regionLabel) return t(config.regionLabel);
+		if (fieldName === "postal_code" && config?.postalLabel) return t(config.postalLabel);
+		const key = STATIC_LABELS[fieldName];
+		return key ? t(key) : fieldName;
+	};
 	const countrySelectOptions = [...countries].map((country) => ({
 		name: country.name,
 		value: country.iso
@@ -1391,6 +1475,33 @@ function AddressFormDialog({ isOpen, onClose, selectedAddress, onSubmit, isSubmi
 			default: data.default
 		} });
 	});
+	const renderField = (fieldName, containerClassName) => {
+		const label = getFieldLabel(fieldName);
+		if (fieldName === "state" && stateSelectOptions.length > 0) return /* @__PURE__ */ jsx(FormComboboxField, {
+			control,
+			name: "state",
+			label,
+			placeholder: t("select_state"),
+			options: stateSelectOptions,
+			containerClassName,
+			disabled: isSubmitting
+		}, fieldName);
+		if (fieldName === "address1" && renderAddressAutocomplete) return /* @__PURE__ */ jsx("div", {
+			className: containerClassName,
+			children: renderAddressAutocomplete({
+				control,
+				setValue,
+				countryCode: selectedCountryCode
+			})
+		}, fieldName);
+		return /* @__PURE__ */ jsx(FormTextField, {
+			control,
+			name: fieldName,
+			label,
+			containerClassName,
+			disabled: isSubmitting
+		}, fieldName);
+	};
 	return /* @__PURE__ */ jsx(Dialog, {
 		open: isOpen,
 		onOpenChange: (open) => !open && onClose(),
@@ -1403,76 +1514,20 @@ function AddressFormDialog({ isOpen, onClose, selectedAddress, onSubmit, isSubmi
 				}) }),
 				/* @__PURE__ */ jsxs("div", {
 					className: "space-y-3 pt-2",
-					children: [
-						/* @__PURE__ */ jsx(FormComboboxField, {
-							control,
-							name: "country_code",
-							label: t("country"),
-							placeholder: t("select_an_option"),
-							options: countrySelectOptions,
-							disabled: isSubmitting
-						}),
-						/* @__PURE__ */ jsxs("div", {
-							className: "flex gap-3",
-							children: [/* @__PURE__ */ jsx(FormTextField, {
-								control,
-								name: "first_name",
-								label: t("first_name"),
-								containerClassName: "flex-1",
-								disabled: isSubmitting
-							}), /* @__PURE__ */ jsx(FormTextField, {
-								control,
-								name: "last_name",
-								label: t("last_name"),
-								containerClassName: "flex-1",
-								disabled: isSubmitting
-							})]
-						}),
-						renderAddressAutocomplete ? renderAddressAutocomplete({
-							control,
-							setValue,
-							countryCode: selectedCountryCode
-						}) : /* @__PURE__ */ jsx(FormTextField, {
-							control,
-							name: "address1",
-							label: t("address_line_1"),
-							disabled: isSubmitting
-						}),
-						/* @__PURE__ */ jsx(FormTextField, {
-							control,
-							name: "address2",
-							label: t("address_line_2"),
-							disabled: isSubmitting
-						}),
-						/* @__PURE__ */ jsxs("div", {
+					children: [/* @__PURE__ */ jsx(FormComboboxField, {
+						control,
+						name: "country_code",
+						label: t("country"),
+						placeholder: t("select_an_option"),
+						options: countrySelectOptions,
+						disabled: isSubmitting
+					}), fieldGroups.map((group) => {
+						if (group.length === 1) return renderField(group[0]);
+						return /* @__PURE__ */ jsx("div", {
 							className: "flex gap-3",
-							children: [
-								/* @__PURE__ */ jsx(FormTextField, {
-									control,
-									name: "city",
-									label: t("city"),
-									containerClassName: "flex-1",
-									disabled: isSubmitting
-								}),
-								/* @__PURE__ */ jsx(FormComboboxField, {
-									control,
-									name: "state",
-									label: config?.regionLabel ? t(config.regionLabel) : t("state"),
-									placeholder: t("select_state"),
-									options: stateSelectOptions,
-									containerClassName: "flex-1",
-									disabled: isSubmitting
-								}),
-								/* @__PURE__ */ jsx(FormTextField, {
-									control,
-									name: "postal_code",
-									label: config?.postalLabel ? t(config.postalLabel) : t("zip_code"),
-									containerClassName: "flex-1",
-									disabled: isSubmitting
-								})
-							]
-						})
-					]
+							children: group.map((fieldName) => renderField(fieldName, "flex-1"))
+						}, group.join("-"));
+					})]
 				}),
 				/* @__PURE__ */ jsxs("div", {
 					className: "mt-4 flex flex-wrap items-center justify-between gap-3",
@@ -2375,4 +2430,4 @@ function AddressAutocompleteInput({ control, setValue, countryIso, addressLineFi
 //#endregion
 export { AddressFormDialog as a, PaymentIcon as c, UserInfoDialog as d, ConfirmActionDialog as f, useProfileTranslation as h, CreditCardFormDialog as i, getCardDisplayName as l, ProfileTranslationBridge as m, createFluidPayApiAdapter as n, EditPaymentMethodDialog as o, EllipsesDropdown as p, mapToFluidPayPaymentMethod as r, FluidPayCoreProvider as s, AddressAutocompleteInput as t, getCardExpiry as u };
 
-//# sourceMappingURL=AddressAutocompleteInput-CgOFJKwF.mjs.map
+//# sourceMappingURL=AddressAutocompleteInput-Dds2GjGt.mjs.map