@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/LICENSE +43 -43
- package/dist/index.es6.js.map +1 -1
- package/dist/index.js.map +1 -1
- package/dist/index.min.js.map +1 -1
- package/package.json +5 -5
- package/src/Button.ts +51 -51
- package/src/CheckBox.ts +95 -95
- package/src/ColorInput.ts +75 -75
- package/src/FieldForm.ts +49 -49
- package/src/Form.css +92 -92
- package/src/Form.ts +330 -330
- package/src/Input.css +41 -41
- package/src/Input.ts +121 -121
- package/src/InputRange.ts +86 -86
- package/src/OnOff.css +54 -54
- package/src/OnOff.ts +154 -154
- package/src/Radio.ts +75 -75
- package/src/Range.ts +104 -104
- package/src/Select.ts +80 -80
- package/src/Slider.css +40 -40
- package/src/Slider.ts +381 -381
- package/src/TextArea.ts +48 -48
- package/src/__package__.ts +3 -3
- package/src/index.ts +14 -14
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@hpcc-js/form",
|
|
3
|
-
"version": "2.12.
|
|
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.
|
|
42
|
-
"@hpcc-js/chart": "^2.86.
|
|
43
|
-
"@hpcc-js/common": "^2.73.
|
|
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": "
|
|
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";
|