@burdenoff/microfe-coolandlovely 2026.625.1 → 2026.625.2

package/dist/coolandlovely/pages/worker/WorkerProfilePage.js

@@ -6,8 +6,9 @@ import { mockWorker as i } from "../../mocks/users.js";
 import { useState as a } from "react";
 import { Award as o, Bell as s, Briefcase as c, Camera as l, Clock as u, CreditCard as d, Loader2 as f, MapPin as p, Pencil as m, Save as h, Shield as g, User as _, X as v } from "lucide-react";
 import { Fragment as y, jsx as b, jsxs as x } from "react/jsx-runtime";
+import { EmphasisPanel as S, PagePurpose as C } from "@burdenoff/fe-libs/ui";
 //#region src/coolandlovely/pages/worker/WorkerProfilePage.tsx
-var S = [
+var w = [
 	{
 		id: "personal",
 		label: "Personal Info",
@@ -38,8 +39,8 @@ var S = [
 		label: "Notifications",
 		icon: s
 	}
-], C = () => {
-	let { navigateTo: s } = e(), [c, d] = a("personal"), [p, C] = a(!1), [w, T] = a(!1), [E, D] = a({
+], T = () => {
+	let { navigateTo: s } = e(), [c, d] = a("personal"), [p, T] = a(!1), [E, D] = a(!1), [O, k] = a({
 		firstName: i.firstName || "Suresh",
 		lastName: i.lastName || "Kumar",
 		email: i.email || "suresh.worker@example.com",
@@ -66,7 +67,7 @@ var S = [
 		ifscCode: "HDFC0001234",
 		panNumber: "ABCDE****F",
 		aadharNumber: "****5678"
-	}), [O, k] = a([
+	}), [A, j] = a([
 		{
 			id: "orders",
 			label: "New Order Assignments",
@@ -97,69 +98,73 @@ var S = [
 			description: "Important updates from management",
 			enabled: !0
 		}
-	]), A = (e, t) => {
-		D((n) => ({
+	]), M = (e, t) => {
+		k((n) => ({
 			...n,
 			[e]: t
 		}));
-	}, j = () => {
-		T(!0), setTimeout(() => {
-			T(!1), C(!1), alert("Profile updated successfully!");
+	}, N = () => {
+		D(!0), setTimeout(() => {
+			D(!1), T(!1), alert("Profile updated successfully!");
 		}, 1e3);
-	}, M = (e) => {
+	}, P = (e) => {
 		let t = e.target.files?.[0];
 		if (t) {
 			let e = new FileReader();
 			e.onloadend = () => {
-				D((t) => ({
+				k((t) => ({
 					...t,
 					profileImage: e.result
 				}));
 			}, e.readAsDataURL(t);
 		}
-	}, N = (e) => {
-		p && k((t) => t.map((t) => t.id === e ? {
+	}, F = (e) => {
+		p && j((t) => t.map((t) => t.id === e ? {
 			...t,
 			enabled: !t.enabled
 		} : t));
 	};
-	return /* @__PURE__ */ b(n, {
+	return /* @__PURE__ */ x(n, {
 		title: "My Profile",
 		description: "Manage your profile information",
 		actions: /* @__PURE__ */ b("div", {
 			className: "flex items-center gap-2",
 			children: p ? /* @__PURE__ */ x(y, { children: [/* @__PURE__ */ x("button", {
 				type: "button",
-				onClick: () => C(!1),
+				onClick: () => T(!1),
 				className: "inline-flex items-center gap-2 rounded-md bg-accent px-3 py-2 text-sm font-medium text-text-primary hover:bg-accent/80 transition-colors",
 				children: [/* @__PURE__ */ b(v, { className: "h-4 w-4" }), "Cancel"]
 			}), /* @__PURE__ */ b("button", {
 				type: "button",
-				onClick: j,
-				disabled: w,
+				onClick: N,
+				disabled: E,
 				className: "inline-flex items-center gap-2 rounded-md bg-accent-blue-subtle/10 px-3 py-2 text-sm font-medium text-accent-blue hover:bg-accent-blue-subtle/20 transition-colors disabled:opacity-50",
-				children: w ? /* @__PURE__ */ x(y, { children: [/* @__PURE__ */ b(f, { className: "h-4 w-4 animate-spin" }), "Saving..."] }) : /* @__PURE__ */ x(y, { children: [/* @__PURE__ */ b(h, { className: "h-4 w-4" }), "Save Changes"] })
+				children: E ? /* @__PURE__ */ x(y, { children: [/* @__PURE__ */ b(f, { className: "h-4 w-4 animate-spin" }), "Saving..."] }) : /* @__PURE__ */ x(y, { children: [/* @__PURE__ */ b(h, { className: "h-4 w-4" }), "Save Changes"] })
 			})] }) : /* @__PURE__ */ x("button", {
 				type: "button",
-				onClick: () => C(!0),
+				onClick: () => T(!0),
 				className: "inline-flex items-center gap-2 rounded-md bg-accent px-4 py-2 text-sm font-medium text-text-primary hover:bg-accent/80 transition-colors",
 				children: [/* @__PURE__ */ b(m, { className: "h-4 w-4" }), "Edit Profile"]
 			})
 		}),
-		children: /* @__PURE__ */ x("div", {
+		children: [/* @__PURE__ */ b(C, {
+			className: "mb-6",
+			icon: /* @__PURE__ */ b(_, { className: "h-4 w-4" }),
+			children: "Your worker profile. Keep your contact, employment and bank details current so pay and assignments reach you correctly, manage notification preferences, and review your role, ID and credentials — all in one place."
+		}), /* @__PURE__ */ x("div", {
 			className: "grid lg:grid-cols-4 gap-6 max-w-6xl",
 			children: [/* @__PURE__ */ x("div", {
 				className: "lg:col-span-1 space-y-4",
-				children: [/* @__PURE__ */ x("div", {
-					className: "rounded-lg border border-border-seam bg-bg-surface p-5 text-center bg-gloss-card shadow-pop",
+				children: [/* @__PURE__ */ x(S, {
+					className: "p-5 text-center",
 					children: [
 						/* @__PURE__ */ x("div", {
 							className: "relative inline-block",
 							children: [/* @__PURE__ */ b("div", {
 								className: "h-20 w-20 rounded-full bg-bg-sunken overflow-hidden mx-auto",
-								children: E.profileImage ? /* @__PURE__ */ b("img", {
-									src: E.profileImage,
-									alt: `${E.firstName} ${E.lastName}`,
+								children: O.profileImage ? /* @__PURE__ */ b("img", {
+									src: O.profileImage,
+									alt: `${O.firstName} ${O.lastName}`,
 									className: "h-full w-full object-cover"
 								}) : /* @__PURE__ */ b("div", {
 									className: "flex h-full w-full items-center justify-center text-text-secondary",
@@ -170,7 +175,7 @@ var S = [
 								children: [/* @__PURE__ */ b(l, { className: "h-3.5 w-3.5" }), /* @__PURE__ */ b("input", {
 									type: "file",
 									accept: "image/*",
-									onChange: M,
+									onChange: P,
 									className: "hidden"
 								})]
 							})]
@@ -178,23 +183,23 @@ var S = [
 						/* @__PURE__ */ x("h3", {
 							className: "mt-3 text-sm font-semibold text-text-primary",
 							children: [
-								E.firstName,
+								O.firstName,
 								" ",
-								E.lastName
+								O.lastName
 							]
 						}),
 						/* @__PURE__ */ b("p", {
 							className: "text-xs text-text-secondary",
-							children: E.designation
+							children: O.designation
 						}),
 						/* @__PURE__ */ b("p", {
 							className: "text-[10px] text-text-secondary mt-0.5",
-							children: E.employeeId
+							children: O.employeeId
 						})
 					]
 				}), /* @__PURE__ */ b("div", {
 					className: "space-y-1",
-					children: S.map((e) => {
+					children: w.map((e) => {
 						let n = e.icon;
 						return /* @__PURE__ */ x("button", {
 							type: "button",
@@ -222,8 +227,8 @@ var S = [
 										children: "First Name"
 									}), /* @__PURE__ */ b("input", {
 										type: "text",
-										value: E.firstName,
-										onChange: (e) => A("firstName", e.target.value),
+										value: O.firstName,
+										onChange: (e) => M("firstName", e.target.value),
 										disabled: !p,
 										className: "w-full rounded-md border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary disabled:bg-bg-sunken disabled:cursor-not-allowed focus:outline-none focus:ring-2 focus:ring-accent-blue-subtle/40"
 									})] }),
@@ -232,8 +237,8 @@ var S = [
 										children: "Last Name"
 									}), /* @__PURE__ */ b("input", {
 										type: "text",
-										value: E.lastName,
-										onChange: (e) => A("lastName", e.target.value),
+										value: O.lastName,
+										onChange: (e) => M("lastName", e.target.value),
 										disabled: !p,
 										className: "w-full rounded-md border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary disabled:bg-bg-sunken disabled:cursor-not-allowed focus:outline-none focus:ring-2 focus:ring-accent-blue-subtle/40"
 									})] }),
@@ -242,8 +247,8 @@ var S = [
 										children: "Email Address"
 									}), /* @__PURE__ */ b("input", {
 										type: "email",
-										value: E.email,
-										onChange: (e) => A("email", e.target.value),
+										value: O.email,
+										onChange: (e) => M("email", e.target.value),
 										disabled: !p,
 										className: "w-full rounded-md border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary disabled:bg-bg-sunken disabled:cursor-not-allowed focus:outline-none focus:ring-2 focus:ring-accent-blue-subtle/40"
 									})] }),
@@ -252,8 +257,8 @@ var S = [
 										children: "Phone Number"
 									}), /* @__PURE__ */ b("input", {
 										type: "text",
-										value: E.phone,
-										onChange: (e) => A("phone", e.target.value),
+										value: O.phone,
+										onChange: (e) => M("phone", e.target.value),
 										disabled: !p,
 										className: "w-full rounded-md border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary disabled:bg-bg-sunken disabled:cursor-not-allowed focus:outline-none focus:ring-2 focus:ring-accent-blue-subtle/40"
 									})] }),
@@ -262,8 +267,8 @@ var S = [
 										children: "Date of Birth"
 									}), /* @__PURE__ */ b("input", {
 										type: "date",
-										value: E.dateOfBirth,
-										onChange: (e) => A("dateOfBirth", e.target.value),
+										value: O.dateOfBirth,
+										onChange: (e) => M("dateOfBirth", e.target.value),
 										disabled: !p,
 										className: "w-full rounded-md border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary disabled:bg-bg-sunken disabled:cursor-not-allowed focus:outline-none focus:ring-2 focus:ring-accent-blue-subtle/40"
 									})] })
@@ -282,8 +287,8 @@ var S = [
 											children: "Contact Name"
 										}), /* @__PURE__ */ b("input", {
 											type: "text",
-											value: E.emergencyContactName,
-											onChange: (e) => A("emergencyContactName", e.target.value),
+											value: O.emergencyContactName,
+											onChange: (e) => M("emergencyContactName", e.target.value),
 											disabled: !p,
 											className: "w-full rounded-md border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary disabled:bg-bg-sunken disabled:cursor-not-allowed focus:outline-none focus:ring-2 focus:ring-accent-blue-subtle/40"
 										})] }),
@@ -292,8 +297,8 @@ var S = [
 											children: "Contact Phone"
 										}), /* @__PURE__ */ b("input", {
 											type: "text",
-											value: E.emergencyContactPhone,
-											onChange: (e) => A("emergencyContactPhone", e.target.value),
+											value: O.emergencyContactPhone,
+											onChange: (e) => M("emergencyContactPhone", e.target.value),
 											disabled: !p,
 											className: "w-full rounded-md border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary disabled:bg-bg-sunken disabled:cursor-not-allowed focus:outline-none focus:ring-2 focus:ring-accent-blue-subtle/40"
 										})] }),
@@ -302,8 +307,8 @@ var S = [
 											children: "Relationship"
 										}), /* @__PURE__ */ b("input", {
 											type: "text",
-											value: E.emergencyContactRelation,
-											onChange: (e) => A("emergencyContactRelation", e.target.value),
+											value: O.emergencyContactRelation,
+											onChange: (e) => M("emergencyContactRelation", e.target.value),
 											disabled: !p,
 											className: "w-full rounded-md border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary disabled:bg-bg-sunken disabled:cursor-not-allowed focus:outline-none focus:ring-2 focus:ring-accent-blue-subtle/40"
 										})] })
@@ -324,7 +329,7 @@ var S = [
 										children: "Employee ID"
 									}), /* @__PURE__ */ b("input", {
 										type: "text",
-										value: E.employeeId,
+										value: O.employeeId,
 										disabled: !0,
 										className: "w-full rounded-md border border-border-subtle bg-bg-sunken px-3 py-2 text-sm text-text-primary cursor-not-allowed"
 									})] }),
@@ -333,7 +338,7 @@ var S = [
 										children: "Designation"
 									}), /* @__PURE__ */ b("input", {
 										type: "text",
-										value: E.designation,
+										value: O.designation,
 										disabled: !0,
 										className: "w-full rounded-md border border-border-subtle bg-bg-sunken px-3 py-2 text-sm text-text-primary cursor-not-allowed"
 									})] }),
@@ -342,7 +347,7 @@ var S = [
 										children: "Department"
 									}), /* @__PURE__ */ b("input", {
 										type: "text",
-										value: E.department,
+										value: O.department,
 										disabled: !0,
 										className: "w-full rounded-md border border-border-subtle bg-bg-sunken px-3 py-2 text-sm text-text-primary cursor-not-allowed"
 									})] }),
@@ -351,7 +356,7 @@ var S = [
 										children: "Work Location"
 									}), /* @__PURE__ */ b("input", {
 										type: "text",
-										value: E.workLocation,
+										value: O.workLocation,
 										disabled: !0,
 										className: "w-full rounded-md border border-border-subtle bg-bg-sunken px-3 py-2 text-sm text-text-primary cursor-not-allowed"
 									})] }),
@@ -360,7 +365,7 @@ var S = [
 										children: "Joining Date"
 									}), /* @__PURE__ */ b("input", {
 										type: "date",
-										value: E.joiningDate,
+										value: O.joiningDate,
 										disabled: !0,
 										className: "w-full rounded-md border border-border-subtle bg-bg-sunken px-3 py-2 text-sm text-text-primary cursor-not-allowed"
 									})] }),
@@ -369,7 +374,7 @@ var S = [
 										children: "Employment Type"
 									}), /* @__PURE__ */ b("input", {
 										type: "text",
-										value: E.employmentType,
+										value: O.employmentType,
 										disabled: !0,
 										className: "w-full rounded-md border border-border-subtle bg-bg-sunken px-3 py-2 text-sm text-text-primary cursor-not-allowed"
 									})] })
@@ -429,8 +434,8 @@ var S = [
 											children: "Address Line"
 										}), /* @__PURE__ */ b("textarea", {
 											rows: 2,
-											value: E.currentAddress,
-											onChange: (e) => A("currentAddress", e.target.value),
+											value: O.currentAddress,
+											onChange: (e) => M("currentAddress", e.target.value),
 											disabled: !p,
 											className: "w-full rounded-md border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary disabled:bg-bg-sunken disabled:cursor-not-allowed focus:outline-none focus:ring-2 focus:ring-accent-blue-subtle/40 resize-none"
 										})]
@@ -440,8 +445,8 @@ var S = [
 										children: "City"
 									}), /* @__PURE__ */ b("input", {
 										type: "text",
-										value: E.city,
-										onChange: (e) => A("city", e.target.value),
+										value: O.city,
+										onChange: (e) => M("city", e.target.value),
 										disabled: !p,
 										className: "w-full rounded-md border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary disabled:bg-bg-sunken disabled:cursor-not-allowed focus:outline-none focus:ring-2 focus:ring-accent-blue-subtle/40"
 									})] }),
@@ -450,8 +455,8 @@ var S = [
 										children: "State"
 									}), /* @__PURE__ */ b("input", {
 										type: "text",
-										value: E.state,
-										onChange: (e) => A("state", e.target.value),
+										value: O.state,
+										onChange: (e) => M("state", e.target.value),
 										disabled: !p,
 										className: "w-full rounded-md border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary disabled:bg-bg-sunken disabled:cursor-not-allowed focus:outline-none focus:ring-2 focus:ring-accent-blue-subtle/40"
 									})] }),
@@ -460,8 +465,8 @@ var S = [
 										children: "Pincode"
 									}), /* @__PURE__ */ b("input", {
 										type: "text",
-										value: E.pincode,
-										onChange: (e) => A("pincode", e.target.value),
+										value: O.pincode,
+										onChange: (e) => M("pincode", e.target.value),
 										disabled: !p,
 										className: "w-full rounded-md border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary disabled:bg-bg-sunken disabled:cursor-not-allowed focus:outline-none focus:ring-2 focus:ring-accent-blue-subtle/40"
 									})] })
@@ -475,8 +480,8 @@ var S = [
 									className: "flex items-center gap-2 mb-3 cursor-pointer",
 									children: [/* @__PURE__ */ b("input", {
 										type: "checkbox",
-										checked: E.sameAsCurrent,
-										onChange: (e) => A("sameAsCurrent", e.target.checked),
+										checked: O.sameAsCurrent,
+										onChange: (e) => M("sameAsCurrent", e.target.checked),
 										disabled: !p,
 										className: "h-4 w-4 rounded border-border-subtle text-accent-blue focus:ring-accent-blue-subtle/40"
 									}), /* @__PURE__ */ b("span", {
@@ -484,13 +489,13 @@ var S = [
 										children: "Same as current address"
 									})]
 								}),
-								!E.sameAsCurrent && /* @__PURE__ */ x("div", { children: [/* @__PURE__ */ b("label", {
+								!O.sameAsCurrent && /* @__PURE__ */ x("div", { children: [/* @__PURE__ */ b("label", {
 									className: "block text-xs font-medium text-text-secondary mb-1",
 									children: "Address Line"
 								}), /* @__PURE__ */ b("textarea", {
 									rows: 2,
-									value: E.permanentAddress,
-									onChange: (e) => A("permanentAddress", e.target.value),
+									value: O.permanentAddress,
+									onChange: (e) => M("permanentAddress", e.target.value),
 									disabled: !p,
 									className: "w-full rounded-md border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary disabled:bg-bg-sunken disabled:cursor-not-allowed focus:outline-none focus:ring-2 focus:ring-accent-blue-subtle/40 resize-none"
 								})] })
@@ -516,7 +521,7 @@ var S = [
 										children: "PAN Number"
 									}), /* @__PURE__ */ b("input", {
 										type: "text",
-										value: E.panNumber,
+										value: O.panNumber,
 										disabled: !0,
 										className: "w-full rounded-md border border-border-subtle bg-bg-sunken px-3 py-2 text-sm text-text-primary cursor-not-allowed"
 									})] }),
@@ -525,7 +530,7 @@ var S = [
 										children: "Aadhar Number"
 									}), /* @__PURE__ */ b("input", {
 										type: "text",
-										value: E.aadharNumber,
+										value: O.aadharNumber,
 										disabled: !0,
 										className: "w-full rounded-md border border-border-subtle bg-bg-sunken px-3 py-2 text-sm text-text-primary cursor-not-allowed"
 									})] }),
@@ -534,8 +539,8 @@ var S = [
 										children: "Bank Name"
 									}), /* @__PURE__ */ b("input", {
 										type: "text",
-										value: E.bankName,
-										onChange: (e) => A("bankName", e.target.value),
+										value: O.bankName,
+										onChange: (e) => M("bankName", e.target.value),
 										disabled: !p,
 										className: "w-full rounded-md border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary disabled:bg-bg-sunken disabled:cursor-not-allowed focus:outline-none focus:ring-2 focus:ring-accent-blue-subtle/40"
 									})] }),
@@ -544,7 +549,7 @@ var S = [
 										children: "Account Number"
 									}), /* @__PURE__ */ b("input", {
 										type: "text",
-										value: E.accountNumber,
+										value: O.accountNumber,
 										disabled: !0,
 										className: "w-full rounded-md border border-border-subtle bg-bg-sunken px-3 py-2 text-sm text-text-primary cursor-not-allowed"
 									})] }),
@@ -553,8 +558,8 @@ var S = [
 										children: "IFSC Code"
 									}), /* @__PURE__ */ b("input", {
 										type: "text",
-										value: E.ifscCode,
-										onChange: (e) => A("ifscCode", e.target.value),
+										value: O.ifscCode,
+										onChange: (e) => M("ifscCode", e.target.value),
 										disabled: !p,
 										className: "w-full rounded-md border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary disabled:bg-bg-sunken disabled:cursor-not-allowed focus:outline-none focus:ring-2 focus:ring-accent-blue-subtle/40"
 									})] })
@@ -658,7 +663,7 @@ var S = [
 							children: "Notification Preferences"
 						}), /* @__PURE__ */ b("div", {
 							className: "space-y-4",
-							children: O.map((e) => /* @__PURE__ */ x("div", {
+							children: A.map((e) => /* @__PURE__ */ x("div", {
 								className: "flex items-center justify-between p-4 rounded-lg bg-bg-sunken/50",
 								children: [/* @__PURE__ */ x("div", { children: [/* @__PURE__ */ b("h4", {
 									className: "text-sm font-medium text-text-primary",
@@ -668,7 +673,7 @@ var S = [
 									children: e.description
 								})] }), /* @__PURE__ */ b("button", {
 									type: "button",
-									onClick: () => N(e.id),
+									onClick: () => F(e.id),
 									disabled: !p,
 									className: t("relative inline-flex h-6 w-11 items-center rounded-full transition-colors", e.enabled ? "bg-accent-blue-subtle" : "bg-muted-foreground/30", !p && "opacity-60 cursor-not-allowed"),
 									children: /* @__PURE__ */ b("span", { className: t("inline-block h-4 w-4 rounded-full bg-white transition-transform", e.enabled ? "translate-x-6" : "translate-x-1") })
@@ -678,10 +683,10 @@ var S = [
 					]
 				})
 			})]
-		})
+		})]
 	});
 };
 //#endregion
-export { C as WorkerProfilePage };
+export { T as WorkerProfilePage };
 
 //# sourceMappingURL=WorkerProfilePage.js.map