@hpcc-js/tree 2.44.0 → 2.45.1

package/package.json

@@ -1,54 +1,56 @@
 {
     "name": "@hpcc-js/tree",
-    "version": "2.44.0",
+    "version": "2.45.1",
     "description": "hpcc-js - Viz Tree",
-    "type": "module",
-    "main": "./dist/index.umd.cjs",
-    "module": "./dist/index.js",
-    "exports": {
-        ".": {
-            "types": "./types/index.d.ts",
-            "import": "./dist/index.js",
-            "require": "./dist/index.umd.cjs"
-        },
-        "./dist/*": "./dist/*"
+    "main": "dist/index.js",
+    "module": "dist/index.es6",
+    "unpkg": "dist/index.min.js",
+    "jsdelivr": "dist/index.min.js",
+    "types": "types/index.d.ts",
+    "typesVersions": {
+        "<3.8": {
+            "*": [
+                "types-3.4/index.d.ts"
+            ]
+        }
     },
-    "browser": "./dist/index.umd.cjs",
-    "types": "./types/index.d.ts",
     "files": [
         "dist/*",
-        "src/*",
-        "types/*"
+        "types/*",
+        "types-3.4/*",
+        "src/*"
     ],
     "scripts": {
-        "clean": "rimraf --glob lib* types dist *.tsbuildinfo .turbo",
-        "bundle": "vite build",
-        "bundle-watch": "vite --port 5519",
-        "gen-types": "tsc --project tsconfig.json",
-        "gen-types-watch": "npm run gen-types -- --watch",
-        "build": "run-p gen-types bundle",
+        "clean": "rimraf --glob lib* types dist *.tsbuildinfo",
+        "compile-es6": "tsc --module es6 --outDir ./lib-es6",
+        "compile-es6-watch": "npm run compile-es6 -- -w",
+        "compile-umd": "tsc --module umd --outDir ./lib-umd",
+        "compile-umd-watch": "npm run compile-umd -- -w",
+        "bundle": "rollup -c",
+        "bundle-watch": "npm run bundle -- -w",
+        "minimize": "terser dist/index.js -c -m --source-map \"content='dist/index.js.map',url='index.min.js.map'\" -o dist/index.min.js",
+        "gen-legacy-types": "downlevel-dts ./types ./types-3.4",
+        "build": "npm run compile-es6 && npm run bundle",
+        "watch": "npm-run-all compile-es6 -p compile-es6-watch bundle-watch",
+        "stamp": "node ../../node_modules/@hpcc-js/bundle/src/stamp.js",
         "lint": "eslint ./src",
-        "lint-fix": "eslint --fix src/**/*.ts",
         "docs": "typedoc --options tdoptions.json .",
-        "test-browser": "vitest run --project browser",
-        "test": "vitest run",
-        "coverage": "vitest run --coverage",
-        "update": "npx --yes npm-check-updates -u -t minor",
-        "update-major": "npx --yes npm-check-updates -u"
+        "update": "npx --yes npm-check-updates -u -t minor"
     },
     "dependencies": {
-        "@hpcc-js/api": "^3.3.12",
-        "@hpcc-js/common": "^3.4.2"
+        "@hpcc-js/api": "^2.14.3",
+        "@hpcc-js/common": "^2.73.3"
     },
     "devDependencies": {
-        "@hpcc-js/esbuild-plugins": "^1.5.2",
+        "@hpcc-js/bundle": "^2.12.0",
         "@types/d3-transition": "1.3.6",
         "d3-hierarchy": "^1",
         "d3-interpolate": "^1",
         "d3-scale": "^1",
         "d3-selection": "^1",
         "d3-shape": "^1",
-        "d3-transition": "^1"
+        "d3-transition": "^1",
+        "tslib": "2.8.1"
     },
     "repository": {
         "type": "git",
@@ -61,5 +63,5 @@
         "url": "https://github.com/hpcc-systems/Visualization/issues"
     },
     "homepage": "https://github.com/hpcc-systems/Visualization",
-    "gitHead": "a35882216a554b24a2586f30ce829d511941aecd"
+    "gitHead": "0907b8d15d369c89483954a1d96e2247ba020cb6"
 }

package/src/CirclePacking.css

@@ -1,16 +1,16 @@
-.tree_CirclePacking circle {
-  fill: rgb(31, 119, 180);
-  fill-opacity: .25;
-  stroke: rgb(31, 119, 180);
-  stroke-width: 1px;
-}
-
-.tree_CirclePacking .leaf circle {
-  fill: #ff7f0e;
-  fill-opacity: 1;
-}
-
-.tree_CirclePacking .label {
-  fill:white;
-  text-anchor: middle;
-}
+.tree_CirclePacking circle {
+  fill: rgb(31, 119, 180);
+  fill-opacity: .25;
+  stroke: rgb(31, 119, 180);
+  stroke-width: 1px;
+}
+
+.tree_CirclePacking .leaf circle {
+  fill: #ff7f0e;
+  fill-opacity: 1;
+}
+
+.tree_CirclePacking .label {
+  fill:white;
+  text-anchor: middle;
+}

package/src/CirclePacking.ts

@@ -1,152 +1,148 @@
-import { ITree } from "@hpcc-js/api";
-import { d3Event, SVGWidget } from "@hpcc-js/common";
-import { rgb as d3Rgb } from "d3-color";
-import { hierarchy as d3Hierarchy, pack as d3Pack } from "d3-hierarchy";
-import { interpolateZoom as d3InterpolateZoom } from "d3-interpolate";
-import "d3-transition";
-
-import "../src/CirclePacking.css";
-
-export class CirclePacking extends SVGWidget {
-    diameter;
-    pack;
-    svg;
-    _focus;
-    circle;
-    view;
-    protected _node;
-
-    constructor() {
-        super();
-        ITree.call(this);
-    }
-
-    enter(_domNode, element) {
-        this.diameter = Math.min(this.width(), this.height());
-
-        this.pack = d3Pack()
-            .size([this.diameter - 4, this.diameter - 4])
-            .padding(1.5)
-            ;
-
-        this.svg = element
-            .append("g")
-            ;
-    }
-
-    update(_domNode, _element) {
-        const context = this;
-
-        this.diameter = Math.min(this.width(), this.height());
-        this.pack
-            .size([this.diameter - 4, this.diameter - 4])
-            .padding(1.5)
-            ;
-
-        this._palette = this._palette.switch(this.paletteID());
-        if (this.useClonedPalette()) {
-            this._palette = this._palette.cloneNotExists(this.paletteID() + "_" + this.id());
-        }
-
-        this.svg.selectAll("circle").remove();
-        this.svg.selectAll("text").remove();
-
-        const root: any = d3Hierarchy(this.data())
-            .sum(function (d) {
-                return d && d.size ? d.size : 1;
-            }).sort(function (a, b) {
-                return a.value < b.value ? -1 : a.value > b.value ? 1 : 0;
-            })
-            ;
-        this._focus = root;
-        this.pack(root);
-
-        this.circle = this.svg.selectAll("circle").data(root.descendants())
-            .enter().append("circle")
-            .attr("class", function (d) { return d.parent ? d.children ? "node" : "node leaf" : "node root"; })
-            .style("fill", function (d) {
-                d.color = context.paletteDepthLevel_exists() && d.depth > context.paletteDepthLevel() ? d3Rgb(d.parent.color)[context.paletteDepthVariant()](1) : context._palette(d.data.label);
-                return d.color;
-            })
-            .on("click", function (d) { context.click(d.data, null, null); })
-            .on("dblclick", function (d) {
-                if (this._focus !== d) {
-                    context.zoom(d);
-                }
-                d3Event().stopPropagation();
-            })
-            ;
-        this.circle.append("title").text(function (d) { return d.data.label; });
-
-        this.svg.selectAll("text").data(root.descendants())
-            .enter().append("text")
-            .attr("class", "label")
-            .style("fill-opacity", function (d) { return d.parent === root ? 1 : 0; })
-            .style("display", function (d) { return d.parent === root ? null : "none"; })
-            .text(function (d) {
-                return d.data.label + (context.showSize() && typeof d.data.size !== "undefined" ? " " + d.data.size : "");
-            })
-            ;
-
-        this._node = this.svg.selectAll("circle,text");
-
-        this.zoomTo([root.x, root.y, root.r * 2]);
-    }
-
-    zoom(newFocus) {
-        this._focus = newFocus;
-        const context = this;
-        const transition = this.svg.transition()
-            .duration(d3Event().altKey ? 7500 : 750)
-            .tween("zoom", function () {
-                const i = d3InterpolateZoom(context.view, [context._focus.x, context._focus.y, context._focus.r * 2]);
-                return function (t) { context.zoomTo(i(t)); };
-            });
-
-        function showText(d) {
-            return (d === context._focus && !d.children) || d.parent === context._focus;
-        }
-
-        transition.selectAll("text")
-            .filter(function (d) { return showText(d) || this.style.display === "inline"; })
-            .style("fill-opacity", function (d) { return showText(d) ? 1 : 0; })
-            .on("start", function (d) { if (showText(d)) this.style.display = "inline"; })
-            .on("end", function (d) { if (!showText(d)) this.style.display = "none"; });
-    }
-
-    zoomTo(v) {
-        const k = this.diameter / v[2];
-        this.view = v;
-        this._node.attr("transform", function (d) { return "translate(" + (d.x - v[0]) * k + "," + (d.y - v[1]) * k + ")"; });
-        this.circle.attr("r", function (d) { return d.r * k; });
-    }
-}
-CirclePacking.prototype._class += " tree_CirclePacking";
-CirclePacking.prototype.implements(ITree.prototype);
-
-export interface CirclePacking {
-    _palette;
-
-    //  I2DChart  ---
-    click(row, column, selected): void;
-    dblclick(row, column, selected): void;
-
-    // Properties  ---
-    showSize(): boolean;
-    showSize(_: boolean): this;
-    paletteDepthLevel(): number;
-    paletteDepthLevel(_: number): this;
-    paletteDepthLevel_exists(): boolean;
-    paletteDepthVariant(): "brighter" | "darker";
-    paletteDepthVariant(_: "brighter" | "darker"): this;
-    paletteID(): string;
-    paletteID(_: string): this;
-    useClonedPalette(): boolean;
-    useClonedPalette(_: boolean): this;
-}
-
-CirclePacking.prototype.publish("showSize", true, "boolean", "Show size along with label");
-CirclePacking.prototype.publish("paletteDepthLevel", null, "number", "If not null then beyond this depth number the child node colors are based on parent", null, { optional: true });
-CirclePacking.prototype.publish("paletteDepthVariant", "brighter", "set", "Determines paletteDepthLevel decendant color shade variant", ["brighter", "darker"], { disable: w => w.paletteDepthLevel_exists() });
-CirclePacking.prototype.publish("paletteID", "default", "set", "Color palette for this widget", CirclePacking.prototype._palette.switch(), { tags: ["Basic", "Shared"] });
-CirclePacking.prototype.publish("useClonedPalette", false, "boolean", "Enable or disable using a cloned palette", null, { tags: ["Intermediate", "Shared"] });
+import { ITree } from "@hpcc-js/api";
+import { d3Event, SVGWidget } from "@hpcc-js/common";
+import { rgb as d3Rgb } from "d3-color";
+import { hierarchy as d3Hierarchy, pack as d3Pack } from "d3-hierarchy";
+import { interpolateZoom as d3InterpolateZoom } from "d3-interpolate";
+import "d3-transition";
+
+import "../src/CirclePacking.css";
+
+export class CirclePacking extends SVGWidget {
+    diameter;
+    pack;
+    svg;
+    _focus;
+    circle;
+    view;
+    protected _node;
+
+    constructor() {
+        super();
+        ITree.call(this);
+    }
+
+    enter(_domNode, element) {
+        this.diameter = Math.min(this.width(), this.height());
+
+        this.pack = d3Pack()
+            .size([this.diameter - 4, this.diameter - 4])
+            .padding(1.5)
+            ;
+
+        this.svg = element
+            .append("g")
+            ;
+    }
+
+    update(_domNode, _element) {
+        const context = this;
+
+        this.diameter = Math.min(this.width(), this.height());
+        this.pack
+            .size([this.diameter - 4, this.diameter - 4])
+            .padding(1.5)
+            ;
+
+        this._palette = this._palette.switch(this.paletteID());
+        if (this.useClonedPalette()) {
+            this._palette = this._palette.cloneNotExists(this.paletteID() + "_" + this.id());
+        }
+
+        this.svg.selectAll("circle").remove();
+        this.svg.selectAll("text").remove();
+
+        const root: any = d3Hierarchy(this.data())
+            .sum(function (d) {
+                return d && d.size ? d.size : 1;
+            }).sort(function (a, b) {
+                return a.value < b.value ? -1 : a.value > b.value ? 1 : 0;
+            })
+            ;
+        this._focus = root;
+        this.pack(root);
+
+        this.circle = this.svg.selectAll("circle").data(root.descendants())
+            .enter().append("circle")
+            .attr("class", function (d) { return d.parent ? d.children ? "node" : "node leaf" : "node root"; })
+            .style("fill", function (d) {
+                d.color = context.paletteDepthLevel_exists() && d.depth > context.paletteDepthLevel() ? d3Rgb(d.parent.color)[context.paletteDepthVariant()](1) : context._palette(d.data.label);
+                return d.color;
+            })
+            .on("click", function (d) { context.click(d.data, null, null); })
+            .on("dblclick", function (d) {
+                if (this._focus !== d) {
+                    context.zoom(d);
+                }
+                d3Event().stopPropagation();
+            })
+            ;
+        this.circle.append("title").text(function (d) { return d.data.label; });
+
+        this.svg.selectAll("text").data(root.descendants())
+            .enter().append("text")
+            .attr("class", "label")
+            .style("fill-opacity", function (d) { return d.parent === root ? 1 : 0; })
+            .style("display", function (d) { return d.parent === root ? null : "none"; })
+            .text(function (d) {
+                return d.data.label + (context.showSize() && typeof d.data.size !== "undefined" ? " " + d.data.size : "");
+            })
+            ;
+
+        this._node = this.svg.selectAll("circle,text");
+
+        this.zoomTo([root.x, root.y, root.r * 2]);
+    }
+
+    zoom(newFocus) {
+        this._focus = newFocus;
+        const context = this;
+        const transition = this.svg.transition()
+            .duration(d3Event().altKey ? 7500 : 750)
+            .tween("zoom", function () {
+                const i = d3InterpolateZoom(context.view, [context._focus.x, context._focus.y, context._focus.r * 2]);
+                return function (t) { context.zoomTo(i(t)); };
+            });
+
+        function showText(d) {
+            return (d === context._focus && !d.children) || d.parent === context._focus;
+        }
+
+        transition.selectAll("text")
+            .filter(function (d) { return showText(d) || this.style.display === "inline"; })
+            .style("fill-opacity", function (d) { return showText(d) ? 1 : 0; })
+            .on("start", function (d) { if (showText(d)) this.style.display = "inline"; })
+            .on("end", function (d) { if (!showText(d)) this.style.display = "none"; });
+    }
+
+    zoomTo(v) {
+        const k = this.diameter / v[2];
+        this.view = v;
+        this._node.attr("transform", function (d) { return "translate(" + (d.x - v[0]) * k + "," + (d.y - v[1]) * k + ")"; });
+        this.circle.attr("r", function (d) { return d.r * k; });
+    }
+
+    paletteID: (_?: string) => string | CirclePacking;
+    useClonedPalette: (_?: boolean) => boolean | CirclePacking;
+
+    //  I2DChart
+    _palette;
+    click: (row, column, selected) => void;
+    dblclick: (row, column, selected) => void;
+}
+CirclePacking.prototype._class += " tree_CirclePacking";
+CirclePacking.prototype.implements(ITree.prototype);
+export interface CirclePacking {
+    showSize(): boolean;
+    showSize(_: boolean): this;
+    paletteDepthLevel(): number;
+    paletteDepthLevel(_: number): this;
+    paletteDepthLevel_exists(): boolean;
+    paletteDepthVariant(): "brighter" | "darker";
+    paletteDepthVariant(_: "brighter" | "darker"): this;
+}
+
+CirclePacking.prototype.publish("showSize", true, "boolean", "Show size along with label");
+CirclePacking.prototype.publish("paletteDepthLevel", null, "number", "If not null then beyond this depth number the child node colors are based on parent", null, { optional: true });
+CirclePacking.prototype.publish("paletteDepthVariant", "brighter", "set", "Determines paletteDepthLevel decendant color shade variant", ["brighter", "darker"], { disable: w => w.paletteDepthLevel_exists() });
+CirclePacking.prototype.publish("paletteID", "default", "set", "Color palette for this widget", CirclePacking.prototype._palette.switch(), { tags: ["Basic", "Shared"] });
+CirclePacking.prototype.publish("useClonedPalette", false, "boolean", "Enable or disable using a cloned palette", null, { tags: ["Intermediate", "Shared"] });

package/src/Dendrogram.css

@@ -1,42 +1,42 @@
-.tree_Dendrogram .node {
-}
-
-.tree_Dendrogram .node circle {
-    fill: #dcf1ff;
-    stroke: #1f77b4;
-    stroke-width: 1.0px;
-}
-
-.tree_Dendrogram .node.selected circle {
-    stroke: red;
-}
-
-.tree_Dendrogram .node.over circle {
-    stroke: orange;
-}
-
-.tree_Dendrogram .node.selected.over circle {
-    stroke: red;
-}
-
-.tree_Dendrogram .node.selected text {
-    fill: red;
-}
-
-.tree_Dendrogram .node.over text {
-    fill: orange;
-}
-
-.tree_Dendrogram .node.selected.over text {
-    fill: red;
-}
-
-.tree_Dendrogram .node text {
-    font-size: 14px;
-}
-
-.tree_Dendrogram .link {
-    fill: none;
-    stroke: #656565;
-    stroke-width: 1.0px;
-}
+.tree_Dendrogram .node {
+}
+
+.tree_Dendrogram .node circle {
+    fill: #dcf1ff;
+    stroke: #1f77b4;
+    stroke-width: 1.0px;
+}
+
+.tree_Dendrogram .node.selected circle {
+    stroke: red;
+}
+
+.tree_Dendrogram .node.over circle {
+    stroke: orange;
+}
+
+.tree_Dendrogram .node.selected.over circle {
+    stroke: red;
+}
+
+.tree_Dendrogram .node.selected text {
+    fill: red;
+}
+
+.tree_Dendrogram .node.over text {
+    fill: orange;
+}
+
+.tree_Dendrogram .node.selected.over text {
+    fill: red;
+}
+
+.tree_Dendrogram .node text {
+    font-size: 14px;
+}
+
+.tree_Dendrogram .link {
+    fill: none;
+    stroke: #656565;
+    stroke-width: 1.0px;
+}