tabulator-tables 5.0.7 → 5.1.0
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.
- package/.editorconfig +6 -0
- package/LICENSE +1 -1
- package/bower.json +1 -1
- package/build/rollup.js +1 -1
- package/dist/css/tabulator.css +15 -2
- package/dist/css/tabulator.css.map +1 -1
- package/dist/css/tabulator.min.css +1 -1
- package/dist/css/tabulator.min.css.map +1 -1
- package/dist/css/tabulator_bootstrap3.css +15 -2
- package/dist/css/tabulator_bootstrap3.css.map +1 -1
- package/dist/css/tabulator_bootstrap3.min.css +1 -1
- package/dist/css/tabulator_bootstrap3.min.css.map +1 -1
- package/dist/css/tabulator_bootstrap4.css +15 -2
- package/dist/css/tabulator_bootstrap4.css.map +1 -1
- package/dist/css/tabulator_bootstrap4.min.css +1 -1
- package/dist/css/tabulator_bootstrap4.min.css.map +1 -1
- package/dist/css/tabulator_bulma.css +15 -2
- package/dist/css/tabulator_bulma.css.map +1 -1
- package/dist/css/tabulator_bulma.min.css +1 -1
- package/dist/css/tabulator_bulma.min.css.map +1 -1
- package/dist/css/tabulator_materialize.css +22 -6
- package/dist/css/tabulator_materialize.css.map +1 -1
- package/dist/css/tabulator_materialize.min.css +1 -1
- package/dist/css/tabulator_materialize.min.css.map +1 -1
- package/dist/css/tabulator_midnight.css +19 -2
- package/dist/css/tabulator_midnight.css.map +1 -1
- package/dist/css/tabulator_midnight.min.css +1 -1
- package/dist/css/tabulator_midnight.min.css.map +1 -1
- package/dist/css/tabulator_modern.css +15 -2
- package/dist/css/tabulator_modern.css.map +1 -1
- package/dist/css/tabulator_modern.min.css +1 -1
- package/dist/css/tabulator_modern.min.css.map +1 -1
- package/dist/css/tabulator_semanticui.css +15 -2
- package/dist/css/tabulator_semanticui.css.map +1 -1
- package/dist/css/tabulator_semanticui.min.css +1 -1
- package/dist/css/tabulator_semanticui.min.css.map +1 -1
- package/dist/css/tabulator_simple.css +15 -2
- package/dist/css/tabulator_simple.css.map +1 -1
- package/dist/css/tabulator_simple.min.css +1 -1
- package/dist/css/tabulator_simple.min.css.map +1 -1
- package/dist/css/tabulator_site.css +19 -2
- package/dist/css/tabulator_site.css.map +1 -1
- package/dist/css/tabulator_site.min.css +1 -1
- package/dist/css/tabulator_site.min.css.map +1 -1
- package/dist/js/tabulator.js +1121 -533
- package/dist/js/tabulator.js.map +1 -1
- package/dist/js/tabulator.min.js +2 -2
- package/dist/js/tabulator.min.js.map +1 -1
- package/dist/js/tabulator_esm.js +1566 -991
- package/dist/js/tabulator_esm.js.map +1 -1
- package/dist/js/tabulator_esm.min.js +2 -2
- package/dist/js/tabulator_esm.min.js.map +1 -1
- package/package.json +1 -1
- package/src/js/core/ColumnManager.js +4 -2
- package/src/js/core/CoreFeature.js +1 -5
- package/src/js/core/RowManager.js +15 -9
- package/src/js/core/Tabulator.js +14 -59
- package/src/js/core/cell/Cell.js +5 -1
- package/src/js/core/column/Column.js +21 -6
- package/src/js/core/column/ColumnComponent.js +4 -0
- package/src/js/core/column/defaults/options.js +1 -0
- package/src/js/core/defaults/options.js +3 -3
- package/src/js/core/modules/optional.js +1 -0
- package/src/js/core/rendering/Renderer.js +3 -2
- package/src/js/core/rendering/renderers/BasicVertical.js +2 -1
- package/src/js/core/rendering/renderers/VirtualDomHorizontal.js +165 -151
- package/src/js/core/rendering/renderers/VirtualDomVertical.js +1 -1
- package/src/js/core/row/Row.js +2 -2
- package/src/js/core/tools/{ComponentFuctionBinder.js → ComponentFunctionBinder.js} +1 -1
- package/src/js/core/tools/DataLoader.js +6 -6
- package/src/js/core/tools/InteractionMonitor.js +149 -49
- package/src/js/core/tools/OptionsList.js +2 -2
- package/src/js/modules/Ajax/Ajax.js +62 -82
- package/src/js/modules/ColumnCalcs/ColumnCalcs.js +15 -2
- package/src/js/modules/DataTree/DataTree.js +23 -9
- package/src/js/modules/Download/defaults/downloaders/json.js +1 -1
- package/src/js/modules/Download/defaults/downloaders/jsonLines.js +32 -0
- package/src/js/modules/Download/defaults/downloaders/pdf.js +0 -2
- package/src/js/modules/Download/defaults/downloaders/xlsx.js +3 -2
- package/src/js/modules/Download/defaults/downloaders.js +2 -0
- package/src/js/modules/Edit/Edit.js +27 -39
- package/src/js/modules/Edit/defaults/editors/progress.js +2 -2
- package/src/js/modules/Export/Export.js +1 -1
- package/src/js/modules/Filter/Filter.js +2 -2
- package/src/js/modules/Format/defaults/formatters/datetime.js +2 -2
- package/src/js/modules/Format/defaults/formatters/datetimediff.js +2 -1
- package/src/js/modules/FrozenColumns/FrozenColumns.js +1 -1
- package/src/js/modules/FrozenRows/FrozenRows.js +9 -0
- package/src/js/modules/GroupRows/Group.js +18 -67
- package/src/js/modules/GroupRows/GroupRows.js +8 -3
- package/src/js/modules/HtmlTableImport/HtmlTableImport.js +4 -7
- package/src/js/modules/Import/Import.js +197 -0
- package/src/js/modules/Import/defaults/importers/csv.js +63 -0
- package/src/js/modules/Import/defaults/importers/json.js +8 -0
- package/src/js/modules/Import/defaults/importers.js +7 -0
- package/src/js/modules/Interaction/Interaction.js +5 -0
- package/src/js/modules/Keybindings/Keybindings.js +9 -14
- package/src/js/modules/Keybindings/defaults/bindings.js +3 -3
- package/src/js/modules/Localize/defaults/langs.js +6 -0
- package/src/js/modules/Menu/Menu.js +200 -155
- package/src/js/modules/MoveColumns/MoveColumns.js +58 -57
- package/src/js/modules/MoveRows/MoveRows.js +4 -0
- package/src/js/modules/Page/Page.js +279 -183
- package/src/js/modules/Page/defaults/pageCounters/pages.js +33 -0
- package/src/js/modules/Page/defaults/pageCounters/rows.js +32 -0
- package/src/js/modules/Page/defaults/pageCounters.js +8 -0
- package/src/js/modules/ResizeRows/ResizeRows.js +1 -1
- package/src/js/modules/ResponsiveLayout/ResponsiveLayout.js +3 -5
- package/src/js/modules/SelectRow/SelectRow.js +4 -8
- package/src/js/modules/Sort/Sort.js +1 -1
- package/src/js/modules/Sort/defaults/sorters/datetime.js +3 -2
- package/src/js/modules/Validate/Validate.js +7 -5
- package/src/scss/tabulator.scss +20 -2
- package/src/scss/themes/materialize/tabulator_materialize.scss +5 -4
- package/src/scss/themes/tabulator_midnight.scss +4 -0
- package/src/scss/themes/tabulator_site.scss +4 -0
|
@@ -2,10 +2,10 @@ import Module from '../../core/Module.js';
|
|
|
2
2
|
import Helpers from '../../core/tools/Helpers.js';
|
|
3
3
|
|
|
4
4
|
class MoveColumns extends Module{
|
|
5
|
-
|
|
5
|
+
|
|
6
6
|
constructor(table){
|
|
7
7
|
super(table);
|
|
8
|
-
|
|
8
|
+
|
|
9
9
|
this.placeholderElement = this.createPlaceholderElement();
|
|
10
10
|
this.hoverElement = false; //floating column header element
|
|
11
11
|
this.checkTimeout = false; //click check timeout holder
|
|
@@ -18,35 +18,36 @@ class MoveColumns extends Module{
|
|
|
18
18
|
this.autoScrollStep = 5; //auto scroll distance in pixels
|
|
19
19
|
this.autoScrollTimeout = false; //auto scroll timeout
|
|
20
20
|
this.touchMove = false;
|
|
21
|
-
|
|
21
|
+
|
|
22
22
|
this.moveHover = this.moveHover.bind(this);
|
|
23
23
|
this.endMove = this.endMove.bind(this);
|
|
24
|
-
|
|
24
|
+
|
|
25
25
|
this.registerTableOption("movableColumns", false); //enable movable columns
|
|
26
26
|
}
|
|
27
|
-
|
|
27
|
+
|
|
28
28
|
createPlaceholderElement(){
|
|
29
29
|
var el = document.createElement("div");
|
|
30
|
-
|
|
30
|
+
|
|
31
31
|
el.classList.add("tabulator-col");
|
|
32
32
|
el.classList.add("tabulator-col-placeholder");
|
|
33
|
-
|
|
33
|
+
|
|
34
34
|
return el;
|
|
35
35
|
}
|
|
36
|
-
|
|
36
|
+
|
|
37
37
|
initialize(){
|
|
38
|
-
|
|
38
|
+
if(this.table.options.movableColumns){
|
|
39
|
+
this.subscribe("column-init", this.initializeColumn.bind(this));
|
|
40
|
+
}
|
|
39
41
|
}
|
|
40
|
-
|
|
42
|
+
|
|
41
43
|
initializeColumn(column){
|
|
42
44
|
var self = this,
|
|
43
45
|
config = {},
|
|
44
46
|
colEl;
|
|
45
|
-
|
|
47
|
+
|
|
46
48
|
if(!column.modules.frozen){
|
|
47
|
-
|
|
48
49
|
colEl = column.getElement();
|
|
49
|
-
|
|
50
|
+
|
|
50
51
|
config.mousemove = function(e){
|
|
51
52
|
if(column.parent === self.moving.parent){
|
|
52
53
|
if((((self.touchMove ? e.touches[0].pageX : e.pageX) - Helpers.elOffset(colEl).left) + self.table.columnManager.element.scrollLeft) > (column.getWidth() / 2)){
|
|
@@ -62,7 +63,7 @@ class MoveColumns extends Module{
|
|
|
62
63
|
}
|
|
63
64
|
}
|
|
64
65
|
}.bind(self);
|
|
65
|
-
|
|
66
|
+
|
|
66
67
|
colEl.addEventListener("mousedown", function(e){
|
|
67
68
|
self.touchMove = false;
|
|
68
69
|
if(e.which === 1){
|
|
@@ -71,7 +72,7 @@ class MoveColumns extends Module{
|
|
|
71
72
|
}, self.checkPeriod);
|
|
72
73
|
}
|
|
73
74
|
});
|
|
74
|
-
|
|
75
|
+
|
|
75
76
|
colEl.addEventListener("mouseup", function(e){
|
|
76
77
|
if(e.which === 1){
|
|
77
78
|
if(self.checkTimeout){
|
|
@@ -79,19 +80,19 @@ class MoveColumns extends Module{
|
|
|
79
80
|
}
|
|
80
81
|
}
|
|
81
82
|
});
|
|
82
|
-
|
|
83
|
+
|
|
83
84
|
self.bindTouchEvents(column);
|
|
84
85
|
}
|
|
85
|
-
|
|
86
|
+
|
|
86
87
|
column.modules.moveColumn = config;
|
|
87
88
|
}
|
|
88
|
-
|
|
89
|
+
|
|
89
90
|
bindTouchEvents(column){
|
|
90
91
|
var colEl = column.getElement(),
|
|
91
92
|
startXMove = false, //shifting center position of the cell
|
|
92
93
|
dir = false,
|
|
93
94
|
currentCol, nextCol, prevCol, nextColWidth, prevColWidth, nextColWidthLast, prevColWidthLast;
|
|
94
|
-
|
|
95
|
+
|
|
95
96
|
colEl.addEventListener("touchstart", (e) => {
|
|
96
97
|
this.checkTimeout = setTimeout(() => {
|
|
97
98
|
this.touchMove = true;
|
|
@@ -103,27 +104,27 @@ class MoveColumns extends Module{
|
|
|
103
104
|
nextColWidthLast = 0;
|
|
104
105
|
prevColWidthLast = 0;
|
|
105
106
|
startXMove = false;
|
|
106
|
-
|
|
107
|
+
|
|
107
108
|
this.startMove(e, column);
|
|
108
109
|
}, this.checkPeriod);
|
|
109
110
|
}, {passive: true});
|
|
110
|
-
|
|
111
|
+
|
|
111
112
|
colEl.addEventListener("touchmove", (e) => {
|
|
112
113
|
var halfCol, diff, moveToCol;
|
|
113
|
-
|
|
114
|
+
|
|
114
115
|
if(this.moving){
|
|
115
116
|
this.moveHover(e);
|
|
116
|
-
|
|
117
|
+
|
|
117
118
|
if(!startXMove){
|
|
118
119
|
startXMove = e.touches[0].pageX;
|
|
119
120
|
}
|
|
120
|
-
|
|
121
|
+
|
|
121
122
|
diff = e.touches[0].pageX - startXMove;
|
|
122
|
-
|
|
123
|
+
|
|
123
124
|
if(diff > 0){
|
|
124
125
|
if(nextCol && diff - nextColWidthLast > nextColWidth){
|
|
125
126
|
moveToCol = nextCol;
|
|
126
|
-
|
|
127
|
+
|
|
127
128
|
if(moveToCol !== column){
|
|
128
129
|
startXMove = e.touches[0].pageX;
|
|
129
130
|
moveToCol.getElement().parentNode.insertBefore(this.placeholderElement, moveToCol.getElement().nextSibling);
|
|
@@ -133,7 +134,7 @@ class MoveColumns extends Module{
|
|
|
133
134
|
}else{
|
|
134
135
|
if(prevCol && -diff - prevColWidthLast > prevColWidth){
|
|
135
136
|
moveToCol = prevCol;
|
|
136
|
-
|
|
137
|
+
|
|
137
138
|
if(moveToCol !== column){
|
|
138
139
|
startXMove = e.touches[0].pageX;
|
|
139
140
|
moveToCol.getElement().parentNode.insertBefore(this.placeholderElement, moveToCol.getElement());
|
|
@@ -141,7 +142,7 @@ class MoveColumns extends Module{
|
|
|
141
142
|
}
|
|
142
143
|
}
|
|
143
144
|
}
|
|
144
|
-
|
|
145
|
+
|
|
145
146
|
if(moveToCol){
|
|
146
147
|
currentCol = moveToCol;
|
|
147
148
|
nextCol = moveToCol.nextColumn();
|
|
@@ -153,7 +154,7 @@ class MoveColumns extends Module{
|
|
|
153
154
|
}
|
|
154
155
|
}
|
|
155
156
|
}, {passive: true});
|
|
156
|
-
|
|
157
|
+
|
|
157
158
|
colEl.addEventListener("touchend", (e) => {
|
|
158
159
|
if(this.checkTimeout){
|
|
159
160
|
clearTimeout(this.checkTimeout);
|
|
@@ -163,43 +164,43 @@ class MoveColumns extends Module{
|
|
|
163
164
|
}
|
|
164
165
|
});
|
|
165
166
|
}
|
|
166
|
-
|
|
167
|
+
|
|
167
168
|
startMove(e, column){
|
|
168
169
|
var element = column.getElement(),
|
|
169
170
|
headerElement = this.table.columnManager.getElement(),
|
|
170
171
|
headersElement = this.table.columnManager.getHeadersElement();
|
|
171
|
-
|
|
172
|
+
|
|
172
173
|
this.moving = column;
|
|
173
174
|
this.startX = (this.touchMove ? e.touches[0].pageX : e.pageX) - Helpers.elOffset(element).left;
|
|
174
|
-
|
|
175
|
+
|
|
175
176
|
this.table.element.classList.add("tabulator-block-select");
|
|
176
|
-
|
|
177
|
+
|
|
177
178
|
//create placeholder
|
|
178
179
|
this.placeholderElement.style.width = column.getWidth() + "px";
|
|
179
180
|
this.placeholderElement.style.height = column.getHeight() + "px";
|
|
180
|
-
|
|
181
|
+
|
|
181
182
|
element.parentNode.insertBefore(this.placeholderElement, element);
|
|
182
183
|
element.parentNode.removeChild(element);
|
|
183
|
-
|
|
184
|
+
|
|
184
185
|
//create hover element
|
|
185
186
|
this.hoverElement = element.cloneNode(true);
|
|
186
187
|
this.hoverElement.classList.add("tabulator-moving");
|
|
187
|
-
|
|
188
|
+
|
|
188
189
|
this.table.columnManager.getElement().appendChild(this.hoverElement);
|
|
189
|
-
|
|
190
|
+
|
|
190
191
|
this.hoverElement.style.left = "0";
|
|
191
192
|
this.hoverElement.style.bottom = (headerElement.clientHeight - headersElement.offsetHeight) + "px";
|
|
192
|
-
|
|
193
|
+
|
|
193
194
|
if(!this.touchMove){
|
|
194
195
|
this._bindMouseMove();
|
|
195
|
-
|
|
196
|
+
|
|
196
197
|
document.body.addEventListener("mousemove", this.moveHover);
|
|
197
198
|
document.body.addEventListener("mouseup", this.endMove);
|
|
198
199
|
}
|
|
199
|
-
|
|
200
|
+
|
|
200
201
|
this.moveHover(e);
|
|
201
202
|
}
|
|
202
|
-
|
|
203
|
+
|
|
203
204
|
_bindMouseMove(){
|
|
204
205
|
this.table.columnManager.columnsByIndex.forEach(function(column){
|
|
205
206
|
if(column.modules.moveColumn.mousemove){
|
|
@@ -207,7 +208,7 @@ class MoveColumns extends Module{
|
|
|
207
208
|
}
|
|
208
209
|
});
|
|
209
210
|
}
|
|
210
|
-
|
|
211
|
+
|
|
211
212
|
_unbindMouseMove(){
|
|
212
213
|
this.table.columnManager.columnsByIndex.forEach(function(column){
|
|
213
214
|
if(column.modules.moveColumn.mousemove){
|
|
@@ -215,17 +216,17 @@ class MoveColumns extends Module{
|
|
|
215
216
|
}
|
|
216
217
|
});
|
|
217
218
|
}
|
|
218
|
-
|
|
219
|
+
|
|
219
220
|
moveColumn(column, after){
|
|
220
221
|
var movingCells = this.moving.getCells();
|
|
221
|
-
|
|
222
|
+
|
|
222
223
|
this.toCol = column;
|
|
223
224
|
this.toColAfter = after;
|
|
224
|
-
|
|
225
|
+
|
|
225
226
|
if(after){
|
|
226
227
|
column.getCells().forEach(function(cell, i){
|
|
227
228
|
var cellEl = cell.getElement(true);
|
|
228
|
-
|
|
229
|
+
|
|
229
230
|
if(cellEl.parentNode && movingCells[i]){
|
|
230
231
|
cellEl.parentNode.insertBefore(movingCells[i].getElement(), cellEl.nextSibling);
|
|
231
232
|
}
|
|
@@ -233,47 +234,47 @@ class MoveColumns extends Module{
|
|
|
233
234
|
}else{
|
|
234
235
|
column.getCells().forEach(function(cell, i){
|
|
235
236
|
var cellEl = cell.getElement(true);
|
|
236
|
-
|
|
237
|
+
|
|
237
238
|
if(cellEl.parentNode && movingCells[i]){
|
|
238
239
|
cellEl.parentNode.insertBefore(movingCells[i].getElement(), cellEl);
|
|
239
240
|
}
|
|
240
241
|
});
|
|
241
242
|
}
|
|
242
243
|
}
|
|
243
|
-
|
|
244
|
+
|
|
244
245
|
endMove(e){
|
|
245
246
|
if(e.which === 1 || this.touchMove){
|
|
246
247
|
this._unbindMouseMove();
|
|
247
|
-
|
|
248
|
+
|
|
248
249
|
this.placeholderElement.parentNode.insertBefore(this.moving.getElement(), this.placeholderElement.nextSibling);
|
|
249
250
|
this.placeholderElement.parentNode.removeChild(this.placeholderElement);
|
|
250
251
|
this.hoverElement.parentNode.removeChild(this.hoverElement);
|
|
251
|
-
|
|
252
|
+
|
|
252
253
|
this.table.element.classList.remove("tabulator-block-select");
|
|
253
|
-
|
|
254
|
+
|
|
254
255
|
if(this.toCol){
|
|
255
256
|
this.table.columnManager.moveColumnActual(this.moving, this.toCol, this.toColAfter);
|
|
256
257
|
}
|
|
257
|
-
|
|
258
|
+
|
|
258
259
|
this.moving = false;
|
|
259
260
|
this.toCol = false;
|
|
260
261
|
this.toColAfter = false;
|
|
261
|
-
|
|
262
|
+
|
|
262
263
|
if(!this.touchMove){
|
|
263
264
|
document.body.removeEventListener("mousemove", this.moveHover);
|
|
264
265
|
document.body.removeEventListener("mouseup", this.endMove);
|
|
265
266
|
}
|
|
266
267
|
}
|
|
267
268
|
}
|
|
268
|
-
|
|
269
|
+
|
|
269
270
|
moveHover(e){
|
|
270
271
|
var columnHolder = this.table.columnManager.getElement(),
|
|
271
272
|
scrollLeft = columnHolder.scrollLeft,
|
|
272
273
|
xPos = ((this.touchMove ? e.touches[0].pageX : e.pageX) - Helpers.elOffset(columnHolder).left) + scrollLeft,
|
|
273
274
|
scrollPos;
|
|
274
|
-
|
|
275
|
+
|
|
275
276
|
this.hoverElement.style.left = (xPos - this.startX) + "px";
|
|
276
|
-
|
|
277
|
+
|
|
277
278
|
if(xPos - scrollLeft < this.autoScrollMargin){
|
|
278
279
|
if(!this.autoScrollTimeout){
|
|
279
280
|
this.autoScrollTimeout = setTimeout(() => {
|
|
@@ -283,7 +284,7 @@ class MoveColumns extends Module{
|
|
|
283
284
|
}, 1);
|
|
284
285
|
}
|
|
285
286
|
}
|
|
286
|
-
|
|
287
|
+
|
|
287
288
|
if(scrollLeft + columnHolder.clientWidth - xPos < this.autoScrollMargin){
|
|
288
289
|
if(!this.autoScrollTimeout){
|
|
289
290
|
this.autoScrollTimeout = setTimeout(() => {
|
|
@@ -322,6 +322,8 @@ class MoveRows extends Module{
|
|
|
322
322
|
document.body.addEventListener("mousemove", this.moveHover);
|
|
323
323
|
document.body.addEventListener("mouseup", this.endMove);
|
|
324
324
|
|
|
325
|
+
this.dispatchExternal("rowMoving", row.getComponent());
|
|
326
|
+
|
|
325
327
|
this.moveHover(e);
|
|
326
328
|
}
|
|
327
329
|
|
|
@@ -356,6 +358,8 @@ class MoveRows extends Module{
|
|
|
356
358
|
|
|
357
359
|
if(this.toRow){
|
|
358
360
|
this.table.rowManager.moveRow(this.moving, this.toRow, this.toRowAfter);
|
|
361
|
+
}else{
|
|
362
|
+
this.dispatchExternal("rowMoveCancelled", this.moving.getComponent());
|
|
359
363
|
}
|
|
360
364
|
|
|
361
365
|
this.moving = false;
|