@elicdavis/node-flow 0.1.14 → 0.1.16

package/package.json

@@ -2,7 +2,7 @@
   "name": "@elicdavis/node-flow",
   "description": "build node graphs",
   "author": "Eli C Davis",
-  "version": "0.1.14",
+  "version": "0.1.16",
   "license": "MIT",
   "keywords": [
     "nodes",
@@ -15,7 +15,9 @@
   "scripts": {
     "build": "ts-node ./esbuild.ts",
     "watch": "npm run build -- --watch",
-    "package": "tsup"
+    "package": "tsup",
+    "test": "mocha",
+    "typecheck": "tsc --noEmit"
   },
   "homepage": "https://github.com/EliCDavis/node-flow",
   "repository": {

package/src/graph.ts

@@ -403,6 +403,13 @@ export class NodeFlowGraph {
         this.#camera.setOrientation(orientation);
     }
 
+    /**
+     * Resets the camera to the default orientation (origin, zoom 1).
+     */
+    resetCamera(): void {
+        this.#camera.reset();
+    }
+
     /**
      * Adjusts camera position and zoom so all nodes fit in view (~10% padding).
      * Falls back to camera.reset() when there are no nodes.

package/src/index.ts

@@ -1,40 +1,66 @@
-export * from './graph';
-export * from './node';
-
-import { ContextMenuConfig, ContextMenuItemConfig, ContextMenuItemState } from './contextMenu';
-export { ContextMenuConfig, ContextMenuItemConfig, ContextMenuItemState };
-
-import { Theme } from './theme';
-export { Theme };
-
-import { Publisher, PublisherConfig } from './nodes/publisher';
-export { Publisher, PublisherConfig };
-
-import { FlowNote, FlowNoteConfig, NoteContentChangeCallback, NoteWidthChangeCallback } from './notes/note';
-export { FlowNote, FlowNoteConfig, NoteContentChangeCallback, NoteWidthChangeCallback };
-
-import {
-    NoteAddedCallback, NoteDragStartCallback, NoteDragStopCallback,
-    NoteRemovedCallback, NoteSubsystemConfig
-} from './notes/subsystem';
-export {
-    NoteAddedCallback, NoteDragStartCallback, NoteDragStopCallback,
-    NoteRemovedCallback, NoteSubsystemConfig
-};
-
-// Widgets
-import { NumberWidget } from './widgets/number';
-import { ColorWidget } from './widgets/color';
-import { StringWidget } from './widgets/string';
-import { TextWidget } from './widgets/text';
-import { ButtonWidget } from './widgets/button';
-import { ToggleWidget } from './widgets/toggle';
-import { SliderWidget } from './widgets/slider';
-import { ImageWidget } from './widgets/image';
-export {
-    NumberWidget, ColorWidget, StringWidget, TextWidget,
-    ButtonWidget, ToggleWidget, SliderWidget, ImageWidget
-};
-
-import { GlobalWidgetFactory } from './widgets/factory';
-export { GlobalWidgetFactory };
+export * from './graph';
+export * from './node';
+
+import { ContextMenuConfig, ContextMenuItemConfig, ContextMenuItemState } from './contextMenu';
+export { ContextMenuConfig, ContextMenuItemConfig, ContextMenuItemState };
+
+import { Theme } from './theme';
+export { Theme };
+
+import { Publisher, PublisherConfig } from './nodes/publisher';
+export { Publisher, PublisherConfig };
+
+import { FlowNote, FlowNoteConfig, NoteContentChangeCallback, NoteWidthChangeCallback } from './notes/note';
+export { FlowNote, FlowNoteConfig, NoteContentChangeCallback, NoteWidthChangeCallback };
+
+import {
+    NoteAddedCallback, NoteDragStartCallback, NoteDragStopCallback,
+    NoteRemovedCallback, NoteSubsystemConfig
+} from './notes/subsystem';
+export {
+    NoteAddedCallback, NoteDragStartCallback, NoteDragStopCallback,
+    NoteRemovedCallback, NoteSubsystemConfig
+};
+
+// Ports
+import { Port, PortConfig, PortStyle, PortType, portsCompatible } from './port';
+export { Port, PortConfig, PortStyle, PortType, portsCompatible };
+
+// Connections
+import {
+    Connection, ConnectionRenderer, ConnectionRendererParams, DefaultConnectionRenderer
+} from './connection';
+export { Connection, ConnectionRenderer, ConnectionRendererParams, DefaultConnectionRenderer };
+
+// Node factory
+import { NodeCreatedCallback, NodeFactory, NodeFactoryConfig } from './nodes/factory';
+export { NodeCreatedCallback, NodeFactory, NodeFactoryConfig };
+
+// Widgets
+import { Widget } from './widgets/widget';
+import { NumberWidget, NumberWidgetConfig } from './widgets/number';
+import { ColorWidget, ColorWidgetConfig } from './widgets/color';
+import { StringWidget, StringWidgetConfig } from './widgets/string';
+import { TextWidget, TextWidgetConfig } from './widgets/text';
+import { ButtonWidget, ButtonWidgetConfig } from './widgets/button';
+import { ToggleWidget, ToggleWidgetConfig, ToggleStyleConfig } from './widgets/toggle';
+import { SliderWidget, SliderWidgetConfig } from './widgets/slider';
+import { ImageWidget, ImageWidgetConfig } from './widgets/image';
+export {
+    Widget,
+    NumberWidget, ColorWidget, StringWidget, TextWidget,
+    ButtonWidget, ToggleWidget, SliderWidget, ImageWidget
+};
+export type {
+    NumberWidgetConfig, ColorWidgetConfig, StringWidgetConfig, TextWidgetConfig,
+    ButtonWidgetConfig, ToggleWidgetConfig, ToggleStyleConfig, SliderWidgetConfig,
+    ImageWidgetConfig
+};
+
+import { GlobalWidgetFactory, WidgetBuilder, WidgetFactory } from './widgets/factory';
+export { GlobalWidgetFactory, WidgetFactory };
+export type { WidgetBuilder };
+
+import { Box } from './types/box';
+import { Vector2 } from './types/vector2';
+export type { Box, Vector2 };

package/src/markdown/entry.ts

@@ -7,6 +7,13 @@ export interface MarkdownEntry {
     render(ctx: CanvasRenderingContext2D, position: Vector2, scale: number, maxWidth: number): number
 }
 
+function onFontsLoaded(callback: () => void): void {
+    if (typeof document === "undefined" || document.fonts === undefined) {
+        return;
+    }
+    document.fonts.addEventListener("loadingdone", () => callback());
+}
+
 export class CodeBlockEntry {
 
     #text: Text
@@ -17,6 +24,10 @@ export class CodeBlockEntry {
 
     #calculatedForWidth: number;
 
+    text(): Text {
+        return this.#text;
+    }
+
     constructor(text: Text) {
         this.#text = text;
         this.#calculatedForWidth = -1
@@ -24,7 +35,7 @@ export class CodeBlockEntry {
         this.#calculatedEntries = new List<Text>();
         this.#calculatedPositions = new List<Vector2>();
 
-        document.fonts.addEventListener("loadingdone", (event) => {
+        onFontsLoaded(() => {
             this.#calculatedForWidth = -1
         });
     }
@@ -113,6 +124,10 @@ export class UnorderedListMarkdownEntry {
         this.#entries = entries;
     }
 
+    entries(): ReadonlyArray<BasicMarkdownEntry> {
+        return this.#entries;
+    }
+
     render(ctx: CanvasRenderingContext2D, position: Vector2, scale: number, maxWidth: number): number {
         let offset = 0;
         let shift = 20;
@@ -152,6 +167,10 @@ export class BasicMarkdownEntry {
 
     #calculatedForWidth: number;
 
+    lines(): ReadonlyArray<Text> {
+        return this.#entries;
+    }
+
     constructor(lines: Array<Text>, underline: boolean, background: boolean) {
         this.#entries = lines;
         this.#underline = underline;
@@ -161,7 +180,7 @@ export class BasicMarkdownEntry {
         this.#calculatedEntries = new List<Text>();
         this.#calculatedPositions = new List<Vector2>();
 
-        document.fonts.addEventListener("loadingdone", (event) => {
+        onFontsLoaded(() => {
             this.#calculatedForWidth = -1
         });
     }

package/src/markdown/lexicalParser.ts

@@ -37,32 +37,27 @@ export class MarkdownLexicalParser {
         return this.#body.charAt(this.#index);
     }
 
-    #lastToken = 0;
-    
-    #addToken(token: MarkdownTokenType, lexeme: string): void {
-        this.#tokens.push(new MarkdownToken(token, lexeme, this.#lastToken, this.#index));
-        this.#lastToken = this.#index;
-    }
+    #tokenStart = 0;
 
-    #h2(): void {
-        let char = this.#next();
-        if (char === "#") {
-            this.#addToken(MarkdownTokenType.H3, "###");
+    #addToken(token: MarkdownTokenType, lexeme: string, start?: number): void {
+        this.#tokens.push(new MarkdownToken(token, lexeme, start ?? this.#tokenStart, this.#index));
+    }
 
-            // Move it off the character for the next reading
+    #header(): void {
+        let count = 0;
+        while (this.#current() === "#") {
+            count++;
             this.#inc();
-        } else {
-            this.#addToken(MarkdownTokenType.H2, "##");
         }
-    }
 
-    #h1(): void {
-        let char = this.#next();
-        if (char === "#") {
-            this.#h2();
-        } else {
-            this.#addToken(MarkdownTokenType.H1, "#");
+        let type = MarkdownTokenType.H3;
+        if (count === 1) {
+            type = MarkdownTokenType.H1;
+        } else if (count === 2) {
+            type = MarkdownTokenType.H2;
         }
+
+        this.#addToken(type, "#".repeat(count));
     }
 
     #whiteSpace(): void {
@@ -110,34 +105,29 @@ export class MarkdownLexicalParser {
         }
 
         if (started != -1) {
-            this.#addToken(MarkdownTokenType.Text, this.#body.substring(started, this.#index))
+            this.#addToken(MarkdownTokenType.Text, this.#body.substring(started, this.#index), started)
         }
     }
 
-    // S( ) => S
-    // S(\t) => S
-    // S(#) => H1
-    // H1(#) => H2
-    // H1(!#) => S
-    // H2(#) => H3
-    // H2(#) => H3
     parse(): void {
         let char = this.#current();
 
         while (char !== "") {
+            this.#tokenStart = this.#index;
+
             if (char === " " || char === "\t") {
                 this.#whiteSpace();
             } else if (char === "#") {
-                this.#h1();
+                this.#header();
             } else if (char === "\n") {
-                this.#addToken(MarkdownTokenType.NewLine, "\n");
                 this.#inc();
+                this.#addToken(MarkdownTokenType.NewLine, "\n");
             } else if (char === "*") {
-                this.#addToken(MarkdownTokenType.Star, "*");
                 this.#inc();
+                this.#addToken(MarkdownTokenType.Star, "*");
             } else if (char === "`") {
-                this.#addToken(MarkdownTokenType.BackTick, "`");
                 this.#inc();
+                this.#addToken(MarkdownTokenType.BackTick, "`");
             } else {
                 this.#text();
             }

package/src/markdown/syntaxParser.ts

@@ -31,21 +31,18 @@ export class MarkdownSyntaxParser {
 
     #next(): MarkdownToken | null {
         this.#index++
-        if (this.#index >= this.#tokens.length - 1) {
+        if (this.#index >= this.#tokens.length) {
             return null
         }
         return this.#tokens[this.#index];
     }
 
     #peak(): MarkdownToken | null {
-        if (this.#index + 1 >= this.#tokens.length - 1) {
-            return null
-        }
-        return this.#tokens[this.#index + 1];
+        return this.#peakInto(1);
     }
 
     #peakInto(amount: number): MarkdownToken | null {
-        if (this.#index + amount >= this.#tokens.length - 1) {
+        if (this.#index + amount >= this.#tokens.length) {
             return null
         }
         return this.#tokens[this.#index + amount];
@@ -53,82 +50,107 @@ export class MarkdownSyntaxParser {
 
     #emphasis(): Array<Text> {
 
-        // Cases to consider
-        // =================
-        // 1.  *a*:      <i>a</i>
-        // 2.  **a**:    <b>a</b>
-        // 3.  **a*:     *<i>a</i> <----- fuck this one
-        // 4.  ***a**:   *<b>a</b> <----- fuck this one
-        // 5.  *a**:     <i>a</i>*
-        // 6.  **a***:   <b>a</b>*
-        // 7.  * a *:    * a *
-        // 8.  ** a **:  ** a **
-        // 9.  **a **:   **a **
-        // 10. **a f**:  <b>a f<b>
-        // 11. * Test:   <ul>Test</ul> 
-
-        let token = this.#next();
-        if (token?.type() === MarkdownTokenType.Space) {
+        // Count the stars either side of the content and match as many as
+        // both ends can supply; the rest stay on the line as characters.
+        //
+        // *a*     -> <i>a</i>          **a*    -> *<i>a</i>
+        // **a**   -> <b>a</b>          *a**    -> <i>a</i>*
+        // **a f** -> <b>a f</b>        *a      -> *a
+        // ** a ** -> ** a **           **a **  -> **a **
+
+        // A star with a space after it opens nothing, so leave the space
+        // where it is rather than consuming it - the caller still has to
+        // read it as part of the line.
+        if (this.#peak()?.type() === MarkdownTokenType.Space) {
             return [new Text("*")];
         }
 
-        let bold = false;
-        // Read off all leading stars
-        while (token !== null && token.type() === MarkdownTokenType.Star) {
-            bold = true;
-            token = this.#next();
-        }
-
-        let textContent = "";
+        const openers = this.#runOfStars();
 
-        let boldClosed = false;
-        let startingClose = false;
-        let validClose = false;
-        while (token !== null && token.type() !== MarkdownTokenType.NewLine) {
+        let content = "";
+        let closers = 0;
+        while (true) {
+            const token = this.#current();
+            if (token === null || token.type() === MarkdownTokenType.NewLine) {
+                break;
+            }
             if (token.type() === MarkdownTokenType.Star) {
+                closers = this.#runOfStars();
+                break;
+            }
+            content += token.lexeme();
+            this.#inc();
+        }
 
-                // This is the second star we've seen in a row. We're done!
-                if (startingClose) {
-                    boldClosed = true;
-                    break;
-                }
+        // Leave the reader on the last token taken, since the caller steps
+        // forward once more before looking at anything.
+        this.#index--;
 
-                // If we're not bold, we just need a single star to close this off.
-                startingClose = true;
-                if (bold === false) {
-                    break;
-                }
-            }
+        // A run of stars only emphasises what it hugs. With a space against
+        // the inside of either end, or nothing between them at all, the
+        // stars are just stars.
+        const hugsContent = content !== ""
+            && content.trimStart() === content
+            && content.trimEnd() === content;
 
-            if (startingClose && token.type() !== MarkdownTokenType.Star) {
-                break;
-            }
+        const matched = hugsContent ? Math.min(openers, closers) : 0;
+        if (matched === 0) {
+            return [new Text("*".repeat(openers) + content + "*".repeat(closers))];
+        }
 
-            // Add to string content...
-            if (token.type() === MarkdownTokenType.Text) {
-                textContent += token.lexeme();
-                validClose = true;
-            }
+        const style: TextStyleConfig = {};
+        if (matched >= 2) {
+            style.weight = FontWeight.Bold;
+        } else {
+            style.style = FontStyle.Italic;
+        }
 
-            if (token.type() === MarkdownTokenType.Space) {
-                textContent += token.lexeme();
-                validClose = false;
-            }
+        // Stars past the pair that matched were never part of the emphasis,
+        // so they stay on the line as the characters they are.
+        const runs = new Array<Text>();
+        if (openers > matched) {
+            runs.push(new Text("*".repeat(openers - matched)));
+        }
+        runs.push(new Text(content, style));
+        if (closers > matched) {
+            runs.push(new Text("*".repeat(closers - matched)));
+        }
+        return runs;
+    }
 
-            token = this.#next();
+    /** Consumes a run of stars, leaving the reader on the token after it. */
+    #runOfStars(): number {
+        let count = 0;
+        while (this.#current()?.type() === MarkdownTokenType.Star) {
+            count++;
+            this.#inc();
         }
+        return count;
+    }
 
-        const style: TextStyleConfig = {}
+    /**
+     * Reads `code` up to the closing backtick on the same line. An opening
+     * backtick with no partner is only a backtick.
+     */
+    #inlineCode(): Array<Text> {
+        const opened = this.#index;
 
-        if (validClose && startingClose) {
-            if (boldClosed) {
-                style.weight = FontWeight.Bold;
-            } else {
-                style.style = FontStyle.Italic;
+        this.#inc();
+        let content = "";
+        while (true) {
+            const token = this.#current();
+            if (token === null || token.type() === MarkdownTokenType.NewLine) {
+                this.#index = opened;
+                return [new Text("`")];
             }
+            if (token.type() === MarkdownTokenType.BackTick) {
+                break;
+            }
+            content += token.lexeme();
+            this.#inc();
         }
 
-        return [new Text(textContent, style)]
+        return [new Text(content, { font: "monospace" })];
     }
 
     #text(): Array<Text> {
@@ -153,13 +175,16 @@ export class MarkdownSyntaxParser {
                     break;
 
                 case MarkdownTokenType.Star:
+                case MarkdownTokenType.BackTick:
                     if (textContent !== "") {
                         contents.push(new Text(textContent))
                         textContent = "";
                     }
-                    let starText = this.#emphasis()
-                    for (let i = 0; i < starText.length; i++) {
-                        contents.push(starText[i]);
+                    const runs = token.type() === MarkdownTokenType.Star
+                        ? this.#emphasis()
+                        : this.#inlineCode();
+                    for (let i = 0; i < runs.length; i++) {
+                        contents.push(runs[i]);
                     }
                     break;
             }