@burdenoff/microfe-proserviceworld 2026.624.1 → 2026.625.1

package/dist/proserviceworld/pages/BookingsPage.js

@@ -2,30 +2,30 @@ import { useProServiceWorldStore as e } from "../store/proserviceworldStore.js";
 import { useMemo as t, useState as n } from "react";
 import { ArrowUpDown as r, Calendar as i, CheckCircle2 as a, ChevronRight as o, Clock as s, DollarSign as c, Filter as l, Loader2 as u, Search as d, User as f, XCircle as p } from "lucide-react";
 import { jsx as m, jsxs as h } from "react/jsx-runtime";
-import { Badge as g, Button as _, Card as v, CardContent as y, CardHeader as b, CardTitle as x, Input as S } from "@burdenoff/fe-libs/ui";
+import { Badge as g, Button as _, Card as v, CardContent as y, GlassCard as b, IllustratedEmptyState as x, Input as S } from "@burdenoff/fe-libs/ui";
 //#region src/proserviceworld/pages/BookingsPage.tsx
 var C = {
 	pending: {
 		label: "Pending",
-		color: "text-yellow-600",
+		color: "text-status-warning-text",
 		icon: s,
 		badgeVariant: "secondary"
 	},
 	in_progress: {
 		label: "In Progress",
-		color: "text-blue-600",
+		color: "text-accent-blue",
 		icon: u,
 		badgeVariant: "default"
 	},
 	completed: {
 		label: "Completed",
-		color: "text-green-600",
+		color: "text-status-success-text",
 		icon: a,
 		badgeVariant: "outline"
 	},
 	cancelled: {
 		label: "Cancelled",
-		color: "text-red-600",
+		color: "text-status-error-text",
 		icon: p,
 		badgeVariant: "destructive"
 	}
@@ -55,12 +55,12 @@ function w() {
 		D === e ? A(!k) : (O(e), A(!1));
 	};
 	return /* @__PURE__ */ h("div", {
-		className: "space-y-6 p-6",
+		className: "space-y-6 p-6 bg-bg-canvas min-h-screen",
 		children: [
 			/* @__PURE__ */ h("div", {
 				className: "flex flex-col gap-4 sm:flex-row sm:items-center sm:justify-between",
 				children: [/* @__PURE__ */ h("div", { children: [/* @__PURE__ */ m("h1", {
-					className: "text-2xl font-semibold",
+					className: "text-2xl font-semibold tracking-tight",
 					children: "Bookings"
 				}), /* @__PURE__ */ m("p", {
 					className: "text-sm text-text-secondary",
@@ -73,70 +73,75 @@ function w() {
 			/* @__PURE__ */ h("div", {
 				className: "grid gap-4 sm:grid-cols-2 lg:grid-cols-4",
 				children: [
-					/* @__PURE__ */ m(v, { children: /* @__PURE__ */ m(y, {
-						className: "pt-4",
+					/* @__PURE__ */ m(b, {
+						treatment: "metric",
+						className: "border-border-seam",
 						children: /* @__PURE__ */ h("div", {
 							className: "flex items-center gap-3",
 							children: [/* @__PURE__ */ m("div", {
-								className: "rounded-lg bg-blue-100 p-2 dark:bg-blue-950",
-								children: /* @__PURE__ */ m(i, { className: "h-5 w-5 text-blue-600" })
+								className: "rounded-lg bg-status-info-bg-subtle p-2",
+								children: /* @__PURE__ */ m(i, { className: "h-5 w-5 text-accent-blue" })
 							}), /* @__PURE__ */ h("div", { children: [/* @__PURE__ */ m("p", {
-								className: "text-2xl font-bold",
+								className: "text-2xl font-bold tabular-nums",
 								children: s.length
 							}), /* @__PURE__ */ m("p", {
 								className: "text-xs text-text-secondary",
 								children: "Total Bookings"
 							})] })]
 						})
-					}) }),
-					/* @__PURE__ */ m(v, { children: /* @__PURE__ */ m(y, {
-						className: "pt-4",
+					}),
+					/* @__PURE__ */ m(b, {
+						treatment: "metric",
+						className: "border-border-seam",
 						children: /* @__PURE__ */ h("div", {
 							className: "flex items-center gap-3",
 							children: [/* @__PURE__ */ m("div", {
-								className: "rounded-lg bg-green-100 p-2 dark:bg-green-950",
-								children: /* @__PURE__ */ m(a, { className: "h-5 w-5 text-green-600" })
+								className: "rounded-lg bg-status-success-bg-subtle p-2",
+								children: /* @__PURE__ */ m(a, { className: "h-5 w-5 text-status-success-text" })
 							}), /* @__PURE__ */ h("div", { children: [/* @__PURE__ */ m("p", {
-								className: "text-2xl font-bold",
+								className: "text-2xl font-bold tabular-nums",
 								children: F.completed ?? 0
 							}), /* @__PURE__ */ m("p", {
 								className: "text-xs text-text-secondary",
 								children: "Completed"
 							})] })]
 						})
-					}) }),
-					/* @__PURE__ */ m(v, { children: /* @__PURE__ */ m(y, {
-						className: "pt-4",
+					}),
+					/* @__PURE__ */ m(b, {
+						treatment: "metric",
+						className: "border-border-seam",
 						children: /* @__PURE__ */ h("div", {
 							className: "flex items-center gap-3",
 							children: [/* @__PURE__ */ m("div", {
-								className: "rounded-lg bg-yellow-100 p-2 dark:bg-yellow-950",
-								children: /* @__PURE__ */ m(u, { className: "h-5 w-5 text-yellow-600" })
+								className: "rounded-lg bg-status-warning-bg-subtle p-2",
+								children: /* @__PURE__ */ m(u, { className: "h-5 w-5 text-status-warning-text" })
 							}), /* @__PURE__ */ h("div", { children: [/* @__PURE__ */ h("p", {
-								className: "text-2xl font-bold",
+								className: "text-2xl font-bold tabular-nums",
 								children: [L, "%"]
 							}), /* @__PURE__ */ m("p", {
 								className: "text-xs text-text-secondary",
 								children: "Avg. In-Progress"
 							})] })]
 						})
-					}) }),
-					/* @__PURE__ */ m(v, { children: /* @__PURE__ */ m(y, {
-						className: "pt-4",
+					}),
+					/* @__PURE__ */ m(b, {
+						treatment: "glass",
+						glow: !0,
+						className: "border-border-seam",
 						children: /* @__PURE__ */ h("div", {
 							className: "flex items-center gap-3",
 							children: [/* @__PURE__ */ m("div", {
-								className: "rounded-lg bg-purple-100 p-2 dark:bg-purple-950",
-								children: /* @__PURE__ */ m(c, { className: "h-5 w-5 text-purple-600" })
+								className: "rounded-lg bg-accent-purple-subtle p-2",
+								children: /* @__PURE__ */ m(c, { className: "h-5 w-5 text-accent-purple" })
 							}), /* @__PURE__ */ h("div", { children: [/* @__PURE__ */ h("p", {
-								className: "text-2xl font-bold",
+								className: "text-2xl font-bold tabular-nums",
 								children: ["$", I.toLocaleString()]
 							}), /* @__PURE__ */ m("p", {
 								className: "text-xs text-text-secondary",
 								children: "Total Budget"
 							})] })]
 						})
-					}) })
+					})
 				]
 			}),
 			/* @__PURE__ */ h("div", {
@@ -150,7 +155,7 @@ function w() {
 						className: "pl-10"
 					})]
 				}), /* @__PURE__ */ h("div", {
-					className: "flex items-center gap-2",
+					className: "flex flex-wrap items-center gap-2",
 					children: [/* @__PURE__ */ m(l, { className: "h-4 w-4 text-text-secondary" }), [
 						"all",
 						"pending",
@@ -162,7 +167,7 @@ function w() {
 						size: "sm",
 						onClick: () => E(e),
 						children: [e === "all" ? "All" : C[e].label, /* @__PURE__ */ h("span", {
-							className: "ml-1 text-xs opacity-70",
+							className: "ml-1 text-xs opacity-70 tabular-nums",
 							children: [
 								"(",
 								F[e] ?? 0,
@@ -173,7 +178,7 @@ function w() {
 				})]
 			}),
 			/* @__PURE__ */ m("div", {
-				className: "flex gap-2",
+				className: "flex flex-wrap gap-2",
 				children: [
 					{
 						field: "date",
@@ -189,7 +194,8 @@ function w() {
 					}
 				].map(({ field: e, label: t }) => /* @__PURE__ */ h("button", {
 					onClick: () => R(e),
-					className: `flex items-center gap-1 rounded border px-3 py-1 text-xs ${D === e ? "border-primary bg-action-primary-bg/5 text-primary" : "text-text-secondary hover:bg-bg-sunken/50"}`,
+					"aria-pressed": D === e,
+					className: `flex items-center gap-1 rounded border px-3 py-1 text-xs transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-border-focus ${D === e ? "border-border-strong bg-accent-soft text-text-primary" : "border-border-seam text-text-secondary hover:bg-bg-sunken/50"}`,
 					children: [/* @__PURE__ */ m(r, { className: "h-3 w-3" }), t]
 				}, e))
 			}),
@@ -197,13 +203,20 @@ function w() {
 				className: "grid gap-6 lg:grid-cols-3",
 				children: [/* @__PURE__ */ m("div", {
 					className: `space-y-3 ${P ? "lg:col-span-2" : "lg:col-span-3"}`,
-					children: N.length === 0 ? /* @__PURE__ */ m(v, { children: /* @__PURE__ */ m(y, {
-						className: "py-12 text-center text-text-secondary",
-						children: "No bookings match your filters."
-					}) }) : N.map((e) => {
+					children: N.length === 0 ? /* @__PURE__ */ m(v, {
+						className: "border-border-seam",
+						children: /* @__PURE__ */ m(y, {
+							className: "py-4",
+							children: /* @__PURE__ */ m(x, {
+								illustration: "empty-search",
+								title: "No bookings found",
+								description: "No bookings match your current filters."
+							})
+						})
+					}) : N.map((e) => {
 						let t = C[e.status], n = t.icon;
 						return /* @__PURE__ */ m(v, {
-							className: `cursor-pointer transition-colors hover:bg-bg-sunken/30 ${j === e.id ? "border-primary ring-1 ring-primary" : ""}`,
+							className: `cursor-pointer border-border-seam transition-shadow hover:shadow-pop ${j === e.id ? "border-border-strong ring-1 ring-border-focus" : ""}`,
 							onClick: () => M(j === e.id ? null : e.id),
 							children: /* @__PURE__ */ h(y, {
 								className: "pt-4",
@@ -243,7 +256,7 @@ function w() {
 														]
 													}),
 													/* @__PURE__ */ h("span", {
-														className: "flex items-center gap-1",
+														className: "flex items-center gap-1 tabular-nums",
 														children: [
 															/* @__PURE__ */ m(c, { className: "h-3 w-3" }),
 															" $",
@@ -261,7 +274,7 @@ function w() {
 												children: t.label
 											}),
 											e.status === "in_progress" && /* @__PURE__ */ h("span", {
-												className: "text-sm font-medium",
+												className: "text-sm font-medium tabular-nums",
 												children: [e.progress, "%"]
 											}),
 											/* @__PURE__ */ m(o, { className: "h-4 w-4 text-text-secondary" })
@@ -272,7 +285,7 @@ function w() {
 									children: /* @__PURE__ */ m("div", {
 										className: "h-2 w-full overflow-hidden rounded-full bg-bg-sunken",
 										children: /* @__PURE__ */ m("div", {
-											className: "h-2 rounded-full bg-blue-500 transition-all",
+											className: "h-2 rounded-full bg-action-primary-bg transition-all",
 											style: { width: `${e.progress}%` }
 										})
 									})
@@ -282,138 +295,142 @@ function w() {
 					})
 				}), P && /* @__PURE__ */ m("div", {
 					className: "space-y-4",
-					children: /* @__PURE__ */ h(v, { children: [/* @__PURE__ */ m(b, { children: /* @__PURE__ */ h("div", {
-						className: "flex items-center justify-between",
-						children: [/* @__PURE__ */ m(x, {
-							className: "text-base",
-							children: "Booking Details"
-						}), /* @__PURE__ */ m(_, {
-							variant: "outline",
-							size: "sm",
-							onClick: () => M(null),
-							children: "Close"
-						})]
-					}) }), /* @__PURE__ */ h(y, {
-						className: "space-y-4",
-						children: [
-							/* @__PURE__ */ h("div", { children: [/* @__PURE__ */ m("h3", {
-								className: "font-semibold",
-								children: P.title
-							}), /* @__PURE__ */ m("p", {
-								className: "mt-1 text-sm text-text-secondary",
-								children: P.description
-							})] }),
-							/* @__PURE__ */ m(g, {
-								variant: C[P.status].badgeVariant,
-								children: C[P.status].label
-							}),
-							P.status === "in_progress" && /* @__PURE__ */ h("div", { children: [/* @__PURE__ */ h("div", {
-								className: "flex items-center justify-between text-sm",
-								children: [/* @__PURE__ */ m("span", {
-									className: "text-text-secondary",
-									children: "Progress"
-								}), /* @__PURE__ */ h("span", {
-									className: "font-medium",
-									children: [P.progress, "%"]
-								})]
-							}), /* @__PURE__ */ m("div", {
-								className: "mt-1 h-2 w-full overflow-hidden rounded-full bg-bg-sunken",
-								children: /* @__PURE__ */ m("div", {
-									className: "h-2 rounded-full bg-blue-500",
-									style: { width: `${P.progress}%` }
-								})
-							})] }),
-							/* @__PURE__ */ h("div", {
-								className: "space-y-2 border-t pt-3 text-sm",
-								children: [
-									/* @__PURE__ */ h("div", {
-										className: "flex justify-between",
-										children: [/* @__PURE__ */ m("span", {
-											className: "text-text-secondary",
-											children: "Service"
-										}), /* @__PURE__ */ m("span", {
-											className: "font-medium",
-											children: P.serviceName
-										})]
-									}),
-									/* @__PURE__ */ h("div", {
-										className: "flex justify-between",
-										children: [/* @__PURE__ */ m("span", {
-											className: "text-text-secondary",
-											children: "Provider"
-										}), /* @__PURE__ */ m("span", {
-											className: "font-medium",
-											children: P.providerName
-										})]
-									}),
-									/* @__PURE__ */ h("div", {
-										className: "flex justify-between",
-										children: [/* @__PURE__ */ m("span", {
-											className: "text-text-secondary",
-											children: "Budget"
-										}), /* @__PURE__ */ h("span", {
-											className: "font-medium",
-											children: ["$", P.budget.toLocaleString()]
-										})]
-									}),
-									/* @__PURE__ */ h("div", {
-										className: "flex justify-between",
-										children: [/* @__PURE__ */ m("span", {
-											className: "text-text-secondary",
-											children: "Start Date"
-										}), /* @__PURE__ */ m("span", {
-											className: "font-medium",
-											children: P.startDate
-										})]
-									}),
-									/* @__PURE__ */ h("div", {
-										className: "flex justify-between",
-										children: [/* @__PURE__ */ m("span", {
-											className: "text-text-secondary",
-											children: "End Date"
-										}), /* @__PURE__ */ m("span", {
-											className: "font-medium",
-											children: P.endDate
-										})]
-									}),
-									/* @__PURE__ */ h("div", {
-										className: "flex justify-between",
-										children: [/* @__PURE__ */ m("span", {
-											className: "text-text-secondary",
-											children: "Payment"
-										}), /* @__PURE__ */ m(g, {
-											variant: "secondary",
-											children: P.paymentStatus
-										})]
-									}),
-									/* @__PURE__ */ h("div", {
-										className: "flex justify-between",
-										children: [/* @__PURE__ */ m("span", {
-											className: "text-text-secondary",
-											children: "Method"
-										}), /* @__PURE__ */ m("span", {
-											className: "font-medium",
-											children: P.paymentMethod.replace("_", " ")
-										})]
+					children: /* @__PURE__ */ h(b, {
+						treatment: "glass",
+						className: "border-border-seam lg:sticky lg:top-6",
+						children: [/* @__PURE__ */ h("div", {
+							className: "flex items-center justify-between",
+							children: [/* @__PURE__ */ m("h2", {
+								className: "text-base font-semibold tracking-tight",
+								children: "Booking Details"
+							}), /* @__PURE__ */ m(_, {
+								variant: "outline",
+								size: "sm",
+								onClick: () => M(null),
+								children: "Close"
+							})]
+						}), /* @__PURE__ */ h("div", {
+							className: "mt-4 space-y-4",
+							children: [
+								/* @__PURE__ */ h("div", { children: [/* @__PURE__ */ m("h3", {
+									className: "font-semibold",
+									children: P.title
+								}), /* @__PURE__ */ m("p", {
+									className: "mt-1 text-sm text-text-secondary",
+									children: P.description
+								})] }),
+								/* @__PURE__ */ m(g, {
+									variant: C[P.status].badgeVariant,
+									children: C[P.status].label
+								}),
+								P.status === "in_progress" && /* @__PURE__ */ h("div", { children: [/* @__PURE__ */ h("div", {
+									className: "flex items-center justify-between text-sm",
+									children: [/* @__PURE__ */ m("span", {
+										className: "text-text-secondary",
+										children: "Progress"
+									}), /* @__PURE__ */ h("span", {
+										className: "font-medium tabular-nums",
+										children: [P.progress, "%"]
+									})]
+								}), /* @__PURE__ */ m("div", {
+									className: "mt-1 h-2 w-full overflow-hidden rounded-full bg-bg-sunken",
+									children: /* @__PURE__ */ m("div", {
+										className: "h-2 rounded-full bg-action-primary-bg",
+										style: { width: `${P.progress}%` }
 									})
-								]
-							}),
-							/* @__PURE__ */ h("div", {
-								className: "flex gap-2 border-t pt-3",
-								children: [/* @__PURE__ */ m(_, {
-									className: "flex-1",
-									size: "sm",
-									variant: "outline",
-									children: "Message Provider"
-								}), P.status === "pending" && /* @__PURE__ */ m(_, {
-									className: "flex-1",
-									size: "sm",
-									variant: "destructive",
-									children: "Cancel"
-								})]
-							})
-						]
-					})] })
+								})] }),
+								/* @__PURE__ */ h("div", {
+									className: "space-y-2 border-t border-border-seam pt-3 text-sm",
+									children: [
+										/* @__PURE__ */ h("div", {
+											className: "flex justify-between",
+											children: [/* @__PURE__ */ m("span", {
+												className: "text-text-secondary",
+												children: "Service"
+											}), /* @__PURE__ */ m("span", {
+												className: "font-medium",
+												children: P.serviceName
+											})]
+										}),
+										/* @__PURE__ */ h("div", {
+											className: "flex justify-between",
+											children: [/* @__PURE__ */ m("span", {
+												className: "text-text-secondary",
+												children: "Provider"
+											}), /* @__PURE__ */ m("span", {
+												className: "font-medium",
+												children: P.providerName
+											})]
+										}),
+										/* @__PURE__ */ h("div", {
+											className: "flex justify-between",
+											children: [/* @__PURE__ */ m("span", {
+												className: "text-text-secondary",
+												children: "Budget"
+											}), /* @__PURE__ */ h("span", {
+												className: "font-medium tabular-nums",
+												children: ["$", P.budget.toLocaleString()]
+											})]
+										}),
+										/* @__PURE__ */ h("div", {
+											className: "flex justify-between",
+											children: [/* @__PURE__ */ m("span", {
+												className: "text-text-secondary",
+												children: "Start Date"
+											}), /* @__PURE__ */ m("span", {
+												className: "font-medium",
+												children: P.startDate
+											})]
+										}),
+										/* @__PURE__ */ h("div", {
+											className: "flex justify-between",
+											children: [/* @__PURE__ */ m("span", {
+												className: "text-text-secondary",
+												children: "End Date"
+											}), /* @__PURE__ */ m("span", {
+												className: "font-medium",
+												children: P.endDate
+											})]
+										}),
+										/* @__PURE__ */ h("div", {
+											className: "flex justify-between",
+											children: [/* @__PURE__ */ m("span", {
+												className: "text-text-secondary",
+												children: "Payment"
+											}), /* @__PURE__ */ m(g, {
+												variant: "secondary",
+												children: P.paymentStatus
+											})]
+										}),
+										/* @__PURE__ */ h("div", {
+											className: "flex justify-between",
+											children: [/* @__PURE__ */ m("span", {
+												className: "text-text-secondary",
+												children: "Method"
+											}), /* @__PURE__ */ m("span", {
+												className: "font-medium",
+												children: P.paymentMethod.replace("_", " ")
+											})]
+										})
+									]
+								}),
+								/* @__PURE__ */ h("div", {
+									className: "flex gap-2 border-t border-border-seam pt-3",
+									children: [/* @__PURE__ */ m(_, {
+										className: "flex-1",
+										size: "sm",
+										variant: "outline",
+										children: "Message Provider"
+									}), P.status === "pending" && /* @__PURE__ */ m(_, {
+										className: "flex-1",
+										size: "sm",
+										variant: "destructive",
+										children: "Cancel"
+									})]
+								})
+							]
+						})]
+					})
 				})]
 			})
 		]

package/dist/proserviceworld/pages/BookingsPage.js.map

@@ -1 +1 @@
-{"version":3,"file":"BookingsPage.js","names":[],"sources":["../../../src/proserviceworld/pages/BookingsPage.tsx"],"sourcesContent":["import { useState, useMemo } from 'react';\nimport {\n  Badge,\n  Button,\n  Card,\n  CardContent,\n  CardHeader,\n  CardTitle,\n  Input,\n} from '@burdenoff/fe-libs/ui';\nimport {\n  Search,\n  Clock,\n  CheckCircle2,\n  XCircle,\n  Loader2,\n  Calendar,\n  DollarSign,\n  User,\n  ChevronRight,\n  Filter,\n  ArrowUpDown,\n} from 'lucide-react';\nimport { useProServiceWorldStore } from '../store/proserviceworldStore';\nimport type { BookingStatus } from '../types';\n\nconst statusConfig: Record<\n  BookingStatus,\n  {\n    label: string;\n    color: string;\n    icon: typeof Clock;\n    badgeVariant: 'default' | 'secondary' | 'outline' | 'destructive';\n  }\n> = {\n  pending: { label: 'Pending', color: 'text-yellow-600', icon: Clock, badgeVariant: 'secondary' },\n  in_progress: {\n    label: 'In Progress',\n    color: 'text-blue-600',\n    icon: Loader2,\n    badgeVariant: 'default',\n  },\n  completed: {\n    label: 'Completed',\n    color: 'text-green-600',\n    icon: CheckCircle2,\n    badgeVariant: 'outline',\n  },\n  cancelled: {\n    label: 'Cancelled',\n    color: 'text-red-600',\n    icon: XCircle,\n    badgeVariant: 'destructive',\n  },\n};\n\ntype SortField = 'date' | 'budget' | 'progress';\n\nexport function BookingsPage() {\n  const { bookings } = useProServiceWorldStore();\n  const [searchQuery, setSearchQuery] = useState('');\n  const [statusFilter, setStatusFilter] = useState<BookingStatus | 'all'>('all');\n  const [sortField, setSortField] = useState<SortField>('date');\n  const [sortAsc, setSortAsc] = useState(false);\n  const [selectedBookingId, setSelectedBookingId] = useState<string | null>(null);\n\n  const filtered = useMemo(() => {\n    let result = bookings;\n\n    if (statusFilter !== 'all') {\n      result = result.filter((b) => b.status === statusFilter);\n    }\n\n    if (searchQuery.trim()) {\n      const q = searchQuery.toLowerCase();\n      result = result.filter(\n        (b) =>\n          b.title.toLowerCase().includes(q) ||\n          b.providerName.toLowerCase().includes(q) ||\n          b.serviceName.toLowerCase().includes(q)\n      );\n    }\n\n    result = [...result].sort((a, b) => {\n      const cmp =\n        sortField === 'date'\n          ? new Date(b.createdAt).getTime() - new Date(a.createdAt).getTime()\n          : sortField === 'budget'\n            ? b.budget - a.budget\n            : b.progress - a.progress;\n      return sortAsc ? -cmp : cmp;\n    });\n\n    return result;\n  }, [bookings, searchQuery, statusFilter, sortField, sortAsc]);\n\n  const selectedBooking = selectedBookingId\n    ? bookings.find((b) => b.id === selectedBookingId)\n    : null;\n\n  const statusCounts = useMemo(() => {\n    const counts: Record<string, number> = { all: bookings.length };\n    for (const b of bookings) {\n      counts[b.status] = (counts[b.status] ?? 0) + 1;\n    }\n    return counts;\n  }, [bookings]);\n\n  const totalBudget = bookings.reduce((sum, b) => sum + b.budget, 0);\n  const avgProgress = Math.round(\n    bookings.filter((b) => b.status === 'in_progress').reduce((sum, b) => sum + b.progress, 0) /\n      Math.max(1, bookings.filter((b) => b.status === 'in_progress').length)\n  );\n\n  const handleSort = (field: SortField) => {\n    if (sortField === field) setSortAsc(!sortAsc);\n    else {\n      setSortField(field);\n      setSortAsc(false);\n    }\n  };\n\n  return (\n    <div className=\"space-y-6 p-6\">\n      {/* Header */}\n      <div className=\"flex flex-col gap-4 sm:flex-row sm:items-center sm:justify-between\">\n        <div>\n          <h1 className=\"text-2xl font-semibold\">Bookings</h1>\n          <p className=\"text-sm text-text-secondary\">\n            Manage and track all your service bookings.\n          </p>\n        </div>\n        <Button size=\"sm\">\n          <Calendar className=\"mr-2 h-4 w-4\" /> New Booking\n        </Button>\n      </div>\n\n      {/* Stats */}\n      <div className=\"grid gap-4 sm:grid-cols-2 lg:grid-cols-4\">\n        <Card>\n          <CardContent className=\"pt-4\">\n            <div className=\"flex items-center gap-3\">\n              <div className=\"rounded-lg bg-blue-100 p-2 dark:bg-blue-950\">\n                <Calendar className=\"h-5 w-5 text-blue-600\" />\n              </div>\n              <div>\n                <p className=\"text-2xl font-bold\">{bookings.length}</p>\n                <p className=\"text-xs text-text-secondary\">Total Bookings</p>\n              </div>\n            </div>\n          </CardContent>\n        </Card>\n        <Card>\n          <CardContent className=\"pt-4\">\n            <div className=\"flex items-center gap-3\">\n              <div className=\"rounded-lg bg-green-100 p-2 dark:bg-green-950\">\n                <CheckCircle2 className=\"h-5 w-5 text-green-600\" />\n              </div>\n              <div>\n                <p className=\"text-2xl font-bold\">{statusCounts.completed ?? 0}</p>\n                <p className=\"text-xs text-text-secondary\">Completed</p>\n              </div>\n            </div>\n          </CardContent>\n        </Card>\n        <Card>\n          <CardContent className=\"pt-4\">\n            <div className=\"flex items-center gap-3\">\n              <div className=\"rounded-lg bg-yellow-100 p-2 dark:bg-yellow-950\">\n                <Loader2 className=\"h-5 w-5 text-yellow-600\" />\n              </div>\n              <div>\n                <p className=\"text-2xl font-bold\">{avgProgress}%</p>\n                <p className=\"text-xs text-text-secondary\">Avg. In-Progress</p>\n              </div>\n            </div>\n          </CardContent>\n        </Card>\n        <Card>\n          <CardContent className=\"pt-4\">\n            <div className=\"flex items-center gap-3\">\n              <div className=\"rounded-lg bg-purple-100 p-2 dark:bg-purple-950\">\n                <DollarSign className=\"h-5 w-5 text-purple-600\" />\n              </div>\n              <div>\n                <p className=\"text-2xl font-bold\">${totalBudget.toLocaleString()}</p>\n                <p className=\"text-xs text-text-secondary\">Total Budget</p>\n              </div>\n            </div>\n          </CardContent>\n        </Card>\n      </div>\n\n      {/* Filters */}\n      <div className=\"flex flex-col gap-4 sm:flex-row sm:items-center\">\n        <div className=\"relative flex-1\">\n          <Search className=\"absolute left-3 top-1/2 h-4 w-4 -translate-y-1/2 text-text-secondary\" />\n          <Input\n            placeholder=\"Search bookings by title, provider, or service...\"\n            value={searchQuery}\n            onChange={(e) => setSearchQuery(e.target.value)}\n            className=\"pl-10\"\n          />\n        </div>\n        <div className=\"flex items-center gap-2\">\n          <Filter className=\"h-4 w-4 text-text-secondary\" />\n          {(['all', 'pending', 'in_progress', 'completed', 'cancelled'] as const).map((status) => (\n            <Button\n              key={status}\n              variant={statusFilter === status ? 'default' : 'outline'}\n              size=\"sm\"\n              onClick={() => setStatusFilter(status)}\n            >\n              {status === 'all' ? 'All' : statusConfig[status].label}\n              <span className=\"ml-1 text-xs opacity-70\">({statusCounts[status] ?? 0})</span>\n            </Button>\n          ))}\n        </div>\n      </div>\n\n      {/* Sort controls */}\n      <div className=\"flex gap-2\">\n        {[\n          { field: 'date' as SortField, label: 'Date' },\n          { field: 'budget' as SortField, label: 'Budget' },\n          { field: 'progress' as SortField, label: 'Progress' },\n        ].map(({ field, label }) => (\n          <button\n            key={field}\n            onClick={() => handleSort(field)}\n            className={`flex items-center gap-1 rounded border px-3 py-1 text-xs ${\n              sortField === field\n                ? 'border-primary bg-action-primary-bg/5 text-primary'\n                : 'text-text-secondary hover:bg-bg-sunken/50'\n            }`}\n          >\n            <ArrowUpDown className=\"h-3 w-3\" />\n            {label}\n          </button>\n        ))}\n      </div>\n\n      <div className=\"grid gap-6 lg:grid-cols-3\">\n        {/* Booking list */}\n        <div className={`space-y-3 ${selectedBooking ? 'lg:col-span-2' : 'lg:col-span-3'}`}>\n          {filtered.length === 0 ? (\n            <Card>\n              <CardContent className=\"py-12 text-center text-text-secondary\">\n                No bookings match your filters.\n              </CardContent>\n            </Card>\n          ) : (\n            filtered.map((booking) => {\n              const config = statusConfig[booking.status];\n              const StatusIcon = config.icon;\n              return (\n                <Card\n                  key={booking.id}\n                  className={`cursor-pointer transition-colors hover:bg-bg-sunken/30 ${\n                    selectedBookingId === booking.id ? 'border-primary ring-1 ring-primary' : ''\n                  }`}\n                  onClick={() =>\n                    setSelectedBookingId(selectedBookingId === booking.id ? null : booking.id)\n                  }\n                >\n                  <CardContent className=\"pt-4\">\n                    <div className=\"flex items-start justify-between gap-4\">\n                      <div className=\"flex-1 space-y-2\">\n                        <div className=\"flex items-center gap-2\">\n                          <StatusIcon className={`h-4 w-4 ${config.color}`} />\n                          <h3 className=\"font-medium\">{booking.title}</h3>\n                        </div>\n                        <p className=\"text-sm text-text-secondary line-clamp-1\">\n                          {booking.description}\n                        </p>\n                        <div className=\"flex flex-wrap items-center gap-4 text-xs text-text-secondary\">\n                          <span className=\"flex items-center gap-1\">\n                            <User className=\"h-3 w-3\" /> {booking.providerName}\n                          </span>\n                          <span className=\"flex items-center gap-1\">\n                            <Calendar className=\"h-3 w-3\" /> {booking.startDate}\n                          </span>\n                          <span className=\"flex items-center gap-1\">\n                            <DollarSign className=\"h-3 w-3\" /> ${booking.budget.toLocaleString()}\n                          </span>\n                        </div>\n                      </div>\n                      <div className=\"flex flex-col items-end gap-2\">\n                        <Badge variant={config.badgeVariant}>{config.label}</Badge>\n                        {booking.status === 'in_progress' && (\n                          <span className=\"text-sm font-medium\">{booking.progress}%</span>\n                        )}\n                        <ChevronRight className=\"h-4 w-4 text-text-secondary\" />\n                      </div>\n                    </div>\n\n                    {/* Progress bar for in-progress bookings */}\n                    {booking.status === 'in_progress' && (\n                      <div className=\"mt-3\">\n                        <div className=\"h-2 w-full overflow-hidden rounded-full bg-bg-sunken\">\n                          <div\n                            className=\"h-2 rounded-full bg-blue-500 transition-all\"\n                            style={{ width: `${booking.progress}%` }}\n                          />\n                        </div>\n                      </div>\n                    )}\n                  </CardContent>\n                </Card>\n              );\n            })\n          )}\n        </div>\n\n        {/* Detail panel */}\n        {selectedBooking && (\n          <div className=\"space-y-4\">\n            <Card>\n              <CardHeader>\n                <div className=\"flex items-center justify-between\">\n                  <CardTitle className=\"text-base\">Booking Details</CardTitle>\n                  <Button variant=\"outline\" size=\"sm\" onClick={() => setSelectedBookingId(null)}>\n                    Close\n                  </Button>\n                </div>\n              </CardHeader>\n              <CardContent className=\"space-y-4\">\n                <div>\n                  <h3 className=\"font-semibold\">{selectedBooking.title}</h3>\n                  <p className=\"mt-1 text-sm text-text-secondary\">\n                    {selectedBooking.description}\n                  </p>\n                </div>\n\n                <Badge variant={statusConfig[selectedBooking.status].badgeVariant}>\n                  {statusConfig[selectedBooking.status].label}\n                </Badge>\n\n                {selectedBooking.status === 'in_progress' && (\n                  <div>\n                    <div className=\"flex items-center justify-between text-sm\">\n                      <span className=\"text-text-secondary\">Progress</span>\n                      <span className=\"font-medium\">{selectedBooking.progress}%</span>\n                    </div>\n                    <div className=\"mt-1 h-2 w-full overflow-hidden rounded-full bg-bg-sunken\">\n                      <div\n                        className=\"h-2 rounded-full bg-blue-500\"\n                        style={{ width: `${selectedBooking.progress}%` }}\n                      />\n                    </div>\n                  </div>\n                )}\n\n                <div className=\"space-y-2 border-t pt-3 text-sm\">\n                  <div className=\"flex justify-between\">\n                    <span className=\"text-text-secondary\">Service</span>\n                    <span className=\"font-medium\">{selectedBooking.serviceName}</span>\n                  </div>\n                  <div className=\"flex justify-between\">\n                    <span className=\"text-text-secondary\">Provider</span>\n                    <span className=\"font-medium\">{selectedBooking.providerName}</span>\n                  </div>\n                  <div className=\"flex justify-between\">\n                    <span className=\"text-text-secondary\">Budget</span>\n                    <span className=\"font-medium\">${selectedBooking.budget.toLocaleString()}</span>\n                  </div>\n                  <div className=\"flex justify-between\">\n                    <span className=\"text-text-secondary\">Start Date</span>\n                    <span className=\"font-medium\">{selectedBooking.startDate}</span>\n                  </div>\n                  <div className=\"flex justify-between\">\n                    <span className=\"text-text-secondary\">End Date</span>\n                    <span className=\"font-medium\">{selectedBooking.endDate}</span>\n                  </div>\n                  <div className=\"flex justify-between\">\n                    <span className=\"text-text-secondary\">Payment</span>\n                    <Badge variant=\"secondary\">{selectedBooking.paymentStatus}</Badge>\n                  </div>\n                  <div className=\"flex justify-between\">\n                    <span className=\"text-text-secondary\">Method</span>\n                    <span className=\"font-medium\">\n                      {selectedBooking.paymentMethod.replace('_', ' ')}\n                    </span>\n                  </div>\n                </div>\n\n                <div className=\"flex gap-2 border-t pt-3\">\n                  <Button className=\"flex-1\" size=\"sm\" variant=\"outline\">\n                    Message Provider\n                  </Button>\n                  {selectedBooking.status === 'pending' && (\n                    <Button className=\"flex-1\" size=\"sm\" variant=\"destructive\">\n                      Cancel\n                    </Button>\n                  )}\n                </div>\n              </CardContent>\n            </Card>\n          </div>\n        )}\n      </div>\n    </div>\n  );\n}\n"],"mappings":"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"}
+{"version":3,"file":"BookingsPage.js","names":[],"sources":["../../../src/proserviceworld/pages/BookingsPage.tsx"],"sourcesContent":["import { useState, useMemo } from 'react';\nimport {\n  Badge,\n  Button,\n  Card,\n  CardContent,\n  CardHeader,\n  CardTitle,\n  Input,\n  GlassCard,\n  IllustratedEmptyState,\n} from '@burdenoff/fe-libs/ui';\nimport {\n  Search,\n  Clock,\n  CheckCircle2,\n  XCircle,\n  Loader2,\n  Calendar,\n  DollarSign,\n  User,\n  ChevronRight,\n  Filter,\n  ArrowUpDown,\n} from 'lucide-react';\nimport { useProServiceWorldStore } from '../store/proserviceworldStore';\nimport type { BookingStatus } from '../types';\n\nconst statusConfig: Record<\n  BookingStatus,\n  {\n    label: string;\n    color: string;\n    icon: typeof Clock;\n    badgeVariant: 'default' | 'secondary' | 'outline' | 'destructive';\n  }\n> = {\n  pending: {\n    label: 'Pending',\n    color: 'text-status-warning-text',\n    icon: Clock,\n    badgeVariant: 'secondary',\n  },\n  in_progress: {\n    label: 'In Progress',\n    color: 'text-accent-blue',\n    icon: Loader2,\n    badgeVariant: 'default',\n  },\n  completed: {\n    label: 'Completed',\n    color: 'text-status-success-text',\n    icon: CheckCircle2,\n    badgeVariant: 'outline',\n  },\n  cancelled: {\n    label: 'Cancelled',\n    color: 'text-status-error-text',\n    icon: XCircle,\n    badgeVariant: 'destructive',\n  },\n};\n\ntype SortField = 'date' | 'budget' | 'progress';\n\nexport function BookingsPage() {\n  const { bookings } = useProServiceWorldStore();\n  const [searchQuery, setSearchQuery] = useState('');\n  const [statusFilter, setStatusFilter] = useState<BookingStatus | 'all'>('all');\n  const [sortField, setSortField] = useState<SortField>('date');\n  const [sortAsc, setSortAsc] = useState(false);\n  const [selectedBookingId, setSelectedBookingId] = useState<string | null>(null);\n\n  const filtered = useMemo(() => {\n    let result = bookings;\n\n    if (statusFilter !== 'all') {\n      result = result.filter((b) => b.status === statusFilter);\n    }\n\n    if (searchQuery.trim()) {\n      const q = searchQuery.toLowerCase();\n      result = result.filter(\n        (b) =>\n          b.title.toLowerCase().includes(q) ||\n          b.providerName.toLowerCase().includes(q) ||\n          b.serviceName.toLowerCase().includes(q)\n      );\n    }\n\n    result = [...result].sort((a, b) => {\n      const cmp =\n        sortField === 'date'\n          ? new Date(b.createdAt).getTime() - new Date(a.createdAt).getTime()\n          : sortField === 'budget'\n            ? b.budget - a.budget\n            : b.progress - a.progress;\n      return sortAsc ? -cmp : cmp;\n    });\n\n    return result;\n  }, [bookings, searchQuery, statusFilter, sortField, sortAsc]);\n\n  const selectedBooking = selectedBookingId\n    ? bookings.find((b) => b.id === selectedBookingId)\n    : null;\n\n  const statusCounts = useMemo(() => {\n    const counts: Record<string, number> = { all: bookings.length };\n    for (const b of bookings) {\n      counts[b.status] = (counts[b.status] ?? 0) + 1;\n    }\n    return counts;\n  }, [bookings]);\n\n  const totalBudget = bookings.reduce((sum, b) => sum + b.budget, 0);\n  const avgProgress = Math.round(\n    bookings.filter((b) => b.status === 'in_progress').reduce((sum, b) => sum + b.progress, 0) /\n      Math.max(1, bookings.filter((b) => b.status === 'in_progress').length)\n  );\n\n  const handleSort = (field: SortField) => {\n    if (sortField === field) setSortAsc(!sortAsc);\n    else {\n      setSortField(field);\n      setSortAsc(false);\n    }\n  };\n\n  return (\n    <div className=\"space-y-6 p-6 bg-bg-canvas min-h-screen\">\n      {/* Header */}\n      <div className=\"flex flex-col gap-4 sm:flex-row sm:items-center sm:justify-between\">\n        <div>\n          <h1 className=\"text-2xl font-semibold tracking-tight\">Bookings</h1>\n          <p className=\"text-sm text-text-secondary\">Manage and track all your service bookings.</p>\n        </div>\n        <Button size=\"sm\">\n          <Calendar className=\"mr-2 h-4 w-4\" /> New Booking\n        </Button>\n      </div>\n\n      {/* Stats */}\n      <div className=\"grid gap-4 sm:grid-cols-2 lg:grid-cols-4\">\n        <GlassCard treatment=\"metric\" className=\"border-border-seam\">\n          <div className=\"flex items-center gap-3\">\n            <div className=\"rounded-lg bg-status-info-bg-subtle p-2\">\n              <Calendar className=\"h-5 w-5 text-accent-blue\" />\n            </div>\n            <div>\n              <p className=\"text-2xl font-bold tabular-nums\">{bookings.length}</p>\n              <p className=\"text-xs text-text-secondary\">Total Bookings</p>\n            </div>\n          </div>\n        </GlassCard>\n        <GlassCard treatment=\"metric\" className=\"border-border-seam\">\n          <div className=\"flex items-center gap-3\">\n            <div className=\"rounded-lg bg-status-success-bg-subtle p-2\">\n              <CheckCircle2 className=\"h-5 w-5 text-status-success-text\" />\n            </div>\n            <div>\n              <p className=\"text-2xl font-bold tabular-nums\">{statusCounts.completed ?? 0}</p>\n              <p className=\"text-xs text-text-secondary\">Completed</p>\n            </div>\n          </div>\n        </GlassCard>\n        <GlassCard treatment=\"metric\" className=\"border-border-seam\">\n          <div className=\"flex items-center gap-3\">\n            <div className=\"rounded-lg bg-status-warning-bg-subtle p-2\">\n              <Loader2 className=\"h-5 w-5 text-status-warning-text\" />\n            </div>\n            <div>\n              <p className=\"text-2xl font-bold tabular-nums\">{avgProgress}%</p>\n              <p className=\"text-xs text-text-secondary\">Avg. In-Progress</p>\n            </div>\n          </div>\n        </GlassCard>\n        <GlassCard treatment=\"glass\" glow className=\"border-border-seam\">\n          <div className=\"flex items-center gap-3\">\n            <div className=\"rounded-lg bg-accent-purple-subtle p-2\">\n              <DollarSign className=\"h-5 w-5 text-accent-purple\" />\n            </div>\n            <div>\n              <p className=\"text-2xl font-bold tabular-nums\">${totalBudget.toLocaleString()}</p>\n              <p className=\"text-xs text-text-secondary\">Total Budget</p>\n            </div>\n          </div>\n        </GlassCard>\n      </div>\n\n      {/* Filters */}\n      <div className=\"flex flex-col gap-4 sm:flex-row sm:items-center\">\n        <div className=\"relative flex-1\">\n          <Search className=\"absolute left-3 top-1/2 h-4 w-4 -translate-y-1/2 text-text-secondary\" />\n          <Input\n            placeholder=\"Search bookings by title, provider, or service...\"\n            value={searchQuery}\n            onChange={(e) => setSearchQuery(e.target.value)}\n            className=\"pl-10\"\n          />\n        </div>\n        <div className=\"flex flex-wrap items-center gap-2\">\n          <Filter className=\"h-4 w-4 text-text-secondary\" />\n          {(['all', 'pending', 'in_progress', 'completed', 'cancelled'] as const).map((status) => (\n            <Button\n              key={status}\n              variant={statusFilter === status ? 'default' : 'outline'}\n              size=\"sm\"\n              onClick={() => setStatusFilter(status)}\n            >\n              {status === 'all' ? 'All' : statusConfig[status].label}\n              <span className=\"ml-1 text-xs opacity-70 tabular-nums\">\n                ({statusCounts[status] ?? 0})\n              </span>\n            </Button>\n          ))}\n        </div>\n      </div>\n\n      {/* Sort controls */}\n      <div className=\"flex flex-wrap gap-2\">\n        {[\n          { field: 'date' as SortField, label: 'Date' },\n          { field: 'budget' as SortField, label: 'Budget' },\n          { field: 'progress' as SortField, label: 'Progress' },\n        ].map(({ field, label }) => (\n          <button\n            key={field}\n            onClick={() => handleSort(field)}\n            aria-pressed={sortField === field}\n            className={`flex items-center gap-1 rounded border px-3 py-1 text-xs transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-border-focus ${\n              sortField === field\n                ? 'border-border-strong bg-accent-soft text-text-primary'\n                : 'border-border-seam text-text-secondary hover:bg-bg-sunken/50'\n            }`}\n          >\n            <ArrowUpDown className=\"h-3 w-3\" />\n            {label}\n          </button>\n        ))}\n      </div>\n\n      <div className=\"grid gap-6 lg:grid-cols-3\">\n        {/* Booking list */}\n        <div className={`space-y-3 ${selectedBooking ? 'lg:col-span-2' : 'lg:col-span-3'}`}>\n          {filtered.length === 0 ? (\n            <Card className=\"border-border-seam\">\n              <CardContent className=\"py-4\">\n                <IllustratedEmptyState\n                  illustration=\"empty-search\"\n                  title=\"No bookings found\"\n                  description=\"No bookings match your current filters.\"\n                />\n              </CardContent>\n            </Card>\n          ) : (\n            filtered.map((booking) => {\n              const config = statusConfig[booking.status];\n              const StatusIcon = config.icon;\n              return (\n                <Card\n                  key={booking.id}\n                  className={`cursor-pointer border-border-seam transition-shadow hover:shadow-pop ${\n                    selectedBookingId === booking.id\n                      ? 'border-border-strong ring-1 ring-border-focus'\n                      : ''\n                  }`}\n                  onClick={() =>\n                    setSelectedBookingId(selectedBookingId === booking.id ? null : booking.id)\n                  }\n                >\n                  <CardContent className=\"pt-4\">\n                    <div className=\"flex items-start justify-between gap-4\">\n                      <div className=\"flex-1 space-y-2\">\n                        <div className=\"flex items-center gap-2\">\n                          <StatusIcon className={`h-4 w-4 ${config.color}`} />\n                          <h3 className=\"font-medium\">{booking.title}</h3>\n                        </div>\n                        <p className=\"text-sm text-text-secondary line-clamp-1\">\n                          {booking.description}\n                        </p>\n                        <div className=\"flex flex-wrap items-center gap-4 text-xs text-text-secondary\">\n                          <span className=\"flex items-center gap-1\">\n                            <User className=\"h-3 w-3\" /> {booking.providerName}\n                          </span>\n                          <span className=\"flex items-center gap-1\">\n                            <Calendar className=\"h-3 w-3\" /> {booking.startDate}\n                          </span>\n                          <span className=\"flex items-center gap-1 tabular-nums\">\n                            <DollarSign className=\"h-3 w-3\" /> ${booking.budget.toLocaleString()}\n                          </span>\n                        </div>\n                      </div>\n                      <div className=\"flex flex-col items-end gap-2\">\n                        <Badge variant={config.badgeVariant}>{config.label}</Badge>\n                        {booking.status === 'in_progress' && (\n                          <span className=\"text-sm font-medium tabular-nums\">\n                            {booking.progress}%\n                          </span>\n                        )}\n                        <ChevronRight className=\"h-4 w-4 text-text-secondary\" />\n                      </div>\n                    </div>\n\n                    {/* Progress bar for in-progress bookings */}\n                    {booking.status === 'in_progress' && (\n                      <div className=\"mt-3\">\n                        <div className=\"h-2 w-full overflow-hidden rounded-full bg-bg-sunken\">\n                          <div\n                            className=\"h-2 rounded-full bg-action-primary-bg transition-all\"\n                            style={{ width: `${booking.progress}%` }}\n                          />\n                        </div>\n                      </div>\n                    )}\n                  </CardContent>\n                </Card>\n              );\n            })\n          )}\n        </div>\n\n        {/* Detail rail */}\n        {selectedBooking && (\n          <div className=\"space-y-4\">\n            <GlassCard treatment=\"glass\" className=\"border-border-seam lg:sticky lg:top-6\">\n              <div className=\"flex items-center justify-between\">\n                <h2 className=\"text-base font-semibold tracking-tight\">Booking Details</h2>\n                <Button variant=\"outline\" size=\"sm\" onClick={() => setSelectedBookingId(null)}>\n                  Close\n                </Button>\n              </div>\n              <div className=\"mt-4 space-y-4\">\n                <div>\n                  <h3 className=\"font-semibold\">{selectedBooking.title}</h3>\n                  <p className=\"mt-1 text-sm text-text-secondary\">{selectedBooking.description}</p>\n                </div>\n\n                <Badge variant={statusConfig[selectedBooking.status].badgeVariant}>\n                  {statusConfig[selectedBooking.status].label}\n                </Badge>\n\n                {selectedBooking.status === 'in_progress' && (\n                  <div>\n                    <div className=\"flex items-center justify-between text-sm\">\n                      <span className=\"text-text-secondary\">Progress</span>\n                      <span className=\"font-medium tabular-nums\">{selectedBooking.progress}%</span>\n                    </div>\n                    <div className=\"mt-1 h-2 w-full overflow-hidden rounded-full bg-bg-sunken\">\n                      <div\n                        className=\"h-2 rounded-full bg-action-primary-bg\"\n                        style={{ width: `${selectedBooking.progress}%` }}\n                      />\n                    </div>\n                  </div>\n                )}\n\n                <div className=\"space-y-2 border-t border-border-seam pt-3 text-sm\">\n                  <div className=\"flex justify-between\">\n                    <span className=\"text-text-secondary\">Service</span>\n                    <span className=\"font-medium\">{selectedBooking.serviceName}</span>\n                  </div>\n                  <div className=\"flex justify-between\">\n                    <span className=\"text-text-secondary\">Provider</span>\n                    <span className=\"font-medium\">{selectedBooking.providerName}</span>\n                  </div>\n                  <div className=\"flex justify-between\">\n                    <span className=\"text-text-secondary\">Budget</span>\n                    <span className=\"font-medium tabular-nums\">\n                      ${selectedBooking.budget.toLocaleString()}\n                    </span>\n                  </div>\n                  <div className=\"flex justify-between\">\n                    <span className=\"text-text-secondary\">Start Date</span>\n                    <span className=\"font-medium\">{selectedBooking.startDate}</span>\n                  </div>\n                  <div className=\"flex justify-between\">\n                    <span className=\"text-text-secondary\">End Date</span>\n                    <span className=\"font-medium\">{selectedBooking.endDate}</span>\n                  </div>\n                  <div className=\"flex justify-between\">\n                    <span className=\"text-text-secondary\">Payment</span>\n                    <Badge variant=\"secondary\">{selectedBooking.paymentStatus}</Badge>\n                  </div>\n                  <div className=\"flex justify-between\">\n                    <span className=\"text-text-secondary\">Method</span>\n                    <span className=\"font-medium\">\n                      {selectedBooking.paymentMethod.replace('_', ' ')}\n                    </span>\n                  </div>\n                </div>\n\n                <div className=\"flex gap-2 border-t border-border-seam pt-3\">\n                  <Button className=\"flex-1\" size=\"sm\" variant=\"outline\">\n                    Message Provider\n                  </Button>\n                  {selectedBooking.status === 'pending' && (\n                    <Button className=\"flex-1\" size=\"sm\" variant=\"destructive\">\n                      Cancel\n                    </Button>\n                  )}\n                </div>\n              </div>\n            </GlassCard>\n          </div>\n        )}\n      </div>\n    </div>\n  );\n}\n"],"mappings":"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"}