@burdenoff/microfe-crewfoundry 2026.625.1 → 2026.625.2

package/dist/crewfoundry/pages/CommunicationsCallsPagePage.js

@@ -2,39 +2,46 @@ import { useCrewFoundryStore as e } from "../store/crewfoundryStore.js";
 import { useMemo as t } from "react";
 import { Clock as n, Phone as r, PhoneIncoming as i, PhoneMissed as a, PhoneOutgoing as o } from "lucide-react";
 import { jsx as s, jsxs as c } from "react/jsx-runtime";
-import { Badge as l, Button as u, Card as d, CardContent as f, CardHeader as p, CardTitle as m, GlassCard as h, GradientText as g } from "@burdenoff/fe-libs/ui";
+import { Badge as l, Button as u, Card as d, CardContent as f, CardHeader as p, CardTitle as m, GlassCard as h, GradientText as g, PagePurpose as _ } from "@burdenoff/fe-libs/ui";
 //#region src/crewfoundry/pages/CommunicationsCallsPagePage.tsx
-var _ = (e) => {
+var v = (e) => {
 	let t = Math.max(e, 0), n = Math.floor(t / 60), r = t % 60;
 	return n > 0 ? `${String(n).padStart(2, "0")}:${String(r).padStart(2, "0")}` : `00:${String(r).padStart(2, "0")}`;
-}, v = ({ type: e }) => e === "incoming" ? /* @__PURE__ */ s(i, { className: "h-4 w-4 text-status-success-text" }) : e === "outgoing" ? /* @__PURE__ */ s(o, { className: "h-4 w-4 text-status-info-text" }) : /* @__PURE__ */ s(a, { className: "h-4 w-4 text-status-error-text" });
-function y() {
-	let { employees: i, teams: o } = e(), y = t(() => i.slice(0, 10).map((e, t) => {
+}, y = ({ type: e }) => e === "incoming" ? /* @__PURE__ */ s(i, { className: "h-4 w-4 text-status-success-text" }) : e === "outgoing" ? /* @__PURE__ */ s(o, { className: "h-4 w-4 text-status-info-text" }) : /* @__PURE__ */ s(a, { className: "h-4 w-4 text-status-error-text" });
+function b() {
+	let { employees: i, teams: o } = e(), b = t(() => i.slice(0, 10).map((e, t) => {
 		let n = t % 5 == 0 ? "missed" : t % 2 == 0 ? "outgoing" : "incoming", r = o[t % Math.max(o.length, 1)], i = Math.round((e.performanceScore + t) * 3);
 		return {
 			id: `call-${e.id}`,
 			name: `${e.firstName} ${e.lastName}`.trim(),
 			type: n,
-			duration: n === "missed" ? "-" : _(i),
+			duration: n === "missed" ? "-" : v(i),
 			time: new Date(e.startDate).toLocaleDateString(),
 			topic: r ? `${r.name} check-in` : `${e.department} operations update`
 		};
-	}), [i, o]), b = y.filter((e) => e.duration !== "-"), x = b.length ? Math.round(b.map((e) => {
+	}), [i, o]), x = b.filter((e) => e.duration !== "-"), S = x.length ? Math.round(x.map((e) => {
 		let [t, n] = e.duration.split(":").map(Number);
 		return t * 60 + n;
-	}).reduce((e, t) => e + t, 0) / b.length) : 0;
+	}).reduce((e, t) => e + t, 0) / x.length) : 0;
 	return /* @__PURE__ */ c("div", {
 		className: "space-y-6 p-6",
 		children: [
 			/* @__PURE__ */ c("div", {
 				className: "flex items-center justify-between",
-				children: [/* @__PURE__ */ c("div", { children: [/* @__PURE__ */ s("h1", {
-					className: "text-2xl font-semibold",
-					children: /* @__PURE__ */ s(g, { children: "Calls" })
-				}), /* @__PURE__ */ s("p", {
-					className: "text-sm text-text-secondary",
-					children: "Voice call history and quick dial"
-				})] }), /* @__PURE__ */ c(u, {
+				children: [/* @__PURE__ */ c("div", { children: [
+					/* @__PURE__ */ s("h1", {
+						className: "text-2xl font-semibold",
+						children: /* @__PURE__ */ s(g, { children: "Calls" })
+					}),
+					/* @__PURE__ */ s("p", {
+						className: "text-sm text-text-secondary",
+						children: "Voice call history and quick dial"
+					}),
+					/* @__PURE__ */ s(_, {
+						className: "mt-1",
+						children: "Review your call history and start new voice calls with colleagues — a quick way to reach teammates without leaving CrewFoundry."
+					})
+				] }), /* @__PURE__ */ c(u, {
 					size: "sm",
 					children: [/* @__PURE__ */ s(r, { className: "mr-1 h-4 w-4" }), "New Call"]
 				})]
@@ -43,7 +50,8 @@ function y() {
 				className: "grid gap-4 md:grid-cols-3",
 				children: [
 					/* @__PURE__ */ c(h, {
-						treatment: "metric",
+						treatment: "glass",
+						glow: !0,
 						className: "border-border-seam",
 						children: [/* @__PURE__ */ c(p, {
 							className: "flex flex-row items-center justify-between space-y-0 pb-2",
@@ -53,7 +61,7 @@ function y() {
 							}), /* @__PURE__ */ s(r, { className: "h-4 w-4 text-text-secondary" })]
 						}), /* @__PURE__ */ c(f, { children: [/* @__PURE__ */ s("div", {
 							className: "text-2xl font-bold tabular-nums",
-							children: y.length
+							children: b.length
 						}), /* @__PURE__ */ s("p", {
 							className: "text-xs text-text-secondary",
 							children: "Live call activity"
@@ -70,7 +78,7 @@ function y() {
 							}), /* @__PURE__ */ s(a, { className: "h-4 w-4 text-status-error-text" })]
 						}), /* @__PURE__ */ s(f, { children: /* @__PURE__ */ s("div", {
 							className: "text-2xl font-bold tabular-nums",
-							children: y.filter((e) => e.type === "missed").length
+							children: b.filter((e) => e.type === "missed").length
 						}) })]
 					}),
 					/* @__PURE__ */ c(h, {
@@ -84,7 +92,7 @@ function y() {
 							}), /* @__PURE__ */ s(n, { className: "h-4 w-4 text-text-secondary" })]
 						}), /* @__PURE__ */ c(f, { children: [/* @__PURE__ */ s("div", {
 							className: "text-2xl font-bold tabular-nums",
-							children: _(x)
+							children: v(S)
 						}), /* @__PURE__ */ s("p", {
 							className: "text-xs text-text-secondary",
 							children: "minutes"
@@ -94,11 +102,11 @@ function y() {
 			}),
 			/* @__PURE__ */ c(d, { children: [/* @__PURE__ */ s(p, { children: /* @__PURE__ */ s(m, { children: "Call History" }) }), /* @__PURE__ */ s(f, {
 				className: "space-y-3",
-				children: y.map((e) => /* @__PURE__ */ c("div", {
+				children: b.map((e) => /* @__PURE__ */ c("div", {
 					className: "flex items-center justify-between rounded border p-3",
 					children: [/* @__PURE__ */ c("div", {
 						className: "flex items-center gap-3",
-						children: [/* @__PURE__ */ s(v, { type: e.type }), /* @__PURE__ */ c("div", { children: [/* @__PURE__ */ s("p", {
+						children: [/* @__PURE__ */ s(y, { type: e.type }), /* @__PURE__ */ c("div", { children: [/* @__PURE__ */ s("p", {
 							className: "text-sm font-medium",
 							children: e.name
 						}), /* @__PURE__ */ s("p", {
@@ -131,6 +139,6 @@ function y() {
 	});
 }
 //#endregion
-export { y as CommunicationsCallsPagePage };
+export { b as CommunicationsCallsPagePage };
 
 //# sourceMappingURL=CommunicationsCallsPagePage.js.map

package/dist/crewfoundry/pages/CommunicationsCallsPagePage.js.map

@@ -1 +1 @@
-{"version":3,"file":"CommunicationsCallsPagePage.js","names":[],"sources":["../../../src/crewfoundry/pages/CommunicationsCallsPagePage.tsx"],"sourcesContent":["import { useMemo } from 'react';\nimport {\n  Badge,\n  Button,\n  Card,\n  CardContent,\n  CardHeader,\n  CardTitle,\n  GlassCard,\n  GradientText,\n} from '@burdenoff/fe-libs/ui';\nimport { Clock, Phone, PhoneIncoming, PhoneMissed, PhoneOutgoing } from 'lucide-react';\nimport { useCrewFoundryStore } from '../store/crewfoundryStore';\n\ntype CallType = 'incoming' | 'outgoing' | 'missed';\n\ntype CallRecord = {\n  id: string;\n  name: string;\n  type: CallType;\n  duration: string;\n  time: string;\n  topic: string;\n};\n\nconst formatDuration = (minutes: number): string => {\n  const safeMinutes = Math.max(minutes, 0);\n  const hours = Math.floor(safeMinutes / 60);\n  const mins = safeMinutes % 60;\n  if (hours > 0) {\n    return `${String(hours).padStart(2, '0')}:${String(mins).padStart(2, '0')}`;\n  }\n  return `00:${String(mins).padStart(2, '0')}`;\n};\n\nconst CallIcon = ({ type }: { type: CallType }) => {\n  if (type === 'incoming') return <PhoneIncoming className=\"h-4 w-4 text-status-success-text\" />;\n  if (type === 'outgoing') return <PhoneOutgoing className=\"h-4 w-4 text-status-info-text\" />;\n  return <PhoneMissed className=\"h-4 w-4 text-status-error-text\" />;\n};\n\nexport function CommunicationsCallsPagePage() {\n  const { employees, teams } = useCrewFoundryStore();\n\n  const callHistory = useMemo<CallRecord[]>(() => {\n    const seed = employees.slice(0, 10);\n    return seed.map((employee, index) => {\n      const callType: CallType =\n        index % 5 === 0 ? 'missed' : index % 2 === 0 ? 'outgoing' : 'incoming';\n      const topicSource = teams[index % Math.max(teams.length, 1)];\n      const durationMinutes = Math.round((employee.performanceScore + index) * 3);\n      return {\n        id: `call-${employee.id}`,\n        name: `${employee.firstName} ${employee.lastName}`.trim(),\n        type: callType,\n        duration: callType === 'missed' ? '-' : formatDuration(durationMinutes),\n        time: new Date(employee.startDate).toLocaleDateString(),\n        topic: topicSource\n          ? `${topicSource.name} check-in`\n          : `${employee.department} operations update`,\n      };\n    });\n  }, [employees, teams]);\n\n  const connectedCalls = callHistory.filter((call) => call.duration !== '-');\n  const averageMinutes = connectedCalls.length\n    ? Math.round(\n        connectedCalls\n          .map((call) => {\n            const [hours, minutes] = call.duration.split(':').map(Number);\n            return hours * 60 + minutes;\n          })\n          .reduce((total, value) => total + value, 0) / connectedCalls.length\n      )\n    : 0;\n\n  return (\n    <div className=\"space-y-6 p-6\">\n      <div className=\"flex items-center justify-between\">\n        <div>\n          <h1 className=\"text-2xl font-semibold\">\n            <GradientText>Calls</GradientText>\n          </h1>\n          <p className=\"text-sm text-text-secondary\">Voice call history and quick dial</p>\n        </div>\n        <Button size=\"sm\">\n          <Phone className=\"mr-1 h-4 w-4\" />\n          New Call\n        </Button>\n      </div>\n\n      <div className=\"grid gap-4 md:grid-cols-3\">\n        <GlassCard treatment=\"metric\" className=\"border-border-seam\">\n          <CardHeader className=\"flex flex-row items-center justify-between space-y-0 pb-2\">\n            <CardTitle className=\"text-sm font-medium\">Total Calls</CardTitle>\n            <Phone className=\"h-4 w-4 text-text-secondary\" />\n          </CardHeader>\n          <CardContent>\n            <div className=\"text-2xl font-bold tabular-nums\">{callHistory.length}</div>\n            <p className=\"text-xs text-text-secondary\">Live call activity</p>\n          </CardContent>\n        </GlassCard>\n        <GlassCard treatment=\"metric\" className=\"border-border-seam\">\n          <CardHeader className=\"flex flex-row items-center justify-between space-y-0 pb-2\">\n            <CardTitle className=\"text-sm font-medium\">Missed</CardTitle>\n            <PhoneMissed className=\"h-4 w-4 text-status-error-text\" />\n          </CardHeader>\n          <CardContent>\n            <div className=\"text-2xl font-bold tabular-nums\">\n              {callHistory.filter((call) => call.type === 'missed').length}\n            </div>\n          </CardContent>\n        </GlassCard>\n        <GlassCard treatment=\"metric\" className=\"border-border-seam\">\n          <CardHeader className=\"flex flex-row items-center justify-between space-y-0 pb-2\">\n            <CardTitle className=\"text-sm font-medium\">Avg Duration</CardTitle>\n            <Clock className=\"h-4 w-4 text-text-secondary\" />\n          </CardHeader>\n          <CardContent>\n            <div className=\"text-2xl font-bold tabular-nums\">{formatDuration(averageMinutes)}</div>\n            <p className=\"text-xs text-text-secondary\">minutes</p>\n          </CardContent>\n        </GlassCard>\n      </div>\n\n      <Card>\n        <CardHeader>\n          <CardTitle>Call History</CardTitle>\n        </CardHeader>\n        <CardContent className=\"space-y-3\">\n          {callHistory.map((call) => (\n            <div key={call.id} className=\"flex items-center justify-between rounded border p-3\">\n              <div className=\"flex items-center gap-3\">\n                <CallIcon type={call.type} />\n                <div>\n                  <p className=\"text-sm font-medium\">{call.name}</p>\n                  <p className=\"text-xs text-text-secondary\">{call.topic}</p>\n                </div>\n              </div>\n              <div className=\"flex items-center gap-3\">\n                <span className=\"text-xs text-text-secondary\">{call.time}</span>\n                <Badge\n                  variant={call.type === 'missed' ? 'destructive' : 'outline'}\n                  className=\"text-[10px]\"\n                >\n                  {call.duration === '-' ? 'missed' : call.duration}\n                </Badge>\n                <Button variant=\"outline\" size=\"sm\" className=\"h-7\">\n                  <Phone className=\"h-3 w-3\" />\n                </Button>\n              </div>\n            </div>\n          ))}\n        </CardContent>\n      </Card>\n    </div>\n  );\n}\n"],"mappings":"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"}
+{"version":3,"file":"CommunicationsCallsPagePage.js","names":[],"sources":["../../../src/crewfoundry/pages/CommunicationsCallsPagePage.tsx"],"sourcesContent":["import { useMemo } from 'react';\nimport {\n  Badge,\n  Button,\n  Card,\n  CardContent,\n  CardHeader,\n  CardTitle,\n  GlassCard,\n  GradientText,\n  PagePurpose,\n} from '@burdenoff/fe-libs/ui';\nimport { Clock, Phone, PhoneIncoming, PhoneMissed, PhoneOutgoing } from 'lucide-react';\nimport { useCrewFoundryStore } from '../store/crewfoundryStore';\n\ntype CallType = 'incoming' | 'outgoing' | 'missed';\n\ntype CallRecord = {\n  id: string;\n  name: string;\n  type: CallType;\n  duration: string;\n  time: string;\n  topic: string;\n};\n\nconst formatDuration = (minutes: number): string => {\n  const safeMinutes = Math.max(minutes, 0);\n  const hours = Math.floor(safeMinutes / 60);\n  const mins = safeMinutes % 60;\n  if (hours > 0) {\n    return `${String(hours).padStart(2, '0')}:${String(mins).padStart(2, '0')}`;\n  }\n  return `00:${String(mins).padStart(2, '0')}`;\n};\n\nconst CallIcon = ({ type }: { type: CallType }) => {\n  if (type === 'incoming') return <PhoneIncoming className=\"h-4 w-4 text-status-success-text\" />;\n  if (type === 'outgoing') return <PhoneOutgoing className=\"h-4 w-4 text-status-info-text\" />;\n  return <PhoneMissed className=\"h-4 w-4 text-status-error-text\" />;\n};\n\nexport function CommunicationsCallsPagePage() {\n  const { employees, teams } = useCrewFoundryStore();\n\n  const callHistory = useMemo<CallRecord[]>(() => {\n    const seed = employees.slice(0, 10);\n    return seed.map((employee, index) => {\n      const callType: CallType =\n        index % 5 === 0 ? 'missed' : index % 2 === 0 ? 'outgoing' : 'incoming';\n      const topicSource = teams[index % Math.max(teams.length, 1)];\n      const durationMinutes = Math.round((employee.performanceScore + index) * 3);\n      return {\n        id: `call-${employee.id}`,\n        name: `${employee.firstName} ${employee.lastName}`.trim(),\n        type: callType,\n        duration: callType === 'missed' ? '-' : formatDuration(durationMinutes),\n        time: new Date(employee.startDate).toLocaleDateString(),\n        topic: topicSource\n          ? `${topicSource.name} check-in`\n          : `${employee.department} operations update`,\n      };\n    });\n  }, [employees, teams]);\n\n  const connectedCalls = callHistory.filter((call) => call.duration !== '-');\n  const averageMinutes = connectedCalls.length\n    ? Math.round(\n        connectedCalls\n          .map((call) => {\n            const [hours, minutes] = call.duration.split(':').map(Number);\n            return hours * 60 + minutes;\n          })\n          .reduce((total, value) => total + value, 0) / connectedCalls.length\n      )\n    : 0;\n\n  return (\n    <div className=\"space-y-6 p-6\">\n      <div className=\"flex items-center justify-between\">\n        <div>\n          <h1 className=\"text-2xl font-semibold\">\n            <GradientText>Calls</GradientText>\n          </h1>\n          <p className=\"text-sm text-text-secondary\">Voice call history and quick dial</p>\n          <PagePurpose className=\"mt-1\">Review your call history and start new voice calls with colleagues — a quick way to reach teammates without leaving CrewFoundry.</PagePurpose>\n        </div>\n        <Button size=\"sm\">\n          <Phone className=\"mr-1 h-4 w-4\" />\n          New Call\n        </Button>\n      </div>\n\n      <div className=\"grid gap-4 md:grid-cols-3\">\n        <GlassCard treatment=\"glass\" glow className=\"border-border-seam\">\n          <CardHeader className=\"flex flex-row items-center justify-between space-y-0 pb-2\">\n            <CardTitle className=\"text-sm font-medium\">Total Calls</CardTitle>\n            <Phone className=\"h-4 w-4 text-text-secondary\" />\n          </CardHeader>\n          <CardContent>\n            <div className=\"text-2xl font-bold tabular-nums\">{callHistory.length}</div>\n            <p className=\"text-xs text-text-secondary\">Live call activity</p>\n          </CardContent>\n        </GlassCard>\n        <GlassCard treatment=\"metric\" className=\"border-border-seam\">\n          <CardHeader className=\"flex flex-row items-center justify-between space-y-0 pb-2\">\n            <CardTitle className=\"text-sm font-medium\">Missed</CardTitle>\n            <PhoneMissed className=\"h-4 w-4 text-status-error-text\" />\n          </CardHeader>\n          <CardContent>\n            <div className=\"text-2xl font-bold tabular-nums\">\n              {callHistory.filter((call) => call.type === 'missed').length}\n            </div>\n          </CardContent>\n        </GlassCard>\n        <GlassCard treatment=\"metric\" className=\"border-border-seam\">\n          <CardHeader className=\"flex flex-row items-center justify-between space-y-0 pb-2\">\n            <CardTitle className=\"text-sm font-medium\">Avg Duration</CardTitle>\n            <Clock className=\"h-4 w-4 text-text-secondary\" />\n          </CardHeader>\n          <CardContent>\n            <div className=\"text-2xl font-bold tabular-nums\">{formatDuration(averageMinutes)}</div>\n            <p className=\"text-xs text-text-secondary\">minutes</p>\n          </CardContent>\n        </GlassCard>\n      </div>\n\n      <Card>\n        <CardHeader>\n          <CardTitle>Call History</CardTitle>\n        </CardHeader>\n        <CardContent className=\"space-y-3\">\n          {callHistory.map((call) => (\n            <div key={call.id} className=\"flex items-center justify-between rounded border p-3\">\n              <div className=\"flex items-center gap-3\">\n                <CallIcon type={call.type} />\n                <div>\n                  <p className=\"text-sm font-medium\">{call.name}</p>\n                  <p className=\"text-xs text-text-secondary\">{call.topic}</p>\n                </div>\n              </div>\n              <div className=\"flex items-center gap-3\">\n                <span className=\"text-xs text-text-secondary\">{call.time}</span>\n                <Badge\n                  variant={call.type === 'missed' ? 'destructive' : 'outline'}\n                  className=\"text-[10px]\"\n                >\n                  {call.duration === '-' ? 'missed' : call.duration}\n                </Badge>\n                <Button variant=\"outline\" size=\"sm\" className=\"h-7\">\n                  <Phone className=\"h-3 w-3\" />\n                </Button>\n              </div>\n            </div>\n          ))}\n        </CardContent>\n      </Card>\n    </div>\n  );\n}\n"],"mappings":"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"}

package/dist/crewfoundry/pages/CommunicationsDirectoryPagePage.js

@@ -2,92 +2,110 @@ import { useCrewFoundryStore as e } from "../store/crewfoundryStore.js";
 import { useState as t } from "react";
 import { Mail as n, MapPin as r, Phone as i, Search as a } from "lucide-react";
 import { jsx as o, jsxs as s } from "react/jsx-runtime";
-import { Badge as c, Card as l, CardContent as u, GradientText as d, Input as f } from "@burdenoff/fe-libs/ui";
+import { Badge as c, CardContent as l, GlassCard as u, GradientText as d, IllustratedEmptyState as f, Input as p, PagePurpose as m } from "@burdenoff/fe-libs/ui";
 //#region src/crewfoundry/pages/CommunicationsDirectoryPagePage.tsx
-function p() {
-	let { employees: p } = e(), [m, h] = t(""), g = p.filter((e) => `${e.firstName} ${e.lastName} ${e.department} ${e.position} ${e.email}`.toLowerCase().includes(m.toLowerCase()));
+function h() {
+	let { employees: h } = e(), [g, _] = t(""), v = h.filter((e) => `${e.firstName} ${e.lastName} ${e.department} ${e.position} ${e.email}`.toLowerCase().includes(g.toLowerCase()));
 	return /* @__PURE__ */ s("div", {
 		className: "space-y-6 p-6",
 		children: [
-			/* @__PURE__ */ s("div", { children: [/* @__PURE__ */ o("h1", {
-				className: "text-2xl font-semibold",
-				children: /* @__PURE__ */ o(d, { children: "Company Directory" })
-			}), /* @__PURE__ */ s("p", {
-				className: "text-sm text-text-secondary",
-				children: [p.length, " team members"]
-			})] }),
+			/* @__PURE__ */ s("div", { children: [
+				/* @__PURE__ */ o("h1", {
+					className: "text-2xl font-semibold",
+					children: /* @__PURE__ */ o(d, { children: "Company Directory" })
+				}),
+				/* @__PURE__ */ s("p", {
+					className: "text-sm text-text-secondary",
+					children: [h.length, " team members"]
+				}),
+				/* @__PURE__ */ o(m, {
+					className: "mt-1",
+					children: "Find anyone in the company by name, role, or department — use it to discover who to contact and how to reach them."
+				})
+			] }),
 			/* @__PURE__ */ s("div", {
 				className: "relative max-w-sm",
-				children: [/* @__PURE__ */ o(a, { className: "absolute left-3 top-1/2 -translate-y-1/2 h-4 w-4 text-text-secondary" }), /* @__PURE__ */ o(f, {
+				children: [/* @__PURE__ */ o(a, { className: "absolute left-3 top-1/2 -translate-y-1/2 h-4 w-4 text-text-secondary" }), /* @__PURE__ */ o(p, {
 					placeholder: "Search by name, role, department...",
 					className: "pl-9",
-					value: m,
-					onChange: (e) => h(e.target.value)
+					value: g,
+					onChange: (e) => _(e.target.value)
 				})]
 			}),
 			/* @__PURE__ */ o("div", {
 				className: "grid gap-3 md:grid-cols-2 lg:grid-cols-3",
-				children: g.map((e) => /* @__PURE__ */ o(l, { children: /* @__PURE__ */ o(u, {
-					className: "p-4",
-					children: /* @__PURE__ */ s("div", {
-						className: "flex items-start gap-3",
-						children: [
-							/* @__PURE__ */ s("div", {
-								className: "h-10 w-10 rounded-full bg-action-primary-bg/10 flex items-center justify-center text-sm font-bold flex-shrink-0",
-								children: [e.firstName[0], e.lastName[0]]
-							}),
-							/* @__PURE__ */ s("div", {
-								className: "flex-1 min-w-0",
-								children: [
-									/* @__PURE__ */ s("p", {
-										className: "text-sm font-medium",
-										children: [
-											e.firstName,
-											" ",
-											e.lastName
-										]
-									}),
-									/* @__PURE__ */ o("p", {
-										className: "text-xs text-text-secondary",
-										children: e.position
-									}),
-									/* @__PURE__ */ o(c, {
-										variant: "outline",
-										className: "mt-1 text-[10px]",
-										children: e.department
-									}),
-									/* @__PURE__ */ s("div", {
-										className: "mt-2 space-y-1",
-										children: [
-											/* @__PURE__ */ s("p", {
-												className: "text-xs text-text-secondary flex items-center gap-1",
-												children: [/* @__PURE__ */ o(n, { className: "h-3 w-3" }), e.email]
-											}),
-											/* @__PURE__ */ s("p", {
-												className: "text-xs text-text-secondary flex items-center gap-1",
-												children: [/* @__PURE__ */ o(i, { className: "h-3 w-3" }), e.phone]
-											}),
-											/* @__PURE__ */ s("p", {
-												className: "text-xs text-text-secondary flex items-center gap-1",
-												children: [/* @__PURE__ */ o(r, { className: "h-3 w-3" }), e.location]
-											})
-										]
-									})
-								]
-							}),
-							/* @__PURE__ */ o(c, {
-								variant: e.status === "active" ? "default" : "secondary",
-								className: "text-[10px]",
-								children: e.status.replace("_", " ")
-							})
-						]
+				children: v.length === 0 ? /* @__PURE__ */ o("div", {
+					className: "col-span-full",
+					children: /* @__PURE__ */ o(f, {
+						illustration: "empty-people",
+						title: "No people found",
+						description: "Try a different search term to find a colleague."
 					})
-				}) }, e.id))
+				}) : v.map((e, t) => /* @__PURE__ */ o(u, {
+					treatment: t === 0 ? "glass" : "plain",
+					glow: t === 0,
+					children: /* @__PURE__ */ o(l, {
+						className: "p-4",
+						children: /* @__PURE__ */ s("div", {
+							className: "flex items-start gap-3",
+							children: [
+								/* @__PURE__ */ s("div", {
+									className: "h-10 w-10 rounded-full bg-action-primary-bg/10 flex items-center justify-center text-sm font-bold flex-shrink-0",
+									children: [e.firstName[0], e.lastName[0]]
+								}),
+								/* @__PURE__ */ s("div", {
+									className: "flex-1 min-w-0",
+									children: [
+										/* @__PURE__ */ s("p", {
+											className: "text-sm font-medium",
+											children: [
+												e.firstName,
+												" ",
+												e.lastName
+											]
+										}),
+										/* @__PURE__ */ o("p", {
+											className: "text-xs text-text-secondary",
+											children: e.position
+										}),
+										/* @__PURE__ */ o(c, {
+											variant: "outline",
+											className: "mt-1 text-[10px]",
+											children: e.department
+										}),
+										/* @__PURE__ */ s("div", {
+											className: "mt-2 space-y-1",
+											children: [
+												/* @__PURE__ */ s("p", {
+													className: "text-xs text-text-secondary flex items-center gap-1",
+													children: [/* @__PURE__ */ o(n, { className: "h-3 w-3" }), e.email]
+												}),
+												/* @__PURE__ */ s("p", {
+													className: "text-xs text-text-secondary flex items-center gap-1",
+													children: [/* @__PURE__ */ o(i, { className: "h-3 w-3" }), e.phone]
+												}),
+												/* @__PURE__ */ s("p", {
+													className: "text-xs text-text-secondary flex items-center gap-1",
+													children: [/* @__PURE__ */ o(r, { className: "h-3 w-3" }), e.location]
+												})
+											]
+										})
+									]
+								}),
+								/* @__PURE__ */ o(c, {
+									variant: e.status === "active" ? "default" : "secondary",
+									className: "text-[10px]",
+									children: e.status.replace("_", " ")
+								})
+							]
+						})
+					})
+				}, e.id))
 			})
 		]
 	});
 }
 //#endregion
-export { p as CommunicationsDirectoryPagePage };
+export { h as CommunicationsDirectoryPagePage };
 
 //# sourceMappingURL=CommunicationsDirectoryPagePage.js.map

package/dist/crewfoundry/pages/CommunicationsDirectoryPagePage.js.map

@@ -1 +1 @@
-{"version":3,"file":"CommunicationsDirectoryPagePage.js","names":[],"sources":["../../../src/crewfoundry/pages/CommunicationsDirectoryPagePage.tsx"],"sourcesContent":["import { useState } from 'react';\nimport { Badge, Card, CardContent, GradientText, Input } from '@burdenoff/fe-libs/ui';\nimport { Mail, MapPin, Phone, Search } from 'lucide-react';\nimport { useCrewFoundryStore } from '../store/crewfoundryStore';\n\nexport function CommunicationsDirectoryPagePage() {\n  const { employees } = useCrewFoundryStore();\n  const [search, setSearch] = useState('');\n\n  const filtered = employees.filter((e) =>\n    `${e.firstName} ${e.lastName} ${e.department} ${e.position} ${e.email}`\n      .toLowerCase()\n      .includes(search.toLowerCase())\n  );\n\n  return (\n    <div className=\"space-y-6 p-6\">\n      <div>\n        <h1 className=\"text-2xl font-semibold\">\n          <GradientText>Company Directory</GradientText>\n        </h1>\n        <p className=\"text-sm text-text-secondary\">{employees.length} team members</p>\n      </div>\n      <div className=\"relative max-w-sm\">\n        <Search className=\"absolute left-3 top-1/2 -translate-y-1/2 h-4 w-4 text-text-secondary\" />\n        <Input\n          placeholder=\"Search by name, role, department...\"\n          className=\"pl-9\"\n          value={search}\n          onChange={(e) => setSearch(e.target.value)}\n        />\n      </div>\n      <div className=\"grid gap-3 md:grid-cols-2 lg:grid-cols-3\">\n        {filtered.map((emp) => (\n          <Card key={emp.id}>\n            <CardContent className=\"p-4\">\n              <div className=\"flex items-start gap-3\">\n                <div className=\"h-10 w-10 rounded-full bg-action-primary-bg/10 flex items-center justify-center text-sm font-bold flex-shrink-0\">\n                  {emp.firstName[0]}\n                  {emp.lastName[0]}\n                </div>\n                <div className=\"flex-1 min-w-0\">\n                  <p className=\"text-sm font-medium\">\n                    {emp.firstName} {emp.lastName}\n                  </p>\n                  <p className=\"text-xs text-text-secondary\">{emp.position}</p>\n                  <Badge variant=\"outline\" className=\"mt-1 text-[10px]\">\n                    {emp.department}\n                  </Badge>\n                  <div className=\"mt-2 space-y-1\">\n                    <p className=\"text-xs text-text-secondary flex items-center gap-1\">\n                      <Mail className=\"h-3 w-3\" />\n                      {emp.email}\n                    </p>\n                    <p className=\"text-xs text-text-secondary flex items-center gap-1\">\n                      <Phone className=\"h-3 w-3\" />\n                      {emp.phone}\n                    </p>\n                    <p className=\"text-xs text-text-secondary flex items-center gap-1\">\n                      <MapPin className=\"h-3 w-3\" />\n                      {emp.location}\n                    </p>\n                  </div>\n                </div>\n                <Badge\n                  variant={emp.status === 'active' ? 'default' : 'secondary'}\n                  className=\"text-[10px]\"\n                >\n                  {emp.status.replace('_', ' ')}\n                </Badge>\n              </div>\n            </CardContent>\n          </Card>\n        ))}\n      </div>\n    </div>\n  );\n}\n"],"mappings":";;;;;;AAKA,SAAgB,IAAkC;CAChD,IAAM,EAAE,iBAAc,GAAqB,EACrC,CAAC,GAAQ,KAAa,EAAS,GAAG,EAElC,IAAW,EAAU,QAAQ,MACjC,GAAG,EAAE,UAAU,GAAG,EAAE,SAAS,GAAG,EAAE,WAAW,GAAG,EAAE,SAAS,GAAG,EAAE,QAC7D,aAAa,CACb,SAAS,EAAO,aAAa,CAAC,CAClC;AAED,QACE,kBAAC,OAAD;EAAK,WAAU;YAAf;GACE,kBAAC,OAAD,EAAA,UAAA,CACE,kBAAC,MAAD;IAAI,WAAU;cACZ,kBAAC,GAAD,EAAA,UAAc,qBAAgC,CAAA;IAC3C,CAAA,EACL,kBAAC,KAAD;IAAG,WAAU;cAAb,CAA4C,EAAU,QAAO,gBAAiB;MAC1E,EAAA,CAAA;GACN,kBAAC,OAAD;IAAK,WAAU;cAAf,CACE,kBAAC,GAAD,EAAQ,WAAU,wEAAyE,CAAA,EAC3F,kBAAC,GAAD;KACE,aAAY;KACZ,WAAU;KACV,OAAO;KACP,WAAW,MAAM,EAAU,EAAE,OAAO,MAAM;KAC1C,CAAA,CACE;;GACN,kBAAC,OAAD;IAAK,WAAU;cACZ,EAAS,KAAK,MACb,kBAAC,GAAD,EAAA,UACE,kBAAC,GAAD;KAAa,WAAU;eACrB,kBAAC,OAAD;MAAK,WAAU;gBAAf;OACE,kBAAC,OAAD;QAAK,WAAU;kBAAf,CACG,EAAI,UAAU,IACd,EAAI,SAAS,GACV;;OACN,kBAAC,OAAD;QAAK,WAAU;kBAAf;SACE,kBAAC,KAAD;UAAG,WAAU;oBAAb;WACG,EAAI;WAAU;WAAE,EAAI;WACnB;;SACJ,kBAAC,KAAD;UAAG,WAAU;oBAA+B,EAAI;UAAa,CAAA;SAC7D,kBAAC,GAAD;UAAO,SAAQ;UAAU,WAAU;oBAChC,EAAI;UACC,CAAA;SACR,kBAAC,OAAD;UAAK,WAAU;oBAAf;WACE,kBAAC,KAAD;YAAG,WAAU;sBAAb,CACE,kBAAC,GAAD,EAAM,WAAU,WAAY,CAAA,EAC3B,EAAI,MACH;;WACJ,kBAAC,KAAD;YAAG,WAAU;sBAAb,CACE,kBAAC,GAAD,EAAO,WAAU,WAAY,CAAA,EAC5B,EAAI,MACH;;WACJ,kBAAC,KAAD;YAAG,WAAU;sBAAb,CACE,kBAAC,GAAD,EAAQ,WAAU,WAAY,CAAA,EAC7B,EAAI,SACH;;WACA;;SACF;;OACN,kBAAC,GAAD;QACE,SAAS,EAAI,WAAW,WAAW,YAAY;QAC/C,WAAU;kBAET,EAAI,OAAO,QAAQ,KAAK,IAAI;QACvB,CAAA;OACJ;;KACM,CAAA,EACT,EAtCI,EAAI,GAsCR,CACP;IACE,CAAA;GACF"}
+{"version":3,"file":"CommunicationsDirectoryPagePage.js","names":[],"sources":["../../../src/crewfoundry/pages/CommunicationsDirectoryPagePage.tsx"],"sourcesContent":["import { useState } from 'react';\nimport {\n  Badge,\n  CardContent,\n  GlassCard,\n  GradientText,\n  IllustratedEmptyState,\n  Input,\n  PagePurpose,\n} from '@burdenoff/fe-libs/ui';\nimport { Mail, MapPin, Phone, Search } from 'lucide-react';\nimport { useCrewFoundryStore } from '../store/crewfoundryStore';\n\nexport function CommunicationsDirectoryPagePage() {\n  const { employees } = useCrewFoundryStore();\n  const [search, setSearch] = useState('');\n\n  const filtered = employees.filter((e) =>\n    `${e.firstName} ${e.lastName} ${e.department} ${e.position} ${e.email}`\n      .toLowerCase()\n      .includes(search.toLowerCase())\n  );\n\n  return (\n    <div className=\"space-y-6 p-6\">\n      <div>\n        <h1 className=\"text-2xl font-semibold\">\n          <GradientText>Company Directory</GradientText>\n        </h1>\n        <p className=\"text-sm text-text-secondary\">{employees.length} team members</p>\n        <PagePurpose className=\"mt-1\">Find anyone in the company by name, role, or department — use it to discover who to contact and how to reach them.</PagePurpose>\n      </div>\n      <div className=\"relative max-w-sm\">\n        <Search className=\"absolute left-3 top-1/2 -translate-y-1/2 h-4 w-4 text-text-secondary\" />\n        <Input\n          placeholder=\"Search by name, role, department...\"\n          className=\"pl-9\"\n          value={search}\n          onChange={(e) => setSearch(e.target.value)}\n        />\n      </div>\n      <div className=\"grid gap-3 md:grid-cols-2 lg:grid-cols-3\">\n        {filtered.length === 0 ? (\n          <div className=\"col-span-full\">\n            <IllustratedEmptyState illustration=\"empty-people\" title=\"No people found\" description=\"Try a different search term to find a colleague.\" />\n          </div>\n        ) : (\n          filtered.map((emp, _idx) => (\n          <GlassCard key={emp.id} treatment={_idx === 0 ? 'glass' : 'plain'} glow={_idx === 0}>\n            <CardContent className=\"p-4\">\n              <div className=\"flex items-start gap-3\">\n                <div className=\"h-10 w-10 rounded-full bg-action-primary-bg/10 flex items-center justify-center text-sm font-bold flex-shrink-0\">\n                  {emp.firstName[0]}\n                  {emp.lastName[0]}\n                </div>\n                <div className=\"flex-1 min-w-0\">\n                  <p className=\"text-sm font-medium\">\n                    {emp.firstName} {emp.lastName}\n                  </p>\n                  <p className=\"text-xs text-text-secondary\">{emp.position}</p>\n                  <Badge variant=\"outline\" className=\"mt-1 text-[10px]\">\n                    {emp.department}\n                  </Badge>\n                  <div className=\"mt-2 space-y-1\">\n                    <p className=\"text-xs text-text-secondary flex items-center gap-1\">\n                      <Mail className=\"h-3 w-3\" />\n                      {emp.email}\n                    </p>\n                    <p className=\"text-xs text-text-secondary flex items-center gap-1\">\n                      <Phone className=\"h-3 w-3\" />\n                      {emp.phone}\n                    </p>\n                    <p className=\"text-xs text-text-secondary flex items-center gap-1\">\n                      <MapPin className=\"h-3 w-3\" />\n                      {emp.location}\n                    </p>\n                  </div>\n                </div>\n                <Badge\n                  variant={emp.status === 'active' ? 'default' : 'secondary'}\n                  className=\"text-[10px]\"\n                >\n                  {emp.status.replace('_', ' ')}\n                </Badge>\n              </div>\n            </CardContent>\n          </GlassCard>\n        )))}\n      </div>\n    </div>\n  );\n}\n"],"mappings":";;;;;;AAaA,SAAgB,IAAkC;CAChD,IAAM,EAAE,iBAAc,GAAqB,EACrC,CAAC,GAAQ,KAAa,EAAS,GAAG,EAElC,IAAW,EAAU,QAAQ,MACjC,GAAG,EAAE,UAAU,GAAG,EAAE,SAAS,GAAG,EAAE,WAAW,GAAG,EAAE,SAAS,GAAG,EAAE,QAC7D,aAAa,CACb,SAAS,EAAO,aAAa,CAAC,CAClC;AAED,QACE,kBAAC,OAAD;EAAK,WAAU;YAAf;GACE,kBAAC,OAAD,EAAA,UAAA;IACE,kBAAC,MAAD;KAAI,WAAU;eACZ,kBAAC,GAAD,EAAA,UAAc,qBAAgC,CAAA;KAC3C,CAAA;IACL,kBAAC,KAAD;KAAG,WAAU;eAAb,CAA4C,EAAU,QAAO,gBAAiB;;IAC9E,kBAAC,GAAD;KAAa,WAAU;eAAO;KAAgI,CAAA;IAC1J,EAAA,CAAA;GACN,kBAAC,OAAD;IAAK,WAAU;cAAf,CACE,kBAAC,GAAD,EAAQ,WAAU,wEAAyE,CAAA,EAC3F,kBAAC,GAAD;KACE,aAAY;KACZ,WAAU;KACV,OAAO;KACP,WAAW,MAAM,EAAU,EAAE,OAAO,MAAM;KAC1C,CAAA,CACE;;GACN,kBAAC,OAAD;IAAK,WAAU;cACZ,EAAS,WAAW,IACnB,kBAAC,OAAD;KAAK,WAAU;eACb,kBAAC,GAAD;MAAuB,cAAa;MAAe,OAAM;MAAkB,aAAY;MAAqD,CAAA;KACxI,CAAA,GAEN,EAAS,KAAK,GAAK,MACnB,kBAAC,GAAD;KAAwB,WAAW,MAAS,IAAI,UAAU;KAAS,MAAM,MAAS;eAChF,kBAAC,GAAD;MAAa,WAAU;gBACrB,kBAAC,OAAD;OAAK,WAAU;iBAAf;QACE,kBAAC,OAAD;SAAK,WAAU;mBAAf,CACG,EAAI,UAAU,IACd,EAAI,SAAS,GACV;;QACN,kBAAC,OAAD;SAAK,WAAU;mBAAf;UACE,kBAAC,KAAD;WAAG,WAAU;qBAAb;YACG,EAAI;YAAU;YAAE,EAAI;YACnB;;UACJ,kBAAC,KAAD;WAAG,WAAU;qBAA+B,EAAI;WAAa,CAAA;UAC7D,kBAAC,GAAD;WAAO,SAAQ;WAAU,WAAU;qBAChC,EAAI;WACC,CAAA;UACR,kBAAC,OAAD;WAAK,WAAU;qBAAf;YACE,kBAAC,KAAD;aAAG,WAAU;uBAAb,CACE,kBAAC,GAAD,EAAM,WAAU,WAAY,CAAA,EAC3B,EAAI,MACH;;YACJ,kBAAC,KAAD;aAAG,WAAU;uBAAb,CACE,kBAAC,GAAD,EAAO,WAAU,WAAY,CAAA,EAC5B,EAAI,MACH;;YACJ,kBAAC,KAAD;aAAG,WAAU;uBAAb,CACE,kBAAC,GAAD,EAAQ,WAAU,WAAY,CAAA,EAC7B,EAAI,SACH;;YACA;;UACF;;QACN,kBAAC,GAAD;SACE,SAAS,EAAI,WAAW,WAAW,YAAY;SAC/C,WAAU;mBAET,EAAI,OAAO,QAAQ,KAAK,IAAI;SACvB,CAAA;QACJ;;MACM,CAAA;KACJ,EAtCI,EAAI,GAsCR,CACZ;IACE,CAAA;GACF"}

package/dist/crewfoundry/pages/CommunicationsFilesPagePage.js

@@ -1,41 +1,41 @@
 import { useCrewFoundryStore as e } from "../store/crewfoundryStore.js";
 import { useMemo as t, useState as n } from "react";
 import { Download as r, File as i, FileText as a, Image as o, Search as s, Upload as c } from "lucide-react";
-import { jsx as l, jsxs as u } from "react/jsx-runtime";
-import { Badge as d, Button as f, Card as p, CardContent as m, CardHeader as h, CardTitle as g, GradientText as _, Input as v } from "@burdenoff/fe-libs/ui";
+import { Fragment as l, jsx as u, jsxs as d } from "react/jsx-runtime";
+import { Badge as f, Button as p, CardContent as m, CardHeader as h, CardTitle as g, GlassCard as _, GradientText as v, IllustratedEmptyState as y, Input as b, PagePurpose as x } from "@burdenoff/fe-libs/ui";
 //#region src/crewfoundry/pages/CommunicationsFilesPagePage.tsx
-var y = (e) => e === "image" ? /* @__PURE__ */ l(o, { className: "h-5 w-5 text-action-primary-bg" }) : e === "pdf" ? /* @__PURE__ */ l(a, { className: "h-5 w-5 text-status-error-text" }) : /* @__PURE__ */ l(i, { className: "h-5 w-5 text-status-info-text" }), b = (e) => {
+var S = (e) => e === "image" ? /* @__PURE__ */ u(o, { className: "h-5 w-5 text-action-primary-bg" }) : e === "pdf" ? /* @__PURE__ */ u(a, { className: "h-5 w-5 text-status-error-text" }) : /* @__PURE__ */ u(i, { className: "h-5 w-5 text-status-info-text" }), C = (e) => {
 	let t = new Date(e);
 	return Number.isNaN(t.getTime()) ? "Unknown" : t.toISOString().split("T")[0];
 };
-function x() {
-	let [i, a] = n(""), { announcements: o, invoices: x, projects: S, employees: C } = e(), w = t(() => {
+function w() {
+	let [i, a] = n(""), { announcements: o, invoices: w, projects: T, employees: E } = e(), D = t(() => {
 		let e = o.slice(0, 8).map((e, t) => {
-			let n = C[t % Math.max(C.length, 1)];
+			let n = E[t % Math.max(E.length, 1)];
 			return {
 				id: `announcement-${e.id}`,
 				name: `${e.title}.pdf`,
 				type: "pdf",
 				size: `${Math.max(1, Math.round(e.content.length / 300))}.${t % 9} MB`,
 				uploadedBy: n ? `${n.firstName} ${n.lastName}`.trim() : e.author,
-				date: b(e.createdAt),
+				date: C(e.createdAt),
 				department: n?.department || "Operations"
 			};
-		}), t = x.slice(0, 6).map((e, t) => ({
+		}), t = w.slice(0, 6).map((e, t) => ({
 			id: `invoice-${e.id}`,
 			name: `${e.number}-invoice.xlsx`,
 			type: "spreadsheet",
 			size: `${(e.amount / 1e3).toFixed(1)} MB`,
 			uploadedBy: e.clientName,
-			date: b(e.issueDate),
+			date: C(e.issueDate),
 			department: t % 2 == 0 ? "Finance" : "Billing"
-		})), n = S.slice(0, 6).map((e, t) => ({
+		})), n = T.slice(0, 6).map((e, t) => ({
 			id: `project-${e.id}`,
 			name: `${e.name}-brief.docx`,
 			type: t % 2 == 0 ? "doc" : "image",
 			size: `${(Math.max(e.tasks, 1) / 10).toFixed(1)} MB`,
 			uploadedBy: e.managerName,
-			date: b(e.startDate),
+			date: C(e.startDate),
 			department: "Projects"
 		}));
 		return [
@@ -45,94 +45,113 @@ function x() {
 		];
 	}, [
 		o,
-		C,
-		x,
-		S
-	]), T = w.filter((e) => e.name.toLowerCase().includes(i.toLowerCase()));
-	return /* @__PURE__ */ u("div", {
+		E,
+		w,
+		T
+	]), O = D.filter((e) => e.name.toLowerCase().includes(i.toLowerCase()));
+	return /* @__PURE__ */ d("div", {
 		className: "space-y-6 p-6",
 		children: [
-			/* @__PURE__ */ u("div", {
+			/* @__PURE__ */ d("div", {
 				className: "flex items-center justify-between",
-				children: [/* @__PURE__ */ u("div", { children: [/* @__PURE__ */ l("h1", {
-					className: "text-2xl font-semibold",
-					children: /* @__PURE__ */ l(_, { children: "Shared Files" })
-				}), /* @__PURE__ */ u("p", {
-					className: "text-sm text-text-secondary",
-					children: [w.length, " files shared across teams"]
-				})] }), /* @__PURE__ */ u(f, {
+				children: [/* @__PURE__ */ d("div", { children: [
+					/* @__PURE__ */ u("h1", {
+						className: "text-2xl font-semibold",
+						children: /* @__PURE__ */ u(v, { children: "Shared Files" })
+					}),
+					/* @__PURE__ */ d("p", {
+						className: "text-sm text-text-secondary",
+						children: [D.length, " files shared across teams"]
+					}),
+					/* @__PURE__ */ u(x, {
+						className: "mt-1",
+						children: "A shared space for company documents and files — store, search, and share the resources your teams need to get work done."
+					})
+				] }), /* @__PURE__ */ d(p, {
 					size: "sm",
-					children: [/* @__PURE__ */ l(c, { className: "mr-1 h-4 w-4" }), "Upload File"]
+					children: [/* @__PURE__ */ u(c, { className: "mr-1 h-4 w-4" }), "Upload File"]
 				})]
 			}),
-			/* @__PURE__ */ u("div", {
+			/* @__PURE__ */ d("div", {
 				className: "relative max-w-sm",
-				children: [/* @__PURE__ */ l(s, { className: "absolute top-1/2 left-3 h-4 w-4 -translate-y-1/2 text-text-secondary" }), /* @__PURE__ */ l(v, {
+				children: [/* @__PURE__ */ u(s, { className: "absolute top-1/2 left-3 h-4 w-4 -translate-y-1/2 text-text-secondary" }), /* @__PURE__ */ u(b, {
 					placeholder: "Search files...",
 					className: "pl-9",
 					value: i,
 					onChange: (e) => a(e.target.value)
 				})]
 			}),
-			/* @__PURE__ */ u(p, { children: [/* @__PURE__ */ l(h, { children: /* @__PURE__ */ l(g, { children: "Workspace Files" }) }), /* @__PURE__ */ u(m, {
-				className: "p-0",
-				children: [/* @__PURE__ */ u("div", {
-					className: "grid grid-cols-6 gap-2 border-b p-4 text-xs font-medium text-text-secondary",
-					children: [
-						/* @__PURE__ */ l("span", {
-							className: "col-span-2",
-							children: "Name"
-						}),
-						/* @__PURE__ */ l("span", { children: "Uploaded By" }),
-						/* @__PURE__ */ l("span", { children: "Department" }),
-						/* @__PURE__ */ l("span", { children: "Date" }),
-						/* @__PURE__ */ l("span", {
-							className: "text-right",
-							children: "Size"
+			/* @__PURE__ */ d(_, {
+				treatment: "glass",
+				glow: !0,
+				className: "border-border-seam",
+				children: [/* @__PURE__ */ u(h, { children: /* @__PURE__ */ u(g, { children: "Workspace Files" }) }), /* @__PURE__ */ u(m, {
+					className: "p-0",
+					children: O.length === 0 ? /* @__PURE__ */ u("div", {
+						className: "p-6",
+						children: /* @__PURE__ */ u(y, {
+							illustration: "empty-files",
+							title: "No files found",
+							description: "Upload a file or adjust your search to see results here."
 						})
-					]
-				}), T.map((e) => /* @__PURE__ */ u("div", {
-					className: "grid grid-cols-6 items-center gap-2 border-b px-4 py-3 text-sm last:border-0 hover:bg-bg-sunken/50",
-					children: [
-						/* @__PURE__ */ u("div", {
-							className: "col-span-2 flex items-center gap-2",
-							children: [y(e.type), /* @__PURE__ */ l("span", {
-								className: "truncate font-medium",
-								children: e.name
-							})]
-						}),
-						/* @__PURE__ */ l("span", {
-							className: "text-text-secondary",
-							children: e.uploadedBy
-						}),
-						/* @__PURE__ */ l(d, {
-							variant: "outline",
-							className: "w-fit text-[10px]",
-							children: e.department
-						}),
-						/* @__PURE__ */ l("span", {
-							className: "text-text-secondary",
-							children: e.date
-						}),
-						/* @__PURE__ */ u("div", {
-							className: "flex items-center justify-end gap-2",
-							children: [/* @__PURE__ */ l("span", {
+					}) : /* @__PURE__ */ d(l, { children: [/* @__PURE__ */ d("div", {
+						className: "grid grid-cols-6 gap-2 border-b p-4 text-xs font-medium text-text-secondary",
+						children: [
+							/* @__PURE__ */ u("span", {
+								className: "col-span-2",
+								children: "Name"
+							}),
+							/* @__PURE__ */ u("span", { children: "Uploaded By" }),
+							/* @__PURE__ */ u("span", { children: "Department" }),
+							/* @__PURE__ */ u("span", { children: "Date" }),
+							/* @__PURE__ */ u("span", {
+								className: "text-right",
+								children: "Size"
+							})
+						]
+					}), O.map((e) => /* @__PURE__ */ d("div", {
+						className: "grid grid-cols-6 items-center gap-2 border-b px-4 py-3 text-sm last:border-0 hover:bg-bg-sunken/50",
+						children: [
+							/* @__PURE__ */ d("div", {
+								className: "col-span-2 flex items-center gap-2",
+								children: [S(e.type), /* @__PURE__ */ u("span", {
+									className: "truncate font-medium",
+									children: e.name
+								})]
+							}),
+							/* @__PURE__ */ u("span", {
 								className: "text-text-secondary",
-								children: e.size
-							}), /* @__PURE__ */ l(f, {
+								children: e.uploadedBy
+							}),
+							/* @__PURE__ */ u(f, {
 								variant: "outline",
-								size: "sm",
-								className: "h-7",
-								children: /* @__PURE__ */ l(r, { className: "h-3 w-3" })
-							})]
-						})
-					]
-				}, e.id))]
-			})] })
+								className: "w-fit text-[10px]",
+								children: e.department
+							}),
+							/* @__PURE__ */ u("span", {
+								className: "text-text-secondary",
+								children: e.date
+							}),
+							/* @__PURE__ */ d("div", {
+								className: "flex items-center justify-end gap-2",
+								children: [/* @__PURE__ */ u("span", {
+									className: "text-text-secondary",
+									children: e.size
+								}), /* @__PURE__ */ u(p, {
+									variant: "outline",
+									size: "sm",
+									className: "h-7",
+									children: /* @__PURE__ */ u(r, { className: "h-3 w-3" })
+								})]
+							})
+						]
+					}, e.id))] })
+				})]
+			})
 		]
 	});
 }
 //#endregion
-export { x as CommunicationsFilesPagePage };
+export { w as CommunicationsFilesPagePage };
 
 //# sourceMappingURL=CommunicationsFilesPagePage.js.map