@corensystem/coren-ui 1.0.0-next.20260924.75108.887a9c2

package/dist/kiosk-body.mjs

@@ -0,0 +1,352 @@
+import { Badge } from "./badge.mjs";
+import { Button } from "./button.mjs";
+import { Card, CardContent, CardHeader, CardTitle } from "./card.mjs";
+import { Separator } from "./separator.mjs";
+import { Skeleton } from "./skeleton.mjs";
+import { Progress } from "./progress.mjs";
+import { cn } from "@corensystem/coren-utils";
+import * as React from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region src/kiosk-body.tsx
+const WEEK = {
+	label: "Week 14",
+	range: "12 Aug – 18 Aug",
+	progress: 62,
+	tasks: [
+		{
+			id: "t1",
+			name: "Foundation & Raft Slab",
+			trade: "Civil",
+			status: "done",
+			progress: 100,
+			crew: 12
+		},
+		{
+			id: "t2",
+			name: "Blockwork — Ground Floor",
+			trade: "Masonry",
+			status: "done",
+			progress: 100,
+			crew: 9
+		},
+		{
+			id: "t3",
+			name: "Column & Beam Casting",
+			trade: "Civil",
+			status: "active",
+			progress: 74,
+			crew: 16
+		},
+		{
+			id: "t4",
+			name: "MEP First Fix",
+			trade: "MEP",
+			status: "active",
+			progress: 41,
+			crew: 8
+		},
+		{
+			id: "t5",
+			name: "Roof Slab Shuttering",
+			trade: "Formwork",
+			status: "active",
+			progress: 18,
+			crew: 11
+		},
+		{
+			id: "t6",
+			name: "External Plaster",
+			trade: "Finishes",
+			status: "upcoming",
+			progress: 0,
+			crew: 0
+		},
+		{
+			id: "t7",
+			name: "Joinery & Doors",
+			trade: "Finishes",
+			status: "upcoming",
+			progress: 0,
+			crew: 0
+		}
+	],
+	milestones: [
+		{
+			id: "m1",
+			label: "Substructure Signed Off",
+			date: "02 Aug",
+			hit: true
+		},
+		{
+			id: "m2",
+			label: "Superstructure Topped Out",
+			date: "21 Aug",
+			hit: false
+		},
+		{
+			id: "m3",
+			label: "Handover to Fit-Out",
+			date: "09 Sep",
+			hit: false
+		}
+	]
+};
+const TRADE_TONE = {
+	Civil: "wwc:bg-primary",
+	Masonry: "wwc:bg-chart-2",
+	MEP: "wwc:bg-chart-3",
+	Formwork: "wwc:bg-chart-4",
+	Finishes: "wwc:bg-chart-5"
+};
+/** Always-on TV kiosk panel that auto-advances through a villa's weekly overview and active tasks. */
+const KioskBody = React.forwardRef(({ house = "Villa 12 — Cluster B", onAdvanceHouse = () => {}, className, ...props }, ref) => {
+	const week = React.useMemo(() => WEEK, []);
+	const activeTasks = React.useMemo(() => week.tasks.filter((t) => t.status === "active"), [week]);
+	const [resolved, setResolved] = React.useState(false);
+	const [modelShown, setModelShown] = React.useState(false);
+	const [phase, setPhase] = React.useState("overview");
+	const [taskStep, setTaskStep] = React.useState(-1);
+	const onAdvanceRef = React.useRef(onAdvanceHouse);
+	onAdvanceRef.current = onAdvanceHouse;
+	React.useEffect(() => {
+		let cancelled = false;
+		const a = window.setTimeout(() => {
+			if (!cancelled) setResolved(true);
+		}, 700);
+		const b = window.setTimeout(() => {
+			if (!cancelled) setModelShown(true);
+		}, 1100);
+		return () => {
+			cancelled = true;
+			window.clearTimeout(a);
+			window.clearTimeout(b);
+		};
+	}, []);
+	React.useEffect(() => {
+		if (!modelShown) return;
+		let cancelled = false;
+		const timers = [];
+		const at = (ms, fn) => {
+			timers.push(window.setTimeout(() => {
+				if (!cancelled) fn();
+			}, ms));
+		};
+		let t = 0;
+		setPhase("overview");
+		setTaskStep(-1);
+		at(t += 5e3, () => setPhase("tasks"));
+		activeTasks.forEach((_, i) => {
+			at(t += 4e3, () => setTaskStep(i));
+		});
+		at(t += 4e3, () => {
+			setPhase("overview");
+			setTaskStep(-1);
+			onAdvanceRef.current();
+		});
+		return () => {
+			cancelled = true;
+			timers.forEach(window.clearTimeout);
+		};
+	}, [
+		modelShown,
+		activeTasks,
+		house
+	]);
+	const highlighted = React.useCallback((task) => {
+		if (task.status !== "active") return false;
+		if (phase === "overview" || taskStep < 0) return true;
+		return activeTasks[taskStep]?.id === task.id;
+	}, [
+		phase,
+		taskStep,
+		activeTasks
+	]);
+	const focused = phase === "tasks" && taskStep >= 0 ? activeTasks[taskStep] : null;
+	return /* @__PURE__ */ jsxs("section", {
+		ref,
+		className: cn("wwc:flex wwc:h-full wwc:min-h-0 wwc:w-full wwc:flex-col wwc:gap-4 wwc:bg-background wwc:p-6 wwc:text-foreground wwc:lg:flex-row", className),
+		...props,
+		children: [/* @__PURE__ */ jsxs("div", {
+			className: "wwc:relative wwc:flex wwc:min-h-96 wwc:flex-1 wwc:overflow-hidden wwc:rounded-xl wwc:border wwc:border-border wwc:bg-card",
+			children: [
+				/* @__PURE__ */ jsxs("div", {
+					className: "wwc:absolute wwc:inset-x-0 wwc:top-0 wwc:z-20 wwc:flex wwc:items-start wwc:justify-between wwc:gap-3 wwc:p-4",
+					children: [/* @__PURE__ */ jsxs("div", {
+						className: "wwc:flex wwc:flex-col wwc:gap-1",
+						children: [/* @__PURE__ */ jsx("span", {
+							className: "wwc:text-xs wwc:font-medium wwc:uppercase wwc:tracking-widest wwc:text-muted-foreground",
+							children: "Now showing"
+						}), /* @__PURE__ */ jsx("h2", {
+							className: "wwc:text-2xl wwc:font-semibold wwc:leading-tight wwc:tracking-tight",
+							children: house ?? "Selecting next villa…"
+						})]
+					}), /* @__PURE__ */ jsx(Badge, {
+						variant: phase === "tasks" ? "default" : "secondary",
+						className: "wwc:shrink-0",
+						children: phase === "tasks" ? "Task walkthrough" : "Weekly overview"
+					})]
+				}),
+				/* @__PURE__ */ jsx("div", {
+					className: cn("wwc:absolute wwc:inset-0 wwc:flex wwc:items-center wwc:justify-center wwc:transition-opacity wwc:duration-700", modelShown ? "wwc:opacity-100" : "wwc:opacity-0"),
+					children: /* @__PURE__ */ jsxs("div", {
+						className: cn("wwc:relative wwc:aspect-[4/3] wwc:w-3/5 wwc:max-w-lg wwc:rounded-lg wwc:border wwc:border-border wwc:bg-muted/40 wwc:transition-transform wwc:duration-700", focused ? "wwc:scale-110" : "wwc:scale-100"),
+						children: [
+							/* @__PURE__ */ jsx("div", { className: "wwc:absolute wwc:inset-x-6 wwc:bottom-6 wwc:top-1/2 wwc:rounded-md wwc:bg-muted" }),
+							/* @__PURE__ */ jsx("div", { className: "wwc:absolute wwc:inset-x-12 wwc:bottom-1/2 wwc:top-10 wwc:rounded-md wwc:bg-muted/70" }),
+							activeTasks.map((task, i) => /* @__PURE__ */ jsx("span", {
+								className: cn("wwc:absolute wwc:size-6 wwc:rounded-full wwc:ring-4 wwc:ring-background wwc:transition-all wwc:duration-500", TRADE_TONE[task.trade] ?? "wwc:bg-primary", highlighted(task) ? "wwc:opacity-100 wwc:scale-100" : "wwc:opacity-20 wwc:scale-75"),
+								style: {
+									left: `${18 + i * 26}%`,
+									top: `${34 + i % 2 * 24}%`
+								}
+							}, task.id))
+						]
+					})
+				}),
+				!modelShown && /* @__PURE__ */ jsxs("div", {
+					className: "wwc:absolute wwc:inset-0 wwc:z-10 wwc:flex wwc:flex-col wwc:items-center wwc:justify-center wwc:gap-3",
+					children: [/* @__PURE__ */ jsx(Skeleton, { className: "wwc:h-40 wwc:w-2/5 wwc:rounded-lg" }), /* @__PURE__ */ jsx("span", {
+						className: "wwc:text-sm wwc:text-muted-foreground",
+						children: resolved ? "Preparing view…" : "Loading model elements…"
+					})]
+				}),
+				focused && /* @__PURE__ */ jsxs("div", {
+					className: "wwc:absolute wwc:inset-x-4 wwc:bottom-4 wwc:z-20 wwc:rounded-lg wwc:border wwc:border-border wwc:bg-card/95 wwc:p-4 wwc:shadow-sm wwc:backdrop-blur",
+					children: [/* @__PURE__ */ jsxs("div", {
+						className: "wwc:flex wwc:items-center wwc:justify-between wwc:gap-3",
+						children: [/* @__PURE__ */ jsxs("div", {
+							className: "wwc:flex wwc:items-center wwc:gap-3",
+							children: [
+								/* @__PURE__ */ jsx("span", { className: cn("wwc:size-3 wwc:rounded-full", TRADE_TONE[focused.trade] ?? "wwc:bg-primary") }),
+								/* @__PURE__ */ jsx("span", {
+									className: "wwc:text-base wwc:font-medium",
+									children: focused.name
+								}),
+								/* @__PURE__ */ jsx(Badge, {
+									variant: "outline",
+									children: focused.trade
+								})
+							]
+						}), /* @__PURE__ */ jsxs("span", {
+							className: "wwc:text-sm wwc:text-muted-foreground",
+							children: [focused.crew, " crew on site"]
+						})]
+					}), /* @__PURE__ */ jsx(Progress, {
+						value: focused.progress,
+						className: "wwc:mt-3"
+					})]
+				})
+			]
+		}), /* @__PURE__ */ jsxs("div", {
+			className: "wwc:flex wwc:w-full wwc:flex-col wwc:gap-4 wwc:lg:w-96 wwc:lg:shrink-0",
+			children: [
+				/* @__PURE__ */ jsxs(Card, { children: [/* @__PURE__ */ jsx(CardHeader, { children: /* @__PURE__ */ jsxs(CardTitle, {
+					className: "wwc:flex wwc:items-center wwc:justify-between wwc:gap-2",
+					children: [/* @__PURE__ */ jsx("span", { children: week.label }), /* @__PURE__ */ jsx("span", {
+						className: "wwc:text-sm wwc:font-normal wwc:text-muted-foreground",
+						children: week.range
+					})]
+				}) }), /* @__PURE__ */ jsxs(CardContent, {
+					className: "wwc:flex wwc:flex-col wwc:gap-3",
+					children: [
+						/* @__PURE__ */ jsxs("div", {
+							className: "wwc:flex wwc:items-baseline wwc:justify-between",
+							children: [/* @__PURE__ */ jsx("span", {
+								className: "wwc:text-sm wwc:text-muted-foreground",
+								children: "Planned completion"
+							}), /* @__PURE__ */ jsxs("span", {
+								className: "wwc:text-2xl wwc:font-semibold wwc:tabular-nums",
+								children: [week.progress, "%"]
+							})]
+						}),
+						/* @__PURE__ */ jsx(Progress, { value: week.progress }),
+						/* @__PURE__ */ jsxs("div", {
+							className: "wwc:flex wwc:items-center wwc:gap-4 wwc:text-sm wwc:text-muted-foreground",
+							children: [
+								/* @__PURE__ */ jsxs("span", { children: [week.tasks.filter((t) => t.status === "done").length, " done"] }),
+								/* @__PURE__ */ jsxs("span", { children: [activeTasks.length, " active"] }),
+								/* @__PURE__ */ jsxs("span", { children: [week.tasks.filter((t) => t.status === "upcoming").length, " upcoming"] })
+							]
+						})
+					]
+				})] }),
+				/* @__PURE__ */ jsxs(Card, {
+					className: "wwc:flex wwc:min-h-0 wwc:flex-1 wwc:flex-col",
+					children: [/* @__PURE__ */ jsx(CardHeader, { children: /* @__PURE__ */ jsx(CardTitle, { children: "This week's activities" }) }), /* @__PURE__ */ jsx(CardContent, {
+						className: "wwc:flex wwc:min-h-0 wwc:flex-1 wwc:flex-col wwc:gap-2 wwc:overflow-y-auto",
+						children: week.tasks.map((task) => /* @__PURE__ */ jsxs("div", {
+							className: cn("wwc:flex wwc:flex-col wwc:gap-2 wwc:rounded-lg wwc:border wwc:p-3 wwc:transition-colors", highlighted(task) ? "wwc:border-primary wwc:bg-accent" : "wwc:border-border wwc:bg-transparent", task.status === "upcoming" && "wwc:opacity-60"),
+							children: [/* @__PURE__ */ jsxs("div", {
+								className: "wwc:flex wwc:items-start wwc:justify-between wwc:gap-2",
+								children: [/* @__PURE__ */ jsxs("div", {
+									className: "wwc:flex wwc:items-center wwc:gap-2",
+									children: [/* @__PURE__ */ jsx("span", { className: cn("wwc:size-2.5 wwc:rounded-full", TRADE_TONE[task.trade] ?? "wwc:bg-primary") }), /* @__PURE__ */ jsx("span", {
+										className: "wwc:text-sm wwc:font-medium wwc:leading-snug",
+										children: task.name
+									})]
+								}), /* @__PURE__ */ jsx(Badge, {
+									variant: task.status === "done" ? "secondary" : task.status === "active" ? "default" : "outline",
+									className: "wwc:shrink-0",
+									children: task.status === "done" ? "Done" : task.status === "active" ? "Active" : "Upcoming"
+								})]
+							}), /* @__PURE__ */ jsxs("div", {
+								className: "wwc:flex wwc:items-center wwc:gap-3",
+								children: [/* @__PURE__ */ jsx(Progress, {
+									value: task.progress,
+									className: "wwc:flex-1"
+								}), /* @__PURE__ */ jsxs("span", {
+									className: "wwc:w-10 wwc:shrink-0 wwc:text-right wwc:text-xs wwc:tabular-nums wwc:text-muted-foreground",
+									children: [task.progress, "%"]
+								})]
+							})]
+						}, task.id))
+					})]
+				}),
+				/* @__PURE__ */ jsxs(Card, { children: [/* @__PURE__ */ jsx(CardHeader, { children: /* @__PURE__ */ jsx(CardTitle, { children: "Milestones" }) }), /* @__PURE__ */ jsx(CardContent, {
+					className: "wwc:flex wwc:flex-col wwc:gap-3",
+					children: week.milestones.map((m, i) => /* @__PURE__ */ jsxs("div", {
+						className: "wwc:flex wwc:flex-col wwc:gap-3",
+						children: [i > 0 && /* @__PURE__ */ jsx(Separator, {}), /* @__PURE__ */ jsxs("div", {
+							className: "wwc:flex wwc:items-center wwc:justify-between wwc:gap-2",
+							children: [/* @__PURE__ */ jsxs("div", {
+								className: "wwc:flex wwc:items-center wwc:gap-2",
+								children: [/* @__PURE__ */ jsx("span", { className: cn("wwc:size-2.5 wwc:rounded-full", m.hit ? "wwc:bg-primary" : "wwc:bg-muted-foreground/40") }), /* @__PURE__ */ jsx("span", {
+									className: cn("wwc:text-sm", m.hit ? "wwc:text-foreground" : "wwc:text-muted-foreground"),
+									children: m.label
+								})]
+							}), /* @__PURE__ */ jsx("span", {
+								className: "wwc:text-xs wwc:tabular-nums wwc:text-muted-foreground",
+								children: m.date
+							})]
+						})]
+					}, m.id))
+				})] }),
+				/* @__PURE__ */ jsxs("div", {
+					className: "wwc:flex wwc:items-center wwc:gap-2",
+					children: [/* @__PURE__ */ jsx(Button, {
+						variant: "outline",
+						className: "wwc:flex-1",
+						onClick: () => {
+							setPhase((p) => p === "overview" ? "tasks" : "overview");
+							setTaskStep(-1);
+						},
+						children: phase === "overview" ? "Walk tasks" : "Back to overview"
+					}), /* @__PURE__ */ jsx(Button, {
+						className: "wwc:flex-1",
+						onClick: () => {
+							setPhase("overview");
+							setTaskStep(-1);
+							onAdvanceRef.current();
+						},
+						children: "Next villa"
+					})]
+				})
+			]
+		})]
+	});
+});
+KioskBody.displayName = "KioskBody";
+//#endregion
+export { KioskBody };
+
+//# sourceMappingURL=kiosk-body.mjs.map

package/dist/kiosk-body.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"kiosk-body.mjs","names":[],"sources":["../src/kiosk-body.tsx"],"sourcesContent":["import {cn} from \"@corensystem/coren-utils\";\nimport * as React from \"react\";\n\nimport {Badge} from \"./badge\";\nimport {Button} from \"./button\";\nimport {Card, CardContent, CardHeader, CardTitle} from \"./card\";\nimport {Progress} from \"./progress\";\nimport {Separator} from \"./separator\";\nimport {Skeleton} from \"./skeleton\";\n\n/* ---------------------------------- types --------------------------------- */\n\ntype TaskStatus = \"done\" | \"active\" | \"upcoming\";\n\ntype Task = {\n\tid: string;\n\tname: string;\n\ttrade: string;\n\tstatus: TaskStatus;\n\tprogress: number;\n\tcrew: number;\n};\n\ntype Milestone = {\n\tid: string;\n\tlabel: string;\n\tdate: string;\n\thit: boolean;\n};\n\ntype Week = {\n\tlabel: string;\n\trange: string;\n\tprogress: number;\n\ttasks: Task[];\n\tmilestones: Milestone[];\n};\n\ntype Phase = \"overview\" | \"tasks\";\n\n/* ------------------------------- mock schedule ------------------------------ */\n\nconst WEEK: Week = {\n\tlabel: \"Week 14\",\n\trange: \"12 Aug – 18 Aug\",\n\tprogress: 62,\n\ttasks: [\n\t\t{id: \"t1\", name: \"Foundation & Raft Slab\", trade: \"Civil\", status: \"done\", progress: 100, crew: 12},\n\t\t{id: \"t2\", name: \"Blockwork — Ground Floor\", trade: \"Masonry\", status: \"done\", progress: 100, crew: 9},\n\t\t{id: \"t3\", name: \"Column & Beam Casting\", trade: \"Civil\", status: \"active\", progress: 74, crew: 16},\n\t\t{id: \"t4\", name: \"MEP First Fix\", trade: \"MEP\", status: \"active\", progress: 41, crew: 8},\n\t\t{id: \"t5\", name: \"Roof Slab Shuttering\", trade: \"Formwork\", status: \"active\", progress: 18, crew: 11},\n\t\t{id: \"t6\", name: \"External Plaster\", trade: \"Finishes\", status: \"upcoming\", progress: 0, crew: 0},\n\t\t{id: \"t7\", name: \"Joinery & Doors\", trade: \"Finishes\", status: \"upcoming\", progress: 0, crew: 0},\n\t],\n\tmilestones: [\n\t\t{id: \"m1\", label: \"Substructure Signed Off\", date: \"02 Aug\", hit: true},\n\t\t{id: \"m2\", label: \"Superstructure Topped Out\", date: \"21 Aug\", hit: false},\n\t\t{id: \"m3\", label: \"Handover to Fit-Out\", date: \"09 Sep\", hit: false},\n\t],\n};\n\nconst TRADE_TONE: Record<string, string> = {\n\tCivil: \"wwc:bg-primary\",\n\tMasonry: \"wwc:bg-chart-2\",\n\tMEP: \"wwc:bg-chart-3\",\n\tFormwork: \"wwc:bg-chart-4\",\n\tFinishes: \"wwc:bg-chart-5\",\n};\n\n/* -------------------------------- props ----------------------------------- */\n\nexport interface KioskBodyProps extends React.HTMLAttributes<HTMLDivElement> {\n\t/** The villa currently on stage; `null` while the kiosk selects the next one. */\n\thouse?: string | null;\n\t/** Called when the kiosk finishes walking the active tasks and should advance to the next villa. */\n\tonAdvanceHouse?: () => void;\n}\n\n/* -------------------------------- component -------------------------------- */\n\n/** Always-on TV kiosk panel that auto-advances through a villa's weekly overview and active tasks. */\nconst KioskBody = React.forwardRef<HTMLDivElement, KioskBodyProps>(\n\t({house = \"Villa 12 — Cluster B\", onAdvanceHouse = () => {}, className, ...props}, ref) => {\n\t\tconst week = React.useMemo(() => WEEK, []);\n\t\tconst activeTasks = React.useMemo(() => week.tasks.filter((t) => t.status === \"active\"), [week]);\n\n\t\t// Mirrors the original viewer lifecycle: resolved (element groups sliced) → modelShown (grid hidden).\n\t\tconst [resolved, setResolved] = React.useState(false);\n\t\tconst [modelShown, setModelShown] = React.useState(false);\n\n\t\tconst [phase, setPhase] = React.useState<Phase>(\"overview\");\n\t\tconst [taskStep, setTaskStep] = React.useState(-1); // -1 = every active task lit at once\n\n\t\t// Keep the advance callback in a ref so the engine effect doesn't re-run when the parent re-renders.\n\t\tconst onAdvanceRef = React.useRef(onAdvanceHouse);\n\t\tonAdvanceRef.current = onAdvanceHouse;\n\n\t\tReact.useEffect(() => {\n\t\t\tlet cancelled = false;\n\t\t\tconst a = window.setTimeout(() => {\n\t\t\t\tif (!cancelled) setResolved(true);\n\t\t\t}, 700);\n\t\t\tconst b = window.setTimeout(() => {\n\t\t\t\tif (!cancelled) setModelShown(true);\n\t\t\t}, 1100);\n\t\t\treturn () => {\n\t\t\t\tcancelled = true;\n\t\t\t\twindow.clearTimeout(a);\n\t\t\t\twindow.clearTimeout(b);\n\t\t\t};\n\t\t}, []);\n\n\t\t// Kiosk engine: hold on the overview, then walk the active tasks one by one, then advance the house.\n\t\tReact.useEffect(() => {\n\t\t\tif (!modelShown) return;\n\t\t\tlet cancelled = false;\n\t\t\tconst timers: number[] = [];\n\t\t\tconst at = (ms: number, fn: () => void) => {\n\t\t\t\ttimers.push(\n\t\t\t\t\twindow.setTimeout(() => {\n\t\t\t\t\t\tif (!cancelled) fn();\n\t\t\t\t\t}, ms),\n\t\t\t\t);\n\t\t\t};\n\n\t\t\tlet t = 0;\n\t\t\tsetPhase(\"overview\");\n\t\t\tsetTaskStep(-1);\n\t\t\tat((t += 5000), () => setPhase(\"tasks\"));\n\t\t\tactiveTasks.forEach((_, i) => {\n\t\t\t\tat((t += 4000), () => setTaskStep(i));\n\t\t\t});\n\t\t\tat((t += 4000), () => {\n\t\t\t\tsetPhase(\"overview\");\n\t\t\t\tsetTaskStep(-1);\n\t\t\t\tonAdvanceRef.current();\n\t\t\t});\n\n\t\t\treturn () => {\n\t\t\t\tcancelled = true;\n\t\t\t\ttimers.forEach(window.clearTimeout);\n\t\t\t};\n\t\t}, [modelShown, activeTasks, house]);\n\n\t\tconst highlighted = React.useCallback(\n\t\t\t(task: Task) => {\n\t\t\t\tif (task.status !== \"active\") return false;\n\t\t\t\tif (phase === \"overview\" || taskStep < 0) return true;\n\t\t\t\treturn activeTasks[taskStep]?.id === task.id;\n\t\t\t},\n\t\t\t[phase, taskStep, activeTasks],\n\t\t);\n\n\t\tconst focused = phase === \"tasks\" && taskStep >= 0 ? activeTasks[taskStep] : null;\n\n\t\treturn (\n\t\t\t<section\n\t\t\t\tref={ref}\n\t\t\t\tclassName={cn(\n\t\t\t\t\t\"wwc:flex wwc:h-full wwc:min-h-0 wwc:w-full wwc:flex-col wwc:gap-4 wwc:bg-background wwc:p-6 wwc:text-foreground wwc:lg:flex-row\",\n\t\t\t\t\tclassName,\n\t\t\t\t)}\n\t\t\t\t{...props}\n\t\t\t>\n\t\t\t\t{/* ------------------------------- viewer ------------------------------- */}\n\t\t\t\t<div className=\"wwc:relative wwc:flex wwc:min-h-96 wwc:flex-1 wwc:overflow-hidden wwc:rounded-xl wwc:border wwc:border-border wwc:bg-card\">\n\t\t\t\t\t<div className=\"wwc:absolute wwc:inset-x-0 wwc:top-0 wwc:z-20 wwc:flex wwc:items-start wwc:justify-between wwc:gap-3 wwc:p-4\">\n\t\t\t\t\t\t<div className=\"wwc:flex wwc:flex-col wwc:gap-1\">\n\t\t\t\t\t\t\t<span className=\"wwc:text-xs wwc:font-medium wwc:uppercase wwc:tracking-widest wwc:text-muted-foreground\">\n\t\t\t\t\t\t\t\tNow showing\n\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t<h2 className=\"wwc:text-2xl wwc:font-semibold wwc:leading-tight wwc:tracking-tight\">\n\t\t\t\t\t\t\t\t{house ?? \"Selecting next villa…\"}\n\t\t\t\t\t\t\t</h2>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t\t<Badge variant={phase === \"tasks\" ? \"default\" : \"secondary\"} className=\"wwc:shrink-0\">\n\t\t\t\t\t\t\t{phase === \"tasks\" ? \"Task walkthrough\" : \"Weekly overview\"}\n\t\t\t\t\t\t</Badge>\n\t\t\t\t\t</div>\n\n\t\t\t\t\t{/* model stage — clean background, ground grid hidden */}\n\t\t\t\t\t<div\n\t\t\t\t\t\tclassName={cn(\n\t\t\t\t\t\t\t\"wwc:absolute wwc:inset-0 wwc:flex wwc:items-center wwc:justify-center wwc:transition-opacity wwc:duration-700\",\n\t\t\t\t\t\t\tmodelShown ? \"wwc:opacity-100\" : \"wwc:opacity-0\",\n\t\t\t\t\t\t)}\n\t\t\t\t\t>\n\t\t\t\t\t\t<div\n\t\t\t\t\t\t\tclassName={cn(\n\t\t\t\t\t\t\t\t\"wwc:relative wwc:aspect-[4/3] wwc:w-3/5 wwc:max-w-lg wwc:rounded-lg wwc:border wwc:border-border wwc:bg-muted/40 wwc:transition-transform wwc:duration-700\",\n\t\t\t\t\t\t\t\tfocused ? \"wwc:scale-110\" : \"wwc:scale-100\",\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<div className=\"wwc:absolute wwc:inset-x-6 wwc:bottom-6 wwc:top-1/2 wwc:rounded-md wwc:bg-muted\" />\n\t\t\t\t\t\t\t<div className=\"wwc:absolute wwc:inset-x-12 wwc:bottom-1/2 wwc:top-10 wwc:rounded-md wwc:bg-muted/70\" />\n\t\t\t\t\t\t\t{activeTasks.map((task, i) => (\n\t\t\t\t\t\t\t\t<span\n\t\t\t\t\t\t\t\t\tkey={task.id}\n\t\t\t\t\t\t\t\t\tclassName={cn(\n\t\t\t\t\t\t\t\t\t\t\"wwc:absolute wwc:size-6 wwc:rounded-full wwc:ring-4 wwc:ring-background wwc:transition-all wwc:duration-500\",\n\t\t\t\t\t\t\t\t\t\tTRADE_TONE[task.trade] ?? \"wwc:bg-primary\",\n\t\t\t\t\t\t\t\t\t\thighlighted(task) ? \"wwc:opacity-100 wwc:scale-100\" : \"wwc:opacity-20 wwc:scale-75\",\n\t\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t\tstyle={{left: `${18 + i * 26}%`, top: `${34 + (i % 2) * 24}%`}}\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t))}\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</div>\n\n\t\t\t\t\t{!modelShown && (\n\t\t\t\t\t\t<div className=\"wwc:absolute wwc:inset-0 wwc:z-10 wwc:flex wwc:flex-col wwc:items-center wwc:justify-center wwc:gap-3\">\n\t\t\t\t\t\t\t<Skeleton className=\"wwc:h-40 wwc:w-2/5 wwc:rounded-lg\" />\n\t\t\t\t\t\t\t<span className=\"wwc:text-sm wwc:text-muted-foreground\">\n\t\t\t\t\t\t\t\t{resolved ? \"Preparing view…\" : \"Loading model elements…\"}\n\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t)}\n\n\t\t\t\t\t{focused && (\n\t\t\t\t\t\t<div className=\"wwc:absolute wwc:inset-x-4 wwc:bottom-4 wwc:z-20 wwc:rounded-lg wwc:border wwc:border-border wwc:bg-card/95 wwc:p-4 wwc:shadow-sm wwc:backdrop-blur\">\n\t\t\t\t\t\t\t<div className=\"wwc:flex wwc:items-center wwc:justify-between wwc:gap-3\">\n\t\t\t\t\t\t\t\t<div className=\"wwc:flex wwc:items-center wwc:gap-3\">\n\t\t\t\t\t\t\t\t\t<span className={cn(\"wwc:size-3 wwc:rounded-full\", TRADE_TONE[focused.trade] ?? \"wwc:bg-primary\")} />\n\t\t\t\t\t\t\t\t\t<span className=\"wwc:text-base wwc:font-medium\">{focused.name}</span>\n\t\t\t\t\t\t\t\t\t<Badge variant=\"outline\">{focused.trade}</Badge>\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t<span className=\"wwc:text-sm wwc:text-muted-foreground\">{focused.crew} crew on site</span>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t<Progress value={focused.progress} className=\"wwc:mt-3\" />\n\t\t\t\t\t\t</div>\n\t\t\t\t\t)}\n\t\t\t\t</div>\n\n\t\t\t\t{/* ------------------------------- side rail ----------------------------- */}\n\t\t\t\t<div className=\"wwc:flex wwc:w-full wwc:flex-col wwc:gap-4 wwc:lg:w-96 wwc:lg:shrink-0\">\n\t\t\t\t\t<Card>\n\t\t\t\t\t\t<CardHeader>\n\t\t\t\t\t\t\t<CardTitle className=\"wwc:flex wwc:items-center wwc:justify-between wwc:gap-2\">\n\t\t\t\t\t\t\t\t<span>{week.label}</span>\n\t\t\t\t\t\t\t\t<span className=\"wwc:text-sm wwc:font-normal wwc:text-muted-foreground\">{week.range}</span>\n\t\t\t\t\t\t\t</CardTitle>\n\t\t\t\t\t\t</CardHeader>\n\t\t\t\t\t\t<CardContent className=\"wwc:flex wwc:flex-col wwc:gap-3\">\n\t\t\t\t\t\t\t<div className=\"wwc:flex wwc:items-baseline wwc:justify-between\">\n\t\t\t\t\t\t\t\t<span className=\"wwc:text-sm wwc:text-muted-foreground\">Planned completion</span>\n\t\t\t\t\t\t\t\t<span className=\"wwc:text-2xl wwc:font-semibold wwc:tabular-nums\">{week.progress}%</span>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t<Progress value={week.progress} />\n\t\t\t\t\t\t\t<div className=\"wwc:flex wwc:items-center wwc:gap-4 wwc:text-sm wwc:text-muted-foreground\">\n\t\t\t\t\t\t\t\t<span>{week.tasks.filter((t) => t.status === \"done\").length} done</span>\n\t\t\t\t\t\t\t\t<span>{activeTasks.length} active</span>\n\t\t\t\t\t\t\t\t<span>{week.tasks.filter((t) => t.status === \"upcoming\").length} upcoming</span>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</CardContent>\n\t\t\t\t\t</Card>\n\n\t\t\t\t\t<Card className=\"wwc:flex wwc:min-h-0 wwc:flex-1 wwc:flex-col\">\n\t\t\t\t\t\t<CardHeader>\n\t\t\t\t\t\t\t<CardTitle>This week&apos;s activities</CardTitle>\n\t\t\t\t\t\t</CardHeader>\n\t\t\t\t\t\t<CardContent className=\"wwc:flex wwc:min-h-0 wwc:flex-1 wwc:flex-col wwc:gap-2 wwc:overflow-y-auto\">\n\t\t\t\t\t\t\t{week.tasks.map((task) => (\n\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\tkey={task.id}\n\t\t\t\t\t\t\t\t\tclassName={cn(\n\t\t\t\t\t\t\t\t\t\t\"wwc:flex wwc:flex-col wwc:gap-2 wwc:rounded-lg wwc:border wwc:p-3 wwc:transition-colors\",\n\t\t\t\t\t\t\t\t\t\thighlighted(task) ? \"wwc:border-primary wwc:bg-accent\" : \"wwc:border-border wwc:bg-transparent\",\n\t\t\t\t\t\t\t\t\t\ttask.status === \"upcoming\" && \"wwc:opacity-60\",\n\t\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t<div className=\"wwc:flex wwc:items-start wwc:justify-between wwc:gap-2\">\n\t\t\t\t\t\t\t\t\t\t<div className=\"wwc:flex wwc:items-center wwc:gap-2\">\n\t\t\t\t\t\t\t\t\t\t\t<span\n\t\t\t\t\t\t\t\t\t\t\t\tclassName={cn(\"wwc:size-2.5 wwc:rounded-full\", TRADE_TONE[task.trade] ?? \"wwc:bg-primary\")}\n\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t\t<span className=\"wwc:text-sm wwc:font-medium wwc:leading-snug\">{task.name}</span>\n\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t<Badge\n\t\t\t\t\t\t\t\t\t\t\tvariant={task.status === \"done\" ? \"secondary\" : task.status === \"active\" ? \"default\" : \"outline\"}\n\t\t\t\t\t\t\t\t\t\t\tclassName=\"wwc:shrink-0\"\n\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t{task.status === \"done\" ? \"Done\" : task.status === \"active\" ? \"Active\" : \"Upcoming\"}\n\t\t\t\t\t\t\t\t\t\t</Badge>\n\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t<div className=\"wwc:flex wwc:items-center wwc:gap-3\">\n\t\t\t\t\t\t\t\t\t\t<Progress value={task.progress} className=\"wwc:flex-1\" />\n\t\t\t\t\t\t\t\t\t\t<span className=\"wwc:w-10 wwc:shrink-0 wwc:text-right wwc:text-xs wwc:tabular-nums wwc:text-muted-foreground\">\n\t\t\t\t\t\t\t\t\t\t\t{task.progress}%\n\t\t\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t))}\n\t\t\t\t\t\t</CardContent>\n\t\t\t\t\t</Card>\n\n\t\t\t\t\t<Card>\n\t\t\t\t\t\t<CardHeader>\n\t\t\t\t\t\t\t<CardTitle>Milestones</CardTitle>\n\t\t\t\t\t\t</CardHeader>\n\t\t\t\t\t\t<CardContent className=\"wwc:flex wwc:flex-col wwc:gap-3\">\n\t\t\t\t\t\t\t{week.milestones.map((m, i) => (\n\t\t\t\t\t\t\t\t<div key={m.id} className=\"wwc:flex wwc:flex-col wwc:gap-3\">\n\t\t\t\t\t\t\t\t\t{i > 0 && <Separator />}\n\t\t\t\t\t\t\t\t\t<div className=\"wwc:flex wwc:items-center wwc:justify-between wwc:gap-2\">\n\t\t\t\t\t\t\t\t\t\t<div className=\"wwc:flex wwc:items-center wwc:gap-2\">\n\t\t\t\t\t\t\t\t\t\t\t<span\n\t\t\t\t\t\t\t\t\t\t\t\tclassName={cn(\n\t\t\t\t\t\t\t\t\t\t\t\t\t\"wwc:size-2.5 wwc:rounded-full\",\n\t\t\t\t\t\t\t\t\t\t\t\t\tm.hit ? \"wwc:bg-primary\" : \"wwc:bg-muted-foreground/40\",\n\t\t\t\t\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t\t<span className={cn(\"wwc:text-sm\", m.hit ? \"wwc:text-foreground\" : \"wwc:text-muted-foreground\")}>\n\t\t\t\t\t\t\t\t\t\t\t\t{m.label}\n\t\t\t\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t<span className=\"wwc:text-xs wwc:tabular-nums wwc:text-muted-foreground\">{m.date}</span>\n\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t))}\n\t\t\t\t\t\t</CardContent>\n\t\t\t\t\t</Card>\n\n\t\t\t\t\t<div className=\"wwc:flex wwc:items-center wwc:gap-2\">\n\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\tvariant=\"outline\"\n\t\t\t\t\t\t\tclassName=\"wwc:flex-1\"\n\t\t\t\t\t\t\tonClick={() => {\n\t\t\t\t\t\t\t\tsetPhase((p) => (p === \"overview\" ? \"tasks\" : \"overview\"));\n\t\t\t\t\t\t\t\tsetTaskStep(-1);\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{phase === \"overview\" ? \"Walk tasks\" : \"Back to overview\"}\n\t\t\t\t\t\t</Button>\n\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\tclassName=\"wwc:flex-1\"\n\t\t\t\t\t\t\tonClick={() => {\n\t\t\t\t\t\t\t\tsetPhase(\"overview\");\n\t\t\t\t\t\t\t\tsetTaskStep(-1);\n\t\t\t\t\t\t\t\tonAdvanceRef.current();\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\tNext villa\n\t\t\t\t\t\t</Button>\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t</section>\n\t\t);\n\t},\n);\nKioskBody.displayName = \"KioskBody\";\n\nexport {KioskBody};\n"],"mappings":"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"}

package/dist/kpi-bar.d.mts

@@ -0,0 +1,29 @@
+import * as React from "react";
+//#region src/kpi-bar.d.ts
+export type KPIBarDot = "success" | "warning" | "danger" | "neutral";
+/** One metric in a KPIBar — a compact value + label with an optional leading icon or status dot. */
+export interface KPIBarItem {
+  /** The metric value (pre-formatted by the caller). */
+  value: React.ReactNode;
+  /** Short label shown after the value. */
+  label?: string;
+  /** Leading icon (lucide or any component type). Takes precedence over `dot`. */
+  icon?: React.ElementType;
+  /** Leading status dot color (used when no `icon` is given). */
+  dot?: KPIBarDot;
+  /** Tone the value (and icon) — "danger" turns them red (e.g. active alerts). */
+  tone?: "default" | "danger";
+  /** Hide the label below this breakpoint (the value always stays). */
+  hideLabelBelow?: "sm" | "md";
+}
+export interface KPIBarProps {
+  /** Border-separated groups of items. Items within a group share one section (no inner border). */
+  groups: KPIBarItem[][];
+  className?: string;
+}
+/** A compact horizontal bar of headline metrics (value + label, optional icon or status dot),
+ * border-separated into groups — the stat strip above a dashboard. */
+declare const KPIBar: React.ForwardRefExoticComponent<KPIBarProps & React.RefAttributes<HTMLDivElement>>;
+//#endregion
+export { KPIBar };
+//# sourceMappingURL=kpi-bar.d.mts.map

package/dist/kpi-bar.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"kpi-bar.d.mts","names":[],"sources":["../src/kpi-bar.tsx"],"mappings":";;YAGY;;iBAGK;;EAEhB,OAAO,MAAM;;EAEb;;EAEA,OAAO,MAAM;;EAEb,MAAM;;EAEN;;EAEA;;iBAGgB;;EAEhB,QAAQ;EACR;;;;cAoCK,QAAM,MAAA,0BAAA,cAAA,MAAA,cAAA"}

package/dist/kpi-bar.mjs

@@ -0,0 +1,46 @@
+import { cn } from "@corensystem/coren-utils";
+import * as React from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region src/kpi-bar.tsx
+const dotColor = {
+	success: "wwc:bg-green-500",
+	warning: "wwc:bg-amber-500",
+	danger: "wwc:bg-red-500",
+	neutral: "wwc:bg-muted-foreground"
+};
+const hideLabel = {
+	sm: "wwc:hidden wwc:sm:inline",
+	md: "wwc:hidden wwc:md:inline"
+};
+function Item({ value, label, icon: Icon, dot, tone, hideLabelBelow }) {
+	const danger = tone === "danger";
+	return /* @__PURE__ */ jsxs("div", {
+		className: "wwc:flex wwc:items-center wwc:gap-1.5",
+		children: [
+			Icon ? /* @__PURE__ */ jsx(Icon, { className: cn("wwc:h-4 wwc:w-4", danger ? "wwc:text-red-500" : "wwc:text-muted-foreground") }) : dot ? /* @__PURE__ */ jsx("div", { className: cn("wwc:h-2 wwc:w-2 wwc:rounded-full", dotColor[dot]) }) : null,
+			/* @__PURE__ */ jsx("span", {
+				className: cn("wwc:text-sm wwc:font-semibold", danger && "wwc:text-red-500"),
+				children: value
+			}),
+			label && /* @__PURE__ */ jsx("span", {
+				className: cn("wwc:text-xs wwc:text-muted-foreground", hideLabelBelow && hideLabel[hideLabelBelow]),
+				children: label
+			})
+		]
+	});
+}
+/** A compact horizontal bar of headline metrics (value + label, optional icon or status dot),
+* border-separated into groups — the stat strip above a dashboard. */
+const KPIBar = React.forwardRef(({ groups, className }, ref) => /* @__PURE__ */ jsx("div", {
+	ref,
+	className: cn("wwc:flex wwc:items-center wwc:gap-4 wwc:border-b wwc:bg-card wwc:px-4 wwc:h-14 wwc:shrink-0", className),
+	children: groups.map((items, gi) => /* @__PURE__ */ jsx("div", {
+		className: cn("wwc:flex wwc:items-center wwc:gap-4", gi < groups.length - 1 && "wwc:pr-4 wwc:border-r"),
+		children: items.map((item, ii) => /* @__PURE__ */ jsx(Item, { ...item }, ii))
+	}, gi))
+}));
+KPIBar.displayName = "KPIBar";
+//#endregion
+export { KPIBar };
+
+//# sourceMappingURL=kpi-bar.mjs.map

package/dist/kpi-bar.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"kpi-bar.mjs","names":[],"sources":["../src/kpi-bar.tsx"],"sourcesContent":["import {cn} from \"@corensystem/coren-utils\";\nimport * as React from \"react\";\n\nexport type KPIBarDot = \"success\" | \"warning\" | \"danger\" | \"neutral\";\n\n/** One metric in a KPIBar — a compact value + label with an optional leading icon or status dot. */\nexport interface KPIBarItem {\n\t/** The metric value (pre-formatted by the caller). */\n\tvalue: React.ReactNode;\n\t/** Short label shown after the value. */\n\tlabel?: string;\n\t/** Leading icon (lucide or any component type). Takes precedence over `dot`. */\n\ticon?: React.ElementType;\n\t/** Leading status dot color (used when no `icon` is given). */\n\tdot?: KPIBarDot;\n\t/** Tone the value (and icon) — \"danger\" turns them red (e.g. active alerts). */\n\ttone?: \"default\" | \"danger\";\n\t/** Hide the label below this breakpoint (the value always stays). */\n\thideLabelBelow?: \"sm\" | \"md\";\n}\n\nexport interface KPIBarProps {\n\t/** Border-separated groups of items. Items within a group share one section (no inner border). */\n\tgroups: KPIBarItem[][];\n\tclassName?: string;\n}\n\nconst dotColor: Record<KPIBarDot, string> = {\n\tsuccess: \"wwc:bg-green-500\",\n\twarning: \"wwc:bg-amber-500\",\n\tdanger: \"wwc:bg-red-500\",\n\tneutral: \"wwc:bg-muted-foreground\",\n};\n\nconst hideLabel = {\n\tsm: \"wwc:hidden wwc:sm:inline\",\n\tmd: \"wwc:hidden wwc:md:inline\",\n} as const;\n\nfunction Item({value, label, icon: Icon, dot, tone, hideLabelBelow}: KPIBarItem) {\n\tconst danger = tone === \"danger\";\n\treturn (\n\t\t<div className=\"wwc:flex wwc:items-center wwc:gap-1.5\">\n\t\t\t{Icon ? (\n\t\t\t\t<Icon className={cn(\"wwc:h-4 wwc:w-4\", danger ? \"wwc:text-red-500\" : \"wwc:text-muted-foreground\")} />\n\t\t\t) : dot ? (\n\t\t\t\t<div className={cn(\"wwc:h-2 wwc:w-2 wwc:rounded-full\", dotColor[dot])} />\n\t\t\t) : null}\n\t\t\t<span className={cn(\"wwc:text-sm wwc:font-semibold\", danger && \"wwc:text-red-500\")}>{value}</span>\n\t\t\t{label && (\n\t\t\t\t<span className={cn(\"wwc:text-xs wwc:text-muted-foreground\", hideLabelBelow && hideLabel[hideLabelBelow])}>\n\t\t\t\t\t{label}\n\t\t\t\t</span>\n\t\t\t)}\n\t\t</div>\n\t);\n}\n\n/** A compact horizontal bar of headline metrics (value + label, optional icon or status dot),\n * border-separated into groups — the stat strip above a dashboard. */\nconst KPIBar = React.forwardRef<HTMLDivElement, KPIBarProps>(({groups, className}, ref) => (\n\t<div\n\t\tref={ref}\n\t\tclassName={cn(\n\t\t\t\"wwc:flex wwc:items-center wwc:gap-4 wwc:border-b wwc:bg-card wwc:px-4 wwc:h-14 wwc:shrink-0\",\n\t\t\tclassName,\n\t\t)}\n\t>\n\t\t{groups.map((items, gi) => (\n\t\t\t<div\n\t\t\t\tkey={gi}\n\t\t\t\tclassName={cn(\"wwc:flex wwc:items-center wwc:gap-4\", gi < groups.length - 1 && \"wwc:pr-4 wwc:border-r\")}\n\t\t\t>\n\t\t\t\t{items.map((item, ii) => (\n\t\t\t\t\t<Item key={ii} {...item} />\n\t\t\t\t))}\n\t\t\t</div>\n\t\t))}\n\t</div>\n));\nKPIBar.displayName = \"KPIBar\";\n\nexport {KPIBar};\n"],"mappings":";;;;AA2BA,MAAM,WAAsC;CAC3C,SAAS;CACT,SAAS;CACT,QAAQ;CACR,SAAS;AACV;AAEA,MAAM,YAAY;CACjB,IAAI;CACJ,IAAI;AACL;AAEA,SAAS,KAAK,EAAC,OAAO,OAAO,MAAM,MAAM,KAAK,MAAM,kBAA6B;CAChF,MAAM,SAAS,SAAS;CACxB,OACC,qBAAC,OAAD;EAAK,WAAU;EAAf,UAAA;GACE,OACA,oBAAC,MAAD,EAAM,WAAW,GAAG,mBAAmB,SAAS,qBAAqB,2BAA2B,EAAI,CAAA,IACjG,MACH,oBAAC,OAAD,EAAK,WAAW,GAAG,oCAAoC,SAAS,IAAI,EAAI,CAAA,IACrE;GACJ,oBAAC,QAAD;IAAM,WAAW,GAAG,iCAAiC,UAAU,kBAAkB;IAAI,UAAA;GAAY,CAAA;GAChG,SACA,oBAAC,QAAD;IAAM,WAAW,GAAG,yCAAyC,kBAAkB,UAAU,eAAe;IACtG,UAAA;GACI,CAAA;EAEH;;AAEP;;;AAIA,MAAM,SAAS,MAAM,YAAyC,EAAC,QAAQ,aAAY,QAClF,oBAAC,OAAD;CACM;CACL,WAAW,GACV,+FACA,SACD;CAEC,UAAA,OAAO,KAAK,OAAO,OACnB,oBAAC,OAAD;EAEC,WAAW,GAAG,uCAAuC,KAAK,OAAO,SAAS,KAAK,uBAAuB;EAErG,UAAA,MAAM,KAAK,MAAM,OACjB,oBAAC,MAAD,EAAe,GAAI,KAAO,GAAf,EAAe,CAC1B;CACG,GANC,EAMD,CACL;AACG,CAAA,CACL;AACD,OAAO,cAAc"}

package/dist/kpi-summary.d.mts

@@ -0,0 +1,24 @@
+import { MetricCardProps } from "./metric-card.mjs";
+import * as React from "react";
+//#region src/kpi-summary.d.ts
+/** One metric in a KPISummary — the same contract as a MetricCard tile. */
+export type KpiMetric = MetricCardProps;
+export interface KPISummaryProps {
+  /** Metrics to display — one MetricCard tile per entry. */
+  metrics: KpiMetric[];
+  /** Columns at the lg breakpoint (responsive: 1 column on mobile, 2 at md). Default 4. */
+  columns?: 2 | 3 | 4;
+  /**
+   * Optional bespoke tile(s) rendered as the LAST grid cell(s), after the metric tiles — for a tile
+   * that exceeds MetricCard's contract (e.g. a multi-badge severity breakdown). Each child occupies one
+   * grid cell alongside the MetricCards, so the row stays uniform.
+   */
+  children?: React.ReactNode;
+  className?: string;
+}
+/** A responsive grid of MetricCard tiles (plus optional bespoke trailing tiles) — the reusable KPI
+ * summary band above a dashboard or list. */
+declare const KPISummary: React.ForwardRefExoticComponent<KPISummaryProps & React.RefAttributes<HTMLDivElement>>;
+//#endregion
+export { KPISummary };
+//# sourceMappingURL=kpi-summary.d.mts.map

package/dist/kpi-summary.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"kpi-summary.d.mts","names":[],"sources":["../src/kpi-summary.tsx"],"mappings":";;;;YAMY,YAAY;iBAEP;;EAEhB,SAAS;;EAET;;;;;;EAMA,WAAW,MAAM;EACjB;;;;cAWK,YAAU,MAAA,0BAAA,kBAAA,MAAA,cAAA"}

package/dist/kpi-summary.mjs

@@ -0,0 +1,22 @@
+import { MetricCard } from "./metric-card.mjs";
+import { cn } from "@corensystem/coren-utils";
+import * as React from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region src/kpi-summary.tsx
+const columnClass = {
+	2: "wwc:md:grid-cols-2",
+	3: "wwc:md:grid-cols-2 wwc:lg:grid-cols-3",
+	4: "wwc:md:grid-cols-2 wwc:lg:grid-cols-4"
+};
+/** A responsive grid of MetricCard tiles (plus optional bespoke trailing tiles) — the reusable KPI
+* summary band above a dashboard or list. */
+const KPISummary = React.forwardRef(({ metrics, columns = 4, children, className }, ref) => /* @__PURE__ */ jsxs("div", {
+	ref,
+	className: cn("wwc:grid wwc:gap-4", columnClass[columns], className),
+	children: [metrics.map((metric, i) => /* @__PURE__ */ jsx(MetricCard, { ...metric }, i)), children]
+}));
+KPISummary.displayName = "KPISummary";
+//#endregion
+export { KPISummary };
+
+//# sourceMappingURL=kpi-summary.mjs.map

package/dist/kpi-summary.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"kpi-summary.mjs","names":[],"sources":["../src/kpi-summary.tsx"],"sourcesContent":["import {cn} from \"@corensystem/coren-utils\";\nimport * as React from \"react\";\n\nimport {MetricCard, type MetricCardProps} from \"./metric-card\";\n\n/** One metric in a KPISummary — the same contract as a MetricCard tile. */\nexport type KpiMetric = MetricCardProps;\n\nexport interface KPISummaryProps {\n\t/** Metrics to display — one MetricCard tile per entry. */\n\tmetrics: KpiMetric[];\n\t/** Columns at the lg breakpoint (responsive: 1 column on mobile, 2 at md). Default 4. */\n\tcolumns?: 2 | 3 | 4;\n\t/**\n\t * Optional bespoke tile(s) rendered as the LAST grid cell(s), after the metric tiles — for a tile\n\t * that exceeds MetricCard's contract (e.g. a multi-badge severity breakdown). Each child occupies one\n\t * grid cell alongside the MetricCards, so the row stays uniform.\n\t */\n\tchildren?: React.ReactNode;\n\tclassName?: string;\n}\n\nconst columnClass: Record<2 | 3 | 4, string> = {\n\t2: \"wwc:md:grid-cols-2\",\n\t3: \"wwc:md:grid-cols-2 wwc:lg:grid-cols-3\",\n\t4: \"wwc:md:grid-cols-2 wwc:lg:grid-cols-4\",\n};\n\n/** A responsive grid of MetricCard tiles (plus optional bespoke trailing tiles) — the reusable KPI\n * summary band above a dashboard or list. */\nconst KPISummary = React.forwardRef<HTMLDivElement, KPISummaryProps>(\n\t({metrics, columns = 4, children, className}, ref) => (\n\t\t<div ref={ref} className={cn(\"wwc:grid wwc:gap-4\", columnClass[columns], className)}>\n\t\t\t{metrics.map((metric, i) => (\n\t\t\t\t<MetricCard key={i} {...metric} />\n\t\t\t))}\n\t\t\t{children}\n\t\t</div>\n\t),\n);\nKPISummary.displayName = \"KPISummary\";\n\nexport {KPISummary};\n"],"mappings":";;;;;AAsBA,MAAM,cAAyC;CAC9C,GAAG;CACH,GAAG;CACH,GAAG;AACJ;;;AAIA,MAAM,aAAa,MAAM,YACvB,EAAC,SAAS,UAAU,GAAG,UAAU,aAAY,QAC7C,qBAAC,OAAD;CAAU;CAAK,WAAW,GAAG,sBAAsB,YAAY,UAAU,SAAS;CAAlF,UAAA,CACE,QAAQ,KAAK,QAAQ,MACrB,oBAAC,YAAD,EAAoB,GAAI,OAAS,GAAhB,CAAgB,CACjC,GACA,QACG;AAEP,CAAA,CAAA;AACA,WAAW,cAAc"}

package/dist/label.d.mts

@@ -0,0 +1,19 @@
+import * as React from "react";
+import { VariantProps } from "class-variance-authority";
+import * as LabelPrimitive from "@radix-ui/react-label";
+//#region src/label.d.ts
+declare const labelVariants: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
+export interface LabelProps extends React.ComponentPropsWithoutRef<typeof LabelPrimitive.Root>, VariantProps<typeof labelVariants> {
+  /**
+   * Append a required-field asterisk after the label text. The asterisk is decorative
+   * (`aria-hidden`) — also mark the control itself `required` so assistive tech is told.
+   */
+  required?: boolean;
+}
+/** Decorative required-field asterisk. The control carries the actual semantics. */
+declare function RequiredMark(): import("react/jsx-runtime").JSX.Element;
+/** Renders an accessible label associated with form controls. */
+declare const Label: React.ForwardRefExoticComponent<LabelProps & React.RefAttributes<HTMLLabelElement>>;
+//#endregion
+export { Label, RequiredMark };
+//# sourceMappingURL=label.d.mts.map

package/dist/label.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"label.d.mts","names":[],"sources":["../src/label.tsx"],"mappings":";;;;cAKM,gBAAa,iDAAA;iBAIF,mBACR,MAAM,gCAAgC,eAAe,OAAO,oBAAoB;;;;;EAKxF;;;iBAIQ,4CAAY,IAAA;;cASf,OAAK,MAAA,0BAAA,aAAA,MAAA,cAAA"}

package/dist/label.mjs

@@ -0,0 +1,27 @@
+import { cn } from "@corensystem/coren-utils";
+import * as React from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { cva } from "class-variance-authority";
+import * as LabelPrimitive from "@radix-ui/react-label";
+//#region src/label.tsx
+const labelVariants = cva("wwc:text-sm wwc:font-medium wwc:leading-none wwc:peer-disabled:cursor-not-allowed wwc:peer-disabled:opacity-70");
+/** Decorative required-field asterisk. The control carries the actual semantics. */
+function RequiredMark() {
+	return /* @__PURE__ */ jsx("span", {
+		"aria-hidden": "true",
+		className: "wwc:ml-0.5 wwc:text-destructive",
+		children: "*"
+	});
+}
+/** Renders an accessible label associated with form controls. */
+const Label = React.forwardRef(({ className, required = false, children, ...props }, ref) => /* @__PURE__ */ jsxs(LabelPrimitive.Root, {
+	ref,
+	className: cn(labelVariants(), className),
+	...props,
+	children: [children, required && /* @__PURE__ */ jsx(RequiredMark, {})]
+}));
+Label.displayName = LabelPrimitive.Root.displayName;
+//#endregion
+export { Label, RequiredMark };
+
+//# sourceMappingURL=label.mjs.map

package/dist/label.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"label.mjs","names":[],"sources":["../src/label.tsx"],"sourcesContent":["import {cn} from \"@corensystem/coren-utils\";\nimport * as LabelPrimitive from \"@radix-ui/react-label\";\nimport {type VariantProps, cva} from \"class-variance-authority\";\nimport * as React from \"react\";\n\nconst labelVariants = cva(\n\t\"wwc:text-sm wwc:font-medium wwc:leading-none wwc:peer-disabled:cursor-not-allowed wwc:peer-disabled:opacity-70\",\n);\n\nexport interface LabelProps\n\textends React.ComponentPropsWithoutRef<typeof LabelPrimitive.Root>, VariantProps<typeof labelVariants> {\n\t/**\n\t * Append a required-field asterisk after the label text. The asterisk is decorative\n\t * (`aria-hidden`) — also mark the control itself `required` so assistive tech is told.\n\t */\n\trequired?: boolean;\n}\n\n/** Decorative required-field asterisk. The control carries the actual semantics. */\nfunction RequiredMark() {\n\treturn (\n\t\t<span aria-hidden=\"true\" className=\"wwc:ml-0.5 wwc:text-destructive\">\n\t\t\t*\n\t\t</span>\n\t);\n}\n\n/** Renders an accessible label associated with form controls. */\nconst Label = React.forwardRef<React.ElementRef<typeof LabelPrimitive.Root>, LabelProps>(\n\t({className, required = false, children, ...props}, ref) => (\n\t\t<LabelPrimitive.Root ref={ref} className={cn(labelVariants(), className)} {...props}>\n\t\t\t{children}\n\t\t\t{required && <RequiredMark />}\n\t\t</LabelPrimitive.Root>\n\t),\n);\nLabel.displayName = LabelPrimitive.Root.displayName;\n\nexport {Label, RequiredMark};\n"],"mappings":";;;;;;AAKA,MAAM,gBAAgB,IACrB,gHACD;;AAYA,SAAS,eAAe;CACvB,OACC,oBAAC,QAAD;EAAM,eAAY;EAAO,WAAU;EAAkC,UAAA;CAE/D,CAAA;AAER;;AAGA,MAAM,QAAQ,MAAM,YAClB,EAAC,WAAW,WAAW,OAAO,UAAU,GAAG,SAAQ,QACnD,qBAAC,eAAe,MAAhB;CAA0B;CAAK,WAAW,GAAG,cAAc,GAAG,SAAS;CAAG,GAAI;CAA9E,UAAA,CACE,UACA,YAAY,oBAAC,cAAD,CAAe,CAAA,CACR;AAEvB,CAAA,CAAA;AACA,MAAM,cAAc,eAAe,KAAK"}