@burdenoff/microfe-coolandlovely 2026.614.1

package/dist/coolandlovely/pages/cart-owner/StaffManagementPage.js

@@ -0,0 +1,833 @@
+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 { useMemo as r, useState as i } from "react";
+import { AlertCircle as a, CheckCircle2 as o, Clock as s, Edit2 as c, Mail as l, Phone as u, Search as d, Star as f, Trash2 as p, UserPlus as m, Users as h, X as g } from "lucide-react";
+import { jsx as _, jsxs as v } from "react/jsx-runtime";
+//#region src/coolandlovely/pages/cart-owner/StaffManagementPage.tsx
+var y = [
+	{
+		id: "staff-001",
+		firstName: "Ravi",
+		lastName: "Kumar",
+		email: "ravi@dosaexpress.in",
+		phone: "+91-9876543210",
+		role: "delivery",
+		status: "active",
+		dateJoined: "2023-06-15",
+		lastActive: "2024-01-16T10:00:00Z",
+		hourlyRate: 200,
+		hoursWorked: 160,
+		totalEarnings: 32e3,
+		performance: {
+			rating: 4.8,
+			tasksCompleted: 245,
+			customerRating: 4.7,
+			punctuality: 95
+		},
+		currentShift: "09:00 - 17:00",
+		shiftsThisWeek: 5
+	},
+	{
+		id: "staff-002",
+		firstName: "Suresh",
+		lastName: "Worker",
+		email: "suresh@dosaexpress.in",
+		phone: "+91-9876543211",
+		role: "chef",
+		status: "active",
+		dateJoined: "2023-08-20",
+		lastActive: "2024-01-16T09:30:00Z",
+		hourlyRate: 250,
+		hoursWorked: 148,
+		totalEarnings: 37e3,
+		performance: {
+			rating: 4.6,
+			tasksCompleted: 312,
+			customerRating: 4.5,
+			punctuality: 90
+		},
+		currentShift: "10:00 - 18:00",
+		shiftsThisWeek: 4
+	},
+	{
+		id: "staff-003",
+		firstName: "Amit",
+		lastName: "Sharma",
+		email: "amit@dosaexpress.in",
+		phone: "+91-9876543212",
+		role: "delivery",
+		status: "on-leave",
+		dateJoined: "2023-10-01",
+		hourlyRate: 180,
+		hoursWorked: 120,
+		totalEarnings: 21600,
+		performance: {
+			rating: 4.4,
+			tasksCompleted: 178,
+			customerRating: 4.3,
+			punctuality: 85
+		},
+		shiftsThisWeek: 0
+	},
+	{
+		id: "staff-004",
+		firstName: "Priya",
+		lastName: "Helper",
+		email: "priya@dosaexpress.in",
+		phone: "+91-9876543213",
+		role: "server",
+		status: "inactive",
+		dateJoined: "2024-01-05",
+		hourlyRate: 150,
+		hoursWorked: 40,
+		totalEarnings: 6e3,
+		performance: {
+			rating: 4.7,
+			tasksCompleted: 56,
+			customerRating: 4.8,
+			punctuality: 98
+		},
+		shiftsThisWeek: 0
+	},
+	{
+		id: "staff-005",
+		firstName: "Kiran",
+		lastName: "B.",
+		email: "kiran@dosaexpress.in",
+		phone: "+91-9876543214",
+		role: "cashier",
+		status: "active",
+		dateJoined: "2023-12-10",
+		lastActive: "2024-01-16T11:00:00Z",
+		hourlyRate: 175,
+		hoursWorked: 80,
+		totalEarnings: 14e3,
+		performance: {
+			rating: 4.3,
+			tasksCompleted: 134,
+			customerRating: 4.2,
+			punctuality: 88
+		},
+		currentShift: "11:00 - 19:00",
+		shiftsThisWeek: 5
+	},
+	{
+		id: "staff-006",
+		firstName: "Meera",
+		lastName: "Devi",
+		email: "meera@dosaexpress.in",
+		phone: "+91-9876543215",
+		role: "manager",
+		status: "active",
+		dateJoined: "2023-04-01",
+		lastActive: "2024-01-16T08:00:00Z",
+		hourlyRate: 350,
+		hoursWorked: 168,
+		totalEarnings: 58800,
+		performance: {
+			rating: 4.9,
+			tasksCompleted: 420,
+			customerRating: 4.9,
+			punctuality: 99
+		},
+		currentShift: "08:00 - 16:00",
+		shiftsThisWeek: 6
+	}
+], b = {
+	active: {
+		label: "Active",
+		color: "text-green-600 dark:text-green-400",
+		dot: "bg-green-500"
+	},
+	inactive: {
+		label: "Inactive",
+		color: "text-muted-foreground",
+		dot: "bg-muted-foreground"
+	},
+	"on-leave": {
+		label: "On Leave",
+		color: "text-yellow-600 dark:text-yellow-400",
+		dot: "bg-yellow-500"
+	},
+	terminated: {
+		label: "Terminated",
+		color: "text-red-600 dark:text-red-400",
+		dot: "bg-red-500"
+	}
+}, x = {
+	manager: {
+		label: "Manager",
+		color: "bg-purple-500/20 text-purple-600 dark:text-purple-400"
+	},
+	chef: {
+		label: "Chef",
+		color: "bg-orange-500/20 text-orange-600 dark:text-orange-400"
+	},
+	server: {
+		label: "Server",
+		color: "bg-blue-500/20 text-blue-600 dark:text-blue-400"
+	},
+	delivery: {
+		label: "Delivery",
+		color: "bg-green-500/20 text-green-600 dark:text-green-400"
+	},
+	cashier: {
+		label: "Cashier",
+		color: "bg-cyan-500/20 text-cyan-600 dark:text-cyan-400"
+	}
+}, S = {
+	email: "",
+	firstName: "",
+	lastName: "",
+	phone: "",
+	role: "server",
+	hourlyRate: 150
+}, C = () => {
+	let { navigateTo: C } = e(), [w, T] = i(y), [E, D] = i(""), [O, k] = i(""), [A, j] = i(""), [M, N] = i("name"), [P, F] = i(!1), [I, L] = i(!1), [R, z] = i(null), [B, V] = i(S), [H, U] = i({
+		firstName: "",
+		lastName: "",
+		email: "",
+		phone: "",
+		role: "server",
+		hourlyRate: 150,
+		status: "active"
+	}), [W, G] = i(null), K = (e, t) => {
+		G({
+			text: e,
+			type: t
+		}), setTimeout(() => G(null), 3e3);
+	}, q = w.filter((e) => e.status === "active").length, J = w.filter((e) => e.status === "on-leave").length, Y = w.length > 0 ? (w.reduce((e, t) => e + t.performance.rating, 0) / w.length).toFixed(1) : "0";
+	w.reduce((e, t) => e + t.totalEarnings, 0);
+	let X = r(() => {
+		let e = [...w];
+		if (E) {
+			let t = E.toLowerCase();
+			e = e.filter((e) => `${e.firstName} ${e.lastName}`.toLowerCase().includes(t) || e.email.toLowerCase().includes(t) || e.phone.includes(t));
+		}
+		switch (O && (e = e.filter((e) => e.role === O)), A && (e = e.filter((e) => e.status === A)), M) {
+			case "name":
+				e.sort((e, t) => `${e.firstName} ${e.lastName}`.localeCompare(`${t.firstName} ${t.lastName}`));
+				break;
+			case "rating":
+				e.sort((e, t) => t.performance.rating - e.performance.rating);
+				break;
+			case "hours":
+				e.sort((e, t) => t.hoursWorked - e.hoursWorked);
+				break;
+			case "joined":
+				e.sort((e, t) => new Date(t.dateJoined).getTime() - new Date(e.dateJoined).getTime());
+				break;
+		}
+		return e;
+	}, [
+		w,
+		E,
+		O,
+		A,
+		M
+	]), Z = () => {
+		if (!B.email || !B.firstName || !B.lastName) {
+			K("Please fill in all required fields", "error");
+			return;
+		}
+		let e = {
+			id: `staff-${Date.now()}`,
+			...B,
+			status: "active",
+			dateJoined: (/* @__PURE__ */ new Date()).toISOString().split("T")[0],
+			hoursWorked: 0,
+			totalEarnings: 0,
+			performance: {
+				rating: 0,
+				tasksCompleted: 0,
+				customerRating: 0,
+				punctuality: 0
+			},
+			shiftsThisWeek: 0
+		};
+		T((t) => [...t, e]), F(!1), V(S), K("Staff member invited successfully", "success");
+	}, Q = (e) => {
+		z(e), U({
+			firstName: e.firstName,
+			lastName: e.lastName,
+			email: e.email,
+			phone: e.phone,
+			role: e.role,
+			hourlyRate: e.hourlyRate,
+			status: e.status
+		}), L(!0);
+	}, $ = () => {
+		R && (T((e) => e.map((e) => e.id === R.id ? {
+			...e,
+			...H
+		} : e)), L(!1), K("Staff member updated successfully", "success"));
+	}, ee = (e) => {
+		T((t) => t.map((t) => {
+			if (t.id === e) {
+				let e = t.status === "active" ? "inactive" : "active";
+				return {
+					...t,
+					status: e
+				};
+			}
+			return t;
+		})), K("Staff status updated", "success");
+	}, te = (e) => {
+		confirm("Are you sure you want to remove this staff member?") && (T((t) => t.filter((t) => t.id !== e)), K("Staff member removed", "success"));
+	};
+	return /* @__PURE__ */ v(n, {
+		title: "Staff Management",
+		description: "Manage your workers, delivery partners, and shifts",
+		actions: /* @__PURE__ */ v("button", {
+			type: "button",
+			onClick: () => {
+				V(S), F(!0);
+			},
+			className: "inline-flex items-center gap-2 rounded-md bg-accent px-4 py-2 text-sm font-medium text-foreground hover:bg-accent/80 transition-colors",
+			children: [/* @__PURE__ */ _(m, { className: "h-4 w-4" }), "Invite Staff"]
+		}),
+		children: [
+			/* @__PURE__ */ v("div", {
+				className: "space-y-4",
+				children: [
+					W && /* @__PURE__ */ v("div", {
+						className: t("flex items-center gap-2 rounded-lg border p-3", W.type === "success" ? "border-green-500/30 bg-green-500/10" : "border-red-500/30 bg-red-500/10"),
+						children: [W.type === "success" ? /* @__PURE__ */ _(o, { className: "h-4 w-4 text-green-600 dark:text-green-400" }) : /* @__PURE__ */ _(a, { className: "h-4 w-4 text-red-600 dark:text-red-400" }), /* @__PURE__ */ _("span", {
+							className: t("text-sm font-medium", W.type === "success" ? "text-green-600 dark:text-green-400" : "text-red-600 dark:text-red-400"),
+							children: W.text
+						})]
+					}),
+					/* @__PURE__ */ v("div", {
+						className: "grid grid-cols-2 sm:grid-cols-4 gap-3",
+						children: [
+							/* @__PURE__ */ v("div", {
+								className: "rounded-lg border border-border bg-card p-4 shadow-sm",
+								children: [/* @__PURE__ */ _("p", {
+									className: "text-2xl font-bold text-foreground",
+									children: w.length
+								}), /* @__PURE__ */ _("p", {
+									className: "text-xs text-muted-foreground",
+									children: "Total Staff"
+								})]
+							}),
+							/* @__PURE__ */ v("div", {
+								className: "rounded-lg border border-border bg-card p-4 shadow-sm",
+								children: [/* @__PURE__ */ _("p", {
+									className: "text-2xl font-bold text-green-600 dark:text-green-400",
+									children: q
+								}), /* @__PURE__ */ _("p", {
+									className: "text-xs text-muted-foreground",
+									children: "Active Now"
+								})]
+							}),
+							/* @__PURE__ */ v("div", {
+								className: "rounded-lg border border-border bg-card p-4 shadow-sm",
+								children: [/* @__PURE__ */ _("p", {
+									className: "text-2xl font-bold text-yellow-600 dark:text-yellow-400",
+									children: J
+								}), /* @__PURE__ */ _("p", {
+									className: "text-xs text-muted-foreground",
+									children: "On Leave"
+								})]
+							}),
+							/* @__PURE__ */ v("div", {
+								className: "rounded-lg border border-border bg-card p-4 shadow-sm",
+								children: [/* @__PURE__ */ _("p", {
+									className: "text-2xl font-bold text-foreground",
+									children: Y
+								}), /* @__PURE__ */ _("p", {
+									className: "text-xs text-muted-foreground",
+									children: "Avg. Rating"
+								})]
+							})
+						]
+					}),
+					/* @__PURE__ */ _("div", {
+						className: "rounded-lg border border-border bg-card p-4 shadow-sm",
+						children: /* @__PURE__ */ v("div", {
+							className: "grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 gap-3",
+							children: [
+								/* @__PURE__ */ v("div", {
+									className: "relative",
+									children: [/* @__PURE__ */ _(d, { className: "absolute left-3 top-1/2 h-4 w-4 -translate-y-1/2 text-muted-foreground" }), /* @__PURE__ */ _("input", {
+										type: "text",
+										placeholder: "Search staff...",
+										value: E,
+										onChange: (e) => D(e.target.value),
+										className: "w-full rounded-md border border-border bg-card pl-10 pr-4 py-2 text-sm text-foreground placeholder:text-muted-foreground focus:outline-none focus:ring-2 focus:ring-ring"
+									})]
+								}),
+								/* @__PURE__ */ v("select", {
+									value: O,
+									onChange: (e) => k(e.target.value),
+									className: "rounded-md border border-border bg-card px-3 py-2 text-sm text-foreground",
+									children: [/* @__PURE__ */ _("option", {
+										value: "",
+										children: "All Roles"
+									}), Object.entries(x).map(([e, t]) => /* @__PURE__ */ _("option", {
+										value: e,
+										children: t.label
+									}, e))]
+								}),
+								/* @__PURE__ */ v("select", {
+									value: A,
+									onChange: (e) => j(e.target.value),
+									className: "rounded-md border border-border bg-card px-3 py-2 text-sm text-foreground",
+									children: [/* @__PURE__ */ _("option", {
+										value: "",
+										children: "All Status"
+									}), Object.entries(b).map(([e, t]) => /* @__PURE__ */ _("option", {
+										value: e,
+										children: t.label
+									}, e))]
+								}),
+								/* @__PURE__ */ v("select", {
+									value: M,
+									onChange: (e) => N(e.target.value),
+									className: "rounded-md border border-border bg-card px-3 py-2 text-sm text-foreground",
+									children: [
+										/* @__PURE__ */ _("option", {
+											value: "name",
+											children: "Name A-Z"
+										}),
+										/* @__PURE__ */ _("option", {
+											value: "rating",
+											children: "Rating: High to Low"
+										}),
+										/* @__PURE__ */ _("option", {
+											value: "hours",
+											children: "Hours: Most Worked"
+										}),
+										/* @__PURE__ */ _("option", {
+											value: "joined",
+											children: "Recently Joined"
+										})
+									]
+								})
+							]
+						})
+					}),
+					X.length === 0 ? /* @__PURE__ */ v("div", {
+						className: "flex flex-col items-center justify-center py-16 rounded-lg border border-border bg-card shadow-sm text-center",
+						children: [
+							/* @__PURE__ */ _(h, { className: "h-12 w-12 text-muted-foreground opacity-40 mb-3" }),
+							/* @__PURE__ */ _("p", {
+								className: "text-sm font-medium text-foreground",
+								children: "No staff members found"
+							}),
+							/* @__PURE__ */ _("p", {
+								className: "text-xs text-muted-foreground mt-1",
+								children: "Try adjusting your filters"
+							})
+						]
+					}) : /* @__PURE__ */ _("div", {
+						className: "rounded-lg border border-border bg-card shadow-sm divide-y divide-border",
+						children: X.map((e) => {
+							let n = b[e.status], r = x[e.role];
+							return /* @__PURE__ */ v("div", {
+								className: "p-4 sm:p-5 hover:bg-muted/30 transition-colors",
+								children: [/* @__PURE__ */ v("div", {
+									className: "flex flex-col sm:flex-row sm:items-center gap-4",
+									children: [/* @__PURE__ */ v("div", {
+										className: "flex items-center gap-4 flex-1 min-w-0",
+										children: [/* @__PURE__ */ v("div", {
+											className: "relative shrink-0",
+											children: [/* @__PURE__ */ _("div", {
+												className: "flex h-12 w-12 items-center justify-center rounded-full bg-muted text-sm font-semibold text-foreground",
+												children: `${e.firstName[0]}${e.lastName[0]}`
+											}), /* @__PURE__ */ _("span", { className: t("absolute -bottom-0.5 -right-0.5 h-3.5 w-3.5 rounded-full border-2 border-card", n.dot) })]
+										}), /* @__PURE__ */ v("div", {
+											className: "flex-1 min-w-0",
+											children: [/* @__PURE__ */ v("div", {
+												className: "flex items-center gap-2 flex-wrap",
+												children: [
+													/* @__PURE__ */ v("p", {
+														className: "text-sm font-medium text-foreground",
+														children: [
+															e.firstName,
+															" ",
+															e.lastName
+														]
+													}),
+													/* @__PURE__ */ _("span", {
+														className: t("inline-flex items-center rounded-full px-2 py-0.5 text-[10px] font-medium", r.color),
+														children: r.label
+													}),
+													/* @__PURE__ */ _("span", {
+														className: t("text-xs", n.color),
+														children: n.label
+													})
+												]
+											}), /* @__PURE__ */ v("div", {
+												className: "flex items-center gap-3 mt-1 text-xs text-muted-foreground flex-wrap",
+												children: [/* @__PURE__ */ v("span", {
+													className: "flex items-center gap-1",
+													children: [/* @__PURE__ */ _(l, { className: "h-3 w-3" }), e.email]
+												}), /* @__PURE__ */ v("span", {
+													className: "flex items-center gap-1",
+													children: [/* @__PURE__ */ _(u, { className: "h-3 w-3" }), e.phone]
+												})]
+											})]
+										})]
+									}), /* @__PURE__ */ v("div", {
+										className: "flex items-center gap-4 sm:gap-6",
+										children: [/* @__PURE__ */ v("div", {
+											className: "hidden md:flex items-center gap-4 text-xs",
+											children: [
+												/* @__PURE__ */ v("div", {
+													className: "text-center",
+													children: [/* @__PURE__ */ v("p", {
+														className: "font-bold text-foreground flex items-center gap-0.5 justify-center",
+														children: [/* @__PURE__ */ _(f, { className: "h-3 w-3 fill-yellow-400 text-yellow-400" }), e.performance.rating]
+													}), /* @__PURE__ */ _("p", {
+														className: "text-muted-foreground",
+														children: "Rating"
+													})]
+												}),
+												/* @__PURE__ */ v("div", {
+													className: "text-center",
+													children: [/* @__PURE__ */ _("p", {
+														className: "font-bold text-foreground",
+														children: e.performance.tasksCompleted
+													}), /* @__PURE__ */ _("p", {
+														className: "text-muted-foreground",
+														children: "Tasks"
+													})]
+												}),
+												/* @__PURE__ */ v("div", {
+													className: "text-center",
+													children: [/* @__PURE__ */ v("p", {
+														className: "font-bold text-foreground",
+														children: [e.performance.punctuality, "%"]
+													}), /* @__PURE__ */ _("p", {
+														className: "text-muted-foreground",
+														children: "On Time"
+													})]
+												}),
+												e.currentShift && /* @__PURE__ */ v("div", {
+													className: "text-center",
+													children: [/* @__PURE__ */ v("p", {
+														className: "font-bold text-foreground flex items-center gap-0.5 justify-center",
+														children: [/* @__PURE__ */ _(s, { className: "h-3 w-3 text-muted-foreground" }), e.currentShift]
+													}), /* @__PURE__ */ _("p", {
+														className: "text-muted-foreground",
+														children: "Shift"
+													})]
+												})
+											]
+										}), /* @__PURE__ */ v("div", {
+											className: "flex items-center gap-1",
+											children: [
+												/* @__PURE__ */ _("button", {
+													type: "button",
+													onClick: () => ee(e.id),
+													className: t("h-6 w-11 rounded-full transition-colors relative", e.status === "active" ? "bg-green-500" : "bg-muted-foreground/30"),
+													title: e.status === "active" ? "Deactivate" : "Activate",
+													children: /* @__PURE__ */ _("div", { className: t("absolute top-0.5 h-5 w-5 rounded-full bg-white transition-transform", e.status === "active" ? "translate-x-5" : "translate-x-0.5") })
+												}),
+												/* @__PURE__ */ _("button", {
+													type: "button",
+													onClick: () => Q(e),
+													className: "rounded p-1.5 text-muted-foreground hover:bg-muted hover:text-foreground transition-colors",
+													title: "Edit",
+													children: /* @__PURE__ */ _(c, { className: "h-4 w-4" })
+												}),
+												/* @__PURE__ */ _("button", {
+													type: "button",
+													onClick: () => te(e.id),
+													className: "rounded p-1.5 text-muted-foreground hover:bg-red-500/10 hover:text-red-600 transition-colors",
+													title: "Remove",
+													children: /* @__PURE__ */ _(p, { className: "h-4 w-4" })
+												})
+											]
+										})]
+									})]
+								}), /* @__PURE__ */ v("div", {
+									className: "md:hidden flex items-center gap-4 mt-3 text-xs text-muted-foreground",
+									children: [
+										/* @__PURE__ */ v("span", {
+											className: "flex items-center gap-0.5",
+											children: [/* @__PURE__ */ _(f, { className: "h-3 w-3 fill-yellow-400 text-yellow-400" }), e.performance.rating]
+										}),
+										/* @__PURE__ */ v("span", { children: [e.performance.tasksCompleted, " tasks"] }),
+										/* @__PURE__ */ v("span", { children: [e.performance.punctuality, "% on time"] }),
+										e.currentShift && /* @__PURE__ */ v("span", {
+											className: "flex items-center gap-0.5",
+											children: [/* @__PURE__ */ _(s, { className: "h-3 w-3" }), e.currentShift]
+										}),
+										/* @__PURE__ */ v("span", { children: [e.shiftsThisWeek, " shifts/wk"] })
+									]
+								})]
+							}, e.id);
+						})
+					})
+				]
+			}),
+			P && /* @__PURE__ */ _("div", {
+				className: "fixed inset-0 z-50 flex items-center justify-center bg-black/50 p-4",
+				children: /* @__PURE__ */ _("div", {
+					className: "w-full max-w-lg rounded-lg border border-border bg-card shadow-xl",
+					children: /* @__PURE__ */ v("div", {
+						className: "p-6",
+						children: [
+							/* @__PURE__ */ v("div", {
+								className: "flex items-center justify-between mb-4",
+								children: [/* @__PURE__ */ _("h3", {
+									className: "text-lg font-semibold text-foreground",
+									children: "Invite Staff Member"
+								}), /* @__PURE__ */ _("button", {
+									type: "button",
+									onClick: () => F(!1),
+									className: "rounded p-1.5 text-muted-foreground hover:text-foreground hover:bg-muted",
+									children: /* @__PURE__ */ _(g, { className: "h-5 w-5" })
+								})]
+							}),
+							/* @__PURE__ */ v("div", {
+								className: "space-y-4",
+								children: [
+									/* @__PURE__ */ v("div", {
+										className: "grid grid-cols-2 gap-4",
+										children: [/* @__PURE__ */ v("div", { children: [/* @__PURE__ */ _("label", {
+											className: "block text-sm font-medium text-foreground mb-1",
+											children: "First Name *"
+										}), /* @__PURE__ */ _("input", {
+											type: "text",
+											value: B.firstName,
+											onChange: (e) => V((t) => ({
+												...t,
+												firstName: e.target.value
+											})),
+											className: "w-full rounded-md border border-border bg-card px-3 py-2 text-sm text-foreground"
+										})] }), /* @__PURE__ */ v("div", { children: [/* @__PURE__ */ _("label", {
+											className: "block text-sm font-medium text-foreground mb-1",
+											children: "Last Name *"
+										}), /* @__PURE__ */ _("input", {
+											type: "text",
+											value: B.lastName,
+											onChange: (e) => V((t) => ({
+												...t,
+												lastName: e.target.value
+											})),
+											className: "w-full rounded-md border border-border bg-card px-3 py-2 text-sm text-foreground"
+										})] })]
+									}),
+									/* @__PURE__ */ v("div", { children: [/* @__PURE__ */ _("label", {
+										className: "block text-sm font-medium text-foreground mb-1",
+										children: "Email *"
+									}), /* @__PURE__ */ _("input", {
+										type: "email",
+										value: B.email,
+										onChange: (e) => V((t) => ({
+											...t,
+											email: e.target.value
+										})),
+										className: "w-full rounded-md border border-border bg-card px-3 py-2 text-sm text-foreground"
+									})] }),
+									/* @__PURE__ */ v("div", { children: [/* @__PURE__ */ _("label", {
+										className: "block text-sm font-medium text-foreground mb-1",
+										children: "Phone"
+									}), /* @__PURE__ */ _("input", {
+										type: "tel",
+										value: B.phone,
+										onChange: (e) => V((t) => ({
+											...t,
+											phone: e.target.value
+										})),
+										className: "w-full rounded-md border border-border bg-card px-3 py-2 text-sm text-foreground"
+									})] }),
+									/* @__PURE__ */ v("div", {
+										className: "grid grid-cols-2 gap-4",
+										children: [/* @__PURE__ */ v("div", { children: [/* @__PURE__ */ _("label", {
+											className: "block text-sm font-medium text-foreground mb-1",
+											children: "Role"
+										}), /* @__PURE__ */ _("select", {
+											value: B.role,
+											onChange: (e) => V((t) => ({
+												...t,
+												role: e.target.value
+											})),
+											className: "w-full rounded-md border border-border bg-card px-3 py-2 text-sm text-foreground",
+											children: Object.entries(x).map(([e, t]) => /* @__PURE__ */ _("option", {
+												value: e,
+												children: t.label
+											}, e))
+										})] }), /* @__PURE__ */ v("div", { children: [/* @__PURE__ */ _("label", {
+											className: "block text-sm font-medium text-foreground mb-1",
+											children: "Hourly Rate (₹)"
+										}), /* @__PURE__ */ _("input", {
+											type: "number",
+											value: B.hourlyRate,
+											onChange: (e) => V((t) => ({
+												...t,
+												hourlyRate: parseInt(e.target.value) || 0
+											})),
+											className: "w-full rounded-md border border-border bg-card px-3 py-2 text-sm text-foreground"
+										})] })]
+									})
+								]
+							}),
+							/* @__PURE__ */ v("div", {
+								className: "flex gap-3 mt-6",
+								children: [/* @__PURE__ */ _("button", {
+									type: "button",
+									onClick: () => F(!1),
+									className: "flex-1 rounded-md border border-border px-4 py-2 text-sm font-medium text-foreground hover:bg-muted",
+									children: "Cancel"
+								}), /* @__PURE__ */ _("button", {
+									type: "button",
+									onClick: Z,
+									className: "flex-1 rounded-md bg-accent px-4 py-2 text-sm font-medium text-foreground hover:bg-accent/80",
+									children: "Send Invite"
+								})]
+							})
+						]
+					})
+				})
+			}),
+			I && R && /* @__PURE__ */ _("div", {
+				className: "fixed inset-0 z-50 flex items-center justify-center bg-black/50 p-4",
+				children: /* @__PURE__ */ _("div", {
+					className: "w-full max-w-lg rounded-lg border border-border bg-card shadow-xl",
+					children: /* @__PURE__ */ v("div", {
+						className: "p-6",
+						children: [
+							/* @__PURE__ */ v("div", {
+								className: "flex items-center justify-between mb-4",
+								children: [/* @__PURE__ */ _("h3", {
+									className: "text-lg font-semibold text-foreground",
+									children: "Edit Staff Member"
+								}), /* @__PURE__ */ _("button", {
+									type: "button",
+									onClick: () => L(!1),
+									className: "rounded p-1.5 text-muted-foreground hover:text-foreground hover:bg-muted",
+									children: /* @__PURE__ */ _(g, { className: "h-5 w-5" })
+								})]
+							}),
+							/* @__PURE__ */ v("div", {
+								className: "space-y-4",
+								children: [
+									/* @__PURE__ */ v("div", {
+										className: "grid grid-cols-2 gap-4",
+										children: [/* @__PURE__ */ v("div", { children: [/* @__PURE__ */ _("label", {
+											className: "block text-sm font-medium text-foreground mb-1",
+											children: "First Name"
+										}), /* @__PURE__ */ _("input", {
+											type: "text",
+											value: H.firstName,
+											onChange: (e) => U((t) => ({
+												...t,
+												firstName: e.target.value
+											})),
+											className: "w-full rounded-md border border-border bg-card px-3 py-2 text-sm text-foreground"
+										})] }), /* @__PURE__ */ v("div", { children: [/* @__PURE__ */ _("label", {
+											className: "block text-sm font-medium text-foreground mb-1",
+											children: "Last Name"
+										}), /* @__PURE__ */ _("input", {
+											type: "text",
+											value: H.lastName,
+											onChange: (e) => U((t) => ({
+												...t,
+												lastName: e.target.value
+											})),
+											className: "w-full rounded-md border border-border bg-card px-3 py-2 text-sm text-foreground"
+										})] })]
+									}),
+									/* @__PURE__ */ v("div", { children: [/* @__PURE__ */ _("label", {
+										className: "block text-sm font-medium text-foreground mb-1",
+										children: "Email"
+									}), /* @__PURE__ */ _("input", {
+										type: "email",
+										value: H.email,
+										onChange: (e) => U((t) => ({
+											...t,
+											email: e.target.value
+										})),
+										className: "w-full rounded-md border border-border bg-card px-3 py-2 text-sm text-foreground"
+									})] }),
+									/* @__PURE__ */ v("div", { children: [/* @__PURE__ */ _("label", {
+										className: "block text-sm font-medium text-foreground mb-1",
+										children: "Phone"
+									}), /* @__PURE__ */ _("input", {
+										type: "tel",
+										value: H.phone,
+										onChange: (e) => U((t) => ({
+											...t,
+											phone: e.target.value
+										})),
+										className: "w-full rounded-md border border-border bg-card px-3 py-2 text-sm text-foreground"
+									})] }),
+									/* @__PURE__ */ v("div", {
+										className: "grid grid-cols-3 gap-4",
+										children: [
+											/* @__PURE__ */ v("div", { children: [/* @__PURE__ */ _("label", {
+												className: "block text-sm font-medium text-foreground mb-1",
+												children: "Role"
+											}), /* @__PURE__ */ _("select", {
+												value: H.role,
+												onChange: (e) => U((t) => ({
+													...t,
+													role: e.target.value
+												})),
+												className: "w-full rounded-md border border-border bg-card px-3 py-2 text-sm text-foreground",
+												children: Object.entries(x).map(([e, t]) => /* @__PURE__ */ _("option", {
+													value: e,
+													children: t.label
+												}, e))
+											})] }),
+											/* @__PURE__ */ v("div", { children: [/* @__PURE__ */ _("label", {
+												className: "block text-sm font-medium text-foreground mb-1",
+												children: "Rate (₹/hr)"
+											}), /* @__PURE__ */ _("input", {
+												type: "number",
+												value: H.hourlyRate,
+												onChange: (e) => U((t) => ({
+													...t,
+													hourlyRate: parseInt(e.target.value) || 0
+												})),
+												className: "w-full rounded-md border border-border bg-card px-3 py-2 text-sm text-foreground"
+											})] }),
+											/* @__PURE__ */ v("div", { children: [/* @__PURE__ */ _("label", {
+												className: "block text-sm font-medium text-foreground mb-1",
+												children: "Status"
+											}), /* @__PURE__ */ _("select", {
+												value: H.status,
+												onChange: (e) => U((t) => ({
+													...t,
+													status: e.target.value
+												})),
+												className: "w-full rounded-md border border-border bg-card px-3 py-2 text-sm text-foreground",
+												children: Object.entries(b).map(([e, t]) => /* @__PURE__ */ _("option", {
+													value: e,
+													children: t.label
+												}, e))
+											})] })
+										]
+									})
+								]
+							}),
+							/* @__PURE__ */ v("div", {
+								className: "flex gap-3 mt-6",
+								children: [/* @__PURE__ */ _("button", {
+									type: "button",
+									onClick: () => L(!1),
+									className: "flex-1 rounded-md border border-border px-4 py-2 text-sm font-medium text-foreground hover:bg-muted",
+									children: "Cancel"
+								}), /* @__PURE__ */ _("button", {
+									type: "button",
+									onClick: $,
+									className: "flex-1 rounded-md bg-accent px-4 py-2 text-sm font-medium text-foreground hover:bg-accent/80",
+									children: "Save Changes"
+								})]
+							})
+						]
+					})
+				})
+			})
+		]
+	});
+};
+//#endregion
+export { C as StaffManagementPage };
+
+//# sourceMappingURL=StaffManagementPage.js.map