@elicdavis/node-flow 0.1.8 → 0.1.9

package/LICENSE

@@ -0,0 +1,21 @@
+The MIT License
+
+Copyright (c) 2025 Eli C Davis.
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in
+all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
+THE SOFTWARE.

package/dist/index.d.mts

@@ -216,11 +216,21 @@ interface FlowNodeStyle {
     selected?: BoxStyleConfig;
     portText?: TextStyleConfig;
 }
+declare enum MessageType {
+    Info = "info",
+    Warning = "warning",
+    Error = "error"
+}
+interface NodeMessageConfig {
+    message: string;
+    type?: MessageType;
+}
 interface FlowNodeConfig {
     position?: Vector2;
     title?: string;
     subTitle?: string;
     info?: string;
+    messages?: Array<NodeMessageConfig>;
     locked?: boolean;
     data?: Metadata;
     contextMenu?: ContextMenuConfig;
@@ -298,6 +308,8 @@ declare class FlowNode {
     outputPortPosition(index: number): Box;
     outputPort(index: number): Port;
     outputs(): number;
+    addMessage(message: NodeMessageConfig): void;
+    clearMessages(): void;
     render(ctx: CanvasRenderingContext2D, camera: Camera, state: NodeState, mousePosition: Vector2 | undefined, postProcess: PassSubsystem): void;
 }
 
@@ -503,6 +515,11 @@ declare const Theme: {
         Port: {
             FontColor: string;
         };
+        Message: {
+            InfoColor: string;
+            WarnColor: string;
+            ErrorColor: string;
+        };
     };
     BoxSelect: {
         Color: string;
@@ -762,4 +779,4 @@ declare class WidgetFactory {
 }
 declare const GlobalWidgetFactory: WidgetFactory;
 
-export { ButtonWidget, ColorWidget, FlowNode, type FlowNodeConfig, type FlowNodeGraphConfiguration, type FlowNodeStyle, type FlowNodeTitleConfig, FlowNote, GlobalWidgetFactory, type GraphRenderer, ImageWidget, NodeFlowGraph, type NodeIntersection, NodeState, NumberWidget, Publisher, type PublisherConfig, SliderWidget, StringWidget, Theme, ToggleWidget, type WidgetConfig };
+export { ButtonWidget, ColorWidget, FlowNode, type FlowNodeConfig, type FlowNodeGraphConfiguration, type FlowNodeStyle, type FlowNodeTitleConfig, FlowNote, GlobalWidgetFactory, type GraphRenderer, ImageWidget, MessageType, NodeFlowGraph, type NodeIntersection, type NodeMessageConfig, NodeState, NumberWidget, Publisher, type PublisherConfig, SliderWidget, StringWidget, Theme, ToggleWidget, type WidgetConfig };

package/dist/index.d.ts

@@ -216,11 +216,21 @@ interface FlowNodeStyle {
     selected?: BoxStyleConfig;
     portText?: TextStyleConfig;
 }
+declare enum MessageType {
+    Info = "info",
+    Warning = "warning",
+    Error = "error"
+}
+interface NodeMessageConfig {
+    message: string;
+    type?: MessageType;
+}
 interface FlowNodeConfig {
     position?: Vector2;
     title?: string;
     subTitle?: string;
     info?: string;
+    messages?: Array<NodeMessageConfig>;
     locked?: boolean;
     data?: Metadata;
     contextMenu?: ContextMenuConfig;
@@ -298,6 +308,8 @@ declare class FlowNode {
     outputPortPosition(index: number): Box;
     outputPort(index: number): Port;
     outputs(): number;
+    addMessage(message: NodeMessageConfig): void;
+    clearMessages(): void;
     render(ctx: CanvasRenderingContext2D, camera: Camera, state: NodeState, mousePosition: Vector2 | undefined, postProcess: PassSubsystem): void;
 }
 
@@ -503,6 +515,11 @@ declare const Theme: {
         Port: {
             FontColor: string;
         };
+        Message: {
+            InfoColor: string;
+            WarnColor: string;
+            ErrorColor: string;
+        };
     };
     BoxSelect: {
         Color: string;
@@ -762,4 +779,4 @@ declare class WidgetFactory {
 }
 declare const GlobalWidgetFactory: WidgetFactory;
 
-export { ButtonWidget, ColorWidget, FlowNode, type FlowNodeConfig, type FlowNodeGraphConfiguration, type FlowNodeStyle, type FlowNodeTitleConfig, FlowNote, GlobalWidgetFactory, type GraphRenderer, ImageWidget, NodeFlowGraph, type NodeIntersection, NodeState, NumberWidget, Publisher, type PublisherConfig, SliderWidget, StringWidget, Theme, ToggleWidget, type WidgetConfig };
+export { ButtonWidget, ColorWidget, FlowNode, type FlowNodeConfig, type FlowNodeGraphConfiguration, type FlowNodeStyle, type FlowNodeTitleConfig, FlowNote, GlobalWidgetFactory, type GraphRenderer, ImageWidget, MessageType, NodeFlowGraph, type NodeIntersection, type NodeMessageConfig, NodeState, NumberWidget, Publisher, type PublisherConfig, SliderWidget, StringWidget, Theme, ToggleWidget, type WidgetConfig };

package/dist/index.js

@@ -42,6 +42,7 @@ __export(index_exports, {
   FlowNote: () => FlowNote,
   GlobalWidgetFactory: () => GlobalWidgetFactory,
   ImageWidget: () => ImageWidget,
+  MessageType: () => MessageType,
   NodeFlowGraph: () => NodeFlowGraph,
   NodeState: () => NodeState,
   NumberWidget: () => NumberWidget,
@@ -76,6 +77,11 @@ var Theme = {
     },
     Port: {
       FontColor: "#afb9bb"
+    },
+    Message: {
+      InfoColor: "#afb9bb",
+      WarnColor: "#f1f663ff",
+      ErrorColor: "#FF0000"
     }
   },
   BoxSelect: {
@@ -1175,18 +1181,24 @@ function splitStringIntoLines(ctx, str, maxWidth) {
 }
 
 // src/types/text.ts
-var _measured, _size2, _style, _value, _Text_instances, measure_fn;
+var _measured, _size2, _style, _value, _maxWidth2, _lineSpacing, _textToRender, _Text_instances, measure_fn;
 var _Text = class _Text {
-  constructor(value, style) {
+  constructor(value, style, config) {
     __privateAdd(this, _Text_instances);
     __privateAdd(this, _measured);
     __privateAdd(this, _size2);
     __privateAdd(this, _style);
     __privateAdd(this, _value);
+    __privateAdd(this, _maxWidth2);
+    __privateAdd(this, _lineSpacing);
+    __privateAdd(this, _textToRender);
     __privateSet(this, _value, value);
     __privateSet(this, _measured, false);
     __privateSet(this, _size2, Zero());
     __privateSet(this, _style, new TextStyle(style));
+    __privateSet(this, _maxWidth2, (config == null ? void 0 : config.MaxWidth) ? config == null ? void 0 : config.MaxWidth : -1);
+    __privateSet(this, _lineSpacing, (config == null ? void 0 : config.LineSpacing) ? config == null ? void 0 : config.LineSpacing : 5);
+    __privateSet(this, _textToRender, [value]);
     if (!document.fonts.check(`16px "${__privateGet(this, _style).getFont()}"`)) {
       document.fonts.addEventListener("loadingdone", (event) => {
         __privateSet(this, _measured, false);
@@ -1253,6 +1265,10 @@ var _Text = class _Text {
     CopyVector2(out, __privateGet(this, _size2));
     ScaleVector(out, scale);
   }
+  height(ctx) {
+    __privateMethod(this, _Text_instances, measure_fn).call(this, ctx);
+    return __privateGet(this, _size2).y;
+  }
   setColor(color) {
     __privateGet(this, _style).setColor(color);
   }
@@ -1266,8 +1282,17 @@ var _Text = class _Text {
     __privateGet(this, _style).setWeight(weight);
   }
   render(ctx, scale, position) {
+    __privateMethod(this, _Text_instances, measure_fn).call(this, ctx);
     __privateGet(this, _style).setupStyle(ctx, scale);
-    ctx.fillText(__privateGet(this, _value), position.x, position.y);
+    let yOffset = 0;
+    for (let i = 0; i < __privateGet(this, _textToRender).length; i++) {
+      ctx.fillText(
+        __privateGet(this, _textToRender)[i],
+        position.x,
+        position.y + yOffset
+      );
+      yOffset += (__privateGet(this, _style).getSize() + __privateGet(this, _lineSpacing)) * scale;
+    }
   }
   style() {
     return __privateGet(this, _style);
@@ -1277,15 +1302,31 @@ _measured = new WeakMap();
 _size2 = new WeakMap();
 _style = new WeakMap();
 _value = new WeakMap();
+_maxWidth2 = new WeakMap();
+_lineSpacing = new WeakMap();
+_textToRender = new WeakMap();
 _Text_instances = new WeakSet();
 measure_fn = function(ctx) {
   if (__privateGet(this, _measured)) {
     return;
   }
   __privateGet(this, _style).setupStyle(ctx, 1);
-  const measurements = ctx.measureText(__privateGet(this, _value));
-  __privateGet(this, _size2).x = measurements.width;
-  __privateGet(this, _size2).y = measurements.actualBoundingBoxAscent + measurements.actualBoundingBoxDescent;
+  if (__privateGet(this, _maxWidth2) == -1) {
+    const measurements = ctx.measureText(__privateGet(this, _value));
+    __privateGet(this, _size2).x = measurements.width;
+    __privateGet(this, _size2).y = measurements.actualBoundingBoxAscent + measurements.actualBoundingBoxDescent;
+    __privateSet(this, _textToRender, [__privateGet(this, _value)]);
+    __privateSet(this, _measured, true);
+    return;
+  }
+  __privateSet(this, _textToRender, splitStringIntoLines(ctx, __privateGet(this, _value), __privateGet(this, _maxWidth2)));
+  __privateGet(this, _size2).x = 0;
+  __privateGet(this, _size2).y = 0;
+  for (let i = 0; i < __privateGet(this, _textToRender).length; i++) {
+    const measurements = ctx.measureText(__privateGet(this, _textToRender)[i]);
+    __privateGet(this, _size2).x = Math.max(__privateGet(this, _size2).x, measurements.width);
+  }
+  __privateGet(this, _size2).y += (__privateGet(this, _textToRender).length - 1) * __privateGet(this, _lineSpacing) + __privateGet(this, _style).getSize() * __privateGet(this, _textToRender).length;
   __privateSet(this, _measured, true);
 };
 var Text = _Text;
@@ -2553,14 +2594,14 @@ _disabledStyle = new WeakMap();
 _callback6 = new WeakMap();
 
 // src/widgets/image.ts
-var _url, _image, _maxWidth2, _maxHeight2;
+var _url, _image, _maxWidth3, _maxHeight2;
 var ImageWidget = class {
   constructor(config) {
     __privateAdd(this, _url);
     __privateAdd(this, _image);
-    __privateAdd(this, _maxWidth2);
+    __privateAdd(this, _maxWidth3);
     __privateAdd(this, _maxHeight2);
-    __privateSet(this, _maxWidth2, (config == null ? void 0 : config.maxWidth) === void 0 ? 150 : config == null ? void 0 : config.maxWidth);
+    __privateSet(this, _maxWidth3, (config == null ? void 0 : config.maxWidth) === void 0 ? 150 : config == null ? void 0 : config.maxWidth);
     __privateSet(this, _maxHeight2, (config == null ? void 0 : config.maxHeight) === void 0 ? 150 : config == null ? void 0 : config.maxHeight);
     if (config == null ? void 0 : config.image) {
       this.SetUrl(config == null ? void 0 : config.image);
@@ -2590,8 +2631,8 @@ var ImageWidget = class {
       return { "x": 0, "y": 0 };
     }
     let adjust = 1;
-    if (__privateGet(this, _image).width > __privateGet(this, _maxWidth2)) {
-      adjust = __privateGet(this, _maxWidth2) / __privateGet(this, _image).width;
+    if (__privateGet(this, _image).width > __privateGet(this, _maxWidth3)) {
+      adjust = __privateGet(this, _maxWidth3) / __privateGet(this, _image).width;
     }
     if (__privateGet(this, _image).height > __privateGet(this, _maxHeight2)) {
       let heightAdjust = __privateGet(this, _maxHeight2) / __privateGet(this, _image).height;
@@ -2633,7 +2674,7 @@ var ImageWidget = class {
 };
 _url = new WeakMap();
 _image = new WeakMap();
-_maxWidth2 = new WeakMap();
+_maxWidth3 = new WeakMap();
 _maxHeight2 = new WeakMap();
 
 // src/widgets/text.ts
@@ -3877,13 +3918,53 @@ function FormPopup(config) {
 
 // src/node.ts
 var MINIMUM_NODE_WIDTH = 150;
+var MessageType = /* @__PURE__ */ ((MessageType2) => {
+  MessageType2["Info"] = "info";
+  MessageType2["Warning"] = "warning";
+  MessageType2["Error"] = "error";
+  return MessageType2;
+})(MessageType || {});
+function MessageTypeColor(messageType) {
+  switch (messageType) {
+    case "info" /* Info */:
+      return Theme.Node.Message.InfoColor;
+    case "warning" /* Warning */:
+      return Theme.Node.Message.WarnColor;
+    case "error" /* Error */:
+      return Theme.Node.Message.ErrorColor;
+    default:
+      throw new Error(`unrecognized message type ${messageType}`);
+  }
+}
 var NodeState = /* @__PURE__ */ ((NodeState2) => {
   NodeState2[NodeState2["Idle"] = 0] = "Idle";
   NodeState2[NodeState2["MouseOver"] = 1] = "MouseOver";
   NodeState2[NodeState2["Grabbed"] = 2] = "Grabbed";
   return NodeState2;
 })(NodeState || {});
-var _position, _title2, _subTitle, _infoSymbol, _infoText, _input, _output, _widgets, _locked, _canEditTitle, _canEditInfo, _canEditPorts, _contextMenu2, _metadata, _onSelect, _onUnselect, _onFiledrop, _onDragStop, _titleChangeCallback, _infoChangeCallback, _titleColor, _selectedStyle, _stateStyles, _padding2, _portTextStyle, _elementSpacing, _selected, _inputPortPositions, _outputPortPositions, _widgetPositions, _data, _registeredAnyPropertyChangeCallbacks, _registeredPropertyChangeCallbacks, _FlowNode_instances, popupNodeTitleSelection_fn, popupNodeInfoSelection_fn, popupNewButtonWidget_fn, widgetSubmenu_fn, calculateStyle_fn;
+var _text7;
+var MessageRenderer = class {
+  constructor(config) {
+    __privateAdd(this, _text7);
+    __privateSet(this, _text7, new Text(
+      config.message,
+      {
+        color: MessageTypeColor(config.type ? config.type : "info" /* Info */)
+      },
+      {
+        LineSpacing: 2.5,
+        MaxWidth: 200
+      }
+    ));
+  }
+  render(ctx, scale, position) {
+    ctx.textAlign = "center" /* Center */;
+    __privateGet(this, _text7).render(ctx, scale, position);
+    return __privateGet(this, _text7).height(ctx) * scale;
+  }
+};
+_text7 = new WeakMap();
+var _position, _title2, _subTitle, _infoSymbol, _infoText, _messages, _input, _output, _widgets, _locked, _canEditTitle, _canEditInfo, _canEditPorts, _contextMenu2, _metadata, _onSelect, _onUnselect, _onFiledrop, _onDragStop, _titleChangeCallback, _infoChangeCallback, _titleColor, _selectedStyle, _stateStyles, _padding2, _portTextStyle, _elementSpacing, _selected, _inputPortPositions, _outputPortPositions, _widgetPositions, _data, _registeredAnyPropertyChangeCallbacks, _registeredPropertyChangeCallbacks, _FlowNode_instances, popupNodeTitleSelection_fn, popupNodeInfoSelection_fn, popupNewButtonWidget_fn, widgetSubmenu_fn, calculateStyle_fn;
 var FlowNode = class {
   constructor(config) {
     __privateAdd(this, _FlowNode_instances);
@@ -3892,6 +3973,7 @@ var FlowNode = class {
     __privateAdd(this, _subTitle);
     __privateAdd(this, _infoSymbol);
     __privateAdd(this, _infoText);
+    __privateAdd(this, _messages);
     __privateAdd(this, _input);
     __privateAdd(this, _output);
     __privateAdd(this, _widgets);
@@ -3940,6 +4022,13 @@ var FlowNode = class {
     __privateSet(this, _canEditInfo, (config == null ? void 0 : config.canEditInfo) === void 0 ? false : config.canEditInfo);
     __privateSet(this, _contextMenu2, (config == null ? void 0 : config.contextMenu) === void 0 ? null : config.contextMenu);
     __privateSet(this, _metadata, config == null ? void 0 : config.metadata);
+    __privateSet(this, _messages, []);
+    if (config == null ? void 0 : config.messages) {
+      for (let i = 0; i < config.messages.length; i++) {
+        const message = config.messages[i];
+        __privateGet(this, _messages).push(new MessageRenderer(message));
+      }
+    }
     __privateSet(this, _selected, false);
     __privateSet(this, _onSelect, new Array());
     __privateSet(this, _onUnselect, new Array());
@@ -4432,6 +4521,12 @@ var FlowNode = class {
   outputs() {
     return __privateGet(this, _output).length;
   }
+  addMessage(message) {
+    __privateGet(this, _messages).push(new MessageRenderer(message));
+  }
+  clearMessages() {
+    __privateSet(this, _messages, []);
+  }
   render(ctx, camera, state, mousePosition, postProcess) {
     VectorPool.run(() => {
       const tempMeasurement = VectorPool.get();
@@ -4559,6 +4654,13 @@ var FlowNode = class {
         __privateGet(this, _widgetPositions).Push(widget.Draw(ctx, position, camera.zoom, mousePosition));
         startY += widgetSize.y * camera.zoom + scaledElementSpacing;
       }
+      const messageStart = VectorPool.get();
+      messageStart.x = nodeBounds.Position.x + nodeBounds.Size.x / 2;
+      messageStart.y = nodeBounds.Position.y + nodeBounds.Size.y + 15 * camera.zoom;
+      for (let i = 0; i < __privateGet(this, _messages).length; i++) {
+        const message = __privateGet(this, _messages)[i];
+        messageStart.y += message.render(ctx, camera.zoom, messageStart) + 10 * camera.zoom;
+      }
     });
   }
 };
@@ -4567,6 +4669,7 @@ _title2 = new WeakMap();
 _subTitle = new WeakMap();
 _infoSymbol = new WeakMap();
 _infoText = new WeakMap();
+_messages = new WeakMap();
 _input = new WeakMap();
 _output = new WeakMap();
 _widgets = new WeakMap();
@@ -4885,15 +4988,15 @@ text_fn = function() {
 };
 
 // src/markdown/entry.ts
-var _text7, _calculatedPositions, _calculatedEntries, _calculatedForWidth, _CodeBlockEntry_instances, calculateLayout_fn;
+var _text8, _calculatedPositions, _calculatedEntries, _calculatedForWidth, _CodeBlockEntry_instances, calculateLayout_fn;
 var CodeBlockEntry = class {
   constructor(text) {
     __privateAdd(this, _CodeBlockEntry_instances);
-    __privateAdd(this, _text7);
+    __privateAdd(this, _text8);
     __privateAdd(this, _calculatedPositions);
     __privateAdd(this, _calculatedEntries);
     __privateAdd(this, _calculatedForWidth);
-    __privateSet(this, _text7, text);
+    __privateSet(this, _text8, text);
     __privateSet(this, _calculatedForWidth, -1);
     __privateSet(this, _calculatedEntries, new List());
     __privateSet(this, _calculatedPositions, new List());
@@ -4932,7 +5035,7 @@ var CodeBlockEntry = class {
     return max + padding * 2;
   }
 };
-_text7 = new WeakMap();
+_text8 = new WeakMap();
 _calculatedPositions = new WeakMap();
 _calculatedEntries = new WeakMap();
 _calculatedForWidth = new WeakMap();
@@ -4946,8 +5049,8 @@ calculateLayout_fn = function(ctx, maxWidth) {
   __privateGet(this, _calculatedEntries).Clear();
   __privateGet(this, _calculatedPositions).Clear();
   let curHeight = 0;
-  const lineInc = __privateGet(this, _text7).style().getSize() + Theme.Note.LineSpacing;
-  let entries = __privateGet(this, _text7).split("\n");
+  const lineInc = __privateGet(this, _text8).style().getSize() + Theme.Note.LineSpacing;
+  let entries = __privateGet(this, _text8).split("\n");
   for (let entryIndex = 0; entryIndex < entries.length; entryIndex++) {
     const entry = entries[entryIndex];
     let lines = entry.breakIntoLines(ctx, adjustedWith);
@@ -5844,11 +5947,11 @@ var PassSubsystem = class {
 _queue = new WeakMap();
 
 // src/quickMenu.ts
-var _text8;
+var _text9;
 var QuickMenuGroup = class {
   constructor(text, items) {
-    __privateAdd(this, _text8);
-    __privateSet(this, _text8, text);
+    __privateAdd(this, _text9);
+    __privateSet(this, _text9, text);
     this.items = items;
   }
   updateRendering(terms) {
@@ -5860,18 +5963,18 @@ var QuickMenuGroup = class {
         shouldRender = true;
       }
     }
-    __privateGet(this, _text8).setDisplay(shouldRender ? "flex" /* Flex */ : "none" /* None */);
+    __privateGet(this, _text9).setDisplay(shouldRender ? "flex" /* Flex */ : "none" /* None */);
   }
 };
-_text8 = new WeakMap();
-var _searchText, _text9, _context;
+_text9 = new WeakMap();
+var _searchText, _text10, _context;
 var QuickMenuItem = class {
   constructor(searchText, text, context) {
     __privateAdd(this, _searchText);
-    __privateAdd(this, _text9);
+    __privateAdd(this, _text10);
     __privateAdd(this, _context);
     __privateSet(this, _searchText, searchText.toLowerCase());
-    __privateSet(this, _text9, text);
+    __privateSet(this, _text10, text);
     __privateSet(this, _context, context);
   }
   filter(terms) {
@@ -5889,13 +5992,13 @@ var QuickMenuItem = class {
     return true;
   }
   render(render) {
-    __privateGet(this, _text9).setDisplay(render ? "flex" /* Flex */ : "none" /* None */);
+    __privateGet(this, _text10).setDisplay(render ? "flex" /* Flex */ : "none" /* None */);
   }
   rendering() {
-    return __privateGet(this, _text9).getDisplay() === "flex" /* Flex */;
+    return __privateGet(this, _text10).getDisplay() === "flex" /* Flex */;
   }
   highlight(highlight) {
-    __privateGet(this, _text9).setBackgroundColor(highlight ? Theme.ContextMenu.HighlightColor : "");
+    __privateGet(this, _text10).setBackgroundColor(highlight ? Theme.ContextMenu.HighlightColor : "");
   }
   select() {
     if (__privateGet(this, _context).callback) {
@@ -5904,7 +6007,7 @@ var QuickMenuItem = class {
   }
 };
 _searchText = new WeakMap();
-_text9 = new WeakMap();
+_text10 = new WeakMap();
 _context = new WeakMap();
 function RecurseBuildContainers(path, config, renderElements, groups) {
   var _a, _b, _c;
@@ -6523,6 +6626,7 @@ renderQuickMenu_fn = function() {
   FlowNote,
   GlobalWidgetFactory,
   ImageWidget,
+  MessageType,
   NodeFlowGraph,
   NodeState,
   NumberWidget,