@hpcc-js/common 3.6.5 → 3.7.0

package/src/List.ts

@@ -1,102 +1,102 @@
-import { IList } from "./IList.ts";
-import { SVGWidget } from "./SVGWidget.ts";
-import { TextBox } from "./TextBox.ts";
-
-import "../src/List.css";
-
-export class List extends SVGWidget implements IList {
-
-    protected _listWidgets;
-
-    constructor() {
-        super();
-
-        this._listWidgets = {};
-    }
-
-    update(domNode, element) {
-        super.update(domNode, element);
-        const context = this;
-
-        const line = element.selectAll(".line").data(this.data(), function (d) { return d; });
-        const lineEnter = line.enter().append("g")
-            .attr("class", "line")
-            .each(function (d) {
-                const newTextBox = new TextBox()
-                    .target(this)
-                    .paddingTop(0)
-                    .paddingBottom(0)
-                    .paddingLeft(8)
-                    .paddingRight(8)
-                    .text(d)
-                    .render()
-                    ;
-                newTextBox.element()
-                    .on("click", function (d2) {
-                        context.click(d2.text());
-                    })
-                    .on("dblclick", function (d2) {
-                        context.dblclick(d2.text());
-                    })
-                    ;
-                context._listWidgets[d] = newTextBox;
-            })
-            ;
-
-        let listHeight = 0;
-        let listWidth = 0;
-        for (const key in this._listWidgets) {
-            if (!this._listWidgets.hasOwnProperty(key)) continue;
-            const bbox = this._listWidgets[key].getBBox();
-            listHeight += bbox.height;
-            if (listWidth < bbox.width)
-                listWidth = bbox.width;
-        }
-
-        let yPos = -listHeight / 2; // + lineHeight / 2;
-        lineEnter.merge(line).each(function (d) {
-            const widget = context._listWidgets[d];
-            const bbox = widget.getBBox();
-            widget
-                .pos({ x: 0, y: yPos + bbox.height / 2 })
-                .anchor(context.anchor())
-                .fixedSize({ width: listWidth, height: bbox.height })
-                .render()
-                ;
-            yPos += bbox.height;
-        });
-        line.exit()
-            .remove()
-            .each(function (d) {
-                context._listWidgets[d].target(null);
-                delete context._listWidgets[d];
-            })
-            ;
-    }
-
-    exit(domNode, element) {
-        for (const key in this._listWidgets) {
-            if (this._listWidgets.hasOwnProperty(key)) {
-                this._listWidgets[key].target(null);
-            }
-        }
-        super.exit(domNode, element);
-    }
-
-    //  Events  ---
-    click(d) {
-        // console.log("Click:  " + d);
-    }
-
-    dblclick(d) {
-        // console.log("Double click:  " + d);
-    }
-}
-List.prototype._class += " common_List";
-
-export interface List {
-    anchor(): "" | "start" | "middle" | "end";
-    anchor(_: "" | "start" | "middle" | "end"): this;
-}
-
-List.prototype.publish("anchor", "start", "set", "Anchor Position", ["", "start", "middle", "end"], { tags: ["Private"] });
+import { IList } from "./IList.ts";
+import { SVGWidget } from "./SVGWidget.ts";
+import { TextBox } from "./TextBox.ts";
+
+import "../src/List.css";
+
+export class List extends SVGWidget implements IList {
+
+    protected _listWidgets;
+
+    constructor() {
+        super();
+
+        this._listWidgets = {};
+    }
+
+    update(domNode, element) {
+        super.update(domNode, element);
+        const context = this;
+
+        const line = element.selectAll(".line").data(this.data(), function (d) { return d; });
+        const lineEnter = line.enter().append("g")
+            .attr("class", "line")
+            .each(function (d) {
+                const newTextBox = new TextBox()
+                    .target(this)
+                    .paddingTop(0)
+                    .paddingBottom(0)
+                    .paddingLeft(8)
+                    .paddingRight(8)
+                    .text(d)
+                    .render()
+                    ;
+                newTextBox.element()
+                    .on("click", function (d2) {
+                        context.click(d2.text());
+                    })
+                    .on("dblclick", function (d2) {
+                        context.dblclick(d2.text());
+                    })
+                    ;
+                context._listWidgets[d] = newTextBox;
+            })
+            ;
+
+        let listHeight = 0;
+        let listWidth = 0;
+        for (const key in this._listWidgets) {
+            if (!this._listWidgets.hasOwnProperty(key)) continue;
+            const bbox = this._listWidgets[key].getBBox();
+            listHeight += bbox.height;
+            if (listWidth < bbox.width)
+                listWidth = bbox.width;
+        }
+
+        let yPos = -listHeight / 2; // + lineHeight / 2;
+        lineEnter.merge(line).each(function (d) {
+            const widget = context._listWidgets[d];
+            const bbox = widget.getBBox();
+            widget
+                .pos({ x: 0, y: yPos + bbox.height / 2 })
+                .anchor(context.anchor())
+                .fixedSize({ width: listWidth, height: bbox.height })
+                .render()
+                ;
+            yPos += bbox.height;
+        });
+        line.exit()
+            .remove()
+            .each(function (d) {
+                context._listWidgets[d].target(null);
+                delete context._listWidgets[d];
+            })
+            ;
+    }
+
+    exit(domNode, element) {
+        for (const key in this._listWidgets) {
+            if (this._listWidgets.hasOwnProperty(key)) {
+                this._listWidgets[key].target(null);
+            }
+        }
+        super.exit(domNode, element);
+    }
+
+    //  Events  ---
+    click(d) {
+        // console.log("Click:  " + d);
+    }
+
+    dblclick(d) {
+        // console.log("Double click:  " + d);
+    }
+}
+List.prototype._class += " common_List";
+
+export interface List {
+    anchor(): "" | "start" | "middle" | "end";
+    anchor(_: "" | "start" | "middle" | "end"): this;
+}
+
+List.prototype.publish("anchor", "start", "set", "Anchor Position", ["", "start", "middle", "end"], { tags: ["Private"] });

package/src/Menu.css

@@ -1,23 +1,23 @@
-.common_Menu .common_FAChar {
-    fill: white;
-    cursor: pointer;
-}
-
-.common_Menu.disabled .common_FAChar {
-    visibility: hidden;
-    cursor: inherit;
-}
-
-.common_Menu .common_List .common_TextBox .common_Shape {
-    fill: #1f77b4;
-    stroke: #1f77b4;
-}
-
-.common_Menu .common_List .common_TextBox .common_Text {
-    fill: white;
-}
-
-.common_Menu .common_List .common_TextBox .common_Shape:hover {
-    fill: #ff7f0e;
-    stroke: #ff7f0e;
-}
+.common_Menu .common_FAChar {
+    fill: white;
+    cursor: pointer;
+}
+
+.common_Menu.disabled .common_FAChar {
+    visibility: hidden;
+    cursor: inherit;
+}
+
+.common_Menu .common_List .common_TextBox .common_Shape {
+    fill: #1f77b4;
+    stroke: #1f77b4;
+}
+
+.common_Menu .common_List .common_TextBox .common_Text {
+    fill: white;
+}
+
+.common_Menu .common_List .common_TextBox .common_Shape:hover {
+    fill: #ff7f0e;
+    stroke: #ff7f0e;
+}

package/src/Menu.ts

@@ -1,139 +1,139 @@
-import { event as d3Event, select as d3Select } from "d3-selection";
-import { Icon } from "./Icon.ts";
-import { IMenu } from "./IMenu.ts";
-import { List } from "./List.ts";
-import { SVGWidget } from "./SVGWidget.ts";
-
-import "../src/Menu.css";
-
-export class Menu extends SVGWidget implements IMenu {
-    protected _icon = new Icon().shape("square").diameter(14).paddingPercent(0);
-    protected _list = new List();
-    protected _open;
-
-    constructor() {
-        super();
-
-        const context = this;
-        this._list.click = function (d) {
-            d3Event.stopPropagation();
-            context.hideMenu();
-            context.click(d);
-        };
-        this._open = false;
-    }
-
-    toggleMenu() {
-        if (!this._open) {
-            this.showMenu();
-        } else {
-            this.hideMenu();
-        }
-    }
-
-    showMenu() {
-        this.preShowMenu();
-        this._open = true;
-        this._list
-            .data(this.data())
-            .render()
-            ;
-
-        const bbox = this._icon.getBBox(true);
-        const menuBBox = this._list.getBBox(true);
-        const pos = {
-            x: bbox.width / 2 - menuBBox.width / 2,
-            y: bbox.height / 2 + menuBBox.height / 2
-        };
-        this._list
-            .move(pos)
-            ;
-        const context = this;
-        d3Select("body")
-            .on("click." + this._id, function () {
-                if (context._open) {
-                    context.hideMenu();
-                }
-            })
-            ;
-    }
-
-    hideMenu() {
-        d3Select("body")
-            .on("click." + this._id, null)
-            ;
-        this._open = false;
-        this._list
-            .data([])
-            .render()
-            ;
-        this.postHideMenu();
-    }
-
-    enter(domNode, element) {
-        super.enter(domNode, element);
-
-        this._icon
-            .target(domNode)
-            .render()
-            ;
-
-        this._list
-            .target(domNode)
-            .render()
-            ;
-
-        const context = this;
-        this._icon.element()
-            .on("click", function () {
-                d3Event.stopPropagation();
-                context.toggleMenu();
-            })
-            ;
-    }
-
-    update(domNode, element) {
-        super.update(domNode, element);
-        element
-            .classed("disabled", this.data().length === 0)
-            ;
-
-        this._icon
-            .faChar(this.faChar())
-            .paddingPercent(this.paddingPercent())
-            .render()
-            ;
-    }
-
-    exit(domNode, element) {
-        this._icon
-            .target(null)
-            ;
-
-        this._list
-            .target(null)
-            ;
-
-        super.exit(domNode, element);
-    }
-
-    //  Events  ---
-    click(d) {
-    }
-    preShowMenu() {
-    }
-    postHideMenu() {
-    }
-
-}
-Menu.prototype._class += " common_Menu";
-
-export interface Menu {
-    faChar(): string;
-    faChar(_: string): this;
-    paddingPercent(): number;
-    paddingPercent(_: number): this;
-}
-
-Menu.prototype.publishProxy("faChar", "_icon", null, "\uf0c9");
-Menu.prototype.publishProxy("paddingPercent", "_icon", null, 10);
+import { event as d3Event, select as d3Select } from "d3-selection";
+import { Icon } from "./Icon.ts";
+import { IMenu } from "./IMenu.ts";
+import { List } from "./List.ts";
+import { SVGWidget } from "./SVGWidget.ts";
+
+import "../src/Menu.css";
+
+export class Menu extends SVGWidget implements IMenu {
+    protected _icon = new Icon().shape("square").diameter(14).paddingPercent(0);
+    protected _list = new List();
+    protected _open;
+
+    constructor() {
+        super();
+
+        const context = this;
+        this._list.click = function (d) {
+            d3Event.stopPropagation();
+            context.hideMenu();
+            context.click(d);
+        };
+        this._open = false;
+    }
+
+    toggleMenu() {
+        if (!this._open) {
+            this.showMenu();
+        } else {
+            this.hideMenu();
+        }
+    }
+
+    showMenu() {
+        this.preShowMenu();
+        this._open = true;
+        this._list
+            .data(this.data())
+            .render()
+            ;
+
+        const bbox = this._icon.getBBox(true);
+        const menuBBox = this._list.getBBox(true);
+        const pos = {
+            x: bbox.width / 2 - menuBBox.width / 2,
+            y: bbox.height / 2 + menuBBox.height / 2
+        };
+        this._list
+            .move(pos)
+            ;
+        const context = this;
+        d3Select("body")
+            .on("click." + this._id, function () {
+                if (context._open) {
+                    context.hideMenu();
+                }
+            })
+            ;
+    }
+
+    hideMenu() {
+        d3Select("body")
+            .on("click." + this._id, null)
+            ;
+        this._open = false;
+        this._list
+            .data([])
+            .render()
+            ;
+        this.postHideMenu();
+    }
+
+    enter(domNode, element) {
+        super.enter(domNode, element);
+
+        this._icon
+            .target(domNode)
+            .render()
+            ;
+
+        this._list
+            .target(domNode)
+            .render()
+            ;
+
+        const context = this;
+        this._icon.element()
+            .on("click", function () {
+                d3Event.stopPropagation();
+                context.toggleMenu();
+            })
+            ;
+    }
+
+    update(domNode, element) {
+        super.update(domNode, element);
+        element
+            .classed("disabled", this.data().length === 0)
+            ;
+
+        this._icon
+            .faChar(this.faChar())
+            .paddingPercent(this.paddingPercent())
+            .render()
+            ;
+    }
+
+    exit(domNode, element) {
+        this._icon
+            .target(null)
+            ;
+
+        this._list
+            .target(null)
+            ;
+
+        super.exit(domNode, element);
+    }
+
+    //  Events  ---
+    click(d) {
+    }
+    preShowMenu() {
+    }
+    postHideMenu() {
+    }
+
+}
+Menu.prototype._class += " common_Menu";
+
+export interface Menu {
+    faChar(): string;
+    faChar(_: string): this;
+    paddingPercent(): number;
+    paddingPercent(_: number): this;
+}
+
+Menu.prototype.publishProxy("faChar", "_icon", null, "\uf0c9");
+Menu.prototype.publishProxy("paddingPercent", "_icon", null, 10);