tabulator-tables 5.5.4 → 5.6.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (101) hide show
  1. package/bower.json +1 -1
  2. package/dist/css/tabulator.css +72 -2
  3. package/dist/css/tabulator.css.map +1 -1
  4. package/dist/css/tabulator.min.css +1 -1
  5. package/dist/css/tabulator.min.css.map +1 -1
  6. package/dist/css/tabulator_bootstrap3.css +72 -2
  7. package/dist/css/tabulator_bootstrap3.css.map +1 -1
  8. package/dist/css/tabulator_bootstrap3.min.css +1 -1
  9. package/dist/css/tabulator_bootstrap3.min.css.map +1 -1
  10. package/dist/css/tabulator_bootstrap4.css +72 -2
  11. package/dist/css/tabulator_bootstrap4.css.map +1 -1
  12. package/dist/css/tabulator_bootstrap4.min.css +1 -1
  13. package/dist/css/tabulator_bootstrap4.min.css.map +1 -1
  14. package/dist/css/tabulator_bootstrap5.css +72 -2
  15. package/dist/css/tabulator_bootstrap5.css.map +1 -1
  16. package/dist/css/tabulator_bootstrap5.min.css +1 -1
  17. package/dist/css/tabulator_bootstrap5.min.css.map +1 -1
  18. package/dist/css/tabulator_bulma.css +72 -2
  19. package/dist/css/tabulator_bulma.css.map +1 -1
  20. package/dist/css/tabulator_bulma.min.css +1 -1
  21. package/dist/css/tabulator_bulma.min.css.map +1 -1
  22. package/dist/css/tabulator_materialize.css +72 -2
  23. package/dist/css/tabulator_materialize.css.map +1 -1
  24. package/dist/css/tabulator_materialize.min.css +1 -1
  25. package/dist/css/tabulator_materialize.min.css.map +1 -1
  26. package/dist/css/tabulator_midnight.css +72 -2
  27. package/dist/css/tabulator_midnight.css.map +1 -1
  28. package/dist/css/tabulator_midnight.min.css +1 -1
  29. package/dist/css/tabulator_midnight.min.css.map +1 -1
  30. package/dist/css/tabulator_modern.css +72 -2
  31. package/dist/css/tabulator_modern.css.map +1 -1
  32. package/dist/css/tabulator_modern.min.css +1 -1
  33. package/dist/css/tabulator_modern.min.css.map +1 -1
  34. package/dist/css/tabulator_semanticui.css +72 -2
  35. package/dist/css/tabulator_semanticui.css.map +1 -1
  36. package/dist/css/tabulator_semanticui.min.css +1 -1
  37. package/dist/css/tabulator_semanticui.min.css.map +1 -1
  38. package/dist/css/tabulator_simple.css +72 -2
  39. package/dist/css/tabulator_simple.css.map +1 -1
  40. package/dist/css/tabulator_simple.min.css +1 -1
  41. package/dist/css/tabulator_simple.min.css.map +1 -1
  42. package/dist/css/tabulator_site.css +74 -4
  43. package/dist/css/tabulator_site.css.map +1 -1
  44. package/dist/css/tabulator_site.min.css +1 -1
  45. package/dist/css/tabulator_site.min.css.map +1 -1
  46. package/dist/js/tabulator.js +1868 -245
  47. package/dist/js/tabulator.js.map +1 -1
  48. package/dist/js/tabulator.min.js +2 -2
  49. package/dist/js/tabulator.min.js.map +1 -1
  50. package/dist/js/tabulator_esm.js +1948 -323
  51. package/dist/js/tabulator_esm.js.map +1 -1
  52. package/dist/js/tabulator_esm.min.js +2 -2
  53. package/dist/js/tabulator_esm.min.js.map +1 -1
  54. package/package.json +2 -2
  55. package/src/js/core/ColumnManager.js +4 -0
  56. package/src/js/core/CoreFeature.js +2 -2
  57. package/src/js/core/RowManager.js +12 -6
  58. package/src/js/core/Tabulator.js +2 -1
  59. package/src/js/core/TabulatorFull.js +1 -1
  60. package/src/js/core/column/Column.js +10 -0
  61. package/src/js/core/modules/optional.js +2 -1
  62. package/src/js/core/rendering/renderers/BasicVertical.js +4 -2
  63. package/src/js/core/rendering/renderers/VirtualDomHorizontal.js +1 -1
  64. package/src/js/core/row/PseudoRow.js +2 -0
  65. package/src/js/core/tools/Alert.js +4 -0
  66. package/src/js/core/tools/DeprecationAdvisor.js +5 -1
  67. package/src/js/core/tools/Helpers.js +1 -1
  68. package/src/js/core/tools/InteractionMonitor.js +3 -3
  69. package/src/js/modules/Clipboard/Clipboard.js +5 -3
  70. package/src/js/modules/Clipboard/defaults/pasteActions.js +49 -6
  71. package/src/js/modules/Clipboard/defaults/pasteParsers.js +69 -14
  72. package/src/js/modules/ColumnCalcs/ColumnCalcs.js +7 -1
  73. package/src/js/modules/Edit/Edit.js +71 -25
  74. package/src/js/modules/Edit/defaults/editors/datetime.js +1 -1
  75. package/src/js/modules/Edit/defaults/editors/time.js +3 -1
  76. package/src/js/modules/Export/Export.js +38 -18
  77. package/src/js/modules/Format/defaults/formatters/rowSelection.js +2 -2
  78. package/src/js/modules/Format/defaults/formatters/rownum.js +5 -1
  79. package/src/js/modules/FrozenColumns/FrozenColumns.js +11 -11
  80. package/src/js/modules/FrozenRows/FrozenRows.js +6 -1
  81. package/src/js/modules/History/History.js +2 -2
  82. package/src/js/modules/History/defaults/redoers.js +4 -0
  83. package/src/js/modules/History/defaults/undoers.js +4 -0
  84. package/src/js/modules/Keybindings/defaults/actions.js +38 -1
  85. package/src/js/modules/Keybindings/defaults/bindings.js +16 -1
  86. package/src/js/modules/Menu/Menu.js +3 -1
  87. package/src/js/modules/MoveColumns/MoveColumns.js +5 -0
  88. package/src/js/modules/Popup/Popup.js +1 -1
  89. package/src/js/modules/ResizeTable/ResizeTable.js +3 -3
  90. package/src/js/modules/SelectRange/Range.js +354 -0
  91. package/src/js/modules/SelectRange/RangeComponent.js +93 -0
  92. package/src/js/modules/SelectRange/SelectRange.js +870 -0
  93. package/src/js/modules/SelectRow/SelectRow.js +46 -26
  94. package/src/js/modules/Sort/Sort.js +111 -105
  95. package/src/js/modules/Validate/defaults/validators.js +11 -0
  96. package/src/scss/tabulator.scss +95 -13
  97. package/src/scss/themes/bulma/tabulator_bulma.scss +7 -0
  98. package/src/scss/themes/materialize/tabulator_materialize.scss +7 -1
  99. package/src/scss/themes/tabulator_midnight.scss +13 -0
  100. package/src/scss/themes/tabulator_modern.scss +9 -0
  101. package/src/scss/themes/tabulator_site.scss +13 -2
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "tabulator-tables",
3
- "version": "5.5.4",
3
+ "version": "5.6.1",
4
4
  "description": "Interactive table generation JavaScript library",
5
5
  "style": "dist/css/tabulator.css",
6
6
  "main": "dist/js/tabulator.js",
@@ -47,7 +47,7 @@
47
47
  "bugs": {
48
48
  "url": "https://github.com/olifolkerd/tabulator/issues"
49
49
  },
50
- "homepage": "http://tabulator.info/",
50
+ "homepage": "https://tabulator.info/",
51
51
  "devDependencies": {
52
52
  "@rollup/plugin-node-resolve": "^11.0.1",
53
53
  "eslint": "^8.10.0",
@@ -407,6 +407,10 @@ export default class ColumnManager extends CoreFeature {
407
407
 
408
408
  return index > -1 ? this.columnsByIndex[index] : false;
409
409
  }
410
+
411
+ getVisibleColumnsByIndex() {
412
+ return this.columnsByIndex.filter((col) => col.visible);
413
+ }
410
414
 
411
415
  getColumns(){
412
416
  return this.columns;
@@ -118,8 +118,8 @@ export default class CoreFeature{
118
118
  /////////// Deprecation Checks ///////////
119
119
  //////////////////////////////////////////
120
120
 
121
- deprecationCheck(oldOption, newOption){
122
- return this.table.deprecationAdvisor.check(oldOption, newOption);
121
+ deprecationCheck(oldOption, newOption, convert){
122
+ return this.table.deprecationAdvisor.check(oldOption, newOption, convert);
123
123
  }
124
124
 
125
125
  deprecationCheckMsg(oldOption, msg){
@@ -344,7 +344,7 @@ export default class RowManager extends CoreFeature{
344
344
 
345
345
  this.regenerateRowPositions();
346
346
 
347
- if(rows.length){
347
+ if(this.displayRowsCount){
348
348
  this._clearPlaceholder();
349
349
  }
350
350
 
@@ -973,6 +973,14 @@ export default class RowManager extends CoreFeature{
973
973
  this.renderEmptyScroll();
974
974
  this._showPlaceholder();
975
975
  }
976
+
977
+ checkPlaceholder(){
978
+ if(this.displayRowsCount){
979
+ this._clearPlaceholder();
980
+ }else{
981
+ this.tableEmpty();
982
+ }
983
+ }
976
984
 
977
985
  _showPlaceholder(){
978
986
  if(this.placeholder){
@@ -1101,13 +1109,11 @@ export default class RowManager extends CoreFeature{
1101
1109
 
1102
1110
  //redraw table
1103
1111
  redraw (force){
1104
- const resized = this.adjustTableSize();
1112
+ this.adjustTableSize();
1105
1113
  this.table.tableWidth = this.table.element.clientWidth;
1106
1114
 
1107
- if(!force){
1108
- if(resized) {
1109
- this.reRenderInPosition();
1110
- }
1115
+ if(!force){
1116
+ this.reRenderInPosition();
1111
1117
  this.scrollHorizontal(this.scrollLeft);
1112
1118
  }else{
1113
1119
  this.renderTable();
@@ -277,6 +277,7 @@ class Tabulator {
277
277
 
278
278
  _loadInitialData(){
279
279
  this.dataLoader.load(this.options.data);
280
+ this.columnManager.verticalAlignHeaders();
280
281
  }
281
282
 
282
283
  //deconstructor
@@ -829,7 +830,7 @@ class Tabulator {
829
830
  this.options.height = isNaN(height) ? height : height + "px";
830
831
  this.element.style.height = this.options.height;
831
832
  this.rowManager.initializeRenderer();
832
- this.rowManager.redraw();
833
+ this.rowManager.redraw(true);
833
834
  }
834
835
 
835
836
  //////////////////// Event Bus ///////////////////
@@ -8,4 +8,4 @@ class TabulatorFull extends Tabulator {}
8
8
  //bind modules and static functionality
9
9
  new ModuleBinder(TabulatorFull, modules);
10
10
 
11
- export default TabulatorFull;
11
+ export default TabulatorFull;
@@ -257,6 +257,10 @@ class Column extends CoreFeature{
257
257
  titleElement.focus();
258
258
  });
259
259
 
260
+ titleElement.addEventListener("mousedown", (e) => {
261
+ e.stopPropagation();
262
+ });
263
+
260
264
  titleElement.addEventListener("change", () => {
261
265
  def.title = titleElement.value;
262
266
  this.dispatchExternal("columnTitleChanged", this.getComponent());
@@ -802,6 +806,8 @@ class Column extends CoreFeature{
802
806
 
803
807
  this.table.columnManager.rerenderColumns(true);
804
808
 
809
+ this.dispatch("column-deleted", this);
810
+
805
811
  resolve();
806
812
  });
807
813
  }
@@ -942,6 +948,10 @@ class Column extends CoreFeature{
942
948
 
943
949
  return this.component;
944
950
  }
951
+
952
+ getPosition(){
953
+ return this.table.columnManager.getVisibleColumnsByIndex().indexOf(this) + 1;
954
+ }
945
955
  }
946
956
 
947
957
  Column.defaultOptionList = defaultOptions;
@@ -31,5 +31,6 @@ export {default as ResizeTableModule} from '../../modules/ResizeTable/ResizeTabl
31
31
  export {default as ResponsiveLayoutModule} from '../../modules/ResponsiveLayout/ResponsiveLayout.js';
32
32
  export {default as SelectRowModule} from '../../modules/SelectRow/SelectRow.js';
33
33
  export {default as SortModule} from '../../modules/Sort/Sort.js';
34
+ export {default as SelectRangeModule} from '../../modules/SelectRange/SelectRange.js';
34
35
  export {default as TooltipModule} from '../../modules/Tooltip/Tooltip.js';
35
- export {default as ValidateModule} from '../../modules/Validate/Validate.js';
36
+ export {default as ValidateModule} from '../../modules/Validate/Validate.js';
@@ -62,8 +62,6 @@ export default class BasicVertical extends Renderer{
62
62
  }
63
63
  });
64
64
 
65
-
66
-
67
65
  if(onlyGroupHeaders){
68
66
  element.style.minWidth = this.table.columnManager.getWidth() + "px";
69
67
  }else{
@@ -80,6 +78,10 @@ export default class BasicVertical extends Renderer{
80
78
  }
81
79
 
82
80
  this.renderRows();
81
+
82
+ if(!this.rows().length){
83
+ this.table.rowManager.tableEmpty();
84
+ }
83
85
  }
84
86
 
85
87
  scrollToRowNearestTop(row){
@@ -580,4 +580,4 @@ export default class VirtualDomHorizontal extends Renderer{
580
580
  }
581
581
  }
582
582
  }
583
- }
583
+ }
@@ -42,4 +42,6 @@ export default class PseudoRow {
42
42
  setCellHeight(){}
43
43
 
44
44
  clearCellHeight(){}
45
+
46
+ rendered(){}
45
47
  }
@@ -31,6 +31,8 @@ export default class Alert extends CoreFeature{
31
31
  alert(content, type = "msg"){
32
32
  if(content){
33
33
  this.clear();
34
+
35
+ this.dispatch("alert-show", type);
34
36
 
35
37
  this.type = type;
36
38
 
@@ -53,6 +55,8 @@ export default class Alert extends CoreFeature{
53
55
  }
54
56
 
55
57
  clear(){
58
+ this.dispatch("alert-hide", this.type);
59
+
56
60
  if(this.element.parentNode){
57
61
  this.element.parentNode.removeChild(this.element);
58
62
  }
@@ -12,7 +12,7 @@ export default class DeprecationAdvisor extends CoreFeature{
12
12
  }
13
13
  }
14
14
 
15
- check(oldOption, newOption){
15
+ check(oldOption, newOption, convert){
16
16
  var msg = "";
17
17
 
18
18
  if(typeof this.options(oldOption) !== "undefined"){
@@ -21,6 +21,10 @@ export default class DeprecationAdvisor extends CoreFeature{
21
21
  if(newOption){
22
22
  msg = msg + ", Please use the %c" + newOption + "%c option instead";
23
23
  this._warnUser(msg, 'font-weight: bold;', 'font-weight: normal;', 'font-weight: bold;', 'font-weight: normal;');
24
+
25
+ if(convert){
26
+ this.table.options[newOption] = this.table.options[oldOption];
27
+ }
24
28
  }else{
25
29
  this._warnUser(msg, 'font-weight: bold;', 'font-weight: normal;');
26
30
  }
@@ -63,4 +63,4 @@ export default class Helpers{
63
63
 
64
64
  return clone;
65
65
  }
66
- }
66
+ }
@@ -226,11 +226,11 @@ export default class InteractionManager extends CoreFeature {
226
226
  }
227
227
  }
228
228
  }
229
-
229
+
230
230
  if(targets.group && targets.group === targets.row){
231
231
  delete targets.row;
232
232
  }
233
-
233
+
234
234
  return targets;
235
235
  }
236
236
 
@@ -319,4 +319,4 @@ export default class InteractionManager extends CoreFeature {
319
319
  }
320
320
  }
321
321
  }
322
- }
322
+ }
@@ -142,6 +142,7 @@ class Clipboard extends Module{
142
142
  var sel, textRange;
143
143
  this.blocked = false;
144
144
  this.customSelection = false;
145
+
145
146
 
146
147
  if (this.mode === true || this.mode === "copy") {
147
148
 
@@ -209,7 +210,7 @@ class Clipboard extends Module{
209
210
  paste(e){
210
211
  var data, rowData, rows;
211
212
 
212
- if(this.checkPaseOrigin(e)){
213
+ if(this.checkPasteOrigin(e)){
213
214
 
214
215
  data = this.getPasteData(e);
215
216
 
@@ -246,10 +247,11 @@ class Clipboard extends Module{
246
247
  }
247
248
 
248
249
 
249
- checkPaseOrigin(e){
250
+ checkPasteOrigin(e){
250
251
  var valid = true;
252
+ var blocked = this.confirm("clipboard-paste", [e]);
251
253
 
252
- if(e.target.tagName != "DIV" || this.table.modules.edit.currentCell){
254
+ if(blocked || !["DIV", "SPAN"].includes(e.target.tagName)){
253
255
  valid = false;
254
256
  }
255
257
 
@@ -1,11 +1,54 @@
1
1
  export default {
2
- replace:function(rows){
3
- return this.table.setData(rows);
2
+ replace:function(data){
3
+ return this.table.setData(data);
4
4
  },
5
- update:function(rows){
6
- return this.table.updateOrAddData(rows);
5
+ update:function(data){
6
+ return this.table.updateOrAddData(data);
7
7
  },
8
- insert:function(rows){
9
- return this.table.addData(rows);
8
+ insert:function(data){
9
+ return this.table.addData(data);
10
10
  },
11
+ range:function(data){
12
+ var rows = [],
13
+ range = this.table.modules.selectRange.activeRange,
14
+ singleCell = false,
15
+ bounds, startCell, startRow, rowWidth, dataLength;
16
+
17
+ dataLength = data.length;
18
+
19
+ if(range){
20
+ bounds = range.getBounds();
21
+ startCell = bounds.start;
22
+
23
+ if(bounds.start === bounds.end){
24
+ singleCell = true;
25
+ }
26
+
27
+ if(startCell){
28
+ rows = this.table.rowManager.activeRows.slice();
29
+ startRow = rows.indexOf(startCell.row);
30
+
31
+ if(singleCell){
32
+ rowWidth = data.length;
33
+ }else{
34
+ rowWidth = (rows.indexOf(bounds.end.row) - startRow) + 1;
35
+ }
36
+
37
+
38
+ if(startRow >-1){
39
+ this.table.blockRedraw();
40
+
41
+ rows = rows.slice(startRow, startRow + rowWidth);
42
+
43
+ rows.forEach((row, i) => {
44
+ row.updateData(data[i % dataLength]);
45
+ });
46
+
47
+ this.table.restoreRedraw();
48
+ }
49
+ }
50
+ }
51
+
52
+ return rows;
53
+ }
11
54
  };
@@ -5,71 +5,126 @@ export default {
5
5
  columns = this.table.columnManager.columns,
6
6
  columnMap = [],
7
7
  rows = [];
8
-
8
+
9
9
  //get data from clipboard into array of columns and rows.
10
10
  clipboard = clipboard.split("\n");
11
-
11
+
12
12
  clipboard.forEach(function(row){
13
13
  data.push(row.split("\t"));
14
14
  });
15
-
15
+
16
16
  if(data.length && !(data.length === 1 && data[0].length < 2)){
17
-
17
+
18
18
  //check if headers are present by title
19
19
  data[0].forEach(function(value){
20
20
  var column = columns.find(function(column){
21
21
  return value && column.definition.title && value.trim() && column.definition.title.trim() === value.trim();
22
22
  });
23
-
23
+
24
24
  if(column){
25
25
  columnMap.push(column);
26
26
  }else{
27
27
  headerFindSuccess = false;
28
28
  }
29
29
  });
30
-
30
+
31
31
  //check if column headers are present by field
32
32
  if(!headerFindSuccess){
33
33
  headerFindSuccess = true;
34
34
  columnMap = [];
35
-
35
+
36
36
  data[0].forEach(function(value){
37
37
  var column = columns.find(function(column){
38
38
  return value && column.field && value.trim() && column.field.trim() === value.trim();
39
39
  });
40
-
40
+
41
41
  if(column){
42
42
  columnMap.push(column);
43
43
  }else{
44
44
  headerFindSuccess = false;
45
45
  }
46
46
  });
47
-
47
+
48
48
  if(!headerFindSuccess){
49
49
  columnMap = this.table.columnManager.columnsByIndex;
50
50
  }
51
51
  }
52
-
52
+
53
53
  //remove header row if found
54
54
  if(headerFindSuccess){
55
55
  data.shift();
56
56
  }
57
-
57
+
58
58
  data.forEach(function(item){
59
59
  var row = {};
60
-
60
+
61
61
  item.forEach(function(value, i){
62
62
  if(columnMap[i]){
63
63
  row[columnMap[i].field] = value;
64
64
  }
65
65
  });
66
-
66
+
67
67
  rows.push(row);
68
68
  });
69
-
69
+
70
70
  return rows;
71
71
  }else{
72
72
  return false;
73
73
  }
74
+ },
75
+ range:function(clipboard){
76
+ var data = [],
77
+ rows = [],
78
+ range = this.table.modules.selectRange.activeRange,
79
+ singleCell = false,
80
+ bounds, startCell, colWidth, columnMap, startCol;
81
+
82
+ if(range){
83
+ bounds = range.getBounds();
84
+ startCell = bounds.start;
85
+
86
+ if(bounds.start === bounds.end){
87
+ singleCell = true;
88
+ }
89
+
90
+ if(startCell){
91
+ //get data from clipboard into array of columns and rows.
92
+ clipboard = clipboard.split("\n");
93
+
94
+ clipboard.forEach(function(row){
95
+ data.push(row.split("\t"));
96
+ });
97
+
98
+ if(data.length){
99
+ columnMap = this.table.columnManager.getVisibleColumnsByIndex();
100
+ startCol = columnMap.indexOf(startCell.column);
101
+
102
+ if(startCol > -1){
103
+ if(singleCell){
104
+ colWidth = data[0].length;
105
+ }else{
106
+ colWidth = (columnMap.indexOf(bounds.end.column) - startCol) + 1;
107
+ }
108
+
109
+ columnMap = columnMap.slice(startCol, startCol + colWidth);
110
+
111
+ data.forEach((item) => {
112
+ var row = {};
113
+ var itemLength = item.length;
114
+
115
+ columnMap.forEach(function(col, i){
116
+ row[col.field] = item[i % itemLength];
117
+ });
118
+
119
+ rows.push(row);
120
+ });
121
+
122
+ return rows;
123
+ }
124
+ }
125
+ }
126
+ }
127
+
128
+ return false;
74
129
  }
75
130
  };
@@ -274,8 +274,14 @@ class ColumnCalcs extends Module{
274
274
  }
275
275
 
276
276
  initializeTopRow(){
277
+ var fragment = document.createDocumentFragment();
278
+
277
279
  if(!this.topInitialized){
278
- this.table.columnManager.getContentsElement().insertBefore(this.topElement, this.table.columnManager.headersElement.nextSibling);
280
+
281
+ fragment.appendChild(document.createElement("br"));
282
+ fragment.appendChild(this.topElement);
283
+
284
+ this.table.columnManager.getContentsElement().insertBefore(fragment, this.table.columnManager.headersElement.nextSibling);
279
285
  this.topInitialized = true;
280
286
  }
281
287
  }