@burdenoff/microfe-crewfoundry 2026.704.6 → 2026.707.1

package/dist/crewfoundry/pages/HiringInterviewsPagePage.js

@@ -1,14 +1,17 @@
 import { useCrewFoundryStore as e } from "../store/crewfoundryStore.js";
 import { formatEnumLabel as t } from "../utils/formatEnumLabel.js";
-import { FormModal as n } from "../components/forms/FormModal.js";
-import { getText as r, newClientId as i } from "../components/forms/formValues.js";
-import { useMemo as a, useState as o } from "react";
-import { Calendar as s, Clock as c, Plus as l, Star as u, Video as d } from "lucide-react";
-import { jsx as f, jsxs as p } from "react/jsx-runtime";
-import { Badge as m, Button as h, Card as g, CardContent as _, CardDescription as v, CardHeader as y, CardTitle as b, GlassCard as x, GradientText as S, PagePurpose as C } from "@burdenoff/fe-libs/ui";
-import { useGlobalUi as w } from "@burdenoff/fe-libs/shared/providers/shell";
+import { getInitials as n } from "../components/viz/lib/format.js";
+import { RatingStars as r } from "../components/viz/RatingStars.js";
+import "../components/viz/index.js";
+import { FormModal as i } from "../components/forms/FormModal.js";
+import { getText as a, newClientId as o } from "../components/forms/formValues.js";
+import { useMemo as s, useState as c } from "react";
+import { Calendar as l, Clock as u, Plus as d, Star as f, Video as p } from "lucide-react";
+import { Fragment as m, jsx as h, jsxs as g } from "react/jsx-runtime";
+import { Badge as _, Button as v, Card as y, CardContent as b, CardHeader as x, CardTitle as S, GlassCard as C, GradientText as w, IllustratedEmptyState as T, PagePurpose as E, Textarea as D } from "@burdenoff/fe-libs/ui";
+import { useGlobalUi as O } from "@burdenoff/fe-libs/shared/providers/shell";
 //#region src/crewfoundry/pages/HiringInterviewsPagePage.tsx
-var T = [
+var k = [
 	{
 		label: "Phone",
 		value: "phone"
@@ -29,60 +32,129 @@ var T = [
 		label: "Technical",
 		value: "technical"
 	}
-], E = [
+], A = [
 	{
-		name: "status",
-		label: "Status",
-		type: "select",
-		options: [
-			{
-				label: "Scheduled",
-				value: "scheduled"
-			},
-			{
-				label: "Completed",
-				value: "completed"
-			},
-			{
-				label: "Cancelled",
-				value: "cancelled"
-			},
-			{
-				label: "No show",
-				value: "no_show"
-			}
-		],
-		required: !0
+		key: "technical",
+		label: "Technical Skills"
 	},
 	{
-		name: "rating",
-		label: "Rating (out of 5)",
-		type: "number"
+		key: "problem",
+		label: "Problem Solving"
 	},
 	{
-		name: "feedback",
-		label: "Feedback",
-		type: "textarea",
-		colSpan: 2
+		key: "communication",
+		label: "Communication"
+	},
+	{
+		key: "culture",
+		label: "Culture Fit"
 	}
-];
-function D() {
-	let { showToast: D } = w(), { interviews: O, candidates: k, addInterview: A, updateInterview: j } = e(), [M, N] = o(!1), [P, F] = o(null), I = O.filter((e) => e.status === "scheduled"), L = O.filter((e) => e.status === "completed"), R = a(() => {
+], j = "@@scorecard";
+function M(e) {
+	if (!e) return {
+		scores: {},
+		notes: ""
+	};
+	if (!e.startsWith(`${j}:`)) return {
+		scores: {},
+		notes: e
+	};
+	let t = e.indexOf("\n"), n = t === -1 ? e : e.slice(0, t), r = t === -1 ? "" : e.slice(t + 1), i = {}, a = n.slice(12);
+	for (let e of a.split(",")) {
+		let [t, n] = e.split("="), r = Number(n);
+		t && !Number.isNaN(r) && (i[t] = r);
+	}
+	return {
+		scores: i,
+		notes: r
+	};
+}
+function N(e, t) {
+	let n = A.filter((t) => (e[t.key] ?? 0) > 0).map((t) => `${t.key}=${e[t.key]}`);
+	return n.length === 0 ? t : `${j}:${n.join(",")}\n${t}`;
+}
+function P(e) {
+	let t = A.map((t) => e[t.key]).filter((e) => typeof e == "number" && e > 0);
+	return t.length === 0 ? 0 : Math.round(t.reduce((e, t) => e + t, 0) / t.length * 10) / 10;
+}
+function F({ name: e, size: t = 40 }) {
+	return /* @__PURE__ */ h("span", {
+		className: "inline-flex shrink-0 items-center justify-center overflow-hidden rounded-full border border-border-subtle bg-bg-sunken font-medium text-text-secondary",
+		style: {
+			width: t,
+			height: t,
+			fontSize: Math.round(t * .36)
+		},
+		"aria-hidden": "true",
+		children: n(e)
+	});
+}
+function I({ value: e, onChange: t, label: n, max: r = 5 }) {
+	return /* @__PURE__ */ h("div", {
+		className: "flex items-center gap-0.5",
+		role: "radiogroup",
+		"aria-label": n,
+		children: Array.from({ length: r }, (e, t) => t + 1).map((n) => /* @__PURE__ */ h("button", {
+			type: "button",
+			role: "radio",
+			"aria-checked": e === n,
+			"aria-label": `${n} out of ${r}`,
+			onClick: () => t(e === n ? 0 : n),
+			className: "rounded p-0.5 outline-none transition-transform hover:scale-110 focus-visible:ring-2 focus-visible:ring-[var(--color-focus-ring)]",
+			children: /* @__PURE__ */ h(f, {
+				className: "h-5 w-5",
+				strokeWidth: 1.5,
+				style: { color: n <= e ? "var(--color-status-warning-text)" : "var(--color-border-strong)" },
+				fill: n <= e ? "currentColor" : "none"
+			})
+		}, n))
+	});
+}
+var L = {
+	technical: "default",
+	panel: "secondary",
+	onsite: "secondary",
+	video: "outline",
+	phone: "outline"
+};
+function R(e) {
+	let t = new Date(e);
+	return Number.isNaN(t.getTime()) ? e || "Unscheduled" : t.toLocaleDateString(void 0, {
+		weekday: "short",
+		month: "short",
+		day: "numeric"
+	});
+}
+function z() {
+	let { showToast: n } = O(), { interviews: f, candidates: m, addInterview: D, updateInterview: A } = e(), [j, N] = c(!1), [I, z] = c(null), [V, H] = c(!1), U = f.filter((e) => e.status === "scheduled"), W = f.filter((e) => e.status === "completed"), G = s(() => {
+		let e = [...f].sort((e, t) => {
+			let n = new Date(e.date).getTime(), r = new Date(t.date).getTime();
+			return Number.isNaN(n) && Number.isNaN(r) ? 0 : Number.isNaN(n) ? 1 : Number.isNaN(r) ? -1 : n - r;
+		}), t = [];
+		for (let n of e) {
+			let e = R(n.date), r = t[t.length - 1];
+			r && r.label === e ? r.items.push(n) : t.push({
+				label: e,
+				items: [n]
+			});
+		}
+		return t;
+	}, [f]), K = I ?? U[0]?.id ?? f[0]?.id ?? null, q = K ? f.find((e) => e.id === K) ?? null : null, J = s(() => {
 		let e = /* @__PURE__ */ new Date(), t = new Date(e);
 		t.setDate(e.getDate() - (e.getDay() + 6) % 7), t.setHours(0, 0, 0, 0);
 		let n = new Date(t);
-		return n.setDate(t.getDate() + 7), O.filter((e) => {
+		return n.setDate(t.getDate() + 7), f.filter((e) => {
 			let r = new Date(e.date);
 			return !Number.isNaN(r.getTime()) && r >= t && r < n;
 		}).length;
-	}, [O]), z = a(() => [
+	}, [f]), Y = s(() => [
 		{
 			name: "candidateId",
 			label: "Candidate",
 			type: "select",
 			required: !0,
-			placeholder: k.length ? "Select a candidate…" : "No candidates available",
-			options: k.map((e) => ({
+			placeholder: m.length ? "Select a candidate…" : "No candidates available",
+			options: m.map((e) => ({
 				label: `${e.firstName} ${e.lastName} — ${e.position}`,
 				value: e.id
 			}))
@@ -111,221 +183,322 @@ function D() {
 			label: "Type",
 			type: "select",
 			required: !0,
-			options: T
+			options: k
 		}
-	], [k]);
-	return /* @__PURE__ */ p("div", {
+	], [m]);
+	return /* @__PURE__ */ g("div", {
 		className: "space-y-6 p-6",
 		children: [
-			/* @__PURE__ */ p("div", {
-				className: "flex items-center justify-between",
-				children: [/* @__PURE__ */ p("div", { children: [
-					/* @__PURE__ */ f("h1", {
+			/* @__PURE__ */ g("div", {
+				className: "flex flex-wrap items-start justify-between gap-3",
+				children: [/* @__PURE__ */ g("div", { children: [
+					/* @__PURE__ */ h("h1", {
 						className: "text-2xl font-semibold",
-						children: /* @__PURE__ */ f(S, { children: "Interviews" })
+						children: /* @__PURE__ */ h(w, { children: "Interviews" })
 					}),
-					/* @__PURE__ */ p("p", {
+					/* @__PURE__ */ g("p", {
 						className: "text-sm text-text-secondary",
 						children: [
-							I.length,
+							U.length,
 							" upcoming · ",
-							L.length,
+							W.length,
 							" completed"
 						]
 					}),
-					/* @__PURE__ */ f(C, {
+					/* @__PURE__ */ h(E, {
 						className: "mt-1",
-						children: "Schedule and track interviews across your hiring pipeline — keep everyone aligned on who's meeting which candidate and when."
+						children: "Schedule interviews and score candidates on a live scorecard — capture competency ratings and feedback the moment the conversation ends."
 					})
-				] }), /* @__PURE__ */ p(h, {
+				] }), /* @__PURE__ */ g(v, {
 					size: "sm",
 					onClick: () => N(!0),
-					children: [/* @__PURE__ */ f(l, { className: "h-4 w-4 mr-1" }), "Schedule Interview"]
+					children: [/* @__PURE__ */ h(d, { className: "mr-1 h-4 w-4" }), "Schedule Interview"]
 				})]
 			}),
-			/* @__PURE__ */ p("div", {
-				className: "grid gap-4 md:grid-cols-3",
+			/* @__PURE__ */ g("div", {
+				className: "grid gap-4 sm:grid-cols-3",
 				children: [
-					/* @__PURE__ */ p(x, {
+					/* @__PURE__ */ g(C, {
 						treatment: "glass",
 						glow: !0,
 						className: "border-border-seam",
-						children: [/* @__PURE__ */ p(y, {
+						children: [/* @__PURE__ */ g(x, {
 							className: "flex flex-row items-center justify-between space-y-0 pb-2",
-							children: [/* @__PURE__ */ f(b, {
+							children: [/* @__PURE__ */ h(S, {
 								className: "text-sm font-medium",
 								children: "Scheduled"
-							}), /* @__PURE__ */ f(s, { className: "h-4 w-4 text-status-info-text" })]
-						}), /* @__PURE__ */ f(_, { children: /* @__PURE__ */ f("div", {
+							}), /* @__PURE__ */ h(l, { className: "h-4 w-4 text-status-info-text" })]
+						}), /* @__PURE__ */ h(b, { children: /* @__PURE__ */ h("div", {
 							className: "text-2xl font-bold tabular-nums",
-							children: I.length
+							children: U.length
 						}) })]
 					}),
-					/* @__PURE__ */ p(x, {
+					/* @__PURE__ */ g(C, {
 						treatment: "metric",
 						className: "border-border-seam",
-						children: [/* @__PURE__ */ p(y, {
+						children: [/* @__PURE__ */ g(x, {
 							className: "flex flex-row items-center justify-between space-y-0 pb-2",
-							children: [/* @__PURE__ */ f(b, {
+							children: [/* @__PURE__ */ h(S, {
 								className: "text-sm font-medium",
 								children: "Completed"
-							}), /* @__PURE__ */ f(c, { className: "h-4 w-4 text-status-success-text" })]
-						}), /* @__PURE__ */ f(_, { children: /* @__PURE__ */ f("div", {
+							}), /* @__PURE__ */ h(u, { className: "h-4 w-4 text-status-success-text" })]
+						}), /* @__PURE__ */ h(b, { children: /* @__PURE__ */ h("div", {
 							className: "text-2xl font-bold tabular-nums",
-							children: L.length
+							children: W.length
 						}) })]
 					}),
-					/* @__PURE__ */ p(x, {
+					/* @__PURE__ */ g(C, {
 						treatment: "metric",
 						className: "border-border-seam",
-						children: [/* @__PURE__ */ p(y, {
+						children: [/* @__PURE__ */ g(x, {
 							className: "flex flex-row items-center justify-between space-y-0 pb-2",
-							children: [/* @__PURE__ */ f(b, {
+							children: [/* @__PURE__ */ h(S, {
 								className: "text-sm font-medium",
 								children: "This Week"
-							}), /* @__PURE__ */ f(d, { className: "h-4 w-4 text-text-secondary" })]
-						}), /* @__PURE__ */ f(_, { children: /* @__PURE__ */ f("div", {
+							}), /* @__PURE__ */ h(p, { className: "h-4 w-4 text-text-secondary" })]
+						}), /* @__PURE__ */ h(b, { children: /* @__PURE__ */ h("div", {
 							className: "text-2xl font-bold tabular-nums",
-							children: R
+							children: J
 						}) })]
 					})
 				]
 			}),
-			/* @__PURE__ */ p(g, { children: [/* @__PURE__ */ p(y, { children: [/* @__PURE__ */ f(b, { children: "Upcoming Interviews" }), /* @__PURE__ */ f(v, { children: "Scheduled interviews for the coming days" })] }), /* @__PURE__ */ f(_, {
-				className: "space-y-3",
-				children: I.map((e) => /* @__PURE__ */ p("div", {
-					className: "flex flex-wrap items-center justify-between gap-3 rounded border p-4",
-					children: [/* @__PURE__ */ p("div", { children: [
-						/* @__PURE__ */ f("p", {
-							className: "text-sm font-medium",
-							children: e.candidateName
-						}),
-						/* @__PURE__ */ f("p", {
-							className: "text-xs text-text-secondary",
-							children: e.position
-						}),
-						/* @__PURE__ */ p("p", {
-							className: "text-xs text-text-secondary mt-1",
-							children: ["Interviewer: ", e.interviewerName]
-						})
-					] }), /* @__PURE__ */ p("div", {
-						className: "flex items-center gap-3",
+			/* @__PURE__ */ g("div", {
+				className: "grid gap-6 lg:grid-cols-3",
+				children: [/* @__PURE__ */ g(y, {
+					className: "lg:col-span-2",
+					children: [/* @__PURE__ */ h(x, { children: /* @__PURE__ */ h(S, { children: "Scheduled Interviews" }) }), /* @__PURE__ */ h(b, {
+						className: "space-y-4",
+						children: f.length === 0 ? /* @__PURE__ */ h(T, {
+							illustration: "empty-search",
+							title: "No interviews scheduled",
+							description: "Schedule an interview to start tracking your pipeline conversations."
+						}) : G.map((e) => /* @__PURE__ */ g("div", {
+							className: "space-y-2",
+							children: [/* @__PURE__ */ h("div", {
+								className: "sticky top-0 rounded bg-bg-sunken px-3 py-1 text-xs font-medium text-text-secondary",
+								children: e.label
+							}), e.items.map((e) => {
+								let n = e.id === K, i = P(M(e.feedback).scores) || e.rating || 0;
+								return /* @__PURE__ */ g("button", {
+									type: "button",
+									onClick: () => z(e.id),
+									"aria-pressed": n,
+									className: `flex w-full flex-wrap items-center justify-between gap-3 rounded-[var(--radius-input)] border p-4 text-left transition-colors ${n ? "border-action-primary-bg bg-action-primary-bg/10" : "border-border-subtle hover:bg-bg-sunken"}`,
+									children: [/* @__PURE__ */ g("div", {
+										className: "flex min-w-0 items-center gap-3",
+										children: [/* @__PURE__ */ h(F, { name: e.candidateName }), /* @__PURE__ */ g("div", {
+											className: "min-w-0",
+											children: [
+												/* @__PURE__ */ h("p", {
+													className: "truncate text-sm font-medium text-text-primary",
+													children: e.candidateName
+												}),
+												/* @__PURE__ */ h("p", {
+													className: "truncate text-xs text-text-secondary",
+													children: e.position
+												}),
+												/* @__PURE__ */ g("p", {
+													className: "truncate text-xs text-text-secondary",
+													children: ["Interviewer: ", e.interviewerName]
+												})
+											]
+										})]
+									}), /* @__PURE__ */ g("div", {
+										className: "flex flex-wrap items-center gap-2",
+										children: [
+											/* @__PURE__ */ g("div", {
+												className: "text-right",
+												children: [/* @__PURE__ */ h(_, {
+													variant: L[e.type],
+													className: "text-[10px]",
+													children: t(e.type)
+												}), /* @__PURE__ */ h("p", {
+													className: "mt-1 text-xs text-text-secondary",
+													children: e.time
+												})]
+											}),
+											e.status === "completed" && i > 0 && /* @__PURE__ */ h(r, {
+												value: i,
+												size: 12
+											}),
+											/* @__PURE__ */ h(_, {
+												variant: e.status === "completed" ? "default" : "secondary",
+												className: "text-[10px]",
+												children: t(e.status)
+											})
+										]
+									})]
+								}, e.id);
+							})]
+						}, e.label))
+					})]
+				}), /* @__PURE__ */ h("div", {
+					className: "lg:sticky lg:top-4 lg:self-start",
+					children: /* @__PURE__ */ g(y, { children: [/* @__PURE__ */ g(x, { children: [/* @__PURE__ */ h(S, { children: "Interview Scorecard" }), q && /* @__PURE__ */ g("p", {
+						className: "text-sm text-text-secondary",
 						children: [
-							/* @__PURE__ */ p("div", {
-								className: "text-right",
-								children: [/* @__PURE__ */ f("p", {
-									className: "text-sm font-medium",
-									children: e.date
-								}), /* @__PURE__ */ f("p", {
-									className: "text-xs text-text-secondary",
-									children: e.time
-								})]
-							}),
-							/* @__PURE__ */ f(m, {
-								variant: "outline",
-								children: t(e.type)
-							}),
-							/* @__PURE__ */ f(m, {
-								variant: "secondary",
-								children: t(e.status)
-							}),
-							/* @__PURE__ */ f(h, {
-								variant: "outline",
-								size: "sm",
-								onClick: () => F(e),
-								children: "Record outcome"
-							})
+							t(q.type),
+							" interview for ",
+							q.candidateName
 						]
-					})]
-				}, e.id))
-			})] }),
-			L.length > 0 && /* @__PURE__ */ p(g, { children: [/* @__PURE__ */ p(y, { children: [/* @__PURE__ */ f(b, { children: "Completed Interviews" }), /* @__PURE__ */ f(v, { children: "Recent interview feedback" })] }), /* @__PURE__ */ f(_, {
-				className: "space-y-3",
-				children: L.map((e) => /* @__PURE__ */ p("div", {
-					className: "flex flex-wrap items-center justify-between gap-3 rounded border p-4",
-					children: [/* @__PURE__ */ p("div", { children: [
-						/* @__PURE__ */ f("p", {
-							className: "text-sm font-medium",
-							children: e.candidateName
-						}),
-						/* @__PURE__ */ f("p", {
-							className: "text-xs text-text-secondary",
-							children: e.position
-						}),
-						e.feedback && /* @__PURE__ */ p("p", {
-							className: "text-xs text-text-secondary mt-1 italic",
-							children: [
-								"\"",
-								e.feedback,
-								"\""
-							]
+					})] }), /* @__PURE__ */ h(b, {
+						className: "space-y-4",
+						children: q ? /* @__PURE__ */ h(B, {
+							interview: q,
+							saving: V,
+							onSave: async (e, t) => {
+								if (q) {
+									H(!0);
+									try {
+										await A(q.id, {
+											status: e ? "completed" : q.status,
+											feedback: t
+										}), n(e ? "Scorecard submitted" : "Draft saved", "success");
+									} catch {
+										n("Could not save the scorecard", "error");
+									} finally {
+										H(!1);
+									}
+								}
+							}
+						}, q.id) : /* @__PURE__ */ h("p", {
+							className: "text-sm text-text-muted",
+							children: "Select an interview to open its scorecard."
 						})
-					] }), /* @__PURE__ */ p("div", {
-						className: "flex items-center gap-3",
-						children: [e.rating && /* @__PURE__ */ p("div", {
-							className: "flex items-center gap-1",
-							children: [/* @__PURE__ */ f(u, { className: "h-4 w-4 text-status-warning-text" }), /* @__PURE__ */ p("span", {
-								className: "text-sm font-medium",
-								children: [e.rating, "/5"]
-							})]
-						}), /* @__PURE__ */ f(m, {
-							variant: "default",
-							children: "completed"
-						})]
-					})]
-				}, e.id))
-			})] }),
-			/* @__PURE__ */ f(n, {
-				open: M,
+					})] })
+				})]
+			}),
+			/* @__PURE__ */ h(i, {
+				open: j,
 				onOpenChange: N,
 				title: "Schedule Interview",
 				description: "Set up a conversation with a candidate in your pipeline.",
-				fields: z,
+				fields: Y,
 				submitLabel: "Schedule",
 				onSubmit: async (e) => {
-					let t = k.find((t) => t.id === r(e, "candidateId"));
+					let t = m.find((t) => t.id === a(e, "candidateId"));
 					if (!t) throw Error("Please select a candidate");
-					await A({
-						id: i(),
+					await D({
+						id: o(),
 						candidateId: t.id,
 						candidateName: `${t.firstName} ${t.lastName}`,
 						position: t.position,
-						interviewerName: r(e, "interviewerName"),
-						date: r(e, "date"),
-						time: r(e, "time"),
+						interviewerName: a(e, "interviewerName"),
+						date: a(e, "date"),
+						time: a(e, "time"),
 						type: e.type,
 						status: "scheduled"
-					}), D("Interview scheduled", "success");
-				}
-			}),
-			/* @__PURE__ */ f(n, {
-				open: P !== null,
-				onOpenChange: (e) => {
-					e || F(null);
-				},
-				title: "Record Interview Outcome",
-				description: P ? `${P.candidateName} — ${P.position}` : void 0,
-				fields: E,
-				initialValues: P ? {
-					status: P.status,
-					rating: P.rating ?? "",
-					feedback: P.feedback ?? ""
-				} : void 0,
-				submitLabel: "Save outcome",
-				onSubmit: async (e) => {
-					if (!P) return;
-					let t = e.rating, n = typeof t == "number" || typeof t == "string" && t.trim() !== "";
-					await j(P.id, {
-						status: e.status,
-						feedback: r(e, "feedback"),
-						...n ? { rating: Number(t) } : {}
-					}), D("Interview updated", "success");
+					}), n("Interview scheduled", "success");
 				}
 			})
 		]
 	});
 }
+function B({ interview: e, saving: t, onSave: n }) {
+	let i = M(e.feedback), [a, o] = c(i.scores), [s, l] = c(i.notes), u = P(a);
+	return /* @__PURE__ */ g(m, { children: [
+		/* @__PURE__ */ g("div", {
+			className: "grid grid-cols-2 gap-3 rounded-[var(--radius-input)] bg-bg-sunken p-3 text-xs",
+			children: [/* @__PURE__ */ g("div", { children: [
+				/* @__PURE__ */ h("p", {
+					className: "text-text-muted",
+					children: "Candidate"
+				}),
+				/* @__PURE__ */ h("p", {
+					className: "font-medium text-text-primary",
+					children: e.candidateName
+				}),
+				/* @__PURE__ */ h("p", {
+					className: "mt-1 text-text-muted",
+					children: "Position"
+				}),
+				/* @__PURE__ */ h("p", {
+					className: "font-medium text-text-primary",
+					children: e.position
+				})
+			] }), /* @__PURE__ */ g("div", { children: [
+				/* @__PURE__ */ h("p", {
+					className: "text-text-muted",
+					children: "Date"
+				}),
+				/* @__PURE__ */ h("p", {
+					className: "font-medium text-text-primary",
+					children: e.date
+				}),
+				/* @__PURE__ */ h("p", {
+					className: "mt-1 text-text-muted",
+					children: "Time"
+				}),
+				/* @__PURE__ */ h("p", {
+					className: "font-medium text-text-primary",
+					children: e.time
+				})
+			] })]
+		}),
+		/* @__PURE__ */ h("div", {
+			className: "space-y-3",
+			children: A.map((e) => /* @__PURE__ */ g("div", {
+				className: "flex items-center justify-between gap-2",
+				children: [/* @__PURE__ */ h("span", {
+					className: "text-sm font-medium text-text-primary",
+					children: e.label
+				}), /* @__PURE__ */ h(I, {
+					label: e.label,
+					value: a[e.key] ?? 0,
+					onChange: (t) => o((n) => ({
+						...n,
+						[e.key]: t
+					}))
+				})]
+			}, e.key))
+		}),
+		/* @__PURE__ */ g("div", {
+			className: "flex items-center justify-between border-t border-border-subtle pt-3 text-sm",
+			children: [/* @__PURE__ */ h("span", {
+				className: "font-medium text-text-primary",
+				children: "Overall"
+			}), u > 0 ? /* @__PURE__ */ h(r, {
+				value: u,
+				size: 16,
+				showValue: !0
+			}) : /* @__PURE__ */ h("span", {
+				className: "text-xs text-text-muted",
+				children: "Not scored"
+			})]
+		}),
+		/* @__PURE__ */ g("div", {
+			className: "space-y-1.5",
+			children: [/* @__PURE__ */ h("label", {
+				htmlFor: "scorecard-feedback",
+				className: "text-sm font-medium",
+				children: "Feedback"
+			}), /* @__PURE__ */ h(D, {
+				id: "scorecard-feedback",
+				rows: 5,
+				value: s,
+				onChange: (e) => l(e.target.value),
+				placeholder: "Summarize strengths, concerns, and a recommendation…"
+			})]
+		}),
+		/* @__PURE__ */ g("div", {
+			className: "flex gap-2",
+			children: [/* @__PURE__ */ h(v, {
+				className: "flex-1",
+				disabled: t,
+				onClick: () => n(!0, N(a, s)),
+				children: "Submit"
+			}), /* @__PURE__ */ h(v, {
+				variant: "outline",
+				className: "flex-1",
+				disabled: t,
+				onClick: () => n(!1, N(a, s)),
+				children: "Save Draft"
+			})]
+		})
+	] });
+}
 //#endregion
-export { D as HiringInterviewsPagePage };
+export { z as HiringInterviewsPagePage };
 
 //# sourceMappingURL=HiringInterviewsPagePage.js.map