@burdenoff/microfe-timecampus 2026.703.4 → 2026.703.6

package/dist/timecampus/pages/team/TeamAnalyticsPage.js.map

@@ -1 +1 @@
-{"version":3,"file":"TeamAnalyticsPage.js","names":[],"sources":["../../../../src/timecampus/pages/team/TeamAnalyticsPage.tsx"],"sourcesContent":["import { BarChart3, Users } from \"lucide-react\";\nimport { GlassCard } from \"@burdenoff/fe-libs/ui\";\nimport { PageLayout } from \"../../components/PageLayout\";\nimport { LoadingSkeleton } from \"../../components/LoadingSkeleton\";\nimport {\n  useTimeCampus,\n  useTimeCampusNavigate,\n} from \"../../providers/TimeCampusProvider\";\nimport {\n  useGetTimeEntryStatsQuery,\n  useGetWorkPatternSummaryQuery,\n} from \"@/generated/wspace-operations\";\n\nexport function TeamAnalyticsPage() {\n  const { workspaceId = \"\" } = useTimeCampus();\n  const navigate = useTimeCampusNavigate();\n\n  const analyticsActions = (\n    <div className=\"flex items-center gap-2\">\n      <button\n        onClick={() => navigate(\"/team\")}\n        className=\"inline-flex items-center gap-1.5 rounded-md border border-border-subtle px-3 py-2 text-sm font-medium text-text-primary hover:bg-bg-sunken/50\"\n      >\n        Team Overview\n      </button>\n      <button\n        onClick={() => navigate(\"/team/members\")}\n        className=\"inline-flex items-center gap-1.5 rounded-md bg-action-primary-bg px-3 py-2 text-sm font-medium text-action-primary-text hover:bg-action-primary-bg/90\"\n      >\n        <Users className=\"h-4 w-4\" />\n        View Members\n      </button>\n    </div>\n  );\n\n  const {\n    data: statsData,\n    loading: statsLoading,\n    error: statsError,\n  } = useGetTimeEntryStatsQuery({\n    skip: !workspaceId,\n  });\n\n  const { data: patternData, loading: patternLoading } =\n    useGetWorkPatternSummaryQuery({\n      skip: !workspaceId,\n    });\n\n  const stats = statsData?.timeEntryStats;\n  const pattern = patternData?.workPatternSummary;\n\n  if (statsLoading || patternLoading) {\n    return (\n      <PageLayout\n        title=\"Team Analytics\"\n        description=\"Team performance insights and metrics\"\n      >\n        <LoadingSkeleton variant=\"card\" count={4} />\n      </PageLayout>\n    );\n  }\n\n  if (statsError) {\n    return (\n      <PageLayout\n        title=\"Team Analytics\"\n        description=\"Team performance insights and metrics\"\n      >\n        <div className=\"rounded-lg border border-status-error-bg/40 bg-status-error-bg p-4 text-sm text-status-error-text\">\n          Failed to load team analytics. Please try again later.\n        </div>\n      </PageLayout>\n    );\n  }\n\n  return (\n    <PageLayout\n      title=\"Team Analytics\"\n      description=\"Team performance insights and metrics\"\n      purpose=\"Compare how your team works — hours by member, productive days, focus versus meeting time — so you can rebalance workload, recognise top contributors, and fix the patterns that slow everyone down.\"\n      actions={analyticsActions}\n    >\n      <div className=\"grid grid-cols-1 gap-6 lg:grid-cols-2\">\n        <GlassCard treatment=\"glass\" glow className=\"p-6\">\n          <div className=\"mb-4 flex items-center gap-2\">\n            <Users className=\"h-5 w-5 text-primary\" />\n            <h3 className=\"text-sm font-semibold text-text-primary\">\n              Hours by Member\n            </h3>\n          </div>\n          <div className=\"flex h-48 items-center justify-center rounded-lg border border-dashed border-border-subtle\">\n            <div className=\"text-center\">\n              <p className=\"text-sm text-text-secondary\">\n                {stats\n                  ? `${Math.round(stats.totalHours)}h total · ${Math.round(stats.billableHours)}h billable`\n                  : \"No data available\"}\n              </p>\n              {pattern?.mostProductiveDay && (\n                <p className=\"mt-1 text-xs text-text-secondary\">\n                  Most productive: {pattern.mostProductiveDay}\n                </p>\n              )}\n            </div>\n          </div>\n        </GlassCard>\n        <div className=\"rounded-xl border border-border-seam bg-bg-surface shadow-elevation-1 p-6\">\n          <div className=\"mb-4 flex items-center gap-2\">\n            <BarChart3 className=\"h-5 w-5 text-primary\" />\n            <h3 className=\"text-sm font-semibold text-text-primary\">\n              Productivity Trends\n            </h3>\n          </div>\n          <div className=\"flex h-48 items-center justify-center rounded-lg border border-dashed border-border-subtle\">\n            <div className=\"text-center\">\n              <p className=\"text-sm text-text-secondary\">\n                {pattern\n                  ? `${Math.round(pattern.averageProductivity)}% avg productivity · ${pattern.averageFocusHours.toFixed(1)}h avg focus`\n                  : \"No data available\"}\n              </p>\n              {pattern?.insights && pattern.insights.length > 0 && (\n                <p className=\"mt-1 text-xs text-text-secondary\">\n                  {pattern.insights[0].title}\n                </p>\n              )}\n            </div>\n          </div>\n        </div>\n      </div>\n    </PageLayout>\n  );\n}\n"],"mappings":";;;;;;;;AAaA,SAAgB,IAAoB;CAClC,IAAM,EAAE,iBAAc,OAAO,GAAe,EACtC,IAAW,GAAuB,EAElC,IACJ,kBAAC,OAAD;EAAK,WAAU;YAAf,CACE,kBAAC,UAAD;GACE,eAAe,EAAS,QAAQ;GAChC,WAAU;aACX;GAEQ,CAAA,EACT,kBAAC,UAAD;GACE,eAAe,EAAS,gBAAgB;GACxC,WAAU;aAFZ,CAIE,kBAAC,GAAD,EAAO,WAAU,WAAY,CAAA,EAAA,eAEtB;KACL;KAGF,EACJ,MAAM,GACN,SAAS,GACT,OAAO,MACL,EAA0B,EAC5B,MAAM,CAAC,GACR,CAAC,EAEI,EAAE,MAAM,GAAa,SAAS,MAClC,EAA8B,EAC5B,MAAM,CAAC,GACR,CAAC,EAEE,IAAQ,GAAW,gBACnB,IAAU,GAAa;AA0B7B,QAxBI,KAAgB,IAEhB,kBAAC,GAAD;EACE,OAAM;EACN,aAAY;YAEZ,kBAAC,GAAD;GAAiB,SAAQ;GAAO,OAAO;GAAK,CAAA;EACjC,CAAA,GAIb,IAEA,kBAAC,GAAD;EACE,OAAM;EACN,aAAY;YAEZ,kBAAC,OAAD;GAAK,WAAU;aAAoG;GAE7G,CAAA;EACK,CAAA,GAKf,kBAAC,GAAD;EACE,OAAM;EACN,aAAY;EACZ,SAAQ;EACR,SAAS;YAET,kBAAC,OAAD;GAAK,WAAU;aAAf,CACE,kBAAC,GAAD;IAAW,WAAU;IAAQ,MAAA;IAAK,WAAU;cAA5C,CACE,kBAAC,OAAD;KAAK,WAAU;eAAf,CACE,kBAAC,GAAD,EAAO,WAAU,wBAAyB,CAAA,EAC1C,kBAAC,MAAD;MAAI,WAAU;gBAA0C;MAEnD,CAAA,CACD;QACN,kBAAC,OAAD;KAAK,WAAU;eACb,kBAAC,OAAD;MAAK,WAAU;gBAAf,CACE,kBAAC,KAAD;OAAG,WAAU;iBACV,IACG,GAAG,KAAK,MAAM,EAAM,WAAW,CAAC,YAAY,KAAK,MAAM,EAAM,cAAc,CAAC,cAC5E;OACF,CAAA,EACH,GAAS,qBACR,kBAAC,KAAD;OAAG,WAAU;iBAAb,CAAgD,qBAC5B,EAAQ,kBACxB;SAEF;;KACF,CAAA,CACI;OACZ,kBAAC,OAAD;IAAK,WAAU;cAAf,CACE,kBAAC,OAAD;KAAK,WAAU;eAAf,CACE,kBAAC,GAAD,EAAW,WAAU,wBAAyB,CAAA,EAC9C,kBAAC,MAAD;MAAI,WAAU;gBAA0C;MAEnD,CAAA,CACD;QACN,kBAAC,OAAD;KAAK,WAAU;eACb,kBAAC,OAAD;MAAK,WAAU;gBAAf,CACE,kBAAC,KAAD;OAAG,WAAU;iBACV,IACG,GAAG,KAAK,MAAM,EAAQ,oBAAoB,CAAC,uBAAuB,EAAQ,kBAAkB,QAAQ,EAAE,CAAC,eACvG;OACF,CAAA,EACH,GAAS,YAAY,EAAQ,SAAS,SAAS,KAC9C,kBAAC,KAAD;OAAG,WAAU;iBACV,EAAQ,SAAS,GAAG;OACnB,CAAA,CAEF;;KACF,CAAA,CACF;MACF;;EACK,CAAA"}
+{"version":3,"file":"TeamAnalyticsPage.js","names":[],"sources":["../../../../src/timecampus/pages/team/TeamAnalyticsPage.tsx"],"sourcesContent":["import { BarChart3, Users, Clock, TrendingUp, Lightbulb } from \"lucide-react\";\nimport { GlassCard } from \"@burdenoff/fe-libs/ui\";\nimport {\n  PageLayout,\n  StatCard,\n  ChartCard,\n  StatusBadge,\n  LoadingSkeleton,\n  BarsChart,\n  DonutChart,\n  RadialGauge,\n} from \"../../components\";\nimport {\n  useTimeCampus,\n  useTimeCampusNavigate,\n} from \"../../providers/TimeCampusProvider\";\nimport {\n  useGetTimeEntryStatsQuery,\n  useGetWorkPatternSummaryQuery,\n} from \"@/generated/wspace-operations\";\n\nconst formatHrs = (v: number): string =>\n  `${Number.isInteger(v) ? v : v.toFixed(1)}h`;\n\nconst impactVariant = (\n  impact?: string | null,\n): \"success\" | \"warning\" | \"info\" | \"muted\" => {\n  const value = (impact ?? \"\").toLowerCase();\n  if (value.includes(\"high\") || value.includes(\"critical\")) return \"warning\";\n  if (value.includes(\"low\")) return \"muted\";\n  if (value.includes(\"positive\") || value.includes(\"good\")) return \"success\";\n  return \"info\";\n};\n\nexport function TeamAnalyticsPage() {\n  const { workspaceId = \"\" } = useTimeCampus();\n  const navigate = useTimeCampusNavigate();\n\n  const analyticsActions = (\n    <div className=\"flex items-center gap-2\">\n      <button\n        onClick={() => navigate(\"/team\")}\n        className=\"inline-flex items-center gap-1.5 rounded-md border border-border-subtle px-3 py-2 text-sm font-medium text-text-primary hover:bg-bg-sunken/50\"\n      >\n        Team Overview\n      </button>\n      <button\n        onClick={() => navigate(\"/team/members\")}\n        className=\"inline-flex items-center gap-1.5 rounded-md bg-action-primary-bg px-3 py-2 text-sm font-medium text-action-primary-text hover:bg-action-primary-bg/90\"\n      >\n        <Users className=\"h-4 w-4\" />\n        View Members\n      </button>\n    </div>\n  );\n\n  const {\n    data: statsData,\n    loading: statsLoading,\n    error: statsError,\n  } = useGetTimeEntryStatsQuery({\n    skip: !workspaceId,\n  });\n\n  const { data: patternData, loading: patternLoading } =\n    useGetWorkPatternSummaryQuery({\n      skip: !workspaceId,\n    });\n\n  const stats = statsData?.timeEntryStats;\n  const pattern = patternData?.workPatternSummary;\n\n  if (statsLoading || patternLoading) {\n    return (\n      <PageLayout\n        title=\"Team Analytics\"\n        description=\"Team performance insights and metrics\"\n      >\n        <LoadingSkeleton variant=\"card\" count={4} />\n      </PageLayout>\n    );\n  }\n\n  if (statsError) {\n    return (\n      <PageLayout\n        title=\"Team Analytics\"\n        description=\"Team performance insights and metrics\"\n      >\n        <div className=\"rounded-lg border border-status-error-bg/40 bg-status-error-bg p-4 text-sm text-status-error-text\">\n          Failed to load team analytics. Please try again later.\n        </div>\n      </PageLayout>\n    );\n  }\n\n  const totalHours = stats?.totalHours ?? 0;\n  const billableHours = stats?.billableHours ?? 0;\n  const nonBillableHours = Math.max(0, totalHours - billableHours);\n  const billablePercent =\n    totalHours > 0 ? Math.round((billableHours / totalHours) * 100) : 0;\n\n  const avgFocus = pattern?.averageFocusHours ?? 0;\n  const avgMeeting = pattern?.averageMeetingHours ?? 0;\n  const avgProductivity = pattern?.averageProductivity ?? 0;\n  const insights = pattern?.insights ?? [];\n\n  // Aggregate team composition — never individual — from the fetched stats.\n  const distributionData = [\n    {\n      label: \"Logged\",\n      billable: Math.round(billableHours * 10) / 10,\n      nonBillable: Math.round(nonBillableHours * 10) / 10,\n    },\n  ];\n\n  // Focus vs meeting balance from the work-pattern summary (avg per person).\n  const balanceData = [\n    { name: \"Deep Work / Focus\", value: Math.round(avgFocus * 10) / 10 },\n    { name: \"Meetings\", value: Math.round(avgMeeting * 10) / 10 },\n  ];\n\n  return (\n    <PageLayout\n      title=\"Team Analytics\"\n      description=\"Team performance insights and metrics\"\n      purpose=\"Compare how your team works — hours by member, productive days, focus versus meeting time — so you can rebalance workload, recognise top contributors, and fix the patterns that slow everyone down.\"\n      actions={analyticsActions}\n    >\n      <div className=\"space-y-6\">\n        <div className=\"grid grid-cols-1 gap-4 sm:grid-cols-2 lg:grid-cols-4\">\n          <StatCard\n            featured\n            title=\"Total Team Hours\"\n            value={formatHrs(Math.round(totalHours))}\n            icon={<Clock className=\"h-5 w-5\" />}\n          />\n          <StatCard\n            title=\"Billable Hours\"\n            value={formatHrs(Math.round(billableHours))}\n            icon={<TrendingUp className=\"h-5 w-5\" />}\n            trend={{ value: billablePercent, label: \"billable rate\" }}\n          />\n          <StatCard\n            title=\"Avg Productivity\"\n            value={`${Math.round(avgProductivity)}%`}\n            icon={<BarChart3 className=\"h-5 w-5\" />}\n            iconBgColor=\"bg-status-success-bg text-status-success-text\"\n          />\n          <StatCard\n            title=\"Meeting Load\"\n            value={formatHrs(avgMeeting)}\n            icon={<Users className=\"h-5 w-5\" />}\n            description=\"Avg / person — the true cost of meetings\"\n          />\n        </div>\n\n        <div className=\"grid grid-cols-1 gap-6 lg:grid-cols-2\">\n          <ChartCard\n            title=\"Team Time Distribution\"\n            description=\"All data aggregate, not individual.\"\n          >\n            <BarsChart\n              data={distributionData}\n              xKey=\"label\"\n              orientation=\"horizontal\"\n              stacked\n              height={150}\n              categoryWidth={72}\n              valueFormat={formatHrs}\n              series={[\n                { key: \"billable\", label: \"Billable\" },\n                { key: \"nonBillable\", label: \"Non-billable\" },\n              ]}\n              emptyLabel=\"No logged hours yet\"\n            />\n            <p className=\"mt-2 text-xs text-text-secondary\">\n              {billablePercent}% of {formatHrs(Math.round(totalHours))} logged\n              is billable.\n            </p>\n          </ChartCard>\n\n          <ChartCard\n            title=\"Focus vs Meeting Balance\"\n            description=\"Average deep-work versus meeting time per person.\"\n          >\n            <DonutChart\n              data={balanceData}\n              centerValue={Math.round((avgFocus + avgMeeting) * 10) / 10}\n              centerLabel=\"Avg / person\"\n              valueFormat={formatHrs}\n              height={220}\n              emptyLabel=\"No work-pattern data yet\"\n            />\n          </ChartCard>\n        </div>\n\n        <div className=\"grid grid-cols-1 gap-6 lg:grid-cols-2\">\n          <ChartCard\n            title=\"Team Productivity\"\n            description=\"Aggregate productivity score across the team.\"\n          >\n            <RadialGauge\n              value={Math.round(avgProductivity)}\n              min={0}\n              max={100}\n              label=\"Productivity\"\n              sublabel={\n                pattern?.mostProductiveDay\n                  ? `Peak day: ${pattern.mostProductiveDay}`\n                  : undefined\n              }\n              format={(v) => `${Math.round(v)}%`}\n              height={220}\n            />\n            <div className=\"mt-4 flex flex-wrap items-center justify-center gap-2\">\n              {pattern?.mostProductiveDay && (\n                <StatusBadge\n                  variant=\"success\"\n                  label={`Most productive: ${pattern.mostProductiveDay}`}\n                />\n              )}\n              {pattern?.leastProductiveDay && (\n                <StatusBadge\n                  variant=\"muted\"\n                  label={`Quietest: ${pattern.leastProductiveDay}`}\n                />\n              )}\n            </div>\n          </ChartCard>\n\n          <GlassCard treatment=\"glass\" glow className=\"p-4 sm:p-6\">\n            <div className=\"mb-4 flex items-center gap-2\">\n              <Lightbulb className=\"h-5 w-5 text-primary\" />\n              <h3 className=\"text-sm font-semibold text-text-primary\">\n                Team Insights\n              </h3>\n            </div>\n            {insights.length === 0 ? (\n              <div className=\"flex h-40 items-center justify-center rounded-lg border border-border-subtle bg-bg-sunken/30 text-center\">\n                <p className=\"max-w-xs text-sm text-text-secondary\">\n                  Insights appear here as your team logs more work patterns.\n                </p>\n              </div>\n            ) : (\n              <ul className=\"space-y-3\">\n                {insights.map(\n                  (insight: (typeof insights)[number], index: number) => (\n                    <li\n                      key={`${insight.type}-${index}`}\n                      className=\"rounded-lg border border-border-subtle bg-bg-surface/40 p-3\"\n                    >\n                      <div className=\"flex items-start justify-between gap-3\">\n                        <p className=\"text-sm font-medium text-text-primary\">\n                          {insight.title}\n                        </p>\n                        {insight.impact && (\n                          <StatusBadge\n                            variant={impactVariant(insight.impact)}\n                            label={insight.impact}\n                          />\n                        )}\n                      </div>\n                      <p className=\"mt-1 text-xs text-text-secondary\">\n                        {insight.description}\n                      </p>\n                      {insight.recommendation && (\n                        <p className=\"mt-2 text-xs text-primary\">\n                          {insight.recommendation}\n                        </p>\n                      )}\n                    </li>\n                  ),\n                )}\n              </ul>\n            )}\n          </GlassCard>\n        </div>\n      </div>\n    </PageLayout>\n  );\n}\n"],"mappings":"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"}

package/dist/timecampus/pages/team/TeamMembersPage.js

@@ -1,127 +1,188 @@
 import { useTimeCampus as e, useTimeCampusNavigate as t } from "../../providers/TimeCampusProvider.js";
-import { formatHours as n } from "../../utils/helpers.js";
-import { LoadingSkeleton as r } from "../../components/LoadingSkeleton.js";
-import { useListTimeEntriesQuery as i } from "../../../generated/wspace-operations.js";
-import { PageLayout as a } from "../../components/PageLayout.js";
-import { EmptyState as o } from "../../components/EmptyState.js";
-import { Modal as s } from "../../components/Modal.js";
-import { useState as c } from "react";
-import { Activity as l, Plus as u, Users as d } from "lucide-react";
-import { Fragment as f, jsx as p, jsxs as m } from "react/jsx-runtime";
-import { GlassCard as h } from "@burdenoff/fe-libs/ui";
+import { formatHours as n, getInitials as r } from "../../utils/helpers.js";
+import { StatCard as i } from "../../components/StatCard.js";
+import { LoadingSkeleton as a } from "../../components/LoadingSkeleton.js";
+import { useListTimeEntriesQuery as o } from "../../../generated/wspace-operations.js";
+import { PageLayout as s } from "../../components/PageLayout.js";
+import { EmptyState as c } from "../../components/EmptyState.js";
+import { ChartCard as l } from "../../components/ChartCard.js";
+import { Modal as u } from "../../components/Modal.js";
+import { BarsChart as d } from "../../components/charts/BarsChart.js";
+import "../../components/index.js";
+import { useState as f } from "react";
+import { Activity as p, Clock as m, FolderKanban as h, Plus as g } from "lucide-react";
+import { Fragment as _, jsx as v, jsxs as y } from "react/jsx-runtime";
+import { GlassCard as b } from "@burdenoff/fe-libs/ui";
 //#region src/timecampus/pages/team/TeamMembersPage.tsx
-function g() {
-	let { workspaceId: g = "" } = e(), _ = t(), [v, y] = c(!1), b = /* @__PURE__ */ m("button", {
-		onClick: () => y(!0),
+var x = (e) => `${Number.isInteger(e) ? e : e.toFixed(1)}h`;
+function S() {
+	let { workspaceId: S = "" } = e(), C = t(), [w, T] = f(!1), E = /* @__PURE__ */ y("button", {
+		onClick: () => T(!0),
 		className: "inline-flex items-center gap-1.5 rounded-md bg-action-primary-bg px-3 py-2 text-sm font-medium text-action-primary-text hover:bg-action-primary-bg/90",
-		children: [/* @__PURE__ */ p(u, { className: "h-4 w-4" }), "Invite Member"]
-	}), { data: x, loading: S, error: C } = i({
+		children: [/* @__PURE__ */ v(g, { className: "h-4 w-4" }), "Invite Member"]
+	}), { data: D, loading: O, error: k } = o({
 		variables: { limit: 100 },
-		skip: !g
-	}), w = (x?.timeEntries?.items ?? []).reduce((e, t) => {
+		skip: !S
+	}), A = D?.timeEntries?.items ?? [], j = A.reduce((e, t) => {
 		let n = t.project?.name ?? "Unassigned", r = t.projectId ?? "unassigned";
 		return e[r] || (e[r] = {
 			name: n,
 			totalHours: 0,
 			entries: 0
 		}), e[r].totalHours += (t.duration ?? 0) / 3600, e[r].entries += 1, e;
-	}, {}), T = Object.entries(w).map(([e, t]) => ({
+	}, {}), M = Object.entries(j).map(([e, t]) => ({
 		id: e,
 		...t
-	})).sort((e, t) => t.totalHours - e.totalHours);
-	return S ? /* @__PURE__ */ p(a, {
+	})).sort((e, t) => t.totalHours - e.totalHours), N = M.reduce((e, t) => e + t.totalHours, 0), P = M.slice(0, 8).map((e) => ({
+		name: e.name,
+		hours: Math.round(e.totalHours * 10) / 10
+	}));
+	return O ? /* @__PURE__ */ v(s, {
 		title: "Team Members",
 		description: "Manage team members and roles",
-		actions: b,
-		children: /* @__PURE__ */ p(r, {
+		actions: E,
+		children: /* @__PURE__ */ v(a, {
 			variant: "list",
 			count: 5
 		})
-	}) : C ? /* @__PURE__ */ p(a, {
+	}) : k ? /* @__PURE__ */ v(s, {
 		title: "Team Members",
 		description: "Manage team members and roles",
-		children: /* @__PURE__ */ p("div", {
+		children: /* @__PURE__ */ v("div", {
 			className: "rounded-lg border border-status-error-bg/40 bg-status-error-bg p-4 text-sm text-status-error-text",
 			children: "Failed to load team data. Please try again later."
 		})
-	}) : /* @__PURE__ */ m(a, {
+	}) : /* @__PURE__ */ y(s, {
 		title: "Team Members",
 		description: "Manage team members and roles",
 		purpose: "Understand how effort is distributed across your team and projects — use it to spot who's overloaded, where time is concentrated, and when to invite or reassign people.",
-		actions: b,
-		children: [
-			/* @__PURE__ */ p("div", {
-				className: "mb-4 rounded-lg border border-status-warning-bg/40 bg-status-warning-bg p-3 text-xs text-status-warning-text",
+		actions: E,
+		children: [/* @__PURE__ */ y("div", {
+			className: "space-y-6",
+			children: [/* @__PURE__ */ v("div", {
+				className: "rounded-lg border border-status-warning-bg/40 bg-status-warning-bg p-3 text-xs text-status-warning-text",
 				children: "Team member data is managed by the groups module. Showing time entry activity by project."
-			}),
-			T.length === 0 ? /* @__PURE__ */ p(o, {
+			}), M.length === 0 ? /* @__PURE__ */ v(c, {
 				illustration: "empty-people",
 				title: "No time entry data available",
 				description: "Once your team starts tracking time, their activity by project shows up here."
-			}) : /* @__PURE__ */ p(h, {
-				treatment: "glass",
-				glow: !0,
-				className: "overflow-hidden",
-				children: /* @__PURE__ */ p("div", {
-					className: "divide-y divide-border",
-					children: T.map((e) => /* @__PURE__ */ m("div", {
-						className: "flex items-center justify-between p-4 hover:bg-bg-sunken/50 transition-colors",
-						children: [/* @__PURE__ */ m("div", {
-							className: "flex items-center gap-3",
-							children: [/* @__PURE__ */ p("div", {
-								className: "flex h-9 w-9 items-center justify-center rounded-full bg-action-primary-bg/10 text-sm font-medium text-primary",
-								children: /* @__PURE__ */ p(d, { className: "h-4 w-4" })
-							}), /* @__PURE__ */ m("div", { children: [/* @__PURE__ */ p("p", {
-								className: "text-sm font-medium text-text-primary",
-								children: e.name
-							}), /* @__PURE__ */ m("p", {
-								className: "text-xs text-text-secondary",
-								children: [e.entries, " time entries"]
-							})] })]
-						}), /* @__PURE__ */ m("div", {
-							className: "flex items-center gap-4",
-							children: [/* @__PURE__ */ m("div", {
-								className: "text-right",
-								children: [/* @__PURE__ */ p("p", {
-									className: "text-sm font-medium text-text-primary",
-									children: n(e.totalHours)
-								}), /* @__PURE__ */ p("p", {
-									className: "text-xs text-text-secondary",
-									children: "total tracked"
+			}) : /* @__PURE__ */ y(_, { children: [
+				/* @__PURE__ */ y("div", {
+					className: "grid grid-cols-1 gap-4 sm:grid-cols-3",
+					children: [
+						/* @__PURE__ */ v(i, {
+							featured: !0,
+							title: "Active Projects",
+							value: String(M.length),
+							icon: /* @__PURE__ */ v(h, { className: "h-5 w-5" })
+						}),
+						/* @__PURE__ */ v(i, {
+							title: "Tracked Hours",
+							value: x(Math.round(N)),
+							icon: /* @__PURE__ */ v(m, { className: "h-5 w-5" })
+						}),
+						/* @__PURE__ */ v(i, {
+							title: "Time Entries",
+							value: String(A.length),
+							icon: /* @__PURE__ */ v(p, { className: "h-5 w-5" }),
+							iconBgColor: "bg-status-success-bg text-status-success-text"
+						})
+					]
+				}),
+				/* @__PURE__ */ v(l, {
+					title: "Hours by Project",
+					description: "Where the team's tracked time is concentrated.",
+					children: /* @__PURE__ */ v(d, {
+						data: P,
+						xKey: "name",
+						orientation: "horizontal",
+						categoryWidth: 132,
+						height: Math.max(180, P.length * 44),
+						valueFormat: x,
+						series: [{
+							key: "hours",
+							label: "Hours"
+						}],
+						emptyLabel: "No tracked hours yet"
+					})
+				}),
+				/* @__PURE__ */ v(b, {
+					treatment: "glass",
+					glow: !0,
+					className: "overflow-hidden",
+					children: /* @__PURE__ */ v("div", {
+						className: "divide-y divide-border",
+						children: M.map((e, t) => {
+							let i = N > 0 ? Math.round(e.totalHours / N * 100) : 0;
+							return /* @__PURE__ */ y("div", {
+								className: "p-4 transition-colors hover:bg-bg-sunken/50",
+								children: [/* @__PURE__ */ y("div", {
+									className: "flex items-center justify-between gap-4",
+									children: [/* @__PURE__ */ y("div", {
+										className: "flex min-w-0 items-center gap-3",
+										children: [/* @__PURE__ */ v("div", {
+											className: "flex h-9 w-9 shrink-0 items-center justify-center rounded-full bg-action-primary-bg/10 text-xs font-semibold uppercase text-primary",
+											children: r(e.name)
+										}), /* @__PURE__ */ y("div", {
+											className: "min-w-0",
+											children: [/* @__PURE__ */ v("p", {
+												className: "truncate text-sm font-medium text-text-primary",
+												children: e.name
+											}), /* @__PURE__ */ y("p", {
+												className: "text-xs text-text-secondary",
+												children: [
+													e.entries,
+													" time entries",
+													t === 0 && N > 0 ? " · top project" : ""
+												]
+											})]
+										})]
+									}), /* @__PURE__ */ y("div", {
+										className: "shrink-0 text-right",
+										children: [/* @__PURE__ */ v("p", {
+											className: "text-sm font-medium tabular-nums text-text-primary",
+											children: n(e.totalHours)
+										}), /* @__PURE__ */ y("p", {
+											className: "text-xs text-text-secondary",
+											children: [i, "% of tracked"]
+										})]
+									})]
+								}), /* @__PURE__ */ v("div", {
+									className: "mt-3 h-1.5 w-full overflow-hidden rounded-full bg-bg-sunken",
+									children: /* @__PURE__ */ v("div", {
+										className: "h-full rounded-full bg-action-primary-bg motion-safe:transition-[width] motion-safe:duration-500",
+										style: { width: `${i}%` }
+									})
 								})]
-							}), /* @__PURE__ */ p("span", {
-								className: "inline-flex rounded-full bg-status-success-bg px-2 py-0.5 text-xs font-medium text-status-success-text",
-								children: "active"
-							})]
-						})]
-					}, e.id))
-				})
-			}),
-			/* @__PURE__ */ p(s, {
-				open: v,
-				onClose: () => y(!1),
-				title: "Managing Team Members",
-				description: "How people are added to this workspace.",
-				footer: /* @__PURE__ */ m(f, { children: [/* @__PURE__ */ p("button", {
-					onClick: () => y(!1),
-					className: "rounded-md border border-border-subtle px-4 py-2 text-sm font-medium text-text-primary hover:bg-bg-sunken/50",
-					children: "Close"
-				}), /* @__PURE__ */ m("button", {
-					onClick: () => {
-						y(!1), _("/team-activity");
-					},
-					className: "inline-flex items-center gap-1.5 rounded-md bg-action-primary-bg px-4 py-2 text-sm font-medium text-action-primary-text hover:bg-action-primary-bg/90",
-					children: [/* @__PURE__ */ p(l, { className: "h-4 w-4" }), "View Team Activity"]
-				})] }),
-				children: /* @__PURE__ */ p("p", {
-					className: "text-sm text-text-secondary",
-					children: "Team membership and roles are managed centrally by your workspace People & Groups administration, so invitations are sent from there. Once members join and start tracking time, their activity by project appears on this page and in the live team activity view."
+							}, e.id);
+						})
+					})
 				})
+			] })]
+		}), /* @__PURE__ */ v(u, {
+			open: w,
+			onClose: () => T(!1),
+			title: "Managing Team Members",
+			description: "How people are added to this workspace.",
+			footer: /* @__PURE__ */ y(_, { children: [/* @__PURE__ */ v("button", {
+				onClick: () => T(!1),
+				className: "rounded-md border border-border-subtle px-4 py-2 text-sm font-medium text-text-primary hover:bg-bg-sunken/50",
+				children: "Close"
+			}), /* @__PURE__ */ y("button", {
+				onClick: () => {
+					T(!1), C("/team-activity");
+				},
+				className: "inline-flex items-center gap-1.5 rounded-md bg-action-primary-bg px-4 py-2 text-sm font-medium text-action-primary-text hover:bg-action-primary-bg/90",
+				children: [/* @__PURE__ */ v(p, { className: "h-4 w-4" }), "View Team Activity"]
+			})] }),
+			children: /* @__PURE__ */ v("p", {
+				className: "text-sm text-text-secondary",
+				children: "Team membership and roles are managed centrally by your workspace People & Groups administration, so invitations are sent from there. Once members join and start tracking time, their activity by project appears on this page and in the live team activity view."
 			})
-		]
+		})]
 	});
 }
 //#endregion
-export { g as TeamMembersPage };
+export { S as TeamMembersPage };
 
 //# sourceMappingURL=TeamMembersPage.js.map

package/dist/timecampus/pages/team/TeamMembersPage.js.map

@@ -1 +1 @@
-{"version":3,"file":"TeamMembersPage.js","names":[],"sources":["../../../../src/timecampus/pages/team/TeamMembersPage.tsx"],"sourcesContent":["import { useState } from \"react\";\nimport { Users, Plus, Activity } from \"lucide-react\";\nimport { GlassCard } from \"@burdenoff/fe-libs/ui\";\nimport { PageLayout } from \"../../components/PageLayout\";\nimport { EmptyState } from \"../../components/EmptyState\";\nimport { LoadingSkeleton } from \"../../components/LoadingSkeleton\";\nimport { Modal } from \"../../components/Modal\";\nimport { formatHours } from \"../../utils/helpers\";\nimport {\n  useTimeCampus,\n  useTimeCampusNavigate,\n} from \"../../providers/TimeCampusProvider\";\nimport {\n  useListTimeEntriesQuery,\n  type TimeEntryFieldsFragment,\n} from \"@/generated/wspace-operations\";\n\nexport function TeamMembersPage() {\n  const { workspaceId = \"\" } = useTimeCampus();\n  const navigate = useTimeCampusNavigate();\n  const [inviteInfoOpen, setInviteInfoOpen] = useState(false);\n\n  const inviteButton = (\n    <button\n      onClick={() => setInviteInfoOpen(true)}\n      className=\"inline-flex items-center gap-1.5 rounded-md bg-action-primary-bg px-3 py-2 text-sm font-medium text-action-primary-text hover:bg-action-primary-bg/90\"\n    >\n      <Plus className=\"h-4 w-4\" />\n      Invite Member\n    </button>\n  );\n\n  const { data, loading, error } = useListTimeEntriesQuery({\n    variables: { limit: 100 },\n    skip: !workspaceId,\n  });\n\n  const entries = data?.timeEntries?.items ?? [];\n\n  // Group time entries by project to show team activity (member data comes from groups module)\n  const projectSummary = entries.reduce<\n    Record<string, { name: string; totalHours: number; entries: number }>\n  >(\n    (\n      acc: Record<\n        string,\n        { name: string; totalHours: number; entries: number }\n      >,\n      entry: TimeEntryFieldsFragment,\n    ) => {\n      const projectName = entry.project?.name ?? \"Unassigned\";\n      const projectId = entry.projectId ?? \"unassigned\";\n      if (!acc[projectId]) {\n        acc[projectId] = { name: projectName, totalHours: 0, entries: 0 };\n      }\n      acc[projectId].totalHours += (entry.duration ?? 0) / 3600;\n      acc[projectId].entries += 1;\n      return acc;\n    },\n    {},\n  );\n\n  const summaryList = Object.entries(projectSummary)\n    .map(([id, info]) => ({\n      id,\n      ...(info as { name: string; totalHours: number; entries: number }),\n    }))\n    .sort((a, b) => b.totalHours - a.totalHours);\n\n  if (loading) {\n    return (\n      <PageLayout\n        title=\"Team Members\"\n        description=\"Manage team members and roles\"\n        actions={inviteButton}\n      >\n        <LoadingSkeleton variant=\"list\" count={5} />\n      </PageLayout>\n    );\n  }\n\n  if (error) {\n    return (\n      <PageLayout\n        title=\"Team Members\"\n        description=\"Manage team members and roles\"\n      >\n        <div className=\"rounded-lg border border-status-error-bg/40 bg-status-error-bg p-4 text-sm text-status-error-text\">\n          Failed to load team data. Please try again later.\n        </div>\n      </PageLayout>\n    );\n  }\n\n  return (\n    <PageLayout\n      title=\"Team Members\"\n      description=\"Manage team members and roles\"\n      purpose=\"Understand how effort is distributed across your team and projects — use it to spot who's overloaded, where time is concentrated, and when to invite or reassign people.\"\n      actions={inviteButton}\n    >\n      <div className=\"mb-4 rounded-lg border border-status-warning-bg/40 bg-status-warning-bg p-3 text-xs text-status-warning-text\">\n        Team member data is managed by the groups module. Showing time entry\n        activity by project.\n      </div>\n      {summaryList.length === 0 ? (\n        <EmptyState\n          illustration=\"empty-people\"\n          title=\"No time entry data available\"\n          description=\"Once your team starts tracking time, their activity by project shows up here.\"\n        />\n      ) : (\n        <GlassCard treatment=\"glass\" glow className=\"overflow-hidden\">\n          <div className=\"divide-y divide-border\">\n            {summaryList.map((project) => (\n              <div\n                key={project.id}\n                className=\"flex items-center justify-between p-4 hover:bg-bg-sunken/50 transition-colors\"\n              >\n                <div className=\"flex items-center gap-3\">\n                  <div className=\"flex h-9 w-9 items-center justify-center rounded-full bg-action-primary-bg/10 text-sm font-medium text-primary\">\n                    <Users className=\"h-4 w-4\" />\n                  </div>\n                  <div>\n                    <p className=\"text-sm font-medium text-text-primary\">\n                      {project.name}\n                    </p>\n                    <p className=\"text-xs text-text-secondary\">\n                      {project.entries} time entries\n                    </p>\n                  </div>\n                </div>\n                <div className=\"flex items-center gap-4\">\n                  <div className=\"text-right\">\n                    <p className=\"text-sm font-medium text-text-primary\">\n                      {formatHours(project.totalHours)}\n                    </p>\n                    <p className=\"text-xs text-text-secondary\">total tracked</p>\n                  </div>\n                  <span className=\"inline-flex rounded-full bg-status-success-bg px-2 py-0.5 text-xs font-medium text-status-success-text\">\n                    active\n                  </span>\n                </div>\n              </div>\n            ))}\n          </div>\n        </GlassCard>\n      )}\n\n      <Modal\n        open={inviteInfoOpen}\n        onClose={() => setInviteInfoOpen(false)}\n        title=\"Managing Team Members\"\n        description=\"How people are added to this workspace.\"\n        footer={\n          <>\n            <button\n              onClick={() => setInviteInfoOpen(false)}\n              className=\"rounded-md border border-border-subtle px-4 py-2 text-sm font-medium text-text-primary hover:bg-bg-sunken/50\"\n            >\n              Close\n            </button>\n            <button\n              onClick={() => {\n                setInviteInfoOpen(false);\n                navigate(\"/team-activity\");\n              }}\n              className=\"inline-flex items-center gap-1.5 rounded-md bg-action-primary-bg px-4 py-2 text-sm font-medium text-action-primary-text hover:bg-action-primary-bg/90\"\n            >\n              <Activity className=\"h-4 w-4\" />\n              View Team Activity\n            </button>\n          </>\n        }\n      >\n        <p className=\"text-sm text-text-secondary\">\n          Team membership and roles are managed centrally by your workspace\n          People &amp; Groups administration, so invitations are sent from\n          there. Once members join and start tracking time, their activity by\n          project appears on this page and in the live team activity view.\n        </p>\n      </Modal>\n    </PageLayout>\n  );\n}\n"],"mappings":"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"}
+{"version":3,"file":"TeamMembersPage.js","names":[],"sources":["../../../../src/timecampus/pages/team/TeamMembersPage.tsx"],"sourcesContent":["import { useState } from \"react\";\nimport { Plus, Activity, FolderKanban, Clock } from \"lucide-react\";\nimport { GlassCard } from \"@burdenoff/fe-libs/ui\";\nimport {\n  PageLayout,\n  StatCard,\n  ChartCard,\n  EmptyState,\n  LoadingSkeleton,\n  Modal,\n  BarsChart,\n} from \"../../components\";\nimport { formatHours, getInitials } from \"../../utils/helpers\";\nimport {\n  useTimeCampus,\n  useTimeCampusNavigate,\n} from \"../../providers/TimeCampusProvider\";\nimport {\n  useListTimeEntriesQuery,\n  type TimeEntryFieldsFragment,\n} from \"@/generated/wspace-operations\";\n\nconst formatHrs = (v: number): string =>\n  `${Number.isInteger(v) ? v : v.toFixed(1)}h`;\n\nexport function TeamMembersPage() {\n  const { workspaceId = \"\" } = useTimeCampus();\n  const navigate = useTimeCampusNavigate();\n  const [inviteInfoOpen, setInviteInfoOpen] = useState(false);\n\n  const inviteButton = (\n    <button\n      onClick={() => setInviteInfoOpen(true)}\n      className=\"inline-flex items-center gap-1.5 rounded-md bg-action-primary-bg px-3 py-2 text-sm font-medium text-action-primary-text hover:bg-action-primary-bg/90\"\n    >\n      <Plus className=\"h-4 w-4\" />\n      Invite Member\n    </button>\n  );\n\n  const { data, loading, error } = useListTimeEntriesQuery({\n    variables: { limit: 100 },\n    skip: !workspaceId,\n  });\n\n  const entries = data?.timeEntries?.items ?? [];\n\n  // Group time entries by project to show team activity (member data comes from groups module)\n  const projectSummary = entries.reduce<\n    Record<string, { name: string; totalHours: number; entries: number }>\n  >(\n    (\n      acc: Record<\n        string,\n        { name: string; totalHours: number; entries: number }\n      >,\n      entry: TimeEntryFieldsFragment,\n    ) => {\n      const projectName = entry.project?.name ?? \"Unassigned\";\n      const projectId = entry.projectId ?? \"unassigned\";\n      if (!acc[projectId]) {\n        acc[projectId] = { name: projectName, totalHours: 0, entries: 0 };\n      }\n      acc[projectId].totalHours += (entry.duration ?? 0) / 3600;\n      acc[projectId].entries += 1;\n      return acc;\n    },\n    {},\n  );\n\n  const summaryList = Object.entries(projectSummary)\n    .map(([id, info]) => ({\n      id,\n      ...(info as { name: string; totalHours: number; entries: number }),\n    }))\n    .sort((a, b) => b.totalHours - a.totalHours);\n\n  const grandTotalHours = summaryList.reduce(\n    (sum, project) => sum + project.totalHours,\n    0,\n  );\n\n  const hoursByProject = summaryList.slice(0, 8).map((project) => ({\n    name: project.name,\n    hours: Math.round(project.totalHours * 10) / 10,\n  }));\n\n  if (loading) {\n    return (\n      <PageLayout\n        title=\"Team Members\"\n        description=\"Manage team members and roles\"\n        actions={inviteButton}\n      >\n        <LoadingSkeleton variant=\"list\" count={5} />\n      </PageLayout>\n    );\n  }\n\n  if (error) {\n    return (\n      <PageLayout\n        title=\"Team Members\"\n        description=\"Manage team members and roles\"\n      >\n        <div className=\"rounded-lg border border-status-error-bg/40 bg-status-error-bg p-4 text-sm text-status-error-text\">\n          Failed to load team data. Please try again later.\n        </div>\n      </PageLayout>\n    );\n  }\n\n  return (\n    <PageLayout\n      title=\"Team Members\"\n      description=\"Manage team members and roles\"\n      purpose=\"Understand how effort is distributed across your team and projects — use it to spot who's overloaded, where time is concentrated, and when to invite or reassign people.\"\n      actions={inviteButton}\n    >\n      <div className=\"space-y-6\">\n        <div className=\"rounded-lg border border-status-warning-bg/40 bg-status-warning-bg p-3 text-xs text-status-warning-text\">\n          Team member data is managed by the groups module. Showing time entry\n          activity by project.\n        </div>\n\n        {summaryList.length === 0 ? (\n          <EmptyState\n            illustration=\"empty-people\"\n            title=\"No time entry data available\"\n            description=\"Once your team starts tracking time, their activity by project shows up here.\"\n          />\n        ) : (\n          <>\n            <div className=\"grid grid-cols-1 gap-4 sm:grid-cols-3\">\n              <StatCard\n                featured\n                title=\"Active Projects\"\n                value={String(summaryList.length)}\n                icon={<FolderKanban className=\"h-5 w-5\" />}\n              />\n              <StatCard\n                title=\"Tracked Hours\"\n                value={formatHrs(Math.round(grandTotalHours))}\n                icon={<Clock className=\"h-5 w-5\" />}\n              />\n              <StatCard\n                title=\"Time Entries\"\n                value={String(entries.length)}\n                icon={<Activity className=\"h-5 w-5\" />}\n                iconBgColor=\"bg-status-success-bg text-status-success-text\"\n              />\n            </div>\n\n            <ChartCard\n              title=\"Hours by Project\"\n              description=\"Where the team's tracked time is concentrated.\"\n            >\n              <BarsChart\n                data={hoursByProject}\n                xKey=\"name\"\n                orientation=\"horizontal\"\n                categoryWidth={132}\n                height={Math.max(180, hoursByProject.length * 44)}\n                valueFormat={formatHrs}\n                series={[{ key: \"hours\", label: \"Hours\" }]}\n                emptyLabel=\"No tracked hours yet\"\n              />\n            </ChartCard>\n\n            <GlassCard treatment=\"glass\" glow className=\"overflow-hidden\">\n              <div className=\"divide-y divide-border\">\n                {summaryList.map((project, index) => {\n                  const sharePct =\n                    grandTotalHours > 0\n                      ? Math.round((project.totalHours / grandTotalHours) * 100)\n                      : 0;\n                  return (\n                    <div\n                      key={project.id}\n                      className=\"p-4 transition-colors hover:bg-bg-sunken/50\"\n                    >\n                      <div className=\"flex items-center justify-between gap-4\">\n                        <div className=\"flex min-w-0 items-center gap-3\">\n                          <div className=\"flex h-9 w-9 shrink-0 items-center justify-center rounded-full bg-action-primary-bg/10 text-xs font-semibold uppercase text-primary\">\n                            {getInitials(project.name)}\n                          </div>\n                          <div className=\"min-w-0\">\n                            <p className=\"truncate text-sm font-medium text-text-primary\">\n                              {project.name}\n                            </p>\n                            <p className=\"text-xs text-text-secondary\">\n                              {project.entries} time entries\n                              {index === 0 && grandTotalHours > 0\n                                ? \" · top project\"\n                                : \"\"}\n                            </p>\n                          </div>\n                        </div>\n                        <div className=\"shrink-0 text-right\">\n                          <p className=\"text-sm font-medium tabular-nums text-text-primary\">\n                            {formatHours(project.totalHours)}\n                          </p>\n                          <p className=\"text-xs text-text-secondary\">\n                            {sharePct}% of tracked\n                          </p>\n                        </div>\n                      </div>\n                      <div className=\"mt-3 h-1.5 w-full overflow-hidden rounded-full bg-bg-sunken\">\n                        <div\n                          className=\"h-full rounded-full bg-action-primary-bg motion-safe:transition-[width] motion-safe:duration-500\"\n                          style={{ width: `${sharePct}%` }}\n                        />\n                      </div>\n                    </div>\n                  );\n                })}\n              </div>\n            </GlassCard>\n          </>\n        )}\n      </div>\n\n      <Modal\n        open={inviteInfoOpen}\n        onClose={() => setInviteInfoOpen(false)}\n        title=\"Managing Team Members\"\n        description=\"How people are added to this workspace.\"\n        footer={\n          <>\n            <button\n              onClick={() => setInviteInfoOpen(false)}\n              className=\"rounded-md border border-border-subtle px-4 py-2 text-sm font-medium text-text-primary hover:bg-bg-sunken/50\"\n            >\n              Close\n            </button>\n            <button\n              onClick={() => {\n                setInviteInfoOpen(false);\n                navigate(\"/team-activity\");\n              }}\n              className=\"inline-flex items-center gap-1.5 rounded-md bg-action-primary-bg px-4 py-2 text-sm font-medium text-action-primary-text hover:bg-action-primary-bg/90\"\n            >\n              <Activity className=\"h-4 w-4\" />\n              View Team Activity\n            </button>\n          </>\n        }\n      >\n        <p className=\"text-sm text-text-secondary\">\n          Team membership and roles are managed centrally by your workspace\n          People &amp; Groups administration, so invitations are sent from\n          there. Once members join and start tracking time, their activity by\n          project appears on this page and in the live team activity view.\n        </p>\n      </Modal>\n    </PageLayout>\n  );\n}\n"],"mappings":";;;;;;;;;;;;;;;;AAsBA,IAAM,KAAa,MACjB,GAAG,OAAO,UAAU,EAAE,GAAG,IAAI,EAAE,QAAQ,EAAE,CAAC;AAE5C,SAAgB,IAAkB;CAChC,IAAM,EAAE,iBAAc,OAAO,GAAe,EACtC,IAAW,GAAuB,EAClC,CAAC,GAAgB,KAAqB,EAAS,GAAM,EAErD,IACJ,kBAAC,UAAD;EACE,eAAe,EAAkB,GAAK;EACtC,WAAU;YAFZ,CAIE,kBAAC,GAAD,EAAM,WAAU,WAAY,CAAA,EAAA,gBAErB;KAGL,EAAE,SAAM,YAAS,aAAU,EAAwB;EACvD,WAAW,EAAE,OAAO,KAAK;EACzB,MAAM,CAAC;EACR,CAAC,EAEI,IAAU,GAAM,aAAa,SAAS,EAAE,EAGxC,IAAiB,EAAQ,QAI3B,GAIA,MACG;EACH,IAAM,IAAc,EAAM,SAAS,QAAQ,cACrC,IAAY,EAAM,aAAa;AAMrC,SALK,EAAI,OACP,EAAI,KAAa;GAAE,MAAM;GAAa,YAAY;GAAG,SAAS;GAAG,GAEnE,EAAI,GAAW,eAAe,EAAM,YAAY,KAAK,MACrD,EAAI,GAAW,WAAW,GACnB;IAET,EAAE,CACH,EAEK,IAAc,OAAO,QAAQ,EAAe,CAC/C,KAAK,CAAC,GAAI,QAAW;EACpB;EACA,GAAI;EACL,EAAE,CACF,MAAM,GAAG,MAAM,EAAE,aAAa,EAAE,WAAW,EAExC,IAAkB,EAAY,QACjC,GAAK,MAAY,IAAM,EAAQ,YAChC,EACD,EAEK,IAAiB,EAAY,MAAM,GAAG,EAAE,CAAC,KAAK,OAAa;EAC/D,MAAM,EAAQ;EACd,OAAO,KAAK,MAAM,EAAQ,aAAa,GAAG,GAAG;EAC9C,EAAE;AA2BH,QAzBI,IAEA,kBAAC,GAAD;EACE,OAAM;EACN,aAAY;EACZ,SAAS;YAET,kBAAC,GAAD;GAAiB,SAAQ;GAAO,OAAO;GAAK,CAAA;EACjC,CAAA,GAIb,IAEA,kBAAC,GAAD;EACE,OAAM;EACN,aAAY;YAEZ,kBAAC,OAAD;GAAK,WAAU;aAAoG;GAE7G,CAAA;EACK,CAAA,GAKf,kBAAC,GAAD;EACE,OAAM;EACN,aAAY;EACZ,SAAQ;EACR,SAAS;YAJX,CAME,kBAAC,OAAD;GAAK,WAAU;aAAf,CACE,kBAAC,OAAD;IAAK,WAAU;cAA0G;IAGnH,CAAA,EAEL,EAAY,WAAW,IACtB,kBAAC,GAAD;IACE,cAAa;IACb,OAAM;IACN,aAAY;IACZ,CAAA,GAEF,kBAAA,GAAA,EAAA,UAAA;IACE,kBAAC,OAAD;KAAK,WAAU;eAAf;MACE,kBAAC,GAAD;OACE,UAAA;OACA,OAAM;OACN,OAAO,OAAO,EAAY,OAAO;OACjC,MAAM,kBAAC,GAAD,EAAc,WAAU,WAAY,CAAA;OAC1C,CAAA;MACF,kBAAC,GAAD;OACE,OAAM;OACN,OAAO,EAAU,KAAK,MAAM,EAAgB,CAAC;OAC7C,MAAM,kBAAC,GAAD,EAAO,WAAU,WAAY,CAAA;OACnC,CAAA;MACF,kBAAC,GAAD;OACE,OAAM;OACN,OAAO,OAAO,EAAQ,OAAO;OAC7B,MAAM,kBAAC,GAAD,EAAU,WAAU,WAAY,CAAA;OACtC,aAAY;OACZ,CAAA;MACE;;IAEN,kBAAC,GAAD;KACE,OAAM;KACN,aAAY;eAEZ,kBAAC,GAAD;MACE,MAAM;MACN,MAAK;MACL,aAAY;MACZ,eAAe;MACf,QAAQ,KAAK,IAAI,KAAK,EAAe,SAAS,GAAG;MACjD,aAAa;MACb,QAAQ,CAAC;OAAE,KAAK;OAAS,OAAO;OAAS,CAAC;MAC1C,YAAW;MACX,CAAA;KACQ,CAAA;IAEZ,kBAAC,GAAD;KAAW,WAAU;KAAQ,MAAA;KAAK,WAAU;eAC1C,kBAAC,OAAD;MAAK,WAAU;gBACZ,EAAY,KAAK,GAAS,MAAU;OACnC,IAAM,IACJ,IAAkB,IACd,KAAK,MAAO,EAAQ,aAAa,IAAmB,IAAI,GACxD;AACN,cACE,kBAAC,OAAD;QAEE,WAAU;kBAFZ,CAIE,kBAAC,OAAD;SAAK,WAAU;mBAAf,CACE,kBAAC,OAAD;UAAK,WAAU;oBAAf,CACE,kBAAC,OAAD;WAAK,WAAU;qBACZ,EAAY,EAAQ,KAAK;WACtB,CAAA,EACN,kBAAC,OAAD;WAAK,WAAU;qBAAf,CACE,kBAAC,KAAD;YAAG,WAAU;sBACV,EAAQ;YACP,CAAA,EACJ,kBAAC,KAAD;YAAG,WAAU;sBAAb;aACG,EAAQ;aAAQ;aAChB,MAAU,KAAK,IAAkB,IAC9B,mBACA;aACF;cACA;aACF;aACN,kBAAC,OAAD;UAAK,WAAU;oBAAf,CACE,kBAAC,KAAD;WAAG,WAAU;qBACV,EAAY,EAAQ,WAAW;WAC9B,CAAA,EACJ,kBAAC,KAAD;WAAG,WAAU;qBAAb,CACG,GAAS,eACR;aACA;YACF;YACN,kBAAC,OAAD;SAAK,WAAU;mBACb,kBAAC,OAAD;UACE,WAAU;UACV,OAAO,EAAE,OAAO,GAAG,EAAS,IAAI;UAChC,CAAA;SACE,CAAA,CACF;UAnCC,EAAQ,GAmCT;QAER;MACE,CAAA;KACI,CAAA;IACX,EAAA,CAAA,CAED;MAEN,kBAAC,GAAD;GACE,MAAM;GACN,eAAe,EAAkB,GAAM;GACvC,OAAM;GACN,aAAY;GACZ,QACE,kBAAA,GAAA,EAAA,UAAA,CACE,kBAAC,UAAD;IACE,eAAe,EAAkB,GAAM;IACvC,WAAU;cACX;IAEQ,CAAA,EACT,kBAAC,UAAD;IACE,eAAe;AAEb,KADA,EAAkB,GAAM,EACxB,EAAS,iBAAiB;;IAE5B,WAAU;cALZ,CAOE,kBAAC,GAAD,EAAU,WAAU,WAAY,CAAA,EAAA,qBAEzB;MACR,EAAA,CAAA;aAGL,kBAAC,KAAD;IAAG,WAAU;cAA8B;IAKvC,CAAA;GACE,CAAA,CACG"}