@burdenoff/microfe-bigconsole 2026.1004.3 → 2026.1004.4

package/dist/bigconsole/components/widgets/WidgetHeader.d.ts

@@ -3,6 +3,7 @@ import { Widget } from '../../types';
 import { WidgetDefinition } from './WidgetRegistry';
 
 export interface WidgetHeaderProps {
+    previewOnly?: boolean;
     /** The widget data */
     widget: Widget;
     /** Widget definition from registry */

package/dist/bigconsole/components/widgets/WidgetHeader.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"WidgetHeader.d.ts","sourceRoot":"","sources":["../../../../src/bigconsole/components/widgets/WidgetHeader.tsx"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,OAAO,EAAE,KAAK,EAAE,EAA2B,MAAM,OAAO,CAAC;AAEzD,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC;AAC1C,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,kBAAkB,CAAC;AAOzD,MAAM,WAAW,iBAAiB;IAChC,sBAAsB;IACtB,MAAM,EAAE,MAAM,CAAC;IACf,sCAAsC;IACtC,UAAU,EAAE,gBAAgB,CAAC;IAC7B,qCAAqC;IACrC,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,2BAA2B;IAC3B,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;;OAIG;IACH,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,oCAAoC;IACpC,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,iDAAiD;IACjD,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,kDAAkD;IAClD,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,iCAAiC;IACjC,SAAS,CAAC,EAAE,MAAM,IAAI,CAAC;IACvB,gCAAgC;IAChC,WAAW,CAAC,EAAE,MAAM,IAAI,CAAC;IACzB,gCAAgC;IAChC,WAAW,CAAC,EAAE,MAAM,IAAI,CAAC;IACzB,6BAA6B;IAC7B,WAAW,CAAC,EAAE,MAAM,IAAI,CAAC;IACzB,uCAAuC;IACvC,gBAAgB,CAAC,EAAE,MAAM,IAAI,CAAC;IAC9B,mDAAmD;IACnD,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,gDAAgD;IAChD,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB;AAMD,eAAO,MAAM,YAAY,EAAE,EAAE,CAAC,iBAAiB,CAmO7C,CAAC;AAgHH,eAAe,YAAY,CAAC"}
+{"version":3,"file":"WidgetHeader.d.ts","sourceRoot":"","sources":["../../../../src/bigconsole/components/widgets/WidgetHeader.tsx"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,OAAO,EAAE,KAAK,EAAE,EAA2B,MAAM,OAAO,CAAC;AAEzD,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC;AAC1C,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,kBAAkB,CAAC;AAOzD,MAAM,WAAW,iBAAiB;IAChC,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,sBAAsB;IACtB,MAAM,EAAE,MAAM,CAAC;IACf,sCAAsC;IACtC,UAAU,EAAE,gBAAgB,CAAC;IAC7B,qCAAqC;IACrC,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,2BAA2B;IAC3B,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;;OAIG;IACH,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,oCAAoC;IACpC,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,iDAAiD;IACjD,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,kDAAkD;IAClD,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,iCAAiC;IACjC,SAAS,CAAC,EAAE,MAAM,IAAI,CAAC;IACvB,gCAAgC;IAChC,WAAW,CAAC,EAAE,MAAM,IAAI,CAAC;IACzB,gCAAgC;IAChC,WAAW,CAAC,EAAE,MAAM,IAAI,CAAC;IACzB,6BAA6B;IAC7B,WAAW,CAAC,EAAE,MAAM,IAAI,CAAC;IACzB,uCAAuC;IACvC,gBAAgB,CAAC,EAAE,MAAM,IAAI,CAAC;IAC9B,mDAAmD;IACnD,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,gDAAgD;IAChD,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB;AAMD,eAAO,MAAM,YAAY,EAAE,EAAE,CAAC,iBAAiB,CAsO7C,CAAC;AAgHH,eAAe,YAAY,CAAC"}

package/dist/bigconsole/components/widgets/WidgetHeader.js

@@ -3,40 +3,40 @@ import { memo as t } from "react";
 import { MessageSquare as n } from "lucide-react";
 import { jsx as r, jsxs as i } from "react/jsx-runtime";
 //#region src/bigconsole/components/widgets/WidgetHeader.tsx
-var a = t(function({ widget: t, definition: a, isSelected: s, isEditMode: c, isLoading: l, isSampleData: u, timeUntilRefresh: d, hasDrilldown: f, onRefresh: p, onExportCSV: m, onExportPNG: h, onDrilldown: g, onToggleComments: _, commentsOpen: v, commentCount: y = 0 }) {
+var a = t(function({ previewOnly: t = !1, widget: a, definition: s, isSelected: c, isEditMode: l, isLoading: u, isSampleData: d, timeUntilRefresh: f, hasDrilldown: p, onRefresh: m, onExportCSV: h, onExportPNG: g, onDrilldown: _, onToggleComments: v, commentsOpen: y, commentCount: b = 0 }) {
 	return /* @__PURE__ */ i("div", {
 		className: `
         flex min-w-0 items-center justify-between gap-1
         px-3 py-2 sm:px-4
         border-b border-[var(--color-border-subtle)]
-        ${s && c ? "bg-action-primary-bg/5" : "bg-bg-surface"}
+        ${c && l ? "bg-action-primary-bg/5" : "bg-bg-surface"}
       `,
 		children: [/* @__PURE__ */ i("div", {
 			className: `
           widget-drag-handle
           flex items-center gap-2 min-w-0 flex-1
-          ${c ? "cursor-move" : ""}
+          ${l ? "cursor-move" : ""}
         `,
 			children: [
 				/* @__PURE__ */ r("div", {
 					className: `
             flex-shrink-0 h-icon-md w-icon-md
             text-text-secondary
-            ${l ? "animate-pulse" : ""}
+            ${u ? "animate-pulse" : ""}
           `,
-					children: /* @__PURE__ */ r(o, { name: a.icon })
+					children: /* @__PURE__ */ r(o, { name: s.icon })
 				}),
 				/* @__PURE__ */ r("h3", {
 					className: "\n            truncate text-sm font-semibold leading-tight tracking-tight\n            text-text-primary\n          ",
-					title: t.title,
-					children: t.title
+					title: a.title,
+					children: a.title
 				}),
-				u && /* @__PURE__ */ r("span", {
+				d && /* @__PURE__ */ r("span", {
 					className: "\n              flex-shrink-0\n              px-1.5 py-0.5\n              rounded\n              text-[10px] font-medium uppercase tracking-wide\n              bg-status-info-bg-subtle text-status-info-text\n            ",
 					title: "Example values from the template. Connect a data source to see your own data.",
 					children: "Sample"
 				}),
-				f && /* @__PURE__ */ i("span", {
+				p && /* @__PURE__ */ i("span", {
 					className: "\n              flex-shrink-0 inline-flex items-center gap-0.5\n              px-1.5 py-0.5 rounded-md\n              bg-action-primary-bg/10 text-action-primary-text\n              text-[10px] font-medium\n            ",
 					title: "Click data to drill down",
 					children: [/* @__PURE__ */ r("svg", {
@@ -52,19 +52,19 @@ var a = t(function({ widget: t, definition: a, isSelected: s, isEditMode: c, isL
 						})
 					}), "Drilldown"]
 				}),
-				d && !c && /* @__PURE__ */ r("span", {
+				f && !l && /* @__PURE__ */ r("span", {
 					className: "\n              flex-shrink-0 text-xs\n              text-text-secondary\n              tabular-nums\n            ",
 					title: "Time until next refresh",
-					children: d
+					children: f
 				})
 			]
 		}), /* @__PURE__ */ i("div", {
 			className: "flex min-w-0 shrink items-center gap-0.5",
 			children: [
-				g && !c && /* @__PURE__ */ r("button", {
+				_ && !l && /* @__PURE__ */ r("button", {
 					type: "button",
 					onClick: (e) => {
-						e.stopPropagation(), g();
+						e.stopPropagation(), _();
 					},
 					className: "\n              p-1.5 rounded-md\n              text-text-secondary\n              hover:text-text-primary\n              hover:bg-bg-sunken\n              transition-colors\n            ",
 					title: "Drill down to details",
@@ -81,12 +81,12 @@ var a = t(function({ widget: t, definition: a, isSelected: s, isEditMode: c, isL
 						})
 					})
 				}),
-				p && /* @__PURE__ */ r("button", {
+				m && /* @__PURE__ */ r("button", {
 					type: "button",
 					onClick: (e) => {
-						e.stopPropagation(), p();
+						e.stopPropagation(), m();
 					},
-					disabled: l,
+					disabled: u,
 					className: `
               p-1.5 rounded-md
               text-text-secondary
@@ -94,7 +94,7 @@ var a = t(function({ widget: t, definition: a, isSelected: s, isEditMode: c, isL
               hover:bg-bg-sunken
               transition-colors
               disabled:opacity-50 disabled:cursor-not-allowed
-              ${l ? "animate-spin" : ""}
+              ${u ? "animate-spin" : ""}
             `,
 					title: "Refresh data",
 					children: /* @__PURE__ */ r("svg", {
@@ -110,32 +110,32 @@ var a = t(function({ widget: t, definition: a, isSelected: s, isEditMode: c, isL
 						})
 					})
 				}),
-				_ && /* @__PURE__ */ i("button", {
+				v && /* @__PURE__ */ i("button", {
 					type: "button",
 					onClick: (e) => {
-						e.stopPropagation(), _();
+						e.stopPropagation(), v();
 					},
 					"aria-label": "Toggle comments",
-					"aria-pressed": v,
+					"aria-pressed": y,
 					className: `
               relative p-1.5 rounded-md
               transition-colors
-              ${v ? "text-action-primary-text bg-action-primary-bg/10" : "text-text-secondary hover:text-text-primary hover:bg-bg-sunken"}
+              ${y ? "text-action-primary-text bg-action-primary-bg/10" : "text-text-secondary hover:text-text-primary hover:bg-bg-sunken"}
             `,
 					title: "Comments",
-					children: [/* @__PURE__ */ r(n, { className: "w-4 h-4" }), y > 0 && /* @__PURE__ */ r("span", {
+					children: [/* @__PURE__ */ r(n, { className: "w-4 h-4" }), b > 0 && /* @__PURE__ */ r("span", {
 						className: "absolute -top-0.5 -right-0.5 min-w-[14px] h-[14px] px-0.5 rounded-full bg-action-primary-bg text-action-primary-text text-[9px] font-semibold leading-[14px] text-center tabular-nums",
-						children: y > 99 ? "99+" : y
+						children: b > 99 ? "99+" : b
 					})]
 				}),
-				/* @__PURE__ */ r("div", {
+				!t && /* @__PURE__ */ r("div", {
 					className: "block",
 					children: /* @__PURE__ */ r(e, {
-						widget: t,
-						isEditMode: c,
-						onRefresh: p,
-						onExportCSV: m,
-						onExportPNG: h
+						widget: a,
+						isEditMode: l,
+						onRefresh: m,
+						onExportCSV: h,
+						onExportPNG: g
 					})
 				})
 			]

package/dist/bigconsole/components/widgets/WidgetHeader.js.map

@@ -1 +1 @@
-{"version":3,"file":"WidgetHeader.js","names":[],"sources":["../../../../src/bigconsole/components/widgets/WidgetHeader.tsx"],"sourcesContent":["/**\n * WidgetHeader Component\n *\n * Header section of a widget with title, icon, and action menu.\n */\n\nimport { type FC, type ReactElement, memo } from 'react';\nimport { MessageSquare } from 'lucide-react';\nimport type { Widget } from '../../types';\nimport type { WidgetDefinition } from './WidgetRegistry';\nimport { WidgetMenu } from './WidgetMenu';\n\n// ============================================================================\n// Types\n// ============================================================================\n\nexport interface WidgetHeaderProps {\n  /** The widget data */\n  widget: Widget;\n  /** Widget definition from registry */\n  definition: WidgetDefinition;\n  /** Whether the widget is selected */\n  isSelected?: boolean;\n  /** Whether in edit mode */\n  isEditMode?: boolean;\n  /**\n   * The rendered values come from a template's embedded sample, not a\n   * connected data source. Badged so nobody mistakes example numbers for\n   * their own.\n   */\n  isSampleData?: boolean;\n  /** Whether the widget is loading */\n  isLoading?: boolean;\n  /** Time until next refresh (formatted string) */\n  timeUntilRefresh?: string;\n  /** Whether drilldown is enabled on this widget */\n  hasDrilldown?: boolean;\n  /** Callback to refresh widget */\n  onRefresh?: () => void;\n  /** Callback to export as CSV */\n  onExportCSV?: () => void;\n  /** Callback to export as PNG */\n  onExportPNG?: () => void;\n  /** Callback for drilldown */\n  onDrilldown?: () => void;\n  /** Toggle the widget comments panel */\n  onToggleComments?: () => void;\n  /** Whether the comments panel is currently open */\n  commentsOpen?: boolean;\n  /** Number of comments on this widget (badge) */\n  commentCount?: number;\n}\n\n// ============================================================================\n// Component\n// ============================================================================\n\nexport const WidgetHeader: FC<WidgetHeaderProps> = memo(function WidgetHeader({\n  widget,\n  definition,\n  isSelected,\n  isEditMode,\n  isLoading,\n  isSampleData,\n  timeUntilRefresh,\n  hasDrilldown,\n  onRefresh,\n  onExportCSV,\n  onExportPNG,\n  onDrilldown,\n  onToggleComments,\n  commentsOpen,\n  commentCount = 0,\n}) {\n  return (\n    /*\n      The card's title band. It is the anchor of the card, so the title is\n      `font-semibold` (was `font-medium`, identical to body copy) and the band\n      sits on the card surface with a seam — the sunken fill now belongs to the\n      action tray at the bottom, so the two strips read as different jobs\n      (BOFF-5636).\n\n      The fill is chosen in ONE branch rather than layering\n      `bg-action-primary-bg/5` on top of `bg-bg-surface`: two background-colour\n      utilities on the same element are resolved by Tailwind's output order, not\n      by the order they are written, so the selected tint was not reliably\n      winning.\n    */\n    <div\n      className={`\n        flex min-w-0 items-center justify-between gap-1\n        px-3 py-2 sm:px-4\n        border-b border-[var(--color-border-subtle)]\n        ${isSelected && isEditMode ? 'bg-action-primary-bg/5' : 'bg-bg-surface'}\n      `}\n    >\n      {/* Left side: Icon and Title - THIS IS THE DRAG HANDLE */}\n      <div\n        className={`\n          widget-drag-handle\n          flex items-center gap-2 min-w-0 flex-1\n          ${isEditMode ? 'cursor-move' : ''}\n        `}\n      >\n        {/* Widget type icon */}\n        <div\n          className={`\n            flex-shrink-0 h-icon-md w-icon-md\n            text-text-secondary\n            ${isLoading ? 'animate-pulse' : ''}\n          `}\n        >\n          <WidgetIcon name={definition.icon} />\n        </div>\n\n        {/* Title */}\n        <h3\n          className=\"\n            truncate text-sm font-semibold leading-tight tracking-tight\n            text-text-primary\n          \"\n          title={widget.title}\n        >\n          {widget.title}\n        </h3>\n\n        {/* Sample-data badge — example values, not the viewer's own data */}\n        {isSampleData && (\n          <span\n            className=\"\n              flex-shrink-0\n              px-1.5 py-0.5\n              rounded\n              text-[10px] font-medium uppercase tracking-wide\n              bg-status-info-bg-subtle text-status-info-text\n            \"\n            title=\"Example values from the template. Connect a data source to see your own data.\"\n          >\n            Sample\n          </span>\n        )}\n\n        {/* Drilldown indicator badge */}\n        {hasDrilldown && (\n          <span\n            className=\"\n              flex-shrink-0 inline-flex items-center gap-0.5\n              px-1.5 py-0.5 rounded-md\n              bg-action-primary-bg/10 text-action-primary-text\n              text-[10px] font-medium\n            \"\n            title=\"Click data to drill down\"\n          >\n            <svg className=\"w-2.5 h-2.5\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n              <path\n                strokeLinecap=\"round\"\n                strokeLinejoin=\"round\"\n                strokeWidth={2.5}\n                d=\"M10 6H6a2 2 0 00-2 2v10a2 2 0 002 2h10a2 2 0 002-2v-4M14 4h6m0 0v6m0-6L10 14\"\n              />\n            </svg>\n            Drilldown\n          </span>\n        )}\n\n        {/* Refresh indicator */}\n        {timeUntilRefresh && !isEditMode && (\n          <span\n            className=\"\n              flex-shrink-0 text-xs\n              text-text-secondary\n              tabular-nums\n            \"\n            title=\"Time until next refresh\"\n          >\n            {timeUntilRefresh}\n          </span>\n        )}\n      </div>\n\n      {/* Right side: Actions — allowed to shrink so a narrow card keeps its title */}\n      <div className=\"flex min-w-0 shrink items-center gap-0.5\">\n        {/* Drilldown button (shown in view mode) */}\n        {onDrilldown && !isEditMode && (\n          <button\n            type=\"button\"\n            onClick={(e) => {\n              e.stopPropagation();\n              onDrilldown();\n            }}\n            className=\"\n              p-1.5 rounded-md\n              text-text-secondary\n              hover:text-text-primary\n              hover:bg-bg-sunken\n              transition-colors\n            \"\n            title=\"Drill down to details\"\n          >\n            <svg className=\"w-4 h-4\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n              <path\n                strokeLinecap=\"round\"\n                strokeLinejoin=\"round\"\n                strokeWidth={2}\n                d=\"M10 6H6a2 2 0 00-2 2v10a2 2 0 002 2h10a2 2 0 002-2v-4M14 4h6m0 0v6m0-6L10 14\"\n              />\n            </svg>\n          </button>\n        )}\n\n        {/* Refresh button */}\n        {onRefresh && (\n          <button\n            type=\"button\"\n            onClick={(e) => {\n              e.stopPropagation();\n              onRefresh();\n            }}\n            disabled={isLoading}\n            className={`\n              p-1.5 rounded-md\n              text-text-secondary\n              hover:text-text-primary\n              hover:bg-bg-sunken\n              transition-colors\n              disabled:opacity-50 disabled:cursor-not-allowed\n              ${isLoading ? 'animate-spin' : ''}\n            `}\n            title=\"Refresh data\"\n          >\n            <svg className=\"w-4 h-4\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n              <path\n                strokeLinecap=\"round\"\n                strokeLinejoin=\"round\"\n                strokeWidth={2}\n                d=\"M4 4v5h.582m15.356 2A8.001 8.001 0 004.582 9m0 0H9m11 11v-5h-.581m0 0a8.003 8.003 0 01-15.357-2m15.357 2H15\"\n              />\n            </svg>\n          </button>\n        )}\n\n        {/* Comments toggle */}\n        {onToggleComments && (\n          <button\n            type=\"button\"\n            onClick={(e) => {\n              e.stopPropagation();\n              onToggleComments();\n            }}\n            aria-label=\"Toggle comments\"\n            aria-pressed={commentsOpen}\n            className={`\n              relative p-1.5 rounded-md\n              transition-colors\n              ${\n                commentsOpen\n                  ? 'text-action-primary-text bg-action-primary-bg/10'\n                  : 'text-text-secondary hover:text-text-primary hover:bg-bg-sunken'\n              }\n            `}\n            title=\"Comments\"\n          >\n            <MessageSquare className=\"w-4 h-4\" />\n            {commentCount > 0 && (\n              <span className=\"absolute -top-0.5 -right-0.5 min-w-[14px] h-[14px] px-0.5 rounded-full bg-action-primary-bg text-action-primary-text text-[9px] font-semibold leading-[14px] text-center tabular-nums\">\n                {commentCount > 99 ? '99+' : commentCount}\n              </span>\n            )}\n          </button>\n        )}\n\n        {/* Menu (always visible) */}\n        <div className=\"block\">\n          <WidgetMenu\n            widget={widget}\n            isEditMode={isEditMode}\n            onRefresh={onRefresh}\n            onExportCSV={onExportCSV}\n            onExportPNG={onExportPNG}\n          />\n        </div>\n      </div>\n    </div>\n  );\n});\n\n// ============================================================================\n// Widget Icon Component\n// ============================================================================\n\ninterface WidgetIconProps {\n  name: string;\n  className?: string;\n}\n\nconst WidgetIcon: FC<WidgetIconProps> = ({ name, className = '' }) => {\n  // Simple icon mapping - in production, use lucide-react or similar\n  const icons: Record<string, ReactElement> = {\n    TrendingUp: (\n      <svg fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\" className={className}>\n        <path strokeLinecap=\"round\" strokeLinejoin=\"round\" strokeWidth={2} d=\"M13 7h8m0 0v8m0-8l-8 8-4-4-6 6\" />\n      </svg>\n    ),\n    BarChart3: (\n      <svg fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\" className={className}>\n        <path strokeLinecap=\"round\" strokeLinejoin=\"round\" strokeWidth={2} d=\"M18 20V10M12 20V4M6 20v-6\" />\n      </svg>\n    ),\n    LineChart: (\n      <svg fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\" className={className}>\n        <path strokeLinecap=\"round\" strokeLinejoin=\"round\" strokeWidth={2} d=\"M7 20l4-16m2 16l4-16M6 9h14M4 15h14\" />\n      </svg>\n    ),\n    Table: (\n      <svg fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\" className={className}>\n        <path\n          strokeLinecap=\"round\"\n          strokeLinejoin=\"round\"\n          strokeWidth={2}\n          d=\"M3 10h18M3 14h18m-9-4v8m-7 0h14a2 2 0 002-2V8a2 2 0 00-2-2H5a2 2 0 00-2 2v8a2 2 0 002 2z\"\n        />\n      </svg>\n    ),\n    Gauge: (\n      <svg fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\" className={className}>\n        <path\n          strokeLinecap=\"round\"\n          strokeLinejoin=\"round\"\n          strokeWidth={2}\n          d=\"M12 8v4l3 3m6-3a9 9 0 11-18 0 9 9 0 0118 0z\"\n        />\n      </svg>\n    ),\n    Activity: (\n      <svg fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\" className={className}>\n        <path strokeLinecap=\"round\" strokeLinejoin=\"round\" strokeWidth={2} d=\"M22 12h-4l-3 9L9 3l-3 9H2\" />\n      </svg>\n    ),\n    List: (\n      <svg fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\" className={className}>\n        <path strokeLinecap=\"round\" strokeLinejoin=\"round\" strokeWidth={2} d=\"M4 6h16M4 10h16M4 14h16M4 18h16\" />\n      </svg>\n    ),\n    PieChart: (\n      <svg fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\" className={className}>\n        <path\n          strokeLinecap=\"round\"\n          strokeLinejoin=\"round\"\n          strokeWidth={2}\n          d=\"M11 3.055A9.001 9.001 0 1020.945 13H11V3.055z\"\n        />\n        <path\n          strokeLinecap=\"round\"\n          strokeLinejoin=\"round\"\n          strokeWidth={2}\n          d=\"M20.488 9H15V3.512A9.025 9.025 0 0120.488 9z\"\n        />\n      </svg>\n    ),\n    BarChart: (\n      <svg fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\" className={className}>\n        <path\n          strokeLinecap=\"round\"\n          strokeLinejoin=\"round\"\n          strokeWidth={2}\n          d=\"M9 19v-6a2 2 0 00-2-2H5a2 2 0 00-2 2v6a2 2 0 002 2h2a2 2 0 002-2zm0 0V9a2 2 0 012-2h2a2 2 0 012 2v10m-6 0a2 2 0 002 2h2a2 2 0 002-2m0 0V5a2 2 0 012-2h2a2 2 0 012 2v14a2 2 0 01-2 2h-2a2 2 0 01-2-2z\"\n        />\n      </svg>\n    ),\n    AreaChart: (\n      <svg fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\" className={className}>\n        <path\n          strokeLinecap=\"round\"\n          strokeLinejoin=\"round\"\n          strokeWidth={2}\n          d=\"M7 12l3-3 3 3 4-4M8 21l4-4 4 4M3 4h18M4 4v16\"\n        />\n      </svg>\n    ),\n  };\n\n  // Default icon\n  const defaultIcon = (\n    <svg fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\" className={className}>\n      <path\n        strokeLinecap=\"round\"\n        strokeLinejoin=\"round\"\n        strokeWidth={2}\n        d=\"M4 5a1 1 0 011-1h14a1 1 0 011 1v2a1 1 0 01-1 1H5a1 1 0 01-1-1V5zM4 13a1 1 0 011-1h6a1 1 0 011 1v6a1 1 0 01-1 1H5a1 1 0 01-1-1v-6zM16 13a1 1 0 011-1h2a1 1 0 011 1v6a1 1 0 01-1 1h-2a1 1 0 01-1-1v-6z\"\n      />\n    </svg>\n  );\n\n  return icons[name] || defaultIcon;\n};\n\nexport default WidgetHeader;\n"],"mappings":"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"}
+{"version":3,"file":"WidgetHeader.js","names":[],"sources":["../../../../src/bigconsole/components/widgets/WidgetHeader.tsx"],"sourcesContent":["/**\n * WidgetHeader Component\n *\n * Header section of a widget with title, icon, and action menu.\n */\n\nimport { type FC, type ReactElement, memo } from 'react';\nimport { MessageSquare } from 'lucide-react';\nimport type { Widget } from '../../types';\nimport type { WidgetDefinition } from './WidgetRegistry';\nimport { WidgetMenu } from './WidgetMenu';\n\n// ============================================================================\n// Types\n// ============================================================================\n\nexport interface WidgetHeaderProps {\n  previewOnly?: boolean;\n  /** The widget data */\n  widget: Widget;\n  /** Widget definition from registry */\n  definition: WidgetDefinition;\n  /** Whether the widget is selected */\n  isSelected?: boolean;\n  /** Whether in edit mode */\n  isEditMode?: boolean;\n  /**\n   * The rendered values come from a template's embedded sample, not a\n   * connected data source. Badged so nobody mistakes example numbers for\n   * their own.\n   */\n  isSampleData?: boolean;\n  /** Whether the widget is loading */\n  isLoading?: boolean;\n  /** Time until next refresh (formatted string) */\n  timeUntilRefresh?: string;\n  /** Whether drilldown is enabled on this widget */\n  hasDrilldown?: boolean;\n  /** Callback to refresh widget */\n  onRefresh?: () => void;\n  /** Callback to export as CSV */\n  onExportCSV?: () => void;\n  /** Callback to export as PNG */\n  onExportPNG?: () => void;\n  /** Callback for drilldown */\n  onDrilldown?: () => void;\n  /** Toggle the widget comments panel */\n  onToggleComments?: () => void;\n  /** Whether the comments panel is currently open */\n  commentsOpen?: boolean;\n  /** Number of comments on this widget (badge) */\n  commentCount?: number;\n}\n\n// ============================================================================\n// Component\n// ============================================================================\n\nexport const WidgetHeader: FC<WidgetHeaderProps> = memo(function WidgetHeader({\n  previewOnly = false,\n  widget,\n  definition,\n  isSelected,\n  isEditMode,\n  isLoading,\n  isSampleData,\n  timeUntilRefresh,\n  hasDrilldown,\n  onRefresh,\n  onExportCSV,\n  onExportPNG,\n  onDrilldown,\n  onToggleComments,\n  commentsOpen,\n  commentCount = 0,\n}) {\n  return (\n    /*\n      The card's title band. It is the anchor of the card, so the title is\n      `font-semibold` (was `font-medium`, identical to body copy) and the band\n      sits on the card surface with a seam — the sunken fill now belongs to the\n      action tray at the bottom, so the two strips read as different jobs\n      (BOFF-5636).\n\n      The fill is chosen in ONE branch rather than layering\n      `bg-action-primary-bg/5` on top of `bg-bg-surface`: two background-colour\n      utilities on the same element are resolved by Tailwind's output order, not\n      by the order they are written, so the selected tint was not reliably\n      winning.\n    */\n    <div\n      className={`\n        flex min-w-0 items-center justify-between gap-1\n        px-3 py-2 sm:px-4\n        border-b border-[var(--color-border-subtle)]\n        ${isSelected && isEditMode ? 'bg-action-primary-bg/5' : 'bg-bg-surface'}\n      `}\n    >\n      {/* Left side: Icon and Title - THIS IS THE DRAG HANDLE */}\n      <div\n        className={`\n          widget-drag-handle\n          flex items-center gap-2 min-w-0 flex-1\n          ${isEditMode ? 'cursor-move' : ''}\n        `}\n      >\n        {/* Widget type icon */}\n        <div\n          className={`\n            flex-shrink-0 h-icon-md w-icon-md\n            text-text-secondary\n            ${isLoading ? 'animate-pulse' : ''}\n          `}\n        >\n          <WidgetIcon name={definition.icon} />\n        </div>\n\n        {/* Title */}\n        <h3\n          className=\"\n            truncate text-sm font-semibold leading-tight tracking-tight\n            text-text-primary\n          \"\n          title={widget.title}\n        >\n          {widget.title}\n        </h3>\n\n        {/* Sample-data badge — example values, not the viewer's own data */}\n        {isSampleData && (\n          <span\n            className=\"\n              flex-shrink-0\n              px-1.5 py-0.5\n              rounded\n              text-[10px] font-medium uppercase tracking-wide\n              bg-status-info-bg-subtle text-status-info-text\n            \"\n            title=\"Example values from the template. Connect a data source to see your own data.\"\n          >\n            Sample\n          </span>\n        )}\n\n        {/* Drilldown indicator badge */}\n        {hasDrilldown && (\n          <span\n            className=\"\n              flex-shrink-0 inline-flex items-center gap-0.5\n              px-1.5 py-0.5 rounded-md\n              bg-action-primary-bg/10 text-action-primary-text\n              text-[10px] font-medium\n            \"\n            title=\"Click data to drill down\"\n          >\n            <svg className=\"w-2.5 h-2.5\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n              <path\n                strokeLinecap=\"round\"\n                strokeLinejoin=\"round\"\n                strokeWidth={2.5}\n                d=\"M10 6H6a2 2 0 00-2 2v10a2 2 0 002 2h10a2 2 0 002-2v-4M14 4h6m0 0v6m0-6L10 14\"\n              />\n            </svg>\n            Drilldown\n          </span>\n        )}\n\n        {/* Refresh indicator */}\n        {timeUntilRefresh && !isEditMode && (\n          <span\n            className=\"\n              flex-shrink-0 text-xs\n              text-text-secondary\n              tabular-nums\n            \"\n            title=\"Time until next refresh\"\n          >\n            {timeUntilRefresh}\n          </span>\n        )}\n      </div>\n\n      {/* Right side: Actions — allowed to shrink so a narrow card keeps its title */}\n      <div className=\"flex min-w-0 shrink items-center gap-0.5\">\n        {/* Drilldown button (shown in view mode) */}\n        {onDrilldown && !isEditMode && (\n          <button\n            type=\"button\"\n            onClick={(e) => {\n              e.stopPropagation();\n              onDrilldown();\n            }}\n            className=\"\n              p-1.5 rounded-md\n              text-text-secondary\n              hover:text-text-primary\n              hover:bg-bg-sunken\n              transition-colors\n            \"\n            title=\"Drill down to details\"\n          >\n            <svg className=\"w-4 h-4\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n              <path\n                strokeLinecap=\"round\"\n                strokeLinejoin=\"round\"\n                strokeWidth={2}\n                d=\"M10 6H6a2 2 0 00-2 2v10a2 2 0 002 2h10a2 2 0 002-2v-4M14 4h6m0 0v6m0-6L10 14\"\n              />\n            </svg>\n          </button>\n        )}\n\n        {/* Refresh button */}\n        {onRefresh && (\n          <button\n            type=\"button\"\n            onClick={(e) => {\n              e.stopPropagation();\n              onRefresh();\n            }}\n            disabled={isLoading}\n            className={`\n              p-1.5 rounded-md\n              text-text-secondary\n              hover:text-text-primary\n              hover:bg-bg-sunken\n              transition-colors\n              disabled:opacity-50 disabled:cursor-not-allowed\n              ${isLoading ? 'animate-spin' : ''}\n            `}\n            title=\"Refresh data\"\n          >\n            <svg className=\"w-4 h-4\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n              <path\n                strokeLinecap=\"round\"\n                strokeLinejoin=\"round\"\n                strokeWidth={2}\n                d=\"M4 4v5h.582m15.356 2A8.001 8.001 0 004.582 9m0 0H9m11 11v-5h-.581m0 0a8.003 8.003 0 01-15.357-2m15.357 2H15\"\n              />\n            </svg>\n          </button>\n        )}\n\n        {/* Comments toggle */}\n        {onToggleComments && (\n          <button\n            type=\"button\"\n            onClick={(e) => {\n              e.stopPropagation();\n              onToggleComments();\n            }}\n            aria-label=\"Toggle comments\"\n            aria-pressed={commentsOpen}\n            className={`\n              relative p-1.5 rounded-md\n              transition-colors\n              ${\n                commentsOpen\n                  ? 'text-action-primary-text bg-action-primary-bg/10'\n                  : 'text-text-secondary hover:text-text-primary hover:bg-bg-sunken'\n              }\n            `}\n            title=\"Comments\"\n          >\n            <MessageSquare className=\"w-4 h-4\" />\n            {commentCount > 0 && (\n              <span className=\"absolute -top-0.5 -right-0.5 min-w-[14px] h-[14px] px-0.5 rounded-full bg-action-primary-bg text-action-primary-text text-[9px] font-semibold leading-[14px] text-center tabular-nums\">\n                {commentCount > 99 ? '99+' : commentCount}\n              </span>\n            )}\n          </button>\n        )}\n\n        {/* Menu (always visible) */}\n        {!previewOnly && (\n          <div className=\"block\">\n            <WidgetMenu\n              widget={widget}\n              isEditMode={isEditMode}\n              onRefresh={onRefresh}\n              onExportCSV={onExportCSV}\n              onExportPNG={onExportPNG}\n            />\n          </div>\n        )}\n      </div>\n    </div>\n  );\n});\n\n// ============================================================================\n// Widget Icon Component\n// ============================================================================\n\ninterface WidgetIconProps {\n  name: string;\n  className?: string;\n}\n\nconst WidgetIcon: FC<WidgetIconProps> = ({ name, className = '' }) => {\n  // Simple icon mapping - in production, use lucide-react or similar\n  const icons: Record<string, ReactElement> = {\n    TrendingUp: (\n      <svg fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\" className={className}>\n        <path strokeLinecap=\"round\" strokeLinejoin=\"round\" strokeWidth={2} d=\"M13 7h8m0 0v8m0-8l-8 8-4-4-6 6\" />\n      </svg>\n    ),\n    BarChart3: (\n      <svg fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\" className={className}>\n        <path strokeLinecap=\"round\" strokeLinejoin=\"round\" strokeWidth={2} d=\"M18 20V10M12 20V4M6 20v-6\" />\n      </svg>\n    ),\n    LineChart: (\n      <svg fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\" className={className}>\n        <path strokeLinecap=\"round\" strokeLinejoin=\"round\" strokeWidth={2} d=\"M7 20l4-16m2 16l4-16M6 9h14M4 15h14\" />\n      </svg>\n    ),\n    Table: (\n      <svg fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\" className={className}>\n        <path\n          strokeLinecap=\"round\"\n          strokeLinejoin=\"round\"\n          strokeWidth={2}\n          d=\"M3 10h18M3 14h18m-9-4v8m-7 0h14a2 2 0 002-2V8a2 2 0 00-2-2H5a2 2 0 00-2 2v8a2 2 0 002 2z\"\n        />\n      </svg>\n    ),\n    Gauge: (\n      <svg fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\" className={className}>\n        <path\n          strokeLinecap=\"round\"\n          strokeLinejoin=\"round\"\n          strokeWidth={2}\n          d=\"M12 8v4l3 3m6-3a9 9 0 11-18 0 9 9 0 0118 0z\"\n        />\n      </svg>\n    ),\n    Activity: (\n      <svg fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\" className={className}>\n        <path strokeLinecap=\"round\" strokeLinejoin=\"round\" strokeWidth={2} d=\"M22 12h-4l-3 9L9 3l-3 9H2\" />\n      </svg>\n    ),\n    List: (\n      <svg fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\" className={className}>\n        <path strokeLinecap=\"round\" strokeLinejoin=\"round\" strokeWidth={2} d=\"M4 6h16M4 10h16M4 14h16M4 18h16\" />\n      </svg>\n    ),\n    PieChart: (\n      <svg fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\" className={className}>\n        <path\n          strokeLinecap=\"round\"\n          strokeLinejoin=\"round\"\n          strokeWidth={2}\n          d=\"M11 3.055A9.001 9.001 0 1020.945 13H11V3.055z\"\n        />\n        <path\n          strokeLinecap=\"round\"\n          strokeLinejoin=\"round\"\n          strokeWidth={2}\n          d=\"M20.488 9H15V3.512A9.025 9.025 0 0120.488 9z\"\n        />\n      </svg>\n    ),\n    BarChart: (\n      <svg fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\" className={className}>\n        <path\n          strokeLinecap=\"round\"\n          strokeLinejoin=\"round\"\n          strokeWidth={2}\n          d=\"M9 19v-6a2 2 0 00-2-2H5a2 2 0 00-2 2v6a2 2 0 002 2h2a2 2 0 002-2zm0 0V9a2 2 0 012-2h2a2 2 0 012 2v10m-6 0a2 2 0 002 2h2a2 2 0 002-2m0 0V5a2 2 0 012-2h2a2 2 0 012 2v14a2 2 0 01-2 2h-2a2 2 0 01-2-2z\"\n        />\n      </svg>\n    ),\n    AreaChart: (\n      <svg fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\" className={className}>\n        <path\n          strokeLinecap=\"round\"\n          strokeLinejoin=\"round\"\n          strokeWidth={2}\n          d=\"M7 12l3-3 3 3 4-4M8 21l4-4 4 4M3 4h18M4 4v16\"\n        />\n      </svg>\n    ),\n  };\n\n  // Default icon\n  const defaultIcon = (\n    <svg fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\" className={className}>\n      <path\n        strokeLinecap=\"round\"\n        strokeLinejoin=\"round\"\n        strokeWidth={2}\n        d=\"M4 5a1 1 0 011-1h14a1 1 0 011 1v2a1 1 0 01-1 1H5a1 1 0 01-1-1V5zM4 13a1 1 0 011-1h6a1 1 0 011 1v6a1 1 0 01-1 1H5a1 1 0 01-1-1v-6zM16 13a1 1 0 011-1h2a1 1 0 011 1v6a1 1 0 01-1 1h-2a1 1 0 01-1-1v-6z\"\n      />\n    </svg>\n  );\n\n  return icons[name] || defaultIcon;\n};\n\nexport default WidgetHeader;\n"],"mappings":"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"}

package/dist/bigconsole/components/widgets/WidgetWrapper.d.ts

@@ -3,6 +3,8 @@ import { Widget } from '../../types';
 import { WidgetAction, ActionContext, ActionResult } from '../../renderers/types/renderer';
 
 export interface WidgetWrapperProps {
+    /** Gallery previews have no persisted widget to comment on or edit. */
+    previewOnly?: boolean;
     /** The widget data */
     widget: Widget;
     /** Widget content to render */

package/dist/bigconsole/components/widgets/WidgetWrapper.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"WidgetWrapper.d.ts","sourceRoot":"","sources":["../../../../src/bigconsole/components/widgets/WidgetWrapper.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;;GAWG;AAEH,OAAO,EACL,KAAK,EAAE,EACP,KAAK,SAAS,EAUf,MAAM,OAAO,CAAC;AACf,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC;AAgC1C,OAAO,KAAK,EAAE,YAAY,EAAE,aAAa,EAAE,YAAY,EAAgB,MAAM,gCAAgC,CAAC;AA8B9G,MAAM,WAAW,kBAAkB;IACjC,sBAAsB;IACtB,MAAM,EAAE,MAAM,CAAC;IACf,+BAA+B;IAC/B,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,0BAA0B;IAC1B,IAAI,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,GAAG,IAAI,CAAC;IACtC,wBAAwB;IACxB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,oCAAoC;IACpC,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,oBAAoB;IACpB,KAAK,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACtB,sCAAsC;IACtC,SAAS,CAAC,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,CAAC;IAChC,wCAAwC;IACxC,WAAW,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,KAAK,IAAI,CAAC;IACxD,2BAA2B;IAC3B,OAAO,CAAC,EAAE,YAAY,EAAE,CAAC;IACzB,uCAAuC;IACvC,QAAQ,CAAC,EAAE,CAAC,MAAM,EAAE,YAAY,EAAE,OAAO,EAAE,aAAa,KAAK,OAAO,CAAC,YAAY,GAAG,IAAI,CAAC,CAAC;IAC1F,4DAA4D;IAC5D,YAAY,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;CACxC;AA6BD,eAAO,MAAM,aAAa,EAAE,EAAE,CAAC,kBAAkB,CAsiChC,CAAC;AAElB,eAAe,aAAa,CAAC"}
+{"version":3,"file":"WidgetWrapper.d.ts","sourceRoot":"","sources":["../../../../src/bigconsole/components/widgets/WidgetWrapper.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;;GAWG;AAEH,OAAO,EACL,KAAK,EAAE,EACP,KAAK,SAAS,EAUf,MAAM,OAAO,CAAC;AACf,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC;AAiC1C,OAAO,KAAK,EAAE,YAAY,EAAE,aAAa,EAAE,YAAY,EAAgB,MAAM,gCAAgC,CAAC;AA8B9G,MAAM,WAAW,kBAAkB;IACjC,uEAAuE;IACvE,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,sBAAsB;IACtB,MAAM,EAAE,MAAM,CAAC;IACf,+BAA+B;IAC/B,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,0BAA0B;IAC1B,IAAI,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,GAAG,IAAI,CAAC;IACtC,wBAAwB;IACxB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,oCAAoC;IACpC,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,oBAAoB;IACpB,KAAK,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACtB,sCAAsC;IACtC,SAAS,CAAC,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,CAAC;IAChC,wCAAwC;IACxC,WAAW,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,KAAK,IAAI,CAAC;IACxD,2BAA2B;IAC3B,OAAO,CAAC,EAAE,YAAY,EAAE,CAAC;IACzB,uCAAuC;IACvC,QAAQ,CAAC,EAAE,CAAC,MAAM,EAAE,YAAY,EAAE,OAAO,EAAE,aAAa,KAAK,OAAO,CAAC,YAAY,GAAG,IAAI,CAAC,CAAC;IAC1F,4DAA4D;IAC5D,YAAY,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;CACxC;AA8BD,eAAO,MAAM,aAAa,EAAE,EAAE,CAAC,kBAAkB,CA8iChC,CAAC;AAElB,eAAe,aAAa,CAAC"}