@burdenoff/microfe-bigconsole 2026.825.1 → 2026.828.1

package/dist/bigconsole/pages/InsightsPage.js

@@ -5,16 +5,16 @@ import { Section as n, SectionStack as r } from "../components/common/Section.js
 import "../components/common/index.js";
 import { reportBigConsoleQuotaError as i } from "../utils/quota.js";
 import a from "../hooks/useBigConsoleAnalytics.js";
-import { isNative as o, nativeImpact as s, nativeNotify as c } from "../../utils/nativeBridge.js";
-import { memo as l, useCallback as u, useEffect as d, useState as f } from "react";
-import { AlertCircle as p, ArrowRight as m, Ban as ee, CheckCircle as h, Clock as g, Eye as te, History as ne, Lightbulb as re, Loader2 as _, RefreshCw as ie, Sparkles as v, Trash2 as ae, Wand2 as y, X as oe, XCircle as b } from "lucide-react";
-import { gql as x } from "@apollo/client";
-import { useMutation as S, useQuery as C } from "@apollo/client/react";
-import { useI18n as se } from "@burdenoff/fe-libs/shared/providers/shell/I18nProvider";
-import { AuroraBackground as ce, GlassCard as le, GradientText as ue, IllustratedEmptyState as de, PagePurpose as fe } from "@burdenoff/fe-libs/ui";
-import { jsx as w, jsxs as T } from "react/jsx-runtime";
+import { isNative as ee, nativeImpact as o, nativeNotify as s } from "../../utils/nativeBridge.js";
+import { memo as c, useCallback as l, useEffect as te, useState as u } from "react";
+import { AlertCircle as d, ArrowRight as f, Ban as ne, CheckCircle as p, Clock as m, Eye as re, History as ie, Lightbulb as ae, Loader2 as h, RefreshCw as oe, Sparkles as g, Trash2 as se, Wand2 as _, X as ce, XCircle as v } from "lucide-react";
+import { gql as y } from "@apollo/client";
+import { useMutation as b, useQuery as x } from "@apollo/client/react";
+import { useI18n as S } from "@burdenoff/fe-libs/shared/providers/shell/I18nProvider";
+import { AuroraBackground as le, GlassCard as ue, GradientText as de, IllustratedEmptyState as fe, PagePurpose as pe } from "@burdenoff/fe-libs/ui";
+import { jsx as C, jsxs as w } from "react/jsx-runtime";
 //#region src/bigconsole/pages/InsightsPage.tsx
-var pe = x`
+var me = y`
   query ListPromptGenerations($status: PromptGenerationStatus, $first: Int) {
     listPromptGenerations(status: $status, first: $first) {
       edges {
@@ -30,11 +30,14 @@ var pe = x`
             name
             description
             overallConfidence
+            reasoning
             pages {
               name
               widgets {
                 title
                 type
+                confidence
+                reasoning
               }
             }
           }
@@ -43,7 +46,7 @@ var pe = x`
       totalCount
     }
   }
-`, me = x`
+`, he = y`
   query GetPromptSuggestions($category: String, $limit: Int) {
     getPromptSuggestions(category: $category, limit: $limit) {
       id
@@ -54,7 +57,7 @@ var pe = x`
       tags
     }
   }
-`, he = x`
+`, ge = y`
   mutation GenerateDashboardFromPrompt($input: GenerateDashboardFromPromptInput!) {
     generateDashboardFromPrompt(input: $input) {
       id
@@ -62,24 +65,24 @@ var pe = x`
       prompt
     }
   }
-`, ge = x`
+`, _e = y`
   mutation CreateDashboardFromGeneration($input: CreateDashboardFromGenerationInput!) {
     createDashboardFromGeneration(input: $input) {
       id
     }
   }
-`, _e = x`
+`, ve = y`
   mutation DeletePromptGeneration($generationId: ID!) {
     deletePromptGeneration(generationId: $generationId)
   }
-`, ve = x`
+`, ye = y`
   mutation CancelPromptGeneration($generationId: ID!) {
     cancelPromptGeneration(generationId: $generationId) {
       id
       status
     }
   }
-`, ye = x`
+`, be = y`
   mutation RegenerateDashboard($input: RegenerateDashboardInput!) {
     regenerateDashboard(input: $input) {
       id
@@ -87,7 +90,7 @@ var pe = x`
       prompt
     }
   }
-`, be = x`
+`, xe = y`
   mutation RefineGeneratedDashboard($input: RefineGeneratedDashboardInput!) {
     refineGeneratedDashboard(input: $input) {
       id
@@ -95,11 +98,70 @@ var pe = x`
       prompt
     }
   }
-`, E = [
+`, Se = [
 	"PENDING",
 	"PROCESSING",
 	"GENERATING"
-], D = {
+], Ce = 12, we = 8, Te = [
+	{
+		value: "MODERN",
+		label: "Modern"
+	},
+	{
+		value: "CLASSIC",
+		label: "Classic"
+	},
+	{
+		value: "MINIMAL",
+		label: "Minimal"
+	},
+	{
+		value: "DARK",
+		label: "Dark"
+	},
+	{
+		value: "VIBRANT",
+		label: "Vibrant"
+	}
+], Ee = [
+	{
+		value: "GRID",
+		label: "Grid"
+	},
+	{
+		value: "FLEX",
+		label: "Flex"
+	},
+	{
+		value: "MASONRY",
+		label: "Masonry"
+	},
+	{
+		value: "SINGLE_COLUMN",
+		label: "Single column"
+	},
+	{
+		value: "TWO_COLUMN",
+		label: "Two column"
+	},
+	{
+		value: "THREE_COLUMN",
+		label: "Three column"
+	}
+], De = [
+	6,
+	8,
+	12,
+	16,
+	24
+], Oe = [
+	4,
+	6,
+	8,
+	12,
+	16,
+	24
+], T = {
 	display: "inline-flex",
 	alignItems: "center",
 	justifyContent: "center",
@@ -111,28 +173,43 @@ var pe = x`
 	fontWeight: "var(--font-weight-medium)",
 	lineHeight: 1.2,
 	cursor: "pointer"
-}, O = {
-	...D,
+}, E = {
+	...T,
 	border: "1px solid var(--color-border-default)",
 	backgroundColor: "transparent",
 	color: "var(--color-text-primary)"
-}, k = {
-	...D,
+}, D = {
+	...T,
 	border: "1px solid transparent",
 	backgroundColor: "var(--color-action-primary-bg)",
 	color: "var(--color-action-primary-text)"
-}, xe = {
-	...D,
+}, ke = {
+	...T,
 	border: "1px solid var(--color-status-warning-border)",
 	backgroundColor: "transparent",
 	color: "var(--color-status-warning-text)"
-}, A = {
-	...D,
+}, O = {
+	...T,
 	minWidth: "var(--size-controlHeight-md)",
 	padding: "0 var(--space-controlGap)",
 	border: "1px solid var(--color-border-default)",
 	backgroundColor: "transparent",
 	color: "var(--color-status-error-text)"
+}, k = {
+	display: "block",
+	marginBottom: "2px",
+	fontSize: "var(--font-size-body-sm)",
+	fontWeight: "var(--font-weight-medium)",
+	color: "var(--color-text-secondary)"
+}, A = {
+	width: "100%",
+	minHeight: "var(--size-controlHeight-md)",
+	padding: "0 var(--space-controlGap)",
+	borderRadius: "var(--radius-input)",
+	border: "1px solid var(--color-border-default)",
+	backgroundColor: "var(--color-bg-canvas)",
+	color: "var(--color-text-primary)",
+	fontSize: "var(--font-size-body-sm)"
 }, j = {
 	display: "inline-flex",
 	alignItems: "center",
@@ -180,26 +257,26 @@ var N = {
 function P(e) {
 	let t = N[M(e)].text;
 	switch (e) {
-		case "COMPLETED": return /* @__PURE__ */ w(h, {
+		case "COMPLETED": return /* @__PURE__ */ C(p, {
 			size: 14,
 			style: { color: t },
 			"aria-hidden": "true"
 		});
 		case "FAILED":
-		case "CANCELLED": return /* @__PURE__ */ w(b, {
+		case "CANCELLED": return /* @__PURE__ */ C(v, {
 			size: 14,
 			style: { color: t },
 			"aria-hidden": "true"
 		});
 		case "PENDING":
 		case "PROCESSING":
-		case "GENERATING": return /* @__PURE__ */ w(_, {
+		case "GENERATING": return /* @__PURE__ */ C(h, {
 			size: 14,
 			className: "animate-spin",
 			style: { color: t },
 			"aria-hidden": "true"
 		});
-		default: return /* @__PURE__ */ w(g, {
+		default: return /* @__PURE__ */ C(m, {
 			size: 14,
 			style: { color: t },
 			"aria-hidden": "true"
@@ -217,9 +294,9 @@ function F(e, t) {
 		default: return e;
 	}
 }
-var Se = ({ status: e }) => {
-	let { t } = se(), n = N[M(e)];
-	return /* @__PURE__ */ T("span", {
+var Ae = ({ status: e }) => {
+	let { t } = S(), n = N[M(e)];
+	return /* @__PURE__ */ w("span", {
 		"data-status": e,
 		style: {
 			...j,
@@ -230,7 +307,7 @@ var Se = ({ status: e }) => {
 		children: [P(e), F(e, t)]
 	});
 };
-function I(e) {
+function je(e) {
 	let t = N[e >= .8 ? "success" : e >= .5 ? "neutral" : "danger"];
 	return {
 		...j,
@@ -239,168 +316,195 @@ function I(e) {
 		color: t.text
 	};
 }
-function L(e) {
+function I(e) {
 	return e.pages.reduce((e, t) => e + t.widgets.length, 0);
 }
-var R = l(function() {
-	let { t: l } = se(), h = e(), g = a(), [b, x] = f(""), [D, M] = f(!1), [N, P] = f(null), [F, R] = f(() => /* @__PURE__ */ new Set()), [z, B] = f(null), [V, H] = f(null), [U, W] = f(""), G = u((e) => {
-		R((t) => new Set(t).add(e));
-	}, []), K = u((e) => {
-		R((t) => {
+function Me(e) {
+	let t = e?.toUpperCase();
+	return t === "HIGH" || t === "MEDIUM" || t === "LOW" ? t : null;
+}
+var Ne = {
+	HIGH: "success",
+	MEDIUM: "neutral",
+	LOW: "danger"
+};
+function Pe(e) {
+	let t = N[Ne[e]];
+	return {
+		...j,
+		padding: "0 var(--space-controlGap)",
+		fontSize: "var(--font-size-xs)",
+		fontWeight: "var(--font-weight-semibold)",
+		letterSpacing: "0.02em",
+		border: `1px solid ${t.border}`,
+		backgroundColor: t.bg,
+		color: t.text
+	};
+}
+var L = c(function() {
+	let { t: c } = S(), p = e(), m = a(), [v, y] = u(""), [T, M] = u("MODERN"), [N, P] = u("GRID"), [F, Ne] = u(Ce), [L, Fe] = u(we), [R, Ie] = u(!1), [Le, z] = u(null), [B, Re] = u(() => /* @__PURE__ */ new Set()), [V, H] = u(null), [U, W] = u(null), [G, K] = u(""), q = l((e) => {
+		Re((t) => new Set(t).add(e));
+	}, []), J = l((e) => {
+		Re((t) => {
 			let n = new Set(t);
 			return n.delete(e), n;
 		});
-	}, []), { data: Ce, loading: we, refetch: q, startPolling: Te, stopPolling: J } = C(pe, {
+	}, []), { data: ze, loading: Be, refetch: Y, startPolling: Ve, stopPolling: X } = x(me, {
 		variables: { first: 20 },
 		fetchPolicy: "cache-and-network"
-	}), Y = Ce?.listPromptGenerations?.edges?.some((e) => E.includes(e.node.status)) ?? !1, { data: Ee } = C(me, { variables: { limit: 6 } }), [De] = S(he), [Oe] = S(ge), [ke] = S(_e), [Ae] = S(ve), [X] = S(ye), [je] = S(be), Z = Ce?.listPromptGenerations?.edges?.map((e) => e.node) || [], Me = Ee?.getPromptSuggestions || [];
-	d(() => (Y || D ? Te(2e3) : J(), () => J()), [
-		Y,
-		D,
-		Te,
-		J
-	]), d(() => {
-		if (!z && !V) return;
+	}), Z = ze?.listPromptGenerations?.edges?.some((e) => Se.includes(e.node.status)) ?? !1, { data: He } = x(he, { variables: { limit: 6 } }), [Ue] = b(ge), [We] = b(_e), [Ge] = b(ve), [Ke] = b(ye), [qe] = b(be), [Je] = b(xe), Q = ze?.listPromptGenerations?.edges?.map((e) => e.node) || [], Ye = He?.getPromptSuggestions || [];
+	te(() => (Z || R ? Ve(2e3) : X(), () => X()), [
+		Z,
+		R,
+		Ve,
+		X
+	]), te(() => {
+		if (!V && !U) return;
 		let e = (e) => {
-			e.key === "Escape" && (B(null), H(null));
+			e.key === "Escape" && (H(null), W(null));
 		};
 		return window.addEventListener("keydown", e), () => window.removeEventListener("keydown", e);
-	}, [z, V]);
-	let Ne = u(async () => {
-		if (!(!b.trim() || D)) {
-			if (b.length > 2e3) {
-				P(l("bigconsole.insights.error.promptTooLong", "Prompt is too long (max 2000 characters)."));
+	}, [V, U]);
+	let Xe = l(async () => {
+		if (!(!v.trim() || R)) {
+			if (v.length > 2e3) {
+				z(c("bigconsole.insights.error.promptTooLong", "Prompt is too long (max 2000 characters)."));
 				return;
 			}
-			P(null), M(!0);
+			z(null), Ie(!0);
 			try {
-				g("bigconsole.ai.generate_clicked", { maxWidgets: 8 });
-				let e = await De({ variables: { input: {
-					prompt: b.trim(),
-					styleType: "MODERN",
-					layoutType: "GRID",
-					maxWidgets: 8
+				m("bigconsole.ai.generate_clicked", { maxWidgets: L });
+				let e = await Ue({ variables: { input: {
+					prompt: v.trim(),
+					styleType: T,
+					layoutType: N,
+					gridColumns: F,
+					maxWidgets: L
 				} } });
 				if (i(e, "command")) return;
 				let t = e.data?.generateDashboardFromPrompt?.id;
-				t && g("bigconsole.ai.dashboard_generated", {
+				t && m("bigconsole.ai.dashboard_generated", {
 					generationId: t,
-					maxWidgets: 8
-				}), x(""), q();
+					maxWidgets: L
+				}), y(""), Y();
 			} catch (e) {
 				if (i(e, "command")) return;
-				P(e instanceof Error ? e.message : l("bigconsole.insights.error.generateFailed", "Failed to generate dashboard"));
+				z(e instanceof Error ? e.message : c("bigconsole.insights.error.generateFailed", "Failed to generate dashboard"));
 			} finally {
-				M(!1);
+				Ie(!1);
 			}
 		}
 	}, [
-		g,
-		b,
-		D,
-		De,
-		q,
-		l
-	]), Q = u(async (e) => {
-		P(null);
+		m,
+		v,
+		R,
+		Ue,
+		Y,
+		T,
+		N,
+		F,
+		L,
+		c
+	]), Ze = l(async (e) => {
+		z(null);
 		try {
-			g("bigconsole.ai.create_dashboard_clicked", { generationId: e });
-			let t = await Oe({ variables: { input: { generationId: e } } });
+			m("bigconsole.ai.create_dashboard_clicked", { generationId: e });
+			let t = await We({ variables: { input: { generationId: e } } });
 			if (i(t, "project")) return;
 			let n = t.data?.createDashboardFromGeneration?.id;
-			n && (g("bigconsole.ai.dashboard_created", {
+			n && (m("bigconsole.ai.dashboard_created", {
 				generationId: e,
 				dashboardId: n
-			}), h(`/dashboards/${n}`));
+			}), p(`/dashboards/${n}`));
 		} catch (e) {
 			if (i(e, "project")) return;
-			P(e instanceof Error ? e.message : l("bigconsole.insights.error.createFailed", "Failed to create dashboard"));
+			z(e instanceof Error ? e.message : c("bigconsole.insights.error.createFailed", "Failed to create dashboard"));
 		}
 	}, [
-		Oe,
-		g,
-		h,
-		l
-	]), Pe = u(async (e) => {
-		P(null);
+		We,
+		m,
+		p,
+		c
+	]), Qe = l(async (e) => {
+		z(null);
 		try {
-			await ke({ variables: { generationId: e } }), o() && c("success"), q();
+			await Ge({ variables: { generationId: e } }), ee() && s("success"), Y();
 		} catch (e) {
-			P(e instanceof Error ? e.message : l("bigconsole.insights.error.deleteFailed", "Failed to delete generation")), o() && c("error");
+			z(e instanceof Error ? e.message : c("bigconsole.insights.error.deleteFailed", "Failed to delete generation")), ee() && s("error");
 		}
 	}, [
-		ke,
-		q,
-		l
-	]), Fe = u(async (e) => {
-		P(null), G(e);
+		Ge,
+		Y,
+		c
+	]), $e = l(async (e) => {
+		z(null), q(e);
 		try {
-			await Ae({ variables: { generationId: e } }), q();
+			await Ke({ variables: { generationId: e } }), Y();
 		} catch (e) {
-			P(e instanceof Error ? e.message : l("bigconsole.insights.error.cancelFailed", "Failed to cancel generation"));
+			z(e instanceof Error ? e.message : c("bigconsole.insights.error.cancelFailed", "Failed to cancel generation"));
 		} finally {
-			K(e);
+			J(e);
 		}
 	}, [
-		Ae,
-		q,
-		l
-	]), Ie = u(async (e) => {
-		P(null), G(e);
+		Ke,
+		Y,
+		c
+	]), et = l(async (e) => {
+		z(null), q(e);
 		try {
-			if (i(await X({ variables: { input: { generationId: e } } }), "command")) return;
-			q();
+			if (i(await qe({ variables: { input: { generationId: e } } }), "command")) return;
+			Y();
 		} catch (e) {
 			if (i(e, "command")) return;
-			P(e instanceof Error ? e.message : l("bigconsole.insights.error.regenerateFailed", "Failed to regenerate dashboard"));
+			z(e instanceof Error ? e.message : c("bigconsole.insights.error.regenerateFailed", "Failed to regenerate dashboard"));
 		} finally {
-			K(e);
+			J(e);
 		}
 	}, [
-		X,
-		q,
-		l
-	]), Le = u(async () => {
-		if (!V || !U.trim()) return;
-		let e = V.id;
-		P(null), G(e);
+		qe,
+		Y,
+		c
+	]), tt = l(async () => {
+		if (!U || !G.trim()) return;
+		let e = U.id;
+		z(null), q(e);
 		let t = !1;
 		try {
-			if (i(await je({ variables: { input: {
+			if (i(await Je({ variables: { input: {
 				generationId: e,
-				refinementPrompt: U.trim()
+				refinementPrompt: G.trim()
 			} } }), "command")) {
 				t = !0;
 				return;
 			}
-			t = !0, q();
+			t = !0, Y();
 		} catch (e) {
 			if (i(e, "command")) {
 				t = !0;
 				return;
 			}
-			P(e instanceof Error ? e.message : l("bigconsole.insights.error.refineFailed", "Failed to refine generation"));
+			z(e instanceof Error ? e.message : c("bigconsole.insights.error.refineFailed", "Failed to refine generation"));
 		} finally {
-			t && (H(null), W("")), K(e);
+			t && (W(null), K("")), J(e);
 		}
 	}, [
-		V,
 		U,
-		je,
-		q,
-		l
-	]), Re = u((e) => {
-		x(e);
-	}, []), $ = z?.generatedSpec;
-	return /* @__PURE__ */ T("div", {
+		G,
+		Je,
+		Y,
+		c
+	]), nt = l((e) => {
+		y(e);
+	}, []), $ = V?.generatedSpec;
+	return /* @__PURE__ */ w("div", {
 		className: "min-w-0",
 		style: { backgroundColor: "var(--color-bg-canvas)" },
 		children: [
-			/* @__PURE__ */ T("header", {
+			/* @__PURE__ */ w("header", {
 				className: "relative overflow-hidden border-b border-[var(--color-border-seam)] bg-[image:var(--gradient-gloss-card)]",
-				children: [/* @__PURE__ */ w(ce, { intensity: "subtle" }), /* @__PURE__ */ w("div", {
+				children: [/* @__PURE__ */ C(le, { intensity: "subtle" }), /* @__PURE__ */ C("div", {
 					style: { padding: "var(--space-pagePadding)" },
-					children: /* @__PURE__ */ T("div", {
+					children: /* @__PURE__ */ w("div", {
 						style: {
 							display: "flex",
 							alignItems: "center",
@@ -408,7 +512,7 @@ var R = l(function() {
 							flexWrap: "wrap",
 							minWidth: 0
 						},
-						children: [/* @__PURE__ */ w("div", {
+						children: [/* @__PURE__ */ C("div", {
 							style: {
 								display: "flex",
 								height: "var(--size-controlHeight-lg)",
@@ -419,63 +523,63 @@ var R = l(function() {
 								borderRadius: "var(--radius-card)",
 								backgroundColor: "var(--color-action-primary-bg)"
 							},
-							children: /* @__PURE__ */ w(v, { style: {
+							children: /* @__PURE__ */ C(g, { style: {
 								height: "var(--size-icon-lg)",
 								width: "var(--size-icon-lg)",
 								color: "var(--color-action-primary-text)"
 							} })
-						}), /* @__PURE__ */ T("div", {
+						}), /* @__PURE__ */ w("div", {
 							style: { minWidth: 0 },
-							children: [/* @__PURE__ */ w("h1", {
+							children: [/* @__PURE__ */ C("h1", {
 								className: "m-0 text-2xl font-bold text-text-primary",
-								children: /* @__PURE__ */ w(ue, { children: l("bigconsole.insights.header.title", "AI Insights") })
-							}), /* @__PURE__ */ w("p", {
+								children: /* @__PURE__ */ C(de, { children: c("bigconsole.insights.header.title", "AI Insights") })
+							}), /* @__PURE__ */ C("p", {
 								className: "m-0 text-sm text-text-secondary",
-								children: l("bigconsole.insights.header.subtitle", "Generate dashboards from natural language prompts")
+								children: c("bigconsole.insights.header.subtitle", "Generate dashboards from natural language prompts")
 							})]
 						})]
 					})
 				})]
 			}),
-			/* @__PURE__ */ T("div", {
+			/* @__PURE__ */ w("div", {
 				style: { padding: "var(--space-pagePadding)" },
-				children: [/* @__PURE__ */ w(fe, {
+				children: [/* @__PURE__ */ C(pe, {
 					className: "mb-[var(--space-sectionGap)]",
 					children: "Describe the dashboard you need in plain English and BigConsole proposes the pages, widgets and layout for it. Review the proposal, refine it in place, then create the real dashboard in one step — a generation is only a proposal until you accept it."
-				}), /* @__PURE__ */ T(r, { children: [
-					N && /* @__PURE__ */ w(n, {
+				}), /* @__PURE__ */ w(r, { children: [
+					Le && /* @__PURE__ */ C(n, {
 						headingLevel: 2,
 						tone: "danger",
 						padding: "compact",
 						title: "That request did not go through",
-						description: N,
-						icon: /* @__PURE__ */ w(p, { className: "h-icon-sm w-icon-sm" }),
+						description: Le,
+						icon: /* @__PURE__ */ C(d, { className: "h-icon-sm w-icon-sm" }),
 						"data-testid": "insights-error",
-						actions: /* @__PURE__ */ w("button", {
+						actions: /* @__PURE__ */ C("button", {
 							type: "button",
-							onClick: () => P(null),
-							"aria-label": l("bigconsole.insights.error.dismiss", "Dismiss error"),
+							onClick: () => z(null),
+							"aria-label": c("bigconsole.insights.error.dismiss", "Dismiss error"),
 							className: "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-bg-surface",
-							style: O,
+							style: E,
 							children: "Dismiss"
 						})
 					}),
-					/* @__PURE__ */ w(n, {
+					/* @__PURE__ */ C(n, {
 						id: "insights-prompt",
 						emphasis: "primary",
 						headingLevel: 2,
 						title: "Describe your dashboard",
 						description: "One or two sentences is enough — name the metrics, the breakdowns and who will read it.",
-						icon: /* @__PURE__ */ w(v, { className: "h-icon-sm w-icon-sm" }),
+						icon: /* @__PURE__ */ C(g, { className: "h-icon-sm w-icon-sm" }),
 						"data-testid": "insights-prompt",
-						children: /* @__PURE__ */ T("div", {
+						children: /* @__PURE__ */ w("div", {
 							style: {
 								display: "flex",
 								flexDirection: "column",
 								gap: "var(--space-controlGap)"
 							},
 							children: [
-								/* @__PURE__ */ w("label", {
+								/* @__PURE__ */ C("label", {
 									htmlFor: "prompt-input",
 									style: {
 										display: "block",
@@ -483,13 +587,13 @@ var R = l(function() {
 										fontWeight: "var(--font-weight-medium)",
 										color: "var(--color-text-primary)"
 									},
-									children: l("bigconsole.insights.prompt.label", "Your prompt")
+									children: c("bigconsole.insights.prompt.label", "Your prompt")
 								}),
-								/* @__PURE__ */ w("textarea", {
+								/* @__PURE__ */ C("textarea", {
 									id: "prompt-input",
-									value: b,
-									onChange: (e) => x(e.target.value),
-									placeholder: l("bigconsole.insights.prompt.placeholder", "e.g., Create a sales dashboard showing revenue trends, top products, and regional performance"),
+									value: v,
+									onChange: (e) => y(e.target.value),
+									placeholder: c("bigconsole.insights.prompt.placeholder", "e.g., Create a sales dashboard showing revenue trends, top products, and regional performance"),
 									rows: 3,
 									maxLength: 2e3,
 									className: t,
@@ -505,10 +609,82 @@ var R = l(function() {
 										resize: "vertical"
 									},
 									onKeyDown: (e) => {
-										e.key === "Enter" && (e.metaKey || e.ctrlKey) && Ne();
+										e.key === "Enter" && (e.metaKey || e.ctrlKey) && Xe();
 									}
 								}),
-								/* @__PURE__ */ T("div", {
+								/* @__PURE__ */ w("div", {
+									role: "group",
+									"aria-label": c("bigconsole.insights.prompt.optionsLabel", "Generation options"),
+									"data-testid": "insights-generation-options",
+									style: {
+										display: "grid",
+										gridTemplateColumns: "repeat(auto-fit, minmax(min(150px, 100%), 1fr))",
+										gap: "var(--space-controlGap)"
+									},
+									children: [
+										/* @__PURE__ */ w("div", { children: [/* @__PURE__ */ C("label", {
+											htmlFor: "prompt-style",
+											style: k,
+											children: c("bigconsole.insights.prompt.style", "Style")
+										}), /* @__PURE__ */ C("select", {
+											id: "prompt-style",
+											value: T,
+											onChange: (e) => M(e.target.value),
+											className: t,
+											style: A,
+											children: Te.map((e) => /* @__PURE__ */ C("option", {
+												value: e.value,
+												children: e.label
+											}, e.value))
+										})] }),
+										/* @__PURE__ */ w("div", { children: [/* @__PURE__ */ C("label", {
+											htmlFor: "prompt-layout",
+											style: k,
+											children: c("bigconsole.insights.prompt.layout", "Layout")
+										}), /* @__PURE__ */ C("select", {
+											id: "prompt-layout",
+											value: N,
+											onChange: (e) => P(e.target.value),
+											className: t,
+											style: A,
+											children: Ee.map((e) => /* @__PURE__ */ C("option", {
+												value: e.value,
+												children: e.label
+											}, e.value))
+										})] }),
+										/* @__PURE__ */ w("div", { children: [/* @__PURE__ */ C("label", {
+											htmlFor: "prompt-columns",
+											style: k,
+											children: c("bigconsole.insights.prompt.columns", "Columns")
+										}), /* @__PURE__ */ C("select", {
+											id: "prompt-columns",
+											value: F,
+											onChange: (e) => Ne(Number(e.target.value)),
+											className: t,
+											style: A,
+											children: De.map((e) => /* @__PURE__ */ C("option", {
+												value: e,
+												children: e
+											}, e))
+										})] }),
+										/* @__PURE__ */ w("div", { children: [/* @__PURE__ */ C("label", {
+											htmlFor: "prompt-max-widgets",
+											style: k,
+											children: c("bigconsole.insights.prompt.maxWidgets", "Max widgets")
+										}), /* @__PURE__ */ C("select", {
+											id: "prompt-max-widgets",
+											value: L,
+											onChange: (e) => Fe(Number(e.target.value)),
+											className: t,
+											style: A,
+											children: Oe.map((e) => /* @__PURE__ */ C("option", {
+												value: e,
+												children: e
+											}, e))
+										})] })
+									]
+								}),
+								/* @__PURE__ */ w("div", {
 									style: {
 										display: "flex",
 										alignItems: "center",
@@ -517,7 +693,7 @@ var R = l(function() {
 										borderTop: "1px solid var(--color-border-subtle)",
 										paddingTop: "var(--space-controlGap)"
 									},
-									children: [/* @__PURE__ */ T("span", {
+									children: [/* @__PURE__ */ w("span", {
 										style: {
 											flex: "1 1 12rem",
 											minWidth: 0,
@@ -525,51 +701,51 @@ var R = l(function() {
 											color: "var(--color-text-muted)"
 										},
 										children: [
-											l("bigconsole.insights.prompt.hint", "Press Ctrl+Enter to generate"),
+											c("bigconsole.insights.prompt.hint", "Press Ctrl+Enter to generate"),
 											" · ",
-											b.length,
+											v.length,
 											"/2000"
 										]
-									}), /* @__PURE__ */ T("button", {
+									}), /* @__PURE__ */ w("button", {
 										type: "button",
-										onClick: Ne,
-										disabled: !b.trim() || D,
+										onClick: Xe,
+										disabled: !v.trim() || R,
 										className: t,
 										style: {
-											...k,
+											...D,
 											marginLeft: "auto",
-											cursor: !b.trim() || D ? "not-allowed" : "pointer",
-											opacity: !b.trim() || D ? .5 : 1
+											cursor: !v.trim() || R ? "not-allowed" : "pointer",
+											opacity: !v.trim() || R ? .5 : 1
 										},
-										children: [D ? /* @__PURE__ */ w(_, {
+										children: [R ? /* @__PURE__ */ C(h, {
 											size: 16,
 											className: "animate-spin",
 											"aria-hidden": "true"
-										}) : /* @__PURE__ */ w(v, {
+										}) : /* @__PURE__ */ C(g, {
 											size: 16,
 											"aria-hidden": "true"
-										}), l("bigconsole.insights.prompt.generateButton", "Generate dashboard")]
+										}), c("bigconsole.insights.prompt.generateButton", "Generate dashboard")]
 									})]
 								})
 							]
 						})
 					}),
-					Me.length > 0 && /* @__PURE__ */ w(n, {
+					Ye.length > 0 && /* @__PURE__ */ C(n, {
 						emphasis: "muted",
 						headingLevel: 2,
-						title: l("bigconsole.insights.suggestions.heading", "Starting points"),
+						title: c("bigconsole.insights.suggestions.heading", "Starting points"),
 						description: "Pick one to drop it into the prompt box above, then edit it before generating.",
-						icon: /* @__PURE__ */ w(re, { className: "h-icon-sm w-icon-sm" }),
+						icon: /* @__PURE__ */ C(ae, { className: "h-icon-sm w-icon-sm" }),
 						"data-testid": "insights-suggestions",
-						children: /* @__PURE__ */ w("div", {
+						children: /* @__PURE__ */ C("div", {
 							style: {
 								display: "grid",
 								gridTemplateColumns: "repeat(auto-fill, minmax(min(260px, 100%), 1fr))",
 								gap: "var(--space-controlGap)"
 							},
-							children: Me.map((e) => /* @__PURE__ */ T("button", {
+							children: Ye.map((e) => /* @__PURE__ */ w("button", {
 								type: "button",
-								onClick: () => Re(e.prompt),
+								onClick: () => nt(e.prompt),
 								className: "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-bg-surface",
 								style: {
 									textAlign: "left",
@@ -582,7 +758,7 @@ var R = l(function() {
 									cursor: "pointer"
 								},
 								children: [
-									/* @__PURE__ */ w("span", {
+									/* @__PURE__ */ C("span", {
 										style: {
 											display: "block",
 											fontWeight: "var(--font-weight-medium)",
@@ -592,7 +768,7 @@ var R = l(function() {
 										},
 										children: e.title
 									}),
-									/* @__PURE__ */ w("span", {
+									/* @__PURE__ */ C("span", {
 										style: {
 											display: "block",
 											fontSize: "var(--font-size-body-sm)",
@@ -601,14 +777,14 @@ var R = l(function() {
 										},
 										children: e.exampleDescription || e.prompt
 									}),
-									e.tags.length > 0 && /* @__PURE__ */ w("span", {
+									e.tags.length > 0 && /* @__PURE__ */ C("span", {
 										style: {
 											display: "flex",
 											gap: "var(--space-iconGap)",
 											marginTop: "var(--space-controlGap)",
 											flexWrap: "wrap"
 										},
-										children: e.tags.slice(0, 3).map((e) => /* @__PURE__ */ w("span", {
+										children: e.tags.slice(0, 3).map((e) => /* @__PURE__ */ C("span", {
 											style: j,
 											children: e
 										}, e))
@@ -617,29 +793,29 @@ var R = l(function() {
 							}, e.id))
 						})
 					}),
-					/* @__PURE__ */ w(n, {
+					/* @__PURE__ */ C(n, {
 						emphasis: "bare",
 						padding: "none",
 						headingLevel: 2,
-						title: l("bigconsole.insights.generations.heading", "Recent generations"),
+						title: c("bigconsole.insights.generations.heading", "Recent generations"),
 						description: "Newest first. A generation stays a proposal until you create the dashboard from it.",
-						icon: /* @__PURE__ */ w(ne, { className: "h-icon-sm w-icon-sm" }),
-						meta: Z.length > 0 ? /* @__PURE__ */ T("span", {
+						icon: /* @__PURE__ */ C(ie, { className: "h-icon-sm w-icon-sm" }),
+						meta: Q.length > 0 ? /* @__PURE__ */ w("span", {
 							style: j,
 							children: [
-								Z.length,
+								Q.length,
 								" generation",
-								Z.length === 1 ? "" : "s"
+								Q.length === 1 ? "" : "s"
 							]
 						}) : void 0,
 						"data-testid": "insights-generations",
-						children: we && Z.length === 0 ? /* @__PURE__ */ w(n, {
+						children: Be && Q.length === 0 ? /* @__PURE__ */ C(n, {
 							emphasis: "muted",
 							headingLevel: 3,
 							"aria-label": "Loading generations",
 							className: "min-h-[10rem]",
 							"data-testid": "insights-generations-loading",
-							children: /* @__PURE__ */ T("div", {
+							children: /* @__PURE__ */ w("div", {
 								style: {
 									display: "flex",
 									minHeight: "8rem",
@@ -649,62 +825,62 @@ var R = l(function() {
 									gap: "var(--space-controlGap)",
 									color: "var(--color-text-muted)"
 								},
-								children: [/* @__PURE__ */ w(_, {
+								children: [/* @__PURE__ */ C(h, {
 									size: 24,
 									className: "animate-spin",
 									"aria-hidden": "true"
-								}), /* @__PURE__ */ w("p", {
+								}), /* @__PURE__ */ C("p", {
 									style: { fontSize: "var(--font-size-body-sm)" },
-									children: l("bigconsole.insights.generations.loading", "Loading generations…")
+									children: c("bigconsole.insights.generations.loading", "Loading generations…")
 								})]
 							})
-						}) : Z.length === 0 && !D ? /* @__PURE__ */ w(le, {
+						}) : Q.length === 0 && !R ? /* @__PURE__ */ C(ue, {
 							treatment: "insight",
 							className: "border-[var(--color-border-seam)]",
-							children: /* @__PURE__ */ w(de, {
+							children: /* @__PURE__ */ C(fe, {
 								illustration: "onboarding",
-								title: l("bigconsole.insights.generations.emptyTitle", "No generations yet"),
-								description: l("bigconsole.insights.generations.emptyDescription", "Describe a dashboard above to get started")
+								title: c("bigconsole.insights.generations.emptyTitle", "No generations yet"),
+								description: c("bigconsole.insights.generations.emptyDescription", "Describe a dashboard above to get started")
 							})
-						}) : /* @__PURE__ */ T("div", {
+						}) : /* @__PURE__ */ w("div", {
 							className: "flex flex-col gap-list-gap",
-							children: [D && !Y && /* @__PURE__ */ w(n, {
+							children: [R && !Z && /* @__PURE__ */ C(n, {
 								emphasis: "muted",
 								tone: "info",
 								padding: "compact",
 								headingLevel: 3,
 								title: "Sending your prompt…",
 								description: "The new generation appears here as soon as the backend accepts it.",
-								icon: /* @__PURE__ */ w(_, { className: "h-icon-sm w-icon-sm animate-spin" }),
+								icon: /* @__PURE__ */ C(h, { className: "h-icon-sm w-icon-sm animate-spin" }),
 								"data-testid": "insights-generation-pending"
-							}), Z.map((e) => {
-								let r = e.generatedSpec, i = F.has(e.id), a = E.includes(e.status);
-								return /* @__PURE__ */ T(n, {
+							}), Q.map((e) => {
+								let r = e.generatedSpec, i = B.has(e.id), a = Se.includes(e.status);
+								return /* @__PURE__ */ w(n, {
 									emphasis: "standard",
 									padding: "compact",
 									headingLevel: 3,
-									title: r?.name || (a ? l("bigconsole.insights.generations.generating", "Generating…") : "Untitled generation"),
-									meta: /* @__PURE__ */ w(Se, { status: e.status }),
+									title: r?.name || (a ? c("bigconsole.insights.generations.generating", "Generating…") : "Untitled generation"),
+									meta: /* @__PURE__ */ C(Ae, { status: e.status }),
 									description: e.prompt.length > 160 ? `${e.prompt.slice(0, 160)}…` : e.prompt,
 									"data-testid": "insights-generation-card",
 									bodyClassName: "flex flex-col gap-control-gap",
 									children: [
-										r && /* @__PURE__ */ T("div", {
+										r && /* @__PURE__ */ w("div", {
 											style: {
 												display: "flex",
 												flexWrap: "wrap",
 												gap: "var(--space-iconGap)"
 											},
 											children: [
-												/* @__PURE__ */ T("span", {
+												/* @__PURE__ */ w("span", {
 													style: j,
 													children: [
-														L(r),
+														I(r),
 														" widget",
-														L(r) === 1 ? "" : "s"
+														I(r) === 1 ? "" : "s"
 													]
 												}),
-												/* @__PURE__ */ T("span", {
+												/* @__PURE__ */ w("span", {
 													style: j,
 													children: [
 														r.pages.length,
@@ -712,21 +888,21 @@ var R = l(function() {
 														r.pages.length === 1 ? "" : "s"
 													]
 												}),
-												/* @__PURE__ */ T("span", {
-													style: I(r.overallConfidence),
+												/* @__PURE__ */ w("span", {
+													style: je(r.overallConfidence),
 													children: [Math.round(r.overallConfidence * 100), "% confidence"]
 												})
 											]
 										}),
-										e.errorMessage && /* @__PURE__ */ w(n, {
+										e.errorMessage && /* @__PURE__ */ C(n, {
 											headingLevel: 4,
 											tone: "danger",
 											padding: "compact",
 											title: "Generation failed",
 											description: e.errorMessage,
-											icon: /* @__PURE__ */ w(p, { className: "h-icon-sm w-icon-sm" })
+											icon: /* @__PURE__ */ C(d, { className: "h-icon-sm w-icon-sm" })
 										}),
-										/* @__PURE__ */ T("div", {
+										/* @__PURE__ */ w("div", {
 											style: {
 												display: "flex",
 												flexWrap: "wrap",
@@ -736,82 +912,82 @@ var R = l(function() {
 												paddingTop: "var(--space-controlGap)"
 											},
 											children: [
-												a && /* @__PURE__ */ T("button", {
+												a && /* @__PURE__ */ w("button", {
 													type: "button",
 													onClick: () => {
-														s("medium"), Fe(e.id);
+														o("medium"), $e(e.id);
 													},
 													disabled: i,
-													title: l("bigconsole.insights.actions.cancelTitle", "Cancel generation"),
+													title: c("bigconsole.insights.actions.cancelTitle", "Cancel generation"),
 													className: "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-bg-surface",
 													style: {
-														...xe,
+														...ke,
 														cursor: i ? "wait" : "pointer"
 													},
 													children: [
-														/* @__PURE__ */ w(ee, {
+														/* @__PURE__ */ C(ne, {
 															size: 14,
 															"aria-hidden": "true"
 														}),
 														" ",
-														l("bigconsole.insights.actions.cancel", "Cancel")
+														c("bigconsole.insights.actions.cancel", "Cancel")
 													]
 												}),
-												e.status === "COMPLETED" && r && /* @__PURE__ */ T("button", {
+												e.status === "COMPLETED" && r && /* @__PURE__ */ w("button", {
 													type: "button",
-													onClick: () => B(e),
-													title: l("bigconsole.insights.actions.previewTitle", "Preview proposed layout"),
+													onClick: () => H(e),
+													title: c("bigconsole.insights.actions.previewTitle", "Preview proposed layout"),
 													className: "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-bg-surface",
-													style: O,
+													style: E,
 													children: [
-														/* @__PURE__ */ w(te, {
+														/* @__PURE__ */ C(re, {
 															size: 14,
 															"aria-hidden": "true"
 														}),
 														" ",
-														l("bigconsole.insights.actions.preview", "Preview")
+														c("bigconsole.insights.actions.preview", "Preview")
 													]
 												}),
-												e.status === "COMPLETED" && r && /* @__PURE__ */ T("button", {
+												e.status === "COMPLETED" && r && /* @__PURE__ */ w("button", {
 													type: "button",
 													onClick: () => {
-														H(e), W("");
+														W(e), K("");
 													},
-													title: l("bigconsole.insights.actions.refineTitle", "Refine with instructions"),
+													title: c("bigconsole.insights.actions.refineTitle", "Refine with instructions"),
 													className: "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-bg-surface",
-													style: O,
+													style: E,
 													children: [
-														/* @__PURE__ */ w(y, {
+														/* @__PURE__ */ C(_, {
 															size: 14,
 															"aria-hidden": "true"
 														}),
 														" ",
-														l("bigconsole.insights.actions.refine", "Refine")
+														c("bigconsole.insights.actions.refine", "Refine")
 													]
 												}),
-												(e.status === "COMPLETED" || e.status === "FAILED" || e.status === "CANCELLED") && /* @__PURE__ */ T("button", {
+												(e.status === "COMPLETED" || e.status === "FAILED" || e.status === "CANCELLED") && /* @__PURE__ */ w("button", {
 													type: "button",
 													onClick: () => {
-														s("medium"), Ie(e.id);
+														o("medium"), et(e.id);
 													},
 													disabled: i,
-													title: l("bigconsole.insights.actions.regenerateTitle", "Regenerate with the same prompt"),
+													title: c("bigconsole.insights.actions.regenerateTitle", "Regenerate with the same prompt"),
 													className: "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-bg-surface",
 													style: {
-														...O,
+														...E,
 														cursor: i ? "wait" : "pointer"
 													},
 													children: [
-														/* @__PURE__ */ w(ie, {
+														/* @__PURE__ */ C(oe, {
 															size: 14,
 															className: i ? "animate-spin" : "",
 															"aria-hidden": "true"
 														}),
 														" ",
-														l("bigconsole.insights.actions.regenerate", "Regenerate")
+														c("bigconsole.insights.actions.regenerate", "Regenerate")
 													]
 												}),
-												/* @__PURE__ */ T("div", {
+												/* @__PURE__ */ w("div", {
 													style: {
 														display: "flex",
 														flexWrap: "wrap",
@@ -820,44 +996,44 @@ var R = l(function() {
 														marginLeft: "auto"
 													},
 													children: [
-														e.status === "COMPLETED" && !e.dashboardId && /* @__PURE__ */ T("button", {
+														e.status === "COMPLETED" && !e.dashboardId && /* @__PURE__ */ w("button", {
 															type: "button",
-															onClick: () => Q(e.id),
+															onClick: () => Ze(e.id),
 															className: "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-bg-surface",
-															style: k,
+															style: D,
 															children: [
-																l("bigconsole.insights.actions.create", "Create dashboard"),
+																c("bigconsole.insights.actions.create", "Create dashboard"),
 																" ",
-																/* @__PURE__ */ w(m, {
+																/* @__PURE__ */ C(f, {
 																	size: 14,
 																	"aria-hidden": "true"
 																})
 															]
 														}),
-														e.dashboardId && /* @__PURE__ */ T("button", {
+														e.dashboardId && /* @__PURE__ */ w("button", {
 															type: "button",
-															onClick: () => h(`/dashboards/${e.dashboardId ?? ""}`),
+															onClick: () => p(`/dashboards/${e.dashboardId ?? ""}`),
 															className: "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-bg-surface",
-															style: O,
+															style: E,
 															children: [
-																l("bigconsole.insights.actions.viewDashboard", "View dashboard"),
+																c("bigconsole.insights.actions.viewDashboard", "View dashboard"),
 																" ",
-																/* @__PURE__ */ w(m, {
+																/* @__PURE__ */ C(f, {
 																	size: 14,
 																	"aria-hidden": "true"
 																})
 															]
 														}),
-														/* @__PURE__ */ w("button", {
+														/* @__PURE__ */ C("button", {
 															type: "button",
 															onClick: () => {
-																s("medium"), Pe(e.id);
+																o("medium"), Qe(e.id);
 															},
-															title: l("bigconsole.insights.actions.deleteTitle", "Delete generation"),
-															"aria-label": l("bigconsole.insights.actions.deleteTitle", "Delete generation"),
+															title: c("bigconsole.insights.actions.deleteTitle", "Delete generation"),
+															"aria-label": c("bigconsole.insights.actions.deleteTitle", "Delete generation"),
 															className: t,
-															style: A,
-															children: /* @__PURE__ */ w(ae, {
+															style: O,
+															children: /* @__PURE__ */ C(se, {
 																size: 14,
 																"aria-hidden": "true"
 															})
@@ -873,11 +1049,11 @@ var R = l(function() {
 					})
 				] })]
 			}),
-			z && $ && /* @__PURE__ */ w("div", {
+			V && $ && /* @__PURE__ */ C("div", {
 				role: "dialog",
 				"aria-modal": "true",
-				"aria-label": l("bigconsole.insights.preview.ariaLabel", "Generation preview"),
-				onClick: () => B(null),
+				"aria-label": c("bigconsole.insights.preview.ariaLabel", "Generation preview"),
+				onClick: () => H(null),
 				style: {
 					position: "fixed",
 					inset: 0,
@@ -888,7 +1064,7 @@ var R = l(function() {
 					justifyContent: "center",
 					padding: "var(--space-pagePadding)"
 				},
-				children: /* @__PURE__ */ T("div", {
+				children: /* @__PURE__ */ w("div", {
 					onClick: (e) => e.stopPropagation(),
 					style: {
 						display: "flex",
@@ -902,7 +1078,7 @@ var R = l(function() {
 						boxShadow: "var(--shadow-elevation-3)"
 					},
 					children: [
-						/* @__PURE__ */ T("div", {
+						/* @__PURE__ */ w("div", {
 							style: {
 								display: "flex",
 								justifyContent: "space-between",
@@ -911,16 +1087,16 @@ var R = l(function() {
 								padding: "var(--space-cardPadding)",
 								borderBottom: "1px solid var(--color-border-subtle)"
 							},
-							children: [/* @__PURE__ */ T("div", {
+							children: [/* @__PURE__ */ w("div", {
 								style: { minWidth: 0 },
-								children: [/* @__PURE__ */ w("h2", {
+								children: [/* @__PURE__ */ C("h2", {
 									style: {
 										fontSize: "var(--font-size-heading-h4)",
 										fontWeight: "var(--font-weight-semibold)",
 										color: "var(--color-text-primary)"
 									},
 									children: $.name
-								}), $.description && /* @__PURE__ */ w("p", {
+								}), $.description && /* @__PURE__ */ C("p", {
 									style: {
 										fontSize: "var(--font-size-body-sm)",
 										color: "var(--color-text-secondary)",
@@ -928,22 +1104,22 @@ var R = l(function() {
 									},
 									children: $.description
 								})]
-							}), /* @__PURE__ */ w("button", {
+							}), /* @__PURE__ */ C("button", {
 								type: "button",
-								onClick: () => B(null),
-								"aria-label": l("bigconsole.insights.preview.close", "Close preview"),
+								onClick: () => H(null),
+								"aria-label": c("bigconsole.insights.preview.close", "Close preview"),
 								className: "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-bg-surface",
 								style: {
-									...A,
+									...O,
 									color: "var(--color-text-muted)"
 								},
-								children: /* @__PURE__ */ w(oe, {
+								children: /* @__PURE__ */ C(ce, {
 									size: 18,
 									"aria-hidden": "true"
 								})
 							})]
 						}),
-						/* @__PURE__ */ T("div", {
+						/* @__PURE__ */ w("div", {
 							style: {
 								flex: "1 1 auto",
 								minHeight: 0,
@@ -953,68 +1129,139 @@ var R = l(function() {
 								flexDirection: "column",
 								gap: "var(--space-controlGap)"
 							},
-							children: [/* @__PURE__ */ T("div", {
-								style: {
-									display: "flex",
-									flexWrap: "wrap",
-									gap: "var(--space-iconGap)"
-								},
-								children: [
-									/* @__PURE__ */ T("span", {
-										style: j,
-										children: [
-											L($),
-											" widget",
-											L($) === 1 ? "" : "s"
-										]
-									}),
-									/* @__PURE__ */ T("span", {
-										style: j,
-										children: [
-											$.pages.length,
-											" page",
-											$.pages.length === 1 ? "" : "s"
-										]
-									}),
-									/* @__PURE__ */ T("span", {
-										style: I($.overallConfidence),
-										children: [Math.round($.overallConfidence * 100), "% confidence"]
-									})
-								]
-							}), $.pages.map((e, t) => /* @__PURE__ */ w(n, {
-								emphasis: "muted",
-								padding: "compact",
-								headingLevel: 3,
-								title: e.name,
-								meta: /* @__PURE__ */ T("span", {
-									style: j,
-									children: [
-										e.widgets.length,
-										" widget",
-										e.widgets.length === 1 ? "" : "s"
-									]
-								}),
-								children: /* @__PURE__ */ w("div", {
+							children: [
+								/* @__PURE__ */ w("div", {
 									style: {
 										display: "flex",
 										flexWrap: "wrap",
 										gap: "var(--space-iconGap)"
 									},
-									children: e.widgets.map((e, t) => /* @__PURE__ */ T("span", {
+									children: [
+										/* @__PURE__ */ w("span", {
+											style: j,
+											children: [
+												I($),
+												" widget",
+												I($) === 1 ? "" : "s"
+											]
+										}),
+										/* @__PURE__ */ w("span", {
+											style: j,
+											children: [
+												$.pages.length,
+												" page",
+												$.pages.length === 1 ? "" : "s"
+											]
+										}),
+										/* @__PURE__ */ w("span", {
+											style: je($.overallConfidence),
+											children: [Math.round($.overallConfidence * 100), "% confidence"]
+										})
+									]
+								}),
+								$.reasoning && /* @__PURE__ */ w("details", {
+									"data-testid": "preview-reasoning",
+									children: [/* @__PURE__ */ C("summary", {
+										className: "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-bg-surface",
+										style: {
+											cursor: "pointer",
+											fontSize: "var(--font-size-body-sm)",
+											fontWeight: "var(--font-weight-medium)",
+											color: "var(--color-text-secondary)",
+											borderRadius: "var(--radius-button)"
+										},
+										children: c("bigconsole.insights.preview.reasoningToggle", "Why these widgets?")
+									}), /* @__PURE__ */ C("p", {
 										style: {
-											...j,
-											backgroundColor: "var(--color-bg-surface)",
-											color: "var(--color-text-primary)"
+											marginTop: "var(--space-controlGap)",
+											fontSize: "var(--font-size-body-sm)",
+											lineHeight: "var(--font-lineHeight-normal)",
+											color: "var(--color-text-secondary)"
 										},
-										children: [e.title, /* @__PURE__ */ w("span", {
-											style: { color: "var(--color-text-muted)" },
-											children: e.type
-										})]
-									}, t))
-								})
-							}, t))]
+										children: $.reasoning
+									})]
+								}),
+								$.pages.map((e, t) => /* @__PURE__ */ C(n, {
+									emphasis: "muted",
+									padding: "compact",
+									headingLevel: 3,
+									title: e.name,
+									meta: /* @__PURE__ */ w("span", {
+										style: j,
+										children: [
+											e.widgets.length,
+											" widget",
+											e.widgets.length === 1 ? "" : "s"
+										]
+									}),
+									children: /* @__PURE__ */ C("div", {
+										style: {
+											display: "flex",
+											flexDirection: "column",
+											gap: "var(--space-controlGap)"
+										},
+										children: e.widgets.map((e, t) => {
+											let n = Me(e.confidence);
+											return /* @__PURE__ */ w("div", {
+												style: {
+													display: "flex",
+													flexDirection: "column",
+													gap: "2px",
+													padding: "var(--space-controlGap)",
+													borderRadius: "var(--radius-input)",
+													backgroundColor: "var(--color-bg-surface)",
+													border: "1px solid var(--color-border-subtle)"
+												},
+												children: [/* @__PURE__ */ w("div", {
+													style: {
+														display: "flex",
+														flexWrap: "wrap",
+														alignItems: "center",
+														gap: "var(--space-iconGap)"
+													},
+													children: [
+														/* @__PURE__ */ C("span", {
+															style: {
+																fontSize: "var(--font-size-body-sm)",
+																fontWeight: "var(--font-weight-medium)",
+																color: "var(--color-text-primary)",
+																minWidth: 0
+															},
+															children: e.title
+														}),
+														/* @__PURE__ */ C("span", {
+															style: {
+																fontSize: "var(--font-size-xs)",
+																color: "var(--color-text-muted)"
+															},
+															"data-testid": "preview-widget-type",
+															children: e.type
+														}),
+														n && /* @__PURE__ */ C("span", {
+															style: {
+																...Pe(n),
+																marginLeft: "auto"
+															},
+															"data-testid": "preview-widget-confidence",
+															children: n
+														})
+													]
+												}), e.reasoning && /* @__PURE__ */ C("p", {
+													style: {
+														margin: 0,
+														fontSize: "var(--font-size-xs)",
+														lineHeight: "var(--font-lineHeight-normal)",
+														color: "var(--color-text-muted)"
+													},
+													children: e.reasoning
+												})]
+											}, t);
+										})
+									})
+								}, t))
+							]
 						}),
-						/* @__PURE__ */ T("div", {
+						/* @__PURE__ */ w("div", {
 							style: {
 								display: "flex",
 								justifyContent: "flex-end",
@@ -1023,38 +1270,59 @@ var R = l(function() {
 								padding: "var(--space-cardPadding)",
 								borderTop: "1px solid var(--color-border-subtle)"
 							},
-							children: [/* @__PURE__ */ w("button", {
-								type: "button",
-								onClick: () => B(null),
-								className: "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-bg-surface",
-								style: O,
-								children: "Close"
-							}), z.status === "COMPLETED" && !z.dashboardId && /* @__PURE__ */ T("button", {
-								type: "button",
-								onClick: () => {
-									let e = z.id;
-									B(null), Q(e);
-								},
-								className: "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-bg-surface",
-								style: k,
-								children: [
-									l("bigconsole.insights.actions.create", "Create dashboard"),
-									" ",
-									/* @__PURE__ */ w(m, {
-										size: 14,
-										"aria-hidden": "true"
-									})
-								]
-							})]
+							children: [
+								/* @__PURE__ */ C("button", {
+									type: "button",
+									onClick: () => H(null),
+									className: "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-bg-surface",
+									style: E,
+									children: "Close"
+								}),
+								V.status === "COMPLETED" && $ && /* @__PURE__ */ w("button", {
+									type: "button",
+									onClick: () => {
+										let e = V;
+										H(null), W(e), K("");
+									},
+									title: c("bigconsole.insights.actions.refineTitle", "Refine with instructions"),
+									className: "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-bg-surface",
+									style: E,
+									children: [
+										/* @__PURE__ */ C(_, {
+											size: 14,
+											"aria-hidden": "true"
+										}),
+										" ",
+										c("bigconsole.insights.actions.refine", "Refine")
+									]
+								}),
+								V.status === "COMPLETED" && !V.dashboardId && /* @__PURE__ */ w("button", {
+									type: "button",
+									onClick: () => {
+										let e = V.id;
+										H(null), Ze(e);
+									},
+									className: "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-bg-surface",
+									style: D,
+									children: [
+										c("bigconsole.insights.actions.create", "Create dashboard"),
+										" ",
+										/* @__PURE__ */ C(f, {
+											size: 14,
+											"aria-hidden": "true"
+										})
+									]
+								})
+							]
 						})
 					]
 				})
 			}),
-			V && /* @__PURE__ */ w("div", {
+			U && /* @__PURE__ */ C("div", {
 				role: "dialog",
 				"aria-modal": "true",
-				"aria-label": l("bigconsole.insights.refine.ariaLabel", "Refine generation"),
-				onClick: () => H(null),
+				"aria-label": c("bigconsole.insights.refine.ariaLabel", "Refine generation"),
+				onClick: () => W(null),
 				style: {
 					position: "fixed",
 					inset: 0,
@@ -1065,7 +1333,7 @@ var R = l(function() {
 					justifyContent: "center",
 					padding: "var(--space-pagePadding)"
 				},
-				children: /* @__PURE__ */ T("div", {
+				children: /* @__PURE__ */ w("div", {
 					onClick: (e) => e.stopPropagation(),
 					style: {
 						display: "flex",
@@ -1079,28 +1347,28 @@ var R = l(function() {
 						boxShadow: "var(--shadow-elevation-3)"
 					},
 					children: [
-						/* @__PURE__ */ T("div", {
+						/* @__PURE__ */ w("div", {
 							style: {
 								padding: "var(--space-cardPadding)",
 								borderBottom: "1px solid var(--color-border-subtle)"
 							},
-							children: [/* @__PURE__ */ w("h2", {
+							children: [/* @__PURE__ */ C("h2", {
 								style: {
 									fontSize: "var(--font-size-heading-h4)",
 									fontWeight: "var(--font-weight-semibold)",
 									color: "var(--color-text-primary)"
 								},
-								children: l("bigconsole.insights.refine.heading", "Refine dashboard")
-							}), /* @__PURE__ */ w("p", {
+								children: c("bigconsole.insights.refine.heading", "Refine dashboard")
+							}), /* @__PURE__ */ C("p", {
 								style: {
 									fontSize: "var(--font-size-body-sm)",
 									color: "var(--color-text-secondary)",
 									marginTop: 2
 								},
-								children: l("bigconsole.insights.refine.subtitle", "Describe what to change — the AI keeps the existing spec and applies your instructions.")
+								children: c("bigconsole.insights.refine.subtitle", "Describe what to change — the AI keeps the existing spec and applies your instructions.")
 							})]
 						}),
-						/* @__PURE__ */ T("div", {
+						/* @__PURE__ */ w("div", {
 							style: {
 								flex: "1 1 auto",
 								minHeight: 0,
@@ -1110,20 +1378,20 @@ var R = l(function() {
 								flexDirection: "column",
 								gap: "var(--space-controlGap)"
 							},
-							children: [/* @__PURE__ */ w(n, {
+							children: [/* @__PURE__ */ C(n, {
 								emphasis: "muted",
 								padding: "compact",
 								headingLevel: 3,
-								title: V.generatedSpec?.name || "Current proposal",
-								description: V.prompt.length > 240 ? `${V.prompt.slice(0, 240)}…` : V.prompt,
-								icon: /* @__PURE__ */ w(v, { className: "h-icon-sm w-icon-sm" })
-							}), /* @__PURE__ */ T("div", {
+								title: U.generatedSpec?.name || "Current proposal",
+								description: U.prompt.length > 240 ? `${U.prompt.slice(0, 240)}…` : U.prompt,
+								icon: /* @__PURE__ */ C(g, { className: "h-icon-sm w-icon-sm" })
+							}), /* @__PURE__ */ w("div", {
 								style: {
 									display: "flex",
 									flexDirection: "column",
 									gap: "var(--space-controlGap)"
 								},
-								children: [/* @__PURE__ */ w("label", {
+								children: [/* @__PURE__ */ C("label", {
 									htmlFor: "refine-input",
 									style: {
 										display: "block",
@@ -1132,13 +1400,13 @@ var R = l(function() {
 										color: "var(--color-text-primary)"
 									},
 									children: "What should change?"
-								}), /* @__PURE__ */ w("textarea", {
+								}), /* @__PURE__ */ C("textarea", {
 									id: "refine-input",
-									value: U,
-									onChange: (e) => W(e.target.value),
+									value: G,
+									onChange: (e) => K(e.target.value),
 									maxLength: 2e3,
 									rows: 4,
-									placeholder: l("bigconsole.insights.refine.placeholder", "e.g., Add a revenue-by-region map and remove the duplicate KPI cards"),
+									placeholder: c("bigconsole.insights.refine.placeholder", "e.g., Add a revenue-by-region map and remove the duplicate KPI cards"),
 									className: "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-bg-surface",
 									style: {
 										width: "100%",
@@ -1154,7 +1422,7 @@ var R = l(function() {
 								})]
 							})]
 						}),
-						/* @__PURE__ */ T("div", {
+						/* @__PURE__ */ w("div", {
 							style: {
 								display: "flex",
 								justifyContent: "flex-end",
@@ -1163,30 +1431,30 @@ var R = l(function() {
 								padding: "var(--space-cardPadding)",
 								borderTop: "1px solid var(--color-border-subtle)"
 							},
-							children: [/* @__PURE__ */ w("button", {
+							children: [/* @__PURE__ */ C("button", {
 								type: "button",
-								onClick: () => H(null),
+								onClick: () => W(null),
 								className: "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-bg-surface",
-								style: O,
-								children: l("bigconsole.insights.actions.cancel", "Cancel")
-							}), /* @__PURE__ */ T("button", {
+								style: E,
+								children: c("bigconsole.insights.actions.cancel", "Cancel")
+							}), /* @__PURE__ */ w("button", {
 								type: "button",
-								onClick: () => void Le(),
-								disabled: !U.trim() || F.has(V.id),
+								onClick: () => void tt(),
+								disabled: !G.trim() || B.has(U.id),
 								className: "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-bg-surface",
 								style: {
-									...k,
-									cursor: !U.trim() || F.has(V.id) ? "not-allowed" : "pointer",
-									opacity: U.trim() ? 1 : .6
+									...D,
+									cursor: !G.trim() || B.has(U.id) ? "not-allowed" : "pointer",
+									opacity: G.trim() ? 1 : .6
 								},
-								children: [F.has(V.id) ? /* @__PURE__ */ w(_, {
+								children: [B.has(U.id) ? /* @__PURE__ */ C(h, {
 									size: 14,
 									className: "animate-spin",
 									"aria-hidden": "true"
-								}) : /* @__PURE__ */ w(y, {
+								}) : /* @__PURE__ */ C(_, {
 									size: 14,
 									"aria-hidden": "true"
-								}), l("bigconsole.insights.refine.apply", "Apply refinement")]
+								}), c("bigconsole.insights.refine.apply", "Apply refinement")]
 							})]
 						})
 					]
@@ -1196,6 +1464,6 @@ var R = l(function() {
 	});
 });
 //#endregion
-export { R as InsightsPage, R as default };
+export { L as InsightsPage, L as default };
 
 //# sourceMappingURL=InsightsPage.js.map