@burdenoff/microfe-coolandlovely 2026.614.1

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

@@ -0,0 +1,388 @@
+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 { StatusBadge as r } from "../../components/StatusBadge.js";
+import { EmptyState as i } from "../../components/EmptyState.js";
+import { formatCurrency as a, formatDate as o } from "../../utils/formatters.js";
+import { getOrderById as s } from "../../mocks/data.js";
+import { useMemo as c, useState as l } from "react";
+import { ArrowLeft as u, CheckCircle2 as d, ChefHat as f, Circle as p, Clock as m, MapPin as h, MessageCircle as g, Package as _, Phone as v, ShoppingBag as y, Star as b, Truck as x, XCircle as S } from "lucide-react";
+import { useParams as C } from "react-router-dom";
+import { jsx as w, jsxs as T } from "react/jsx-runtime";
+//#region src/coolandlovely/pages/customer/OrderTrackingPage.tsx
+var E = {
+	pending: m,
+	confirmed: d,
+	preparing: f,
+	ready: _,
+	picked_up: _,
+	out_for_delivery: x,
+	delivered: d,
+	cancelled: S
+}, D = [
+	"pending",
+	"confirmed",
+	"preparing",
+	"ready",
+	"out_for_delivery",
+	"delivered"
+], O = {
+	pending: "Order Placed",
+	confirmed: "Confirmed",
+	preparing: "Preparing",
+	ready: "Ready",
+	out_for_delivery: "Out for Delivery",
+	delivered: "Delivered"
+}, k = {
+	pending: "Your order has been received",
+	confirmed: "Cart has accepted your order",
+	preparing: "Your food is being prepared",
+	ready: "Order is ready for pickup/delivery",
+	out_for_delivery: "Your order is on the way",
+	delivered: "Order has been delivered"
+};
+function A() {
+	let { orderId: f } = C(), { navigateTo: _ } = e(), [x, A] = l(!0);
+	c(() => {
+		let e = setTimeout(() => A(!1), 800);
+		return () => clearTimeout(e);
+	}, []);
+	let j = c(() => f ? s(f) : void 0, [f]);
+	if (x) return /* @__PURE__ */ w(n, {
+		title: "Track Order",
+		children: /* @__PURE__ */ T("div", {
+			className: "flex flex-col items-center justify-center py-16 text-center",
+			children: [/* @__PURE__ */ w("div", { className: "animate-spin rounded-full h-12 w-12 border-b-2 border-foreground mx-auto mb-4" }), /* @__PURE__ */ w("p", {
+				className: "text-sm text-muted-foreground",
+				children: "Loading order details..."
+			})]
+		})
+	});
+	if (!j) return /* @__PURE__ */ w(n, {
+		title: "Order Not Found",
+		children: /* @__PURE__ */ w(i, {
+			icon: /* @__PURE__ */ w(y, { className: "h-12 w-12" }),
+			title: "Order not found",
+			description: "The order you're looking for doesn't exist.",
+			action: /* @__PURE__ */ w("button", {
+				type: "button",
+				onClick: () => _("/customer/orders"),
+				className: "rounded-lg bg-foreground px-4 py-2 text-sm font-medium text-background hover:opacity-90 transition-opacity",
+				children: "View All Orders"
+			})
+		})
+	});
+	let M = D.indexOf(j.status), N = j.status === "cancelled", P = j.status === "delivered", F = (e) => D.indexOf(e) <= M, I = (e) => e === j.status;
+	return /* @__PURE__ */ w(n, {
+		title: /* @__PURE__ */ T("div", {
+			className: "flex items-center gap-3",
+			children: [/* @__PURE__ */ w("button", {
+				type: "button",
+				onClick: () => _("/customer/orders"),
+				className: "rounded-md p-1 text-muted-foreground hover:bg-accent hover:text-foreground transition-colors",
+				children: /* @__PURE__ */ w(u, { className: "h-5 w-5" })
+			}), /* @__PURE__ */ w("span", { children: "Track Order" })]
+		}),
+		actions: /* @__PURE__ */ w(r, { status: j.status }),
+		children: /* @__PURE__ */ T("div", {
+			className: "grid grid-cols-1 gap-6 lg:grid-cols-3",
+			children: [/* @__PURE__ */ T("div", {
+				className: "lg:col-span-2 space-y-6",
+				children: [
+					/* @__PURE__ */ T("div", {
+						className: "rounded-lg border border-border bg-card p-5",
+						children: [/* @__PURE__ */ T("div", {
+							className: "flex flex-col sm:flex-row sm:justify-between sm:items-start gap-3",
+							children: [/* @__PURE__ */ T("div", {
+								className: "flex-1",
+								children: [
+									/* @__PURE__ */ T("h2", {
+										className: "text-lg font-semibold text-foreground",
+										children: ["Order #", j.id]
+									}),
+									/* @__PURE__ */ w("p", {
+										className: "text-sm text-muted-foreground",
+										children: j.cartName
+									}),
+									/* @__PURE__ */ w("p", {
+										className: "text-xs text-muted-foreground mt-0.5",
+										children: o(j.orderDate)
+									})
+								]
+							}), /* @__PURE__ */ T("div", {
+								className: "text-left sm:text-right",
+								children: [/* @__PURE__ */ w("p", {
+									className: "text-xl font-bold text-foreground",
+									children: a(j.total, { minimumFractionDigits: 0 })
+								}), /* @__PURE__ */ w("p", {
+									className: "text-xs text-muted-foreground uppercase",
+									children: j.paymentMethod
+								})]
+							})]
+						}), N ? /* @__PURE__ */ T("div", {
+							className: "mt-4 flex items-start gap-3 rounded-lg bg-destructive/10 p-4 border border-destructive/20",
+							children: [/* @__PURE__ */ w(S, { className: "h-5 w-5 text-destructive mt-0.5 shrink-0" }), /* @__PURE__ */ T("div", { children: [/* @__PURE__ */ w("p", {
+								className: "font-medium text-destructive",
+								children: "Order Cancelled"
+							}), j.cancellationReason && /* @__PURE__ */ w("p", {
+								className: "text-sm text-destructive/80 mt-0.5",
+								children: j.cancellationReason
+							})] })]
+						}) : /* @__PURE__ */ T("div", {
+							className: t("mt-4 flex items-start gap-3 rounded-lg p-4 border", P ? "bg-green-500/10 border-green-500/20" : "bg-blue-500/10 border-blue-500/20"),
+							children: [P ? /* @__PURE__ */ w(d, { className: "h-5 w-5 text-green-600 dark:text-green-400 mt-0.5 shrink-0" }) : /* @__PURE__ */ w(m, { className: "h-5 w-5 text-blue-600 dark:text-blue-400 mt-0.5 shrink-0" }), /* @__PURE__ */ w("p", {
+								className: t("text-sm font-medium", P ? "text-green-600 dark:text-green-400" : "text-blue-600 dark:text-blue-400"),
+								children: P ? `Delivered at ${o(j.actualDeliveryTime)}` : j.estimatedDeliveryTime ? `Estimated delivery by ${o(j.estimatedDeliveryTime)}` : "Estimated delivery time: TBD"
+							})]
+						})]
+					}),
+					!N && /* @__PURE__ */ T("div", {
+						className: "rounded-lg border border-border bg-card p-5",
+						children: [/* @__PURE__ */ w("h3", {
+							className: "text-base font-semibold text-foreground mb-5",
+							children: "Order Status"
+						}), /* @__PURE__ */ w("div", {
+							className: "relative space-y-0",
+							children: D.map((e, n) => {
+								let r = F(e), i = I(e), a = n === D.length - 1, o = E[e] ?? p;
+								return /* @__PURE__ */ T("div", {
+									className: "flex items-start relative",
+									children: [
+										!a && /* @__PURE__ */ w("div", { className: t("absolute left-5 top-10 w-0.5 h-8 z-0", r ? "bg-green-500" : "bg-border") }),
+										/* @__PURE__ */ w("div", {
+											className: t("relative z-10 flex h-10 w-10 shrink-0 items-center justify-center rounded-full", r ? "bg-green-500/10 border-2 border-green-500 text-green-600 dark:text-green-400" : "bg-muted border-2 border-border text-muted-foreground", i && "ring-4 ring-green-500/20"),
+											children: /* @__PURE__ */ w(o, { className: "h-4 w-4" })
+										}),
+										/* @__PURE__ */ T("div", {
+											className: "ml-4 flex-1 pb-8",
+											children: [
+												/* @__PURE__ */ w("h4", {
+													className: t("text-sm font-semibold", r ? "text-foreground" : "text-muted-foreground"),
+													children: O[e]
+												}),
+												/* @__PURE__ */ w("p", {
+													className: t("text-xs", r ? "text-muted-foreground" : "text-muted-foreground/50"),
+													children: k[e]
+												}),
+												i && j.assignedWorker && /* @__PURE__ */ T("div", {
+													className: "mt-1.5 text-xs text-blue-600 dark:text-blue-400",
+													children: [/* @__PURE__ */ T("p", { children: ["Driver: ", j.assignedWorker.name] }), /* @__PURE__ */ T("p", { children: ["Contact: ", j.assignedWorker.phone] })]
+												})
+											]
+										})
+									]
+								}, e);
+							})
+						})]
+					}),
+					/* @__PURE__ */ T("div", {
+						className: "rounded-lg border border-border bg-card p-5",
+						children: [
+							/* @__PURE__ */ w("h3", {
+								className: "text-base font-semibold text-foreground mb-3",
+								children: "Order Items"
+							}),
+							/* @__PURE__ */ w("div", {
+								className: "space-y-2",
+								children: j.items.map((e, t) => /* @__PURE__ */ T("div", {
+									className: "flex justify-between items-start pb-2 border-b border-border last:border-b-0",
+									children: [/* @__PURE__ */ T("div", {
+										className: "flex-1 pr-2",
+										children: [
+											/* @__PURE__ */ w("p", {
+												className: "text-sm font-medium text-foreground",
+												children: e.name
+											}),
+											e.customizations && e.customizations.length > 0 && /* @__PURE__ */ w("p", {
+												className: "text-xs text-muted-foreground",
+												children: e.customizations.join(", ")
+											}),
+											/* @__PURE__ */ T("p", {
+												className: "text-xs text-muted-foreground",
+												children: [
+													a(e.price, { minimumFractionDigits: 0 }),
+													" x ",
+													e.quantity
+												]
+											})
+										]
+									}), /* @__PURE__ */ w("p", {
+										className: "text-sm font-medium text-foreground",
+										children: a(e.price * e.quantity, { minimumFractionDigits: 0 })
+									})]
+								}, t))
+							}),
+							/* @__PURE__ */ T("div", {
+								className: "mt-4 pt-4 border-t border-border space-y-2 text-sm",
+								children: [
+									/* @__PURE__ */ T("div", {
+										className: "flex justify-between text-muted-foreground",
+										children: [/* @__PURE__ */ w("span", { children: "Subtotal" }), /* @__PURE__ */ w("span", { children: a(j.subtotal, { minimumFractionDigits: 0 }) })]
+									}),
+									/* @__PURE__ */ T("div", {
+										className: "flex justify-between text-muted-foreground",
+										children: [/* @__PURE__ */ w("span", { children: "Delivery Fee" }), /* @__PURE__ */ w("span", { children: j.deliveryFee === 0 ? "FREE" : a(j.deliveryFee, { minimumFractionDigits: 0 }) })]
+									}),
+									/* @__PURE__ */ T("div", {
+										className: "flex justify-between text-muted-foreground",
+										children: [/* @__PURE__ */ w("span", { children: "Tax" }), /* @__PURE__ */ w("span", { children: a(j.taxes, { minimumFractionDigits: 0 }) })]
+									}),
+									j.discount && j.discount > 0 && /* @__PURE__ */ T("div", {
+										className: "flex justify-between text-green-600 dark:text-green-400",
+										children: [/* @__PURE__ */ w("span", { children: "Discount" }), /* @__PURE__ */ T("span", { children: ["-", a(j.discount, { minimumFractionDigits: 0 })] })]
+									}),
+									/* @__PURE__ */ T("div", {
+										className: "flex justify-between font-semibold pt-2 border-t border-border text-foreground",
+										children: [/* @__PURE__ */ w("span", { children: "Total" }), /* @__PURE__ */ w("span", { children: a(j.total, { minimumFractionDigits: 0 }) })]
+									})
+								]
+							})
+						]
+					})
+				]
+			}), /* @__PURE__ */ T("div", {
+				className: "lg:col-span-1 space-y-6",
+				children: [
+					/* @__PURE__ */ T("div", {
+						className: "rounded-lg border border-border bg-card p-5",
+						children: [/* @__PURE__ */ w("h3", {
+							className: "text-base font-semibold text-foreground mb-3",
+							children: "Delivery Details"
+						}), /* @__PURE__ */ T("div", {
+							className: "space-y-3",
+							children: [
+								/* @__PURE__ */ T("div", {
+									className: "flex items-start gap-2",
+									children: [/* @__PURE__ */ w(h, { className: "mt-0.5 h-4 w-4 shrink-0 text-muted-foreground" }), /* @__PURE__ */ T("div", { children: [
+										/* @__PURE__ */ w("p", {
+											className: "text-xs text-muted-foreground",
+											children: "Delivery Address"
+										}),
+										/* @__PURE__ */ w("p", {
+											className: "text-sm font-medium text-foreground",
+											children: j.deliveryAddress.street
+										}),
+										/* @__PURE__ */ w("p", {
+											className: "text-sm text-muted-foreground",
+											children: j.deliveryAddress.area
+										}),
+										/* @__PURE__ */ T("p", {
+											className: "text-sm text-muted-foreground",
+											children: [
+												j.deliveryAddress.city,
+												", ",
+												j.deliveryAddress.pincode
+											]
+										}),
+										j.deliveryAddress.landmark && /* @__PURE__ */ T("p", {
+											className: "text-xs text-muted-foreground mt-0.5",
+											children: ["Landmark: ", j.deliveryAddress.landmark]
+										})
+									] })]
+								}),
+								j.customerNotes && /* @__PURE__ */ T("div", { children: [/* @__PURE__ */ w("p", {
+									className: "text-xs text-muted-foreground",
+									children: "Customer Notes"
+								}), /* @__PURE__ */ w("p", {
+									className: "text-sm text-foreground",
+									children: j.customerNotes
+								})] }),
+								/* @__PURE__ */ T("div", { children: [
+									/* @__PURE__ */ w("p", {
+										className: "text-xs text-muted-foreground",
+										children: "Payment Method"
+									}),
+									/* @__PURE__ */ w("p", {
+										className: "text-sm font-medium text-foreground capitalize",
+										children: j.paymentMethod
+									}),
+									/* @__PURE__ */ w("p", {
+										className: "text-xs text-muted-foreground",
+										children: j.paymentStatus === "completed" ? "Paid" : "Payment Pending"
+									})
+								] })
+							]
+						})]
+					}),
+					j.assignedWorker && /* @__PURE__ */ T("div", {
+						className: "rounded-lg border border-border bg-card p-5",
+						children: [/* @__PURE__ */ w("h3", {
+							className: "text-base font-semibold text-foreground mb-3",
+							children: "Delivery Partner"
+						}), /* @__PURE__ */ T("div", {
+							className: "space-y-3",
+							children: [/* @__PURE__ */ T("div", {
+								className: "flex items-center gap-3",
+								children: [
+									/* @__PURE__ */ w("div", {
+										className: "flex h-10 w-10 items-center justify-center rounded-full bg-muted text-muted-foreground",
+										children: /* @__PURE__ */ w("span", {
+											className: "text-sm font-semibold",
+											children: j.assignedWorker.name.charAt(0)
+										})
+									}),
+									/* @__PURE__ */ T("div", {
+										className: "flex-1 min-w-0",
+										children: [/* @__PURE__ */ w("p", {
+											className: "text-sm font-medium text-foreground",
+											children: j.assignedWorker.name
+										}), /* @__PURE__ */ T("div", {
+											className: "flex items-center gap-1.5 mt-0.5",
+											children: [/* @__PURE__ */ w(b, { className: "h-3 w-3 fill-yellow-400 text-yellow-400" }), /* @__PURE__ */ T("span", {
+												className: "text-xs text-muted-foreground",
+												children: [j.assignedWorker.rating, "/5"]
+											})]
+										})]
+									}),
+									/* @__PURE__ */ w("a", {
+										href: `tel:${j.assignedWorker.phone}`,
+										className: "flex h-9 w-9 items-center justify-center rounded-full bg-muted text-muted-foreground hover:bg-accent hover:text-foreground transition-colors",
+										children: /* @__PURE__ */ w(v, { className: "h-4 w-4" })
+									})
+								]
+							}), /* @__PURE__ */ T("button", {
+								type: "button",
+								onClick: () => window.location.href = `tel:${j.assignedWorker.phone}`,
+								className: "w-full flex items-center justify-center gap-2 rounded-lg border border-border px-3 py-2.5 text-sm font-medium text-foreground hover:bg-accent transition-colors",
+								children: [/* @__PURE__ */ w(v, { className: "h-4 w-4" }), "Call Driver"]
+							})]
+						})]
+					}),
+					/* @__PURE__ */ T("div", {
+						className: "rounded-lg border border-border bg-card p-5",
+						children: [/* @__PURE__ */ w("h3", {
+							className: "text-base font-semibold text-foreground mb-3",
+							children: "Need Help?"
+						}), /* @__PURE__ */ T("div", {
+							className: "space-y-2",
+							children: [
+								/* @__PURE__ */ T("button", {
+									type: "button",
+									onClick: () => alert("Chat support coming soon!"),
+									className: "w-full flex items-center justify-center gap-2 rounded-lg border border-border px-3 py-2.5 text-sm font-medium text-foreground hover:bg-accent transition-colors",
+									children: [/* @__PURE__ */ w(g, { className: "h-4 w-4" }), "Chat Support"]
+								}),
+								/* @__PURE__ */ T("button", {
+									type: "button",
+									onClick: () => window.location.href = "tel:7012270561",
+									className: "w-full flex items-center justify-center gap-2 rounded-lg border border-border px-3 py-2.5 text-sm font-medium text-foreground hover:bg-accent transition-colors",
+									children: [/* @__PURE__ */ w(v, { className: "h-4 w-4" }), "Call Support"]
+								}),
+								P && !j.rating && /* @__PURE__ */ T("button", {
+									type: "button",
+									onClick: () => _(`/customer/orders/${j.id}/rate`),
+									className: "w-full flex items-center justify-center gap-2 rounded-lg bg-foreground px-3 py-2.5 text-sm font-medium text-background hover:opacity-90 transition-opacity",
+									children: [/* @__PURE__ */ w(b, { className: "h-4 w-4" }), "Rate Order"]
+								})
+							]
+						})]
+					})
+				]
+			})]
+		})
+	});
+}
+//#endregion
+export { A as OrderTrackingPage };
+
+//# sourceMappingURL=OrderTrackingPage.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"OrderTrackingPage.js","names":[],"sources":["../../../../src/coolandlovely/pages/customer/OrderTrackingPage.tsx"],"sourcesContent":["/**\n * Order Tracking Page\n * @module coolandlovely/pages/customer\n *\n * Real-time order tracking with status timeline, delivery partner info,\n * price breakdown, Need Help sidebar, and rate order functionality.\n */\n\nimport { useState, useMemo } from 'react';\nimport { useParams } from 'react-router-dom';\nimport {\n  ArrowLeft,\n  CheckCircle2,\n  Circle,\n  Clock,\n  MapPin,\n  Phone,\n  Star,\n  Package,\n  Truck,\n  ChefHat,\n  ShoppingBag,\n  XCircle,\n  MessageCircle,\n  AlertTriangle,\n} from 'lucide-react';\nimport { PageLayout } from '../../components/PageLayout';\nimport { StatusBadge } from '../../components/StatusBadge';\nimport { EmptyState } from '../../components/EmptyState';\nimport { useCoolAndLovely } from '../../context/CoolAndLovelyContext';\nimport { getOrderById } from '../../mocks/data';\nimport { cn } from '../../utils/cn';\nimport { formatCurrency, formatDate } from '../../utils/formatters';\nimport type { OrderStatus } from '../../types';\n\nconst statusIcons: Record<string, typeof Package> = {\n  pending: Clock,\n  confirmed: CheckCircle2,\n  preparing: ChefHat,\n  ready: Package,\n  picked_up: Package,\n  out_for_delivery: Truck,\n  delivered: CheckCircle2,\n  cancelled: XCircle,\n};\n\nconst statusOrder: OrderStatus[] = [\n  'pending',\n  'confirmed',\n  'preparing',\n  'ready',\n  'out_for_delivery',\n  'delivered',\n];\n\nconst statusLabels: Record<string, string> = {\n  pending: 'Order Placed',\n  confirmed: 'Confirmed',\n  preparing: 'Preparing',\n  ready: 'Ready',\n  out_for_delivery: 'Out for Delivery',\n  delivered: 'Delivered',\n};\n\nconst statusDescriptions: Record<string, string> = {\n  pending: 'Your order has been received',\n  confirmed: 'Cart has accepted your order',\n  preparing: 'Your food is being prepared',\n  ready: 'Order is ready for pickup/delivery',\n  out_for_delivery: 'Your order is on the way',\n  delivered: 'Order has been delivered',\n};\n\nexport function OrderTrackingPage() {\n  const { orderId } = useParams<{ orderId: string }>();\n  const { navigateTo } = useCoolAndLovely();\n  const [isLoading, setIsLoading] = useState(true);\n\n  // Simulate loading\n  useMemo(() => {\n    const timer = setTimeout(() => setIsLoading(false), 800);\n    return () => clearTimeout(timer);\n  }, []);\n\n  const order = useMemo(() => (orderId ? getOrderById(orderId) : undefined), [orderId]);\n\n  if (isLoading) {\n    return (\n      <PageLayout title=\"Track Order\">\n        <div className=\"flex flex-col items-center justify-center py-16 text-center\">\n          <div className=\"animate-spin rounded-full h-12 w-12 border-b-2 border-foreground mx-auto mb-4\" />\n          <p className=\"text-sm text-muted-foreground\">Loading order details...</p>\n        </div>\n      </PageLayout>\n    );\n  }\n\n  if (!order) {\n    return (\n      <PageLayout title=\"Order Not Found\">\n        <EmptyState\n          icon={<ShoppingBag className=\"h-12 w-12\" />}\n          title=\"Order not found\"\n          description={`The order you're looking for doesn't exist.`}\n          action={\n            <button\n              type=\"button\"\n              onClick={() => navigateTo('/customer/orders')}\n              className=\"rounded-lg bg-foreground px-4 py-2 text-sm font-medium text-background hover:opacity-90 transition-opacity\"\n            >\n              View All Orders\n            </button>\n          }\n        />\n      </PageLayout>\n    );\n  }\n\n  const currentStatusIndex = statusOrder.indexOf(order.status);\n  const isCancelled = order.status === 'cancelled';\n  const isDelivered = order.status === 'delivered';\n\n  const isStepCompleted = (stepStatus: string): boolean => {\n    const stepIndex = statusOrder.indexOf(stepStatus as OrderStatus);\n    return stepIndex <= currentStatusIndex;\n  };\n\n  const isCurrentStep = (stepStatus: string): boolean => {\n    return stepStatus === order.status;\n  };\n\n  return (\n    <PageLayout\n      title={\n        <div className=\"flex items-center gap-3\">\n          <button\n            type=\"button\"\n            onClick={() => navigateTo('/customer/orders')}\n            className=\"rounded-md p-1 text-muted-foreground hover:bg-accent hover:text-foreground transition-colors\"\n          >\n            <ArrowLeft className=\"h-5 w-5\" />\n          </button>\n          <span>Track Order</span>\n        </div>\n      }\n      actions={<StatusBadge status={order.status} />}\n    >\n      <div className=\"grid grid-cols-1 gap-6 lg:grid-cols-3\">\n        {/* Left: Order Details & Timeline */}\n        <div className=\"lg:col-span-2 space-y-6\">\n          {/* Order Header */}\n          <div className=\"rounded-lg border border-border bg-card p-5\">\n            <div className=\"flex flex-col sm:flex-row sm:justify-between sm:items-start gap-3\">\n              <div className=\"flex-1\">\n                <h2 className=\"text-lg font-semibold text-foreground\">Order #{order.id}</h2>\n                <p className=\"text-sm text-muted-foreground\">{order.cartName}</p>\n                <p className=\"text-xs text-muted-foreground mt-0.5\">\n                  {formatDate(order.orderDate)}\n                </p>\n              </div>\n              <div className=\"text-left sm:text-right\">\n                <p className=\"text-xl font-bold text-foreground\">\n                  {formatCurrency(order.total, { minimumFractionDigits: 0 })}\n                </p>\n                <p className=\"text-xs text-muted-foreground uppercase\">{order.paymentMethod}</p>\n              </div>\n            </div>\n\n            {/* Status Banner */}\n            {isCancelled ? (\n              <div className=\"mt-4 flex items-start gap-3 rounded-lg bg-destructive/10 p-4 border border-destructive/20\">\n                <XCircle className=\"h-5 w-5 text-destructive mt-0.5 shrink-0\" />\n                <div>\n                  <p className=\"font-medium text-destructive\">Order Cancelled</p>\n                  {order.cancellationReason && (\n                    <p className=\"text-sm text-destructive/80 mt-0.5\">{order.cancellationReason}</p>\n                  )}\n                </div>\n              </div>\n            ) : (\n              <div\n                className={cn(\n                  'mt-4 flex items-start gap-3 rounded-lg p-4 border',\n                  isDelivered\n                    ? 'bg-green-500/10 border-green-500/20'\n                    : 'bg-blue-500/10 border-blue-500/20'\n                )}\n              >\n                {isDelivered ? (\n                  <CheckCircle2 className=\"h-5 w-5 text-green-600 dark:text-green-400 mt-0.5 shrink-0\" />\n                ) : (\n                  <Clock className=\"h-5 w-5 text-blue-600 dark:text-blue-400 mt-0.5 shrink-0\" />\n                )}\n                <p\n                  className={cn(\n                    'text-sm font-medium',\n                    isDelivered\n                      ? 'text-green-600 dark:text-green-400'\n                      : 'text-blue-600 dark:text-blue-400'\n                  )}\n                >\n                  {isDelivered\n                    ? `Delivered at ${formatDate(order.actualDeliveryTime!)}`\n                    : order.estimatedDeliveryTime\n                      ? `Estimated delivery by ${formatDate(order.estimatedDeliveryTime)}`\n                      : 'Estimated delivery time: TBD'}\n                </p>\n              </div>\n            )}\n          </div>\n\n          {/* Tracking Progress Timeline */}\n          {!isCancelled && (\n            <div className=\"rounded-lg border border-border bg-card p-5\">\n              <h3 className=\"text-base font-semibold text-foreground mb-5\">Order Status</h3>\n              <div className=\"relative space-y-0\">\n                {statusOrder.map((stepStatus, index) => {\n                  const completed = isStepCompleted(stepStatus);\n                  const current = isCurrentStep(stepStatus);\n                  const isLast = index === statusOrder.length - 1;\n                  const StepIcon = statusIcons[stepStatus] ?? Circle;\n\n                  return (\n                    <div key={stepStatus} className=\"flex items-start relative\">\n                      {/* Connecting line */}\n                      {!isLast && (\n                        <div\n                          className={cn(\n                            'absolute left-5 top-10 w-0.5 h-8 z-0',\n                            completed ? 'bg-green-500' : 'bg-border'\n                          )}\n                        />\n                      )}\n\n                      {/* Step circle */}\n                      <div\n                        className={cn(\n                          'relative z-10 flex h-10 w-10 shrink-0 items-center justify-center rounded-full',\n                          completed\n                            ? 'bg-green-500/10 border-2 border-green-500 text-green-600 dark:text-green-400'\n                            : 'bg-muted border-2 border-border text-muted-foreground',\n                          current && 'ring-4 ring-green-500/20'\n                        )}\n                      >\n                        <StepIcon className=\"h-4 w-4\" />\n                      </div>\n\n                      {/* Step content */}\n                      <div className=\"ml-4 flex-1 pb-8\">\n                        <h4\n                          className={cn(\n                            'text-sm font-semibold',\n                            completed ? 'text-foreground' : 'text-muted-foreground'\n                          )}\n                        >\n                          {statusLabels[stepStatus]}\n                        </h4>\n                        <p\n                          className={cn(\n                            'text-xs',\n                            completed ? 'text-muted-foreground' : 'text-muted-foreground/50'\n                          )}\n                        >\n                          {statusDescriptions[stepStatus]}\n                        </p>\n                        {/* Show driver info at current step */}\n                        {current && order.assignedWorker && (\n                          <div className=\"mt-1.5 text-xs text-blue-600 dark:text-blue-400\">\n                            <p>Driver: {order.assignedWorker.name}</p>\n                            <p>Contact: {order.assignedWorker.phone}</p>\n                          </div>\n                        )}\n                      </div>\n                    </div>\n                  );\n                })}\n              </div>\n            </div>\n          )}\n\n          {/* Order Items & Price Breakdown */}\n          <div className=\"rounded-lg border border-border bg-card p-5\">\n            <h3 className=\"text-base font-semibold text-foreground mb-3\">Order Items</h3>\n            <div className=\"space-y-2\">\n              {order.items.map((item, index) => (\n                <div\n                  key={index}\n                  className=\"flex justify-between items-start pb-2 border-b border-border last:border-b-0\"\n                >\n                  <div className=\"flex-1 pr-2\">\n                    <p className=\"text-sm font-medium text-foreground\">{item.name}</p>\n                    {item.customizations && item.customizations.length > 0 && (\n                      <p className=\"text-xs text-muted-foreground\">\n                        {item.customizations.join(', ')}\n                      </p>\n                    )}\n                    <p className=\"text-xs text-muted-foreground\">\n                      {formatCurrency(item.price, { minimumFractionDigits: 0 })} x {item.quantity}\n                    </p>\n                  </div>\n                  <p className=\"text-sm font-medium text-foreground\">\n                    {formatCurrency(item.price * item.quantity, { minimumFractionDigits: 0 })}\n                  </p>\n                </div>\n              ))}\n            </div>\n\n            {/* Price Breakdown */}\n            <div className=\"mt-4 pt-4 border-t border-border space-y-2 text-sm\">\n              <div className=\"flex justify-between text-muted-foreground\">\n                <span>Subtotal</span>\n                <span>{formatCurrency(order.subtotal, { minimumFractionDigits: 0 })}</span>\n              </div>\n              <div className=\"flex justify-between text-muted-foreground\">\n                <span>Delivery Fee</span>\n                <span>\n                  {order.deliveryFee === 0\n                    ? 'FREE'\n                    : formatCurrency(order.deliveryFee, { minimumFractionDigits: 0 })}\n                </span>\n              </div>\n              <div className=\"flex justify-between text-muted-foreground\">\n                <span>Tax</span>\n                <span>{formatCurrency(order.taxes, { minimumFractionDigits: 0 })}</span>\n              </div>\n              {order.discount && order.discount > 0 && (\n                <div className=\"flex justify-between text-green-600 dark:text-green-400\">\n                  <span>Discount</span>\n                  <span>-{formatCurrency(order.discount, { minimumFractionDigits: 0 })}</span>\n                </div>\n              )}\n              <div className=\"flex justify-between font-semibold pt-2 border-t border-border text-foreground\">\n                <span>Total</span>\n                <span>{formatCurrency(order.total, { minimumFractionDigits: 0 })}</span>\n              </div>\n            </div>\n          </div>\n        </div>\n\n        {/* Right: Sidebar */}\n        <div className=\"lg:col-span-1 space-y-6\">\n          {/* Delivery Details */}\n          <div className=\"rounded-lg border border-border bg-card p-5\">\n            <h3 className=\"text-base font-semibold text-foreground mb-3\">Delivery Details</h3>\n            <div className=\"space-y-3\">\n              <div className=\"flex items-start gap-2\">\n                <MapPin className=\"mt-0.5 h-4 w-4 shrink-0 text-muted-foreground\" />\n                <div>\n                  <p className=\"text-xs text-muted-foreground\">Delivery Address</p>\n                  <p className=\"text-sm font-medium text-foreground\">\n                    {order.deliveryAddress.street}\n                  </p>\n                  <p className=\"text-sm text-muted-foreground\">{order.deliveryAddress.area}</p>\n                  <p className=\"text-sm text-muted-foreground\">\n                    {order.deliveryAddress.city}, {order.deliveryAddress.pincode}\n                  </p>\n                  {order.deliveryAddress.landmark && (\n                    <p className=\"text-xs text-muted-foreground mt-0.5\">\n                      Landmark: {order.deliveryAddress.landmark}\n                    </p>\n                  )}\n                </div>\n              </div>\n\n              {/* Customer Notes */}\n              {order.customerNotes && (\n                <div>\n                  <p className=\"text-xs text-muted-foreground\">Customer Notes</p>\n                  <p className=\"text-sm text-foreground\">{order.customerNotes}</p>\n                </div>\n              )}\n\n              {/* Payment */}\n              <div>\n                <p className=\"text-xs text-muted-foreground\">Payment Method</p>\n                <p className=\"text-sm font-medium text-foreground capitalize\">\n                  {order.paymentMethod}\n                </p>\n                <p className=\"text-xs text-muted-foreground\">\n                  {order.paymentStatus === 'completed' ? 'Paid' : 'Payment Pending'}\n                </p>\n              </div>\n            </div>\n          </div>\n\n          {/* Delivery Partner */}\n          {order.assignedWorker && (\n            <div className=\"rounded-lg border border-border bg-card p-5\">\n              <h3 className=\"text-base font-semibold text-foreground mb-3\">Delivery Partner</h3>\n              <div className=\"space-y-3\">\n                <div className=\"flex items-center gap-3\">\n                  <div className=\"flex h-10 w-10 items-center justify-center rounded-full bg-muted text-muted-foreground\">\n                    <span className=\"text-sm font-semibold\">\n                      {order.assignedWorker.name.charAt(0)}\n                    </span>\n                  </div>\n                  <div className=\"flex-1 min-w-0\">\n                    <p className=\"text-sm font-medium text-foreground\">\n                      {order.assignedWorker.name}\n                    </p>\n                    <div className=\"flex items-center gap-1.5 mt-0.5\">\n                      <Star className=\"h-3 w-3 fill-yellow-400 text-yellow-400\" />\n                      <span className=\"text-xs text-muted-foreground\">\n                        {order.assignedWorker.rating}/5\n                      </span>\n                    </div>\n                  </div>\n                  <a\n                    href={`tel:${order.assignedWorker.phone}`}\n                    className=\"flex h-9 w-9 items-center justify-center rounded-full bg-muted text-muted-foreground hover:bg-accent hover:text-foreground transition-colors\"\n                  >\n                    <Phone className=\"h-4 w-4\" />\n                  </a>\n                </div>\n                <button\n                  type=\"button\"\n                  onClick={() => (window.location.href = `tel:${order.assignedWorker!.phone}`)}\n                  className=\"w-full flex items-center justify-center gap-2 rounded-lg border border-border px-3 py-2.5 text-sm font-medium text-foreground hover:bg-accent transition-colors\"\n                >\n                  <Phone className=\"h-4 w-4\" />\n                  Call Driver\n                </button>\n              </div>\n            </div>\n          )}\n\n          {/* Need Help */}\n          <div className=\"rounded-lg border border-border bg-card p-5\">\n            <h3 className=\"text-base font-semibold text-foreground mb-3\">Need Help?</h3>\n            <div className=\"space-y-2\">\n              <button\n                type=\"button\"\n                onClick={() => alert('Chat support coming soon!')}\n                className=\"w-full flex items-center justify-center gap-2 rounded-lg border border-border px-3 py-2.5 text-sm font-medium text-foreground hover:bg-accent transition-colors\"\n              >\n                <MessageCircle className=\"h-4 w-4\" />\n                Chat Support\n              </button>\n              <button\n                type=\"button\"\n                onClick={() => (window.location.href = 'tel:7012270561')}\n                className=\"w-full flex items-center justify-center gap-2 rounded-lg border border-border px-3 py-2.5 text-sm font-medium text-foreground hover:bg-accent transition-colors\"\n              >\n                <Phone className=\"h-4 w-4\" />\n                Call Support\n              </button>\n              {isDelivered && !order.rating && (\n                <button\n                  type=\"button\"\n                  onClick={() => navigateTo(`/customer/orders/${order.id}/rate`)}\n                  className=\"w-full flex items-center justify-center gap-2 rounded-lg bg-foreground px-3 py-2.5 text-sm font-medium text-background hover:opacity-90 transition-opacity\"\n                >\n                  <Star className=\"h-4 w-4\" />\n                  Rate Order\n                </button>\n              )}\n            </div>\n          </div>\n        </div>\n      </div>\n    </PageLayout>\n  );\n}\n"],"mappings":"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"}

package/dist/coolandlovely/pages/customer/PaymentMethodsPage.d.ts

@@ -0,0 +1,11 @@
+/**
+ * Payment Methods Page
+ * @module coolandlovely/pages/customer
+ *
+ * Manage saved payment methods: UPI IDs, credit/debit cards, wallets.
+ * Add Payment Method modal with type selection (Card/UPI/Wallet),
+ * conditional forms, Quick Pay Options section (Cash on Delivery,
+ * Pay at Cart), form state management, grouped display, security badge.
+ */
+export declare function PaymentMethodsPage(): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=PaymentMethodsPage.d.ts.map

package/dist/coolandlovely/pages/customer/PaymentMethodsPage.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"PaymentMethodsPage.d.ts","sourceRoot":"","sources":["../../../../src/coolandlovely/pages/customer/PaymentMethodsPage.tsx"],"names":[],"mappings":"AAAA;;;;;;;;GAQG;AAmKH,wBAAgB,kBAAkB,4CAicjC"}