@burdenoff/microfe-bigconsole 2026.805.2 → 2026.812.1

package/dist/bigconsole/components/datasink/SetupStateBadge.js.map

@@ -1 +1 @@
-{"version":3,"file":"SetupStateBadge.js","names":[],"sources":["../../../../src/bigconsole/components/datasink/SetupStateBadge.tsx"],"sourcesContent":["/**\n * Setup State Badge\n *\n * Badge component showing DataSink setup state.\n */\n\nimport { memo, type ComponentType } from 'react';\nimport type { DataSinkSetupState } from '../../types';\n\n// ============================================================================\n// TYPES\n// ============================================================================\n\ninterface SetupStateBadgeProps {\n  /** Setup state */\n  state: DataSinkSetupState;\n  /** Whether to show abbreviated label */\n  abbreviated?: boolean;\n  /** Badge size */\n  size?: 'sm' | 'md';\n}\n\ninterface StateConfig {\n  label: string;\n  shortLabel: string;\n  bgColor: string;\n  textColor: string;\n  icon: 'pending' | 'running' | 'completed';\n}\n\n// ============================================================================\n// CONSTANTS\n// ============================================================================\n\nconst STATE_CONFIGS: Record<DataSinkSetupState, StateConfig> = {\n  workflow_pending: {\n    label: 'Workflow Pending',\n    shortLabel: 'Draft',\n    bgColor: 'bg-status-warning-bg/10',\n    textColor: 'text-status-warning-text',\n    icon: 'pending',\n  },\n  workflow_running: {\n    label: 'Workflow Running',\n    shortLabel: 'Running',\n    bgColor: 'bg-action-primary-bg/10',\n    textColor: 'text-action-primary-bg',\n    icon: 'running',\n  },\n  workflow_completed: {\n    label: 'Workflow Completed',\n    shortLabel: 'Config Needed',\n    bgColor: 'bg-status-warning-bg/10',\n    textColor: 'text-status-warning-text',\n    icon: 'pending',\n  },\n  configuration_pending: {\n    label: 'Configuration Pending',\n    shortLabel: 'In Progress',\n    bgColor: 'bg-status-warning-bg/10',\n    textColor: 'text-status-warning-text',\n    icon: 'pending',\n  },\n  completed: {\n    label: 'Ready',\n    shortLabel: 'Ready',\n    bgColor: 'bg-status-success-bg/10',\n    textColor: 'text-status-success-text',\n    icon: 'completed',\n  },\n};\n\n// ============================================================================\n// ICONS\n// ============================================================================\n\nconst PendingIcon = ({ className }: { className?: string }) => (\n  <svg className={className} fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\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\nconst RunningIcon = ({ className }: { className?: string }) => (\n  <svg className={`${className} animate-spin`} fill=\"none\" viewBox=\"0 0 24 24\">\n    <circle className=\"opacity-25\" cx=\"12\" cy=\"12\" r=\"10\" stroke=\"currentColor\" strokeWidth=\"4\" />\n    <path\n      className=\"opacity-75\"\n      fill=\"currentColor\"\n      d=\"M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z\"\n    />\n  </svg>\n);\n\nconst CompletedIcon = ({ className }: { className?: string }) => (\n  <svg className={className} fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n    <path strokeLinecap=\"round\" strokeLinejoin=\"round\" strokeWidth={2} d=\"M5 13l4 4L19 7\" />\n  </svg>\n);\n\nconst ICON_MAP: Record<string, ComponentType<{ className?: string }>> = {\n  pending: PendingIcon,\n  running: RunningIcon,\n  completed: CompletedIcon,\n};\n\n// ============================================================================\n// COMPONENT\n// ============================================================================\n\nexport const SetupStateBadge = memo(function SetupStateBadge({\n  state,\n  abbreviated = false,\n  size = 'sm',\n}: SetupStateBadgeProps) {\n  const config = STATE_CONFIGS[state];\n\n  if (!config) {\n    return null;\n  }\n\n  const sizeClasses = {\n    sm: 'px-2 py-0.5 text-xs',\n    md: 'px-2.5 py-1 text-sm',\n  };\n\n  const iconSizes = {\n    sm: 'w-3 h-3',\n    md: 'w-4 h-4',\n  };\n\n  const IconComponent = ICON_MAP[config.icon];\n\n  return (\n    <span\n      className={`\n        inline-flex items-center gap-1\n        font-medium\n        rounded-full\n        ${sizeClasses[size]}\n        ${config.bgColor}\n        ${config.textColor}\n      `}\n    >\n      <IconComponent className={iconSizes[size]} />\n      <span>{abbreviated ? config.shortLabel : config.label}</span>\n    </span>\n  );\n});\n\nexport default SetupStateBadge;\n"],"mappings":";;;AAkCA,IAAM,IAAyD;CAC7D,kBAAkB;EAChB,OAAO;EACP,YAAY;EACZ,SAAS;EACT,WAAW;EACX,MAAM;EACP;CACD,kBAAkB;EAChB,OAAO;EACP,YAAY;EACZ,SAAS;EACT,WAAW;EACX,MAAM;EACP;CACD,oBAAoB;EAClB,OAAO;EACP,YAAY;EACZ,SAAS;EACT,WAAW;EACX,MAAM;EACP;CACD,uBAAuB;EACrB,OAAO;EACP,YAAY;EACZ,SAAS;EACT,WAAW;EACX,MAAM;EACP;CACD,WAAW;EACT,OAAO;EACP,YAAY;EACZ,SAAS;EACT,WAAW;EACX,MAAM;EACP;CACF,EAkCK,IAAkE;CACtE,UA7BmB,EAAE,mBACrB,kBAAC,OAAD;EAAgB;EAAW,MAAK;EAAO,QAAO;EAAe,SAAQ;YACnE,kBAAC,QAAD;GACE,eAAc;GACd,gBAAe;GACf,aAAa;GACb,GAAE;GACF,CAAA;EACE,CAAA;CAsBN,UAnBmB,EAAE,mBACrB,kBAAC,OAAD;EAAK,WAAW,GAAG,EAAU;EAAgB,MAAK;EAAO,SAAQ;YAAjE,CACE,kBAAC,UAAD;GAAQ,WAAU;GAAa,IAAG;GAAK,IAAG;GAAK,GAAE;GAAK,QAAO;GAAe,aAAY;GAAM,CAAA,EAC9F,kBAAC,QAAD;GACE,WAAU;GACV,MAAK;GACL,GAAE;GACF,CAAA,CACE;;CAYN,YATqB,EAAE,mBACvB,kBAAC,OAAD;EAAgB;EAAW,MAAK;EAAO,QAAO;EAAe,SAAQ;YACnE,kBAAC,QAAD;GAAM,eAAc;GAAQ,gBAAe;GAAQ,aAAa;GAAG,GAAE;GAAmB,CAAA;EACpF,CAAA;CAOP,EAMY,IAAkB,EAAK,SAAyB,EAC3D,UACA,iBAAc,IACd,UAAO,QACgB;CACvB,IAAM,IAAS,EAAc;AAE7B,KAAI,CAAC,EACH,QAAO;CAGT,IAAM,IAAc;EAClB,IAAI;EACJ,IAAI;EACL,EAEK,IAAY;EAChB,IAAI;EACJ,IAAI;EACL,EAEK,IAAgB,EAAS,EAAO;AAEtC,QACE,kBAAC,QAAD;EACE,WAAW;;;;UAIP,EAAY,GAAM;UAClB,EAAO,QAAQ;UACf,EAAO,UAAU;;YAPvB,CAUE,kBAAC,GAAD,EAAe,WAAW,EAAU,IAAS,CAAA,EAC7C,kBAAC,QAAD,EAAA,UAAO,IAAc,EAAO,aAAa,EAAO,OAAa,CAAA,CACxD;;EAET"}
+{"version":3,"file":"SetupStateBadge.js","names":[],"sources":["../../../../src/bigconsole/components/datasink/SetupStateBadge.tsx"],"sourcesContent":["/**\n * Setup State Badge\n *\n * Badge component showing DataSink setup state.\n */\n\nimport { memo, type ComponentType } from 'react';\nimport type { DataSinkSetupState } from '../../types';\n\n// ============================================================================\n// TYPES\n// ============================================================================\n\ninterface SetupStateBadgeProps {\n  /** Setup state */\n  state: DataSinkSetupState;\n  /** Whether to show abbreviated label */\n  abbreviated?: boolean;\n  /** Badge size */\n  size?: 'sm' | 'md';\n}\n\ninterface StateConfig {\n  label: string;\n  shortLabel: string;\n  bgColor: string;\n  textColor: string;\n  icon: 'pending' | 'running' | 'completed';\n}\n\n// ============================================================================\n// CONSTANTS\n// ============================================================================\n\nconst STATE_CONFIGS: Record<DataSinkSetupState, StateConfig> = {\n  workflow_pending: {\n    label: 'Workflow Pending',\n    shortLabel: 'Draft',\n    bgColor: 'bg-status-warning-bg/10',\n    textColor: 'text-[var(--color-status-warning-text)]',\n    icon: 'pending',\n  },\n  workflow_running: {\n    label: 'Workflow Running',\n    shortLabel: 'Running',\n    bgColor: 'bg-action-primary-bg/10',\n    textColor: 'text-action-primary-bg',\n    icon: 'running',\n  },\n  workflow_completed: {\n    label: 'Workflow Completed',\n    shortLabel: 'Config Needed',\n    bgColor: 'bg-status-warning-bg/10',\n    textColor: 'text-[var(--color-status-warning-text)]',\n    icon: 'pending',\n  },\n  configuration_pending: {\n    label: 'Configuration Pending',\n    shortLabel: 'In Progress',\n    bgColor: 'bg-status-warning-bg/10',\n    textColor: 'text-[var(--color-status-warning-text)]',\n    icon: 'pending',\n  },\n  completed: {\n    label: 'Ready',\n    shortLabel: 'Ready',\n    bgColor: 'bg-status-success-bg/10',\n    textColor: 'text-status-success-text',\n    icon: 'completed',\n  },\n};\n\n// ============================================================================\n// ICONS\n// ============================================================================\n\nconst PendingIcon = ({ className }: { className?: string }) => (\n  <svg className={className} fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\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\nconst RunningIcon = ({ className }: { className?: string }) => (\n  <svg className={`${className} animate-spin`} fill=\"none\" viewBox=\"0 0 24 24\">\n    <circle className=\"opacity-25\" cx=\"12\" cy=\"12\" r=\"10\" stroke=\"currentColor\" strokeWidth=\"4\" />\n    <path\n      className=\"opacity-75\"\n      fill=\"currentColor\"\n      d=\"M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z\"\n    />\n  </svg>\n);\n\nconst CompletedIcon = ({ className }: { className?: string }) => (\n  <svg className={className} fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n    <path strokeLinecap=\"round\" strokeLinejoin=\"round\" strokeWidth={2} d=\"M5 13l4 4L19 7\" />\n  </svg>\n);\n\nconst ICON_MAP: Record<string, ComponentType<{ className?: string }>> = {\n  pending: PendingIcon,\n  running: RunningIcon,\n  completed: CompletedIcon,\n};\n\n// ============================================================================\n// COMPONENT\n// ============================================================================\n\nexport const SetupStateBadge = memo(function SetupStateBadge({\n  state,\n  abbreviated = false,\n  size = 'sm',\n}: SetupStateBadgeProps) {\n  const config = STATE_CONFIGS[state];\n\n  if (!config) {\n    return null;\n  }\n\n  const sizeClasses = {\n    sm: 'px-2 py-0.5 text-xs',\n    md: 'px-2.5 py-1 text-sm',\n  };\n\n  const iconSizes = {\n    sm: 'w-3 h-3',\n    md: 'w-4 h-4',\n  };\n\n  const IconComponent = ICON_MAP[config.icon];\n\n  return (\n    <span\n      className={`\n        inline-flex items-center gap-1\n        font-medium\n        rounded-full\n        ${sizeClasses[size]}\n        ${config.bgColor}\n        ${config.textColor}\n      `}\n    >\n      <IconComponent className={iconSizes[size]} />\n      <span>{abbreviated ? config.shortLabel : config.label}</span>\n    </span>\n  );\n});\n\nexport default SetupStateBadge;\n"],"mappings":";;;AAkCA,IAAM,IAAyD;CAC7D,kBAAkB;EAChB,OAAO;EACP,YAAY;EACZ,SAAS;EACT,WAAW;EACX,MAAM;EACP;CACD,kBAAkB;EAChB,OAAO;EACP,YAAY;EACZ,SAAS;EACT,WAAW;EACX,MAAM;EACP;CACD,oBAAoB;EAClB,OAAO;EACP,YAAY;EACZ,SAAS;EACT,WAAW;EACX,MAAM;EACP;CACD,uBAAuB;EACrB,OAAO;EACP,YAAY;EACZ,SAAS;EACT,WAAW;EACX,MAAM;EACP;CACD,WAAW;EACT,OAAO;EACP,YAAY;EACZ,SAAS;EACT,WAAW;EACX,MAAM;EACP;CACF,EAkCK,IAAkE;CACtE,UA7BmB,EAAE,mBACrB,kBAAC,OAAD;EAAgB;EAAW,MAAK;EAAO,QAAO;EAAe,SAAQ;YACnE,kBAAC,QAAD;GACE,eAAc;GACd,gBAAe;GACf,aAAa;GACb,GAAE;GACF,CAAA;EACE,CAAA;CAsBN,UAnBmB,EAAE,mBACrB,kBAAC,OAAD;EAAK,WAAW,GAAG,EAAU;EAAgB,MAAK;EAAO,SAAQ;YAAjE,CACE,kBAAC,UAAD;GAAQ,WAAU;GAAa,IAAG;GAAK,IAAG;GAAK,GAAE;GAAK,QAAO;GAAe,aAAY;GAAM,CAAA,EAC9F,kBAAC,QAAD;GACE,WAAU;GACV,MAAK;GACL,GAAE;GACF,CAAA,CACE;;CAYN,YATqB,EAAE,mBACvB,kBAAC,OAAD;EAAgB;EAAW,MAAK;EAAO,QAAO;EAAe,SAAQ;YACnE,kBAAC,QAAD;GAAM,eAAc;GAAQ,gBAAe;GAAQ,aAAa;GAAG,GAAE;GAAmB,CAAA;EACpF,CAAA;CAOP,EAMY,IAAkB,EAAK,SAAyB,EAC3D,UACA,iBAAc,IACd,UAAO,QACgB;CACvB,IAAM,IAAS,EAAc;AAE7B,KAAI,CAAC,EACH,QAAO;CAGT,IAAM,IAAc;EAClB,IAAI;EACJ,IAAI;EACL,EAEK,IAAY;EAChB,IAAI;EACJ,IAAI;EACL,EAEK,IAAgB,EAAS,EAAO;AAEtC,QACE,kBAAC,QAAD;EACE,WAAW;;;;UAIP,EAAY,GAAM;UAClB,EAAO,QAAQ;UACf,EAAO,UAAU;;YAPvB,CAUE,kBAAC,GAAD,EAAe,WAAW,EAAU,IAAS,CAAA,EAC7C,kBAAC,QAAD,EAAA,UAAO,IAAc,EAAO,aAAa,EAAO,OAAa,CAAA,CACxD;;EAET"}

package/dist/bigconsole/components/datasink/WorkflowStatusPanel.js

@@ -1,8 +1,11 @@
-import { memo as e, useMemo as t } from "react";
-import { jsx as n, jsxs as r } from "react/jsx-runtime";
-import { formatDistanceToNow as i } from "date-fns";
+import "../common/sectionStyles.js";
+import { Section as e } from "../common/Section.js";
+import "../common/index.js";
+import { memo as t, useMemo as n } from "react";
+import { jsx as r, jsxs as i } from "react/jsx-runtime";
+import { formatDistanceToNow as a } from "date-fns";
 //#region src/bigconsole/components/datasink/WorkflowStatusPanel.tsx
-function a(e, t) {
+function o(e, t) {
 	return t === "refreshing" || e === "workflow_running" ? {
 		label: "Running",
 		bgColor: "bg-action-primary-bg/10",
@@ -16,7 +19,7 @@ function a(e, t) {
 	} : e === "workflow_pending" ? {
 		label: "Pending",
 		bgColor: "bg-status-warning-bg/10",
-		textColor: "text-status-warning-text",
+		textColor: "text-[var(--color-status-warning-text)]",
 		dotColor: "bg-status-warning-bg"
 	} : {
 		label: "Completed",
@@ -25,139 +28,136 @@ function a(e, t) {
 		dotColor: "bg-status-success-bg"
 	};
 }
-var o = ({ className: e }) => /* @__PURE__ */ n("svg", {
+var s = ({ className: e }) => /* @__PURE__ */ r("svg", {
 	className: e,
 	fill: "none",
 	stroke: "currentColor",
 	viewBox: "0 0 24 24",
-	children: /* @__PURE__ */ n("path", {
+	children: /* @__PURE__ */ r("path", {
 		strokeLinecap: "round",
 		strokeLinejoin: "round",
 		strokeWidth: 1.5,
 		d: "M13 10V3L4 14h7v7l9-11h-7z"
 	})
-}), s = ({ className: e, spinning: t }) => /* @__PURE__ */ n("svg", {
+}), c = ({ className: e, spinning: t }) => /* @__PURE__ */ r("svg", {
 	className: `${e} ${t ? "animate-spin" : ""}`,
 	fill: "none",
 	stroke: "currentColor",
 	viewBox: "0 0 24 24",
-	children: /* @__PURE__ */ n("path", {
+	children: /* @__PURE__ */ r("path", {
 		strokeLinecap: "round",
 		strokeLinejoin: "round",
 		strokeWidth: 2,
 		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"
 	})
-}), c = ({ className: e }) => /* @__PURE__ */ n("svg", {
+}), l = ({ className: e }) => /* @__PURE__ */ r("svg", {
 	className: e,
 	fill: "none",
 	stroke: "currentColor",
 	viewBox: "0 0 24 24",
-	children: /* @__PURE__ */ n("path", {
+	children: /* @__PURE__ */ r("path", {
 		strokeLinecap: "round",
 		strokeLinejoin: "round",
 		strokeWidth: 2,
 		d: "M10 6H6a2 2 0 00-2 2v10a2 2 0 002 2h10a2 2 0 002-2v-4M14 4h6m0 0v6m0-6L10 14"
 	})
-}), l = ({ className: e }) => /* @__PURE__ */ n("svg", {
+}), u = ({ className: e }) => /* @__PURE__ */ r("svg", {
 	className: e,
 	fill: "none",
 	stroke: "currentColor",
 	viewBox: "0 0 24 24",
-	children: /* @__PURE__ */ n("path", {
+	children: /* @__PURE__ */ r("path", {
 		strokeLinecap: "round",
 		strokeLinejoin: "round",
 		strokeWidth: 2,
 		d: "M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-3L13.732 4c-.77-1.333-2.694-1.333-3.464 0L3.34 16c-.77 1.333.192 3 1.732 3z"
 	})
-}), u = e(function({ workflowId: e, executionId: u, lastRefreshedAt: d, setupState: f, status: p, errorMetadata: m, onRerunWorkflow: h, onViewWorkflow: g, disabled: _ = !1, isRerunning: v = !1 }) {
-	let y = t(() => a(f, p), [f, p]), b = p === "refreshing" || f === "workflow_running" || v, x = d ? i(new Date(d), { addSuffix: !0 }) : "Never";
-	return /* @__PURE__ */ r("div", {
-		className: "border border-border-default rounded-lg bg-bg-surface overflow-hidden",
-		children: [/* @__PURE__ */ r("div", {
-			className: "px-4 py-3 border-b border-border-default bg-bg-sunken flex items-center justify-between",
-			children: [/* @__PURE__ */ r("div", {
-				className: "flex items-center gap-2",
-				children: [/* @__PURE__ */ n(o, { className: "w-4 h-4 text-text-secondary" }), /* @__PURE__ */ n("h3", {
-					className: "text-sm font-semibold text-text-primary",
-					children: "FluidGrids Workflow"
-				})]
-			}), /* @__PURE__ */ r("div", {
-				className: `flex items-center gap-1.5 px-2 py-0.5 rounded-full ${y.bgColor}`,
-				children: [/* @__PURE__ */ n("span", { className: `w-1.5 h-1.5 rounded-full ${y.dotColor} ${b ? "animate-pulse" : ""}` }), /* @__PURE__ */ n("span", {
-					className: `text-xs font-medium ${y.textColor}`,
-					children: y.label
-				})]
+}), d = t(function({ workflowId: t, executionId: d, lastRefreshedAt: f, setupState: p, status: m, errorMetadata: h, onRerunWorkflow: g, onViewWorkflow: _, disabled: v = !1, isRerunning: y = !1 }) {
+	let b = n(() => o(p, m), [p, m]), x = m === "refreshing" || p === "workflow_running" || y, S = f ? a(new Date(f), { addSuffix: !0 }) : "Never";
+	return /* @__PURE__ */ i(e, {
+		headingLevel: 2,
+		title: "FluidGrids workflow",
+		description: "The workflow that populates this sink, and how its last run went.",
+		icon: /* @__PURE__ */ r(s, { className: "h-icon-sm w-icon-sm" }),
+		meta: /* @__PURE__ */ i("span", {
+			className: `flex items-center gap-1.5 rounded-pill px-2 py-0.5 ${b.bgColor}`,
+			children: [/* @__PURE__ */ r("span", { className: `h-1.5 w-1.5 rounded-pill ${b.dotColor} ${x ? "animate-pulse" : ""}` }), /* @__PURE__ */ r("span", {
+				className: `text-xs font-medium ${b.textColor}`,
+				children: b.label
 			})]
-		}), /* @__PURE__ */ r("div", {
-			className: "p-4 space-y-4",
-			children: [
-				/* @__PURE__ */ r("div", {
-					className: "grid grid-cols-2 gap-4 text-sm",
-					children: [
-						/* @__PURE__ */ r("div", { children: [/* @__PURE__ */ n("p", {
-							className: "text-text-secondary text-xs mb-1",
+		}),
+		bodyClassName: "space-y-form-gap",
+		children: [
+			/* @__PURE__ */ i("div", {
+				className: "grid grid-cols-1 gap-form-gap text-sm sm:grid-cols-2",
+				children: [
+					/* @__PURE__ */ i("div", {
+						className: "min-w-0",
+						children: [/* @__PURE__ */ r("p", {
+							className: "mb-1 text-xs text-text-secondary",
 							children: "Workflow ID"
-						}), /* @__PURE__ */ n("p", {
-							className: "text-text-primary font-mono text-xs truncate",
-							title: e,
-							children: e || "Not linked"
-						})] }),
-						/* @__PURE__ */ r("div", { children: [/* @__PURE__ */ n("p", {
-							className: "text-text-secondary text-xs mb-1",
-							children: "Last Execution"
-						}), /* @__PURE__ */ n("p", {
-							className: "text-text-primary text-xs",
-							children: x
-						})] }),
-						u && /* @__PURE__ */ r("div", {
-							className: "col-span-2",
-							children: [/* @__PURE__ */ n("p", {
-								className: "text-text-secondary text-xs mb-1",
-								children: "Execution ID"
-							}), /* @__PURE__ */ n("p", {
-								className: "text-text-primary font-mono text-xs truncate",
-								title: u,
-								children: u
-							})]
-						})
-					]
-				}),
-				p === "error" && m && /* @__PURE__ */ r("div", {
-					className: "flex items-start gap-2 p-3 bg-status-error-bg/10 rounded-md",
-					children: [/* @__PURE__ */ n(l, { className: "w-4 h-4 text-status-error-text flex-shrink-0 mt-0.5" }), /* @__PURE__ */ r("div", {
+						}), /* @__PURE__ */ r("p", {
+							className: "break-all font-mono text-xs text-text-primary",
+							title: t,
+							children: t || "Not linked"
+						})]
+					}),
+					/* @__PURE__ */ i("div", {
 						className: "min-w-0",
-						children: [m.code && /* @__PURE__ */ n("p", {
-							className: "text-xs font-medium text-status-error-text",
-							children: m.code
-						}), /* @__PURE__ */ n("p", {
-							className: "text-xs text-status-error-text/80 mt-0.5",
-							children: m.message || "An error occurred during workflow execution"
+						children: [/* @__PURE__ */ r("p", {
+							className: "mb-1 text-xs text-text-secondary",
+							children: "Last execution"
+						}), /* @__PURE__ */ r("p", {
+							className: "text-xs text-text-primary",
+							children: S
+						})]
+					}),
+					d && /* @__PURE__ */ i("div", {
+						className: "min-w-0 sm:col-span-2",
+						children: [/* @__PURE__ */ r("p", {
+							className: "mb-1 text-xs text-text-secondary",
+							children: "Execution ID"
+						}), /* @__PURE__ */ r("p", {
+							className: "break-all font-mono text-xs text-text-primary",
+							title: d,
+							children: d
 						})]
-					})]
-				}),
-				/* @__PURE__ */ r("div", {
-					className: "flex items-center gap-2 pt-2 border-t border-border-muted",
-					children: [h && /* @__PURE__ */ r("button", {
-						type: "button",
-						onClick: h,
-						disabled: _ || b,
-						className: "\n                flex items-center gap-1.5\n                px-3 py-1.5\n                text-xs font-medium\n                bg-action-primary-bg\n                text-action-primary-fg\n                rounded-md\n                hover:bg-action-primary-bgHover\n                disabled:opacity-50\n                disabled:cursor-not-allowed\n                transition-colors\n              ",
-						children: [/* @__PURE__ */ n(s, {
-							className: "w-3.5 h-3.5",
-							spinning: b
-						}), b ? "Running..." : "Re-run Workflow"]
-					}), g && /* @__PURE__ */ r("button", {
-						type: "button",
-						onClick: g,
-						className: "\n                flex items-center gap-1.5\n                px-3 py-1.5\n                text-xs font-medium\n                text-text-secondary\n                rounded-md\n                hover:bg-bg-sunken\n                transition-colors\n              ",
-						children: [/* @__PURE__ */ n(c, { className: "w-3.5 h-3.5" }), "View in FluidGrids"]
-					})]
+					})
+				]
+			}),
+			m === "error" && h && /* @__PURE__ */ r(e, {
+				tone: "danger",
+				padding: "compact",
+				headingLevel: 3,
+				title: h.code || "Last run failed",
+				icon: /* @__PURE__ */ r(u, { className: "h-icon-sm w-icon-sm" }),
+				children: /* @__PURE__ */ r("p", {
+					className: "text-xs text-[var(--color-status-error-text)]",
+					children: h.message || "An error occurred during workflow execution"
 				})
-			]
-		})]
+			}),
+			/* @__PURE__ */ i("div", {
+				className: "flex flex-wrap items-center gap-control-gap border-t border-[var(--color-border-subtle)] pt-form-gap",
+				children: [g && /* @__PURE__ */ i("button", {
+					type: "button",
+					onClick: g,
+					disabled: v || x,
+					className: "flex min-h-[var(--size-controlHeight-md)] items-center gap-1.5 rounded-button bg-action-primary-bg px-3 py-1.5 text-xs font-medium text-action-primary-text hover:bg-action-primary-bgHover disabled:cursor-not-allowed disabled:opacity-50 motion-safe:transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-bg-surface",
+					children: [/* @__PURE__ */ r(c, {
+						className: "h-3.5 w-3.5",
+						spinning: x
+					}), x ? "Running..." : "Re-run workflow"]
+				}), _ && /* @__PURE__ */ i("button", {
+					type: "button",
+					onClick: _,
+					className: "flex min-h-[var(--size-controlHeight-md)] items-center gap-1.5 rounded-button px-3 py-1.5 text-xs font-medium text-text-secondary hover:bg-bg-sunken motion-safe:transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-bg-surface",
+					children: [/* @__PURE__ */ r(l, { className: "h-3.5 w-3.5" }), "View in FluidGrids"]
+				})]
+			})
+		]
 	});
 });
 //#endregion
-export { u as default };
+export { d as default };
 
 //# sourceMappingURL=WorkflowStatusPanel.js.map

package/dist/bigconsole/components/datasink/WorkflowStatusPanel.js.map

@@ -1 +1 @@
-{"version":3,"file":"WorkflowStatusPanel.js","names":[],"sources":["../../../../src/bigconsole/components/datasink/WorkflowStatusPanel.tsx"],"sourcesContent":["/**\n * Workflow Status Panel\n *\n * Panel showing FluidGrids workflow status and execution details.\n */\n\nimport { memo, useMemo } from 'react';\nimport { formatDistanceToNow } from 'date-fns';\nimport type { DataSinkSetupState, DataSinkStatus } from '../../types';\n\n// ============================================================================\n// TYPES\n// ============================================================================\n\ninterface WorkflowStatusPanelProps {\n  /** Workflow ID */\n  workflowId?: string;\n  /** Execution ID */\n  executionId?: string;\n  /** Last refreshed timestamp */\n  lastRefreshedAt?: string;\n  /** Setup state */\n  setupState?: DataSinkSetupState;\n  /** DataSink status */\n  status?: DataSinkStatus;\n  /** Error metadata */\n  errorMetadata?: {\n    code?: string;\n    message?: string;\n  };\n  /** Callback to re-run workflow */\n  onRerunWorkflow?: () => void;\n  /** Callback to view workflow */\n  onViewWorkflow?: () => void;\n  /** Whether controls are disabled */\n  disabled?: boolean;\n  /** Whether re-run is in progress */\n  isRerunning?: boolean;\n}\n\ninterface StatusConfig {\n  label: string;\n  bgColor: string;\n  textColor: string;\n  dotColor: string;\n}\n\n// ============================================================================\n// HELPERS\n// ============================================================================\n\n/**\n * Get status display configuration\n */\nfunction getStatusConfig(setupState?: DataSinkSetupState, status?: DataSinkStatus): StatusConfig {\n  if (status === 'refreshing' || setupState === 'workflow_running') {\n    return {\n      label: 'Running',\n      bgColor: 'bg-action-primary-bg/10',\n      textColor: 'text-action-primary-bg',\n      dotColor: 'bg-action-primary-bg',\n    };\n  }\n  if (status === 'error') {\n    return {\n      label: 'Failed',\n      bgColor: 'bg-status-error-bg/10',\n      textColor: 'text-status-error-text',\n      dotColor: 'bg-status-error-bg',\n    };\n  }\n  if (setupState === 'workflow_pending') {\n    return {\n      label: 'Pending',\n      bgColor: 'bg-status-warning-bg/10',\n      textColor: 'text-status-warning-text',\n      dotColor: 'bg-status-warning-bg',\n    };\n  }\n  return {\n    label: 'Completed',\n    bgColor: 'bg-status-success-bg/10',\n    textColor: 'text-status-success-text',\n    dotColor: 'bg-status-success-bg',\n  };\n}\n\n// ============================================================================\n// ICONS\n// ============================================================================\n\nconst WorkflowIcon = ({ className }: { className?: string }) => (\n  <svg className={className} fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n    <path strokeLinecap=\"round\" strokeLinejoin=\"round\" strokeWidth={1.5} d=\"M13 10V3L4 14h7v7l9-11h-7z\" />\n  </svg>\n);\n\nconst RefreshIcon = ({ className, spinning }: { className?: string; spinning?: boolean }) => (\n  <svg\n    className={`${className} ${spinning ? 'animate-spin' : ''}`}\n    fill=\"none\"\n    stroke=\"currentColor\"\n    viewBox=\"0 0 24 24\"\n  >\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);\n\nconst ExternalLinkIcon = ({ className }: { className?: string }) => (\n  <svg className={className} 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);\n\nconst AlertIcon = ({ className }: { className?: string }) => (\n  <svg className={className} fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n    <path\n      strokeLinecap=\"round\"\n      strokeLinejoin=\"round\"\n      strokeWidth={2}\n      d=\"M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-3L13.732 4c-.77-1.333-2.694-1.333-3.464 0L3.34 16c-.77 1.333.192 3 1.732 3z\"\n    />\n  </svg>\n);\n\n// ============================================================================\n// COMPONENT\n// ============================================================================\n\nexport const WorkflowStatusPanel = memo(function WorkflowStatusPanel({\n  workflowId,\n  executionId,\n  lastRefreshedAt,\n  setupState,\n  status,\n  errorMetadata,\n  onRerunWorkflow,\n  onViewWorkflow,\n  disabled = false,\n  isRerunning = false,\n}: WorkflowStatusPanelProps) {\n  // Get status config\n  const statusConfig = useMemo(() => getStatusConfig(setupState, status), [setupState, status]);\n\n  const isRunning = status === 'refreshing' || setupState === 'workflow_running' || isRerunning;\n\n  const lastRefreshedText = lastRefreshedAt\n    ? formatDistanceToNow(new Date(lastRefreshedAt), { addSuffix: true })\n    : 'Never';\n\n  return (\n    <div className=\"border border-border-default rounded-lg bg-bg-surface overflow-hidden\">\n      {/* Header */}\n      <div className=\"px-4 py-3 border-b border-border-default bg-bg-sunken flex items-center justify-between\">\n        <div className=\"flex items-center gap-2\">\n          <WorkflowIcon className=\"w-4 h-4 text-text-secondary\" />\n          <h3 className=\"text-sm font-semibold text-text-primary\">FluidGrids Workflow</h3>\n        </div>\n        <div className={`flex items-center gap-1.5 px-2 py-0.5 rounded-full ${statusConfig.bgColor}`}>\n          <span className={`w-1.5 h-1.5 rounded-full ${statusConfig.dotColor} ${isRunning ? 'animate-pulse' : ''}`} />\n          <span className={`text-xs font-medium ${statusConfig.textColor}`}>{statusConfig.label}</span>\n        </div>\n      </div>\n\n      {/* Content */}\n      <div className=\"p-4 space-y-4\">\n        {/* Details grid */}\n        <div className=\"grid grid-cols-2 gap-4 text-sm\">\n          <div>\n            <p className=\"text-text-secondary text-xs mb-1\">Workflow ID</p>\n            <p className=\"text-text-primary font-mono text-xs truncate\" title={workflowId}>\n              {workflowId || 'Not linked'}\n            </p>\n          </div>\n          <div>\n            <p className=\"text-text-secondary text-xs mb-1\">Last Execution</p>\n            <p className=\"text-text-primary text-xs\">{lastRefreshedText}</p>\n          </div>\n          {executionId && (\n            <div className=\"col-span-2\">\n              <p className=\"text-text-secondary text-xs mb-1\">Execution ID</p>\n              <p className=\"text-text-primary font-mono text-xs truncate\" title={executionId}>\n                {executionId}\n              </p>\n            </div>\n          )}\n        </div>\n\n        {/* Error display */}\n        {status === 'error' && errorMetadata && (\n          <div className=\"flex items-start gap-2 p-3 bg-status-error-bg/10 rounded-md\">\n            <AlertIcon className=\"w-4 h-4 text-status-error-text flex-shrink-0 mt-0.5\" />\n            <div className=\"min-w-0\">\n              {errorMetadata.code && <p className=\"text-xs font-medium text-status-error-text\">{errorMetadata.code}</p>}\n              <p className=\"text-xs text-status-error-text/80 mt-0.5\">\n                {errorMetadata.message || 'An error occurred during workflow execution'}\n              </p>\n            </div>\n          </div>\n        )}\n\n        {/* Actions */}\n        <div className=\"flex items-center gap-2 pt-2 border-t border-border-muted\">\n          {onRerunWorkflow && (\n            <button\n              type=\"button\"\n              onClick={onRerunWorkflow}\n              disabled={disabled || isRunning}\n              className={`\n                flex items-center gap-1.5\n                px-3 py-1.5\n                text-xs font-medium\n                bg-action-primary-bg\n                text-action-primary-fg\n                rounded-md\n                hover:bg-action-primary-bgHover\n                disabled:opacity-50\n                disabled:cursor-not-allowed\n                transition-colors\n              `}\n            >\n              <RefreshIcon className=\"w-3.5 h-3.5\" spinning={isRunning} />\n              {isRunning ? 'Running...' : 'Re-run Workflow'}\n            </button>\n          )}\n          {onViewWorkflow && (\n            <button\n              type=\"button\"\n              onClick={onViewWorkflow}\n              className={`\n                flex items-center gap-1.5\n                px-3 py-1.5\n                text-xs font-medium\n                text-text-secondary\n                rounded-md\n                hover:bg-bg-sunken\n                transition-colors\n              `}\n            >\n              <ExternalLinkIcon className=\"w-3.5 h-3.5\" />\n              View in FluidGrids\n            </button>\n          )}\n        </div>\n      </div>\n    </div>\n  );\n});\n\nexport default WorkflowStatusPanel;\n"],"mappings":"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"}
+{"version":3,"file":"WorkflowStatusPanel.js","names":[],"sources":["../../../../src/bigconsole/components/datasink/WorkflowStatusPanel.tsx"],"sourcesContent":["/**\n * Workflow Status Panel\n *\n * Panel showing FluidGrids workflow status and execution details.\n */\n\nimport { memo, useMemo } from 'react';\nimport { formatDistanceToNow } from 'date-fns';\nimport { Section, SECTION_FOCUS_RING } from '../common';\nimport type { DataSinkSetupState, DataSinkStatus } from '../../types';\n\n// ============================================================================\n// TYPES\n// ============================================================================\n\ninterface WorkflowStatusPanelProps {\n  /** Workflow ID */\n  workflowId?: string;\n  /** Execution ID */\n  executionId?: string;\n  /** Last refreshed timestamp */\n  lastRefreshedAt?: string;\n  /** Setup state */\n  setupState?: DataSinkSetupState;\n  /** DataSink status */\n  status?: DataSinkStatus;\n  /** Error metadata */\n  errorMetadata?: {\n    code?: string;\n    message?: string;\n  };\n  /** Callback to re-run workflow */\n  onRerunWorkflow?: () => void;\n  /** Callback to view workflow */\n  onViewWorkflow?: () => void;\n  /** Whether controls are disabled */\n  disabled?: boolean;\n  /** Whether re-run is in progress */\n  isRerunning?: boolean;\n}\n\ninterface StatusConfig {\n  label: string;\n  bgColor: string;\n  textColor: string;\n  dotColor: string;\n}\n\n// ============================================================================\n// HELPERS\n// ============================================================================\n\n/**\n * Get status display configuration\n */\nfunction getStatusConfig(setupState?: DataSinkSetupState, status?: DataSinkStatus): StatusConfig {\n  if (status === 'refreshing' || setupState === 'workflow_running') {\n    return {\n      label: 'Running',\n      bgColor: 'bg-action-primary-bg/10',\n      textColor: 'text-action-primary-bg',\n      dotColor: 'bg-action-primary-bg',\n    };\n  }\n  if (status === 'error') {\n    return {\n      label: 'Failed',\n      bgColor: 'bg-status-error-bg/10',\n      textColor: 'text-status-error-text',\n      dotColor: 'bg-status-error-bg',\n    };\n  }\n  if (setupState === 'workflow_pending') {\n    return {\n      label: 'Pending',\n      bgColor: 'bg-status-warning-bg/10',\n      textColor: 'text-[var(--color-status-warning-text)]',\n      dotColor: 'bg-status-warning-bg',\n    };\n  }\n  return {\n    label: 'Completed',\n    bgColor: 'bg-status-success-bg/10',\n    textColor: 'text-status-success-text',\n    dotColor: 'bg-status-success-bg',\n  };\n}\n\n// ============================================================================\n// ICONS\n// ============================================================================\n\nconst WorkflowIcon = ({ className }: { className?: string }) => (\n  <svg className={className} fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n    <path strokeLinecap=\"round\" strokeLinejoin=\"round\" strokeWidth={1.5} d=\"M13 10V3L4 14h7v7l9-11h-7z\" />\n  </svg>\n);\n\nconst RefreshIcon = ({ className, spinning }: { className?: string; spinning?: boolean }) => (\n  <svg\n    className={`${className} ${spinning ? 'animate-spin' : ''}`}\n    fill=\"none\"\n    stroke=\"currentColor\"\n    viewBox=\"0 0 24 24\"\n  >\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);\n\nconst ExternalLinkIcon = ({ className }: { className?: string }) => (\n  <svg className={className} 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);\n\nconst AlertIcon = ({ className }: { className?: string }) => (\n  <svg className={className} fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n    <path\n      strokeLinecap=\"round\"\n      strokeLinejoin=\"round\"\n      strokeWidth={2}\n      d=\"M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-3L13.732 4c-.77-1.333-2.694-1.333-3.464 0L3.34 16c-.77 1.333.192 3 1.732 3z\"\n    />\n  </svg>\n);\n\n// ============================================================================\n// COMPONENT\n// ============================================================================\n\nexport const WorkflowStatusPanel = memo(function WorkflowStatusPanel({\n  workflowId,\n  executionId,\n  lastRefreshedAt,\n  setupState,\n  status,\n  errorMetadata,\n  onRerunWorkflow,\n  onViewWorkflow,\n  disabled = false,\n  isRerunning = false,\n}: WorkflowStatusPanelProps) {\n  // Get status config\n  const statusConfig = useMemo(() => getStatusConfig(setupState, status), [setupState, status]);\n\n  const isRunning = status === 'refreshing' || setupState === 'workflow_running' || isRerunning;\n\n  const lastRefreshedText = lastRefreshedAt\n    ? formatDistanceToNow(new Date(lastRefreshedAt), { addSuffix: true })\n    : 'Never';\n\n  return (\n    <Section\n      // Peer of the detail page's other level-2 panels (Details, Linked\n      // workflows, Linked parsers) — they must share a heading level or the\n      // outline implies this panel is nested inside the one before it.\n      headingLevel={2}\n      title=\"FluidGrids workflow\"\n      description=\"The workflow that populates this sink, and how its last run went.\"\n      icon={<WorkflowIcon className=\"h-icon-sm w-icon-sm\" />}\n      meta={\n        <span className={`flex items-center gap-1.5 rounded-pill px-2 py-0.5 ${statusConfig.bgColor}`}>\n          <span className={`h-1.5 w-1.5 rounded-pill ${statusConfig.dotColor} ${isRunning ? 'animate-pulse' : ''}`} />\n          <span className={`text-xs font-medium ${statusConfig.textColor}`}>{statusConfig.label}</span>\n        </span>\n      }\n      bodyClassName=\"space-y-form-gap\"\n    >\n      {/* Identifiers — supporting reference detail, so it steps down to `muted`. */}\n      <div className=\"grid grid-cols-1 gap-form-gap text-sm sm:grid-cols-2\">\n        <div className=\"min-w-0\">\n          <p className=\"mb-1 text-xs text-text-secondary\">Workflow ID</p>\n          <p className=\"break-all font-mono text-xs text-text-primary\" title={workflowId}>\n            {workflowId || 'Not linked'}\n          </p>\n        </div>\n        <div className=\"min-w-0\">\n          <p className=\"mb-1 text-xs text-text-secondary\">Last execution</p>\n          <p className=\"text-xs text-text-primary\">{lastRefreshedText}</p>\n        </div>\n        {executionId && (\n          <div className=\"min-w-0 sm:col-span-2\">\n            <p className=\"mb-1 text-xs text-text-secondary\">Execution ID</p>\n            <p className=\"break-all font-mono text-xs text-text-primary\" title={executionId}>\n              {executionId}\n            </p>\n          </div>\n        )}\n      </div>\n\n      {/* Error display — a real status section rather than a hand-rolled tint. */}\n      {status === 'error' && errorMetadata && (\n        <Section\n          tone=\"danger\"\n          padding=\"compact\"\n          headingLevel={3}\n          title={errorMetadata.code || 'Last run failed'}\n          icon={<AlertIcon className=\"h-icon-sm w-icon-sm\" />}\n        >\n          <p className=\"text-xs text-[var(--color-status-error-text)]\">\n            {errorMetadata.message || 'An error occurred during workflow execution'}\n          </p>\n        </Section>\n      )}\n\n      {/* Actions */}\n      <div className=\"flex flex-wrap items-center gap-control-gap border-t border-[var(--color-border-subtle)] pt-form-gap\">\n        {onRerunWorkflow && (\n          <button\n            type=\"button\"\n            onClick={onRerunWorkflow}\n            disabled={disabled || isRunning}\n            className={`flex min-h-[var(--size-controlHeight-md)] items-center gap-1.5 rounded-button bg-action-primary-bg px-3 py-1.5 text-xs font-medium text-action-primary-text hover:bg-action-primary-bgHover disabled:cursor-not-allowed disabled:opacity-50 motion-safe:transition-colors ${SECTION_FOCUS_RING}`}\n          >\n            <RefreshIcon className=\"h-3.5 w-3.5\" spinning={isRunning} />\n            {isRunning ? 'Running...' : 'Re-run workflow'}\n          </button>\n        )}\n        {onViewWorkflow && (\n          <button\n            type=\"button\"\n            onClick={onViewWorkflow}\n            className={`flex min-h-[var(--size-controlHeight-md)] items-center gap-1.5 rounded-button px-3 py-1.5 text-xs font-medium text-text-secondary hover:bg-bg-sunken motion-safe:transition-colors ${SECTION_FOCUS_RING}`}\n          >\n            <ExternalLinkIcon className=\"h-3.5 w-3.5\" />\n            View in FluidGrids\n          </button>\n        )}\n      </div>\n    </Section>\n  );\n});\n\nexport default WorkflowStatusPanel;\n"],"mappings":"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"}