@burdenoff/microfe-timecampus 2026.710.1 → 2026.710.2

package/dist/timecampus/components/charts/BalanceWheel.js

@@ -1,16 +1,11 @@
-import { Tooltip as e } from "../../../node_modules/recharts/es6/component/Tooltip.js";
-import { ResponsiveContainer as t } from "../../../node_modules/recharts/es6/component/ResponsiveContainer.js";
-import { PolarGrid as n } from "../../../node_modules/recharts/es6/polar/PolarGrid.js";
-import { PolarAngleAxis as r } from "../../../node_modules/recharts/es6/polar/PolarAngleAxis.js";
-import { Radar as i } from "../../../node_modules/recharts/es6/polar/Radar.js";
-import { RadarChart as a } from "../../../node_modules/recharts/es6/chart/RadarChart.js";
-import { chartTokens as o, usePrefersReducedMotion as s } from "./chartTheme.js";
-import { ChartEmpty as c, ChartTooltip as l, srOnlyStyle as u } from "./ChartParts.js";
-import { jsx as d, jsxs as f } from "react/jsx-runtime";
+import { chartTokens as e, usePrefersReducedMotion as t } from "./chartTheme.js";
+import { ChartEmpty as n, ChartTooltip as r, srOnlyStyle as i } from "./ChartParts.js";
+import { jsx as a, jsxs as o } from "react/jsx-runtime";
+import { PolarAngleAxis as s, PolarGrid as c, Radar as l, RadarChart as u, ResponsiveContainer as d, Tooltip as f } from "recharts";
 //#region src/timecampus/components/charts/BalanceWheel.tsx
 function p({ data: p, height: m = 320, emptyLabel: h, ariaLabel: g, className: _ }) {
-	let v = s(), y = p.filter((e) => Number.isFinite(e.actualShare) && e.actualShare >= 0), b = y.reduce((e, t) => e + t.actualShare, 0), x = y.some((e) => typeof e.desiredShare == "number" && Number.isFinite(e.desiredShare));
-	if (y.length === 0 || b <= 0) return /* @__PURE__ */ d(c, {
+	let v = t(), y = p.filter((e) => Number.isFinite(e.actualShare) && e.actualShare >= 0), b = y.reduce((e, t) => e + t.actualShare, 0), x = y.some((e) => typeof e.desiredShare == "number" && Number.isFinite(e.desiredShare));
+	if (y.length === 0 || b <= 0) return /* @__PURE__ */ a(n, {
 		height: m,
 		label: h,
 		className: _
@@ -20,47 +15,47 @@ function p({ data: p, height: m = 320, emptyLabel: h, ariaLabel: g, className: _
 		Actual: Math.round(e.actualShare * 1e3) / 10,
 		Desired: typeof e.desiredShare == "number" && Number.isFinite(e.desiredShare) ? Math.round(e.desiredShare * 1e3) / 10 : 0
 	})), C = g ?? `Life balance across ${y.map((e) => e.label).join(", ")}`;
-	return /* @__PURE__ */ f("figure", {
+	return /* @__PURE__ */ o("figure", {
 		role: "img",
 		"aria-label": C,
 		className: _,
 		children: [
-			/* @__PURE__ */ d("div", {
+			/* @__PURE__ */ a("div", {
 				style: { height: m },
-				children: /* @__PURE__ */ d(t, {
+				children: /* @__PURE__ */ a(d, {
 					width: "100%",
 					height: "100%",
-					children: /* @__PURE__ */ f(a, {
+					children: /* @__PURE__ */ o(u, {
 						data: S,
 						outerRadius: "72%",
 						children: [
-							/* @__PURE__ */ d(n, { stroke: o.grid }),
-							/* @__PURE__ */ d(r, {
+							/* @__PURE__ */ a(c, { stroke: e.grid }),
+							/* @__PURE__ */ a(s, {
 								dataKey: "label",
 								tick: {
-									fill: o.textSecondary,
+									fill: e.textSecondary,
 									fontSize: 11
 								}
 							}),
-							/* @__PURE__ */ d(e, {
+							/* @__PURE__ */ a(f, {
 								cursor: !1,
-								content: /* @__PURE__ */ d(l, { valueFormat: (e) => `${e}%` })
+								content: /* @__PURE__ */ a(r, { valueFormat: (e) => `${e}%` })
 							}),
-							x && /* @__PURE__ */ d(i, {
+							x && /* @__PURE__ */ a(l, {
 								name: "Desired",
 								dataKey: "Desired",
-								stroke: o.textMuted,
+								stroke: e.textMuted,
 								strokeDasharray: "4 3",
 								strokeWidth: 1.5,
 								fill: "transparent",
 								isAnimationActive: !v
 							}),
-							/* @__PURE__ */ d(i, {
+							/* @__PURE__ */ a(l, {
 								name: "Actual",
 								dataKey: "Actual",
-								stroke: o.brand,
+								stroke: e.brand,
 								strokeWidth: 2,
-								fill: o.brand,
+								fill: e.brand,
 								fillOpacity: .28,
 								isAnimationActive: !v
 							})
@@ -68,49 +63,49 @@ function p({ data: p, height: m = 320, emptyLabel: h, ariaLabel: g, className: _
 					})
 				})
 			}),
-			/* @__PURE__ */ f("ul", {
+			/* @__PURE__ */ o("ul", {
 				className: "mt-2 flex flex-wrap items-center justify-center gap-x-4 gap-y-1.5 text-xs text-text-secondary",
-				children: [/* @__PURE__ */ f("li", {
+				children: [/* @__PURE__ */ o("li", {
 					className: "flex items-center gap-1.5",
-					children: [/* @__PURE__ */ d("span", {
+					children: [/* @__PURE__ */ a("span", {
 						"aria-hidden": "true",
 						className: "h-2.5 w-2.5 rounded-[3px]",
-						style: { backgroundColor: o.brand }
+						style: { backgroundColor: e.brand }
 					}), "Actual"]
-				}), x && /* @__PURE__ */ f("li", {
+				}), x && /* @__PURE__ */ o("li", {
 					className: "flex items-center gap-1.5",
-					children: [/* @__PURE__ */ d("span", {
+					children: [/* @__PURE__ */ a("span", {
 						"aria-hidden": "true",
 						className: "h-0 w-3.5 border-t-2 border-dashed",
-						style: { borderColor: o.textMuted }
+						style: { borderColor: e.textMuted }
 					}), "Desired"]
 				})]
 			}),
-			/* @__PURE__ */ f("table", {
-				style: u,
+			/* @__PURE__ */ o("table", {
+				style: i,
 				children: [
-					/* @__PURE__ */ d("caption", { children: C }),
-					/* @__PURE__ */ d("thead", { children: /* @__PURE__ */ f("tr", { children: [
-						/* @__PURE__ */ d("th", {
+					/* @__PURE__ */ a("caption", { children: C }),
+					/* @__PURE__ */ a("thead", { children: /* @__PURE__ */ o("tr", { children: [
+						/* @__PURE__ */ a("th", {
 							scope: "col",
 							children: "Domain"
 						}),
-						/* @__PURE__ */ d("th", {
+						/* @__PURE__ */ a("th", {
 							scope: "col",
 							children: "Actual share"
 						}),
-						x && /* @__PURE__ */ d("th", {
+						x && /* @__PURE__ */ a("th", {
 							scope: "col",
 							children: "Desired share"
 						})
 					] }) }),
-					/* @__PURE__ */ d("tbody", { children: y.map((e) => /* @__PURE__ */ f("tr", { children: [
-						/* @__PURE__ */ d("th", {
+					/* @__PURE__ */ a("tbody", { children: y.map((e) => /* @__PURE__ */ o("tr", { children: [
+						/* @__PURE__ */ a("th", {
 							scope: "row",
 							children: e.label
 						}),
-						/* @__PURE__ */ d("td", { children: `${Math.round(e.actualShare * 100)}%` }),
-						x && /* @__PURE__ */ d("td", { children: typeof e.desiredShare == "number" ? `${Math.round(e.desiredShare * 100)}%` : "—" })
+						/* @__PURE__ */ a("td", { children: `${Math.round(e.actualShare * 100)}%` }),
+						x && /* @__PURE__ */ a("td", { children: typeof e.desiredShare == "number" ? `${Math.round(e.desiredShare * 100)}%` : "—" })
 					] }, e.domain)) })
 				]
 			})

package/dist/timecampus/components/charts/BalanceWheel.js.map

@@ -1 +1 @@
-{"version":3,"file":"BalanceWheel.js","names":[],"sources":["../../../../src/timecampus/components/charts/BalanceWheel.tsx"],"sourcesContent":["import {\n  PolarAngleAxis,\n  PolarGrid,\n  Radar,\n  RadarChart,\n  ResponsiveContainer,\n  Tooltip,\n} from \"recharts\";\nimport { chartTokens, usePrefersReducedMotion } from \"./chartTheme\";\nimport { ChartEmpty, ChartTooltip, srOnlyStyle } from \"./ChartParts\";\n\n/** One life-domain axis of the wheel: the actual vs the desired share of time. */\nexport interface BalanceWheelDatum {\n  /** Stable domain key (e.g. \"FAMILY\"). */\n  domain: string;\n  /** Human label shown on the axis (e.g. \"Family\"). */\n  label: string;\n  /** Actual share of covered time, 0..1. */\n  actualShare: number;\n  /** Desired share the user declared, 0..1. Omit when no target is set. */\n  desiredShare?: number | null;\n}\n\nexport interface BalanceWheelProps {\n  data: BalanceWheelDatum[];\n  /** Pixel height of the wheel. Default 320. */\n  height?: number;\n  /** Message when there is no covered time to plot. */\n  emptyLabel?: string;\n  ariaLabel?: string;\n  className?: string;\n}\n\n/**\n * BalanceWheel — the signature life-balance visual: a radar of how your finite\n * time actually splits across life domains (solid brand polygon) overlaid with\n * the balance you said you WANT (dashed muted polygon). The gap between the two\n * is the insight. Token-only, theme-aware, and renders an honest empty state —\n * never a fake polygon — when there is no covered time. Values are real shares\n * passed in by the page; this component never fabricates data.\n */\nexport function BalanceWheel({\n  data,\n  height = 320,\n  emptyLabel,\n  ariaLabel,\n  className,\n}: BalanceWheelProps) {\n  const reducedMotion = usePrefersReducedMotion();\n\n  const rows = data.filter(\n    (d) => Number.isFinite(d.actualShare) && d.actualShare >= 0,\n  );\n  const total = rows.reduce((sum, d) => sum + d.actualShare, 0);\n  const hasDesired = rows.some(\n    (d) =>\n      typeof d.desiredShare === \"number\" && Number.isFinite(d.desiredShare),\n  );\n\n  if (rows.length === 0 || total <= 0) {\n    return (\n      <ChartEmpty height={height} label={emptyLabel} className={className} />\n    );\n  }\n\n  const chartData = rows.map((d) => ({\n    label: d.label,\n    Actual: Math.round(d.actualShare * 1000) / 10,\n    Desired:\n      typeof d.desiredShare === \"number\" && Number.isFinite(d.desiredShare)\n        ? Math.round(d.desiredShare * 1000) / 10\n        : 0,\n  }));\n\n  const label =\n    ariaLabel ?? `Life balance across ${rows.map((d) => d.label).join(\", \")}`;\n\n  return (\n    <figure role=\"img\" aria-label={label} className={className}>\n      <div style={{ height }}>\n        <ResponsiveContainer width=\"100%\" height=\"100%\">\n          <RadarChart data={chartData} outerRadius=\"72%\">\n            <PolarGrid stroke={chartTokens.grid} />\n            <PolarAngleAxis\n              dataKey=\"label\"\n              tick={{ fill: chartTokens.textSecondary, fontSize: 11 }}\n            />\n            <Tooltip\n              cursor={false}\n              content={<ChartTooltip valueFormat={(v) => `${v}%`} />}\n            />\n            {hasDesired && (\n              <Radar\n                name=\"Desired\"\n                dataKey=\"Desired\"\n                stroke={chartTokens.textMuted}\n                strokeDasharray=\"4 3\"\n                strokeWidth={1.5}\n                fill=\"transparent\"\n                isAnimationActive={!reducedMotion}\n              />\n            )}\n            <Radar\n              name=\"Actual\"\n              dataKey=\"Actual\"\n              stroke={chartTokens.brand}\n              strokeWidth={2}\n              fill={chartTokens.brand}\n              fillOpacity={0.28}\n              isAnimationActive={!reducedMotion}\n            />\n          </RadarChart>\n        </ResponsiveContainer>\n      </div>\n\n      <ul className=\"mt-2 flex flex-wrap items-center justify-center gap-x-4 gap-y-1.5 text-xs text-text-secondary\">\n        <li className=\"flex items-center gap-1.5\">\n          <span\n            aria-hidden=\"true\"\n            className=\"h-2.5 w-2.5 rounded-[3px]\"\n            style={{ backgroundColor: chartTokens.brand }}\n          />\n          Actual\n        </li>\n        {hasDesired && (\n          <li className=\"flex items-center gap-1.5\">\n            <span\n              aria-hidden=\"true\"\n              className=\"h-0 w-3.5 border-t-2 border-dashed\"\n              style={{ borderColor: chartTokens.textMuted }}\n            />\n            Desired\n          </li>\n        )}\n      </ul>\n\n      <table style={srOnlyStyle}>\n        <caption>{label}</caption>\n        <thead>\n          <tr>\n            <th scope=\"col\">Domain</th>\n            <th scope=\"col\">Actual share</th>\n            {hasDesired && <th scope=\"col\">Desired share</th>}\n          </tr>\n        </thead>\n        <tbody>\n          {rows.map((d) => (\n            <tr key={d.domain}>\n              <th scope=\"row\">{d.label}</th>\n              <td>{`${Math.round(d.actualShare * 100)}%`}</td>\n              {hasDesired && (\n                <td>\n                  {typeof d.desiredShare === \"number\"\n                    ? `${Math.round(d.desiredShare * 100)}%`\n                    : \"—\"}\n                </td>\n              )}\n            </tr>\n          ))}\n        </tbody>\n      </table>\n    </figure>\n  );\n}\n"],"mappings":"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"}
+{"version":3,"file":"BalanceWheel.js","names":[],"sources":["../../../../src/timecampus/components/charts/BalanceWheel.tsx"],"sourcesContent":["import {\n  PolarAngleAxis,\n  PolarGrid,\n  Radar,\n  RadarChart,\n  ResponsiveContainer,\n  Tooltip,\n} from \"recharts\";\nimport { chartTokens, usePrefersReducedMotion } from \"./chartTheme\";\nimport { ChartEmpty, ChartTooltip, srOnlyStyle } from \"./ChartParts\";\n\n/** One life-domain axis of the wheel: the actual vs the desired share of time. */\nexport interface BalanceWheelDatum {\n  /** Stable domain key (e.g. \"FAMILY\"). */\n  domain: string;\n  /** Human label shown on the axis (e.g. \"Family\"). */\n  label: string;\n  /** Actual share of covered time, 0..1. */\n  actualShare: number;\n  /** Desired share the user declared, 0..1. Omit when no target is set. */\n  desiredShare?: number | null;\n}\n\nexport interface BalanceWheelProps {\n  data: BalanceWheelDatum[];\n  /** Pixel height of the wheel. Default 320. */\n  height?: number;\n  /** Message when there is no covered time to plot. */\n  emptyLabel?: string;\n  ariaLabel?: string;\n  className?: string;\n}\n\n/**\n * BalanceWheel — the signature life-balance visual: a radar of how your finite\n * time actually splits across life domains (solid brand polygon) overlaid with\n * the balance you said you WANT (dashed muted polygon). The gap between the two\n * is the insight. Token-only, theme-aware, and renders an honest empty state —\n * never a fake polygon — when there is no covered time. Values are real shares\n * passed in by the page; this component never fabricates data.\n */\nexport function BalanceWheel({\n  data,\n  height = 320,\n  emptyLabel,\n  ariaLabel,\n  className,\n}: BalanceWheelProps) {\n  const reducedMotion = usePrefersReducedMotion();\n\n  const rows = data.filter(\n    (d) => Number.isFinite(d.actualShare) && d.actualShare >= 0,\n  );\n  const total = rows.reduce((sum, d) => sum + d.actualShare, 0);\n  const hasDesired = rows.some(\n    (d) =>\n      typeof d.desiredShare === \"number\" && Number.isFinite(d.desiredShare),\n  );\n\n  if (rows.length === 0 || total <= 0) {\n    return (\n      <ChartEmpty height={height} label={emptyLabel} className={className} />\n    );\n  }\n\n  const chartData = rows.map((d) => ({\n    label: d.label,\n    Actual: Math.round(d.actualShare * 1000) / 10,\n    Desired:\n      typeof d.desiredShare === \"number\" && Number.isFinite(d.desiredShare)\n        ? Math.round(d.desiredShare * 1000) / 10\n        : 0,\n  }));\n\n  const label =\n    ariaLabel ?? `Life balance across ${rows.map((d) => d.label).join(\", \")}`;\n\n  return (\n    <figure role=\"img\" aria-label={label} className={className}>\n      <div style={{ height }}>\n        <ResponsiveContainer width=\"100%\" height=\"100%\">\n          <RadarChart data={chartData} outerRadius=\"72%\">\n            <PolarGrid stroke={chartTokens.grid} />\n            <PolarAngleAxis\n              dataKey=\"label\"\n              tick={{ fill: chartTokens.textSecondary, fontSize: 11 }}\n            />\n            <Tooltip\n              cursor={false}\n              content={<ChartTooltip valueFormat={(v) => `${v}%`} />}\n            />\n            {hasDesired && (\n              <Radar\n                name=\"Desired\"\n                dataKey=\"Desired\"\n                stroke={chartTokens.textMuted}\n                strokeDasharray=\"4 3\"\n                strokeWidth={1.5}\n                fill=\"transparent\"\n                isAnimationActive={!reducedMotion}\n              />\n            )}\n            <Radar\n              name=\"Actual\"\n              dataKey=\"Actual\"\n              stroke={chartTokens.brand}\n              strokeWidth={2}\n              fill={chartTokens.brand}\n              fillOpacity={0.28}\n              isAnimationActive={!reducedMotion}\n            />\n          </RadarChart>\n        </ResponsiveContainer>\n      </div>\n\n      <ul className=\"mt-2 flex flex-wrap items-center justify-center gap-x-4 gap-y-1.5 text-xs text-text-secondary\">\n        <li className=\"flex items-center gap-1.5\">\n          <span\n            aria-hidden=\"true\"\n            className=\"h-2.5 w-2.5 rounded-[3px]\"\n            style={{ backgroundColor: chartTokens.brand }}\n          />\n          Actual\n        </li>\n        {hasDesired && (\n          <li className=\"flex items-center gap-1.5\">\n            <span\n              aria-hidden=\"true\"\n              className=\"h-0 w-3.5 border-t-2 border-dashed\"\n              style={{ borderColor: chartTokens.textMuted }}\n            />\n            Desired\n          </li>\n        )}\n      </ul>\n\n      <table style={srOnlyStyle}>\n        <caption>{label}</caption>\n        <thead>\n          <tr>\n            <th scope=\"col\">Domain</th>\n            <th scope=\"col\">Actual share</th>\n            {hasDesired && <th scope=\"col\">Desired share</th>}\n          </tr>\n        </thead>\n        <tbody>\n          {rows.map((d) => (\n            <tr key={d.domain}>\n              <th scope=\"row\">{d.label}</th>\n              <td>{`${Math.round(d.actualShare * 100)}%`}</td>\n              {hasDesired && (\n                <td>\n                  {typeof d.desiredShare === \"number\"\n                    ? `${Math.round(d.desiredShare * 100)}%`\n                    : \"—\"}\n                </td>\n              )}\n            </tr>\n          ))}\n        </tbody>\n      </table>\n    </figure>\n  );\n}\n"],"mappings":"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"}

package/dist/timecampus/components/charts/BarsChart.js

@@ -1,28 +1,21 @@
-import { Legend as e } from "../../../node_modules/recharts/es6/component/Legend.js";
-import { Tooltip as t } from "../../../node_modules/recharts/es6/component/Tooltip.js";
-import { ResponsiveContainer as n } from "../../../node_modules/recharts/es6/component/ResponsiveContainer.js";
-import { Bar as r } from "../../../node_modules/recharts/es6/cartesian/Bar.js";
-import { CartesianGrid as i } from "../../../node_modules/recharts/es6/cartesian/CartesianGrid.js";
-import { XAxis as a } from "../../../node_modules/recharts/es6/cartesian/XAxis.js";
-import { YAxis as o } from "../../../node_modules/recharts/es6/cartesian/YAxis.js";
-import { BarChart as s } from "../../../node_modules/recharts/es6/chart/BarChart.js";
-import { chartTokens as c, defaultSeriesColor as l, formatNumber as u, usePrefersReducedMotion as d } from "./chartTheme.js";
-import { ChartDataTable as f, ChartEmpty as p, ChartFigure as m, ChartLegend as h, ChartTooltip as g } from "./ChartParts.js";
-import { Fragment as _, jsx as v, jsxs as y } from "react/jsx-runtime";
+import { chartTokens as e, defaultSeriesColor as t, formatNumber as n, usePrefersReducedMotion as r } from "./chartTheme.js";
+import { ChartDataTable as i, ChartEmpty as a, ChartFigure as o, ChartLegend as s, ChartTooltip as c } from "./ChartParts.js";
+import { Fragment as l, jsx as u, jsxs as d } from "react/jsx-runtime";
+import { Bar as f, BarChart as p, CartesianGrid as m, Legend as h, ResponsiveContainer as g, Tooltip as _, XAxis as v, YAxis as y } from "recharts";
 //#region src/timecampus/components/charts/BarsChart.tsx
-function b({ data: b, xKey: x, series: S, orientation: C = "vertical", stacked: w = !1, height: T = 260, valueFormat: E = u, xTickFormat: D, showGrid: O = !0, showLegend: k, categoryWidth: A = 96, emptyLabel: j, ariaLabel: M, className: N }) {
-	let P = d(), F = S.map((e, t) => ({
+function b({ data: b, xKey: x, series: S, orientation: C = "vertical", stacked: w = !1, height: T = 260, valueFormat: E = n, xTickFormat: D, showGrid: O = !0, showLegend: k, categoryWidth: A = 96, emptyLabel: j, ariaLabel: M, className: N }) {
+	let P = r(), F = S.map((e, n) => ({
 		...e,
 		label: e.label ?? e.key,
-		color: e.color ?? l(t, S.length)
+		color: e.color ?? t(n, S.length)
 	})), I = M ?? `${F.map((e) => e.label).join(", ")} by ${x}`;
-	if (b.length === 0) return /* @__PURE__ */ v(p, {
+	if (b.length === 0) return /* @__PURE__ */ u(a, {
 		height: T,
 		label: j,
 		className: N
 	});
 	let L = C === "vertical", R = k ?? F.length > 1, z = {
-		fill: c.textMuted,
+		fill: e.textMuted,
 		fontSize: 12
 	}, B = F.length - 1, V = (e) => !w || e === B ? L ? [
 		4,
@@ -40,11 +33,11 @@ function b({ data: b, xKey: x, series: S, orientation: C = "vertical", stacked:
 		0,
 		0
 	], H = w ? "stack" : void 0;
-	return /* @__PURE__ */ v(m, {
+	return /* @__PURE__ */ u(o, {
 		ariaLabel: I,
 		height: T,
 		className: N,
-		a11y: /* @__PURE__ */ v(f, {
+		a11y: /* @__PURE__ */ u(i, {
 			caption: I,
 			xLabel: x,
 			xKey: x,
@@ -52,10 +45,10 @@ function b({ data: b, xKey: x, series: S, orientation: C = "vertical", stacked:
 			series: F,
 			valueFormat: E
 		}),
-		children: /* @__PURE__ */ v(n, {
+		children: /* @__PURE__ */ u(g, {
 			width: "100%",
 			height: "100%",
-			children: /* @__PURE__ */ y(s, {
+			children: /* @__PURE__ */ d(p, {
 				data: b,
 				layout: L ? "horizontal" : "vertical",
 				margin: {
@@ -66,13 +59,13 @@ function b({ data: b, xKey: x, series: S, orientation: C = "vertical", stacked:
 				},
 				barCategoryGap: L ? "24%" : "28%",
 				children: [
-					O ? /* @__PURE__ */ v(i, {
+					O ? /* @__PURE__ */ u(m, {
 						vertical: !L,
 						horizontal: L,
-						stroke: c.grid,
+						stroke: e.grid,
 						strokeWidth: 1
 					}) : null,
-					L ? /* @__PURE__ */ y(_, { children: [/* @__PURE__ */ v(a, {
+					L ? /* @__PURE__ */ d(l, { children: [/* @__PURE__ */ u(v, {
 						dataKey: x,
 						type: "category",
 						tickLine: !1,
@@ -80,20 +73,20 @@ function b({ data: b, xKey: x, series: S, orientation: C = "vertical", stacked:
 						tick: z,
 						tickMargin: 8,
 						tickFormatter: D ? (e) => D(e) : void 0
-					}), /* @__PURE__ */ v(o, {
+					}), /* @__PURE__ */ u(y, {
 						type: "number",
 						tickLine: !1,
 						axisLine: !1,
 						tick: z,
 						width: 48,
 						tickFormatter: (e) => E(Number(e))
-					})] }) : /* @__PURE__ */ y(_, { children: [/* @__PURE__ */ v(a, {
+					})] }) : /* @__PURE__ */ d(l, { children: [/* @__PURE__ */ u(v, {
 						type: "number",
 						tickLine: !1,
 						axisLine: !1,
 						tick: z,
 						tickFormatter: (e) => E(Number(e))
-					}), /* @__PURE__ */ v(o, {
+					}), /* @__PURE__ */ u(y, {
 						dataKey: x,
 						type: "category",
 						tickLine: !1,
@@ -102,18 +95,18 @@ function b({ data: b, xKey: x, series: S, orientation: C = "vertical", stacked:
 						width: A,
 						tickFormatter: D ? (e) => D(e) : void 0
 					})] }),
-					/* @__PURE__ */ v(t, {
+					/* @__PURE__ */ u(_, {
 						cursor: {
-							fill: c.track,
+							fill: e.track,
 							opacity: .5
 						},
-						content: /* @__PURE__ */ v(g, {
+						content: /* @__PURE__ */ u(c, {
 							valueFormat: E,
 							labelFormat: D
 						})
 					}),
-					R ? /* @__PURE__ */ v(e, { content: /* @__PURE__ */ v(h, {}) }) : null,
-					F.map((e, t) => /* @__PURE__ */ v(r, {
+					R ? /* @__PURE__ */ u(h, { content: /* @__PURE__ */ u(s, {}) }) : null,
+					F.map((e, t) => /* @__PURE__ */ u(f, {
 						dataKey: e.key,
 						name: e.label,
 						fill: e.color,

package/dist/timecampus/components/charts/BarsChart.js.map

@@ -1 +1 @@
-{"version":3,"file":"BarsChart.js","names":[],"sources":["../../../../src/timecampus/components/charts/BarsChart.tsx"],"sourcesContent":["import {\n  Bar,\n  BarChart,\n  CartesianGrid,\n  Legend,\n  ResponsiveContainer,\n  Tooltip,\n  XAxis,\n  YAxis,\n} from \"recharts\";\nimport {\n  chartTokens,\n  defaultSeriesColor,\n  formatNumber,\n  usePrefersReducedMotion,\n  type ChartDatum,\n  type ChartSeries,\n  type ValueFormatter,\n} from \"./chartTheme\";\nimport {\n  ChartDataTable,\n  ChartEmpty,\n  ChartFigure,\n  ChartLegend,\n  ChartTooltip,\n} from \"./ChartParts\";\n\nexport interface BarsChartProps {\n  /** Rows of `{ [xKey]: label, [series.key]: number }`. */\n  data: ChartDatum[];\n  /** Field holding the category label. */\n  xKey: string;\n  /** One or more numeric series. */\n  series: ChartSeries[];\n  /** `vertical` = columns growing up (default); `horizontal` = bars growing right. */\n  orientation?: \"vertical\" | \"horizontal\";\n  /** Stack the series instead of grouping side-by-side. Default false. */\n  stacked?: boolean;\n  /** Pixel height. Default 260. */\n  height?: number;\n  /** Formats numeric values in the axis + tooltip. Default grouped integer. */\n  valueFormat?: ValueFormatter;\n  /** Formats the category tick + tooltip header. */\n  xTickFormat?: (value: string | number) => string;\n  /** Show the value-axis grid. Default true. */\n  showGrid?: boolean;\n  /** Force the legend on/off. Default: on when there are ≥ 2 series. */\n  showLegend?: boolean;\n  /** Width of the category label column in `horizontal` mode. Default 96. */\n  categoryWidth?: number;\n  /** Message shown when `data` is empty. */\n  emptyLabel?: string;\n  /** Accessible name. */\n  ariaLabel?: string;\n  className?: string;\n}\n\n/**\n * BarsChart — categorical magnitude as columns or horizontal bars, grouped or\n * stacked. Thin (≤ 24px) marks with 4px rounded data-ends, a hairline grid, a\n * per-mark tooltip, a multi-series legend, an empty state and a screen-reader\n * table. Colour is identity only (never re-encoding the bar's length).\n */\nexport function BarsChart({\n  data,\n  xKey,\n  series,\n  orientation = \"vertical\",\n  stacked = false,\n  height = 260,\n  valueFormat = formatNumber,\n  xTickFormat,\n  showGrid = true,\n  showLegend,\n  categoryWidth = 96,\n  emptyLabel,\n  ariaLabel,\n  className,\n}: BarsChartProps) {\n  const reducedMotion = usePrefersReducedMotion();\n\n  const resolved = series.map((s, index) => ({\n    ...s,\n    label: s.label ?? s.key,\n    color: s.color ?? defaultSeriesColor(index, series.length),\n  }));\n  const label =\n    ariaLabel ?? `${resolved.map((s) => s.label).join(\", \")} by ${xKey}`;\n\n  if (data.length === 0) {\n    return (\n      <ChartEmpty height={height} label={emptyLabel} className={className} />\n    );\n  }\n\n  const isColumns = orientation === \"vertical\";\n  const withLegend = showLegend ?? resolved.length > 1;\n  const axisTick = { fill: chartTokens.textMuted, fontSize: 12 };\n  const lastIndex = resolved.length - 1;\n\n  /** Rounded data-end: columns round the top, horizontal bars the right; a stack\n   * rounds only its outermost (last) segment. */\n  const radiusFor = (index: number): [number, number, number, number] => {\n    const rounded = !stacked || index === lastIndex;\n    if (!rounded) return [0, 0, 0, 0];\n    return isColumns ? [4, 4, 0, 0] : [0, 4, 4, 0];\n  };\n\n  const stackId = stacked ? \"stack\" : undefined;\n\n  return (\n    <ChartFigure\n      ariaLabel={label}\n      height={height}\n      className={className}\n      a11y={\n        <ChartDataTable\n          caption={label}\n          xLabel={xKey}\n          xKey={xKey}\n          data={data}\n          series={resolved}\n          valueFormat={valueFormat}\n        />\n      }\n    >\n      <ResponsiveContainer width=\"100%\" height=\"100%\">\n        <BarChart\n          data={data}\n          layout={isColumns ? \"horizontal\" : \"vertical\"}\n          margin={{ top: 8, right: 16, bottom: 4, left: 4 }}\n          barCategoryGap={isColumns ? \"24%\" : \"28%\"}\n        >\n          {showGrid ? (\n            <CartesianGrid\n              vertical={!isColumns}\n              horizontal={isColumns}\n              stroke={chartTokens.grid}\n              strokeWidth={1}\n            />\n          ) : null}\n\n          {isColumns ? (\n            <>\n              <XAxis\n                dataKey={xKey}\n                type=\"category\"\n                tickLine={false}\n                axisLine={false}\n                tick={axisTick}\n                tickMargin={8}\n                tickFormatter={\n                  xTickFormat\n                    ? (value) => xTickFormat(value as string | number)\n                    : undefined\n                }\n              />\n              <YAxis\n                type=\"number\"\n                tickLine={false}\n                axisLine={false}\n                tick={axisTick}\n                width={48}\n                tickFormatter={(value) => valueFormat(Number(value))}\n              />\n            </>\n          ) : (\n            <>\n              <XAxis\n                type=\"number\"\n                tickLine={false}\n                axisLine={false}\n                tick={axisTick}\n                tickFormatter={(value) => valueFormat(Number(value))}\n              />\n              <YAxis\n                dataKey={xKey}\n                type=\"category\"\n                tickLine={false}\n                axisLine={false}\n                tick={axisTick}\n                width={categoryWidth}\n                tickFormatter={\n                  xTickFormat\n                    ? (value) => xTickFormat(value as string | number)\n                    : undefined\n                }\n              />\n            </>\n          )}\n\n          <Tooltip\n            cursor={{ fill: chartTokens.track, opacity: 0.5 }}\n            content={\n              <ChartTooltip\n                valueFormat={valueFormat}\n                labelFormat={xTickFormat}\n              />\n            }\n          />\n\n          {withLegend ? <Legend content={<ChartLegend />} /> : null}\n\n          {resolved.map((s, index) => (\n            <Bar\n              key={s.key}\n              dataKey={s.key}\n              name={s.label}\n              fill={s.color}\n              stackId={stackId}\n              maxBarSize={24}\n              radius={radiusFor(index)}\n              isAnimationActive={!reducedMotion}\n            />\n          ))}\n        </BarChart>\n      </ResponsiveContainer>\n    </ChartFigure>\n  );\n}\n"],"mappings":";;;;;;;;;;;;AA+DA,SAAgB,EAAU,EACxB,SACA,SACA,WACA,iBAAc,YACd,aAAU,IACV,YAAS,KACT,iBAAc,GACd,gBACA,cAAW,IACX,eACA,mBAAgB,IAChB,eACA,cACA,gBACiB;CACjB,IAAM,IAAgB,GAAyB,EAEzC,IAAW,EAAO,KAAK,GAAG,OAAW;EACzC,GAAG;EACH,OAAO,EAAE,SAAS,EAAE;EACpB,OAAO,EAAE,SAAS,EAAmB,GAAO,EAAO,OAAO;EAC3D,EAAE,EACG,IACJ,KAAa,GAAG,EAAS,KAAK,MAAM,EAAE,MAAM,CAAC,KAAK,KAAK,CAAC,MAAM;AAEhE,KAAI,EAAK,WAAW,EAClB,QACE,kBAAC,GAAD;EAAoB;EAAQ,OAAO;EAAuB;EAAa,CAAA;CAI3E,IAAM,IAAY,MAAgB,YAC5B,IAAa,KAAc,EAAS,SAAS,GAC7C,IAAW;EAAE,MAAM,EAAY;EAAW,UAAU;EAAI,EACxD,IAAY,EAAS,SAAS,GAI9B,KAAa,MACD,CAAC,KAAW,MAAU,IAE/B,IAAY;EAAC;EAAG;EAAG;EAAG;EAAE,GAAG;EAAC;EAAG;EAAG;EAAG;EAAE,GADzB;EAAC;EAAG;EAAG;EAAG;EAAE,EAI7B,IAAU,IAAU,UAAU,KAAA;AAEpC,QACE,kBAAC,GAAD;EACE,WAAW;EACH;EACG;EACX,MACE,kBAAC,GAAD;GACE,SAAS;GACT,QAAQ;GACF;GACA;GACN,QAAQ;GACK;GACb,CAAA;YAGJ,kBAAC,GAAD;GAAqB,OAAM;GAAO,QAAO;aACvC,kBAAC,GAAD;IACQ;IACN,QAAQ,IAAY,eAAe;IACnC,QAAQ;KAAE,KAAK;KAAG,OAAO;KAAI,QAAQ;KAAG,MAAM;KAAG;IACjD,gBAAgB,IAAY,QAAQ;cAJtC;KAMG,IACC,kBAAC,GAAD;MACE,UAAU,CAAC;MACX,YAAY;MACZ,QAAQ,EAAY;MACpB,aAAa;MACb,CAAA,GACA;KAEH,IACC,kBAAA,GAAA,EAAA,UAAA,CACE,kBAAC,GAAD;MACE,SAAS;MACT,MAAK;MACL,UAAU;MACV,UAAU;MACV,MAAM;MACN,YAAY;MACZ,eACE,KACK,MAAU,EAAY,EAAyB,GAChD,KAAA;MAEN,CAAA,EACF,kBAAC,GAAD;MACE,MAAK;MACL,UAAU;MACV,UAAU;MACV,MAAM;MACN,OAAO;MACP,gBAAgB,MAAU,EAAY,OAAO,EAAM,CAAC;MACpD,CAAA,CACD,EAAA,CAAA,GAEH,kBAAA,GAAA,EAAA,UAAA,CACE,kBAAC,GAAD;MACE,MAAK;MACL,UAAU;MACV,UAAU;MACV,MAAM;MACN,gBAAgB,MAAU,EAAY,OAAO,EAAM,CAAC;MACpD,CAAA,EACF,kBAAC,GAAD;MACE,SAAS;MACT,MAAK;MACL,UAAU;MACV,UAAU;MACV,MAAM;MACN,OAAO;MACP,eACE,KACK,MAAU,EAAY,EAAyB,GAChD,KAAA;MAEN,CAAA,CACD,EAAA,CAAA;KAGL,kBAAC,GAAD;MACE,QAAQ;OAAE,MAAM,EAAY;OAAO,SAAS;OAAK;MACjD,SACE,kBAAC,GAAD;OACe;OACb,aAAa;OACb,CAAA;MAEJ,CAAA;KAED,IAAa,kBAAC,GAAD,EAAQ,SAAS,kBAAC,GAAD,EAAe,CAAA,EAAI,CAAA,GAAG;KAEpD,EAAS,KAAK,GAAG,MAChB,kBAAC,GAAD;MAEE,SAAS,EAAE;MACX,MAAM,EAAE;MACR,MAAM,EAAE;MACC;MACT,YAAY;MACZ,QAAQ,EAAU,EAAM;MACxB,mBAAmB,CAAC;MACpB,EARK,EAAE,IAQP,CACF;KACO;;GACS,CAAA;EACV,CAAA"}
+{"version":3,"file":"BarsChart.js","names":[],"sources":["../../../../src/timecampus/components/charts/BarsChart.tsx"],"sourcesContent":["import {\n  Bar,\n  BarChart,\n  CartesianGrid,\n  Legend,\n  ResponsiveContainer,\n  Tooltip,\n  XAxis,\n  YAxis,\n} from \"recharts\";\nimport {\n  chartTokens,\n  defaultSeriesColor,\n  formatNumber,\n  usePrefersReducedMotion,\n  type ChartDatum,\n  type ChartSeries,\n  type ValueFormatter,\n} from \"./chartTheme\";\nimport {\n  ChartDataTable,\n  ChartEmpty,\n  ChartFigure,\n  ChartLegend,\n  ChartTooltip,\n} from \"./ChartParts\";\n\nexport interface BarsChartProps {\n  /** Rows of `{ [xKey]: label, [series.key]: number }`. */\n  data: ChartDatum[];\n  /** Field holding the category label. */\n  xKey: string;\n  /** One or more numeric series. */\n  series: ChartSeries[];\n  /** `vertical` = columns growing up (default); `horizontal` = bars growing right. */\n  orientation?: \"vertical\" | \"horizontal\";\n  /** Stack the series instead of grouping side-by-side. Default false. */\n  stacked?: boolean;\n  /** Pixel height. Default 260. */\n  height?: number;\n  /** Formats numeric values in the axis + tooltip. Default grouped integer. */\n  valueFormat?: ValueFormatter;\n  /** Formats the category tick + tooltip header. */\n  xTickFormat?: (value: string | number) => string;\n  /** Show the value-axis grid. Default true. */\n  showGrid?: boolean;\n  /** Force the legend on/off. Default: on when there are ≥ 2 series. */\n  showLegend?: boolean;\n  /** Width of the category label column in `horizontal` mode. Default 96. */\n  categoryWidth?: number;\n  /** Message shown when `data` is empty. */\n  emptyLabel?: string;\n  /** Accessible name. */\n  ariaLabel?: string;\n  className?: string;\n}\n\n/**\n * BarsChart — categorical magnitude as columns or horizontal bars, grouped or\n * stacked. Thin (≤ 24px) marks with 4px rounded data-ends, a hairline grid, a\n * per-mark tooltip, a multi-series legend, an empty state and a screen-reader\n * table. Colour is identity only (never re-encoding the bar's length).\n */\nexport function BarsChart({\n  data,\n  xKey,\n  series,\n  orientation = \"vertical\",\n  stacked = false,\n  height = 260,\n  valueFormat = formatNumber,\n  xTickFormat,\n  showGrid = true,\n  showLegend,\n  categoryWidth = 96,\n  emptyLabel,\n  ariaLabel,\n  className,\n}: BarsChartProps) {\n  const reducedMotion = usePrefersReducedMotion();\n\n  const resolved = series.map((s, index) => ({\n    ...s,\n    label: s.label ?? s.key,\n    color: s.color ?? defaultSeriesColor(index, series.length),\n  }));\n  const label =\n    ariaLabel ?? `${resolved.map((s) => s.label).join(\", \")} by ${xKey}`;\n\n  if (data.length === 0) {\n    return (\n      <ChartEmpty height={height} label={emptyLabel} className={className} />\n    );\n  }\n\n  const isColumns = orientation === \"vertical\";\n  const withLegend = showLegend ?? resolved.length > 1;\n  const axisTick = { fill: chartTokens.textMuted, fontSize: 12 };\n  const lastIndex = resolved.length - 1;\n\n  /** Rounded data-end: columns round the top, horizontal bars the right; a stack\n   * rounds only its outermost (last) segment. */\n  const radiusFor = (index: number): [number, number, number, number] => {\n    const rounded = !stacked || index === lastIndex;\n    if (!rounded) return [0, 0, 0, 0];\n    return isColumns ? [4, 4, 0, 0] : [0, 4, 4, 0];\n  };\n\n  const stackId = stacked ? \"stack\" : undefined;\n\n  return (\n    <ChartFigure\n      ariaLabel={label}\n      height={height}\n      className={className}\n      a11y={\n        <ChartDataTable\n          caption={label}\n          xLabel={xKey}\n          xKey={xKey}\n          data={data}\n          series={resolved}\n          valueFormat={valueFormat}\n        />\n      }\n    >\n      <ResponsiveContainer width=\"100%\" height=\"100%\">\n        <BarChart\n          data={data}\n          layout={isColumns ? \"horizontal\" : \"vertical\"}\n          margin={{ top: 8, right: 16, bottom: 4, left: 4 }}\n          barCategoryGap={isColumns ? \"24%\" : \"28%\"}\n        >\n          {showGrid ? (\n            <CartesianGrid\n              vertical={!isColumns}\n              horizontal={isColumns}\n              stroke={chartTokens.grid}\n              strokeWidth={1}\n            />\n          ) : null}\n\n          {isColumns ? (\n            <>\n              <XAxis\n                dataKey={xKey}\n                type=\"category\"\n                tickLine={false}\n                axisLine={false}\n                tick={axisTick}\n                tickMargin={8}\n                tickFormatter={\n                  xTickFormat\n                    ? (value) => xTickFormat(value as string | number)\n                    : undefined\n                }\n              />\n              <YAxis\n                type=\"number\"\n                tickLine={false}\n                axisLine={false}\n                tick={axisTick}\n                width={48}\n                tickFormatter={(value) => valueFormat(Number(value))}\n              />\n            </>\n          ) : (\n            <>\n              <XAxis\n                type=\"number\"\n                tickLine={false}\n                axisLine={false}\n                tick={axisTick}\n                tickFormatter={(value) => valueFormat(Number(value))}\n              />\n              <YAxis\n                dataKey={xKey}\n                type=\"category\"\n                tickLine={false}\n                axisLine={false}\n                tick={axisTick}\n                width={categoryWidth}\n                tickFormatter={\n                  xTickFormat\n                    ? (value) => xTickFormat(value as string | number)\n                    : undefined\n                }\n              />\n            </>\n          )}\n\n          <Tooltip\n            cursor={{ fill: chartTokens.track, opacity: 0.5 }}\n            content={\n              <ChartTooltip\n                valueFormat={valueFormat}\n                labelFormat={xTickFormat}\n              />\n            }\n          />\n\n          {withLegend ? <Legend content={<ChartLegend />} /> : null}\n\n          {resolved.map((s, index) => (\n            <Bar\n              key={s.key}\n              dataKey={s.key}\n              name={s.label}\n              fill={s.color}\n              stackId={stackId}\n              maxBarSize={24}\n              radius={radiusFor(index)}\n              isAnimationActive={!reducedMotion}\n            />\n          ))}\n        </BarChart>\n      </ResponsiveContainer>\n    </ChartFigure>\n  );\n}\n"],"mappings":";;;;;AA+DA,SAAgB,EAAU,EACxB,SACA,SACA,WACA,iBAAc,YACd,aAAU,IACV,YAAS,KACT,iBAAc,GACd,gBACA,cAAW,IACX,eACA,mBAAgB,IAChB,eACA,cACA,gBACiB;CACjB,IAAM,IAAgB,GAAyB,EAEzC,IAAW,EAAO,KAAK,GAAG,OAAW;EACzC,GAAG;EACH,OAAO,EAAE,SAAS,EAAE;EACpB,OAAO,EAAE,SAAS,EAAmB,GAAO,EAAO,OAAO;EAC3D,EAAE,EACG,IACJ,KAAa,GAAG,EAAS,KAAK,MAAM,EAAE,MAAM,CAAC,KAAK,KAAK,CAAC,MAAM;AAEhE,KAAI,EAAK,WAAW,EAClB,QACE,kBAAC,GAAD;EAAoB;EAAQ,OAAO;EAAuB;EAAa,CAAA;CAI3E,IAAM,IAAY,MAAgB,YAC5B,IAAa,KAAc,EAAS,SAAS,GAC7C,IAAW;EAAE,MAAM,EAAY;EAAW,UAAU;EAAI,EACxD,IAAY,EAAS,SAAS,GAI9B,KAAa,MACD,CAAC,KAAW,MAAU,IAE/B,IAAY;EAAC;EAAG;EAAG;EAAG;EAAE,GAAG;EAAC;EAAG;EAAG;EAAG;EAAE,GADzB;EAAC;EAAG;EAAG;EAAG;EAAE,EAI7B,IAAU,IAAU,UAAU,KAAA;AAEpC,QACE,kBAAC,GAAD;EACE,WAAW;EACH;EACG;EACX,MACE,kBAAC,GAAD;GACE,SAAS;GACT,QAAQ;GACF;GACA;GACN,QAAQ;GACK;GACb,CAAA;YAGJ,kBAAC,GAAD;GAAqB,OAAM;GAAO,QAAO;aACvC,kBAAC,GAAD;IACQ;IACN,QAAQ,IAAY,eAAe;IACnC,QAAQ;KAAE,KAAK;KAAG,OAAO;KAAI,QAAQ;KAAG,MAAM;KAAG;IACjD,gBAAgB,IAAY,QAAQ;cAJtC;KAMG,IACC,kBAAC,GAAD;MACE,UAAU,CAAC;MACX,YAAY;MACZ,QAAQ,EAAY;MACpB,aAAa;MACb,CAAA,GACA;KAEH,IACC,kBAAA,GAAA,EAAA,UAAA,CACE,kBAAC,GAAD;MACE,SAAS;MACT,MAAK;MACL,UAAU;MACV,UAAU;MACV,MAAM;MACN,YAAY;MACZ,eACE,KACK,MAAU,EAAY,EAAyB,GAChD,KAAA;MAEN,CAAA,EACF,kBAAC,GAAD;MACE,MAAK;MACL,UAAU;MACV,UAAU;MACV,MAAM;MACN,OAAO;MACP,gBAAgB,MAAU,EAAY,OAAO,EAAM,CAAC;MACpD,CAAA,CACD,EAAA,CAAA,GAEH,kBAAA,GAAA,EAAA,UAAA,CACE,kBAAC,GAAD;MACE,MAAK;MACL,UAAU;MACV,UAAU;MACV,MAAM;MACN,gBAAgB,MAAU,EAAY,OAAO,EAAM,CAAC;MACpD,CAAA,EACF,kBAAC,GAAD;MACE,SAAS;MACT,MAAK;MACL,UAAU;MACV,UAAU;MACV,MAAM;MACN,OAAO;MACP,eACE,KACK,MAAU,EAAY,EAAyB,GAChD,KAAA;MAEN,CAAA,CACD,EAAA,CAAA;KAGL,kBAAC,GAAD;MACE,QAAQ;OAAE,MAAM,EAAY;OAAO,SAAS;OAAK;MACjD,SACE,kBAAC,GAAD;OACe;OACb,aAAa;OACb,CAAA;MAEJ,CAAA;KAED,IAAa,kBAAC,GAAD,EAAQ,SAAS,kBAAC,GAAD,EAAe,CAAA,EAAI,CAAA,GAAG;KAEpD,EAAS,KAAK,GAAG,MAChB,kBAAC,GAAD;MAEE,SAAS,EAAE;MACX,MAAM,EAAE;MACR,MAAM,EAAE;MACC;MACT,YAAY;MACZ,QAAQ,EAAU,EAAM;MACxB,mBAAmB,CAAC;MACpB,EARK,EAAE,IAQP,CACF;KACO;;GACS,CAAA;EACV,CAAA"}

package/dist/timecampus/components/charts/DonutChart.js

@@ -1,42 +1,38 @@
 import { cn as e } from "../../utils/helpers.js";
-import { Tooltip as t } from "../../../node_modules/recharts/es6/component/Tooltip.js";
-import { ResponsiveContainer as n } from "../../../node_modules/recharts/es6/component/ResponsiveContainer.js";
-import { Cell as r } from "../../../node_modules/recharts/es6/component/Cell.js";
-import { Pie as i } from "../../../node_modules/recharts/es6/polar/Pie.js";
-import { PieChart as a } from "../../../node_modules/recharts/es6/chart/PieChart.js";
-import { chartTokens as o, formatNumber as s, renderValue as c, seriesColor as l, usePrefersReducedMotion as u } from "./chartTheme.js";
-import { ChartEmpty as d, ChartTooltip as f, srOnlyStyle as p } from "./ChartParts.js";
-import { jsx as m, jsxs as h } from "react/jsx-runtime";
+import { chartTokens as t, formatNumber as n, renderValue as r, seriesColor as i, usePrefersReducedMotion as a } from "./chartTheme.js";
+import { ChartEmpty as o, ChartTooltip as s, srOnlyStyle as c } from "./ChartParts.js";
+import { jsx as l, jsxs as u } from "react/jsx-runtime";
+import { Cell as d, Pie as f, PieChart as p, ResponsiveContainer as m, Tooltip as h } from "recharts";
 //#region src/timecampus/components/charts/DonutChart.tsx
-function g({ data: g, centerLabel: _, centerValue: v, height: y = 240, thickness: b = .42, valueFormat: x = s, showLegend: S = !0, emptyLabel: C, ariaLabel: w, className: T }) {
-	let E = u(), D = g.filter((e) => typeof e.value == "number" && Number.isFinite(e.value) && e.value > 0).map((e, t) => ({
+function g({ data: g, centerLabel: _, centerValue: v, height: y = 240, thickness: b = .42, valueFormat: x = n, showLegend: S = !0, emptyLabel: C, ariaLabel: w, className: T }) {
+	let E = a(), D = g.filter((e) => typeof e.value == "number" && Number.isFinite(e.value) && e.value > 0).map((e, t) => ({
 		...e,
-		color: e.color ?? l(t)
+		color: e.color ?? i(t)
 	})), O = D.reduce((e, t) => e + t.value, 0);
-	if (D.length === 0 || O <= 0) return /* @__PURE__ */ m(d, {
+	if (D.length === 0 || O <= 0) return /* @__PURE__ */ l(o, {
 		height: y,
 		label: C,
 		className: T
 	});
-	let k = w ?? `${_ ?? "Distribution"}: ${D.map((e) => e.name).join(", ")}`, A = Math.max(0, Math.round(82 * (1 - b))), j = _ !== void 0 || v !== void 0, M = v === void 0 ? x(O) : c(v, x);
-	return /* @__PURE__ */ h("figure", {
+	let k = w ?? `${_ ?? "Distribution"}: ${D.map((e) => e.name).join(", ")}`, A = Math.max(0, Math.round(82 * (1 - b))), j = _ !== void 0 || v !== void 0, M = v === void 0 ? x(O) : r(v, x);
+	return /* @__PURE__ */ u("figure", {
 		role: "img",
 		"aria-label": k,
 		className: e("w-full", T),
 		children: [
-			/* @__PURE__ */ h("div", {
+			/* @__PURE__ */ u("div", {
 				className: "relative mx-auto",
 				style: { height: y },
-				children: [/* @__PURE__ */ m(n, {
+				children: [/* @__PURE__ */ l(m, {
 					width: "100%",
 					height: "100%",
-					children: /* @__PURE__ */ h(a, { children: [/* @__PURE__ */ m(t, {
+					children: /* @__PURE__ */ u(p, { children: [/* @__PURE__ */ l(h, {
 						cursor: !1,
-						content: /* @__PURE__ */ m(f, {
+						content: /* @__PURE__ */ l(s, {
 							valueFormat: x,
 							hideLabel: !0
 						})
-					}), /* @__PURE__ */ m(i, {
+					}), /* @__PURE__ */ l(f, {
 						data: D,
 						dataKey: "value",
 						nameKey: "name",
@@ -45,65 +41,65 @@ function g({ data: g, centerLabel: _, centerValue: v, height: y = 240, thickness
 						innerRadius: `${A}%`,
 						outerRadius: "82%",
 						paddingAngle: 1.5,
-						stroke: o.surface,
+						stroke: t.surface,
 						strokeWidth: 2,
 						isAnimationActive: !E,
-						children: D.map((e) => /* @__PURE__ */ m(r, { fill: e.color }, e.name))
+						children: D.map((e) => /* @__PURE__ */ l(d, { fill: e.color }, e.name))
 					})] })
-				}), j ? /* @__PURE__ */ h("div", {
+				}), j ? /* @__PURE__ */ u("div", {
 					className: "pointer-events-none absolute inset-0 flex flex-col items-center justify-center text-center",
-					children: [/* @__PURE__ */ m("span", {
+					children: [/* @__PURE__ */ l("span", {
 						className: "text-2xl font-bold text-text-primary",
 						children: M
-					}), _ ? /* @__PURE__ */ m("span", {
+					}), _ ? /* @__PURE__ */ l("span", {
 						className: "mt-0.5 max-w-[70%] text-xs text-text-secondary",
 						children: _
 					}) : null]
 				}) : null]
 			}),
-			S ? /* @__PURE__ */ m("ul", {
+			S ? /* @__PURE__ */ l("ul", {
 				className: "mt-3 flex flex-wrap items-center justify-center gap-x-4 gap-y-1.5",
-				children: D.map((e) => /* @__PURE__ */ h("li", {
+				children: D.map((e) => /* @__PURE__ */ u("li", {
 					className: "flex items-center gap-1.5 text-xs text-text-secondary",
 					children: [
-						/* @__PURE__ */ m("span", {
+						/* @__PURE__ */ l("span", {
 							"aria-hidden": "true",
 							className: "h-2.5 w-2.5 rounded-[3px]",
 							style: { backgroundColor: e.color }
 						}),
-						/* @__PURE__ */ m("span", { children: e.name }),
-						/* @__PURE__ */ h("span", {
+						/* @__PURE__ */ l("span", { children: e.name }),
+						/* @__PURE__ */ u("span", {
 							className: "tabular-nums text-text-muted",
 							children: [Math.round(e.value / O * 100), "%"]
 						})
 					]
 				}, e.name))
 			}) : null,
-			/* @__PURE__ */ h("table", {
-				style: p,
+			/* @__PURE__ */ u("table", {
+				style: c,
 				children: [
-					/* @__PURE__ */ m("caption", { children: k }),
-					/* @__PURE__ */ m("thead", { children: /* @__PURE__ */ h("tr", { children: [
-						/* @__PURE__ */ m("th", {
+					/* @__PURE__ */ l("caption", { children: k }),
+					/* @__PURE__ */ l("thead", { children: /* @__PURE__ */ u("tr", { children: [
+						/* @__PURE__ */ l("th", {
 							scope: "col",
 							children: "Category"
 						}),
-						/* @__PURE__ */ m("th", {
+						/* @__PURE__ */ l("th", {
 							scope: "col",
 							children: "Value"
 						}),
-						/* @__PURE__ */ m("th", {
+						/* @__PURE__ */ l("th", {
 							scope: "col",
 							children: "Share"
 						})
 					] }) }),
-					/* @__PURE__ */ m("tbody", { children: D.map((e) => /* @__PURE__ */ h("tr", { children: [
-						/* @__PURE__ */ m("th", {
+					/* @__PURE__ */ l("tbody", { children: D.map((e) => /* @__PURE__ */ u("tr", { children: [
+						/* @__PURE__ */ l("th", {
 							scope: "row",
 							children: e.name
 						}),
-						/* @__PURE__ */ m("td", { children: x(e.value) }),
-						/* @__PURE__ */ h("td", { children: [Math.round(e.value / O * 100), "%"] })
+						/* @__PURE__ */ l("td", { children: x(e.value) }),
+						/* @__PURE__ */ u("td", { children: [Math.round(e.value / O * 100), "%"] })
 					] }, e.name)) })
 				]
 			})

package/dist/timecampus/components/charts/DonutChart.js.map

@@ -1 +1 @@
-{"version":3,"file":"DonutChart.js","names":[],"sources":["../../../../src/timecampus/components/charts/DonutChart.tsx"],"sourcesContent":["import { Cell, Pie, PieChart, ResponsiveContainer, Tooltip } from \"recharts\";\nimport { cn } from \"../../utils/helpers\";\nimport {\n  chartTokens,\n  formatNumber,\n  renderValue,\n  seriesColor,\n  usePrefersReducedMotion,\n  type DonutSlice,\n  type ValueFormatter,\n} from \"./chartTheme\";\nimport { ChartEmpty, ChartTooltip, srOnlyStyle } from \"./ChartParts\";\n\nexport interface DonutChartProps {\n  /** Slices `{ name, value, color? }`. */\n  data: DonutSlice[];\n  /** Small caption under the centre value (e.g. \"Total assets\"). */\n  centerLabel?: string;\n  /**\n   * Big centre value. If omitted while `centerLabel` is set, the summed total is\n   * shown. A number is run through `valueFormat`.\n   */\n  centerValue?: string | number;\n  /** Pixel height of the ring. Default 240. */\n  height?: number;\n  /** Ring thickness as a fraction of the radius (0–1). Default 0.42. */\n  thickness?: number;\n  /** Formats slice + centre values. Default grouped integer. */\n  valueFormat?: ValueFormatter;\n  /** Show the legend list under the ring. Default true. */\n  showLegend?: boolean;\n  /** Message shown when there are no slices (or all zero). */\n  emptyLabel?: string;\n  /** Accessible name. */\n  ariaLabel?: string;\n  className?: string;\n}\n\n/**\n * DonutChart — a category/status mix as a ring with a center total. Slices take\n * the categorical ramp in fixed order, identity is carried by an always-present\n * legend (never colour alone), and hover reveals a token-styled tooltip.\n * Renders an empty state — never a fake ring — when there is nothing to show.\n */\nexport function DonutChart({\n  data,\n  centerLabel,\n  centerValue,\n  height = 240,\n  thickness = 0.42,\n  valueFormat = formatNumber,\n  showLegend = true,\n  emptyLabel,\n  ariaLabel,\n  className,\n}: DonutChartProps) {\n  const reducedMotion = usePrefersReducedMotion();\n\n  const slices = data\n    .filter(\n      (slice) =>\n        typeof slice.value === \"number\" &&\n        Number.isFinite(slice.value) &&\n        slice.value > 0,\n    )\n    .map((slice, index) => ({\n      ...slice,\n      color: slice.color ?? seriesColor(index),\n    }));\n\n  const total = slices.reduce((sum, slice) => sum + slice.value, 0);\n\n  if (slices.length === 0 || total <= 0) {\n    return (\n      <ChartEmpty height={height} label={emptyLabel} className={className} />\n    );\n  }\n\n  const label =\n    ariaLabel ??\n    `${centerLabel ?? \"Distribution\"}: ${slices.map((s) => s.name).join(\", \")}`;\n  const outerPct = 82;\n  const innerPct = Math.max(0, Math.round(outerPct * (1 - thickness)));\n  const showCenter = centerLabel !== undefined || centerValue !== undefined;\n  const resolvedCenter =\n    centerValue !== undefined\n      ? renderValue(centerValue, valueFormat)\n      : valueFormat(total);\n\n  return (\n    <figure role=\"img\" aria-label={label} className={cn(\"w-full\", className)}>\n      <div className=\"relative mx-auto\" style={{ height }}>\n        <ResponsiveContainer width=\"100%\" height=\"100%\">\n          <PieChart>\n            <Tooltip\n              cursor={false}\n              content={<ChartTooltip valueFormat={valueFormat} hideLabel />}\n            />\n            <Pie\n              data={slices}\n              dataKey=\"value\"\n              nameKey=\"name\"\n              cx=\"50%\"\n              cy=\"50%\"\n              innerRadius={`${innerPct}%`}\n              outerRadius={`${outerPct}%`}\n              paddingAngle={1.5}\n              stroke={chartTokens.surface}\n              strokeWidth={2}\n              isAnimationActive={!reducedMotion}\n            >\n              {slices.map((slice) => (\n                <Cell key={slice.name} fill={slice.color} />\n              ))}\n            </Pie>\n          </PieChart>\n        </ResponsiveContainer>\n\n        {showCenter ? (\n          <div className=\"pointer-events-none absolute inset-0 flex flex-col items-center justify-center text-center\">\n            <span className=\"text-2xl font-bold text-text-primary\">\n              {resolvedCenter}\n            </span>\n            {centerLabel ? (\n              <span className=\"mt-0.5 max-w-[70%] text-xs text-text-secondary\">\n                {centerLabel}\n              </span>\n            ) : null}\n          </div>\n        ) : null}\n      </div>\n\n      {showLegend ? (\n        <ul className=\"mt-3 flex flex-wrap items-center justify-center gap-x-4 gap-y-1.5\">\n          {slices.map((slice) => (\n            <li\n              key={slice.name}\n              className=\"flex items-center gap-1.5 text-xs text-text-secondary\"\n            >\n              <span\n                aria-hidden=\"true\"\n                className=\"h-2.5 w-2.5 rounded-[3px]\"\n                style={{ backgroundColor: slice.color }}\n              />\n              <span>{slice.name}</span>\n              <span className=\"tabular-nums text-text-muted\">\n                {Math.round((slice.value / total) * 100)}%\n              </span>\n            </li>\n          ))}\n        </ul>\n      ) : null}\n\n      <table style={srOnlyStyle}>\n        <caption>{label}</caption>\n        <thead>\n          <tr>\n            <th scope=\"col\">Category</th>\n            <th scope=\"col\">Value</th>\n            <th scope=\"col\">Share</th>\n          </tr>\n        </thead>\n        <tbody>\n          {slices.map((slice) => (\n            <tr key={slice.name}>\n              <th scope=\"row\">{slice.name}</th>\n              <td>{valueFormat(slice.value)}</td>\n              <td>{Math.round((slice.value / total) * 100)}%</td>\n            </tr>\n          ))}\n        </tbody>\n      </table>\n    </figure>\n  );\n}\n"],"mappings":"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"}
+{"version":3,"file":"DonutChart.js","names":[],"sources":["../../../../src/timecampus/components/charts/DonutChart.tsx"],"sourcesContent":["import { Cell, Pie, PieChart, ResponsiveContainer, Tooltip } from \"recharts\";\nimport { cn } from \"../../utils/helpers\";\nimport {\n  chartTokens,\n  formatNumber,\n  renderValue,\n  seriesColor,\n  usePrefersReducedMotion,\n  type DonutSlice,\n  type ValueFormatter,\n} from \"./chartTheme\";\nimport { ChartEmpty, ChartTooltip, srOnlyStyle } from \"./ChartParts\";\n\nexport interface DonutChartProps {\n  /** Slices `{ name, value, color? }`. */\n  data: DonutSlice[];\n  /** Small caption under the centre value (e.g. \"Total assets\"). */\n  centerLabel?: string;\n  /**\n   * Big centre value. If omitted while `centerLabel` is set, the summed total is\n   * shown. A number is run through `valueFormat`.\n   */\n  centerValue?: string | number;\n  /** Pixel height of the ring. Default 240. */\n  height?: number;\n  /** Ring thickness as a fraction of the radius (0–1). Default 0.42. */\n  thickness?: number;\n  /** Formats slice + centre values. Default grouped integer. */\n  valueFormat?: ValueFormatter;\n  /** Show the legend list under the ring. Default true. */\n  showLegend?: boolean;\n  /** Message shown when there are no slices (or all zero). */\n  emptyLabel?: string;\n  /** Accessible name. */\n  ariaLabel?: string;\n  className?: string;\n}\n\n/**\n * DonutChart — a category/status mix as a ring with a center total. Slices take\n * the categorical ramp in fixed order, identity is carried by an always-present\n * legend (never colour alone), and hover reveals a token-styled tooltip.\n * Renders an empty state — never a fake ring — when there is nothing to show.\n */\nexport function DonutChart({\n  data,\n  centerLabel,\n  centerValue,\n  height = 240,\n  thickness = 0.42,\n  valueFormat = formatNumber,\n  showLegend = true,\n  emptyLabel,\n  ariaLabel,\n  className,\n}: DonutChartProps) {\n  const reducedMotion = usePrefersReducedMotion();\n\n  const slices = data\n    .filter(\n      (slice) =>\n        typeof slice.value === \"number\" &&\n        Number.isFinite(slice.value) &&\n        slice.value > 0,\n    )\n    .map((slice, index) => ({\n      ...slice,\n      color: slice.color ?? seriesColor(index),\n    }));\n\n  const total = slices.reduce((sum, slice) => sum + slice.value, 0);\n\n  if (slices.length === 0 || total <= 0) {\n    return (\n      <ChartEmpty height={height} label={emptyLabel} className={className} />\n    );\n  }\n\n  const label =\n    ariaLabel ??\n    `${centerLabel ?? \"Distribution\"}: ${slices.map((s) => s.name).join(\", \")}`;\n  const outerPct = 82;\n  const innerPct = Math.max(0, Math.round(outerPct * (1 - thickness)));\n  const showCenter = centerLabel !== undefined || centerValue !== undefined;\n  const resolvedCenter =\n    centerValue !== undefined\n      ? renderValue(centerValue, valueFormat)\n      : valueFormat(total);\n\n  return (\n    <figure role=\"img\" aria-label={label} className={cn(\"w-full\", className)}>\n      <div className=\"relative mx-auto\" style={{ height }}>\n        <ResponsiveContainer width=\"100%\" height=\"100%\">\n          <PieChart>\n            <Tooltip\n              cursor={false}\n              content={<ChartTooltip valueFormat={valueFormat} hideLabel />}\n            />\n            <Pie\n              data={slices}\n              dataKey=\"value\"\n              nameKey=\"name\"\n              cx=\"50%\"\n              cy=\"50%\"\n              innerRadius={`${innerPct}%`}\n              outerRadius={`${outerPct}%`}\n              paddingAngle={1.5}\n              stroke={chartTokens.surface}\n              strokeWidth={2}\n              isAnimationActive={!reducedMotion}\n            >\n              {slices.map((slice) => (\n                <Cell key={slice.name} fill={slice.color} />\n              ))}\n            </Pie>\n          </PieChart>\n        </ResponsiveContainer>\n\n        {showCenter ? (\n          <div className=\"pointer-events-none absolute inset-0 flex flex-col items-center justify-center text-center\">\n            <span className=\"text-2xl font-bold text-text-primary\">\n              {resolvedCenter}\n            </span>\n            {centerLabel ? (\n              <span className=\"mt-0.5 max-w-[70%] text-xs text-text-secondary\">\n                {centerLabel}\n              </span>\n            ) : null}\n          </div>\n        ) : null}\n      </div>\n\n      {showLegend ? (\n        <ul className=\"mt-3 flex flex-wrap items-center justify-center gap-x-4 gap-y-1.5\">\n          {slices.map((slice) => (\n            <li\n              key={slice.name}\n              className=\"flex items-center gap-1.5 text-xs text-text-secondary\"\n            >\n              <span\n                aria-hidden=\"true\"\n                className=\"h-2.5 w-2.5 rounded-[3px]\"\n                style={{ backgroundColor: slice.color }}\n              />\n              <span>{slice.name}</span>\n              <span className=\"tabular-nums text-text-muted\">\n                {Math.round((slice.value / total) * 100)}%\n              </span>\n            </li>\n          ))}\n        </ul>\n      ) : null}\n\n      <table style={srOnlyStyle}>\n        <caption>{label}</caption>\n        <thead>\n          <tr>\n            <th scope=\"col\">Category</th>\n            <th scope=\"col\">Value</th>\n            <th scope=\"col\">Share</th>\n          </tr>\n        </thead>\n        <tbody>\n          {slices.map((slice) => (\n            <tr key={slice.name}>\n              <th scope=\"row\">{slice.name}</th>\n              <td>{valueFormat(slice.value)}</td>\n              <td>{Math.round((slice.value / total) * 100)}%</td>\n            </tr>\n          ))}\n        </tbody>\n      </table>\n    </figure>\n  );\n}\n"],"mappings":"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"}