cx 23.12.1 → 23.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/dist/charts.js +8 -1
- package/dist/data.js +15 -0
- package/dist/manifest.js +615 -615
- package/dist/ui.js +2 -0
- package/dist/widgets.js +22 -16
- package/package.json +1 -1
- package/src/charts/PieLabel.js +71 -72
- package/src/charts/axis/Axis.d.ts +96 -96
- package/src/charts/axis/Axis.js +252 -252
- package/src/data/AggregateFunction.d.ts +20 -20
- package/src/data/AggregateFunction.js +145 -145
- package/src/data/StringTemplate.spec.js +105 -105
- package/src/svg/Text.d.ts +40 -40
- package/src/ui/Controller.d.ts +182 -182
- package/src/ui/FocusManager.js +171 -171
- package/src/ui/Instance.d.ts +72 -72
- package/src/ui/Restate.d.ts +18 -15
- package/src/ui/Restate.js +160 -158
- package/src/widgets/form/ColorPicker.scss +275 -275
- package/src/widgets/form/ColorPicker.variables.scss +22 -22
- package/src/widgets/form/DateTimeField.d.ts +86 -86
- package/src/widgets/form/DateTimeField.js +572 -572
- package/src/widgets/form/Label.js +88 -88
- package/src/widgets/form/LookupField.d.ts +174 -174
- package/src/widgets/form/LookupField.js +1131 -1131
- package/src/widgets/form/MonthField.d.ts +6 -1
- package/src/widgets/form/MonthField.js +28 -25
- package/src/widgets/form/MonthPicker.d.ts +6 -0
- package/src/widgets/form/MonthPicker.js +5 -4
- package/src/widgets/form/UploadButton.d.ts +34 -34
- package/src/widgets/overlay/Overlay.js +7 -7
- package/src/widgets/overlay/Window.js +1 -1
|
@@ -1,145 +1,145 @@
|
|
|
1
|
-
export class AggregateFunction {
|
|
2
|
-
static sum() {
|
|
3
|
-
return new Sum();
|
|
4
|
-
}
|
|
5
|
-
|
|
6
|
-
static avg() {
|
|
7
|
-
return new Avg();
|
|
8
|
-
}
|
|
9
|
-
|
|
10
|
-
static count() {
|
|
11
|
-
return new Count();
|
|
12
|
-
}
|
|
13
|
-
|
|
14
|
-
static distinct() {
|
|
15
|
-
return new Distinct();
|
|
16
|
-
}
|
|
17
|
-
|
|
18
|
-
static min() {
|
|
19
|
-
return new Min();
|
|
20
|
-
}
|
|
21
|
-
|
|
22
|
-
static max() {
|
|
23
|
-
return new Max();
|
|
24
|
-
}
|
|
25
|
-
|
|
26
|
-
static last() {
|
|
27
|
-
return new LastValue();
|
|
28
|
-
}
|
|
29
|
-
}
|
|
30
|
-
|
|
31
|
-
class Sum {
|
|
32
|
-
process(value) {
|
|
33
|
-
this.empty = false;
|
|
34
|
-
if (!isNaN(value)) this.result += value;
|
|
35
|
-
else this.invalid = true;
|
|
36
|
-
}
|
|
37
|
-
|
|
38
|
-
getResult() {
|
|
39
|
-
if (this.invalid) return null;
|
|
40
|
-
return this.result;
|
|
41
|
-
}
|
|
42
|
-
}
|
|
43
|
-
|
|
44
|
-
Sum.prototype.result = 0;
|
|
45
|
-
Sum.prototype.empty = true;
|
|
46
|
-
|
|
47
|
-
class Avg {
|
|
48
|
-
process(value, count = 1) {
|
|
49
|
-
this.empty = false;
|
|
50
|
-
if (!isNaN(value) && !isNaN(count)) {
|
|
51
|
-
this.result += value * count;
|
|
52
|
-
this.count += count;
|
|
53
|
-
} else this.invalid = true;
|
|
54
|
-
}
|
|
55
|
-
|
|
56
|
-
getResult() {
|
|
57
|
-
if (this.empty || this.invalid || this.count == 0) return null;
|
|
58
|
-
return this.result / this.count;
|
|
59
|
-
}
|
|
60
|
-
}
|
|
61
|
-
|
|
62
|
-
Avg.prototype.result = 0;
|
|
63
|
-
Avg.prototype.count = 0;
|
|
64
|
-
Avg.prototype.empty = true;
|
|
65
|
-
|
|
66
|
-
class Count {
|
|
67
|
-
process(value) {
|
|
68
|
-
if (value != null) this.result++;
|
|
69
|
-
}
|
|
70
|
-
|
|
71
|
-
getResult() {
|
|
72
|
-
return this.result;
|
|
73
|
-
}
|
|
74
|
-
}
|
|
75
|
-
|
|
76
|
-
Count.prototype.result = 0;
|
|
77
|
-
|
|
78
|
-
class Distinct {
|
|
79
|
-
constructor() {
|
|
80
|
-
this.values = {};
|
|
81
|
-
}
|
|
82
|
-
|
|
83
|
-
process(value) {
|
|
84
|
-
if (value == null || this.values[value]) return;
|
|
85
|
-
this.values[value] = true;
|
|
86
|
-
this.empty = false;
|
|
87
|
-
this.result++;
|
|
88
|
-
}
|
|
89
|
-
|
|
90
|
-
getResult() {
|
|
91
|
-
if (this.empty || this.invalid) return null;
|
|
92
|
-
return this.result;
|
|
93
|
-
}
|
|
94
|
-
}
|
|
95
|
-
|
|
96
|
-
Distinct.prototype.result = 0;
|
|
97
|
-
Distinct.prototype.empty = true;
|
|
98
|
-
|
|
99
|
-
class Max {
|
|
100
|
-
process(value) {
|
|
101
|
-
if (!isNaN(value)) {
|
|
102
|
-
if (this.empty) this.result = value;
|
|
103
|
-
else if (value > this.result) this.result = value;
|
|
104
|
-
this.empty = false;
|
|
105
|
-
} else if (value != null) this.invalid = true;
|
|
106
|
-
}
|
|
107
|
-
|
|
108
|
-
getResult() {
|
|
109
|
-
if (this.empty || this.invalid) return null;
|
|
110
|
-
return this.result;
|
|
111
|
-
}
|
|
112
|
-
}
|
|
113
|
-
|
|
114
|
-
Max.prototype.result = 0;
|
|
115
|
-
Max.prototype.empty = true;
|
|
116
|
-
|
|
117
|
-
class Min {
|
|
118
|
-
process(value) {
|
|
119
|
-
if (!isNaN(value)) {
|
|
120
|
-
if (this.empty) this.result = value;
|
|
121
|
-
else if (value < this.result) this.result = value;
|
|
122
|
-
this.empty = false;
|
|
123
|
-
} else if (value != null) this.invalid = true;
|
|
124
|
-
}
|
|
125
|
-
|
|
126
|
-
getResult() {
|
|
127
|
-
if (this.empty || this.invalid) return null;
|
|
128
|
-
return this.result;
|
|
129
|
-
}
|
|
130
|
-
}
|
|
131
|
-
|
|
132
|
-
Min.prototype.result = 0;
|
|
133
|
-
Min.prototype.empty = true;
|
|
134
|
-
|
|
135
|
-
class LastValue {
|
|
136
|
-
process(value) {
|
|
137
|
-
this.result = value;
|
|
138
|
-
}
|
|
139
|
-
|
|
140
|
-
getResult() {
|
|
141
|
-
return this.result;
|
|
142
|
-
}
|
|
143
|
-
}
|
|
144
|
-
|
|
145
|
-
LastValue.prototype.result = null;
|
|
1
|
+
export class AggregateFunction {
|
|
2
|
+
static sum() {
|
|
3
|
+
return new Sum();
|
|
4
|
+
}
|
|
5
|
+
|
|
6
|
+
static avg() {
|
|
7
|
+
return new Avg();
|
|
8
|
+
}
|
|
9
|
+
|
|
10
|
+
static count() {
|
|
11
|
+
return new Count();
|
|
12
|
+
}
|
|
13
|
+
|
|
14
|
+
static distinct() {
|
|
15
|
+
return new Distinct();
|
|
16
|
+
}
|
|
17
|
+
|
|
18
|
+
static min() {
|
|
19
|
+
return new Min();
|
|
20
|
+
}
|
|
21
|
+
|
|
22
|
+
static max() {
|
|
23
|
+
return new Max();
|
|
24
|
+
}
|
|
25
|
+
|
|
26
|
+
static last() {
|
|
27
|
+
return new LastValue();
|
|
28
|
+
}
|
|
29
|
+
}
|
|
30
|
+
|
|
31
|
+
class Sum {
|
|
32
|
+
process(value) {
|
|
33
|
+
this.empty = false;
|
|
34
|
+
if (!isNaN(value)) this.result += value;
|
|
35
|
+
else this.invalid = true;
|
|
36
|
+
}
|
|
37
|
+
|
|
38
|
+
getResult() {
|
|
39
|
+
if (this.invalid) return null;
|
|
40
|
+
return this.result;
|
|
41
|
+
}
|
|
42
|
+
}
|
|
43
|
+
|
|
44
|
+
Sum.prototype.result = 0;
|
|
45
|
+
Sum.prototype.empty = true;
|
|
46
|
+
|
|
47
|
+
class Avg {
|
|
48
|
+
process(value, count = 1) {
|
|
49
|
+
this.empty = false;
|
|
50
|
+
if (!isNaN(value) && !isNaN(count)) {
|
|
51
|
+
this.result += value * count;
|
|
52
|
+
this.count += count;
|
|
53
|
+
} else this.invalid = true;
|
|
54
|
+
}
|
|
55
|
+
|
|
56
|
+
getResult() {
|
|
57
|
+
if (this.empty || this.invalid || this.count == 0) return null;
|
|
58
|
+
return this.result / this.count;
|
|
59
|
+
}
|
|
60
|
+
}
|
|
61
|
+
|
|
62
|
+
Avg.prototype.result = 0;
|
|
63
|
+
Avg.prototype.count = 0;
|
|
64
|
+
Avg.prototype.empty = true;
|
|
65
|
+
|
|
66
|
+
class Count {
|
|
67
|
+
process(value) {
|
|
68
|
+
if (value != null) this.result++;
|
|
69
|
+
}
|
|
70
|
+
|
|
71
|
+
getResult() {
|
|
72
|
+
return this.result;
|
|
73
|
+
}
|
|
74
|
+
}
|
|
75
|
+
|
|
76
|
+
Count.prototype.result = 0;
|
|
77
|
+
|
|
78
|
+
class Distinct {
|
|
79
|
+
constructor() {
|
|
80
|
+
this.values = {};
|
|
81
|
+
}
|
|
82
|
+
|
|
83
|
+
process(value) {
|
|
84
|
+
if (value == null || this.values[value]) return;
|
|
85
|
+
this.values[value] = true;
|
|
86
|
+
this.empty = false;
|
|
87
|
+
this.result++;
|
|
88
|
+
}
|
|
89
|
+
|
|
90
|
+
getResult() {
|
|
91
|
+
if (this.empty || this.invalid) return null;
|
|
92
|
+
return this.result;
|
|
93
|
+
}
|
|
94
|
+
}
|
|
95
|
+
|
|
96
|
+
Distinct.prototype.result = 0;
|
|
97
|
+
Distinct.prototype.empty = true;
|
|
98
|
+
|
|
99
|
+
class Max {
|
|
100
|
+
process(value) {
|
|
101
|
+
if (!isNaN(value)) {
|
|
102
|
+
if (this.empty) this.result = value;
|
|
103
|
+
else if (value > this.result) this.result = value;
|
|
104
|
+
this.empty = false;
|
|
105
|
+
} else if (value != null) this.invalid = true;
|
|
106
|
+
}
|
|
107
|
+
|
|
108
|
+
getResult() {
|
|
109
|
+
if (this.empty || this.invalid) return null;
|
|
110
|
+
return this.result;
|
|
111
|
+
}
|
|
112
|
+
}
|
|
113
|
+
|
|
114
|
+
Max.prototype.result = 0;
|
|
115
|
+
Max.prototype.empty = true;
|
|
116
|
+
|
|
117
|
+
class Min {
|
|
118
|
+
process(value) {
|
|
119
|
+
if (!isNaN(value)) {
|
|
120
|
+
if (this.empty) this.result = value;
|
|
121
|
+
else if (value < this.result) this.result = value;
|
|
122
|
+
this.empty = false;
|
|
123
|
+
} else if (value != null) this.invalid = true;
|
|
124
|
+
}
|
|
125
|
+
|
|
126
|
+
getResult() {
|
|
127
|
+
if (this.empty || this.invalid) return null;
|
|
128
|
+
return this.result;
|
|
129
|
+
}
|
|
130
|
+
}
|
|
131
|
+
|
|
132
|
+
Min.prototype.result = 0;
|
|
133
|
+
Min.prototype.empty = true;
|
|
134
|
+
|
|
135
|
+
class LastValue {
|
|
136
|
+
process(value) {
|
|
137
|
+
this.result = value;
|
|
138
|
+
}
|
|
139
|
+
|
|
140
|
+
getResult() {
|
|
141
|
+
return this.result;
|
|
142
|
+
}
|
|
143
|
+
}
|
|
144
|
+
|
|
145
|
+
LastValue.prototype.result = null;
|
|
@@ -1,105 +1,105 @@
|
|
|
1
|
-
import { StringTemplate } from "./StringTemplate";
|
|
2
|
-
import assert from "assert";
|
|
3
|
-
|
|
4
|
-
describe("StringTemplate", function () {
|
|
5
|
-
describe("#compile()", function () {
|
|
6
|
-
it("returns a selector", function () {
|
|
7
|
-
var e = StringTemplate.compile("Hello {person.name}");
|
|
8
|
-
var state = {
|
|
9
|
-
person: {
|
|
10
|
-
name: "Jim",
|
|
11
|
-
},
|
|
12
|
-
};
|
|
13
|
-
assert.equal(e(state), "Hello Jim");
|
|
14
|
-
});
|
|
15
|
-
|
|
16
|
-
it("properly encodes ' and \"", function () {
|
|
17
|
-
var e = StringTemplate.compile('It\'s "working"!');
|
|
18
|
-
assert.equal(e({}), 'It\'s "working"!');
|
|
19
|
-
});
|
|
20
|
-
|
|
21
|
-
it("supports multi-line strings", function () {
|
|
22
|
-
var e = StringTemplate.compile("a\nb");
|
|
23
|
-
assert.equal(e(), "a\nb");
|
|
24
|
-
|
|
25
|
-
var e = StringTemplate.compile("a\r\nb");
|
|
26
|
-
assert.equal(e(), "a\r\nb");
|
|
27
|
-
});
|
|
28
|
-
});
|
|
29
|
-
|
|
30
|
-
describe("double brackets are used to escape brackets", function () {
|
|
31
|
-
it("double brackets are preserved", function () {
|
|
32
|
-
var e = StringTemplate.compile("Hello {{person.name}}");
|
|
33
|
-
var state = {
|
|
34
|
-
person: {
|
|
35
|
-
name: "Jim",
|
|
36
|
-
},
|
|
37
|
-
};
|
|
38
|
-
assert.equal(e(state), "Hello {person.name}");
|
|
39
|
-
});
|
|
40
|
-
|
|
41
|
-
it("triple brackets are converted to single brackets and a binding", function () {
|
|
42
|
-
var e = StringTemplate.compile("Hello {{{person.name}}}");
|
|
43
|
-
var state = {
|
|
44
|
-
person: {
|
|
45
|
-
name: "Jim",
|
|
46
|
-
},
|
|
47
|
-
};
|
|
48
|
-
assert.equal(e(state), "Hello {Jim}");
|
|
49
|
-
});
|
|
50
|
-
});
|
|
51
|
-
|
|
52
|
-
describe("supports formatting", function () {
|
|
53
|
-
it("with colon", function () {
|
|
54
|
-
var e = StringTemplate.compile("{str:suffix;kg}");
|
|
55
|
-
assert.equal(e({ str: "5" }), "5kg");
|
|
56
|
-
});
|
|
57
|
-
|
|
58
|
-
it("with multiple formats", function () {
|
|
59
|
-
var e = StringTemplate.compile("{str:suffix;kg:wrap;(;)}");
|
|
60
|
-
assert.equal(e({ str: "5" }), "(5kg)");
|
|
61
|
-
});
|
|
62
|
-
|
|
63
|
-
it("with null values", function () {
|
|
64
|
-
var e = StringTemplate.compile("{str:suffix;kg:|N/A}");
|
|
65
|
-
assert.equal(e({ str: null }), "N/A");
|
|
66
|
-
});
|
|
67
|
-
|
|
68
|
-
it("of null values", function () {
|
|
69
|
-
var e = StringTemplate.compile("{str|N/A}");
|
|
70
|
-
assert.equal(e({ str: null }), "N/A");
|
|
71
|
-
});
|
|
72
|
-
});
|
|
73
|
-
|
|
74
|
-
describe("supports expressions", function () {
|
|
75
|
-
it("using []", function () {
|
|
76
|
-
var e = StringTemplate.compile("1 + 2 = {[1+2]}");
|
|
77
|
-
assert.equal(e(), "1 + 2 = 3");
|
|
78
|
-
});
|
|
79
|
-
|
|
80
|
-
it("using %", function () {
|
|
81
|
-
var e = StringTemplate.compile("1 + 2 = %{1+2}");
|
|
82
|
-
assert.equal(e(), "1 + 2 = 3");
|
|
83
|
-
});
|
|
84
|
-
|
|
85
|
-
it("with subexpressions", function () {
|
|
86
|
-
var e = StringTemplate.compile("1 + 2 = {[%{1+2}]}");
|
|
87
|
-
assert.equal(e(), "1 + 2 = 3");
|
|
88
|
-
});
|
|
89
|
-
|
|
90
|
-
it("with a conditional operator", function () {
|
|
91
|
-
var e = StringTemplate.compile("1 + 2 = {[true ? 3 : 2]:s}");
|
|
92
|
-
assert.equal(e(), "1 + 2 = 3");
|
|
93
|
-
});
|
|
94
|
-
|
|
95
|
-
it("with sub-expression formatting", function () {
|
|
96
|
-
var e = StringTemplate.compile("{[!!{person.age} ? {person.age:suffix; years old} : 'Age unknown']}");
|
|
97
|
-
var state = {
|
|
98
|
-
person: {
|
|
99
|
-
age: 32,
|
|
100
|
-
},
|
|
101
|
-
};
|
|
102
|
-
assert.equal(e(state), "32 years old");
|
|
103
|
-
});
|
|
104
|
-
});
|
|
105
|
-
});
|
|
1
|
+
import { StringTemplate } from "./StringTemplate";
|
|
2
|
+
import assert from "assert";
|
|
3
|
+
|
|
4
|
+
describe("StringTemplate", function () {
|
|
5
|
+
describe("#compile()", function () {
|
|
6
|
+
it("returns a selector", function () {
|
|
7
|
+
var e = StringTemplate.compile("Hello {person.name}");
|
|
8
|
+
var state = {
|
|
9
|
+
person: {
|
|
10
|
+
name: "Jim",
|
|
11
|
+
},
|
|
12
|
+
};
|
|
13
|
+
assert.equal(e(state), "Hello Jim");
|
|
14
|
+
});
|
|
15
|
+
|
|
16
|
+
it("properly encodes ' and \"", function () {
|
|
17
|
+
var e = StringTemplate.compile('It\'s "working"!');
|
|
18
|
+
assert.equal(e({}), 'It\'s "working"!');
|
|
19
|
+
});
|
|
20
|
+
|
|
21
|
+
it("supports multi-line strings", function () {
|
|
22
|
+
var e = StringTemplate.compile("a\nb");
|
|
23
|
+
assert.equal(e(), "a\nb");
|
|
24
|
+
|
|
25
|
+
var e = StringTemplate.compile("a\r\nb");
|
|
26
|
+
assert.equal(e(), "a\r\nb");
|
|
27
|
+
});
|
|
28
|
+
});
|
|
29
|
+
|
|
30
|
+
describe("double brackets are used to escape brackets", function () {
|
|
31
|
+
it("double brackets are preserved", function () {
|
|
32
|
+
var e = StringTemplate.compile("Hello {{person.name}}");
|
|
33
|
+
var state = {
|
|
34
|
+
person: {
|
|
35
|
+
name: "Jim",
|
|
36
|
+
},
|
|
37
|
+
};
|
|
38
|
+
assert.equal(e(state), "Hello {person.name}");
|
|
39
|
+
});
|
|
40
|
+
|
|
41
|
+
it("triple brackets are converted to single brackets and a binding", function () {
|
|
42
|
+
var e = StringTemplate.compile("Hello {{{person.name}}}");
|
|
43
|
+
var state = {
|
|
44
|
+
person: {
|
|
45
|
+
name: "Jim",
|
|
46
|
+
},
|
|
47
|
+
};
|
|
48
|
+
assert.equal(e(state), "Hello {Jim}");
|
|
49
|
+
});
|
|
50
|
+
});
|
|
51
|
+
|
|
52
|
+
describe("supports formatting", function () {
|
|
53
|
+
it("with colon", function () {
|
|
54
|
+
var e = StringTemplate.compile("{str:suffix;kg}");
|
|
55
|
+
assert.equal(e({ str: "5" }), "5kg");
|
|
56
|
+
});
|
|
57
|
+
|
|
58
|
+
it("with multiple formats", function () {
|
|
59
|
+
var e = StringTemplate.compile("{str:suffix;kg:wrap;(;)}");
|
|
60
|
+
assert.equal(e({ str: "5" }), "(5kg)");
|
|
61
|
+
});
|
|
62
|
+
|
|
63
|
+
it("with null values", function () {
|
|
64
|
+
var e = StringTemplate.compile("{str:suffix;kg:|N/A}");
|
|
65
|
+
assert.equal(e({ str: null }), "N/A");
|
|
66
|
+
});
|
|
67
|
+
|
|
68
|
+
it("of null values", function () {
|
|
69
|
+
var e = StringTemplate.compile("{str|N/A}");
|
|
70
|
+
assert.equal(e({ str: null }), "N/A");
|
|
71
|
+
});
|
|
72
|
+
});
|
|
73
|
+
|
|
74
|
+
describe("supports expressions", function () {
|
|
75
|
+
it("using []", function () {
|
|
76
|
+
var e = StringTemplate.compile("1 + 2 = {[1+2]}");
|
|
77
|
+
assert.equal(e(), "1 + 2 = 3");
|
|
78
|
+
});
|
|
79
|
+
|
|
80
|
+
it("using %", function () {
|
|
81
|
+
var e = StringTemplate.compile("1 + 2 = %{1+2}");
|
|
82
|
+
assert.equal(e(), "1 + 2 = 3");
|
|
83
|
+
});
|
|
84
|
+
|
|
85
|
+
it("with subexpressions", function () {
|
|
86
|
+
var e = StringTemplate.compile("1 + 2 = {[%{1+2}]}");
|
|
87
|
+
assert.equal(e(), "1 + 2 = 3");
|
|
88
|
+
});
|
|
89
|
+
|
|
90
|
+
it("with a conditional operator", function () {
|
|
91
|
+
var e = StringTemplate.compile("1 + 2 = {[true ? 3 : 2]:s}");
|
|
92
|
+
assert.equal(e(), "1 + 2 = 3");
|
|
93
|
+
});
|
|
94
|
+
|
|
95
|
+
it("with sub-expression formatting", function () {
|
|
96
|
+
var e = StringTemplate.compile("{[!!{person.age} ? {person.age:suffix; years old} : 'Age unknown']}");
|
|
97
|
+
var state = {
|
|
98
|
+
person: {
|
|
99
|
+
age: 32,
|
|
100
|
+
},
|
|
101
|
+
};
|
|
102
|
+
assert.equal(e(state), "32 years old");
|
|
103
|
+
});
|
|
104
|
+
});
|
|
105
|
+
});
|
package/src/svg/Text.d.ts
CHANGED
|
@@ -1,40 +1,40 @@
|
|
|
1
|
-
import * as Cx from "../core";
|
|
2
|
-
import { BoundedObject, BoundedObjectProps } from "./BoundedObject";
|
|
3
|
-
|
|
4
|
-
interface TextProps extends BoundedObjectProps {
|
|
5
|
-
/** Text to be displayed. */
|
|
6
|
-
value?: Cx.StringProp;
|
|
7
|
-
|
|
8
|
-
bind?: string;
|
|
9
|
-
tpl?: string;
|
|
10
|
-
expr?: string;
|
|
11
|
-
|
|
12
|
-
/** Offset along the x-axis. */
|
|
13
|
-
dx?: Cx.Prop<string | number>;
|
|
14
|
-
|
|
15
|
-
/**
|
|
16
|
-
* Offset along the y-axis. This property is commonly used for vertical text alignment.
|
|
17
|
-
* Set dy="0.8em" to align the text with the top and dy="0.4em" to center it vertically.
|
|
18
|
-
*/
|
|
19
|
-
dy?: Cx.Prop<string | number>;
|
|
20
|
-
|
|
21
|
-
/** Used for horizontal text alignment. Accepted values are `start`, `middle` and `end`. */
|
|
22
|
-
textAnchor?: Cx.StringProp;
|
|
23
|
-
|
|
24
|
-
/** Used for horizontal text alignment. Accepted values are `start`, `middle` and `end`. */
|
|
25
|
-
ta?: Cx.StringProp;
|
|
26
|
-
|
|
27
|
-
/** Sets text-body color. */
|
|
28
|
-
fill?: Cx.StringProp;
|
|
29
|
-
|
|
30
|
-
/** Sets text-outline color. */
|
|
31
|
-
stroke?: Cx.StringProp;
|
|
32
|
-
|
|
33
|
-
/** Base CSS class to be applied to the element. Defaults to `text`. */
|
|
34
|
-
baseClass?: string;
|
|
35
|
-
|
|
36
|
-
/** Set to true for the text to set the text anchor based on the direction of the parent element. See PieLabels example. */
|
|
37
|
-
autoTextAnchor?: boolean;
|
|
38
|
-
}
|
|
39
|
-
|
|
40
|
-
export class Text extends Cx.Widget<TextProps> {}
|
|
1
|
+
import * as Cx from "../core";
|
|
2
|
+
import { BoundedObject, BoundedObjectProps } from "./BoundedObject";
|
|
3
|
+
|
|
4
|
+
interface TextProps extends BoundedObjectProps {
|
|
5
|
+
/** Text to be displayed. */
|
|
6
|
+
value?: Cx.StringProp;
|
|
7
|
+
|
|
8
|
+
bind?: string;
|
|
9
|
+
tpl?: string;
|
|
10
|
+
expr?: string;
|
|
11
|
+
|
|
12
|
+
/** Offset along the x-axis. */
|
|
13
|
+
dx?: Cx.Prop<string | number>;
|
|
14
|
+
|
|
15
|
+
/**
|
|
16
|
+
* Offset along the y-axis. This property is commonly used for vertical text alignment.
|
|
17
|
+
* Set dy="0.8em" to align the text with the top and dy="0.4em" to center it vertically.
|
|
18
|
+
*/
|
|
19
|
+
dy?: Cx.Prop<string | number>;
|
|
20
|
+
|
|
21
|
+
/** Used for horizontal text alignment. Accepted values are `start`, `middle` and `end`. */
|
|
22
|
+
textAnchor?: Cx.StringProp;
|
|
23
|
+
|
|
24
|
+
/** Used for horizontal text alignment. Accepted values are `start`, `middle` and `end`. */
|
|
25
|
+
ta?: Cx.StringProp;
|
|
26
|
+
|
|
27
|
+
/** Sets text-body color. */
|
|
28
|
+
fill?: Cx.StringProp;
|
|
29
|
+
|
|
30
|
+
/** Sets text-outline color. */
|
|
31
|
+
stroke?: Cx.StringProp;
|
|
32
|
+
|
|
33
|
+
/** Base CSS class to be applied to the element. Defaults to `text`. */
|
|
34
|
+
baseClass?: string;
|
|
35
|
+
|
|
36
|
+
/** Set to true for the text to set the text anchor based on the direction of the parent element. See PieLabels example. */
|
|
37
|
+
autoTextAnchor?: boolean;
|
|
38
|
+
}
|
|
39
|
+
|
|
40
|
+
export class Text extends Cx.Widget<TextProps> {}
|