cx 25.4.1 → 25.5.1
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 +2 -2
- package/dist/data.js +17 -3
- package/dist/manifest.js +732 -732
- package/dist/ui.js +94 -61
- package/dist/widgets.js +25 -13
- package/package.json +1 -1
- package/src/charts/Legend.d.ts +45 -45
- package/src/charts/LegendEntry.js +128 -128
- package/src/charts/LegendEntry.scss +27 -27
- package/src/charts/PieChart.d.ts +92 -92
- package/src/charts/RangeMarker.js +6 -2
- package/src/charts/axis/Axis.d.ts +113 -113
- package/src/charts/axis/Axis.js +280 -280
- package/src/charts/axis/CategoryAxis.d.ts +30 -30
- package/src/charts/axis/CategoryAxis.js +241 -241
- package/src/charts/axis/NumericAxis.d.ts +46 -46
- package/src/charts/axis/NumericAxis.js +351 -351
- package/src/charts/axis/Stack.js +55 -55
- package/src/charts/axis/TimeAxis.d.ts +31 -28
- package/src/charts/axis/TimeAxis.js +611 -611
- package/src/charts/helpers/PointReducer.js +47 -47
- package/src/charts/helpers/SnapPointFinder.js +69 -69
- package/src/data/AugmentedViewBase.js +77 -75
- package/src/data/Binding.spec.js +69 -69
- package/src/data/ExposedRecordView.js +75 -70
- package/src/data/ExposedValueView.js +73 -72
- package/src/data/Expression.js +229 -229
- package/src/data/Expression.spec.js +229 -229
- package/src/data/Ref.d.ts +24 -24
- package/src/data/Ref.spec.js +79 -79
- package/src/data/StoreRef.spec.js +24 -24
- package/src/data/StringTemplate.js +92 -92
- package/src/data/StringTemplate.spec.js +132 -132
- package/src/data/StructuredDataAccessor.d.ts +7 -7
- package/src/data/StructuredSelector.js +132 -132
- package/src/data/SubscribableView.js +54 -54
- package/src/data/getAccessor.spec.js +11 -11
- package/src/data/getSelector.js +49 -49
- package/src/hooks/createLocalStorageRef.d.ts +3 -3
- package/src/hooks/createLocalStorageRef.js +20 -20
- package/src/index.scss +6 -6
- package/src/ui/Container.js +154 -183
- package/src/ui/Culture.d.ts +57 -57
- package/src/ui/Culture.js +139 -139
- package/src/ui/Cx.js +3 -3
- package/src/ui/DataProxy.js +45 -44
- package/src/ui/DetachedScope.js +98 -94
- package/src/ui/FocusManager.js +171 -171
- package/src/ui/Format.js +108 -108
- package/src/ui/HoverSync.js +147 -147
- package/src/ui/Instance.d.ts +1 -1
- package/src/ui/Instance.js +25 -16
- package/src/ui/IsolatedScope.js +30 -30
- package/src/ui/Repeater.d.ts +61 -61
- package/src/ui/Repeater.js +109 -102
- package/src/ui/Rescope.js +35 -31
- package/src/ui/Restate.js +167 -163
- package/src/ui/Widget.js +184 -200
- package/src/ui/adapter/ArrayAdapter.js +152 -142
- package/src/ui/adapter/TreeAdapter.js +101 -100
- package/src/ui/createFunctionalComponent.d.ts +1 -1
- package/src/ui/createFunctionalComponent.js +31 -36
- package/src/ui/layout/ContentPlaceholder.d.ts +19 -19
- package/src/ui/layout/ContentPlaceholder.js +105 -105
- package/src/ui/layout/ContentPlaceholder.spec.js +579 -579
- package/src/ui/layout/LabelsTopLayout.js +134 -134
- package/src/ui/layout/exploreChildren.d.ts +12 -15
- package/src/ui/layout/exploreChildren.js +27 -40
- package/src/util/Format.js +270 -270
- package/src/util/date/encodeDate.d.ts +1 -1
- package/src/util/date/encodeDate.js +8 -8
- package/src/util/date/encodeDateWithTimezoneOffset.d.ts +1 -1
- package/src/util/date/index.d.ts +11 -11
- package/src/util/date/index.js +11 -11
- package/src/util/date/parseDateInvariant.d.ts +3 -3
- package/src/util/date/parseDateInvariant.js +20 -20
- package/src/util/debounce.js +18 -18
- package/src/util/getSearchQueryPredicate.js +59 -59
- package/src/util/index.d.ts +51 -51
- package/src/util/index.js +54 -54
- package/src/util/isValidIdentifierName.d.ts +1 -1
- package/src/util/isValidIdentifierName.js +5 -5
- package/src/util/isValidIdentifierName.spec.js +33 -33
- package/src/util/scss/add-rules.scss +38 -38
- package/src/util/validatedDebounce.js +19 -19
- package/src/widgets/Button.js +118 -118
- package/src/widgets/CxCredit.scss +37 -37
- package/src/widgets/HighlightedSearchText.js +36 -36
- package/src/widgets/HighlightedSearchText.scss +18 -18
- package/src/widgets/List.js +594 -587
- package/src/widgets/List.scss +91 -91
- package/src/widgets/Sandbox.js +9 -8
- package/src/widgets/drag-drop/DropZone.js +214 -214
- package/src/widgets/form/Calendar.d.ts +86 -86
- package/src/widgets/form/Calendar.js +618 -618
- package/src/widgets/form/Calendar.scss +196 -196
- package/src/widgets/form/Checkbox.scss +127 -127
- package/src/widgets/form/ColorField.js +397 -397
- package/src/widgets/form/ColorField.scss +96 -96
- package/src/widgets/form/ColorPicker.scss +283 -283
- package/src/widgets/form/DateTimeField.js +576 -576
- package/src/widgets/form/DateTimePicker.js +392 -392
- package/src/widgets/form/LookupField.d.ts +179 -179
- package/src/widgets/form/LookupField.scss +219 -219
- package/src/widgets/form/MonthField.d.ts +99 -99
- package/src/widgets/form/MonthField.js +523 -523
- package/src/widgets/form/MonthPicker.d.ts +76 -76
- package/src/widgets/form/MonthPicker.js +641 -641
- package/src/widgets/form/MonthPicker.scss +118 -118
- package/src/widgets/form/NumberField.js +459 -459
- package/src/widgets/form/NumberField.scss +61 -61
- package/src/widgets/form/Radio.scss +121 -121
- package/src/widgets/form/Select.scss +99 -99
- package/src/widgets/form/Slider.scss +118 -118
- package/src/widgets/form/Switch.scss +140 -140
- package/src/widgets/form/TextArea.scss +43 -43
- package/src/widgets/form/TextField.js +290 -290
- package/src/widgets/form/TextField.scss +55 -55
- package/src/widgets/form/UploadButton.d.ts +34 -34
- package/src/widgets/form/variables.scss +353 -353
- package/src/widgets/grid/Grid.d.ts +442 -442
- package/src/widgets/grid/Grid.js +7 -0
- package/src/widgets/grid/GridRow.js +228 -228
- package/src/widgets/grid/TreeNode.d.ts +23 -23
- package/src/widgets/grid/TreeNode.scss +88 -88
- package/src/widgets/grid/variables.scss +133 -133
- package/src/widgets/nav/LinkButton.js +128 -128
- package/src/widgets/nav/Menu.scss +74 -74
- package/src/widgets/nav/Route.js +102 -106
- package/src/widgets/overlay/Dropdown.js +612 -612
- package/src/widgets/overlay/FlyweightTooltipTracker.js +39 -39
- package/src/widgets/overlay/Overlay.d.ts +73 -73
- package/src/widgets/overlay/Tooltip.js +1 -1
- package/src/widgets/overlay/Window.js +202 -202
- package/src/widgets/overlay/captureMouse.js +124 -124
- package/src/widgets/overlay/createHotPromiseWindowFactory.d.ts +18 -18
- package/src/widgets/overlay/createHotPromiseWindowFactory.js +56 -56
- package/src/widgets/overlay/index.d.ts +11 -11
- package/src/widgets/overlay/index.js +11 -11
- package/src/widgets/variables.scss +144 -144
|
@@ -1,229 +1,229 @@
|
|
|
1
|
-
import { Expression } from "./Expression";
|
|
2
|
-
import assert from "assert";
|
|
3
|
-
import { StringTemplate } from "./StringTemplate";
|
|
4
|
-
|
|
5
|
-
describe("Expression", function () {
|
|
6
|
-
describe("#compile()", function () {
|
|
7
|
-
it("returns a selector", function () {
|
|
8
|
-
let e = Expression.compile("{person.name}");
|
|
9
|
-
let state = {
|
|
10
|
-
person: {
|
|
11
|
-
name: "Jim",
|
|
12
|
-
},
|
|
13
|
-
};
|
|
14
|
-
assert.equal(e(state), "Jim");
|
|
15
|
-
});
|
|
16
|
-
|
|
17
|
-
it("ignores bindings in strings", function () {
|
|
18
|
-
let e = Expression.compile('"{person.name}"');
|
|
19
|
-
let state = {
|
|
20
|
-
person: {
|
|
21
|
-
name: "Jim",
|
|
22
|
-
},
|
|
23
|
-
};
|
|
24
|
-
assert.equal(e(state), "{person.name}");
|
|
25
|
-
});
|
|
26
|
-
|
|
27
|
-
it("allows mixed curly braces in strings", () => {
|
|
28
|
-
let e = Expression.compile('"Hello {" + "person.name}"');
|
|
29
|
-
assert.equal(e(), "Hello {person.name}");
|
|
30
|
-
});
|
|
31
|
-
|
|
32
|
-
it("properly encodes quotes #1", function () {
|
|
33
|
-
let e = Expression.compile('"\'"');
|
|
34
|
-
let state = {};
|
|
35
|
-
assert.equal(e(state), "'");
|
|
36
|
-
});
|
|
37
|
-
|
|
38
|
-
it("properly encodes quotes #2", function () {
|
|
39
|
-
let e = Expression.compile('"\\""');
|
|
40
|
-
let state = {};
|
|
41
|
-
assert.equal(e(state), '"');
|
|
42
|
-
});
|
|
43
|
-
|
|
44
|
-
it("properly encodes quotes #3", function () {
|
|
45
|
-
let e = Expression.compile('"\\\\\\""');
|
|
46
|
-
let state = {};
|
|
47
|
-
assert.equal(e(state), '\\"');
|
|
48
|
-
});
|
|
49
|
-
|
|
50
|
-
it("properly encodes quotes #4", function () {
|
|
51
|
-
let e = Expression.compile('"\\\\"');
|
|
52
|
-
let state = {};
|
|
53
|
-
assert.equal(e(state), "\\");
|
|
54
|
-
});
|
|
55
|
-
});
|
|
56
|
-
|
|
57
|
-
describe("allow subexpressions", function () {
|
|
58
|
-
it("in square brackets", function () {
|
|
59
|
-
let e = Expression.compile("{[{person.name}]}");
|
|
60
|
-
let state = {
|
|
61
|
-
person: {
|
|
62
|
-
name: "Jim",
|
|
63
|
-
},
|
|
64
|
-
};
|
|
65
|
-
assert.equal(e(state), "Jim");
|
|
66
|
-
});
|
|
67
|
-
|
|
68
|
-
it("in square brackets", function () {
|
|
69
|
-
let e = Expression.compile("{[{person.alias} || {person.name}]}");
|
|
70
|
-
let state = {
|
|
71
|
-
person: {
|
|
72
|
-
name: "Jim",
|
|
73
|
-
alias: "J",
|
|
74
|
-
},
|
|
75
|
-
};
|
|
76
|
-
assert.equal(e(state), "J");
|
|
77
|
-
});
|
|
78
|
-
|
|
79
|
-
it("prefixed with % sign", function () {
|
|
80
|
-
let e = Expression.compile("%{1+1}");
|
|
81
|
-
assert.equal(e(), "2");
|
|
82
|
-
});
|
|
83
|
-
|
|
84
|
-
it("can be formatted", function () {
|
|
85
|
-
let e = Expression.compile("{[1+1]:f;2}");
|
|
86
|
-
assert.equal(e(), "2.00");
|
|
87
|
-
});
|
|
88
|
-
|
|
89
|
-
it("n level deep", function () {
|
|
90
|
-
let e = Expression.compile("{[{[{[1+1]}]}]:f;2}");
|
|
91
|
-
assert.equal(e(), "2.00");
|
|
92
|
-
});
|
|
93
|
-
|
|
94
|
-
it("with complex math inside", function () {
|
|
95
|
-
let e = Expression.compile("%{{data}.reduce((a,b)=>a+b, 0):f;2}");
|
|
96
|
-
let state = {
|
|
97
|
-
data: [1, 2, 3],
|
|
98
|
-
};
|
|
99
|
-
assert.equal(e(state), "6.00");
|
|
100
|
-
});
|
|
101
|
-
|
|
102
|
-
it("with a conditional operator inside", function () {
|
|
103
|
-
let e = Expression.compile('{[true ? "T" : "F"]}');
|
|
104
|
-
assert.equal(e(), "T");
|
|
105
|
-
});
|
|
106
|
-
|
|
107
|
-
it("with string interpolation inside", function () {
|
|
108
|
-
let e = Expression.compile("{[`${{test}}`]}");
|
|
109
|
-
assert.equal(e({ test: "T" }), "T");
|
|
110
|
-
});
|
|
111
|
-
});
|
|
112
|
-
|
|
113
|
-
describe("are working", function () {
|
|
114
|
-
it("function expressions with get", function () {
|
|
115
|
-
let e = Expression.get((get) => get("a") + get("b"));
|
|
116
|
-
assert.equal(e({ a: 1, b: 2 }), 3);
|
|
117
|
-
});
|
|
118
|
-
|
|
119
|
-
it("are properly memoized", function () {
|
|
120
|
-
let inv = 0;
|
|
121
|
-
let e = Expression.get((get) => {
|
|
122
|
-
inv++;
|
|
123
|
-
return get("a") + get("b");
|
|
124
|
-
}).memoize();
|
|
125
|
-
|
|
126
|
-
assert.equal(e({ a: 1, b: 1 }), 2);
|
|
127
|
-
assert.equal(inv, 1);
|
|
128
|
-
|
|
129
|
-
assert.equal(e({ a: 1, b: 1 }), 2);
|
|
130
|
-
assert.equal(inv, 1);
|
|
131
|
-
|
|
132
|
-
assert.equal(e({ a: 1, b: 2 }), 3);
|
|
133
|
-
assert.equal(inv, 2);
|
|
134
|
-
|
|
135
|
-
assert.equal(e({ a: 1, b: 2 }), 3);
|
|
136
|
-
assert.equal(inv, 2);
|
|
137
|
-
|
|
138
|
-
assert.equal(e({ a: 2, b: 2 }), 4);
|
|
139
|
-
assert.equal(inv, 3);
|
|
140
|
-
});
|
|
141
|
-
|
|
142
|
-
it("formatting can be used inside bindings", function () {
|
|
143
|
-
let e = Expression.get((get) => get("name:prefix;Hello "));
|
|
144
|
-
assert(e({ name: "CxJS" }), "Hello CxJS");
|
|
145
|
-
});
|
|
146
|
-
|
|
147
|
-
it("allows using the fmt function inside", function () {
|
|
148
|
-
let e = Expression.compile('{[fmt({text}, "prefix;Hello ")]}');
|
|
149
|
-
assert.equal(e({ text: "CxJS" }), "Hello CxJS");
|
|
150
|
-
});
|
|
151
|
-
|
|
152
|
-
it("allows using dashes inside names", function () {
|
|
153
|
-
let e = Expression.compile("{framework-name}");
|
|
154
|
-
assert.equal(e({ "framework-name": "CxJS" }), "CxJS");
|
|
155
|
-
});
|
|
156
|
-
|
|
157
|
-
it("allows using spaces and other characters inside names", function () {
|
|
158
|
-
let e = Expression.compile("{1nv@lid js ident1fier}");
|
|
159
|
-
assert.equal(e({ "1nv@lid js ident1fier": "CxJS" }), "CxJS");
|
|
160
|
-
});
|
|
161
|
-
|
|
162
|
-
it("allows strings in subexpressions", () => {
|
|
163
|
-
let e = Expression.compile("{['1']}");
|
|
164
|
-
assert.equal(e(), "1");
|
|
165
|
-
|
|
166
|
-
let e2 = Expression.compile('%{"1"}');
|
|
167
|
-
assert.equal(e2(), "1");
|
|
168
|
-
});
|
|
169
|
-
|
|
170
|
-
it("allows string templates in nested expressions", () => {
|
|
171
|
-
Expression.registerHelper("tpl", StringTemplate.format);
|
|
172
|
-
let e = Expression.compile("tpl('{0:n;2} {1:p;2:wrap;(;)}', {value}, {percentage})");
|
|
173
|
-
assert.equal(e({ value: 1, percentage: 0.02 }), "1.00 (2.00%)");
|
|
174
|
-
|
|
175
|
-
let e2 = Expression.compile("{[tpl('{0:n;2} {1:p;2:wrap;(;)}', {value}, {percentage})]}");
|
|
176
|
-
assert.equal(e2({ value: 1, percentage: 0.02 }), "1.00 (2.00%)");
|
|
177
|
-
|
|
178
|
-
// we're going to need a better parser for this
|
|
179
|
-
// let e3 = Expression.compile("%{tpl('{0:n;2} {1:p;2:wrap;(;)}', {value}, {percentage})}");
|
|
180
|
-
// assert.equal(e3({ value: 1, percentage: 0.02 }), "1.00 (2.00%)");
|
|
181
|
-
});
|
|
182
|
-
|
|
183
|
-
it("string templates can be in the data", () => {
|
|
184
|
-
Expression.registerHelper("tpl", StringTemplate.format);
|
|
185
|
-
let e = Expression.compile("tpl({template}, {value}, {percentage})");
|
|
186
|
-
assert.equal(e({ value: 1, percentage: 0.02, template: "{0:n;2} {1:p;2:wrap;(;)}" }), "1.00 (2.00%)");
|
|
187
|
-
});
|
|
188
|
-
|
|
189
|
-
// it('are properly memoized with proxies', function () {
|
|
190
|
-
// let inv = 0;
|
|
191
|
-
// let e = Expression.get(d => { inv++; return d.a + d.b}).memoize();
|
|
192
|
-
//
|
|
193
|
-
// assert.equal(e({ a: 1, b: 1 }), 2);
|
|
194
|
-
// assert.equal(inv, 1);
|
|
195
|
-
//
|
|
196
|
-
// assert.equal(e({ a: 1, b: 1 }), 2);
|
|
197
|
-
// assert.equal(inv, 1);
|
|
198
|
-
//
|
|
199
|
-
// assert.equal(e({ a: 1, b: 2 }), 3);
|
|
200
|
-
// assert.equal(inv, 2);
|
|
201
|
-
//
|
|
202
|
-
// assert.equal(e({ a: 1, b: 2 }), 3);
|
|
203
|
-
// assert.equal(inv, 2);
|
|
204
|
-
//
|
|
205
|
-
// assert.equal(e({ a: 2, b: 2 }), 4);
|
|
206
|
-
// assert.equal(inv, 3);
|
|
207
|
-
// });
|
|
208
|
-
//
|
|
209
|
-
// it('are properly memoized with proxies and deep data', function () {
|
|
210
|
-
// let inv = 0;
|
|
211
|
-
// let e = Expression.get(d => { inv++; return d.v.a + d.v.b}).memoize();
|
|
212
|
-
//
|
|
213
|
-
// assert.equal(e({ v: { a: 1, b: 1 }}), 2);
|
|
214
|
-
// assert.equal(inv, 1);
|
|
215
|
-
//
|
|
216
|
-
// assert.equal(e({ v: { a: 1, b: 1 }}), 2);
|
|
217
|
-
// assert.equal(inv, 1);
|
|
218
|
-
//
|
|
219
|
-
// assert.equal(e({ v: { a: 1, b: 2 }}), 3);
|
|
220
|
-
// assert.equal(inv, 2);
|
|
221
|
-
//
|
|
222
|
-
// assert.equal(e({ v: { a: 1, b: 2 }}), 3);
|
|
223
|
-
// assert.equal(inv, 2);
|
|
224
|
-
//
|
|
225
|
-
// assert.equal(e({ v: { a: 2, b: 2 }}), 4);
|
|
226
|
-
// assert.equal(inv, 3);
|
|
227
|
-
// });
|
|
228
|
-
});
|
|
229
|
-
});
|
|
1
|
+
import { Expression } from "./Expression";
|
|
2
|
+
import assert from "assert";
|
|
3
|
+
import { StringTemplate } from "./StringTemplate";
|
|
4
|
+
|
|
5
|
+
describe("Expression", function () {
|
|
6
|
+
describe("#compile()", function () {
|
|
7
|
+
it("returns a selector", function () {
|
|
8
|
+
let e = Expression.compile("{person.name}");
|
|
9
|
+
let state = {
|
|
10
|
+
person: {
|
|
11
|
+
name: "Jim",
|
|
12
|
+
},
|
|
13
|
+
};
|
|
14
|
+
assert.equal(e(state), "Jim");
|
|
15
|
+
});
|
|
16
|
+
|
|
17
|
+
it("ignores bindings in strings", function () {
|
|
18
|
+
let e = Expression.compile('"{person.name}"');
|
|
19
|
+
let state = {
|
|
20
|
+
person: {
|
|
21
|
+
name: "Jim",
|
|
22
|
+
},
|
|
23
|
+
};
|
|
24
|
+
assert.equal(e(state), "{person.name}");
|
|
25
|
+
});
|
|
26
|
+
|
|
27
|
+
it("allows mixed curly braces in strings", () => {
|
|
28
|
+
let e = Expression.compile('"Hello {" + "person.name}"');
|
|
29
|
+
assert.equal(e(), "Hello {person.name}");
|
|
30
|
+
});
|
|
31
|
+
|
|
32
|
+
it("properly encodes quotes #1", function () {
|
|
33
|
+
let e = Expression.compile('"\'"');
|
|
34
|
+
let state = {};
|
|
35
|
+
assert.equal(e(state), "'");
|
|
36
|
+
});
|
|
37
|
+
|
|
38
|
+
it("properly encodes quotes #2", function () {
|
|
39
|
+
let e = Expression.compile('"\\""');
|
|
40
|
+
let state = {};
|
|
41
|
+
assert.equal(e(state), '"');
|
|
42
|
+
});
|
|
43
|
+
|
|
44
|
+
it("properly encodes quotes #3", function () {
|
|
45
|
+
let e = Expression.compile('"\\\\\\""');
|
|
46
|
+
let state = {};
|
|
47
|
+
assert.equal(e(state), '\\"');
|
|
48
|
+
});
|
|
49
|
+
|
|
50
|
+
it("properly encodes quotes #4", function () {
|
|
51
|
+
let e = Expression.compile('"\\\\"');
|
|
52
|
+
let state = {};
|
|
53
|
+
assert.equal(e(state), "\\");
|
|
54
|
+
});
|
|
55
|
+
});
|
|
56
|
+
|
|
57
|
+
describe("allow subexpressions", function () {
|
|
58
|
+
it("in square brackets", function () {
|
|
59
|
+
let e = Expression.compile("{[{person.name}]}");
|
|
60
|
+
let state = {
|
|
61
|
+
person: {
|
|
62
|
+
name: "Jim",
|
|
63
|
+
},
|
|
64
|
+
};
|
|
65
|
+
assert.equal(e(state), "Jim");
|
|
66
|
+
});
|
|
67
|
+
|
|
68
|
+
it("in square brackets", function () {
|
|
69
|
+
let e = Expression.compile("{[{person.alias} || {person.name}]}");
|
|
70
|
+
let state = {
|
|
71
|
+
person: {
|
|
72
|
+
name: "Jim",
|
|
73
|
+
alias: "J",
|
|
74
|
+
},
|
|
75
|
+
};
|
|
76
|
+
assert.equal(e(state), "J");
|
|
77
|
+
});
|
|
78
|
+
|
|
79
|
+
it("prefixed with % sign", function () {
|
|
80
|
+
let e = Expression.compile("%{1+1}");
|
|
81
|
+
assert.equal(e(), "2");
|
|
82
|
+
});
|
|
83
|
+
|
|
84
|
+
it("can be formatted", function () {
|
|
85
|
+
let e = Expression.compile("{[1+1]:f;2}");
|
|
86
|
+
assert.equal(e(), "2.00");
|
|
87
|
+
});
|
|
88
|
+
|
|
89
|
+
it("n level deep", function () {
|
|
90
|
+
let e = Expression.compile("{[{[{[1+1]}]}]:f;2}");
|
|
91
|
+
assert.equal(e(), "2.00");
|
|
92
|
+
});
|
|
93
|
+
|
|
94
|
+
it("with complex math inside", function () {
|
|
95
|
+
let e = Expression.compile("%{{data}.reduce((a,b)=>a+b, 0):f;2}");
|
|
96
|
+
let state = {
|
|
97
|
+
data: [1, 2, 3],
|
|
98
|
+
};
|
|
99
|
+
assert.equal(e(state), "6.00");
|
|
100
|
+
});
|
|
101
|
+
|
|
102
|
+
it("with a conditional operator inside", function () {
|
|
103
|
+
let e = Expression.compile('{[true ? "T" : "F"]}');
|
|
104
|
+
assert.equal(e(), "T");
|
|
105
|
+
});
|
|
106
|
+
|
|
107
|
+
it("with string interpolation inside", function () {
|
|
108
|
+
let e = Expression.compile("{[`${{test}}`]}");
|
|
109
|
+
assert.equal(e({ test: "T" }), "T");
|
|
110
|
+
});
|
|
111
|
+
});
|
|
112
|
+
|
|
113
|
+
describe("are working", function () {
|
|
114
|
+
it("function expressions with get", function () {
|
|
115
|
+
let e = Expression.get((get) => get("a") + get("b"));
|
|
116
|
+
assert.equal(e({ a: 1, b: 2 }), 3);
|
|
117
|
+
});
|
|
118
|
+
|
|
119
|
+
it("are properly memoized", function () {
|
|
120
|
+
let inv = 0;
|
|
121
|
+
let e = Expression.get((get) => {
|
|
122
|
+
inv++;
|
|
123
|
+
return get("a") + get("b");
|
|
124
|
+
}).memoize();
|
|
125
|
+
|
|
126
|
+
assert.equal(e({ a: 1, b: 1 }), 2);
|
|
127
|
+
assert.equal(inv, 1);
|
|
128
|
+
|
|
129
|
+
assert.equal(e({ a: 1, b: 1 }), 2);
|
|
130
|
+
assert.equal(inv, 1);
|
|
131
|
+
|
|
132
|
+
assert.equal(e({ a: 1, b: 2 }), 3);
|
|
133
|
+
assert.equal(inv, 2);
|
|
134
|
+
|
|
135
|
+
assert.equal(e({ a: 1, b: 2 }), 3);
|
|
136
|
+
assert.equal(inv, 2);
|
|
137
|
+
|
|
138
|
+
assert.equal(e({ a: 2, b: 2 }), 4);
|
|
139
|
+
assert.equal(inv, 3);
|
|
140
|
+
});
|
|
141
|
+
|
|
142
|
+
it("formatting can be used inside bindings", function () {
|
|
143
|
+
let e = Expression.get((get) => get("name:prefix;Hello "));
|
|
144
|
+
assert(e({ name: "CxJS" }), "Hello CxJS");
|
|
145
|
+
});
|
|
146
|
+
|
|
147
|
+
it("allows using the fmt function inside", function () {
|
|
148
|
+
let e = Expression.compile('{[fmt({text}, "prefix;Hello ")]}');
|
|
149
|
+
assert.equal(e({ text: "CxJS" }), "Hello CxJS");
|
|
150
|
+
});
|
|
151
|
+
|
|
152
|
+
it("allows using dashes inside names", function () {
|
|
153
|
+
let e = Expression.compile("{framework-name}");
|
|
154
|
+
assert.equal(e({ "framework-name": "CxJS" }), "CxJS");
|
|
155
|
+
});
|
|
156
|
+
|
|
157
|
+
it("allows using spaces and other characters inside names", function () {
|
|
158
|
+
let e = Expression.compile("{1nv@lid js ident1fier}");
|
|
159
|
+
assert.equal(e({ "1nv@lid js ident1fier": "CxJS" }), "CxJS");
|
|
160
|
+
});
|
|
161
|
+
|
|
162
|
+
it("allows strings in subexpressions", () => {
|
|
163
|
+
let e = Expression.compile("{['1']}");
|
|
164
|
+
assert.equal(e(), "1");
|
|
165
|
+
|
|
166
|
+
let e2 = Expression.compile('%{"1"}');
|
|
167
|
+
assert.equal(e2(), "1");
|
|
168
|
+
});
|
|
169
|
+
|
|
170
|
+
it("allows string templates in nested expressions", () => {
|
|
171
|
+
Expression.registerHelper("tpl", StringTemplate.format);
|
|
172
|
+
let e = Expression.compile("tpl('{0:n;2} {1:p;2:wrap;(;)}', {value}, {percentage})");
|
|
173
|
+
assert.equal(e({ value: 1, percentage: 0.02 }), "1.00 (2.00%)");
|
|
174
|
+
|
|
175
|
+
let e2 = Expression.compile("{[tpl('{0:n;2} {1:p;2:wrap;(;)}', {value}, {percentage})]}");
|
|
176
|
+
assert.equal(e2({ value: 1, percentage: 0.02 }), "1.00 (2.00%)");
|
|
177
|
+
|
|
178
|
+
// we're going to need a better parser for this
|
|
179
|
+
// let e3 = Expression.compile("%{tpl('{0:n;2} {1:p;2:wrap;(;)}', {value}, {percentage})}");
|
|
180
|
+
// assert.equal(e3({ value: 1, percentage: 0.02 }), "1.00 (2.00%)");
|
|
181
|
+
});
|
|
182
|
+
|
|
183
|
+
it("string templates can be in the data", () => {
|
|
184
|
+
Expression.registerHelper("tpl", StringTemplate.format);
|
|
185
|
+
let e = Expression.compile("tpl({template}, {value}, {percentage})");
|
|
186
|
+
assert.equal(e({ value: 1, percentage: 0.02, template: "{0:n;2} {1:p;2:wrap;(;)}" }), "1.00 (2.00%)");
|
|
187
|
+
});
|
|
188
|
+
|
|
189
|
+
// it('are properly memoized with proxies', function () {
|
|
190
|
+
// let inv = 0;
|
|
191
|
+
// let e = Expression.get(d => { inv++; return d.a + d.b}).memoize();
|
|
192
|
+
//
|
|
193
|
+
// assert.equal(e({ a: 1, b: 1 }), 2);
|
|
194
|
+
// assert.equal(inv, 1);
|
|
195
|
+
//
|
|
196
|
+
// assert.equal(e({ a: 1, b: 1 }), 2);
|
|
197
|
+
// assert.equal(inv, 1);
|
|
198
|
+
//
|
|
199
|
+
// assert.equal(e({ a: 1, b: 2 }), 3);
|
|
200
|
+
// assert.equal(inv, 2);
|
|
201
|
+
//
|
|
202
|
+
// assert.equal(e({ a: 1, b: 2 }), 3);
|
|
203
|
+
// assert.equal(inv, 2);
|
|
204
|
+
//
|
|
205
|
+
// assert.equal(e({ a: 2, b: 2 }), 4);
|
|
206
|
+
// assert.equal(inv, 3);
|
|
207
|
+
// });
|
|
208
|
+
//
|
|
209
|
+
// it('are properly memoized with proxies and deep data', function () {
|
|
210
|
+
// let inv = 0;
|
|
211
|
+
// let e = Expression.get(d => { inv++; return d.v.a + d.v.b}).memoize();
|
|
212
|
+
//
|
|
213
|
+
// assert.equal(e({ v: { a: 1, b: 1 }}), 2);
|
|
214
|
+
// assert.equal(inv, 1);
|
|
215
|
+
//
|
|
216
|
+
// assert.equal(e({ v: { a: 1, b: 1 }}), 2);
|
|
217
|
+
// assert.equal(inv, 1);
|
|
218
|
+
//
|
|
219
|
+
// assert.equal(e({ v: { a: 1, b: 2 }}), 3);
|
|
220
|
+
// assert.equal(inv, 2);
|
|
221
|
+
//
|
|
222
|
+
// assert.equal(e({ v: { a: 1, b: 2 }}), 3);
|
|
223
|
+
// assert.equal(inv, 2);
|
|
224
|
+
//
|
|
225
|
+
// assert.equal(e({ v: { a: 2, b: 2 }}), 4);
|
|
226
|
+
// assert.equal(inv, 3);
|
|
227
|
+
// });
|
|
228
|
+
});
|
|
229
|
+
});
|
package/src/data/Ref.d.ts
CHANGED
|
@@ -1,24 +1,24 @@
|
|
|
1
|
-
import { View } from "./View";
|
|
2
|
-
|
|
3
|
-
interface RefConfig {
|
|
4
|
-
store: View;
|
|
5
|
-
path: string;
|
|
6
|
-
}
|
|
7
|
-
|
|
8
|
-
export class Ref<T = any> {
|
|
9
|
-
constructor(config: RefConfig);
|
|
10
|
-
|
|
11
|
-
init(value: T): boolean;
|
|
12
|
-
|
|
13
|
-
set(value: T): boolean;
|
|
14
|
-
|
|
15
|
-
delete(): boolean;
|
|
16
|
-
|
|
17
|
-
get(): T;
|
|
18
|
-
|
|
19
|
-
toggle(): boolean;
|
|
20
|
-
|
|
21
|
-
update(updateFn: (currentValue: T, ...args) => T, ...args): boolean;
|
|
22
|
-
|
|
23
|
-
ref<ST = any>(path: string): Ref<ST>;
|
|
24
|
-
}
|
|
1
|
+
import { View } from "./View";
|
|
2
|
+
|
|
3
|
+
interface RefConfig {
|
|
4
|
+
store: View;
|
|
5
|
+
path: string;
|
|
6
|
+
}
|
|
7
|
+
|
|
8
|
+
export class Ref<T = any> {
|
|
9
|
+
constructor(config: RefConfig);
|
|
10
|
+
|
|
11
|
+
init(value: T): boolean;
|
|
12
|
+
|
|
13
|
+
set(value: T): boolean;
|
|
14
|
+
|
|
15
|
+
delete(): boolean;
|
|
16
|
+
|
|
17
|
+
get(): T;
|
|
18
|
+
|
|
19
|
+
toggle(): boolean;
|
|
20
|
+
|
|
21
|
+
update(updateFn: (currentValue: T, ...args) => T, ...args): boolean;
|
|
22
|
+
|
|
23
|
+
ref<ST = any>(path: string): Ref<ST>;
|
|
24
|
+
}
|
package/src/data/Ref.spec.js
CHANGED
|
@@ -1,79 +1,79 @@
|
|
|
1
|
-
import assert from "assert";
|
|
2
|
-
import { Store } from "./Store";
|
|
3
|
-
import { Ref } from "./Ref";
|
|
4
|
-
import { append } from "./ops/append";
|
|
5
|
-
import { StoreRef } from "./StoreRef";
|
|
6
|
-
|
|
7
|
-
const getStore = () => {
|
|
8
|
-
return new Store({
|
|
9
|
-
data: {
|
|
10
|
-
a: 3,
|
|
11
|
-
item: {
|
|
12
|
-
firstName: "Jack",
|
|
13
|
-
},
|
|
14
|
-
array: [],
|
|
15
|
-
},
|
|
16
|
-
});
|
|
17
|
-
};
|
|
18
|
-
|
|
19
|
-
describe("Ref", () => {
|
|
20
|
-
it("can init data", () => {
|
|
21
|
-
let store = getStore();
|
|
22
|
-
let b = store.ref("b", 1);
|
|
23
|
-
assert.equal(store.get("b"), 1);
|
|
24
|
-
});
|
|
25
|
-
|
|
26
|
-
it("can set data", () => {
|
|
27
|
-
let store = getStore();
|
|
28
|
-
let b = store.ref("b", 1);
|
|
29
|
-
b.set(2);
|
|
30
|
-
assert.equal(store.get("b"), 2);
|
|
31
|
-
});
|
|
32
|
-
|
|
33
|
-
it("can delete data", () => {
|
|
34
|
-
let store = getStore();
|
|
35
|
-
let b = store.ref("item");
|
|
36
|
-
b.delete();
|
|
37
|
-
assert.equal(store.get("item"), undefined);
|
|
38
|
-
});
|
|
39
|
-
|
|
40
|
-
it("can cast itself to a ref of another type", () => {
|
|
41
|
-
class ArrayRef extends StoreRef {
|
|
42
|
-
append(...args) {
|
|
43
|
-
this.update(append, ...args);
|
|
44
|
-
}
|
|
45
|
-
}
|
|
46
|
-
let store = getStore();
|
|
47
|
-
let array = store.ref("array").as(ArrayRef);
|
|
48
|
-
array.append(1, 2, 3);
|
|
49
|
-
assert.deepEqual(array.get(), [1, 2, 3]);
|
|
50
|
-
});
|
|
51
|
-
|
|
52
|
-
it("can extend itself in a functional way", () => {
|
|
53
|
-
let store = getStore();
|
|
54
|
-
let array = store.ref("array").as(({ update, set, path }) => ({
|
|
55
|
-
append(...args) {
|
|
56
|
-
update(path, append, ...args);
|
|
57
|
-
},
|
|
58
|
-
|
|
59
|
-
clear() {
|
|
60
|
-
set(path, []);
|
|
61
|
-
},
|
|
62
|
-
}));
|
|
63
|
-
array.append(1, 2, 3);
|
|
64
|
-
assert.deepEqual(array.get(), [1, 2, 3]);
|
|
65
|
-
array.clear();
|
|
66
|
-
assert.deepEqual(array.get(), []);
|
|
67
|
-
});
|
|
68
|
-
|
|
69
|
-
it("can get subrefs", () => {
|
|
70
|
-
let store = getStore();
|
|
71
|
-
let person = new Ref({
|
|
72
|
-
get: () => store.get("person"),
|
|
73
|
-
set: (value) => store.set("person", value),
|
|
74
|
-
});
|
|
75
|
-
let name = person.ref("name");
|
|
76
|
-
name.set("John");
|
|
77
|
-
assert.equal(name.get(), "John");
|
|
78
|
-
});
|
|
79
|
-
});
|
|
1
|
+
import assert from "assert";
|
|
2
|
+
import { Store } from "./Store";
|
|
3
|
+
import { Ref } from "./Ref";
|
|
4
|
+
import { append } from "./ops/append";
|
|
5
|
+
import { StoreRef } from "./StoreRef";
|
|
6
|
+
|
|
7
|
+
const getStore = () => {
|
|
8
|
+
return new Store({
|
|
9
|
+
data: {
|
|
10
|
+
a: 3,
|
|
11
|
+
item: {
|
|
12
|
+
firstName: "Jack",
|
|
13
|
+
},
|
|
14
|
+
array: [],
|
|
15
|
+
},
|
|
16
|
+
});
|
|
17
|
+
};
|
|
18
|
+
|
|
19
|
+
describe("Ref", () => {
|
|
20
|
+
it("can init data", () => {
|
|
21
|
+
let store = getStore();
|
|
22
|
+
let b = store.ref("b", 1);
|
|
23
|
+
assert.equal(store.get("b"), 1);
|
|
24
|
+
});
|
|
25
|
+
|
|
26
|
+
it("can set data", () => {
|
|
27
|
+
let store = getStore();
|
|
28
|
+
let b = store.ref("b", 1);
|
|
29
|
+
b.set(2);
|
|
30
|
+
assert.equal(store.get("b"), 2);
|
|
31
|
+
});
|
|
32
|
+
|
|
33
|
+
it("can delete data", () => {
|
|
34
|
+
let store = getStore();
|
|
35
|
+
let b = store.ref("item");
|
|
36
|
+
b.delete();
|
|
37
|
+
assert.equal(store.get("item"), undefined);
|
|
38
|
+
});
|
|
39
|
+
|
|
40
|
+
it("can cast itself to a ref of another type", () => {
|
|
41
|
+
class ArrayRef extends StoreRef {
|
|
42
|
+
append(...args) {
|
|
43
|
+
this.update(append, ...args);
|
|
44
|
+
}
|
|
45
|
+
}
|
|
46
|
+
let store = getStore();
|
|
47
|
+
let array = store.ref("array").as(ArrayRef);
|
|
48
|
+
array.append(1, 2, 3);
|
|
49
|
+
assert.deepEqual(array.get(), [1, 2, 3]);
|
|
50
|
+
});
|
|
51
|
+
|
|
52
|
+
it("can extend itself in a functional way", () => {
|
|
53
|
+
let store = getStore();
|
|
54
|
+
let array = store.ref("array").as(({ update, set, path }) => ({
|
|
55
|
+
append(...args) {
|
|
56
|
+
update(path, append, ...args);
|
|
57
|
+
},
|
|
58
|
+
|
|
59
|
+
clear() {
|
|
60
|
+
set(path, []);
|
|
61
|
+
},
|
|
62
|
+
}));
|
|
63
|
+
array.append(1, 2, 3);
|
|
64
|
+
assert.deepEqual(array.get(), [1, 2, 3]);
|
|
65
|
+
array.clear();
|
|
66
|
+
assert.deepEqual(array.get(), []);
|
|
67
|
+
});
|
|
68
|
+
|
|
69
|
+
it("can get subrefs", () => {
|
|
70
|
+
let store = getStore();
|
|
71
|
+
let person = new Ref({
|
|
72
|
+
get: () => store.get("person"),
|
|
73
|
+
set: (value) => store.set("person", value),
|
|
74
|
+
});
|
|
75
|
+
let name = person.ref("name");
|
|
76
|
+
name.set("John");
|
|
77
|
+
assert.equal(name.get(), "John");
|
|
78
|
+
});
|
|
79
|
+
});
|