@particle-academy/fancy-flow 0.26.0 → 0.27.1

package/dist/index.d.cts

@@ -538,10 +538,19 @@ declare function FlowRunControls({ running, onRun, onCancel, onReset, className,
 
 type FlowRunFeedProps = {
     entries: FlowRunFeedEntry[];
+    /** Show the header bar (title + running badge + event count). Default true. */
+    showHeader?: boolean;
+    /** Header title. Default "Run feed". */
+    title?: string;
+    /** When true, a "running" badge shows in the header. */
+    running?: boolean;
     className?: string;
     style?: CSSProperties;
 };
-/** FlowRunFeed — scrolling log panel. Auto-scrolls to bottom on new entries. */
-declare function FlowRunFeed({ entries, className, style }: FlowRunFeedProps): react.JSX.Element;
+/**
+ * FlowRunFeed — scrolling run log with a header (title + live event count).
+ * Auto-scrolls its body to the bottom on new entries.
+ */
+declare function FlowRunFeed({ entries, showHeader, title, running, className, style }: FlowRunFeedProps): react.JSX.Element;
 
 export { ActionNode, type AlignEdge, AutoLayoutOptions, ConfigField, ConfigFieldRenderer, type ConfigFieldRendererProps, ConnectionValidatorOptions, DecisionNode, ExecutorRegistry, FlowCanvas, type FlowCanvasProps, FlowEditor, type FlowEditorAction, type FlowEditorApi, type FlowEditorBuiltins, type FlowEditorProps, type FlowEditorSlots, FlowGraph, FlowNode, type FlowNodeRenderProps, FlowRunControls, type FlowRunControlsProps, FlowRunFeed, FlowRunFeedEntry, type FlowRunFeedProps, LaneNode, NodeCategory, NodeConfigPanel, type NodeConfigPanelProps, NodeKindDefinition, NodePalette, type NodePaletteProps, NodePort, type NodePortProps, type NodePortSide, type NodePortType, NodeRunStatus, NodeShell, type NodeShellProps, NoteNode, OutputNode, SubgraphNode, TriggerNode, WorkflowMetadata, WorkflowSchema, alignNodes, cloneSubgraph, defaultNodeTypes, defineNode, distributeNodes, paletteDropHandlers, reconnectEdge, useFlowEditor, useFlowEditorOptional };

package/dist/index.d.ts

@@ -538,10 +538,19 @@ declare function FlowRunControls({ running, onRun, onCancel, onReset, className,
 
 type FlowRunFeedProps = {
     entries: FlowRunFeedEntry[];
+    /** Show the header bar (title + running badge + event count). Default true. */
+    showHeader?: boolean;
+    /** Header title. Default "Run feed". */
+    title?: string;
+    /** When true, a "running" badge shows in the header. */
+    running?: boolean;
     className?: string;
     style?: CSSProperties;
 };
-/** FlowRunFeed — scrolling log panel. Auto-scrolls to bottom on new entries. */
-declare function FlowRunFeed({ entries, className, style }: FlowRunFeedProps): react.JSX.Element;
+/**
+ * FlowRunFeed — scrolling run log with a header (title + live event count).
+ * Auto-scrolls its body to the bottom on new entries.
+ */
+declare function FlowRunFeed({ entries, showHeader, title, running, className, style }: FlowRunFeedProps): react.JSX.Element;
 
 export { ActionNode, type AlignEdge, AutoLayoutOptions, ConfigField, ConfigFieldRenderer, type ConfigFieldRendererProps, ConnectionValidatorOptions, DecisionNode, ExecutorRegistry, FlowCanvas, type FlowCanvasProps, FlowEditor, type FlowEditorAction, type FlowEditorApi, type FlowEditorBuiltins, type FlowEditorProps, type FlowEditorSlots, FlowGraph, FlowNode, type FlowNodeRenderProps, FlowRunControls, type FlowRunControlsProps, FlowRunFeed, FlowRunFeedEntry, type FlowRunFeedProps, LaneNode, NodeCategory, NodeConfigPanel, type NodeConfigPanelProps, NodeKindDefinition, NodePalette, type NodePaletteProps, NodePort, type NodePortProps, type NodePortSide, type NodePortType, NodeRunStatus, NodeShell, type NodeShellProps, NoteNode, OutputNode, SubgraphNode, TriggerNode, WorkflowMetadata, WorkflowSchema, alignNodes, cloneSubgraph, defaultNodeTypes, defineNode, distributeNodes, paletteDropHandlers, reconnectEdge, useFlowEditor, useFlowEditorOptional };

package/dist/index.js

@@ -1,11 +1,11 @@
-import { useFlowState, useFlowRun, useFlowHistory, applyOutputsToNodes, applyStatusesToNodes } from './chunk-OFW7GN3Y.js';
-export { applyOutputsToNodes, applyStatusesToNodes, createHistory, useFlowHistory, useFlowRun, useFlowState } from './chunk-OFW7GN3Y.js';
-import { buildNodeTypes, FlowEditorProvider, registerBuiltinKinds, NoteNode, createConnectionValidator } from './chunk-YOFCVO2W.js';
-export { ANY_PORT_TYPE, BUILTIN_KINDS, LaneNode, NoteNode, RegistryNode, buildNodeTypes, createConnectionValidator, defaultPortCompatibility, registerBuiltinKinds, useFlowEditor, useFlowEditorOptional } from './chunk-YOFCVO2W.js';
+import { useFlowState, useFlowRun, useFlowHistory, applyOutputsToNodes, applyStatusesToNodes } from './chunk-HHFOHHAQ.js';
+export { applyOutputsToNodes, applyStatusesToNodes, createHistory, useFlowHistory, useFlowRun, useFlowState } from './chunk-HHFOHHAQ.js';
+import { buildNodeTypes, FlowEditorProvider, registerBuiltinKinds, NoteNode, createConnectionValidator } from './chunk-THU5LW22.js';
+export { ANY_PORT_TYPE, BUILTIN_KINDS, LaneNode, NoteNode, RegistryNode, buildNodeTypes, createConnectionValidator, defaultPortCompatibility, registerBuiltinKinds, useFlowEditor, useFlowEditorOptional } from './chunk-THU5LW22.js';
 import { ReactFlowProvider, useReactFlow, addEdge, applyEdgeChanges, applyNodeChanges, Position, Handle, reconnectEdge, index, BackgroundVariant, Background, Controls, MiniMap, ViewportPortal } from './chunk-OWENS2H5.js';
 export { LEGACY_PAUSE_PREFIXES, PAUSE_PREFIX, decodePause, encodePause, isPause, pauseForHuman } from './chunk-UEOE6B52.js';
 import './chunk-USL4FMFU.js';
-export { runFlow } from './chunk-U2VJB7HR.js';
+export { runFlow } from './chunk-RE7T5GKQ.js';
 import { workflowToBlob, importWorkflow, exportWorkflow } from './chunk-N5ICD2WZ.js';
 export { WORKFLOW_SCHEMA_URL, WORKFLOW_SCHEMA_VERSION, exportWorkflow, importWorkflow, migrateSchema, workflowToBlob } from './chunk-N5ICD2WZ.js';
 export { resolveNodePorts, resolvePortSpec } from './chunk-TITD5W4Y.js';
@@ -969,9 +969,13 @@ function NodeConfigPanel({
   return /* @__PURE__ */ jsxs("aside", { className: ["ff-panel", className ?? ""].filter(Boolean).join(" "), style, children: [
     header,
     /* @__PURE__ */ jsxs("header", { className: "ff-panel__header", children: [
-      /* @__PURE__ */ jsx("span", { className: "ff-panel__kind-tag", children: kind.label }),
-      kind.description && /* @__PURE__ */ jsx("p", { className: "ff-panel__kind-desc", children: kind.description })
+      /* @__PURE__ */ jsx("span", { className: "ff-panel__head-icon", style: { background: kind.accent ?? categoryAccent(kind.category) }, "aria-hidden": true, children: kind.icon }),
+      /* @__PURE__ */ jsxs("span", { className: "ff-panel__head-text", children: [
+        /* @__PURE__ */ jsx("span", { className: "ff-panel__head-kind", children: kind.label }),
+        /* @__PURE__ */ jsx("span", { className: "ff-panel__head-name", children: node.data.label || kind.label })
+      ] })
     ] }),
+    kind.description && /* @__PURE__ */ jsx("p", { className: "ff-panel__kind-desc", children: kind.description }),
     /* @__PURE__ */ jsxs("div", { className: "ff-panel__field", children: [
       /* @__PURE__ */ jsx("label", { className: "ff-panel__label", children: "Label" }),
       /* @__PURE__ */ jsx(
@@ -1046,17 +1050,29 @@ function FlowRunControls({ running, onRun, onCancel, onReset, className, style }
     onReset && /* @__PURE__ */ jsx("button", { type: "button", className: "ff-run-controls__btn ff-run-controls__btn--reset", onClick: onReset, disabled: running, children: "Reset" })
   ] });
 }
-function FlowRunFeed({ entries, className, style }) {
+function FlowRunFeed({ entries, showHeader = true, title = "Run feed", running, className, style }) {
   const scrollRef = useRef(null);
   useEffect(() => {
     const el = scrollRef.current;
     if (el) el.scrollTop = el.scrollHeight;
   }, [entries.length]);
-  return /* @__PURE__ */ jsx("div", { className: ["ff-run-feed", className ?? ""].filter(Boolean).join(" "), style, ref: scrollRef, children: entries.length === 0 ? /* @__PURE__ */ jsx("p", { className: "ff-run-feed__empty", children: "No run events yet." }) : entries.map((e) => /* @__PURE__ */ jsxs("div", { className: `ff-run-feed__row ff-run-feed__row--${e.level}`, children: [
-    /* @__PURE__ */ jsx("span", { className: "ff-run-feed__time", children: formatTime(e.at) }),
-    e.nodeId && /* @__PURE__ */ jsx("span", { className: "ff-run-feed__node", children: e.nodeId }),
-    /* @__PURE__ */ jsx("span", { className: "ff-run-feed__text", children: e.text })
-  ] }, e.id)) });
+  return /* @__PURE__ */ jsxs("div", { className: ["ff-run-feed", className ?? ""].filter(Boolean).join(" "), style, children: [
+    showHeader && /* @__PURE__ */ jsxs("div", { className: "ff-run-feed__header", children: [
+      /* @__PURE__ */ jsx("span", { className: "ff-run-feed__title", "aria-hidden": true, children: "\u25B8" }),
+      /* @__PURE__ */ jsx("span", { className: "ff-run-feed__title-text", children: title }),
+      running && /* @__PURE__ */ jsx("span", { className: "ff-run-feed__badge", children: "running" }),
+      /* @__PURE__ */ jsxs("span", { className: "ff-run-feed__count", children: [
+        entries.length,
+        " ",
+        entries.length === 1 ? "event" : "events"
+      ] })
+    ] }),
+    /* @__PURE__ */ jsx("div", { className: "ff-run-feed__body", ref: scrollRef, children: entries.length === 0 ? /* @__PURE__ */ jsx("p", { className: "ff-run-feed__empty", children: "No run events yet." }) : entries.map((e) => /* @__PURE__ */ jsxs("div", { className: `ff-run-feed__row ff-run-feed__row--${e.level}`, children: [
+      /* @__PURE__ */ jsx("span", { className: "ff-run-feed__time", children: formatTime(e.at) }),
+      e.nodeId && /* @__PURE__ */ jsx("span", { className: "ff-run-feed__node", children: e.nodeId }),
+      /* @__PURE__ */ jsx("span", { className: "ff-run-feed__text", children: e.text })
+    ] }, e.id)) })
+  ] });
 }
 function formatTime(at) {
   const d = new Date(at);
@@ -1752,7 +1768,7 @@ function FlowEditorInner({
           onCancel: () => setLabelEdit(null)
         }
       ),
-      showFeed && (slots.feed ? slots.feed(api) : /* @__PURE__ */ jsx(FlowRunFeed, { entries: runner.feed, className: "ff-editor__feed" })),
+      showFeed && (slots.feed ? slots.feed(api) : /* @__PURE__ */ jsx(FlowRunFeed, { entries: runner.feed, running: api.running, className: "ff-editor__feed" })),
       prompt && /* @__PURE__ */ jsx(HumanPrompt, { request: prompt, onCancel: () => {
         setPrompt(null);
         runner.cancel();