@burdenoff/microfe-bigconsole 2026.924.2 → 2026.924.3

package/dist/bigconsole/pages/WidgetDemoPage.js

@@ -5,9 +5,9 @@ import { WIDGET_CATEGORY_LABELS as r } from "../components/widgets/WidgetRegistr
 import i from "../components/widgets/WidgetWrapper.js";
 import "../components/widgets/index.js";
 import { useMemo as a, useState as o } from "react";
-import { useI18n as s } from "@burdenoff/fe-libs/shared/providers/shell/I18nProvider";
-import { IllustratedEmptyState as c, PagePurpose as l } from "@burdenoff/fe-libs/ui";
-import { jsx as u, jsxs as d } from "react/jsx-runtime";
+import { IllustratedEmptyState as s, PagePurpose as c } from "@burdenoff/fe-libs/ui";
+import { jsx as l, jsxs as u } from "react/jsx-runtime";
+import { useI18n as d } from "@burdenoff/fe-libs/shared/providers/shell/I18nProvider";
 //#region src/bigconsole/pages/WidgetDemoPage.tsx
 var f = [
 	{
@@ -169,7 +169,7 @@ var f = [
 	Temporal: "Widgets organised by date, schedule or workflow stage.",
 	Custom: "Widgets whose body you define yourself."
 }, h = () => {
-	let { t: h } = s(), [g, _] = o(""), [v, y] = o("grid"), b = a(() => (g ? f.filter((e) => e.type.includes(g.toLowerCase()) || e.title.toLowerCase().includes(g.toLowerCase())) : f).map((e, t) => ({
+	let { t: h } = d(), [g, _] = o(""), [v, y] = o("grid"), b = a(() => (g ? f.filter((e) => e.type.includes(g.toLowerCase()) || e.title.toLowerCase().includes(g.toLowerCase())) : f).map((e, t) => ({
 		id: `demo-${e.type}`,
 		pageId: "demo-page",
 		dashboardId: "demo-dashboard",
@@ -208,34 +208,34 @@ var f = [
 			widgets: e.get(t) ?? []
 		}));
 	}, [b]), S = v === "grid" ? "grid grid-cols-1 gap-form-gap sm:grid-cols-2 xl:grid-cols-3" : "flex flex-col gap-form-gap";
-	return /* @__PURE__ */ d("div", {
+	return /* @__PURE__ */ u("div", {
 		className: "flex h-full min-w-0 flex-col bg-bg-canvas",
 		children: [
-			/* @__PURE__ */ u("section", {
+			/* @__PURE__ */ l("section", {
 				"aria-label": "Widget demo header",
 				className: `${e("bare", "neutral", "none")} flex-shrink-0 border-b border-[var(--color-border-subtle)] bg-bg-surface px-4 py-3 sm:px-6 sm:py-4`,
-				children: /* @__PURE__ */ d("div", {
+				children: /* @__PURE__ */ u("div", {
 					className: "flex flex-col gap-control-gap lg:flex-row lg:items-center lg:justify-between",
-					children: [/* @__PURE__ */ d("div", {
+					children: [/* @__PURE__ */ u("div", {
 						className: "min-w-0",
-						children: [/* @__PURE__ */ u("h1", {
+						children: [/* @__PURE__ */ l("h1", {
 							className: "text-xl font-semibold text-text-primary",
 							children: h("bigconsole.widgetDemo.header.title", "Widget Demo")
-						}), /* @__PURE__ */ u("p", {
+						}), /* @__PURE__ */ l("p", {
 							className: "mt-1 text-sm text-text-secondary",
 							children: h("bigconsole.widgetDemo.header.subtitle", "All 18 widget types - connect a DataSink for real data")
 						})]
-					}), /* @__PURE__ */ d("div", {
+					}), /* @__PURE__ */ u("div", {
 						className: "flex flex-wrap items-center gap-control-gap",
-						children: [/* @__PURE__ */ d("div", {
+						children: [/* @__PURE__ */ u("div", {
 							className: "relative min-w-0 flex-1 sm:flex-none",
 							children: [
-								/* @__PURE__ */ u("label", {
+								/* @__PURE__ */ l("label", {
 									htmlFor: "widget-demo-filter",
 									className: "sr-only",
 									children: "Filter widget types"
 								}),
-								/* @__PURE__ */ u("input", {
+								/* @__PURE__ */ l("input", {
 									id: "widget-demo-filter",
 									type: "text",
 									placeholder: h("bigconsole.widgetDemo.filter.placeholder", "Filter widgets..."),
@@ -243,13 +243,13 @@ var f = [
 									onChange: (e) => _(e.target.value),
 									className: "h-control-md w-full min-w-0 rounded-input border border-[var(--color-border-subtle)] bg-bg-sunken py-2 pl-[3.25rem] pr-3 text-sm text-text-primary placeholder:text-text-muted focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-bg-surface sm:w-64"
 								}),
-								/* @__PURE__ */ u("svg", {
+								/* @__PURE__ */ l("svg", {
 									"aria-hidden": "true",
 									className: "pointer-events-none absolute left-3 top-1/2 h-icon-sm w-icon-sm -translate-y-1/2 text-text-secondary",
 									fill: "none",
 									stroke: "currentColor",
 									viewBox: "0 0 24 24",
-									children: /* @__PURE__ */ u("path", {
+									children: /* @__PURE__ */ l("path", {
 										strokeLinecap: "round",
 										strokeLinejoin: "round",
 										strokeWidth: 2,
@@ -257,17 +257,17 @@ var f = [
 									})
 								})
 							]
-						}), /* @__PURE__ */ d("div", {
+						}), /* @__PURE__ */ u("div", {
 							className: "flex shrink-0 items-center gap-1 rounded-button bg-bg-sunken p-1",
 							role: "group",
 							"aria-label": "Gallery layout",
-							children: [/* @__PURE__ */ u("button", {
+							children: [/* @__PURE__ */ l("button", {
 								type: "button",
 								onClick: () => y("grid"),
 								"aria-pressed": v === "grid",
 								className: `min-h-control-md rounded-button px-3 text-sm font-medium motion-safe:transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-bg-surface ${v === "grid" ? "bg-bg-surface text-text-primary shadow-[var(--shadow-elevation-1)]" : "text-text-secondary hover:text-text-primary"}`,
 								children: h("bigconsole.widgetDemo.viewToggle.grid", "Grid")
-							}), /* @__PURE__ */ u("button", {
+							}), /* @__PURE__ */ l("button", {
 								type: "button",
 								onClick: () => y("list"),
 								"aria-pressed": v === "list",
@@ -278,20 +278,20 @@ var f = [
 					})]
 				})
 			}),
-			/* @__PURE__ */ u("div", {
+			/* @__PURE__ */ l("div", {
 				className: "min-w-0 flex-1 overflow-y-auto overflow-x-hidden p-4 sm:p-6",
-				children: /* @__PURE__ */ d(n, { children: [
-					/* @__PURE__ */ u("section", {
+				children: /* @__PURE__ */ u(n, { children: [
+					/* @__PURE__ */ l("section", {
 						"aria-label": "What this gallery is for",
 						className: e("muted", "neutral", "compact"),
-						children: /* @__PURE__ */ u(l, { children: h("bigconsole.widgetDemo.pagePurpose", "This gallery previews every widget type BigConsole can render on a dashboard — metrics, charts, tables, maps, kanban boards and more. Use it to see what each widget looks like and pick the right one before wiring it to a real DataSink in the dashboard builder.") })
+						children: /* @__PURE__ */ l(c, { children: h("bigconsole.widgetDemo.pagePurpose", "This gallery previews every widget type BigConsole can render on a dashboard — metrics, charts, tables, maps, kanban boards and more. Use it to see what each widget looks like and pick the right one before wiring it to a real DataSink in the dashboard builder.") })
 					}),
-					x.length > 0 && /* @__PURE__ */ u(t, {
+					x.length > 0 && /* @__PURE__ */ l(t, {
 						emphasis: "primary",
 						headingLevel: 2,
 						title: "Widget gallery",
 						description: "Every widget renders its unconnected state here — the card chrome, header and empty copy are exactly what a dashboard will show before a DataSink is bound.",
-						meta: /* @__PURE__ */ d("span", {
+						meta: /* @__PURE__ */ u("span", {
 							className: "rounded-pill bg-bg-sunken px-2 py-0.5 text-xs font-medium text-text-secondary",
 							children: [
 								b.length,
@@ -299,15 +299,15 @@ var f = [
 								f.length
 							]
 						}),
-						children: /* @__PURE__ */ u("div", {
+						children: /* @__PURE__ */ l("div", {
 							className: "flex flex-col gap-section-gap",
-							children: x.map((e) => /* @__PURE__ */ u(t, {
+							children: x.map((e) => /* @__PURE__ */ l(t, {
 								emphasis: "bare",
 								padding: "none",
 								headingLevel: 3,
 								title: e.label,
 								description: e.blurb,
-								meta: /* @__PURE__ */ d("span", {
+								meta: /* @__PURE__ */ u("span", {
 									className: "text-xs font-medium text-text-muted",
 									children: [
 										e.widgets.length,
@@ -315,28 +315,28 @@ var f = [
 										e.widgets.length === 1 ? "type" : "types"
 									]
 								}),
-								children: /* @__PURE__ */ u("div", {
+								children: /* @__PURE__ */ l("div", {
 									className: S,
 									children: e.widgets.map((e) => {
 										let t = f.find((t) => t.type === e.type);
-										return /* @__PURE__ */ d("figure", {
+										return /* @__PURE__ */ u("figure", {
 											className: `m-0 flex min-w-0 flex-col ${v === "grid" ? "h-80" : "h-64"}`,
-											children: [/* @__PURE__ */ d("figcaption", {
+											children: [/* @__PURE__ */ u("figcaption", {
 												className: "mb-2 flex flex-shrink-0 flex-wrap items-baseline gap-x-2 gap-y-0.5 text-xs text-text-secondary",
-												children: [/* @__PURE__ */ d("span", { children: [
+												children: [/* @__PURE__ */ u("span", { children: [
 													h("bigconsole.widgetDemo.widgetCard.typeLabel", "Type:"),
 													" ",
-													/* @__PURE__ */ u("code", {
+													/* @__PURE__ */ l("code", {
 														className: "font-mono text-text-link",
 														children: e.type
 													})
-												] }), t && /* @__PURE__ */ u("span", {
+												] }), t && /* @__PURE__ */ l("span", {
 													className: "text-text-muted",
 													children: h(t.descriptionKey, t.description)
 												})]
-											}), /* @__PURE__ */ u("div", {
+											}), /* @__PURE__ */ l("div", {
 												className: "min-h-0 min-w-0 flex-1",
-												children: /* @__PURE__ */ u(i, { widget: e })
+												children: /* @__PURE__ */ l(i, { widget: e })
 											})]
 										}, e.id);
 									})
@@ -344,13 +344,13 @@ var f = [
 							}, e.category))
 						})
 					}),
-					b.length === 0 && /* @__PURE__ */ u(t, {
+					b.length === 0 && /* @__PURE__ */ l(t, {
 						emphasis: "standard",
 						tone: "info",
 						title: h("bigconsole.widgetDemo.emptyState.title", "No widgets match your filter"),
 						headingLevel: 2,
 						"data-testid": "widget-demo-empty",
-						children: /* @__PURE__ */ u(c, {
+						children: /* @__PURE__ */ l(s, {
 							illustration: "empty-search",
 							title: h("bigconsole.widgetDemo.emptyState.description", "Try a different search term to preview a widget type."),
 							description: "The filter matches a widget's name and its one-line description."
@@ -358,15 +358,15 @@ var f = [
 					})
 				] })
 			}),
-			/* @__PURE__ */ u("section", {
+			/* @__PURE__ */ l("section", {
 				"aria-label": "Gallery summary",
 				className: `${e("bare", "neutral", "none")} flex-shrink-0 border-t border-[var(--color-border-subtle)] bg-bg-sunken px-4 py-2 sm:px-6`,
-				children: /* @__PURE__ */ d("div", {
+				children: /* @__PURE__ */ u("div", {
 					className: "flex flex-wrap items-center justify-between gap-x-4 gap-y-1 text-xs text-text-secondary",
-					children: [/* @__PURE__ */ u("span", { children: h("bigconsole.widgetDemo.footer.showing", "Showing {{shown}} of {{total}} widget types", {
+					children: [/* @__PURE__ */ l("span", { children: h("bigconsole.widgetDemo.footer.showing", "Showing {{shown}} of {{total}} widget types", {
 						shown: b.length,
 						total: f.length
-					}) }), /* @__PURE__ */ u("span", {
+					}) }), /* @__PURE__ */ l("span", {
 						className: "text-text-muted",
 						children: h("bigconsole.widgetDemo.footer.hint", "Widgets show empty state until connected to DataSink + Parser")
 					})]