@burdenoff/microfe-auth 2026.1031.1 → 2026.1101.2

package/dist/auth/pages/UserProfilePage.js

@@ -1,20 +1,20 @@
-import { useAuthStore as e } from "../store/authStore.js";
-import { useTr as t } from "../../shared/hooks/useTr.js";
-import { AuthLayout as n } from "../components/AuthLayout.js";
-import { AlertIcon as r, CheckIcon as i, EmailIcon as a, SpinnerIcon as o, UserIcon as s } from "../components/AuthIcons.js";
-import { useUserOperations as c } from "../hooks/useUserOperations.js";
-import { useCompleteAvatarUploadMutation as ee, useInitiateAvatarUploadMutation as l } from "../../generated/wspace-operations.js";
-import { validatePhoneNumber as u, validateUserFields as d } from "../utils/validation.js";
-import { useEffect as f, useId as p, useRef as m, useState as h } from "react";
-import { useNavigate as g } from "react-router";
-import { Fragment as _, jsx as v, jsxs as y } from "react/jsx-runtime";
-import { Button as b } from "@burdenoff/fe-libs/button";
-import { NextSteps as x, PagePurpose as S } from "@burdenoff/fe-libs/ui";
-import { useGatewayClient as te } from "@burdenoff/fe-libs/shared/graphql";
+import { useTr as e } from "../../shared/hooks/useTr.js";
+import { useUserOperations as t } from "../hooks/useUserOperations.js";
+import { validatePhoneNumber as n, validateUserFields as r } from "../utils/validation.js";
+import { useAuthStore as i } from "../store/authStore.js";
+import { AuthLayout as a } from "../components/AuthLayout.js";
+import { AlertIcon as o, CheckIcon as s, EmailIcon as c, SpinnerIcon as l, UserIcon as ee } from "../components/AuthIcons.js";
+import { useCompleteAvatarUploadMutation as te, useInitiateAvatarUploadMutation as u } from "../../generated/wspace-operations.js";
+import { useEffect as d, useId as f, useRef as p, useState as m } from "react";
+import { useNavigate as h } from "react-router";
+import { Fragment as g, jsx as _, jsxs as v } from "react/jsx-runtime";
+import { Button as y } from "@burdenoff/fe-libs/button";
+import { NextSteps as b, PagePurpose as x } from "@burdenoff/fe-libs/ui";
+import { useGatewayClient as S } from "@burdenoff/fe-libs/shared/graphql";
 import { useAuth as ne } from "@burdenoff/fe-libs/shared/providers/shell/AuthProvider";
-//#region src/auth/pages/UserProfilePage.tsx
+// src/auth/pages/UserProfilePage.tsx
 function C() {
-	let C = t(), w = g(), T = ne(), E = e((e) => e.isAuthenticated), D = e((e) => e.user), O = e((e) => e.setUser), { updateCurrentUserProfile: k, isLoading: A } = c(), j = p(), M = p(), N = p(), P = p(), F = p(), I = e((e) => e.currentWorkspaceId), L = te("workspace"), [R] = l({ client: L }), [z] = ee({ client: L }), B = m(null), [V, H] = h(!1), U = async (e) => {
+	let C = e(), w = h(), T = ne(), E = i((e) => e.isAuthenticated), D = i((e) => e.user), O = i((e) => e.setUser), { updateCurrentUserProfile: k, isLoading: A } = t(), j = f(), M = f(), N = f(), P = f(), F = f(), I = i((e) => e.currentWorkspaceId), L = S("workspace"), [R] = u({ client: L }), [z] = te({ client: L }), B = p(null), [V, H] = m(!1), U = async (e) => {
 		let t = e.target.files?.[0];
 		if (!t) return;
 		if (!t.type.startsWith("image/")) {
@@ -57,14 +57,14 @@ function C() {
 		} finally {
 			H(!1), B.current && (B.current.value = "");
 		}
-	}, [W, G] = h(!1), [K, q] = h({
+	}, [W, G] = m(!1), [K, q] = m({
 		username: "",
 		firstName: "",
 		lastName: "",
 		name: "",
 		phoneNumber: ""
-	}), [J, Y] = h(null), [X, Z] = h(null), [Q, $] = h(null);
-	return f(() => {
+	}), [J, Y] = m(null), [X, Z] = m(null), [Q, $] = m(null);
+	return d(() => {
 		D && q({
 			username: D.username || "",
 			firstName: D.firstName || "",
@@ -72,25 +72,25 @@ function C() {
 			name: D.name || "",
 			phoneNumber: D.phoneNumber || ""
 		});
-	}, [D]), !E || !D ? /* @__PURE__ */ v(n, {
+	}, [D]), !E || !D ? /* @__PURE__ */ _(a, {
 		title: C("auth.profile.title", "Profile"),
 		subtitle: C("auth.profile.subtitle", "View and manage your profile"),
-		children: /* @__PURE__ */ y("div", {
+		children: /* @__PURE__ */ v("div", {
 			className: "text-center py-12",
 			children: [
-				/* @__PURE__ */ v("div", {
+				/* @__PURE__ */ _("div", {
 					className: "size-16 mx-auto mb-4 rounded-full bg-[var(--color-status-warning-bg-subtle)] flex items-center justify-center",
-					children: /* @__PURE__ */ v(r, { className: "size-8 text-[var(--color-status-warning-text)]" })
+					children: /* @__PURE__ */ _(o, { className: "size-8 text-[var(--color-status-warning-text)]" })
 				}),
-				/* @__PURE__ */ v("h2", {
+				/* @__PURE__ */ _("h2", {
 					className: "text-xl font-semibold text-[var(--color-text-primary)] mb-2",
 					children: C("auth.profile.authRequired", "Authentication Required")
 				}),
-				/* @__PURE__ */ v("p", {
+				/* @__PURE__ */ _("p", {
 					className: "text-[var(--color-text-secondary)] mb-6",
 					children: C("auth.profile.signInToView", "Please sign in to view your profile")
 				}),
-				/* @__PURE__ */ v(b, {
+				/* @__PURE__ */ _(y, {
 					type: "button",
 					onClick: () => w("/auth/login"),
 					variant: "default",
@@ -100,35 +100,35 @@ function C() {
 				})
 			]
 		})
-	}) : /* @__PURE__ */ y("div", {
+	}) : /* @__PURE__ */ v("div", {
 		className: "max-w-4xl mx-auto p-6",
 		children: [
-			/* @__PURE__ */ y("div", {
+			/* @__PURE__ */ v("div", {
 				className: "mb-8",
 				children: [
-					/* @__PURE__ */ v("h1", {
+					/* @__PURE__ */ _("h1", {
 						className: "text-3xl font-semibold text-[var(--color-text-primary)]",
 						children: C("auth.profile.myProfile", "My Profile")
 					}),
-					/* @__PURE__ */ v("p", {
+					/* @__PURE__ */ _("p", {
 						className: "text-[var(--color-text-secondary)] mt-2",
 						children: C("auth.profile.viewAndManage", "View and manage your account information")
 					}),
-					/* @__PURE__ */ v(S, {
+					/* @__PURE__ */ _(x, {
 						className: "mt-3",
 						children: C("auth.profile.purpose", "This is how you appear across the platform. Update your name, photo, and contact details here — teammates see this information, and we use your email for sign-in and important notices.")
 					})
 				]
 			}),
-			Q && /* @__PURE__ */ y("div", {
+			Q && /* @__PURE__ */ v("div", {
 				className: "mb-6 flex items-center gap-3 p-4 rounded-xl bg-[var(--color-status-success-bg-subtle)] border border-[var(--color-status-success-border)]",
 				children: [
-					/* @__PURE__ */ v(i, { className: "size-5 text-[var(--color-status-success-text)] flex-shrink-0" }),
-					/* @__PURE__ */ v("p", {
+					/* @__PURE__ */ _(s, { className: "size-5 text-[var(--color-status-success-text)] flex-shrink-0" }),
+					/* @__PURE__ */ _("p", {
 						className: "text-[var(--color-status-success-text)]",
 						children: Q
 					}),
-					/* @__PURE__ */ v("button", {
+					/* @__PURE__ */ _("button", {
 						type: "button",
 						onClick: () => $(null),
 						className: "ml-auto text-sm text-[var(--color-status-success-text)] hover:underline transition-colors duration-200",
@@ -136,18 +136,18 @@ function C() {
 					})
 				]
 			}),
-			J && /* @__PURE__ */ y("div", {
+			J && /* @__PURE__ */ v("div", {
 				className: "mb-6 flex items-start gap-3 p-4 rounded-xl bg-[var(--color-status-error-bg-subtle)] border border-[var(--color-status-error-border)]",
 				children: [
-					/* @__PURE__ */ v(r, { className: "size-5 text-[var(--color-status-error-text)] flex-shrink-0 mt-0.5" }),
-					/* @__PURE__ */ v("div", {
+					/* @__PURE__ */ _(o, { className: "size-5 text-[var(--color-status-error-text)] flex-shrink-0 mt-0.5" }),
+					/* @__PURE__ */ _("div", {
 						className: "flex-1",
-						children: /* @__PURE__ */ v("p", {
+						children: /* @__PURE__ */ _("p", {
 							className: "text-sm text-[var(--color-status-error-text)]",
 							children: J
 						})
 					}),
-					/* @__PURE__ */ v("button", {
+					/* @__PURE__ */ _("button", {
 						type: "button",
 						onClick: () => Y(null),
 						className: "text-sm text-[var(--color-status-error-text)] hover:underline transition-colors duration-200",
@@ -155,40 +155,40 @@ function C() {
 					})
 				]
 			}),
-			/* @__PURE__ */ y("div", {
+			/* @__PURE__ */ v("div", {
 				className: "rounded-xl border border-[var(--color-border-default)] bg-[var(--color-bg-surface)] shadow-sm overflow-hidden",
-				children: [/* @__PURE__ */ v("div", {
+				children: [/* @__PURE__ */ _("div", {
 					className: "bg-accent-wash border-b border-border-seam p-6 text-text-primary",
-					children: /* @__PURE__ */ y("div", {
+					children: /* @__PURE__ */ v("div", {
 						className: "flex items-center gap-4",
-						children: [/* @__PURE__ */ y("div", {
+						children: [/* @__PURE__ */ v("div", {
 							className: "relative group",
 							children: [
-								D.avatar ? /* @__PURE__ */ v("img", {
+								D.avatar ? /* @__PURE__ */ _("img", {
 									src: D.avatar,
 									alt: C("auth.profile.avatarAlt", "Profile picture"),
 									className: "size-20 rounded-full object-cover shadow-lg"
-								}) : /* @__PURE__ */ v("div", {
+								}) : /* @__PURE__ */ _("div", {
 									className: "size-20 rounded-full bg-accent-soft backdrop-blur-sm flex items-center justify-center text-[var(--color-action-primary-bg)] text-3xl font-semibold shadow-lg",
 									children: (D.name || D.username || D.email).charAt(0).toUpperCase()
 								}),
-								/* @__PURE__ */ v("button", {
+								/* @__PURE__ */ _("button", {
 									type: "button",
 									onClick: () => B.current?.click(),
 									disabled: V,
 									"aria-label": C("auth.profile.changeAvatar", "Change profile picture"),
 									className: "absolute inset-0 rounded-full flex items-center justify-center bg-black/40 opacity-0 group-hover:opacity-100 transition-opacity duration-200 cursor-pointer",
-									children: V ? /* @__PURE__ */ v(o, { className: "size-6 text-white animate-spin" }) : /* @__PURE__ */ y("svg", {
+									children: V ? /* @__PURE__ */ _(l, { className: "size-6 text-white animate-spin" }) : /* @__PURE__ */ v("svg", {
 										className: "size-6 text-white",
 										fill: "none",
 										viewBox: "0 0 24 24",
 										stroke: "currentColor",
-										children: [/* @__PURE__ */ v("path", {
+										children: [/* @__PURE__ */ _("path", {
 											strokeLinecap: "round",
 											strokeLinejoin: "round",
 											strokeWidth: 2,
 											d: "M3 9a2 2 0 012-2h.93a2 2 0 001.664-.89l.812-1.22A2 2 0 0110.07 4h3.86a2 2 0 011.664.89l.812 1.22A2 2 0 0018.07 7H19a2 2 0 012 2v9a2 2 0 01-2 2H5a2 2 0 01-2-2V9z"
-										}), /* @__PURE__ */ v("path", {
+										}), /* @__PURE__ */ _("path", {
 											strokeLinecap: "round",
 											strokeLinejoin: "round",
 											strokeWidth: 2,
@@ -196,7 +196,7 @@ function C() {
 										})]
 									})
 								}),
-								/* @__PURE__ */ v("input", {
+								/* @__PURE__ */ _("input", {
 									ref: B,
 									type: "file",
 									accept: "image/*",
@@ -206,45 +206,45 @@ function C() {
 									"aria-label": C("auth.profile.avatarUpload", "Upload avatar image")
 								})
 							]
-						}), /* @__PURE__ */ y("div", {
+						}), /* @__PURE__ */ v("div", {
 							className: "text-text-primary",
 							children: [
-								/* @__PURE__ */ v("h2", {
+								/* @__PURE__ */ _("h2", {
 									className: "text-2xl font-semibold",
 									children: D.name || `${D.firstName || ""} ${D.lastName || ""}`.trim() || D.username
 								}),
-								/* @__PURE__ */ y("p", {
+								/* @__PURE__ */ v("p", {
 									className: "text-text-secondary flex items-center gap-2",
-									children: [/* @__PURE__ */ v(a, { className: "size-4" }), D.email]
+									children: [/* @__PURE__ */ _(c, { className: "size-4" }), D.email]
 								}),
-								/* @__PURE__ */ y("div", {
+								/* @__PURE__ */ v("div", {
 									className: "flex items-center gap-2 mt-2",
-									children: [/* @__PURE__ */ v("span", {
+									children: [/* @__PURE__ */ _("span", {
 										className: "px-2.5 py-1 rounded-full text-xs font-medium bg-bg-surface/60 text-text-secondary backdrop-blur-sm",
 										children: D.role?.replace("_", " ") || C("auth.profile.member", "Member")
-									}), D.emailVerified && /* @__PURE__ */ y("span", {
+									}), D.emailVerified && /* @__PURE__ */ v("span", {
 										className: "px-2.5 py-1 rounded-full text-xs font-medium bg-status-success-bg-subtle text-status-success-text flex items-center gap-1",
-										children: [/* @__PURE__ */ v(i, { className: "size-3" }), C("auth.profile.verified", "Verified")]
+										children: [/* @__PURE__ */ _(s, { className: "size-3" }), C("auth.profile.verified", "Verified")]
 									})]
 								})
 							]
 						})]
 					})
-				}), /* @__PURE__ */ v("div", {
+				}), /* @__PURE__ */ _("div", {
 					className: "p-6",
-					children: W ? /* @__PURE__ */ y("form", {
+					children: W ? /* @__PURE__ */ v("form", {
 						onSubmit: async (e) => {
-							if (e.preventDefault(), Y(null), Z(null), $(null), !u(K.phoneNumber).valid) {
+							if (e.preventDefault(), Y(null), Z(null), $(null), !n(K.phoneNumber).valid) {
 								let e = C("auth.profile.phoneNumber_invalid", "Invalid phone number");
 								Z(e), Y(e);
 								return;
 							}
-							let t = d(K, { requireAll: !1 });
-							if (!t.valid) {
-								Y(t.errors.map((e) => C(`auth.profile.${e.field}_${e.code}`, e.message)).join(" · "));
-								return;
-							}
-							try {
+							let t = r(K, { requireAll: !1 });
+							if (!t.valid) Y(t.errors.map((e) => {
+								let t = `auth.profile.${e.field}_${e.code}`;
+								return C(t, e.message);
+							}).join(" · "));
+							else try {
 								await k({
 									username: t.values.username || void 0,
 									firstName: t.values.firstName || void 0,
@@ -257,22 +257,22 @@ function C() {
 							}
 						},
 						className: "space-y-6",
-						children: [/* @__PURE__ */ y("div", {
+						children: [/* @__PURE__ */ v("div", {
 							className: "grid grid-cols-1 md:grid-cols-2 gap-6",
 							children: [
-								/* @__PURE__ */ y("div", { children: [/* @__PURE__ */ v("label", {
+								/* @__PURE__ */ v("div", { children: [/* @__PURE__ */ _("label", {
 									htmlFor: j,
 									className: "block text-sm font-medium text-[var(--color-text-primary)] mb-2",
 									children: C("auth.profile.username", "Username")
-								}), /* @__PURE__ */ y("div", {
+								}), /* @__PURE__ */ v("div", {
 									className: "relative",
-									children: [/* @__PURE__ */ v("div", {
+									children: [/* @__PURE__ */ _("div", {
 										className: "absolute inset-y-0 left-0 pl-3.5 flex items-center pointer-events-none",
-										children: /* @__PURE__ */ v(s, {
+										children: /* @__PURE__ */ _(ee, {
 											className: "size-5 text-[var(--color-text-tertiary)]",
 											"aria-hidden": "true"
 										})
-									}), /* @__PURE__ */ v("input", {
+									}), /* @__PURE__ */ _("input", {
 										id: j,
 										type: "text",
 										"aria-label": C("auth.profile.username", "Username"),
@@ -285,11 +285,11 @@ function C() {
 										placeholder: C("auth.profile.usernamePlaceholder", "Enter username")
 									})]
 								})] }),
-								/* @__PURE__ */ y("div", { children: [/* @__PURE__ */ v("label", {
+								/* @__PURE__ */ v("div", { children: [/* @__PURE__ */ _("label", {
 									htmlFor: M,
 									className: "block text-sm font-medium text-[var(--color-text-primary)] mb-2",
 									children: C("auth.profile.displayName", "Display Name")
-								}), /* @__PURE__ */ v("input", {
+								}), /* @__PURE__ */ _("input", {
 									id: M,
 									type: "text",
 									"aria-label": C("auth.profile.displayName", "Display Name"),
@@ -301,11 +301,11 @@ function C() {
 									className: "block w-full px-4 py-3 border border-[var(--color-border-default)] rounded-xl bg-[var(--color-bg-surface)] text-[var(--color-text-primary)] focus:outline-none focus:ring-2 focus:ring-action-primary-bg/20 focus:border-action-primary-bg transition-all duration-300",
 									placeholder: C("auth.profile.displayNamePlaceholder", "Enter display name")
 								})] }),
-								/* @__PURE__ */ y("div", { children: [/* @__PURE__ */ v("label", {
+								/* @__PURE__ */ v("div", { children: [/* @__PURE__ */ _("label", {
 									htmlFor: N,
 									className: "block text-sm font-medium text-[var(--color-text-primary)] mb-2",
 									children: C("auth.profile.firstName", "First Name")
-								}), /* @__PURE__ */ v("input", {
+								}), /* @__PURE__ */ _("input", {
 									id: N,
 									type: "text",
 									"aria-label": C("auth.profile.firstName", "First Name"),
@@ -317,11 +317,11 @@ function C() {
 									className: "block w-full px-4 py-3 border border-[var(--color-border-default)] rounded-xl bg-[var(--color-bg-surface)] text-[var(--color-text-primary)] focus:outline-none focus:ring-2 focus:ring-action-primary-bg/20 focus:border-action-primary-bg transition-all duration-300",
 									placeholder: C("auth.profile.firstNamePlaceholder", "Enter first name")
 								})] }),
-								/* @__PURE__ */ y("div", { children: [/* @__PURE__ */ v("label", {
+								/* @__PURE__ */ v("div", { children: [/* @__PURE__ */ _("label", {
 									htmlFor: P,
 									className: "block text-sm font-medium text-[var(--color-text-primary)] mb-2",
 									children: C("auth.profile.lastName", "Last Name")
-								}), /* @__PURE__ */ v("input", {
+								}), /* @__PURE__ */ _("input", {
 									id: P,
 									type: "text",
 									"aria-label": C("auth.profile.lastName", "Last Name"),
@@ -333,15 +333,15 @@ function C() {
 									className: "block w-full px-4 py-3 border border-[var(--color-border-default)] rounded-xl bg-[var(--color-bg-surface)] text-[var(--color-text-primary)] focus:outline-none focus:ring-2 focus:ring-action-primary-bg/20 focus:border-action-primary-bg transition-all duration-300",
 									placeholder: C("auth.profile.lastNamePlaceholder", "Enter last name")
 								})] }),
-								/* @__PURE__ */ y("div", {
+								/* @__PURE__ */ v("div", {
 									className: "md:col-span-2",
 									children: [
-										/* @__PURE__ */ v("label", {
+										/* @__PURE__ */ _("label", {
 											htmlFor: F,
 											className: "block text-sm font-medium text-[var(--color-text-primary)] mb-2",
 											children: C("auth.profile.phoneNumber", "Phone Number")
 										}),
-										/* @__PURE__ */ v("input", {
+										/* @__PURE__ */ _("input", {
 											id: F,
 											type: "tel",
 											"aria-label": C("auth.profile.phoneNumber", "Phone Number"),
@@ -357,7 +357,7 @@ function C() {
 											className: "block w-full px-4 py-3 border border-[var(--color-border-default)] rounded-xl bg-[var(--color-bg-surface)] text-[var(--color-text-primary)] focus:outline-none focus:ring-2 focus:ring-action-primary-bg/20 focus:border-action-primary-bg transition-all duration-300",
 											placeholder: C("auth.profile.phonePlaceholder", "Enter phone number")
 										}),
-										X && /* @__PURE__ */ v("p", {
+										X && /* @__PURE__ */ _("p", {
 											id: `${F}-error`,
 											role: "alert",
 											className: "mt-2 text-sm text-[var(--color-status-error-text)]",
@@ -366,16 +366,16 @@ function C() {
 									]
 								})
 							]
-						}), /* @__PURE__ */ y("div", {
+						}), /* @__PURE__ */ v("div", {
 							className: "flex gap-3 pt-6 mt-6 border-t border-[var(--color-border-default)]",
-							children: [/* @__PURE__ */ v(b, {
+							children: [/* @__PURE__ */ _(y, {
 								type: "submit",
 								disabled: A,
 								variant: "default",
 								size: "lg",
 								className: "font-semibold",
-								children: A ? /* @__PURE__ */ y(_, { children: [/* @__PURE__ */ v(o, { className: "size-4 animate-spin" }), C("auth.profile.saving", "Saving...")] }) : C("auth.profile.saveChanges", "Save Changes")
-							}), /* @__PURE__ */ v("button", {
+								children: A ? /* @__PURE__ */ v(g, { children: [/* @__PURE__ */ _(l, { className: "size-4 animate-spin" }), C("auth.profile.saving", "Saving...")] }) : C("auth.profile.saveChanges", "Save Changes")
+							}), /* @__PURE__ */ _("button", {
 								type: "button",
 								onClick: () => {
 									D && q({
@@ -390,129 +390,129 @@ function C() {
 								children: C("auth.profile.cancel", "Cancel")
 							})]
 						})]
-					}) : /* @__PURE__ */ y(_, { children: [/* @__PURE__ */ y("div", {
+					}) : /* @__PURE__ */ v(g, { children: [/* @__PURE__ */ v("div", {
 						className: "grid grid-cols-1 md:grid-cols-2 gap-6",
 						children: [
-							/* @__PURE__ */ y("div", {
+							/* @__PURE__ */ v("div", {
 								className: "p-4 rounded-xl bg-[var(--color-bg-muted)]",
-								children: [/* @__PURE__ */ v("label", {
+								children: [/* @__PURE__ */ _("label", {
 									className: "block text-sm font-medium text-[var(--color-text-tertiary)] mb-1",
 									children: C("auth.profile.username", "Username")
-								}), /* @__PURE__ */ v("p", {
+								}), /* @__PURE__ */ _("p", {
 									className: "text-[var(--color-text-primary)] font-medium",
 									children: D.username || "-"
 								})]
 							}),
-							/* @__PURE__ */ y("div", {
+							/* @__PURE__ */ v("div", {
 								className: "p-4 rounded-xl bg-[var(--color-bg-muted)]",
-								children: [/* @__PURE__ */ v("label", {
+								children: [/* @__PURE__ */ _("label", {
 									className: "block text-sm font-medium text-[var(--color-text-tertiary)] mb-1",
 									children: C("auth.profile.displayName", "Display Name")
-								}), /* @__PURE__ */ v("p", {
+								}), /* @__PURE__ */ _("p", {
 									className: "text-[var(--color-text-primary)] font-medium",
 									children: D.name || "-"
 								})]
 							}),
-							/* @__PURE__ */ y("div", {
+							/* @__PURE__ */ v("div", {
 								className: "p-4 rounded-xl bg-[var(--color-bg-muted)]",
-								children: [/* @__PURE__ */ v("label", {
+								children: [/* @__PURE__ */ _("label", {
 									className: "block text-sm font-medium text-[var(--color-text-tertiary)] mb-1",
 									children: C("auth.profile.firstName", "First Name")
-								}), /* @__PURE__ */ v("p", {
+								}), /* @__PURE__ */ _("p", {
 									className: "text-[var(--color-text-primary)] font-medium",
 									children: D.firstName || "-"
 								})]
 							}),
-							/* @__PURE__ */ y("div", {
+							/* @__PURE__ */ v("div", {
 								className: "p-4 rounded-xl bg-[var(--color-bg-muted)]",
-								children: [/* @__PURE__ */ v("label", {
+								children: [/* @__PURE__ */ _("label", {
 									className: "block text-sm font-medium text-[var(--color-text-tertiary)] mb-1",
 									children: C("auth.profile.lastName", "Last Name")
-								}), /* @__PURE__ */ v("p", {
+								}), /* @__PURE__ */ _("p", {
 									className: "text-[var(--color-text-primary)] font-medium",
 									children: D.lastName || "-"
 								})]
 							}),
-							/* @__PURE__ */ y("div", {
+							/* @__PURE__ */ v("div", {
 								className: "p-4 rounded-xl bg-[var(--color-bg-muted)]",
-								children: [/* @__PURE__ */ v("label", {
+								children: [/* @__PURE__ */ _("label", {
 									className: "block text-sm font-medium text-[var(--color-text-tertiary)] mb-1",
 									children: C("auth.profile.email", "Email")
-								}), /* @__PURE__ */ y("p", {
+								}), /* @__PURE__ */ v("p", {
 									className: "text-[var(--color-text-primary)] font-medium flex items-center gap-2",
-									children: [D.email, D.emailVerified && /* @__PURE__ */ y("span", {
+									children: [D.email, D.emailVerified && /* @__PURE__ */ v("span", {
 										className: "inline-flex items-center gap-1 text-[var(--color-status-success-text)] text-xs",
-										children: [/* @__PURE__ */ v(i, { className: "size-3" }), C("auth.profile.verified", "Verified")]
+										children: [/* @__PURE__ */ _(s, { className: "size-3" }), C("auth.profile.verified", "Verified")]
 									})]
 								})]
 							}),
-							/* @__PURE__ */ y("div", {
+							/* @__PURE__ */ v("div", {
 								className: "p-4 rounded-xl bg-[var(--color-bg-muted)]",
-								children: [/* @__PURE__ */ v("label", {
+								children: [/* @__PURE__ */ _("label", {
 									className: "block text-sm font-medium text-[var(--color-text-tertiary)] mb-1",
 									children: C("auth.profile.phoneNumber", "Phone Number")
-								}), /* @__PURE__ */ v("p", {
+								}), /* @__PURE__ */ _("p", {
 									className: "text-[var(--color-text-primary)] font-medium",
 									children: D.phoneNumber || "-"
 								})]
 							}),
-							/* @__PURE__ */ y("div", {
+							/* @__PURE__ */ v("div", {
 								className: "p-4 rounded-xl bg-[var(--color-bg-muted)]",
-								children: [/* @__PURE__ */ v("label", {
+								children: [/* @__PURE__ */ _("label", {
 									className: "block text-sm font-medium text-[var(--color-text-tertiary)] mb-1",
 									children: C("auth.profile.role", "Role")
-								}), /* @__PURE__ */ v("p", {
+								}), /* @__PURE__ */ _("p", {
 									className: "text-[var(--color-text-primary)] font-medium",
 									children: D.role?.replace("_", " ") || C("auth.profile.member", "Member")
 								})]
 							}),
-							/* @__PURE__ */ y("div", {
+							/* @__PURE__ */ v("div", {
 								className: "p-4 rounded-xl bg-[var(--color-bg-muted)]",
-								children: [/* @__PURE__ */ v("label", {
+								children: [/* @__PURE__ */ _("label", {
 									className: "block text-sm font-medium text-[var(--color-text-tertiary)] mb-1",
 									children: C("auth.profile.mfaStatus", "MFA Status")
-								}), /* @__PURE__ */ v("p", {
+								}), /* @__PURE__ */ _("p", {
 									className: "text-[var(--color-text-primary)] font-medium",
-									children: D.mfaEnabled ? /* @__PURE__ */ y("span", {
+									children: D.mfaEnabled ? /* @__PURE__ */ v("span", {
 										className: "text-[var(--color-status-success-text)] flex items-center gap-1",
-										children: [/* @__PURE__ */ v(i, { className: "size-4" }), C("auth.profile.enabled", "Enabled")]
-									}) : /* @__PURE__ */ v("span", {
+										children: [/* @__PURE__ */ _(s, { className: "size-4" }), C("auth.profile.enabled", "Enabled")]
+									}) : /* @__PURE__ */ _("span", {
 										className: "text-[var(--color-status-warning-text)]",
 										children: C("auth.profile.notEnabled", "Not Enabled")
 									})
 								})]
 							}),
-							/* @__PURE__ */ y("div", {
+							/* @__PURE__ */ v("div", {
 								className: "p-4 rounded-xl bg-[var(--color-bg-muted)]",
-								children: [/* @__PURE__ */ v("label", {
+								children: [/* @__PURE__ */ _("label", {
 									className: "block text-sm font-medium text-[var(--color-text-tertiary)] mb-1",
 									children: C("auth.profile.lastLogin", "Last Login")
-								}), /* @__PURE__ */ v("p", {
+								}), /* @__PURE__ */ _("p", {
 									className: "text-[var(--color-text-primary)] font-medium",
 									children: D.lastLoginAt ? new Date(D.lastLoginAt).toLocaleString() : C("auth.profile.never", "Never")
 								})]
 							}),
-							/* @__PURE__ */ y("div", {
+							/* @__PURE__ */ v("div", {
 								className: "p-4 rounded-xl bg-[var(--color-bg-muted)]",
-								children: [/* @__PURE__ */ v("label", {
+								children: [/* @__PURE__ */ _("label", {
 									className: "block text-sm font-medium text-[var(--color-text-tertiary)] mb-1",
 									children: C("auth.profile.accountCreated", "Account Created")
-								}), /* @__PURE__ */ v("p", {
+								}), /* @__PURE__ */ _("p", {
 									className: "text-[var(--color-text-primary)] font-medium",
 									children: D.createdAt ? new Date(D.createdAt).toLocaleString() : "-"
 								})]
 							})
 						]
-					}), /* @__PURE__ */ y("div", {
+					}), /* @__PURE__ */ v("div", {
 						className: "flex gap-3 pt-6 mt-6 border-t border-[var(--color-border-default)]",
-						children: [/* @__PURE__ */ v(b, {
+						children: [/* @__PURE__ */ _(y, {
 							type: "button",
 							onClick: () => G(!0),
 							variant: "default",
 							size: "lg",
 							className: "font-semibold",
 							children: C("auth.profile.editProfile", "Edit Profile")
-						}), /* @__PURE__ */ v("button", {
+						}), /* @__PURE__ */ _("button", {
 							type: "button",
 							onClick: () => w("/auth/security"),
 							className: "inline-flex items-center h-10 px-8 rounded-xl border border-[var(--color-border-default)] text-[var(--color-text-secondary)] font-medium hover:bg-[var(--color-bg-muted)] transition-colors duration-200",
@@ -521,7 +521,7 @@ function C() {
 					})] })
 				})]
 			}),
-			/* @__PURE__ */ v(x, {
+			/* @__PURE__ */ _(b, {
 				className: "mt-8",
 				storageKey: "auth-profile",
 				steps: [
@@ -547,21 +547,21 @@ function C() {
 					}
 				]
 			}),
-			/* @__PURE__ */ y("div", {
+			/* @__PURE__ */ v("div", {
 				className: "mt-8 grid grid-cols-1 md:grid-cols-3 gap-4",
-				children: [/* @__PURE__ */ y("button", {
+				children: [/* @__PURE__ */ v("button", {
 					type: "button",
 					onClick: () => w("/auth/mfa"),
 					className: "p-4 rounded-xl border border-[var(--color-border-default)] bg-[var(--color-bg-surface)] hover:border-[var(--color-action-primary-border)] transition-colors duration-200 text-left group",
 					children: [
-						/* @__PURE__ */ v("div", {
+						/* @__PURE__ */ _("div", {
 							className: "size-10 rounded-lg bg-[var(--color-bg-accent)] flex items-center justify-center mb-3 group-hover:bg-[var(--color-action-primary-bg-subtle)] transition-colors duration-200",
-							children: /* @__PURE__ */ v("svg", {
+							children: /* @__PURE__ */ _("svg", {
 								className: "size-5 text-[var(--color-text-link)]",
 								fill: "none",
 								viewBox: "0 0 24 24",
 								stroke: "currentColor",
-								children: /* @__PURE__ */ v("path", {
+								children: /* @__PURE__ */ _("path", {
 									strokeLinecap: "round",
 									strokeLinejoin: "round",
 									strokeWidth: 2,
@@ -569,28 +569,28 @@ function C() {
 								})
 							})
 						}),
-						/* @__PURE__ */ v("h3", {
+						/* @__PURE__ */ _("h3", {
 							className: "font-medium text-[var(--color-text-primary)]",
 							children: C("auth.profile.twoFactorAuth", "Two-Factor Auth")
 						}),
-						/* @__PURE__ */ v("p", {
+						/* @__PURE__ */ _("p", {
 							className: "text-sm text-[var(--color-text-tertiary)] mt-1",
 							children: D.mfaEnabled ? C("auth.profile.manageMfa", "Manage MFA settings") : C("auth.profile.enableMfa", "Enable MFA for extra security")
 						})
 					]
-				}), /* @__PURE__ */ y("button", {
+				}), /* @__PURE__ */ v("button", {
 					type: "button",
 					onClick: () => w("/devportal/api-keys"),
 					className: "p-4 rounded-xl border border-[var(--color-border-default)] bg-[var(--color-bg-surface)] hover:border-[var(--color-action-secondary-border)] transition-colors duration-200 text-left group",
 					children: [
-						/* @__PURE__ */ v("div", {
+						/* @__PURE__ */ _("div", {
 							className: "size-10 rounded-lg bg-[var(--color-action-secondary-bg-subtle)] flex items-center justify-center mb-3 group-hover:bg-[var(--color-action-secondary-bg-subtle)] transition-colors duration-200",
-							children: /* @__PURE__ */ v("svg", {
+							children: /* @__PURE__ */ _("svg", {
 								className: "size-5 text-[var(--color-action-secondary-text)]",
 								fill: "none",
 								viewBox: "0 0 24 24",
 								stroke: "currentColor",
-								children: /* @__PURE__ */ v("path", {
+								children: /* @__PURE__ */ _("path", {
 									strokeLinecap: "round",
 									strokeLinejoin: "round",
 									strokeWidth: 2,
@@ -598,11 +598,11 @@ function C() {
 								})
 							})
 						}),
-						/* @__PURE__ */ v("h3", {
+						/* @__PURE__ */ _("h3", {
 							className: "font-medium text-[var(--color-text-primary)]",
 							children: C("auth.profile.apiKeys", "API Keys")
 						}),
-						/* @__PURE__ */ v("p", {
+						/* @__PURE__ */ _("p", {
 							className: "text-sm text-[var(--color-text-tertiary)] mt-1",
 							children: C("auth.profile.manageApiKeys", "Manage your API access credentials")
 						})
@@ -612,7 +612,6 @@ function C() {
 		]
 	});
 }
-//#endregion
 export { C as UserProfilePage };
 
 //# sourceMappingURL=UserProfilePage.js.map