@burdenoff/microfe-coolandlovely 2026.614.1

package/dist/coolandlovely/pages/common/SettingsPage.js

@@ -0,0 +1,964 @@
+import { useCoolAndLovely as e } from "../../context/CoolAndLovelyContext.js";
+import { cn as t } from "../../utils/cn.js";
+import { PageLayout as n } from "../../components/PageLayout.js";
+import { useCallback as r, useMemo as i, useState as a } from "react";
+import { useI18n as o } from "@burdenoff/fe-libs/shared/providers/shell/I18nProvider";
+import { AlertTriangle as s, Bell as c, Building2 as l, Camera as u, CheckCircle2 as d, CreditCard as f, Eye as p, Globe as m, Laptop as h, Loader2 as g, Lock as _, LogOut as v, MapPin as y, Monitor as b, Moon as x, Receipt as S, RotateCcw as C, Save as w, Settings as T, Shield as E, Smartphone as D, Sun as O, Trash2 as k, User as A } from "lucide-react";
+import { Fragment as j, jsx as M, jsxs as N } from "react/jsx-runtime";
+//#region src/coolandlovely/pages/common/SettingsPage.tsx
+var P = {
+	profile: {
+		firstName: "Priya",
+		lastName: "Customer",
+		email: "customer@burdenoff.com",
+		phone: "+91 98765 43220",
+		bio: "Food enthusiast and tech lover. Always exploring new services and experiences in Bangalore.",
+		dateOfBirth: "1992-08-15",
+		gender: "female",
+		profilePicture: "https://images.unsplash.com/photo-1494790108377-be9c29b29330?w=200"
+	},
+	preferences: {
+		theme: "system",
+		language: "en",
+		timezone: "Asia/Kolkata",
+		currency: "INR",
+		notifications: {
+			email: !0,
+			sms: !0,
+			push: !0,
+			orderUpdates: !0,
+			promotions: !1,
+			newsletters: !1,
+			security: !0
+		}
+	},
+	security: {
+		twoFactorEnabled: !1,
+		loginAlerts: !0,
+		sessionTimeout: "30",
+		trustedDevices: [
+			{
+				id: "dev-1",
+				name: "MacBook Pro",
+				browser: "Chrome 126.0",
+				os: "macOS Sonoma",
+				lastActive: "2024-06-24T09:30:00Z",
+				isCurrent: !0
+			},
+			{
+				id: "dev-2",
+				name: "iPhone 15",
+				browser: "Safari Mobile",
+				os: "iOS 17.5",
+				lastActive: "2024-06-23T18:45:00Z",
+				isCurrent: !1
+			},
+			{
+				id: "dev-3",
+				name: "Samsung Galaxy S24",
+				browser: "Chrome Mobile",
+				os: "Android 14",
+				lastActive: "2024-06-20T12:00:00Z",
+				isCurrent: !1
+			}
+		]
+	},
+	privacy: {
+		profileVisibility: "private",
+		dataSharing: {
+			analytics: !0,
+			marketing: !1,
+			thirdParty: !1
+		},
+		locationTracking: !0,
+		activityHistory: !0
+	},
+	billing: {
+		paymentMethod: {
+			type: "card",
+			last4: "4532",
+			provider: "Visa"
+		},
+		autoRecharge: !1,
+		autoRechargeAmount: "1000",
+		invoiceEmail: "customer@burdenoff.com",
+		gstNumber: "29ABCDE1234F1Z5",
+		companyName: "",
+		billingAddress: "123 Tech Park, Koramangala, Bangalore 560034"
+	}
+}, F = [
+	{
+		id: "profile",
+		label: "Profile",
+		icon: A
+	},
+	{
+		id: "preferences",
+		label: "Preferences",
+		icon: T
+	},
+	{
+		id: "security",
+		label: "Security",
+		icon: E
+	},
+	{
+		id: "privacy",
+		label: "Privacy",
+		icon: p
+	},
+	{
+		id: "billing",
+		label: "Billing",
+		icon: f
+	}
+];
+function I({ checked: e, onChange: n, label: r }) {
+	return /* @__PURE__ */ M("button", {
+		type: "button",
+		role: "switch",
+		"aria-checked": e,
+		"aria-label": r,
+		onClick: () => n(!e),
+		className: t("relative inline-flex h-6 w-11 items-center rounded-full transition-colors shrink-0", e ? "bg-primary" : "bg-muted"),
+		children: /* @__PURE__ */ M("span", { className: t("inline-block h-4 w-4 transform rounded-full bg-white transition-transform", e ? "translate-x-6" : "translate-x-1") })
+	});
+}
+function L() {
+	let { currentUser: T } = e(), { t: E } = o(), [A, L] = a("profile"), [R, z] = a(() => {
+		let e = { ...P };
+		return T?.firstName && (e.profile.firstName = T.firstName), T?.lastName && (e.profile.lastName = T.lastName), T?.email && (e.profile.email = T.email), e;
+	}), [B, V] = a(!1), [H, U] = a(!1), [W, G] = a(""), K = r((e, t) => {
+		let n = E(e);
+		return n === e ? t : n;
+	}, [E]), q = i(() => F.map((e) => ({
+		...e,
+		label: e.id === "profile" ? K("coolandlovely.settings.tabs.profile", "Profile") : e.id === "preferences" ? K("coolandlovely.settings.tabs.preferences", "Preferences") : e.id === "security" ? K("coolandlovely.settings.tabs.security", "Security") : e.id === "privacy" ? K("coolandlovely.settings.tabs.privacy", "Privacy") : K("coolandlovely.settings.tabs.billing", "Billing")
+	})), [K]), J = r((e, t, n) => {
+		z((r) => ({
+			...r,
+			[e]: {
+				...r[e],
+				[t]: n
+			}
+		})), V(!0), G("");
+	}, []), Y = r((e, t, n, r) => {
+		z((i) => ({
+			...i,
+			[e]: {
+				...i[e],
+				[t]: {
+					...i[e][t],
+					[n]: r
+				}
+			}
+		})), V(!0), G("");
+	}, []), X = r(() => {
+		z(P), V(!1), G("");
+	}, []), Z = r(async () => {
+		if (!R.profile.firstName.trim() || !R.profile.lastName.trim()) {
+			G(K("coolandlovely.settings.validation.nameRequired", "First name and last name are required.")), L("profile");
+			return;
+		}
+		if (!R.profile.email.trim() || !R.profile.email.includes("@")) {
+			G(K("coolandlovely.settings.validation.emailRequired", "A valid email address is required.")), L("profile");
+			return;
+		}
+		U(!0), G(""), await new Promise((e) => setTimeout(e, 1200)), U(!1), V(!1), G(K("coolandlovely.settings.saveSuccess", "Settings saved successfully!")), setTimeout(() => G(""), 3e3);
+	}, [R, K]), Q = r((e) => {
+		z((t) => ({
+			...t,
+			security: {
+				...t.security,
+				trustedDevices: t.security.trustedDevices.filter((t) => t.id !== e)
+			}
+		})), V(!0);
+	}, []), $ = r(() => {
+		z((e) => ({
+			...e,
+			security: {
+				...e.security,
+				trustedDevices: e.security.trustedDevices.filter((e) => e.isCurrent)
+			}
+		})), V(!0);
+	}, []), ee = r(() => {
+		window.confirm(K("coolandlovely.settings.deleteConfirm", "Are you sure you want to delete your account? This action cannot be undone.")) && alert(K("coolandlovely.settings.deleteSubmitted", "Account deletion request submitted. You will receive a confirmation email."));
+	}, [K]);
+	return /* @__PURE__ */ N(n, {
+		title: K("coolandlovely.settings.title", "Settings"),
+		description: K("coolandlovely.settings.description", "Manage your preferences and account settings"),
+		actions: /* @__PURE__ */ N("div", {
+			className: "flex items-center gap-2",
+			children: [B && /* @__PURE__ */ N("button", {
+				type: "button",
+				onClick: X,
+				className: "flex items-center gap-1.5 rounded-lg border border-border px-3 py-2 text-sm font-medium text-foreground hover:bg-accent transition-colors",
+				children: [/* @__PURE__ */ M(C, { className: "h-4 w-4" }), K("coolandlovely.settings.reset", "Reset")]
+			}), /* @__PURE__ */ M("button", {
+				type: "button",
+				disabled: !B || H,
+				onClick: Z,
+				className: t("flex items-center gap-1.5 rounded-lg px-4 py-2 text-sm font-medium transition-colors", B && !H ? "bg-primary text-primary-foreground hover:bg-primary/90" : "bg-muted text-muted-foreground cursor-not-allowed"),
+				children: H ? /* @__PURE__ */ N(j, { children: [/* @__PURE__ */ M(g, { className: "h-4 w-4 animate-spin" }), K("coolandlovely.settings.saving", "Saving...")] }) : /* @__PURE__ */ N(j, { children: [/* @__PURE__ */ M(w, { className: "h-4 w-4" }), K("coolandlovely.settings.save", "Save Settings")] })
+			})]
+		}),
+		children: [W && /* @__PURE__ */ N("div", {
+			className: t("mb-6 flex items-center gap-2 rounded-lg border p-3 text-sm", W.includes("successfully") ? "border-green-500/30 bg-green-500/5 text-green-600 dark:text-green-400" : "border-red-500/30 bg-red-500/5 text-red-600 dark:text-red-400"),
+			children: [W.includes("successfully") ? /* @__PURE__ */ M(d, { className: "h-4 w-4 shrink-0" }) : /* @__PURE__ */ M(s, { className: "h-4 w-4 shrink-0" }), W]
+		}), /* @__PURE__ */ N("div", {
+			className: "flex flex-col gap-6 lg:flex-row",
+			children: [/* @__PURE__ */ N("div", {
+				className: "shrink-0 lg:w-56",
+				children: [/* @__PURE__ */ M("div", {
+					className: "grid grid-cols-5 gap-1 lg:hidden",
+					children: q.map((e) => {
+						let n = e.icon;
+						return /* @__PURE__ */ N("button", {
+							type: "button",
+							onClick: () => L(e.id),
+							className: t("flex flex-col items-center gap-1 rounded-lg py-2.5 text-center transition-colors", A === e.id ? "bg-primary/10 text-foreground" : "text-muted-foreground hover:text-foreground hover:bg-accent"),
+							children: [/* @__PURE__ */ M(n, { className: "h-4 w-4" }), /* @__PURE__ */ M("span", {
+								className: "text-xs font-medium",
+								children: e.label
+							})]
+						}, e.id);
+					})
+				}), /* @__PURE__ */ N("div", {
+					className: "hidden lg:block rounded-lg border border-border bg-card",
+					children: [/* @__PURE__ */ M("div", {
+						className: "p-3 border-b border-border",
+						children: /* @__PURE__ */ M("p", {
+							className: "text-sm font-semibold text-foreground",
+							children: K("coolandlovely.settings.title", "Settings")
+						})
+					}), /* @__PURE__ */ M("nav", {
+						className: "p-2",
+						children: q.map((e) => {
+							let n = e.icon;
+							return /* @__PURE__ */ N("button", {
+								type: "button",
+								onClick: () => L(e.id),
+								className: t("flex w-full items-center gap-2.5 rounded-lg px-3 py-2 text-sm font-medium transition-colors mb-0.5", A === e.id ? "bg-primary/10 text-foreground" : "text-muted-foreground hover:text-foreground hover:bg-accent"),
+								children: [/* @__PURE__ */ M(n, { className: "h-4 w-4" }), e.label]
+							}, e.id);
+						})
+					})]
+				})]
+			}), /* @__PURE__ */ M("div", {
+				className: "flex-1 rounded-lg border border-border bg-card p-6",
+				children: {
+					profile: () => /* @__PURE__ */ N("div", {
+						className: "space-y-6",
+						children: [
+							/* @__PURE__ */ M("h3", {
+								className: "text-base font-semibold text-foreground",
+								children: "Personal Information"
+							}),
+							/* @__PURE__ */ N("div", {
+								className: "flex items-center gap-4",
+								children: [/* @__PURE__ */ N("div", {
+									className: "relative",
+									children: [/* @__PURE__ */ M("img", {
+										src: R.profile.profilePicture,
+										alt: "Profile",
+										className: "h-20 w-20 rounded-full object-cover border border-border"
+									}), /* @__PURE__ */ M("button", {
+										type: "button",
+										onClick: () => alert("Photo upload coming soon"),
+										className: "absolute -bottom-1 -right-1 flex h-7 w-7 items-center justify-center rounded-full bg-primary text-primary-foreground shadow-sm hover:bg-primary/90",
+										children: /* @__PURE__ */ M(u, { className: "h-3.5 w-3.5" })
+									})]
+								}), /* @__PURE__ */ N("div", { children: [/* @__PURE__ */ M("p", {
+									className: "text-sm font-medium text-foreground",
+									children: "Profile Picture"
+								}), /* @__PURE__ */ M("p", {
+									className: "text-xs text-muted-foreground",
+									children: "Upload a new photo (JPG, PNG, max 2MB)"
+								})] })]
+							}),
+							/* @__PURE__ */ N("div", {
+								className: "grid grid-cols-1 gap-4 sm:grid-cols-2",
+								children: [/* @__PURE__ */ N("div", { children: [/* @__PURE__ */ M("label", {
+									className: "block text-sm font-medium text-foreground mb-1.5",
+									children: "First Name *"
+								}), /* @__PURE__ */ M("input", {
+									type: "text",
+									value: R.profile.firstName,
+									onChange: (e) => J("profile", "firstName", e.target.value),
+									className: "w-full rounded-lg border border-border bg-card py-2 px-3 text-sm text-foreground focus:outline-none focus:ring-2 focus:ring-ring"
+								})] }), /* @__PURE__ */ N("div", { children: [/* @__PURE__ */ M("label", {
+									className: "block text-sm font-medium text-foreground mb-1.5",
+									children: "Last Name *"
+								}), /* @__PURE__ */ M("input", {
+									type: "text",
+									value: R.profile.lastName,
+									onChange: (e) => J("profile", "lastName", e.target.value),
+									className: "w-full rounded-lg border border-border bg-card py-2 px-3 text-sm text-foreground focus:outline-none focus:ring-2 focus:ring-ring"
+								})] })]
+							}),
+							/* @__PURE__ */ N("div", {
+								className: "grid grid-cols-1 gap-4 sm:grid-cols-2",
+								children: [/* @__PURE__ */ N("div", { children: [/* @__PURE__ */ M("label", {
+									className: "block text-sm font-medium text-foreground mb-1.5",
+									children: "Email Address *"
+								}), /* @__PURE__ */ M("input", {
+									type: "email",
+									value: R.profile.email,
+									onChange: (e) => J("profile", "email", e.target.value),
+									className: "w-full rounded-lg border border-border bg-card py-2 px-3 text-sm text-foreground focus:outline-none focus:ring-2 focus:ring-ring"
+								})] }), /* @__PURE__ */ N("div", { children: [/* @__PURE__ */ M("label", {
+									className: "block text-sm font-medium text-foreground mb-1.5",
+									children: "Phone Number"
+								}), /* @__PURE__ */ M("input", {
+									type: "tel",
+									value: R.profile.phone,
+									onChange: (e) => J("profile", "phone", e.target.value),
+									className: "w-full rounded-lg border border-border bg-card py-2 px-3 text-sm text-foreground focus:outline-none focus:ring-2 focus:ring-ring"
+								})] })]
+							}),
+							/* @__PURE__ */ N("div", { children: [/* @__PURE__ */ M("label", {
+								className: "block text-sm font-medium text-foreground mb-1.5",
+								children: "Bio"
+							}), /* @__PURE__ */ M("textarea", {
+								rows: 3,
+								value: R.profile.bio,
+								onChange: (e) => J("profile", "bio", e.target.value),
+								placeholder: "Tell us about yourself...",
+								className: "w-full rounded-lg border border-border bg-card py-2 px-3 text-sm text-foreground placeholder:text-muted-foreground focus:outline-none focus:ring-2 focus:ring-ring resize-none"
+							})] }),
+							/* @__PURE__ */ N("div", {
+								className: "grid grid-cols-1 gap-4 sm:grid-cols-2",
+								children: [/* @__PURE__ */ N("div", { children: [/* @__PURE__ */ M("label", {
+									className: "block text-sm font-medium text-foreground mb-1.5",
+									children: "Date of Birth"
+								}), /* @__PURE__ */ M("input", {
+									type: "date",
+									value: R.profile.dateOfBirth,
+									onChange: (e) => J("profile", "dateOfBirth", e.target.value),
+									className: "w-full rounded-lg border border-border bg-card py-2 px-3 text-sm text-foreground focus:outline-none focus:ring-2 focus:ring-ring"
+								})] }), /* @__PURE__ */ N("div", { children: [/* @__PURE__ */ M("label", {
+									className: "block text-sm font-medium text-foreground mb-1.5",
+									children: "Gender"
+								}), /* @__PURE__ */ N("select", {
+									value: R.profile.gender,
+									onChange: (e) => J("profile", "gender", e.target.value),
+									className: "w-full rounded-lg border border-border bg-card py-2 px-3 text-sm text-foreground focus:outline-none focus:ring-2 focus:ring-ring",
+									children: [
+										/* @__PURE__ */ M("option", {
+											value: "",
+											children: "Select gender"
+										}),
+										/* @__PURE__ */ M("option", {
+											value: "male",
+											children: "Male"
+										}),
+										/* @__PURE__ */ M("option", {
+											value: "female",
+											children: "Female"
+										}),
+										/* @__PURE__ */ M("option", {
+											value: "other",
+											children: "Other"
+										}),
+										/* @__PURE__ */ M("option", {
+											value: "prefer-not-to-say",
+											children: "Prefer not to say"
+										})
+									]
+								})] })]
+							})
+						]
+					}),
+					preferences: () => /* @__PURE__ */ N("div", {
+						className: "space-y-6",
+						children: [
+							/* @__PURE__ */ M("h3", {
+								className: "text-base font-semibold text-foreground",
+								children: "App Preferences"
+							}),
+							/* @__PURE__ */ N("div", {
+								className: "grid grid-cols-1 gap-4 sm:grid-cols-3",
+								children: [
+									/* @__PURE__ */ N("div", { children: [/* @__PURE__ */ M("label", {
+										className: "block text-sm font-medium text-foreground mb-1.5",
+										children: /* @__PURE__ */ N("span", {
+											className: "flex items-center gap-1.5",
+											children: [/* @__PURE__ */ M(m, { className: "h-4 w-4 text-muted-foreground" }), " Language"]
+										})
+									}), /* @__PURE__ */ N("select", {
+										value: R.preferences.language,
+										onChange: (e) => J("preferences", "language", e.target.value),
+										className: "w-full rounded-lg border border-border bg-card py-2 px-3 text-sm text-foreground focus:outline-none focus:ring-2 focus:ring-ring",
+										children: [
+											/* @__PURE__ */ M("option", {
+												value: "en",
+												children: "English"
+											}),
+											/* @__PURE__ */ M("option", {
+												value: "hi",
+												children: "Hindi"
+											}),
+											/* @__PURE__ */ M("option", {
+												value: "ta",
+												children: "Tamil"
+											}),
+											/* @__PURE__ */ M("option", {
+												value: "kn",
+												children: "Kannada"
+											}),
+											/* @__PURE__ */ M("option", {
+												value: "te",
+												children: "Telugu"
+											}),
+											/* @__PURE__ */ M("option", {
+												value: "ml",
+												children: "Malayalam"
+											})
+										]
+									})] }),
+									/* @__PURE__ */ N("div", { children: [/* @__PURE__ */ M("label", {
+										className: "block text-sm font-medium text-foreground mb-1.5",
+										children: "Timezone"
+									}), /* @__PURE__ */ N("select", {
+										value: R.preferences.timezone,
+										onChange: (e) => J("preferences", "timezone", e.target.value),
+										className: "w-full rounded-lg border border-border bg-card py-2 px-3 text-sm text-foreground focus:outline-none focus:ring-2 focus:ring-ring",
+										children: [
+											/* @__PURE__ */ M("option", {
+												value: "Asia/Kolkata",
+												children: "India (IST)"
+											}),
+											/* @__PURE__ */ M("option", {
+												value: "Asia/Dubai",
+												children: "Dubai (GST)"
+											}),
+											/* @__PURE__ */ M("option", {
+												value: "Europe/London",
+												children: "London (GMT)"
+											}),
+											/* @__PURE__ */ M("option", {
+												value: "America/New_York",
+												children: "New York (EST)"
+											})
+										]
+									})] }),
+									/* @__PURE__ */ N("div", { children: [/* @__PURE__ */ M("label", {
+										className: "block text-sm font-medium text-foreground mb-1.5",
+										children: "Currency"
+									}), /* @__PURE__ */ N("select", {
+										value: R.preferences.currency,
+										onChange: (e) => J("preferences", "currency", e.target.value),
+										className: "w-full rounded-lg border border-border bg-card py-2 px-3 text-sm text-foreground focus:outline-none focus:ring-2 focus:ring-ring",
+										children: [
+											/* @__PURE__ */ M("option", {
+												value: "INR",
+												children: "Indian Rupee (₹)"
+											}),
+											/* @__PURE__ */ M("option", {
+												value: "USD",
+												children: "US Dollar ($)"
+											}),
+											/* @__PURE__ */ M("option", {
+												value: "EUR",
+												children: "Euro (€)"
+											}),
+											/* @__PURE__ */ M("option", {
+												value: "GBP",
+												children: "British Pound (£)"
+											})
+										]
+									})] })
+								]
+							}),
+							/* @__PURE__ */ N("div", { children: [/* @__PURE__ */ M("label", {
+								className: "block text-sm font-medium text-foreground mb-3",
+								children: "Theme"
+							}), /* @__PURE__ */ M("div", {
+								className: "flex gap-3 flex-wrap",
+								children: [
+									{
+										value: "light",
+										label: "Light",
+										Icon: O
+									},
+									{
+										value: "dark",
+										label: "Dark",
+										Icon: x
+									},
+									{
+										value: "system",
+										label: "System",
+										Icon: b
+									}
+								].map(({ value: e, label: n, Icon: r }) => /* @__PURE__ */ N("label", {
+									className: t("flex items-center gap-2 rounded-lg border px-4 py-2.5 text-sm font-medium cursor-pointer transition-colors", R.preferences.theme === e ? "border-primary bg-primary/10 text-foreground" : "border-border text-muted-foreground hover:border-accent-foreground/20 hover:text-foreground"),
+									children: [
+										/* @__PURE__ */ M("input", {
+											type: "radio",
+											name: "theme",
+											value: e,
+											checked: R.preferences.theme === e,
+											onChange: (e) => J("preferences", "theme", e.target.value),
+											className: "sr-only"
+										}),
+										/* @__PURE__ */ M(r, { className: "h-4 w-4" }),
+										n
+									]
+								}, e))
+							})] }),
+							/* @__PURE__ */ N("div", { children: [/* @__PURE__ */ N("div", {
+								className: "flex items-center gap-2 mb-4",
+								children: [/* @__PURE__ */ M(c, { className: "h-4 w-4 text-muted-foreground" }), /* @__PURE__ */ M("h4", {
+									className: "text-sm font-semibold text-foreground",
+									children: "Notification Preferences"
+								})]
+							}), /* @__PURE__ */ M("div", {
+								className: "space-y-3",
+								children: [
+									{
+										key: "email",
+										label: "Email notifications"
+									},
+									{
+										key: "sms",
+										label: "SMS notifications"
+									},
+									{
+										key: "push",
+										label: "Push notifications"
+									},
+									{
+										key: "orderUpdates",
+										label: "Order status updates"
+									},
+									{
+										key: "promotions",
+										label: "Promotional offers"
+									},
+									{
+										key: "newsletters",
+										label: "Newsletters and updates"
+									},
+									{
+										key: "security",
+										label: "Security alerts"
+									}
+								].map((e) => /* @__PURE__ */ N("div", {
+									className: "flex items-center justify-between rounded-lg border border-border p-3",
+									children: [/* @__PURE__ */ M("span", {
+										className: "text-sm text-foreground",
+										children: e.label
+									}), /* @__PURE__ */ M(I, {
+										checked: R.preferences.notifications[e.key],
+										onChange: (t) => Y("preferences", "notifications", e.key, t),
+										label: e.label
+									})]
+								}, e.key))
+							})] })
+						]
+					}),
+					security: () => /* @__PURE__ */ N("div", {
+						className: "space-y-6",
+						children: [
+							/* @__PURE__ */ M("h3", {
+								className: "text-base font-semibold text-foreground",
+								children: "Security Settings"
+							}),
+							/* @__PURE__ */ N("div", {
+								className: "flex items-start gap-3 rounded-lg border border-yellow-500/30 bg-yellow-500/5 p-4",
+								children: [/* @__PURE__ */ M(s, { className: "h-5 w-5 text-yellow-600 dark:text-yellow-400 shrink-0 mt-0.5" }), /* @__PURE__ */ N("div", { children: [/* @__PURE__ */ M("p", {
+									className: "text-sm font-medium text-foreground",
+									children: "Account Security"
+								}), /* @__PURE__ */ M("p", {
+									className: "text-xs text-muted-foreground",
+									children: "Keep your account secure by enabling two-factor authentication and monitoring login activity."
+								})] })]
+							}),
+							/* @__PURE__ */ N("div", {
+								className: "flex items-center justify-between rounded-lg border border-border p-4",
+								children: [/* @__PURE__ */ N("div", {
+									className: "flex-1",
+									children: [/* @__PURE__ */ N("div", {
+										className: "flex items-center gap-2",
+										children: [/* @__PURE__ */ M(_, { className: "h-4 w-4 text-muted-foreground" }), /* @__PURE__ */ M("p", {
+											className: "text-sm font-medium text-foreground",
+											children: "Two-Factor Authentication"
+										})]
+									}), /* @__PURE__ */ M("p", {
+										className: "text-xs text-muted-foreground mt-0.5 ml-6",
+										children: "Add an extra layer of security to your account"
+									})]
+								}), /* @__PURE__ */ M(I, {
+									checked: R.security.twoFactorEnabled,
+									onChange: (e) => J("security", "twoFactorEnabled", e),
+									label: "Two-factor authentication"
+								})]
+							}),
+							/* @__PURE__ */ N("div", {
+								className: "flex items-center justify-between rounded-lg border border-border p-4",
+								children: [/* @__PURE__ */ N("div", {
+									className: "flex-1",
+									children: [/* @__PURE__ */ M("p", {
+										className: "text-sm font-medium text-foreground",
+										children: "Login Alerts"
+									}), /* @__PURE__ */ M("p", {
+										className: "text-xs text-muted-foreground mt-0.5",
+										children: "Get notified when someone logs into your account"
+									})]
+								}), /* @__PURE__ */ M(I, {
+									checked: R.security.loginAlerts,
+									onChange: (e) => J("security", "loginAlerts", e),
+									label: "Login alerts"
+								})]
+							}),
+							/* @__PURE__ */ N("div", {
+								className: "flex items-center justify-between rounded-lg border border-border p-4",
+								children: [/* @__PURE__ */ N("div", {
+									className: "flex-1",
+									children: [/* @__PURE__ */ M("p", {
+										className: "text-sm font-medium text-foreground",
+										children: "Session Timeout"
+									}), /* @__PURE__ */ M("p", {
+										className: "text-xs text-muted-foreground mt-0.5",
+										children: "Auto-logout after inactivity"
+									})]
+								}), /* @__PURE__ */ N("select", {
+									value: R.security.sessionTimeout,
+									onChange: (e) => J("security", "sessionTimeout", e.target.value),
+									className: "rounded-lg border border-border bg-card py-2 px-3 text-sm text-foreground focus:outline-none focus:ring-2 focus:ring-ring w-36",
+									children: [
+										/* @__PURE__ */ M("option", {
+											value: "15",
+											children: "15 minutes"
+										}),
+										/* @__PURE__ */ M("option", {
+											value: "30",
+											children: "30 minutes"
+										}),
+										/* @__PURE__ */ M("option", {
+											value: "60",
+											children: "1 hour"
+										}),
+										/* @__PURE__ */ M("option", {
+											value: "120",
+											children: "2 hours"
+										}),
+										/* @__PURE__ */ M("option", {
+											value: "0",
+											children: "Never"
+										})
+									]
+								})]
+							}),
+							/* @__PURE__ */ N("div", { children: [/* @__PURE__ */ M("h4", {
+								className: "text-sm font-semibold text-foreground mb-3",
+								children: "Trusted Devices"
+							}), /* @__PURE__ */ M("div", {
+								className: "space-y-3",
+								children: R.security.trustedDevices.map((e) => /* @__PURE__ */ N("div", {
+									className: "flex items-center justify-between rounded-lg border border-border p-4",
+									children: [/* @__PURE__ */ N("div", {
+										className: "flex items-center gap-3",
+										children: [e.os.toLowerCase().includes("mac") || e.os.toLowerCase().includes("windows") ? /* @__PURE__ */ M(h, { className: "h-5 w-5 text-muted-foreground shrink-0" }) : /* @__PURE__ */ M(D, { className: "h-5 w-5 text-muted-foreground shrink-0" }), /* @__PURE__ */ N("div", { children: [/* @__PURE__ */ N("div", {
+											className: "flex items-center gap-2",
+											children: [/* @__PURE__ */ M("p", {
+												className: "text-sm font-medium text-foreground",
+												children: e.name
+											}), e.isCurrent && /* @__PURE__ */ M("span", {
+												className: "inline-flex items-center rounded-full bg-green-500/20 px-2 py-0.5 text-xs font-medium text-green-600 dark:text-green-400",
+												children: "Current"
+											})]
+										}), /* @__PURE__ */ N("p", {
+											className: "text-xs text-muted-foreground",
+											children: [
+												e.browser,
+												" · ",
+												e.os
+											]
+										})] })]
+									}), !e.isCurrent && /* @__PURE__ */ M("button", {
+										type: "button",
+										onClick: () => Q(e.id),
+										className: "rounded-lg border border-border px-3 py-1.5 text-xs font-medium text-destructive hover:bg-destructive/10 transition-colors",
+										children: "Remove"
+									})]
+								}, e.id))
+							})] }),
+							/* @__PURE__ */ N("div", {
+								className: "flex flex-wrap gap-3",
+								children: [/* @__PURE__ */ N("button", {
+									type: "button",
+									onClick: () => alert("Password change functionality coming soon"),
+									className: "flex items-center gap-1.5 rounded-lg border border-border px-4 py-2 text-sm font-medium text-foreground hover:bg-accent transition-colors",
+									children: [/* @__PURE__ */ M(_, { className: "h-4 w-4" }), "Change Password"]
+								}), /* @__PURE__ */ N("button", {
+									type: "button",
+									onClick: $,
+									className: "flex items-center gap-1.5 rounded-lg border border-border px-4 py-2 text-sm font-medium text-foreground hover:bg-accent transition-colors",
+									children: [/* @__PURE__ */ M(v, { className: "h-4 w-4" }), "Logout All Devices"]
+								})]
+							})
+						]
+					}),
+					privacy: () => /* @__PURE__ */ N("div", {
+						className: "space-y-6",
+						children: [
+							/* @__PURE__ */ M("h3", {
+								className: "text-base font-semibold text-foreground",
+								children: "Privacy Controls"
+							}),
+							/* @__PURE__ */ N("div", { children: [/* @__PURE__ */ M("label", {
+								className: "block text-sm font-medium text-foreground mb-1.5",
+								children: /* @__PURE__ */ N("span", {
+									className: "flex items-center gap-1.5",
+									children: [/* @__PURE__ */ M(p, { className: "h-4 w-4 text-muted-foreground" }), " Profile Visibility"]
+								})
+							}), /* @__PURE__ */ N("select", {
+								value: R.privacy.profileVisibility,
+								onChange: (e) => J("privacy", "profileVisibility", e.target.value),
+								className: "w-full max-w-sm rounded-lg border border-border bg-card py-2 px-3 text-sm text-foreground focus:outline-none focus:ring-2 focus:ring-ring",
+								children: [
+									/* @__PURE__ */ M("option", {
+										value: "public",
+										children: "Public - Anyone can see your profile"
+									}),
+									/* @__PURE__ */ M("option", {
+										value: "private",
+										children: "Private - Only you can see your profile"
+									}),
+									/* @__PURE__ */ M("option", {
+										value: "friends",
+										children: "Friends - Only friends can see your profile"
+									})
+								]
+							})] }),
+							/* @__PURE__ */ N("div", { children: [/* @__PURE__ */ M("h4", {
+								className: "text-sm font-semibold text-foreground mb-3",
+								children: "Data Sharing"
+							}), /* @__PURE__ */ M("div", {
+								className: "space-y-3",
+								children: [
+									{
+										key: "analytics",
+										label: "Share usage analytics to improve the app"
+									},
+									{
+										key: "marketing",
+										label: "Share data for personalized marketing"
+									},
+									{
+										key: "thirdParty",
+										label: "Share data with third-party partners"
+									}
+								].map((e) => /* @__PURE__ */ N("div", {
+									className: "flex items-center justify-between rounded-lg border border-border p-3",
+									children: [/* @__PURE__ */ M("span", {
+										className: "text-sm text-foreground",
+										children: e.label
+									}), /* @__PURE__ */ M(I, {
+										checked: R.privacy.dataSharing[e.key],
+										onChange: (t) => Y("privacy", "dataSharing", e.key, t),
+										label: e.label
+									})]
+								}, e.key))
+							})] }),
+							/* @__PURE__ */ N("div", {
+								className: "space-y-3",
+								children: [/* @__PURE__ */ N("div", {
+									className: "flex items-center justify-between rounded-lg border border-border p-4",
+									children: [/* @__PURE__ */ N("div", { children: [/* @__PURE__ */ M("p", {
+										className: "text-sm font-medium text-foreground",
+										children: "Location Tracking"
+									}), /* @__PURE__ */ M("p", {
+										className: "text-xs text-muted-foreground",
+										children: "Allow app to track your location for better service"
+									})] }), /* @__PURE__ */ M(I, {
+										checked: R.privacy.locationTracking,
+										onChange: (e) => J("privacy", "locationTracking", e),
+										label: "Location tracking"
+									})]
+								}), /* @__PURE__ */ N("div", {
+									className: "flex items-center justify-between rounded-lg border border-border p-4",
+									children: [/* @__PURE__ */ N("div", { children: [/* @__PURE__ */ M("p", {
+										className: "text-sm font-medium text-foreground",
+										children: "Activity History"
+									}), /* @__PURE__ */ M("p", {
+										className: "text-xs text-muted-foreground",
+										children: "Keep track of your orders and activities"
+									})] }), /* @__PURE__ */ M(I, {
+										checked: R.privacy.activityHistory,
+										onChange: (e) => J("privacy", "activityHistory", e),
+										label: "Activity history"
+									})]
+								})]
+							}),
+							/* @__PURE__ */ M("div", {
+								className: "rounded-lg border border-red-500/30 bg-red-500/5 p-4",
+								children: /* @__PURE__ */ N("div", {
+									className: "flex items-start gap-3",
+									children: [/* @__PURE__ */ M(k, { className: "h-5 w-5 text-red-600 dark:text-red-400 shrink-0 mt-0.5" }), /* @__PURE__ */ N("div", { children: [
+										/* @__PURE__ */ M("p", {
+											className: "text-sm font-medium text-foreground",
+											children: "Delete Account"
+										}),
+										/* @__PURE__ */ M("p", {
+											className: "text-xs text-muted-foreground mt-0.5",
+											children: "Permanently delete your account and all associated data. This action cannot be undone."
+										}),
+										/* @__PURE__ */ M("button", {
+											type: "button",
+											onClick: ee,
+											className: "mt-3 rounded-lg border border-red-500/30 px-4 py-2 text-sm font-medium text-destructive hover:bg-destructive/10 transition-colors",
+											children: "Delete Account"
+										})
+									] })]
+								})
+							})
+						]
+					}),
+					billing: () => /* @__PURE__ */ N("div", {
+						className: "space-y-6",
+						children: [
+							/* @__PURE__ */ M("h3", {
+								className: "text-base font-semibold text-foreground",
+								children: "Billing & Payments"
+							}),
+							/* @__PURE__ */ N("div", { children: [/* @__PURE__ */ M("h4", {
+								className: "text-sm font-semibold text-foreground mb-3",
+								children: /* @__PURE__ */ N("span", {
+									className: "flex items-center gap-1.5",
+									children: [/* @__PURE__ */ M(f, { className: "h-4 w-4 text-muted-foreground" }), " Default Payment Method"]
+								})
+							}), R.billing.paymentMethod ? /* @__PURE__ */ N("div", {
+								className: "flex items-center justify-between rounded-lg border border-border p-4",
+								children: [/* @__PURE__ */ N("div", {
+									className: "flex items-center gap-3",
+									children: [/* @__PURE__ */ M(f, { className: "h-6 w-6 text-muted-foreground" }), /* @__PURE__ */ N("div", { children: [/* @__PURE__ */ N("p", {
+										className: "text-sm font-medium text-foreground",
+										children: [
+											R.billing.paymentMethod.provider,
+											" ending in",
+											" ",
+											R.billing.paymentMethod.last4
+										]
+									}), /* @__PURE__ */ M("p", {
+										className: "text-xs text-muted-foreground capitalize",
+										children: R.billing.paymentMethod.type
+									})] })]
+								}), /* @__PURE__ */ M("button", {
+									type: "button",
+									onClick: () => alert("Change payment method coming soon"),
+									className: "rounded-lg border border-border px-3 py-1.5 text-sm font-medium text-foreground hover:bg-accent transition-colors",
+									children: "Change"
+								})]
+							}) : /* @__PURE__ */ N("div", {
+								className: "rounded-lg border border-border p-4 text-center",
+								children: [/* @__PURE__ */ M("p", {
+									className: "text-sm text-muted-foreground",
+									children: "No default payment method set"
+								}), /* @__PURE__ */ M("button", {
+									type: "button",
+									onClick: () => alert("Add payment method coming soon"),
+									className: "mt-2 rounded-lg bg-primary px-4 py-2 text-sm font-medium text-primary-foreground hover:bg-primary/90 transition-colors",
+									children: "Add Payment Method"
+								})]
+							})] }),
+							/* @__PURE__ */ N("div", { children: [
+								/* @__PURE__ */ M("h4", {
+									className: "text-sm font-semibold text-foreground mb-3",
+									children: "Auto Recharge"
+								}),
+								/* @__PURE__ */ N("div", {
+									className: "flex items-center justify-between rounded-lg border border-border p-4 mb-3",
+									children: [/* @__PURE__ */ N("div", { children: [/* @__PURE__ */ M("p", {
+										className: "text-sm font-medium text-foreground",
+										children: "Enable Auto Recharge"
+									}), /* @__PURE__ */ M("p", {
+										className: "text-xs text-muted-foreground",
+										children: "Automatically add money when wallet balance is low"
+									})] }), /* @__PURE__ */ M(I, {
+										checked: R.billing.autoRecharge,
+										onChange: (e) => J("billing", "autoRecharge", e),
+										label: "Auto recharge"
+									})]
+								}),
+								R.billing.autoRecharge && /* @__PURE__ */ N("div", { children: [/* @__PURE__ */ M("label", {
+									className: "block text-sm font-medium text-foreground mb-1.5",
+									children: "Auto Recharge Amount (₹)"
+								}), /* @__PURE__ */ M("input", {
+									type: "number",
+									value: R.billing.autoRechargeAmount,
+									onChange: (e) => J("billing", "autoRechargeAmount", e.target.value),
+									placeholder: "1000",
+									className: "w-full max-w-xs rounded-lg border border-border bg-card py-2 px-3 text-sm text-foreground focus:outline-none focus:ring-2 focus:ring-ring"
+								})] })
+							] }),
+							/* @__PURE__ */ N("div", { children: [/* @__PURE__ */ M("label", {
+								className: "block text-sm font-medium text-foreground mb-1.5",
+								children: /* @__PURE__ */ N("span", {
+									className: "flex items-center gap-1.5",
+									children: [/* @__PURE__ */ M(S, { className: "h-4 w-4 text-muted-foreground" }), " Invoice Email"]
+								})
+							}), /* @__PURE__ */ M("input", {
+								type: "email",
+								value: R.billing.invoiceEmail,
+								onChange: (e) => J("billing", "invoiceEmail", e.target.value),
+								placeholder: "billing@example.com",
+								className: "w-full max-w-sm rounded-lg border border-border bg-card py-2 px-3 text-sm text-foreground focus:outline-none focus:ring-2 focus:ring-ring"
+							})] }),
+							/* @__PURE__ */ N("div", { children: [/* @__PURE__ */ M("h4", {
+								className: "text-sm font-semibold text-foreground mb-3",
+								children: /* @__PURE__ */ N("span", {
+									className: "flex items-center gap-1.5",
+									children: [/* @__PURE__ */ M(l, { className: "h-4 w-4 text-muted-foreground" }), " Tax Information"]
+								})
+							}), /* @__PURE__ */ N("div", {
+								className: "space-y-4",
+								children: [
+									/* @__PURE__ */ N("div", { children: [/* @__PURE__ */ M("label", {
+										className: "block text-sm font-medium text-foreground mb-1.5",
+										children: "GST Number"
+									}), /* @__PURE__ */ M("input", {
+										type: "text",
+										value: R.billing.gstNumber,
+										onChange: (e) => J("billing", "gstNumber", e.target.value),
+										placeholder: "29ABCDE1234F1Z5",
+										className: "w-full max-w-sm rounded-lg border border-border bg-card py-2 px-3 text-sm text-foreground focus:outline-none focus:ring-2 focus:ring-ring"
+									})] }),
+									/* @__PURE__ */ N("div", { children: [/* @__PURE__ */ M("label", {
+										className: "block text-sm font-medium text-foreground mb-1.5",
+										children: "Company Name"
+									}), /* @__PURE__ */ M("input", {
+										type: "text",
+										value: R.billing.companyName,
+										onChange: (e) => J("billing", "companyName", e.target.value),
+										placeholder: "Your Company Name",
+										className: "w-full max-w-sm rounded-lg border border-border bg-card py-2 px-3 text-sm text-foreground focus:outline-none focus:ring-2 focus:ring-ring"
+									})] }),
+									/* @__PURE__ */ N("div", { children: [/* @__PURE__ */ M("label", {
+										className: "block text-sm font-medium text-foreground mb-1.5",
+										children: /* @__PURE__ */ N("span", {
+											className: "flex items-center gap-1.5",
+											children: [/* @__PURE__ */ M(y, { className: "h-4 w-4 text-muted-foreground" }), " Billing Address"]
+										})
+									}), /* @__PURE__ */ M("textarea", {
+										rows: 3,
+										value: R.billing.billingAddress,
+										onChange: (e) => J("billing", "billingAddress", e.target.value),
+										placeholder: "Enter your complete billing address",
+										className: "w-full rounded-lg border border-border bg-card py-2 px-3 text-sm text-foreground placeholder:text-muted-foreground focus:outline-none focus:ring-2 focus:ring-ring resize-none"
+									})] })
+								]
+							})] })
+						]
+					})
+				}[A]()
+			})]
+		})]
+	});
+}
+//#endregion
+export { L as SettingsPage };
+
+//# sourceMappingURL=SettingsPage.js.map