@hpcc-js/wasm-graphviz 1.25.0 → 1.27.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@hpcc-js/wasm-graphviz",
-  "version": "1.25.0",
+  "version": "1.27.0",
   "description": "hpcc-js - WASM Graphviz",
   "type": "module",
   "exports": {
@@ -56,5 +56,5 @@
   },
   "homepage": "https://hpcc-systems.github.io/hpcc-js-wasm/",
   "license": "Apache-2.0",
-  "gitHead": "e9302b649306927c2844eda31d3ee58b17b8eb8a"
+  "gitHead": "489d0efe182d908652e5dea34891a6c26b760780"
 }

package/src/graphviz.ts

@@ -5,7 +5,8 @@ import type {
     NodeDotAttr, NodeAttrs,
     EdgeDotAttr, EdgeAttrs,
     ClusterDotAttr, ClusterAttrs,
-    GraphDotAttr, GraphAttrs as GraphAttrs
+    GraphDotAttr, GraphAttrs,
+    Format, Engine
 } from "./types.ts";
 
 type AttrValues<T> = Partial<{ [K in keyof T]: NonNullable<T[K]> }>;
@@ -24,11 +25,6 @@ function applyAttrs<T extends object>(
     }
 }
 
-/**
- * Various graphic and data formats for end user, web, documents and other applications.  See [Output Formats](https://graphviz.org/docs/outputs/) for more information.
- */
-export type Format = "svg" | "svg_inline" | "dot" | "json" | "dot_json" | "xdot_json" | "plain" | "plain-ext" | "canon";
-
 /**
  * An edge returned by graph-traversal methods.
  */
@@ -58,11 +54,6 @@ function parseEdges(json: string): EdgeInfo[] {
     return result;
 }
 
-/**
- * Various algorithms for projecting abstract graphs into a space for visualization.  See [Layout Engines](https://graphviz.org/docs/layouts/) for more details.
- */
-export type Engine = "circo" | "dot" | "fdp" | "sfdp" | "neato" | "osage" | "patchwork" | "twopi" | "nop" | "nop2";
-
 /**
  * Example:  Passing a web hosted Image to GraphViz:
  * ```ts
@@ -165,7 +156,7 @@ export type ClusterInit = SubgraphInit;
 /**
  * A subgraph (or cluster) inside a {@link Graph}.
  *
- * Obtain via {@link Graph.addSubgraph}.  All mutation methods return `this`
+ * Obtain via {@link Graph.addSubgraph} or {@link Subgraph.addSubgraph}.  All mutation methods return `this`
  * for chaining.  **Call {@link Subgraph.delete} (or use the `using` keyword)
  * when finished** to free the underlying WASM wrapper — the actual subgraph
  * data is owned by the parent {@link Graph} and is freed with it.
@@ -193,10 +184,10 @@ export class Subgraph {
     /**
      * Create (or find) a node and add it to this subgraph.
      */
-    addNode(name: string): this;
+    addNode(name: string, attrs?: AttrValues<NodeAttrs>, htmlAttrs?: AttrValues<NodeAttrs>): this;
     addNode(init: NodeInit): this;
-    addNode(nameOrInit: string | NodeInit): this {
-        const init = typeof nameOrInit === "string" ? { name: nameOrInit } : nameOrInit;
+    addNode(nameOrInit: string | NodeInit, nodeAttrs?: AttrValues<NodeAttrs>, nodeHtmlAttrs?: AttrValues<NodeAttrs>): this {
+        const init = typeof nameOrInit === "string" ? { name: nameOrInit, attrs: nodeAttrs, htmlAttrs: nodeHtmlAttrs } : nameOrInit;
         const { name, attrs, htmlAttrs } = init;
 
         this._sg.addNode(name);
@@ -209,11 +200,14 @@ export class Subgraph {
      * Create an edge inside this subgraph.  Both endpoints are created
      * automatically if they do not already exist.
      */
-    addEdge(tail: string, head: string, key?: string): this;
+    addEdge(tail: string, head: string, attrs?: AttrValues<EdgeAttrs>, htmlAttrs?: AttrValues<EdgeAttrs>): this;
+    addEdge(tail: string, head: string, key: string, attrs?: AttrValues<EdgeAttrs>, htmlAttrs?: AttrValues<EdgeAttrs>): this;
     addEdge(init: EdgeInit): this;
-    addEdge(tailOrInit: string | EdgeInit, head?: string, key: string = ""): this {
+    addEdge(tailOrInit: string | EdgeInit, head?: string, keyOrAttrs: string | AttrValues<EdgeAttrs> = "", attrsOrHtmlAttrs?: AttrValues<EdgeAttrs>, maybeHtmlAttrs?: AttrValues<EdgeAttrs>): this {
         const init = typeof tailOrInit === "string"
-            ? { tail: tailOrInit, head: head!, key }
+            ? typeof keyOrAttrs === "string"
+                ? { tail: tailOrInit, head: head!, key: keyOrAttrs, attrs: attrsOrHtmlAttrs, htmlAttrs: maybeHtmlAttrs }
+                : { tail: tailOrInit, head: head!, attrs: keyOrAttrs, htmlAttrs: attrsOrHtmlAttrs }
             : tailOrInit;
         const { tail, head: resolvedHead, key: resolvedKey = "", attrs, htmlAttrs } = init;
 
@@ -223,6 +217,18 @@ export class Subgraph {
         return this;
     }
 
+    /**
+     * Create (or return an existing) named subgraph under this subgraph.
+     */
+    addSubgraph(name: string, attrs?: AttrValues<ClusterAttrs>, htmlAttrs?: AttrValues<ClusterAttrs>): Subgraph;
+    addSubgraph(init: SubgraphInit): Subgraph;
+    addSubgraph(nameOrInit: string | SubgraphInit, attrs?: AttrValues<ClusterAttrs>, htmlAttrs?: AttrValues<ClusterAttrs>): Subgraph {
+        const init = typeof nameOrInit === "string" ? { name: nameOrInit, attrs, htmlAttrs } : nameOrInit;
+        // addSubgraph only returns null when the internal subgraph pointer is null,
+        // which cannot happen while this Subgraph instance is alive.
+        return new Subgraph(this._sg.addSubgraph(init.name)!).applyInit(init);
+    }
+
     applyInit(init: SubgraphInit): this {
         applyAttrs<ClusterAttrs>(init.attrs, (attr, value) => this.setAttr(attr, value));
         applyAttrs<ClusterAttrs>(init.htmlAttrs, (attr, value) => this.setHtmlAttr(attr, value));
@@ -560,14 +566,25 @@ export class Graph {
         this._module = module;
     }
 
+    private ensureDefaultFonts(includeNodeAndEdgeDefaults: boolean): void {
+        if (this.getGraphAttr("fontname") === "") {
+            this.setGraphAttr("fontname", "Arial");
+        }
+        this.setDefaultGraphAttr("fontname", "Arial");
+        if (includeNodeAndEdgeDefaults) {
+            this.setDefaultNodeAttr("fontname", "Arial");
+            this.setDefaultEdgeAttr("fontname", "Arial");
+        }
+    }
+
     /**
      * Create a node.  If a node with this name already exists it is returned
      * unchanged.
      */
-    addNode(name: string): this;
+    addNode(name: string, attrs?: AttrValues<NodeAttrs>, htmlAttrs?: AttrValues<NodeAttrs>): this;
     addNode(init: NodeInit): this;
-    addNode(nameOrInit: string | NodeInit): this {
-        const init = typeof nameOrInit === "string" ? { name: nameOrInit } : nameOrInit;
+    addNode(nameOrInit: string | NodeInit, nodeAttrs?: AttrValues<NodeAttrs>, nodeHtmlAttrs?: AttrValues<NodeAttrs>): this {
+        const init = typeof nameOrInit === "string" ? { name: nameOrInit, attrs: nodeAttrs, htmlAttrs: nodeHtmlAttrs } : nameOrInit;
         const { name, attrs, htmlAttrs } = init;
 
         this._graph.addNode(name);
@@ -582,11 +599,14 @@ export class Graph {
      * parallel edges between the same pair of nodes; omit (or pass `""`) for
      * an anonymous edge.
      */
-    addEdge(tail: string, head: string, key?: string): this;
+    addEdge(tail: string, head: string, attrs?: AttrValues<EdgeAttrs>, htmlAttrs?: AttrValues<EdgeAttrs>): this;
+    addEdge(tail: string, head: string, key: string, attrs?: AttrValues<EdgeAttrs>, htmlAttrs?: AttrValues<EdgeAttrs>): this;
     addEdge(init: EdgeInit): this;
-    addEdge(tailOrInit: string | EdgeInit, head?: string, key: string = ""): this {
+    addEdge(tailOrInit: string | EdgeInit, head?: string, keyOrAttrs: string | AttrValues<EdgeAttrs> = "", attrsOrHtmlAttrs?: AttrValues<EdgeAttrs>, maybeHtmlAttrs?: AttrValues<EdgeAttrs>): this {
         const init = typeof tailOrInit === "string"
-            ? { tail: tailOrInit, head: head!, key }
+            ? typeof keyOrAttrs === "string"
+                ? { tail: tailOrInit, head: head!, key: keyOrAttrs, attrs: attrsOrHtmlAttrs, htmlAttrs: maybeHtmlAttrs }
+                : { tail: tailOrInit, head: head!, attrs: keyOrAttrs, htmlAttrs: attrsOrHtmlAttrs }
             : tailOrInit;
         const { tail, head: resolvedHead, key: resolvedKey = "", attrs, htmlAttrs } = init;
 
@@ -597,6 +617,7 @@ export class Graph {
     }
 
     applyInit(init: GraphInit): this {
+        this.ensureDefaultFonts(true);
         applyAttrs<GraphAttrs>(init.attrs, (attr, value) => this.setGraphAttr(attr, value));
         applyAttrs<GraphAttrs>(init.htmlAttrs, (attr, value) => this.setGraphHtmlAttr(attr, value));
         return this;
@@ -610,6 +631,7 @@ export class Graph {
         if (!this._graph.read(dotSource)) {
             throw new Error("Invalid DOT source");
         }
+        this.ensureDefaultFonts(false);
         return this;
     }
 
@@ -879,18 +901,18 @@ export class Graph {
     // ---- Graph traversal ------------------------------------------------
 
     /**
-     * Returns the names of all nodes in the graph (in internal iteration
-     * order).
+     * Returns the names of all direct subgraphs.
      */
-    nodeNames(): string[] {
-        return parseNames(this._graph.nodeNames());
+    subgraphNames(): string[] {
+        return parseNames(this._graph.subgraphNames());
     }
 
     /**
-     * Returns the names of all direct subgraphs.
+     * Returns the names of all nodes in the graph (in internal iteration
+     * order).
      */
-    subgraphNames(): string[] {
-        return parseNames(this._graph.subgraphNames());
+    nodeNames(): string[] {
+        return parseNames(this._graph.nodeNames());
     }
 
     /**
@@ -938,10 +960,10 @@ export class Graph {
      * cluster.setAttr("label", "My Cluster").addEdge("a", "b");
      * ```
      */
-    addSubgraph(name: string): Subgraph;
+    addSubgraph(name: string, attrs?: AttrValues<ClusterAttrs>, htmlAttrs?: AttrValues<ClusterAttrs>): Subgraph;
     addSubgraph(init: SubgraphInit): Subgraph;
-    addSubgraph(nameOrInit: string | SubgraphInit): Subgraph {
-        const init = typeof nameOrInit === "string" ? { name: nameOrInit } : nameOrInit;
+    addSubgraph(nameOrInit: string | SubgraphInit, attrs?: AttrValues<ClusterAttrs>, htmlAttrs?: AttrValues<ClusterAttrs>): Subgraph {
+        const init = typeof nameOrInit === "string" ? { name: nameOrInit, attrs, htmlAttrs } : nameOrInit;
         // addSubgraph only returns null when the internal graph pointer is null,
         // which cannot happen while this Graph instance is alive.
         return new Subgraph(this._graph.addSubgraph(init.name)!).applyInit(init);

package/src/index.ts

@@ -1 +1,2 @@
+export * from "./types.ts";
 export * from "./graphviz.ts";

package/src/types.ts

@@ -611,3 +611,13 @@ export const GRAPH_DOT_ATTRS: readonly GraphDotAttr[] = attrsOf<GraphDotAttr>({
     voro_margin: true,
     xdotversion: true,
 });
+
+/**
+ * Various graphic and data formats for end user, web, documents and other applications.  See [Output Formats](https://graphviz.org/docs/outputs/) for more information.
+ */
+export type Format = "svg" | "svg_inline" | "dot" | "json" | "dot_json" | "xdot_json" | "plain" | "plain-ext" | "canon";
+
+/**
+ * Various algorithms for projecting abstract graphs into a space for visualization.  See [Layout Engines](https://graphviz.org/docs/layouts/) for more details.
+ */
+export type Engine = "circo" | "dot" | "fdp" | "sfdp" | "neato" | "osage" | "patchwork" | "twopi" | "nop" | "nop2";

package/types/graphviz.d.ts

@@ -1,12 +1,8 @@
 import type { MainModule, CGraph as CGraphWasm, CSubgraph as CSubgraphWasm } from "../types/graphvizlib.js";
-import type { NodeDotAttr, NodeAttrs, EdgeDotAttr, EdgeAttrs, ClusterDotAttr, ClusterAttrs, GraphDotAttr, GraphAttrs as GraphAttrs } from "./types.ts";
+import type { NodeDotAttr, NodeAttrs, EdgeDotAttr, EdgeAttrs, ClusterDotAttr, ClusterAttrs, GraphDotAttr, GraphAttrs, Format, Engine } from "./types.ts";
 type AttrValues<T> = Partial<{
     [K in keyof T]: NonNullable<T[K]>;
 }>;
-/**
- * Various graphic and data formats for end user, web, documents and other applications.  See [Output Formats](https://graphviz.org/docs/outputs/) for more information.
- */
-export type Format = "svg" | "svg_inline" | "dot" | "json" | "dot_json" | "xdot_json" | "plain" | "plain-ext" | "canon";
 /**
  * An edge returned by graph-traversal methods.
  */
@@ -21,10 +17,6 @@ export interface EdgeInfo {
      */
     key: string;
 }
-/**
- * Various algorithms for projecting abstract graphs into a space for visualization.  See [Layout Engines](https://graphviz.org/docs/layouts/) for more details.
- */
-export type Engine = "circo" | "dot" | "fdp" | "sfdp" | "neato" | "osage" | "patchwork" | "twopi" | "nop" | "nop2";
 /**
  * Example:  Passing a web hosted Image to GraphViz:
  * ```ts
@@ -94,7 +86,7 @@ export type ClusterInit = SubgraphInit;
 /**
  * A subgraph (or cluster) inside a {@link Graph}.
  *
- * Obtain via {@link Graph.addSubgraph}.  All mutation methods return `this`
+ * Obtain via {@link Graph.addSubgraph} or {@link Subgraph.addSubgraph}.  All mutation methods return `this`
  * for chaining.  **Call {@link Subgraph.delete} (or use the `using` keyword)
  * when finished** to free the underlying WASM wrapper — the actual subgraph
  * data is owned by the parent {@link Graph} and is freed with it.
@@ -118,14 +110,20 @@ export declare class Subgraph {
     /**
      * Create (or find) a node and add it to this subgraph.
      */
-    addNode(name: string): this;
+    addNode(name: string, attrs?: AttrValues<NodeAttrs>, htmlAttrs?: AttrValues<NodeAttrs>): this;
     addNode(init: NodeInit): this;
     /**
      * Create an edge inside this subgraph.  Both endpoints are created
      * automatically if they do not already exist.
      */
-    addEdge(tail: string, head: string, key?: string): this;
+    addEdge(tail: string, head: string, attrs?: AttrValues<EdgeAttrs>, htmlAttrs?: AttrValues<EdgeAttrs>): this;
+    addEdge(tail: string, head: string, key: string, attrs?: AttrValues<EdgeAttrs>, htmlAttrs?: AttrValues<EdgeAttrs>): this;
     addEdge(init: EdgeInit): this;
+    /**
+     * Create (or return an existing) named subgraph under this subgraph.
+     */
+    addSubgraph(name: string, attrs?: AttrValues<ClusterAttrs>, htmlAttrs?: AttrValues<ClusterAttrs>): Subgraph;
+    addSubgraph(init: SubgraphInit): Subgraph;
     applyInit(init: SubgraphInit): this;
     /**
      * Remove a node from this subgraph only.  The node (and any edges
@@ -303,11 +301,12 @@ export declare class Graph {
     private _module;
     /** @internal */
     constructor(g: CGraphWasm, module: MainModule);
+    private ensureDefaultFonts;
     /**
      * Create a node.  If a node with this name already exists it is returned
      * unchanged.
      */
-    addNode(name: string): this;
+    addNode(name: string, attrs?: AttrValues<NodeAttrs>, htmlAttrs?: AttrValues<NodeAttrs>): this;
     addNode(init: NodeInit): this;
     /**
      * Create an edge from `tail` to `head`.  Both nodes are created
@@ -315,7 +314,8 @@ export declare class Graph {
      * parallel edges between the same pair of nodes; omit (or pass `""`) for
      * an anonymous edge.
      */
-    addEdge(tail: string, head: string, key?: string): this;
+    addEdge(tail: string, head: string, attrs?: AttrValues<EdgeAttrs>, htmlAttrs?: AttrValues<EdgeAttrs>): this;
+    addEdge(tail: string, head: string, key: string, attrs?: AttrValues<EdgeAttrs>, htmlAttrs?: AttrValues<EdgeAttrs>): this;
     addEdge(init: EdgeInit): this;
     applyInit(init: GraphInit): this;
     /**
@@ -451,15 +451,15 @@ export declare class Graph {
      * Pass `key = ""` for the first (or only) edge between `tail` and `head`.
      */
     getEdgeAttr(tail: string, head: string, key: string, attr: string): string;
+    /**
+     * Returns the names of all direct subgraphs.
+     */
+    subgraphNames(): string[];
     /**
      * Returns the names of all nodes in the graph (in internal iteration
      * order).
      */
     nodeNames(): string[];
-    /**
-     * Returns the names of all direct subgraphs.
-     */
-    subgraphNames(): string[];
     /**
      * Returns all edges in the graph.  Each unique edge is listed exactly
      * once.
@@ -493,7 +493,7 @@ export declare class Graph {
      * cluster.setAttr("label", "My Cluster").addEdge("a", "b");
      * ```
      */
-    addSubgraph(name: string): Subgraph;
+    addSubgraph(name: string, attrs?: AttrValues<ClusterAttrs>, htmlAttrs?: AttrValues<ClusterAttrs>): Subgraph;
     addSubgraph(init: SubgraphInit): Subgraph;
     /**
      * Look up an existing subgraph by name without creating a new one.

package/types/graphvizlib.d.ts

@@ -122,6 +122,7 @@ export interface CSubgraph extends ClassHandle {
   addNode(_0: EmbindString): void;
   addEdge(_0: EmbindString, _1: EmbindString): void;
   addEdge(_0: EmbindString, _1: EmbindString, _2: EmbindString): void;
+  addSubgraph(_0: EmbindString): CSubgraph | null;
   setAttr(_0: EmbindString, _1: EmbindString): void;
   setAttr(_0: EmbindString, _1: EmbindString, _2: EmbindString): void;
   setHtmlAttr(_0: EmbindString, _1: EmbindString): void;

package/types/index.d.ts

@@ -1 +1,2 @@
+export * from "./types.ts";
 export * from "./graphviz.ts";

package/types/types.d.ts

@@ -299,4 +299,12 @@ export declare const EDGE_DOT_ATTRS: readonly EdgeDotAttr[];
 export declare const CLUSTER_DOT_ATTRS: readonly ClusterDotAttr[];
 /** Graph DOT attributes (excludes write-only: bb, lheight, lp, lwidth; and non-DOT: type) */
 export declare const GRAPH_DOT_ATTRS: readonly GraphDotAttr[];
+/**
+ * Various graphic and data formats for end user, web, documents and other applications.  See [Output Formats](https://graphviz.org/docs/outputs/) for more information.
+ */
+export type Format = "svg" | "svg_inline" | "dot" | "json" | "dot_json" | "xdot_json" | "plain" | "plain-ext" | "canon";
+/**
+ * Various algorithms for projecting abstract graphs into a space for visualization.  See [Layout Engines](https://graphviz.org/docs/layouts/) for more details.
+ */
+export type Engine = "circo" | "dot" | "fdp" | "sfdp" | "neato" | "osage" | "patchwork" | "twopi" | "nop" | "nop2";
 export {};