@elicdavis/node-flow 0.1.2 → 0.1.4

package/esbuild.ts

@@ -25,7 +25,11 @@ if (enableWatch) {
   };
 
   serve(serveOpts, {}).then((result) => {
-    console.log(`serving extension from "${serveOpts.servedir}" at "http://${result.host}:${result.port}"`);
+    let host = result.host;
+    if (host === "0.0.0.0") {
+      host = "localhost"
+    }
+    console.log(`serving extension from "${serveOpts.servedir}" at "http://${host}:${result.port}"`);
   });
 }
 

package/package.json

@@ -2,7 +2,7 @@
   "name": "@elicdavis/node-flow",
   "description": "build node graphs",
   "author": "Eli C Davis",
-  "version": "0.1.2",
+  "version": "0.1.4",
   "license": "MIT",
   "keywords": [
     "nodes",

package/src/elements/text.ts

@@ -17,6 +17,7 @@ export enum VerticalAlign {
 export interface TextElementStyling extends RenderElementBaseStyling {
     Align?: TextAlign
     VerticalAlign?: VerticalAlign
+    LineHeight?: number
 }
 
 export class TextElement extends RenderElementBase {
@@ -26,11 +27,14 @@ export class TextElement extends RenderElementBase {
 
     #verticalAlign: VerticalAlign;
 
+    #lineHeight: number;
+
     constructor(text: Text, styling?: TextElementStyling) {
         super(styling);
         this.#text = text;
         this.#align = styling?.Align ?? TextAlign.Left;
         this.#verticalAlign = styling?.VerticalAlign ?? VerticalAlign.Top;
+        this.#lineHeight = styling?.LineHeight ?? 1;
     }
 
     doRender(ctx: CanvasRenderingContext2D, position: Vector2, graphScale: number, scaledFillableSpace: Vector2): void {
@@ -87,28 +91,24 @@ export class TextElement extends RenderElementBase {
             for (let i = 0; i < eles.length; i++) {
                 eles[i].render(ctx, graphScale, justifiedPosition);
                 eles[i].size(ctx, 1, tempSize)
-                justifiedPosition.y += tempSize.y
+                justifiedPosition.y += this.#text.style().getSize() * this.#lineHeight
             }
         }
     }
 
     calcSize(ctx: CanvasRenderingContext2D, out: Vector2, limitations: Vector2): void {
-
         if (limitations.x <= 0) {
             this.#text.size(ctx, 1, out);
             return;
         }
 
         const eles = this.#text.breakIntoLines(ctx, limitations.x);
-
         const tempSize = { x: 0, y: 0 };
         out.x = 0;
-        out.y = 0;
+        out.y = this.#text.style().getSize() * eles.length * this.#lineHeight;
         for (let i = 0; i < eles.length; i++) {
             eles[i].size(ctx, 1, tempSize)
             out.x = Math.max(tempSize.x, out.x);
-            out.y += tempSize.y
         }
-
     }
 }

package/src/nodes/publisher.ts

@@ -51,8 +51,10 @@ export class Publisher {
         const subMenus = new Map<string, Map<string, FlowNodeConfig>>();
 
         for (let [key, nodeConfig] of subMenu) {
-            const elements = key.split("/");
-            if (elements.length === 1) {
+            const slashIndex = key.indexOf("/")
+            const bracketIndex = key.indexOf("[")
+
+            if (slashIndex === -1 || bracketIndex < slashIndex) {
                 items.push({
                     name: key,
                     callback: () => {
@@ -62,6 +64,7 @@ export class Publisher {
                     },
                 });
             } else {
+                const elements = key.split("/");
                 if (!subMenus.has(elements[0])) {
                     subMenus.set(elements[0], new Map<string, FlowNodeConfig>());
                 }

package/src/port.ts

@@ -126,8 +126,9 @@ export class Port {
                 new Text(description, { color: "white", style: FontStyle.Italic }),
                 {
                     Align: TextAlign.Center,
-                    Padding: { Top: 8 },
-                    MaxWidth: 300
+                    Padding: { Top: 16 },
+                    MaxWidth: 400,
+                    LineHeight: 1.5
                 }
             ));
         }
@@ -135,7 +136,7 @@ export class Port {
         this.#dataTypePopupElement = new ContainerRenderElement(
             containerElements,
             {
-                BackgroundColor: "rgba(0, 0, 0, 0.75)",
+                BackgroundColor: "rgba(0, 0, 0, 0.85)",
                 Border: {
                     Radius: 6,
                 },