@burdenoff/microfe-bigconsole 2026.1103.6 → 2026.1103.8

package/dist/bigconsole/components/insights/PromptAnalysisPreview.d.ts

@@ -0,0 +1,21 @@
+import { FC } from 'react';
+export interface PromptAnalysis {
+    detectedIntent: string;
+    suggestedCategory: string;
+    estimatedWidgetCount: number;
+    suggestedWidgetTypes: string[];
+    detectedMetrics: string[];
+    dataRequirements: string[];
+    confidence: number;
+    suggestedRefinements?: string[] | null;
+}
+/** `BAR_CHART` -> `Bar chart`; a short single word stays an acronym (`KPI`). */
+export declare function humanizeEnum(value: string): string;
+interface Props {
+    /** The prompt as currently typed. */
+    prompt: string;
+    /** Disable the control while a generation is being submitted. */
+    disabled?: boolean;
+}
+export declare const PromptAnalysisPreview: FC<Props>;
+export {};

package/dist/bigconsole/components/insights/PromptAnalysisPreview.js

@@ -0,0 +1,203 @@
+import { reportBigConsoleQuotaError as e } from "../../utils/quota.js";
+import { SECTION_FOCUS_RING as t } from "../common/sectionStyles.js";
+import "../common/index.js";
+import { memo as n, useCallback as r, useState as i } from "react";
+import { Loader2 as a, ScanSearch as o } from "lucide-react";
+import { useI18n as s } from "@burdenoff/fe-libs/shared/providers/shell/I18nProvider";
+import { useApolloClient as c } from "@apollo/client/react";
+import { jsx as l, jsxs as u } from "react/jsx-runtime";
+import { gql as d } from "@apollo/client";
+//#region src/bigconsole/components/insights/PromptAnalysisPreview.tsx
+var f = d`
+  query PreviewPromptAnalysis($prompt: String!) {
+    previewPromptAnalysis(prompt: $prompt) {
+      detectedIntent
+      suggestedCategory
+      estimatedWidgetCount
+      suggestedWidgetTypes
+      detectedMetrics
+      dataRequirements
+      confidence
+      suggestedRefinements
+    }
+  }
+`;
+function p(e) {
+	let t = e.split("_").filter(Boolean);
+	if (t.length === 1 && t[0].length <= 3) return t[0].toUpperCase();
+	let n = t.join(" ").toLowerCase();
+	return n.charAt(0).toUpperCase() + n.slice(1);
+}
+var m = {
+	display: "inline-flex",
+	alignItems: "center",
+	gap: "var(--space-iconGap)",
+	minHeight: "var(--size-controlHeight-md)",
+	padding: "0 var(--space-formGap)",
+	borderRadius: "var(--radius-button)",
+	border: "1px solid var(--color-border-default)",
+	backgroundColor: "transparent",
+	color: "var(--color-text-primary)",
+	fontSize: "var(--font-size-body-sm)",
+	fontWeight: "var(--font-weight-medium)"
+}, h = {
+	display: "flex",
+	flexDirection: "column",
+	gap: "var(--space-iconGap)",
+	padding: "var(--space-controlGap) var(--space-formGap)",
+	borderRadius: "var(--radius-input)",
+	border: "1px solid var(--color-border-subtle)",
+	backgroundColor: "var(--color-bg-sunken)",
+	fontSize: "var(--font-size-body-sm)",
+	color: "var(--color-text-secondary)"
+}, g = {
+	padding: "0 var(--space-iconGap)",
+	borderRadius: "var(--radius-button)",
+	border: "1px solid var(--color-border-subtle)",
+	color: "var(--color-text-primary)"
+}, _ = n(function({ prompt: n, disabled: d = !1 }) {
+	let { t: _ } = s(), v = c(), [y, b] = i(null), [x, S] = i(null), [C, w] = i(!1), T = n.trim(), E = r(async () => {
+		if (!(!T || C)) {
+			w(!0), S(null);
+			try {
+				let t = await v.query({
+					query: f,
+					variables: { prompt: T },
+					fetchPolicy: "network-only"
+				});
+				if (e(t, "command")) return;
+				let n = t.data?.previewPromptAnalysis;
+				n ? b({
+					prompt: T,
+					result: n
+				}) : S(_("bigconsole.insights.analysis.failed", "Could not analyse this prompt. Please try again."));
+			} catch (t) {
+				if (e(t, "command")) return;
+				S(t instanceof Error ? t.message : _("bigconsole.insights.analysis.failed", "Could not analyse this prompt. Please try again."));
+			} finally {
+				w(!1);
+			}
+		}
+	}, [
+		C,
+		v,
+		_,
+		T
+	]), D = y && y.prompt === T ? y.result : null, O = y !== null && D === null, k = "prompt-analysis-hint";
+	return /* @__PURE__ */ u("div", {
+		style: {
+			display: "flex",
+			flexDirection: "column",
+			gap: "var(--space-controlGap)"
+		},
+		children: [
+			/* @__PURE__ */ u("div", {
+				style: {
+					display: "flex",
+					alignItems: "center",
+					flexWrap: "wrap",
+					gap: "var(--space-controlGap)"
+				},
+				children: [/* @__PURE__ */ u("button", {
+					type: "button",
+					onClick: () => void E(),
+					disabled: !T || C || d,
+					"aria-describedby": k,
+					className: t,
+					style: {
+						...m,
+						cursor: !T || C || d ? "not-allowed" : "pointer",
+						opacity: !T || C || d ? .5 : 1
+					},
+					children: [C ? /* @__PURE__ */ l(a, {
+						size: 16,
+						className: "animate-spin",
+						"aria-hidden": "true"
+					}) : /* @__PURE__ */ l(o, {
+						size: 16,
+						"aria-hidden": "true"
+					}), _("bigconsole.insights.analysis.button", "Preview analysis")]
+				}), /* @__PURE__ */ l("span", {
+					id: k,
+					style: {
+						fontSize: "var(--font-size-body-sm)",
+						color: "var(--color-text-muted)"
+					},
+					children: _("bigconsole.insights.analysis.hint", "See the detected intent and widget estimate. Uses 1 AI command.")
+				})]
+			}),
+			x && /* @__PURE__ */ l("p", {
+				role: "alert",
+				style: {
+					margin: 0,
+					fontSize: "var(--font-size-body-sm)",
+					color: "var(--color-status-error-text)"
+				},
+				children: x
+			}),
+			O && !x && /* @__PURE__ */ l("p", {
+				style: {
+					margin: 0,
+					fontSize: "var(--font-size-body-sm)",
+					color: "var(--color-text-muted)"
+				},
+				children: _("bigconsole.insights.analysis.stale", "The prompt changed since the last analysis. Preview it again.")
+			}),
+			D && /* @__PURE__ */ u("div", {
+				role: "status",
+				"data-testid": "prompt-analysis",
+				style: h,
+				children: [
+					/* @__PURE__ */ u("div", { children: [
+						/* @__PURE__ */ u("strong", {
+							style: { color: "var(--color-text-primary)" },
+							children: [_("bigconsole.insights.analysis.intent", "Detected intent"), ":"]
+						}),
+						" ",
+						D.detectedIntent,
+						" (",
+						p(D.suggestedCategory),
+						")"
+					] }),
+					/* @__PURE__ */ u("div", { children: [
+						/* @__PURE__ */ u("strong", {
+							style: { color: "var(--color-text-primary)" },
+							children: [_("bigconsole.insights.analysis.widgetCount", "Estimated widgets"), ":"]
+						}),
+						" ",
+						D.estimatedWidgetCount
+					] }),
+					D.suggestedWidgetTypes.length > 0 && /* @__PURE__ */ l("div", {
+						style: {
+							display: "flex",
+							flexWrap: "wrap",
+							gap: "var(--space-iconGap)"
+						},
+						children: D.suggestedWidgetTypes.map((e) => /* @__PURE__ */ l("span", {
+							style: g,
+							children: p(e)
+						}, e))
+					}),
+					D.detectedMetrics.length > 0 && /* @__PURE__ */ u("div", { children: [
+						/* @__PURE__ */ u("strong", {
+							style: { color: "var(--color-text-primary)" },
+							children: [_("bigconsole.insights.analysis.metrics", "Metrics"), ":"]
+						}),
+						" ",
+						D.detectedMetrics.join(", ")
+					] }),
+					(D.suggestedRefinements?.length ?? 0) > 0 && /* @__PURE__ */ u("div", { children: [
+						/* @__PURE__ */ u("strong", {
+							style: { color: "var(--color-text-primary)" },
+							children: [_("bigconsole.insights.analysis.suggestions", "Suggestions"), ":"]
+						}),
+						" ",
+						D.suggestedRefinements?.join("; ")
+					] })
+				]
+			})
+		]
+	});
+});
+//#endregion
+export { _ as PromptAnalysisPreview, p as humanizeEnum };

package/dist/bigconsole/hooks/useDashboardImageExport.js

@@ -1,90 +1,70 @@
-import { useCallback as e, useState as t } from "react";
+import { elementToCanvas as e } from "../utils/elementToCanvas.js";
+import { useCallback as t, useState as n } from "react";
+import { useI18n as r } from "@burdenoff/fe-libs/shared/providers/shell/I18nProvider";
+import { toast as i } from "sonner";
 //#region src/bigconsole/hooks/useDashboardImageExport.ts
-function n(e, t) {
+function a(e, t) {
 	let n = URL.createObjectURL(e), r = document.createElement("a");
 	r.href = n, r.download = t, r.click(), URL.revokeObjectURL(n);
 }
-function r(e) {
-	let t = getComputedStyle(e).backgroundColor;
-	return !t || t === "transparent" || /,\s*0\)\s*$/.test(t) ? getComputedStyle(document.documentElement).getPropertyValue("--color-bg-surface").trim() || "transparent" : t;
-}
-async function i(e) {
-	if (typeof window < "u" && "html2canvas" in window) return await window.html2canvas(e, {
-		backgroundColor: r(e),
-		scale: 2,
-		useCORS: !0
-	});
-	let t = document.createElement("canvas"), n = t.getContext("2d");
-	if (!n) throw Error("Could not get canvas context");
-	let i = e.getBoundingClientRect();
-	t.width = i.width * 2, t.height = i.height * 2, n.scale(2, 2), n.fillStyle = r(e), n.fillRect(0, 0, i.width, i.height);
-	let a = e.querySelectorAll("svg");
-	for (let e of a) {
-		let t = new XMLSerializer().serializeToString(e), r = new Blob([t], { type: "image/svg+xml;charset=utf-8" }), a = URL.createObjectURL(r);
-		try {
-			await new Promise((t) => {
-				let r = new Image();
-				r.onload = () => {
-					let a = e.getBoundingClientRect();
-					n.drawImage(r, a.left - i.left, a.top - i.top), t();
-				}, r.onerror = () => t(), r.src = a;
-			});
-		} finally {
-			URL.revokeObjectURL(a);
-		}
-	}
-	return t;
-}
-function a(r) {
-	let { containerRef: a, name: o = "dashboard" } = r, [s, c] = t(!1);
+function o(o) {
+	let { containerRef: s, name: c = "dashboard" } = o, [l, u] = n(!1), { t: d } = r(), f = t(() => {
+		i.error(d("bigconsole.dashboards.export.failed", "Could not export the dashboard. Please try again."));
+	}, [d]);
 	return {
-		exportPNG: e(async (e) => {
-			let t = a.current;
-			if (!(!t || s)) {
-				c(!0);
+		exportPNG: t(async (t) => {
+			let n = s.current;
+			if (!(!n || l)) {
+				u(!0);
 				try {
-					let r = await i(t), a = await new Promise((e, t) => {
+					let r = await e(n), i = await new Promise((e, t) => {
 						r.toBlob((n) => n ? e(n) : t(/* @__PURE__ */ Error("Failed to create image blob")), "image/png");
-					}), s = o.replace(/\s+/g, "_").toLowerCase();
-					n(a, e || `${s}_board.png`);
+					}), o = c.replace(/\s+/g, "_").toLowerCase();
+					a(i, t || `${o}_board.png`);
+				} catch {
+					f();
 				} finally {
-					c(!1);
+					u(!1);
 				}
 			}
 		}, [
-			a,
-			o,
-			s
+			s,
+			c,
+			l,
+			f
 		]),
-		exportPDF: e(async () => {
-			let e = a.current;
-			if (!(!e || s)) {
-				c(!0);
+		exportPDF: t(async () => {
+			let t = s.current;
+			if (!(!t || l)) {
+				u(!0);
 				try {
-					let t = await i(e), n = t.toDataURL("image/png"), r = `${o} — board`, a = window.open("", "_blank");
+					let n = await e(t), r = n.toDataURL("image/png"), i = `${c} — board`, a = window.open("", "_blank");
 					if (!a) {
 						window.print();
 						return;
 					}
-					let s = t.width >= t.height ? "landscape" : "portrait", c = a.document;
-					c.title = r;
-					let l = c.createElement("style");
-					l.textContent = `@page{size:${s};margin:12mm}html,body{margin:0;padding:0}img{width:100%;height:auto;display:block}`, c.head.appendChild(l);
-					let u = c.createElement("img");
-					u.alt = r, u.addEventListener("load", () => {
+					let o = n.width >= n.height ? "landscape" : "portrait", s = a.document;
+					s.title = i;
+					let l = s.createElement("style");
+					l.textContent = `@page{size:${o};margin:12mm}html,body{margin:0;padding:0}img{width:100%;height:auto;display:block}`, s.head.appendChild(l);
+					let u = s.createElement("img");
+					u.alt = i, u.addEventListener("load", () => {
 						a.focus(), a.print();
-					}), u.src = n, c.body.appendChild(u);
+					}), u.src = r, s.body.appendChild(u);
+				} catch {
+					f();
 				} finally {
-					c(!1);
+					u(!1);
 				}
 			}
 		}, [
-			a,
-			o,
-			s
+			s,
+			c,
+			l,
+			f
 		]),
-		isExporting: s
+		isExporting: l
 	};
 }
 //#endregion
-export { a as default, a as useDashboardImageExport };
+export { o as default, o as useDashboardImageExport };

package/dist/bigconsole/hooks/useWidgetExport.js

@@ -1,75 +1,61 @@
-import { useCallback as e, useRef as t } from "react";
+import { elementToCanvas as e } from "../utils/elementToCanvas.js";
+import { useCallback as t, useRef as n } from "react";
+import { useI18n as r } from "@burdenoff/fe-libs/shared/providers/shell/I18nProvider";
+import { toast as i } from "sonner";
 //#region src/bigconsole/hooks/useWidgetExport.ts
-function n(e) {
+function a(e) {
 	if (!e.length) return "";
 	let t = Object.keys(e[0]), n = [];
-	n.push(t.map(r).join(","));
-	for (let i of e) {
+	n.push(t.map(o).join(","));
+	for (let r of e) {
 		let e = t.map((e) => {
-			let t = i[e];
-			return r(t);
+			let t = r[e];
+			return o(t);
 		});
 		n.push(e.join(","));
 	}
 	return n.join("\n");
 }
-function r(e) {
+function o(e) {
 	if (e == null) return "";
 	let t = String(e);
 	return t.includes(",") || t.includes("\"") || t.includes("\n") || t.includes("\r") ? `"${t.replace(/"/g, "\"\"")}"` : t;
 }
-function i(e, t, n) {
+function s(e, t, n) {
 	let r = e instanceof Blob ? e : new Blob([e], { type: n }), i = URL.createObjectURL(r), a = document.createElement("a");
 	a.href = i, a.download = t, document.body.appendChild(a), a.click(), document.body.removeChild(a), setTimeout(() => URL.revokeObjectURL(i), 100);
 }
-async function a(e) {
-	if (typeof window < "u" && "html2canvas" in window) return await window.html2canvas(e, {
-		backgroundColor: null,
-		scale: 2,
-		logging: !1,
-		useCORS: !0
-	});
-	let t = document.createElement("canvas"), n = t.getContext("2d");
-	if (!n) throw Error("Could not get canvas context");
-	let r = e.getBoundingClientRect();
-	t.width = r.width * 2, t.height = r.height * 2, n.scale(2, 2);
-	let i = e.querySelectorAll("svg");
-	if (i.length > 0) for (let e of i) {
-		let t = new XMLSerializer().serializeToString(e), i = new Blob([t], { type: "image/svg+xml;charset=utf-8" }), a = URL.createObjectURL(i), o = new Image();
-		await new Promise((t, i) => {
-			o.onload = () => {
-				let i = e.getBoundingClientRect(), s = i.left - r.left, c = i.top - r.top;
-				n.drawImage(o, s, c), URL.revokeObjectURL(a), t();
-			}, o.onerror = i, o.src = a;
-		});
-	}
-	return n.globalCompositeOperation = "destination-over", n.fillStyle = getComputedStyle(e).backgroundColor || "#ffffff", n.fillRect(0, 0, t.width / 2, t.height / 2), t;
-}
-function o(r, o = {}) {
-	let { data: s, containerRef: c } = o, l = t(!1);
+function c(o, c = {}) {
+	let { data: l, containerRef: u } = c, d = n(!1), { t: f } = r();
 	return {
-		exportCSV: e((e) => {
-			if (!s?.length) return;
-			let t = n(s), a = `${r.title.replace(/\s+/g, "_").toLowerCase()}_${Date.now()}.csv`;
-			i(t, e || a, "text/csv;charset=utf-8");
-		}, [s, r.title]),
-		exportPNG: e(async (e) => {
-			if (c?.current && !l.current) {
-				l.current = !0;
+		exportCSV: t((e) => {
+			if (!l?.length) return;
+			let t = a(l), n = `${o.title.replace(/\s+/g, "_").toLowerCase()}_${Date.now()}.csv`;
+			s(t, e || n, "text/csv;charset=utf-8");
+		}, [l, o.title]),
+		exportPNG: t(async (t) => {
+			if (u?.current && !d.current) {
+				d.current = !0;
 				try {
-					let t = await a(c.current), n = await new Promise((e, n) => {
-						t.toBlob((t) => {
-							t ? e(t) : n(/* @__PURE__ */ Error("Failed to create image blob"));
+					let n = await e(u.current), r = await new Promise((e, t) => {
+						n.toBlob((n) => {
+							n ? e(n) : t(/* @__PURE__ */ Error("Failed to create image blob"));
 						}, "image/png");
-					}), o = `${r.title.replace(/\s+/g, "_").toLowerCase()}_${Date.now()}.png`;
-					i(n, e || o, "image/png");
-				} catch {} finally {
-					l.current = !1;
+					}), i = `${o.title.replace(/\s+/g, "_").toLowerCase()}_${Date.now()}.png`;
+					s(r, t || i, "image/png");
+				} catch {
+					i.error(f("bigconsole.widget.export.failed", "Could not export the widget image. Please try again."));
+				} finally {
+					d.current = !1;
 				}
 			}
-		}, [c, r.title]),
-		isExporting: l.current
+		}, [
+			u,
+			o.title,
+			f
+		]),
+		isExporting: d.current
 	};
 }
 //#endregion
-export { o as default, o as useWidgetExport };
+export { c as default, c as useWidgetExport };