@genexus/genexus-ide-ui 0.0.62 → 0.0.63

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 (113) hide show
  1. package/dist/cjs/{ch-tree-x_3.cjs.entry.js → ch-checkbox_4.cjs.entry.js} +277 -71
  2. package/dist/cjs/ch-next-data-modeling-render.cjs.entry.js +242 -0
  3. package/dist/cjs/{ch-next-data-modeling-item.cjs.entry.js → ch-next-data-modeling_2.cjs.entry.js} +20 -1
  4. package/dist/cjs/ch-tree-view-render-wrapper.cjs.entry.js +160 -0
  5. package/dist/cjs/genexus-ide-ui.cjs.js +1 -1
  6. package/dist/cjs/gx-ide-kb-manager-export.cjs.entry.js +41 -39
  7. package/dist/cjs/gx-ide-kb-manager-import.cjs.entry.js +23 -11
  8. package/dist/cjs/gx-ide-test.cjs.entry.js +107 -122
  9. package/dist/cjs/gxg-color-picker.cjs.entry.js +2 -2
  10. package/dist/cjs/gxg-title-editable.cjs.entry.js +11 -4
  11. package/dist/cjs/{gxg-tree_2.cjs.entry.js → gxg-tree-item.cjs.entry.js} +0 -212
  12. package/dist/cjs/gxg-tree-view.cjs.entry.js +165 -0
  13. package/dist/cjs/gxg-tree.cjs.entry.js +218 -0
  14. package/dist/cjs/loader.cjs.js +1 -1
  15. package/dist/collection/collection-manifest.json +5 -3
  16. package/dist/collection/components/_test/test.css +5 -0
  17. package/dist/collection/components/_test/test.js +109 -220
  18. package/dist/collection/components/kb-manager-export/helpers.js +7 -23
  19. package/dist/collection/components/kb-manager-export/kb-manager-export.css +20 -0
  20. package/dist/collection/components/kb-manager-export/kb-manager-export.js +42 -22
  21. package/dist/collection/components/kb-manager-import/gx-ide-assets/kb-manager-import/langs/kb-manager-import.lang.en.json +1 -0
  22. package/dist/collection/components/kb-manager-import/kb-manager-import.js +23 -11
  23. package/dist/components/ch-next-data-modeling-item.js +1 -457
  24. package/dist/components/ch-next-data-modeling-render.js +295 -0
  25. package/dist/components/ch-next-data-modeling.js +1 -27
  26. package/dist/components/ch-tree-view-item.js +6 -0
  27. package/dist/components/ch-tree-view-render-wrapper.js +224 -0
  28. package/dist/components/ch-tree-view-render.js +6 -0
  29. package/dist/components/ch-tree-view.js +6 -0
  30. package/dist/components/gx-ide-kb-manager-export.js +75 -73
  31. package/dist/components/gx-ide-kb-manager-import.js +38 -20
  32. package/dist/components/gx-ide-references.js +21 -15
  33. package/dist/components/gx-ide-test.js +120 -160
  34. package/dist/components/gxg-color-picker.js +2 -2
  35. package/dist/components/gxg-title-editable.js +12 -4
  36. package/dist/components/gxg-tree-item.js +614 -1
  37. package/dist/components/gxg-tree-view.js +2 -2
  38. package/dist/components/gxg-tree.js +236 -1
  39. package/dist/components/index.js +5 -3
  40. package/dist/components/next-data-modeling-item.js +466 -0
  41. package/dist/{esm/ch-next-data-modeling.entry.js → components/next-data-modeling.js} +21 -7
  42. package/dist/components/{tree-x-list-item.js → tree-view-item.js} +9 -9
  43. package/dist/components/{ch-test-tree-x.js → tree-view-render.js} +168 -28
  44. package/dist/components/tree-view.js +410 -435
  45. package/dist/components/tree-view2.js +226 -0
  46. package/dist/esm/{ch-tree-x_3.entry.js → ch-checkbox_4.entry.js} +275 -70
  47. package/dist/esm/ch-next-data-modeling-render.entry.js +238 -0
  48. package/dist/esm/{ch-next-data-modeling-item.entry.js → ch-next-data-modeling_2.entry.js} +21 -3
  49. package/dist/esm/ch-tree-view-render-wrapper.entry.js +156 -0
  50. package/dist/esm/genexus-ide-ui.js +1 -1
  51. package/dist/esm/gx-ide-kb-manager-export.entry.js +41 -39
  52. package/dist/esm/gx-ide-kb-manager-import.entry.js +23 -11
  53. package/dist/esm/gx-ide-test.entry.js +108 -123
  54. package/dist/esm/gxg-color-picker.entry.js +2 -2
  55. package/dist/esm/gxg-title-editable.entry.js +11 -4
  56. package/dist/{components/gxg-tree-item2.js → esm/gxg-tree-item.entry.js} +9 -79
  57. package/dist/esm/gxg-tree-view.entry.js +161 -0
  58. package/dist/{components/gxg-tree2.js → esm/gxg-tree.entry.js} +8 -32
  59. package/dist/esm/loader.js +1 -1
  60. package/dist/genexus-ide-ui/genexus-ide-ui.css +1 -1
  61. package/dist/genexus-ide-ui/genexus-ide-ui.esm.js +1 -1
  62. package/dist/genexus-ide-ui/gx-ide-assets/kb-manager-import/langs/kb-manager-import.lang.en.json +1 -0
  63. package/dist/genexus-ide-ui/p-13177896.entry.js +1 -0
  64. package/dist/genexus-ide-ui/p-19fef562.entry.js +1 -0
  65. package/dist/genexus-ide-ui/p-2781b92a.entry.js +1 -0
  66. package/dist/genexus-ide-ui/p-2c17e71d.entry.js +1 -0
  67. package/dist/genexus-ide-ui/p-40a57a36.entry.js +1 -0
  68. package/dist/genexus-ide-ui/p-636d02fa.entry.js +1 -0
  69. package/dist/genexus-ide-ui/p-7b63be93.entry.js +1 -0
  70. package/dist/genexus-ide-ui/p-8a7c4561.entry.js +1 -0
  71. package/dist/genexus-ide-ui/p-a2cb0e6b.entry.js +1 -0
  72. package/dist/genexus-ide-ui/p-a9c8b373.entry.js +1 -0
  73. package/dist/genexus-ide-ui/p-b819706e.entry.js +1 -0
  74. package/dist/genexus-ide-ui/p-bacd879c.entry.js +1 -0
  75. package/dist/node_modules/@genexus/chameleon-controls-library/dist/collection/components/next/data-modeling-render/next-data-modeling-render.css +3 -0
  76. package/dist/node_modules/@genexus/chameleon-controls-library/dist/collection/components/renders/tree-view/tree-view-render.css +3 -0
  77. package/dist/node_modules/@genexus/chameleon-controls-library/dist/collection/components/test/test-tree-view/tree-view-render-wrapper.css +0 -0
  78. package/dist/node_modules/@genexus/chameleon-controls-library/dist/collection/components/tree-view/tree-view/tree-view.css +45 -0
  79. package/dist/node_modules/@genexus/gemini/dist/collection/components/title-editable/title-editable.css +17 -3
  80. package/dist/node_modules/@genexus/gemini/dist/collection/components/tree-view/tree-view.css +5 -2
  81. package/dist/types/common/helpers.d.ts +2 -2
  82. package/dist/types/components/_test/test.d.ts +3 -35
  83. package/dist/types/components/kb-manager-export/helpers.d.ts +4 -4
  84. package/dist/types/components/kb-manager-export/kb-manager-export.d.ts +10 -5
  85. package/dist/types/components/kb-manager-import/helpers.d.ts +3 -3
  86. package/dist/types/components/kb-manager-import/kb-manager-import.d.ts +7 -6
  87. package/dist/types/components/references/helpers.d.ts +2 -2
  88. package/dist/types/components/references/references.d.ts +3 -3
  89. package/dist/types/components.d.ts +3 -60
  90. package/package.json +3 -3
  91. package/dist/cjs/ch-checkbox.cjs.entry.js +0 -93
  92. package/dist/cjs/ch-next-data-modeling.cjs.entry.js +0 -19
  93. package/dist/cjs/ch-test-tree-x.cjs.entry.js +0 -458
  94. package/dist/components/ch-tree-x-list-item.js +0 -6
  95. package/dist/components/ch-tree-x.js +0 -6
  96. package/dist/components/tree-x.js +0 -504
  97. package/dist/esm/ch-checkbox.entry.js +0 -89
  98. package/dist/esm/ch-test-tree-x.entry.js +0 -454
  99. package/dist/esm/gxg-tree_2.entry.js +0 -757
  100. package/dist/genexus-ide-ui/p-092ccacd.entry.js +0 -1
  101. package/dist/genexus-ide-ui/p-1ad68b23.entry.js +0 -3
  102. package/dist/genexus-ide-ui/p-3442d19a.entry.js +0 -1
  103. package/dist/genexus-ide-ui/p-39968306.entry.js +0 -1
  104. package/dist/genexus-ide-ui/p-5755f985.entry.js +0 -1
  105. package/dist/genexus-ide-ui/p-85597097.entry.js +0 -1
  106. package/dist/genexus-ide-ui/p-9e530c7d.entry.js +0 -1
  107. package/dist/genexus-ide-ui/p-ad5040e4.entry.js +0 -1
  108. package/dist/genexus-ide-ui/p-aeb3b032.entry.js +0 -1
  109. package/dist/genexus-ide-ui/p-c53522c9.entry.js +0 -1
  110. package/dist/genexus-ide-ui/p-d104f9a4.entry.js +0 -1
  111. package/dist/node_modules/@genexus/chameleon-controls-library/dist/collection/components/test/test-tree-x.css +0 -3
  112. package/dist/node_modules/@genexus/chameleon-controls-library/dist/collection/components/tree-view/tree-x/tree-x.css +0 -45
  113. /package/dist/node_modules/@genexus/chameleon-controls-library/dist/collection/components/tree-view/{tree-x-list-item/tree-x-list-item.css → tree-view-item/tree-view-item.css} +0 -0
@@ -1,458 +0,0 @@
1
- 'use strict';
2
-
3
- Object.defineProperty(exports, '__esModule', { value: true });
4
-
5
- const index = require('./index-5a32426a.js');
6
-
7
- const testTreeXCss = "ch-test-tree-x{display:contents}";
8
-
9
- const DEFAULT_DRAG_DISABLED_VALUE = false;
10
- const DEFAULT_DROP_DISABLED_VALUE = false;
11
- const DEFAULT_CLASS_VALUE = "tree-view-item";
12
- const DEFAULT_EDITABLE_ITEMS_VALUE = true;
13
- const DEFAULT_EXPANDED_VALUE = false;
14
- const DEFAULT_INDETERMINATE_VALUE = false;
15
- const DEFAULT_LAZY_VALUE = false;
16
- const DEFAULT_ORDER_VALUE = 0;
17
- const DEFAULT_SELECTED_VALUE = false;
18
- const ChTestTreeX = class {
19
- constructor(hostRef) {
20
- index.registerInstance(this, hostRef);
21
- this.checkedItemsChange = index.createEvent(this, "checkedItemsChange", 7);
22
- this.itemContextmenu = index.createEvent(this, "itemContextmenu", 7);
23
- this.itemOpenReference = index.createEvent(this, "itemOpenReference", 7);
24
- this.selectedItemsChange = index.createEvent(this, "selectedItemsChange", 7);
25
- // UI Models
26
- this.flattenedTreeModel = new Map();
27
- this.flattenedCheckboxTreeModel = new Map();
28
- this.selectedItems = new Set();
29
- /**
30
- * This property lets you specify if the tree is waiting to process the drop
31
- * of items.
32
- */
33
- this.waitDropProcessing = false;
34
- /**
35
- * Set this attribute if you want display a checkbox in all items by default.
36
- */
37
- this.checkbox = false;
38
- /**
39
- * Set this attribute if you want the checkbox to be checked in all items by
40
- * default.
41
- * Only works if `checkbox = true`
42
- */
43
- this.checked = false;
44
- /**
45
- * This attribute lets you specify if the drag operation is disabled in all
46
- * items by default. If `true`, the items can't be dragged.
47
- */
48
- this.dragDisabled = DEFAULT_DRAG_DISABLED_VALUE;
49
- /**
50
- * This attribute lets you specify if the drop operation is disabled in all
51
- * items by default. If `true`, the items won't accept any drops.
52
- */
53
- this.dropDisabled = DEFAULT_DROP_DISABLED_VALUE;
54
- /**
55
- * This attribute lets you specify if the edit operation is enabled in all
56
- * items by default. If `true`, the items can edit its caption in place.
57
- */
58
- this.editableItems = DEFAULT_EDITABLE_ITEMS_VALUE;
59
- /**
60
- * Set this attribute if you want to allow multi selection of the items.
61
- */
62
- this.multiSelection = false;
63
- /**
64
- * `true` to display the relation between tree items and tree lists using
65
- * lines.
66
- */
67
- this.showLines = "none";
68
- /**
69
- * Set this attribute if you want all the children item's checkboxes to be
70
- * checked when the parent item checkbox is checked, or to be unchecked when
71
- * the parent item checkbox is unchecked.
72
- * This attribute will be used in all items by default.
73
- */
74
- this.toggleCheckboxes = false;
75
- /**
76
- * This property lets you define the model of the ch-tree-x control.
77
- */
78
- this.treeModel = [];
79
- this.handleDroppableZoneEnter = (event) => {
80
- if (!this.checkDroppableZoneCallback) {
81
- return;
82
- }
83
- event.stopPropagation();
84
- // Suppose the request is made immediately by executing the callback
85
- const requestTimestamp = new Date().getTime();
86
- const dropInformation = event.detail;
87
- const promise = this.checkDroppableZoneCallback(dropInformation);
88
- promise.then(validDrop => {
89
- this.updateValidDropZone(requestTimestamp, dropInformation.newContainer.id, dropInformation.draggedItems, validDrop);
90
- });
91
- };
92
- this.handleSelectedItemsChange = (event) => {
93
- event.stopPropagation();
94
- const itemsToProcess = new Map(event.detail);
95
- // Remove no longer selected items
96
- this.selectedItems.forEach(selectedItemId => {
97
- const itemUIModel = this.flattenedTreeModel.get(selectedItemId).item;
98
- const itemIsStillSelected = itemsToProcess.get(selectedItemId);
99
- // The item does not need to be added. Remove it from the processed list
100
- if (itemIsStillSelected) {
101
- itemUIModel.expanded = itemIsStillSelected.expanded; // Update expanded state
102
- itemsToProcess.delete(selectedItemId);
103
- }
104
- // The item must be un-selected in the UI Model
105
- else {
106
- itemUIModel.selected = false;
107
- this.selectedItems.delete(selectedItemId);
108
- }
109
- });
110
- // Add new selected items
111
- itemsToProcess.forEach((newSelectedItemInfo, itemId) => {
112
- const newSelectedItem = this.flattenedTreeModel.get(itemId).item;
113
- newSelectedItem.selected = true;
114
- newSelectedItem.expanded = newSelectedItemInfo.expanded;
115
- this.selectedItems.add(itemId);
116
- });
117
- this.selectedItemsChange.emit(event.detail);
118
- };
119
- this.handleExpandedItemChange = (event) => {
120
- const detail = event.detail;
121
- const itemInfo = this.flattenedTreeModel.get(detail.id).item;
122
- itemInfo.expanded = detail.expanded;
123
- };
124
- this.handleItemContextmenu = (event) => {
125
- event.stopPropagation();
126
- this.itemContextmenu.emit(event.detail);
127
- };
128
- this.handleItemsDropped = (event) => {
129
- if (!this.dropItemsCallback) {
130
- return;
131
- }
132
- event.stopPropagation();
133
- const dataTransferInfo = event.detail;
134
- const newContainer = dataTransferInfo.newContainer;
135
- const newParentId = newContainer.id;
136
- // Check if the parent exists in the UI Model
137
- if (!this.flattenedTreeModel.get(newParentId)) {
138
- return;
139
- }
140
- const draggedItems = dataTransferInfo.draggedItems;
141
- if (draggedItems.length === 0) {
142
- return;
143
- }
144
- const promise = this.dropItemsCallback(dataTransferInfo);
145
- this.waitDropProcessing = true;
146
- promise.then(async (response) => {
147
- this.waitDropProcessing = false;
148
- if (!response.acceptDrop) {
149
- return;
150
- }
151
- const newParentUIModel = this.flattenedTreeModel.get(newParentId).item;
152
- // Only move the items to the new parent, keeping the state
153
- if (dataTransferInfo.dropInTheSameTree) {
154
- // Add the UI models to the new container and remove the UI models from
155
- // the old containers
156
- draggedItems.forEach(this.moveItemToNewParent(newParentUIModel));
157
- // When the selected items are moved, the tree must remove its internal
158
- // state to not have undefined references
159
- if (dataTransferInfo.draggingSelectedItems) {
160
- await this.treeRef.clearSelectedItemsInfo();
161
- }
162
- }
163
- // Add the new items
164
- else {
165
- if (response.items == null) {
166
- return;
167
- }
168
- // Add new items to the parent
169
- newParentUIModel.items.push(...response.items);
170
- // Flatten the new UI models
171
- response.items.forEach(this.flattenItemUIModel(newParentUIModel));
172
- }
173
- this.sortItems(newParentUIModel.items);
174
- // Open the item to visualize the new subitems
175
- newParentUIModel.expanded = true;
176
- // There is no need to force and update, since the waitDropProcessing
177
- // prop was modified
178
- });
179
- };
180
- this.moveItemToNewParent = (newParentUIModel) => (dataTransferInfo) => {
181
- const itemUIModelExtended = this.flattenedTreeModel.get(dataTransferInfo.id);
182
- const item = itemUIModelExtended.item;
183
- const oldParentItem = itemUIModelExtended.parentItem;
184
- // Remove the UI model from the previous parent
185
- oldParentItem.items.splice(oldParentItem.items.indexOf(item), 1);
186
- // Add the UI Model to the new parent
187
- newParentUIModel.items.push(item);
188
- // Reference the new parent in the item
189
- itemUIModelExtended.parentItem = newParentUIModel;
190
- };
191
- this.renderSubModel = (treeSubModel, lastItem, level) => {
192
- var _a, _b, _c, _d, _e, _f;
193
- return (index.h("ch-tree-x-list-item", { id: treeSubModel.id, caption: treeSubModel.caption, checkbox: (_a = treeSubModel.checkbox) !== null && _a !== void 0 ? _a : this.checkbox, checked: (_b = treeSubModel.checked) !== null && _b !== void 0 ? _b : this.checked, class: treeSubModel.class, disabled: treeSubModel.disabled, downloading: treeSubModel.downloading, dragDisabled: (_c = treeSubModel.dragDisabled) !== null && _c !== void 0 ? _c : this.dragDisabled, dropDisabled: (_d = treeSubModel.dropDisabled) !== null && _d !== void 0 ? _d : this.dropDisabled, editable: (_e = treeSubModel.editable) !== null && _e !== void 0 ? _e : this.editableItems, expanded: treeSubModel.expanded, indeterminate: treeSubModel.indeterminate, lastItem: lastItem, lazyLoad: treeSubModel.lazy, leaf: treeSubModel.leaf, leftImgSrc: treeSubModel.leftImgSrc, level: level, metadata: treeSubModel.metadata, rightImgSrc: treeSubModel.rightImgSrc, selected: treeSubModel.selected, showExpandableButton: treeSubModel.showExpandableButton, showLines: this.showLines, toggleCheckboxes: (_f = treeSubModel.toggleCheckboxes) !== null && _f !== void 0 ? _f : this.toggleCheckboxes }, !treeSubModel.leaf &&
194
- treeSubModel.items != null &&
195
- treeSubModel.items.map((subModel, index) => this.renderSubModel(subModel, this.showLines && index === treeSubModel.items.length - 1, level + 1))));
196
- };
197
- this.flattenItemUIModel = (parentModel) => (item) => {
198
- var _a, _b, _c, _d, _e, _f;
199
- this.flattenedTreeModel.set(item.id, {
200
- parentItem: parentModel,
201
- item: item
202
- });
203
- // Add the items that have a checkbox in a separate Map
204
- if ((_a = item.checkbox) !== null && _a !== void 0 ? _a : this.checkbox) {
205
- this.flattenedCheckboxTreeModel.set(item.id, {
206
- parentItem: parentModel,
207
- item: item
208
- });
209
- }
210
- // Make sure the properties are with their default values to avoid issues
211
- // when reusing DOM nodes
212
- item.class || (item.class = DEFAULT_CLASS_VALUE);
213
- (_b = item.expanded) !== null && _b !== void 0 ? _b : (item.expanded = DEFAULT_EXPANDED_VALUE);
214
- (_c = item.indeterminate) !== null && _c !== void 0 ? _c : (item.indeterminate = DEFAULT_INDETERMINATE_VALUE);
215
- (_d = item.lazy) !== null && _d !== void 0 ? _d : (item.lazy = DEFAULT_LAZY_VALUE);
216
- (_e = item.order) !== null && _e !== void 0 ? _e : (item.order = DEFAULT_ORDER_VALUE);
217
- (_f = item.selected) !== null && _f !== void 0 ? _f : (item.selected = DEFAULT_SELECTED_VALUE);
218
- if (item.selected) {
219
- this.selectedItems.add(item.id);
220
- }
221
- this.flattenSubModel(item);
222
- };
223
- }
224
- handleTreeModelChange() {
225
- this.flattenModel();
226
- }
227
- /**
228
- * Given an item id, an array of items to add, the download status and the
229
- * lazy state, updates the item's UI Model.
230
- */
231
- async loadLazyContent(itemId, items, downloading = false, lazy = false) {
232
- const itemToLazyLoadContent = this.flattenedTreeModel.get(itemId).item;
233
- // Establish that the content was lazy loaded
234
- itemToLazyLoadContent.downloading = downloading;
235
- itemToLazyLoadContent.lazy = lazy;
236
- // Check if there is items to add
237
- if (items == null) {
238
- return;
239
- }
240
- // @todo What happens in the server when dropping items on a lazy node?
241
- itemToLazyLoadContent.items = items;
242
- this.sortItems(itemToLazyLoadContent.items);
243
- this.flattenSubModel(itemToLazyLoadContent);
244
- // Re-sync checked items
245
- this.emitCheckedItemsChange();
246
- // Force re-render
247
- index.forceUpdate(this);
248
- }
249
- /**
250
- * Given an item id, it displays and scrolls into the item view.
251
- */
252
- async scrollIntoVisible(treeItemId) {
253
- const itemUIModel = this.flattenedTreeModel.get(treeItemId);
254
- if (!itemUIModel) {
255
- // @todo Check if the item is on the server?
256
- return;
257
- }
258
- let visitedNode = itemUIModel.parentItem;
259
- // While the parent is not the root, update the UI Models
260
- while (visitedNode && visitedNode.id != null) {
261
- // Expand the item
262
- visitedNode.expanded = true;
263
- const visitedNodeUIModel = this.flattenedTreeModel.get(visitedNode.id);
264
- visitedNode = visitedNodeUIModel.parentItem;
265
- }
266
- index.forceUpdate(this);
267
- // @todo For some reason, when the model is created using the "big model" option,
268
- // this implementation does not work when only the UI Model is updated. So, to
269
- // expand the items, we have to delegate the responsibility to the tree-x
270
- this.treeRef.scrollIntoVisible(treeItemId);
271
- }
272
- /**
273
- * This method is used to toggle a tree item by the tree item id/ids.
274
- *
275
- * @param treeItemIds An array id the tree items to be toggled.
276
- * @param expand A boolean indicating that the tree item should be expanded or collapsed. (optional)
277
- * @returns The modified items after the method was called.
278
- */
279
- async toggleItems(treeItemIds, expand) {
280
- if (!treeItemIds) {
281
- return [];
282
- }
283
- const modifiedTreeItems = [];
284
- treeItemIds.forEach(treeItemId => {
285
- const itemInfo = this.flattenedTreeModel.get(treeItemId).item;
286
- if (itemInfo) {
287
- itemInfo.expanded = expand !== null && expand !== void 0 ? expand : !itemInfo.expanded;
288
- modifiedTreeItems.push({
289
- id: itemInfo.id,
290
- expanded: itemInfo.expanded
291
- });
292
- }
293
- });
294
- // Force re-render
295
- index.forceUpdate(this);
296
- return modifiedTreeItems;
297
- }
298
- /**
299
- * Given a subset of item's properties, it updates all item UI models.
300
- */
301
- async updateAllItemsProperties(properties) {
302
- [...this.flattenedTreeModel.values()].forEach(itemUIModel => {
303
- if (properties.expanded != null) {
304
- itemUIModel.item.expanded = properties.expanded;
305
- }
306
- if (properties.checked != null) {
307
- itemUIModel.item.checked = properties.checked;
308
- itemUIModel.item.indeterminate = false;
309
- }
310
- });
311
- index.forceUpdate(this);
312
- }
313
- /**
314
- * Given a item list and the properties to update, it updates the properties
315
- * of the items in the list.
316
- */
317
- async updateItemsProperties(items, properties) {
318
- items.forEach(item => {
319
- const itemUIModel = this.flattenedTreeModel.get(item);
320
- this.updateItemProperty(itemUIModel, properties);
321
- });
322
- index.forceUpdate(this);
323
- }
324
- /**
325
- * Update the information about the valid droppable zones.
326
- * @param requestTimestamp Time where the request to the server was made. Useful to avoid having old information.
327
- * @param newContainerId ID of the container where the drag is trying to be made.
328
- * @param draggedItems Information about the dragged items.
329
- * @param validDrop Current state of the droppable zone.
330
- */
331
- async updateValidDropZone(requestTimestamp, newContainerId, draggedItems, validDrop) {
332
- this.treeRef.updateValidDropZone(requestTimestamp, newContainerId, draggedItems, validDrop);
333
- }
334
- updateItemProperty(itemUIModel, properties) {
335
- if (!itemUIModel) {
336
- return;
337
- }
338
- const itemInfo = itemUIModel.item;
339
- Object.keys(properties).forEach(propertyName => {
340
- itemInfo[propertyName] = properties[propertyName];
341
- });
342
- }
343
- updateCheckboxValue(event) {
344
- event.stopPropagation();
345
- const detail = event.detail;
346
- const treeItemId = detail.id;
347
- const itemUIModel = this.flattenedCheckboxTreeModel.get(treeItemId);
348
- // In some cases, when the `treeModel` and `checked` properties are updated
349
- // outside of the tree control, some events are fired with undefined references
350
- if (!itemUIModel) {
351
- return;
352
- }
353
- const itemInfo = itemUIModel.item;
354
- itemInfo.checked = detail.checked;
355
- itemInfo.indeterminate = detail.indeterminate;
356
- this.emitCheckedItemsChange();
357
- }
358
- loadLazyChildrenHandler(event) {
359
- if (!this.lazyLoadTreeItemsCallback) {
360
- return;
361
- }
362
- event.stopPropagation();
363
- const treeItemId = event.detail;
364
- const promise = this.lazyLoadTreeItemsCallback(treeItemId);
365
- event.target.downloading = true;
366
- promise.then(result => {
367
- this.loadLazyContent(treeItemId, result);
368
- });
369
- }
370
- handleCaptionModification(event) {
371
- if (!this.modifyItemCaptionCallback) {
372
- return;
373
- }
374
- event.stopPropagation();
375
- const itemRef = event.target;
376
- const itemId = event.detail.id;
377
- const itemUIModel = this.flattenedTreeModel.get(itemId);
378
- const itemInfo = itemUIModel.item;
379
- const newCaption = event.detail.caption;
380
- const oldCaption = itemInfo.caption;
381
- // Optimistic UI: Update the caption in the UI Model before the change is
382
- // completed in the server
383
- itemInfo.caption = newCaption;
384
- // Due to performance reasons, we don't make a shallow copy of the
385
- // treeModel to force a re-render
386
- itemRef.caption = newCaption;
387
- const promise = this.modifyItemCaptionCallback(itemId, newCaption);
388
- promise.then(status => {
389
- if (status.success) {
390
- this.sortItems(itemUIModel.parentItem.items);
391
- // Force re-render
392
- index.forceUpdate(this);
393
- }
394
- else {
395
- itemRef.caption = oldCaption;
396
- itemInfo.caption = oldCaption;
397
- // Do something with the error message
398
- }
399
- });
400
- }
401
- handleOpenReference(event) {
402
- event.stopPropagation();
403
- this.itemOpenReference.emit(event.detail);
404
- }
405
- emitCheckedItemsChange() {
406
- // New copy of the checked items
407
- const allItemsWithCheckbox = new Map(this.flattenedCheckboxTreeModel);
408
- // Update the checked value if not defined
409
- allItemsWithCheckbox.forEach(itemUIModel => {
410
- var _a;
411
- var _b;
412
- (_a = (_b = itemUIModel.item).checked) !== null && _a !== void 0 ? _a : (_b.checked = this.checked);
413
- });
414
- this.checkedItemsChange.emit(allItemsWithCheckbox);
415
- }
416
- flattenSubModel(model) {
417
- const items = model.items;
418
- if (!items) {
419
- // Make sure that subtrees don't have an undefined array
420
- if (model.leaf !== true) {
421
- model.items = [];
422
- }
423
- return;
424
- }
425
- this.sortItems(items);
426
- items.forEach(this.flattenItemUIModel(model));
427
- }
428
- sortItems(items) {
429
- // Ensure that items are sorted
430
- if (this.sortItemsCallback) {
431
- this.sortItemsCallback(items);
432
- }
433
- }
434
- flattenModel() {
435
- this.flattenedTreeModel.clear();
436
- this.flattenedCheckboxTreeModel.clear();
437
- this.selectedItems.clear();
438
- // The model was updated at runtime, so we need to clear the references
439
- if (this.treeRef) {
440
- this.treeRef.clearSelectedItemsInfo();
441
- }
442
- this.flattenSubModel({ id: null, caption: null, items: this.treeModel });
443
- // Re-sync checked items
444
- this.emitCheckedItemsChange();
445
- }
446
- componentWillLoad() {
447
- this.flattenModel();
448
- }
449
- render() {
450
- return (index.h("ch-tree-x", { class: this.cssClass || null, multiSelection: this.multiSelection, waitDropProcessing: this.waitDropProcessing, onDroppableZoneEnter: this.handleDroppableZoneEnter, onExpandedItemChange: this.handleExpandedItemChange, onItemContextmenu: this.handleItemContextmenu, onItemsDropped: this.handleItemsDropped, onSelectedItemsChange: this.handleSelectedItemsChange, ref: el => (this.treeRef = el) }, this.treeModel.map((subModel, index) => this.renderSubModel(subModel, this.showLines && index === this.treeModel.length - 1, 0))));
451
- }
452
- static get watchers() { return {
453
- "treeModel": ["handleTreeModelChange"]
454
- }; }
455
- };
456
- ChTestTreeX.style = testTreeXCss;
457
-
458
- exports.ch_test_tree_x = ChTestTreeX;
@@ -1,6 +0,0 @@
1
- import { C as ChTreeXListItem$1, d as defineCustomElement$1 } from './tree-x-list-item.js';
2
-
3
- const ChTreeXListItem = ChTreeXListItem$1;
4
- const defineCustomElement = defineCustomElement$1;
5
-
6
- export { ChTreeXListItem, defineCustomElement };
@@ -1,6 +0,0 @@
1
- import { C as ChTreeX$1, d as defineCustomElement$1 } from './tree-x.js';
2
-
3
- const ChTreeX = ChTreeX$1;
4
- const defineCustomElement = defineCustomElement$1;
5
-
6
- export { ChTreeX, defineCustomElement };