@fluid-app/portal-sdk 0.1.28 → 0.1.30

package/dist/ProfileScreen-B6Dp7RLa.cjs

@@ -0,0 +1,2856 @@
+require("./chunk-9hOWP6kD.cjs");
+const require_FluidProvider = require("./FluidProvider-BmkSwcgV.cjs");
+const require_src = require("./src-CaogiXSc.cjs");
+const require_use_account_clients = require("./use-account-clients-n2a8bdSP.cjs");
+let react = require("react");
+let _tanstack_react_query = require("@tanstack/react-query");
+let react_jsx_runtime = require("react/jsx-runtime");
+let lucide_react = require("lucide-react");
+let _hookform_resolvers_zod = require("@hookform/resolvers/zod");
+let react_hook_form = require("react-hook-form");
+let zod = require("zod");
+//#region ../../platform/api-client-core/src/parse-api-errors.ts
+/**
+* Framework-agnostic API error parsing utilities.
+*
+* Extracts structured field-level errors from API responses and formats
+* them into human-readable messages. Works with ApiError from this package
+* as well as any error object that has `status`, `data`, and optional `message`.
+*/
+/**
+* Converts snake_case or camelCase field names to Title Case
+*/
+function formatFieldName(field) {
+	return field.replace(/_/g, " ").replace(/([A-Z])/g, " $1").split(" ").map((word) => word.charAt(0).toUpperCase() + word.slice(1).toLowerCase()).join(" ").trim();
+}
+/**
+* Type guard to check if an error looks like an API error
+*/
+function isApiLikeError(error) {
+	if (!error || typeof error !== "object") return false;
+	const err = error;
+	return typeof err.status === "number" && "data" in err && (typeof err.message === "string" || err.message === void 0);
+}
+/**
+* Extracts field-level errors from API error data
+*/
+function extractFieldErrors(data) {
+	const errors = [];
+	if (!data || typeof data !== "object") return errors;
+	const errorObj = data;
+	for (const [key, value] of Object.entries(errorObj)) if (Array.isArray(value) && value.length > 0) errors.push({
+		field: formatFieldName(key),
+		messages: value.map((item) => typeof item === "string" ? item : JSON.stringify(item))
+	});
+	else if (typeof value === "string" && value.length > 0) errors.push({
+		field: formatFieldName(key),
+		messages: [value]
+	});
+	else if (value && typeof value === "object" && !Array.isArray(value)) extractFieldErrors(value).forEach((nestedError) => {
+		errors.push({
+			field: `${formatFieldName(key)} → ${nestedError.field}`,
+			messages: nestedError.messages
+		});
+	});
+	return errors;
+}
+/**
+* Formats field errors into a readable description string
+*/
+function formatErrorDescription(errors) {
+	if (errors.length === 0) return "";
+	if (errors.length === 1) {
+		const err = errors[0];
+		if (!err) return "";
+		const message = err.messages[0] || "is invalid";
+		return `${err.field} ${message}`;
+	}
+	if (errors.length <= 3) return errors.map((e) => `${e.field} ${e.messages[0] || "is invalid"}`).join("\n");
+	const shown = errors.slice(0, 3).map((e) => `${e.field} ${e.messages[0] || "is invalid"}`).join("\n");
+	const remaining = errors.length - 3;
+	return `${shown}\n...and ${remaining} more ${remaining === 1 ? "error" : "errors"}`;
+}
+/**
+* Parses an error and returns a human-readable description string.
+*
+* Handles:
+* - API-like errors with structured field-level data
+* - API-like errors with a top-level message
+* - Standard Error instances
+* - Falls back to the provided fallback string
+*
+* @param error - The error to parse (ApiError, Error, or unknown)
+* @param fallback - Optional fallback description if error cannot be parsed
+* @returns A human-readable error description, or undefined if nothing could be extracted
+*/
+function parseApiErrors(error, fallback) {
+	if (isApiLikeError(error)) {
+		if (error.data) {
+			const fieldErrors = extractFieldErrors(error.data);
+			if (fieldErrors.length > 0) return formatErrorDescription(fieldErrors);
+		}
+		if (error.message) return error.message;
+	} else if (error instanceof Error) return error.message;
+	return fallback;
+}
+//#endregion
+//#region ../../profile/core/src/context.ts
+const ProfileUIContext = (0, react.createContext)(null);
+function useProfileUI() {
+	const context = (0, react.useContext)(ProfileUIContext);
+	if (!context) throw new Error("useProfileUI must be used within a ProfileUIProvider");
+	return context;
+}
+//#endregion
+//#region ../../profile/core/src/provider.tsx
+function ProfileUIProvider({ t, children }) {
+	const value = (0, react.useMemo)(() => ({ t }), [t]);
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ProfileUIContext.Provider, {
+		value,
+		children
+	});
+}
+//#endregion
+//#region ../../fluid-pay/api-client/src/namespaces/addresses.ts
+/**
+* Fetch all customer addresses.
+* Endpoint: GET /fluid_pay/addresses?jwt={jwt}
+*/
+async function fetchCustomerAddresses(client, jwt) {
+	return client.get("/fluid_pay/addresses", {
+		jwt,
+		page: "1",
+		per_page: "100"
+	});
+}
+/**
+* Create a new customer address.
+* Endpoint: POST /fluid_pay/create_address?jwt={jwt}
+*/
+async function createCustomerAddress(client, jwt, body) {
+	return client.post(`/fluid_pay/create_address?jwt=${jwt}`, body);
+}
+/**
+* Update an existing customer address.
+* Endpoint: PATCH /fluid_pay/update_address/{addressId}?jwt={jwt}
+*/
+async function updateCustomerAddress(client, jwt, addressId, body) {
+	return client.patch(`/fluid_pay/update_address/${addressId}?jwt=${jwt}`, body);
+}
+/**
+* Delete a customer address.
+* Endpoint: DELETE /fluid_pay/delete_address/{addressId}?jwt={jwt}
+*/
+async function deleteCustomerAddress(client, jwt, addressId) {
+	return client.delete(`/fluid_pay/delete_address/${addressId}?jwt=${jwt}`);
+}
+//#endregion
+//#region ../../fluid-pay/api-client/src/namespaces/payment-methods.ts
+/**
+* Fetch all customer payment methods.
+* Endpoint: GET /fluid_pay/payment_methods?jwt={jwt}
+*/
+async function fetchCustomerPaymentMethods(client, jwt, countryCode) {
+	const params = {
+		jwt,
+		page: "1",
+		per_page: "100"
+	};
+	if (countryCode) params.country_code = countryCode;
+	return client.get("/fluid_pay/payment_methods", params);
+}
+/**
+* Add a credit card to the customer's account.
+* Endpoint: POST /fluid_pay/create_payment_method?jwt={jwt}
+*/
+async function addCreditCardToCustomer(client, jwt, data) {
+	return client.post(`/fluid_pay/create_payment_method?jwt=${jwt}`, data);
+}
+/**
+* Delete a customer payment method.
+* Endpoint: DELETE /fluid_pay/delete_payment_method/{id}?jwt={jwt}
+*/
+async function deleteCustomerPaymentMethod(client, jwt, paymentMethodId) {
+	return client.delete(`/fluid_pay/delete_payment_method/${paymentMethodId}?jwt=${jwt}`);
+}
+/**
+* Update a payment method (default status, billing address).
+* Endpoint: PATCH /fluid_pay/update_payment_method/{id}?jwt={jwt}
+*/
+async function updatePaymentMethod(client, jwt, paymentMethodId, body) {
+	return client.patch(`/fluid_pay/update_payment_method/${paymentMethodId}?jwt=${jwt}`, body);
+}
+//#endregion
+//#region ../../fluid-pay/api-client/src/namespaces/vault.ts
+/**
+* Fetch VGS vault credentials for the customer's payment account.
+* Endpoint: GET /fluid_pay/vault?jwt={jwt}
+*/
+async function fetchVaultCredentialsForPaymentAccount(client, jwt) {
+	return client.get("/fluid_pay/vault", { jwt });
+}
+//#endregion
+//#region ../../fluid-pay/core/src/utils/country-config.ts
+const US_STATES = [
+	{
+		name: "Alabama",
+		isoCode: "AL"
+	},
+	{
+		name: "Alaska",
+		isoCode: "AK"
+	},
+	{
+		name: "Arizona",
+		isoCode: "AZ"
+	},
+	{
+		name: "Arkansas",
+		isoCode: "AR"
+	},
+	{
+		name: "California",
+		isoCode: "CA"
+	},
+	{
+		name: "Colorado",
+		isoCode: "CO"
+	},
+	{
+		name: "Connecticut",
+		isoCode: "CT"
+	},
+	{
+		name: "Delaware",
+		isoCode: "DE"
+	},
+	{
+		name: "Florida",
+		isoCode: "FL"
+	},
+	{
+		name: "Georgia",
+		isoCode: "GA"
+	},
+	{
+		name: "Hawaii",
+		isoCode: "HI"
+	},
+	{
+		name: "Idaho",
+		isoCode: "ID"
+	},
+	{
+		name: "Illinois",
+		isoCode: "IL"
+	},
+	{
+		name: "Indiana",
+		isoCode: "IN"
+	},
+	{
+		name: "Iowa",
+		isoCode: "IA"
+	},
+	{
+		name: "Kansas",
+		isoCode: "KS"
+	},
+	{
+		name: "Kentucky",
+		isoCode: "KY"
+	},
+	{
+		name: "Louisiana",
+		isoCode: "LA"
+	},
+	{
+		name: "Maine",
+		isoCode: "ME"
+	},
+	{
+		name: "Maryland",
+		isoCode: "MD"
+	},
+	{
+		name: "Massachusetts",
+		isoCode: "MA"
+	},
+	{
+		name: "Michigan",
+		isoCode: "MI"
+	},
+	{
+		name: "Minnesota",
+		isoCode: "MN"
+	},
+	{
+		name: "Mississippi",
+		isoCode: "MS"
+	},
+	{
+		name: "Missouri",
+		isoCode: "MO"
+	},
+	{
+		name: "Montana",
+		isoCode: "MT"
+	},
+	{
+		name: "Nebraska",
+		isoCode: "NE"
+	},
+	{
+		name: "Nevada",
+		isoCode: "NV"
+	},
+	{
+		name: "New Hampshire",
+		isoCode: "NH"
+	},
+	{
+		name: "New Jersey",
+		isoCode: "NJ"
+	},
+	{
+		name: "New Mexico",
+		isoCode: "NM"
+	},
+	{
+		name: "New York",
+		isoCode: "NY"
+	},
+	{
+		name: "North Carolina",
+		isoCode: "NC"
+	},
+	{
+		name: "North Dakota",
+		isoCode: "ND"
+	},
+	{
+		name: "Ohio",
+		isoCode: "OH"
+	},
+	{
+		name: "Oklahoma",
+		isoCode: "OK"
+	},
+	{
+		name: "Oregon",
+		isoCode: "OR"
+	},
+	{
+		name: "Pennsylvania",
+		isoCode: "PA"
+	},
+	{
+		name: "Rhode Island",
+		isoCode: "RI"
+	},
+	{
+		name: "South Carolina",
+		isoCode: "SC"
+	},
+	{
+		name: "South Dakota",
+		isoCode: "SD"
+	},
+	{
+		name: "Tennessee",
+		isoCode: "TN"
+	},
+	{
+		name: "Texas",
+		isoCode: "TX"
+	},
+	{
+		name: "Utah",
+		isoCode: "UT"
+	},
+	{
+		name: "Vermont",
+		isoCode: "VT"
+	},
+	{
+		name: "Virginia",
+		isoCode: "VA"
+	},
+	{
+		name: "Washington",
+		isoCode: "WA"
+	},
+	{
+		name: "West Virginia",
+		isoCode: "WV"
+	},
+	{
+		name: "Wisconsin",
+		isoCode: "WI"
+	},
+	{
+		name: "Wyoming",
+		isoCode: "WY"
+	},
+	{
+		name: "District of Columbia",
+		isoCode: "DC"
+	}
+];
+const COUNTRY_CONFIGS = {
+	US: {
+		regionLabel: "State",
+		postalLabel: "ZIP Code"
+	},
+	JP: {
+		regionLabel: "Prefecture",
+		postalLabel: "Postal Code"
+	}
+};
+const DEFAULT_REGION_CONFIG = {
+	regionLabel: "Province",
+	postalLabel: "Postal Code"
+};
+function getRegionConfig(countryCode) {
+	return COUNTRY_CONFIGS[countryCode] ?? DEFAULT_REGION_CONFIG;
+}
+//#endregion
+//#region ../../fluid-pay/core/src/hooks/use-country-states.ts
+function useCountryStates() {
+	const [selectedCountry, setSelectedCountry] = (0, react.useState)("US");
+	const [stateOptions, setStateOptions] = (0, react.useState)(US_STATES);
+	return {
+		handleCountryChange: (0, react.useCallback)((selectedCountryCode, fetchStates) => {
+			setSelectedCountry(selectedCountryCode);
+			if (selectedCountryCode === "US") setStateOptions(US_STATES);
+			else if (fetchStates) fetchStates(selectedCountryCode).then((states) => setStateOptions(states)).catch((error) => {
+				console.error("Failed to fetch states:", error);
+				setStateOptions([]);
+			});
+			else setStateOptions([]);
+		}, []),
+		stateOptions,
+		config: getRegionConfig(selectedCountry),
+		selectedCountry
+	};
+}
+//#endregion
+//#region ../../profile/ui/src/components/ellipses-dropdown.tsx
+function EllipsesDropdown({ onDelete, onEdit, editLabel = "Edit", deleteLabel = "Delete", disabled = false }) {
+	if (disabled) return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.Button, {
+		variant: "ghost",
+		disabled: true,
+		className: "cursor-not-allowed opacity-50",
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("svg", {
+			xmlns: "http://www.w3.org/2000/svg",
+			viewBox: "0 0 128 512",
+			className: "h-4 w-1 fill-gray-400",
+			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", { d: "M64 360a56 56 0 1 0 0 112 56 56 0 1 0 0-112zm0-160a56 56 0 1 0 0 112 56 56 0 1 0 0-112zM120 96A56 56 0 1 0 8 96a56 56 0 1 0 112 0z" })
+		})
+	});
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_src.DropdownMenu, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.DropdownMenuTrigger, {
+		asChild: true,
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.Button, {
+			variant: "ghost",
+			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("svg", {
+				xmlns: "http://www.w3.org/2000/svg",
+				viewBox: "0 0 128 512",
+				className: "h-4 w-1 fill-gray-400",
+				children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", { d: "M64 360a56 56 0 1 0 0 112 56 56 0 1 0 0-112zm0-160a56 56 0 1 0 0 112 56 56 0 1 0 0-112zM120 96A56 56 0 1 0 8 96a56 56 0 1 0 112 0z" })
+			})
+		})
+	}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_src.DropdownMenuContent, {
+		className: "min-w-20 space-y-1 text-sm text-gray-900",
+		children: [onEdit && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_src.DropdownMenuItem, {
+			className: "flex cursor-pointer flex-row items-center justify-between space-x-2 rounded px-2 hover:bg-gray-50",
+			onClick: (e) => {
+				e.stopPropagation();
+				onEdit();
+			},
+			children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", { children: editLabel }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("svg", {
+				xmlns: "http://www.w3.org/2000/svg",
+				viewBox: "0 0 512 512",
+				className: "h-2.5 w-2.5 fill-current",
+				children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", { d: "M362.7 19.3L314.3 67.7 444.3 197.7l48.4-48.4c25-25 25-65.5 0-90.5L453.3 19.3c-25-25-65.5-25-90.5 0zm-71 71L58.6 323.5c-10.4 10.4-18 23.3-22.2 37.4L1 481.2C-1.5 489.7 .8 498.8 7 505s15.3 8.5 23.7 6.1l120.3-35.4c14.1-4.2 27-11.8 37.4-22.2L421.7 220.3 291.7 90.3z" })
+			})]
+		}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.DropdownMenuSeparator, {})] }), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_src.DropdownMenuItem, {
+			className: "flex cursor-pointer flex-row items-center justify-between space-x-2 rounded px-2 text-red-500 hover:bg-red-50",
+			onClick: (e) => {
+				e.stopPropagation();
+				onDelete?.();
+			},
+			children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", { children: deleteLabel }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("svg", {
+				xmlns: "http://www.w3.org/2000/svg",
+				viewBox: "0 0 448 512",
+				className: "h-2.5 w-2.5 fill-red-500",
+				children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", { d: "M135.2 17.7C140.6 6.8 151.7 0 163.8 0L284.2 0c12.1 0 23.2 6.8 28.6 17.7L320 32l80 0c17.7 0 32 14.3 32 32s-14.3 32-32 32L48 96C30.3 96 16 81.7 16 64S30.3 32 48 32l80 0 7.2-14.3zM32 128l384 0 0 320c0 35.3-28.7 64-64 64L96 512c-35.3 0-64-28.7-64-64l0-320z" })
+			})]
+		})]
+	})] });
+}
+//#endregion
+//#region ../../profile/ui/src/components/confirm-action-dialog.tsx
+function ConfirmActionDialog({ title, description, onAction, openDialog, setOpenDialog, errorMsg, isLoading, actionText = "Delete" }) {
+	const { t } = useProfileUI();
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.Dialog, {
+		open: openDialog,
+		onOpenChange: setOpenDialog,
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_src.DialogContent, {
+			className: "max-w-sm rounded md:w-90",
+			children: [
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.DialogHeader, {
+					className: "flex flex-row justify-between",
+					children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.DialogTitle, {
+						className: "text-md w-full text-left font-medium",
+						children: title
+					})
+				}),
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+					className: "space-y-4",
+					children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
+						className: "text-left text-sm text-gray-500",
+						children: description
+					})
+				}),
+				errorMsg && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
+					className: "text-sm text-red-500",
+					children: errorMsg
+				}),
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.DialogFooter, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+					className: "flex w-full flex-row justify-between space-x-2",
+					children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.DialogClose, {
+						asChild: true,
+						children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.Button, {
+							className: "min-w-[70px] rounded bg-gray-50 p-3 text-gray-900 ring-1 ring-gray-300 hover:bg-gray-100",
+							onClick: () => setOpenDialog(false),
+							children: t("cancel")
+						})
+					}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.Button, {
+						type: "button",
+						className: "min-w-[70px] rounded bg-red-600 p-3 text-white hover:bg-red-700",
+						onClick: onAction,
+						disabled: isLoading,
+						children: isLoading ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", { className: "h-5 w-5 animate-spin rounded-full border-4 border-t-4 border-white border-t-transparent" }) : actionText
+					})]
+				}) })
+			]
+		})
+	});
+}
+//#endregion
+//#region ../../profile/ui/src/components/customer-points-ledger.tsx
+function formatTransactionType(ledger, t) {
+	const transactionType = ledger.metadata.transaction_type;
+	if (!transactionType) {
+		if (ledger.metadata.source) return ledger.amount > 0 ? t("points_awarded") : t("points_redeemed");
+		return t("transaction");
+	}
+	const translationKey = transactionType.toLowerCase().replace(/ /g, "_");
+	const translated = t(translationKey);
+	if (translated !== translationKey) return translated;
+	return transactionType.split("_").map((word) => word.charAt(0).toUpperCase() + word.slice(1)).join(" ");
+}
+function formatPoints(amount) {
+	return `${amount >= 0 ? "+" : ""}${amount}`;
+}
+function formatDateTime(dateString) {
+	return new Date(dateString).toLocaleDateString(void 0, {
+		year: "numeric",
+		month: "short",
+		day: "numeric",
+		hour: "2-digit",
+		minute: "2-digit"
+	});
+}
+function CustomerPointsLedger({ pointsLedger, isLoading = false }) {
+	const [accordionValue, setAccordionValue] = (0, react.useState)("");
+	const { t } = useProfileUI();
+	const availablePoints = pointsLedger[0]?.total_balance ?? 0;
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+		className: "mb-6 border-b border-gray-300 pb-4",
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.Accordion, {
+			type: "single",
+			collapsible: true,
+			value: accordionValue,
+			onValueChange: setAccordionValue,
+			className: "w-full",
+			children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_src.AccordionItem, {
+				value: "points-history",
+				className: "border-b-0",
+				children: [
+					/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+						className: "flex flex-row items-center justify-between",
+						children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+							className: "mt-4 mb-1 text-sm text-gray-400",
+							children: t("points_history")
+						}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.AccordionTrigger, { className: "m-0 ml-2 flex h-auto min-h-0 w-auto py-0 hover:no-underline" })]
+					}),
+					isLoading && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.Skeleton, { className: "h-6 w-full" }),
+					!isLoading && !accordionValue && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+						className: "mb-2 flex w-full cursor-pointer flex-col",
+						onClick: () => setAccordionValue("points-history"),
+						children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+							className: "text-sm font-semibold text-gray-900",
+							children: [
+								availablePoints.toLocaleString(),
+								" ",
+								/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+									className: "font-normal text-gray-500",
+									children: t("points_available").toLowerCase()
+								})
+							]
+						})
+					}),
+					/* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_src.AccordionContent, {
+						className: "max-h-[400px] overflow-y-auto pt-2",
+						children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+							className: "mb-3 flex w-full flex-col",
+							children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+								className: "text-sm font-semibold text-gray-900",
+								children: [
+									availablePoints.toLocaleString(),
+									" ",
+									/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+										className: "font-normal text-gray-500",
+										children: t("points_available").toLowerCase()
+									})
+								]
+							})
+						}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+							className: "flex flex-col space-y-0",
+							children: pointsLedger.length > 0 ? pointsLedger.map((ledger) => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+								className: "relative flex flex-row items-start justify-between py-3",
+								children: [
+									/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+										className: "absolute top-3 left-0",
+										children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", { className: "mt-1.5 h-2 w-2 flex-shrink-0 rounded-full border border-gray-300" }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", { className: "mr-1 h-10 border-r border-gray-200" })]
+									}),
+									/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+										className: "ml-6 flex flex-row items-start space-x-3",
+										children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+											className: "flex flex-col",
+											children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+												className: "text-sm font-medium text-gray-900",
+												children: formatTransactionType(ledger, t)
+											}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+												className: "text-sm text-gray-500",
+												children: formatDateTime(ledger.created_at)
+											})]
+										})
+									}),
+									/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+										className: require_src.cn("text-sm font-medium", ledger.amount >= 0 ? "text-green-500" : "text-red-500"),
+										children: formatPoints(ledger.amount)
+									})
+								]
+							}, ledger.id)) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+								className: "text-sm text-gray-500",
+								children: t("no_points_history_found")
+							})
+						})]
+					})
+				]
+			})
+		})
+	});
+}
+//#endregion
+//#region ../../profile/ui/src/components/form-fields.tsx
+function FormTextField$1({ control, name, label, containerClassName, ...props }) {
+	const { field, fieldState: { error } } = (0, react_hook_form.useController)({
+		name,
+		control
+	});
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		className: require_src.cn("space-y-1", containerClassName),
+		children: [
+			label && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.Label, {
+				htmlFor: name,
+				className: "mb-1.5 block text-sm font-medium text-gray-700",
+				children: label
+			}),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.Input, {
+				...field,
+				...props,
+				id: name,
+				value: field.value ?? "",
+				className: require_src.cn(error && "ring-1 ring-red-500", props.className)
+			}),
+			error && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
+				className: "text-sm text-red-500",
+				children: error.message
+			})
+		]
+	});
+}
+function FormSelectField$1({ control, name, label, options, placeholder, containerClassName, onChange }) {
+	const { field, fieldState: { error } } = (0, react_hook_form.useController)({
+		name,
+		control
+	});
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		className: require_src.cn("space-y-1", containerClassName),
+		children: [
+			label && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.Label, {
+				htmlFor: name,
+				className: "block text-sm font-medium text-gray-700",
+				children: label
+			}),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_src.Select, {
+				value: field.value?.toString() ?? "",
+				onValueChange: (val) => {
+					field.onChange(val);
+					onChange?.(val);
+				},
+				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.SelectTrigger, {
+					className: require_src.cn(error && "ring-1 ring-red-500"),
+					children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.SelectValue, { placeholder })
+				}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.SelectContent, { children: options?.map((opt) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.SelectItem, {
+					value: opt.value.toString(),
+					children: opt.name
+				}, `${opt.name}-${opt.value}`)) })]
+			}),
+			error && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
+				className: "text-sm text-red-500",
+				children: error.message
+			})
+		]
+	});
+}
+//#endregion
+//#region ../../profile/ui/src/components/user-info-dialog.tsx
+function UserInfoDialog({ control, isOpen, onSubmit, handleClose, languageOptions, errorMsg, isSubmitting }) {
+	const { t } = useProfileUI();
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.Dialog, {
+		open: isOpen,
+		onOpenChange: (open) => !open && handleClose(),
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_src.DialogContent, {
+			className: "max-w-sm rounded md:max-w-lg",
+			children: [
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.DialogHeader, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.DialogTitle, {
+					className: "text-md font-medium text-gray-900",
+					children: t("edit_profile")
+				}) }),
+				/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+					className: "space-y-0",
+					children: [
+						/* @__PURE__ */ (0, react_jsx_runtime.jsx)(FormTextField$1, {
+							control,
+							name: "first_name",
+							label: t("first_name")
+						}),
+						/* @__PURE__ */ (0, react_jsx_runtime.jsx)(FormTextField$1, {
+							control,
+							name: "last_name",
+							label: t("last_name")
+						}),
+						/* @__PURE__ */ (0, react_jsx_runtime.jsx)(FormTextField$1, {
+							control,
+							name: "phone_number",
+							label: t("phone_number"),
+							type: "tel"
+						}),
+						/* @__PURE__ */ (0, react_jsx_runtime.jsx)(FormSelectField$1, {
+							control,
+							name: "language",
+							label: t("language"),
+							options: languageOptions,
+							placeholder: t("select_an_option")
+						})
+					]
+				}),
+				errorMsg && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
+					className: "text-sm text-red-500",
+					children: errorMsg
+				}),
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.DialogFooter, {
+					className: "flex flex-row items-center justify-end",
+					children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+						className: "flex-1 text-right",
+						children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.DialogClose, {
+							asChild: true,
+							children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_src.Button, {
+								type: "button",
+								onClick: onSubmit,
+								children: [isSubmitting && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", { className: "mr-3 h-5 w-5 animate-spin rounded-full border-4 border-t-4 border-white border-t-transparent" }), isSubmitting ? t("saving") : t("save_changes")]
+							})
+						})
+					})
+				})
+			]
+		})
+	});
+}
+//#endregion
+//#region ../../profile/ui/src/components/customer-info.tsx
+function createUserInfoSchema(messages) {
+	return zod.z.object({
+		first_name: zod.z.string().min(1, { message: messages.firstNameRequired }),
+		last_name: zod.z.string().min(1, { message: messages.lastNameRequired }),
+		phone_number: zod.z.string().optional(),
+		language: zod.z.string().min(1, { message: messages.languageRequired })
+	});
+}
+function CustomerInfo({ customerAccount, languages, onUpdateCustomer, isUpdating = false }) {
+	const [isEditDialogOpen, setIsEditDialogOpen] = (0, react.useState)(false);
+	const [updateError, setUpdateError] = (0, react.useState)(void 0);
+	const { t } = useProfileUI();
+	const { first_name, full_name } = customerAccount.customer;
+	const derivedLastName = full_name.startsWith(first_name) ? full_name.slice(first_name.length).trim() : "";
+	const userInitial = first_name ? first_name.charAt(0).toUpperCase() : "";
+	const customerLanguage = languages?.find((language) => language.iso === customerAccount.fluid_pay_account.language_iso)?.name;
+	const languageOptions = languages?.map((language) => ({
+		name: language.name,
+		value: language.name
+	}));
+	const { control, handleSubmit, reset } = (0, react_hook_form.useForm)({
+		resolver: (0, _hookform_resolvers_zod.zodResolver)((0, react.useMemo)(() => createUserInfoSchema({
+			firstNameRequired: t("first_name_is_required"),
+			lastNameRequired: t("last_name_is_required"),
+			languageRequired: t("language_is_required")
+		}), [t])),
+		defaultValues: {
+			first_name: customerAccount.customer.first_name || "",
+			last_name: derivedLastName,
+			phone_number: customerAccount.customer.phone || "",
+			language: customerLanguage || "English"
+		}
+	});
+	const handleOpenEditDialog = () => {
+		reset({
+			first_name: customerAccount.customer.first_name || "",
+			last_name: derivedLastName,
+			phone_number: customerAccount.customer.phone || "",
+			language: customerLanguage || "English"
+		});
+		setIsEditDialogOpen(true);
+	};
+	const handleCloseEditDialog = () => {
+		setIsEditDialogOpen(false);
+		setUpdateError(void 0);
+	};
+	const onSubmitUserInfo = handleSubmit(async (data) => {
+		try {
+			await onUpdateCustomer(data);
+			setIsEditDialogOpen(false);
+		} catch (error) {
+			console.error("Error updating profile:", error);
+			setUpdateError("Error updating profile. Please verify your information and try again.");
+		}
+	});
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		className: "mb-6 flex flex-row items-center justify-between space-x-2 border-b border-gray-300 pb-4",
+		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+			className: "flex flex-row items-center space-x-2",
+			children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.Avatar, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.AvatarFallback, { children: userInitial }) }), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+				className: "flex flex-col",
+				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
+					className: "text-sm font-medium",
+					children: customerAccount.customer.full_name
+				}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
+					className: "text-sm text-gray-500",
+					children: customerAccount.customer.email
+				})]
+			})]
+		}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+			className: "cursor-pointer rounded-md border border-gray-300 p-1 hover:bg-gray-50 disabled:opacity-50",
+			onClick: handleOpenEditDialog,
+			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.Pencil, { className: "h-2.5 w-2.5 text-gray-400" })
+		})]
+	}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(UserInfoDialog, {
+		control,
+		isOpen: isEditDialogOpen,
+		onSubmit: onSubmitUserInfo,
+		handleClose: handleCloseEditDialog,
+		languageOptions,
+		errorMsg: updateError,
+		isSubmitting: isUpdating
+	})] });
+}
+//#endregion
+//#region ../../profile/ui/src/components/address-dropdown.tsx
+function formatAddressName(address) {
+	return address.name ?? "";
+}
+function AddressDropdown({ title, displayAddress, addressList, onAddAddressClick, onEditAddress, onDeleteAddress, accordionItemValue, addAddressLabel, showAddButton = true, borderStyle = "border-b border-gray-300 pb-4 mb-6", className = "", showActions = true, isLoading = false }) {
+	const [addressesValue, setAddressesValue] = (0, react.useState)("");
+	const { t } = useProfileUI();
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		className: `${borderStyle} ${className}`,
+		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.Accordion, {
+			type: "single",
+			collapsible: true,
+			value: addressesValue,
+			onValueChange: setAddressesValue,
+			className: "w-full",
+			children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_src.AccordionItem, {
+				value: accordionItemValue,
+				className: "border-b-0",
+				children: [
+					/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+						className: "flex flex-row items-center justify-between",
+						children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+							className: "mt-4 mb-1 text-sm text-gray-400",
+							children: title
+						}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.AccordionTrigger, { className: "m-0 ml-2 flex h-auto min-h-0 w-auto py-0 hover:no-underline" })]
+					}),
+					isLoading && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+						className: "space-y-2",
+						children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.Skeleton, { className: "h-4 w-2/3" }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.Skeleton, { className: "h-4 w-1/2" })]
+					}),
+					!isLoading && !addressesValue && displayAddress && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+						className: "mb-2 flex w-full cursor-pointer flex-col",
+						onClick: () => setAddressesValue(accordionItemValue),
+						children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+							className: "flex items-center text-sm font-medium text-gray-900",
+							children: [
+								formatAddressName(displayAddress),
+								", ",
+								displayAddress.address1
+							]
+						}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+							className: "text-sm text-gray-500",
+							children: [
+								displayAddress.city,
+								", ",
+								displayAddress.state,
+								" ",
+								displayAddress.postal_code
+							]
+						})]
+					}),
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.AccordionContent, {
+						className: "max-h-[400px] overflow-y-auto pt-2",
+						children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+							className: "mt-2 flex flex-col justify-between space-y-4 px-0.5",
+							children: addressList.length > 0 ? addressList.map((address, index) => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+								className: require_src.cn("flex min-h-[48px] w-full flex-row items-center justify-between space-x-2 px-2", { "items-center border-b border-gray-300 p-3": addressList.length - 1 !== index }),
+								children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+									className: "flex flex-col",
+									children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+										className: "text-sm text-gray-900",
+										children: [
+											formatAddressName(address),
+											" ",
+											/* @__PURE__ */ (0, react_jsx_runtime.jsx)("br", {}),
+											address.address1,
+											" ",
+											/* @__PURE__ */ (0, react_jsx_runtime.jsx)("br", {}),
+											address.city,
+											", ",
+											address.state,
+											" ",
+											address.postal_code
+										]
+									})
+								}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+									className: "flex flex-row items-center space-x-2",
+									children: [address.default && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
+										className: "mt-1 w-fit rounded bg-gray-500 px-2 py-0.5 text-xs font-medium text-white",
+										children: t("default")
+									}), showActions && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(EllipsesDropdown, {
+										onDelete: () => onDeleteAddress?.(address),
+										onEdit: () => onEditAddress?.(address),
+										editLabel: t("edit"),
+										deleteLabel: t("delete")
+									})]
+								})]
+							}, address.id)) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+								className: "text-sm text-gray-500",
+								children: t("no_saved_addresses_found")
+							})
+						})
+					})
+				]
+			})
+		}), showAddButton && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+			className: "mt-3 text-left text-sm text-gray-900",
+			onClick: onAddAddressClick,
+			children: addAddressLabel
+		})]
+	});
+}
+//#endregion
+//#region ../../profile/ui/src/components/addresses.tsx
+function Addresses({ addresses, isLoading = false, onCreateAddress, onDeleteAddress, isDeletingAddress = false, renderAddressDialog }) {
+	const [openAddressDialog, setOpenAddressDialog] = (0, react.useState)(false);
+	const [openDeleteDialog, setOpenDeleteDialog] = (0, react.useState)(false);
+	const [selectedAddress, setSelectedAddress] = (0, react.useState)(null);
+	const [deleteAddressError, setDeleteAddressError] = (0, react.useState)(void 0);
+	const { t } = useProfileUI();
+	const defaultAddress = addresses.find((addr) => addr.default) ?? null;
+	const handleDeleteClick = (address) => {
+		setSelectedAddress(address);
+		setDeleteAddressError(void 0);
+		requestAnimationFrame(() => {
+			setOpenDeleteDialog(true);
+		});
+	};
+	const handleEditClick = (address) => {
+		setSelectedAddress(address);
+		requestAnimationFrame(() => {
+			setOpenAddressDialog(true);
+		});
+	};
+	const handleDeleteAddress = async () => {
+		if (!selectedAddress) return;
+		try {
+			await onDeleteAddress(selectedAddress.id);
+			setDeleteAddressError(void 0);
+			setOpenDeleteDialog(false);
+			setSelectedAddress(null);
+		} catch {
+			setDeleteAddressError("We were unable to delete this address. Please try again.");
+		}
+	};
+	const handleAddClick = () => {
+		setSelectedAddress(null);
+		if (onCreateAddress) onCreateAddress();
+		setOpenAddressDialog(true);
+	};
+	const handleCloseAddressDialog = () => {
+		setOpenAddressDialog(false);
+		setSelectedAddress(null);
+	};
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [
+		/* @__PURE__ */ (0, react_jsx_runtime.jsx)(AddressDropdown, {
+			title: t("shipping_addresses"),
+			displayAddress: defaultAddress,
+			addressList: addresses,
+			onAddAddressClick: handleAddClick,
+			onEditAddress: handleEditClick,
+			onDeleteAddress: handleDeleteClick,
+			accordionItemValue: "addresses",
+			addAddressLabel: `+ ${t("add_an_address")}`,
+			showAddButton: true,
+			borderStyle: "border-b border-gray-300 pb-4 mb-6",
+			showActions: true,
+			isLoading
+		}),
+		/* @__PURE__ */ (0, react_jsx_runtime.jsx)(ConfirmActionDialog, {
+			title: t("delete_address"),
+			description: t("delete_address_message"),
+			onAction: handleDeleteAddress,
+			actionText: t("delete"),
+			openDialog: openDeleteDialog,
+			setOpenDialog: setOpenDeleteDialog,
+			errorMsg: deleteAddressError,
+			isLoading: isDeletingAddress
+		}),
+		renderAddressDialog?.({
+			isOpen: openAddressDialog,
+			onClose: handleCloseAddressDialog,
+			selectedAddress
+		})
+	] });
+}
+//#endregion
+//#region ../../profile/ui/src/components/payment-method-dropdown.tsx
+function getCardDisplayName(paymentMethod) {
+	if (paymentMethod.payment_type === "Credit Card") {
+		const brand = paymentMethod.details.card_type;
+		const lastFour = paymentMethod.details.last_four;
+		return `${brand ?? "Card"} •••• ${lastFour ?? "****"}`;
+	}
+	return paymentMethod.payment_type;
+}
+function getCardExpiry(paymentMethod) {
+	const { exp_month, exp_year } = paymentMethod.details;
+	if (exp_month != null && exp_year != null) return `Expires ${exp_month}/${exp_year}`;
+	return "";
+}
+function PaymentMethodDropdown({ title, displayPaymentMethod, paymentMethodList, onAddPaymentMethodClick, onEditPaymentMethod, onDeletePaymentMethod, accordionItemValue = "paymentMethods", addPaymentMethodLabel = "+ Add a payment method", showAddButton = true, borderStyle = "border-b border-gray-300 pb-4 mb-6", className = "", showActions = true, isLoading = false }) {
+	const [paymentsValue, setPaymentsValue] = (0, react.useState)("");
+	const { t } = useProfileUI();
+	const renderPaymentMethod = (paymentMethod) => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		className: "flex flex-row items-center space-x-2",
+		children: [paymentMethod.details.logo_url && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+			className: "h-6 w-10 flex-shrink-0",
+			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("img", {
+				src: paymentMethod.details.logo_url,
+				alt: paymentMethod.details.card_type ?? t("payment_method"),
+				width: 40,
+				height: 24,
+				className: "object-contain"
+			})
+		}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+			className: "flex flex-col",
+			children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+				className: "flex items-center text-sm font-medium text-gray-900",
+				children: getCardDisplayName(paymentMethod)
+			}), getCardExpiry(paymentMethod) && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+				className: "text-sm text-gray-500",
+				children: getCardExpiry(paymentMethod)
+			})]
+		})]
+	});
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		className: `${borderStyle} ${className}`,
+		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.Accordion, {
+			type: "single",
+			collapsible: true,
+			value: paymentsValue,
+			onValueChange: setPaymentsValue,
+			className: "w-full",
+			children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_src.AccordionItem, {
+				value: accordionItemValue,
+				className: "border-b-0",
+				children: [
+					/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+						className: "flex flex-row items-center justify-between",
+						children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+							className: "mt-4 mb-1 text-sm text-gray-400",
+							children: title
+						}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.AccordionTrigger, { className: "m-0 ml-2 flex h-auto min-h-0 w-auto py-0 hover:no-underline" })]
+					}),
+					!paymentsValue && isLoading ? /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+						className: "mb-2 flex w-full flex-row items-center space-x-2",
+						children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.Skeleton, { className: "h-6 w-10" }), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+							className: "flex flex-col space-y-1",
+							children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.Skeleton, { className: "h-4 w-32" }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.Skeleton, { className: "h-4 w-24" })]
+						})]
+					}) : !paymentsValue && displayPaymentMethod && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+						className: "mb-2 flex w-full cursor-pointer flex-col",
+						onClick: () => setPaymentsValue(accordionItemValue),
+						children: renderPaymentMethod(displayPaymentMethod)
+					}),
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.AccordionContent, {
+						className: "max-h-[400px] overflow-y-auto pt-2",
+						children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+							className: "mt-2 flex flex-col justify-between space-y-4 px-0.5",
+							children: isLoading ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_jsx_runtime.Fragment, { children: [1, 2].map((i) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+								className: "items-center rounded bg-gray-100 p-3",
+								children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+									className: "flex flex-row items-center justify-between",
+									children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+										className: "flex flex-row items-center space-x-2",
+										children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.Skeleton, { className: "h-6 w-10" }), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+											className: "flex flex-col space-y-1",
+											children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.Skeleton, { className: "h-4 w-32" }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.Skeleton, { className: "h-4 w-24" })]
+										})]
+									}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.Skeleton, { className: "h-6 w-6" })]
+								})
+							}, `skeleton-${i}`)) }) : paymentMethodList.map((paymentMethod, index) => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+								className: require_src.cn("flex min-h-[48px] w-full flex-row items-center justify-between space-x-2 px-2", { "items-center border-b border-gray-300 p-3": paymentMethodList.length - 1 !== index }),
+								children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+									className: "flex flex-row items-center space-x-2",
+									children: [paymentMethod.details.logo_url && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+										className: "h-6 w-10 flex-shrink-0",
+										children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("img", {
+											src: paymentMethod.details.logo_url,
+											alt: paymentMethod.details.card_type ?? t("payment_method"),
+											width: 40,
+											height: 24,
+											className: "object-contain"
+										})
+									}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+										className: "flex flex-col",
+										children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+											className: "flex items-center text-sm font-medium text-gray-900",
+											children: `${paymentMethod.details.card_type ?? "Card"} •••• ${paymentMethod.details.last_four ?? "****"}`
+										}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+											className: "text-sm text-gray-500",
+											children: `${t("card_expires")} ${paymentMethod.details.exp_month}/${paymentMethod.details.exp_year}`
+										})]
+									})]
+								}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+									className: "flex flex-row items-center space-x-2",
+									children: [paymentMethod.default && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
+										className: "mt-1 w-fit rounded bg-gray-500 px-2 py-0.5 text-xs font-medium text-white",
+										children: t("default")
+									}), showActions && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(EllipsesDropdown, {
+										onDelete: () => onDeletePaymentMethod?.(paymentMethod),
+										deleteLabel: t("delete"),
+										onEdit: () => onEditPaymentMethod?.(paymentMethod),
+										editLabel: t("edit")
+									})]
+								})]
+							}, paymentMethod.id))
+						})
+					})
+				]
+			})
+		}), showAddButton && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+			className: "mt-3 text-left text-sm text-gray-900",
+			onClick: onAddPaymentMethodClick,
+			children: addPaymentMethodLabel
+		})]
+	});
+}
+//#endregion
+//#region ../../profile/ui/src/components/view-payment-method-dialog.tsx
+function ViewPaymentMethodDialog({ isOpen, paymentMethod, billingAddress, onClose, onEdit }) {
+	const { t } = useProfileUI();
+	if (!paymentMethod) return null;
+	const { details } = paymentMethod;
+	const cardBrand = details.card_type ?? "Card";
+	const lastFour = details.last_four ?? "****";
+	const expMonth = details.exp_month;
+	const expYear = details.exp_year;
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.Dialog, {
+		open: isOpen,
+		onOpenChange: (open) => !open && onClose(),
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_src.DialogContent, {
+			className: "max-w-sm rounded md:max-w-lg",
+			children: [
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.DialogHeader, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.DialogTitle, {
+					className: "text-md font-medium",
+					children: t("edit_card")
+				}) }),
+				/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+					className: "space-y-4",
+					children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", { children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+						className: "rounded-lg bg-gray-50 p-4",
+						children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+							className: "flex items-center space-x-3",
+							children: [details.logo_url && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+								className: "h-6 w-10 flex-shrink-0",
+								children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("img", {
+									src: details.logo_url,
+									alt: cardBrand,
+									width: 40,
+									height: 24,
+									className: "object-contain"
+								})
+							}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+								className: "flex flex-col",
+								children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
+									className: "text-sm font-medium text-gray-900",
+									children: [
+										cardBrand,
+										" •••• ",
+										lastFour
+									]
+								}), expMonth != null && expYear != null && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
+									className: "text-sm text-gray-500",
+									children: [
+										t("card_expires"),
+										" ",
+										expMonth,
+										"/",
+										expYear
+									]
+								})]
+							})]
+						}), paymentMethod.default && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+							className: "mt-2 inline-block rounded bg-gray-500 px-2 py-0.5 text-xs font-medium text-white",
+							children: t("default")
+						})]
+					}) }), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+						className: "mb-2 flex items-center justify-between",
+						children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("h3", {
+							className: "text-sm font-medium text-gray-900",
+							children: t("billing_address")
+						}), onEdit && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.Button, {
+							variant: "ghost",
+							size: "sm",
+							className: "h-auto p-0 text-sm text-gray-600 underline hover:bg-transparent",
+							onClick: onEdit,
+							children: t("edit")
+						})]
+					}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+						className: "rounded-lg bg-gray-50 p-4",
+						children: billingAddress ? /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+							className: "space-y-1 text-sm text-gray-900",
+							children: [
+								billingAddress.name && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", { children: billingAddress.name }),
+								/* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", { children: billingAddress.address1 }),
+								billingAddress.address2 && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", { children: billingAddress.address2 }),
+								/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("p", { children: [
+									billingAddress.city,
+									", ",
+									billingAddress.state,
+									" ",
+									billingAddress.zip
+								] }),
+								/* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", { children: billingAddress.country_code })
+							]
+						}) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
+							className: "text-sm text-gray-500 italic",
+							children: t("no_billing_address")
+						})
+					})] })]
+				}),
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.DialogFooter, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.DialogClose, {
+					asChild: true,
+					children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.Button, {
+						className: "rounded bg-gray-50 p-3 text-gray-900 ring-1 ring-gray-300 hover:bg-gray-100",
+						onClick: onClose,
+						children: t("close")
+					})
+				}) })
+			]
+		})
+	});
+}
+//#endregion
+//#region ../../profile/ui/src/components/edit-payment-method-dialog.tsx
+const editPaymentMethodFormSchema = zod.z.object({
+	billing_address: zod.z.object({
+		name: zod.z.string().min(1, "Name is required"),
+		address1: zod.z.string().min(1, "Address line 1 is required"),
+		address2: zod.z.string().optional().nullable(),
+		city: zod.z.string().min(1, "City is required"),
+		state: zod.z.string().min(1, "State is required"),
+		zip: zod.z.string().min(1, "Zip code is required"),
+		country_code: zod.z.string().min(1, "Country is required")
+	}),
+	set_as_default: zod.z.boolean()
+});
+function EditPaymentMethodDialog({ isOpen, paymentMethod, billingAddress, onClose, onSubmit, isSubmitting, error, countries = [] }) {
+	const { t } = useProfileUI();
+	const { control, handleSubmit, reset, setValue } = (0, react_hook_form.useForm)({
+		resolver: (0, _hookform_resolvers_zod.zodResolver)(editPaymentMethodFormSchema),
+		defaultValues: {
+			billing_address: {
+				name: "",
+				address1: "",
+				address2: "",
+				city: "",
+				state: "",
+				zip: "",
+				country_code: "US"
+			},
+			set_as_default: false
+		}
+	});
+	const billingCountry = (0, react_hook_form.useWatch)({
+		control,
+		name: "billing_address.country_code"
+	});
+	const setAsDefault = (0, react_hook_form.useWatch)({
+		control,
+		name: "set_as_default"
+	});
+	const { stateOptions, config, handleCountryChange } = useCountryStates();
+	const countryOptions = [...countries].map((country) => ({
+		name: country.name,
+		value: country.iso
+	})).sort((a, b) => {
+		if (a.value === billingCountry) return -1;
+		if (b.value === billingCountry) return 1;
+		return a.name.localeCompare(b.name);
+	});
+	const stateSelectOptions = stateOptions.map((state) => ({
+		name: state.name,
+		value: state.isoCode
+	}));
+	(0, react.useEffect)(() => {
+		if (paymentMethod && isOpen) reset({
+			billing_address: {
+				name: billingAddress?.name ?? "",
+				address1: billingAddress?.address1 ?? "",
+				address2: billingAddress?.address2 ?? "",
+				city: billingAddress?.city ?? "",
+				state: billingAddress?.state ?? "",
+				zip: billingAddress?.zip ?? "",
+				country_code: billingAddress?.country_code ?? "US"
+			},
+			set_as_default: paymentMethod.default
+		});
+	}, [
+		paymentMethod,
+		billingAddress,
+		isOpen,
+		reset
+	]);
+	const handleCountrySelect = (countryCode) => {
+		handleCountryChange(countryCode);
+		setValue("billing_address.country_code", countryCode, { shouldValidate: true });
+	};
+	const handleFormSubmit = handleSubmit((data) => {
+		onSubmit(data);
+	});
+	if (!paymentMethod) return null;
+	const { details } = paymentMethod;
+	const cardBrand = details.card_type ?? "Card";
+	const lastFour = details.last_four ?? "****";
+	const expMonth = details.exp_month;
+	const expYear = details.exp_year;
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.Dialog, {
+		open: isOpen,
+		onOpenChange: (open) => !open && onClose(),
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_src.DialogContent, {
+			className: "max-h-[90vh] max-w-sm overflow-y-auto rounded md:max-w-lg",
+			children: [
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.DialogHeader, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.DialogTitle, {
+					className: "text-md font-medium",
+					children: t("edit_card")
+				}) }),
+				/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+					className: "space-y-4",
+					children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+						className: "rounded-lg bg-gray-50 p-4",
+						children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+							className: "flex items-center space-x-3",
+							children: [details.logo_url && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+								className: "h-6 w-10 flex-shrink-0",
+								children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("img", {
+									src: details.logo_url,
+									alt: cardBrand,
+									width: 40,
+									height: 24,
+									className: "object-contain"
+								})
+							}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+								className: "flex flex-col",
+								children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
+									className: "text-sm font-medium text-gray-900",
+									children: [
+										cardBrand,
+										" •••• ",
+										lastFour
+									]
+								}), expMonth != null && expYear != null && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
+									className: "text-sm text-gray-500",
+									children: [
+										t("card_expires"),
+										" ",
+										expMonth,
+										"/",
+										expYear
+									]
+								})]
+							})]
+						})
+					}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("h3", {
+						className: "mb-1 text-sm font-medium text-gray-900",
+						children: t("billing_address")
+					}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+						className: "space-y-0",
+						children: [
+							/* @__PURE__ */ (0, react_jsx_runtime.jsx)(FormSelectField$1, {
+								control,
+								name: "billing_address.country_code",
+								label: t("country"),
+								options: countryOptions,
+								placeholder: t("select_an_option"),
+								onChange: (val) => {
+									handleCountrySelect(val);
+								}
+							}),
+							/* @__PURE__ */ (0, react_jsx_runtime.jsx)(FormTextField$1, {
+								control,
+								name: "billing_address.name",
+								label: t("name")
+							}),
+							/* @__PURE__ */ (0, react_jsx_runtime.jsx)(FormTextField$1, {
+								control,
+								name: "billing_address.address1",
+								label: t("address_line_1")
+							}),
+							/* @__PURE__ */ (0, react_jsx_runtime.jsx)(FormTextField$1, {
+								control,
+								name: "billing_address.address2",
+								label: t("address_line_2")
+							}),
+							/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+								className: "sm:flex sm:gap-2",
+								children: [
+									/* @__PURE__ */ (0, react_jsx_runtime.jsx)(FormTextField$1, {
+										control,
+										name: "billing_address.city",
+										label: t("city"),
+										containerClassName: "flex-1"
+									}),
+									/* @__PURE__ */ (0, react_jsx_runtime.jsx)(FormSelectField$1, {
+										control,
+										name: "billing_address.state",
+										label: config?.regionLabel ? t(config.regionLabel) : t("state"),
+										options: stateSelectOptions,
+										placeholder: t("select_state"),
+										containerClassName: "flex-1"
+									}),
+									/* @__PURE__ */ (0, react_jsx_runtime.jsx)(FormTextField$1, {
+										control,
+										name: "billing_address.zip",
+										label: config?.postalLabel ? t(config.postalLabel) : t("zip_code"),
+										containerClassName: "flex-1"
+									})
+								]
+							})
+						]
+					})] })]
+				}),
+				/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+					className: "mt-2 flex items-center space-x-2",
+					children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("input", {
+						type: "checkbox",
+						id: "set_as_default",
+						checked: setAsDefault,
+						onChange: () => setValue("set_as_default", !setAsDefault),
+						className: "h-4 w-4"
+					}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("label", {
+						htmlFor: "set_as_default",
+						className: "text-sm",
+						children: t("set_as_default_payment_method")
+					})]
+				}),
+				error && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+					className: "text-sm text-red-500",
+					children: error
+				}),
+				/* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_src.DialogFooter, {
+					className: "flex flex-row items-center justify-between",
+					children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+						className: "flex-2",
+						children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.Button, {
+							type: "button",
+							className: "rounded bg-gray-50 p-3 text-gray-900 ring-1 ring-gray-300 hover:bg-gray-100",
+							onClick: onClose,
+							disabled: isSubmitting,
+							children: t("cancel")
+						})
+					}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+						className: "flex-1 text-right",
+						children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.Button, {
+							type: "submit",
+							onClick: handleFormSubmit,
+							disabled: isSubmitting,
+							className: "rounded bg-gray-900 p-3 text-white hover:bg-gray-800",
+							children: isSubmitting ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", { className: "h-5 w-5 animate-spin rounded-full border-4 border-t-4 border-white border-t-transparent" }) : t("save")
+						})
+					})]
+				})
+			]
+		})
+	});
+}
+//#endregion
+//#region ../../profile/ui/src/components/payment-methods.tsx
+function PaymentMethods({ paymentMethods, isLoading = false, onDeletePaymentMethod, isDeletingPaymentMethod = false, onUpdatePaymentMethod, isUpdatingPaymentMethod = false, getBillingAddress, countries, renderCreditCardDialog }) {
+	const [isOpen, setIsOpen] = (0, react.useState)(false);
+	const [openDeleteDialog, setOpenDeleteDialog] = (0, react.useState)(false);
+	const [deleteCardError, setDeleteCardError] = (0, react.useState)(void 0);
+	const [selectedCreditCard, setSelectedCreditCard] = (0, react.useState)(void 0);
+	const [isViewOpen, setIsViewOpen] = (0, react.useState)(false);
+	const [isEditOpen, setIsEditOpen] = (0, react.useState)(false);
+	const [selectedPaymentMethod, setSelectedPaymentMethod] = (0, react.useState)(null);
+	const [editError, setEditError] = (0, react.useState)(void 0);
+	const { t } = useProfileUI();
+	const defaultPaymentMethod = paymentMethods.find((method) => method.default) ?? null;
+	const handleDeleteCard = async (cardId) => {
+		if (!cardId) return;
+		try {
+			await onDeletePaymentMethod(cardId);
+			setSelectedCreditCard(void 0);
+			setDeleteCardError(void 0);
+			setOpenDeleteDialog(false);
+		} catch {
+			setDeleteCardError("Unable to delete payment method. Please try again.");
+		}
+	};
+	const handleDeletePaymentMethod = (paymentMethod) => {
+		setSelectedCreditCard(paymentMethod);
+		requestAnimationFrame(() => {
+			setOpenDeleteDialog(true);
+		});
+	};
+	const handleViewPaymentMethod = (paymentMethod) => {
+		setSelectedPaymentMethod(paymentMethod);
+		requestAnimationFrame(() => {
+			setIsViewOpen(true);
+		});
+	};
+	const handleCloseViewDialog = () => {
+		setIsViewOpen(false);
+		setSelectedPaymentMethod(null);
+	};
+	const handleOpenEditFromView = () => {
+		setIsViewOpen(false);
+		setEditError(void 0);
+		requestAnimationFrame(() => {
+			setIsEditOpen(true);
+		});
+	};
+	const handleCloseEditDialog = () => {
+		setIsEditOpen(false);
+		setSelectedPaymentMethod(null);
+		setEditError(void 0);
+	};
+	const handleEditSubmit = async (data) => {
+		if (!selectedPaymentMethod) return;
+		try {
+			await onUpdatePaymentMethod(selectedPaymentMethod.id, data);
+			handleCloseEditDialog();
+			require_src.fluidToast({
+				title: t("default_payment_method_updated"),
+				type: "success"
+			});
+		} catch (error) {
+			console.error("Error updating payment method:", error);
+			require_src.fluidToast({
+				title: t("failed_to_set_default_payment_method"),
+				type: "error",
+				description: parseApiErrors(error)
+			});
+			if (error instanceof Error) setEditError(error.message);
+			else setEditError("An unexpected error occurred. Please try again.");
+		}
+	};
+	const handleOpenDialog = () => {
+		setIsOpen(true);
+	};
+	const handleCloseDialog = () => {
+		setIsOpen(false);
+	};
+	const selectedBillingAddress = selectedPaymentMethod ? getBillingAddress?.(selectedPaymentMethod) ?? null : null;
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [
+		/* @__PURE__ */ (0, react_jsx_runtime.jsx)(PaymentMethodDropdown, {
+			title: t("payment_methods"),
+			displayPaymentMethod: defaultPaymentMethod,
+			paymentMethodList: paymentMethods,
+			onAddPaymentMethodClick: handleOpenDialog,
+			onEditPaymentMethod: handleViewPaymentMethod,
+			onDeletePaymentMethod: handleDeletePaymentMethod,
+			addPaymentMethodLabel: `+ ${t("add_payment_method")}`,
+			isLoading
+		}),
+		renderCreditCardDialog?.({
+			isOpen,
+			onClose: handleCloseDialog
+		}),
+		/* @__PURE__ */ (0, react_jsx_runtime.jsx)(ConfirmActionDialog, {
+			title: t("delete_credit_card"),
+			description: t("delete_credit_card_message"),
+			actionText: t("delete"),
+			onAction: () => handleDeleteCard(selectedCreditCard?.id ?? null),
+			openDialog: openDeleteDialog,
+			setOpenDialog: setOpenDeleteDialog,
+			errorMsg: deleteCardError,
+			isLoading: isDeletingPaymentMethod
+		}),
+		/* @__PURE__ */ (0, react_jsx_runtime.jsx)(ViewPaymentMethodDialog, {
+			isOpen: isViewOpen,
+			paymentMethod: selectedPaymentMethod,
+			billingAddress: selectedBillingAddress,
+			onClose: handleCloseViewDialog,
+			onEdit: handleOpenEditFromView
+		}),
+		/* @__PURE__ */ (0, react_jsx_runtime.jsx)(EditPaymentMethodDialog, {
+			isOpen: isEditOpen,
+			paymentMethod: selectedPaymentMethod,
+			billingAddress: selectedBillingAddress,
+			onClose: handleCloseEditDialog,
+			onSubmit: handleEditSubmit,
+			isSubmitting: isUpdatingPaymentMethod,
+			error: editError,
+			countries
+		})
+	] });
+}
+//#endregion
+//#region ../../profile/ui/src/components/profile.tsx
+function Profile({ customerAccount, languages, onUpdateCustomer, isUpdatingCustomer, rewardsPointsEnabled = false, pointsLedger, isLoadingPointsLedger, addresses, isLoadingAddresses, onDeleteAddress, isDeletingAddress, renderAddressDialog, paymentMethods, isLoadingPaymentMethods, onDeletePaymentMethod, isDeletingPaymentMethod, onUpdatePaymentMethod, isUpdatingPaymentMethod, getBillingAddress, countries, renderCreditCardDialog }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [
+		/* @__PURE__ */ (0, react_jsx_runtime.jsx)(CustomerInfo, {
+			customerAccount,
+			languages,
+			onUpdateCustomer,
+			isUpdating: isUpdatingCustomer
+		}),
+		rewardsPointsEnabled && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(CustomerPointsLedger, {
+			pointsLedger: pointsLedger ?? [],
+			isLoading: isLoadingPointsLedger
+		}),
+		/* @__PURE__ */ (0, react_jsx_runtime.jsx)(Addresses, {
+			addresses,
+			isLoading: isLoadingAddresses,
+			onDeleteAddress,
+			isDeletingAddress,
+			renderAddressDialog
+		}),
+		/* @__PURE__ */ (0, react_jsx_runtime.jsx)(PaymentMethods, {
+			paymentMethods,
+			isLoading: isLoadingPaymentMethods,
+			onDeletePaymentMethod,
+			isDeletingPaymentMethod,
+			onUpdatePaymentMethod,
+			isUpdatingPaymentMethod,
+			getBillingAddress,
+			countries,
+			renderCreditCardDialog
+		})
+	] });
+}
+//#endregion
+//#region ../../fluid-pay/ui/src/components/form-fields/FormTextField.tsx
+function FormTextField({ control, name, placeholder, containerClassName, type, disabled, inputMode }) {
+	const { field, fieldState: { error } } = (0, react_hook_form.useController)({
+		name,
+		control
+	});
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		className: require_src.cn("space-y-1", containerClassName),
+		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.Input, {
+			...field,
+			value: field.value ?? "",
+			id: name,
+			type,
+			disabled,
+			inputMode,
+			placeholder,
+			"aria-invalid": !!error
+		}), error?.message && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
+			className: "text-sm text-red-500",
+			children: error.message
+		})]
+	});
+}
+//#endregion
+//#region ../../fluid-pay/ui/src/components/form-fields/FormSelectField.tsx
+function FormSelectField({ control, name, placeholder = "Select", options, containerClassName, disabled }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+		className: require_src.cn("space-y-1", containerClassName),
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_hook_form.Controller, {
+			control,
+			name,
+			render: ({ field: { onChange, value }, fieldState: { error } }) => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_src.Select, {
+				value: value?.toString() ?? "",
+				onValueChange: onChange,
+				disabled,
+				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.SelectTrigger, {
+					"aria-invalid": !!error,
+					className: require_src.cn("w-full", error && "border-red-500 ring-1 ring-red-500"),
+					children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.SelectValue, { placeholder })
+				}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.SelectContent, { children: options && options.length > 0 ? options.map((opt) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.SelectItem, {
+					value: opt.value.toString(),
+					children: opt.name
+				}, opt.value.toString())) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.SelectItem, {
+					value: "__empty",
+					disabled: true,
+					children: "No available options"
+				}) })]
+			}), error?.message && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
+				className: "text-sm text-red-500",
+				children: error.message
+			})] })
+		})
+	});
+}
+//#endregion
+//#region ../../fluid-pay/ui/src/components/AddressFormDialog.tsx
+const addressFormSchema = zod.z.object({
+	first_name: zod.z.string().min(1, "First name is required"),
+	last_name: zod.z.string().min(1, "Last name is required"),
+	address1: zod.z.string().min(1, "Address line 1 is required"),
+	address2: zod.z.string().optional().nullable(),
+	city: zod.z.string().min(1, "City is required"),
+	state: zod.z.string().min(1, "State is required"),
+	postal_code: zod.z.string().min(1, "Postal code is required"),
+	country_code: zod.z.string().min(1, "Country is required"),
+	default: zod.z.boolean()
+});
+function AddressFormDialog({ isOpen, onClose, selectedAddress, onSubmit, isSubmitting, countries = [], error, renderAddressAutocomplete, t }) {
+	const { control, handleSubmit, reset, setValue } = (0, react_hook_form.useForm)({
+		resolver: (0, _hookform_resolvers_zod.zodResolver)(addressFormSchema),
+		defaultValues: {
+			first_name: "",
+			last_name: "",
+			address1: "",
+			address2: "",
+			city: "",
+			state: "",
+			postal_code: "",
+			country_code: "US",
+			default: false
+		}
+	});
+	const selectedCountryCode = (0, react_hook_form.useWatch)({
+		control,
+		name: "country_code"
+	});
+	const isDefault = (0, react_hook_form.useWatch)({
+		control,
+		name: "default"
+	});
+	const { stateOptions, config, handleCountryChange } = useCountryStates();
+	const countrySelectOptions = [...countries].map((country) => ({
+		name: country.name,
+		value: country.iso
+	})).sort((a, b) => {
+		if (a.value === selectedCountryCode) return -1;
+		if (b.value === selectedCountryCode) return 1;
+		return a.name.localeCompare(b.name);
+	});
+	const stateSelectOptions = stateOptions.map((state) => ({
+		name: state.name,
+		value: state.isoCode
+	}));
+	(0, react.useEffect)(() => {
+		if (isOpen) if (selectedAddress) {
+			const nameParts = (selectedAddress.name ?? "").split(" ");
+			reset({
+				first_name: nameParts[0] ?? "",
+				last_name: nameParts.slice(1).join(" "),
+				address1: selectedAddress.address1,
+				address2: selectedAddress.address2 ?? "",
+				city: selectedAddress.city,
+				state: selectedAddress.state,
+				postal_code: selectedAddress.postal_code,
+				country_code: selectedAddress.country_code ?? "US",
+				default: selectedAddress.default
+			});
+			handleCountryChange(selectedAddress.country_code ?? "US");
+		} else {
+			reset({
+				first_name: "",
+				last_name: "",
+				address1: "",
+				address2: "",
+				city: "",
+				state: "",
+				postal_code: "",
+				country_code: "US",
+				default: false
+			});
+			handleCountryChange("US");
+		}
+	}, [
+		selectedAddress,
+		isOpen,
+		reset,
+		handleCountryChange
+	]);
+	(0, react.useEffect)(() => {
+		handleCountryChange(selectedCountryCode);
+	}, [selectedCountryCode, handleCountryChange]);
+	const handleFormSubmit = handleSubmit((data) => {
+		onSubmit({ address: {
+			first_name: data.first_name,
+			last_name: data.last_name,
+			address1: data.address1,
+			address2: data.address2 ?? null,
+			city: data.city,
+			state: data.state,
+			postal_code: data.postal_code,
+			country_code: data.country_code,
+			default: data.default
+		} });
+	});
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.Dialog, {
+		open: isOpen,
+		onOpenChange: (open) => !open && onClose(),
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_src.DialogContent, {
+			className: "max-h-[90vh] max-w-md overflow-y-auto rounded md:max-w-xl",
+			children: [
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.DialogHeader, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.DialogTitle, {
+					className: "text-lg font-medium",
+					children: selectedAddress !== null ? t("edit_address") : t("add_an_address")
+				}) }),
+				/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+					className: "space-y-3 pt-2",
+					children: [
+						/* @__PURE__ */ (0, react_jsx_runtime.jsx)(FormSelectField, {
+							control,
+							name: "country_code",
+							placeholder: t("country"),
+							options: countrySelectOptions,
+							disabled: isSubmitting
+						}),
+						/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+							className: "flex gap-3",
+							children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(FormTextField, {
+								control,
+								name: "first_name",
+								placeholder: t("first_name"),
+								containerClassName: "flex-1",
+								disabled: isSubmitting
+							}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(FormTextField, {
+								control,
+								name: "last_name",
+								placeholder: t("last_name"),
+								containerClassName: "flex-1",
+								disabled: isSubmitting
+							})]
+						}),
+						renderAddressAutocomplete ? renderAddressAutocomplete({
+							control,
+							setValue,
+							countryCode: selectedCountryCode
+						}) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)(FormTextField, {
+							control,
+							name: "address1",
+							placeholder: t("address_line_1"),
+							disabled: isSubmitting
+						}),
+						/* @__PURE__ */ (0, react_jsx_runtime.jsx)(FormTextField, {
+							control,
+							name: "address2",
+							placeholder: t("address_line_2"),
+							disabled: isSubmitting
+						}),
+						/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+							className: "flex gap-3",
+							children: [
+								/* @__PURE__ */ (0, react_jsx_runtime.jsx)(FormTextField, {
+									control,
+									name: "city",
+									placeholder: t("city"),
+									containerClassName: "flex-1",
+									disabled: isSubmitting
+								}),
+								/* @__PURE__ */ (0, react_jsx_runtime.jsx)(FormSelectField, {
+									control,
+									name: "state",
+									placeholder: config?.regionLabel ? t(config.regionLabel) : t("select_state"),
+									options: stateSelectOptions,
+									containerClassName: "flex-1",
+									disabled: isSubmitting
+								}),
+								/* @__PURE__ */ (0, react_jsx_runtime.jsx)(FormTextField, {
+									control,
+									name: "postal_code",
+									placeholder: config?.postalLabel ? t(config.postalLabel) : t("zip_code"),
+									containerClassName: "flex-1",
+									disabled: isSubmitting
+								})
+							]
+						})
+					]
+				}),
+				/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+					className: "mt-4 flex items-center justify-between",
+					children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+						className: "flex items-center space-x-2",
+						children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("input", {
+							type: "checkbox",
+							id: "set_as_default_address",
+							checked: isDefault,
+							onChange: () => setValue("default", !isDefault),
+							disabled: isSubmitting,
+							className: "h-4 w-4"
+						}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("label", {
+							htmlFor: "set_as_default_address",
+							className: "text-sm",
+							children: t("set_as_default_address")
+						})]
+					}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.Button, {
+						type: "submit",
+						onClick: handleFormSubmit,
+						disabled: isSubmitting,
+						className: "rounded bg-gray-900 px-5 py-2.5 text-white hover:bg-gray-800",
+						children: isSubmitting ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", { className: "h-5 w-5 animate-spin rounded-full border-4 border-t-4 border-white border-t-transparent" }) : t("save_address")
+					})]
+				}),
+				error && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+					className: "mt-2 text-sm text-red-500",
+					children: error
+				})
+			]
+		})
+	});
+}
+//#endregion
+//#region ../../fluid-pay/ui/src/hooks/use-vgs-collect.ts
+const getVGSCollect = () => {
+	if (typeof window !== "undefined") return window.VGSCollect || null;
+	return null;
+};
+const DEFAULT_FIELD_STATE = {
+	card_number: {
+		isFocused: false,
+		isValid: false,
+		isEmpty: true
+	},
+	card_exp: {
+		isFocused: false,
+		isValid: false,
+		isEmpty: true
+	},
+	card_cvc: {
+		isFocused: false,
+		isValid: false,
+		isEmpty: true
+	},
+	card_holder: {
+		isFocused: false,
+		isValid: false,
+		isEmpty: true
+	}
+};
+function useVgsCollect() {
+	const [isFormReady, setIsFormReady] = (0, react.useState)(false);
+	const [isLoading, setIsLoading] = (0, react.useState)(false);
+	const [isScriptLoaded, setIsScriptLoaded] = (0, react.useState)(false);
+	const [vgsFieldState, setVgsFieldState] = (0, react.useState)(DEFAULT_FIELD_STATE);
+	const formRef = (0, react.useRef)(null);
+	const onSuccessRef = (0, react.useRef)(null);
+	const onErrorRef = (0, react.useRef)(null);
+	(0, react.useEffect)(() => {
+		if (typeof window === "undefined") return;
+		if (getVGSCollect()) {
+			const timeoutId = window.setTimeout(() => {
+				setIsScriptLoaded(true);
+			}, 0);
+			return () => window.clearTimeout(timeoutId);
+		}
+		if (isScriptLoaded) return;
+		const script = document.createElement("script");
+		script.src = "https://js.verygoodvault.com/vgs-collect/3.3.0/vgs-collect.js";
+		script.async = true;
+		script.onload = () => setIsScriptLoaded(true);
+		script.onerror = () => onErrorRef.current?.("Failed to load payment form");
+		document.head.appendChild(script);
+	}, [isScriptLoaded]);
+	const updateFieldState = (0, react.useCallback)((state) => {
+		if (!state) return;
+		setVgsFieldState((prev) => {
+			const newState = { ...prev };
+			let hasChanges = false;
+			Object.keys(state).forEach((key) => {
+				const field = state[key];
+				if (!field) return;
+				const next = {
+					isFocused: !!field.isFocused,
+					isValid: !!field.isValid,
+					isEmpty: !!field.isEmpty
+				};
+				if (!newState[key] || JSON.stringify(newState[key]) !== JSON.stringify(next)) {
+					newState[key] = next;
+					hasChanges = true;
+				}
+			});
+			return hasChanges ? newState : prev;
+		});
+	}, []);
+	const resetVgs = (0, react.useCallback)(() => {
+		if (formRef.current) {
+			try {
+				formRef.current.unmount();
+			} catch (e) {
+				console.warn("VGS unmount error", e);
+			}
+			formRef.current = null;
+		}
+		setIsFormReady(false);
+		setVgsFieldState({ ...DEFAULT_FIELD_STATE });
+	}, []);
+	const initializeForm = (0, react.useCallback)(async (credentials) => {
+		if (!isScriptLoaded) return;
+		const VGSCollect = getVGSCollect();
+		if (!VGSCollect) {
+			onErrorRef.current?.("Payment script not loaded");
+			return;
+		}
+		try {
+			setIsLoading(true);
+			const vgsEnvironment = credentials.vault.environment === "sandbox" ? "sandbox" : "live-eu-1";
+			const form = VGSCollect.create(credentials.vault.vault_id, vgsEnvironment, (state) => updateFieldState(state));
+			if (credentials.vault.route_id) form.setRouteId(credentials.vault.route_id);
+			formRef.current = form;
+			let retries = 0;
+			const maxRetries = 20;
+			const retryDelay = 200;
+			const waitForDom = async () => {
+				if ([
+					"vgs-card-number",
+					"vgs-expiration-date",
+					"vgs-cvc",
+					"vgs-card-holder"
+				].every((id) => {
+					const el = document.getElementById(id);
+					return el && el.isConnected;
+				})) return true;
+				if (retries >= maxRetries) return false;
+				retries++;
+				await new Promise((resolve) => setTimeout(resolve, retryDelay));
+				return waitForDom();
+			};
+			if (!await waitForDom()) throw new Error("Payment form elements not ready");
+			const css = {
+				fontSize: "14px",
+				fontFamily: "-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif",
+				color: "#1f2937",
+				paddingTop: "0px",
+				paddingBottom: "0px",
+				paddingLeft: "0px",
+				paddingRight: "0px",
+				boxSizing: "border-box",
+				lineHeight: "38px",
+				height: "100%",
+				width: "100%",
+				"&::placeholder": {
+					color: "#9ca3af",
+					opacity: 1
+				},
+				"&:focus": { outline: "none" }
+			};
+			form.field("#vgs-card-number", {
+				type: "card-number",
+				name: "card_number",
+				placeholder: "0000 0000 0000 0000",
+				showCardIcon: true,
+				css: {
+					...css,
+					paddingRight: "40px"
+				},
+				autoComplete: "cc-number",
+				validations: ["required", "validCardNumber"]
+			});
+			form.field("#vgs-expiration-date", {
+				type: "card-expiration-date",
+				name: "card_exp",
+				yearLength: 2,
+				placeholder: "MM / YY",
+				css,
+				autoComplete: "cc-exp",
+				validations: ["required", "validCardExpirationDate"]
+			});
+			form.field("#vgs-cvc", {
+				type: "card-security-code",
+				name: "card_cvc",
+				placeholder: "123",
+				css,
+				autoComplete: "cc-csc",
+				validations: ["required", "validCardSecurityCode"]
+			});
+			form.field("#vgs-card-holder", {
+				type: "text",
+				name: "card_holder",
+				placeholder: "Full Name",
+				css,
+				autoComplete: "cc-name",
+				validations: ["required"]
+			});
+			setIsFormReady(true);
+		} catch (error) {
+			console.error("Failed to initialize VGS:", error);
+			onErrorRef.current?.("Failed to initialize payment form");
+		} finally {
+			setIsLoading(false);
+		}
+	}, [isScriptLoaded, updateFieldState]);
+	const submitCard = (0, react.useCallback)(() => {
+		if (!formRef.current) {
+			onErrorRef.current?.("Form not initialized");
+			return;
+		}
+		formRef.current.submit(`/post`, {}, (status, response) => {
+			if (status >= 200 && status < 400) onSuccessRef.current?.(response);
+			else onErrorRef.current?.("Payment failed");
+		}, (errors) => {
+			const allErrors = Object.values(errors).flat().filter((msg) => typeof msg === "string" && msg.trim().length > 0 && msg !== "Required");
+			const uniqueErrors = Array.from(new Set(allErrors));
+			let errorMsg = "Please verify your payment details.";
+			if (uniqueErrors.length > 0) errorMsg = uniqueErrors.join(", ");
+			else if (Object.values(errors).flat().length > 0) errorMsg = "Please fill in all required fields.";
+			onErrorRef.current?.(errorMsg);
+		});
+	}, []);
+	(0, react.useEffect)(() => {
+		return () => {
+			if (formRef.current) {
+				try {
+					formRef.current.unmount();
+				} catch (e) {
+					console.warn("VGS unmount error", e);
+				}
+				formRef.current = null;
+			}
+		};
+	}, []);
+	return {
+		isFormReady,
+		isLoading,
+		isScriptLoaded,
+		initializeForm,
+		submitCard,
+		vgsFieldState,
+		resetVgs,
+		onSuccessRef,
+		onErrorRef
+	};
+}
+//#endregion
+//#region ../../fluid-pay/ui/src/components/CreditCardFormDialog.tsx
+const billingAddressSchema = zod.z.object({
+	name: zod.z.string().min(1, "Name is required"),
+	address1: zod.z.string().min(1, "Address line 1 is required"),
+	address2: zod.z.string().optional().nullable(),
+	city: zod.z.string().min(1, "City is required"),
+	state: zod.z.string().min(1, "State is required"),
+	zip: zod.z.string().min(1, "Zip code is required"),
+	country_code: zod.z.string().min(1, "Country is required"),
+	set_as_default: zod.z.boolean()
+});
+function VgsInputWrapper({ id, fieldState, className }) {
+	const isInvalid = fieldState?.isValid === false && !fieldState?.isFocused && !fieldState?.isEmpty;
+	const isFocused = fieldState?.isFocused;
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+		className: "w-full",
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+			id,
+			className: require_src.cn("relative flex h-10 w-full items-center rounded-md border border-gray-300 bg-white px-3 shadow-sm transition-all duration-200 ease-in-out", "[&_iframe]:block! [&_iframe]:h-full! [&_iframe]:w-full!", isFocused && "border-blue-600 ring-1 ring-blue-600", isInvalid && "border-red-500 ring-1 ring-red-500", className)
+		})
+	});
+}
+function VgsCardForm({ isLoading, isFormReady, vgsFieldState, networkError, t }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		className: "space-y-4",
+		"aria-label": "Credit card form",
+		children: [
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)(VgsInputWrapper, {
+				id: "vgs-card-number",
+				fieldState: vgsFieldState["card_number"]
+			}),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+				className: "flex gap-3",
+				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+					className: "flex-1",
+					children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(VgsInputWrapper, {
+						id: "vgs-expiration-date",
+						fieldState: vgsFieldState["card_exp"]
+					})
+				}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+					className: "flex-1",
+					children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(VgsInputWrapper, {
+						id: "vgs-cvc",
+						fieldState: vgsFieldState["card_cvc"]
+					})
+				})]
+			}),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)(VgsInputWrapper, {
+				id: "vgs-card-holder",
+				fieldState: vgsFieldState["card_holder"]
+			}),
+			networkError && networkError.trim().length > 0 && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+				className: "rounded-md bg-red-50 p-3 text-sm text-red-600",
+				children: networkError
+			})
+		]
+	});
+}
+function CreditCardFormDialog({ isOpen, onClose, onSubmit, isSubmitting, countries = [], error, jwt, client, renderAddressAutocomplete, t }) {
+	const [cardError, setCardError] = (0, react.useState)(void 0);
+	const [isVgsSubmitting, setIsVgsSubmitting] = (0, react.useState)(false);
+	const { isFormReady, isLoading: isVgsLoading, isScriptLoaded, initializeForm, submitCard, vgsFieldState, resetVgs, onSuccessRef, onErrorRef } = useVgsCollect();
+	const { control, handleSubmit, reset, setValue } = (0, react_hook_form.useForm)({
+		resolver: (0, _hookform_resolvers_zod.zodResolver)(billingAddressSchema),
+		defaultValues: {
+			name: "",
+			address1: "",
+			address2: "",
+			city: "",
+			state: "",
+			zip: "",
+			country_code: "US",
+			set_as_default: false
+		}
+	});
+	const billingCountry = (0, react_hook_form.useWatch)({
+		control,
+		name: "country_code"
+	});
+	const setAsDefault = (0, react_hook_form.useWatch)({
+		control,
+		name: "set_as_default"
+	});
+	const { stateOptions, config, handleCountryChange } = useCountryStates();
+	const countrySelectOptions = [...countries].map((country) => ({
+		name: country.name,
+		value: country.iso
+	})).sort((a, b) => {
+		if (a.value === billingCountry) return -1;
+		if (b.value === billingCountry) return 1;
+		return a.name.localeCompare(b.name);
+	});
+	const stateSelectOptions = stateOptions.map((state) => ({
+		name: state.name,
+		value: state.isoCode
+	}));
+	(0, react.useEffect)(() => {
+		handleCountryChange(billingCountry);
+	}, [billingCountry, handleCountryChange]);
+	(0, react.useEffect)(() => {
+		if (!isOpen || !isScriptLoaded || !jwt) return;
+		let cancelled = false;
+		const init = async () => {
+			try {
+				const credentials = await fetchVaultCredentialsForPaymentAccount(client, jwt);
+				if (!cancelled) await initializeForm(credentials);
+			} catch (err) {
+				console.error("Failed to fetch vault credentials:", err);
+				if (!cancelled) setCardError("Failed to initialize payment form");
+			}
+		};
+		init();
+		return () => {
+			cancelled = true;
+		};
+	}, [
+		isOpen,
+		isScriptLoaded,
+		jwt,
+		client,
+		initializeForm
+	]);
+	const handleVgsSuccess = (0, react.useCallback)((response) => {
+		const expValue = response?.card_exp;
+		if (!expValue) {
+			setCardError("Missing expiration date from payment form");
+			setIsVgsSubmitting(false);
+			return;
+		}
+		const [expMonth, expYearShort] = expValue.replace(/\s+/g, "").split("/");
+		if (!expMonth || !expYearShort) {
+			setCardError("Invalid expiration date format");
+			setIsVgsSubmitting(false);
+			return;
+		}
+		const expYear = expYearShort.length === 2 ? `20${expYearShort}` : expYearShort;
+		const cardholderName = response?.card_holder?.trim();
+		if (!cardholderName) {
+			setCardError("Cardholder name is required");
+			setIsVgsSubmitting(false);
+			return;
+		}
+		handleSubmit((formData) => {
+			onSubmit({
+				type: "credit_card",
+				country_code: formData.country_code,
+				default_payment_method: formData.set_as_default,
+				payment_method: {
+					token: response.card_number,
+					cvv_token: response.card_cvc,
+					exp_month: expMonth,
+					exp_year: expYear,
+					card_holder: cardholderName,
+					billing_zip: formData.zip
+				},
+				billing_address: {
+					name: formData.name,
+					address1: formData.address1,
+					address2: formData.address2 ?? void 0,
+					city: formData.city,
+					state: formData.state,
+					zip: formData.zip,
+					country_code: formData.country_code
+				}
+			});
+			setIsVgsSubmitting(false);
+		})();
+	}, [handleSubmit, onSubmit]);
+	const handleVgsError = (0, react.useCallback)((err) => {
+		setCardError(err);
+		setIsVgsSubmitting(false);
+	}, []);
+	(0, react.useEffect)(() => {
+		onSuccessRef.current = handleVgsSuccess;
+		onErrorRef.current = handleVgsError;
+	}, [
+		handleVgsSuccess,
+		handleVgsError,
+		onSuccessRef,
+		onErrorRef
+	]);
+	const handleClose = () => {
+		resetVgs();
+		reset();
+		setCardError(void 0);
+		setIsVgsSubmitting(false);
+		onClose();
+	};
+	const handleFormSubmit = handleSubmit(() => {
+		setIsVgsSubmitting(true);
+		setCardError(void 0);
+		submitCard();
+	});
+	const isBusy = isSubmitting || isVgsSubmitting;
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.Dialog, {
+		open: isOpen,
+		onOpenChange: (open) => !open && handleClose(),
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.DialogContent, {
+			className: "max-h-[90vh] max-w-md overflow-y-auto rounded p-0 md:max-w-xl",
+			children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+				className: "relative p-6",
+				children: [
+					(isVgsLoading || !isFormReady) && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+						className: "absolute inset-0 z-10 flex items-center justify-center rounded bg-white/80 backdrop-blur-[1px]",
+						children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+							className: "flex items-center justify-center",
+							children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", { className: "mr-3 h-5 w-5 animate-spin rounded-full border-2 border-t-2 border-blue-600 border-t-transparent" }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
+								className: "text-sm font-medium text-gray-600",
+								children: t("securing")
+							})]
+						})
+					}),
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.DialogHeader, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.DialogTitle, {
+						className: "text-lg font-medium",
+						children: t("add_credit_card")
+					}) }),
+					/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+						className: "space-y-4 pt-6",
+						children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(VgsCardForm, {
+							isLoading: isVgsLoading,
+							isFormReady,
+							vgsFieldState,
+							networkError: cardError ?? error,
+							t
+						}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+							className: "space-y-3 pt-2",
+							children: [
+								/* @__PURE__ */ (0, react_jsx_runtime.jsx)("h3", {
+									className: "text-sm font-medium text-gray-500",
+									children: t("billing_address")
+								}),
+								/* @__PURE__ */ (0, react_jsx_runtime.jsx)(FormSelectField, {
+									control,
+									name: "country_code",
+									placeholder: t("country"),
+									options: countrySelectOptions,
+									disabled: isBusy
+								}),
+								/* @__PURE__ */ (0, react_jsx_runtime.jsx)(FormTextField, {
+									control,
+									name: "name",
+									placeholder: t("name"),
+									disabled: isBusy
+								}),
+								renderAddressAutocomplete ? renderAddressAutocomplete({
+									control,
+									setValue,
+									countryCode: billingCountry
+								}) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)(FormTextField, {
+									control,
+									name: "address1",
+									placeholder: t("address_line_1"),
+									disabled: isBusy
+								}),
+								/* @__PURE__ */ (0, react_jsx_runtime.jsx)(FormTextField, {
+									control,
+									name: "address2",
+									placeholder: t("address_line_2"),
+									disabled: isBusy
+								}),
+								/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+									className: "flex gap-3",
+									children: [
+										/* @__PURE__ */ (0, react_jsx_runtime.jsx)(FormTextField, {
+											control,
+											name: "city",
+											placeholder: t("city"),
+											containerClassName: "flex-1",
+											disabled: isBusy
+										}),
+										/* @__PURE__ */ (0, react_jsx_runtime.jsx)(FormSelectField, {
+											control,
+											name: "state",
+											placeholder: config?.regionLabel ? t(config.regionLabel) : t("select_state"),
+											options: stateSelectOptions,
+											containerClassName: "flex-1",
+											disabled: isBusy
+										}),
+										/* @__PURE__ */ (0, react_jsx_runtime.jsx)(FormTextField, {
+											control,
+											name: "zip",
+											placeholder: config?.postalLabel ? t(config.postalLabel) : t("zip_code"),
+											containerClassName: "flex-1",
+											disabled: isBusy
+										})
+									]
+								})
+							]
+						})]
+					}),
+					/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+						className: "mt-4 flex items-center justify-between",
+						children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+							className: "flex items-center space-x-2",
+							children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("input", {
+								type: "checkbox",
+								id: "set_as_default_cc",
+								checked: setAsDefault,
+								onChange: () => setValue("set_as_default", !setAsDefault),
+								disabled: isBusy,
+								className: "h-4 w-4"
+							}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("label", {
+								htmlFor: "set_as_default_cc",
+								className: "text-sm",
+								children: t("set_as_default_payment_method")
+							})]
+						}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_src.Button, {
+							type: "submit",
+							onClick: handleFormSubmit,
+							disabled: isBusy,
+							className: "rounded bg-gray-900 px-5 py-2.5 text-white hover:bg-gray-800",
+							children: isBusy ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", { className: "h-5 w-5 animate-spin rounded-full border-4 border-t-4 border-white border-t-transparent" }) : t("save_card")
+						})]
+					})
+				]
+			})
+		})
+	});
+}
+//#endregion
+//#region src/screens/ProfileContentScreen.tsx
+const translations = {
+	edit_profile: "Edit Profile",
+	first_name: "First Name",
+	last_name: "Last Name",
+	phone_number: "Phone Number",
+	language: "Language",
+	first_name_is_required: "First name is required",
+	last_name_is_required: "Last name is required",
+	language_is_required: "Language is required",
+	saving: "Saving...",
+	save_changes: "Save Changes",
+	select_an_option: "Select an option",
+	points_history: "Points History",
+	points_available: "Points Available",
+	points_awarded: "Points Awarded",
+	points_redeemed: "Points Redeemed",
+	transaction: "Transaction",
+	no_points_history_found: "No points history found",
+	shipping_addresses: "Shipping Addresses",
+	add_an_address: "Add an Address",
+	delete_address: "Delete Address",
+	delete_address_message: "Are you sure you want to delete this address? This action cannot be undone.",
+	delete: "Delete",
+	add_address: "Add Address",
+	edit_address: "Edit Address",
+	set_as_default_address: "Set as default address",
+	save_address: "Save Address",
+	card_number: "Card Number",
+	expiration_date: "Expiration (MM / YY)",
+	cvc: "CVC",
+	cardholder_name: "Cardholder Name",
+	add_credit_card: "Add Credit Card",
+	save_card: "Save Card",
+	securing: "Loading secure form...",
+	payment_methods: "Payment Methods",
+	add_payment_method: "Add Payment Method",
+	delete_credit_card: "Delete Credit Card",
+	delete_credit_card_message: "Are you sure you want to delete this payment method? This action cannot be undone.",
+	edit_card: "Card Details",
+	billing_address: "Billing Address",
+	country: "Country",
+	name: "Name",
+	address_line_1: "Address Line 1",
+	address_line_2: "Address Line 2",
+	city: "City",
+	state: "State",
+	province: "Province",
+	zip_code: "Zip Code",
+	postal_code: "Postal Code",
+	select_state: "Select state",
+	set_as_default_payment_method: "Set as default payment method",
+	cancel: "Cancel",
+	save: "Save",
+	close: "Close",
+	edit: "Edit",
+	default: "Default",
+	card_expires: "Expires",
+	no_billing_address: "No billing address on file",
+	default_payment_method_updated: "Payment method updated",
+	failed_to_set_default_payment_method: "Failed to update payment method"
+};
+function t(key) {
+	if (translations[key]) return translations[key];
+	return key.split("_").map((word) => word.charAt(0).toUpperCase() + word.slice(1)).join(" ");
+}
+function adaptPointsLedger(entry) {
+	return {
+		id: entry.id,
+		amount: entry.amount,
+		company_id: 0,
+		created_at: entry.created_at,
+		customer_id: entry.customer_id,
+		metadata: {
+			transaction_type: entry.metadata?.transaction_type ?? void 0,
+			source: entry.metadata?.source ?? void 0
+		},
+		total_balance: entry.total_balance ?? 0,
+		updated_at: entry.created_at
+	};
+}
+function ProfileContentScreen({ onToast, countryIso }) {
+	const { token, user } = require_use_account_clients.useFluidAuth();
+	const client = require_use_account_clients.useFluidPayClient();
+	const sdkClient = require_use_account_clients.useSdkClient();
+	const queryClient = (0, _tanstack_react_query.useQueryClient)();
+	const jwt = token ?? "";
+	const userId = user?.id;
+	const { data: accountData, isLoading: isLoadingAccount, isError: isAccountError } = (0, _tanstack_react_query.useQuery)({
+		queryKey: ["fluidPayAccount", userId],
+		queryFn: () => require_use_account_clients.fetchCustomerAccount(client, jwt),
+		enabled: !!jwt
+	});
+	const { data: addressesData, isLoading: isLoadingAddresses } = (0, _tanstack_react_query.useQuery)({
+		queryKey: ["fluidPayAddresses", userId],
+		queryFn: () => fetchCustomerAddresses(client, jwt),
+		enabled: !!jwt
+	});
+	const { data: paymentMethodsData, isLoading: isLoadingPaymentMethods } = (0, _tanstack_react_query.useQuery)({
+		queryKey: [
+			"fluidPayPaymentMethods",
+			userId,
+			countryIso
+		],
+		queryFn: () => fetchCustomerPaymentMethods(client, jwt, countryIso),
+		enabled: !!jwt
+	});
+	const { data: countriesData } = (0, _tanstack_react_query.useQuery)({
+		queryKey: ["sdk-countries"],
+		queryFn: () => sdkClient.get("/countries"),
+		initialData: []
+	});
+	const customerId = accountData?.customer?.id;
+	const { data: pointsLedgerData, isLoading: isLoadingPointsLedger } = (0, _tanstack_react_query.useQuery)({
+		queryKey: ["customer-points-ledger", customerId],
+		queryFn: () => sdkClient.get(`${require_use_account_clients.API_VERSION}/customers/${customerId}/points_ledgers`),
+		enabled: !!customerId
+	});
+	const updateCustomerMutation = (0, _tanstack_react_query.useMutation)({
+		mutationFn: (data) => {
+			const languageIso = adaptedLanguages?.find((l) => l.name === data.language)?.iso ?? "en";
+			return require_use_account_clients.updateCustomer(client, jwt, {
+				first_name: data.first_name,
+				last_name: data.last_name,
+				phone: data.phone_number,
+				language_iso: languageIso
+			});
+		},
+		onSuccess: () => {
+			queryClient.invalidateQueries({ queryKey: ["fluidPayAccount", userId] });
+			onToast("Profile updated", "success");
+		},
+		onError: () => {
+			onToast("Failed to update profile", "error");
+		}
+	});
+	const deleteAddressMutation = (0, _tanstack_react_query.useMutation)({
+		mutationFn: (addressId) => deleteCustomerAddress(client, jwt, addressId),
+		onSuccess: () => {
+			queryClient.invalidateQueries({ queryKey: ["fluidPayAddresses", userId] });
+		}
+	});
+	const deletePaymentMethodMutation = (0, _tanstack_react_query.useMutation)({
+		mutationFn: (paymentMethodId) => deleteCustomerPaymentMethod(client, jwt, paymentMethodId),
+		onSuccess: () => {
+			queryClient.invalidateQueries({ queryKey: [
+				"fluidPayPaymentMethods",
+				userId,
+				countryIso
+			] });
+		}
+	});
+	const updatePaymentMethodMutation = (0, _tanstack_react_query.useMutation)({
+		mutationFn: ({ paymentMethodId, data }) => updatePaymentMethod(client, jwt, paymentMethodId, {
+			set_as_default: data.set_as_default,
+			billing_address: data.billing_address
+		}),
+		onSuccess: () => {
+			queryClient.invalidateQueries({ queryKey: [
+				"fluidPayPaymentMethods",
+				userId,
+				countryIso
+			] });
+		}
+	});
+	const createAddressMutation = (0, _tanstack_react_query.useMutation)({
+		mutationFn: (body) => createCustomerAddress(client, jwt, body),
+		onSuccess: () => {
+			queryClient.invalidateQueries({ queryKey: ["fluidPayAddresses", userId] });
+			onToast("Address created", "success");
+		},
+		onError: () => {
+			onToast("Failed to create address", "error");
+		}
+	});
+	const updateAddressMutation = (0, _tanstack_react_query.useMutation)({
+		mutationFn: ({ addressId, body }) => updateCustomerAddress(client, jwt, addressId, body),
+		onSuccess: () => {
+			queryClient.invalidateQueries({ queryKey: ["fluidPayAddresses", userId] });
+			onToast("Address updated", "success");
+		},
+		onError: () => {
+			onToast("Failed to update address", "error");
+		}
+	});
+	const addCreditCardMutation = (0, _tanstack_react_query.useMutation)({
+		mutationFn: (data) => addCreditCardToCustomer(client, jwt, data),
+		onSuccess: () => {
+			queryClient.invalidateQueries({ queryKey: [
+				"fluidPayPaymentMethods",
+				userId,
+				countryIso
+			] });
+			onToast("Payment method added", "success");
+		},
+		onError: () => {
+			onToast("Failed to add payment method", "error");
+		}
+	});
+	const addresses = addressesData?.addresses ?? [];
+	const paymentMethods = paymentMethodsData?.payment_methods ?? [];
+	const adaptedPointsLedger = pointsLedgerData?.points_ledgers?.map(adaptPointsLedger) ?? [];
+	const adaptedLanguages = [{
+		id: 0,
+		name: "English",
+		iso: "en"
+	}];
+	const countryOptions = (0, react.useMemo)(() => [...countriesData].map((c) => ({
+		iso: c.iso,
+		name: c.name
+	})).sort((a, b) => a.name.localeCompare(b.name)), [countriesData]);
+	if (!token) return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+		className: "px-4 py-8 sm:px-9",
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+			className: "rounded-lg border p-4 text-center",
+			children: "Login Required"
+		})
+	});
+	if (isAccountError && !isLoadingAccount) return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+		className: "px-4 py-8 sm:px-9",
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+			className: "text-muted-foreground text-center text-sm",
+			children: "Unable to load account data. Please try again later."
+		})
+	});
+	if (isLoadingAccount || !accountData) return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+		className: "px-4 pt-4 sm:px-9 md:pt-8",
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+			className: "space-y-4",
+			children: [
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", { className: "bg-muted h-16 animate-pulse rounded" }),
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", { className: "bg-muted h-32 animate-pulse rounded" }),
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", { className: "bg-muted h-32 animate-pulse rounded" })
+			]
+		})
+	});
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+		className: "px-4 pt-4 sm:px-9 md:pt-8",
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ProfileUIProvider, {
+			t,
+			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Profile, {
+				customerAccount: accountData,
+				languages: adaptedLanguages,
+				onUpdateCustomer: async (data) => {
+					await updateCustomerMutation.mutateAsync(data);
+				},
+				isUpdatingCustomer: updateCustomerMutation.isPending,
+				rewardsPointsEnabled: adaptedPointsLedger.length > 0,
+				pointsLedger: adaptedPointsLedger,
+				isLoadingPointsLedger,
+				addresses,
+				isLoadingAddresses,
+				onDeleteAddress: async (addressId) => {
+					await deleteAddressMutation.mutateAsync(addressId);
+				},
+				isDeletingAddress: deleteAddressMutation.isPending,
+				paymentMethods,
+				isLoadingPaymentMethods,
+				onDeletePaymentMethod: async (paymentMethodId) => {
+					await deletePaymentMethodMutation.mutateAsync(paymentMethodId);
+				},
+				isDeletingPaymentMethod: deletePaymentMethodMutation.isPending,
+				onUpdatePaymentMethod: async (paymentMethodId, data) => {
+					await updatePaymentMethodMutation.mutateAsync({
+						paymentMethodId,
+						data
+					});
+				},
+				isUpdatingPaymentMethod: updatePaymentMethodMutation.isPending,
+				getBillingAddress: (pm) => pm.billing_address ?? null,
+				countries: countryOptions,
+				renderAddressDialog: ({ isOpen, onClose, selectedAddress }) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(AddressFormDialog, {
+					isOpen,
+					onClose,
+					selectedAddress,
+					t,
+					onSubmit: async (formData) => {
+						if (selectedAddress) await updateAddressMutation.mutateAsync({
+							addressId: selectedAddress.id,
+							body: formData
+						});
+						else await createAddressMutation.mutateAsync(formData);
+						onClose();
+					},
+					isSubmitting: createAddressMutation.isPending || updateAddressMutation.isPending,
+					countries: countryOptions,
+					renderAddressAutocomplete: ({ control, setValue: _setValue }) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(PlainAddressInput, {
+						control,
+						name: "address1"
+					})
+				}),
+				renderCreditCardDialog: ({ isOpen, onClose }) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(CreditCardFormDialog, {
+					isOpen,
+					onClose,
+					t,
+					onSubmit: async (data) => {
+						await addCreditCardMutation.mutateAsync(data);
+						onClose();
+					},
+					isSubmitting: addCreditCardMutation.isPending,
+					countries: countryOptions,
+					jwt,
+					client,
+					renderAddressAutocomplete: ({ control, setValue: _setValue }) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(PlainAddressInput, {
+						control,
+						name: "address1"
+					})
+				})
+			})
+		})
+	});
+}
+/**
+* Plain text input fallback for address autocomplete.
+* The SDK doesn't have Google Places integration.
+*/
+function PlainAddressInput({ control, name }) {
+	const { field } = (0, react_hook_form.useController)({
+		control,
+		name
+	});
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("input", {
+		type: "text",
+		value: field.value ?? "",
+		placeholder: "Address Line 1",
+		className: "border-input bg-background ring-offset-background placeholder:text-muted-foreground focus-visible:ring-ring flex h-10 w-full rounded-md border px-3 py-2 text-sm file:border-0 file:bg-transparent file:text-sm file:font-medium focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:outline-none disabled:cursor-not-allowed disabled:opacity-50",
+		onChange: field.onChange
+	});
+}
+//#endregion
+//#region src/screens/ProfileScreen.tsx
+function defaultToast(message, type) {
+	if (type === "error" || type === "warning") console.warn("[Profile]", message);
+	else console.info("[Profile]", message);
+}
+function ProfileScreen({ onToast, background, textColor, accentColor, padding, borderRadius, ...divProps }) {
+	const { config } = require_FluidProvider.useFluidContext();
+	const effectiveToast = onToast ?? defaultToast;
+	const countryIso = config.countryIso ?? "US";
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+		...divProps,
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ProfileContentScreen, {
+			onToast: effectiveToast,
+			countryIso
+		})
+	});
+}
+const profileScreenPropertySchema = {
+	widgetType: "ProfileScreen",
+	displayName: "Profile Screen",
+	tabsConfig: [{
+		id: "styling",
+		label: "Styling"
+	}],
+	fields: []
+};
+//#endregion
+Object.defineProperty(exports, "ProfileScreen", {
+	enumerable: true,
+	get: function() {
+		return ProfileScreen;
+	}
+});
+Object.defineProperty(exports, "profileScreenPropertySchema", {
+	enumerable: true,
+	get: function() {
+		return profileScreenPropertySchema;
+	}
+});
+
+//# sourceMappingURL=ProfileScreen-B6Dp7RLa.cjs.map