@refinitiv-ui/efx-grid 6.0.37 → 6.0.39

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 (31) hide show
  1. package/lib/core/dist/core.js +165 -20
  2. package/lib/core/dist/core.min.js +1 -1
  3. package/lib/core/es6/grid/Core.d.ts +2 -0
  4. package/lib/core/es6/grid/Core.js +62 -5
  5. package/lib/core/es6/grid/plugins/SortableTitlePlugin.d.ts +3 -0
  6. package/lib/core/es6/grid/plugins/SortableTitlePlugin.js +41 -7
  7. package/lib/core/es6/grid/util/TrackLayout.d.ts +3 -1
  8. package/lib/core/es6/grid/util/TrackLayout.js +23 -5
  9. package/lib/grid/index.js +1 -1
  10. package/lib/rt-grid/dist/rt-grid.js +158 -48
  11. package/lib/rt-grid/dist/rt-grid.min.js +1 -1
  12. package/lib/rt-grid/es6/ColumnDefinition.js +4 -3
  13. package/lib/rt-grid/es6/Grid.d.ts +1 -1
  14. package/lib/rt-grid/es6/Grid.js +63 -29
  15. package/lib/rt-grid/es6/RowDefinition.js +6 -6
  16. package/lib/tr-grid-cell-selection/es6/CellSelection.js +180 -421
  17. package/lib/tr-grid-column-grouping/es6/ColumnGrouping.d.ts +4 -0
  18. package/lib/tr-grid-column-grouping/es6/ColumnGrouping.js +221 -2
  19. package/lib/tr-grid-column-stack/es6/ColumnStack.d.ts +7 -1
  20. package/lib/tr-grid-column-stack/es6/ColumnStack.js +281 -69
  21. package/lib/tr-grid-row-dragging/es6/RowDragging.js +83 -3
  22. package/lib/tr-grid-row-selection/es6/RowSelection.js +18 -40
  23. package/lib/tr-grid-util/es6/GridPlugin.js +91 -42
  24. package/lib/types/es6/ColumnGrouping.d.ts +4 -0
  25. package/lib/types/es6/ColumnStack.d.ts +7 -1
  26. package/lib/types/es6/Core/grid/Core.d.ts +2 -0
  27. package/lib/types/es6/Core/grid/util/TrackLayout.d.ts +3 -1
  28. package/lib/types/es6/RealtimeGrid/Grid.d.ts +1 -1
  29. package/lib/types/es6/RealtimeGrid/RowDefinition.d.ts +2 -2
  30. package/lib/versions.json +6 -6
  31. package/package.json +1 -1
@@ -115,6 +115,7 @@ var ColumnStackPlugin = function () {
115
115
  this._onColumnAdded = this._onColumnAdded.bind(this);
116
116
  this._onBeforeBatchOperation = this._onBeforeBatchOperation.bind(this);
117
117
  this._onAfterBatchOperation = this._onAfterBatchOperation.bind(this);
118
+ this._onPinningChanged = this._onPinningChanged.bind(this);
118
119
 
119
120
  this._onStackButtonClicked = this._onStackButtonClicked.bind(this);
120
121
  this._updateUI = this._updateUI.bind(this);
@@ -159,7 +160,10 @@ ColumnStackPlugin.prototype._inReordering = false;
159
160
  * @private
160
161
  */
161
162
  ColumnStackPlugin.prototype._inResetting = false;
162
-
163
+ /** @type {boolean}
164
+ * @private
165
+ */
166
+ ColumnStackPlugin.prototype._inPinning = false;
163
167
 
164
168
  /** @type {number}
165
169
  * @private
@@ -214,6 +218,7 @@ ColumnStackPlugin.prototype.initialize = function (host, options) {
214
218
  host.listen("columnAdded", this._onColumnAdded);
215
219
  host.listen("beforeBatchOperation", this._onBeforeBatchOperation);
216
220
  host.listen("afterBatchOperation", this._onAfterBatchOperation);
221
+ host.listen("pinningChanged", this._onPinningChanged);
217
222
  }
218
223
  host.listen("preSectionRender", this._onPreSectionRender);
219
224
 
@@ -234,6 +239,7 @@ ColumnStackPlugin.prototype.unload = function (host) {
234
239
  host.unlisten("beforeBatchOperation", this._onBeforeBatchOperation);
235
240
  host.unlisten("afterBatchOperation", this._onAfterBatchOperation);
236
241
  host.unlisten("preSectionRender", this._onPreSectionRender);
242
+ host.unlisten("pinningChanged", this._onPinningChanged);
237
243
 
238
244
  if(this._hosts.length <= 0) {
239
245
  this._conflator.reset();
@@ -392,9 +398,6 @@ ColumnStackPlugin.prototype.config = function (options) {
392
398
  */
393
399
  ColumnStackPlugin.prototype.getConfigObject = function (gridOptions) {
394
400
  var obj = gridOptions || {};
395
- var host = this._host || this._hosts[0];
396
-
397
- var columnOptions = obj["columns"];
398
401
 
399
402
  var stacks = this._groupDefs.getGroupMap();
400
403
  var stackOptions = [];
@@ -403,17 +406,6 @@ ColumnStackPlugin.prototype.getConfigObject = function (gridOptions) {
403
406
  var stackOption = stacks[stackKey];
404
407
  var activeColIndex = this.getColumnIndex(stackOption.activeColumn);
405
408
 
406
- if(columnOptions && columnOptions.length){
407
- var memberIndices = this.getStackMemberIndices(stackOption.id);
408
- for(var i = 0; i < memberIndices.length; i++){
409
- var colIndex = memberIndices[i];
410
- var colOption = columnOptions[colIndex];
411
- if(colOption && host.isColumnVisible(colIndex)){
412
- colOption.hidden = colIndex !== activeColIndex;
413
- }
414
- }
415
- }
416
-
417
409
  var stackConfigObj = {
418
410
  id: stackOption.id
419
411
  };
@@ -526,7 +518,8 @@ ColumnStackPlugin.prototype._applyUserConfigs = function(stacks) {
526
518
  * @return {Object}
527
519
  */
528
520
  ColumnStackPlugin.prototype._getColumnStackOptions = function(colIndex) {
529
- if(colIndex >= 0) {
521
+ var colCount = this.getColumnCount();
522
+ if(colIndex >= 0 && colIndex < colCount) {
530
523
  var colId = this.getColumnId(colIndex);
531
524
  var stack = this._groupDefs.getParentGroup(colId);
532
525
  if(stack) {
@@ -556,7 +549,7 @@ ColumnStackPlugin.prototype._getSelectedColumns = function() {
556
549
  */
557
550
  ColumnStackPlugin.prototype._hideStackedColumns = function(stack, colRefs, activeRef) {
558
551
  if(stack.spreading && !stack.collapsed) {
559
- return; // In spreading mode, columns in an expanded stack don't need to be hiden
552
+ return; // In spreading mode, columns in an expanded stack don't need to be hidden
560
553
  }
561
554
  // WARNING: activeIndex may not be valid
562
555
  var activeIndex = (typeof activeRef === "number") ? activeRef : this.getColumnIndex(stack.activeColumn);
@@ -964,30 +957,39 @@ ColumnStackPlugin.prototype.isColumnActive = function(colIndex) {
964
957
  };
965
958
 
966
959
  /** @public
967
- * @param {number} colIndex
960
+ * @param {number|string} colRef Column index, id, or field
968
961
  * @return {string}
969
962
  */
970
- ColumnStackPlugin.prototype.getStackId = function(colIndex) {
971
- var stackOpt = this._getColumnStackOptions(colIndex);
972
- return stackOpt ? stackOpt.id : "";
963
+ ColumnStackPlugin.prototype.getStackId = function(colRef) {
964
+ var colIndex = (typeof colRef === "number") ? colRef : this.getColumnIndex(colRef);
965
+ if(colIndex >= 0) {
966
+ var stackOpt = this._getColumnStackOptions(colIndex);
967
+ if(stackOpt) {
968
+ return stackOpt.id || "";
969
+ }
970
+ }
971
+ return "";
973
972
  };
974
973
  /** @public
975
974
  * @param {Array.<number|string>=} colRefs Names of fields or column indices. If not specified, selected columns will be used.
976
975
  * @param {string=} stackId Must be unique
977
976
  * @param {ColumnStackPlugin~StackConfiguration=} options
978
- * @return {boolean} Return true if all of the given columns is stacked together
977
+ * @return {boolean} Return true if there is any change.
979
978
  */
980
979
  ColumnStackPlugin.prototype.stackColumns = function(colRefs, stackId, options) {
981
- var i, sid;
982
- options = options || {};
980
+ if(!options) {
981
+ options = {};
982
+ }
983
983
 
984
- if(stackId) {
985
- if(this._groupDefs.getGroup(stackId)) {
986
- return false; // Cannot store the same stack Id
984
+ var updateRequired = false;
985
+ var sid = stackId;
986
+ if(sid) {
987
+ if(this._removeStack(sid)) {
988
+ // TODO: pinning state are removed and may need to be kept
989
+ updateRequired = true;
987
990
  }
988
- sid = stackId;
989
991
  } else {
990
- sid = stackId = this._generateStackId();
992
+ sid = this._generateStackId();
991
993
  }
992
994
 
993
995
  if(!colRefs) {
@@ -996,7 +998,10 @@ ColumnStackPlugin.prototype.stackColumns = function(colRefs, stackId, options) {
996
998
 
997
999
  var refCount = colRefs ? colRefs.length : 0;
998
1000
  if(refCount < 2) {
999
- return false; // Only two or more columns can be stacked
1001
+ if(updateRequired) {
1002
+ this._updateUI();
1003
+ }
1004
+ return updateRequired; // Only two or more columns can be stacked
1000
1005
  }
1001
1006
 
1002
1007
  // Clone user data
@@ -1035,7 +1040,10 @@ ColumnStackPlugin.prototype.stackColumns = function(colRefs, stackId, options) {
1035
1040
 
1036
1041
  // Prevent columns already in a stack from moving out to another stack
1037
1042
  if(!this.isColumnStackable(colIndices)) {
1038
- return false;
1043
+ if(updateRequired) {
1044
+ this._updateUI();
1045
+ }
1046
+ return updateRequired;
1039
1047
  }
1040
1048
 
1041
1049
  // TODO: If columns are stored as column id and activeColumn is a field, active index could not be found
@@ -1068,8 +1076,8 @@ ColumnStackPlugin.prototype.stackColumns = function(colRefs, stackId, options) {
1068
1076
  var csp = this._getPlugin("ColumnSelectionPlugin");
1069
1077
  if(csp && csp.isEnabled()){
1070
1078
  var stackSelection = false;
1071
- for(i = 0; i < validCount; ++i){
1072
- colIndex = colIndices[i];
1079
+ for(var i = 0; i < validCount; ++i){
1080
+ var colIndex = colIndices[i];
1073
1081
  if(colIndex === activeIndex){
1074
1082
  continue;
1075
1083
  }
@@ -1087,6 +1095,8 @@ ColumnStackPlugin.prototype.stackColumns = function(colRefs, stackId, options) {
1087
1095
  }
1088
1096
  }
1089
1097
 
1098
+ this._verifyColumnPinning(stack);
1099
+
1090
1100
  this._groupDefs.setGroup(sid, stack);
1091
1101
 
1092
1102
  var cfp = this._getPlugin("ColumnFilterPlugin");
@@ -1097,26 +1107,75 @@ ColumnStackPlugin.prototype.stackColumns = function(colRefs, stackId, options) {
1097
1107
  return true;
1098
1108
  };
1099
1109
 
1110
+ /** @private
1111
+ * @param {Object} stack
1112
+ */
1113
+ ColumnStackPlugin.prototype._verifyColumnPinning = function(stack) {
1114
+ stack.leftPinned = false;
1115
+ stack.rightPinned = false;
1116
+
1117
+ var host = this._hosts[0];
1118
+ var leftPinnedIndex = host.getFrozenColumnCount() - 1;
1119
+ var rightPinnedIndex = host.getFirstPinnedRightIndex();
1120
+ var colCount = this.getColumnCount();
1121
+
1122
+ if (leftPinnedIndex < 0 && rightPinnedIndex === colCount) {
1123
+ return;
1124
+ }
1125
+
1126
+ var colIndices = this.getColumnIndices(stack.children);
1127
+ var min = colIndices[0];
1128
+ var max = colIndices[0];
1129
+ for (var i = 1; i < colIndices.length; i++) {
1130
+ var colIndex = colIndices[i];
1131
+ if (colIndex > max) { max = colIndex; }
1132
+ if (colIndex < min) { min = colIndex; }
1133
+ }
1134
+
1135
+ if (min <= leftPinnedIndex) {
1136
+ stack.leftPinned = true;
1137
+ if (max > leftPinnedIndex) {
1138
+ this._freezeColumn(max, colCount - rightPinnedIndex);
1139
+ }
1140
+ } else if (max >= rightPinnedIndex) {
1141
+ stack.rightPinned = true;
1142
+ if (min < rightPinnedIndex) {
1143
+ this._freezeColumn(leftPinnedIndex, colCount - min);
1144
+ }
1145
+ }
1146
+ };
1147
+
1148
+ /** @private
1149
+ * @param {number} frozenColIndex
1150
+ * @param {number=} numRightColumn
1151
+ */
1152
+ ColumnStackPlugin.prototype._freezeColumn = function(frozenColIndex, numRightColumn) {
1153
+ this._inPinning = true;
1154
+ var hosts = this._hosts;
1155
+ for (var i = 0; i < hosts.length; i++) {
1156
+ hosts[i].freezeColumn(frozenColIndex, numRightColumn);
1157
+ }
1158
+ this._inPinning = false;
1159
+ };
1160
+
1100
1161
  /** @public
1101
1162
  * @description Replace all of the stacking in the Grid with a new one.
1102
- * Grid stores the stacked fields indefinitely.
1103
- * When adding columns, Grid will attempt to restore stacking
1104
- * if there are at least two visible columns that match to the retained fields.
1163
+ * Grid stores the stacked fields indefinitely.
1164
+ * When adding columns, Grid will attempt to restore stacking,
1165
+ * if there are at least two visible columns that match to the retained fields.
1105
1166
  * @param {Array.<number|string>=} colRefs Field names or column indices
1106
1167
  * @param {number|string=} activeColRef Field names or column index of active column
1107
1168
  * @return {boolean} If the stack has been updated, return true.
1108
1169
  */
1109
1170
  ColumnStackPlugin.prototype.setStack = function(colRefs, activeColRef) {
1110
- var sid = "_uniqueStack"; // WARNING : This hardcode for assign uniqe stacking id
1111
-
1112
1171
  this.removeAllStacks();
1113
1172
 
1114
1173
  var stackOptions = {};
1115
-
1116
1174
  if(activeColRef) {
1117
1175
  stackOptions.activeColumn = activeColRef;
1118
1176
  }
1119
- this.stackColumns(colRefs, sid, stackOptions);
1177
+ // WARNING: Id is hardcoded for assign uniqe stacking id
1178
+ this.stackColumns(colRefs, "_uniqueStack", stackOptions);
1120
1179
 
1121
1180
  return true;
1122
1181
  };
@@ -1221,22 +1280,47 @@ ColumnStackPlugin.prototype.removeAllStacks = function(enableUpdateUI) {
1221
1280
  }
1222
1281
  return groupCount ? true : false;
1223
1282
  };
1224
- /** @public
1283
+ /** If the column is in a stack, the column become an activeColumn of the stack.
1284
+ * @public
1285
+ * @param {number|string} activeColumn Column index, id, or field
1286
+ * @return {boolean}
1287
+ */
1288
+ ColumnStackPlugin.prototype.setActiveColumn = function(activeColumn) {
1289
+ var colIndex = this.getColumnIndex(activeColumn);
1290
+ if(colIndex < 0) {
1291
+ return false;
1292
+ }
1293
+ var colCount = this.getColumnCount();
1294
+ if(colIndex >= colCount) {
1295
+ return false;
1296
+ }
1297
+
1298
+ var colId = this.getColumnId(colIndex);
1299
+ var stack = this._groupDefs.getParentGroup(colId);
1300
+ var field = "";
1301
+ if(!stack) {
1302
+ field = this._getField(colIndex);
1303
+ stack = this._groupDefs.getParentGroup(field);
1304
+ }
1305
+ if(!stack) {
1306
+ return false;
1307
+ }
1308
+ var chdr = stack.children;
1309
+ var memberIndex = field ? chdr.indexOf(field) : chdr.indexOf(colId);
1310
+ if(memberIndex < 0) {
1311
+ return false;
1312
+ }
1313
+ return this._setActiveColumn(stack, chdr[memberIndex]);
1314
+ };
1315
+ /** This method is deprecated in favor of setActiveColumn. Make the specified column switch place with the item in the stack.
1316
+ * @public
1225
1317
  * @param {number|Event} colRef
1226
1318
  * @param {number} swappingIndex
1227
1319
  * @return {boolean}
1320
+ * @see {@link ColumnStackPlugin#setActiveColumn}
1228
1321
  */
1229
1322
  ColumnStackPlugin.prototype.swapColumn = function(colRef, swappingIndex) {
1230
- var colIndex = -1;
1231
- if(typeof colRef == "number") {
1232
- colIndex = colRef;
1233
- } else {
1234
- var grid = this.getRelativeGrid(colRef);
1235
- if(grid) {
1236
- var pos = grid.getRelativePosition(colRef);
1237
- colIndex = pos["colIndex"];
1238
- }
1239
- }
1323
+ var colIndex = (typeof colRef === "number") ? colRef : this.getColumnIndex(colRef);
1240
1324
 
1241
1325
  var stackOpt = this._getColumnStackOptions(colIndex);
1242
1326
  if(!stackOpt) {
@@ -1246,22 +1330,32 @@ ColumnStackPlugin.prototype.swapColumn = function(colRef, swappingIndex) {
1246
1330
  if(!children) {
1247
1331
  return false; // Invalid column type
1248
1332
  }
1249
- var newActiveColumn = children[swappingIndex];
1333
+
1334
+ return this._setActiveColumn(stackOpt, children[swappingIndex]);
1335
+ };
1336
+ /** @private
1337
+ * @param {Object} stack Stack object
1338
+ * @param {string} newActiveColumn Column id or field
1339
+ * @return {boolean}
1340
+ */
1341
+ ColumnStackPlugin.prototype._setActiveColumn = function(stack, newActiveColumn) {
1250
1342
  if(!newActiveColumn) {
1251
- return false; // Invalid selected index
1343
+ return false; // Invalid active column
1252
1344
  }
1253
-
1254
- if(newActiveColumn === stackOpt.activeColumn) {
1345
+ if(newActiveColumn === stack.activeColumn) {
1255
1346
  return false; // The given index is already active stacked column
1256
1347
  }
1257
1348
 
1258
- var prevActiveColumnIndex = this.getColumnIndex(stackOpt.activeColumn);
1349
+ var prevActiveColumnIndex = this.getColumnIndex(stack.activeColumn);
1259
1350
  var newActiveColumnIndex = this.getColumnIndex(newActiveColumn);
1260
- stackOpt.activeColumn = newActiveColumn; // Change active column
1351
+ stack.activeColumn = newActiveColumn; // Change active column
1261
1352
 
1262
1353
  this._setColumnVisibility(newActiveColumnIndex, true);
1263
1354
  this._setColumnVisibility(prevActiveColumnIndex, false); // Hide current active column
1264
1355
 
1356
+ this._updateIcon(prevActiveColumnIndex, stack);
1357
+ this._updateIcon(newActiveColumnIndex, stack);
1358
+
1265
1359
  var csp = this._getPlugin("ColumnSelectionPlugin");
1266
1360
  if(csp && csp.isEnabled()) {
1267
1361
  csp.selectSingleColumn(newActiveColumnIndex);
@@ -1273,11 +1367,6 @@ ColumnStackPlugin.prototype.swapColumn = function(colRef, swappingIndex) {
1273
1367
  if(cfp) {
1274
1368
  cfp["refresh"]();
1275
1369
  }
1276
-
1277
- stackOpt = this._getColumnStackOptions(prevActiveColumnIndex);
1278
- this._updateIcon(prevActiveColumnIndex, stackOpt);
1279
- this._updateIcon(newActiveColumnIndex, stackOpt);
1280
-
1281
1370
  return true;
1282
1371
  };
1283
1372
 
@@ -1307,7 +1396,7 @@ ColumnStackPlugin.prototype._onColumnRemoved = function (e) {
1307
1396
  } else {
1308
1397
  var colData = /** @type{Object} */(e.columnData);
1309
1398
  var field = colData ? colData.field : "";
1310
- stackOpt = this._groupDefs.getParentGroup(fields);
1399
+ stackOpt = this._groupDefs.getParentGroup(field);
1311
1400
  if(stackOpt) {
1312
1401
  colRef = field;
1313
1402
  } else {
@@ -1426,7 +1515,17 @@ ColumnStackPlugin.prototype._onAfterBatchOperation = function (e) {
1426
1515
  this._inReordering = false;
1427
1516
  }
1428
1517
  };
1429
-
1518
+ /** @private
1519
+ * @param {Object} e
1520
+ */
1521
+ ColumnStackPlugin.prototype._onPinningChanged = function (e) {
1522
+ if (!this._inPinning) {
1523
+ var stacks = this._groupDefs.getGroups();
1524
+ for (var i = 0; i < stacks.length; i++) {
1525
+ this._verifyColumnPinning(stacks[i]);
1526
+ }
1527
+ }
1528
+ };
1430
1529
  /** @private
1431
1530
  * @param {number} colIndex
1432
1531
  * @return {Object} stackOption
@@ -1477,6 +1576,7 @@ ColumnStackPlugin.prototype._removeRefFromStack = function (stackOption, colRef,
1477
1576
  this._setColumnVisibility(colIndex, true);
1478
1577
  }
1479
1578
  this._updateActiveColumn(stackOption); // This may trigger _updateUI
1579
+
1480
1580
  return true;
1481
1581
  };
1482
1582
 
@@ -1670,9 +1770,26 @@ ColumnStackPlugin.prototype.addColumnToStack = function(colRef, stackId) {
1670
1770
  // apply stacking
1671
1771
  this._groupDefs.addGroupChild(stackId, colId);
1672
1772
 
1773
+ // To avoid state interference from Core Grid, keep the pin state before moving the columns
1774
+ var host = this._hosts[0];
1775
+ var leftPinnedIndex = host.getFrozenColumnCount() - 1;
1776
+ var rightPinnedCount = host.getPinnedRightColumnCount();
1777
+ var colIndex = this.getColumnIndex(colId);
1778
+
1673
1779
  // Pack stacked columns together
1674
1780
  this._moveStackedColumns(stack.children);
1675
1781
 
1782
+ // If an unpinned column is added to a pinned stack, the pinning position should be updated
1783
+ if(stack.leftPinned || stack.rightPinned) {
1784
+ if(stack.leftPinned && colIndex > leftPinnedIndex) {
1785
+ leftPinnedIndex++;
1786
+ this._freezeColumn(leftPinnedIndex, rightPinnedCount);
1787
+ } else if(stack.rightPinned && colIndex < (colCount - rightPinnedCount)) {
1788
+ rightPinnedCount++;
1789
+ this._freezeColumn(leftPinnedIndex, rightPinnedCount);
1790
+ }
1791
+ }
1792
+
1676
1793
  this._updateUI();
1677
1794
  };
1678
1795
 
@@ -1719,6 +1836,7 @@ ColumnStackPlugin.prototype.removeColumnFromStack = function(colRef) {
1719
1836
  this._removeRefFromStack(stack, colRef, colIndex);
1720
1837
 
1721
1838
  this.moveColumnById(colIndex, colIndices[memberCount - 1] + 1); // This assumes that the column order is already in correct position
1839
+
1722
1840
  this._updateUI();
1723
1841
  };
1724
1842
 
@@ -1829,11 +1947,8 @@ ColumnStackPlugin.prototype.addStackChild = function(stackId, colRef) {
1829
1947
  * @param {number|string} colRef Column field or column index
1830
1948
  */
1831
1949
  ColumnStackPlugin.prototype.removeStackChild = function(stackId, colRef) {
1832
- var colIndex = (typeof colRef === "string") ? this.getColumnIndex(colRef) : colRef;
1833
- if(colIndex >= 0) {
1834
- if(stackId === this.getStackId(colIndex)) {
1835
- this.removeColumnFromStack(colIndex);
1836
- }
1950
+ if(stackId === this.getStackId(colRef)) {
1951
+ this.removeColumnFromStack(colIndex);
1837
1952
  }
1838
1953
  };
1839
1954
  /** @public
@@ -1960,6 +2075,103 @@ ColumnStackPlugin.prototype.moveStack = function(stackId, destCol) {
1960
2075
  return dirty;
1961
2076
  };
1962
2077
 
2078
+ /** @public
2079
+ * @param {string} stackId
2080
+ * @param {string=} side Available values are: left|right. If no value is supplied, all columns will be pinned to the left.
2081
+ */
2082
+ ColumnStackPlugin.prototype.pinStack = function(stackId, side) {
2083
+ if(!stackId) {
2084
+ return;
2085
+ }
2086
+
2087
+ var stack = this._groupDefs.getGroup(stackId);
2088
+ if(!stack) {
2089
+ return;
2090
+ }
2091
+
2092
+ var host = this._hosts[0];
2093
+ var leftPinnedIndex = host.getFrozenColumnCount() - 1;
2094
+ var rightPinnedCount = host.getPinnedRightColumnCount();
2095
+ var colCount = this.getColumnCount();
2096
+ var colList = this.getStackMemberIds(stackId); // WARNING: column ids or fields
2097
+ var len = colList.length;
2098
+
2099
+ var dest;
2100
+ if(side === "right") {
2101
+ if(stack.rightPinned) {
2102
+ return;
2103
+ }
2104
+ if(stack.leftPinned) {
2105
+ this.unpinStack(stackId);
2106
+ leftPinnedIndex = host.getFrozenColumnCount() - 1;
2107
+ }
2108
+ stack.rightPinned = true;
2109
+ dest = colCount - rightPinnedCount;
2110
+ rightPinnedCount = rightPinnedCount + len;
2111
+ } else {
2112
+ if(stack.leftPinned) {
2113
+ return;
2114
+ }
2115
+ if(stack.rightPinned) {
2116
+ this.unpinStack(stackId);
2117
+ rightPinnedCount = host.getPinnedRightColumnCount();
2118
+ }
2119
+ stack.leftPinned = true;
2120
+ dest = leftPinnedIndex === -1 ? 0 : leftPinnedIndex + 1;
2121
+ leftPinnedIndex = leftPinnedIndex + len;
2122
+ }
2123
+
2124
+ this.reorderColumns(colList, dest);
2125
+ this._freezeColumn(leftPinnedIndex, rightPinnedCount);
2126
+ };
2127
+
2128
+ /** @public
2129
+ * @param {string} stackId
2130
+ * @param {(number|string)=} dest The unpinned stack will be placed before the destination position after the operation
2131
+ */
2132
+ ColumnStackPlugin.prototype.unpinStack = function(stackId, dest) {
2133
+ if(!stackId) {
2134
+ return;
2135
+ }
2136
+
2137
+ var stack = this._groupDefs.getGroup(stackId);
2138
+ if(!stack) {
2139
+ return;
2140
+ }
2141
+
2142
+ if(!stack.leftPinned && !stack.rightPinned) {
2143
+ return;
2144
+ }
2145
+
2146
+ var host = this._hosts[0];
2147
+ var leftPinnedCount = host.getFrozenColumnCount();
2148
+ var rightPinnedCount = host.getPinnedRightColumnCount();
2149
+ var colCount = this.getColumnCount();
2150
+ var firstRightPinnedIndex = colCount - rightPinnedCount;
2151
+ var colList = this.getStackMemberIds(stackId); // WARNING: column ids or fields
2152
+ var len = colList.length;
2153
+
2154
+ var destId = null;
2155
+ if(dest != null) {
2156
+ var destIdx = this.getColumnIndex(dest);
2157
+ destId = this.getColumnId(destIdx);
2158
+ }
2159
+
2160
+ if(stack.leftPinned) {
2161
+ stack.leftPinned = false;
2162
+ this.reorderColumns(colList, leftPinnedCount);
2163
+ this._freezeColumn(leftPinnedCount - (1 + len));
2164
+ } else if(stack.rightPinned) {
2165
+ stack.rightPinned = false;
2166
+ this.reorderColumns(colList, firstRightPinnedIndex);
2167
+ this._freezeColumn(leftPinnedCount - 1, rightPinnedCount - len);
2168
+ }
2169
+
2170
+ if(destId != null) {
2171
+ this.reorderColumns(colList, destId);
2172
+ }
2173
+ };
2174
+
1963
2175
 
1964
2176
 
1965
2177
  export default ColumnStackPlugin;
@@ -195,6 +195,10 @@ RowDraggingPlugin.prototype._pos = null;
195
195
  * @private
196
196
  */
197
197
  RowDraggingPlugin.prototype._startingRid = "";
198
+ /** @type {string}
199
+ * @private
200
+ */
201
+ RowDraggingPlugin.prototype._startingRowType = "";
198
202
  /** Core grid instance
199
203
  * @type {Object}
200
204
  * @private
@@ -721,6 +725,9 @@ RowDraggingPlugin.prototype._onDragStart = function (e, fromJET) {
721
725
  var dv = grid.getDataSource();
722
726
  this._startingRid = dv.getRowId(rowIndex);
723
727
  this._startingGrid = grid;
728
+ var api = this.getGridApi();
729
+ var rowType = api.getRowType(rowIndex);
730
+ this._startingRowType = rowType;
724
731
 
725
732
  if (this._dragBoxRenderer) { // For custom drag box rendering
726
733
  var arg = cloneObject(e); // TODO: Check if cloning is necessary
@@ -777,18 +784,21 @@ RowDraggingPlugin.prototype._onMouseMove = function (e) {
777
784
  }
778
785
 
779
786
  this._pos = this._hitTest(e); // A new object is created
787
+ this._pos["dragBox"] = this._dragBox; // assign dragBox for user determine valid target
788
+
789
+ // need to check grid properties because row can be move outside the grid
790
+ if(this._pos["grid"] && this._shouldPreventDrop(this._pos["rowIndex"])) {
791
+ this._pos.dragBoxIcon = "void";
792
+ }
780
793
 
781
794
  var dropable = true;
782
795
  if(this._entryPoint === 'JET' && !this._jetContentHasRic) {
783
796
  dropable = false;
784
797
  }
785
-
786
798
  if(dropable) {
787
799
  this._updateGuidePosition(e);
788
800
  }
789
801
 
790
- this._pos.dragBox = this._dragBox; // assign dragBox for user determine valid target
791
-
792
802
  // Dispatch drag event to let user determine valid drop target using allowDrag (allowDrop) method
793
803
  this._dispatch("drag", this._pos);
794
804
  if(!this._uiDisabled && dropable) {
@@ -1051,6 +1061,10 @@ RowDraggingPlugin.prototype._updateGuidePosition = function (e) {
1051
1061
  if (this._uiDisabled || !pos || pos["invalidTarget"]) {
1052
1062
  return;
1053
1063
  }
1064
+ if(pos["dragBoxIcon"] === "not-allowed" || pos["dragBoxIcon"] === "void" ) {
1065
+ Dom.removeParent(this._guideline);
1066
+ return;
1067
+ }
1054
1068
 
1055
1069
  if (_isInContentSection(pos)) {
1056
1070
  var guideline = this._guideline;
@@ -1087,6 +1101,72 @@ RowDraggingPlugin.prototype._updateGuidePosition = function (e) {
1087
1101
  }
1088
1102
  };
1089
1103
 
1104
+
1105
+ /** @private
1106
+ * @param {string|number} destRowRef
1107
+ * @return {boolean}
1108
+ */
1109
+ RowDraggingPlugin.prototype._shouldPreventDrop = function (destRowRef) {
1110
+
1111
+ var api = this.getGridApi();
1112
+ if(!api) { // It should not move the row if api doesn't initialize
1113
+ return false;
1114
+ }
1115
+
1116
+ if(this._startingRowType === "CONSTITUENT" || this._startingRowType === "SUBGROUP_HEADER") {
1117
+ return true;
1118
+ }
1119
+
1120
+ var grid = this._pos["grid"];
1121
+ var rsp = grid.getPlugin("RowSegmentingPlugin");
1122
+ if(!rsp) { // If row segment extension is not used, row drag and drop will not be protected by default.
1123
+ return false;
1124
+ }
1125
+ var destParentId = rsp.getSegmentParentRowId(destRowRef);
1126
+ var startingParentId = rsp.getSegmentParentRowId(this._startingRid);
1127
+ var destParentType;
1128
+ if(this._startingRowType === "GROUP_MEMBER") {
1129
+ var startingParentType = api.getRowType(startingParentId);
1130
+ if(startingParentType === "SUBGROUP_HEADER") {
1131
+ destParentType = api.getRowType(destParentId);
1132
+
1133
+ if(!startingParentId || !destParentId) {
1134
+ return true;
1135
+ }
1136
+
1137
+ if(destParentId === startingParentId) { // GROUP_MEMBER same parent can be move inside
1138
+ return false;
1139
+ }
1140
+ return true;
1141
+ }
1142
+ // else { } starting have GROUP_HEADER case, it can be move outside the group
1143
+
1144
+ } else if(this._startingRowType === "CHAIN" ) {
1145
+ if(destParentId) { // CHAIN can not move inside the member that have parent
1146
+ return true;
1147
+ }
1148
+ } else if (this._startingRowType === "GROUP_HEADER") {
1149
+ if( destParentId !== startingParentId) { // GROUP_HEADER can't move inside another GROUP or SUBGROUP
1150
+ return true;
1151
+ }
1152
+ }
1153
+
1154
+ var destRowType = api.getRowType(destRowRef);
1155
+ if(destRowType === "CONSTITUENT" || destRowType === "SUBGROUP_HEADER") { // Do not allow dropping this type when starting with any row types
1156
+ return true;
1157
+ }
1158
+
1159
+ if(destRowType === "GROUP_MEMBER") {
1160
+ destParentType = api.getRowType(destParentId);
1161
+ if(destParentType === "SUBGROUP_HEADER") { // Do not allow to drop group member that have parent is SUBGROUP_HEADER
1162
+ return true;
1163
+ }
1164
+ }
1165
+
1166
+ return false;
1167
+
1168
+ };
1169
+
1090
1170
  /** @private */
1091
1171
  RowDraggingPlugin.prototype._clearCache = function () {
1092
1172
  if (this._dragPulseId) {