@hpcc-js/form 2.12.2 → 2.12.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@hpcc-js/form",
3
- "version": "2.12.2",
3
+ "version": "2.12.3",
4
4
  "description": "hpcc-js - Viz Form",
5
5
  "main": "dist/index.js",
6
6
  "module": "dist/index.es6",
@@ -38,9 +38,9 @@
38
38
  "update": "npx --yes npm-check-updates -u -t minor"
39
39
  },
40
40
  "dependencies": {
41
- "@hpcc-js/api": "^2.14.2",
42
- "@hpcc-js/chart": "^2.86.2",
43
- "@hpcc-js/common": "^2.73.2"
41
+ "@hpcc-js/api": "^2.14.3",
42
+ "@hpcc-js/chart": "^2.86.3",
43
+ "@hpcc-js/common": "^2.73.3"
44
44
  },
45
45
  "devDependencies": {
46
46
  "@hpcc-js/bundle": "^2.12.0",
@@ -62,5 +62,5 @@
62
62
  "url": "https://github.com/hpcc-systems/Visualization/issues"
63
63
  },
64
64
  "homepage": "https://github.com/hpcc-systems/Visualization",
65
- "gitHead": "84f852a555c8d7b7381e4fcb93bfad829b1db62e"
65
+ "gitHead": "0907b8d15d369c89483954a1d96e2247ba020cb6"
66
66
  }
package/src/Button.ts CHANGED
@@ -1,51 +1,51 @@
1
- import { IInput } from "@hpcc-js/api";
2
- import { HTMLWidget } from "@hpcc-js/common";
3
-
4
- import "../src/Input.css";
5
-
6
- export class Button extends HTMLWidget {
7
- _inputElement = [];
8
-
9
- constructor() {
10
- super();
11
- IInput.call(this);
12
-
13
- this._tag = "div";
14
- }
15
-
16
- enter(domNode, element) {
17
- super.enter(domNode, element);
18
- const context = this;
19
- this._inputElement[0] = element.append("button")
20
- .attr("name", this.name())
21
- .on("click", function (w) {
22
- w.click(w);
23
- })
24
- .on("blur", function (w) {
25
- w.blur(w);
26
- })
27
- .on("change", function (w) {
28
- context.value([context._inputElement[0].property("value")]);
29
- w.change(w, true);
30
- })
31
- ;
32
- }
33
-
34
- update(domNode, element) {
35
- super.update(domNode, element);
36
-
37
- this._inputElement[0].text(this.value());
38
- }
39
-
40
- // IInput ---
41
- name: { (): string; (_: string): Button };
42
- name_exists: () => boolean;
43
- label: { (): string; (_: string): Button };
44
- label_exists: () => boolean;
45
- value: { (): any; (_: any): Button };
46
- value_exists: () => boolean;
47
- validate: { (): string; (_: string): Button };
48
- validate_exists: () => boolean;
49
- }
50
- Button.prototype._class += " form_Button";
51
- Button.prototype.implements(IInput.prototype);
1
+ import { IInput } from "@hpcc-js/api";
2
+ import { HTMLWidget } from "@hpcc-js/common";
3
+
4
+ import "../src/Input.css";
5
+
6
+ export class Button extends HTMLWidget {
7
+ _inputElement = [];
8
+
9
+ constructor() {
10
+ super();
11
+ IInput.call(this);
12
+
13
+ this._tag = "div";
14
+ }
15
+
16
+ enter(domNode, element) {
17
+ super.enter(domNode, element);
18
+ const context = this;
19
+ this._inputElement[0] = element.append("button")
20
+ .attr("name", this.name())
21
+ .on("click", function (w) {
22
+ w.click(w);
23
+ })
24
+ .on("blur", function (w) {
25
+ w.blur(w);
26
+ })
27
+ .on("change", function (w) {
28
+ context.value([context._inputElement[0].property("value")]);
29
+ w.change(w, true);
30
+ })
31
+ ;
32
+ }
33
+
34
+ update(domNode, element) {
35
+ super.update(domNode, element);
36
+
37
+ this._inputElement[0].text(this.value());
38
+ }
39
+
40
+ // IInput ---
41
+ name: { (): string; (_: string): Button };
42
+ name_exists: () => boolean;
43
+ label: { (): string; (_: string): Button };
44
+ label_exists: () => boolean;
45
+ value: { (): any; (_: any): Button };
46
+ value_exists: () => boolean;
47
+ validate: { (): string; (_: string): Button };
48
+ validate_exists: () => boolean;
49
+ }
50
+ Button.prototype._class += " form_Button";
51
+ Button.prototype.implements(IInput.prototype);
package/src/CheckBox.ts CHANGED
@@ -1,95 +1,95 @@
1
- import { IInput } from "@hpcc-js/api";
2
- import { HTMLWidget } from "@hpcc-js/common";
3
-
4
- import "../src/Input.css";
5
-
6
- export class CheckBox extends HTMLWidget {
7
- _inputElement = [];
8
-
9
- constructor() {
10
- super();
11
- IInput.call(this);
12
-
13
- this._tag = "div";
14
- }
15
-
16
- enter(domNode, element) {
17
- super.enter(domNode, element);
18
- const context = this;
19
-
20
- const checkboxContainer = element.append("ul");
21
- if (!this.selectOptions().length) {
22
- this.selectOptions().push(""); // create an empty radio if we using .value and not selectOptions array
23
- }
24
- this.selectOptions().forEach(function (val, idx) {
25
- context._inputElement[idx] = checkboxContainer.append("li").append("input").attr("type", "checkbox");
26
- context._inputElement[idx].node().insertAdjacentHTML("afterend", "<text>" + val + "</text>");
27
- });
28
-
29
- this._inputElement.forEach(function (e, idx) {
30
- e.attr("name", context.name());
31
- e.on("click", function (w) {
32
- w.click(w);
33
- });
34
- e.on("blur", function (w) {
35
- w.blur(w);
36
- });
37
- e.on("change", function (w) {
38
- const vals = [];
39
- context._inputElement.forEach(function (d) {
40
- if (d.property("checked")) {
41
- vals.push(d.property("value"));
42
- }
43
- });
44
- context.value(vals);
45
- w.change(w, true);
46
- });
47
- });
48
- }
49
-
50
- update(domNode, element) {
51
- super.update(domNode, element);
52
-
53
- const context = this;
54
-
55
- this._inputElement.forEach(function (e, idx) {
56
- e.property("value", context.selectOptions()[idx]);
57
- if (context.value().indexOf(context.selectOptions()[idx]) !== -1 && context.value() !== "false") {
58
- e.property("checked", true);
59
- } else {
60
- e.property("checked", false);
61
- }
62
- });
63
- }
64
-
65
- insertSelectOptions(optionsArr) {
66
- let optionHTML = "";
67
- if (optionsArr.length > 0) {
68
- optionsArr.forEach(function (opt) {
69
- const val = (opt instanceof Array ? opt[0] : opt);
70
- const text = (opt instanceof Array ? (opt[1] ? opt[1] : opt[0]) : opt);
71
- optionHTML += "<option value='" + val + "'>" + text + "</option>";
72
- });
73
- } else {
74
- optionHTML += "<option>selectOptions not set</option>";
75
- }
76
- this._inputElement[0].html(optionHTML);
77
- }
78
-
79
- selectOptions: { (): any[]; (_: any[]): CheckBox };
80
- selectOptions_exists: () => boolean;
81
-
82
- // IInput ---
83
- name: { (): string; (_: string): CheckBox };
84
- name_exists: () => boolean;
85
- label: { (): string; (_: string): CheckBox };
86
- label_exists: () => boolean;
87
- value: { (): any; (_: any): CheckBox };
88
- value_exists: () => boolean;
89
- validate: { (): string; (_: string): CheckBox };
90
- validate_exists: () => boolean;
91
- }
92
- CheckBox.prototype._class += " form_CheckBox";
93
- CheckBox.prototype.implements(IInput.prototype);
94
-
95
- CheckBox.prototype.publish("selectOptions", [], "array", "Array of options used to fill a dropdown list");
1
+ import { IInput } from "@hpcc-js/api";
2
+ import { HTMLWidget } from "@hpcc-js/common";
3
+
4
+ import "../src/Input.css";
5
+
6
+ export class CheckBox extends HTMLWidget {
7
+ _inputElement = [];
8
+
9
+ constructor() {
10
+ super();
11
+ IInput.call(this);
12
+
13
+ this._tag = "div";
14
+ }
15
+
16
+ enter(domNode, element) {
17
+ super.enter(domNode, element);
18
+ const context = this;
19
+
20
+ const checkboxContainer = element.append("ul");
21
+ if (!this.selectOptions().length) {
22
+ this.selectOptions().push(""); // create an empty radio if we using .value and not selectOptions array
23
+ }
24
+ this.selectOptions().forEach(function (val, idx) {
25
+ context._inputElement[idx] = checkboxContainer.append("li").append("input").attr("type", "checkbox");
26
+ context._inputElement[idx].node().insertAdjacentHTML("afterend", "<text>" + val + "</text>");
27
+ });
28
+
29
+ this._inputElement.forEach(function (e, idx) {
30
+ e.attr("name", context.name());
31
+ e.on("click", function (w) {
32
+ w.click(w);
33
+ });
34
+ e.on("blur", function (w) {
35
+ w.blur(w);
36
+ });
37
+ e.on("change", function (w) {
38
+ const vals = [];
39
+ context._inputElement.forEach(function (d) {
40
+ if (d.property("checked")) {
41
+ vals.push(d.property("value"));
42
+ }
43
+ });
44
+ context.value(vals);
45
+ w.change(w, true);
46
+ });
47
+ });
48
+ }
49
+
50
+ update(domNode, element) {
51
+ super.update(domNode, element);
52
+
53
+ const context = this;
54
+
55
+ this._inputElement.forEach(function (e, idx) {
56
+ e.property("value", context.selectOptions()[idx]);
57
+ if (context.value().indexOf(context.selectOptions()[idx]) !== -1 && context.value() !== "false") {
58
+ e.property("checked", true);
59
+ } else {
60
+ e.property("checked", false);
61
+ }
62
+ });
63
+ }
64
+
65
+ insertSelectOptions(optionsArr) {
66
+ let optionHTML = "";
67
+ if (optionsArr.length > 0) {
68
+ optionsArr.forEach(function (opt) {
69
+ const val = (opt instanceof Array ? opt[0] : opt);
70
+ const text = (opt instanceof Array ? (opt[1] ? opt[1] : opt[0]) : opt);
71
+ optionHTML += "<option value='" + val + "'>" + text + "</option>";
72
+ });
73
+ } else {
74
+ optionHTML += "<option>selectOptions not set</option>";
75
+ }
76
+ this._inputElement[0].html(optionHTML);
77
+ }
78
+
79
+ selectOptions: { (): any[]; (_: any[]): CheckBox };
80
+ selectOptions_exists: () => boolean;
81
+
82
+ // IInput ---
83
+ name: { (): string; (_: string): CheckBox };
84
+ name_exists: () => boolean;
85
+ label: { (): string; (_: string): CheckBox };
86
+ label_exists: () => boolean;
87
+ value: { (): any; (_: any): CheckBox };
88
+ value_exists: () => boolean;
89
+ validate: { (): string; (_: string): CheckBox };
90
+ validate_exists: () => boolean;
91
+ }
92
+ CheckBox.prototype._class += " form_CheckBox";
93
+ CheckBox.prototype.implements(IInput.prototype);
94
+
95
+ CheckBox.prototype.publish("selectOptions", [], "array", "Array of options used to fill a dropdown list");
package/src/ColorInput.ts CHANGED
@@ -1,75 +1,75 @@
1
- import { IInput } from "@hpcc-js/api";
2
- import { HTMLWidget } from "@hpcc-js/common";
3
- import { rgb as d3Rgb } from "d3-color";
4
-
5
- import "../src/Input.css";
6
-
7
- export class ColorInput extends HTMLWidget {
8
- _inputElement = [];
9
-
10
- constructor() {
11
- super();
12
- IInput.call(this);
13
-
14
- this._tag = "div";
15
- }
16
-
17
- enter(domNode, element) {
18
- super.enter(domNode, element);
19
-
20
- const context = this;
21
-
22
- this._inputElement[0] = element.append("input").attr("type", "text");
23
- this._inputElement[0].classed("color-text", true);
24
- this._inputElement[1] = element.append("input").attr("type", "color");
25
-
26
- this._inputElement.forEach(function (e, idx) {
27
- e.on("click", function (w) {
28
- w.click(w);
29
- });
30
- e.on("blur", function (w) {
31
- w.blur(w);
32
- });
33
- e.on("change", function (w) {
34
- if (idx === 0) {
35
- context._inputElement[1].property("value", d3Rgb(context._inputElement[0].property("value")).toString());
36
- context.value(context._inputElement[0].property("value"));
37
- } else {
38
- context._inputElement[0].property("value", context._inputElement[1].property("value"));
39
- context.value(d3Rgb(context._inputElement[1].property("value")).toString());
40
- }
41
- w.change(w, true);
42
- });
43
- });
44
- }
45
-
46
- update(domNode, element) {
47
- super.update(domNode, element);
48
-
49
- const context = this;
50
- this._inputElement.forEach(function (e) {
51
- e.attr("name", context.name());
52
- });
53
-
54
- this._inputElement[0].attr("type", "text");
55
- this._inputElement[1].attr("type", "color");
56
- this._inputElement[0].property("value", this.value());
57
- this._inputElement[1].property("value", d3Rgb(this.value()).toString());
58
-
59
- const bbox = this._inputElement[0].node().getBoundingClientRect();
60
- this._inputElement[1].style("height", (bbox.height - 2) + "px");
61
-
62
- }
63
-
64
- // IInput ---
65
- name: { (): string; (_: string): ColorInput };
66
- name_exists: () => boolean;
67
- label: { (): string; (_: string): ColorInput };
68
- label_exists: () => boolean;
69
- value: { (): any; (_: any): ColorInput };
70
- value_exists: () => boolean;
71
- validate: { (): string; (_: string): ColorInput };
72
- validate_exists: () => boolean;
73
- }
74
- ColorInput.prototype._class += " form_ColorInput";
75
- ColorInput.prototype.implements(IInput.prototype);
1
+ import { IInput } from "@hpcc-js/api";
2
+ import { HTMLWidget } from "@hpcc-js/common";
3
+ import { rgb as d3Rgb } from "d3-color";
4
+
5
+ import "../src/Input.css";
6
+
7
+ export class ColorInput extends HTMLWidget {
8
+ _inputElement = [];
9
+
10
+ constructor() {
11
+ super();
12
+ IInput.call(this);
13
+
14
+ this._tag = "div";
15
+ }
16
+
17
+ enter(domNode, element) {
18
+ super.enter(domNode, element);
19
+
20
+ const context = this;
21
+
22
+ this._inputElement[0] = element.append("input").attr("type", "text");
23
+ this._inputElement[0].classed("color-text", true);
24
+ this._inputElement[1] = element.append("input").attr("type", "color");
25
+
26
+ this._inputElement.forEach(function (e, idx) {
27
+ e.on("click", function (w) {
28
+ w.click(w);
29
+ });
30
+ e.on("blur", function (w) {
31
+ w.blur(w);
32
+ });
33
+ e.on("change", function (w) {
34
+ if (idx === 0) {
35
+ context._inputElement[1].property("value", d3Rgb(context._inputElement[0].property("value")).toString());
36
+ context.value(context._inputElement[0].property("value"));
37
+ } else {
38
+ context._inputElement[0].property("value", context._inputElement[1].property("value"));
39
+ context.value(d3Rgb(context._inputElement[1].property("value")).toString());
40
+ }
41
+ w.change(w, true);
42
+ });
43
+ });
44
+ }
45
+
46
+ update(domNode, element) {
47
+ super.update(domNode, element);
48
+
49
+ const context = this;
50
+ this._inputElement.forEach(function (e) {
51
+ e.attr("name", context.name());
52
+ });
53
+
54
+ this._inputElement[0].attr("type", "text");
55
+ this._inputElement[1].attr("type", "color");
56
+ this._inputElement[0].property("value", this.value());
57
+ this._inputElement[1].property("value", d3Rgb(this.value()).toString());
58
+
59
+ const bbox = this._inputElement[0].node().getBoundingClientRect();
60
+ this._inputElement[1].style("height", (bbox.height - 2) + "px");
61
+
62
+ }
63
+
64
+ // IInput ---
65
+ name: { (): string; (_: string): ColorInput };
66
+ name_exists: () => boolean;
67
+ label: { (): string; (_: string): ColorInput };
68
+ label_exists: () => boolean;
69
+ value: { (): any; (_: any): ColorInput };
70
+ value_exists: () => boolean;
71
+ validate: { (): string; (_: string): ColorInput };
72
+ validate_exists: () => boolean;
73
+ }
74
+ ColorInput.prototype._class += " form_ColorInput";
75
+ ColorInput.prototype.implements(IInput.prototype);
package/src/FieldForm.ts CHANGED
@@ -1,49 +1,49 @@
1
- import { Database } from "@hpcc-js/common";
2
- import { Form } from "./Form";
3
- import { Input } from "./Input";
4
-
5
- import "../src/Form.css";
6
-
7
- export class FieldForm extends Form {
8
-
9
- constructor() {
10
- super();
11
-
12
- this._tag = "form";
13
- }
14
-
15
- fields(): Database.Field[];
16
- fields(_: Database.Field[]): this;
17
- fields(_?: Database.Field[]): Database.Field[] | this {
18
- const retVal = super.fields.apply(this, arguments);
19
- if (arguments.length) {
20
- const inpMap = this.inputsMap();
21
- this.inputs(_.map(f => inpMap[f.id()] || new Input()
22
- .name(f.id())
23
- .label(f.label())
24
- .type(f.type())
25
- ));
26
- }
27
- return retVal;
28
- }
29
-
30
- data(): any;
31
- data(_: any): this;
32
- data(_?: any): any | this {
33
- if (!arguments.length) return super.data();
34
- super.data(_[0]);
35
- if (_[0]) {
36
- // Update input "name" with the __lparam ids ---
37
- const inputs = this.inputs();
38
- const __lparam = _[0][this.columns().length];
39
- let i = 0;
40
- for (const key in __lparam) {
41
- inputs[i].name(key);
42
- ++i;
43
- }
44
- }
45
- return this;
46
- }
47
-
48
- }
49
- FieldForm.prototype._class += " form_FieldForm";
1
+ import { Database } from "@hpcc-js/common";
2
+ import { Form } from "./Form";
3
+ import { Input } from "./Input";
4
+
5
+ import "../src/Form.css";
6
+
7
+ export class FieldForm extends Form {
8
+
9
+ constructor() {
10
+ super();
11
+
12
+ this._tag = "form";
13
+ }
14
+
15
+ fields(): Database.Field[];
16
+ fields(_: Database.Field[]): this;
17
+ fields(_?: Database.Field[]): Database.Field[] | this {
18
+ const retVal = super.fields.apply(this, arguments);
19
+ if (arguments.length) {
20
+ const inpMap = this.inputsMap();
21
+ this.inputs(_.map(f => inpMap[f.id()] || new Input()
22
+ .name(f.id())
23
+ .label(f.label())
24
+ .type(f.type())
25
+ ));
26
+ }
27
+ return retVal;
28
+ }
29
+
30
+ data(): any;
31
+ data(_: any): this;
32
+ data(_?: any): any | this {
33
+ if (!arguments.length) return super.data();
34
+ super.data(_[0]);
35
+ if (_[0]) {
36
+ // Update input "name" with the __lparam ids ---
37
+ const inputs = this.inputs();
38
+ const __lparam = _[0][this.columns().length];
39
+ let i = 0;
40
+ for (const key in __lparam) {
41
+ inputs[i].name(key);
42
+ ++i;
43
+ }
44
+ }
45
+ return this;
46
+ }
47
+
48
+ }
49
+ FieldForm.prototype._class += " form_FieldForm";