@refinitiv-ui/efx-grid 6.0.3 → 6.0.4

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 (178) hide show
  1. package/lib/column-dragging/es6/ColumnDragging.d.ts +49 -0
  2. package/lib/column-dragging/es6/ColumnDragging.js +764 -0
  3. package/lib/column-dragging/es6/index.d.ts +1 -0
  4. package/lib/column-dragging/es6/index.js +1 -0
  5. package/lib/core/dist/core.css +1 -1
  6. package/lib/core/dist/core.js +389 -1070
  7. package/lib/core/dist/core.min.js +1 -1
  8. package/lib/core/es6/data/ColumnStats.d.ts +2 -2
  9. package/lib/core/es6/data/DataCache.d.ts +4 -4
  10. package/lib/core/es6/data/DataTable.d.ts +5 -5
  11. package/lib/core/es6/data/DataTable.js +1 -1
  12. package/lib/core/es6/data/DataView.d.ts +12 -12
  13. package/lib/core/es6/data/SegmentCollection.d.ts +3 -3
  14. package/lib/core/es6/data/WrappedView.d.ts +13 -13
  15. package/lib/core/es6/grid/Core.d.ts +29 -27
  16. package/lib/core/es6/grid/Core.js +26 -4
  17. package/lib/core/es6/grid/ILayoutGrid.d.ts +15 -15
  18. package/lib/core/es6/grid/LayoutGrid.js +54 -26
  19. package/lib/core/es6/grid/VirtualizedLayoutGrid.js +66 -0
  20. package/lib/core/es6/grid/components/Cell.d.ts +4 -4
  21. package/lib/core/es6/grid/components/CellFloatingPanel.d.ts +1 -1
  22. package/lib/core/es6/grid/components/CellSpans.d.ts +8 -8
  23. package/lib/core/es6/grid/components/Column.d.ts +1 -1
  24. package/lib/core/es6/grid/components/ElementWrapper.d.ts +6 -6
  25. package/lib/core/es6/grid/components/Scrollbar.d.ts +1 -1
  26. package/lib/core/es6/grid/components/StretchedCells.js +2 -2
  27. package/lib/core/es6/grid/plugins/SortableTitlePlugin.d.ts +14 -6
  28. package/lib/core/es6/grid/plugins/SortableTitlePlugin.js +147 -81
  29. package/lib/core/es6/grid/util/Conflator.d.ts +2 -2
  30. package/lib/core/es6/grid/util/ElementFrameWork.d.ts +3 -3
  31. package/lib/core/es6/grid/util/HttpRequest.d.ts +2 -2
  32. package/lib/core/es6/grid/util/PercentBarRenderer.d.ts +1 -1
  33. package/lib/core/es6/grid/util/RangeBar.d.ts +1 -1
  34. package/lib/core/es6/grid/util/SectionSettings.d.ts +5 -5
  35. package/lib/core/es6/grid/util/SectionSettings.js +5 -0
  36. package/lib/core/es6/grid/util/SelectionList.d.ts +2 -2
  37. package/lib/core/es6/grid/util/TrackLayout.d.ts +7 -3
  38. package/lib/core/es6/grid/util/TrackLayout.js +27 -0
  39. package/lib/core/es6/grid/util/util.d.ts +2 -2
  40. package/lib/core/es6/index.d.ts +1 -5
  41. package/lib/core/es6/index.js +1 -7
  42. package/lib/core/es6/tr-grid-theme.js +1 -1
  43. package/lib/filter-dialog/lib/filter-dialog.d.ts +1 -0
  44. package/lib/filter-dialog/lib/filter-dialog.js +73 -26
  45. package/lib/filter-dialog/themes/base-checkbox.less +8 -1
  46. package/lib/filter-dialog/themes/base.less +69 -1
  47. package/lib/filter-dialog/themes/elemental/dark/checkbox-list.js +1 -1
  48. package/lib/filter-dialog/themes/elemental/dark/es5/all-elements.js +2 -2
  49. package/lib/filter-dialog/themes/elemental/dark/filter-dialog.js +1 -1
  50. package/lib/filter-dialog/themes/elemental/light/checkbox-list.js +1 -1
  51. package/lib/filter-dialog/themes/elemental/light/es5/all-elements.js +2 -2
  52. package/lib/filter-dialog/themes/elemental/light/filter-dialog.js +1 -1
  53. package/lib/filter-dialog/themes/halo/dark/checkbox-list.js +1 -1
  54. package/lib/filter-dialog/themes/halo/dark/es5/all-elements.js +2 -2
  55. package/lib/filter-dialog/themes/halo/dark/filter-dialog.js +1 -1
  56. package/lib/filter-dialog/themes/halo/light/checkbox-list.js +1 -1
  57. package/lib/filter-dialog/themes/halo/light/es5/all-elements.js +2 -2
  58. package/lib/filter-dialog/themes/halo/light/filter-dialog.js +1 -1
  59. package/lib/filter-dialog/themes/solar/charcoal/checkbox-list.js +1 -1
  60. package/lib/filter-dialog/themes/solar/charcoal/es5/all-elements.js +2 -2
  61. package/lib/filter-dialog/themes/solar/charcoal/filter-dialog.js +1 -1
  62. package/lib/filter-dialog/themes/solar/pearl/checkbox-list.js +1 -1
  63. package/lib/filter-dialog/themes/solar/pearl/es5/all-elements.js +2 -2
  64. package/lib/filter-dialog/themes/solar/pearl/filter-dialog.js +1 -1
  65. package/lib/grid/lib/efx-grid.d.ts +8 -5
  66. package/lib/grid/lib/efx-grid.js +10 -4
  67. package/lib/grid/themes/halo/dark/efx-grid.js +1 -1
  68. package/lib/grid/themes/halo/dark/es5/all-elements.js +1 -1
  69. package/lib/grid/themes/halo/efx-grid.less +33 -39
  70. package/lib/grid/themes/halo/light/efx-grid.js +1 -1
  71. package/lib/grid/themes/halo/light/es5/all-elements.js +1 -1
  72. package/lib/index.d.ts +2 -0
  73. package/lib/index.js +2 -0
  74. package/lib/row-segmenting/es6/RowSegmenting.d.ts +7 -2
  75. package/lib/row-segmenting/es6/RowSegmenting.js +94 -9
  76. package/lib/rt-grid/dist/rt-grid.js +567 -1171
  77. package/lib/rt-grid/dist/rt-grid.min.js +1 -1
  78. package/lib/rt-grid/es6/ColumnDefinition.d.ts +5 -3
  79. package/lib/rt-grid/es6/ColumnDefinition.js +17 -108
  80. package/lib/rt-grid/es6/DataConnector.d.ts +3 -3
  81. package/lib/rt-grid/es6/Grid.d.ts +17 -9
  82. package/lib/rt-grid/es6/Grid.js +201 -101
  83. package/lib/rt-grid/es6/RowDefSorter.d.ts +19 -0
  84. package/lib/rt-grid/es6/RowDefSorter.js +137 -0
  85. package/lib/rt-grid/es6/RowDefinition.d.ts +9 -7
  86. package/lib/rt-grid/es6/RowDefinition.js +6 -0
  87. package/lib/rt-grid/es6/SnapshotFiller.d.ts +3 -1
  88. package/lib/rt-grid/es6/SnapshotFiller.js +23 -0
  89. package/lib/tr-grid-checkbox/es6/Checkbox.d.ts +2 -2
  90. package/lib/tr-grid-checkbox/es6/Checkbox.js +38 -20
  91. package/lib/tr-grid-column-selection/es6/ColumnSelection.js +46 -9
  92. package/lib/tr-grid-column-stack/es6/ColumnStack.d.ts +8 -4
  93. package/lib/tr-grid-column-stack/es6/ColumnStack.js +240 -125
  94. package/lib/tr-grid-conditional-coloring/es6/ConditionalColoring.d.ts +1 -1
  95. package/lib/tr-grid-conditional-coloring/es6/ConditionalColoring.js +18 -12
  96. package/lib/tr-grid-in-cell-editing/es6/InCellEditing.d.ts +7 -4
  97. package/lib/tr-grid-in-cell-editing/es6/InCellEditing.js +93 -2
  98. package/lib/tr-grid-printer/es6/CellWriter.d.ts +3 -3
  99. package/lib/tr-grid-printer/es6/GridPrinter.d.ts +1 -1
  100. package/lib/tr-grid-printer/es6/GridPrinter.js +26 -13
  101. package/lib/tr-grid-printer/es6/PrintTrait.d.ts +2 -2
  102. package/lib/tr-grid-printer/es6/SectionWriter.d.ts +3 -3
  103. package/lib/tr-grid-row-dragging/es6/RowDragging.d.ts +2 -1
  104. package/lib/tr-grid-row-dragging/es6/RowDragging.js +29 -143
  105. package/lib/tr-grid-row-grouping/es6/RowGrouping.d.ts +7 -2
  106. package/lib/tr-grid-row-grouping/es6/RowGrouping.js +97 -7
  107. package/lib/tr-grid-row-selection/es6/RowSelection.js +10 -0
  108. package/lib/tr-grid-textformatting/es6/TextFormatting.d.ts +1 -1
  109. package/lib/tr-grid-textformatting/es6/TextFormatting.js +12 -0
  110. package/lib/tr-grid-util/es6/DragUI.d.ts +16 -0
  111. package/lib/tr-grid-util/es6/DragUI.js +214 -0
  112. package/lib/tr-grid-util/es6/ElementObserver.d.ts +2 -0
  113. package/lib/tr-grid-util/es6/ElementObserver.js +28 -1
  114. package/lib/tr-grid-util/es6/ElfUtil.js +1 -1
  115. package/lib/tr-grid-util/es6/FieldFormatter.js +7 -5
  116. package/lib/tr-grid-util/es6/GridPlugin.js +8 -4
  117. package/lib/tr-grid-util/es6/NumberFormatter.d.ts +2 -0
  118. package/lib/tr-grid-util/es6/NumberFormatter.js +64 -19
  119. package/lib/tr-grid-util/es6/RowPainter.js +41 -11
  120. package/lib/tr-grid-util/es6/formula/Formula.js +9 -1
  121. package/lib/types/es6/Checkbox.d.ts +2 -2
  122. package/lib/types/es6/ColumnStack.d.ts +8 -4
  123. package/lib/types/es6/CompositeGrid/ColumnSelectionPlugin.d.ts +3 -2
  124. package/lib/types/es6/CompositeGrid/ColumnWidthAdjustingPlugin.d.ts +2 -1
  125. package/lib/types/es6/CompositeGrid/CompositeGrid.d.ts +20 -18
  126. package/lib/types/es6/CompositeGrid/DragAndDropTitlePlugin.d.ts +2 -1
  127. package/lib/types/es6/CompositeGrid/DraggableContentPlugin.d.ts +3 -2
  128. package/lib/types/es6/CompositeGrid/Plugin.d.ts +28 -0
  129. package/lib/types/es6/CompositeGrid/ResizableTitlePlugin.d.ts +2 -1
  130. package/lib/types/es6/CompositeGrid/RowSelectionPlugin.d.ts +5 -4
  131. package/lib/types/es6/CompositeGrid/TreeIndentingPlugin.d.ts +2 -1
  132. package/lib/types/es6/CompositeGrid/index.d.ts +9 -9
  133. package/lib/types/es6/ConditionalColoring.d.ts +1 -1
  134. package/lib/types/es6/Core/data/ColumnStats.d.ts +2 -2
  135. package/lib/types/es6/Core/data/DataCache.d.ts +4 -4
  136. package/lib/types/es6/Core/data/DataTable.d.ts +5 -5
  137. package/lib/types/es6/Core/data/DataView.d.ts +12 -12
  138. package/lib/types/es6/Core/data/SegmentCollection.d.ts +3 -3
  139. package/lib/types/es6/Core/data/WrappedView.d.ts +13 -13
  140. package/lib/types/es6/Core/grid/Core.d.ts +29 -27
  141. package/lib/types/es6/Core/grid/ILayoutGrid.d.ts +15 -15
  142. package/lib/types/es6/Core/grid/components/Cell.d.ts +4 -4
  143. package/lib/types/es6/Core/grid/components/CellFloatingPanel.d.ts +1 -1
  144. package/lib/types/es6/Core/grid/components/CellSpans.d.ts +8 -8
  145. package/lib/types/es6/Core/grid/components/Column.d.ts +1 -1
  146. package/lib/types/es6/Core/grid/components/ElementWrapper.d.ts +6 -6
  147. package/lib/types/es6/Core/grid/components/Scrollbar.d.ts +1 -1
  148. package/lib/types/es6/Core/grid/plugins/SortableTitlePlugin.d.ts +14 -6
  149. package/lib/types/es6/Core/grid/util/Conflator.d.ts +2 -2
  150. package/lib/types/es6/Core/grid/util/ElementFrameWork.d.ts +3 -3
  151. package/lib/types/es6/Core/grid/util/HttpRequest.d.ts +2 -2
  152. package/lib/types/es6/Core/grid/util/PercentBarRenderer.d.ts +1 -1
  153. package/lib/types/es6/Core/grid/util/RangeBar.d.ts +1 -1
  154. package/lib/types/es6/Core/grid/util/SectionSettings.d.ts +5 -5
  155. package/lib/types/es6/Core/grid/util/SelectionList.d.ts +2 -2
  156. package/lib/types/es6/Core/grid/util/TrackLayout.d.ts +7 -3
  157. package/lib/types/es6/Core/grid/util/util.d.ts +2 -2
  158. package/lib/types/es6/Core/index.d.ts +1 -5
  159. package/lib/types/es6/ExtensionOptions.d.ts +2 -0
  160. package/lib/types/es6/InCellEditing.d.ts +7 -4
  161. package/lib/types/es6/RealtimeGrid/ColumnDefinition.d.ts +5 -3
  162. package/lib/types/es6/RealtimeGrid/DataConnector.d.ts +3 -3
  163. package/lib/types/es6/RealtimeGrid/Grid.d.ts +17 -9
  164. package/lib/types/es6/RealtimeGrid/RowDefSorter.d.ts +19 -0
  165. package/lib/types/es6/RealtimeGrid/RowDefinition.d.ts +9 -7
  166. package/lib/types/es6/RealtimeGrid/SnapshotFiller.d.ts +3 -1
  167. package/lib/types/es6/RowDragging.d.ts +2 -1
  168. package/lib/types/es6/RowGrouping.d.ts +7 -2
  169. package/lib/types/es6/RowSegmenting.d.ts +7 -2
  170. package/lib/types/es6/TextFormatting.d.ts +1 -1
  171. package/lib/versions.json +14 -13
  172. package/package.json +1 -1
  173. package/lib/core/es6/grid/plugins/DragAndDropTitlePlugin.d.ts +0 -24
  174. package/lib/core/es6/grid/plugins/DragAndDropTitlePlugin.js +0 -615
  175. package/lib/core/es6/grid/plugins/Plugin.d.ts +0 -28
  176. package/lib/core/es6/grid/plugins/Plugin.js +0 -272
  177. package/lib/types/es6/Core/grid/plugins/DragAndDropTitlePlugin.d.ts +0 -24
  178. package/lib/types/es6/Core/grid/plugins/Plugin.d.ts +0 -28
@@ -7,6 +7,11 @@ import { Dom } from "../../tr-grid-util/es6/Dom.js";
7
7
  import { injectCss, prettifyCss } from "../../tr-grid-util/es6/Util.js";
8
8
  import { preventDefault } from "../../tr-grid-util/es6/EventDispatcher.js";
9
9
 
10
+ /** @typedef {Object} ColumnStackPlugin~Options
11
+ * @description Available options describing `columnStack` object specified in grid's option
12
+ * @property {Array.<string>} fields Fields for stacking. The minimum is 2 fields.
13
+ */
14
+
10
15
  /** @typedef {Object} ColumnStackPlugin~ColumnOptions
11
16
  * @description Extension column options that can be specified on each individual grid's column option.
12
17
  * @property {string=} stackId Group ID
@@ -38,10 +43,6 @@ var ColumnStackPlugin = function () {
38
43
 
39
44
  Ext.inherits(ColumnStackPlugin, GridPlugin);
40
45
 
41
- /** @type {number}
42
- * @private
43
- */
44
- ColumnStackPlugin._runningId = 0;
45
46
  /** @type {!Object.<string, Object>}
46
47
  * @private
47
48
  */
@@ -50,6 +51,25 @@ ColumnStackPlugin.prototype._stacks;
50
51
  * @private
51
52
  */
52
53
  ColumnStackPlugin.prototype._pendingStacks;
54
+ /** @type {Object}
55
+ * @private
56
+ */
57
+ ColumnStackPlugin.prototype._columnStack = null;
58
+
59
+ /** @type {number}
60
+ * @private
61
+ */
62
+ ColumnStackPlugin._runningId = 0;
63
+ /** @private
64
+ * @return {string}
65
+ */
66
+ ColumnStackPlugin.prototype._generateStackId = function() {
67
+ var sid = "Stack" + ColumnStackPlugin._runningId++;
68
+ while(this._stacks[sid]) {
69
+ sid = "Stack" + ColumnStackPlugin._runningId++;
70
+ }
71
+ return sid;
72
+ };
53
73
 
54
74
  /** @override
55
75
  * @return {string}
@@ -60,7 +80,7 @@ ColumnStackPlugin.prototype.getName = function () {
60
80
  /** @override
61
81
  * @return {boolean}
62
82
  */
63
- GridPlugin.prototype.hasMultiTableSupport = function() {
83
+ ColumnStackPlugin.prototype.hasMultiTableSupport = function() {
64
84
  return true;
65
85
  };
66
86
  /** @public
@@ -112,28 +132,39 @@ ColumnStackPlugin.prototype.unload = function (host) {
112
132
  this._dispose();
113
133
  };
114
134
 
135
+ /** @private
136
+ * @type {string}
137
+ */
138
+ ColumnStackPlugin._styles = prettifyCss([
139
+ ".tr-grid .collapsed .cell.grouping .valigner", [
140
+ "width: 0;"
141
+ ],
142
+ ".tr-grid .collapsed .cell.grouping .floating-panel", [
143
+ "width: 100%;",
144
+ "margin: 0;",
145
+ "justify-content: center;"
146
+ ],
147
+ ".tr-grid .collapsed .cell.grouping .front-panel, " +
148
+ ".tr-grid .collapsed .cell.grouping .floating-panel *:not(.stack-icon)", [
149
+ "display: none;"
150
+ ],
151
+ ".tr-grid .collapsed .cell.grouping .floating-panel .stack-icon", [
152
+ "margin-left: 0;"
153
+ ],
154
+ ".stack-icon", [
155
+ "color: var(--grid-title-filter-icon-color);"
156
+ ],
157
+ ".stack-icon:hover", [
158
+ "color: var(--grid-title-filter-icon-hover-color);"
159
+ ]
160
+ ]);
161
+
115
162
  /** @private
116
163
  * @param {Object} grid core grid object
117
164
  */
118
165
  ColumnStackPlugin._applyThemeColor = function(grid) {
119
- if (!ColumnStackPlugin._styles) {
120
- ColumnStackPlugin._styles = prettifyCss([
121
- ".tr-grid .collapsed .cell.grouping .valigner", [
122
- "width: 0;"
123
- ],
124
- ".tr-grid .collapsed .cell.grouping .floating-panel", [
125
- "width: 100%;",
126
- "margin: 0;",
127
- "justify-content: center;"
128
- ],
129
- ".tr-grid .collapsed .cell.grouping .front-panel, " +
130
- ".tr-grid .collapsed .cell.grouping .floating-panel *:not(.stack-icon)", [
131
- "display: none;"
132
- ],
133
- ".tr-grid .collapsed .cell.grouping .floating-panel .stack-icon", [
134
- "margin-left: 0;"
135
- ]
136
- ]);
166
+ if (!grid._columnStackingStyles) {
167
+ grid._columnStackingStyles = true;
137
168
  injectCss(ColumnStackPlugin._styles, grid.getElement());
138
169
  }
139
170
  };
@@ -147,41 +178,55 @@ ColumnStackPlugin.prototype.config = function (options) {
147
178
  var columns = options["columns"];
148
179
  if(!columns) { return; }
149
180
 
150
- var stacks = {};
151
- var len = columns.length;
152
- for(var i = 0; i < len; ++i) {
181
+ var i, len = columns.length;
182
+ for(i = 0; i < len; ++i) {
153
183
  this._setColumnStacking(i, {}); // used for further column index getting
154
- var column = columns[i];
155
- var stackOpt = column["stackId"] || column["stack"];
156
- if(typeof stackOpt === "string") {
157
- if(!stacks[stackOpt]) {
158
- stacks[stackOpt] = {
159
- spreading: false,
160
- colIndices: []
161
- };
162
- }
184
+ }
163
185
 
164
- stacks[stackOpt].colIndices.push(i);
165
- } else if(typeof stackOpt === "object") {
166
- if(!stacks[stackOpt["id"]]) {
167
- stacks[stackOpt["id"]] = {
168
- spreading: stackOpt["spreading"] === true,
169
- collapsed: stackOpt["collapsed"] !== false,
170
- colIndices: []
171
- };
186
+ var sid, stacks = {};
187
+ var columnStack = options.columnStack;
188
+ if(columnStack != null) {
189
+ if(columnStack.fields && columnStack.fields.length > 1) {
190
+ this._columnStack = options.columnStack;
191
+ sid = this._generateStackId();
192
+ stacks[sid] = {
193
+ colRefs: columnStack.fields,
194
+ spreading: columnStack.spreading === true,
195
+ collapsed: columnStack.collapsed !== false
196
+ };
197
+ }
198
+ } else {
199
+ var column, stackOpt;
200
+ for(i = 0; i < len; ++i) {
201
+ column = columns[i];
202
+ stackOpt = column["stackId"] || column["stack"];
203
+ if(typeof stackOpt === "string") {
204
+ if(!stacks[stackOpt]) {
205
+ stacks[stackOpt] = {
206
+ colRefs: [],
207
+ spreading: false
208
+ };
209
+ }
210
+ stacks[stackOpt].colRefs.push(i);
211
+ } else if(typeof stackOpt === "object") {
212
+ if(!stacks[stackOpt["id"]]) {
213
+ stacks[stackOpt["id"]] = {
214
+ colRefs: [],
215
+ spreading: stackOpt["spreading"] === true,
216
+ collapsed: stackOpt["collapsed"] !== false
217
+ };
218
+ }
219
+ stacks[stackOpt["id"]].colRefs.push(i);
172
220
  }
173
- stacks[stackOpt["id"]].colIndices.push(i);
174
- } else {
175
- continue;
176
221
  }
177
222
  }
178
223
 
179
224
  if(this._initializedGrid) {
180
- for(var sid in stacks) {
181
- this.stackColumns(stacks[sid].colIndices, sid, stacks[sid]);
225
+ for(sid in stacks) {
226
+ this.stackColumns(stacks[sid].colRefs, sid, stacks[sid]);
182
227
  }
183
228
  } else {
184
- this._pendingStacks = stacks;
229
+ this._pendingStacks = this._pendingStacks || stacks;
185
230
  }
186
231
  };
187
232
 
@@ -193,26 +238,30 @@ ColumnStackPlugin.prototype.config = function (options) {
193
238
  ColumnStackPlugin.prototype.getConfigObject = function (gridOptions) {
194
239
  var obj = gridOptions || {};
195
240
 
196
- var columns = obj.columns;
197
- if (!columns) {
198
- columns = obj.columns = [];
199
- }
200
-
201
- var len = this.getColumnCount();
202
- for (var i = 0; i < len; ++i) {
203
- var column = columns[i];
204
- if (!column) {
205
- column = columns[i] = {};
241
+ if (this._columnStack != null) {
242
+ obj.columnStack = this._columnStack;
243
+ } else {
244
+ var columns = obj.columns;
245
+ if (!columns) {
246
+ columns = obj.columns = [];
206
247
  }
207
248
 
208
- var stackOpt = this._getColumnStackOptions(i);
209
- if (!stackOpt) continue;
249
+ var len = this.getColumnCount();
250
+ for (var i = 0; i < len; ++i) {
251
+ var column = columns[i];
252
+ if (!column) {
253
+ column = columns[i] = {};
254
+ }
210
255
 
211
- column.stack = {
212
- id: stackOpt.stackId,
213
- spreading: stackOpt.spreading,
214
- collapsed: stackOpt.collapsed
215
- };
256
+ var stackOpt = this._getColumnStackOptions(i);
257
+ if (!stackOpt) continue;
258
+
259
+ column.stack = {
260
+ id: stackOpt.stackId,
261
+ spreading: stackOpt.spreading,
262
+ collapsed: stackOpt.collapsed
263
+ };
264
+ }
216
265
  }
217
266
 
218
267
  return obj;
@@ -223,7 +272,8 @@ ColumnStackPlugin.prototype.getConfigObject = function (gridOptions) {
223
272
  ColumnStackPlugin.prototype._afterInit = function () {
224
273
  if(this._pendingStacks) {
225
274
  for(var sid in this._pendingStacks) {
226
- this.stackColumns(this._pendingStacks[sid].colIndices, sid, this._pendingStacks[sid]);
275
+ var stackOpt = this._pendingStacks[sid];
276
+ this.stackColumns(stackOpt.colRefs, sid, stackOpt);
227
277
  }
228
278
  this._pendingStacks = null;
229
279
  }
@@ -285,9 +335,11 @@ ColumnStackPlugin.prototype._getColumnStackOptions = function(colIndex) {
285
335
  /** @private
286
336
  * @param {number} colIndex
287
337
  */
288
- ColumnStackPlugin.prototype._removeColumnStacking = function(colIndex) {
289
- var colData = this._getColumnData(colIndex);
290
- colData["stack"] = {};
338
+ ColumnStackPlugin.prototype._removeColumnStackOptions = function(colIndex) {
339
+ var stacking = this._getColumnStacking(colIndex);
340
+ if(stacking) {
341
+ stacking["stackOpt"] = null;
342
+ }
291
343
  };
292
344
  /** @private
293
345
  * @return {!Array.<number>} Sorted column indices
@@ -408,11 +460,10 @@ ColumnStackPlugin.prototype._updateUI = function() {
408
460
  } else if(stackIcon) {
409
461
  cell.removeFloatingIcon(cell._stackIcon);
410
462
  cell._stackIcon = null;
411
- if(spreading) {
412
- cell.removeClass("grouping");
413
- } else {
414
- cell.removeClass("stacking");
415
- }
463
+
464
+ // Do not know the previous stacking mode so it needs to remove all the classes here.
465
+ cell.removeClass("grouping");
466
+ cell.removeClass("stacking");
416
467
  }
417
468
  }
418
469
  if(colData) {
@@ -687,32 +738,33 @@ ColumnStackPlugin.prototype.getStackId = function(colIndex) {
687
738
  return colData ? colData.stackId : "";
688
739
  };
689
740
  /** @public
690
- * @param {Array.<number>=} colIndices Selected columns will be used, if it is not given
741
+ * @param {Array.<number|string>=} colRefs Names of fields or column indices. If not specified, selected columns will be used.
691
742
  * @param {string=} stackId Must be unique
692
743
  * @param {Object=} options
693
744
  * @return {boolean} Return true if all of the given columns is stacked together
694
745
  */
695
- ColumnStackPlugin.prototype.stackColumns = function(colIndices, stackId, options) {
696
- if(!colIndices) {
697
- colIndices = this._getSelectedColumns();
698
- } else {
699
- colIndices.sort(function(a, b) { return a - b; });
746
+ ColumnStackPlugin.prototype.stackColumns = function(colRefs, stackId, options) {
747
+ if(!colRefs) {
748
+ colRefs = this._getSelectedColumns();
700
749
  }
701
750
 
702
- var i, colIndex, len = colIndices.length;
703
- var colCount = this.getColumnCount();
704
- var validIndices = [];
705
- for (i = 0; i < len; i++) {
706
- colIndex = colIndices[i];
707
- if(colIndex < colCount) {
708
- validIndices.push(colIndex);
751
+ var needSorting = true;
752
+ if(colRefs.length) {
753
+ if(typeof colRefs[0] === "string") {// Do not sort in the case of field stack
754
+ needSorting = false;
709
755
  }
756
+ colRefs = this.getColumnIndices(colRefs);
710
757
  }
711
- len = validIndices.length;
758
+
759
+ if(needSorting) {
760
+ colRefs.sort(function(a, b) { return a - b; });
761
+ }
762
+
763
+ var len = colRefs.length;
712
764
  if(len <= 1) {
713
765
  return false; // Only two or more columns can be stacked
714
766
  }
715
- if(!this.isColumnStackable(validIndices)) {
767
+ if(!this.isColumnStackable(colRefs)) {
716
768
  return false;
717
769
  }
718
770
  var sid;
@@ -722,26 +774,24 @@ ColumnStackPlugin.prototype.stackColumns = function(colIndices, stackId, options
722
774
  }
723
775
  sid = stackId;
724
776
  } else {
725
- sid = "Stack" + ColumnStackPlugin._runningId++;
726
- while(this._stacks[sid]) {
727
- sid = "Stack" + ColumnStackPlugin._runningId++;
728
- }
777
+ sid = this._generateStackId();
729
778
  }
730
779
 
731
780
  options = options || {};
732
781
 
733
- var activeIndex = validIndices[0];
782
+ var activeIndex = colRefs[0];
734
783
  // Collecting data
735
784
  var stack = {};
736
785
  stack.stackId = sid;
737
786
  stack.spreading = options.spreading === true;
738
787
  if(stack.spreading) {
739
- activeIndex = validIndices[len - 1];
788
+ activeIndex = colRefs[len - 1];
740
789
  }
741
790
  stack.collapsed = options.collapsed !== false;
742
791
  stack.stackRefs = new Array(len);
792
+ var i, colIndex;
743
793
  for(i = 0; i < len; ++i) {
744
- colIndex = validIndices[i];
794
+ colIndex = colRefs[i];
745
795
  this._setColumnStackOptions(colIndex, stack);
746
796
  stack.stackRefs[i] = this._getColumnStacking(colIndex);
747
797
 
@@ -750,12 +800,15 @@ ColumnStackPlugin.prototype.stackColumns = function(colIndices, stackId, options
750
800
  this._setColumnVisibility(colIndex, false);
751
801
  }
752
802
  }
753
- // Make sure that all columns stay packed together
754
- this._moveStackedColumns(stack.stackRefs);
755
803
 
756
804
  if(stack.spreading) {
805
+ // Make sure that all columns stay packed together
806
+ this._moveStackedColumns(stack.stackRefs);
757
807
  stack.activeColumn = stack.stackRefs[stack.stackRefs.length - 1]; // Right most column is the active column
758
808
  } else {
809
+ // Do not move column here to prevent column header from being unrendered because of swapped column index in header binding.
810
+ // Stacked columns will be moved in the unstacking method.
811
+ // TODO: Column title will not be rendered in Realtime Grid in the case of column added event.
759
812
  stack.activeColumn = stack.stackRefs[0]; // Left most column is the active column
760
813
  var csp = this._getPlugin("ColumnSelectionPlugin");
761
814
  if(csp && csp.isEnabled()) {
@@ -764,7 +817,6 @@ ColumnStackPlugin.prototype.stackColumns = function(colIndices, stackId, options
764
817
  }
765
818
  this._stacks[sid] = stack;
766
819
 
767
-
768
820
  var cfp = this._getPlugin("ColumnFilterPlugin");
769
821
  if(cfp) {
770
822
  cfp["refresh"]();
@@ -774,22 +826,64 @@ ColumnStackPlugin.prototype.stackColumns = function(colIndices, stackId, options
774
826
  };
775
827
 
776
828
  /** @public
777
- * @description Remove all stacking from the grid and replace it with a new one
829
+ * @description Remove all stacking from the grid and replace it with a new one.
830
+ * The stacked fields are kept persistently in Grid.
831
+ * While adding columns Grid will try to restore stacking
832
+ * if there are at least 2 visible columns which are corresponding to the kept fields.
778
833
  * @param {Array.<number|string>} colRefs Names of fields or column indices
779
834
  * @return {boolean} true if the stack has been modified
780
835
  */
781
836
  ColumnStackPlugin.prototype.setStack = function(colRefs) {
837
+ // Keep state
838
+ var i, colRef, type;
839
+ var fields = [];
840
+ if(Array.isArray(colRefs)) {
841
+ for (i = 0; i < colRefs.length; i++) {
842
+ colRef = colRefs[i];
843
+ type = typeof colRef;
844
+ if(type === "number") {
845
+ fields.push(this._getField(colRef));
846
+ } else if (type === "string") {
847
+ fields.push(colRef);
848
+ }
849
+ }
850
+ }
851
+
852
+ if(fields.length > 1) {
853
+ if(!this._columnStack) {
854
+ this._columnStack = {
855
+ spreading: false,
856
+ collapsed: false
857
+ };
858
+ }
859
+ this._columnStack.fields = fields;
860
+ } else {
861
+ this._columnStack = null;
862
+ }
863
+
864
+ // Update UI
865
+ var sid = "_uniqueStack"; // WARNING : This hardcode for assign uniqe stacking id
782
866
  if(!this._initializedGrid) {
867
+ if(this._columnStack) {
868
+ var pendingStacks = {};
869
+ pendingStacks[sid] = {
870
+ colRefs: fields,
871
+ spreading: false,
872
+ collapsed: false
873
+ };
874
+ this._pendingStacks = pendingStacks;
875
+ }
783
876
  return false;
784
877
  }
878
+
785
879
  colRefs = this.getColumnIndices(colRefs);
786
880
  if(colRefs.length <= 1) { // When the array is empty or contains only one element, all stacking is removed
787
881
  return this.removeAllStacks();
788
882
  }
789
883
 
790
884
  // Check old data stacking
791
- var count = 0, i;
792
- var sid = "_uniqueStack"; // WARNING : This hardcode for assign uniqe stacking id
885
+ var count = 0;
886
+
793
887
  if(this._stacks[sid]) {
794
888
  var stackRefs = this._stacks[sid].stackRefs;
795
889
  if(stackRefs.length === colRefs.length) {
@@ -851,14 +945,14 @@ ColumnStackPlugin.prototype.unstackColumns = function(colIndices) {
851
945
  for(i = 0; i < len; ++i) {
852
946
  colIndex = colIndices[i];
853
947
  if(colIndex < colCount) {
854
- var colData = this._getColumnStackOptions(colIndex);
855
- if(!colData) {
948
+ var stackOpt = this._getColumnStackOptions(colIndex);
949
+ if(!stackOpt) {
856
950
  continue; // Invalid index
857
951
  }
858
- if(colData.collapsed === true) {
952
+ if(stackOpt.collapsed === true) {
859
953
  this.expandGroup(colIndex);
860
954
  }
861
- stacks[colData.stackId] = 1; // Exclude duplicate stacks
955
+ stacks[stackOpt.stackId] = 1; // Exclude duplicate stacks
862
956
  }
863
957
  }
864
958
 
@@ -873,8 +967,11 @@ ColumnStackPlugin.prototype.unstackColumns = function(colIndices) {
873
967
  dirty = true;
874
968
 
875
969
  var stackRefs = stack.stackRefs;
970
+ if(stack.spreading !== true) {
971
+ this._moveStackedColumns(stackRefs);
972
+ }
876
973
  len = stackRefs.length;
877
- if(colData && colData.spreading) {
974
+ if(stack.spreading) {
878
975
  selFrom = this._getColumnIndex(stack.stackRefs[0]);
879
976
  } else {
880
977
  selFrom = this._getColumnIndex(stack.activeColumn);
@@ -884,7 +981,7 @@ ColumnStackPlugin.prototype.unstackColumns = function(colIndices) {
884
981
  for(i = 0; i < len; ++i) {
885
982
  var stackRef = stackRefs[i];
886
983
  colIndex = this._getColumnIndex(stackRef);
887
- this._removeColumnStacking(colIndex);
984
+ this._removeColumnStackOptions(colIndex);
888
985
  this._setColumnVisibility(colIndex, true);
889
986
  }
890
987
 
@@ -916,14 +1013,18 @@ ColumnStackPlugin.prototype.removeAllStacks = function(enableUpdateUI) {
916
1013
  dirty = true;
917
1014
 
918
1015
  var stackRefs = stack.stackRefs;
1016
+ if(stack.spreading !== true && enableUpdateUI) {
1017
+ this._moveStackedColumns(stackRefs);
1018
+ }
1019
+
919
1020
  var len = stackRefs.length;
920
1021
  for(var i = 0; i < len; ++i) {
921
1022
  var stackRef = stackRefs[i];
922
1023
  var colIndex = this._getColumnIndex(stackRef);
923
- if(stack.collapsed) {
1024
+ if(stack.collapsed && stack.spreading) {
924
1025
  this.collapseGroup(colIndex, false);
925
1026
  }
926
- this._removeColumnStacking(colIndex);
1027
+ this._removeColumnStackOptions(colIndex);
927
1028
  this._setColumnVisibility(colIndex, true);
928
1029
  }
929
1030
  }
@@ -1025,8 +1126,13 @@ ColumnStackPlugin.prototype._onColumnRemoved = function (e) {
1025
1126
  stackOpt.stackRefs.splice(index, 1);
1026
1127
  if(stackOpt.stackRefs.length < 2) {
1027
1128
  // delete group
1028
- var colIndex = this._getColumnIndex(stackOpt.activeColumn);
1029
- this.unstackColumns([colIndex]);
1129
+ var colIndex = this._getColumnIndex(stackOpt.stackRefs[0]);
1130
+ if(colIndex > -1) {
1131
+ this.unstackColumns([colIndex]);
1132
+ } else {
1133
+ // All stacked columns are removed
1134
+ delete this._stacks[stackOpt.stackId];
1135
+ }
1030
1136
  } else {
1031
1137
  if(stackOpt.spreading) {
1032
1138
  stackOpt.activeColumn = stackOpt.stackRefs[stackOpt.stackRefs.length - 1];
@@ -1165,18 +1271,27 @@ ColumnStackPlugin.prototype._onColumnAdded = function (e) {
1165
1271
  var colIndex = e.colIndex;
1166
1272
  this._setColumnStacking(colIndex, {});
1167
1273
 
1168
- // add to group
1169
- var leftStackOpt = this._getColumnStackOptions(colIndex - 1);
1170
- var rightStackOpt = this._getColumnStackOptions(colIndex + 1);
1171
- if(leftStackOpt && (leftStackOpt === rightStackOpt)) {
1172
- var leftColStackRef = this._getColumnStacking(colIndex - 1);
1173
- var stackRef = this._getColumnStacking(colIndex);
1174
- var index = leftStackOpt.stackRefs.indexOf(leftColStackRef);
1175
- if(index > -1) {
1176
- leftStackOpt.stackRefs.splice(index + 1, 0, stackRef);
1177
- leftStackOpt.activeColumn = leftStackOpt.stackRefs[leftStackOpt.stackRefs.length - 1];
1178
- this._setColumnStackOptions(colIndex, leftStackOpt);
1179
- this._updateUI();
1274
+ var columnStack = this._columnStack;
1275
+ if (columnStack) {
1276
+ var colIndices = this.getColumnIndices(columnStack.fields);
1277
+ if (colIndices.length > 1) {
1278
+ this.removeAllStacks(false);
1279
+ this.stackColumns(columnStack.fields, null, columnStack);
1280
+ }
1281
+ } else {
1282
+ // add to group
1283
+ var leftStackOpt = this._getColumnStackOptions(colIndex - 1);
1284
+ var rightStackOpt = this._getColumnStackOptions(colIndex + 1);
1285
+ if(leftStackOpt && (leftStackOpt === rightStackOpt)) {
1286
+ var leftColStackRef = this._getColumnStacking(colIndex - 1);
1287
+ var stackRef = this._getColumnStacking(colIndex);
1288
+ var index = leftStackOpt.stackRefs.indexOf(leftColStackRef);
1289
+ if(index > -1) {
1290
+ leftStackOpt.stackRefs.splice(index + 1, 0, stackRef);
1291
+ leftStackOpt.activeColumn = leftStackOpt.stackRefs[leftStackOpt.stackRefs.length - 1];
1292
+ this._setColumnStackOptions(colIndex, leftStackOpt);
1293
+ this._updateUI();
1294
+ }
1180
1295
  }
1181
1296
  }
1182
1297
  };
@@ -46,7 +46,7 @@ declare class ConditionalColoringPlugin extends GridPlugin {
46
46
 
47
47
  public getConfigObject(gridOptions?: any): any;
48
48
 
49
- public setColumnColoring(colIndex: number, columnOptions: ConditionalColoringPlugin.ColumnOptions): void;
49
+ public setColumnColoring(colIndex: number, columnOptions?: (ConditionalColoringPlugin.ColumnOptions|null)): void;
50
50
 
51
51
  public setColumnBlinking(colIndex: number, blinkingOptions?: (boolean|ConditionalColoringPlugin.Blinking), field?: string): void;
52
52
 
@@ -320,17 +320,21 @@ ConditionalColoringPlugin.prototype._cacheColumnPreviousValue = function(colInde
320
320
  };
321
321
 
322
322
  /** @public
323
+ * @description To define coloring for columns, conditions or colorText or tickColor need to be specified.
324
+ * To enable cell blinking the blinking option need to be defined. Coloring options and blinking options
325
+ * can be applied to a column at the same time. The blinking or coloring abilities will be removed if the correspondent options
326
+ * are not given. If columnOptions is undefined or null, coloring and blinking will be removed.
323
327
  * @param {number} colIndex
324
- * @param {ConditionalColoringPlugin~ColumnOptions} columnOptions
328
+ * @param {(ConditionalColoringPlugin~ColumnOptions|null)=} columnOptions
325
329
  * @example
326
- * var colDef = {
330
+ * var columnOptions1 = {
327
331
  * "conditions": [{ // Array.<Object> Condition Object Properties
328
332
  * "expression": "[column0] > 0", // string
329
333
  * "backgroundColor": "", // Optional string e.g. #ffffff, black
330
334
  * "color": "" // Optional string e.g. #000000, white
331
335
  * }]
332
336
  * };
333
- * var colDef2 = {
337
+ * var columnOptions2 = {
334
338
  * "field": "string",
335
339
  * "colorText": true // string as Field or boolean for text coloring mode
336
340
  * };
@@ -338,19 +342,21 @@ ConditionalColoringPlugin.prototype._cacheColumnPreviousValue = function(colInde
338
342
  ConditionalColoringPlugin.prototype.setColumnColoring = function (colIndex, columnOptions) {
339
343
  // Save column config state
340
344
  var colData = this._newColumnData(colIndex);
345
+ var blinkingOptions, field;
341
346
  if(columnOptions) {
342
- colData['conditions'] = columnOptions['conditions'];
343
- colData['colorText'] = columnOptions['colorText'];
344
- colData['tickColor'] = columnOptions['tickColor'];
345
- colData['blinking'] = columnOptions['blinking'];
347
+ colData["conditions"] = columnOptions["conditions"];
348
+ colData["colorText"] = columnOptions["colorText"];
349
+ colData["tickColor"] = columnOptions["tickColor"];
350
+ colData["blinking"] = blinkingOptions = columnOptions["blinking"];
351
+ field = columnOptions["field"];
346
352
  } else {
347
- colData['conditions'] = null;
348
- colData['colorText'] = null;
349
- colData['tickColor'] = null;
350
- colData['blinking'] = null;
353
+ colData["conditions"] = null;
354
+ colData["colorText"] = null;
355
+ colData["tickColor"] = null;
356
+ colData["blinking"] = null;
351
357
  }
352
358
 
353
- this.setColumnBlinking(colIndex, columnOptions["blinking"], columnOptions["field"]);
359
+ this.setColumnBlinking(colIndex, blinkingOptions, field);
354
360
 
355
361
  var painter = colData["painter"];
356
362
  var prevColoring = colData["coloring"];
@@ -28,7 +28,8 @@ declare namespace InCellEditingPlugin {
28
28
  keyUp?: ((...params: any[]) => any),
29
29
  beforeRowCommit?: ((...params: any[]) => any),
30
30
  rowEditorClosed?: ((...params: any[]) => any),
31
- uiBlocking?: boolean
31
+ uiBlocking?: boolean,
32
+ autoSuggest?: Element
32
33
  };
33
34
 
34
35
  type Cache = {
@@ -79,7 +80,7 @@ declare class InCellEditingPlugin extends GridPlugin {
79
80
 
80
81
  public isEditing(): boolean;
81
82
 
82
- public getTextBox(columnIndex?: number, grid?: any): Element;
83
+ public getTextBox(columnIndex?: number, grid?: any): Element|null;
83
84
 
84
85
  public getInitialText(): string;
85
86
 
@@ -87,7 +88,7 @@ declare class InCellEditingPlugin extends GridPlugin {
87
88
 
88
89
  public _getRowId(rowIndex: number): string;
89
90
 
90
- public getActiveGrid(): any|null;
91
+ public getActiveGrid(): any|null|null;
91
92
 
92
93
  public getActiveColIndex(): number;
93
94
 
@@ -119,7 +120,9 @@ declare class InCellEditingPlugin extends GridPlugin {
119
120
 
120
121
  public commitText(word?: string): void;
121
122
 
122
- public getBalloonPopup(): Popup|null;
123
+ public getBalloonPopup(): Popup|null|null;
124
+
125
+ public getAutoSuggest(): Element|null;
123
126
 
124
127
  public setDisablingScroll(disabled?: boolean): boolean;
125
128