@hpcc-js/marshaller 2.28.11 → 3.1.0

package/src/ddl2/activities/wuresult.ts

@@ -1,10 +1,9 @@
-import { publish } from "@hpcc-js/common";
 import { Result, Workunit, XSDXMLNode } from "@hpcc-js/comms";
 import { DDL2 } from "@hpcc-js/ddl-shim";
 import { AsyncOrderedQueue, debounce, hashSum } from "@hpcc-js/util";
-import { ElementContainer } from "../model/element";
-import { schemaRow2IField } from "./activity";
-import { Datasource, DatasourceRef } from "./datasource";
+import { ElementContainer } from "../model/element.ts";
+import { schemaRow2IField } from "./activity.ts";
+import { Datasource, DatasourceRef } from "./datasource.ts";
 
 export abstract class ESPResult extends Datasource {
     protected _result: Result;
@@ -13,11 +12,6 @@ export abstract class ESPResult extends Datasource {
     protected _total: number;
     private _data: ReadonlyArray<object> = [];
 
-    @publish(10, "number", "Number of samples")
-    samples: publish<this, number>;
-    @publish(100, "number", "Sample size")
-    sampleSize: publish<this, number>;
-
     constructor(protected _ec: ElementContainer) {
         super();
         this
@@ -149,33 +143,20 @@ export abstract class ESPResult extends Datasource {
 }
 ESPResult.prototype._class += " ESPResult";
 
+export interface ESPResult {
+    samples(): number;
+    samples(_: number): this;
+    sampleSize(): number;
+    sampleSize(_: number): this;
+}
+
 export class WUResult extends ESPResult {
 
-    @publish(null, "widget", "Workunit")
-    _wu: WU;
-    wu(): WU;
-    wu(_: WU): this;
-    wu(_?: WU): this | WU {
-        if (!arguments.length) return this._wu;
-        this._wu = _;
-        this._wu.refreshMeta();
-        return this;
-    }
+    _origWu;
+    _origResultName;
 
-    @publish("", "set", "Result Name", function (this: WUResult): string[] {
-        return this._wu !== undefined ? this._wu.resultNames() : [];
-    })
-    _resultName: string;
-    resultName(_: string): this;
-    resultName(): string;
-    resultName(_?: string): string | this {
-        if (_ === void 0) return this._resultName;
-        if (this._resultName !== _) {
-            this._resultName = _;
-            this.responseFields([]);
-        }
-        return this;
-    }
+    declare _wu: WU;
+    declare _resultName: string;
 
     constructor(_ec: ElementContainer) {
         super(_ec);
@@ -244,28 +225,16 @@ export class WUResult extends ESPResult {
 }
 WUResult.prototype._class += " WUResult";
 
-export class WU extends Datasource {
-    @publish("", "string", "ESP Url (http://x.x.x.x:8010)")
-    _url: string;
-    url(): string;
-    url(_: string): this;
-    url(_?: string): this | string {
-        if (!arguments.length) return this._url;
-        this._url = _;
-        this.refreshMeta();
-        return this;
-    }
+export interface WUResult {
+    wu(): WU;
+    wu(_: WU): this;
+    resultName(): string;
+    resultName(_: string): this;
+}
 
-    @publish("", "string", "Workunit ID")
-    _wuid: string;
-    wuid(): string;
-    wuid(_: string): this;
-    wuid(_?: string): this | string {
-        if (!arguments.length) return this._wuid;
-        this._wuid = _;
-        this.refreshMeta();
-        return this;
-    }
+export class WU extends Datasource {
+    _origUrl;
+    _origWuid;
 
     protected _workunit: Workunit;
     protected _outputs: { [id: string]: WUResult } = {};
@@ -369,6 +338,13 @@ export class WU extends Datasource {
 }
 WU.prototype._class += " WU";
 
+export interface WU {
+    url(): string;
+    url(_: string): this;
+    wuid(): string;
+    wuid(_: string): this;
+}
+
 export class WUResultRef extends DatasourceRef {
 
     datasource(): WUResult;
@@ -393,3 +369,51 @@ export class WUResultRef extends DatasourceRef {
     }
 }
 WUResultRef.prototype._class += " WUResultRef";
+
+ESPResult.prototype.publish("samples", 10, "number", "Number of samples");
+ESPResult.prototype.publish("sampleSize", 100, "number", "Sample size");
+
+WUResult.prototype.publish("wu", null, "widget", "Workunit");
+WUResult.prototype.publish("resultName", "", "set", "Result Name", function (this: WUResult): string[] {
+    return this._wu !== undefined ? this._wu.resultNames() : [];
+});
+
+WUResult.prototype._origWu = WUResult.prototype.wu;
+WUResult.prototype.wu = function (this: WUResult, _?) {
+    const retVal = WUResult.prototype._origWu.apply(this, arguments);
+    if (_ !== undefined) {
+        this._wu.refreshMeta();
+    }
+    return retVal;
+};
+
+WUResult.prototype._origResultName = WUResult.prototype.resultName;
+WUResult.prototype.resultName = function (this: WUResult, _?) {
+    const prev = this._resultName;
+    const retVal = WUResult.prototype._origResultName.apply(this, arguments);
+    if (_ !== undefined && prev !== _) {
+        this.responseFields([]);
+    }
+    return retVal;
+};
+
+WU.prototype.publish("url", "", "string", "ESP Url (http://x.x.x.x:8010)");
+WU.prototype.publish("wuid", "", "string", "Workunit ID");
+
+WU.prototype._origUrl = WU.prototype.url;
+WU.prototype.url = function (this: WU, _?) {
+    const retVal = WU.prototype._origUrl.apply(this, arguments);
+    if (_ !== undefined) {
+        this.refreshMeta();
+    }
+    return retVal;
+};
+
+WU.prototype._origWuid = WU.prototype.wuid;
+WU.prototype.wuid = function (this: WU, _?) {
+    const retVal = WU.prototype._origWuid.apply(this, arguments);
+    if (_ !== undefined) {
+        this.refreshMeta();
+    }
+    return retVal;
+};

package/src/ddl2/dashboard.css

@@ -1,13 +1,13 @@
-.p-Widget.phosphor_WidgetAdapter.p-DockPanel-widget.active {
-    border-color:#5589FF;
+.lm-Widget.phosphor_WidgetAdapter.lm-DockPanel-widget.active {
+    border-color: #5589FF;
     box-shadow: 0px -1px 0px rgba(85, 137, 255, 1), 1px 1px 2px rgba(0, 0, 0, 0.2);
 }
 
-.p-TabBar-tab.p-mod-current.active {
-    border-color:#5589FF;
+.lm-TabBar-tab.lm-mod-current.active {
+    border-color: #5589FF;
 }
 
-.p-TabBar-tab.p-mod-current.error {
-    background: rgb(255,0,0);
-    background: linear-gradient(180deg, rgba(255,0,0,0.5) 0%, rgba(255,255,255,1) 100%);
-}
+.lm-TabBar-tab.lm-mod-current.error {
+    background: rgb(255, 0, 0);
+    background: linear-gradient(180deg, rgba(255, 0, 0, 0.5) 0%, rgba(255, 255, 255, 1) 100%);
+}

package/src/ddl2/dashboard.ts

@@ -2,20 +2,20 @@ import { Button, Spacer, ToggleButton, Widget } from "@hpcc-js/common";
 import { DDL1, DDL2, isDDL2Schema, upgrade } from "@hpcc-js/ddl-shim";
 import { ChartPanel } from "@hpcc-js/layout";
 import { text as d3Text } from "d3-fetch";
-import { Activity } from "./activities/activity";
-import { Databomb } from "./activities/databomb";
-import { DSPicker } from "./activities/dspicker";
-import { Filters } from "./activities/filter";
-import { Form, FormField } from "./activities/form";
-import { GroupBy } from "./activities/groupby";
-import { Limit } from "./activities/limit";
-import { Project } from "./activities/project";
-import { Sort } from "./activities/sort";
-import { DashboardDockPanel } from "./dashboardDockPanel";
-import { DashboardGrid } from "./dashboardGrid";
-import { DDLAdapter } from "./ddl";
-import { JavaScriptAdapter } from "./javascriptadapter";
-import { Element, ElementContainer } from "./model/element";
+import { Activity } from "./activities/activity.ts";
+import { Databomb } from "./activities/databomb.ts";
+import { DSPicker } from "./activities/dspicker.ts";
+import { Filters } from "./activities/filter.ts";
+import { Form, FormField } from "./activities/form.ts";
+import { GroupBy } from "./activities/groupby.ts";
+import { Limit } from "./activities/limit.ts";
+import { Project } from "./activities/project.ts";
+import { Sort } from "./activities/sort.ts";
+import { DashboardDockPanel } from "./dashboardDockPanel.ts";
+import { DashboardGrid } from "./dashboardGrid.ts";
+import { DDLAdapter } from "./ddl.ts";
+import { JavaScriptAdapter } from "./javascriptadapter.ts";
+import { Element, ElementContainer } from "./model/element.ts";
 
 import "../../src/ddl2/dashboard.css";
 
@@ -84,9 +84,9 @@ export class Dashboard extends ChartPanel {
     private _addSamples = new Button().faChar("fa-database").tooltip("Add Samples")
         .on("click", () => {
             Promise.all([
-                d3Text("https://raw.githubusercontent.com/hpcc-systems/Visualization/trunk/utils/data/data/airports.csv"),
-                d3Text("https://raw.githubusercontent.com/hpcc-systems/Visualization/trunk/utils/data/data/carriers.csv"),
-                d3Text("https://raw.githubusercontent.com/hpcc-systems/Visualization/trunk/utils/data/data/stats.csv")
+                d3Text("https://raw.githubusercontent.com/hpcc-systems/Visualization/candidate-2.x.x/utils/data/data/airports.csv"),
+                d3Text("https://raw.githubusercontent.com/hpcc-systems/Visualization/candidate-2.x.x/utils/data/data/carriers.csv"),
+                d3Text("https://raw.githubusercontent.com/hpcc-systems/Visualization/candidate-2.x.x/utils/data/data/stats.csv")
             ]).then(([airports, carriers, stats]) => {
                 const popupElement = this.addForm("popup", {
                     type: "form",

package/src/ddl2/dashboardDockPanel.ts

@@ -2,9 +2,9 @@ import { Widget } from "@hpcc-js/common";
 import { DockPanel, IClosable, WidgetAdapter } from "@hpcc-js/phosphor";
 import { compare } from "@hpcc-js/util";
 import { select as d3Select } from "d3-selection";
-import { Element, ElementContainer } from "./model/element";
-import { IVizPopupPanelOwner } from "./model/vizChartPanel";
-import { PopupManager } from "./PopupManager";
+import { Element, ElementContainer } from "./model/element.ts";
+import { IVizPopupPanelOwner } from "./model/vizChartPanel.ts";
+import { PopupManager } from "./PopupManager.ts";
 
 export class DashboardDockPanel extends DockPanel implements IClosable, IVizPopupPanelOwner {
 

package/src/ddl2/dashboardGrid.ts

@@ -2,10 +2,10 @@ import { Widget } from "@hpcc-js/common";
 import { Cell, Grid } from "@hpcc-js/layout";
 import { IClosable, WidgetAdapter } from "@hpcc-js/phosphor";
 import { compare } from "@hpcc-js/util";
-import { IDockPanel } from "./dashboard";
-import { Element, ElementContainer } from "./model/element";
-import { IVizPopupPanelOwner } from "./model/vizChartPanel";
-import { PopupManager } from "./PopupManager";
+import { IDockPanel } from "./dashboard.ts";
+import { Element, ElementContainer } from "./model/element.ts";
+import { IVizPopupPanelOwner } from "./model/vizChartPanel.ts";
+import { PopupManager } from "./PopupManager.ts";
 
 export class DashboardGrid extends Grid implements IClosable, IVizPopupPanelOwner, IDockPanel {
     private _layoutCache = [];

package/src/ddl2/ddl.ts

@@ -1,23 +1,23 @@
 import { DDL2 } from "@hpcc-js/ddl-shim";
 import { scopedLogger } from "@hpcc-js/util";
-import { BUILD_VERSION, PKG_NAME, PKG_VERSION } from "../__package__";
-import { ActivityPipeline, ReferencedFields } from "./activities/activity";
-import { Databomb } from "./activities/databomb";
-import { DatasourceRef, DatasourceRefType, DatasourceType } from "./activities/datasource";
-import { DSPicker } from "./activities/dspicker";
-import { Filters } from "./activities/filter";
-import { Form } from "./activities/form";
-import { GroupBy } from "./activities/groupby";
-import { Limit } from "./activities/limit";
-import { LogicalFile } from "./activities/logicalfile";
-import { Mappings, Project } from "./activities/project";
-import { Param, RestResult, RestResultRef, RestService } from "./activities/rest";
-import { HipieResultRef, RoxieResult, RoxieResultRef, RoxieService } from "./activities/roxie";
-import { Sort } from "./activities/sort";
-import { WU, WUResult, WUResultRef } from "./activities/wuresult";
-import { Dashboard } from "./dashboard";
-import { Element, ElementContainer } from "./model/element";
-import { Visualization } from "./model/visualization";
+import { BUILD_VERSION, PKG_NAME, PKG_VERSION } from "../__package__.ts";
+import { ActivityPipeline, ReferencedFields } from "./activities/activity.ts";
+import { Databomb } from "./activities/databomb.ts";
+import { DatasourceRef, DatasourceRefType, DatasourceType } from "./activities/datasource.ts";
+import { DSPicker } from "./activities/dspicker.ts";
+import { Filters } from "./activities/filter.ts";
+import { Form } from "./activities/form.ts";
+import { GroupBy } from "./activities/groupby.ts";
+import { Limit } from "./activities/limit.ts";
+import { LogicalFile } from "./activities/logicalfile.ts";
+import { Mappings, Project } from "./activities/project.ts";
+import { Param, RestResult, RestResultRef, RestService } from "./activities/rest.ts";
+import { HipieResultRef, RoxieResult, RoxieResultRef, RoxieService } from "./activities/roxie.ts";
+import { Sort } from "./activities/sort.ts";
+import { WU, WUResult, WUResultRef } from "./activities/wuresult.ts";
+import { Dashboard } from "./dashboard.ts";
+import { Element, ElementContainer } from "./model/element.ts";
+import { Visualization } from "./model/visualization.ts";
 
 const logger = scopedLogger("marshaller/ddl2/ddl");
 
@@ -251,8 +251,7 @@ export class DDLAdapter {
             chartType: visualization.chartType(),
             __class: visualization.chartPanel().widget().classID(),
             mappings: this.writeMappings(visualization.mappings()),
-            properties: visualization.properties(),
-            secondaryDataviewID: visualization.secondaryDataviewID()
+            properties: visualization.properties()
         };
     }
 
@@ -266,7 +265,6 @@ export class DDLAdapter {
             .chartType(ddlViz.chartType as any)
             .properties(ddlViz.properties)
             .mappings(mappings)
-            .secondaryDataviewID(ddlViz.secondaryDataviewID)
             ;
         return this;
     }

package/src/ddl2/dsTable.ts

@@ -3,15 +3,15 @@ import { Table } from "@hpcc-js/dgrid";
 import { ChartPanel } from "@hpcc-js/layout";
 import { CommandRegistry, ContextMenu } from "@hpcc-js/phosphor";
 import { text as d3Text } from "d3-fetch";
-import { Databomb } from "./activities/databomb";
-import { DatasourceRefType } from "./activities/datasource";
-import { DSPicker } from "./activities/dspicker";
-import { Form, FormField } from "./activities/form";
-import { LogicalFile } from "./activities/logicalfile";
-import { RestField, RestResult, RestService } from "./activities/rest";
-import { RoxieResult, RoxieService } from "./activities/roxie";
-import { WU, WUResult } from "./activities/wuresult";
-import { ElementContainer } from "./model/element";
+import { Databomb } from "./activities/databomb.ts";
+import { DatasourceRefType } from "./activities/datasource.ts";
+import { DSPicker } from "./activities/dspicker.ts";
+import { Form, FormField } from "./activities/form.ts";
+import { LogicalFile } from "./activities/logicalfile.ts";
+import { RestField, RestResult, RestService } from "./activities/rest.ts";
+import { RoxieResult, RoxieService } from "./activities/roxie.ts";
+import { WU, WUResult } from "./activities/wuresult.ts";
+import { ElementContainer } from "./model/element.ts";
 
 export class DSTable extends ChartPanel {
 
@@ -67,13 +67,13 @@ export class DSTable extends ChartPanel {
 
     private _addSamples = new Button().faChar("fa-database").tooltip("Add Samples")
         .on("click", () => {
-            d3Text("https://raw.githubusercontent.com/hpcc-systems/Visualization/trunk/utils/data/data/airports.csv").then(csv => {
+            d3Text("https://raw.githubusercontent.com/hpcc-systems/Visualization/candidate-2.x.x/utils/data/data/airports.csv").then(csv => {
                 this.add(new Databomb().format("csv").payload(csv));
             });
-            d3Text("https://raw.githubusercontent.com/hpcc-systems/Visualization/trunk/utils/data/data/carriers.csv").then(csv => {
+            d3Text("https://raw.githubusercontent.com/hpcc-systems/Visualization/candidate-2.x.x/utils/data/data/carriers.csv").then(csv => {
                 this.add(new Databomb().format("csv").payload(csv));
             });
-            d3Text("https://raw.githubusercontent.com/hpcc-systems/Visualization/trunk/utils/data/data/stats.csv").then(csv => {
+            d3Text("https://raw.githubusercontent.com/hpcc-systems/Visualization/candidate-2.x.x/utils/data/data/stats.csv").then(csv => {
                 this.add(new Databomb().format("csv").payload(csv));
             });
             this.add(new RestResult(this._ec)
@@ -87,21 +87,25 @@ export class DSTable extends ChartPanel {
                 .resultName("entries")
             );
             this.add(new WUResult(this._ec)
-                .wu(new WU(this._ec).url("https://play.hpccsystems.com:18010").wuid("W20200206-140840"))
+                .wu(new WU(this._ec).url("http://localhost:8010").wuid("W20190802-112509"))
                 .resultName("Result 1")
             );
             this.add(new LogicalFile(this._ec)
-                .url("https://play.hpccsystems.com:18010")
-                .logicalFile("yelp::lc::clean::review")
+                .url("http://localhost:8010")
+                .logicalFile("progguide::exampledata::peopleaccts")
+            );
+            this.add(new LogicalFile(this._ec)
+                .url("http://localhost:8010")
+                .logicalFile("progguide::exampledata::people")
             );
             const vmRoxie = new RoxieService(this._ec)
-                .url("https://play.hpccsystems.com:18002")
+                .url("http://localhost:8002")
                 .querySet("roxie")
-                .queryID("h3testcities")
+                .queryID("peopleaccounts")
                 ;
             this.add(new RoxieResult(this._ec)
                 .service(vmRoxie)
-                .resultName("Result")
+                .resultName("Accounts")
             );
             this.add(new Form()
                 .formFields([

package/src/ddl2/dvTable.ts

@@ -1,7 +1,7 @@
 import { Table } from "@hpcc-js/dgrid";
 import { ChartPanel } from "@hpcc-js/layout";
 import { hashSum } from "@hpcc-js/util";
-import { ElementContainer } from "./model/element";
+import { ElementContainer } from "./model/element.ts";
 
 export class DVTable extends ChartPanel {
 

package/src/ddl2/graphadapter.ts

@@ -1,16 +1,16 @@
 import { Widget } from "@hpcc-js/common";
 import { Edge, IGraphData, Lineage, Subgraph, Vertex } from "@hpcc-js/graph";
-import { Activity } from "./activities/activity";
-import { Databomb } from "./activities/databomb";
-import { DSPicker } from "./activities/dspicker";
-import { Form } from "./activities/form";
-import { LogicalFile } from "./activities/logicalfile";
-import { RestResult, RestResultRef } from "./activities/rest";
-import { RoxieResult, RoxieResultRef } from "./activities/roxie";
-import { WUResult } from "./activities/wuresult";
-import { Element, ElementContainer, State } from "./model/element";
-import { Visualization } from "./model/visualization";
-import { VizChartPanel } from "./model/vizChartPanel";
+import { Activity } from "./activities/activity.ts";
+import { Databomb } from "./activities/databomb.ts";
+import { DSPicker } from "./activities/dspicker.ts";
+import { Form } from "./activities/form.ts";
+import { LogicalFile } from "./activities/logicalfile.ts";
+import { RestResult, RestResultRef } from "./activities/rest.ts";
+import { RoxieResult, RoxieResultRef } from "./activities/roxie.ts";
+import { WUResult } from "./activities/wuresult.ts";
+import { Element, ElementContainer, State } from "./model/element.ts";
+import { Visualization } from "./model/visualization.ts";
+import { VizChartPanel } from "./model/vizChartPanel.ts";
 
 export interface VertexData {
     view?: Element;

package/src/ddl2/javascriptadapter.ts

@@ -1,10 +1,10 @@
 import { PropertyExt } from "@hpcc-js/common";
 import { DDL2 } from "@hpcc-js/ddl-shim";
 import { classID2Meta, ClassMeta, isArray } from "@hpcc-js/util";
-import { Activity, stringify } from "./activities/activity";
-import { Dashboard } from "./dashboard";
-import { DDLAdapter } from "./ddl";
-import { ElementContainer } from "./model/element";
+import { Activity, stringify } from "./activities/activity.ts";
+import { Dashboard } from "./dashboard.ts";
+import { DDLAdapter } from "./ddl.ts";
+import { ElementContainer } from "./model/element.ts";
 
 type WidgetImport = { [moduleID: string]: { [classID: string]: boolean } };
 

package/src/ddl2/model/element.ts

@@ -1,14 +1,14 @@
-import { PropertyExt, publish, Widget } from "@hpcc-js/common";
+import { PropertyExt, Widget } from "@hpcc-js/common";
 import { IOptionsSend } from "@hpcc-js/comms";
 import { DDL2 } from "@hpcc-js/ddl-shim";
 import { find, hashSum, isArray } from "@hpcc-js/util";
-import { Activity, IActivityError } from "../activities/activity";
-import { emptyDatabomb } from "../activities/databomb";
-import { DatasourceRefType } from "../activities/datasource";
-import { HipiePipeline } from "../activities/hipiepipeline";
-import { Mappings } from "../activities/project";
-import { Visualization } from "./visualization";
-import { VizChartPanel } from "./vizChartPanel";
+import { Activity, IActivityError } from "../activities/activity.ts";
+import { emptyDatabomb } from "../activities/databomb.ts";
+import { DatasourceRefType } from "../activities/datasource.ts";
+import { HipiePipeline } from "../activities/hipiepipeline.ts";
+import { Mappings } from "../activities/project.ts";
+import { Visualization } from "./visualization.ts";
+import { VizChartPanel } from "./vizChartPanel.ts";
 
 export class State extends PropertyExt {
 
@@ -60,35 +60,9 @@ let vizID = 0;
 export class Element extends PropertyExt {
     private _vizChartPanel: Visualization;
 
-    // @publishProxy("_MultiChartPanel")
-    // title: publish<this, string>;
-    @publish(null, "widget", "Data View")
-    hipiePipeline: publish<this, HipiePipeline>;
-    @publish(null, "widget", "Visualization")
-    _visualization: Visualization;
-    visualization(): Visualization;
-    visualization(_: Visualization): this;
-    visualization(_?: Visualization): Visualization | this {
-        if (!arguments.length) return this._visualization;
-        this._visualization = _;
-        this._visualization
-            .on("click", (_row: object | object[], col: string, sel: boolean, more?) => {
-                if (more && more.selection) {
-                    this.selection(sel ? more.selection.map(r => r.__lparam || r) : []);
-                } else {
-                    const row: any[] = isArray(_row) ? _row : [_row];
-                    this.selection(sel ? row.map(r => r.__lparam || r) : []);
-                }
-            })
-            .on("vertex_click", (_row: object | object[], col: string, sel: boolean) => {
-                const row: any[] = isArray(_row) ? _row : [_row];
-                this.selection(sel ? row.map(r => r.__lparam || r) : []);
-            })
-            ;
-        return this;
-    }
-    @publish(null, "widget", "State")
-    state: publish<this, State>;
+    _origVisualization;
+
+    declare _visualization: Visualization;
 
     constructor(private _ec: ElementContainer) {
         super();
@@ -240,6 +214,41 @@ export class Element extends PropertyExt {
 }
 Element.prototype._class += " Viz";
 
+export interface Element {
+    hipiePipeline(): HipiePipeline;
+    hipiePipeline(_: HipiePipeline): this;
+    visualization(): Visualization;
+    visualization(_: Visualization): this;
+    state(): State;
+    state(_: State): this;
+}
+
+Element.prototype.publish("hipiePipeline", null, "widget", "Data View");
+Element.prototype.publish("visualization", null, "widget", "Visualization");
+Element.prototype.publish("state", null, "widget", "State");
+
+Element.prototype._origVisualization = Element.prototype.visualization;
+Element.prototype.visualization = function (this: Element, _?) {
+    const retVal = Element.prototype._origVisualization.apply(this, arguments);
+    if (_ !== undefined) {
+        this._visualization
+            .on("click", (_row: object | object[], col: string, sel: boolean, more?) => {
+                if (more && more.selection) {
+                    this.selection(sel ? more.selection.map(r => r.__lparam || r) : []);
+                } else {
+                    const row: any[] = isArray(_row) ? _row : [_row];
+                    this.selection(sel ? row.map(r => r.__lparam || r) : []);
+                }
+            })
+            .on("vertex_click", (_row: object | object[], col: string, sel: boolean) => {
+                const row: any[] = isArray(_row) ? _row : [_row];
+                this.selection(sel ? row.map(r => r.__lparam || r) : []);
+            })
+            ;
+    }
+    return retVal;
+};
+
 export interface IPersist {
     ddl: DDL2.Schema;
     layout: any;
@@ -256,11 +265,6 @@ export class ElementContainer extends PropertyExt {
     private _datasources: DatasourceRefType[] = [emptyDatabomb];
     private _elements: Element[] = [];
 
-    @publish(10, "number", "Number of samples")
-    samples: publish<this, number>;
-    @publish(100, "number", "Sample size")
-    sampleSize: publish<this, number>;
-
     constructor() {
         super();
         this.clear();
@@ -396,3 +400,13 @@ export class ElementContainer extends PropertyExt {
     }
 }
 ElementContainer.prototype._class += " dashboard_ElementContainer";
+
+export interface ElementContainer {
+    samples(): number;
+    samples(_: number): this;
+    sampleSize(): number;
+    sampleSize(_: number): this;
+}
+
+ElementContainer.prototype.publish("samples", 10, "number", "Number of samples");
+ElementContainer.prototype.publish("sampleSize", 100, "number", "Sample size");