@refinitiv-ui/efx-grid 6.0.28 → 6.0.30

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 (32) hide show
  1. package/lib/core/dist/core.js +3 -2
  2. package/lib/core/dist/core.min.js +1 -1
  3. package/lib/core/es6/grid/Core.js +2 -2
  4. package/lib/core/es6/grid/LayoutGrid.js +1 -0
  5. package/lib/grid/index.js +1 -1
  6. package/lib/rt-grid/dist/rt-grid.js +142 -26
  7. package/lib/rt-grid/dist/rt-grid.min.js +1 -1
  8. package/lib/rt-grid/es6/ColumnDefinition.d.ts +2 -0
  9. package/lib/rt-grid/es6/ColumnDefinition.js +6 -0
  10. package/lib/rt-grid/es6/FieldDefinition.d.ts +4 -0
  11. package/lib/rt-grid/es6/FieldDefinition.js +27 -1
  12. package/lib/rt-grid/es6/Grid.d.ts +1 -0
  13. package/lib/rt-grid/es6/Grid.js +14 -0
  14. package/lib/rt-grid/es6/RowDefinition.d.ts +1 -1
  15. package/lib/rt-grid/es6/RowDefinition.js +7 -7
  16. package/lib/rt-grid/es6/SnapshotFiller.js +3 -0
  17. package/lib/tr-grid-column-stack/es6/ColumnStack.d.ts +6 -0
  18. package/lib/tr-grid-column-stack/es6/ColumnStack.js +70 -1
  19. package/lib/tr-grid-conditional-coloring/es6/ConditionalColoring.d.ts +30 -23
  20. package/lib/tr-grid-conditional-coloring/es6/ConditionalColoring.js +78 -3
  21. package/lib/tr-grid-in-cell-editing/es6/InCellEditing.js +24 -10
  22. package/lib/tr-grid-util/es6/CellPainter.d.ts +2 -1
  23. package/lib/tr-grid-util/es6/CellPainter.js +53 -15
  24. package/lib/tr-grid-util/es6/jet/mockDataAPI.js +29 -1
  25. package/lib/types/es6/ColumnStack.d.ts +6 -0
  26. package/lib/types/es6/ConditionalColoring.d.ts +30 -23
  27. package/lib/types/es6/ExtensionOptions.d.ts +2 -0
  28. package/lib/types/es6/RealtimeGrid/RowDefinition.d.ts +1 -1
  29. package/lib/utils/index.d.ts +3 -0
  30. package/lib/utils/index.js +3 -0
  31. package/lib/versions.json +4 -4
  32. package/package.json +6 -2
@@ -91,6 +91,8 @@ declare class ColumnDefinition {
91
91
 
92
92
  public isTimeSeries(): boolean;
93
93
 
94
+ public isTimeSeriesChild(): boolean;
95
+
94
96
  public isFormulaField(): boolean;
95
97
 
96
98
  public static isFormulaField(field: string): boolean;
@@ -590,6 +590,12 @@ ColumnDefinition.prototype.isTimeSeries = function() {
590
590
  /** @public
591
591
  * @return {boolean}
592
592
  */
593
+ ColumnDefinition.prototype.isTimeSeriesChild = function() {
594
+ return FieldDefinition.isTimeSeriesChild(this.getField());
595
+ };
596
+ /** @public
597
+ * @return {boolean}
598
+ */
593
599
  ColumnDefinition.prototype.isFormulaField = function() {
594
600
  return this._formula ? true : false;
595
601
  };
@@ -20,12 +20,16 @@ declare namespace FieldDefinition {
20
20
 
21
21
  function setFieldCaching(caching: boolean): void;
22
22
 
23
+ function disableTimeSeriesExpansion(disabled: boolean): void;
24
+
23
25
  function isFormula(field: string): boolean;
24
26
 
25
27
  function isAdc(field: string): boolean;
26
28
 
27
29
  function isRealTimeField(field: string): boolean;
28
30
 
31
+ function isTimeSeriesChild(field: string): boolean;
32
+
29
33
  function isTimeSeries(field: string): boolean;
30
34
 
31
35
  }
@@ -182,6 +182,11 @@ FieldDefinition._lang = 'en';
182
182
  * @private
183
183
  */
184
184
  FieldDefinition._caching = false;
185
+ /**
186
+ * @type {boolean}
187
+ * @private
188
+ */
189
+ FieldDefinition._timeSeriesExpansion = true;
185
190
 
186
191
  /**
187
192
  * @type {Object.<string, boolean>}
@@ -269,6 +274,14 @@ FieldDefinition.setFieldCaching = function (caching) {
269
274
  FieldDefinition._caching = caching;
270
275
  };
271
276
 
277
+ /** @public
278
+ * @function
279
+ * @param {boolean} disabled=true if disable it, time series will not be expand
280
+ */
281
+ FieldDefinition.disableTimeSeriesExpansion = function(disabled) {
282
+ FieldDefinition._timeSeriesExpansion = disabled != false ? false : true;
283
+ };
284
+
272
285
  /** @public
273
286
  * @param {string} field
274
287
  * @return {boolean}
@@ -301,7 +314,7 @@ FieldDefinition.isRealTimeField = function(field) {
301
314
  return false;
302
315
  }
303
316
 
304
- if(FieldDefinition.getFieldProperty(field, "timeSeriesChild")) {
317
+ if(FieldDefinition.isTimeSeriesChild(field)) {
305
318
  return false;
306
319
  }
307
320
 
@@ -312,6 +325,14 @@ FieldDefinition.isRealTimeField = function(field) {
312
325
  return FieldDefinition.getFieldProperty(field, "IsRealtimeField") !== false;
313
326
  };
314
327
 
328
+ /** @public
329
+ * @param {string} field
330
+ * @return {boolean}
331
+ */
332
+ FieldDefinition.isTimeSeriesChild = function(field) {
333
+ return FieldDefinition.getFieldProperty(field, "timeSeriesChild") ? true : false;
334
+ };
335
+
315
336
  /** @public
316
337
  * @param {string} field
317
338
  * @return {boolean}=true if field is time series field
@@ -321,6 +342,11 @@ FieldDefinition.isTimeSeries = function (field) {
321
342
  return false;
322
343
  }
323
344
 
345
+ // If we disable time series expansion, the grid won't have a time series field.
346
+ if(!FieldDefinition._timeSeriesExpansion) {
347
+ return false;
348
+ }
349
+
324
350
  // We can check time series using a cache to avoid duplicating checks in regular expressions.
325
351
  var timeSeriesField = FieldDefinition.getFieldProperty(field, "timeSeries");
326
352
  if (timeSeriesField != null) {
@@ -81,6 +81,7 @@ declare namespace Grid {
81
81
  formulaEngine?: boolean|null,
82
82
  adcPollingInterval?: number|null,
83
83
  fieldCaching?: boolean|null,
84
+ timeSeriesExpansion?: boolean|null,
84
85
  childDataField?: string|null,
85
86
  topSection?: boolean|null
86
87
  };
@@ -84,6 +84,7 @@ import { ElementWrapper } from "../../core/es6/grid/components/ElementWrapper.js
84
84
  * @property {boolean=} formulaEngine=false If enabled, field with leading equal sign will be treated as a formula and rows will be filled with the calculated values.
85
85
  * @property {number=} adcPollingInterval=0 Length of polling interval for refreshing ADC data in milliseconds. The default value (0) means no polling.
86
86
  * @property {boolean=} fieldCaching=false If enabled, field definition will be caching internal mechanism
87
+ * @property {boolean=} timeSeriesExpansion=true If disabled, the time series field will be treated as a normal field and not expanded.
87
88
  * @property {string=} childDataField=CHILD_VALUES The given field will be used to store children's static data, such as row color assignment.
88
89
  * @property {boolean=} topSection=true If disabled, title section will not be rendered
89
90
  */
@@ -530,6 +531,11 @@ Grid.prototype._pollingEnabled = true;
530
531
  * @private
531
532
  */
532
533
  Grid.prototype._fieldCaching = false;
534
+ /** @type {boolean}
535
+ * @private
536
+ */
537
+ Grid.prototype._timeSeriesExpansion = true;
538
+
533
539
  /** @type {string}
534
540
  * @private
535
541
  */
@@ -790,6 +796,11 @@ Grid.prototype.initialize = function(gridOption) {
790
796
  FieldDefinition.setFieldCaching(t._fieldCaching);
791
797
  }
792
798
 
799
+ if(gridOption["timeSeriesExpansion"] != null) {
800
+ t._timeSeriesExpansion = gridOption["timeSeriesExpansion"];
801
+ FieldDefinition.disableTimeSeriesExpansion(!t._timeSeriesExpansion);
802
+ }
803
+
793
804
  if (gridOption["icons"] && gridOption["icons"]["rowGrouping"] && gridOption["icons"]["rowGrouping"]["expander"]) {
794
805
  StyleLoader.chainIcon = gridOption["icons"]["rowGrouping"]["expander"];
795
806
  }
@@ -1112,6 +1123,9 @@ Grid.prototype.getConfigObject = function (gridOptions) {
1112
1123
  if(this._fieldCaching) {
1113
1124
  obj["fieldCaching"] = this._fieldCaching;
1114
1125
  }
1126
+ if(this._timeSeriesExpansion != true) {
1127
+ obj["timeSeriesExpansion"] = this._timeSeriesExpansion;
1128
+ }
1115
1129
 
1116
1130
  if(this._childDataField) {
1117
1131
  obj["childDataField"] = this._childDataField;
@@ -136,7 +136,7 @@ declare class RowDefinition {
136
136
 
137
137
  declare const ROW_DEF: string;
138
138
 
139
- declare const ROW_TYPES: RowDefinition.RowTypes|null;
139
+ declare const ROW_TYPES: RowDefinition.RowTypes;
140
140
 
141
141
  declare function rowData(userInput: string): boolean;
142
142
 
@@ -17,12 +17,12 @@ import { DataTable } from "../../core/es6/data/DataTable.js";
17
17
  */
18
18
 
19
19
  /** @typedef {Object} RowDefinition~RowTypes
20
- * @property {string} CONTENT="CONTENT"
21
- * @property {string} CHAIN="CHAIN"
22
- * @property {string} CONSTITUENT="CONSTITUENT"
23
- * @property {string} GROUP_HEADER="GROUP_HEADER"
24
- * @property {string} SUBGROUP_HEADER="SUBGROUP_HEADER"
25
- * @property {string} GROUP_MEMBER="GROUP_MEMBER"
20
+ * @property {string} CONTENT="CONTENT" Regular row
21
+ * @property {string} CHAIN="CHAIN" Chain RIC row
22
+ * @property {string} CONSTITUENT="CONSTITUENT" Constituent row
23
+ * @property {string} GROUP_HEADER="GROUP_HEADER" Row of segment separator at the very top
24
+ * @property {string} SUBGROUP_HEADER="SUBGROUP_HEADER" Row of nested segment separator
25
+ * @property {string} GROUP_MEMBER="GROUP_MEMBER" Child row displayed under segment separator
26
26
  */
27
27
 
28
28
  /** @type {string}
@@ -31,7 +31,7 @@ import { DataTable } from "../../core/es6/data/DataTable.js";
31
31
  */
32
32
  var ROW_DEF = "ROW_DEF";
33
33
 
34
- /** @type {RowDefinition~RowTypes}
34
+ /** @type {!RowDefinition~RowTypes}
35
35
  * @public
36
36
  * @const
37
37
  */
@@ -381,6 +381,9 @@ SnapshotFiller.prototype._onRTKSuccess = function (fields, serverResult) {
381
381
  var dataRow = data2D[i];
382
382
  ric = dataRow[0];
383
383
 
384
+ if (ricMap[ric]) {
385
+ continue; // we interested only first row of ric
386
+ }
384
387
  var snapData = ricMap[ric] = {};
385
388
 
386
389
  // loop for create rowData for update
@@ -129,6 +129,12 @@ declare class ColumnStackPlugin extends GridPlugin {
129
129
 
130
130
  public moveColumnById(srcCol: number|string|null, destCol?: (number|string)|null): boolean;
131
131
 
132
+ public hideStack(stackId: string): void;
133
+
134
+ public showStack(stackId: string): void;
135
+
136
+ public isStackHidden(stackId: string): boolean|null|null;
137
+
132
138
  }
133
139
 
134
140
  export default ColumnStackPlugin;
@@ -336,6 +336,7 @@ ColumnStackPlugin.prototype.config = function (options) {
336
336
  */
337
337
  ColumnStackPlugin.prototype.getConfigObject = function (gridOptions) {
338
338
  var obj = gridOptions || {};
339
+ var host = this._host || this._hosts[0];
339
340
 
340
341
  var columnOptions = obj["columns"];
341
342
 
@@ -351,7 +352,7 @@ ColumnStackPlugin.prototype.getConfigObject = function (gridOptions) {
351
352
  for(var i = 0; i < memberIndices.length; i++){
352
353
  var colIndex = memberIndices[i];
353
354
  var colOption = columnOptions[colIndex];
354
- if(colOption){
355
+ if(colOption && host.isColumnVisible(colIndex)){
355
356
  colOption.hidden = colIndex !== activeColIndex;
356
357
  }
357
358
  }
@@ -1310,6 +1311,10 @@ ColumnStackPlugin.prototype._onColumnRemoved = function (e) {
1310
1311
  } else {
1311
1312
  stackOpt.activeColumn = stackOpt.stackRefs[0];
1312
1313
  }
1314
+
1315
+ // TODO: Add a proper way to set visibility to activeColumn when activeColumn is changed
1316
+ var activeColIndex = this._getColumnIndex(stackOpt.activeColumn);
1317
+ this._setColumnVisibility(activeColIndex, true);
1313
1318
  this._updateUI();
1314
1319
  }
1315
1320
  }
@@ -1871,6 +1876,70 @@ ColumnStackPlugin.prototype.moveColumnById = function(srcCol, destCol) {
1871
1876
  return dirty;
1872
1877
  };
1873
1878
 
1879
+ /** @private
1880
+ * @description Set stack visibility to the specific stack
1881
+ * @param {string} stackId
1882
+ * @param {boolean} visible
1883
+ */
1884
+ ColumnStackPlugin.prototype._setStackVisibility = function(stackId, visible) {
1885
+ var stackOption = this._stacks[stackId];
1886
+ if(!stackOption){
1887
+ return;
1888
+ }
1889
+
1890
+ if(stackOption["spreading"] && !stackOption["collapsed"]){
1891
+ var stackRefs = stackOption["stackRefs"];
1892
+ for(var i = 0; i < stackRefs.length; i++){
1893
+ var colIndex = this._getColumnIndex(stackRefs[i]);
1894
+ this._setColumnVisibility(colIndex, visible);
1895
+ }
1896
+ } else {
1897
+ var activeColIndex = this._getColumnIndex(stackOption.activeColumn);
1898
+ this._setColumnVisibility(activeColIndex, visible);
1899
+ }
1900
+ };
1901
+
1902
+ /** @public
1903
+ * @description Hide specific stack from grid
1904
+ * @param {string} stackId
1905
+ */
1906
+ ColumnStackPlugin.prototype.hideStack = function(stackId) {
1907
+ if(!stackId){
1908
+ return;
1909
+ }
1910
+ this._setStackVisibility(stackId, false);
1911
+ };
1912
+
1913
+ /** @public
1914
+ * @description Show specific stack from grid
1915
+ * @param {string} stackId
1916
+ */
1917
+ ColumnStackPlugin.prototype.showStack = function(stackId) {
1918
+ if(!stackId){
1919
+ return;
1920
+ }
1921
+ this._setStackVisibility(stackId, true);
1922
+ };
1923
+
1924
+ /** @public
1925
+ * @description Get hidden status of specific stack
1926
+ * @param {string} stackId
1927
+ * @return {boolean|null}
1928
+ */
1929
+ ColumnStackPlugin.prototype.isStackHidden = function(stackId) {
1930
+ var stackOption = this._stacks[stackId];
1931
+ var host = this._host || this._hosts[0];
1932
+
1933
+ if(!stackOption || !host){
1934
+ return null;
1935
+ }
1936
+
1937
+ var activeColIndex = this._getColumnIndex(stackOption.activeColumn);
1938
+ var isVisible = host.isColumnVisible(activeColIndex);
1939
+
1940
+ return !isVisible;
1941
+ };
1942
+
1874
1943
 
1875
1944
 
1876
1945
  export default ColumnStackPlugin;
@@ -1,39 +1,44 @@
1
1
  import {Ext} from '../../tr-grid-util/es6/Ext.js';
2
- import { GridPlugin } from '../../tr-grid-util/es6/GridPlugin.js';
3
- import { extendObject } from '../../tr-grid-util/es6/Util.js';
2
+ import {GridPlugin} from '../../tr-grid-util/es6/GridPlugin.js';
3
+ import {extendObject, injectCss, prettifyCss} from '../../tr-grid-util/es6/Util.js';
4
4
  import {CellPainter} from '../../tr-grid-util/es6/CellPainter.js';
5
5
  import {FilterBuilder} from '../../tr-grid-util/es6/FilterBuilder.js';
6
6
  import {ElfUtil} from '../../tr-grid-util/es6/ElfUtil.js';
7
7
 
8
8
  declare namespace ConditionalColoringPlugin {
9
9
 
10
+ type Options = {
11
+ predefinedColors?: any
12
+ };
13
+
10
14
  type ColumnOptions = {
11
- conditions?: (ConditionalColoringPlugin.Condition)[],
12
- colorText?: (string|boolean),
13
- tickColor?: (string|boolean),
14
- blinking?: (ConditionalColoringPlugin.Blinking|boolean),
15
- field?: string
15
+ conditions?: (ConditionalColoringPlugin.Condition)[]|null,
16
+ colorText?: (string|boolean)|null,
17
+ tickColor?: (string|boolean)|null,
18
+ blinking?: (ConditionalColoringPlugin.Blinking|boolean)|null,
19
+ field?: string|null
16
20
  };
17
21
 
18
22
  type ConditionalColoringOptions = {
19
- conditions?: (ConditionalColoringPlugin.Condition)[],
20
- colorText?: (string|boolean),
21
- tickColor?: (string|boolean),
22
- field?: string
23
+ conditions?: (ConditionalColoringPlugin.Condition)[]|null,
24
+ colorText?: (string|boolean)|null,
25
+ tickColor?: (string|boolean)|null,
26
+ field?: string|null
23
27
  };
24
28
 
25
29
  type Condition = {
26
- expression?: (string|((...params: any[]) => any)),
27
- backgroundColor?: string,
28
- color?: string
30
+ expression?: (string|((...params: any[]) => any))|null,
31
+ backgroundColor?: string|null,
32
+ color?: string|null,
33
+ cssClass?: string|null
29
34
  };
30
35
 
31
36
  type Blinking = {
32
- border?: boolean,
33
- field?: string,
34
- up?: string,
35
- down?: string,
36
- level?: (string|boolean)
37
+ border?: boolean|null,
38
+ field?: string|null,
39
+ up?: string|null,
40
+ down?: string|null,
41
+ level?: (string|boolean)|null
37
42
  };
38
43
 
39
44
  }
@@ -56,21 +61,23 @@ declare class ConditionalColoringPlugin extends GridPlugin {
56
61
 
57
62
  public getColumnColoring(colIndex: number, options?: any): ConditionalColoringPlugin.ColumnOptions;
58
63
 
59
- public setColumnColoring(colIndex: number, columnOptions?: (ConditionalColoringPlugin.ColumnOptions|null)): void;
64
+ public setColumnColoring(colIndex: number, columnOptions?: (ConditionalColoringPlugin.ColumnOptions|null)|null): void;
60
65
 
61
- public setConditionalColoring(colIndex: number, coloringOptions?: (ConditionalColoringPlugin.ConditionalColoringOptions|null)): void;
66
+ public setConditionalColoring(colIndex: number, coloringOptions?: (ConditionalColoringPlugin.ConditionalColoringOptions|null)|null): void;
62
67
 
63
- public setColumnBlinking(colIndex: number, blinkingOptions?: (boolean|ConditionalColoringPlugin.Blinking), field?: string): void;
68
+ public setColumnBlinking(colIndex: number, blinkingOptions?: (boolean|ConditionalColoringPlugin.Blinking)|null, field?: string|null): void;
64
69
 
65
70
  public blinkRow(rowIndex: number, blinkSignal: number, host?: any): void;
66
71
 
72
+ public setPredefinedColors(predefinedColors: any): void;
73
+
67
74
  public getColumnPainter(colIndex: number): CellPainter|null;
68
75
 
69
76
  public applyColor(colIndex: number, cell: any, rowData?: any): void;
70
77
 
71
78
  public static cleanUpPrevRows(): void;
72
79
 
73
- public static setThemeColors(colors: { [key: string]: string }): void;
80
+ public static setThemeColors(colors: { [key: string]: string }|null): void;
74
81
 
75
82
  public reloadThemeColors(): Promise<any>|null;
76
83
 
@@ -1,10 +1,15 @@
1
1
  import {Ext} from '../../tr-grid-util/es6/Ext.js';
2
- import { GridPlugin } from '../../tr-grid-util/es6/GridPlugin.js';
3
- import { extendObject } from '../../tr-grid-util/es6/Util.js';
2
+ import {GridPlugin} from '../../tr-grid-util/es6/GridPlugin.js';
3
+ import {extendObject, injectCss, prettifyCss} from '../../tr-grid-util/es6/Util.js';
4
4
  import {CellPainter} from '../../tr-grid-util/es6/CellPainter.js';
5
5
  import {FilterBuilder} from '../../tr-grid-util/es6/FilterBuilder.js';
6
6
  import {ElfUtil} from '../../tr-grid-util/es6/ElfUtil.js';
7
7
 
8
+ /** @typedef {Object} ConditionalColoringPlugin~Options
9
+ * @description The options can be specified by `conditionalColoring` property of the main grid's options
10
+ * @property {Object=} predefinedColors Predefined color object map for conditional coloring
11
+ */
12
+
8
13
  /** @typedef {Object} ConditionalColoringPlugin~ColumnOptions
9
14
  * @description Extension column options that can be specified on each individual grid's column option:
10
15
  * @property {Array.<ConditionalColoringPlugin~Condition>=} conditions=null List of condition options
@@ -27,6 +32,7 @@ import {ElfUtil} from '../../tr-grid-util/es6/ElfUtil.js';
27
32
  * @property {(string|Function)=} expression Expression could be `[FIELD_1] > 0`
28
33
  * @property {string=} backgroundColor="" CSS color (e.g. #ffffff, black)
29
34
  * @property {string=} color CSS="" color (e.g. #000000, white)
35
+ * @property {string=} cssClass cssClass="" Predefined color class name
30
36
  */
31
37
 
32
38
  /** @typedef {(string|boolean|Object)} ConditionalColoringPlugin~Blinking
@@ -79,6 +85,10 @@ Ext.inherits(ConditionalColoringPlugin, GridPlugin);
79
85
  * @private
80
86
  */
81
87
  ConditionalColoringPlugin._cleanUpTimer = 0;
88
+ /** @type {string}
89
+ * @private
90
+ */
91
+ ConditionalColoringPlugin._controlClass = "predefined-conditional-color";
82
92
 
83
93
  /** @type {boolean}
84
94
  * @private
@@ -89,6 +99,10 @@ ConditionalColoringPlugin.prototype._blinkingEnabled = false; // WORKAROUND: To
89
99
  * @private
90
100
  */
91
101
  ConditionalColoringPlugin.prototype._pendingFields;
102
+ /** @type {Object}
103
+ * @private
104
+ */
105
+ ConditionalColoringPlugin.prototype._predefinedColors = null;
92
106
 
93
107
  /** @override
94
108
  * @return {string}
@@ -118,6 +132,15 @@ ConditionalColoringPlugin.prototype.initialize = function (host, options) {
118
132
 
119
133
  hosts.push(host);
120
134
 
135
+ var extOptions = options["conditionalColoring"];
136
+ if (extOptions) {
137
+ var predefinedColors = extOptions["predefinedColors"];
138
+ if (predefinedColors != null && typeof predefinedColors === "object") {
139
+ this._injectStyles(predefinedColors);
140
+ host.enableClass(ConditionalColoringPlugin._controlClass);
141
+ }
142
+ }
143
+
121
144
  if(hosts.length === 1) {
122
145
  this.config(options);
123
146
  } else {
@@ -206,6 +229,14 @@ ConditionalColoringPlugin.prototype.config = function (options) {
206
229
  ConditionalColoringPlugin.prototype.getConfigObject = function (gridOptions) {
207
230
  var obj = gridOptions || {};
208
231
 
232
+ if(this._predefinedColors != null) {
233
+ var extOptions = obj["conditionalColoring"];
234
+ if(!extOptions) {
235
+ extOptions = obj["conditionalColoring"] = {};
236
+ }
237
+ extOptions["predefinedColors"] = this._predefinedColors;
238
+ }
239
+
209
240
  var columns = obj.columns;
210
241
  if (!columns) {
211
242
  columns = obj.columns = [];
@@ -244,7 +275,8 @@ ConditionalColoringPlugin.prototype.getColumnColoring = function(colIndex, optio
244
275
  extendObject(exCondition, conditions[n], [
245
276
  "expression",
246
277
  "backgroundColor",
247
- "color"
278
+ "color",
279
+ "cssClass"
248
280
  ]);
249
281
 
250
282
  options.conditions.push(exCondition);
@@ -824,6 +856,49 @@ ConditionalColoringPlugin._mergeUpdates = function(e) {
824
856
  return changedRows;
825
857
  };
826
858
  /** @private
859
+ * @param {Object} predefinedColors Predefined color object map
860
+ */
861
+ ConditionalColoringPlugin.prototype._injectStyles = function(predefinedColors) {
862
+ var prefix = ".tr-grid." + ConditionalColoringPlugin._controlClass + " .tr-lg .cell";
863
+ var css = [];
864
+ var ss, styles, value;
865
+ for (var className in predefinedColors) {
866
+ css.push(prefix + "." + className);
867
+ ss = [];
868
+ styles = predefinedColors[className];
869
+
870
+ value = styles["backgroundColor"];
871
+ if(value) {
872
+ ss.push("background-color: " + value + ";");
873
+ }
874
+
875
+ value = styles["color"];
876
+ if(value) {
877
+ ss.push("color: " + value + ";");
878
+ }
879
+
880
+ css.push(ss);
881
+ }
882
+
883
+ // TODO: support multitable
884
+ var host = this._hosts[0];
885
+
886
+ if(this._styleTag) {
887
+ this._styleTag.parentNode.removeChild(this._styleTag);
888
+ this._styleTag = null;
889
+ }
890
+ this._styleTag = injectCss(prettifyCss(css), host.getElement());
891
+ this._predefinedColors = predefinedColors;
892
+ };
893
+ /** @public
894
+ * @param {Object} predefinedColors Predefined color object map
895
+ */
896
+ ConditionalColoringPlugin.prototype.setPredefinedColors = function(predefinedColors) {
897
+ if(predefinedColors != null && typeof predefinedColors === "object") {
898
+ this._injectStyles(predefinedColors);
899
+ }
900
+ };
901
+ /** @private
827
902
  * @function
828
903
  * @return {!FilterBuilder}
829
904
  */
@@ -83,6 +83,8 @@ import { CoralItems } from "../../tr-grid-util/es6/CoralItems.js";
83
83
  * @description Fired after the text editor has been closed and all operations are done. This is useful to clean up left over resource and get result text entered.
84
84
  * @type {Object}
85
85
  * @property {string=} text Text that user has entered
86
+ * @property {boolean=} groupHeader if the row is header of row, it will be groupHeader
87
+ * @property {Object} suggestionDetail Suggestion detail for auto suggest "item-select" event
86
88
  * @property {boolean} cancelled Readonly flag. Indicates whether the commit operation has been cancelled
87
89
  * @property {boolean} committed Readonly flag. The opposite of `cancelled` flag
88
90
  */
@@ -92,6 +94,8 @@ import { CoralItems } from "../../tr-grid-util/es6/CoralItems.js";
92
94
  * @type {Object}
93
95
  * @property {string=} text Text that user has entered
94
96
  * @property {boolean=} cancel Set to true to cancel the commit operation.
97
+ * @property {boolean=} groupHeader if the row is header of row, it will be groupHeader
98
+ * @property {Object} suggestionDetail Suggestion detail for auto suggest "item-select" event
95
99
  * @example
96
100
  * var cep = new InCellEditingPlugin();
97
101
  * cep.listen("beforeCommit", function(e) {
@@ -1450,15 +1454,20 @@ InCellEditingPlugin.prototype._onPopupHide = function (e) {
1450
1454
  * @param {Object} event
1451
1455
  */
1452
1456
  InCellEditingPlugin.prototype._onAutoSuggestItemSelected = function (event) {
1453
- if (event.detail.target) {
1454
- var method = event.detail.method;
1455
- var value = event.detail.target.value;
1456
- if (method === 'enter' || method === 'click') {
1457
- if (value) {
1458
- this.setText(value);
1459
- this._commitText(true);
1460
- }
1461
- }
1457
+ var eventDetail = event.detail;
1458
+ if (!eventDetail) {
1459
+ return;
1460
+ }
1461
+ var targetSelected = eventDetail.target;
1462
+ if (!targetSelected) {
1463
+ return;
1464
+ }
1465
+ var suggestionMethod = eventDetail.method;
1466
+ // Need to check the details of the methods, another method like a navigation, reset, clear shouldn't commit text
1467
+ // TODO: We need to handled tab to move. Currently, the property suggestionDetail in 'beforeCommit' event doesn't handlded when we use autosuggest with tab to move.
1468
+ if (suggestionMethod === "click" || suggestionMethod === "enter") {
1469
+ this.setText(targetSelected.value);
1470
+ this._commitText(true, eventDetail.suggestion);
1462
1471
  }
1463
1472
  };
1464
1473
 
@@ -1554,8 +1563,9 @@ InCellEditingPlugin.prototype._onTextKeyUp = function (e) {
1554
1563
  /** Commit text from editor to cell.
1555
1564
  * @private
1556
1565
  * @param {boolean} committed
1566
+ * @param {Object} suggestionDetail suggestion detail for auto suggest element
1557
1567
  */
1558
- InCellEditingPlugin.prototype._commitText = function (committed) {
1568
+ InCellEditingPlugin.prototype._commitText = function (committed, suggestionDetail) {
1559
1569
  var t = this;
1560
1570
  var arg = t._activePos;
1561
1571
  if (!t.isEditing() || !arg) {
@@ -1566,6 +1576,10 @@ InCellEditingPlugin.prototype._commitText = function (committed) {
1566
1576
  var enteredValue = arg["text"] = this.getValue();
1567
1577
  var groupHeader = arg["groupHeader"] || false;
1568
1578
  if (committed) {
1579
+ if (suggestionDetail) {
1580
+ // This property is only available when the user commits text from the 'item-select' event of the auto suggest.
1581
+ arg["suggestionDetail"] = suggestionDetail;
1582
+ }
1569
1583
  if (t.hasListener("beforeCommit")) {
1570
1584
  t._dispatch("beforeCommit", arg);
1571
1585
  committed = !arg["cancel"];
@@ -19,7 +19,8 @@ declare namespace CellPainter {
19
19
  fontWeight?: string|null,
20
20
  fontStyle?: string|null,
21
21
  textAlign?: string|null,
22
- textDecoration?: string|null
22
+ textDecoration?: string|null,
23
+ cssClass?: string|null
23
24
  };
24
25
 
25
26
  type ThemeColors = {