@burdenoff/microfe-coolandlovely 2026.625.2 → 2026.628.1

package/dist/coolandlovely/pages/customer/PaymentMethodsPage.js

@@ -1,494 +0,0 @@
-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 { EmptyState as r } from "../../components/EmptyState.js";
-import { useState as i } from "react";
-import { Banknote as a, CheckCircle2 as o, CreditCard as s, Plus as c, Shield as l, ShoppingCart as u, Smartphone as d, Trash2 as f, Wallet as p, X as m } from "lucide-react";
-import { jsx as h, jsxs as g } from "react/jsx-runtime";
-import { EmphasisPanel as _, PagePurpose as v } from "@burdenoff/fe-libs/ui";
-//#region src/coolandlovely/pages/customer/PaymentMethodsPage.tsx
-var y = [
-	{
-		id: "pm-1",
-		type: "upi",
-		label: "Google Pay",
-		detail: "priya@okaxis",
-		icon: d,
-		isDefault: !0
-	},
-	{
-		id: "pm-2",
-		type: "upi",
-		label: "PhonePe",
-		detail: "priya@ybl",
-		icon: d,
-		isDefault: !1
-	},
-	{
-		id: "pm-3",
-		type: "card",
-		label: "HDFC Credit Card",
-		detail: "**** **** **** 4242",
-		icon: s,
-		isDefault: !1
-	},
-	{
-		id: "pm-4",
-		type: "card",
-		label: "SBI Debit Card",
-		detail: "**** **** **** 8765",
-		icon: s,
-		isDefault: !1
-	},
-	{
-		id: "pm-5",
-		type: "wallet",
-		label: "CoolAndLovely Wallet",
-		detail: "Balance: ₹ 1,250.00",
-		icon: p,
-		isDefault: !1
-	}
-];
-function b({ method: e, onRemove: n, onSetDefault: r }) {
-	let i = e.icon;
-	return /* @__PURE__ */ g("div", {
-		className: t("flex items-center gap-4 rounded-lg border p-4", e.isDefault ? "border-foreground/30 bg-accent/50" : "border-border-subtle bg-bg-surface"),
-		children: [
-			/* @__PURE__ */ h("div", {
-				className: "flex h-10 w-10 shrink-0 items-center justify-center rounded-lg bg-bg-sunken",
-				children: /* @__PURE__ */ h(i, { className: "h-5 w-5 text-text-secondary" })
-			}),
-			/* @__PURE__ */ g("div", {
-				className: "flex-1 min-w-0",
-				children: [/* @__PURE__ */ g("div", {
-					className: "flex items-center gap-2",
-					children: [/* @__PURE__ */ h("p", {
-						className: "text-sm font-medium text-text-primary",
-						children: e.label
-					}), e.isDefault && /* @__PURE__ */ g("span", {
-						className: "inline-flex items-center gap-1 rounded-full bg-status-success-bg-subtle/10 px-2 py-0.5 text-[10px] font-medium text-status-success-text",
-						children: [/* @__PURE__ */ h(o, { className: "h-3 w-3" }), "Default"]
-					})]
-				}), /* @__PURE__ */ h("p", {
-					className: "mt-0.5 text-xs text-text-secondary font-mono",
-					children: e.detail
-				})]
-			}),
-			/* @__PURE__ */ g("div", {
-				className: "flex items-center gap-1",
-				children: [!e.isDefault && /* @__PURE__ */ h("button", {
-					type: "button",
-					onClick: () => r(e.id),
-					title: "Set as default",
-					className: "rounded-md px-2 py-1 text-xs text-text-secondary hover:bg-accent hover:text-text-primary transition-colors",
-					children: "Set Default"
-				}), /* @__PURE__ */ h("button", {
-					type: "button",
-					onClick: () => n(e.id),
-					title: "Remove payment method",
-					className: "rounded-md p-2 text-text-secondary hover:bg-status-error-bg/10 hover:text-status-error-text transition-colors",
-					children: /* @__PURE__ */ h(f, { className: "h-4 w-4" })
-				})]
-			})
-		]
-	});
-}
-function x() {
-	let { navigateTo: f } = e(), [x, S] = i(y), [C, w] = i(!1), [T, E] = i("card"), [D, O] = i(null), [k, A] = i({
-		cardNumber: "",
-		expiry: "",
-		cvv: "",
-		nameOnCard: ""
-	}), [j, M] = i({ upiId: "" }), [N, P] = i({
-		walletProvider: "Paytm",
-		mobile: ""
-	}), F = (e) => {
-		O(e), setTimeout(() => O(null), 3e3);
-	}, I = () => {
-		A({
-			cardNumber: "",
-			expiry: "",
-			cvv: "",
-			nameOnCard: ""
-		}), M({ upiId: "" }), P({
-			walletProvider: "Paytm",
-			mobile: ""
-		}), E("card");
-	}, L = (e) => {
-		S((t) => t.filter((t) => t.id !== e)), F("Payment method removed");
-	}, R = (e) => {
-		S((t) => t.map((t) => ({
-			...t,
-			isDefault: t.id === e
-		}))), F("Default payment method updated");
-	}, z = () => {
-		let e = "", t = "", n = s;
-		if (T === "card") {
-			if (!k.cardNumber.trim() || !k.expiry.trim() || !k.cvv.trim() || !k.nameOnCard.trim()) {
-				alert("Please fill in all card fields.");
-				return;
-			}
-			e = `${k.nameOnCard}'s Card`, t = `**** **** **** ${k.cardNumber.slice(-4)}`, n = s;
-		} else if (T === "upi") {
-			if (!j.upiId.trim()) {
-				alert("Please enter a UPI ID.");
-				return;
-			}
-			e = "UPI", t = j.upiId, n = d;
-		} else {
-			if (!N.mobile.trim()) {
-				alert("Please enter mobile number.");
-				return;
-			}
-			e = N.walletProvider, t = `Mobile: ${N.mobile}`, n = p;
-		}
-		let r = {
-			id: `pm-${Date.now()}`,
-			type: T,
-			label: e,
-			detail: t,
-			icon: n,
-			isDefault: !1
-		};
-		S((e) => [...e, r]), I(), w(!1), F("Payment method added successfully");
-	}, B = {
-		upi: x.filter((e) => e.type === "upi"),
-		card: x.filter((e) => e.type === "card"),
-		wallet: x.filter((e) => e.type === "wallet")
-	};
-	return /* @__PURE__ */ g(n, {
-		title: "Payment Methods",
-		description: "Manage your saved payment options",
-		actions: /* @__PURE__ */ g("button", {
-			type: "button",
-			onClick: () => w(!0),
-			className: t("flex items-center gap-2 rounded-lg px-4 py-2 text-sm font-medium transition-opacity", "bg-foreground text-background hover:opacity-90"),
-			children: [/* @__PURE__ */ h(c, { className: "h-4 w-4" }), "Add Method"]
-		}),
-		children: [
-			/* @__PURE__ */ h(v, {
-				className: "mb-6",
-				icon: /* @__PURE__ */ h(s, { className: "h-4 w-4" }),
-				children: "Save your UPI IDs, cards and wallets here so checkout is one tap, not a form. Pick a default to use automatically, and switch on the fly at checkout — or skip saved methods entirely with Cash on Delivery or Pay at Cart."
-			}),
-			D && /* @__PURE__ */ g("div", {
-				className: "mb-4 rounded-lg border border-status-success-border/30 bg-status-success-bg-subtle/10 p-3 flex items-center gap-2",
-				children: [/* @__PURE__ */ h(o, { className: "h-4 w-4 text-status-success-text shrink-0" }), /* @__PURE__ */ h("p", {
-					className: "text-sm text-status-success-text",
-					children: D
-				})]
-			}),
-			x.length > 0 ? /* @__PURE__ */ g("div", {
-				className: "space-y-6",
-				children: [
-					B.upi.length > 0 && /* @__PURE__ */ g("section", { children: [/* @__PURE__ */ g("h3", {
-						className: "text-sm font-semibold text-text-primary mb-3 flex items-center gap-2",
-						children: [/* @__PURE__ */ h(d, { className: "h-4 w-4 text-text-secondary" }), "UPI"]
-					}), /* @__PURE__ */ h("div", {
-						className: "space-y-2",
-						children: B.upi.map((e) => /* @__PURE__ */ h(b, {
-							method: e,
-							onRemove: L,
-							onSetDefault: R
-						}, e.id))
-					})] }),
-					B.card.length > 0 && /* @__PURE__ */ g("section", { children: [/* @__PURE__ */ g("h3", {
-						className: "text-sm font-semibold text-text-primary mb-3 flex items-center gap-2",
-						children: [/* @__PURE__ */ h(s, { className: "h-4 w-4 text-text-secondary" }), "Cards"]
-					}), /* @__PURE__ */ h("div", {
-						className: "space-y-2",
-						children: B.card.map((e) => /* @__PURE__ */ h(b, {
-							method: e,
-							onRemove: L,
-							onSetDefault: R
-						}, e.id))
-					})] }),
-					B.wallet.length > 0 && /* @__PURE__ */ g("section", { children: [/* @__PURE__ */ g("h3", {
-						className: "text-sm font-semibold text-text-primary mb-3 flex items-center gap-2",
-						children: [/* @__PURE__ */ h(p, { className: "h-4 w-4 text-text-secondary" }), "Wallets"]
-					}), /* @__PURE__ */ h("div", {
-						className: "space-y-2",
-						children: B.wallet.map((e) => /* @__PURE__ */ h(b, {
-							method: e,
-							onRemove: L,
-							onSetDefault: R
-						}, e.id))
-					})] }),
-					/* @__PURE__ */ g(_, {
-						className: "flex items-start gap-3 p-4",
-						children: [/* @__PURE__ */ h(l, { className: "mt-0.5 h-5 w-5 shrink-0 text-text-secondary" }), /* @__PURE__ */ g("div", { children: [/* @__PURE__ */ h("p", {
-							className: "text-sm font-medium text-text-primary",
-							children: "Secure Payments"
-						}), /* @__PURE__ */ h("p", {
-							className: "mt-0.5 text-xs text-text-secondary",
-							children: "Your payment information is encrypted and securely stored. We never share your financial details with third parties."
-						})] })]
-					})
-				]
-			}) : /* @__PURE__ */ h(r, {
-				illustration: "empty-generic",
-				title: "No payment methods",
-				description: "Add a payment method to make faster checkouts.",
-				action: /* @__PURE__ */ h("button", {
-					type: "button",
-					onClick: () => w(!0),
-					className: "rounded-lg bg-foreground px-4 py-2 text-sm font-medium text-background hover:opacity-90 transition-opacity",
-					children: "Add Payment Method"
-				})
-			}),
-			/* @__PURE__ */ g("div", {
-				className: "mt-8",
-				children: [/* @__PURE__ */ h("h2", {
-					className: "text-base font-semibold text-text-primary mb-4",
-					children: "Quick Pay Options"
-				}), /* @__PURE__ */ g("div", {
-					className: "grid grid-cols-1 sm:grid-cols-2 gap-4",
-					children: [/* @__PURE__ */ g("div", {
-						className: "rounded-lg border border-border-seam bg-bg-surface p-5 bg-gloss-card shadow-pop",
-						children: [
-							/* @__PURE__ */ g("div", {
-								className: "flex items-center gap-3 mb-2",
-								children: [/* @__PURE__ */ h("div", {
-									className: "flex h-10 w-10 shrink-0 items-center justify-center rounded-lg bg-bg-sunken",
-									children: /* @__PURE__ */ h(a, { className: "h-5 w-5 text-text-secondary" })
-								}), /* @__PURE__ */ h("h3", {
-									className: "text-sm font-semibold text-text-primary",
-									children: "Cash on Delivery"
-								})]
-							}),
-							/* @__PURE__ */ h("p", {
-								className: "text-xs text-text-secondary mb-3",
-								children: "Pay when you receive your order"
-							}),
-							/* @__PURE__ */ g("div", {
-								className: "flex items-center gap-2 text-status-success-text",
-								children: [/* @__PURE__ */ h(o, { className: "h-3.5 w-3.5 shrink-0" }), /* @__PURE__ */ h("span", {
-									className: "text-xs",
-									children: "Available for all orders"
-								})]
-							})
-						]
-					}), /* @__PURE__ */ g("div", {
-						className: "rounded-lg border border-border-seam bg-bg-surface p-5 bg-gloss-card shadow-pop",
-						children: [
-							/* @__PURE__ */ g("div", {
-								className: "flex items-center gap-3 mb-2",
-								children: [/* @__PURE__ */ h("div", {
-									className: "flex h-10 w-10 shrink-0 items-center justify-center rounded-lg bg-bg-sunken",
-									children: /* @__PURE__ */ h(u, { className: "h-5 w-5 text-text-secondary" })
-								}), /* @__PURE__ */ h("h3", {
-									className: "text-sm font-semibold text-text-primary",
-									children: "Pay at Cart"
-								})]
-							}),
-							/* @__PURE__ */ h("p", {
-								className: "text-xs text-text-secondary mb-3",
-								children: "Pay directly to the vendor"
-							}),
-							/* @__PURE__ */ g("div", {
-								className: "flex items-center gap-2 text-status-success-text",
-								children: [/* @__PURE__ */ h(o, { className: "h-3.5 w-3.5 shrink-0" }), /* @__PURE__ */ h("span", {
-									className: "text-xs",
-									children: "Supports all payment methods"
-								})]
-							})
-						]
-					})]
-				})]
-			}),
-			C && /* @__PURE__ */ h("div", {
-				className: "fixed inset-0 z-50 flex items-center justify-center bg-black/50 p-4",
-				children: /* @__PURE__ */ h("div", {
-					className: "w-full max-w-md max-h-[90vh] overflow-y-auto rounded-lg border border-border-subtle bg-bg-surface shadow-lg",
-					children: /* @__PURE__ */ g("div", {
-						className: "p-5",
-						children: [
-							/* @__PURE__ */ g("div", {
-								className: "flex items-center justify-between mb-4",
-								children: [/* @__PURE__ */ h("h2", {
-									className: "text-lg font-semibold text-text-primary",
-									children: "Add Payment Method"
-								}), /* @__PURE__ */ h("button", {
-									type: "button",
-									onClick: () => {
-										w(!1), I();
-									},
-									className: "rounded-md p-2 text-text-secondary hover:bg-accent hover:text-text-primary transition-colors",
-									children: /* @__PURE__ */ h(m, { className: "h-4 w-4" })
-								})]
-							}),
-							/* @__PURE__ */ h("p", {
-								className: "text-sm text-text-secondary mb-5",
-								children: "Choose a payment method to add to your account"
-							}),
-							/* @__PURE__ */ h("div", {
-								className: "space-y-2 mb-5",
-								children: [
-									{
-										value: "card",
-										label: "Credit/Debit Card",
-										sub: "Visa, Mastercard, Rupay",
-										Icon: s
-									},
-									{
-										value: "upi",
-										label: "UPI",
-										sub: "Google Pay, PhonePe, Paytm",
-										Icon: d
-									},
-									{
-										value: "wallet",
-										label: "Wallet",
-										sub: "Paytm, Amazon Pay, Mobikwik",
-										Icon: p
-									}
-								].map(({ value: e, label: n, sub: r, Icon: i }) => /* @__PURE__ */ g("label", {
-									className: t("flex items-center gap-3 rounded-lg border p-3 cursor-pointer transition-colors", T === e ? "border-foreground bg-accent" : "border-border-subtle hover:bg-accent"),
-									children: [
-										/* @__PURE__ */ h("input", {
-											type: "radio",
-											name: "paymentType",
-											value: e,
-											checked: T === e,
-											onChange: () => E(e),
-											className: "h-4 w-4 shrink-0"
-										}),
-										/* @__PURE__ */ h(i, { className: "h-5 w-5 text-text-secondary shrink-0" }),
-										/* @__PURE__ */ g("div", { children: [/* @__PURE__ */ h("p", {
-											className: "text-sm font-medium text-text-primary",
-											children: n
-										}), /* @__PURE__ */ h("p", {
-											className: "text-xs text-text-secondary",
-											children: r
-										})] })
-									]
-								}, e))
-							}),
-							T === "card" && /* @__PURE__ */ g("div", {
-								className: "space-y-3",
-								children: [
-									/* @__PURE__ */ g("div", { children: [/* @__PURE__ */ h("label", {
-										className: "block text-sm font-medium text-text-primary mb-1",
-										children: "Card Number"
-									}), /* @__PURE__ */ h("input", {
-										type: "text",
-										placeholder: "1234 5678 9012 3456",
-										value: k.cardNumber,
-										onChange: (e) => A((t) => ({
-											...t,
-											cardNumber: e.target.value
-										})),
-										className: "w-full rounded-lg border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary placeholder:text-text-secondary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)]"
-									})] }),
-									/* @__PURE__ */ g("div", {
-										className: "grid grid-cols-2 gap-3",
-										children: [/* @__PURE__ */ g("div", { children: [/* @__PURE__ */ h("label", {
-											className: "block text-sm font-medium text-text-primary mb-1",
-											children: "Expiry Date"
-										}), /* @__PURE__ */ h("input", {
-											type: "text",
-											placeholder: "MM/YY",
-											value: k.expiry,
-											onChange: (e) => A((t) => ({
-												...t,
-												expiry: e.target.value
-											})),
-											className: "w-full rounded-lg border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary placeholder:text-text-secondary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)]"
-										})] }), /* @__PURE__ */ g("div", { children: [/* @__PURE__ */ h("label", {
-											className: "block text-sm font-medium text-text-primary mb-1",
-											children: "CVV"
-										}), /* @__PURE__ */ h("input", {
-											type: "password",
-											placeholder: "123",
-											value: k.cvv,
-											onChange: (e) => A((t) => ({
-												...t,
-												cvv: e.target.value
-											})),
-											className: "w-full rounded-lg border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary placeholder:text-text-secondary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)]"
-										})] })]
-									}),
-									/* @__PURE__ */ g("div", { children: [/* @__PURE__ */ h("label", {
-										className: "block text-sm font-medium text-text-primary mb-1",
-										children: "Name on Card"
-									}), /* @__PURE__ */ h("input", {
-										type: "text",
-										placeholder: "John Doe",
-										value: k.nameOnCard,
-										onChange: (e) => A((t) => ({
-											...t,
-											nameOnCard: e.target.value
-										})),
-										className: "w-full rounded-lg border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary placeholder:text-text-secondary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)]"
-									})] })
-								]
-							}),
-							T === "upi" && /* @__PURE__ */ g("div", { children: [/* @__PURE__ */ h("label", {
-								className: "block text-sm font-medium text-text-primary mb-1",
-								children: "UPI ID"
-							}), /* @__PURE__ */ h("input", {
-								type: "text",
-								placeholder: "yourname@paytm",
-								value: j.upiId,
-								onChange: (e) => M({ upiId: e.target.value }),
-								className: "w-full rounded-lg border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary placeholder:text-text-secondary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)]"
-							})] }),
-							T === "wallet" && /* @__PURE__ */ g("div", {
-								className: "space-y-3",
-								children: [/* @__PURE__ */ g("div", { children: [/* @__PURE__ */ h("label", {
-									className: "block text-sm font-medium text-text-primary mb-1",
-									children: "Select Wallet"
-								}), /* @__PURE__ */ g("select", {
-									value: N.walletProvider,
-									onChange: (e) => P((t) => ({
-										...t,
-										walletProvider: e.target.value
-									})),
-									className: "w-full rounded-lg border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)]",
-									children: [
-										/* @__PURE__ */ h("option", { children: "Paytm" }),
-										/* @__PURE__ */ h("option", { children: "Amazon Pay" }),
-										/* @__PURE__ */ h("option", { children: "Mobikwik" }),
-										/* @__PURE__ */ h("option", { children: "Freecharge" })
-									]
-								})] }), /* @__PURE__ */ g("div", { children: [/* @__PURE__ */ h("label", {
-									className: "block text-sm font-medium text-text-primary mb-1",
-									children: "Mobile Number"
-								}), /* @__PURE__ */ h("input", {
-									type: "tel",
-									placeholder: "9876543210",
-									value: N.mobile,
-									onChange: (e) => P((t) => ({
-										...t,
-										mobile: e.target.value
-									})),
-									className: "w-full rounded-lg border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary placeholder:text-text-secondary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)]"
-								})] })]
-							}),
-							/* @__PURE__ */ g("div", {
-								className: "flex items-center gap-3 pt-5",
-								children: [/* @__PURE__ */ h("button", {
-									type: "button",
-									onClick: z,
-									className: "flex-1 rounded-lg bg-foreground px-4 py-2 text-sm font-medium text-background hover:opacity-90 transition-opacity",
-									children: "Add Payment Method"
-								}), /* @__PURE__ */ h("button", {
-									type: "button",
-									onClick: () => {
-										w(!1), I();
-									},
-									className: "flex-1 rounded-lg border border-border-subtle px-4 py-2 text-sm font-medium text-text-primary hover:bg-accent transition-colors",
-									children: "Cancel"
-								})]
-							})
-						]
-					})
-				})
-			})
-		]
-	});
-}
-//#endregion
-export { x as PaymentMethodsPage };
-
-//# sourceMappingURL=PaymentMethodsPage.js.map

package/dist/coolandlovely/pages/customer/PaymentMethodsPage.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"PaymentMethodsPage.js","names":[],"sources":["../../../../src/coolandlovely/pages/customer/PaymentMethodsPage.tsx"],"sourcesContent":["/**\n * Payment Methods Page\n * @module coolandlovely/pages/customer\n *\n * Manage saved payment methods: UPI IDs, credit/debit cards, wallets.\n * Add Payment Method modal with type selection (Card/UPI/Wallet),\n * conditional forms, Quick Pay Options section (Cash on Delivery,\n * Pay at Cart), form state management, grouped display, security badge.\n */\n\nimport { useState } from'react';\nimport {\n  CreditCard,\n  Smartphone,\n  Wallet,\n  Plus,\n  Trash2,\n  CheckCircle2,\n  Shield,\n  X,\n  Banknote,\n  ShoppingCart,\n} from'lucide-react';\nimport { EmphasisPanel, PagePurpose } from'@burdenoff/fe-libs/ui';\nimport { PageLayout } from'../../components/PageLayout';\nimport { EmptyState } from'../../components/EmptyState';\nimport { useCoolAndLovely } from'../../context/CoolAndLovelyContext';\nimport { cn } from'../../utils/cn';\n\n// ============================================================================\n// Types\n// ============================================================================\n\ninterface PaymentMethod {\n  id: string;\n  type: 'upi' | 'card' | 'wallet';\n  label: string;\n  detail: string;\n  icon: typeof CreditCard;\n  isDefault: boolean;\n}\n\ninterface CardFormState {\n  cardNumber: string;\n  expiry: string;\n  cvv: string;\n  nameOnCard: string;\n}\n\ninterface UpiFormState {\n  upiId: string;\n}\n\ninterface WalletFormState {\n  walletProvider: string;\n  mobile: string;\n}\n\n// ============================================================================\n// Mock Data\n// ============================================================================\n\nconst initialMethods: PaymentMethod[] = [\n  {\n    id: 'pm-1',\n    type: 'upi',\n    label: 'Google Pay',\n    detail: 'priya@okaxis',\n    icon: Smartphone,\n    isDefault: true,\n  },\n  {\n    id: 'pm-2',\n    type: 'upi',\n    label: 'PhonePe',\n    detail: 'priya@ybl',\n    icon: Smartphone,\n    isDefault: false,\n  },\n  {\n    id: 'pm-3',\n    type: 'card',\n    label: 'HDFC Credit Card',\n    detail: '**** **** **** 4242',\n    icon: CreditCard,\n    isDefault: false,\n  },\n  {\n    id: 'pm-4',\n    type: 'card',\n    label: 'SBI Debit Card',\n    detail: '**** **** **** 8765',\n    icon: CreditCard,\n    isDefault: false,\n  },\n  {\n    id: 'pm-5',\n    type: 'wallet',\n    label: 'CoolAndLovely Wallet',\n    detail: 'Balance: \\u20B9 1,250.00',\n    icon: Wallet,\n    isDefault: false,\n  },\n];\n\n// ============================================================================\n// Payment Method Row\n// ============================================================================\n\nfunction PaymentMethodRow({\n  method,\n  onRemove,\n  onSetDefault,\n}: {\n  method: PaymentMethod;\n  onRemove: (id: string) => void;\n  onSetDefault: (id: string) => void;\n}) {\n  const Icon = method.icon;\n\n  return (\n    <div\n      className={cn(\n        'flex items-center gap-4 rounded-lg border p-4',\n        method.isDefault ? 'border-foreground/30 bg-accent/50' : 'border-border-subtle bg-bg-surface'\n      )}\n    >\n      <div className=\"flex h-10 w-10 shrink-0 items-center justify-center rounded-lg bg-bg-sunken\">\n        <Icon className=\"h-5 w-5 text-text-secondary\" />\n      </div>\n\n      <div className=\"flex-1 min-w-0\">\n        <div className=\"flex items-center gap-2\">\n          <p className=\"text-sm font-medium text-text-primary\">{method.label}</p>\n          {method.isDefault && (\n            <span className=\"inline-flex items-center gap-1 rounded-full bg-status-success-bg-subtle/10 px-2 py-0.5 text-[10px] font-medium text-status-success-text\">\n              <CheckCircle2 className=\"h-3 w-3\" />\n              Default\n            </span>\n          )}\n        </div>\n        <p className=\"mt-0.5 text-xs text-text-secondary font-mono\">{method.detail}</p>\n      </div>\n\n      <div className=\"flex items-center gap-1\">\n        {!method.isDefault && (\n          <button\n            type=\"button\"\n            onClick={() => onSetDefault(method.id)}\n            title=\"Set as default\"\n            className=\"rounded-md px-2 py-1 text-xs text-text-secondary hover:bg-accent hover:text-text-primary transition-colors\"\n          >\n            Set Default\n          </button>\n        )}\n        <button\n          type=\"button\"\n          onClick={() => onRemove(method.id)}\n          title=\"Remove payment method\"\n          className=\"rounded-md p-2 text-text-secondary hover:bg-status-error-bg/10 hover:text-status-error-text transition-colors\"\n        >\n          <Trash2 className=\"h-4 w-4\" />\n        </button>\n      </div>\n    </div>\n  );\n}\n\n// ============================================================================\n// Component\n// ============================================================================\n\nexport function PaymentMethodsPage() {\n  const { navigateTo } = useCoolAndLovely();\n  const [methods, setMethods] = useState<PaymentMethod[]>(initialMethods);\n  const [showAddModal, setShowAddModal] = useState(false);\n  const [selectedType, setSelectedType] = useState<'card' | 'upi' | 'wallet'>('card');\n  const [statusMessage, setStatusMessage] = useState<string | null>(null);\n\n  // Form states\n  const [cardForm, setCardForm] = useState<CardFormState>({\n    cardNumber: '',\n    expiry: '',\n    cvv: '',\n    nameOnCard: '',\n  });\n  const [upiForm, setUpiForm] = useState<UpiFormState>({ upiId: '' });\n  const [walletForm, setWalletForm] = useState<WalletFormState>({\n    walletProvider: 'Paytm',\n    mobile: '',\n  });\n\n  const showStatus = (msg: string) => {\n    setStatusMessage(msg);\n    setTimeout(() => setStatusMessage(null), 3000);\n  };\n\n  const resetForms = () => {\n    setCardForm({ cardNumber: '', expiry: '', cvv: '', nameOnCard: '' });\n    setUpiForm({ upiId: '' });\n    setWalletForm({ walletProvider: 'Paytm', mobile: '' });\n    setSelectedType('card');\n  };\n\n  const handleRemove = (id: string) => {\n    setMethods((prev) => prev.filter((m) => m.id !== id));\n    showStatus('Payment method removed');\n  };\n\n  const handleSetDefault = (id: string) => {\n    setMethods((prev) => prev.map((m) => ({ ...m, isDefault: m.id === id })));\n    showStatus('Default payment method updated');\n  };\n\n  const handleAddPaymentMethod = () => {\n    let label = '';\n    let detail = '';\n    let icon = CreditCard;\n\n    if (selectedType === 'card') {\n      if (\n        !cardForm.cardNumber.trim() ||\n        !cardForm.expiry.trim() ||\n        !cardForm.cvv.trim() ||\n        !cardForm.nameOnCard.trim()\n      ) {\n        alert('Please fill in all card fields.');\n        return;\n      }\n      label = `${cardForm.nameOnCard}'s Card`;\n      detail = `**** **** **** ${cardForm.cardNumber.slice(-4)}`;\n      icon = CreditCard;\n    } else if (selectedType === 'upi') {\n      if (!upiForm.upiId.trim()) {\n        alert('Please enter a UPI ID.');\n        return;\n      }\n      label = 'UPI';\n      detail = upiForm.upiId;\n      icon = Smartphone;\n    } else {\n      if (!walletForm.mobile.trim()) {\n        alert('Please enter mobile number.');\n        return;\n      }\n      label = walletForm.walletProvider;\n      detail = `Mobile: ${walletForm.mobile}`;\n      icon = Wallet;\n    }\n\n    const newMethod: PaymentMethod = {\n      id: `pm-${Date.now()}`,\n      type: selectedType,\n      label,\n      detail,\n      icon,\n      isDefault: false,\n    };\n\n    setMethods((prev) => [...prev, newMethod]);\n    resetForms();\n    setShowAddModal(false);\n    showStatus('Payment method added successfully');\n  };\n\n  const grouped = {\n    upi: methods.filter((m) => m.type === 'upi'),\n    card: methods.filter((m) => m.type === 'card'),\n    wallet: methods.filter((m) => m.type === 'wallet'),\n  };\n\n  return (\n    <PageLayout\n      title=\"Payment Methods\"\n      description=\"Manage your saved payment options\"\n      actions={\n        <button\n          type=\"button\"\n          onClick={() => setShowAddModal(true)}\n          className={cn(\n            'flex items-center gap-2 rounded-lg px-4 py-2 text-sm font-medium transition-opacity',\n            'bg-foreground text-background hover:opacity-90'\n          )}\n        >\n          <Plus className=\"h-4 w-4\" />\n          Add Method\n        </button>\n      }\n    >\n      <PagePurpose className=\"mb-6\" icon={<CreditCard className=\"h-4 w-4\" />}>\n        Save your UPI IDs, cards and wallets here so checkout is one tap, not a\n        form. Pick a default to use automatically, and switch on the fly at\n        checkout — or skip saved methods entirely with Cash on Delivery or Pay at\n        Cart.\n      </PagePurpose>\n\n      {/* Status message */}\n      {statusMessage && (\n        <div className=\"mb-4 rounded-lg border border-status-success-border/30 bg-status-success-bg-subtle/10 p-3 flex items-center gap-2\">\n          <CheckCircle2 className=\"h-4 w-4 text-status-success-text shrink-0\" />\n          <p className=\"text-sm text-status-success-text\">{statusMessage}</p>\n        </div>\n      )}\n\n      {methods.length > 0 ? (\n        <div className=\"space-y-6\">\n          {/* UPI */}\n          {grouped.upi.length > 0 && (\n            <section>\n              <h3 className=\"text-sm font-semibold text-text-primary mb-3 flex items-center gap-2\">\n                <Smartphone className=\"h-4 w-4 text-text-secondary\" />\n                UPI\n              </h3>\n              <div className=\"space-y-2\">\n                {grouped.upi.map((method) => (\n                  <PaymentMethodRow\n                    key={method.id}\n                    method={method}\n                    onRemove={handleRemove}\n                    onSetDefault={handleSetDefault}\n                  />\n                ))}\n              </div>\n            </section>\n          )}\n\n          {/* Cards */}\n          {grouped.card.length > 0 && (\n            <section>\n              <h3 className=\"text-sm font-semibold text-text-primary mb-3 flex items-center gap-2\">\n                <CreditCard className=\"h-4 w-4 text-text-secondary\" />\n                Cards\n              </h3>\n              <div className=\"space-y-2\">\n                {grouped.card.map((method) => (\n                  <PaymentMethodRow\n                    key={method.id}\n                    method={method}\n                    onRemove={handleRemove}\n                    onSetDefault={handleSetDefault}\n                  />\n                ))}\n              </div>\n            </section>\n          )}\n\n          {/* Wallets */}\n          {grouped.wallet.length > 0 && (\n            <section>\n              <h3 className=\"text-sm font-semibold text-text-primary mb-3 flex items-center gap-2\">\n                <Wallet className=\"h-4 w-4 text-text-secondary\" />\n                Wallets\n              </h3>\n              <div className=\"space-y-2\">\n                {grouped.wallet.map((method) => (\n                  <PaymentMethodRow\n                    key={method.id}\n                    method={method}\n                    onRemove={handleRemove}\n                    onSetDefault={handleSetDefault}\n                  />\n                ))}\n              </div>\n            </section>\n          )}\n\n          {/* Security note — primary emphasis zone */}\n          <EmphasisPanel className=\"flex items-start gap-3 p-4\">\n            <Shield className=\"mt-0.5 h-5 w-5 shrink-0 text-text-secondary\" />\n            <div>\n              <p className=\"text-sm font-medium text-text-primary\">Secure Payments</p>\n              <p className=\"mt-0.5 text-xs text-text-secondary\">\n                Your payment information is encrypted and securely stored. We never share your\n                financial details with third parties.\n              </p>\n            </div>\n          </EmphasisPanel>\n        </div>\n      ) : (\n        <EmptyState\n          illustration=\"empty-generic\"\n          title=\"No payment methods\"\n          description=\"Add a payment method to make faster checkouts.\"\n          action={\n            <button\n              type=\"button\"\n              onClick={() => setShowAddModal(true)}\n              className=\"rounded-lg bg-foreground px-4 py-2 text-sm font-medium text-background hover:opacity-90 transition-opacity\"\n            >\n              Add Payment Method\n            </button>\n          }\n        />\n      )}\n\n      {/* Quick Pay Options */}\n      <div className=\"mt-8\">\n        <h2 className=\"text-base font-semibold text-text-primary mb-4\">Quick Pay Options</h2>\n        <div className=\"grid grid-cols-1 sm:grid-cols-2 gap-4\">\n          <div className=\"rounded-lg border border-border-seam bg-bg-surface p-5 bg-gloss-card shadow-pop\">\n            <div className=\"flex items-center gap-3 mb-2\">\n              <div className=\"flex h-10 w-10 shrink-0 items-center justify-center rounded-lg bg-bg-sunken\">\n                <Banknote className=\"h-5 w-5 text-text-secondary\" />\n              </div>\n              <h3 className=\"text-sm font-semibold text-text-primary\">Cash on Delivery</h3>\n            </div>\n            <p className=\"text-xs text-text-secondary mb-3\">Pay when you receive your order</p>\n            <div className=\"flex items-center gap-2 text-status-success-text\">\n              <CheckCircle2 className=\"h-3.5 w-3.5 shrink-0\" />\n              <span className=\"text-xs\">Available for all orders</span>\n            </div>\n          </div>\n          <div className=\"rounded-lg border border-border-seam bg-bg-surface p-5 bg-gloss-card shadow-pop\">\n            <div className=\"flex items-center gap-3 mb-2\">\n              <div className=\"flex h-10 w-10 shrink-0 items-center justify-center rounded-lg bg-bg-sunken\">\n                <ShoppingCart className=\"h-5 w-5 text-text-secondary\" />\n              </div>\n              <h3 className=\"text-sm font-semibold text-text-primary\">Pay at Cart</h3>\n            </div>\n            <p className=\"text-xs text-text-secondary mb-3\">Pay directly to the vendor</p>\n            <div className=\"flex items-center gap-2 text-status-success-text\">\n              <CheckCircle2 className=\"h-3.5 w-3.5 shrink-0\" />\n              <span className=\"text-xs\">Supports all payment methods</span>\n            </div>\n          </div>\n        </div>\n      </div>\n\n      {/* Add Payment Method Modal */}\n      {showAddModal && (\n        <div className=\"fixed inset-0 z-50 flex items-center justify-center bg-black/50 p-4\">\n          <div className=\"w-full max-w-md max-h-[90vh] overflow-y-auto rounded-lg border border-border-subtle bg-bg-surface shadow-lg\">\n            <div className=\"p-5\">\n              {/* Header */}\n              <div className=\"flex items-center justify-between mb-4\">\n                <h2 className=\"text-lg font-semibold text-text-primary\">Add Payment Method</h2>\n                <button\n                  type=\"button\"\n                  onClick={() => {\n                    setShowAddModal(false);\n                    resetForms();\n                  }}\n                  className=\"rounded-md p-2 text-text-secondary hover:bg-accent hover:text-text-primary transition-colors\"\n                >\n                  <X className=\"h-4 w-4\" />\n                </button>\n              </div>\n              <p className=\"text-sm text-text-secondary mb-5\">\n                Choose a payment method to add to your account\n              </p>\n\n              {/* Type Selection */}\n              <div className=\"space-y-2 mb-5\">\n                {[\n                  {\n                    value: 'card' as const,\n                    label: 'Credit/Debit Card',\n                    sub: 'Visa, Mastercard, Rupay',\n                    Icon: CreditCard,\n                  },\n                  {\n                    value: 'upi' as const,\n                    label: 'UPI',\n                    sub: 'Google Pay, PhonePe, Paytm',\n                    Icon: Smartphone,\n                  },\n                  {\n                    value: 'wallet' as const,\n                    label: 'Wallet',\n                    sub: 'Paytm, Amazon Pay, Mobikwik',\n                    Icon: Wallet,\n                  },\n                ].map(({ value, label, sub, Icon }) => (\n                  <label\n                    key={value}\n                    className={cn(\n                      'flex items-center gap-3 rounded-lg border p-3 cursor-pointer transition-colors',\n                      selectedType === value\n                        ? 'border-foreground bg-accent'\n                        : 'border-border-subtle hover:bg-accent'\n                    )}\n                  >\n                    <input\n                      type=\"radio\"\n                      name=\"paymentType\"\n                      value={value}\n                      checked={selectedType === value}\n                      onChange={() => setSelectedType(value)}\n                      className=\"h-4 w-4 shrink-0\"\n                    />\n                    <Icon className=\"h-5 w-5 text-text-secondary shrink-0\" />\n                    <div>\n                      <p className=\"text-sm font-medium text-text-primary\">{label}</p>\n                      <p className=\"text-xs text-text-secondary\">{sub}</p>\n                    </div>\n                  </label>\n                ))}\n              </div>\n\n              {/* Card Form */}\n              {selectedType === 'card' && (\n                <div className=\"space-y-3\">\n                  <div>\n                    <label className=\"block text-sm font-medium text-text-primary mb-1\">\n                      Card Number\n                    </label>\n                    <input\n                      type=\"text\"\n                      placeholder=\"1234 5678 9012 3456\"\n                      value={cardForm.cardNumber}\n                      onChange={(e) => setCardForm((p) => ({ ...p, cardNumber: e.target.value }))}\n                      className=\"w-full rounded-lg border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary placeholder:text-text-secondary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)]\"\n                    />\n                  </div>\n                  <div className=\"grid grid-cols-2 gap-3\">\n                    <div>\n                      <label className=\"block text-sm font-medium text-text-primary mb-1\">\n                        Expiry Date\n                      </label>\n                      <input\n                        type=\"text\"\n                        placeholder=\"MM/YY\"\n                        value={cardForm.expiry}\n                        onChange={(e) => setCardForm((p) => ({ ...p, expiry: e.target.value }))}\n                        className=\"w-full rounded-lg border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary placeholder:text-text-secondary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)]\"\n                      />\n                    </div>\n                    <div>\n                      <label className=\"block text-sm font-medium text-text-primary mb-1\">CVV</label>\n                      <input\n                        type=\"password\"\n                        placeholder=\"123\"\n                        value={cardForm.cvv}\n                        onChange={(e) => setCardForm((p) => ({ ...p, cvv: e.target.value }))}\n                        className=\"w-full rounded-lg border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary placeholder:text-text-secondary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)]\"\n                      />\n                    </div>\n                  </div>\n                  <div>\n                    <label className=\"block text-sm font-medium text-text-primary mb-1\">\n                      Name on Card\n                    </label>\n                    <input\n                      type=\"text\"\n                      placeholder=\"John Doe\"\n                      value={cardForm.nameOnCard}\n                      onChange={(e) => setCardForm((p) => ({ ...p, nameOnCard: e.target.value }))}\n                      className=\"w-full rounded-lg border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary placeholder:text-text-secondary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)]\"\n                    />\n                  </div>\n                </div>\n              )}\n\n              {/* UPI Form */}\n              {selectedType === 'upi' && (\n                <div>\n                  <label className=\"block text-sm font-medium text-text-primary mb-1\">UPI ID</label>\n                  <input\n                    type=\"text\"\n                    placeholder=\"yourname@paytm\"\n                    value={upiForm.upiId}\n                    onChange={(e) => setUpiForm({ upiId: e.target.value })}\n                    className=\"w-full rounded-lg border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary placeholder:text-text-secondary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)]\"\n                  />\n                </div>\n              )}\n\n              {/* Wallet Form */}\n              {selectedType === 'wallet' && (\n                <div className=\"space-y-3\">\n                  <div>\n                    <label className=\"block text-sm font-medium text-text-primary mb-1\">\n                      Select Wallet\n                    </label>\n                    <select\n                      value={walletForm.walletProvider}\n                      onChange={(e) =>\n                        setWalletForm((p) => ({ ...p, walletProvider: e.target.value }))\n                      }\n                      className=\"w-full rounded-lg border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)]\"\n                    >\n                      <option>Paytm</option>\n                      <option>Amazon Pay</option>\n                      <option>Mobikwik</option>\n                      <option>Freecharge</option>\n                    </select>\n                  </div>\n                  <div>\n                    <label className=\"block text-sm font-medium text-text-primary mb-1\">\n                      Mobile Number\n                    </label>\n                    <input\n                      type=\"tel\"\n                      placeholder=\"9876543210\"\n                      value={walletForm.mobile}\n                      onChange={(e) => setWalletForm((p) => ({ ...p, mobile: e.target.value }))}\n                      className=\"w-full rounded-lg border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary placeholder:text-text-secondary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)]\"\n                    />\n                  </div>\n                </div>\n              )}\n\n              {/* Actions */}\n              <div className=\"flex items-center gap-3 pt-5\">\n                <button\n                  type=\"button\"\n                  onClick={handleAddPaymentMethod}\n                  className=\"flex-1 rounded-lg bg-foreground px-4 py-2 text-sm font-medium text-background hover:opacity-90 transition-opacity\"\n                >\n                  Add Payment Method\n                </button>\n                <button\n                  type=\"button\"\n                  onClick={() => {\n                    setShowAddModal(false);\n                    resetForms();\n                  }}\n                  className=\"flex-1 rounded-lg border border-border-subtle px-4 py-2 text-sm font-medium text-text-primary hover:bg-accent transition-colors\"\n                >\n                  Cancel\n                </button>\n              </div>\n            </div>\n          </div>\n        </div>\n      )}\n    </PageLayout>\n  );\n}\n"],"mappings":"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"}