cx 26.0.14 → 26.1.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.
Files changed (263) hide show
  1. package/build/ui/VDOM.d.ts +1 -20
  2. package/build/ui/VDOM.js +1 -3
  3. package/build/ui/Widget.d.ts +1 -1
  4. package/build/ui/Widget.js +0 -5
  5. package/build/ui/app/startAppLoop.js +2 -10
  6. package/build/util/Component.js +5 -0
  7. package/build/util/test/createTestRenderer.d.ts +3 -1
  8. package/build/util/test/createTestRenderer.js +8 -2
  9. package/build/widgets/form/Checkbox.d.ts +0 -1
  10. package/build/widgets/form/Checkbox.js +1 -0
  11. package/build/widgets/form/ColorField.d.ts +0 -1
  12. package/build/widgets/form/ColorField.js +2 -2
  13. package/build/widgets/form/DateTimeField.d.ts +0 -2
  14. package/build/widgets/form/DateTimeField.js +1 -0
  15. package/build/widgets/form/DateTimePicker.d.ts +0 -2
  16. package/build/widgets/form/DateTimePicker.js +1 -0
  17. package/build/widgets/form/Radio.d.ts +0 -1
  18. package/build/widgets/form/Slider.js +9 -1
  19. package/build/widgets/form/Switch.d.ts +0 -1
  20. package/build/widgets/form/Switch.js +1 -1
  21. package/build/widgets/form/Wheel.d.ts +0 -1
  22. package/build/widgets/grid/Grid.d.ts +0 -2
  23. package/build/widgets/grid/GridCellEditor.js +3 -1
  24. package/build/widgets/icons/calendar.js +4 -3
  25. package/build/widgets/icons/check.js +2 -2
  26. package/build/widgets/icons/clear.js +2 -2
  27. package/build/widgets/icons/close.js +2 -2
  28. package/build/widgets/icons/cx.js +2 -2
  29. package/build/widgets/icons/drop-down.js +2 -2
  30. package/build/widgets/icons/file.js +2 -2
  31. package/build/widgets/icons/folder-open.js +2 -2
  32. package/build/widgets/icons/folder.js +2 -2
  33. package/build/widgets/icons/forward.js +2 -2
  34. package/build/widgets/icons/loading.js +2 -2
  35. package/build/widgets/icons/menu.js +2 -2
  36. package/build/widgets/icons/pixel-picker.js +2 -2
  37. package/build/widgets/icons/search.js +2 -2
  38. package/build/widgets/icons/sort-asc.js +2 -2
  39. package/build/widgets/icons/square.js +2 -2
  40. package/build/widgets/overlay/Overlay.d.ts +3 -0
  41. package/build/widgets/overlay/Overlay.js +3 -2
  42. package/dist/manifest.js +867 -867
  43. package/dist/ui.js +4 -18
  44. package/dist/util.js +4 -0
  45. package/dist/widgets.js +395 -319
  46. package/package.json +11 -8
  47. package/src/charts/Chart.ts +108 -108
  48. package/src/core.d.ts +182 -182
  49. package/src/data/Expression.spec.ts +229 -229
  50. package/src/data/Expression.ts +233 -233
  51. package/src/data/Grouper.ts +158 -158
  52. package/src/data/Selector.ts +10 -10
  53. package/src/data/StringTemplate.spec.ts +132 -132
  54. package/src/data/StructuredSelector.ts +146 -146
  55. package/src/data/ZoomIntoPropertyView.spec.ts +64 -64
  56. package/src/data/comparer.ts +78 -78
  57. package/src/data/computable.spec.ts +87 -87
  58. package/src/data/createStructuredSelector.ts +62 -62
  59. package/src/data/getAccessor.spec.ts +11 -11
  60. package/src/data/getAccessor.ts +74 -74
  61. package/src/data/getSelector.spec.ts +43 -43
  62. package/src/data/getSelector.ts +66 -66
  63. package/src/data/ops/filter.spec.ts +35 -35
  64. package/src/data/ops/filter.ts +9 -9
  65. package/src/data/ops/merge.ts +13 -13
  66. package/src/data/ops/removeTreeNodes.spec.ts +37 -37
  67. package/src/data/ops/updateArray.spec.ts +69 -69
  68. package/src/data/ops/updateArray.ts +31 -31
  69. package/src/data/test-types.ts +7 -7
  70. package/src/hooks/invokeCallback.spec.tsx +4 -4
  71. package/src/hooks/resolveCallback.spec.tsx +4 -4
  72. package/src/hooks/store.spec.tsx +15 -15
  73. package/src/hooks/useTrigger.spec.tsx +16 -10
  74. package/src/hooks/useTrigger.ts +26 -26
  75. package/src/index.scss +6 -6
  76. package/src/jsx-runtime.ts +79 -79
  77. package/src/svg/BoundedObject.ts +101 -101
  78. package/src/svg/util/Rect.ts +105 -105
  79. package/src/ui/CSS.ts +87 -87
  80. package/src/ui/CSSHelper.ts +17 -17
  81. package/src/ui/ContentResolver.spec.tsx +31 -29
  82. package/src/ui/Controller.spec.tsx +47 -39
  83. package/src/ui/Culture.ts +159 -159
  84. package/src/ui/Cx.spec.tsx +10 -8
  85. package/src/ui/DataProxy.spec.tsx +18 -18
  86. package/src/ui/Instance.ts +866 -866
  87. package/src/ui/IsolatedScope.spec.tsx +16 -9
  88. package/src/ui/Prop.ts +140 -140
  89. package/src/ui/PureContainer.spec.tsx +20 -18
  90. package/src/ui/RenderingContext.ts +99 -99
  91. package/src/ui/Repeater.spec.tsx +8 -6
  92. package/src/ui/Rescope.spec.tsx +13 -13
  93. package/src/ui/Restate.spec.tsx +31 -27
  94. package/src/ui/StructuredInstanceDataAccessor.ts +32 -32
  95. package/src/ui/VDOM.ts +1 -34
  96. package/src/ui/Widget.tsx +0 -7
  97. package/src/ui/adapter/TreeAdapter.spec.ts +76 -76
  98. package/src/ui/adapter/TreeAdapter.ts +185 -185
  99. package/src/ui/app/History.ts +133 -133
  100. package/src/ui/app/Url.spec.ts +50 -50
  101. package/src/ui/app/startAppLoop.tsx +5 -9
  102. package/src/ui/app/startHotAppLoop.ts +41 -41
  103. package/src/ui/createFunctionalComponent.spec.tsx +20 -18
  104. package/src/ui/layout/ContentPlaceholder.spec.tsx +46 -34
  105. package/src/ui/layout/FirstVisibleChildLayout.spec.tsx +31 -19
  106. package/src/ui/layout/FirstVisibleChildLayout.ts +60 -60
  107. package/src/ui/selection/PropertySelection.ts +87 -87
  108. package/src/util/Component.spec.ts +30 -0
  109. package/src/util/Component.ts +301 -296
  110. package/src/util/Console.ts +13 -13
  111. package/src/util/DOM.ts +88 -88
  112. package/src/util/hasKey.ts +18 -18
  113. package/src/util/index.ts +55 -55
  114. package/src/util/isArray.ts +3 -3
  115. package/src/util/isDefined.ts +3 -3
  116. package/src/util/isString.ts +3 -3
  117. package/src/util/test/createTestRenderer.tsx +9 -2
  118. package/src/widgets/AccessorBindings.spec.tsx +4 -4
  119. package/src/widgets/DocumentTitle.ts +95 -95
  120. package/src/widgets/HtmlElement.spec.tsx +6 -6
  121. package/src/widgets/ReactElementWrapper.spec.tsx +37 -37
  122. package/src/widgets/autoFocus.ts +9 -9
  123. package/src/widgets/cx.ts +63 -63
  124. package/src/widgets/form/Checkbox.tsx +0 -1
  125. package/src/widgets/form/ColorField.tsx +15 -12
  126. package/src/widgets/form/DateTimeField.tsx +0 -2
  127. package/src/widgets/form/DateTimePicker.tsx +0 -2
  128. package/src/widgets/form/Radio.tsx +0 -1
  129. package/src/widgets/form/Slider.tsx +12 -4
  130. package/src/widgets/form/Switch.tsx +2 -3
  131. package/src/widgets/form/ValidationGroup.spec.tsx +12 -12
  132. package/src/widgets/form/Wheel.tsx +0 -1
  133. package/src/widgets/grid/Grid.tsx +0 -1
  134. package/src/widgets/grid/GridCellEditor.tsx +7 -1
  135. package/src/widgets/icons/calendar.tsx +20 -15
  136. package/src/widgets/icons/check.tsx +2 -1
  137. package/src/widgets/icons/clear.tsx +2 -1
  138. package/src/widgets/icons/close.tsx +2 -2
  139. package/src/widgets/icons/cx.tsx +2 -1
  140. package/src/widgets/icons/drop-down.tsx +2 -1
  141. package/src/widgets/icons/file.tsx +2 -1
  142. package/src/widgets/icons/folder-open.tsx +2 -1
  143. package/src/widgets/icons/folder.tsx +2 -1
  144. package/src/widgets/icons/forward.tsx +2 -1
  145. package/src/widgets/icons/loading.tsx +2 -1
  146. package/src/widgets/icons/menu.tsx +2 -1
  147. package/src/widgets/icons/pixel-picker.tsx +2 -2
  148. package/src/widgets/icons/search.tsx +2 -1
  149. package/src/widgets/icons/sort-asc.tsx +2 -1
  150. package/src/widgets/icons/square.tsx +2 -1
  151. package/src/widgets/nav/Route.spec.tsx +2 -2
  152. package/src/widgets/overlay/Overlay.tsx +5 -1
  153. package/src/widgets/overlay/captureMouse.ts +195 -195
  154. package/src/widgets/overlay/createHotPromiseWindowFactory.ts +71 -71
  155. package/src/widgets/overlay/index.d.ts +11 -11
  156. package/src/widgets/overlay/tooltip-ops.ts +173 -173
  157. package/build/data/ArrayElementView.spec.d.ts +0 -1
  158. package/build/data/ArrayElementView.spec.js +0 -81
  159. package/build/data/Binding.spec.d.ts +0 -1
  160. package/build/data/Binding.spec.js +0 -61
  161. package/build/data/Expression.spec.d.ts +0 -1
  162. package/build/data/Expression.spec.js +0 -196
  163. package/build/data/Grouper.spec.d.ts +0 -1
  164. package/build/data/Grouper.spec.js +0 -48
  165. package/build/data/Ref.spec.d.ts +0 -1
  166. package/build/data/Ref.spec.js +0 -72
  167. package/build/data/Store.spec.d.ts +0 -1
  168. package/build/data/Store.spec.js +0 -19
  169. package/build/data/StoreRef.spec.d.ts +0 -1
  170. package/build/data/StoreRef.spec.js +0 -22
  171. package/build/data/StringTemplate.spec.d.ts +0 -1
  172. package/build/data/StringTemplate.spec.js +0 -112
  173. package/build/data/StructuredSelector.spec.d.ts +0 -1
  174. package/build/data/StructuredSelector.spec.js +0 -102
  175. package/build/data/View.spec.d.ts +0 -1
  176. package/build/data/View.spec.js +0 -44
  177. package/build/data/ZoomIntoPropertyView.spec.d.ts +0 -1
  178. package/build/data/ZoomIntoPropertyView.spec.js +0 -54
  179. package/build/data/comparer.spec.d.ts +0 -1
  180. package/build/data/comparer.spec.js +0 -50
  181. package/build/data/computable.spec.d.ts +0 -1
  182. package/build/data/computable.spec.js +0 -56
  183. package/build/data/createAccessorModelProxy.spec.d.ts +0 -1
  184. package/build/data/createAccessorModelProxy.spec.js +0 -30
  185. package/build/data/createStructuredSelector.spec.d.ts +0 -1
  186. package/build/data/createStructuredSelector.spec.js +0 -42
  187. package/build/data/diff/diffs.spec.d.ts +0 -1
  188. package/build/data/diff/diffs.spec.js +0 -45
  189. package/build/data/getAccessor.spec.d.ts +0 -1
  190. package/build/data/getAccessor.spec.js +0 -10
  191. package/build/data/getSelector.spec.d.ts +0 -1
  192. package/build/data/getSelector.spec.js +0 -36
  193. package/build/data/ops/append.spec.d.ts +0 -1
  194. package/build/data/ops/append.spec.js +0 -24
  195. package/build/data/ops/filter.spec.d.ts +0 -1
  196. package/build/data/ops/filter.spec.js +0 -25
  197. package/build/data/ops/findTreeNode.spec.d.ts +0 -1
  198. package/build/data/ops/findTreeNode.spec.js +0 -20
  199. package/build/data/ops/merge.spec.d.ts +0 -1
  200. package/build/data/ops/merge.spec.js +0 -23
  201. package/build/data/ops/removeTreeNodes.spec.d.ts +0 -1
  202. package/build/data/ops/removeTreeNodes.spec.js +0 -35
  203. package/build/data/ops/updateArray.spec.d.ts +0 -1
  204. package/build/data/ops/updateArray.spec.js +0 -33
  205. package/build/data/ops/updateTree.spec.d.ts +0 -1
  206. package/build/data/ops/updateTree.spec.js +0 -44
  207. package/build/hooks/invokeCallback.spec.d.ts +0 -1
  208. package/build/hooks/invokeCallback.spec.js +0 -44
  209. package/build/hooks/resolveCallback.spec.d.ts +0 -1
  210. package/build/hooks/resolveCallback.spec.js +0 -35
  211. package/build/hooks/store.spec.d.ts +0 -1
  212. package/build/hooks/store.spec.js +0 -48
  213. package/build/hooks/useTrigger.spec.d.ts +0 -1
  214. package/build/hooks/useTrigger.spec.js +0 -59
  215. package/build/ui/Controller.spec.d.ts +0 -1
  216. package/build/ui/Controller.spec.js +0 -247
  217. package/build/ui/Cx.spec.d.ts +0 -1
  218. package/build/ui/Cx.spec.js +0 -153
  219. package/build/ui/DataProxy.spec.d.ts +0 -1
  220. package/build/ui/DataProxy.spec.js +0 -208
  221. package/build/ui/IsolatedScope.spec.d.ts +0 -1
  222. package/build/ui/IsolatedScope.spec.js +0 -42
  223. package/build/ui/PureContainer.spec.d.ts +0 -1
  224. package/build/ui/PureContainer.spec.js +0 -149
  225. package/build/ui/Repeater.spec.d.ts +0 -1
  226. package/build/ui/Repeater.spec.js +0 -109
  227. package/build/ui/Rescope.spec.d.ts +0 -1
  228. package/build/ui/Rescope.spec.js +0 -134
  229. package/build/ui/Restate.spec.d.ts +0 -1
  230. package/build/ui/Restate.spec.js +0 -257
  231. package/build/ui/adapter/ArrayAdapter.spec.d.ts +0 -1
  232. package/build/ui/adapter/ArrayAdapter.spec.js +0 -44
  233. package/build/ui/adapter/TreeAdapter.spec.d.ts +0 -1
  234. package/build/ui/adapter/TreeAdapter.spec.js +0 -71
  235. package/build/ui/app/Url.spec.d.ts +0 -1
  236. package/build/ui/app/Url.spec.js +0 -43
  237. package/build/ui/createFunctionalComponent.spec.d.ts +0 -1
  238. package/build/ui/createFunctionalComponent.spec.js +0 -272
  239. package/build/ui/layout/ContentPlaceholder.spec.d.ts +0 -1
  240. package/build/ui/layout/ContentPlaceholder.spec.js +0 -333
  241. package/build/ui/layout/FirstVisibleChildLayout.spec.d.ts +0 -1
  242. package/build/ui/layout/FirstVisibleChildLayout.spec.js +0 -101
  243. package/build/util/Format.spec.d.ts +0 -1
  244. package/build/util/Format.spec.js +0 -58
  245. package/build/util/TraversalStack.spec.d.ts +0 -1
  246. package/build/util/TraversalStack.spec.js +0 -43
  247. package/build/util/date/upperBoundCheck.spec.d.ts +0 -1
  248. package/build/util/date/upperBoundCheck.spec.js +0 -22
  249. package/build/util/getSearchQueryPredicate.spec.d.ts +0 -1
  250. package/build/util/getSearchQueryPredicate.spec.js +0 -33
  251. package/build/util/isValidIdentifierName.spec.d.ts +0 -1
  252. package/build/util/isValidIdentifierName.spec.js +0 -28
  253. package/build/util/routeAppend.spec.d.ts +0 -1
  254. package/build/util/routeAppend.spec.js +0 -14
  255. package/build/widgets/AccessorBindings.spec.d.ts +0 -1
  256. package/build/widgets/AccessorBindings.spec.js +0 -40
  257. package/build/widgets/HtmlElement.spec.d.ts +0 -1
  258. package/build/widgets/HtmlElement.spec.js +0 -38
  259. package/build/widgets/form/ValidationGroup.spec.d.ts +0 -1
  260. package/build/widgets/form/ValidationGroup.spec.js +0 -62
  261. package/build/widgets/nav/Route.spec.d.ts +0 -1
  262. package/build/widgets/nav/Route.spec.js +0 -15
  263. package/dist/manifest.d.ts +0 -1443
@@ -1,208 +0,0 @@
1
- import { jsx as _jsx, jsxs as _jsxs } from "cx/jsx-runtime";
2
- import { Store } from "../data/Store";
3
- import { createTestRenderer } from "../util/test/createTestRenderer";
4
- import assert from "assert";
5
- import { Controller } from "./Controller";
6
- import { DataProxy } from "./DataProxy";
7
- import { computable } from "../data/computable";
8
- import { useState } from "../hooks";
9
- import { createFunctionalComponent } from "./createFunctionalComponent";
10
- import { Widget } from "./Widget";
11
- import { bind } from "./bind";
12
- import { tpl } from "./tpl";
13
- describe("DataProxy", () => {
14
- it("can calculate values", () => {
15
- let widget = (_jsx("cx", { children: _jsx(DataProxy, { data: {
16
- $value: { bind: "value" },
17
- }, children: _jsx("span", { text: bind("$value") }) }) }));
18
- let store = new Store({
19
- data: {
20
- value: "good",
21
- },
22
- });
23
- const component = createTestRenderer(store, widget);
24
- let tree = component.toJSON();
25
- assert.deepEqual(tree, {
26
- type: "span",
27
- props: {},
28
- children: ["good"],
29
- });
30
- });
31
- it("can write into values aliased with bind", () => {
32
- class TestController extends Controller {
33
- onInit() {
34
- this.store.set("$value", "excellent");
35
- }
36
- }
37
- let widget = (_jsx("cx", { children: _jsx(DataProxy, { data: {
38
- $value: { bind: "value" },
39
- }, controller: TestController, children: _jsx("span", { text: bind("$value") }) }) }));
40
- let store = new Store({
41
- data: {
42
- value: "good",
43
- },
44
- });
45
- const component = createTestRenderer(store, widget);
46
- let tree = component.toJSON();
47
- assert(store.get("value"), "excellent");
48
- assert.deepEqual(tree, {
49
- type: "span",
50
- props: {},
51
- children: ["excellent"],
52
- });
53
- });
54
- it("can write into aliased values using provided setters", () => {
55
- class TestController extends Controller {
56
- onInit() {
57
- this.store.set("$value", "excellent");
58
- }
59
- }
60
- let widget = (_jsx("cx", { children: _jsx(DataProxy, { data: {
61
- $value: {
62
- expr: computable("value", (value) => value),
63
- set: (value, { store }) => {
64
- store.set("value", value);
65
- },
66
- },
67
- }, controller: TestController, children: _jsx("span", { text: bind("$value") }) }) }));
68
- let store = new Store({
69
- data: {
70
- value: "good",
71
- },
72
- });
73
- const component = createTestRenderer(store, widget);
74
- let tree = component.toJSON();
75
- assert(store.get("value"), "excellent");
76
- assert.deepEqual(tree, {
77
- type: "span",
78
- props: {},
79
- children: ["excellent"],
80
- });
81
- });
82
- it("allows shorter syntax", () => {
83
- let widget = (_jsx("cx", { children: _jsx(DataProxy, { alias: "$value", value: bind("value"), children: _jsx("span", { text: bind("$value") }) }) }));
84
- let store = new Store({
85
- data: {
86
- value: "good",
87
- },
88
- });
89
- const component = createTestRenderer(store, widget);
90
- let tree = component.toJSON();
91
- assert.deepEqual(tree, {
92
- type: "span",
93
- props: {},
94
- children: ["good"],
95
- });
96
- });
97
- it("correctly updates aliased data after write", () => {
98
- class TestController extends Controller {
99
- onInit() {
100
- this.store.set("$value", "excellent");
101
- assert.equal(this.store.get("$value"), "excellent");
102
- }
103
- }
104
- let widget = (_jsx("cx", { children: _jsx(DataProxy, { data: {
105
- $value: { bind: "value" },
106
- }, controller: TestController, children: _jsx("span", { text: bind("$value") }) }) }));
107
- let store = new Store({
108
- data: {
109
- value: "good",
110
- },
111
- });
112
- const component = createTestRenderer(store, widget);
113
- let tree = component.toJSON();
114
- assert(store.get("value"), "excellent");
115
- assert.deepEqual(tree, {
116
- type: "span",
117
- props: {},
118
- children: ["excellent"],
119
- });
120
- });
121
- it("properly binds structures", () => {
122
- class TestController extends Controller {
123
- onInit() {
124
- this.store.set("$person.firstName", "Jim");
125
- }
126
- }
127
- let widget = (_jsx("cx", { children: _jsx(DataProxy, { data: {
128
- $person: { bind: "person" },
129
- }, controller: TestController, children: _jsx("span", { text: tpl("{$person.firstName} {$person.lastName}") }) }) }));
130
- let store = new Store({
131
- data: {
132
- person: { firstName: "John", lastName: "Smith" },
133
- },
134
- });
135
- const component = createTestRenderer(store, widget);
136
- let tree = component.toJSON();
137
- assert(store.get("person.firstName"), "Jim");
138
- assert.deepEqual(tree, {
139
- type: "span",
140
- props: {},
141
- children: ["Jim Smith"],
142
- });
143
- });
144
- it("works with Store refs", () => {
145
- let widget = createFunctionalComponent(() => {
146
- let valueRef = useState("a");
147
- return (_jsx("cx", { children: _jsx(DataProxy, { data: {
148
- $value: valueRef,
149
- }, children: _jsx("span", { text: bind("$value"), controller: {
150
- onInit() {
151
- valueRef.set("b");
152
- },
153
- } }) }) }));
154
- });
155
- let store = new Store({
156
- data: {
157
- //value: "good"
158
- },
159
- });
160
- const component = createTestRenderer(store, widget);
161
- let tree = component.toJSON();
162
- assert.deepEqual(tree, {
163
- type: "span",
164
- props: {},
165
- children: ["b"],
166
- });
167
- });
168
- it("controllers set on the DataProxy can see calculated values", () => {
169
- let value;
170
- let widget = Widget.create(_jsx("cx", { children: _jsx(DataProxy, { data: {
171
- $value: 5,
172
- }, controller: {
173
- onInit() {
174
- value = this.store.get("$value");
175
- },
176
- } }) }));
177
- let store = new Store();
178
- const component = createTestRenderer(store, widget);
179
- let tree = component.toJSON();
180
- assert.equal(value, 5);
181
- });
182
- it("correctly propagates undefined values over a previous value (bug)", () => {
183
- let widget = (_jsxs("cx", { children: [_jsx(DataProxy, { data: {
184
- $value: { bind: "value" },
185
- }, children: _jsx("span", { text: bind("$value") }) }), _jsx(DataProxy, { data: {
186
- $value: { bind: "dummy" },
187
- }, children: _jsx("span", { text: bind("$value") }) })] }));
188
- let store = new Store({
189
- data: {
190
- value: "initial",
191
- },
192
- });
193
- const component = createTestRenderer(store, widget);
194
- let tree = component.toJSON();
195
- assert.deepEqual(tree, [
196
- {
197
- type: "span",
198
- props: {},
199
- children: ["initial"],
200
- },
201
- {
202
- type: "span",
203
- props: {},
204
- children: null,
205
- },
206
- ]);
207
- });
208
- });
@@ -1 +0,0 @@
1
- export {};
@@ -1,42 +0,0 @@
1
- import { jsx as _jsx } from "cx/jsx-runtime";
2
- import { Store } from "../data/Store";
3
- import { createTestRenderer } from "../util/test/createTestRenderer";
4
- import assert from "assert";
5
- import { IsolatedScope } from "./IsolatedScope";
6
- import { bind } from "./bind";
7
- describe("IsolatedScope", () => {
8
- it("prevents multiple re-renders", () => {
9
- let list = [];
10
- let widget = (_jsx("cx", { children: _jsx(IsolatedScope, { data: {
11
- value: { bind: 'value' }
12
- }, children: _jsx("span", { text: bind("value"), onExplore: (context, { store }) => {
13
- list.push(store.get("value"));
14
- } }) }) }));
15
- let store = new Store({
16
- data: {
17
- value: "bad",
18
- },
19
- });
20
- const component = createTestRenderer(store, widget);
21
- let tree = component.toJSON();
22
- assert.deepEqual(list, ["bad"]);
23
- assert.deepEqual(tree, {
24
- type: "span",
25
- props: {},
26
- children: ["bad"],
27
- });
28
- //component should not re-render if unrelated data changes
29
- store.set("dummy", "dummy");
30
- tree = component.toJSON();
31
- assert.deepEqual(list, ["bad"]);
32
- //component should not re-render if unrelated data changes
33
- store.set("value", "good");
34
- tree = component.toJSON();
35
- assert.deepEqual(list, ["bad", "good"]);
36
- assert.deepEqual(tree, {
37
- type: "span",
38
- props: {},
39
- children: ["good"],
40
- });
41
- });
42
- });
@@ -1 +0,0 @@
1
- export {};
@@ -1,149 +0,0 @@
1
- import { jsx as _jsx, jsxs as _jsxs } from "cx/jsx-runtime";
2
- import { Store } from "../data/Store";
3
- import assert from "assert";
4
- import { createTestRenderer } from "../util/test/createTestRenderer";
5
- import { bind } from "./bind";
6
- import { PureContainer } from "./PureContainer";
7
- describe("PureContainer", () => {
8
- it("renders static text children", () => {
9
- let widget = (_jsx("cx", { children: _jsx(PureContainer, { children: _jsx("div", { children: "Test" }) }) }));
10
- let store = new Store();
11
- const component = createTestRenderer(store, widget);
12
- let tree = component.toJSON();
13
- assert(tree && !Array.isArray(tree), "Expected single element");
14
- assert.deepEqual(tree, {
15
- type: "div",
16
- props: {},
17
- children: ["Test"],
18
- });
19
- });
20
- it("renders multiple children", () => {
21
- let widget = (_jsx("cx", { children: _jsxs(PureContainer, { children: [_jsx("div", { children: "First" }), _jsx("div", { children: "Second" }), _jsx("div", { children: "Third" })] }) }));
22
- let store = new Store();
23
- const component = createTestRenderer(store, widget);
24
- let tree = component.toJSON();
25
- assert(Array.isArray(tree), "Expected array of elements");
26
- assert.equal(tree.length, 3);
27
- assert.deepEqual(tree, [
28
- {
29
- type: "div",
30
- props: {},
31
- children: ["First"],
32
- },
33
- {
34
- type: "div",
35
- props: {},
36
- children: ["Second"],
37
- },
38
- {
39
- type: "div",
40
- props: {},
41
- children: ["Third"],
42
- },
43
- ]);
44
- });
45
- it("renders children with data bindings", () => {
46
- let widget = (_jsx("cx", { children: _jsx(PureContainer, { children: _jsx("div", { text: bind("message") }) }) }));
47
- let store = new Store({
48
- data: {
49
- message: "Hello World",
50
- },
51
- });
52
- const component = createTestRenderer(store, widget);
53
- let tree = component.toJSON();
54
- assert(tree && !Array.isArray(tree), "Expected single element");
55
- assert.deepEqual(tree, {
56
- type: "div",
57
- props: {},
58
- children: ["Hello World"],
59
- });
60
- });
61
- it("renders nested containers", () => {
62
- let widget = (_jsx("cx", { children: _jsx(PureContainer, { children: _jsx("div", { children: _jsx(PureContainer, { children: _jsx("span", { children: "Nested" }) }) }) }) }));
63
- let store = new Store();
64
- const component = createTestRenderer(store, widget);
65
- let tree = component.toJSON();
66
- assert(tree && !Array.isArray(tree), "Expected single element");
67
- assert.deepEqual(tree, {
68
- type: "div",
69
- props: {},
70
- children: [
71
- {
72
- type: "span",
73
- props: {},
74
- children: ["Nested"],
75
- },
76
- ],
77
- });
78
- });
79
- it("conditionally renders children based on visible binding", () => {
80
- let widget = (_jsx("cx", { children: _jsxs(PureContainer, { children: [_jsx("div", { visible: bind("show"), text: "Visible" }), _jsx("div", { visible: false, text: "Hidden" })] }) }));
81
- let store = new Store({
82
- data: {
83
- show: true,
84
- },
85
- });
86
- const component = createTestRenderer(store, widget);
87
- let tree = component.toJSON();
88
- assert(tree && !Array.isArray(tree), "Expected single element");
89
- assert.deepEqual(tree, {
90
- type: "div",
91
- props: {},
92
- children: ["Visible"],
93
- });
94
- });
95
- it("handles empty children", () => {
96
- let widget = (_jsx("cx", { children: _jsx(PureContainer, { children: _jsx("div", {}) }) }));
97
- let store = new Store();
98
- const component = createTestRenderer(store, widget);
99
- let tree = component.toJSON();
100
- assert(tree && !Array.isArray(tree), "Expected single element");
101
- assert.deepEqual(tree, {
102
- type: "div",
103
- props: {},
104
- children: null,
105
- });
106
- });
107
- it("renders children from items property", () => {
108
- let widget = (_jsx("cx", { children: _jsx(PureContainer, { items: [_jsx("div", { children: "Item 1" }, "1"), _jsx("div", { children: "Item 2" }, "2")] }) }));
109
- let store = new Store();
110
- const component = createTestRenderer(store, widget);
111
- let tree = component.toJSON();
112
- assert(Array.isArray(tree), "Expected array of elements");
113
- assert.equal(tree.length, 2);
114
- assert.deepEqual(tree[0], {
115
- type: "div",
116
- props: {},
117
- children: ["Item 1"],
118
- });
119
- assert.deepEqual(tree[1], {
120
- type: "div",
121
- props: {},
122
- children: ["Item 2"],
123
- });
124
- });
125
- it("updates children when store data changes", () => {
126
- let widget = (_jsx("cx", { children: _jsx(PureContainer, { children: _jsx("div", { text: bind("count") }) }) }));
127
- let store = new Store({
128
- data: {
129
- count: 0,
130
- },
131
- });
132
- const component = createTestRenderer(store, widget);
133
- let tree = component.toJSON();
134
- assert.deepEqual(tree, {
135
- type: "div",
136
- props: {},
137
- children: ["0"],
138
- });
139
- // Update the store
140
- store.set("count", 5);
141
- // Re-render
142
- tree = component.toJSON();
143
- assert.deepEqual(tree, {
144
- type: "div",
145
- props: {},
146
- children: ["5"],
147
- });
148
- });
149
- });
@@ -1 +0,0 @@
1
- export {};
@@ -1,109 +0,0 @@
1
- import { jsx as _jsx } from "cx/jsx-runtime";
2
- import { Store } from "../data/Store";
3
- import { Repeater } from "./Repeater";
4
- import { bind } from "./bind";
5
- import { createTestRenderer } from "../util/test/createTestRenderer";
6
- import assert from "assert";
7
- describe("Repeater", () => {
8
- it("allows sorting", () => {
9
- let data = [
10
- {
11
- value: "C",
12
- },
13
- {
14
- value: "B",
15
- },
16
- {
17
- value: "A",
18
- },
19
- ];
20
- let widget = (_jsx("cx", { children: _jsx("div", { children: _jsx(Repeater, { records: data, sorters: [{ field: "value", direction: "ASC" }], recordAlias: "$item", children: _jsx("div", { text: bind("$item.value") }) }) }) }));
21
- let store = new Store();
22
- const component = createTestRenderer(store, widget);
23
- let tree = component.toJSON();
24
- assert.deepEqual(tree, {
25
- type: "div",
26
- props: {},
27
- children: [
28
- {
29
- type: "div",
30
- props: {},
31
- children: ["A"],
32
- },
33
- {
34
- type: "div",
35
- props: {},
36
- children: ["B"],
37
- },
38
- {
39
- type: "div",
40
- props: {},
41
- children: ["C"],
42
- },
43
- ],
44
- });
45
- });
46
- it("changes are properly updated", () => {
47
- let divInstances = [];
48
- let widget = (_jsx("cx", { children: _jsx("div", { children: _jsx(Repeater, { records: bind("data"), sorters: [{ field: "value", direction: "ASC" }], recordAlias: "$item", children: _jsx("div", { text: bind("$item.value"), onExplore: (context, instance) => {
49
- divInstances.push(instance);
50
- } }) }) }) }));
51
- let store = new Store({
52
- data: {
53
- data: [
54
- {
55
- value: "C",
56
- },
57
- {
58
- value: "B",
59
- },
60
- ],
61
- },
62
- });
63
- const component = createTestRenderer(store, widget);
64
- let tree = component.toJSON();
65
- assert.deepEqual(tree, {
66
- type: "div",
67
- props: {},
68
- children: [
69
- {
70
- type: "div",
71
- props: {},
72
- children: ["B"],
73
- },
74
- {
75
- type: "div",
76
- props: {},
77
- children: ["C"],
78
- },
79
- ],
80
- });
81
- divInstances = [];
82
- store.update("data", (data) => [{ value: "A" }, ...data]);
83
- assert.deepEqual(component.toJSON(), {
84
- type: "div",
85
- props: {},
86
- children: [
87
- {
88
- type: "div",
89
- props: {},
90
- children: ["A"],
91
- },
92
- {
93
- type: "div",
94
- props: {},
95
- children: ["B"],
96
- },
97
- {
98
- type: "div",
99
- props: {},
100
- children: ["C"],
101
- },
102
- ],
103
- });
104
- assert.equal(divInstances.length, 3);
105
- assert.equal(divInstances[0].store.get("$item.value"), "A");
106
- assert.equal(divInstances[1].store.get("$item.value"), "B");
107
- assert.equal(divInstances[2].store.get("$item.value"), "C");
108
- });
109
- });
@@ -1 +0,0 @@
1
- export {};
@@ -1,134 +0,0 @@
1
- import { jsx as _jsx, jsxs as _jsxs } from "cx/jsx-runtime";
2
- import { Store } from "../data/Store";
3
- import { Rescope } from "./Rescope";
4
- import { bind } from "./bind";
5
- import { createTestRenderer } from "../util/test/createTestRenderer";
6
- import { Controller } from "./Controller";
7
- import assert from "assert";
8
- import { PureContainer } from "./PureContainer";
9
- describe("Rescope", () => {
10
- it("allows simple access to nested data", () => {
11
- let store = new Store({
12
- data: {
13
- $page: {
14
- data: {
15
- name: "John",
16
- },
17
- },
18
- },
19
- });
20
- let widget = (_jsx("cx", { children: _jsx(Rescope, { bind: "$page.data", children: _jsx("div", { text: bind("name") }) }) }));
21
- const component = createTestRenderer(store, widget);
22
- let tree = component.toJSON();
23
- assert.deepEqual(tree, {
24
- type: "div",
25
- props: {},
26
- children: ["John"],
27
- });
28
- });
29
- it("allows parent access through $root", () => {
30
- let store = new Store({
31
- data: {
32
- layout: {
33
- title: "Title",
34
- },
35
- $page: {
36
- data: {
37
- name: "John",
38
- },
39
- },
40
- },
41
- });
42
- let widget = (_jsx("cx", { children: _jsx(Rescope, { bind: "$page.data", children: _jsx("div", { text: bind("$root.layout.title") }) }) }));
43
- const component = createTestRenderer(store, widget);
44
- let tree = component.toJSON();
45
- assert.deepEqual(tree, {
46
- type: "div",
47
- props: {},
48
- children: ["Title"],
49
- });
50
- });
51
- it("allows nested data access through data", () => {
52
- let store = new Store({
53
- data: {
54
- layout: {
55
- title: "Title",
56
- },
57
- },
58
- });
59
- let widget = (_jsx("cx", { children: _jsx(Rescope, { bind: "$page", data: { $title: { bind: "layout.title" } }, children: _jsx("div", { text: bind("$title") }) }) }));
60
- const component = createTestRenderer(store, widget);
61
- let tree = component.toJSON();
62
- assert.deepEqual(tree, {
63
- type: "div",
64
- props: {},
65
- children: ["Title"],
66
- });
67
- });
68
- it("nested data mutations are correctly propagated to the parent store", () => {
69
- let store = new Store({
70
- data: {
71
- item: {
72
- value: 0,
73
- },
74
- },
75
- });
76
- let widget = (_jsxs("cx", { children: [_jsx(Rescope, { bind: "$page", data: { $value: { bind: "item.value" } }, children: _jsx(PureContainer, { controller: {
77
- onInit() {
78
- this.store.set("$value", 2);
79
- },
80
- } }) }), _jsx("div", { text: bind("item.value") })] }));
81
- const component = createTestRenderer(store, widget);
82
- let tree = component.toJSON();
83
- assert.deepEqual(tree, {
84
- type: "div",
85
- props: {},
86
- children: ["2"],
87
- });
88
- });
89
- it("visible is calculated based on the inner scope", () => {
90
- let store = new Store({
91
- data: {
92
- layout: {
93
- title: "Title",
94
- },
95
- $page: {
96
- data: {
97
- visible: true,
98
- name: "John",
99
- },
100
- },
101
- },
102
- });
103
- let widget = (_jsx("cx", { children: _jsx(Rescope, { bind: "$page.data", visible: bind("visible"), children: _jsx("div", { text: bind("name") }) }) }));
104
- const component = createTestRenderer(store, widget);
105
- let tree = component.toJSON();
106
- assert.deepEqual(tree, {
107
- type: "div",
108
- props: {},
109
- children: ["John"],
110
- });
111
- });
112
- it("controllers see inner scope", () => {
113
- let store = new Store({
114
- data: {
115
- $page: {
116
- data: {
117
- visible: true,
118
- name: "John",
119
- },
120
- },
121
- },
122
- });
123
- let testName = null;
124
- class TestController extends Controller {
125
- onInit() {
126
- testName = this.store.get("name");
127
- }
128
- }
129
- let widget = (_jsx("cx", { children: _jsx(Rescope, { bind: "$page.data", controller: TestController, children: _jsx("div", { text: bind("name") }) }) }));
130
- const component = createTestRenderer(store, widget);
131
- component.toJSON();
132
- assert.equal(testName, "John");
133
- });
134
- });
@@ -1 +0,0 @@
1
- export {};