@elicdavis/node-flow 0.2.2 → 0.2.3

package/dist/index.d.mts

@@ -156,97 +156,6 @@ interface Box {
 }
 declare function InBox(box: Box, position: Vector2): boolean;
 
-declare enum PortType {
-    Input = "INPUT",
-    Output = "OUTPUT",
-    InputArray = "INPUTARRAY"
-}
-interface PortStyle {
-    size?: number;
-    fillColor?: string;
-    borderColor?: string;
-    borderSize?: number;
-}
-type ConnectionChangeCallback = (connection: Connection, connectionIndex: number, port: Port, portType: PortType, node: FlowNode) => void;
-interface PortConfig {
-    name?: string;
-    type?: string;
-    description?: string;
-    array?: boolean;
-    /**
-     * Lets this port connect to a port of any type, instead of only to one
-     * declaring the same `type` string. For a port whose type is decided by
-     * whatever gets wired into it, where `type` is a placeholder shown to
-     * the user rather than a promise about the values passing through.
-     */
-    anyType?: boolean;
-    /**
-     * Every type this port takes, when it takes more than one. For a port
-     * that works on a single value or an array of them, where `type` is
-     * only the one it happens to be showing.
-     *
-     * An empty or absent list means the port takes exactly its `type`,
-     * unless `anyType` says otherwise.
-     */
-    acceptedTypes?: Array<string>;
-    /**
-     * Leaves the port off the node until something is connected to it.
-     */
-    hidden?: boolean;
-    emptyStyle?: PortStyle;
-    filledStyle?: PortStyle;
-    onConnectionAdded?: ConnectionChangeCallback;
-    onConnectionRemoved?: ConnectionChangeCallback;
-}
-/**
- * Whether two ports may be connected, going by their types alone. Each port
- * offers the set of types it takes - one entry for an ordinary port, several
- * for a port that takes more than one, and none at all for a port that takes
- * anything. They connect when those sets overlap.
- */
-declare function portsCompatible(a: Port | undefined | null, b: Port | undefined | null): boolean;
-declare function typeSetsCompatible(a: Array<string>, b: Array<string>): boolean;
-declare function portConfigTypes(config: PortConfig): Array<string>;
-declare class Port {
-    #private;
-    constructor(node: FlowNode, portType: PortType, config?: PortConfig);
-    setDataType(type: string): void;
-    setAnyType(anyType: boolean): void;
-    /**
-     * Scope accepted types to singular type
-     */
-    settleOn(type: string): void;
-    addConnection(connection: Connection, index?: number): void;
-    replaceConnection(connection: Connection, index: number): void;
-    addConnectionAddedListener(callback: ConnectionChangeCallback): void;
-    connections(): Array<Connection>;
-    /**
-     * How many wires the port has room for: one per connection on an array
-     * input, so each can be told apart and picked up on its own.
-     */
-    slots(): number;
-    setHidden(hidden: boolean): void;
-    /**
-     * A port asked to hide still shows while anything is connected to it,
-     * and while its node is showing its hidden ports.
-     */
-    hidden(): boolean;
-    tucked(): boolean;
-    addConnectionRemovedListener(callback: ConnectionChangeCallback): void;
-    clearConnection(connection: Connection): void;
-    getDataType(): string;
-    acceptsAnyType(): boolean;
-    /**
-     * Every type this port takes. Empty means it takes anything.
-     */
-    acceptedTypes(): Array<string>;
-    setAcceptedTypes(types: Array<string>): void;
-    getPortType(): PortType;
-    getDisplayName(): string;
-    filledStyleColor(): string;
-    render(ctx: CanvasRenderingContext2D, position: Vector2, camera: Camera, mousePosition: Vector2 | undefined, postProcess: PassSubsystem): Box;
-}
-
 /**
  * Where the pointer is, in canvas pixels, and whether it is over the widget.
  * A press that starts on a widget keeps reporting to it until it is let go,
@@ -301,17 +210,6 @@ declare abstract class WidgetBase implements Widget {
     protected onClick(pointer: WidgetPointer): void;
 }
 
-interface StrokeStyleConfig {
-    size?: number;
-    color?: string;
-}
-
-interface BoxStyleConfig {
-    border?: StrokeStyleConfig;
-    color?: string;
-    radius?: number;
-}
-
 interface ValueWidgetConfig<T> {
     /**
      * A node property the widget shows and edits. Setting the property from
@@ -535,6 +433,119 @@ declare class WidgetFactory {
 }
 declare const GlobalWidgetFactory: WidgetFactory;
 
+declare enum PortType {
+    Input = "INPUT",
+    Output = "OUTPUT",
+    InputArray = "INPUTARRAY"
+}
+interface PortStyle {
+    size?: number;
+    fillColor?: string;
+    borderColor?: string;
+    borderSize?: number;
+}
+type ConnectionChangeCallback = (connection: Connection, connectionIndex: number, port: Port, portType: PortType, node: FlowNode) => void;
+interface PortConfig {
+    name?: string;
+    type?: string;
+    description?: string;
+    array?: boolean;
+    /**
+     * Lets this port connect to a port of any type, instead of only to one
+     * declaring the same `type` string. For a port whose type is decided by
+     * whatever gets wired into it, where `type` is a placeholder shown to
+     * the user rather than a promise about the values passing through.
+     */
+    anyType?: boolean;
+    /**
+     * Every type this port takes, when it takes more than one. For a port
+     * that works on a single value or an array of them, where `type` is
+     * only the one it happens to be showing.
+     *
+     * An empty or absent list means the port takes exactly its `type`,
+     * unless `anyType` says otherwise.
+     */
+    acceptedTypes?: Array<string>;
+    /**
+     * Leaves the port off the node until something is connected to it.
+     */
+    hidden?: boolean;
+    /**
+     * A widget drawn on the port's own row while nothing is connected to
+     * it, for a value the port holds on its own. Input ports only.
+     */
+    widget?: WidgetConfig;
+    emptyStyle?: PortStyle;
+    filledStyle?: PortStyle;
+    onConnectionAdded?: ConnectionChangeCallback;
+    onConnectionRemoved?: ConnectionChangeCallback;
+}
+/**
+ * Whether two ports may be connected, going by their types alone. Each port
+ * offers the set of types it takes - one entry for an ordinary port, several
+ * for a port that takes more than one, and none at all for a port that takes
+ * anything. They connect when those sets overlap.
+ */
+declare function portsCompatible(a: Port | undefined | null, b: Port | undefined | null): boolean;
+declare function typeSetsCompatible(a: Array<string>, b: Array<string>): boolean;
+declare function portConfigTypes(config: PortConfig): Array<string>;
+declare class Port {
+    #private;
+    constructor(node: FlowNode, portType: PortType, config?: PortConfig);
+    setDataType(type: string): void;
+    setAnyType(anyType: boolean): void;
+    /**
+     * Scope accepted types to singular type
+     */
+    settleOn(type: string): void;
+    addConnection(connection: Connection, index?: number): void;
+    replaceConnection(connection: Connection, index: number): void;
+    addConnectionAddedListener(callback: ConnectionChangeCallback): void;
+    connections(): Array<Connection>;
+    /**
+     * How many wires the port has room for: one per connection on an array
+     * input, so each can be told apart and picked up on its own.
+     */
+    slots(): number;
+    setHidden(hidden: boolean): void;
+    setWidget(widget: Widget | null): void;
+    widget(): Widget | null;
+    /**
+     * The widget stands in for a wire, so it leaves once one is connected.
+     */
+    widgetShown(): boolean;
+    /**
+     * A port asked to hide still shows while anything is connected to it,
+     * and while its node is showing its hidden ports.
+     */
+    hidden(): boolean;
+    tucked(): boolean;
+    addConnectionRemovedListener(callback: ConnectionChangeCallback): void;
+    clearConnection(connection: Connection): void;
+    getDataType(): string;
+    acceptsAnyType(): boolean;
+    /**
+     * Every type this port takes. Empty means it takes anything.
+     */
+    acceptedTypes(): Array<string>;
+    setAcceptedTypes(types: Array<string>): void;
+    getPortType(): PortType;
+    getDisplayName(): string;
+    filledStyleColor(): string;
+    render(ctx: CanvasRenderingContext2D, position: Vector2, camera: Camera, mousePosition: Vector2 | undefined, postProcess: PassSubsystem): Box;
+}
+
+interface StrokeStyleConfig {
+    size?: number;
+    color?: string;
+}
+
+interface BoxStyleConfig {
+    border?: StrokeStyleConfig;
+    color?: string;
+    radius?: number;
+}
+
 interface Metadata {
     [name: string]: any;
 }

package/dist/index.d.ts

@@ -156,97 +156,6 @@ interface Box {
 }
 declare function InBox(box: Box, position: Vector2): boolean;
 
-declare enum PortType {
-    Input = "INPUT",
-    Output = "OUTPUT",
-    InputArray = "INPUTARRAY"
-}
-interface PortStyle {
-    size?: number;
-    fillColor?: string;
-    borderColor?: string;
-    borderSize?: number;
-}
-type ConnectionChangeCallback = (connection: Connection, connectionIndex: number, port: Port, portType: PortType, node: FlowNode) => void;
-interface PortConfig {
-    name?: string;
-    type?: string;
-    description?: string;
-    array?: boolean;
-    /**
-     * Lets this port connect to a port of any type, instead of only to one
-     * declaring the same `type` string. For a port whose type is decided by
-     * whatever gets wired into it, where `type` is a placeholder shown to
-     * the user rather than a promise about the values passing through.
-     */
-    anyType?: boolean;
-    /**
-     * Every type this port takes, when it takes more than one. For a port
-     * that works on a single value or an array of them, where `type` is
-     * only the one it happens to be showing.
-     *
-     * An empty or absent list means the port takes exactly its `type`,
-     * unless `anyType` says otherwise.
-     */
-    acceptedTypes?: Array<string>;
-    /**
-     * Leaves the port off the node until something is connected to it.
-     */
-    hidden?: boolean;
-    emptyStyle?: PortStyle;
-    filledStyle?: PortStyle;
-    onConnectionAdded?: ConnectionChangeCallback;
-    onConnectionRemoved?: ConnectionChangeCallback;
-}
-/**
- * Whether two ports may be connected, going by their types alone. Each port
- * offers the set of types it takes - one entry for an ordinary port, several
- * for a port that takes more than one, and none at all for a port that takes
- * anything. They connect when those sets overlap.
- */
-declare function portsCompatible(a: Port | undefined | null, b: Port | undefined | null): boolean;
-declare function typeSetsCompatible(a: Array<string>, b: Array<string>): boolean;
-declare function portConfigTypes(config: PortConfig): Array<string>;
-declare class Port {
-    #private;
-    constructor(node: FlowNode, portType: PortType, config?: PortConfig);
-    setDataType(type: string): void;
-    setAnyType(anyType: boolean): void;
-    /**
-     * Scope accepted types to singular type
-     */
-    settleOn(type: string): void;
-    addConnection(connection: Connection, index?: number): void;
-    replaceConnection(connection: Connection, index: number): void;
-    addConnectionAddedListener(callback: ConnectionChangeCallback): void;
-    connections(): Array<Connection>;
-    /**
-     * How many wires the port has room for: one per connection on an array
-     * input, so each can be told apart and picked up on its own.
-     */
-    slots(): number;
-    setHidden(hidden: boolean): void;
-    /**
-     * A port asked to hide still shows while anything is connected to it,
-     * and while its node is showing its hidden ports.
-     */
-    hidden(): boolean;
-    tucked(): boolean;
-    addConnectionRemovedListener(callback: ConnectionChangeCallback): void;
-    clearConnection(connection: Connection): void;
-    getDataType(): string;
-    acceptsAnyType(): boolean;
-    /**
-     * Every type this port takes. Empty means it takes anything.
-     */
-    acceptedTypes(): Array<string>;
-    setAcceptedTypes(types: Array<string>): void;
-    getPortType(): PortType;
-    getDisplayName(): string;
-    filledStyleColor(): string;
-    render(ctx: CanvasRenderingContext2D, position: Vector2, camera: Camera, mousePosition: Vector2 | undefined, postProcess: PassSubsystem): Box;
-}
-
 /**
  * Where the pointer is, in canvas pixels, and whether it is over the widget.
  * A press that starts on a widget keeps reporting to it until it is let go,
@@ -301,17 +210,6 @@ declare abstract class WidgetBase implements Widget {
     protected onClick(pointer: WidgetPointer): void;
 }
 
-interface StrokeStyleConfig {
-    size?: number;
-    color?: string;
-}
-
-interface BoxStyleConfig {
-    border?: StrokeStyleConfig;
-    color?: string;
-    radius?: number;
-}
-
 interface ValueWidgetConfig<T> {
     /**
      * A node property the widget shows and edits. Setting the property from
@@ -535,6 +433,119 @@ declare class WidgetFactory {
 }
 declare const GlobalWidgetFactory: WidgetFactory;
 
+declare enum PortType {
+    Input = "INPUT",
+    Output = "OUTPUT",
+    InputArray = "INPUTARRAY"
+}
+interface PortStyle {
+    size?: number;
+    fillColor?: string;
+    borderColor?: string;
+    borderSize?: number;
+}
+type ConnectionChangeCallback = (connection: Connection, connectionIndex: number, port: Port, portType: PortType, node: FlowNode) => void;
+interface PortConfig {
+    name?: string;
+    type?: string;
+    description?: string;
+    array?: boolean;
+    /**
+     * Lets this port connect to a port of any type, instead of only to one
+     * declaring the same `type` string. For a port whose type is decided by
+     * whatever gets wired into it, where `type` is a placeholder shown to
+     * the user rather than a promise about the values passing through.
+     */
+    anyType?: boolean;
+    /**
+     * Every type this port takes, when it takes more than one. For a port
+     * that works on a single value or an array of them, where `type` is
+     * only the one it happens to be showing.
+     *
+     * An empty or absent list means the port takes exactly its `type`,
+     * unless `anyType` says otherwise.
+     */
+    acceptedTypes?: Array<string>;
+    /**
+     * Leaves the port off the node until something is connected to it.
+     */
+    hidden?: boolean;
+    /**
+     * A widget drawn on the port's own row while nothing is connected to
+     * it, for a value the port holds on its own. Input ports only.
+     */
+    widget?: WidgetConfig;
+    emptyStyle?: PortStyle;
+    filledStyle?: PortStyle;
+    onConnectionAdded?: ConnectionChangeCallback;
+    onConnectionRemoved?: ConnectionChangeCallback;
+}
+/**
+ * Whether two ports may be connected, going by their types alone. Each port
+ * offers the set of types it takes - one entry for an ordinary port, several
+ * for a port that takes more than one, and none at all for a port that takes
+ * anything. They connect when those sets overlap.
+ */
+declare function portsCompatible(a: Port | undefined | null, b: Port | undefined | null): boolean;
+declare function typeSetsCompatible(a: Array<string>, b: Array<string>): boolean;
+declare function portConfigTypes(config: PortConfig): Array<string>;
+declare class Port {
+    #private;
+    constructor(node: FlowNode, portType: PortType, config?: PortConfig);
+    setDataType(type: string): void;
+    setAnyType(anyType: boolean): void;
+    /**
+     * Scope accepted types to singular type
+     */
+    settleOn(type: string): void;
+    addConnection(connection: Connection, index?: number): void;
+    replaceConnection(connection: Connection, index: number): void;
+    addConnectionAddedListener(callback: ConnectionChangeCallback): void;
+    connections(): Array<Connection>;
+    /**
+     * How many wires the port has room for: one per connection on an array
+     * input, so each can be told apart and picked up on its own.
+     */
+    slots(): number;
+    setHidden(hidden: boolean): void;
+    setWidget(widget: Widget | null): void;
+    widget(): Widget | null;
+    /**
+     * The widget stands in for a wire, so it leaves once one is connected.
+     */
+    widgetShown(): boolean;
+    /**
+     * A port asked to hide still shows while anything is connected to it,
+     * and while its node is showing its hidden ports.
+     */
+    hidden(): boolean;
+    tucked(): boolean;
+    addConnectionRemovedListener(callback: ConnectionChangeCallback): void;
+    clearConnection(connection: Connection): void;
+    getDataType(): string;
+    acceptsAnyType(): boolean;
+    /**
+     * Every type this port takes. Empty means it takes anything.
+     */
+    acceptedTypes(): Array<string>;
+    setAcceptedTypes(types: Array<string>): void;
+    getPortType(): PortType;
+    getDisplayName(): string;
+    filledStyleColor(): string;
+    render(ctx: CanvasRenderingContext2D, position: Vector2, camera: Camera, mousePosition: Vector2 | undefined, postProcess: PassSubsystem): Box;
+}
+
+interface StrokeStyleConfig {
+    size?: number;
+    color?: string;
+}
+
+interface BoxStyleConfig {
+    border?: StrokeStyleConfig;
+    color?: string;
+    radius?: number;
+}
+
 interface Metadata {
     [name: string]: any;
 }

package/dist/index.js

@@ -1679,6 +1679,7 @@ var Port = class {
   #dataTypePopupElement;
   #onConnectionAdded;
   #onConnectionRemoved;
+  #widget = null;
   constructor(node, portType, config) {
     this.#node = node;
     this.#connections = new Array();
@@ -1829,10 +1830,23 @@ var Port = class {
     this.#visibilityMayHaveChanged(was);
   }
   #visibilityMayHaveChanged(was) {
-    if (was !== this.hidden() || this.#portType === "INPUTARRAY" /* InputArray */) {
+    if (was !== this.hidden() || this.#portType === "INPUTARRAY" /* InputArray */ || this.#widget !== null) {
       this.#node?.invalidateLayout();
     }
   }
+  setWidget(widget) {
+    this.#widget = widget;
+    this.#node?.invalidateLayout();
+  }
+  widget() {
+    return this.#widget;
+  }
+  /**
+   * The widget stands in for a wire, so it leaves once one is connected.
+   */
+  widgetShown() {
+    return this.#widget !== null && this.#portType !== "OUTPUT" /* Output */ && this.#connections.length === 0 && !this.hidden() && !(this.#widget.Hidden?.() ?? false);
+  }
   /**
    * A port asked to hide still shows while anything is connected to it,
    * and while its node is showing its hidden ports.
@@ -5186,6 +5200,7 @@ var FlowNode = class {
   #inputPortPositions;
   #outputPortPositions;
   #widgetPositions;
+  #portWidgetPositions = new List();
   #data;
   #registeredAnyPropertyChangeCallbacks;
   #registeredPropertyChangeCallbacks;
@@ -5673,7 +5688,7 @@ var FlowNode = class {
       }
       this.#portTextStyle.measure(ctx, 1, port.getDisplayName(), tempMeasurement);
       size.y += this.#portRowHeight(port, tempMeasurement.y) + this.#elementSpacing;
-      size.x = Math.max(size.x, tempMeasurement.x + doublePadding);
+      size.x = Math.max(size.x, this.#portRowWidth(port, tempMeasurement.x) + doublePadding);
     }
     const widgets = this.#hasHiddenPortsToggle() ? [this.#hiddenPortsToggle, ...this.#widgets] : this.#widgets;
     for (const widget of widgets) {
@@ -5694,6 +5709,9 @@ var FlowNode = class {
   }
   addInput(config) {
     const port = new Port(this, config.array ? "INPUTARRAY" /* InputArray */ : "INPUT" /* Input */, config);
+    if (config.widget !== void 0) {
+      port.setWidget(GlobalWidgetFactory.createFromConfig(this, config.widget));
+    }
     this.#input.push(port);
     return port;
   }
@@ -5819,6 +5837,17 @@ var FlowNode = class {
         intersection.WidgetBox = this.#widgetPositions.At(i);
       }
     }
+    for (let i = 0; i < this.#portWidgetPositions.Count(); i++) {
+      const port = this.#input[i];
+      if (port !== void 0 && port.widgetShown() && InBox(this.#portWidgetPositions.At(i), position)) {
+        intersection.Node = this;
+        intersection.Widget = port.widget();
+        intersection.WidgetBox = this.#portWidgetPositions.At(i);
+        intersection.Port = void 0;
+        intersection.PortIndex = void 0;
+        intersection.PortIsInput = void 0;
+      }
+    }
     return intersection;
   }
   canEditTitle() {
@@ -5933,7 +5962,14 @@ var FlowNode = class {
   }
   #portRowHeight(port, textHeight) {
     const slots = port.slots();
-    return slots > 1 ? Math.max(textHeight, slots * ARRAY_SLOT_PITCH) : textHeight;
+    const widget = port.widgetShown() ? port.widget().Size().y : 0;
+    return Math.max(slots > 1 ? slots * ARRAY_SLOT_PITCH : 0, textHeight, widget);
+  }
+  #portRowWidth(port, textWidth) {
+    if (!port.widgetShown()) {
+      return textWidth;
+    }
+    return textWidth + this.#elementSpacing + port.widget().Size().x;
   }
   hasBeenLaidOut() {
     return this.#laidOut;
@@ -5955,6 +5991,7 @@ var FlowNode = class {
       this.#inputPortPositions.Clear();
       this.#outputPortPositions.Clear();
       this.#widgetPositions.Clear();
+      this.#portWidgetPositions.Clear();
       const scaledPadding = this.#padding * camera.zoom;
       const scaledElementSpacing = this.#elementSpacing * camera.zoom;
       const nodeBounds = this.calculateBounds(ctx, camera);
@@ -6049,6 +6086,7 @@ var FlowNode = class {
         const port = this.#input[i];
         if (port.hidden()) {
           this.#inputPortPositions.Push({ Position: { x: nodeBounds.Position.x, y: startY }, Size: { x: 0, y: 0 } });
+          this.#portWidgetPositions.Push({ Position: { x: nodeBounds.Position.x, y: startY }, Size: { x: 0, y: 0 } });
           continue;
         }
         this.#portTextStyle.measure(ctx, 1, port.getDisplayName(), tempMeasurement);
@@ -6058,6 +6096,19 @@ var FlowNode = class {
         position.y = startY + portHeight / 2;
         this.#portTextStyle.setupStyle(ctx, camera.zoom);
         ctx.fillText(port.getDisplayName(), leftSide, position.y);
+        if (port.widgetShown()) {
+          const widget = port.widget();
+          const widgetHeight = widget.Size().y * camera.zoom;
+          const widgetLeft = leftSide + tempMeasurement.x * camera.zoom + scaledElementSpacing;
+          const box = {
+            Position: { x: widgetLeft, y: startY + (portHeight - widgetHeight) / 2 },
+            Size: { x: nodeBounds.Position.x + nodeBounds.Size.x - scaledPadding - widgetLeft, y: widgetHeight }
+          };
+          widget.Draw(ctx, box, camera.zoom, mousePosition);
+          this.#portWidgetPositions.Push(box);
+        } else {
+          this.#portWidgetPositions.Push({ Position: { x: nodeBounds.Position.x, y: startY }, Size: { x: 0, y: 0 } });
+        }
         this.#inputPortPositions.Push(port.render(ctx, position, camera, mousePosition, postProcess));
         startY += portHeight + scaledElementSpacing;
       }
@@ -6143,6 +6194,7 @@ var FlowNode = class {
       return false;
     }
     this.#widgetPositions.Clear();
+    this.#portWidgetPositions.Clear();
     this.#hiddenPortsTogglePosition = null;
     return true;
   }